/* @import url(./generalTypography.css) screen; */ /* @import url(./generalStructure.css) screen; */ /* ________________________________________________________________________________________________________________ 01. GLOBAL STRUCTURE ________________________________________________________________________________________________________________ */ /* ________________________________________________________________________________________________________________ 02. TYPOGRAPHY ________________________________________________________________________________________________________________ */ body { font-size: 13px; 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 ------- */ blockquote, .bullet_list, h5, .rss-date, .date, .awaiting_moderation, .dropcap4{color:#b4b4b4;} .inputError{border-color:#b4b4b4 !important;} .fancy_header span{background-color:#b4b4b4;} .hero-title { font-size: 40px; text-align: center; margin-bottom: 40px; } /* ------- 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);} /* ________________________________________________________________________________________________________________ 03. ICONS ________________________________________________________________________________________________________________ */ /* .dropcap1,.dropcap3,blockquote{background-image: url(synusa2/sprite.png);} ul.arrow_list li,ul.check_list li,ul.star_list li,ul.colored_bullet_list li,a.download_link,a.email_link{background-image: url(synusa2/mini_icons.png);} .toggle,.active,.toggle_frame .toggle,.toggle_frame .active{background-image: url(synusa2/toggle_sprite.png);} a.fancy_link{background-image: url(synusa2/fancy_link.png)} #body_block .widget_recent_comments ul li.recentcomments span, #body_block .webtreats_twitter_widget ul li, #body_block .contact_widget_name, #body_block .contact_widget_phone, #body_block .contact_widget_email{background-image: url(synusa2/mini_icons.png);} #menu_search{background-image:url(synusa2/search.png);} */ /* ________________________________________________________________________________________________________________ 04. MENU ________________________________________________________________________________________________________________ */ .menu li { display: block; float: left; 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;} /* ________________________________________________________________________________________________________________ 05. SYNUSA STYLES ________________________________________________________________________________________________________________ */ body { background: #fff; position: relative; padding-top: 0px; } .body_background { background: #FFF; margin: 0 auto 0; padding: 0; position: relative; width: auto; } .minimal #body_block_background { background-color: transparent; } body, textarea { color: #4C4C4C; } .center-block { margin-left: auto; margin-right: auto; } /* * Basic Text Styles */ h1, h2, h3, h4, h5 { margin-bottom: 0px;} 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; } } /* .category h2 { margin-bottom: 12px; } */ /* 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: #777777; font-size: 16px; line-height: 2em; 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; } .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 { float: left; width: 45%; padding-left: 5%; } .checkmarks.twocol.right > li { padding-right: 5%;} .checkmarks ul, .checkmarks ol { margin-left: 45px; } hr { background-color: #777 !important; clear: both; height: 1px; margin:20px 0;} #header, #body_block, #footer, #sub_footer { /* padding-left: 5px; padding-right:5px; width: 955px; */ } /* ________________________________________________________________________________________________________________ 06. HEADER ________________________________________________________________________________________________________________ */ #dealerHeaderAd { text-align:center; overflow:auto; padding-bottom:8px; min-height: 200px;background: #222 url("/images/Free-Shipping-3000.jpg"); background-size: auto 100%; background-repeat: no-repeat; background-position: center; min-height: 200px; position:relative; } .homepageDealerAdLink { position: absolute; top: 0; right: 0; bottom:0; left: 0; font-size: 0.00em; text-indent: -999em; z-index: 101; } #header { background: transparent !important; height: auto; z-index: 99; } .mainHeader { background-color: #005BAC;} /* #header .inner { background: transparent; margin: 0 auto; position: relative; width: 960px; } */ #header #logo { background: transparent url(/images/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 .hdrBranding { overflow: auto; /* padding: 20px 0; */ margin: 0 auto; } #header .hdrWelcome { text-align: center; margin: 0 235px; } #header .hdrWelcome h1{ font-size: 17px; line-height: 1.5em; } #header .hdrWelcome h2{ font-size: 15px; line-height: 1.5em; } /* #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 .header_logo { position: absolute; top: 50%; left: 80px; margin-top: -33px; width: 255px; } #header .header_contact { color: #999; font-size: 12px; font-weight: bold; } #header .header_contact .headerPhone { font-size: 15px; } #headerSecondaryMenu { padding: 0; margin: 0 auto; } #headerSecondaryMenu li a, #headerSecondaryMenu li a:link { color: #999; height: 20px; font-size: 10px;line-height: 20px;padding: 0 6px; text-shadow: none;} #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 { 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} /* ________________________________________________________________________________________________________________ 07. NAVIGATION ________________________________________________________________________________________________________________ */ #main_menu .menu-main-container { 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(/images/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: #FFF; 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(/images/navHover-bg.png) repeat-x scroll center left; color: #fff; text-shadow: 0 3px 5px rgba(0,0,0,0.4) } /* 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; float: left; 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 { float: left; margin-right: 25px; } ul#department-nav a:hover, ul#department-nav a:focus, ul#department-nav a:active { color: #333;} .AmsoilMainNav { background-color: #005BAC; color: white; } .AmsoilMainNav ul, li { margin: 0; } .AmsoilMainNav a:hover, .AmsoilMainNav a:focus, .AmsoilMainNav a:active { color: #fcb338; } .AmsoilMainNav .shopBy { margin: 5px 0; } .AmsoilMainNav .shopBy .prefix { font-size: 14px; line-height: 12px; font-weight: normal; font-style: italic; margin: 4px 0 6px 10px; text-align:center; } .AmsoilMainNav .shopBy li { font-size: 1.7em; border-left: 2px solid #525252; } .AmsoilMainNav .shopBy li.first { border-left: 0px none; } .AmsoilMainNav .shopBy a { padding: 0.25rem 1rem; } .AmsoilMainNav .extendedShop { margin-top: 10px; margin-bottom: 10px; } .AmsoilMainNav .extendedShop li { box-shadow: inset 3px 4px 4px rgba(255,255,255,0.5), inset -3px -4px 4px rgba(0,0,0,0.4); } /* ________________________________________________________________________________________________________________ 08. 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;} .row.category .one_half{ width:49%; } .row.category .one_third{ width:32%; } .row.category .two_third{ width:64%; } .row.category .one_fourth{ width:23%; } .row.category .three_fourth{ width:75%; } .row.category .one_fifth{ width:18.4%; } .row.category .two_fifth{ width:38.8%; } .row.category .three_fifth{ width:59.2%; } .row.category .four_fifth{ width:79.6%; } .row.category .one_sixth{ width:15%; } .row.category .five_sixth{ width:83%; } .row.category .one_half, .row.category .one_third, .row.category .two_third, .row.category .three_fourth, .row.category .one_fourth, .row.category .one_fifth, .row.category .two_fifth, .row.category .three_fifth, .row.category .four_fifth, .row.category .one_sixth, .row.category .five_sixth{ position:relative; margin-right:2%; float:left; } .row.category { border: 1px solid #999; clear: both; margin-top: 20px; margin-bottom: 20px; margin-left: -10px; margin-right: -10px; overflow: auto; padding: 15px; border-radius: 10px; } .row.category .last { float: right; } @media (min-width: 768px) { .row.category .one_fifth-md{ width:20%; -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } } /* ________________________________________________________________________________________________________________ 09. 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: #BBBBBB ; /* 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, #BBBBBB 0%, #999999 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#BBBBBB), color-stop(100%,#999999)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #BBBBBB 0%,#999999 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #BBBBBB 0%,#999999 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #BBBBBB 0%,#999999 100%); /* IE10+ */ background: linear-gradient(to bottom, #BBBBBB 0%,#999999 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#BBBBBB', 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; } .horizontalFeaturedButtons a:first-child { margin-right: 20px; } /* ________________________________________________________________________________________________________________ 10. MISC. BASIC FEATURES ________________________________________________________________________________________________________________ */ .img-responsive { display: inline-block; max-width: 100%; height: auto; } #body_block { max-width: 1200px; margin: 0 auto; padding-top: 30px; z-index: 100; } #body_block .inner { padding-bottom: 1px; } .right_sidebar #main { float: none; width: auto; } .shadowbreak { clear: both; display: block; background: transparent url(/images/shadowbreak.png) no-repeat scroll center top !important;; height: 43px; margin: 40px 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; height: 200px; width: 640px; } /* .discountFlag { background: transparent url('/images/discountFlag.png') no-repeat scroll top center; color: #4e3800; font-size: 9px; font-weight: bold; line-height: 13px; text-transform: uppercase; padding: 5px 2px 2px; width: 36px; height: 36px; position: absolute; top: 0; left: -4px;}*/ .discountFlag { background: transparent url('/images/discountFlag2.png') no-repeat scroll top center; color: #4e3800; font-size: 9px; font-weight: bold; line-height: 11px; text-transform: uppercase; padding: 4px 2px 2px; width: 48px; height: 42px; position: absolute; top: 4px; left: 50%; margin-left: -50%;} .discountFlag { transform:rotate(-20deg); -ms-transform:rotate(-20deg); /* IE 9 */ -webkit-transform:rotate(-20deg); /* Opera, Chrome, and Safari */} .discountFlag small { font-size: 7px; } .discountFlag strong { font-size: 16px; } #discountExplanation h4 { background: transparent url('/images/SaveNowAnimation.gif') no-repeat scroll top center; color: #4e3800; font-size: 9px; font-weight: bold; line-height: 11px; float: left; text-transform: uppercase; padding: 4px 2px 2px; margin-right: 5px; font-size: 0.0001%; text-indent: -999em; width:65px; height: 50px;} #discountExplanation h4 strong { font-size: 0.0001%; text-indent: -999em; } .product { min-height: 170px; padding-bottom: 30px; position: relative; text-align: center;} .product h3 { font-size: 11px; line-height: 13px; font-weight: bold; } .productLinkOverlay { position: absolute; top: 0; left: 0; bottom: 0; right: 0; z-index: 10; } .productImage { text-align: center;} .lookupGuide { min-height: 170px; text-align: center;} .lookupGuideButton { color: black !important; display: block; margin-bottom: 20px; text-align:center;} #productLookupGuides .row { margin-left: -13px; margin-right: -13px;} .overlayContainer { position: relative; margin-bottom: 15px; } .overlay { position: absolute; top: 0; left: 0; bottom: 0; right: 0; z-index: 10; } /* ==IMAGE HOVER - Glitchy== a img { -moz-opacity:1.0; filter:alpha(opacity=100); opacity:1.0; transition: opacity: 0.2s; -moz-transition: opacity 0.2s; -webkit-transition: opacity 0.2s; -o-transition: opacity 0.2s; } a img:hover, a img:active, a img:focus { -moz-opacity:.60; filter:alpha(opacity=60); opacity:.60; } */ /* ________________________________________________________________________________________________________________ 11. DIALOGS ________________________________________________________________________________________________________________ */ .simpleDialog { display: none; background: white; left: 50%; margin-left: -410px; min-height: 200px; padding: 45px; position: absolute; width: 730px; } .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: 11px; 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;} */ /* ________________________________________________________________________________________________________________ 12. FOOTER ________________________________________________________________________________________________________________ */ #footer { background: black; color: #C5C5C5; margin-bottom: 0px; width: auto; } .footer_background > div { text-align: center; margin-top: 10px; margin-bottom: 10px; } #footer, #footer a { color: #777; font-weight: normal; text-decoration: none; text-shadow: none; } #footer a:hover, #footer a:focus, #footer a:active { background: transparent; color: #fcb338; font-weight: normal; } #footerCopyright { } .copyright { display: block; text-align: center;} #footerMenu { } #footerMenu li a, #footerMenu li a:link { color: #888; height: 20px; font-size: 10px;line-height: 20px;padding: 0 6px; text-shadow: none;} /* ________________________________________________________________________________________________________________ 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 */ .center-xs { display: block; text-align: center !important; margin-left: auto; margin-right: auto; } .float-right-xs { float: right; margin-left: 20px; } .float-left-xs { float: left; margin-right: 20px; } } @media screen and (min-width: 769px) and (max-width: 992px) { /* Small Size */ .center-sm { display: block; text-align: center !important; margin-left: auto; margin-right: auto; } .float-right-sm { float: right; margin-left: 20px; } .float-left-sm { float: left; margin-right: 20px; } } @media screen and (min-width: 993px) and (max-width: 1200px) { /* Medium Size */ .center-md { display: block; text-align: center !important; margin-left: auto; margin-right: auto; } .float-right-md { float: right; margin-left: 20px; } .float-left-md { float: left; margin-right: 20px; } } @media screen and (min-width: 1200px) { /* Large Size */ .center-lg { display: block; text-align: center !important; margin-left: auto; margin-right: auto; } .float-right-lg { float: right; margin-left: 20px; } .float-left-lg { float: left; margin-right: 20px; } } @media screen and (min-width: 993px) { .max-970 { max-width: 970px; } } @media screen and (max-width: 600px) { #wpadminbar { position: fixed !important; } }