body {font-family: 'Roboto', sans-serif; background:#fdfdfd;}
main {min-height: 90vh;}
/*framework and nav*/
#wrapper {position:relative; left:0px;}
#mobNav {position:fixed;width: 260px;right:-264px;top:0;bottom:0;z-index:1000;box-shadow: 0px 0px 20px rgba(0,0,0,0.3);background: #f5f5f5;}
#navBtn {position: absolute; display:none; left: -42px;top: 4px;background:#c90012; border:1px solid #000; padding: 4px 8px;border-radius: 3px;font-size: 18px; color: #fff; cursor:pointer; text-shadow:0 1px 1px rgba(0,0,0,0.5); box-shadow:0 0 4px #fff;}
#navBtn:hover {background:#000;}
#navBtn:active {}

@media (max-width:768px){
#topNav {padding: 0px !important;}
.midNav .social {margin-top:-20px; padding-bottom:10px;}
#topNav li {display:none !Important;}
}

.siteSearch {z-index:100;width: 100%; position:relative; margin-top:-3px; height: 30px; background:#222; padding-top: 6px; border-bottom:3px solid #c90012; margin-bottom: 5px; }
.siteSearch:before { content:"NAVIGATION"; color:#fff; text-align:center; font-weight: 300; letter-spacing:2px; width:100%; display:block;}
.siteSearch .fa-search {position:absolute; top: 8px; left:8px; color:#fff; font-size: 23px; display:none}
.siteSearch .fa-times-circle {position:absolute; top: 8px; right: 6px; cursor:pointer; font-size: 26px; color:#fff; display:none;}
.siteSearch .fa-times-circle:hover {color:#000;}
.siteSearch input {width: 100%; padding: 8px 20px 8px 35px !important; display:none; color:#fff; outline:none; border:none; border-radius: 0px; background:#000;}
.siteSearch input:focus {outline:0 !important; border:none; box-shadow:none; background:#1a339a;}

.mobNavOn {right:0px !important;}
.wrapperOn {left:-200px !important;}

#mobNav .nav_first {padding-bottom:100px; min-width:110%; display:block; margin-top:-3px;}
#mobNav .nav_first>li {}
#mobNav .nav_first>li>a {font-size: 16px; width: 100%;display:block;color:#000;padding: 5px 10px 5px 5px;border-bottom: 1px solid rgba(0,0,0,0.1); font-weight:500;background-color: rgba(0,0,0,0.);}
#mobNav .nav_first>li>a:hover {background:rgba(0,0,0,0.8); color:#fff; text-shadow:1px 1px 0px rgba(0,0,0,0.2);}
#mobNav .nav_first>li>.staticNav {position:relative;}
#mobNav .nav_first>li>a:before {content:"\f105"; padding-left: 5px;font-family:'fontAwesome'; width: 20px; display:inline-block; color:#c90012;}
#mobNav .nav_first>li>a.navOpen:before {content:"\f107";}
#mobNav .nav_first>li>a:hover:before {color:#fff;}

#mobNav .nav_second>li>a{padding: 5px 5px 0px 30px;margin-bottom: 5px;line-height: 1.2;display:block;width: 100%;position:relative;color:#333;color:rgba(0,0,0,0.7);font-size: 14px;}
#mobNav .nav_second>li>a:before {position:absolute; content:">"; left: 14px; color:rgba(255,255,255,0.2); transition:all 0.3s ease-in-out}
#mobNav .nav_second>li>a:hover {padding-left:40px;}
#mobNav .nav_second>li>a:hover:before {left:24px; color:#fff;}

#mobNav .nav_third>li>a{padding: 10px 5px 0px 45px; margin-top: 2px; margin-bottom: 3px; line-height: 0.8;display:block; width: 100%; position:relative; color:#ddd; color:rgba(255,255,255,0.6); font-size: 13px;}
#mobNav .nav_third>li>a:before {position:absolute; content:">"; left: 30px; color:rgba(255,255,255,0.2); transition:all 0.3s ease-in-out}
#mobNav .nav_third>li>a:hover {padding-left:55px;}
#mobNav .nav_third>li>a:hover:before {left:43px; color:#fff;}

#mobNav .nav_fourth>li {}
#mobNav .nav_fourth>li>a{padding: 10px 5px 0px 55px; margin-bottom: -3px; line-height: 1.2;display:block; width: 100%; position:relative; color:#ddd; color:rgba(255,255,255,0.6); font-size: 12px;}
#mobNav .nav_fourth>li>a:before {position:absolute; content:">"; left: 44px; color:rgba(255,255,255,0.2); transition:all 0.3s ease-in-out}
#mobNav .nav_fourth>li>a:hover {padding-left:65px;}
#mobNav .nav_fourth>li>a:hover:before {left:55px; color:#fff;}

.nav_second .staticNav { color:#ddd !important;}
.nav_third .staticNav {color:#ddd !important;}
.nav_second .staticNav:before,.nav_third .staticNav:before  {content:" " !important;}
#topNav .noTopNav {display:none !important;}

#mobNav .firstItem {border-bottom:0 !important;}
#mobNav .firstItem > .nav_second {display:block !important;padding-bottom: 5px;}



/*search results*/
#searchResults {background:#515457; position: relative; z-index: 999;}
#searchResults li {color:#999; font-weight: 100; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; position:relative; padding: 6px 10px 6px 30px; border-bottom:1px solid rgba(255,255,255,0.1);}
#searchResults li a {color:#fff; font-weight: 200; font-size: 14px;}
#searchResults li:hover {background-color:#1a339a;}
#searchResults .search_News:before {position:absolute; content:"\f1ea"; color:#1a339a; left: 6px; top: 5px; font-size: 16px; font-family:'fontAwesome';}
#searchResults .search_Navigation:before {position:absolute; content:"\f054"; color:#ddd; left: 10px; top: 5px; font-size: 16px; font-family:'fontAwesome';}
#searchResults .selected {background-color:#1a339a;}


/*TEXT FORMATS*/

body, h1, h2, h3, h4, h5, p, a, li, strong, div, span, input, select {font-family: 'Roboto', sans-serif !Important;line-height: 1.3;}

@media (max-width:962px){
  .contained {max-width:96% !Important;} 
}

/*HEADER*/
header {background-color:#fff !important; border-bottom:1px solid #eee; background: -moz-linear-gradient(top, rgba(0,0,0,0.0) 80%, rgba(0,0,0,0.025) 100%);
background: -webkit-linear-gradient(top, rgba(0,0,0,0) 80%,rgba(0,0,0,0.025) 100%);
background: linear-gradient(to bottom, rgba(0,0,0,0) 80%,rgba(0,0,0,0.025) 100%);}
header .contained {position:relative; z-index:100;}
.ac3 {display:none;}
.ac3 a {margin-right: 42px;}
.ac3 a span {font-style:normal !important; font-weight: bold !important;}

/*SKIN*/
header .logo {position:absolute; right: 0px; background:url(files/image/logos/) no-repeat; background-size:contain; max-height: 80px; margin-top:-15px;}

.btn {text-shadow:0px 1px 0px rgba(0,0,0,0.5); white-space:nowrap; cursor:pointer; position:relative;font-weight: 500;color:#fff; font-size:16px; padding: 1px 18px;border-top:1px solid rgba(255,255,255,0.2);box-shadow:inset 0px -10px 20px rgba(0,0,0,0.3);display:inline-block;margin:10px;border-radius: 4px;}
.btn:before {position:absolute; content: ""; z-index:-1; border-radius: 6px; width:104%; height: 112%;  box-shadow:inset 0px 10px 20px rgba(0,0,0,0.3); background:inherit; left: -2%; top:-6%;}
.btn:after {position:absolute; content: ""; z-index:-2; border-radius: 6px; width:90%; height: 100%;  box-shadow: 0px 2px 10px 3px rgba(0,0,50,0.5); background:inherit; left: 6%; top:0;}
.btn:active {-webkit-transform:scale(0.95); -moz-transform:scale(0.95); -ms-transform:scale(0.95); transform:scale(0.95);}
.btn:hover {background:#1a339a;}

#breadcrumbs {background-color:#fff;  padding:12px 0px; border-top:1px solid #eee; font-size: 9px; white-space:nowrap; color:#444; overflow:auto; }
#breadcrumbs a {color:#444; font-weight: 300; font-size: 13px; padding:0px 10px 0px 5px;}
#breadcrumbs a:hover {text-decoration:underline;}
#breadcrumbs .col-xs-12:before {content:"You are here: "; display:inline-block; padding-right: 10px;font-size: 12px; color:#666; font-weight: 200; font-style:italic;}

#topNav {font-size:0px;padding: 0;margin-left: -10px;}
#topNav .noTopNav {display:none;}
#topNav li {display:inline-block; position:relative; margin: 0 0 -2px 0;padding: 40px 12px 26px 12px; background: none;}
#topNav li:last-child {}
#topNav>ul>ul>li>a {font-weight: 300;font-size: 13px;color: #333; text-transform:uppercase;}

#topNav li:hover, #topNav li.selected  {}
#topNav li:hover a, #topNav li.selected a  {color:#c90012; }
#topNav li.firstItem a {color:#113739 !important; font-weight: 600;}

#topNav li:after {transition:all 1s ease-in-out; border-radius: 100% 0 0 0; position:absolute; left:50%; bottom:0; width:0%; height: 6px; background:#c90012; content:"";}
#topNav li:before {transition:all 1s ease-in-out; border-radius:0 100% 0 0; position:absolute; left:50%; bottom:0; width:0%; height: 6px; background:#c90012; content:"";}
#topNav li:hover:after {left:0%; width:50%;}
#topNav li:hover:before {left:50%; width:50%;}

.firstItem {background-color:rgba(67, 112, 195, 0.8);border-bottom: 3px solid darkgreen !Important;padding-bottom: 15px !important;}
.firstItem a {color:#fff !important;/* font-weight: 600; */}

@media (min-width:992px) and (max-width:1150px){
#topNav li {padding: 30px 10px 36px 10px;}
#topNav li a {font-size: 16px;}
}
@media (max-width:992px){
#topNav li {display:none;}
#topNav {height: 86px;}
header .logoLayer {position:absolute; left: 50%; margin-left: -85px;}
#navBtn {display:block;}

}

/* Mega Menu */
#megaMenu {position:absolute; width:100%;  perspective:800px; z-index:100;}
.mmWrap {transform-origin:50% 0; transition:all 0.1 ease-in-out; -webkit-transition:all 0.5s ease-in-out; -moz-transition:all 0.1s ease-in-out; -ms-transition:all 0.1s ease-in-out; opacity:0;}
.mmWrap {transform:rotateX(70deg);}
.mmWrap.expand {transform:rotateX(0deg); opacity:1;}


.megaMenuPanel {padding: 30px 0px 14px 0px;  height: auto; position:relative; }
.panelBox {width:100%; border:1px solid rgb(0,62,81); height: 120px; background-size:cover; position:relative; cursor:pointer;}
.panelBox p {position:absolute; width: 100%; bottom:0px; padding: 5px 0px 5px 10px; background:rgba(0,0,0,0.85); color:#ddd; font-size: 11px;}
.panelBox:hover {border-color:#000; }
.panelBox:hover p {color:#fff;}
.panelList {width: 100%; padding-left: 10px;}
.panelList h5 {color:#000; white-space:nowrap; font-family:'Roboto'; font-weight:600;margin-bottom: 15px; font-size: 24px;}
.panelList a {display:block;white-space:nowrap; text-overflow:ellipsis; overflow:hidden; color:#fff; font-size: 13px; display:block; line-height: 2; transition:all 0.3s; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; -ms-transition:all 0.3s; -o-transition:all 0.3s; white-space:nowrap;}
.panelList a:before {font-family:'fontAwesome'; content:"\f0da"; padding-right: 6px; }
.panelList a:hover {margin-left: 6px;}

/*FOOTER*/
footer h3 {font-size: 20px;font-weight: 300;color: #aaa;margin-bottom: 15px;}
footer .note {background:#fff !important;border-top: 1px solid #bb0010;border-bottom: 1px solid #ddd;padding:10px 0px;}
footer .note p {padding-bottom: 0px; font-size: 12px; font-weight:200; color:#ddd;}
footer .note .col-sm-8 {text-align:right;}
footer .note p a {padding:0px 15px; color:#444; cursor:pointer;}
footer .note p a:hover {color:#000;}
footer .note .col-sm-4 p {color:#444;}
footer .footNav {margin-bottom: 15px;}
footer .footNav p {font-size: 14px; line-height:1.8;}
footer .footNav p a {color:rgba(255,255,255,0.8);; font-weight: 300; -webkit-transition:padding 0.2s ease-in-out; -moz-transition:padding 0.2s ease-in-out; -ms-transition:padding 0.2s ease-in-out; transition:padding 0.2s ease-in-out;}
footer .footNav p a:before {content:"\f105"; font-family:fontAwesome; padding-right: 8px;}
footer .footNav p a:hover {padding-left: 6px; color:#fff;}
footer img {margin:5px 0px 10px 0px; max-width:320px !important; width:100%;}
footer .footSocial {text-align:right;margin: 0 15px;}
footer .footSocial a {font-size: 32px;color: #ccc;margin-left: 5px;text-shadow:1px 1px 5px #000;}
footer .footSocial a:hover {color: #fff;}
.dvla {background:#222; color:#fff; font-size: 9.5px; padding:10px 0; text-align:center; letter-spacing:-0.3px;}

@media(max-width:768px){
    footer .footNav .col-xs-12:nth-of-type(4) {text-align:center;}
    footer .footNav p {font-size:12px;}
    footer .footNav h3 {font-size:18px;}
    footer .footSocial {text-align:center !important; margin-top: 60px !important; padding-right:0 !important;}    
}
@media(max-width:560px){
footer .note .col-sm-4 {width:100% !important;}
footer .note .col-sm-8 {width:100%; margin-top: 5px;}
footer .note .col-sm-8 {width:100%; text-align:left !important;}
}
@media(max-width:480px){
footer .footNav .col-xs-12:nth-of-type(3) {margin-top: 10px;} 
footer .footSocial {text-align:center;}
}




/*NEWS*/
.newsCategory {font-size: 36px; color: #444; font-weight: 300;padding: 10px 0 10px 0; overflow:hidden; text-align:center;}
.newsCategory h2 {font-weight:100; position:relative; display:inline-block;}
.newsCategory h2 span {position:absolute; opacity:0.1; transform:scaleY(-1); left:0; bottom:-27px; font-weight:inherit !important;}

.newsStoryImg {position:relative; padding: 20px; background:darkred; overflow:hidden; max-height: 600px;}
.newsStoryImg span {position:absolute; z-index:0; opacity:0.4; top:0; left:0;width: 100%; height: 100%; background-size:cover; background-size:cover; filter:blur(5px); -webkit-filter:blur(5px); -moz-filter:blur(5px); -o-filter:blur(5px); -ms-filter:blur(5px); background-position:50% 50%; }
.newsStory {padding:20px 5px;}
.newsStoryImg p {position:relative; z-index:10;}
.newsStoryImg img {border:2px solid #fff; max-width:992px; max-height: 40vh; width:100%;}
.newsStory p {font-size: 15px; color:#111; margin-bottom: 10px; line-height: 1.8;}
.newsStory h2 {font-size: 24px; margin-bottom: 12px; color:#ddd;}
#newsStoryShell {background:rgba(255,255,255,1)}
#newsStoryShell h1 {font-size: 32px; color:#333;  font-weight: 300; text-align:center; font-size: 36px !important; margin:20px 0px;}
.newsStory p a, .newsStory li a {color:#1a339a; font-weight: 600;}
.newsStory p a:hover {color:#000;}
@media (max-width:768px){ #newsStoryShell h1 {font-size: 24px !Important; margin-bottom: 25px;} }

@media (max-width:992px){
.newsStoryImg {margin-top: 25px; position:relative;overflow:hidden;}
.newsStoryImg:before { content:""; position:absolute; top:-66px; left:-25%; width:150%; height: 66px; background:rgba(255,255,255,0.9);}    
}

#newsStoryShell time {text-align:right; display:block; margin-top:-20px;}

.newsPanel {background:#fff; border:1px solid #eee; border-radius:3px; padding: 15px; margin:20px 0px;}
.newsPanel a {color:inherit;}
.newsPanel .newsNanoImage,.newsPanel iframe {width: 100%; height: 220px !important; background-size:cover;}
.newsPanel .newsTitle {margin:15px 0px 10px 0px; font-size: 22px; color:#003b4f; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.newsPanel p {overflow:hidden; width: 100%; height: 36px; font-size: 14px; color:#444; line-height: 1.4;}

.newsStory ol li {margin-left: 25px; font-size: 14px; padding-left: 10px; list-style-type:decimal; margin-bottom: 12px; }
.newsGridHeader {padding: 25px 0px 0px 0px; }
.newsGridHeader h2 {font-size: 32px !important; color:#003b4f;}
.newsPanel:hover {transform:rotate(2deg) scale(1.05); -webkit-transform:rotate(2deg) scale(1.05); -moz-transform:rotate(2deg) scale(1.05); -ms-transform:rotate(2deg) scale(1.05);}


.newsPanelWide .newsNanoImage {height: auto !important; padding-top:35%; background-repeat:no-repeat;background-size:cover !important; background-position: 50%;}
.newsPanelWide .newsTitle {height: 50px; overflow:hidden; text-overflow:none; white-space:normal;}
.newsPanelWide p {height: 40px; margin-bottom: 6px;}
.newsPanelWide p.newsNanoDate {height: 20px;}

/*tooltip hover*/
#toolTip {position:fixed; text-align:center; z-index:10000; line-height: 1.3; padding:5px 8px; font-size: 13px; border-radius: 3px; color:#fff; box-shadow:2px 10px 10px rgba(0,0,0,0.2); background:#222; left:-1000px; top:-1000px; max-width: 200px;  pointer-events: none;}
#toolTip:after {content:"\f0d7"; font-size: 20px; position:absolute; font-family:'fontAwesome'; bottom:-16px; left: 49%; text-shadow:0 6px 3px rgba(0,0,0,0.1); color:#222;}

/*CONTENT*/
.content {padding-bottom: 0px;}
.content p {font-size: 16px; line-height: 1.5; margin-bottom: 8px; font-weight: 300;}
.content p a, .content li a {color:#1a339a; font-weight: 500;}
.content p a:hover, .content li a:hover {color:#000; text-decoration:underline;}
.content blockquote {margin: 0px 30px 20px 30px; text-align:center; position:relative; color:#ddd; font-size: 14px; line-height: 1.5; font-weight: 300; }
.content ul {margin-bottom: 10px;}
.content .fa-ul i {color:#09f;}
.content ul li {font-weight: 300; line-height: 1.4; margin-bottom: 6px; list-style-type:disc; font-family:inherit;  margin-left: 22px; font-size: inherit; color:#111; position:relative; padding-left: 10px; margin-bottom: 5px; line-height:1.4;}
.content h2 {color:#c90012; font-size: 24px; font-weight: 300; margin-bottom: 12px;}
.content h2 i {font-size: 75%; color:#666; display:inline-block; padding-right: 6px; position:relative; top:-2px;}
.content h1 {font-size: 32px;}


/*form classes*/
.formTextBox, .forms input[type="text"], .forms textarea, .forms input[type="password"] {outline:none; font-size: 16px; background:#fdfdfd; font-weight:300; border-radius: 3px;  border:1px solid rgba(0,0,0,0.2);  padding: 3px 12px; box-shadow:inset 1px 3px 5px 1px rgba(0,0,0,0.05); color:#444; min-width: 100px; width:100%; max-width:384px; margin:3px 0px;}
.formTextBox:hover,  .forms input[type="text"]:hover,.forms input[type="password"]:hover,  .forms textarea:hover .formTextarea:hover{border-color:#aaa;}
.formTextBox:focus,  .forms input[type="text"]:focus, .formTextarea:focus, .forms textarea:focus  {color:#111; border-color:#999; background:#fff; }
.formButton, .forms input[type="submit"], .forms input[type="button"] {cursor:pointer; outline:none; font-size: 16px; border-radius: 4px; border:1px solid rgba(100,0,0,0.2); padding: 4px 20px; box-shadow:0px 0px 1px rgba(0,0,0,0.1); color:#fff !important; background:darkred;}
.formButton:hover, .forms input[type="button"]:hover {color:#fff; background:#000;}
.formButton:active, .forms input[type="button"]:active {color:#fff; opacity:1; text-shadow:0px 1px 1px rgba(0,0,0,0.4); background:#000 !important;}

.forms input[type="text"]:disabled {font-size: 14px; padding:4px 10px 4px 0; border-color:#fff; box-shadow:none; color:#000;}
.forms label {display:block; font-size: 12px; color:#999; font-weight: bold; border-bottom:1px solid #eee;}
.forms input[type="text"]:focus,.forms select:focus {border-color:red;}

.w100p {width: 100%;}
.w50p {width: 50%;}
.w40p {width: 40%;}
fieldset {padding: 3px 0px; border:none; position:relative;}
fieldset label {padding:3px 0px; font-size: 12px; color:#333; display:block;font-weight: 300;}
fieldset select {width: 100%; font-size: 16px; background:#f5f5f5;}
fieldset input[type="checkbox"] {margin:0px; margin-top:-2px;}
fieldset a {font-weight: 600; color:inherit;}
.formOptins {margin:10px 0px;}
.formOptins label {font-size: 12px; color:#444; font-weight: 200; position:relative; padding-left: 25px; line-height: 1.3; margin-bottom: 5px; display:inline-block; width:100%;}
.formOptins label input[type="checkbox"] {position:absolute; left:0; top: -2px;}
.forms select {width:100%; max-width:384px; height: 26px; font-size: 16px; color:#444; margin: 3px 0px;}
.help {position:relative; font-size: 13px !Important; background:#eef; padding:5px 10px 5px 50px; border-radius:6px; box-shadow:0px 1px 2px rgba(0,0,0,0.1);}
.help:before {content:"\f059"; font-family:'fontAwesome' !important;  position:absolute; left: 10px; top: -3px; font-size: 36px; color:#1a339a;}

.mandatoryError {background:#fdd; color:#f00}
.formTextarea {width: 100%; height: 80px; outline:none; font-size: 16px; background:#f5f5f5; font-weight:300; font-family:'Roboto'; border-radius: 5px; border:1px solid rgba(0,0,0,0.3); padding: 3px 12px; box-shadow:0px 0px 1px rgba(0,0,0,0.1); color:#444;}
.topLabel {color:#666; font-size:10px; text-align:center; background:#f5f5f5; padding:2px;}
.formError {color:#f00; border-color:red !important;}
.error {background:red; color:#fff;}
.deleteBtn {background:#a00 !important; border-color:#f00 !important;}









/*CAROUSEL*/

.carouselWrapper {padding:20px 0px !important; position:relative;}
.carousel {margin-left:-13px;margin-right:-5px;height:auto;position:relative;font-size:0px;padding-bottom: 12px;}
.carouseltem  { width:250px; padding:0px 15px; display:inline-block; vertical-align:top;}
.infoPanel {background:#fff; text-align:center; border:1px solid #ddd; border-radius: 4px; padding: 10px; position:relative;}
.carouseltem>a>div {border:1px solid #555;}

.carouseltem h4 {box-shadow:0px 5px 10px rgba(0,0,0,0.2); position:relative; background:#d60015; margin-top:-32px; max-width:90%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#fff; padding: 4px 10px; border-radius: 6px; border:3px solid #000; font-size:18px; text-align:center; display:inline-block;}
.carouseltem h4:after {position:absolute; left:0px; right:0px; top:0px; bottom:0px; border:1px solid #fff; content:""; border-radius: 4px;}
.carouseltem p {font-size: 12px; white-space:initial; color:#444; line-height:1.4; margin-bottom: 15px;}

.carouselWrapper h2 {font-size: 24px; margin-bottom: 30px; font-weight: 300; color:#444;}

.carLeft,.carRight {cursor:pointer; border:2px solid #fff; position:absolute; font-size:28px; color:#fff; background:#d60015; width:44px; height: 44px; border-radius: 44px; padding-top:7px; top:38%;}
.carLeft {left:5px; padding-left:8px;}
.carRight {right: 5px; padding-left: 12px;}
.carLeft:hover,.carRight:hover {color:rgba(0,0,255,0.9);}

.subPic {background-size:contain; background-position:50%; background-repeat:no-repeat; padding-top: 25%; margin:5px 20px; display:block;}
.carousel .btn {position:absolute; left:50%; margin-left:-35px; bottom:-20px; background:#d60015; z-index:100; padding-top: 4px;}


/*GALLERY*/
.facesOther {background:#000; border-top:4px solid #1a339a;border-bottom:4px solid #1a339a; margin:25px 0px; text-align:center; position:relative;} 
.facesScroll {max-width:100%; overflow-x:auto; white-space:nowrap;}
.gallery {/* background-size:cover !important; *//* background-position:center center !important; */display:inline-block;position:relative;border-left:1px solid rgba(0,0,0,0.2);border-right:1px solid rgba(255,255,255,0.2);margin-bottom: -5px;vertical-align: top;}
.gallery .fa-search-plus {position:absolute; bottom: 10px; font-size: 36px; right: 10px; color:#fff; text-shadow:1px 1px 2px rgba(0,0,0,0.7);}
.gallery img {max-height:256px; display:inline-block;}
.facesOther h3 {white-space:nowrap; overflow:hidden; max-width:90%; margin-left: 10px; text-overflow:ellipsis; position:absolute; top:-36px; background:#1a339a; color:#fff; font-weight: 100; font-size: 20px; padding: 5px 20px; border-radius: 6px 6px 0 0;}




#gallery {position:fixed; padding: 40px; top:0; left:0;right:0;bottom:0; background:#000; background:rgba(0,0,0,0.8); z-index:2000;}
#gallery ul {display:block; position:relative; text-align:center; height: 100%;}
#gallery li {position:absolute; top: 0px; left: 0px; width: 100%; text-align:center; pointer-events:none;}
#gallery li img {max-width: 100%;}
#gallery li p {position:absolute; bottom:0;left:-20%;right:-20%;padding:20px 10px; color:#fff;background:rgba(0,0,0,0.6); text-align:center; font-size:18px;}
#gallery .galClose,#vrgallery .vrClose {opacity:0.8; position:absolute; top: 12px; right: 12px; z-index:201; color:#fff; font-size: 48px;}
#gallery .galPrev  {opacity:0.8; position:absolute; top: 48%; left: 5px; z-index:201; color:#fff; font-size: 36px;}
#gallery .galNext  {opacity:0.8; position:absolute; top: 48%; right: 5px; z-index:201; color:#fff; font-size: 36px;}
#gallery i:hover {opacity:1;}
.basicPanel {position:relative; background:#fff; box-shadow:0px 0px 4px rgba(0,0,0,0.3); padding:50% 0px;}
.showGallery {cursor:pointer;}

/*lock footer*/
.lockFooter {position:fixed; width:100%; bottom:0; left:0;}

/*404*/
.error404 { transition:all 4s ease-out; transform:scale(0.5); max-width:300px; width:100%; background:rgba(255,255,255,0.9); border-radius: 10px; box-shadow:0px 0px 20px rgba(0,0,0,0.3);padding: 10px 25px; border:6px solid #1a339a;  position:absolute; margin-top: 15%; left: 50%; margin-left: -150px; z-index:100;}
.error404 h1 {font-size: 48px; letter-spacing:1px;color:#1a339a;}
.error404 h2 {font-size: 20px; letter-spacing:1px;color:#444;}
.error404 p {font-size: 11px; margin-top: 10px;}
.error404 p a {color:#1a339a; font-weight:bold;}
.error404grow {transform:scale(1.1) !important;}


@media(max-width:992px){
#navBtn {top: 82px !important;}
header .logo {max-height: 50px !important;}
.pageHeader h1 {font-size: 36px; padding-left:0px;}
.content h2 {font-size: 28px;}
#breadcrumbs {display:none;}
.ac3 a {margin-right: 0; border-right:none;}
}

.faq h2 {font-size: 22px !important; cursor:pointer; margin-top: 20px; color:#444;}
.faq div {display:none;}




/*temp*/



.newCommentRoot {background:#def; padding:10px 18px !important; width:95%; margin:10px 0px 0px 0px; border-radius: 8px; z-index:100; border:1px solid rgba(0,0,0,0.05); box-shadow:2px 2px 4px #ddd; border-top:none; position:relative; }
.newCommentRoot:after { border-radius: 5px 0 0 0; width:32px; left: 12px; height: 20px; transform:rotate(34deg); position:absolute; z-index:-20 !Important; background:#def; content:""; top:-9px; border:1px solid rgba(0,0,0,0.05); border-right:none; border-bottom:none;}
.commentData {display:inline-block; width:25%;; font-size: 12px; color:#555; vertical-align:top;}
.commentData h5 {padding-top:10px;}
.commentData h6 {margin-top: 10px; position:relative; padding-left: 15px; text-overflow:ellpsis; overflow:hidden; white-space:nowrap;}
.commentData h6:before {font-family:'fontAwesome'; content:"\f007"; position:absolute; left:0px;}
.commentText {display:inline-block; padding: 10px 0px; width:75%;}
.commentText span {font-size: 14px; line-height: 1.8; color:#444; display:block; padding:10px 15px; margin-top:-10px; border-radius: 6px; background:rgba(255,255,255,0.3);}
.commentText input {float:right; margin-bottom:-10px; margin-right: -10px; margin-top: 10px; font-size: 16px; background:#1a339a; color:#fff; border-radius: 6px; padding: 4px 20px;}
.commentText input:hover {background:#000; box-shadow:0px 0px 10px white;}
.newCommentSub {background:#fee; padding:10px 18px !important;  margin:10px 0px 0px 10%; border-radius: 8px; z-index:100; border:1px solid rgba(0,0,0,0.05); box-shadow:-2px -2px 4px #ddd; border-top:none; position:relative; }
.newCommentSub:after {border-radius: 0 5px 0 0; width:32px; right: 50px; height: 20px; transform:rotate(-34deg); box-shadow:1px -1px 0.5px rgba(0,0,0,0.1); position:absolute; z-index:-20 !Important; background:#fee; content:""; top:-10px; border:1px solid rgba(0,0,0,0.05); border-left:none; border-bottom:none;}


.newsCommentsForm {background:#f5f5f5; margin:20px 0; padding: 20px; border-radius: 6px; text-align:right;}
.newsCommentsForm h3 {font-size: 24px; font-weight: 100; color:#444; margin-bottom: 18px; text-align:left;}
.newsCommentsForm label {padding:0; vertical-align:top; text-align:left;}
.newsReplyTo {display:block; margin: -10px -8px 10px -8px; width:100% !important; background:#eee; padding: 4px 8px !important; border-bottom:1px solid #ddd;}
.newsReplyTo span {font-size: 12px; color:#444; font-weight: 200;}
.newsCommentsForm textarea {padding: 15px; backgound:#fff; border:none; border-radius: 4px; width:100%; margin: 5px 0; font-size: 14px; color:#333; height: 100px;}
.newsCommentsForm p {font-size: 12px; text-align:left; max-width:80%;}
.newsCommentsForm input[type="button"] {-webkit-appearance:none; border:none; padding: 6px 14px; background:#1a339a; color:#fff; font-size: 20px; border-radius: 6px;}
.newsCommentsForm input[type="button"]:hover {background:#000;}



#accountStrap {background:#fff; /*margin:0 -20px;*/ border-bottom: 1px solid #eee;}
.accountButtons a {transition:all 0.2s ease-in-out;  position:relative; background:#fff; color:#222; font-size: 14px; font-weight: 200; padding: 8px 20px 8px 12px; display:inline-block; border-left:1px solid rgba(255,255,255,0.1); border-right:1px solid rgba(0,0,0,0.06);}
.accountButtons a i {padding-right: 8px; opacity:0.5;}
.accountButtons a:nth-of-type(1) {border-left:1px solid #f1f1f1;}
.accountButtons>div span {display:inline-block; font-size: 13px; color:#666; font-weight: 200; padding-right: 10px; font-style:italic;}

#registerDeveloperBtn:hover {background:#1a339a; color:#fff;}
#registerUpdatesBtn:hover {background:#900; color:#fff;}
#signinBtn:hover {background:#090; color:#fff;}
#signoutBtn:hover {background:#900; color:#fff;}
#settingsBtn:hover {background:#1a339a; color:#fff;}
.accountBtn:hover {background:#eee !important;}

#modal {position:fixed; z-index:999999; top:0; left:0; right:0; bottom:0; background:rgba(240,240,240,0.8);}
#modalBox {box-shadow:0px 0px 10px rgba(0,0,0,0.1); background:#fff; padding: 25px; border:1px solid #ddd;position:relative; margin:100px auto; width:90%; max-width: 640px; transform:scale(1.0);}
#modalBox .closeModal {position:absolute; right: 10px; top: 10px; font-size: 24px; color:#999; cursor:pointer;}
#modalBox .closeModal:hover {color:#1a339a;}
#modalBox.shrunk {transform:scale(0.9) !important; opacity:0;}
#modalBox h3 {font-weight: 100; color:#1a339a; font-size: 24px !important;}
#modalBox p {color:#444; font-weight: 300; margin:5px 0px; font-size: 14px; line-height: 1.6;}
#modalBox fieldset {padding:0; margin:0;}
#modalBox fieldset label {font-size: 12px !important; padding:5px 0;}

#modalBox h4 {font-weight: 100; color:#333; font-size: 18px !important; margin: 10px 0;}
#modalBox .modalBtn {display:inline-block; margin:5px 10px 0px 0px;; font-size: 14px; background:#1a339a; color:#fff; padding: 4px 12px; border-radius: 2px;}
#modalBox .modalBtn:hover {background:#111;}

@media(max-width:768px){
    #modalBox {position:absolute; margin:0px auto; top: 10px; left: 5px; right: 5px; max-height: 95vh; overflow:auto;}
}


/*input wrapper classes*/
.inputWrap {position:relative; display:block;margin:2px 0px; overflow:hidden;}
.inputWrap.wrapLeft input {padding-left: 50px !important; margin:0px !important;}
.inputWrap.wrapRight input {padding-right: 50px !important; margin:0px !important;}
.inputWrap i.wrapLeft {position: absolute; left: 11px; top: 4px; font-size: 20px; text-shadow:0px 1px 2px #fff; color:#555;}
.inputWrap i.wrapRight {position: absolute; right: 11px; top: 4px; font-size: 20px; text-shadow:0px 1px 2px #fff; color:#555;}
.inputWrap.wrapLeft:before {position:absolute; top:1px; left:1px; bottom:1px; content:""; background: #eee; width:38px;  border-radius: 3px 0px 0px 3px; border-right: 1px solid #ccc; box-shadow:1px 0px 2px rgba(0,0,0,0.1);}
.inputWrap.wrapRight:after {position:absolute; top:1px; right:1px; bottom:1px; content:""; background: #eee; width:38px;  border-radius: 3px 0px 0px 3px; border-left: 1px solid #ccc; box-shadow:-1px 0px 2px rgba(0,0,0,0.1);}



/*RGE*/
#rgeWrapper .newsStory {background:#fff; }
#rgeWrapper .faq div {display:block !important;}
#rgeWrapper #modal {position:relative !important;}
#rgeWrapper .shrunk {opacity:1 !important;}

/*PARALAX*/
.paralax {position:relative; overflow:hidden; width:100%;}
.h20 {height: 20vh; min-height: 200px;}
.h25 {height: 25vh; min-height: 240px;}
.h30 {height: 45vh; min-height: 280px; max-height: 500px;}
.h50 {height: 50vh; min-height: 300px;}
.h100 {height: 100vh; min-height: 300px;}
.h60 {height: 60vh; min-height: 300px;}
.h80 {height: 80vh; min-height: 300px;}
.paralax .paralax_img {position:absolute; left:0; top:0%; right:0; bottom:0%; background-size:cover; background-position:50% 50%; transition: opacity 2s;}



/*oForm*/
.oForm {padding: 10px; border: 1px solid #eee; border-radius: 4px; background: #fbfbfb;}
.oForm fieldset {position:relative; border:none; padding:0px; margin:0px 0px 10px 0px; width:100%;}
.oForm fieldset.addLeft .addLeft {padding-left: 2px; position:absolute; left:0; top:0; width:32px; border-right:1px solid rgba(0,0,0,0.2); height: 100%; text-align:center; padding-top: 7px; color:#666;}
.oForm fieldset.addLeft .addRight {padding-right: 2px; position:absolute; right:0; top:0; width:32px; border-left:1px solid rgba(0,0,0,0.2); height: 100%; text-align:center; padding-top: 7px; color:#666;}
.oForm fieldset input[type="text"] {height: 32px; outline:0; border-radius: 4px; width:100%; border:1px solid #ddd; padding: 6px 10px; font-size: 14px; font-family:'Roboto'; font-weight: 500;}
.oForm fieldset.addLeft input[type="text"] {padding-left: 40px;}
.oForm fieldset.addRight input[type="text"] {padding-right: 40px;}
.oForm fieldset input[type="text"]:hover {background:#f5f5f5;}
.oForm fieldset input[type="text"]:focus {background:#fff; border:1px solid #367fa9; box-shadow:0px 0px 4px rgba(0,100,200,0.6);}
.oForm fieldset:hover .addLeft, .oForm fieldset:hover .addRight {color:#367fa9;} 
.oForm h2 {font-size: 18px; color:#444; font-weight: 300; margin:5px 0px 15px 0px;}
.oForm fieldset input[type="button"] {-webkit-appearance:none;border:0; outline:0; border-radius: 4px; font-size: 16px; padding: 6px 12px; color:#fff; text-shadow:0px 1px 1px rgba(0,0,0,0.1);}
.oForm .btnBlue {background:#367fa9;}
.oForm .btnBlue:hover {background:#2555a9; box-shadow:0px 0px 3px rgba(0,0,0,0.3);}
.oForm label {font-size: 14px; color:#444; padding: 2px 0px 10px 0px; display:block;}
.oForm .manadatoryError {background:#fee;}
.oForm fieldset textarea {width:100%; height: 100px; border:1px solid #ddd; border-radius:3px; padding: 8px;}
.oFormError {border-color:red !important;}
.oFormThanks {display:none;}

/*selectOption Box*/
.selectOption {margin: 0px;  display:inline-block; border-radius:4px; overflow:hidden; border:1px solid #aaa;  box-shadow:0px 2px 4px rgba(0,0,0,0.1);-webkit-transform:scale(1.001); -moz-transform:scale(1.001); -ms-transform:scale(1.001);  transform:scale(1.001); }
.selectOption>div {position:relative; display:block; background-color:#eee; font-size: 0px; box-shadow:inset 2px 4px 3px rgba(0,0,0,0.1);}
.selectOption>div span {cursor:pointer; position:relative; z-index:10; padding: 6px 8px; font-size: 13px; border-right:1px solid rgba(0,0,0,0.1); border-left: 1px solid rgba(255,255,255,0.2); color:#444; font-weight: 300; text-shadow:0px 1px 0px rgba(0,0,0,0.2); display:inline-block; user-select:none; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none;}
.selectOption>div span:first-of-type {padding-left: 10px; border-left: none;}
.selectOption>div span:last-of-type {padding-right: 10px; border-right: none;}
.selectedOption {color:#fff !important;}
.selectOption>div>div {position:absolute; top:0; bottom:0; min-width: 20px; left:32px; width:80px; z-index:1; }
.so_list:before {content:"f03a"; font-family:fontAwesome; padding-right: 5px; font-size: 80%;}
.so_pointer:before {content:"f041"; font-family:fontAwesome; padding-right: 5px; font-size: 90%;}

/*paging*/
.pagingContain {overflow:auto; white-space:nowrap; width:80%; display:inline-block; height: 45px; vertical-align:bottom; margin-top: 20px;}
.developerPaging a {border:1px solid #ddd; border-radius:4px; min-width: 25px; height: 25px; display:inline-block; padding: 2px; text-align:center; font-weight: 100; margin:0px 5px 20px 5px; text-shadow:1px 1px 0px rgba(0,0,0,0.2);}
.developerPaging .pagingMore,.developerPaging .pagingLess {border:none !Important;}
.developerPaging .pagingCurrent {background:#1a339a; color:#fff;}




/*searchControl*/
#minmaxslider {position:relative; width:90%; border-radius: 4px; margin:10px 5%; height: 4px; border: 1px solid #666; background:#888;}
#minmaxslider span {position:absolute; font-size: 10px; width: 20px; height: 12px; cursor:pointer; top: 5px; background:#444;}
#minmaxslider span em {position:absolute; bottom:-15px; font-style:normal; width: 50px; margin-left:-15px; text-align:center; color:#999;}
#minmaxslider .min {left:0%; margin-left:-8px; user-select:none;}
#minmaxslider .max {right:0%; margin-right:-8px; user-select:none;}
#minmaxslider span:before {position:absolute; content:""; width: 10px; height: 10px; background:#444; transform:rotate(45deg); left:5px; top:-3px;}
#minmaxslider span.min:after {position:absolute; content:"MIN"; top:2px; color:#ddd; font-size: 8px; width:100%; text-align:center;}
#minmaxslider span.max:after {position:absolute; content:"MAX"; top:2px; color:#ddd; font-size: 8px; width:100%; text-align:center;}



select {-webkit-appearance:none; -moz-appearance:none; appearance:none; font-size: 16px; font-weight: 300; border-color:#999; border-radius: 4px; color:#444; background:#fff; width: 100%; padding-left: 10px;
background:url(images/select_arrows.png) no-repeat 100% 50%; background-size:contain; height: 26px;}


.sortingView {background:#f5f5f5; padding: 10px; font-size: 16px; font-weight: 300; margin-bottom: 10px; }
.sortingItems label,.sortingSort label,.keySearch label {display:block; font-size: 14px; font-weight: 300; color:#444; border-bottom: 1px solid #eee; padding-bottom: 2px; margin-bottom: 5px;}
.sortingItems li.selected {background:darkred; color:#fff;}
.sortingItems li {cursor:pointer; display:inline-block; width: 32px; margin-right: 2px; border:1px solid #999; text-align:center; font-size: 12px; padding: 4px 0 3px 0; color:3444; border-radius: 4px;}
.keySearch {position:relative;}
.keySearch input {width:100%; border:1px solid #999; border-radius: 4px; font-size: 16px; color:#444; font-weight: 300; padding: 2px 10px 2px 30px;}
.keySearch i {position:absolute; top: 30px; left: 23px; color:#aaa;}
#productListing {margin-top: 30px;}

#searchCol .searchBox,.minMax {background:#f5f5f5; margin-bottom: 10px;border-radius: 4px; padding: 10px;}
.searchCategory>label {font-size: 14px; font-weight:300; color:#444; position:relative; padding-top: 6px; display:block;  border-bottom:1px solid #eee; padding-bottom: 5px;}
.searchCategory>label i {position:absolute; right:0; font-size: 18px; transform:rotate(0deg);}

.searchCategory.open>label i {transform:rotate(135deg);}

.searchSubCategory {background:#eee; margin:0 -10px; padding: 5px 0; box-shadow:inset 0 5px 10px rgba(0,0,0,0.05);}

.searchSubCategory label {font-size: 13px; display:block; padding: 2px 2px 2px 22px; color:#444; font-weight: 300;}
.searchSubCategory label input {margin-right: 10px;}
#searchCol h2  {font-weight: 700; padding: 5px; color:#444; margin:10px 0;}
.subSubCat {padding: 1px 1px 1px 45px !important; font-size: 12px !important; background:#e9e9e9;}

.minMax {padding-bottom: 20px;}

.paging {width:100%; margin: 20px 0;}
.paging span {white-space:nowrap; }
.paging a {vertical-align:top; color:#666; display:inline-block; padding: 2px 4px 1px 4px; min-width: 24px; border-radius: 4px; border: 1px solid #999; margin:10px 2px; font-size: 12px;}
.paging a:hover {background:#ddd;}
.paging a.selected {background:darkred; color:#fff;;}
.paging span {display:inline-block; max-width:80%; overflow-x:auto;}




.prodBox {position:relative; overflow:hidden; padding: 0; border:1px solid #eee; border-radius: 6px; margin-bottom: 20px; height: 270px !important;}
.prodBox .prodBoxPic {position:absolute; transform:scale(0.9); top:0; width:100%; height: 150px; background-size:contain; background-repeat:no-repeat; background-position:50%;}
.prodBox h3 {background:#fff;margin-top: 150px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size: 16px; font-weight: 300; padding: 5px 12px;}
.prodBoxCopy {font-size: 11px; font-weight: 300; padding: 10px 0; color:#444; height: 48px; overflow:hidden;  padding: 5px 12px;}

.prodBox:hover {box-shadow:0 0 6px rgba(0,0,0,0.2);}
.prodBox:hover .prodBoxPic {transform:scale(1);}
.prodBoxPricing {position:absolute; bottom:0; height: 30px; width:100%;}
.prodBoxPricing b {position:absolute; left:10px; top:-4px; font-size: 20px;}
.prodBoxPricing em {position:absolute; font-size: 11px; right:10px; top:-4px; font-style:normal; text-decoration:line-through; color:#999;}
.prodBoxPricing em:before {position:absolute; left:-20px; bottom: 2px; content:"RRP:"; font-size: 8px; text-decoration:none !important;}

.prodBoxSaving {position:absolute; font-size: 11px; right:10px; top:9px; font-style:normal; color:red;}
.prodBoxSaving:before {position:absolute; left:-45px; bottom: 2px; content:"YOU SAVE:"; font-size: 8px;}
.prodBoxSaleMessage {position:absolute; width: 200px; text-align:center; z-index:99; font-weight: 600; background:#d50015; margin-left:-50px; margin-top: 35px; color:#fff; padding: 3px; box-shadow:0px 5px 6px rgba(0,0,0,0.3); transform:rotate(-45deg); overflow:hidden; white-space:nowrap;}

#productListing .col-md-4 a {color:inherit}
 a .prodBox h3, a .prodBox b {color:#000;}
#relationsList {padding:30px 0;}
#relationsList .prodBox {height: 225px !important;}

.sparkle {position:absolute; left:0; top:0;right:0; bottom:0; background: linear-gradient(270deg, rgba(255,255,255,0), rgba(255,255,255,0.1), rgba(255,255,255,0.6), rgba(255,255,255,0.1), rgba(255,255,255,0));
background-size: 600% 600%; -webkit-animation: sparkleme 7s ease infinite; -moz-animation: sparkleme 7s ease infinite; animation: sparkleme 7s ease infinite; border-radius: 2px;}

@-webkit-keyframes sparkleme {
    0%{background-position:0% 90%}
    50%{background-position:100% 11%}
    100%{background-position:0% 90%}
}
@-moz-keyframes sparkleme {
    0%{background-position:0% 90%}
    50%{background-position:100% 11%}
    100%{background-position:0% 90%}
}
@keyframes sparkleme { 
    0%{background-position:0% 90%}
    50%{background-position:100% 11%}
    100%{background-position:0% 90%}
}

.categoryHead {background:#333;border-top:1px solid #d50015; border-bottom:6px solid #d50015; padding: 10px 0;}
.categoryHead h1 {color:#fff; font-weight: 100; font-size: 4vw;/*48px;*/ }
.subCatCarousel {background:#eee;}

.mobCategoriesIcon {display:none; cursor:pointer;}
.mobCategories {display:none;}

@media(max-width:768px){ 
    .mobCategories {display:block;}
    .categoryHead h1 { font-size:22px;} 
    .mobCategoriesIcon {display:inline-block; background:#d50015; padding:3px 6px 1px 6px; border-radius: 6px; margin-right: 10px;}  
    .mobCategories:before {content:"SELECT A SUB CATEGORY / BRAND"; background:#222; color:#d50015; display:block; text-align:center; font-weight: bold; padding: 5px 0;}
    .mobCategories li {background:#444; padding: 6px 10px; border-bottom:1px solid #555; }
    .mobCategories li a {color:#ddd; font-size: 16px;}
    .mobCategories li:before {content:">"; color:#999; padding-right: 8px;}
    .mobCategories li:hover {backgorund:#000; color:#fff;}
}

.productInfo {background-color: #f9f9f9;margin-top: 60px;border-top:1px solid #ddd;}
.tabs {}
.tabs li .tabContent {display:none; position:relative; min-height: 200px;}
.tabs li.selected .tabContent {display:block; padding: 15px 0; line-height: 1.5; color:#444; font-weight: 300; font-size: 16px;}
.tabs li>h2 {position:absolute; top:-40px; cursor:pointer; height: 40px; background:#fff; border:1px solid #eee; color:#666; padding: 6px 16px; border-bottom-color:#ddd;border-radius: 6px 6px 0 0; font-size: 18px; font-weight: 300;}
.tabs li>h2:hover {color:#444;}
.tabs li:nth-of-type(1) h2 {left:15px;}
.tabs li:nth-of-type(2) h2 {left:145px;}
.tabs li:nth-of-type(3) h2 {left:287px;}
.tabs li.selected h2 {background:#f9f9f9; color:#000; border-color:#ddd; border-bottom:none;}

.prodPicShow {border:1px solid #ddd; border-radius: 6px;}
.prodPicShow .mainPic {width:100%; padding-top: 70%; background-size:contain; background-repeat:no-repeat; background-position:50%; }
.prodPicShow img {display:none;}
.prodPicShow ul {display:block;font-size:0; white-space:nowrap; overflow:auto; height: 70px; border:1px solid #ddd; margin:3px; border-radius:4px;}
.prodPicShow ul li {width:100px; height: 60px; border:1px solid #ccc; display:inline-block; margin:4px 1px 4px 3px; opacity:0.6; background-size:contain; background-repeat:no-repeat; background-position:50%;}
.prodPicShow ul li:hover {opacity:1;}

.quantity {background:#ddd; width: 120px; border-radius: 20px; position:relative; height: 40px; border:1px solid #ccc; display:inline-block; vertical-align:top;}
.quantity span {position:absolute; top: 3px; background:#fff; border-radius: 40px; padding:0px; height: 32px; width:32px; border:2px solid #ddd;}
.quantity .plus {right: 4px; color:green;}
.quantity .minus {left: 3px; color:red;}
.quantity i {font-size: 36px; position:absolute; left:0; top:-4px;}
.quantity input {width: 36px; margin:0 4px; border:none; border-radius: 3px;  padding:0; font-size:18px; position:absolute; left: 38px; top: 8px; text-align:center; outline:none;}
.quantity span:hover {transform:scale(0.9);}



.QuickAdd {position:absolute; right:22px; top: 5px; font-size: 24px; color:green; z-index:99;}
.QuickAdd:after {content:"QUICK ADD"; font-family:'Roboto'; transform:rotate(-90deg); transform-origin: 79px 8px;  color:#fff;font-size:12px; 
position:absolute; left:-69px; top:5px; opacity:0; background:green; padding: 2px 6px; border-radius: 12px 0 0 12px;
-webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;
}
.QuickAdd:hover:after {opacity:1; z-index:-1; transform:rotate(0deg);}
.QuickAdd:hover {color:darkgreen;}


.categoryFoot {background:#f5f5f5; padding:30px 0; margin-bottom: -20px; border-top:solid 2px #ddd; font-size: 16px; line-height: 1.6; color:#444; font-weight: 300;}
.categoryFoot h2 {font-size: 24px; margin-bottom: 10px; font-weight: 300; color:darkred;}
.categoryFoot p {font-size: 16px; line-height: 1.6; color:#444; font-weight: 300;}
.categoryFoot a {color:#d60015; font-weight: 600;}
.categoryFoot span, .categoryFoot div, .categoryFoot b {background-color:transparent !important;}

footer .logoLayer {perspective:400px;width:180px;float: right;margin-right: 20px;margin-bottom: -20px;}
.logoGroup {width:100%; max-width:180px; position:relative; padding-top:42.5%; transform:rotateX(20deg);}
.logoBarn {position:absolute; left:0; top:0; right:0; bottom:0; width:100%; height: 100%; background:url(images/bbq_barn_layer.png) no-repeat 50%; background-size:contain; border-radius: 3px;}
.logoFire {position:absolute; left:2%; top:2%; right:2%; bottom:2%; width:96%; height: 96%; background:url(images/bbq_barn_fire.gif) no-repeat 50%; background-size:contain;}
.logoShadow {position:absolute; left:4%; top:10%; right:4%; bottom:3%; width:92%; height: 87%; backgorund-color:#000; box-shadow:0px 10px 10px rgba(0,0,0,0.5);}
.logoLayer.start .logoGroup {transform:rotateX(380deg);}
.logoLayer:hover .logoGroup {transform:rotateX(380deg);} 

@media(max-width:768px){
.sorting label {padding-top: 7px;}
.sorting .keySearch i {top: 37px;}
#topNav {height: 62px;}
}


#quickAddAlert {position:fixed; top:-60px; z-index:999; border-bottom:1px solid #555; box-shadow:0px 5px 10px rgba(0,0,0,0.3);font-weight: 300; width:100%; height: 50px; background:#222; color:#fff; padding: 13px 0; text-align:center; font-size: 20px;}
#quickAddAlert i {margin-right: 10px;}
#quickAddAlert.open {top:0 !important;}

#shoppingCart h1 {font-size: 32px; font-weight:200; margin-bottom: 20px; margin-top: 10px;}
.basket {border:1px solid #ddd; border-top:none;}
.basket li {padding:10px; border-top: 1px solid #ddd;}
.basket li h4 {font-size:20px; font-weight: 300; margin-bottom: 5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.basket li p {font-size: 14px; font-weight: 300; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.basket li:nth-of-type(2n) {background:#f9f9f9;}
.basket li .col-md-5 {text-align:right;}
.basket .quantity {min-width:120px; display:inline-block; margin-top: 5px;}
.basket .itemValue,.basket .itemTotal {position:relative; width:25%; display:inline-block; text-align:center; vertical-align:top; padding:12px 0; text-align:right; padding-right: 20px; }
.basket .itemValue:before,.basket .itemTotal:before  {content:"£"; font-size: 12px;}
.basket li.basketItem:nth-of-type(1) .itemValue:after {content:"Item Value";position:absolute;font-size: 8px;width:54px;background:#333;color:#fff;text-align:center;right: 11px;top:-10px;padding:2px 4px;border-radius: 0 0 4px 4px;}
.basket li.basketItem:nth-of-type(1) .itemTotal:after {content:"Item Total";position:absolute;font-size: 8px;width:54px;background:#333;color:#fff;text-align:center;right: 16px;top:-10px;padding:2px 4px;border-radius: 0 0 4px 4px;}
.basket li.discount {background:#333; color:#fff;}
.basket li.discount .col-md-6 {padding-right: 36px; }
.basket li a {color:darkred; font-weight: 500;  }

.discounts {padding:15px;border:1px solid #ddd;border-top:none;float: right; width: 375px;}
.discounts h2 {font-size: 20px; font-weight: 300; margin-bottom: 10px;}
.discounts label {font-size: 13px; color:#444; font-weight:400;}
.discounts input[type="text"] {border: 1px solid #bbb; padding: 3px 10px; margin:0 10px; font-size: 14px; width: 100px;}
.discounts input[type="button"] {background:darkgreen; color:#fff; height: 26px; border-radius: 4px; padding-top: 3px; font-size: 14px;}
.discounts input[type="button"]:active {background:#000;}
.discount {position:relative;}
.discount .fa-times-circle {color:#aaa; position:absolute; right: 10px; top: 11px;}
.discount .fa-times-circle:hover {color:red;}
.discount>.row>.col-md-6 {overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.totals em {display:block; font-style:normal; margin:5px 0; font-size: 9.5px; line-height:1.5; color:#444;}
.totals em br {display:block; margin:10px; line-height:1.8;}

.totals {padding:0;border:1px solid #ddd;border-top:none;float: right; width: 375px; clear:both;}
.totals p {padding: 10px 15px; border-bottom: 1px solid #ddd; font-weight: 300; font-size: 16px;}
.totals p:last-child {border-bottom:none;}
.totals p span {float:right; padding-right: 16px; font-size: 16px; }
.totals p span:before {content:"£"; font-size: 75%;}
.totals p:nth-of-type(2) {background:#eee;}
.totals p:nth-of-type(4) {background:#333; color:#fff;}


@media(max-width:768px){
.basket li .col-md-6:nth-of-type(2) {border-top: 1px solid rgba(0,0,0,0.1); margin-top: 15px; padding-top: 10px; margin-left:1% !important; width:98%;}
.basket li.discount .col-md-6:nth-of-type(2) {margin-top:-5px; text-align:right; padding-right: 36px;}
.discounts,.totals {width:100% !important; float:none;}
.discounts label {display:block; padding-bottom: 10px;}
.discounts input[type="text"] {margin-left: 0;}
}

/* SLIDER STYLE */
.slidePic {position:absolute; left:0; right:0; width:100%; height: 100%; bottom:0; background-size:cover; background-position:50% 50%; background-repeat:no-repeat;}
.slide {overflow:hidden;}
.slide .container {width:96%; max-width:1240px; margin:0px auto; position:relative; padding-top:33%;}
.slide .container .box  {position:absolute; min-width:33%;}
.slide .container .top {top:5%;}
.slide .container .left {left:5%; }
.slide .container .center {/* left:25%; *//* width:50%; *//* width: auto; *//* margin: 0 auto; */}
.slide .container .middle {top: 45%;}
.slide .container .right {right:5%;}
.slide .container .bottom {bottom:5%;}
.slide .container .alignRight {text-align:right;}
.slide .container .alignLeft {text-align:left;}
.slide .container .alignCenter {text-align:center;}
.slide .container h2 {font-size: 4vw; font-weight:600; margin:0 0 10px 0 !important;} 
.slide .container h3 {font-size: 2.5vw; font-weight:600; margin:0 0 6px 0 !important;}
.slide .container .button {cursor:pointer; display:inline-block; padding: 6px 38px 6px 18px; position:relative; background:#ca0012; top:0; color:#fff; font-weight: 500; border-radius:6px; box-shadow:0px 2px 4px rgba(0,0,0,0.4);}
.slide .container .button i {opacity:0.4; position:absolute; right: 12px; font-size: 18px; color:#fff; font-size: 20px; top: 6px;}
.slide .container .button:hover {transform:scale(1.1); top:-5px; box-shadow:0px 9px 6px rgba(0,0,0,0.2);}
.slide .container .button:hover i {opacity:1;}

.hero { position:relative; padding-top: 33%; z-index:10; overflow:hidden;}
.slides {position: absolute;top: 0;left: 0;width: 100vw; padding-top: 33%;transform-style: preserve-3d;}
.slides>li {display:block;position:absolute;top:0;left:0;width:100%;bottom: 0; }
.slidenav {position:absolute; z-index:50; bottom:5px; text-align:center; width:100%;}
.slidenav li {display:inline-block; margin: 10px 3px; width:14px; height: 14px; background:rgba(255,255,255,0.6); border-radius: 14px; box-shadow:inset 0 3px 4px rgba(0,0,0,0.3); border-bottom:1px solid rgba(255,255,255,0.7);}
.slides li.out {transform:scale(0.8); opacity:0;}
.slides li.in {transform:scale(1.1); opacity:0;}

@media(max-width:640px){
.hero {padding-top: 50% !important; min-height:215px;}
.slide .container {padding-top:45%;}

}
.slideFlash {position:absolute; background:red; text-align:center; width: 500px; text-align:center; top:70px; color:#fff; left:-150px; transform:rotate(-45deg); padding: 5px 0; box-shadow:0 10px 20px rgba(0,0,0,0.3);}
.slideFlash h3 {font-weight: 900; font-size: 24px; margin-bottom:-5px;}
.slideFlash h4 {font-weight: 600; font-size: 16px;}  
@media(max-width:480px){
    .slideFlash {bottom:0; top:auto; left:0; width:100%; transform:rotate(0deg);}
}

/*MEGA MENU*/
.mmWrap {background:#c90012; padding:20px 0 10px 0; box-shadow:0px 5px 10px rgba(0,0,0,0.3);}
.mmBox {border:1px solid darkred; background:#fff; margin-bottom: 15px; border-radius:6px; box-shadow:2px 4px 5px rgba(0,0,0,0.2)}
.mmBox h4 {font-size: 18px; color:#222;font-weight: 300; padding-bottom: 10px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.mmBox span {display:block; margin: 5px 20px; padding-top: 30%; background-size:contain; background-repeat:no-repeat; background-position:50%;}
.mmBox a {color:inherit;}



.prodSearch {position:relative;max-width: 480px;margin: 0 auto;}
.prodSearch fieldset {margin-bottom:  20px;}
.prodSearch fieldset input[type="text"] {font-weight: 300;margin:0;padding:8px 15px;border:none; border-bottom:1px solid #eee;font-size: 20px;color:#444;width:100%;border-radius: 25px;box-shadow: 0 4px 4px rgba(0,0,0,0.1);}
.prodSearch fieldset input[type="button"] {cursor:pointer;background:#19a53d;font-weight: 800;padding:10px 15px;border:none;color:#fff;border-radius: 0px;font-size: 16px;text-transform:uppercase;width:19%;border-radius: 25px;box-shadow: 0 4px 4px rgba(0,0,0,0.1);}
.prodSearch fieldset .searchWrap {position:relative;display:inline-block;margin-right: 1%;}
.prodSearch fieldset input[type="button"]:hover {background:#000;}

.prodSearch fieldset .searchWrap ul {width: 91%; margin-left:4%; display:block !important;max-height: 200px;overflow:auto;position:absolute;left:2px;right:2px;top:43px;font-size: 16px;background:#fff; z-index:10;box-shadow:0 5px 6px rgba(0,0,0,0.2);}
.prodSearch fieldset .searchWrap ul li {background:#f5f5f5; position:relative; border-bottom:1px solid #ddd; cursor:pointer; padding: 5px 12px 6px 12px; font-weight: 600; color:#333;}
.prodSearch fieldset .searchWrap ul li span:nth-of-type(1) {display:block; padding-right:60px; font-size: 14px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.prodSearch fieldset .searchWrap ul li span:nth-of-type(2) {position:absolute; right: 12px; top: 6px; font-size: 14px; font-weight: 600;}

.prodSearch fieldset .searchWrap ul li:hover {background:#c90012 !Important; color:#fff;}
.prodSearch fieldset .searchWrap ul li:last-child {border-bottom:none;}

@media(max-width:768px){
.prodSearch > div h1 {font-size: 48px; line-height:1;}  
.prodSearch fieldset {max-width:96%;}
.prodSearch fieldset input[type="text"] {width:100%; font-size: 16px; margin-top: 6px;}
.prodSearch fieldset input[type="button"] {width:100%; margin-top: 10px;}
.prodSearch fieldset .searchWrap {width:100%;}
.prodSearch {max-width: 80%;}

}

.mainPic {position:relative; overflow:hidden;}
.zoomPic {position:absolute; top:0; left:0; width:100%; height: 100%; display:none; pointer-events:none; }
.zoomPic>div {position:absolute; width:1000px; height:1000px; background-size:contain; background-position:50% 50%; background-color:#fff; background-repeat:no-repeat;}
.mainPic.zoomable:hover:after {display:none;}
.mainPic.zoomable:after {position:absolute; left:10px; top:5px; content:"\f00e"; z-index:1; font-family:fontAwesome; font-size:32px; opacity:0.4;}

#addToCart,.outOfStock {background:#c90012;text-align:center;height: 40px;width:120px;border-radius: 21px;color:#fff;border: 4px solid #d5d5d5;display:inline-block;font-size: 16px;font-weight: 600;box-shadow: 0 0 1px rgba(0,0,0,0.7);}
#addToCart:hover {background:#600;}
h5.outOfStock {float:right; padding-top: 6px;}

.productDisplay {margin:20px 0;}
.productContent h1 {font-size: 26px; font-weight: 300; padding: 15px 0;}
.productContent h3 {font-size: 18px; font-weight: 300; margin-bottom:20px;}

.tabVideoBox {width:100%; position:relative; padding-top: 56%;}
.tabVideoBox iframe {position:absolute; left:0; top:0; width:100%; height: 100%;}
.productRelated h2 {font-size: 26px; font-weight: 300; padding: 15px 0; color:#444;}

#newAccount input[type="text"], #newAccount select {margin-bottom: 15px;}
.customerDetails h2 {font-size: 22px; color:#333; margin: 20px 0;}
.customerDetails h2 a {color:darkred; font-weight:600;}
.customerDetails h2 a:hover {color:black;}
.customerDetails h3 {font-weight: 300; font-size: 18px; margin-bottom: 12px; border-bottom:1px solid #eee; max-width:384px;}

.passwordSection p {font-size: 11px; line-height: 1.4; color:#444; margin-bottom: 6px;}



.orderHistory h2 {font-size: 24px; font-weight: 300; margin: 20px 0;}
.orderHistory .userDetails {background:#f9f9f9; padding: 15px; border-radius: 8px;}
.orderHistory .userDetails input:disabled {background:none; border-color:rgba(255,255,255,0);}

.orderHistoryTblWrap {overflow-x:auto; margin-bottom:20px;}
.orderHistoryTbl  {background:#f5f5f5; width: 100%; min-width:480px; border-top:1px solid #ddd; border-bottom:1px solid #ddd;  min-width:560px;}
.orderHistoryTbl thead {background:#eee; font-size: 12px;}
.orderHistoryTbl thead th { text-align:center !important;}
.orderHistoryTbl tbody td {padding:10px 5px; text-align:center; font-size: 14px; color:#444;}
.orderHistoryTbl tbody td[colspan="6"] {padding:0 !important; background:#fff;}
.orderHistoryTbl>tbody>tr {border-bottom:1px solid #ddd;}
.orderItem {width:90%; margin-left: 10%;}
.orderItem thead {background:#999; color:#fff;}
.orderItem tbody tr {background:#ddd; color:#000; border-bottom:1px solid #bbb;}
.orderItem tbody tr td {color:#222;}
.orderHistoryTbl tr td:nth-of-type(6) {padding:2px;}
.orderHistoryTbl .paid {background:red; color:#fff; padding: 3px; width:90%; display:block; border-radius: 20px; margin-top: 5px;}
.orderHistoryTbl .shipped {background:green; color:#fff; padding: 3px; width:90%; display:block; border-radius: 20px; margin-top: 5px;}
.orderHistoryTbl .cancelled {background:#222; color:#fff; padding: 3px; width:90%; display:block; border-radius: 20px; margin-top: 5px;}
.orderItem tbody tr td:nth-of-type(1) {width:50%; min-width:240px; text-align:left; padding-left: 10px;}
.customerDetails p {font-weight: 300; background:#eee; padding: 5px; text-align:center; border-radius: 20px; margin-bottom:20px;}
.customerDetails p a {font-weight: bold; color:red; text-decoration:underline;}
#submitCartPP,#submitCart,#emptyCart {margin-bottom: 10px; border:none; color: #fff; height: 32px; border-radius: 6px; padding-top: 3px; font-size: 16px; width:100%;}
#submitCart {background: darkgreen;}
#submitCartPP {background: #0c5aab;}
#emptyCart {background: red;}
#submitCart:hover,#emptyCart:hover {background:#000;}




.homeBoxes {padding:30px 0; background:#f5f5f5; border-top:1px solid red;}
.homeBoxes .col-md-3>a>div {border:1px solid #ddd; margin-bottom: 10px; padding:15px; text-align:center; box-shadow:0 0 2px rgba(0,0,0,0.1); border-radius: 6px; background:#fff;}
.homeBoxes .col-md-3>a>div h3 {color:#ca0015; font-weight: 300; font-size: 24px; text-transform:lowercase !important; padding: 10px;}
.homeBoxes .col-md-3>a>div p {color:#444; font-size: 16px; font-weight: 300;}
.homeBoxes .col-md-3>a>div i {font-size: 32px; color:#666;}
.homeBoxes .col-md-3>a>div:hover {transform:scale(1.05); box-shadow: 3px 6px 6px rgba(0,0,0,0.1);}
.latest h2 {font-size: 28px; padding: 30px 0; font-weight: 300; color:#444;}

.homeSpecial {background:#ca0015 !important; }
.homeSpecial h3 {color:#fff !important; font-weight: 600 !important;}
.homeSpecial p {color:#fff !important; opacity:0.75;}
.homeSpecial i {color:yellow !important;}

.hero {overflow:hidden; perspective:900px; background:#222; clear:both;}
.slides li.opening {transform:rotateX(-110deg); transform-origin:50% 0 !important;}
.slides li.open {transform:rotateX(0deg); transform-origin:50% 0%;}
.slides li.closing {transform:rotateX(110deg); transform-origin:50% 100%;}
.slides li.closed {transform:rotateX(110deg); transform-origin:50% 100%; transition:none; -webkit-transition:none; -moz-transition:none; display:none;}

.slides li:after {transition:all 1s ease-in-out; -webkit-transition:all 1s ease-in-out; -moz-transition:all 1s ease-in-out;}
.slides li.open:after {pointer-events:none; position:absolute; content:""; font-size:100px; top:0; left:0; right:0; bottom:0; width:100%; height:100%; background-color:#000; opacity:0; z-index:999;} 
.slides li.opening:after {pointer-events:none; position:absolute; content:""; font-size:100px; top:0; left:0; right:0; bottom:0; width:100%; height:100%; background-color:#000; opacity:0.6; z-index:999;} 
.slides li.closed:after {pointer-events:none; position:absolute; content:""; font-size:100px; top:0; left:0; right:0; bottom:0; width:100%; height:100%; background-color:#fff; opacity:0; z-index:999;} 
.slides li.closing:after {pointer-events:none; position:absolute; content:""; font-size:100px; top:0; left:0; right:0; bottom:0; width:100%; height:100%; background-color:#fff; opacity:1; z-index:999;} 
 
.sPrev,.sNext {cursor:pointer; position:absolute; padding-right: 3px; text-align:center; padding-top: 7px; z-index:100; top: 50%; left:20px; background:rgba(255,255,255,0.5); border-radius: 100%; width: 30px; height: 30px;}
.sNext {left:auto; right: 20px !important; padding-right:0; padding-left: 2px;}
.sPrev:hover,.sNext:hover {background:rgba(255,0,0,0.7); color:#fff;}
.slidenav li.selected {background:red !important;}

@media(max-width:768px){
#searchCol {position:fixed; top:0; left:0; right:0; bottom:0; z-index:1000; background:#fff; overflow-y:auto; display:none;}
#searchCol h2 {position:relative;}
#searchCol h2 i {position:absolute; right: 10px; display:block !important; top: 4px; font-size: 28px; }
#searchColMobile {display:block !important; text-align:center; background:#ddd; margin:0 -25px; padding: 10px 0;}
#searchColMobile p {background:darkred; border:1px solid #fff; font-size: 18px; display:inline-block; color:#fff; cursor:pointer; padding: 5px 20px; border-radius: 20px;}
#searchColMobile p i {margin-right: 10px;}
#searchColMobile p:hover {background:#000;}
.sPrev {left:2px; top:46%;}
.sNext {right:2px !important; top:46%;}
.accountButtons {white-space: nowrap;}
.accountButtons a {font-size: 11px;}
}
@media(min-width:769px){ #searchCol {display:block !important;}}
 
 @media(max-width:640px){
.orderHistoryTblWrap {position:relative; margin:15px -25px;}
.orderHistoryTblWrap:before {position:absolute; left:0; top:0; bottom:0; right:0; content:"drag left and right to view table contents"; background:rgba(255,255,255,0.6); border:2px dotted red; color:red; width:100%; padding: 24px; text-align:center; font-weight: bold; }
.orderHistoryTblWrap:hover:before {display:none;}
 }
 
  
  
 .sitemap h1 {font-size: 32px; font-weight: 100; margin: 20px 0;}
 .sitemap a {color:inherit;}
 .sitemap h3 {font-size: 18px; color:#444; font-weight: 300; }
 .sitemap .col-md-4>ul>li>h3 {border-bottom:1px solid #ddd; margin-top: 10px; padding:5px 0;}
 .sitemap .col-md-4>ul>li>ul {margin: 10px 0; padding:0 0 0 10px;} 
 .sitemap .col-md-4>ul>li>ul>li>h3 {font-size: 17px; margin: 4px;}
 .sitemap .col-md-4>ul>li>ul>li>ul {margin: 5px 0; padding:0 0 0 15px;} 
 .sitemap .col-md-4>ul>li>ul>li>ul>li>h3 {font-size: 16px; margin: 4px;}
 .sitemap_cat h4 {background:#f5f5f5; padding: 8px 12px; color:darkred; position:relative; border-bottom:1px solid #eee; border-top:1px solid #f9f9f9;}
 .sitemap_cat h4 span {color:#444; position:absolute; right:10px; cursor:pointer; font-size: 12px; background:#ddd; padding:4px 8px 3px 8px;; border-radius: 10px;}
 .sitemap_cat h4 em {position:absolute; color:#eee; right: 110px; font-style:normal; font-size: 9px; width: 20px; height: 20px; background:#999; text-align:center; border-radius: 100%; padding-top: 5px; padding-right: 1px;}
 .sitemap_cat h4 span:hover {background:#444; color:#fff;} 
 .sitemap_prods {background:#eee; box-shadow:inset 0px 4px 5px rgba(0,0,0,0.1);}
 .sitemap_prods p {padding: 4px 20px 4px 12px; border-right: 1px solid #ddd; font-size: 14px; color:#444; font-weight: 300; display:inline-block; width:49%; min-width: 280px; position:relative;}
 .sitemap_prods p b {position:absolute; right: 10px; top:3px;}   
 .sitemap_prods p span {display:block; padding-right: 60px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;}
 .sitemap_prods p:hover {color:red;} 
 
 
 .privacy table {border-collapse:collapse;}
 .privacy table thead td {background:#ddd; border-right: 1px solid #fff;}
 .privacy table thead td p {font-weight: bold;} 
 .privacy table tbody td {background:#f4f4f4; border-right: 1px solid #fff; border-bottom:1px solid #fff} 
 .privacy table p {padding:0; margin:0; font-size: 14px;} 
 
  .twitterWrap {max-height:80vh; overflow:auto; margin-bottom: 30px;}

 
.developerFilters {background:#555; padding: 8px; 0; box-shadow:inset 0 5px 8px rgba(0,0,0,0.5); margin:0 -10px; text-align:center;}
.developerFilters label {display:inline-block; width:auto; font-size: 12px; color:#ddd; font-weight: 300; text-align:left;} 
.developerFilters input[type="text"] {width:160px; display:block;  border:1px solid #aaa; padding: 2px 10px;; margin:5px 0 5px 0; border-radius: 4px; font-size: 16px; color:#444; font-weight: 300;}
.developerFilters input[type="submit"] {border-radius: 5px; background:#c90012; color:#fff; border:none; display:inline-block; margin: 0; padding: 3px 16px; font-size: 16px;}
.developerFilters select {display:block; background:#fff; width:100%; margin: 5px 0px 5px 0px; min-width:120px;}
 
 
 .slideCatSearch {background:#c90012; padding: 5px; border-radius: 14px; margin-bottom: 5px;}
 .slideCatSearch select {background:none, url(images/select_arrows.png) no-repeat 99% 50%; background-size:contain; border:2px solid #fff; height: 34px; border-radius: 10px; color:#fff; font-weight: 500; outline:none; } 
 
 
 #rgeWrapper .slide { position:relative; height: 400px !important; overflow:hiddden;}
 
 
 .navCart {position:relative;}
 .navCart:before {display:block; content:"SHOPPING CART"; text-align:center; color:#fff; font-weight: 300; padding: 4px 0 2px 0; background:#1A1A1A; border-bottom: 2px solid #c90012; letter-spacing:2px; } 
 .navCart a {color:#333; display:block; padding: 5px; font-size: 14px;} 
 .navCart a i {margin:0 5px;} 
 .navCart a:after {content:"Checkout"; text-decoration:underline; font-size: 13px; display:inline-block; padding: 5px 8px; position:absolute; right: 0; background:#c90012; color:#fff; bottom: 3px;} 
 .navCart a:hover:after {background:#1a1a1a;} 
 
 .productInfo sup {font-size: 50%; display:inline-block; vertical-align:top;}

.accountOption {background:none !important; text-align:left !important;}
.accountOption a {display:inline-block; outline:none; background:#ddd; color:#333 !important; text-decoration:none !important; margin-right: 20px; padding: 5px 20px; border-radius: 20px; font-size: 20px; transition: all 0.2s ease-in-out;}
.accountOption a:hover {background:red; color:#fff !important; transform:scale(1.05);}
@media(max-width:640px){ .accountOption a {display:block; margin:5px 0; text-align:center;}}





.headerSearch {display:none;}

.headerSearch {display:inline-block; z-index:999;position: absolute;max-width: 320px !important; width: 100%;right: 262px;}
.headerSearch .slideCatSearch {display:none;}
.headerSearch ul {max-height: 80vh !important; margin:-10px 0 0 0px !important; width:100% !important; box-shadow: 3px 2px 10px rgba(0,0,0,0.1) !important;}
.headerSearch .prodSearch fieldset input[type="text"] { border-radius: 0; margin:-2px 0 0 0; font-size: 14px; border-left: 1px solid #eee; box-shadow:none; padding: 7px 10px 8px 40px; border-bottom:0px;}
.headerSearch ul li {background:#fff !important; }
.headerSearch ul li span {font-size:12px !important; font-style:normal !important; font-weight: 500;}
.headerSearch ul li span:nth-of-type(1) {padding-right: 70px !important;}
.headerSearch ul li:hover span {color:#fff;}
.headerSearch:before {position:absolute; content:"\f002"; z-index:100; left: 10px; top: 2px; font-size: 24px; font-family:fontAwesome; color:#aaa;}

@media(max-width:768px){
.headerSearch {display:block;position:relative !important;top: 235px;right:0;left:10px;margin:0 !important;height: 36px;max-width:100% !important;width:100% !important;border-top: 1px solid #ddd !important;}
.headerSearch .prodSearch {position:absolute; width:100%; max-width:100%;}   
header {height: 235px !important;}

.headerSearch ul {max-height: 60vh !important; z-index:99999999; }
.headerSearch:after {position:absolute; z-index:100; content:"\f057"; z-index:100; right: 32px; top: 2px; font-size: 24px; font-family:fontAwesome; color:#aaa;}
.headerSearch:after:hover {color:red !important;}
#accountStrap {max-width: 100%;}
}


#bookmarks {position:fixed; height: 80vh; left:-185px; z-index:99999; top:10vh; width: 180px; padding: 10px; border-radius: 0 4px 4px 0; border:1px solid #aaa; background:#fff; box-shadow:0 2px 5px rgba(0,0,0,0.3);}
#bookmarks li {display:inline-block; margin-bottom: 5px; border:1px solid #eee; border-radius: 2px; background:#fff; text-align:center; }
#bookmarks span {position:absolute; cursor:pointer; transform:rotate(90deg); transform-origin:0% 100%; left: 178px; white-space:nowrap; background:#b40010; color:#fff; padding: 5px 20px 10px 20px; border-radius: 10px 10px 0px 0; box-shadow: inset 0 -5px 6px rgba(0,0,0,0.2);}
#bookmarks span:hover {background:#000;}
#bookmarks span i {margin-right: 5px;}
#bookmarks li h5 {color:darkred; font-weight: bold; text-align:center; padding: 70px 20px; font-size: 18px;}
#bookmarks div { position:absolute; top: 5px; left:5px; width: 170px; bottom: 5px; background:#f5f5f5;}
#bookmarks div ul {overflow:auto; position:absolute; top: 0px; left:0px; width: 170px; bottom: 0px; background:#f5f5f5;}

#bookmarks.show {left:0;}
#bookmarks.show span {padding-bottom: 5px;}
#bookmarks em {position:absolute; z-index:100; right: -50px; top: 25px; font-style:normal; border: 3px solid #fff; background:red; width: 29px; height: 29px; border-radius: 29px; text-align:center; color:#fff; font-weight: bold; text-shadow:0 1px 2px rgba(0,0,0,0.2); padding-top: 2px; box-shadow: 3px 3px 6px rgba(0,0,0,0.3);}

#bookmarks li h3 {font-weight: bold; font-size: 14px; text-align:center; color:#444; padding: 10px 5px;}
#bookmarks li img {max-width: 100px;}
#bookmarks li p {font-size: 11px;}
#bookmarks li a {border-radius: 6px; color:#fff; font-weight:bold; padding: 5px 10px 4px 10px;; display:inline-block; margin: 5px 2px; font-size: 12px;}
#bookmarks li a.viewBookmark {background:#44cc00;}
#bookmarks li a.removeBookmark {background:#b40010;}
#bookmarks li a i {margin-right: 5px;}
#bookmarks li a:hover {background:#000;}


#productShow a.removeBookmark {background:#b40010; border-radius: 6px; color:#fff; font-weight:bold; padding: 5px 10px 4px 10px;; display:inline-block; margin: 5px 2px; font-size: 12px;}
#productShow a.removeBookmark i {margin-right: 5px;}
#productShow a.addBookmark {background:#44cc00; border-radius: 6px; color:#fff; font-weight:bold; padding: 5px 10px 4px 10px;; display:inline-block; margin: 5px 2px; font-size: 12px;}
#productShow a.addBookmark i {margin-right: 5px;}
#productShow a.removeBookmark:hover,#productShow a.addBookmark:hover {background:#000;}


.stockSignup {padding: 15px; background:#f5f5f5; border:1px solid #ddd; border-radius: 6px; box-shadow:0 3px 15px rgba(0,0,0,0.2);}
.stockSignup p {font-size: 22px; font-weight:bold; padding: 5px; 0;}
.stockSignup p em {font-size: 14px;}
@media(max-width:992px){
    .stockSignup p {font-size: 20px;}
    .stockSignup input[type="button"] {width:100%;}
}

.shopNowBtn {display:inline-block; background:red; padding: 6px 24px; border-radius: 30px; margin:10px 0; color:#fff !important; font-weight:bold !important; font-size: 24px; text-decoration:none !important; transform:scale(1); box-shadow:0px 0px 2px rgba(0,0,0,0.2); border:2px solid red;}
.shopNowBtn:hover {background:#000; transform:scale(1.05); box-shadow:4px 5px 15px rgba(0,0,0,0.2);}


#continueShopping {background-color:#09f; border: none; color: #fff; border-radius: 6px; padding:6px 12px; font-size: 16px; float:right; margin:10px 15px;}
#continueShopping:hover {background:#000;}

#topNav .redNav>a {background:red; color:white !important; padding: 3px 10px 1px 10px; font-weight:bold !important; transform:scale(1.2) !important; display:inline-block;}
#topNav li.redNav>a {color:white !important;}

#topNav li.firstItem ul li a {color:#fff !important; font-weight:normal;}

div[data-pp-message] {padding:12px; float:left;}



/*HOME SLIDER*/
.homeSlider {position:relative; background:#000;}
.homeSlider ul {padding-top: 46%;}
.homeSlider li {position:absolute; top:0; left:0; text-align:center; width:100%; height: 100%; overflow:hidden;}
.homeSlider li span {position:absolute; top:0; left:0; text-align:center; width:100%; height: 100%; background-size:cover;}
.homeSlider li h2, .homeSlider li img, .homeSlider li a, .homeSlider li p  {position:relative; z-index:10;}
.homeSlider li h2 {color:#fff; font-size: 28px; margin: 15px 0;}
.homeSlider li a {border-radius: 2px; background:#fff; color:orange !important; border:none; font-weight: 300 !important; padding: 10px 40px; transition:all 0.2s ease-in-out;}
.homeSlider li a:hover {color:#fff !important; background:red;}


.homeDiscover {background:url(files/image/homeNew/discover_bricks.jpg); background-size:cover; padding-bottom:50px;}
.homeDiscover .contained {max-width: 800px;}
.homeDiscover h2 {padding: 25px 0; text-align:center; color:darkred; font-size: 32px; font-weight: 300;}
.homeDiscoverBox {position:relative; padding-top: 66%; overflow:hidden; margin-bottom: 25px;}
.homeDiscoverBox span {position:absolute; left:0; top:0; right:0; bottom:0px; background-size:cover; transition:all 1s ease-in-out; z-index:5;}
.homeDiscoverBox a {position:absolute; top:25%; bottom: 25%; font-weight:300; padding: 20px 0; right:0; width:100%; z-index:10; width:100%; font-size: 34px; text-align:center; display:block; color:#fff; background:rgba(100,0,0,0.7) !important;}
.homeDiscoverBox:hover span {transform:scale(1.1);}


.homeInspired {background:url(files/image/homeNew/inspired_desktop.jpg); background-size:cover; padding:70px 0;}
.homeInspired h3 {color:#fff; font-size:36px; font-weight:300; padding:30px 0;}
.homeInspired a {display:inline-block; color:#fff; font-size: 24px; font-weight: 300; padding: 10px 25px; border:2px solid #fff; margin-right: 10px;  transition:all 0.2s ease-in-out;}
.homeInspired a:hover {border-color:red; background:#000;}

.homeFreedom {margin:60px 0; position:relative;}
.homeFreedom h3 {color:red; font-size: 32px; max-width: 320px; font-weight:300; margin-bottom: 20px;}
.homeFreedom h3 span {color:darkred;}
.homeFreedom p {font-size: 14px; /*max-width: 400px;*/ color:#333; margin-bottom: 15px;}
.homeFreedom a {display:inline-block; background:darkred; color:#fff; padding: 10px 25px; font-size:24px;  font-weight:300; transition:all 0.2s ease-in-out; margin-top: 20px;}
.homeFreedom a:hover {background:black;}

.homeFreedomImg_desktop {position:absolute; left:0; top:0; width: 45%; height: 100%; background-size:contain; background-repeat:no-repeat; background-position: 0 50%;}
.homeFreedomImg_mobile {display:none;}

.homeStores {margin-bottom: 30px;border-bottom: 5px solid red;padding-bottom: 20px;}
.homeStores h2 {color:darkred; text-align:center; font-weight:300; font-size: 36px; margin: 30px 0;}
.homeStores .contained {max-width: 800px;}
.homeStoresBox {padding: 0px 0; text-align:Center;}
.homeStoresBox h4 {color:red; font-weight:bold; font-size:24px; padding: 10px; }
.homeStoresBox p {color:#444; font-weight: 500; padding: 10px;}


#topNav h4 {font-size: 16px; color:#444; font-weight:bold; text-align:right; display:block !important; padding-top: 15px; margin-bottom:-20px;}
#topNav h4 span {font-weight:inherit; display:inline-block; margin-left: 15px;}
#topNav ul {text-align:right;}
#topNav ul>div {display:none;}
header .logoLayer {float:left !important;width: 150px;padding-top: 20px;/* clear: both; */ position:absolute !important; left: 95px !important;}
header .logoLayer img {max-width:120px;}

#topNav ul>li.redNav ul {right:0px; left:auto; margin-top:-0px;}
#topNav ul>li ul {margin-top:-5px;}

.homeSlider li .row>div {position: absolute;height: 100%;background:rgba(0,0,0,0.3);display: flex;align-items: center;}
.homeSliderOfferBox {color:#fff;padding:0 40px;vertical-align: bottom;bottom:-30px;display: inline-block;}
.homeSliderOfferBox h3 {font-size: 32px; margin: 15px 0;}
.homeSliderOfferBox h3 b {display:block; font-size: 200%;}
.homeSliderOfferBox p {font-size: 18px; margin: 10px 0;}
.homeSliderOfferBox p.note {font-size: 14px;}

@media(max-width:768px){
.homeSliderOfferBox img {width:130px; margin:0;}
 .homeSliderOfferBox h3 {font-size: 24px; margin: 5px 0; line-height:1.2;}
 .homeSliderOfferBox a {font-size: 16px; padding: 6px 20px !important;}
.homeSliderOfferBox p {font-size: 14px;}
 .homeSliderOfferBox {width:100%;}
}

@media(max-width:992px){
 #topNav {height: 165px;}
#topNav h4 {background:#666;color:#fff;text-align:center;font-size: 22px;padding: 15px 0;margin:0 -33px 0 -23px;clear: left;}
#topNav h4 span {display:block;}
 .logoLayer {left:85px; top:80px;}
 #navBtn {top: 177px !important; background:#fff; color:red; text-shadow:none; border:none; font-size: 36px; left:-62px; }

}

@media(max-width:640px){
 .homeDiscoverBox a {font-size: 22px; padding:9px; }
.homeInspired {background:url(files/image/homeNew/inspired_mobile.jpg); background-size:cover; padding:55% 0 30px 0;} 
 .homeFreedomImg_mobile {display:block; position:static; padding-top: 80%; background-size:cover; background-position:50%; margin:10px -25px;}
 .homeFreedomImg_desktop {display:none;}
 .homeStores h2 {font-size: 32px; margin: 20px 0;}
 .homeFreedom a {display:block; width:150px; margin:20px auto 0 auto;}
.homeSlider ul {padding-top: 70%;}
 .homeSlider li>img {max-width: 120px !important;}
}

li[data-deliveryonly="Y"] .quantity:before {content:"\f0d1"; font-family:'fontAwesome'; position:absolute; left:-48px; top:-5px; font-size: 36px;}
li[data-deliveryonly="Y"] .quantity:after {content:"\f071"; font-family:'fontAwesome'; position:absolute; left:-30px; top:7px; font-size: 14px; color:yellow;}