/* ________________________________________________________________________________________________________________ GLOBAL STRUCTURE ________________________________________________________________________________________________________________ */ /* ________________________________________________________________________________________________________________ TYPOGRAPHY ________________________________________________________________________________________________________________ */ body { font-size: 16px; font-family: 'trebuchet MS', 'arial', sans-serif; } /* ------- Links ------- */ p a, a:hover, .webtreats_subnav_widget li.current_page_item a, .commentmetadata a, .blog_meta a, .contact_widget_email,.fancy_link,.download_link,.email_link,.toggle {color:#b4b4b4;} h1,h2,h3,h4,h5 { font-family: "trebuchet MS", "arial", sans-serif;} /* ------- Misc ------- */ p, ul, ol, dl, pre, table, fieldset, blockquote, code { margin-bottom: 20px; } p:empty{ height: 0; margin: 0; padding: 0; } /* Hide any p spacing for wordpress auto-p inserts */ blockquote, .bullet_list, h5, .rss-date, .date, .awaiting_moderation, .dropcap4{color:#b4b4b4;} .inputError{border-color:#b4b4b4 !important;} .fancy_header span{background-color:#b4b4b4;} /* ------- Footer ------- */ #footer{color:#ddd;} #footer a{color:#e0e0e0;} #footer a:hover{color:#fff;} .footer_widgettitle{color:#fff;} .partial_gradient_slide h2{color:#666;} .partial_gradient_slide .slider_content{color:#787878;} /* ------- Buttons ------- */ input[type=button],input[type=reset],input[type=submit],.fancy_button, .fancy_button span, .button_link,.button_link span, h6.color_scheme_box_header, h6.color_scheme_box_header span{ background-image:url(synusa2/button_sprite.png);} /* ________________________________________________________________________________________________________________ ICONS ________________________________________________________________________________________________________________ */ /* ________________________________________________________________________________________________________________ MENU ________________________________________________________________________________________________________________ */ .menu { padding-left: 0; } .menu li { display: inline-block; line-height:60px; list-style-type: none; padding: 0 2px; text-align: center;} .menu li a, .menu li a:link, .menu li a:visited { display: block; font-size: 13px; line-height:60px; height: 42px; padding: 0 16px; color:#777; text-decoration: none; text-shadow:0 1px 1px #ccc;} .menu li a:hover, .menu li:hover a { background: /*url(synusa2/menu_hover.png)*/ no-repeat scroll center -5px transparent; color:#444; text-decoration: none;} #main_menu .menu-main-container { min-height: 42px; position: relative; top: 0 } #menu_search { display: none; } #navigation { display: block; height: 42px; margin-bottom: -42px;} /* Top Level Items */ .menu-container, .menu-jms-container, .menu-rjw-container { text-align: center; width: 100%; } .menu { display: table; margin: 0 auto; } .menu li { background: transparent url(synusa3/navDivider.png) no-repeat scroll left center; padding-left: 2px;} .menu li:first-child { background: transparent none; padding-left: 0px;} .menu li a, .menu li a:link, .menu li a:visited { color: #666; height: 42px; line-height: 42px; transition: background 0.2s; -moz-transition: background 0.2s; -webkit-transition: background 0.2s; -o-transition: background 0.2s;} .menu li a:hover, .menu li a:focus, .menu li a:active { background: #E3E3E3; color: #4C4C4C;} /* Dropdown Items */ .menu ul li a, .menu ul li a:link, .menu ul li a:visited { color: #4C4C4C; height: 15px; line-height: 15px !important; text-shadow: 0 3px 5px rgba(0,0,0,0.4); } .menu ul li a:hover, .menu ul li a:focus, .menu ul li a:active { background: transparent url(synusa3/navHover-bg.png) repeat-x scroll center left; color: #fff; text-shadow: 0 3px 5px rgba(0,0,0,0.4) } #menu-main, #menu-rjw-menu, #menu-jms-menu { text-align: center; } /* Top Level Items */ #header_subNavigation { display: block; margin: 0; padding: 0; position: absolute; right: -10px; text-align: center; top: 10px; width: auto; } #header_subNavigation li { border-left: 1px solid #555; display: block; margin: auto; list-style-type: none; margin: 0; padding: 0; position: aboslute;} #header_subNavigation li:first-child { border-left: none;} #header_subNavigation li a, #header_subNavigation li a:link, #header_subNavigation li a:visited { color: #555; display: block; font-size: 11px; line-height: 16px; padding: 0 10px; text-decoration: none; transition: background 0.2s; -moz-transition: background 0.2s; -webkit-transition: background 0.2s; -o-transition: background 0.2s; } #header_subNavigation li a:hover, #header_subNavigation li a:focus, #header_subNavigation li a:active { background: #C00; color: #fff; } ul#department-nav { clear: both; } ul#department-nav li { margin: auto; margin-right: 25px; } ul#department-nav a:hover, ul#department-nav a:focus, ul#department-nav a:active { color: #333;} /* Overwrite Bootstrap Menu Issues */ .navbar { } .navbar a { text-decoration: none; } .navbar-default { background-color: transparent; border-bottom: 1px solid #e0e0e0; } .navbar-default .navbar-toggle { background: #F7F7F7; border-color: #d0d0d0; } .navbar-collapse { border-top: 1px solid #e0e0e0; } .navbar-default .menu li a:hover, .navbar-default .menu li a:focus, .navbar-default .menu li a:active { background: #E0E0E0; } @media (min-width: 768px) { .navbar-collapse .navbar-nav { float: none; } .navbar-collapse .navbar-nav>li { float: none; } } @media (max-width: 768px) { .navbar-collapse .menu { margin: auto; width: 100%; } .navbar-collapse .menu li { display: block; background: transparent; border-top: 1px solid #e0e0e0; text-align: left; width: auto; } .navbar-collapse .menu li:first-child { border-top: 0px transparent; } .navbar-collapse .menu li a { font-size: 15px; } #mega-menu-wrap-primary-menu #mega-menu-primary-menu li#mega-menu-item-15404.mega-menu-megamenu ul.mega-sub-menu li.mega-2-columns > ul.mega-sub-menu > li.mega-menu-item, #mega-menu-wrap-primary-menu #mega-menu-primary-menu li#mega-menu-item-15404.mega-menu-megamenu ul.mega-sub-menu li.mega-4-columns > ul.mega-sub-menu > li.mega-menu-item { width: 50%; } } @media (max-width: 500px) { #mega-menu-wrap-primary-menu #mega-menu-primary-menu li#mega-menu-item-15404.mega-menu-megamenu ul.mega-sub-menu li.mega-2-columns > ul.mega-sub-menu > li.mega-menu-item, #mega-menu-wrap-primary-menu #mega-menu-primary-menu li#mega-menu-item-15404.mega-menu-megamenu ul.mega-sub-menu li.mega-4-columns > ul.mega-sub-menu > li.mega-menu-item { width: 100%; float: none; } } /* ________________________________________________________________________________________________________________ SYNUSA STYLES ________________________________________________________________________________________________________________ */ body { background: #D5D5D5; position: relative; padding-top: 0px; } .body_background { background: #f0f0f0; margin: 0 auto; padding: 0; position: relative; width: auto; } .minimal #body_block_background { background-color: transparent; } body, textarea { color: #4C4C4C; letter-spacing: 0.4px; } /* * Basic Text Styles */ h1, h2, h3, h4, h5 { font-family: "trebuchet MS", "arial", sans-serif; margin: 0;padding: 0; vertical-align: baseline;} h1 { font-size: 40px; line-height: 1em; } h2 { font-size: 30px; line-height: 33px; } h3 { font-size: 25px; line-height: 28px; } h4 { font-size: 14px; font-weight: bold; } h5 { font-size: 12px; font-weight: bold; } @media screen and (max-width: 500px) { /* Responsive Headers */ h1 { font-size: 25px; line-height: 1em; } h2 { font-size: 21px; line-height: 25px; } h3 { font-size: 16px; line-height: 18px; } } /* Special Header Sizes/Styles */ .specialHeader { color: #151515; font-size: 27px; line-height: 55px; font-weight: bold; position: relative; text-align: center; text-shadow: 0 2px 3px rgba(0, 0, 0, 0.4);} .big { font-size: 1.3em; } .bigger { font-size: 1.7em; } .biggest { font-size: 2em; } .small { font-size: 0.88em; } .smaller { font-size: 0.75em; } .smallest { font-size: 0.5em; } @media only screen and (max-width: 768px) { /* Special Header Responsive */ .specialHeader img { display: none; line-height: 1em;} .specialHeader .big { font-size: 1.1em; } .specialHeader .bigger { font-size: 1.35em; } .specialHeader .biggest { font-size: 1.6em; } } .bold { font-weight: bold; } .center { text-align: center; margin-left: auto; margin-right: auto; } .uppercase { text-transform: uppercase; } .underline { background: transparent url(synusa3/underline.png) no-repeat scroll center bottom; padding-bottom: 20px; } .introtext { color: #666666; font-size: 19px; line-height: 1.8em; text-align: left; } .grayBox { background: #DCDCDC; padding: 7px 12px; overflow: auto; -webkit-border-radius: 15px;-moz-border-radius: 15px;border-radius: 15px; } .hiddenText, .hiddenText:link, .hiddenText :visited { font-size: 0.001%; text-indent: -999em; overflow: hidden; text-decoration: none; } .logged-in .pending {color: #933; border-bottom: 1px dashed #933; } .logged-in .pending.featureFlag { color: #C33; border: 1px solid #C33; } a, a:link, a:visited { color: #21538d; font-weight: bold; text-decoration: underline; } a:hover, a:active, a:focus { color: #21538d; font-weight: bold; text-decoration: none; } p a:hover { text-decoration: none; } .red, .red:link, .red:visited, .red:hover, .red:active, .red:focus { color: #e30008;} .blue, .blue:link, .blue:visited, .blue:hover, .blue:active, .blue:focus { color: #0057a3; } .green, .green:link, .green:visited, .green:hover, .green:active, .green:focus { color: #1aaa03; } .gray, .gray:link, .gray:visited, .gray:hover, .gray:active, .gray:focus { color: #999999; } .checkmarks { list-style-type: none; margin: 0 0 1em; overflow: auto; text-align: left; } .checkmarks > li { background: transparent url(synusa3/checkGreen16.png) no-repeat scroll left top; font-size: 1.18em; line-height: 1.18em; margin:0 0 0.5em; padding-left: 23px; } .checkmarks .unchecked { background-image: none; } .checkmarks.right { float: none; } .checkmarks.right > li { background-position:right top; padding-left: 0px; padding-right: 20px; } .checkmarks li.checkedText { background-image: none; padding-right: 0; } .checkmarks .checkedText .check { float: right; } .unchecked{ } .checkmarks.twocol > li { margin: auto; width: 45%; padding-left: 5%; } .checkmarks.twocol.right > li { padding-right: 5%;} .checkmarks ul, .checkmarks ol { margin-left: 45px; } hr { background-color: #ddd !important;} #header, #body_block, #footer, #sub_footer { /* padding-left: 5px; padding-right:5px; width: 955px; */ } .inner { position: relative; } .featureFlag { position: relative; height: 0px; } .featureFlag strong, .featureFlag small { background: transparent url('/wp-content/themes/awake/styles/synusa4/featureFlag.png') no-repeat scroll top center; color: #4e3800; font-size: 9px; font-weight: bold; line-height: 11px; text-transform: uppercase; padding: 6px 2px 2px; width: 48px; height: 42px; position: absolute; top: 4px; left: 50%; margin-left: -50%;} .featureFlag strong, .featureFlag small { transform:rotate(-20deg); -ms-transform:rotate(-20deg); /* IE 9 */ -webkit-transform:rotate(-20deg); /* Opera, Chrome, and Safari */} .featureFlag small { font-size: 7px; } .featureFlag strong { font-size: 11px; } @media (min-width: 1200px) { .featureFlag strong, .featureFlag small { margin-left: -47%; } } @media (max-width: 1199px) { .featureFlag strong, .featureFlag small { margin-left: -30%; } } @media (max-width: 767px) { .featureFlag strong, .featureFlag small{ } } @media (max-width: 500px) { .featureFlag strong, .featureFlag small{ margin-left: -47%; } } /* ________________________________________________________________________________________________________________ HEADER ________________________________________________________________________________________________________________ */ #dealerHeaderAd { background: #e6e6e6 url('synusa3/edge-bottom-light.png') repeat-x scroll bottom left; width:100%; text-align:center; padding-bottom:8px;} #dealerHeaderAd .inner { background: transparent url('synusa3/edge-top-dark.png') repeat-x scroll top left; width:100%; text-align:justify; padding-top:10px;} #dealerHeaderAd .constraint { display: table; max-width: 960px; margin: 0 auto; padding: 7px 0 10px; text-align: center;} #dealerHeaderAdImage, #dealerHeaderAdMessage, #dealerHeaderAdCallout { display: table-cell; vertical-align: middle; font-size: 14px; line-height: 16px; font-weight: bold; } #dealerHeaderAdImage { padding-right: 20px; width: 170px; } #dealerHeaderAdMessage { padding-right: 20px; } #dealerHeaderAdCallout { padding: 0 22px 0 20px; position: relative; text-align: center; width: 120px;} #dealerHeaderAd h3 { font-size: 14px; font-weight: bold; line-height: 16px; } #header { background: transparent !important; height: auto; z-index: 99; } #header .inner { background: transparent; margin: 0 auto; position: relative; max-width: 970px; z-index:1; } #header #logo { background: transparent url(synusa3/logo.png) no-repeat scroll top left !important; height: 82px; left: 10px; top: 25px; width: 207px; } #header #logo a{ display: block; height:82px; width: 207px; } #header #logo #logoText{ display: none; } /* #header .dealerClass { height: 10px; left: 100px; position: absolute; top: 71px; width: 110px; } */ /* #header .dealerClass.directJobber { background: transparent url(synusa2/dealerClass-directJobber.png) no-repeat scroll left center; } */ #header .inner font strong{ display: none; } #header .header_logo { position: absolute; left: 0%; top: 80px; width: 255px; text-align: center;} #header .header_contact { color: #999; font-size: 12px; font-weight: bold; position: absolute; right: 0%; top: 80px; width: 255px; text-align: center; } .header-login { font-size: 17px; } .header-login a { text-decoration: none; color: #005aab; } #accountAccess { display: block; position: absolute; right: 10px; top: -33px; } #accountAccess a, #accountAccess a:link, #accountAccess a:visited { color: #DDD; text-decoration: none; } #accountAccess a:hover, #accountAccess a:active, #accountAccess a:focus { color: #999; text-decoration: underline; } #amsoil-header { min-height: 65px; z-index: 1; } #amsoil-header > a > div > div { /* width: 960px; */ } .headerTagline { text-align: center; position: relative; right: 60px; } .headerTagline h3 { font-family: Arial; font-size: 15px; color: #fcb338; font-weight: bolder; line-height: 38px} /* ________________________________________________________________________________________________________________ COLUMNS ________________________________________________________________________________________________________________ */ .columns { clear: both; overflow: visible; } .col { float: left;} .three-col .col { width: 32%; margin-right: 2%; position: relative; } .three-col .col.three { margin-right: 0;} .two-col .col { width: 48%; margin-right: 4%; position: relative; } .two-col .col.two { margin-right: 0;} /* ________________________________________________________________________________________________________________ BUTTONS ________________________________________________________________________________________________________________ */ .v3button, .v3button:link, .v3button:visited { display: inline-block; border: 1px solid #bbb; color: #fff; min-width: 184px; padding: 5px 8px; text-align: center; text-decoration: none; } .v3button { /* CSS3 Button Styles */ background: #a5a5a5; /* Old browsers */ /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2MyYzJjMiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNhNWE1YTUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, #c2c2c2 0%, #999999 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#c2c2c2), color-stop(100%,#999999)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #c2c2c2 0%,#999999 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #c2c2c2 0%,#999999 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #c2c2c2 0%,#999999 100%); /* IE10+ */ background: linear-gradient(to bottom, #c2c2c2 0%,#999999 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c2c2c2', endColorstr='#999999',GradientType=0 ); /* IE6-8 */ -moz-border-radius: 16px; -webkit-border-radius: 16px; border-radius: 16px; -moz-text-shadow: 0 2px 3px rgba(0,0,0,0.15); -webkit-text-shadow: 0 2px 3px rgba(0,0,0,0.15); text-shadow: 0 2px 3px rgba(0,0,0,0.15); -moz-box-shadow: 0 2px 3px rgba(0,0,0,0.15); -webkit-box-shadow: 0 2px 3px rgba(0,0,0,0.15); box-shadow: 0 2px 3px rgba(0,0,0,0.15); } .v3button:hover, .v3button:active, .v3button:focus { color: #fff; text-decoration: none; background: #cecece; /* Old browsers */ /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2NlY2VjZSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNiMGIwYjAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, #cecece 0%, #b0b0b0 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#cecece), color-stop(100%,#b0b0b0)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #cecece 0%,#b0b0b0 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #cecece 0%,#b0b0b0 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #cecece 0%,#b0b0b0 100%); /* IE10+ */ background: linear-gradient(to bottom, #cecece 0%,#b0b0b0 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cecece', endColorstr='#b0b0b0',GradientType=0 ); /* IE6-8 */ } .v3button.white, .v3button.white:link, .v3button.white:visited { /* CSS3 Button Styles */ background: #ffffff; /* Old browsers */ /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNkZGRkZGQiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, #ffffff 0%, #dddddd 100%); /* FF3.6-15 */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#dddddd)); /* Chrome4-9,Safari4-5 */ background: -webkit-linear-gradient(top, #ffffff 0%,#dddddd 100%); /* Chrome10-25,Safari5.1-6 */ background: -o-linear-gradient(top, #ffffff 0%,#dddddd 100%); /* Opera 11.10-11.50 */ background: -ms-linear-gradient(top, #ffffff 0%,#dddddd 100%); /* IE10 preview */ background: linear-gradient(to bottom, #ffffff 0%,#dddddd 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#dddddd',GradientType=0 ); /* IE6-8 */ border: 1px solid #D5d5d5; } .v3button.white:hover, .v3button.white:active, .v3button.white:focus { /* CSS3 Button Styles */ background: #f7f7f7; /* Old browsers */ /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2Y3ZjdmNyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNkNmQ2ZDYiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, #f7f7f7 0%, #d6d6d6 100%); /* FF3.6-15 */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f7f7f7), color-stop(100%,#d6d6d6)); /* Chrome4-9,Safari4-5 */ background: -webkit-linear-gradient(top, #f7f7f7 0%,#d6d6d6 100%); /* Chrome10-25,Safari5.1-6 */ background: -o-linear-gradient(top, #f7f7f7 0%,#d6d6d6 100%); /* Opera 11.10-11.50 */ background: -ms-linear-gradient(top, #f7f7f7 0%,#d6d6d6 100%); /* IE10 preview */ background: linear-gradient(to bottom, #f7f7f7 0%,#d6d6d6 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7f7f7', endColorstr='#d6d6d6',GradientType=0 ); /* IE6-8 */ } .v3button.red, .v3button.red:link, .v3button.red:visited { /* CSS3 Button Styles */ background: #cf2127; /* Old browsers */ /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2NmMjEyNyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNhZjAxMDciIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, #cf2127 0%, #af0107 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#cf2127), color-stop(100%,#af0107)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #cf2127 0%,#af0107 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #cf2127 0%,#af0107 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #cf2127 0%,#af0107 100%); /* IE10+ */ background: linear-gradient(to bottom, #cf2127 0%,#af0107 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cf2127', endColorstr='#af0107',GradientType=0 ); /* IE6-8 */ } .v3button.red:hover, .v3button.red:active, .v3button.red:focus { /* CSS3 Button Styles */ background: #e8252c; /* Old browsers */ /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2U4MjUyYyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNjOTAyMDkiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, #e8252c 0%, #c90209 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e8252c), color-stop(100%,#c90209)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #e8252c 0%,#c90209 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #e8252c 0%,#c90209 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #e8252c 0%,#c90209 100%); /* IE10+ */ background: linear-gradient(to bottom, #e8252c 0%,#c90209 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e8252c', endColorstr='#c90209',GradientType=0 ); /* IE6-8 */ } .v3button.blue, .v3button.blue:link, .v3button.blue:visited { /* CSS3 Button Styles */ background: #21538d; /* Old browsers */ /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzIxNTM4ZCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMTMyNmMiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, #21538d 0%, #01326c 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#21538d), color-stop(100%,#01326c)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #21538d 0%,#01326c 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #21538d 0%,#01326c 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #21538d 0%,#01326c 100%); /* IE10+ */ background: linear-gradient(to bottom, #21538d 0%,#01326c 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#21538d', endColorstr='#01326c',GradientType=0 ); /* IE6-8 */ } .v3button.blue:hover, .v3button.blue:active, .v3button.blue:focus { /* CSS3 Button Styles */ background: #2768ad; /* Old browsers */ /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzI3NjhhZCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMTQxOGYiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, #2768ad 0%, #01418f 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#2768ad), color-stop(100%,#01418f)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #2768ad 0%,#01418f 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #2768ad 0%,#01418f 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #2768ad 0%,#01418f 100%); /* IE10+ */ background: linear-gradient(to bottom, #2768ad 0%,#01418f 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2768ad', endColorstr='#01418f',GradientType=0 ); /* IE6-8 */ } .horizontalFeaturedButtons { text-align: center; margin-top: 15px; } .horizontalFeaturedButtons a { display: inline-block; } /* ________________________________________________________________________________________________________________ 10. MISC. BASIC FEATURES ________________________________________________________________________________________________________________ */ img { display: inline-block; max-width: 100%; height: auto; } #body_block { padding-top: 20px; z-index: 100; } #body_block .inner { padding-bottom: 1px; } #body_block_background { width: 100%; } @media only screen and (max-width: 500px) { #body_block { padding-top: 10px; } } .right_sidebar #main { float: none; width: auto; } .shadowbreak { clear: both; display: block; background: transparent url(synusa3/shadowbreak.png) no-repeat scroll center top !important; height: 43px; margin: 20px 0 10px; } .slideshow a { left: 0px !important; } #homepage-slideshow { display: block; height: 200px; margin-top: 4px; overflow: hidden; width: 640px; } #homepage-slideshow img { display: block; max-height: 200px; width: 640px; } .hover-gray { display: inline-block; padding: 5px 10px; } .hover-gray:hover, .hover-gray:active, .hover-gray:focus { background-color:#E3E3E3; background-color: rgba(0,0,0,0.09); border-radius:8px; -webkit-border-radius:8px; -moz-border-radius:8px; } .thumbnail a { display: block; text-decoration: none; padding: 10px; } .thumbnail .caption { display: block; color: #333; font-size: 14px; text-transform: uppercase; font-weight: bold; text-align: center; } .card-grid { display: flex; flex-wrap: wrap; } .card-grid .card { display: flex; } .card-grid .thumbnail { width: 100%; } .gray-word-divider { font-size: 36px; color: #ccc; text-transform: uppercase; font-weight: bold; text-align: center; } /* Product Lookup Tool */ .list-inline { margin:0; padding: 0; text-align:center;} .lookup-icons > li { margin:0; padding-right:10px; padding-left:10px} .lookup-icons > li p { margin-bottom:0; font-size:11px} .tab-pane { padding:20px 40px; text-align:center} .lookup-overlay { margin-top:-60px; z-index:5} .lookup-icons a { display: block; padding: 5px 0; } .lookup-icons a, .lookup-icons a:active, .lookup-icons a:visited { color:#666; text-decoration: none; font-size: 10px; } .lookup-icons li:hover { background-color:#E3E3E3; border-radius:8px; -webkit-border-radius:8px; -moz-border-radius:8px} .auto-look { margin: auto; width: 78px; height: 37px; background: url(synusa4/lookup-sprite.png) no-repeat left top } .motorcycle-look { margin: auto; width: 67px; height: 37px; background: url(synusa4/lookup-sprite.png) no-repeat left -38px } .atv-look { margin: auto; width: 61px; height: 37px; background: url(synusa4/lookup-sprite.png) no-repeat left -75px } .utv-look { margin: auto; width: 56px; height: 37px; background: url(synusa4/lookup-sprite.png) no-repeat left -112px } .snowmobile-look { margin: auto; width: 73px; height: 37px; background: url(synusa4/lookup-sprite.png) no-repeat left -150px } .marine-look { margin: auto; width: 73px; height: 37px; background: url(synusa4/lookup-sprite.png) no-repeat left -188px } .pwc-look { margin: auto; width: 73px; height: 37px; background: url(synusa4/lookup-sprite.png) no-repeat left -224px } .small-look { margin: auto; width: 64px; height: 37px; background: url(synusa4/lookup-sprite.png) no-repeat left -258px } .heavy-look { margin: auto; width: 78px; height: 48px; background: url(synusa4/lookup-sprite.png) no-repeat left -296px } /* ________________________________________________________________________________________________________________ Category grid used on product listings ________________________________________________________________________________________________________________ */ .category-grid {} .category-group { padding-top: 30px; margin-bottom: -30px; } .category-group:last-child { margin-bottom: 0px; } .category-grid h1, .category-grid h2 { margin-bottom: 15px; text-align: center; } .category-card { text-align: center; position: relative; margin-bottom: 20px; margin: 0px 5px 20px; padding: 20px; background: white; border-radius: 20px; border: 1px solid #DDD; box-shadow: 0 5px 5px rgba(0,0,0,0.2); } .category-card .card-link { color: inherit; text-decoration: none; } .category-card .card-link:before { content: " "; display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; } .category-card p:last-child { margin-bottom: 0; } /* .category-card .card-link:focus, .category-card .card-link:hover, .category-card .card-link:active { color: #21538d; text-decoration: underline; } */ .category-card img { width: auto; height: 205px; margin: 15px auto; } /* ________________________________________________________________________________________________________________ Bootstrap Styles ________________________________________________________________________________________________________________ */ .dropdown-menu > li > a { font-size: 16px; line-height: 40px; text-decoration: none; } /* ________________________________________________________________________________________________________________ SUBNAV PILL ________________________________________________________________________________________________________________ */ .subnav-pill { font-size: 18px; line-height: 3em; text-align: center; max-width: 800px; margin: 20px auto 30px; } .subnav-pill .items-row { width: auto; margin: auto; display: table; margin-bottom: 25px; border-radius: 15px; box-shadow: 0 1px 5px rgba(0, 0, 0, 0.2); /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#fff+1,f2f2f2+100 */ background: #fff; /* Old browsers */ background: -moz-linear-gradient(top, #fff 1%, #f2f2f2 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, #fff 1%, #f2f2f2 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, #fff 1%, #f2f2f2 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#fff', endColorstr='#f2f2f2', GradientType=0); /* IE6-9 */; } .subnav-pill .items-row .item { font-size: 18px; text-align: center; } @media (max-width: 480px) { .subnav-pill .items-row .item.col-xs-4 { width: 33.33333333%; } } .subnav-pill .items-row .item a { text-decoration: none; display: inline-block; padding: 0 12px; } .subnav-pill .items-row .item:first-of-type { border-top-left-radius: 10px; border-bottom-left-radius: 10px; } .subnav-pill .items-row .item:last-of-type { border-top-right-radius: 10px; border-bottom-right-radius: 10px; } .subnav-pill .items-row .item.selected { background-color: #1c95be; } .subnav-pill .items-row .item.selected a { color: white; } @media (min-width: 992px) { .subnav-pill .items-row .item { /* width: auto; */ } } @media (max-width: 991px) { .subnav-pill .items-row .item { border-top: 0; } .subnav-pill .items-row .item:first-of-type { border-bottom-left-radius: 0; } .subnav-pill .items-row .item:last-of-type { border-top-right-radius: 0; border-bottom-left-radius: 10px; } .subnav-pill .items-row .item:nth-child(3) { border-top-right-radius: 10px; } .subnav-pill .items-row .item:nth-child(6) { border-bottom-right-radius: 10px; } .subnav-pill .items-row .item:nth-child(4) { border-bottom-left-radius: 10px; } } @media (max-width: 480px) { .subnav-pill .items-row .item { font-size: 15px; padding: 6px 10px; } } /* ________________________________________________________________________________________________________________ BLOG ________________________________________________________________________________________________________________ */ .post { margin: 20px auto 30px; } .post .blog_header { margin-bottom: 10px; } .post .blog_meta { margin-bottom: 5px; } /* ________________________________________________________________________________________________________________ RESPONSIVE STYLES ________________________________________________________________________________________________________________ */ .center-xs li, .center-sm li, .center-md li, .center-lg li { text-align: left;} @media screen and (max-width: 768px) { /* Extra Small Size */ #main_menu { border-bottom: 1px solid #BBB; } .center-xs { display: block; text-align: center; margin-left: auto; margin-right: auto; } .float-right-xs { float: right; margin-left: 20px; } .float-left-xs { margin: auto; margin-right: 20px; } } @media screen and (min-width: 769px) and (max-width: 992px) { /* Small Size */ .center-sm { display: block; text-align: center; margin-left: auto; margin-right: auto; } .float-right-sm { float: right; margin-left: 20px; } .float-left-sm { margin: auto; margin-right: 20px; } } @media screen and (min-width: 993px) and (max-width: 1200px) { /* Medium Size */ .center-md { display: block; text-align: center; margin-left: auto; margin-right: auto; } .float-right-md { float: right; margin-left: 20px; } .float-left-md { margin: auto; margin-right: 20px; } } @media screen and (min-width: 1200px) { /* Large Size */ .center-lg { display: block; text-align: center; margin-left: auto; margin-right: auto; } .float-right-lg { float: right; margin-left: 20px; } .float-left-lg { margin: auto; margin-right: 20px; } } @media screen and (min-width: 993px) { .max-970 { max-width: 970px; } } @media screen and (max-width: 600px) { #wpadminbar { position: fixed !important; } } /* ________________________________________________________________________________________________________________ 11. DIALOGS ________________________________________________________________________________________________________________ */ .simpleDialog { display: none; background: white; left: 0; right: 0; margin: 0 auto; min-height: 200px; padding: 45px 20px; position: absolute; max-width: 730px; width: 90% } .simpleDialog { /* CSS3 styling for latest browsers */ -moz-box-shadow:0 5px 10px rgba(0,0,0,0.4);; -webkit-box-shadow: 0 5px 10px rgba(0,0,0,0.4); box-shadow: 0 5px 10px rgba(0,0,0,0.4); -webkit-border-radius: 15px;-moz-border-radius: 15px;border-radius: 15px;} .simpleDialog h1 { margin: 5px 0px 10px; } .simpleDialog .close { background-image:url(overlay/apple-close.png); position:absolute; right:0px; top:0px; cursor:pointer; height:27px; width:28px; } .simpleDialog .actionButtons { text-align: center; margin-top: 25px; } .simpleDialog .actionButtons .button { display: inline-block; margin: 0 10px; position: relative; } .simpleDialog .actionButtons .button .topOverlay {background: transparent url(synusa2/overlayContinueShopping.png) no-repeat scroll center center; position: absolute; left: 5px; top: 7px; height:37px; width: 190px; -moz-opacity:1.0 !important; filter:alpha(opacity=100) !important; opacity: 1 !important;} .simpleDialog .actionButtons .button .bottomOverlay {background: transparent url(synusa2/overlayBrowse.png) no-repeat scroll center center; position: absolute; right: 11px; bottom: 4px; height: 26px; width: 114px; -moz-opacity:1.0 !important; filter:alpha(opacity=100) !important; opacity: 1 !important; } /* #productOverlay { background: transparent url(overlay/white_582x331.png) no-repeat scroll center center; padding: 43px; width: 496px;} */ @media only screen and (max-width: 500px) { #productOverlay { padding: 15px; } } /* ________________________________________________________________________________________________________________ HOMEPAGE ________________________________________________________________________________________________________________ */ #homepageFeature, #homepageFeature2 { border-bottom: 1px solid #BBB; position: relative; } .homepageFeature { margin-bottom: 10px;} #homepageHeaderTitle { height: 100px; width: 530px; position: absolute; top: -95px; left: 50%; margin-left: -265px; text-align: center; } #homepageFeature h1, #homepageFeature h2, #homepageFeature h3 { text-align: center; line-height: 1em; } #homepageFeature .inner { min-height: 340px; overflow: visible; } #homepageFeature .checkmarks { margin: 1em auto 2em; max-width: 280px; padding: 0; } #homepageFeature .button { margin: 0 auto; } #homepageFeature #catalogButton { position: relative; top: -20px; } .homepageDealerAdLink { position: absolute; top: 0; right: 0; bottom:0; left: 0; font-size: 0.00em; text-indent: -999em; z-index: 101; } .homepageDealerAdLink , .homepageDealerAdLink:link , .homepageDealerAdLink:visited { text-decoration: none;} #homepageFeature .col { position: absolute; width: 255px; } #homepageFeature .col.one { left: 0; margin-top: -140px; text-align: center; top: 50%; z-index: 100; } #homepageFeature .col.two { margin: -240px 0 0 -305px; left: 50%; text-align: center; top: 50%; /* z-index: 10; */ width: 610px } #homepageFeature .col.three { margin-top: -140px; right: 0; text-align: center; top: 50%; z-index: 100; } /* #bottlesFeature { position: relative; top: -120px; } */ #homepageLearnMore, #homepageLearnMoreFloating { color: #999; display: block; bottom: 10px; margin: 0 auto; text-align: center; text-decoration: none; border-bottom: 1px solid #BBB; padding-bottom: 10px; position: relative; z-index: 10; } #homepageLearnMoreFloating { position: absolute; left: 0; right: 0; } #homepageLearnMore:hover, #homepageLearnMore:active, #homepageLearnMore:focus, #homepageLearnMoreFloating:hover, #homepageLearnMoreFloating:active, #homepageLearnMoreFloating:focus { color: #555; text-decoration: underline;} .homepageFeatureOverlay { display: block; position: absolute; height: 230px; top: 0px; left: 0px; right: 0px; } .homepageFreeCatalog { position: absolute; top: 361px; left: 50%; margin-left: -92px; z-index: 100; } .hero-title { font-size: 50px; font-weight: bold; color: #4c4c4c; text-align: center; } .hero-link { display: block; font-size: 25px; font-weight: bold; color: #005aab; text-align: center; text-decoration: none; } #homepageFeature1 .hero-title { font-size: 60px; font-weight: bold; color: #4c4c4c; text-align: center; } #homepageFeature1 .hero-link { display: block; font-size: 25px; font-weight: bold; color: #005aab; text-align: center; text-decoration: none; } @media screen and (max-width: 768px) { #amsoil-header > div { line-height: 30px !important; } .hero-title { font-size: 35px;} .hero-link { font-size: 17px; line-height: 25px;} #homepageFeature1 .hero-title { font-size: 35px;} #bottlesFeature { zoom: 0.6; } } @media screen and (max-width: 500px) { .hero-title {font-size: 27px;} #homepageFeature1 .hero-title {font-size: 27px;} #homepageFeature1 .hero-link { font-size: 17px; line-height: 25px;} #amsoil-header .dealerPhone { font-size: 15px; line-height: 25px; } .introtext { font-size: 17px; } } @media screen and (max-width: 350px) { .header-login { font-size: 13px; line-height: 13px; } .header-login a { font-weight: normal; } .introtext { font-size: 16px; } } /* ________________________________________________________________________________________________________________ PRODUCTS ________________________________________________________________________________________________________________ */ .products {} .products p { margin: auto; display: block; height: auto; margin-right: 17px; } .products p a, .products p a:visited { background: #f2f2f2; border: 1px solid #DFDFDF; clear: both; display: block; height: 187px; text-align: center; text-decoration: none; padding: 10px; width: 110px; -webkit-border-radius: 15px;-moz-border-radius: 15px;border-radius: 15px; } .products p a:hover, .products p a:focus, .products p a:active { background: #f2f2f2; border: 1px solid #ea0f1a; text-decoration: none; } .products p a img { margin: auto; } .productsNew {} .productsNew p { display: inline-block; height: auto; margin-right: 4px; margin-bottom: 0px; } .productsNew p a, .productsNew p a:visited { background: transparent; border: 0px none; clear: both; display: block; font-size: 0.001%; height: 187px; text-align: center; text-decoration: none; text-indent: -999em; padding: 10px; width: 200px; -webkit-border-radius: 15px;-moz-border-radius: 15px;border-radius: 15px; } .productsNew p a:hover, .productsNew p a:focus, .productsNew p a:active { background: transparent; border: 0px none; text-decoration: none; } .productsNew p a * { } .productsNew p a:hover *, .productsNew p a:focus *, .productsNew p a:active * { } .productsNew p a img { margin: auto; } /* ________________________________________________________________________________________________________________ FOOTER ________________________________________________________________________________________________________________ */ #footer { display: none; } #footer_teaser_text { display: none; color: #555;} .footer_background { background: #BBB; left: 1px; position: relative; } #sub_footer { background: #d5d5d5 url(synusa4/footer-bg.png) repeat-x center top !important; font-size: 10px; margin-bottom: 0px; min-height: 200px; width: auto; } @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and ( min--moz-device-pixel-ratio: 2), only screen and ( -o-min-device-pixel-ratio: 2/1), only screen and ( min-device-pixel-ratio: 2), only screen and ( min-resolution: 192dpi), only screen and ( min-resolution: 2dppx) { #sub_footer { background: #d5d5d5 url(synusa4/footer-bg-2x.png) repeat-x center top !important; background-size: 2000px 200px !important; } } #sub_footer .inner { margin: 0 auto; min-height: 100px; padding-top: 100px; width: 100%; max-width: 972px; } #footerLogo { position: absolute; height: 150px; margin-left: -75px; top: 30px; left: 50%; width: 150px; } #sub_footer .one_half.last { float: right; width: 40%;} #sub_footer, #sub_footer a , #sub_footer a:visited { color: #777; font-weight: normal; text-decoration: none; } #sub_footer a:hover, #sub_footer a:focus, #sub_footer a:active { color: #333; font-weight: normal; text-decoration: underline; } #menu-main-footer { text-align: left; } #menu-main-footer li { background: transparent none; height: auto; line-height: 16px;} #menu-main-footer a { font-size: 11px; line-height: 17px; height: auto; text-align: left; }