/* COMMON DEFAULTS */
body {
    background: #fff url(../images/toyo-bg-gradient.jpg) repeat-x top center;
    color: #424242;
    font-family: "Helvetica Neue", Arial, sans-serif;
}

h1, h2, h3, h4, h5 {
    font-weight: normal;
}

a:link, a:visited {
    color: #027ac6;
    text-decoration: none;
}

a:hover {
    text-decoration: none;
}

.close {
    opacity: 1;
}

/* MISCELLANEOUS */
a.cta, .cta a {
    background: url(../images/cta-bg.png) no-repeat center right;
    display: inline-block;
    font-weight: bold;
    padding-right: 18px;
    text-align: left;
    line-height: 1;
}

a.secondary, .secondary a {
    color: #333;
}

.asterisk {
    color: red;
}

.btn-primary {
    background: url(../images/backgrounds/btn-primary-bg.png) repeat-x center left;
    text-transform: uppercase;
}

.full-width-modal {
    width: 90%;
}

h1.main-title {
    color: #027ac6;
    font-size: 17px;
    font-weight: bold;
    margin-top: 0;
    text-shadow: 1px 1px 2px #ccc;
    text-transform: uppercase;
}

/* SPECIFICATION TABLES */
tr.odd, tr.info {
    background-color: #edf5fa;
}

tr.even, tr.odd, tbody th {
    border-color: #d3e7f4;
    border-image: none;
    border-style: solid;
    border-width: 1px 0;
}

.new-revision * {
    color: #248d30 !important;  /* Green asterisks in spec tables */
    font-weight: bold;
}





/* MODAL FINDER MODAL */
/*
.tire-finder-modal .modal-body {
    background: #2d2d2d;
    padding: 10px;
}

.tire-finder-modal form {
    margin: 10px;
}

.tire-finder-modal label {
    color: #fff;
    font-weight: normal;
}

.tire-finder-modal .help-block {
    color: #ccc;
}

.tire-finder-modal hr {
    border-top: 2px dashed #b4d7f0;
}
*/

/* SHELL */
.site-wrapper {
    background-repeat: no-repeat;
    background-position: top center;
    position: relative;
}





.panel-title {
    font-size: 12px;
}

.panel-default > .panel-heading {
     background: #0191d0 url(../images/backgrounds/flyout-panel-heading-bg.png) repeat-x top center;
}

.panel-default > .panel-heading a {
     color: white;
}




























/* EU COOKIE POPUP */
.cookie-block {
    width: 200px;
    position: absolute;
    bottom: 10px;
    right: 10px;
    position: fixed;
    z-index: 1000;
}

.cookie-block #hide-cookie {
    font-weight: bold;    
}

.cookie-header {
    background-color: #0d6db3;
    color: #fff;
    font-size: 14px;
    font-weight: bold;
    padding: 5px 10px;
    border-radius: 5px 5px 0 0;
}

.cookie-content {
    background: #eee;
    padding: 5px 10px;
    border-right: 1px solid #ccc;
    border-left: 1px solid #ccc;
}

.cookie-footer {
    padding: 5px 10px;
    border: 1px solid #ccc;
    border-top: 0;
    border-radius: 0 0 5px 5px;
    background: #eee;
}

/* EU PERFORMANCE RATING COMPONENT */
.eu-performance-rating h6 {
    text-transform: uppercase;
    margin-bottom: 3px;
}

.eu-performance-rating .metric {
    margin-bottom: 3px;
    line-height: 1;
    font-size: 11px;
}

.eu-performance-rating .chart {
    width: 140px;
    float: left;
    background: url(../images/eu-rating-bar.png) repeat-y;
    margin-right: 5px;
}

.eu-performance-rating .chart td {
    width: 20px;
    height: 22px;
    padding: 0;
    text-align: center;
    font-weight: bold;
    color: #fff;
}

.eu-performance-rating .chart td.dot {
    background: url(../images/eu-rating-dot.png) center center no-repeat;
}

.eu-performance-rating .rating {
    float: left;
    width: 50px;
    font-size: 11px;
    font-weight: bold;
    margin-right: 5px;
}

.eu-performance-rating .name {
    float: left;
    color: #0A318F;
    font-size: 11px;
    margin-right: 5px;
}

.eu-performance-rating .noise-bars {
    height: 20px;
    background: url(../images/eu-rating-noise-bars.png) repeat-y;
    margin-bottom: 3px;
}

/* EU PERFORMANCE RATING COMPONENT IN MODAL */
.modal .eu-performance-rating .chart {
    float: none;
    margin: 0 0 5px 0;
}

.modal .eu-performance-rating .rating {
    float: none;
    margin: 0;
    width: auto;
    text-align: center;
}

/* FOOTER */
.footer {
    background: #dfdfdf url(../images/bottom-nav-bg.png) repeat-x bottom;
    border: 3px solid #bdbdbe;
    margin-bottom: 1em;
}

.footer .footer-inner {
    margin: 1em 22px;
}

/* FOOTER NAVIGATION */
.footer-nav {
    border-bottom: 1px solid #aaa;
}

.footer-nav .nav-column h5 {
    margin-bottom: 0;
    font-weight: bold;
    line-height: 16px;
    text-transform: uppercase;
}

.footer-nav .nav-column h5 a {
    color: #004d86;
}

.footer-nav .nav-column ul {
    padding-left: 0;
    list-style: none;
}

.footer-nav .nav-column ul a {
    font-size: 11px;
    color: #555;
    text-decoration: none;
}

/* FOOTER BOTTOM */
.footer-bottom a.commerical-link {
    background: url(../images/commercial-truck-icon-sm.png) no-repeat left center;
    color: #000;
    display: inline-block;
    font-weight: bold;
    line-height: 18px;
    padding-bottom: 10px;
    padding-left: 60px;
    padding-top: 10px;
    text-decoration: none;
    text-transform: uppercase;
}

.footer-bottom form.country-selector select {
    margin-top: 10px;
}

/* FOOTNOTE */
.footnote {
    color: #898989;
    font-size: 11px;
    margin-bottom: 1em;  
}

.footnote a {
    color: #888;
    text-decoration: none;
}

/* GLOBAL PERFORMANCE RATING COMPONENT */
.global-performance-rating h6 {
    margin-bottom: 3px;
    text-transform: uppercase;
}

.global-performance-rating .metric {
    margin-bottom: 2px;
}

.global-performance-rating span {
    line-height: 1;
    display: block;
    padding: 3px 0;
    display: block;
    height: 20px;
}

.global-performance-rating .chart {
    width: 140px;
    float: left;
    margin-right: 10px;
}

.global-performance-rating ul.performance-rating-header {
    margin: 3px 0;
    padding-left: 0;
}

.global-performance-rating ul.performance-rating-header li {
    display: inline-block;
    text-align: left;
    width: 23px;
}

.global-performance-rating li.rating-header-0 {
    color: #bbb;
}

.global-performance-rating li.rating-header-1 {
    color: #aaa;
}

.global-performance-rating li.rating-header-2 {
    color: #999;
}

.global-performance-rating li.rating-header-3 {
    color: #888;
}

.global-performance-rating li.rating-header-4 {
    color: #777;
}

.global-performance-rating li.rating-header-5 {
    color: #666;
}

.global-performance-rating span.tire-detail-rating-bar {
    background: url("../images/backgrounds/large-rating-bar.png") repeat-y 0 0;
    padding: 0;
    width: 140px;
    height: 20px;
}

.global-performance-rating span.tire-rating-10 {
    background-position: 0 0;
}

.global-performance-rating span.tire-rating-15 {
    background-position: 0 -20px;
}

.global-performance-rating span.tire-rating-20 {
    background-position: 0 -40px;
}

.global-performance-rating span.tire-rating-25 {
    background-position: 0 -60px;
}

.global-performance-rating span.tire-rating-30 {
    background-position: 0 -80px;
}

.global-performance-rating span.tire-rating-35 {
    background-position: 0 -100px;
}

.global-performance-rating span.tire-rating-40 {
    background-position: 0 -120px;
}

.global-performance-rating span.tire-rating-45 {
    background-position: 0 -140px;
}

.global-performance-rating span.tire-rating-50 {
    background-position: 0 -160px;
}

.global-performance-rating span.tire-rating-na {
    background-position: 0 -180px;
}

.global-performance-rating .rating {
    float: left;
    width: 30px;
    font-weight: bold;
    margin-right: 5px;
    color: #009933;
}

.global-performance-rating .name {
    float: left;
    color: #0A318F;
}

/* GLOBAL PERFORMANCE RATING COMPONENT IN MODAL */
.modal .global-performance-rating .chart {
    float: none;
    margin: 0 0 5px 0;
}

.modal .global-performance-rating .rating {
    float: none;
    margin: 0;
    width: auto;
    text-align: center;
}

/* GLOBAL RATING COMPARE MODAL */
.modal .global-performance-rating .chart {
    width: 62px;
    margin-right: 0;
}

.modal ul.performance-rating-header {
    font-size: 11px;
    margin: 3px 0;
    padding-left: 0;
}

.modal ul.performance-rating-header li {
    display: inline-block;
    text-align: left;
    width: 7px;
}

.modal ul.performance-rating-header li.rating-header-0 {
    color: #bbb;
}

.modal ul.performance-rating-header li.rating-header-1 {
    color: #aaa;
}

.modal ul.performance-rating-header li.rating-header-2 {
    color: #999;
}

.modal ul.performance-rating-header li.rating-header-3 {
    color: #888;
}

.modal ul.performance-rating-header li.rating-header-4 {
    color: #777;
}

.modal ul.performance-rating-header li.rating-header-5 {
    color: #666;
}

.modal .global-performance-rating span.tire-detail-rating-bar {
    background-image: url(../images/backgrounds/small-rating-bar.png);
    width: 62px;
}

/* HEADER */
.header {
    background: #fcfcfc url(../images/backgrounds/cord_med.png) repeat-x bottom center;
    border-right: 3px solid #fff;
    border-bottom: 2px solid #fff;
    border-left: 3px solid #fff;
    margin-bottom: 75px;
    box-shadow: 0 0 20px rgba(0, 0, 0, 1.0);
}

.header .logo-wrapper {
    margin: 10px 30px;   
}

/* HEADER FINDER */
.header-finder {
}

.header-finder .nav-tabs {
    border-bottom: 0;
}

.header-finder .nav-tabs li {
    background: url(../images/backgrounds/toyo-header-finder-simple-bg.png) repeat-x left bottom;
    text-transform: uppercase;
    font-size: 11px;
    text-align: center;
    width: 50%;
}

.header-finder .nav-tabs li:first-child {
    border-right: 1px solid #008ec0;
}

.header-finder .nav-tabs li:last-child {
    border-left: 1px solid #26c0f2;
}

.header-finder .nav-tabs > li.active > a, .header-finder .nav-tabs > li.active > a:hover, .header-finder .nav-tabs > li.active > a:focus {
    border-color: transparent;
    background-color: transparent;
    color: #fefefe;
}

.header-finder .nav-tabs li a {
    color: #fefefe;
    display: block;
    padding: 5px;
    border-radius: 0;
    margin-right: 0;
}

.header-finder .nav-tabs > li > a:hover {
    border-color: transparent;
}

.header-finder .nav > li > a:hover, .header-finder .nav > li > a:focus {
    background-color: transparent;
}

.header-finder label {
    color: #fff;
    font-weight: normal;
}

.header-finder .help-block {
    color: #ccc;
}

.header-finder hr {
    border-top: 2px dashed #b4d7f0;
}

.header-finder .tab-pane {
    border-right: 10px solid rgba(255, 255, 255, 0.7);
    border-bottom: 10px solid rgba(255, 255, 255, 0.7);
    border-left: 10px solid rgba(255, 255, 255, 0.7);
    background: #2d2d2d;
    padding: 10px;
}

.header-finder a.cta-link {
    color: #c8c8c8;
    font-style: italic;
    font-weight: bold;
    padding-right: 22px;
    background: url(../images/cta-bg.png) no-repeat center right;

}

/* MODAL COMPARE BUTTONS */
.modal-view-cta-container {
    background: url(../images/backgrounds/toyo-header-finder-simple-bg.png) repeat-x left bottom;
    position: absolute;
    top: -10px;
    right: 0;
    font-weight: bold;
    text-transform: uppercase;
    text-align: center;
    z-index: 100;
}

.modal-view-cta-container a {
    color: #fefefe;
    display: block;
    padding: 5px 20px;
}

/* NAVBAR */
.navbar {
    margin-bottom: 0;
    min-height: 40px;
}

.navbar-default {
    background-color: transparent;
    border: 0;
}

.navbar-nav > li > a {
    padding-top: 10px;
    padding-bottom: 10px;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 14px;
}

.navbar-default .navbar-nav > li > a {
    color: #027ac6;
}

.navbar-nav .dropdown-menu {
    background: #e9ebed url(../images/backgrounds/cord_dark.png) repeat-x bottom center; 
}

nav.yamm a.dropdown-toggle {
}

.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
    background: -moz-linear-gradient(center top , rgba(255, 255, 255, 0) 0%, rgba(233, 235, 237, 0.8) 100%) repeat scroll 0 0 rgba(0, 0, 0, 0);
}

/* FLYOUT */
.flyout-content {
    margin: 1em 25px;
}

.flyout-content h3 {
    margin-top: 0;
}

.flyout-content h3 a {
    color: inherit;
}

.flyout-content h4 {
    color: #333;
    font-weight: bold;
    font-size: 16px;
    text-transform: uppercase;
}

.flyout-content .long-description {
    color: #727272;
}

.flyout-content ul.flyout-link-list {
    list-style: none;
    padding-left: 0;
    margin-bottom: 1em;
    line-height: 1.75em;
}

.flyout-content ul.flyout-link-list-news a, .flyout-content ul.flyout-link-list-pages a {
    font-weight: bold;
}

.flyout-content a.menu-cta {
    background: url(../images/cta-bg.png) no-repeat center right;
    display: inline-block;
    padding-right: 22px;
    color: #004f8e;
    font-size: 13px;
    line-height: 1;
}

.flyout-content span.variant {
    color: #027ac6;
    display: block;
    font-size: 11px;
    margin-top: -6px;
    font-weight: bold;
}

.flyout-content .flyout-secondary h5 {
    text-transform: uppercase;
    font-weight: bold;
    border-bottom: 1px solid #ccc;
    padding-bottom: 0.5em;
}

.flyout-content .flyout-secondary p {
    color: #999;
}

.flyout-content .tabs-left {
    padding-left: 0;
    padding-right: 0;
}

.flyout-content .nav-tabs > li.active > a, .flyout-content .nav-tabs > li.active > a:hover, .flyout-content .nav-tabs > li.active > a:focus {
    background: #0191d0 url(../images/backgrounds/flyout-panel-heading-bg.png) repeat-x top center;
    color: #fff;
}

/* LANGUAGE SWITCHER */
.language-switcher-xs {
    display: inline-block;
    margin: 5px 15px;
}

.language-switcher .active {
    font-weight: bold;
}

.share-wrapper .language-switcher  {
    height: 25px;
    display: inline-block;
    text-align: right;
    position: absolute;
    top: 17px;
    right: 175px;
}

/* NEWSLETTER SIGNUP */
.newsletter-signup {
    border-bottom: 1px solid gray;
}

.newsletter-signup .form-group {
    display: inline-block;
    margin-bottom: 0;
    vertical-align: middle;
}

.newsletter-signup h5 {
    margin-bottom: 0;
    text-transform: uppercase;
    font-weight: bold;
}

/* MAIN */
.main {
    background: #fff url(../images/backgrounds/main-bg.png) no-repeat 0 2px ;
    margin-bottom: 1.5em;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.5);
}

.main .content {
    margin: 25px 15px;
}

.main .content p {
    color: #6f6f6f;
}

.main .content .lead {
    color: #000;
}

.main .content .breadcrumbs {
    margin-bottom: 1em;
    color: #b2b2b2;
    font-size: 12px;
}

.main .content .breadcrumbs a {
    color: #0a318f;
}

/* SHARING ICONS */
.share-wrapper {
    margin: 15px 0 5px 0;
}

.share-wrapper .share-icon {
    display: inline-block;
    margin-left: 2px;
    background: url('../images/backgrounds/share_icons_sprite.png') no-repeat;
    cursor: pointer;
}

.share-wrapper .share-twitter {
    width: 56px;
    height: 25px;
    background-position: -22px 0px;
}

.share-wrapper .share-google-plus {
    width: 36px;
    height: 25px;
    background-position: -78px 0px;
}

.share-wrapper .share-facebook {
    width: 50px;
    height: 25px;
    background-position: -114px 0px;
}

/* SIDEBAR FINDER */
.sidebar-finder {
    border: 10px solid #44a5e4;
    padding: 10px;
}

.sidebar-finder h5     {
    color: #44a5e4;
    font-weight: bold;
    text-transform: uppercase;
    border-bottom: 1px solid #dfdfdf;
    padding-bottom: 10px;
}

.sidebar-finder form {
    background: #f1f1f1;
    padding: 10px;
}

.sidebar-finder legend {
    font-size: 12px;
    font-weight: bold;
    border: 0;
}

/* TILES */
.tiles {
}

.tile {
    background: #808080;
    background: linear-gradient(45deg, #808080 0%, #2f2f2f 99%) repeat 0 0;
    padding: 10px;
    width: 250px;
    margin: 10px auto;
}

.tile-content {
    position: relative;
}

.tile h5 {
    position: absolute;
    top: 0;
    color: #00AEEF;
    text-shadow: 1px 1px 0 #666666;
    margin-left: 5px;
    font-size: 14px;
    font-weight: bold;
}

.tile-cta {
    position: absolute;
    bottom: 0;
    right: 5px;
    border-radius: 2px;
    padding: 0 22px 0 5px;
    background: #fff url(../images/cta-bg.png) no-repeat right 3px;
    font-style: italic;
    font-weight: bold;
    margin: 0 10px 10px;
    padding: 0 24px 0 0;
    right: 0;
}

.tile-blue {
    background: #00aeef;
}

.tile-blue .tile-content {
    background: #000;
    padding: 5px 10px;
    height: 152px;
}

.tile-blue h5 {
    position: relative;
    color: #00AEEF;
    font-size: 13px;
    font-weight: 500;
    margin: 5px 0;
}

.tile-blue .form-group {
    margin-bottom: 10px;
}

.tile-blue select {
    width: 100%;
}

.tile-blue .help-block {
    color: #ccc;
}

/* SOCIAL (TWEETS AND SBLOCKS) */
.social {
}

.social .twitter-feed {
    position: relative;
}

.social .tread-talk {
    float: left;
    width: 115px;
}

.social .tread-talk h5 {
    margin-top: 3px;
    margin-right: 8px;
    font-weight: bold;
}

.social .tread-talk h5 a {
    background: url(../images/cta-bg.png) no-repeat center right;
    padding-right: 22px;
    display: inline-block;
}

.social .tweet-entry {
    position: relative;
    margin-left: 115px;
    font-size: 11px;
    font-weight: bold;
}

.social .tweet-entry a {
    color: #004d86;
    text-decoration: none;
}

.social .tweet-entry .tweet-entry-date {
    float: left;
    width: 80px;
}

.social .tweet-entry .tweet-entry-content {
    margin-left: 80px;
}

.social .sblocks ul {
    padding-left: 0;
    list-style: none;
}

.social .sblocks ul li {
    display: inline-block;
}

/* ZEND SIDE NAV */
.zend-nav {
    margin: 25px 0;
}

.zend-nav ul.navigation {
    padding-left: 0;
}

.zend-nav ul.navigation li {
    list-style: none;
}

.zend-nav ul.navigation li a {
    display: block;
    padding: 5px 15px;
}

/* ZEND SIDE NAV (L1) */
.zend-nav ul.navigation > li > a {
    background: url(../images/backgrounds/cord_nav.png) top left no-repeat;
    font-size: 14px;
    text-transform: uppercase;
}

.zend-nav ul.navigation > li.active > a {
    color: #727272;
}

/* ZEND SIDE NAV (L2) */
.zend-nav ul.navigation > li > ul {
    padding-left: 30px;
}

.zend-nav ul.navigation > li > ul > li > a {
    background: url(../images/backgrounds/toyo_bullet.png) center left no-repeat;
}

/* ZEND SIDE NAV (L3) */
.zend-nav ul.navigation > li > ul > li > ul {
    padding-left: 15px;
}

/* ZEND SIDE NAV (PROGRESSIVE NAV) */
.zend-nav ul.navigation li {
    display: none;
}

.zend-nav ul.navigation > li.active,
.zend-nav ul.navigation > li.active > ul > li,
.zend-nav ul.navigation > li.active > ul > li.active > ul > li,
.zend-nav ul.navigation > li.active > ul > li.active > ul > li.active > ul > li,
.zend-nav ul.navigation > li.active > ul > li.active > ul > li.active > ul > li.active > ul > li,
.zend-nav ul.navigation > li.active > ul > li.active > ul > li.active > ul > li.active > ul > li.active > ul > li {
    display: block;
}

.zend-nav ul.navigation > li.active > a,
.zend-nav ul.navigation > li.active > ul > li.active > a,
.zend-nav ul.navigation > li.active > ul > li.active > ul > li.active > a,
.zend-nav ul.navigation > li.active > ul > li.active > ul > li.active > ul > li.active > a,
.zend-nav ul.navigation > li.active > ul > li.active > ul > li.active > ul > li.active > ul > li.active > a,
.zend-nav ul.navigation > li.active > ul > li.active > ul > li.active > ul > li.active > ul > li.active > ul > li.active > a {
    font-weight: bold;
}

/* GALLERY FOR TIRE */
.gallery-wrapper {
}

.gallery-wrapper .hotspot {
    position: absolute;
    height: 25px;
    width: 25px;
    background: url(../images/backgrounds/hotspot-normal.png) no-repeat;
    cursor: pointer;
}

.gallery-wrapper .hotspot.active {
    background-image: url(../images/backgrounds/hotspot-active.png);
}

.gallery-wrapper .tire-interactive {
    height: 320px;
    width: 240px;
    margin: auto;
    background-position: 0 0;
    background-repeat: no-repeat;
    overflow-x: visible;
    position: relative;
    z-index: 4;
}

.thumb-holder {
    padding: 5px;
    background-color: #fff;
    border: 1px solid #ccc;
    display: inline-block;
    margin-bottom: 10px;
}

.thumb-holder a {
    background-color: #fff;
    display: inline-block;
    margin: 0 5px 0 0;
    border: 1px solid #fff;
}

.thumb-holder a:hover {
    border: 1px solid #ccc;
}

.thumb-holder a.active {
    border: 1px solid #3494e1;
}