Hi there,
Thanks for your continued help on this. So close… but neither of these snippets or putting it into Enfold Child> style.css worked. And now the Reserve Now button which had been working on the smartphone, is no longer appearing at all.
I hate to do this (because it gets so long) but I’ve pasted all my code in the style.css below. Can you see anything wrong, conflicting or have any ideas on what to do next? Thanks again, Lynn

/*
Theme Name: Enfold Child
Description: A Child Theme for the Enfold WordPress Theme. If you plan to do a lot of file modifications we recommend to use this Theme instead of the original Theme. Updating wil be much easier then.
Version: 1.0
Author: Kriesi
Author URI: http://kriesi.at
Template: enfold
*/

/*Add your own styles here:*/
/* Hide layerslider on Smartphones and protrait Tablets */
@media only screen and (max-width: 768px) {
.avia-layerslider { display: none; }}
/* Place Reserve now on tablets */
@media only screen and (max-width: 989px) and (min-width: 768px) {
.header_color .header-button a { left: -40%!important; }}
/* Add Reserve Now button to Header-added code to header.php*/
.header-button {
position: absolute;
border: none;
top: 0;
left: 255px;
right: 180px;
}
.header_color .header-button a {
display: block;
padding: 2px 5px 10px 12px;
font-size: 22px;
text-align:justify;
font-weight: bold;
float: left;
color: #f8d699;
border-radius:0px 0px 15px 15px;
}
.header-button a.header-chat { background-color: #985e06; left center no-repeat; }
.header-button a.header-chat {link: href=”http://reservation.worldweb.com/hotel/1227″ target=”_blank” }
}
/* Remove from home page only (right side)#, */
.breadcrumbs { display: none; }
.page-id-2 .entry-title { display: none; }
.sub_menu {
right: 175px !important;
}
/* Added TripAdvisor to ‘register-admin-options.php’ file, then to child functions.php Moves social icons to right of page */
#top .social_bookmarks li {
float: right !important;
}
/*Dropdown menu on top of LayerSlider*/
.container_wrap, #header_main { z-index: 1; }
/* Sizes/styles phone#, */
#top .social_bookmarks li a { font-size: 18px; }
.social_header .phone-info span {
font-size: 18px;
color: #f8d699;
font-style: italic;
padding-right: 28px;}
}
/* Change color of header social fonts*/
.header_color .social_bookmarks a { color: #f8d699; }
/*size main menu font*/
#avia-menu a {
font-size: 17px !important;
}
/* Color hover of TripAdvisor*/
#top .social_bookmarks_tripadvisor:hover a {
color:#fff;
background-color: #29A959!important;
}
/* Color main menu dropdown font*/
#top .main_menu .menu li ul a {
color: #f8d699 !important;
opacity: .7;
}
.header_color .main_menu ul:first-child > li > a { color: #f8d699; }
.slide-meta {display: none;}
.blog-categories.minor-meta {display: none;}
.text-sep.text-sep-cat {display: none;}
.header-buttons {
position: absolute;
right: 0;
border: none;
}
/* Get Reserve Now button on iPhone*/
@media only screen and (max-width: 480px) {
.header-button {
position:absolute;
top:90px;
left:30px;
right:20px;
}
}
/*Dropdown menu on top of LayerSlider*/
.container_wrap { z-index: 1;
}
/* Sidebar styling -latest portfolio widget*/
#portfoliobox-2 .news-headline {
font-size: 16px !important;
}
#portfoliobox-2 .news-excerpt {
font-size: 12px !important;
}
.image_size_widget .news-thumb {
height: 50px;
width: 50px;
}
.image_size_widget .news-thumb img {
width: 46px;
height: 46px;
}
}
add_theme_support(‘avia_template_builder_custom_css’);

Absolutely perfect! Many thanks!

Devin:
You guys are absolutely fantastic at how fast you respond to inquiries!
Your code worked perfectly! Many thanks.
Now I need a little more help.
Can you look at the following screenshot and tell me if you can help me make the changes shown?
http://prntscr.com/2q1cv1
Thank you,
Dan

Here is the link: http://chattanoogadentistfinder.com

And I put that code in the enfold quick css area and it didn’t work, so I even upped the font size that was in the code-and still nothing…?

Thanks for the response.
I tried the code below but there was no change.

#menu a{
color:#ffffff;
font-size:13px;
font-family: ‘Oswald’, arial, sans-serif;
text-decoration:none;
word-wrap:break-word;
}

#menu ul {
list-style-type:none;
}

#menu{
height:15px;
width:680px;
float:right;
}
#menu ul{
margin-left:0px;
padding:0px;
position:absolute;
line-height:50px;
z-index:500;
}
#menu ul a{
float:left;
display:block;
padding:5px 20px 5px 20px;
line-height:35px;
z-index:500;
margin-top:-5px;
}
#menu ul li{
float:left;
position:relative;
padding-bottom:0px;
z-index:20;
margin-left:20px;
margin-right:20px;
}
#menu ul ul{
display:none;
margin:0px 0px 0px 0px;
top:40px;
left:0px;
width:160px;
}
#menu ul ul a{
margin:0px;
line-height:22px;
}
#menu ul li li{
margin:0px;
width:160px;
}
#menu ul ul ul{
top:auto;
padding-top:10px;
padding-bottom:10px;
}
#menu ul li ul a{
float:left;
width:120px;
}
#menu ul li ul ul{
top:0px;
left:162px;
}
#menu ul li:hover ul ul, #menu ul li:hover ul ul ul, #menu ul li:hover ul ul ul ul { display:none; }
#menu ul li:hover ul, #menu ul li li:hover ul, #menu ul li li li:hover ul, #menu ul li li li li:hover ul { display:block; }

got it, thanks!

can I change the background color for mobile sizes with that as well?