@charset "UTF-8";
/* Web Solutions 4.0 Compatible */

/* HEADER ------------------------------*/
.logo-wrap {position:absolute; width:100%; height:100%; left:0; top:0; text-align:center}

#home>header {background: #fff; box-shadow: 0 -.5em 1em 1em rgba(0,0,0,0.15);}
#brand, #brand img{position:relative;height:45px;width:277px; margin:13px auto 0; display:block}
#brand{display:block; overflow:auto; height:auto; z-index:99} 
body>header{height:100px;position:fixed; top:0; right:0; z-index:10; }
body>header .wrap {overflow: visible}
body>header nav {position:relative;left:0;top:0;color:#666666;font-size:1.25em;}
body>header  #mainNav li, body>header  #ancillary li{float:left; position: relative; margin-left: 1px}
body>header nav a {text-decoration:none; -webkit-text-size-adjust:none; margin:0.5em 0.75em;border-bottom: 6px solid #fff;font-weight: 600}
body>header #mainNav, body>header #ancillary {width:50%; position:relative; line-height:100px; height:100px; float:left}
body>header #mainNav>ul>li>a:hover, body>header #mainNav>ul>li.on>a {background:none; color:#003865;border-bottom: 6px solid #007dba;padding: 0 0 .1em 0} 
body>header #ancillary ul {float:right; height:100%}
body>header #ancillary ul li a {color:#007dba}
body>header #ancillary ul li a:hover,
body>header #ancillary ul li.on a,
body>header>#ancillary ul li a:active {background:none; color:#003865;border-bottom: 6px solid #007dba;padding:0}
body>header #ancillary ul li:nth-child(3) a {border-bottom: 6px solid #d1d9e2}
body>header #ancillary ul li:nth-child(3) a:hover {border-bottom: 6px solid #007dba}
body>header form {height:100px; line-height:100px}
/*dhtml*/
body>header li ul{z-index: 1; opacity: 0; top: -200vh; transition: ease opacity .2s; width: 13.13em; padding: 0.75em 0.5em; background: rgb(0, 125, 186); position: absolute; overflow: auto; height: auto; left: 0.75em;}
body>header li:hover > ul{top: calc(100% - 1.35em); opacity: 1}
body>header ul>li:last-child ul{right:0}
body>header ul li ul li{width:100%;display:block;float:left}
body>header ul li ul li a{background:none;color:#fff; border: 0; margin: 0; display: block; font-size: 1.125rem; line-height:1.1em;padding:.3em .5em; display:block;width:100%;text-align:left;float:left}
body>header ul li ul li a:hover{color:#003865;background:#fff; padding: .3em .5em; border: 0}

#mobile{height:100%}
.back {display:none}
@media screen and (max-width:1060px){
    body>header nav a {margin: .5em .3em}
}

/* side column */
body>main>.wrap>aside{font-weight:300; position:absolute;top:8.5em;width:13.813em;overflow:hidden;font-size:1em;line-height:1.3em}
/* t1 */
#sidenav{width:200px;overflow:hidden;margin:0 0 40px 16px}
#sidenav li{height:1%;overflow:hidden;}
#sidenav li a{padding:.5em 5px;line-height:1.1em;display:none}
#sidenav li a:hover, #sidenav li a:active{}
#sidenav li.on>a{color:#000}
/* t2 */
#sidenav li.on ul{visibility:visible;font-size: 1.125rem;font-weight: 800}
#sidenav li.on ul li{font-weight: 600;position: relative}
#sidenav li.on ul li a{padding:0.5em 1.125em;font-size:1.125em;color:#007dba; display:block;}
#sidenav>ul>li>ul>li>a:before{opacity: 0; content:"\203A"; color:#007dba; font-size:1.25em; display:block; position:absolute; top:0.3em;margin-left: -.5em}
#sidenav>ul>li>ul>li>a:hover:before{opacity: 1;margin-left: -.8em}
#sidenav li ul li a:active{}
#sidenav li ul li.on>a{color:#003865; font-weight:800}
#sidenav li ul li.on>a:hover{}
/* t3 */
#sidenav li ul li.on ul{padding-top:0.15em;border:0}
#sidenav li ul li.on ul li{border:0; position:relative}
#sidenav li ul li.on ul li a{padding:0.5em 0.5em 0.5em 2.5em;font-size:1rem; color:#333333;font-weight: 400}
#sidenav li ul li.on ul li a:before{content:"\203A"; color:#007dba; font-size:1.25em; display:block; position:absolute; top:0.3em; margin-left:-0.5em}
#sidenav li ul li.on ul li a:hover:before{margin-left: -.8em}
#sidenav li ul li ul li a:hover, #sidenav li ul li ul li a:active{}
#sidenav li ul li ul li a:hover, #sidenav li ul li ul li.on a:hover {}
#sidenav li ul li ul li.on>a{color:#333;}
#sidenav li ul li ul li.on>a:hover{}
/* t4 */
#sidenav li ul li ul li.on ul li a{padding:0.6em 0.6em 0.6em 3.25em;font-size:.8em;}
#sidenav li ul li ul li.on ul li a:before {opacity: 0}
#sidenav li ul li ul li ul li a:hover:before, #sidenav li ul li ul li a:active:before{opacity: 1}
#sidenav li ul li ul li ul li.on>a:before {opacity: 1}
/*section callouts*/
body>main>.wrap>aside section{margin:0 0 20px;padding:10px}
body>main>.wrap>aside section:hover{background:#FFC}
body>main>.wrap>aside section h1{margin:0;font-size:1.2em}
body>main>.wrap>aside section p{margin:0}

#content.fullWidth+aside #sidenav {display: none} /* Hides sidenav on FullWidth pages */

body > main > .wrap > aside .cta {border-top:1px dotted #abb9cb; border-bottom:1px dotted #abb9cb; padding:0; background:none}
body > main > .wrap > aside .cta:hover {background:none}
.cta a {display:block; padding:1.25em 0.5em 1.25em 3.25em; font-size:1.5em; background:url(../images/small-phone.png) no-repeat 0.25em bottom}
.cta a:hover {background:url(../images/small-phone.png) no-repeat 0.25em bottom #007dba; color:#fff}

/* MAIN ------------------------------ */
.homeTop {margin-top: 5em; height: 38em;position: relative;float: left;width: 100%}
.homeTop>.wrap {position: static}
.logIn {position: absolute; padding: 2.25rem 3.5rem; width: 25rem; height: 25rem; right:calc(50% - 35rem); top:50%; transform: translateY(-50%)}
.logIn a {margin-bottom: -2em; width: 20.31rem; position: absolute; bottom: 0; left: 50%; transform: translate(-50%, 0);}
.band-1 {position: relative;height:43rem;padding-top: 3em; color:#003865;font-size: 1.25rem}
.band-1 h1 {margin: 0 20% 2em}
.band-1 a {position: absolute;bottom:-3%;width:20%;left:40%;z-index: 1}
.band-1 a:hover {box-shadow: 0px 3px 10px 0px rgba(0,0,0,.7)}
.band-1 a:after, .darkButton:after {content:"\203A";margin-left:.2em;display: inline-block}
.band-1 a:hover:after, .darkButton:hover:after {transform:translateX(.3em)}
.band-2 {padding: 6em 0}
.boxInfo, .onlineInfo {padding: 0 6em}
.boxInfo .blueButton, .onlineInfo .blueButton {bottom: 6%;position: absolute;left: 25%}
.boxInfo span, .onlineInfo span {bottom: 2%;position: absolute;left: 38%}
.learnMore:hover:after {transform:translateX(.3em)}
.blueButton {margin: .5em 0 .3em 0}

/* CONTENT ------------------------------ */

.css-link  {position:relative; z-index:9; text-shadow:none; color:#fff; padding:0.2em 0.8em; background:#007dba; line-height:4em; box-shadow: 0 5px 5px 0 rgba(0,0,0,0.15); border-radius:20px; -webkit-border-radius:20px;}
.css-link:hover {opacity:0.5; -webkit-opacity:0.5; color:#fff}

/* Member Sign Up Page */
.signupLeft, .signupRight {width: 50%;}


/* SHOP LANDING PAGE ------------------------------ */

.topBanner {height:8em;margin-top: 99px;background: url(/images/bannerBG.png) no-repeat center center;float: left;width: 100%}
.accountCart img {vertical-align: top;height:1.2em;margin-top: .12em;}
.accountCart img+img {margin-left: 1.3em}
.boxBuy, .onlineBuy {width: 50%;}
.boxBuy {float: left;border-right: 1px solid #d1d9e2}
.onlineBuy {float: right; border-left: 1px solid #d1d9e2}
.boxBuy span:last-child, .onlineBuy span:last-child {color:#a4b3c6;font-size: 1em}
.boxBuy a:last-child, .onlineBuy a:last-child {font-style: italic;color:#007dba}
.shopSec2 {padding: 2.5em 0}
.shopSec2>.wrap>.points {min-width: 33%; float: left;text-align: center;margin: 0;height: 10em;padding:3% 5%}
.shopSec2>.wrap>.points img {display: block;margin-right: auto;margin-left: auto;max-height: 3.2em;margin-bottom: 1em}
.shopSec3 {height: 60em}
.shopSec3 .wrap {overflow: visible}
.fancyTable {margin: 1em 0;width: 100%}
.fancyTable th {width:35%}
.fancyTable thead {border-bottom: 2px solid #e8ecf1}
.fancyTable thead th {font-size: 1.63em;width:25%;padding:2em 0 .5em 1em;vertical-align: bottom;font-weight: 600}
.fancyTable thead th img {height: 5em}
.fancyTable tbody img {height: 1em}
.fancyTable tbody tr:nth-child(odd) {background: #f6f7f9}
.fancyTable tbody tr:last-child {border-bottom: 2px solid #e8ecf1}
.fancyTable tbody th {padding: .6em 5em 1.5em 1em;color:#6284a0;font-weight: 600;vertical-align: top}
.fancyTable tbody td {padding: 0 2em 0 2em}
.fancyTable tbody tr>td:nth-child(3) {padding: 0 1em 0 2em}
.fancyTable tbody td span:before {content:'';width: 1em; height: 1.5em;background: url(/images/mark.png) no-repeat center center / 35px 35px;display: inline-block;float: left; vertical-align: top;margin-left: -2.5em;margin-right: .5em; padding-left: 1em;margin-top: .25em}
.tableBoxBuy, .tableOnlineBuy {position: absolute;text-align: center; font-size: 1.5em; color:#007dba;margin-top: 2em}
.tableBoxBuy {left:41%}
.tableOnlineBuy {left: 70%}
.product-info .right {padding-left: 3em}
.order-info{position: relative;overflow: auto}
.order-info table tr:last-child td{text-align: center}

@media screen and (max-width:930px) {
    .shopSec3 {height: 75em}
    .tableBoxBuy {left: 5%;margin-top: 0}
    .tableOnlineBuy {left: 54%;margin-top: 0}
    .tableBoxBuy:before {content:url("/images/boxTableMobile.png");}
.tableOnlineBuy:before {content:url("/images/laptopTableMobile.png");}
}

/* PRODUCT PAGE ------------------------------ */

.product-info .right {margin-top: 3em}
.order-info {height: auto;float:right; background:#fff;margin-top: 3em}
.order-info table button {float: left;}
.order-info table button:hover {box-shadow: 0px 3px 10px 0px rgba(0,0,0,.9);}
@media screen and (max-width:1060px) {
    .product-info .right {padding: 0 1em;margin-top: 0}
    .order-info {position: relative;margin: 0;padding: 0;height: auto;float:none; background:#fff;}
}
.prodHighlight, .includedBox {margin-top: 1em}
.prodHighlight .left, .includedBox .right {width: 50%;padding:1em 4.5em 1em 4.5em}
.prodHighlight .left a, .includedBox .right a {display: block;margin-top: 2.5em;font-style: italic;color: #003865}
.prodHighlight .left a:hover, .includedBox .right a:hover {color: #007dba}
.prodHighlight img {float: right;width: 40%;height:auto;}
.prodHighlight .left {float: left}
.includedBox img {width: 45%; float: left; height: auto}
.includedBox .right {float: right}
.cartCol section {width: 50%;float: left;}
.cartCol section td:first-child {width: 35%}
.cartCol section:last-child {padding-left: 1em}

/* SHOPPING CART ------------------------------ */

.product-checkout-info td {vertical-align:middle}
.product-checkout {margin-left:1em}
.product-thumbnail {width:3em; vertical-align:middle; margin:0 1em 0 0; display:inline-block; background-position:center center; background-size:cover; background-repeat:no-repeat}
.product-thumbnail:after {content:""; padding-bottom:100%; display:block;}


/* Interior Footer */
.intFooter {padding: 9em 10em}
.intFooter h1 {}


/* FOOTER */
footer .wrap section {float:left}

@media screen and (max-width:1140px) {
    .logIn {right: 1em}
	main>.wrap {padding: 3em 0 4.063em 0;}
}
@media screen and (max-width:1100px) {
body > header nav a span {display: none}
}

@media screen and (max-width:1060px) {
    .prodHighlight .left, .includedBox .right {padding: 1em 1em}
}