html, body { background: rgba(222, 222, 222, 1); font-family: MyriadPro-Regular, 'Myriad Pro Regular', MyriadPro, 'Myriad Pro', Helvetica, Arial, sans-serif; font-size: 14px; color: #2E2E2E; }
a, a:hover { text-decoration: none; }
a { color: #b70E0E; }
a:hover { color: #B75A0E; }

.text-left    { text-align: left; }
.text-center  { text-align: center; }
.text-right   { text-align: right; }
.float-left   { float: left; }
.float-center { float: center; }
.float-right  { float: right; }

.hilight { font-style: normal; background-color: #FAF49B; }
.heading { font-size: 22px; color: #0F2578; font-weight: bold; padding: 0; margin: 18px 0 8px 0; }
.firstHeading { margin: 0 0 8px 0; }
.smallerHeading { font-size: 16px; }
.relatedProducts { background-color: transparent !important; padding: 0 !important; }
h1.heading { color: #333333; font: bold 32px "Open Sans",Arial,Helvetica,sans-serif; margin: 0 0 15px 0; padding: 0; }
h2.heading { color: #5a5a5a; font: 300 32px "Open Sans",Arial,Helvetica,sans-serif; margin: 0 0 0 0; padding: 0 10px; }
h3.heading { color: #5a5a5a; font: 300 22px "Open Sans",Arial,Helvetica,sans-serif; margin: 0 0 6px 0; padding: 3px 10px; background-color: #F1F1F1; }
h4.heading span { font-size: 16px; }
h4.heading.smallerHeading span { font-size: 14px; }
.boxedContent { border: 1px solid #0F2578; padding: 8px; overflow: hidden; }
.bottomBorder { margin: 10px;border-bottom: 1px solid #A5A5A5; }
.mt0  { margin-top: 0    !important; }
.mt5  { margin-top: 5px  !important; }
.mt10 { margin-top: 10px !important; }
.mt20 { margin-top: 20px !important; }
.mt40 { margin-top: 40px !important; }
.mb0  { margin-bottom: 0    !important; }
.mb5  { margin-bottom: 5px  !important; }
.mb10 { margin-bottom: 10px !important; }
.mb20 { margin-bottom: 20px !important; }
.mb40 { margin-bottom: 40px !important; }

a.btn { padding: 6px 12px 2px; }
.btn-green { background-image: linear-gradient(to bottom, #5cb85c 0px, #419641 100%); background-repeat: repeat-x; border-color: #3e8f3e; color: #FFFFFF; background-color: #5cb85c; text-shadow: 1px 1px rgba(0,0,0,0.5); }
.btn-green:hover { background-image: linear-gradient(to bottom, #419641 0px ,#5cb85c 100%) !important; background-repeat: repeat-x; border-color: #5cb85c; color: #FFFFFF; background-color: #5cb85c; }
.btn-green-flat { background-image: none; border-color: #3e8f3e; color: #FFFFFF; background-color: #419641; text-shadow: 1px 1px rgba(0,0,0,0.5); border-radius: 0; }
.btn-green-flat:hover { background-image: none; border-color: #419641; color: #FFFFFF; background-color: #5cb85c; }
.btn-dark-grey { background-image: none; border-color: #222222; color: #FFFFFF; background-color: #444444; text-shadow: 1px 1px rgba(0,0,0,0.5); }
.btn-dark-grey:hover { background-image: none;  background-repeat: repeat-x; border-color: #222222; color: #FFFFFF; background-color: #222222; }
.logoutBtn, .viewAllNewsBtn { float: right; }
.getQuoteBtn { display: block; border-radius: 0; padding: 16px 20px !important; font-size: 16px; text-align: left; }

.smallText { font-size: 85%; }
.required { font-size: 10px; color: red; }

header { background-color: #EFF2F5; font-size: 0; padding: 20px 0 5px 0; }
section#content { background: #FFFFFF; padding: 20px 0 70px 0;}
footer { background: rgba(222, 222, 222, 1) linear-gradient(to bottom, #EDEDED 0%, #DEDEDE 100%) repeat scroll 0 0; border-top: 1px solid #dedddd; padding: 15px 0 30px 0; }
td { padding: 3px; }
.navbar { text-align: right; }

.ajaxError { font-weight: 400; color: #CC0000; }

header { font-size: 0; }
header .openingTimes { font-weight: bold; font-size: 14px; display: inline-block; *display: inline; *zoom: 1; margin: 30px 0 0 0; width: 25%; height: 30px; line-height: 26px; }
header .phoneNumber { font-weight: bold; font-size: 14px; display: inline-block; *display: inline; *zoom: 1; width: 25%; height: 30px; }
header .locationOptions { display: inline-block; *display: inline; *zoom: 1; width: 15%; height: 30px; margin-top: -5px; }
header .locationOptions img { height: 20px; margin: -10px 5px 0 0; }
.searchBar { margin: 30px 0 0 0; display: inline-block; *display: inline; *zoom: 1; position: relative; width: 35%; height: 26px; text-align: right; }
.searchBar input[type="text"] { border: 1px solid #848484; border-radius: 12px 0 0 12px; font-size: 16px; height: 28px; padding: 3px 10px 0 0 ; position: relative; right: 5px; text-align: right; top: 2px; width: 190px; color: #868484; }
.searchBar input[type="text"]:not(*:root) { top: 1px; }
.searchBar button#searchButton { display: inline-block; *display: inline; *zoom: 1; position: relative; top: -2px; right: 6px; border: none; background-color: #000E78; color: #FFFFFF; height: 28px; font-size: 14px; line-height: 28px; width: 36px; border-top-right-radius: 12px; border-bottom-right-radius: 12px; }

header ul.menu { padding: 0; margin: 10px 0 0 0; }
header ul.menu li { padding: 0; margin: 0; list-style: none; width: 16.666%; display: inline-block; *display: inline; *zoom: 1; position: relative; height: 100%; }
header ul.menu li a { border: 1px solid #C0C0C0; border-left: none; display: block; width: 100%; height: 100%; line-height: 36px; border-right: 1px solid #C0C0C0; font-size: 16px; color: #2E2E2E; text-align: center; height: auto; }
header ul.menu > li:last-child a { border-top-right-radius: 5px; border-bottom-right-radius: 5px; }
header ul.menu > li:first-child a { border-left: 1px solid #C0C0C0;  border-top-left-radius: 5px; border-bottom-left-radius: 5px; }
header ul.menu li a:hover, header ul.menu li.active a { background-color: #C2151C; color: #FFFFFF; }
header ul.menu ul.dropdown { display: none; position: absolute; top: 38px; width: 115px; padding: 0; margin: 0; margin-left: -1px; }
header ul.menu li:hover ul.dropdown { display: block; height: 74px; z-index: 10; }
header ul.menu li ul.dropdown li { display: block; margin: 0; padding: 0; border: #C0C0C0 1px solid; border-width: 0 1px 1px 1px; width: 100%; background-color: #EFF2F5; height: 36px; }
header ul.menu li ul.dropdown li form { height: 36px; }
header ul.menu li ul.dropdown li a { border: none !important; border-radius: none !important; height: 100%; line-height: 36px; height: 36px; }

footer ul { margin: 0; padding: 0; }
footer ul li { list-style: none; margin: 0; padding: 0; }
footer i { display: inline-block; *display: inline; *zoom: 1; margin-right: 5px; }
footer .socialIcons { display: inline-block; margin-top: 40px; }
footer .socialIcons a { color: #FFFFFF; }
footer .socialIcons .facebookIcon { background-color: #3765a3; padding: 4px 4px 2px 10px; display: inline-block; }
footer .socialIcons .twitterIcon { background-color: #659FCB; padding: 4px 4px 2px 10px; display: inline-block; }

ul.menu { padding: 0; margin: 10px 0 20px 0; font-size: 0; }
ul.menu li { padding: 0; margin: 0; list-style: none; width: 16.666%; display: inline-block; *display: inline; *zoom: 1; }
ul.menu li a { display: block; width: 100%; height: 100%; font-size: 16px; text-align: center; }

ul.productMenu, ul.productMenu ul { margin: 0; padding: 0; }
ul.productMenu { -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75); -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75); box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75); margin: 0 0 20px 0; }
ul.productMenu li { list-style: none; margin: 0; }
ul.productMenu > li { background-color: #0f2578; color: #c4c4c4; display: block; list-style: none; margin: 0; border-top: 1px solid #FFFFFF; }
ul.productMenu > li.menuHeading { background-color: #C2151C; color: #FFFFFF; }
ul.productMenu > li span { display: block; padding: 9px 20px 10px 41px; cursor: pointer; } 
ul.productMenu > li span > i.fa { display: inline-block; *display: inline; *zoom: 1; width: 9px; margin: 0 8px 0 -20px; } 
ul.productMenu > li:first-child { border-top: none; }
ul.productMenu ul { display: none; }
ul.productMenu ul > li { background-color: #F1F1F1; border-top: 1px solid #A5A5A5; padding: 0; }
ul.productMenu ul > li:hover { background-color: #E1ECF3; }
ul.productMenu ul > li:first-child { border-top: none; }
ul.productMenu ul > li.subCategory { color: #333333; position: relative; }
ul.productMenu ul > li.subCategory > ul { position: absolute; top: 0; right: -298px; width: 298px; display: none; z-index: 10; border: 1px solid #A5A5A5; border-top: none; }
ul.productMenu ul > li.subCategory:hover > ul { display: block; }
ul.productMenu ul li a { display: block; width: 100%; height: 100%; padding: 10px 0 10px 10px; }

.breadcrumb { padding: 0; margin: 0; background-color: transparent; border: none; border-radius: 0; font-size: 11px; }
h1.pageTitle {  }

.googleMapContainer { padding-bottom: 20px; border-bottom: 1px solid #CCCCCC; margin-bottom: 20px; }
#googleMap { height: 400px; }
form#quoteForm .input-group input[type="text"] { width: 350px; }
form#contactForm .input-group, form#quoteForm .input-group { margin-bottom: 10px; }
form#contactForm .captcha { position: relative; }
form#contactForm .captcha .input-group { position: absolute; left: 85px; top: -3px; width: 140px; }
form#contactForm .input-group textarea, form#quoteForm .input-group textarea { height: 121px; }
.contactBox { border: 1px solid #666666; border-radius: 4px; padding:15px; }

ul.productLineIncludes { margin: 0; padding: 0; }
ul.productLineIncludes li { margin: 0; padding: 0; list-style: none; }
ul.productLineIncludes i { margin: 0 12px 0 0; }


.imageWithText { position: relative; margin-bottom: 18px; }
.imageWithText > img { width: 100%; }
.imageWithText > .textOverlay { position: absolute; width: 100%; left: 0; bottom: 0; background-color: rgba(0, 0, 0, 0.6); color: #FFFFFF; font-size: 22px; font-weight: bold; }
.imageWithText > .textOverlay > div { padding: 8px; font-family: MyriadPro-Regular, 'Myriad Pro Regular', MyriadPro, 'Myriad Pro', Helvetica, Arial, sans-serif; }

.technicalDetails, .associatedProducts, form.itemOrdering  { margin-top: 12px; }
.technicalDetails { font-style: italic; }
input#qty { width: 36px; }
form.itemOrdering input#submitBtn { height: 30px; }

.table { display: table; }
.table > .tableRow { display: table-row; }
.table > .tableRow > .tableCell { display: table-cell; padding: 8px; border-right: 1px solid #999999; border-bottom: 1px solid #999999; }
.table > .tableRow:first-child > .tableCell { border-top: 1px solid #999999; }
.table > .tableRow > .tableCell:first-child { border-left: 1px solid #999999; }

.tableHeader { background-color: #0F2578; color: #FFFFFF; font-weight: bold; }
.itemName {  }
.itemQty, .itemDelete { text-align: center; width: 45px; }
.itemPrice { width: 80px; }
.itemLineTotal { width: 90px; }
.itemDelivery { float: left; min-width: 300px; width: 300px; min-height: 69px; font-size: 16px; }
.itemTotalPriceContainer { float: right; min-width: 300px; width: calc(100% - 300px); font-size: 0; }
.itemTotalPriceLabel { display: inline-block; *display: inline; *zoom: 1; width: calc(100% - 138px); text-align: right; font-size: 16px; }
.itemTotalPrice { display: inline-block; *display: inline; *zoom: 1; width: 128px; font-size: 16px; margin-left: 10px; }

.billingCart .tableHeader { background-color: #999999; }
.billingCart .table > .tableRow > .tableCell { border-right: 1px solid #E9E9E9; border-bottom: 1px solid #E9E9E9; }
.billingCart .table > .tableRow:first-child > .tableCell { border-top: 1px solid #E9E9E9; }
.billingCart .table > .tableRow > .tableCell:first-child { border-left: 1px solid #E9E9E9; }
.billingCart {color: #797979; }

.cartWidget { font-size: 14px; }
.contactWidget .input-group { margin: 3px 0;  }
.contactWidget .captcha { margin: 3px 0; }
.contactWidget .captcha .input-group { margin: 3px 0; display: inline-block; *display: inline; *zoom: 1; width: calc(100% - 90px); font-size: 0; }
.contactWidget .captcha .input-group .input-group-addon { width: auto; display: inline-block; font-size: 14px; margin: -7px 0 0 0; }
.contactWidget .captcha .input-group input { width: calc(100% - 50px); display: inline-block; float: none; height: 30px; font-size: 14px; }
.contactWidget .mailSent { margin: 50px 0; }

.loginBox { max-width: 450px; margin: 50px auto 50px auto; }
.loginBox .row { padding-top: 4px !important; padding-bottom: 4px !important; }
.loginBox input[type="text"], .loginBox input[type="password"] { width: 100%; }

.loginBoxNew { margin: 25px auto 30px auto; }
.loginBoxNew .row { padding-top: 4px !important; padding-bottom: 4px !important; }
.loginBoxNew input[type="text"], .loginBoxNew input[type="password"] { width: 100%; }
.loginBoxNew h4 { padding-top: 20px; }
.loginBoxNew h4.first { padding-top: 0; }

.signupRequired { padding-right: 15px; width: 30%; }
.signupAccount { padding-left: 15px; width: 50%; }

form#checkoutForm .alert em { color: #4D3713; font-weight: bold; }
form#checkoutForm .deliveryDetails { font-size: 0; }
form#checkoutForm label { display: inline-block; *display: inline; *zoom: 1; width: 120px; margin-right: 10px; font-size: 16px; font-weight: normal; }
form#checkoutForm input[type="text"], form#checkoutForm select, form#checkoutForm .fauxInput { display: inline-block; *display: inline; *zoom: 1; width: calc( 100% - 170px);  font-size: 16px; }
form#addressForm label { display: inline-block; *display: inline; *zoom: 1; width: 150px; margin-right: 10px; font-size: 16px; font-weight: normal; margin-bottom: 8px; }
form#addressForm input[type="text"], form#addressForm select { display: inline-block; *display: inline; *zoom: 1; width: calc( 100% - 190px);  font-size: 16px; margin-bottom: 8px; height: 32px; }

#orderList, #addressList { width: 100%; font-size: 0; margin-bottom: 4px; padding-bottom: 4px; border-bottom: 1px solid #CCCCCC; }
.boxedContent #orderList:last-child, .boxedContent #addressList:last-child { border-bottom: none; }

#orderList .orderID, #orderList .orderAddress, #orderList .orderPrice, #orderList .orderStatus, #orderList .orderCreated, #orderList .orderView,
#addressList .savedAddress, #addressList .editAddress, #addressList .deleteAddress { display: inline-block; *display: inline; *zoom: 1; font-size: 16px; }
#orderList > div > div.listLabel {display: none; }

#orderList.header, #addressList.header { display: inline-block; *display: inline; *zoom: 1; font-weight: bold; }

#orderList .orderID { width: 85px; }
#orderList .orderAddress { width: calc(100% - 365px); }
#orderList .orderPrice { width: 80px; }
#orderList .orderStatus { width: 80px; }
#orderList .orderCreated { width: 80px; }
#orderList .orderView { width: 30px; text-align: center; }

#addressList .savedAddress { width: calc(100% - 100px); }
#addressList .editAddress { width: 40px; }
#addressList .deleteAddress { width: 40px; }

.slicknav_menu { display: none; }
#mobileMenu { display: none; }
#mobileMenu .searchBar { width: 80%; }
#mobileMenu .searchBar input[type="text"] { width: 170px; }
.mobileShow .contactWidget { margin-top: 20px; }

.mobileShow { display: none; }
.mobileHidden { display: block; }
.contactDetails { display: block; text-align: right; }
header .contactDetails a { color: rgb(46, 46, 46); }
.companyLogo .contactDetails { display: none; text-align: right; }
.slicknav_btn { margin-right: 10px; }

.slicknav_nav a, .slicknav_nav .slicknav_row { font-size: 18px; padding: 12px 8px; }
.slicknav_nav > li { border-top: 1px dashed #CCCCCC; }
.slicknav_nav > li:first-child { border-top: none; }

ul.newsItems { padding: 0; margin: 0; }
ul.newsItems li { list-style: none; margin: 0; padding: 10px 0; border-top: 1px dashed #CCCCCC; }
ul.newsItems li:first-child { border-top: none; padding: 0 0 10px 0; }
ul.newsItems li p:last-child { margin: 0; }

.surchargeNotice { font-size: 11px; }
#ownDeliveryMessage { width: 100%; height: 121px; }

#erlCascadeContainer { position: relative; max-width: 360px; width: 100%; height: 170px; background-image: url('/images/erl-cascade.jpg'); margin: 50px 0 20px; border: 1px solid #0F2578; }
#erlCascadeContainer h4 { position: absolute; top: -30px; left: 0; }
#erlCascadeContainer a.erlDownload { position: absolute; bottom: 10px; right: 10px; }

.homepageAdvert { border: 1px solid #0F2578 }
.imgResponsive { width: 100%; min-width: 100%; }

label.error { display: none !important; }
input.error, textarea.error { border-color: #CC0000; }






@media (max-width: 991px) {
  .mobileShow { display: block; }
  .mobileHidden { display: none; }
  .contactDetails { display: none; }
  .latestNews { margin-top: 20px; }
  .companyLogo img { margin-right: 20px; }
  .companyLogo img, .companyLogo .contactDetails { display: inline-block; *display: inline; *zoom: 1; vertical-align: top; }
  .companyLogo .contactDetails { width: calc(100% - 240px); }
  .companyLogo .contactDetails .openingTimes,
  .companyLogo .contactDetails .phoneNumber, 
  .companyLogo .contactDetails .searchBar { margin-top : 8px; display: block; width: 100%; }
  .companyLogo .contactDetails .searchBar input[type="text"] { left: 0; right: none; }
  .companyLogo .contactDetails .searchBar button#searchButton { right: 0; }
  .deliveryDetails { margin-top: 20px; margin-bottom: 20px; }
  .productMenu li span,
  .productMenu li a { padding: 5px 0; font-size: 18px; }
  .getQuoteBtn { padding: 10px 20px !important; font-size: 18px; }
  header .locationOptions { width: 100%; margin-top: 10px; }
  .signupRequired { width: 95%; }
  .signupAccount { width: 95%; }

}


@media (max-width: 768px) {
  .copywrite { margin-top: 20px; }
  .copywrite h3 { display: none; }
  #orderList .orderID, #orderList .orderAddress, #orderList .orderPrice, #orderList .orderStatus, #orderList .orderCreated, #orderList .orderView { width: calc(100% - 95px); margin-bottom: 4px; }
  #orderList.header { display: none; }
  #orderList >div > div.listLabel { display: inline-block; *display: inline; *zoom: 1; width: 95px; font-size: 16px; font-weight: bold; }

}


@media (max-width: 680px) {
  .navbar { display: none; }
  .slicknav_menu { display: block; }
  section#mobileMenu { position: relative; height: 0; margin: 0; padding: 0; }
  #mobileMenu .searchBar { position: absolute; display: block; right: 110px; top: -17px; }
  header .searchBar, .companyLogo .contactDetails .searchBar { display: none; }
  .searchBar input[type="text"] { right: 0; border: none; }
  .searchBar button#searchButton { right: 4px; }
  #mobileMenu { display: block; z-index: 20 !important; }
  .productMenu { z-index: 18; }
}


@media (max-width: 600px) {
	.itemDelivery, .itemTotalPriceContainer { width: 100%; height: auto; margin-bottom: 12px; }
}


@media (max-width: 480px) {
  .companyLogo .contactDetails { display: none; }
  .contactDetails { display: block; }
  .companyLogo .contactDetails { display: none; }
  .contactDetails .openingTimes { width: 46%; display: inline-block !important; *display: inline !important; *zoom: 1 !important; }
  .contactDetails .phoneNumber { width: 54%; display: inline-block !important; *display: inline !important; *zoom: 1 !important; }
  .imageWithText .textOverlay { display: none; }
  form#quoteForm .input-group input[type="text"] { width: 100%; }
}

@media (max-width: 380px) {
  .contactDetails .openingTimes, .contactDetails .phoneNumber, .contactDetails .locationOptions { display: block !important; width: 100%; margin: 10px 0 0 0; padding: 0;  }
}


/* chrome & safari hacks */
@supports (-webkit-appearance:none) {
  .searchBar button#searchButton { top: 0; }
}
@media (max-width: 991px) and (-webkit-min-device-pixel-ratio:0) {
  .productMenu { margin-top: 50px !important; }
}