/* css cotic menu style */
/* by Kelvin Owers - spittingcat.com */
/* moved from cotic_menu.v52.css */
/* minify with https://www.minifier.org/ */

@font-face {
  font-family: "Trade Gothic Bold";
  src: url("/fonts/trade-notcond.woff2") format("woff2"),
    url("/fonts/trade-notcond.woff?#") format("woff"),
    url("/fonts/trade-notcond.ttf") format("truetype");
    font-display: block;
}

@font-face {
  font-family: "Framesize";
  src: url("/fonts/framesize.woff2") format("woff2"),
    url("/fonts/framesize.woff?#") format("woff"),
    url("/fonts/framesize.ttf") format("truetype");
    font-display: block;
}

@font-face {
  font-family: "JustVector";
  src: url("/fonts/justvectorv2-webfont.woff2") format("woff2"),
    url("/fonts/justvectorv2-webfont.woff?#") format("woff"),
    url("/fonts/justvectorv2-webfont.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

#wrapper {
    opacity: 1;
            transition: opacity 0.1s ease-in;
            transition-delay: 0s;
}

#wrapper.slow_load {
    opacity: 0;
}

img {border:0;}

#Table_menu, .popup_submenu {
    position:absolute;
    left:0px;
    top:0px;
    width:100%;
    min-height:84px;
    -webkit-box-shadow: 0px 6px 13px -1px rgba(0,0,0,0.05);
    -moz-box-shadow: 0px 6px 13px -1px rgba(0,0,0,0.05);
    box-shadow: 0px 6px 13px -1px rgba(0,0,0,0.05);
    background: white;
    background-color: rgba(255, 255, 255, 0.9);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    border-bottom: #eee solid 1px;
}
.popup_submenu {
    position:fixed;
    top:84px;
}

#navigation-heed {display: none;}

#navigation-fil1 {display: none;}

#navigation-COTIC {
    position:absolute;
    left:28px;
    top:21px;
    width:254px;
    height:39px;
}

#navigation-fil2 {display: none;}

#navigation-COTIC_mob {
    position:absolute;
    left:0px;
    top:0px;
    width:652px;
    height:100px;
}

#navigation-fil2_mob {
    position:absolute;
    left:652px;
    top:0px;
    width:278px;
    height:100px;
}

#navigation-main {
    font-family: Arial, "Helvetica Neue", Helvetica, "Trade Gothic", Verdana, "Andale Mono", "Andale Mono IPA", Consolas, "Bitstream Vera Sans Mono", "Courier New", monospace;
    font-weight: bold;
    position:absolute;
    right:28px;
    top:31px;
    height:20px;
    font-size: 1.1em;
}

.Simple_menu #navigation-main {
    top: 34px
}

#navigation-main a {
    display: inline;
    padding-left: 3px;
    padding-right: 3px;
    margin-left: 5px;
    color: #191919;
    text-decoration: none;
    text-transform: uppercase;
    border-bottom: white solid 6px;
    border-bottom: transparent solid 6px;
    cursor: pointer;
    transition: all .2s ease-out;
}

.Simple_menu #navigation-main a {
    margin-left: 0;
    margin-right: 6vw;
    opacity: 0.7;
}

#navigation-main a._black {
    color: black;
    border-bottom: #dbdbdb solid 6px;
}

@media (hover:hover) {
    #navigation-main a:hover {
        color: black;
        border-bottom: #ff6600 solid 6px;
    }
    .Simple_menu #navigation-main a:hover {
        opacity: 1;
    }
}
#navigation-main a.stickyhover {
    color: black;
    border-bottom: #ff6600 solid 6px;
}
.Simple_menu #navigation-main a.stickyhover {
    opacity: 1;
}






/* headroom is for the almost sticky menu */
html,
body {
    scroll-padding-top: 85px; /* set to the height of your header */
}

header {
      z-index: 10;
}

header.headroom,
header.headroom #Table_menu,
header.headroom #Table_submenu1 {
    position: fixed;
}

.headroom--pinned {
    visibility: visible;
    opacity: 1;
   -webkit-transition: visibility 0s 0.01s, opacity .25s ease-in-out;
}
.headroom--unpinned {
    visibility: hidden;
    opacity: 0;
   -webkit-transition: visibility 0s 0.25s, opacity .25s ease-in-out;
}

.headroom {
   transition: opacity .25s ease-in-out;
   -moz-transition: opacity .25s ease-in-out;
}

.headroom--unpinned #Table_menu a,
.headroom--unpinned #Table_submenu1 a {
    display: none;
}

#navigation-main .weareopen_link,
#navigation-main .financeUK_link,
#navigation-main .team_link,
#navigation-main .womenofsteel_link,
#navigation-main .women_link,
#navigation-main .ambassadors_link {
    display: none;
}
@media screen and (min-width: 970px) {
    #navigation-main .women_link,
    #navigation-main .ambassadors_link {
        display: inline;
    }
    #navigation-main .wos_link,
    #navigation-main .ambs_link {
        display: none;
    }
}
@media screen and (min-width: 1020px) {
    #navigation-main .womenofsteel_link {
        display: inline;
    }
    #navigation-main .women_link {
        display: none;
    }
    #Table_submenu1.sub_product #submenu1-options span,
    #Table_submenu1.sub_home #submenu1-options span {
        margin-left: 20px !important;
    }
    #Table_submenu1.sub_product #submenu1-options,
    #Table_submenu1.sub_home #submenu1-options {
        font-size: 1.2em;
    }
}
@media screen and (min-width: 1100px) {
    #navigation-main .weareopen_link,
    #navigation-main .financeUK_link,
    #navigation-main .team_link {
        display: inline;
    }
    #navigation-main .finance_link {
        display: none;
    }
}
@media screen and (max-width: 965px) {
    #navigation-main .international_link {
        display: none;
    }
}
@media screen and (max-width: 840px) {
    #navigation-main .ambs_link,
    #navigation-main .wos_link,
    #navigation-main .finance_link,
    #navigation-main .video_link {
        display: none;
    }
    #navigation-main {
        font-size: 1.05em;
    }
}
@media screen and (max-width: 740px) {
    #navigation-main {
        font-size: 1em;
    }
}
@media screen and (max-width: 700px) {
    #navigation-main {
        font-size: 0.75em;
    }
}
@media screen and (max-width: 660px) {
    #navigation-COTIC {
        display: none;
        font-size: 1em;
    }
}


.medium_window .build_link,
.medium_window .partners_link {
    display:none;
}

.small_window .build_link,
.small_window .geek_link,
.small_window .team_link,
.small_window .partners_link {
    display:none;
}

#navigation-Endfill {
    position:absolute;
    background-color:white;
    left:0px;
    top:0px;
    width:100%;
    height:59px;
}
#navigation-Endfill_mob {
    position:absolute;
    background-color:white;
    left:0px;
    top:0px;
    width:100%;
    height:115px;
}

#Table_submenu1 {
    font-family: Arial, "Helvetica Neue", Helvetica, "Trade Gothic", Verdana, "Andale Mono", "Andale Mono IPA", Consolas, "Bitstream Vera Sans Mono", "Courier New", monospace;
    position:absolute;
    left:0px;
    top:57px;
    width:100%;
    min-height:15px;
    color: #191919;
}

.popup_submenu {
    font-family: Arial, "Helvetica Neue", Helvetica, "Trade Gothic", Verdana, "Andale Mono", "Andale Mono IPA", Consolas, "Bitstream Vera Sans Mono", "Courier New", monospace;
    color: #191919;
}

#Table_submenu1 a, .popup_submenu a {
    text-decoration: none;
    border-bottom: white solid 6px;
    border-bottom: transparent solid 6px;
    transition: all .2s ease-out;
}
    
#Table_submenu1 .over a, .popup_submenu .over a {
    text-decoration: none;
    color: black;
}
#Table_submenu1 .over a:hover, .popup_submenu .over a:hover {
    text-decoration: none;
    color: black;
    border-bottom: #ff6600 solid 6px;
}
#Table_submenu1 .current a {
    text-decoration: none;
    color: black;
    border-bottom: #dbdbdb solid 6px;
}
#Table_submenu1 .current a:hover {
    text-decoration: none;
    color: black;
    cursor: default;
}
#Table_submenu1 .over img {
    filter: alpha(opacity=65);-moz-opacity:.65;opacity:.65;
}
#Table_submenu1 .over img:hover {
    filter: alpha(opacity=99);-moz-opacity:.99;opacity:.99;
}
#Table_submenu1 .over img, #Table_submenu1 .current img {
    padding-top: 4px;
}

.popup_submenu ul li {
    display: inline-block;
}
.popup_submenu ul li.mobileonly {
    display: none;
}
@media only screen 
    and (max-device-width : 667px) {
    .popup_submenu ul li.mobileonly {
        display: inline-block;
    }
}

@media screen and (max-width: 800px) {
    #Table_submenu1, .popup_submenu {
        font-size: 1em;
    }
}
@media screen and (max-width: 700px) {
    #Table_submenu1, .popup_submenu {
        font-size: 0.8em;
    }
}
@media screen and (max-width: 600px) {
    #Table_submenu1 {
        display: none;
    }
}

#submenu1-Endfill {
    position:absolute;
    left:0px;
    top:0px;
    width:100%;
    min_height:15px; _height:15px;
    overflow:hidden;
}

#submenu1-blank {
    position:absolute;
    left:0px;
    top:0px;
    width:100%;
    min-height:15px; _height:15px;
}

#submenu1-options {
    position:absolute;
    right: 28px;
    padding-right: 3px;
    top:0px;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    z-index: 2;
}

.popup_submenu ul {
    margin-top: 34px;
    margin-right: 8vw;
    float: right;
}

.popup_submenu ul li {
    right: 28px;
    padding-left: 2vw;
    top:0px;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    z-index: 2;
    display: inline-block;
}

#submenu1-options a, .popup_submenu ul li a {
    text-decoration: none;
    padding-bottom: 1px;
    padding-top: 1px;
    opacity: 0.6;
}
.popup_submenu ul li a {
    color: black;
}
#submenu1-options a:hover,
#submenu1-options .current a,
.popup_submenu ul li a:hover {
    opacity: 1;
}

#Table_submenu1.sub_product #submenu1-options span,
#Table_submenu1.sub_home #submenu1-options span {
    margin-left: 10px;
}
#Table_submenu1.sub_product #submenu1-options,
#Table_submenu1.sub_home #submenu1-options {
    letter-spacing: 0.02em;
    text-transform: initial;
}

#Table_progress {
    position:absolute;
    background-color:#cccccc;
    left:0px;
    top:59px;
    width:100%;
    height:20px;
}

#progress {
    position:absolute;
    right:0px;
    margin-left:-420px;
    top:0px;
    width:420px;
    height:20px;
}


#Table_corner {
    position:absolute;
    left:100%;
    top:0%;
    margin-left:-300px;
    width:0px;
    height:0px;
    z-index: 3;
}

#Top_Corner {
    position:absolute;
    left:0px;
    top:0px;
    width:300px;
    height:300px;
}
#Top_Corner {_display:none;}

.medium_window #Table_corner,.small_window #Table_corner {
    display: none;
}

#Close {
    position:absolute;
    right:2px;
    top:2px;
    width:20px;
    height:20px;
}
#Close img {
    filter: alpha(opacity=70);-moz-opacity:.70;opacity:.70;
}
#Close img:hover {
    filter: alpha(opacity=99);-moz-opacity:.99;opacity:.99;
}
#text_blob {
    min-height: 250px;
    padding: 5px;
    padding-top: 45px;
    padding-left: 90px;
}
#text_blob a {text-decoration: none;}

.text_blob_type_1 {
    filter: alpha(opacity=90);-moz-opacity:.90;opacity:.90;
    background: url(/home/interface/backgroundblob1.png) no-repeat;
}
.text_blob_type_1 p {margin-top: 4px;}
.text_blob_type_1 a {color: #111111;}
.text_blob_type_1 a:hover {color: black;}

.text_blob_type_2 {
    filter: alpha(opacity=95);-moz-opacity:.95;opacity:.95;
    background: url(/home/interface/backgroundblob2.png) no-repeat;
}
.text_blob_type_2 p {margin-top: 4px;}
.text_blob_type_2 a {color: #111111;}
.text_blob_type_2 a:hover {color: black;}

.text_blob_type_3 {
    filter: alpha(opacity=85);-moz-opacity:.85;opacity:.85;
    background: url(/home/interface/backgroundblob3.png) no-repeat;
}
.text_blob_type_3 p {margin-top: 4px;}
.text_blob_type_3 a {color: #dddddd;}
.text_blob_type_3 a:hover {color: white;}

.footer, .footer a {
    color: #750502;
}
.footer {
    background: url(/cotic_menu_05/decoration/footer_top_edge.gif) repeat-x top left #BCBCBC;
    margin-top: 19px;
    min-height: 100px;
    _height: 100px;
    padding-top: 10px;
    padding-bottom: 8px;
    cursor: pointer;
    overflow:hidden;
    -webkit-text-size-adjust: none;
}
.footer .newsList {
    padding-top: 5px;
}
.footer_plus {
    background: url(/cotic_menu_05/decoration/footer_bottom_edge.gif) repeat-x top left #666;
    padding: 10px 10px 15px 10px;
    margin-top: 0;
}
.footer_plus form {
    padding-bottom: 3px;
}
.footer_plus p,
.footer_plus blockquote
{
    color: white;
    -webkit-font-smoothing: antialiased;
    padding-left: 0;
    padding-right: 0;
    margin: 0 0 10px 0;
}
.footer_plus p {
    font-family: "Trade Gothic Bold", Arial, "Helvetica Neue", Helvetica, "Trade Gothic", Verdana, "Andale Mono", "Andale Mono IPA", Consolas, "Bitstream Vera Sans Mono", "Courier New", monospace;
    font-size: 0.9em;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    font-weight: normal;
    margin: 13px 0 13px 0;
}
.footer_plus blockquote {
    font-family: Gorgia;
    font-size: 1.2em;
    font-style: italic;
    margin-bottom: 1em;
}
.footer_plus blockquote::before { 
    content: open-quote;
    font-size: 2em;
    line-height: 0.1em;
    margin-right: 0.1em;
    vertical-align: -0.4em;
    color: #999;
    -webkit-text-size-adjust: none;
}
.footer_plus blockquote::after { 
    content: close-quote;
    font-size: 2em;
    line-height: 0.1em;
    vertical-align: -0.4em;
    color: #999;
    -webkit-text-size-adjust: none;
}
.footer a {
    filter: alpha(opacity=70);-moz-opacity:.70;opacity:.70;
    text-decoration: none;
    padding: 10px;
    font-family: "Trade Gothic Bold", Arial, "Helvetica Neue", Helvetica, "Trade Gothic", Verdana, "Andale Mono", "Andale Mono IPA", Consolas, "Bitstream Vera Sans Mono", "Courier New", monospace;
    font-size: 0.9em;
    letter-spacing: 0.02em;
    -webkit-font-smoothing: antialiased;
    text-transform: uppercase;
    font-weight: normal;
}
.footer a:hover {
    filter: alpha(opacity=99);-moz-opacity:.99;opacity:.99;
    text-decoration: underline;
}
.footer a img {
    vertical-align: top;
}
.footer, .footer div#models {
    min-height: 137px;
}
.footer div#credit {
    line-height: 22px;
    margin-top: -100px;
    margin-right: 20px;
    float: right;
}
@media screen and (max-width: 780px) {
    .footer div#credit {
        display: none;
    }
}

@media screen and (max-device-width: 667px) {
    /* mobile footers */
    .footer a {
        font-size: 2.2em;
    }
    .footer_plus p {
        font-size: 2.7em;
    }
    .footer_plus blockquote {
        font-size: 3.5em;
    }
    .footer .newsList a {
        padding-top: 20px;
        display: block;
    }
    .footer #credit {
        padding-top: 100px;
    }
    .footer #credit a {
        display: block;
        padding-top: 10px;
        padding-bottom: 10px;
    }
    .footer #models {
        display: none;
    }
}

#addtoany {
    display: none;
}

span.sharebuttons {
    color: #999;
    font-family: Arial, "Helvetica Neue", Helvetica, "Trade Gothic", Verdana, "Andale Mono", "Andale Mono IPA", Consolas, "Bitstream Vera Sans Mono", "Courier New", monospace;
}
.sharebuttons a.shareTwitter,
.sharebuttons a.shareFacebook {
    font-family: 'JustVector', arial, sans-serif;
    color: #ccc;
    speak: none;
    display: inline-block;
    border-radius: 3px;
    height: 16px;
    width: 18px;
    overflow: hidden;
    border: solid 1px #ccd;
    margin-top: 4px;
}
.sharebuttons a.shareUrl {
    color: #ccc;
    speak: none;
    display: inline-block;
    border-radius: 3px;
    height:16px;
    width: 18px;
    overflow: hidden;
    border: solid 1px #ccd;
    margin-top: 4px;
}
.sharebuttons a.shareTwitter:visited,
.sharebuttons a.shareFacebook:visited,
.sharebuttons a.shareUrl:visited {
    color: #ccc;
}
.sharebuttons a.shareTwitter {
    display: none;
}
.sharebuttons a.shareFacebook {
    font-size: 22px;
    padding: 6px 2px 0 6px;
}
.sharebuttons a.shareUrl {
    font-size: 17px;
    padding: 6px 4px 0 3px;
}
.sharebuttons a.shareFacebook:hover {
    background-color: white;
    border-color: #6D8BC9;
    color: #4E69A2;
}
.sharebuttons a.shareUrl:hover {
    background: white;
    border-color: #FF6600;
    color: #FF6600;
}

h2.newstitle {
    z-index: 1;
}

/* mobile */
@media only screen
    /* mobile sharebuttons */
    and (max-device-width : 667px) {
    span.sharebuttons {
        /* font-size: 1.2em; */
        float: right;
        margin-top: 20px;
        margin-right: -10px;
    }
    h2.newstitle:after {
        content: ".";
        visibility: hidden;
        display: block;
        height: 0;
        clear: both;
        float: none;
    }
    .sharebuttons a {
        width: 54px !important;
        margin-left: 10px;
    }
    .sharebuttons a.shareFacebook {
        height:48px;
        font-size: 66px;
        background-color: #ededed;
        border-color: #6D8BC9;
        color: #4E69A2;
        padding: 12px 2px 0 6px;
    }
    .sharebuttons a.shareUrl {
        height:48px;
        font-size: 44px;
        background: none; /* #ededed; */
        border-color: none; /* #FF6600; */
        color: #FF6600 !important;
        padding: 12px 2px 0 6px;
        margin-right: -3px;
    }
    .sharebuttons a.shareUrl:visited {
        color: #FF6600;
    }
}

.reading ul li.twitter,
.reading ul li.facebook,
.reading ul li.instagram,
.reading ul li.cc,
.reading ul li.flickr,
.reading ul li.pinterest,
.reading ul li.blank
{
    background: none;
    margin-bottom: 35px;
    width: 40%;
    display: inline-block;
}
.reading ul li.twitter,
.reading ul li.blank,
.reading ul li.cc {
    margin-bottom: 0;
}
.reading ul li.twitter:before,
.reading ul li.facebook:before,
.reading ul li.instagram:before,
.reading ul li.cc:before,
.reading ul li.flickr:before,
.reading ul li.pinterest:before,
.reading ul li.blank:before
{
    font-size: 350%;
    font-family: 'JustVector', arial, sans-serif;
    margin-right: 4px;
    speak: none;
    min-width: 40px;
    overflow: hidden;
}
.reading ul li.twitter:before {
    color: #55ACEE;
    content: "t";
}
.reading ul li.facebook:before {
    color: #4E69A2;
    content: "F";
}
.reading ul li.instagram:before {
/*    font-size: 270%;
    color: #EEF2F5;
    content: "(o)";
    font-family: 'proxima-nova', 'Helvetica Neue', Arial, Helvetica, sans-serif; */
}
.reading ul li.flickr:before {
    color: #ff0084;
    content: "n";
}
.reading ul li.cc:before {
    font-size: 315%;
    color: #eee;
    content: "cc";
    font-family: Arial, "Helvetica Neue", Helvetica, "Trade Gothic", Verdana, "Andale Mono", "Andale Mono IPA", Consolas, "Bitstream Vera Sans Mono", "Courier New", monospace;
}
.reading ul li.blank:before {
    color: #cccccc;
    content: "";
}

#droplink_models,
#soul_models,
#BFe_models,
#escapade_models
{
    position: absolute;
    top: 86px;
    background-color:white;
    opacity: 0.98;
    padding: 10px 0px;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    box-shadow: 0px 1px 3px 0px rgba(50, 50, 50, 0.53);
    z-index: 9;
}

#droplink_models {left: 320px}
#soul_models {left: 130px}
#BFe_models {display: none;}
#escapade_models {left: 550px}

#droplink_models a,
#soul_models a,
#BFe_models a,
#escapade_models a
{
    position: relative;
    cursor: pointer;
    display: inline;
}

#BFe_menu{margin-left:8px}

#escapade_models a
{
    font-size: 1.4em;
    color: #111;
}
#escapade_models a:hover
{
    text-decoration: none;
    color: black;
}

/* ---- mobile menus ---- */

#mobile_menu, .mobile_footer {
    font-size: 3em;
    color: #999999;
    -webkit-text-size-adjust: none;
    font-family: Arial, "Helvetica Neue", Helvetica, "Trade Gothic", Verdana, "Andale Mono", "Andale Mono IPA", Consolas, "Bitstream Vera Sans Mono", "Courier New", monospace;
    font-weight: bold;
}

#mobile_menu a, #mobile_menu a:visited {
    color: white;
    text-decoration: none;
}

#mobile_menu ul {
    position: relative;
    zoom: 1;
}

#mobile_menu ul li {
    list-style-type: none;
    padding: 50px 0 0 14px
}

#mobile_menu ul li:first-child {
    padding-top: 25px;
}

@media screen and (max-device-height: 750px) {
    #mobile_menu ul ul li {
        padding-top: 42px;
    }
}

@media screen and (max-device-height: 660px) {
    #mobile_menu ul ul li {
        padding-top: 30px;
    }
}

@media screen and (max-device-height: 500px) {
    #mobile_menu ul li {
        padding-top: 30px;
    }
    #mobile_menu ul ul li {
        padding-top: 25px;
    }
}

#mobile_menu ul li#mobile_home_link {
    padding-top: 0;
}

#mobile_menu ul li#mobile_order_link {
    padding-top: 60px;
}

#mobile_menu ul ul li {
/*    display: inline-block;
    width: 250px; */
    padding-left: 100px;
    font-size: 1em;
    text-transform: uppercase;
}

#mobile_menu ul ul li a , #mobile_menu ul ul li a:visited {
    color: #cccccc;
}

#mobile_menu ul li#mobile_product_range {
    background-color: #1b2259;
    margin-left: -0.6em; padding-left: 0.6em;
    margin-right: -0.6em; padding-right: 0.6em;
    margin-top: 50px; padding-bottom: 50px;
}


#mobile_menu_controller, #mobile_menu, .mobile_footer  {
    visibility: hidden;
    display: none;
}

.mysterymeat  {
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 9998;
    padding: 0.8em 1em 0em 0.6em;
    background: #060f3c;
	background: -webkit-linear-gradient(bottom right,#060f3c,#091252); /*Safari 5.1-6*/
	background: -o-linear-gradient(bottom right,#060f3c,#091252); /*Opera 11.1-12*/
	background: -moz-linear-gradient(bottom right,#060f3c,#091252); /*Fx 3.6-15*/
	background: linear-gradient(bottom right,#060f3c,#091252); /*Standard*/
	margin-top: -4px;
}

.mysterymeat.is-closed,
.mysterymeat.is-open  {
    display: none;
}

@media screen and (max-device-width: 667px) {
    #Table_menu, #Table_submenu1, #Table_corner, #twitter  {
        visibility: hidden;
        display: none;
    }
    #mobile_menu_controller  {
        visibility: visible;
        display: block;
    }
    #mobile_menu  {
        visibility: visible;
        display: block;
    }
    .mysterymeat.is-open  {
        display: block;
    }
    .mobile_footer  {
        visibility: visible;
        display: block;
    }
}

/* desktop always visable simple CTA */
.swatchnav a.BUY_button {
  position:fixed;
  top: 0;
  right: 0;
  margin-right: 10px;
  margin-top: 100px;
  z-index: 9;
}
/* desktop always visable simple CTA */
.swatchnav a.BUY_button {
  position:fixed;
  top: 0;
  right: 0;
  margin-right: 10px;
  margin-top: 100px;
  z-index: 9;
}

/* mobile footer with always visable simple CTA */
.mobile_footer {
    background: #BCBCBC;
    padding-top: 20px;
    padding-bottom: 130px;
}
.mobile_footer p {
    font-size: 42px;
}
.mobile_footer a.CTA_button,
.mobile_footer a.BUY_button,
.mobile_footer a.INFO_button,
.mobile_footer a.ASK_button,
.mobile_footer a.LEFT_button,
.mobile_footer a.RIGHT_button  {
    font-size: 50px;
    background-color: rgba(255, 102, 0, 0.77);
}
.mobile_footer a.CTA_button,
.mobile_footer a.BUY_button,
.mobile_footer a.RIGHT_button {
    position: fixed;
    bottom: 0;
    right: 0;
    margin-right: 10px;

    padding: 11px 10px 13px 10px;
}
.mobile_footer a.INFO_button,
.mobile_footer a.ASK_button,
.mobile_footer a.LEFT_button  {
    position: fixed; /* keep help prompt always on screen  */
    bottom: 0;
    left: 0;
    margin-left: 10px;
    padding: 11px 10px 13px 10px;
}
/* keep button clear of OS buttons */
.mobile_footer a.CTA_button,
.mobile_footer a.BUY_button,
.mobile_footer a.RIGHT_button,
.mobile_footer a.INFO_button,
.mobile_footer a.ASK_button,
.mobile_footer a.LEFT_button  {
    margin-bottom: 10px;
    margin-bottom: calc(10px + env(safe-area-inset-bottom));
}
/* for mobile Safari, keep button clear of iOS bottom */
@supports (-webkit-touch-callout: none) {
    .mobile_footer a.CTA_button,
    .mobile_footer a.BUY_button,
    .mobile_footer a.RIGHT_button,
    .mobile_footer a.INFO_button,
    .mobile_footer a.ASK_button,
    .mobile_footer a.LEFT_button  {
        margin-bottom: calc(10px + env(safe-area-inset-bottom) * 7 );
    }
}

#mobile_menu_masthead {
    padding: 3px 0 1px 3px;
}

/* stop iphone plus & X zooming in when in landscape mode */
@media screen and (max-device-width: 667px) and (min-device-height: 667px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 3) {
    html, body, #wrapper, #mobile_menu_masthead, #navigation-Endfill_mob  {
        min-width: 1668px;
    }
}
/* iphone X only */
@media screen and (max-device-width: 667px) and (min-device-height: 812px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 3) {
    html, body, #mobile_menu_masthead, #navigation-Endfill_mob  {
        min-width: 1990px;
    }
    #wrapper {
        min-width: 1890px;
        padding-left: 100px;
    }
}
/* all mobiles in landscape*/
@media screen and (max-device-width: 667px) and (orientation: landscape) {
    #mobile_menu ul li {
        padding-top: 20px;
    }
    #extrafries {
        display: none;
    }
}

#extrafries {
    position: absolute;
    right: 80px;
    top: 9px;
    font-family: Arial, "Helvetica Neue", Helvetica, "Trade Gothic", Verdana, "Andale Mono", "Andale Mono IPA", Consolas, "Bitstream Vera Sans Mono", "Courier New", monospace;
    font-size: 50px;
    color: white;
}


/* css cotic body style - white */
/* moved from body.v52.css */

*{padding: 0; margin: 0;}

html, body {
	color:#1A1A1A;
	font-family: "Helvetica Neue", Helvetica, Arial, Verdana, Gadget, sans-serif;
	font-size: 95%;
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	margin-right: 0px;
}
body {background-color:white;}
html {background-color:#BCBCBC;}
html.dark {background-color:#666666;}
#wrapper {background-color:white;}
@-moz-document url-prefix() {
	body {
		width:100%;
		overflow-x: hidden;
	}
}

p {
	margin-top: 1em;
	margin-bottom: 1em;
}

blockquote {
	margin-left: 15%;
	margin-right: 15%;
}

img {
	font-size: 0.8em;
	border: 0px;
}

.stretch {
	width:100%;
	height:auto;
}

td {border-collapse: collapse;} /* make IE behave normally for tables */

del {color: #999999;}

hr {
	border: 0; /* noshade */
	height: 6px;
	margin-top: 19px;
	margin-bottom: 16px;
    -webkit-box-shadow: 0px 6px 13px -1px rgba(0,0,0,0.05);
    -moz-box-shadow: 0px 6px 13px -1px rgba(0,0,0,0.05);
    box-shadow: 0px 6px 13px -1px rgba(0,0,0,0.05);
    background: white;
    border-bottom: #eee solid 1px;
}

hr.plain {
	background: #bbb;
	height: 1px;
	margin-top: 0;
	margin-bottom: 19px;
}


h1, h2, h3 {
	font-weight: normal;
	padding: 0;
	margin: 0;
}

.titles, h1, h2 {
	position:relative;
	font-family: "Helvetica Neue", Helvetica, Arial, Verdana, Gadget, sans-serif;
	font-size: 0.9em;
	left: 10px;
	width : 90%;
	margin-left: 20px;
}

.reading, .viewing {
	position:relative;
	font-family: "Helvetica Neue", Helvetica, Arial, Verdana, Gadget, sans-serif;
	font-size: 0.9em;
	left: 50%;
	margin-left: -300px;
	width: 600px;
	text-align: justify;
}
.width660 {
	left: 50%;
	margin-left: -330px;
	width: 660px;
}
.medium_window .width660 {
	left: 10px;
	margin-left: 0;
	width : 96%;
}
.small_window .width660 {
	left: 10px;
	margin-left: 0;
}
.small_window .reading, .small_window .viewing {
	left: 10px;
	margin-left: 0;
	width : 96%;
}

.reading2, .buy, .availability
{
	font-family: "Helvetica Neue", Helvetica, Arial, Verdana, Gadget, sans-serif;
	font-size: 0.9em;
}

.buy {
	right: 10px;
	background: #bbb;
}

.buy, .availability, .financemodal {
	position: absolute;
	top: 100px;
	width: 200px;
	z-index: 10;
	padding-left: 10px;
	padding-right: 10px;
	opacity: 0.90;
}
.availability {
    width: 500px;
    z-index: -11;
    left: 50%;
    margin-left: -250px;
    background: #dddddd;
	opacity: 0.98;
}
.financemodal {
    width: 660px;
    z-index: -11;
    left: 50%;
    margin-left: -330px;
    background: #ccc;
    opacity: 0.99;
}

.availability.modal {
    border: 1px solid #ff6600;
    -webkit-box-shadow: 14px 52px 148px 22px rgba(0,0,0,0.75);
    -moz-box-shadow: 14px 52px 148px 22px rgba(0,0,0,0.75);
    box-shadow: 14px 52px 148px 22px rgba(0,0,0,0.75);
    display: none
}

.financemodal.modal {
    border: 1px solid #ff6600;
    -webkit-box-shadow: 14px 52px 148px 22px rgba(0,0,0,0.75);
    -moz-box-shadow: 14px 52px 148px 22px rgba(0,0,0,0.75);
    box-shadow: 14px 52px 148px 22px rgba(0,0,0,0.75);
}
.availability th,
.availability td
{
    padding: 4px;
}
.availability th:first-child,
.availability td:first-child
{
    width: 400px;
}
.availability tr:nth-child(even) td:first-child {background: #EEE}
.availability tr:nth-child(odd) td:first-child {background: #FFF}

.availability h2,
.financemodal h2 {
    font-weight: bold;
    text-transform: uppercase;
    font-size: 2em;
    padding: 0;
    left: 2px;
}
#check_availability {display: none;}
#show_finance {display: none;}

/* keep modals on screen, if window big enough */
/* @media screen and (min-height: 860px) { used when too many Jeht options */
@media screen and (min-height: 680px) {
    .availability.modal, .financemodal.modal {
        position: fixed;
        top: 20px;
    }
}
/* @media screen and (min-height: 790px) {
    .availability.modal, .financemodal.modal {top: 40px;}
}
@media screen and (min-height: 850px) {
    .availability.modal, .financemodal.modal {top: 95px;}
}
@media screen and (min-height: 880px) {
    .availability.modal, .financemodal.modal {top: 115px;}
} */

@media screen and (min-height: 880px) {
    .availability.modal, .financemodal.modal {top: 90px;}
}
@media screen and (min-height: 920px) {
    .availability.modal, .financemodal.modal {top: 110px;}
}

.thirdnav.narrow {min-width: 79px}
.thirdnav {min-width: 103px}
.buy hr, .thirdnav hr {margin-left:-10px;margin-right:-10px; }
.thirdnav a {
	color: #eee;
	text-decoration: none;
	cursor: pointer;
}
.thirdnav a img {
    border-radius: 8px;
}
.thirdnav a:hover {
	color: white;
}
.thirdnav a:hover img {
	opacity: 0.8
}
.thirdnav .current a {
	color: black;
	cursor: default;
}
.thirdnav .current a:hover img {
	opacity: 1
}

.reading a, .reading2 a, .titles a, h1 a, h2 a, h3 a, .buy a {
	text-decoration: none;
	color: #000090;
}
.reading a:visited, .reading2 a:visited, .titles a:visited, h1 a:visited, h2 a:visited, h3 a:visited, .buy a:visited {
	text-decoration: none;
	color: #68204D;
}
.reading a:hover, .reading2 a:hover, .titles a:hover, h1 a:hover, h2 a:hover, h3 a:hover, #TB_window a:hover, .buy a:hover {
	text-decoration: none;
	background: transparent url(/cotic_menu_05/decoration/orangepixel.gif) repeat-x 0 1em;
	color: #000000;
}

/* bullet point styling override for most browsers (IE has conflict with PNG fix) */
.reading ul, [dummy] {
	list-style: none;
	margin: .5em 0 .5em 0; 
	padding: 0px;
}
.reading ul li, [dummy] {
	line-height: 1.3em;
	padding-left: 1.0em;
	padding-top: 0.3em;
	padding-bottom: 0.3em;
	background: transparent url(/cotic_menu_05/decoration/square.gif) no-repeat 2px 0.8em;
}
.reading ul ul {
	margin: .5em 0 .5em 1em; 
}
.reading ul li.clear, [dummy] {background-image: url();}
/* end of bullet point styling */

.reading ul.size_controls ul {
	margin: .5em 0 0 1em; 
}

.reading span.cotic-logo {
	display: inline-block;
	_display: inline;
	outline: none;
	text-indent: -5000px;
	background: url(/cotic_menu_05/decoration/cotic_tiny.png) no-repeat;
	width: 85px;
	height: 12px;
	vertical-align: -10%;
}

.magquote {
	font-style: italic;
	font-weight: 600;
	font-size: 1em;
}

.magname {
	color: #444444;
}

.cyquote {
	font-style: italic;
	font-weight: 600;
	font-size: 0.8em;
	background-color: #c1cfdb;
	padding: 0 7px;
	border-radius: 5px;
}
.samquote {
	font-style: italic;
	font-weight: 600;
	font-size: 0.8em;
	background-color: #c2dcce;
	padding: 0 7px;
	border-radius: 5px;
}
.teamquote {
	font-style: italic;
	font-weight: 600;
	font-size: 0.8em;
	background-color: #c6e0c5;
	padding: 0 7px;
	border-radius: 5px;
}

.buildkit,
.boxout {
	padding: 7px 7px 7px 10px;
	border-radius: 1px;
	display: block;
	margin-bottom: 8px;
	background-color: #efefef;
}
.boxout {
	padding: 10px 30px 10px 30px;
	margin: 0 -30px 0px -30px;
	background-color: #f9f9f9;
	padding-bottom: 15px;
}
.boxout.quiet {
	background-color: #fafafa;
}
.boxout.whitebox, .boxout.loud.whitebox {
	background-color: #fff;
}

.boxout hr {
	height: 1px;
	margin-top: 0;
	margin-bottom: 12px;
}
.boxout hr,
.boxout iframe {
	background: #eaeaea;
	margin-left: -30px;
	margin-right: -30px;
}

.buildkit > strong,
.boxout > strong,
.boxout.loud p {
    font-family: "Trade Gothic Bold", "Helvetica Neue", Helvetica, Arial, "Trade Gothic", Verdana, "Andale Mono", "Andale Mono IPA", Consolas, sans-serif;
    font-weight: normal;
    font-style: normal;
    font-size: 1.5em;
}
.boxout.loud p {
    text-transform: uppercase;
}
.boxout > strong {
    display: block;
    text-align: center;
}
.boxout.loud p strong {
    text-transform: initial;
    font-weight: normal;
    color: black;
    font-size: 1.4em;
}

.buildkit.silver { background-color:#BCC6CC; }
.buildkit.gold { background-color: #EDDA74; }
.buildkit.platinum { background-color: #e6e5e3; }
.buildkit.bronze { background-color: #BBA37D; }
.buildkit.custom { background-color: #dedede; }
.buildkit.specialedition { border: #ff6600 solid 1px; }

.buildkit .upgrade { color: #FF6600; }
.buildkit.gold  .upgrade { color: #3d4fb2; }
.buildkit.silver  .upgrade { color: #D05300; }
.buildkit.bronze  .upgrade { color: #3F2FBB; }

.boxout.loud {
	background-color: #f0f0f0;
	color: #333333;
	text-align: center;
	margin-top: -05px;
	font-weight: bold;
    letter-spacing: 0.02em;
}
@media screen and (max-width: 1020px) {
	.boxout {
		margin: 0;
	}
	.boxout.loud {
		margin-top: 10px;
	}
}
.boxout.loud > p {
	margin-top: 0;
	margin-bottom: 0;
}

.boxout.summary {
	background-color: #eeeeee;
	font-weight: bold
}
.boxout.summary > p {
	margin-top: 0;
}

.boxout.summary > p,
.boxout.droplink > p,
.boxout.MAX > p,
.boxout.bikeorframe > p:last-child,
.boxout.dark > p:last-child,
div#reviews.boxout > p:last-child  {
	margin-bottom: -3px;
}

.boxout.demo {
	background-color: #f0f0f0;
}
.boxout.dark {
	background-color: #f0f0f0;
}
.boxout.nobox {
    background-color: white;
}
.boxout.expand {
    background-color: white;
    padding: 10px;
}
.boxout.expand:first-of-type  {
    margin-bottom: 60px;
}

div#slideshow.boxout {
    padding: 0;
}

.sign {
	text-align: right;
	color: #444444;
	font-size: 1.2em;
}

.emailquote {
	font-family: Consolas, "Courier New", monospace;
	font-weight: normal;
	font-size: 1em;
	color: black;
	background-color: white;
	padding: 8px;
	padding-bottom: 13px;
	background: url(/cotic_menu_05/decoration/shadow_orange_full.png) no-repeat bottom right;
	background: url(/cotic_menu_05/decoration/shadow_white_full.png) no-repeat bottom right;
	_background: url(/cotic_menu_05/decoration/shadow_white_full.gif) no-repeat bottom right;
}

.linkon, h3 {
	position:relative;
	font-family: "Helvetica Neue", Helvetica, Arial, Verdana, Gadget, sans-serif;
	font-size: 0.9em;
	right: 10px;
	text-align: right;
}
.linkon a, h3 a {
	text-decoration: none;
	color: #28328D;
}
.linkon a:hover, h3 a:hover {
	text-decoration: none;
	background: transparent url(/cotic_menu_05/decoration/orangepixel.gif) repeat-x 0 1em;
	color: #000000;
}

.smallprint {
	font-family: "Helvetica Neue", Helvetica, Arial, Verdana, Gadget, sans-serif;
	font-size: 0.8em;
	-webkit-text-size-adjust: none;
	-ms-text-size-adjust: 100%;
}

.save {color: #F10000;}
.new {color: #F10000;}
.orange {color: #FF6600;}
.orangeback {background-color: #FF6600; color: black; padding-left:5px; padding-right: 5px; padding-bottom: 1px;}
.blackback {background-color: black; color: #FF6600; padding-left:5px; padding-right: 5px; padding-bottom: 1px;}
.hilite {background-color: #89C777; border-radius: 2px;}
.emote {background-color: #FF6600; color: white; padding-left:5px; padding-right: 5px;}


.info a {
	text-decoration: none;
	color: #121F41;
}
.info a:hover {
	text-decoration: none;
	background: white url(/cotic_menu_05/decoration/blank.gif) repeat-x 0 1em;
	color: #000000;
}

.photos {
	padding: 20px;
	background: white;
	border-left: 20px solid #cccccc;
	border-right: 20px solid #cccccc;
}

.photos img {
	border: 10px solid #000000;
}

.photos img:hover {
	border: 10px solid #ff6600;
}

div.photocombo, div.photocombogrey {
	padding-top: 1em;
}

.photocombo img, .photocombo iframe {
/*	border-top: solid 3px white; */
	margin-left: 1px;
	margin-right: 2px;
	padding-bottom: 13px;
	padding-top: 3px;
	padding-left: 3px;
	padding-right: 3px;
	background: url(/cotic_menu_05/decoration/shadow_orange_full.png) no-repeat bottom right;
	background: url(/cotic_menu_05/decoration/shadow_white_full.png) no-repeat bottom right;
	_background: url(/cotic_menu_05/decoration/shadow_white_full.gif) no-repeat bottom right;
}
.photocombo a img:hover {
/*	border-top: solid 3px #ff6600; */
	background: url(/cotic_menu_05/decoration/shadow_orange_full.png) no-repeat bottom right;
	_background: url(/cotic_menu_05/decoration/shadow_orange_full.gif) no-repeat bottom right;
}

.photocombogrey img {
/*	border-top: solid 3px white; */
	margin-top: 10px;
	margin-left: 1px;
	margin-right: 2px;
	padding-bottom: 13px;
	padding-top: 3px;
	padding-left: 3px;
	padding-right: 3px;
	background: url(/cotic_menu_05/decoration/shadow_orange_full.png) no-repeat bottom right;
	background: url(/cotic_menu_05/decoration/shadow_grey_full.png) no-repeat bottom right;
	_background: url(/cotic_menu_05/decoration/shadow_white_full.gif) no-repeat bottom right;
}
.photocombogrey a img:hover {
/*	border-top: solid 3px #ff6600; */
	background: url(/cotic_menu_05/decoration/shadow_orange_full.png) no-repeat bottom right;
	_background: url(/cotic_menu_05/decoration/shadow_orange_full.gif) no-repeat bottom right;
}

/* on mobiles, stop big images breaking the layout */
.reading p img, .viewing img, center img  { max-width: 100%; height: auto; }
.photocombo img, .photocombogrey img, .photos img  { max-width: 90%; height: auto; }

/* on mobiles, stop long URLs breaking the layout */
.reading a, h3 a {
	white-space: pre;           /* CSS 2.0 */
	white-space: pre-wrap;      /* CSS 2.1 */
	white-space: pre-line;      /* CSS 3.0 */
	white-space: -pre-wrap;     /* Opera 4-6 */
	white-space: -o-pre-wrap;   /* Opera 7 */
	white-space: -moz-pre-wrap; /* Mozilla */
	white-space: -hp-pre-wrap;  /* HP Printers */
	word-wrap: break-word;      /* IE 5+ */
}

.width20 img {
    width: 19.2%;
    height: auto;
    margin: 0.4%
}
.no_borders .width20 img {
    width: 20%;
    margin: 0
}
.width25 img {
    width: 24.2%;
    height: auto;
    margin: 0.4%
}
.no_borders .width25 img {
    width: 25%;
    margin: 0;
}
.width50 img {
    width: 49.2%;
    height: auto;
    margin: 0.4%
}
.no_borders .width50 img {
    width: 50%;
    margin: 0%
}
.width33 img {
    width: 32.53%;
    height: auto;
    margin: 0.4%
}
.no_borders .width33 img {
    width: 33%;
    margin: 0%
}
@media screen and (max-width: 1000px) {
    .width20 img, .width25 img {width: 49.2%;}
    .width50 center img {width: 99.2%;}
    .no_borders .width20 img, .no_borders .width25 img {width: 50%;}
    .no_borders .width50 center img {width: 100%;}
}
@media only screen 
    /* mobile only */
    and (max-device-width : 667px) {
    .width50 center img {width: 99.2%;}
    .no_borders .width50 center img {width: 100%;}
}
@media screen and (max-width: 700px) {
    .width33 img {width: 99.2%;}
    .no_borders .width33 img {width: 100%;}
}
@media screen and (max-width: 500px) {
    .width20 img, .width25 img, .width50 img {width: 99.2%;}
    .no_borders .width20 img, .no_borders .width25 img, .no_borders .width50 img {width: 100%;}
}

.yellowonblack {
    background: black;
    color: #FFE01F;
}

.fullwidth img {
    width: 99.2%;
    height: auto;
    margin: 0.4%
}
.no_borders .fullwidth img {
    width: 100%;
    margin: 0;
}

.fullwidth  img#hero,
.fullwidth  img.extrahero {
    width: 100%;
    min-width: 900px;
    margin: 0;
}
.fullwidth  img#mobilehero {
    width: 100%;
    margin: 0;
}

.fullwidth span.reveal {
    width: 100%;
    display: block;
    background-size: cover;
}

.fullwidth .reveal img {
    opacity: 1;
    -moz-transition: opacity .2s linear;
    -webkit-transition: opacity .2s linear;
    transition: opacity .2s linear;
/*    -moz-transition-delay: 1s;
    -webkit-transition-delay: 1s;
    transition-delay: 1s; */
}

.fullwidth .reveal img:hover {
    opacity: 0;
}

.fullwidth h1 {
    padding: 5% 0 0 0;
    margin: 0 5% 5% 5%;
    font-family: "Trade Gothic Bold", "Helvetica Neue", Helvetica, Arial, "Trade Gothic", Verdana, "Andale Mono", "Andale Mono IPA", Consolas, sans-serif;
    font-weight: normal;
    font-style: normal;
    font-size: 3.5em;
    -webkit-font-smoothing: antialiased;
    text-transform: uppercase;
    left: 0;
}

.fullwidth h2 {
    margin: 5% 5% 5% 5%;
    font-family: "Trade Gothic Bold", "Helvetica Neue", Helvetica, Arial, "Trade Gothic", Verdana, "Andale Mono", "Andale Mono IPA", Consolas, sans-serif;
    font-weight: normal;
    font-style: normal;
    font-size: 3.5em;
    -webkit-font-smoothing: antialiased;
    text-transform: uppercase;
    left: 0;
}

.fullwidth p,
.width25 p,
.width33 p,
.width50 p {
    margin: 3% 10% 3% 10%;
    font-family: Arial, "Helvetica Neue", Helvetica, "Trade Gothic", Verdana, "Andale Mono", "Andale Mono IPA", Consolas, "Bitstream Vera Sans Mono", "Courier New", monospace;
    font-weight: bold;
    font-size: 2.1em;
    letter-spacing: 0.01em;
    -webkit-font-smoothing: antialiased;
    text-transform: uppercase;
    -ms-text-size-adjust: 150%;
}

.fullwidth p.smallprint,
.width25 p.smallprint,
.width33 p.smallprint,
.width50 p.smallprint {
    margin: 0;
    font-size: 1em;
    letter-spacing: 0.01em;
}
.fullwidth p.caption,
.width25 p.caption,
.width33 p.caption,
.width50 p.caption {
    margin: 2px 0 25px 0;
}

.fullwidth a,
.fullwidth a:visited {
    text-decoration: none;
    color: #ff6600;
}

.fullwidth a:hover {
    text-decoration: underline;
}

/* bullet point styling override for most browsers (IE has conflict with PNG fix) */
.fullwidth ul, [dummy] {
	list-style: none;
	margin: 0 10% 0 15%; 
	padding: 0px;
}
.fullwidth ul li, [dummy] {
    font-family: "Trade Gothic Bold", "Helvetica Neue", Helvetica, Arial, "Trade Gothic", Verdana, "Andale Mono", "Andale Mono IPA", Consolas, sans-serif;
    font-weight: normal;
    font-style: normal;
    font-size: 1.5em;
    -webkit-font-smoothing: antialiased;
    text-transform: uppercase;
    -ms-text-size-adjust: 150%;
	line-height: 1.3em;
	padding-left: 1.0em;
	padding-top: 0.1em;
	padding-bottom: 0.1em;
	background: transparent url(/cotic_menu_05/decoration/square_big.gif) no-repeat 2px 0.6em;
}
.fullwidth ul ul {
	margin: .5em 0 .5em 1em; 
}
@media screen and (min-width: 1050px) {
    .fullwidth.droplink ul, [dummy] {
        margin-left: 10%; 
    }
    .fullwidth.droplink ul li, [dummy] {
        display: inline;
        padding-left: 0.6em;
        padding-right: 0.6em;
    }
}
@media screen and (min-width: 1070px) {
    .fullwidth.droplink ul, [dummy] {
        margin-left: 10%; 
    }
    .fullwidth.droplink ul li, [dummy] {
        display: inline;
        padding-left: 0.7em;
        padding-right: 0.7em;
    }
}
@media screen and (min-width: 1100px) {
    .fullwidth.droplink ul, [dummy] {
        margin-left: 10%; 
    }
    .fullwidth.droplink ul li, [dummy] {
        display: inline;
        padding-left: 0.8em;
        padding-right: 0.8em;
    }
}
@media screen and (min-width: 1200px) {
    .fullwidth.droplink ul, [dummy] {
        margin-left: 15%; 
    }
    .fullwidth.droplink ul li, [dummy] {
        display: inline;
        padding-left: 0.8em;
        padding-right: 0.8em;
    }
}
.fullwidth ul li.clear, [dummy] {background-image: url();}
/* end of bullet point styling */

.fullwidth strong,
.width25 strong,
.width33 strong,
.width50 strong {
    text-transform: initial;
    font-weight: normal;
}
.fullwidth h1 strong,
.fullwidth h2 strong {
    text-transform: initial;
    font-weight: normal;
}

.fullwidth.droplink {margin-top: -10px;}

.fullwidth.droplink strong {
    display: inline-block;
    text-transform: initial;
    font-size: 1.4em;
    letter-spacing: 0;
    margin: -10px 0 0 0;
}

.fullwidth.droplink span {
    display:inline-block;
    background:url(/cotic_menu_05/decoration/MAX_logo.png) no-repeat top left;
    background-size: contain;
    font-size: 0px;
    height: 28px;
    width: 115px;
    vertical-align: middle; 
}

.fullwidth.droplink em {
    display:inline-block;
    background:url(/cotic_menu_05/decoration/droplink_logo_black.png) no-repeat top left;
    background-size: contain;
    font-size: 0px;
    height: 48px;
    width: 175px;
    vertical-align: middle; 
    margin: -15px -4px -15px 0;
}
.fullwidth.droplink h2 em {
    height: 68px;
    width: 250px;
}
.fullwidth.droplink b {
    font-weight: normal;
}

.captions {
	font-family: "Helvetica Neue", Helvetica, Arial, Verdana, Gadget, sans-serif;
	font-size: 0.8em;
	margin-bottom: -5px;
	text-align: center;
	font-style: normal
	font-weight: normal
}

.biggerer {font-size: 1.2em;}

/* NOT mobile */
@media only screen 
    /* profile and about page */
    and (min-device-width : 668px) {
        .shift_window_1 .keep_clear {width: 620px !important}
        .shift_window_2 .keep_clear {width: 590px !important}
        .shift_window_3 .keep_clear {width: 550px !important}
        .shift_window_4 .keep_clear {width: 500px !important}
        .shift_window_5 .keep_clear {width: 450px !important}
        .small_window .keep_clear,
        .medium_window .keep_clear
        {width: 350px !important}
}

.section {
	border: solid #1A1A1A 4px;
	padding: 10px;
	margin-top: 10px;
	background: #cccccc;
}

.sections_1 {
	background:#eeeeee;
	border-top: solid 30px #eeeeee;
	border-bottom: solid 40px #eeeeee;
}

.sections_2 {
	padding-top:30px;
	padding-bottom:40px;
}

.sections_2 .section {
	border: none;
	padding: 10px;
	margin-top: 10px;
	background: #999999;
}

.sections_3 {
}
.sections_3 .section {
	border: none;
	background: #bbbbbb;
	padding-top: 40px;
	margin-top: 40px;
}
.sections_3 .bontrager {
	background: url(/order/interface/headers/bontrager.gif) no-repeat #bbbbbb;
}
.sections_3 .use {
	background: url(/order/interface/headers/use.gif) no-repeat #bbbbbb;
}
.sections_3 .magura {
	background: url(/order/interface/headers/magura.gif) no-repeat #bbbbbb;
}
.sections_3 .hope {
	background: url(/order/interface/headers/hope.gif) no-repeat #bbbbbb;
}
.sections_3 .cotic {
	background: url(/order/interface/headers/cotic_sq.gif) no-repeat #bbbbbb;
}
.sections_3 .roadrat {
	background: url(/order/interface/headers/roadrat.gif) no-repeat #bbbbbb;
}
.sections_3 .canecreek {
	background: url(/order/interface/headers/canecreek.gif) no-repeat #bbbbbb;
}
.sections_3 .sub_section {
	border: none;
	background: #bbbbbb;
	padding-top: 10px;
	margin-top: 10px;
}

.section_width660 {
	left: 50%;
	margin-left: -330px;
	width: 640px;
}
.small_window .section_width660 {
	left: 10px;
	margin-left: 0;
}

.cards {
	margin: 14px;
	padding: 10px;
	background: #aaaaaa;
	width: 6em;
}

.igallery {
	text-align: center;
}
.igallerywide {
	text-align: center;
}

.iframe660 {
	text-align: center;
}
.iframe600 {
	text-align: center;
}
.iframe460 {
	text-align: center;
}

.caption {
	text-align: center;
}

.blacksection {
	background: black;
	color: white;
}
.blacksection a {
	color: #FF6600;
}
.blacksection a:visited {
	color: #D4419C;
}
.blacksection a:hover {
	color: white;
}

.greysection {
	background: #B9B9B9;
}

.whitesection {
	background: white;
	color: black;
}
.whitesection a {
	color: #FF6600;
}
.whitesection a:visited {
	color: #D4419C;
}
.whitesection a:hover {
	color: black;
}

.button_1,
.button_2,
.button_3
{z-index: 999;}


.button_1 img {
	background: #000000;
}
.button_1 img:hover {
	background: #ff6600;
}

.button_2 img {
	background: #999999;
}
.button_2 img:hover {
	background: #ff6600;
}

a.button_3,
a.button_4,
a.button_5,
input.button_5,
a.button_6,
a.button_7,
a.button_8
{
    /* buttons using text not images */
	color: white;
    font-family: "Trade Gothic Bold", Arial, "Helvetica Neue", Helvetica, "Trade Gothic", Verdana, "Andale Mono", "Andale Mono IPA", Consolas, "Bitstream Vera Sans Mono", "Courier New", monospace;
    font-weight: normal;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    text-decoration: none;
	display: block;
	text-align: center;
    cursor: pointer;
    transition: all .2s ease-out;
}
a.button_3:visited,
a.button_4:visited,
a.button_5:visited,
input.button_5:visited,
a.button_6:visited,
a.button_7:visited,
a.button_8:visited
{
	color: white;
}
a.button_3 {
    /* text version of button_1 */
	background: #000000;
    font-size: 2.5em;
    line-height: 1em;
	padding: 5px 0 8px 0;
    width: 100%;
}
a.button_4 {
    /* version of button_3 for longer text */
	background: #000000;
    font-size: 1.2em;
    line-height: 1em;
	padding: 6px 0 6px 0;
    width: 100%;
}
a.button_5,
input.button_5,
a.button_6,
a.button_7,
a.button_8
{
    /* small buttons */
    font-size: 1.1em;
    line-height: 1em;
	padding: 6px 0 6px 0;
    width: 9em;
}
a.button_5,
input.button_5 {
    /* small version of button_3 */
	background: #000000;
}
a.button_6 {
    /* slight varient on small button */
	background: #000000;
}
a.button_7 {
    /* spare small button syle */
	background: #999999;
}
a.button_8 {
    /* disabled small button */
	background: #999999;
	color: #fafafa;
	cursor: not-allowed
}

a.button_3:hover,
a.button_4:hover,
a.button_5:hover,
input.button_5:hover,
a.button_6:hover,
a.button_7:hover
{
	background: #ff6600;
	color: white;
	text-decoration: none;
}
a.button_8:hover
 {
	background: #999999;
	color: white;
}

a.button_3:hover .orange,
a.button_4:hover .orange,
a.button_5:hover .orange,
input.button_5:hover .orange,
a.button_6:hover .orange,
a.button_7:hover .orange,
a.button_8:hover .orange
{	color: black;}

.rear_element {
	position:absolute;
	z-index: 0;
}
.front_element {
	position:absolute;
	z-index: 1;
}

.nowrap {
	white-space: nowrap;
}

.sidelogo,
.sidephoto
{
    margin: -35px 0 -15px -15px;
    width: 200px;
    height: 200px;
}
.sidephoto {
    margin: -20px 0 -5px 5px;
	box-shadow: 0 2px 2px 2px rgba(0,0,0,0.15);
}

@media only screen and (max-width: 720px) {
    .sidelogo {margin: -35px 0 -15px 80px;}
}

@media only screen and (max-width: 780px) {
    .sidephoto {margin: -20px 0 -5px 120px;}
}

@media only screen and (min-width: 900px) {
    .sidelogo {margin: 0 0 -220px -200px;}
    .sidephoto {margin: 15px 0 -300px -220px;}
}

@media only screen and (min-width: 940px) {
    .sidelogo {
         margin: 0 0 -220px -220px;
    }
}

.newsvideo {
    margin: 8px 0 0 0;
    background: black;
    padding: 10px 52px;
    border-radius: 5px;
}

.fullwidthvideo { position: relative; padding-bottom: 45.25%; height: 0; overflow: hidden; max-width: 100%; background: black; }
.fullwidthvideo iframe,
.fullwidthvideo object,
.fullwidthvideo embed
{ position: absolute; top: 0; left: 10%; width: 80%; height: 100%; }

@media only screen and (max-width: 1050px) {
    .fullwidthvideo { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; background: black; }
    .fullwidthvideo iframe,
    .fullwidthvideo object,
    .fullwidthvideo embed
    { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
}

@media only screen and (min-width: 1350px) {
    .fullwidthvideo { position: relative; padding-bottom: 42.25%; height: 0; overflow: hidden; max-width: 100%; background: black; }
    .fullwidthvideo iframe,
    .fullwidthvideo object,
    .fullwidthvideo embed
    { position: absolute; top: 0; left: 12%; width: 76%; height: 100%; }
}

.biglinks {
    padding: 40px 20px 40px 40px;
    font-size: 250%;;
}

.biglinks a {
    display: block;
}

/* css staff and about profile style */
/* extended to use on item pages */

.profilePhoto img { width: 50%; }

.itemPhoto img {
    width: 49%;
    box-shadow: 0px 6px 13px -1px rgba(0,0,0,0.03);
    border: #eee solid 1px;
    border-left: 0;
    margin-left: 0.4%;
}

a.aboutPhoto  {
    clear: both;
    float: right;
    margin: 3px 0 3px 15px;
    border: 1px solid white;
	box-shadow: 0 2px 2px 2px rgba(0,0,0,0.15);
}

a.aboutPhoto:hover  {
    border: 1px solid #ff6600;
}

.aboutPhoto img {
    width: 75px;
    height: 75px;
}

.profile,
.itemInfo {
    width: 50%;
    float:left;
    font-family: Arial, "Helvetica Neue", Helvetica, "Trade Gothic", Verdana, "Andale Mono", "Andale Mono IPA", Consolas, "Bitstream Vera Sans Mono", "Courier New", monospace;
    font-size: 12pt;
    background: white;
    padding-bottom: 15px;
}

.profile p,
.profile ul,
.profile h1,
.profile h2,
.itemInfo p,
.itemInfo ul,
.itemInfo h1,
.itemInfo h2
{
    padding: 10px;
}

.itemInfo p {margin: 20px;}

.profile h1,
.profile h2,
.profile h1,
.profile h2,
.itemInfo h1,
.itemInfo h2,
.itemInfo h1,
.itemInfo h2
{
    font-family: "Trade Gothic Bold", "Helvetica Neue", Helvetica, Arial, "Trade Gothic", Verdana, "Andale Mono", "Andale Mono IPA", Consolas, sans-serif;
    font-size: 2em;
    left: 0;
    width: auto;
    text-transform: uppercase;
}
.profile h2,
.itemInfo h2 {
    font-size: 1.8em;
    padding-bottom: 25px;
}

@media screen and (max-width: 680px) {
    .profilePhoto img, .profile, .itemPhoto img, .itemInfo {width: 100%;}
    .itemPhoto img {border: none; border-bottom: #eee solid 1px; margin-left: 0;}
}

.profile strong
{
    font-weight: normal;
    color: #FF6600;
}


/* bullet point styling */
.profile ul {
	list-style: none;
	margin: 0 15px 0 15px; 
	padding: 0px;
}
.profile ul li {
    -webkit-font-smoothing: antialiased;
    -ms-text-size-adjust: 150%;
	line-height: 1.5em;
	padding-left: 1.0em;
	padding-top: 0.1em;
	padding-bottom: 0.1em;
	background: transparent url(/cotic_menu_05/decoration/square_big.gif) no-repeat 2px 0.6em;
}

@media screen and (max-width: 980px) {
    /* line breaks */
    .profile ul li {line-height: 1em; padding-bottom: 0.8em;}
    .profile strong::after {content: "\A"; white-space: pre;}
}

/* mobile */
@media only screen 
    /* profile and about page + item  */
    and (max-device-width : 667px) {
    .profilePhoto img, .profile, .itemPhoto img, .itemInfo {width: 100%;}
    .itemPhoto img {border: none; border-bottom: #eee solid 1px; margin-left: 0;}
    .profile, .itemInfo {font-size: 32pt;}
    .profile p, .profile ul, .itemInfo p {padding-left: 20px; padding-right: 20px;}
    .profile ul {padding-top: 0.8em;}
    _:-webkit-full-screen, :root .profile ul strong {max-width:600px; display:block;} /* droid fix */
    a.aboutPhoto  {margin: 8px 0 8px 30px;}
    .aboutPhoto img {width: 300px; height: 300px;}
    /* line breaks */
    .profile ul li {line-height: 1em; padding-bottom: 0.8em;}
    .profile strong::after {content: "\A"; white-space: pre-wrap;}
    
    /* sitewide */
    .reading, .viewing, .titles, h1, h2, h3, .linkon {font-size: 30pt; -webkit-text-size-adjust: none; }
    .reading {font-size: 26pt; -webkit-text-size-adjust: none; line-height: 1.7;}
     h3, .linkon {font-size: 24pt;}
    .reading, .viewing {margin-left: -400px; width: 800px;}
    .smallprint, #TB_window {font-size: 20pt;}
    .titles {font-weight: bold; margin-bottom: 20px;}
    
    .reading.socialmedialinks a {
        -webkit-text-size-adjust: none;
        font-size: 24px;
    }
    
    hr {margin-bottom: 45px; margin-top: 45px;}
    
    /* on order pages, scale up sections for mobile */
    div.section.scaleable {
        transform:scale(1.3);
        -webkit-transform:scale(1.3);
        transform-origin:0 0;
        -webkit-transform-origin:0 0;
        margin-bottom: 300px;
        margin-top: 100px;
    }

    blockquote {
        margin-left: 2%;
        margin-right: 9%;
    }

    /* on product pages, make better use of screen width */
    .boxout {
        padding: 10px 45px 15px 45px;
        margin: 0 -50px 0px -50px;
    }
    .buildkit {
        padding: 10px 25px 15px 25px;
        margin: 10px -50px 10px -50px;
        line-height: normal;
    }
    .buildkit > strong,
    .boxout > strong,
    .boxout.loud p {
        font-size: 1.3em;
        letter-spacing: 0.07em;
        line-height: normal;
    }
    /* big text on mobile */
    div.reading.bit * {font-size: 26pt !important;}
    div.bit .reading * {font-size: 26pt !important;}
    div.reading.twocols * {font-size: 26pt !important;}
    div.reading.twocols * {font-size: 26pt !important;}
    div.reading div.boxout * {font-size: 26pt !important;}
    div.reading.bit ul li {
    	padding-left: 0.8em;
    	padding-top: 0.1em;
    	padding-bottom: 0.1em;
    	background: transparent url(/cotic_menu_05/decoration/square_big.gif) no-repeat 2px 0.6em;
    }
    div.reading.bit ul ul {
    	margin: .1em 0 .1em 1em; 
    }
    .buildkit ul li {
        text-align: left;
    }

}

/* mobile show and hide */
img.mobileonly {display: none;}
div.mobileonly {display: none;}
span.mobileonly {display: none;}
br.mobileonly {display: none;}
li.mobileonly {display: none;}
h1.mobileonly {display: none;}
#mobilehero {display: none;}
div.readmorecont {
    display: none;
    text-align: center;
}
div.readmorecont a#readmore {
    font-size: 32pt;
    color: white;
    background: #ff6600;
    padding: 16pt 30pt 18pt 30pt;
    width: 100%;
    margin: auto;
    text-align: center;
    border-radius: 18px;
}
@media screen and (max-width: 980px) {
    img.mobileonly {display: block;}
    img.desktoponly {display: none;}
    div.mobileonly {display: block;}
    div.desktoponly {display: none;}
    h1.desktoponly {display: none;}
    h1.mobileonly {display: block;}
    center.desktoponly {display: none;}
    span.desktoponly {display: none;}
    span.mobileonly {display: block;}
    br.desktoponly {display: none;}
    br.mobileonly {display: block;}
    li.desktoponly {display: none;}
    li.mobileonly {display: block;}
}
@media only screen 
    and (max-device-width : 667px) {
    #mobilehero {display: block;}
    #hero {display: none;}
    img.mobileonly {display: block;}
    img.desktoponly {display: none;}
    div.mobileonly {display: block;}
    div.desktoponly {display: none;}
    h1.desktoponly {display: none;}
    h1.mobileonly {display: block;}
    li.desktoponly {display: none;}
    center.desktoponly {display: none;}
    span.desktoponly {display: none;}
    span.mobileonly {display: block;}
    li.desktoponly {display: none;}
    li.mobileonly {display: block;}
    div.readmorecont {display: block;}
    h1.hasreadmore div, h1.hasreadmore p, h1.hasreadmore br {display: none;}
    h1.hasreadmore .biggerer, h1.hasreadmore .biggerer p {display: block;}
}
@media only screen 
    and (max-device-width : 667px) {
    a.desktoponly, span.desktoponly {display: none;}
}

/* testimonials */
.testimonial p a img {
    width: 50px;
    height: 50px;
    border-radius: 50px;
    border: 2px solid;
    vertical-align: middle;
    margin-left: 5px;
    border-color: white;
}
.testimonial p a:hover {
    background: none;
}
.testimonial p a:hover img {
    border-color: #FF6600;
}
.testimonial blockquote {
    font-style: italic;
    font-weight: bold;
    text-align: left;
    margin: -80px 20px -100px 20px;
}
.testimonial blockquote::before { 
    display: block;
    top: 0;
    left: 0;
    content: open-quote;
    font-weight: bold;
    font-size:100px;
    margin-bottom: -75px;
    color:#cccccc;
    padding-left: 10%;
}
.testimonial blockquote > p:first-child { 
    text-align: right;
}
.testimonial blockquote::after { 
    display: block;
    bottom: 0; 
    right: 0; 
    content: close-quote;
    font-weight: bold;
    font-size:100px;
    margin-top: -35px;
    color:#cccccc;
    padding-left: 90%;
}
.testimonial > p:last-child { 
    font-weight: bold;
    text-align: left;
    color: #cccccc;
    margin-top: 40px;
    margin-bottom: 5px;
    margin-left: 20px;
}
@media only screen and (max-device-width : 667px) {
    .testimonial p a img {
        width: 150px;
        height: 150px;
        border-radius: 150px;
        border: 6px solid;
        vertical-align: middle;
        margin-left: 5px;
        border-color: white;
    }
    .testimonial blockquote {
        margin-bottom: 0;
    }
    .testimonial blockquote::after, .testimonial blockquote::before { 
        content: none;
        display: none;
        margin: 0;
    }
    .testimonial > p:last-child { 
    }
}
@media only screen and (min-device-width : 667px) and (min-width: 1250px) {
    .testimonial p a img {
        width: 75px;
        height: 75px;
        border-radius: 75px;
    }
    .testimonial blockquote::before {
        padding-left: 12%;
    }
}

/* was forms.css */
.input {
    margin: 2px 0 0 0;
    padding: 0;
    color: black;
    padding: 5px 4px;
    font-family: "Andale Mono", "Andale Mono IPA", Consolas, "Bitstream Vera Sans Mono", "Courier New", monospace;
    font-size: 1.1em; _font-size: 0.9em;
    border: solid 2px #999999;
    -webkit-appearance: none;
    border-radius: 0;
}

.input:focus {
    border: solid 2px #ff6600;
}

.submit {
    cursor: pointer;
    border: none;
    background: black;
    color: white;
    font-weight: bold;
    padding-left: 1em;
    padding-right: 0.7em;
    padding-top: 4px;
    padding-bottom: 5px;
    margin-right: 5px;
    font-size: 1em;
    text-transform: uppercase;
/*    letter-spacing: 0.3em; */
}
.blacksection .submit {
    background: #999999;
}
.cancel {
    background: red;
}
.submit:hover, .submit:focus {
    background: #ff6600;
}



.error {
    background: white;
    color: red;
    border: red 2px solid;
    text-align: left;
}
.error p {
    padding: 10px 25px 10px 25px;
}
span.error {
    padding: 10px 15px 10px 15px;
}
span.error p {
    padding: 0;
}

@media screen and (max-device-width: 667px) {
    div.reading.error p {
        font-size: 42px !important;
        padding: 5px 50px 5px 50px;
    }
}

label {
    background: #999999;
    color: white;
    padding-left: 0.9em;
    padding-right: 0.7em;
    padding-top: 4px;
    padding-bottom: 7px;
    text-transform: uppercase;
    letter-spacing: 0.3em;
}

.error_label {
    border-left: solid 10px red;
}

label.custom_label {
    background: #ff6600;
}

label.custom_label.locked,
label.locked {
    background: #bbb;
}

/* non-standard select box styling */

form.customSelect select {
    min-width: 575px;
    margin-top: 9px;
    cursor: pointer;
/*    font-size: 16px; */
}

form.customSelect .customStyleSelectBox {
    border: solid 2px #999999;
    margin-top: 3px;
}

form.customSelect select[id*='custom_'] + span.customStyleSelectBox {
    border: solid 2px #FF6600;
}
form.customSelect select[id*='custom_'].locked + span.customStyleSelectBox,
form.customSelect select.locked + span.customStyleSelectBox { 
    border: solid 2px #bbb;
}

form.customSelect .customStyleSelectBoxInner {
    padding-left: 5px;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-right: 30px;
    font-family: "Andale Mono", "Andale Mono IPA", Consolas, "Bitstream Vera Sans Mono", "Courier New", monospace;
    font-size: 1em;
    background: white url  (/cotic_menu_05/decoration/select-box-arrow.gif) no-repeat center right;
    min-width: 158px;
}

form.customSelect select.locked {
    cursor: default;
}

form.customSelect select.locked + span.customStyleSelectBox span.customStyleSelectBoxInner {
    background: white url  (/cotic_menu_05/decoration/select-box-locked.gif) no-repeat center right;
}

/* radio boxes */

input[type="radio"] {
    cursor: pointer;
}

.radio-inline {
    display: inline-block;
    background: #ffffff;
    padding: 0;
    color: #999999;
    padding: 2px 10px 4px 10px;
    margin: -2px 0 0 -5px;
    font-size: 1.1em; _font-size: 0.9em;
    border: solid 2px #999999;
    vertical-align: middle;
}
@media (max-width: 700px)
{
    .radio-inline {
        display:block;
        padding: 0 0 5px 10px;
        margin: 5px 0 0 0;
        font-size: 2em;
        width: 4em;
    }
}

.radio-inline.disabled {
    cursor: not-allowed;
    opacity: 0.3
}

.radio-inline.disabled input[type="radio"] {
    cursor: not-allowed;
    opacity: 0.8
}

.radio-inline.locked {
    cursor: not-allowed;
    opacity: 0.5;
    color: #F60
}

.radio-inline.locked input[type="radio"] {
    cursor: not-allowed;
}

/* single line entry */

.text-inline {
    display: inline-block;
    padding: 0;
    margin: 0;
    vertical-align: middle;
}

.text-inline input {
    padding: 4px 10px 3px 10px;
    margin: -1px 0 0 -5px;
}

/* order forms */

#instructions {
    width:580px;
    margin-top: -10px;
    margin-bottom: 10px;
}

#stock, #warranty {
    width:580px;
    margin-top: 10px;
    margin-bottom: 10px;
}

fieldset {
    border:none;
    background: #d5d5d5;
    padding: 10px;
    margin-bottom: 10px;
}

fieldset,
fieldset label {
    -webkit-transition: background-color 0.1s ease;
    -moz-transition: background-color 0.1s ease;
    -ms-transition: background-color 0.1s ease;
    -o-transition: background-color 0.1s ease;
    transition: background-color 0.1s ease;
}

fieldset:hover,
fieldset:focus {
    background: #ddd;
}

fieldset p {
    margin: 3px 0 15px 8px
}

fieldset p:last-child {
    margin: 3px 0 0 8px
}

fieldset:hover label {
    background: #888;
}

fieldset:hover label.custom_label {
    background: #f96500;
}
fieldset:hover label.custom_label.locked,
fieldset:hover label.locked {
    background: #ccc;
}

fieldset:hover .input,
fieldset:hover .customStyleSelectBox {
    border: solid 2px #888;
}

form.customSelect fieldset:hover select[id*='custom_'] + span.customStyleSelectBox {
    border: solid 2px #f96500;
}
form.customSelect fieldset:hover select[id*='custom_'].locked + span.customStyleSelectBox,
form.customSelect fieldset:hover select.locked + span.customStyleSelectBox {
    border: solid 2px #ccc;
}

form.customSelect span.labelConj {
    color: white;
    background-color: #ff6600;
    display: inline-block;
    height: 22px;
    width: 15px;
    padding: 3px 3px 0 6px;
    margin: 0 0 -3px 0;
}
form.customSelect span.labelConj.locked {
    background-color: #bbb;
}

form.customSelect fieldset:hover span.labelConj {
    background-color: #f96500;
}
form.customSelect fieldset:hover span.labelConj.locked {
    background-color: #ccc;
}


input#address2,
input#address3,
input#delivery_address2,
input#delivery_address3 {
    margin-top: -2px;
}

fieldset.subtotal,
fieldset.finance,
fieldset.advanceDeposit
{
    display: none;
}

fieldset.subtotal p.input,
fieldset.finance p.input,
fieldset.advanceDeposit p.input,
input#quote,
input#admin_price,
input#admin_next_payment {
    display: inline-block;
    background: white;
    min-width: 120px;
    margin-left: 0;
    text-align: center;
    font-size: 150%;
}

fieldset.finance.V12 {
    background-image: url('/partners/interface/logos/v12.png');
    background-position: right top;
    background-repeat: no-repeat;
    min-height: 70px
}

fieldset.cycletowork.cycletoworklogos {
    background-image: url('/partners/interface/logos/cycletowork.png');
    background-position: right top;
    background-repeat: no-repeat;
    min-height: 93px
}

fieldset.action.sagepay {
    background-image: url('/partners/interface/logos/SagePay.png');
    background-position: right bottom;
    background-repeat: no-repeat;
    padding-bottom: 20px;
    min-height: 55px;
}

.illustration table
{
  border-collapse: separate;
  border-spacing: 5px 0;
  padding-bottom: 10px;
}

.illustration th.months {
    background: #ccc;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-top: 1px solid #CCCD00;
    border-left: 1px solid #CCCD00;
    border-right: 1px solid #CCCD00;
    width: 90px;
    height: 40px;
    vertical-align:middle;
    text-align: center;
}

.illustration th.months span {
    color: black;
    font-size: 1.2em;
    font-weight: bold
}

.illustration .perMonth td {
    background: #bbb;
    border-left: 1px solid #CCCD00;
    border-right: 1px solid #CCCD00;
    width: 90px;
    height: 60px;
    vertical-align:middle;
    text-align: center;
}

.illustration .perMonth td span {
    color: black;
    font-size: 1.2em;
    font-weight: bold
}

.illustration .APR td {
    background: #aaa;
    color: white;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    border-left: 1px solid #CCCD00;
    border-right: 1px solid #CCCD00;
    border-bottom: 1px solid #CCCD00;
    width: 90px;
    height: 40px;
    vertical-align:middle;
    text-align: center;
    font-weight: bold
}

.terms {
    -webkit-text-size-adjust: none;
    -ms-text-size-adjust: 100%;
}

fieldset.highlight p.input {
    border-color: #FF6600;
}

@-webkit-keyframes throb {
  from { opacity: 1; }
  50% { opacity: 0.8; }
  to { opacity: 1; }
}

.action input.pay,
.action a.submit.pay,
.payment input.pay,
.payment a.submit.pay {
  background: green;
}

fieldset.action input.pay,
fieldset.action a.submit.pay {
  -webkit-animation-name: throb; 
  -webkit-animation-duration: 0.5s; 
  -webkit-animation-iteration-count: 20;
  margin-bottom: 10px;
}

fieldset.action input.knockback,
fieldset.action a.submit.knockback,
fieldset.payment input.knockback,
fieldset.payment a.submit.knockback {
  background: #cccccc;
  color: #DDDDDD
}

input.knockbackimp,
a.submit.knockbackimp { 
  background: #999999;
  color: #DDDDDD
}

.action input.pay:hover, .action input.pay:focus,
.action a.submit.pay:hover, .action a.submit.pay:focus,
.action input.knockback:hover, .action input.knockback:focus,
.action a.submit.knockback:hover, .action a.submit.knockback:focus,
input.knockbackimp:hover,
a.submit.knockbackimp:hover
{
  background: #ff6600;
  color: white
}

fieldset.customer label.zzip:after {
    content: "/ZIP"
}

fieldset input[readonly="readonly"],
fieldset input[readonly],
fieldset textarea[readonly="readonly"],
fieldset textarea[readonly]
{
  border: solid 2px #bbb !important;
  color: #ff6600;
  background: #eeeeee;
}

/* reCaptcha */

.captcha * { 
        margin:0px; 
        padding:0px; 
        border:0px; 
        letter-spacing: 0;
}
.captcha_label { 
    background: white !important;
    color: #741711;
    padding-bottom: 2px;
}

.outlet {
    height: 610px !important;
}

@media screen and (max-device-width: 667px) {
    /* reCaptcha on mobile */
    .g-recaptcha {
        transform:scale(2.5);
        -webkit-transform:scale(2.5);
        transform-origin:0 0;
        -webkit-transform-origin:0 0;
        max-width: 100px;
    }
    /* [paypal on mobile] */
    .outlet,
    .payments-sdk-contingency-handler-close {
        transform:scale(2) !important;
        -webkit-transform:scale(2) !important;
    }
    .outlet {
        margin-left: -225px !important;
        margin-top: -310px !important;
    }
    .terms.nowrap {
        display: block;
        margin-top: 20px;
    }
    
    /* fitting elements on small display for order forms */
    form.framebuilder label,
    form.framebuilder .submit {
/*        letter-spacing: 0.05em; */
        font-size: 0.8em
    }
    form.framebuilder submit {
        background: #000000 !important;
    }
    form.customSelect .customStyleSelectBoxInner {
        font-framebuilder: 0.8em;
        padding-right: 10px;
        font-family: sans-serif;
    }
    form.framebuilder .smallprint {
        font-size: 0.8em;
        line-height: normal;
        padding-bottom: 15px;
        font-family: sans-serif;
        padding-right: 250px;
    }
    form.framebuilder .smallprint strong:before {
        content: '\A';
        display: block;
    }
    form.framebuilder .radio-inline {
        font-size: 0.9em;
        margin-left: -10px;
    }
    form.framebuilder br {
        line-height: 0;
    }
    /* ZOOM */
    #instructions.section,
    #stock.section, #warranty.section {
        width:780px;
        padding: 20px 50px 20px 50px;
        margin-left: -440px;
    }
    form.framebuilder .customStyleSelectBoxInner,
    form.framebuilder select {
        min-width: 750px !important;
        max-width: 750px !important;
        width: 750px !important;
    }
    form.framebuilder select {
        font-size: 24px
    }
    form.framebuilder {
        left: 0;
        margin: 0;
        width: 100%;
    }
    form.framebuilder input[type="radio"] {
        -ms-transform: scale(1.5); /* IE 9 */
        -webkit-transform: scale(1.5); /* Chrome, Safari, Opera */
        transform: scale(1.5);
    }
    form.framebuilder input[type="radio"]:last-child {
        margin-left: 10px;
    }
    /* mobile buttons fix */
    fieldset.action input.knockback,
    input.knockbackimp {
        background: #000000;
        color: #cccccc;
    }
    fieldset.action input.pay {
        background: #000000;
        color: white;
    }
}

/* smaller phones */
@media screen and (max-device-width: 640px) {
    /* [paypal on mobile] */
    .outlet,
    .payments-sdk-contingency-handler-close {
        transform:scale(1.75) !important;
        -webkit-transform:scale(1.75) !important;
    }
    .outlet {
        height: 460px !important;
        margin-left: -225px !important;
        margin-top: -230px !important;
    }
}
@media screen and (max-device-width: 568px) {
    /* reCaptcha on mobile */
    .g-recaptcha {
        transform:scale(2);
        -webkit-transform:scale(2);
    }
    /* [paypal on mobile] */
    .outlet,
    .payments-sdk-contingency-handler-close {
        transform:scale(1.5) !important;
        -webkit-transform:scale(1.5) !important;
    }
    .outlet {
        height: 510px !important;
        margin-left: -225px !important;
        margin-top: -260px !important;
    }
}

/* user */

#pin {
    font-size: 200%;
    letter-spacing: 0.5em;
    min-width: 4.5em;
}

/* pin the tail on the donkey */
@media (min-width: 1000px) {
    form.framebuilder fieldset.subtotal.keepup {
        position: fixed;
        right: 9px;
        top: 100px;
    }
}
@media (min-width: 1000px) and (max-width: 1080px) {
    form.framebuilder fieldset.subtotal.keepup {
        width: 150px;
    }
}
@media (min-width: 1080px) and (max-width: 1180px) {
    form.framebuilder fieldset.subtotal.keepup {
        width: 200px;
    }
}
@media (min-width: 1180px) and (max-width: 1350px) {
    form.framebuilder fieldset.subtotal.keepup {
        width: 250px;
    }
}

.overlay {
    position: fixed;
    height: 100%;
    width: 100%;
    z-index: 99;
    display: block;
    top: 0;
    left: 0;
}
.greyoverlay {
    background-color: #BCBCBC;
}
/* Overlay for homepage, bike and product pages */
.infooverlay {
    position: absolute;
    font-family: Arial, "Helvetica Neue", Helvetica, "Trade Gothic", Verdana, "Andale Mono", "Andale Mono IPA", Consolas, "Bitstream Vera Sans Mono", "Courier New", monospace;
    font-weight: bold;
    font-size: 1.6em;
    -webkit-font-smoothing: antialiased;
    padding: 1em;
    line-height: 1.5;
}
.rangeoverlay {
    width: 90%;
    padding: 1em 0;
    text-indent: 1em;
}
.infooverlay h1 {
    position: initial;
    padding: 0;
    margin: 0;
    font-family: "Trade Gothic Bold", "Helvetica Neue", Helvetica, Arial, "Trade Gothic", Verdana, "Andale Mono", "Andale Mono IPA", Consolas, sans-serif;
    font-weight: normal;
    font-style: normal;
    font-size: 2.8em;
    width: auto;
}
@media only screen and (min-device-width : 667px) and (max-width: 700px)  {
    .infooverlay h1 {margin-top: -20px;}
}
@media only screen and (min-device-width : 667px) and (max-width: 850px)  {
    .infooverlay {font-size: 1.3em}
    .infooverlay h1 {font-size: 2.9em; margin-top: -20px;}
}
@media only screen and (min-device-width : 667px) and (min-width: 970px) {
    .infooverlay {font-size: 1.3em}
    .infooverlay h1 {font-size: 3em; margin-top: -20px;}
}
@media only screen and (min-device-width : 667px) and (min-width: 1100px) {
    .infooverlay {font-size: 1.4em}
    .infooverlay h1 {font-size: 3em; margin-top: -25px; margin-bottom: -5px;}
}
@media only screen and (min-device-width : 667px) and (min-width: 1150px) {
    .infooverlay {font-size: 1.5em}
    .infooverlay h1 {font-size: 3em; margin-top: -30px; margin-bottom: -10px;}
}
@media only screen and (min-device-width : 667px) and (min-width: 1250px) {
    .infooverlay {font-size: 1.6em}
    .infooverlay h1 {font-size: 3.1em; margin-top: -35px; margin-bottom: -15px;}
}
@media only screen and (min-device-width : 667px) and (min-width: 1350px) {
    .infooverlay {font-size: 1.7em}
    .infooverlay h1 {font-size: 3.1em; margin-top: -40px; margin-bottom: -20px;}
}
@media only screen and (min-device-width : 667px) and (min-width: 1370px) {
    .infooverlay {font-size: 1.7em}
    .infooverlay h1 {font-size: 3.2em; margin-top: -45px; margin-bottom: -22px;}
}

.infooverlay ul {
    list-style: none;
}
.infooverlay .black {color: black}
.infooverlay .white {color: white}
@media only screen and (min-device-width : 667px) {
    .rangeoverlay {margin-top: 0.4em}
}

.rangeoverlay h1 {
    font-family: Arial, "Helvetica Neue", Helvetica, "Trade Gothic", Verdana, "Andale Mono", "Andale Mono IPA", Consolas, "Bitstream Vera Sans Mono", "Courier New", monospace;
    font-weight: bold;
    font-size: 3.5vw;
    letter-spacing: -0.05em;
}
@media only screen and (max-device-width : 667px) { .rangeoverlay h1 {font-size: 6vw;} }
.rangeoverlay .right {text-align: right; padding-right: 1em}
.rangeoverlay .center {text-align: center; text-indent: 0; padding-left: 8vw}
.rangeoverlay .middle {margin-top: 13vw}
.rangeoverlay .bottom {margin-top: 4em}
.rangeoverlay .white.contrast {text-shadow: black 1px 0 10px;}
.rangeoverlay .black.contrast {text-shadow: white 1px 0 10px;}
@media only screen and (max-device-width : 667px) {
    .rangeoverlay .white.contrast {text-shadow: black 0 0 20px;}
    .rangeoverlay .black.contrast {text-shadow: white 0 0 20px;}
    .rangeoverlay .middle {margin-top: 6em}
    .rangeoverlay .twolines.middle {margin-top: 2em}
}

.cleantitle, .cleantitle *, .boxout.loud p.cleantitle {
    font-family: Arial, "Helvetica Neue", Helvetica, Arial, Verdana, Gadget, sans-serif;
}
strong.cleantitle, .cleantitle strong, .boxout.loud p.cleantitle strong {
    font-weight: bold;
}


div#twitter {
    visibility: hidden; 
}
ul.models li {
    list-style: none;
}

/* css cotic big headings style */

h2.bigquestion  {
    font-size: 50px;
    font-weight: normal;
    margin: 25px 0 -5px 0 ;
    color: #ccc;
    margin-left: 20px;
    font-family: "Trade Gothic Bold", Arial, "Helvetica Neue", Helvetica, "Trade Gothic", Verdana, "Andale Mono", "Andale Mono IPA", Consolas, "Bitstream Vera Sans Mono", "Courier New", monospace;
    left: 0.02em;
    text-transform: uppercase;
}

/* mobile */
@media only screen 
    /* profile and about page */
    and (max-device-width : 667px) {
        h2.bigquestion {
            font-size: 55px;
            margin: 60px 0 -5px 0 ;
            color: #aaa;
            margin-left: 20px;
        }
}