/* CSS RESET */
* { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; font-weight: normal; }
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section { display: block; }
body { line-height: 1; }
ol, ul { list-style: none; }
table { border-collapse: collapse; border-spacing: 0; }
/*
* font-family:'HelveticaNeueW01-45Ligh';
font-family:'HelveticaNeueW01-46Ligh';
font-family:'HelveticaNeueW01-55Roma';
font-family:'HelveticaNeueW01-56It';
font-family:'HelveticaNeueW01-75Bold';
font-family:'HelveticaNeueW01-76Bold'; */
/* ==========================================================================
General styles
========================================================================== */
html, body { height: 100%; width: 100%; }
body { font-family: 'Arial'; font-size: 13px; line-height: 20px; background-color: white; color: #1e1e1e; -webkit-font-smoothing: antialiased; }
.wrapper { box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; max-width: 960px; margin: 0 auto; padding: 0 20px; overflow: hidden; }
.headerWrapper { box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; max-width: 960px; margin: 0 auto; padding-right: 20px; }
h1 { font-size: 36px; line-height: 50px; }
h2 { font-size: 36px; line-height: 50px; }
h3 { font-size: 20px; line-height: 40px; }
h4 { font-size: 16px; line-height: 26px; }
.aFeatureHeading { font-size: 42px; font-weight: lighter; line-height: 50px; font-family: HelveticaNeueW01-45Ligh; text-transform:uppercase;}
.aFeatureText { font-size: 16px; font-weight: normal; line-height: 26px; }
.bFeatureHeading { font-size: 20px; line-height: 40px; }
.bFeatureText { font-size: 12px; line-height: 20px; }
.productDetailText { font-size: 26px; line-height: 40px; }
.footerHeading { font-size: 16px; font-weight: normal; line-height: 26px; }
.footerText { font-size: 12px; line-height: 20px; }
.fullBox { float: left; width: 100%; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; }
.halfBox, #artworkTemplate .flexibleBox { float: left; width: 50%; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; }
.threeBox { float: left; width: 33.333333%; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; }
.quarterBox { float: left; width: 25%; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; }
input[type=button], input[type=reset] { -webkit-font-smoothing: antialiased; }
a:link, a:visited { color: #1e1e1e; text-decoration: none; }
a:hover { text-decoration: underline; }
img { vertical-align: middle; }
.no-margin-bottom {margin-bottom:10px !important; padding-bottom:0px !important;}
/* ==========================================================================
Page styles
========================================================================== */
/* header */
header { position: relative; border-bottom: 13px solid #0053a0; z-index: 10000; background: url("../img/icons/navigationBar.png") repeat-x; box-shadow: 0px 3px 3px 0px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0px 3px 3px 0px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0px 3px 3px 0px rgba(0, 0, 0, 0.2); -o-box-shadow: 0px 3px 3px 0px rgba(0, 0, 0, 0.2); }
.logoContainer { float: left; width: 15%; }
.menuContainer { float: right; width: 85%; padding-bottom: 7px; }
.menuContainer a { color: #0053a0;  line-height: 49px;  text-transform: uppercase;  text-decoration: none; }
.menuContainer .topContainer { overflow: hidden;  border-bottom: 1px solid #d7d7d7; }
.menuContainer .topContainer .supportMenu { float: right; }
.menuContainer .topContainer .supportMenu > li a { color: #7d7d7d;  font-size: 11px;  font-weight: lighter; }
.menuContainer .topContainer .supportMenu > li:hover a { text-decoration: underline; }
.menuContainer .bottomContainer { overflow: hidden;  border-bottom: 1px solid transparent; }
.menuContainer .bottomContainer .mainMenu { float: left;  }
.menuContainer .bottomContainer .onlineMenu { float: right; }
.menuContainer .bottomContainer .mainMenu > li { margin: 0 30px 0 0; }
.menuContainer .bottomContainer .mainMenu > li a, .menuContainer .bottomContainer .mainMenu > li span, .menuContainer .bottomContainer .onlineMenu > li a, .menuContainer .bottomContainer .onlineMenu > li span { font-weight: bold; }
.menuContainer .bottomContainer .mainMenu > li a:hover, .menuContainer .bottomContainer .onlineMenu > li a:hover { color: #1e1e1e; }
.menuContainer .supportMenu > li,
.menuContainer .mainMenu > li,
.menuContainer .onlineMenu > li { float: left;  margin: 0 0 0 30px; }
#dropdownMenu { display: none; box-shadow: 0px 3px 3px 0px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0px 3px 3px 0px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0px 3px 3px 0px rgba(0, 0, 0, 0.2); -o-box-shadow: 0px 3px 3px 0px rgba(0, 0, 0, 0.2); position: absolute; width: 100%; height: auto; top: 120px; left: 0px; background-color: white; /*margin-top: 21px;*/
padding: 20px 0; z-index: 1; }
#dropdownMenu .quarterBox { padding-left: 10px;  border-left: 1px solid #d7d7d7; }
#dropdownMenu ul.firstRow > li { height: 210px;  margin-bottom: 30px; }
#dropdownMenu ul.secondRow > li { height: 190px; }
#dropdownMenu ul li:first-child { padding-left: 0;  border-left: none; }
#dropdownMenu .subTitle { margin-bottom: 20px; }
#dropdownMenu a { display: block;  color: #0053a0;  font-size: 12px;  line-height: 20px;  font-weight: normal;  text-transform: none; }
#dropdownMenu a:hover { color: #1e1e1e; }
/* footer */
footer { background-color: #1e1e1e; }
footer .wrapper > div { margin: 20px 0;  padding: 0 10px; }
footer .wrapper > div.noPadding { padding-left: 0px; }
footer .wrapper > div.productsBox { border-left: 1px solid #4b4b4b;  border-right: 1px solid #4b4b4b; }
footer .wrapper > div.productsBox ul { padding-bottom: 30px;  padding-right: 10px; }
footer .wrapper > div.fullBox { padding: 20px 0;  margin: 0 0 20px;  border-top: 1px solid #4b4b4b; }
footer .wrapper > div.contactusBox { padding: 20px 0;  margin: 0 0 30px;  border-top: 1px solid #4b4b4b; }
footer h2 { color: white;  font-size: 16px;  font-weight: normal;  line-height: 26px;  margin-bottom: 20px; }
footer h3 { color: white;  font-size: 12px;  line-height: 20px;  margin-bottom: 20px; }
footer .wrapper a { color: white;  font-size: 12px;  line-height: 20px; }
footer .wrapper span { display: block;  color: white;  font-size: 12px;  line-height: 20px; }
footer .copyrightBox { width: 25%; }
footer .privacyBox { width: 75%; }
footer .copyrightBox span, footer .privacyBox ul li a { color: darkgrey; }
footer .privacyBox ul { float: right; }
footer .privacyBox ul li { float: left;  margin-left: 20px; }
/* reusable containers */
.bFeatureContainer { box-shadow: 0px 3px 3px 0px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0px 3px 3px 0px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0px 3px 3px 0px rgba(0, 0, 0, 0.2); -o-box-shadow: 0px 3px 3px 0px rgba(0, 0, 0, 0.2); padding: 20px 0; background-color: #f7f7f7; }
.bFeatureContainer .threeBox { border-left: 1px solid #d7d7d7; }
.bFeatureContainer .threeBox:first-child { border-left: none; }
.bFeatureContainer .iconContainer { position: absolute;  width: 110px;  height: 90px; }
.bFeatureContainer .textContainer { position: relative;  padding: 0 20px 0 110px; }
.bFeatureContainer .textContainer > h3 { line-height: normal;  margin: 20px 0; }
.bFeatureContainer .textContainer > span { display: block;  margin-bottom: 20px; }
.asideMenuContainer { margin-top: 20px; background-color: #f4f4f4; }
.asideMenuContainer > li { box-sizing: border-box;  -webkit-box-sizing: border-box;  -moz-box-sizing: border-box;  padding: 20px;  border: 1px solid white; }
.asideMenuContainer .iconContainer { position: absolute;  width: 86px;  height: 86px; }
.asideMenuContainer .textContainer { position: relative;  padding: 0 0 0 106px; }
.asideMenuContainer .textContainer > h3 { line-height: normal;  margin: 0; }
.asideMenuContainer .textContainer > span { display: block;  margin: 0px; }
.asideMenuContainer .textContainer > .btnBlueM { margin-bottom: 0; }
.pageTitleContainer {  height: 220px; background: url("../img/icons/blueBar2.png") repeat-x;}
.pageTitleContainer .textContainer { float: left;  width: 55%; }
.pageTitleContainer .imageContainer { float: left;  width: 45%; }
.pageTitleContainer .verticalCenter { display: table-cell;  vertical-align: middle;  height: 220px; }
.pageTitleContainer .verticalCenter h2 { color: white; }
.pageTitleContainer .verticalCenter h1 { color: white; color: white; font-family: HelveticaNeueW01-45Ligh; text-transform: uppercase; font-size: 28px; line-height: 42px; }
.pageTitleContainerProduct { height: 220px; background: url("../img/icons/blueBar2.png") repeat-x; }
.pageTitleContainerProduct .textContainer { float: left;  width: 55%; }
.pageTitleContainerProduct .imageContainer { float: left;  width: 45%; }
.pageTitleContainerProduct .verticalCenter { display: table-cell;  vertical-align: middle;  height: 220px; }
.pageTitleContainerProduct .verticalCenter h2 { color: white; }
.pageTitleContainerProduct .verticalCenter h1 { color: white; font-family: HelveticaNeueW01-45Ligh; text-transform:uppercase; font-size: 28px; line-height: 42px;}

/* home Page */
#homeAFeature .aFeatureBg { width: 100%; height: 480px; background: url("../img/aFeatures/aFeatureBg.png") no-repeat center center; -webkit-background-size: cover; -moz-background-size: cover; background-size: cover; }
#homeAFeature .leftBox { float: left; width: 40%; }
#homeAFeature .leftBox .textContainer { display: table-cell;  vertical-align: middle;  height: 480px;  padding-right: 20px; }
#homeAFeature .leftBox .textContainer span { display: block;  color: white; }
#homeAFeature .leftBox .textContainer .aFeatureHeading { margin-bottom: 10px; }
#homeAFeature .rightBox { float: left; width: 60%; }
#homeAFeature .rightBox .imageContainer { display: table-cell;  vertical-align: middle;  height: 480px; }
#homeServiceList { padding-bottom: 40px; }
#homeServiceList .textContainer { padding: 20px 0;  border-bottom: 1px solid #d7d7d7; }
#homeServiceList .textContainer > h2 { color: #1e1e1e;  font-size: 20px;  line-height: 40px; }
#homeServiceList .textContainer > span { color: #7d7d7d;  font-size: 16px;  line-height: 30px; }
#homeServiceList ul.leftPadding { padding-left: 10px; }
#homeServiceList ul.rightPadding { padding-right: 10px; }
#homeServiceList .headingCell { position: relative;  border-bottom: 1px solid #d7d7d7; }
#homeServiceList .headingCell:hover { cursor: pointer;  background-color: #f7f7f7; }
#homeServiceList .headingCell > div { position: absolute;  left: 20px;  top: 16px; }
#homeServiceList .headingCell > img { position: absolute;  right: 20px;  top: 46px; }
#homeServiceList .headingCell > h4 { display: table-cell;  vertical-align: middle;  height: 100px;  color: #0053a0;  font-size: 20px;  padding: 0 57px 0 108px; }
#homeServiceList .detailCell { display: none; }
#homeServiceList .detailCell ul li { padding: 10px 20px;  border-bottom: 1px solid #d7d7d7; }
/* productDetails Page */
#productDetails .detailContainer { margin: 20px 0 40px 0; }
#productDetails .articleContainer { box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; float: left; width: 67%; padding-right: 60px; }
#productDetails .articleContainer h3 { color: #0053a0;  font-size: 36px;  line-height: 50px; }
#productDetails .asideContainer { box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; float: left; width: 33%; }
#productDetails .featureList, #productDetails .detailTextBox { padding: 20px 0 40px 0; border-bottom: 1px solid #d7d7d7; }
#productDetails .detailTextBox h2 { font-size: 20px; line-height: 30px; color: #e90a0a; margin-bottom: 20px; }
#productDetails .detailTextBox h4 { font-size: 20px; line-height: 30px; color: #e90a0a; margin-bottom: 10px; margin-top:20px; }
#productDetails .detailTextBox h5 { font-size: 16px; color: #0053a0; margin-bottom: 0px; margin-top:20px; }
#productDetails .detailTextBox > span { font-size: 16px; line-height: 26px; color: #7d7d7d; }
#productDetails .detailTextBox > p { padding-top: 0px; font-size: 13px; line-height: 20px; color: #7d7d7d; margin-bottom: 20px; }
#productDetails .detailTextBox a { color: #0053a0; }
#productDetails .paddingBottom { padding-bottom: 40px; }

/* specialOffer Page */
#specialOffer .productList { margin: 20px 0 40px; }
#specialOffer .productList > li { overflow: hidden;  padding: 20px 0;  border-bottom: 1px solid #d7d7d7; }
#specialOffer .productList .imageContainer { box-sizing: border-box;  -webkit-box-sizing: border-box;  -moz-box-sizing: border-box;  float: left;  width: 40%; }
#specialOffer .productList .textContainer { box-sizing: border-box;  -webkit-box-sizing: border-box;  -moz-box-sizing: border-box;  float: left;  width: 60%;  padding-left: 0px; }
#specialOffer .productList .textContainer > h2 { margin: 50px 0 10px; font-size: 20px; line-height: 40px;}
#specialOffer .productList .textContainer > span { display: block;  font-size: 16px;  color: #7d7d7d; }

/* specialOfferDetails Page */
#specialOfferDetails .detailTextBox > p { padding: 0 10px; font-size: 13px; line-height: 20px; color: #7d7d7d; margin-bottom: 20px; }
#specialOfferDetails .wrapper > span { display: block; font-size: 20px; line-height: 40px; color: #4a4a4a; margin: 40px 0 20px; }
#specialOfferDetails .wrapper .detailTextBox h2 { font-size: 24px; line-height: 40px; color: #e90a0a; margin: 20px 0; }
#specialOfferDetails .productList { overflow: hidden; padding: 20px 0 0 0; margin: 0 0 40px 0; border-top: 1px solid #d7d7d7; }
#specialOfferDetails .threeBox { padding: 0 10px; margin-top: 20px; }
#specialOfferDetails .threeBox .productContainer { position: relative;  border-bottom: 1px solid #d7d7d7;  width: 100%;  height: 400px; }
#specialOfferDetails .threeBox .longbox { height: 480px; }
#specialOfferDetails .threeBox .productContainer img { width: 100%; }
#specialOfferDetails .threeBox .productContainer h4 { margin: 20px 0 10px;  font-size: 20px;  line-height: 30px; color: #0053a0;}
#specialOfferDetails .threeBox .productContainer > span { display: block;  color: #7d7d7d; }
#specialOfferDetails .threeBox span.priceText { position: absolute;  left: 0;  bottom: 70px;  font-size: 20px;  line-height: 30px;  color: #4a4a4a; }
#specialOfferDetails .threeBox .btnBlue { position: absolute;  left: 0;  bottom: 0px; }
#specialOfferDetails ul.featureList { margin-bottom: 20px;}
    #specialOfferDetails ul.featureList li.tickMarker span { display: block; font-size: 14px; line-height: 24px; padding-top: 5px; padding-bottom: 5px; }
/* specialOfferForm Page, onlineQuote Page */
#specialOfferForm .wrapper > span, #onlineQuote .wrapper > span { display: block; font-size: 20px; line-height: 40px; color: #4a4a4a; margin: 40px 0; }
#specialOfferForm .specialOffer, #onlineQuote .specialOffer { overflow: hidden; padding: 20px 0 0 0; border-top: 1px solid #d7d7d7; }
#specialOfferForm .specialOffer li, #onlineQuote .specialOffer li { margin: 20px 0; }
#specialOfferForm label, #onlineQuote label { display: inline-block; width: 160px; vertical-align: top; color: #4a4a4a; }
#specialOfferForm .valueOnly, #onlineQuote .valueOnly { padding-left: 160px; }
#specialOfferForm .redColor, #onlineQuote .redColor { color: #e90a0a; }
#specialOfferForm input[type=text], #onlineQuote input[type=text] { width: 380px; height: 30px; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; border: 1px solid #d7d7d7; }
#specialOfferForm textarea, #onlineQuote textarea { width: 380px; height: 130px; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; border: 1px solid #d7d7d7; }
#specialOfferForm .stateContainer, #onlineQuote .stateContainer { display: inline-block; width: 140px; height: 30px; border: 1px solid #d7d7d7; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; background: url("../img/icons/selection.png") no-repeat; background-position: 110px -2px; overflow: hidden; }
#specialOfferForm .stateContainer:hover, #onlineQuote .stateContainer:hover { background-position: 110px -44px; }
#specialOfferForm .stateContainer select, #onlineQuote .stateContainer select { color: #4a4a4a;padding: 6px; padding-left: 10px;  background: transparent;  border: none;  width: 164px;  height: 30px; }
#specialOfferForm .serviceContainer, #onlineQuote .serviceContainer { display: inline-block; width: 380px; height: 30px; border: 1px solid #d7d7d7; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; background: url("../img/icons/selection.png") no-repeat; background-position: 350px -2px; overflow: hidden; }
#specialOfferForm .serviceContainer:hover, #onlineQuote .serviceContainer:hover { background-position: 350px -44px; }
#specialOfferForm .serviceContainer select, #onlineQuote .serviceContainer select { color: #4a4a4a;  padding-left: 10px;  padding-top: 6px;  background: transparent;  border: none;  width: 400px;  height: 30px; }
#specialOfferForm #txtPostcode, #onlineQuote #txtPostcode { width: 140px; }
/* artworkTemplate Page */
#artworkTemplate .wrapper > span { display: block; font-size: 20px; line-height: 40px; color: #4a4a4a; margin: 40px 0 20px; }
#artworkTemplate .wrapper > span > a { color: #0053a0; }
#artworkTemplate .productList { overflow: hidden; margin: 0 0 40px 0; border-top: 1px solid #d7d7d7; }
#artworkTemplate .flexibleBox { position: relative; }
#artworkTemplate .flexibleBox.even { padding-right: 10px; }
#artworkTemplate .flexibleBox.odd { padding-left: 10px; }
#artworkTemplate .productContainer { position: relative; border-bottom: 1px solid #d7d7d7; }
#artworkTemplate .titleContainer { box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; display: table-cell; vertical-align: middle; position: relative; width: 170px; height: 89px; }
#artworkTemplate .titleContainer h4 { color: #4a4a4a; }
#artworkTemplate .buttonsContainer { position: absolute; height: 89px; right: 0; }
#artworkTemplate .buttonsContainer .btnBlue { margin-left: 8px; }
/* contactUs Page */
#contactUs .locationList { margin-bottom: 40px; }
#contactUs .locationList > li { overflow: hidden;  padding: 40px 0 20px;  border-bottom: 1px solid #d7d7d7;  min-height: 140px; }
#contactUs .addressContainer { box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; float: left; width: 35%; }
#contactUs .addressContainer h2 { margin-bottom: 10px; font-size: 20px; line-height: 40px; }
#contactUs .addressContainer span { display: block; }
#contactUs .addressContainer span > a { color: #0053a0; }
#contactUs .addressContainer .btnBlue { margin-top: 100px; }
#contactUs .mapContainer { box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; float: left; width: 65%; }
#contactUs .mapContainer > iframe { width: 600px; }
/* aboutUs Page */
#aboutUs { margin-bottom: 20px; }
#aboutUs .aboutContainer { margin: 40px 0 20px; }
#aboutUs .aboutContainer span { color: #4a4a4a;  font-size: 16px;  line-height: 30px; }
#aboutUs .aboutContainer span.emphasisColor { color: #0053a0; }
/* icons */
.iconShop { width: 90px; height: 90px; margin: 0 10px; background: url("../img/icons/bFeatureIcons.png") no-repeat; background-position: 0 0; }
.iconQuotation { width: 90px; height: 90px; margin: 0 10px; background: url("../img/icons/bFeatureIcons.png") no-repeat; background-position: -90px 0; }
.iconOffers { width: 90px; height: 90px; margin: 0 10px; background: url("../img/icons/bFeatureIcons.png") no-repeat; background-position: -180px 0; }
.asideQuote { width: 86px; height: 86px; margin: 0; background: url("../img/icons/asideIcons.png") no-repeat; background-position: 0 0; }
.asideArtwork { width: 86px; height: 86px; margin: 0; background: url("../img/icons/asideIcons.png") no-repeat; background-position: -86px 0; }
.asideSpecial { width: 86px; height: 86px; margin: 0; background: url("../img/icons/asideIcons.png") no-repeat; background-position: -172px 0; }
.iconMedia { width: 68px; height: 68px; background: url("../img/icons/serviceIcons.png") no-repeat; background-position: 0 0; }
.iconBroadcast { width: 68px; height: 68px; background: url("../img/icons/serviceIcons.png") no-repeat; background-position: -68px 0; }
.iconMultimedia { width: 68px; height: 68px; background: url("../img/icons/serviceIcons.png") no-repeat; background-position: -136px 0; }
.iconiTunes { width: 68px; height: 68px; background: url("../img/icons/serviceIcons.png") no-repeat; background-position: -204px 0; }
.iconPrint { width: 68px; height: 68px; background: url("../img/icons/serviceIcons.png") no-repeat; background-position: -272px 0; }
.iconDisc { width: 68px; height: 68px; background: url("../img/icons/serviceIcons.png") no-repeat; background-position: -340px 0; }
.iconStock { width: 68px; height: 68px; background: url("../img/icons/serviceIcons.png") no-repeat; background-position: -408px 0; }
.iconUSB { width: 68px; height: 68px; background: url("../img/icons/serviceIcons.png") no-repeat; background-position: -476px 0; }
.iconMedia_m { width: 26px; height: 26px; margin: 0 0 10px 0; background: url("../img/icons/miniIcons.png") no-repeat; background-position: 0 0; }
.iconBroadcast_m { width: 26px; height: 26px; margin: 0 0 10px 0; background: url("../img/icons/miniIcons.png") no-repeat; background-position: -26px 0; }
.iconMultimedia_m { width: 26px; height: 26px; margin: 0 0 10px 0; background: url("../img/icons/miniIcons.png") no-repeat; background-position: -52px 0; }
.iconiTunes_m { width: 26px; height: 26px; margin: 0 0 10px 0; background: url("../img/icons/miniIcons.png") no-repeat; background-position: -78px 0; }
.iconPrint_m { width: 26px; height: 26px; margin: 0 0 10px 0; background: url("../img/icons/miniIcons.png") no-repeat; background-position: -104px 0; }
.iconDisc_m { width: 26px; height: 26px; margin: 0 0 10px 0; background: url("../img/icons/miniIcons.png") no-repeat; background-position: -130px 0; }
.iconStock_m { width: 26px; height: 26px; margin: 0 0 10px 0; background: url("../img/icons/miniIcons.png") no-repeat; background-position: -156px 0; }
.iconUSB_m { width: 26px; height: 26px; margin: 0 0 10px 0; background: url("../img/icons/miniIcons.png") no-repeat; background-position: -182px 0; }
/* buttons */
.arrowDropdown span { background: url("../img/icons/arrows.png") no-repeat transparent; background-position: right 3px; padding-right: 18px; }
.arrowDropdown:hover { text-decoration: none; }
.arrowDropdown:hover span { color: #1e1e1e;  background-position: right -28px; }
.arrowMore span { background: url("../img/icons/arrows.png") no-repeat transparent; background-position: right -60px; padding-right: 18px; color: #0053a0; }
.arrowMore:hover { text-decoration: none; }
.arrowMore:hover span { color: #1e1e1e;  background-position: right -91px; }
.arrowTitle span { font-size: 16px; color: #0053a0; background: url("../img/icons/arrows.png") no-repeat transparent; background-position: 0 -60px; padding-left: 18px; }
.arrowTitle:hover { text-decoration: none; }
.arrowTitle:hover span { color: #1e1e1e;  background-position: 0 -91px; }
.arrowText span { font-size: 13px; color: #7d7d7d; background: url("../img/icons/arrows.png") no-repeat transparent; background-position: 0 -154px; padding-left: 18px; }
.tickMarker span { font-size: 24px; line-height: 40px; background: url("../img/icons/tickIcon.png") no-repeat; padding-left: 37px; }
.btnBlue { display: inline-block; padding: 12px 20px; margin: 20px 0; text-decoration: none; text-transform: uppercase; background-color: #0070b4; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#0070b4, endColorstr=#00509c); background: -webkit-gradient(linear, left top, left bottom, from(#0070b4), to(#00509c)); background: -moz-linear-gradient(top, #0070b4, #00509c); }
.btnBlue:hover { background-color: #2d9fe4;  text-decoration: none;  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#2d9fe4, endColorstr=#056bcc);  background: -webkit-gradient(linear, left top, left bottom, from(#2d9fe4), to(#056bcc));  background: -moz-linear-gradient(top, #2d9fe4, #056bcc); }
.btnBlue span { color: white;  background: url("../img/icons/arrows.png") no-repeat transparent;  background-position: right -120px;  padding-right: 18px; }
.btnBlueM { display: inline-block; padding: 6px 16px; margin: 10px 0; text-decoration: none; text-transform: uppercase; background-color: #0070b4; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#0070b4, endColorstr=#00509c); background: -webkit-gradient(linear, left top, left bottom, from(#0070b4), to(#00509c)); background: -moz-linear-gradient(top, #0070b4, #00509c); }
.btnBlueM:hover { background-color: #2d9fe4;  text-decoration: none;  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#2d9fe4, endColorstr=#056bcc);  background: -webkit-gradient(linear, left top, left bottom, from(#2d9fe4), to(#056bcc));  background: -moz-linear-gradient(top, #2d9fe4, #056bcc); }
.btnBlueM span { color: white;  background: url("../img/icons/arrows.png") no-repeat transparent;  background-position: right -122px;  padding-right: 18px; }
.btnGray { display: inline-block; padding: 12px 20px; margin: 20px 0; text-decoration: none; text-transform: uppercase; background-color: #7d7d7d; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#7d7d7d, endColorstr=#646464); background: -webkit-gradient(linear, left top, left bottom, from(#7d7d7d), to(#646464)); background: -moz-linear-gradient(top, #7d7d7d, #646464); }
.btnGray:hover { background-color: #d7d7d7;  text-decoration: none;  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#acacac, endColorstr=#959595);  background: -webkit-gradient(linear, left top, left bottom, from(#acacac), to(#959595));  background: -moz-linear-gradient(top, #acacac, #959595); }
.btnGray span { color: white;  background: url("../img/icons/arrows.png") no-repeat transparent;  background-position: right -120px;  padding-right: 18px; }

input[type=button].btnSubmit,
input[type=submit].btnSubmit { cursor: pointer; padding: 12px 20px; margin: 20px 0; text-transform: uppercase; background-color: #0070b4; color: white; padding-right: 33px; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; background: #0070b4; background-position: 90% -108px; background-repeat: no-repeat; background-image: url("../img/icons/arrows.png"); /* fallback */
background-image: url("../img/icons/arrows.png"), -webkit-gradient(linear, left top, left bottom, from(#0070b4), to(#00509c)); /* Saf4+, Chrome */
background-image: url("../img/icons/arrows.png"), -webkit-linear-gradient(top, #0070b4, #00509c); /* Chrome 10+, Saf5.1+ */
background-image: url("../img/icons/arrows.png"), -moz-linear-gradient(top, #0070b4, #00509c); /* FF3.6+ */
background-image: url("../img/icons/arrows.png"), -ms-linear-gradient(top, #0070b4, #00509c); /* IE10 */
background-image: url("../img/icons/arrows.png"), -o-linear-gradient(top, #0070b4, #00509c); /* Opera 11.10+ */
background-image: url("../img/icons/arrows.png"), linear-gradient(top, #0070b4, #00509c); /* W3C */ }
input[type=button].btnSubmit:hover { cursor: pointer;  background-color: #2d9fe4;  background: #2d9fe4;  background-position: 90% -108px;  background-repeat: no-repeat;  background-image: url("../img/icons/arrows.png");  /* fallback */
background-image: url("../img/icons/arrows.png"), -webkit-gradient(linear, left top, left bottom, from(#2d9fe4), to(#056bcc));  /* Saf4+, Chrome */
background-image: url("../img/icons/arrows.png"), -webkit-linear-gradient(top, #2d9fe4, #056bcc);  /* Chrome 10+, Saf5.1+ */
background-image: url("../img/icons/arrows.png"), -moz-linear-gradient(top, #2d9fe4, #056bcc);  /* FF3.6+ */
background-image: url("../img/icons/arrows.png"), -ms-linear-gradient(top, #2d9fe4, #056bcc);  /* IE10 */
background-image: url("../img/icons/arrows.png"), -o-linear-gradient(top, #2d9fe4, #056bcc);  /* Opera 11.10+ */
background-image: url("../img/icons/arrows.png"), linear-gradient(top, #2d9fe4, #056bcc);  /* W3C */ }
input[type=reset].btnReset,
input[type=submit].btnReset { padding: 12px 20px; margin: 20px 0; text-transform: uppercase; background-color: #7d7d7d; color: white; padding-right: 33px; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; background: #7d7d7d; background-position: 90% -108px; background-repeat: no-repeat; background-image: url("../img/icons/arrows.png"); /* fallback */
background-image: url("../img/icons/arrows.png"), -webkit-gradient(linear, left top, left bottom, from(#7d7d7d), to(#646464)); /* Saf4+, Chrome */
background-image: url("../img/icons/arrows.png"), -webkit-linear-gradient(top, #7d7d7d, #646464); /* Chrome 10+, Saf5.1+ */
background-image: url("../img/icons/arrows.png"), -moz-linear-gradient(top, #7d7d7d, #646464); /* FF3.6+ */
background-image: url("../img/icons/arrows.png"), -ms-linear-gradient(top, #7d7d7d, #646464); /* IE10 */
background-image: url("../img/icons/arrows.png"), -o-linear-gradient(top, #7d7d7d, #646464); /* Opera 11.10+ */
background-image: url("../img/icons/arrows.png"), linear-gradient(top, #7d7d7d, #646464); /* W3C */ }
input[type=reset].btnReset:hover { cursor: pointer;  background-color: #acacac;  background: #acacac;  background-position: 90% -108px;  background-repeat: no-repeat;  background-image: url("../img/icons/arrows.png");  /* fallback */
background-image: url("../img/icons/arrows.png"), -webkit-gradient(linear, left top, left bottom, from(#acacac), to(#959595));  /* Saf4+, Chrome */
background-image: url("../img/icons/arrows.png"), -webkit-linear-gradient(top, #acacac, #959595);  /* Chrome 10+, Saf5.1+ */
background-image: url("../img/icons/arrows.png"), -moz-linear-gradient(top, #acacac, #959595);  /* FF3.6+ */
background-image: url("../img/icons/arrows.png"), -ms-linear-gradient(top, #acacac, #959595);  /* IE10 */
background-image: url("../img/icons/arrows.png"), -o-linear-gradient(top, #acacac, #959595);  /* Opera 11.10+ */
background-image: url("../img/icons/arrows.png"), linear-gradient(top, #acacac, #959595);  /* W3C */ }
/* ==========================================================================
Media Queries
========================================================================== */
@media only screen and (min-width: 768px) and (max-width: 1024px) { .wrapper { box-sizing: border-box;  -webkit-box-sizing: border-box;  -moz-box-sizing: border-box;  max-width: 768px;  margin: 0 auto;  padding: 0 10px;  overflow: hidden; }
.headerWrapper { box-sizing: border-box;  -webkit-box-sizing: border-box;  -moz-box-sizing: border-box;  max-width: 768px;  margin: 0 auto;  padding-right: 10px; }
/* header */
.menuContainer .bottomContainer .mainMenu > li { margin: 0 10px 0 0; }
.menuContainer .supportMenu > li,
.menuContainer .mainMenu > li,
.menuContainer .onlineMenu > li { margin: 0 0 0 10px; }
#dropdownMenu .quarterBox.firstRow { height: 320px; }
#dropdownMenu .quarterBox.secondRow { height: 230px; }
/* home Page */
.flex-direction-nav .flex-next { display: none; }
.flex-direction-nav .flex-prev { display: none; }
/* productDetails Page */
#productDetails .articleContainer { width: 62%;  padding-right: 20px; }
#productDetails .asideContainer { width: 38%; }
#productDetails .asideContainer > ul > li { padding: 10px; }
/* specialOffer Page */
#specialOffer .productList .textContainer { padding-left: 40px; }
/* artworkTemplate Page */
#artworkTemplate .flexibleBox { width: 100%; }
#artworkTemplate .flexibleBox.even { padding-right: 0; }
#artworkTemplate .flexibleBox.odd { padding-left: 0; }
/* contactUs Page */
#contactUs .mapContainer > iframe { width: 486px; }
/* buttons */
.btnBlueM { padding: 6px 10px; } }
@media only screen and (min-width: 480px) { /* not support */ }
/* ==========================================================================
Helper classes
========================================================================== */
.hidden { display: none !important; visibility: hidden; }
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
.invisible { visibility: hidden; }
.clearfix:before,
.clearfix:after { content: " "; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }



/* ==========================================================================
24. Oct. 2013 by Andy Chin
Gallery Style
========================================================================== */

@media only screen and (min-width: 768px) {
	#productDetails .detailTextBox { clear: both; overflow: hidden; display: block; }
	#productDetails ul.image-gallery { margin-left: -5px; margin-right: -5px; position: relative; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
	#productDetails ul.image-gallery > li { float: left; width: 33.3333333333333%; padding-left: 5px; padding-right: 5px; margin-top: 10px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
	#productDetails ul.image-gallery > li .thumbnail-container { border: 1px solid lightgray; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
	#productDetails ul.image-gallery > li .thumbnail-container img { display: block; max-width: 100%; height: auto; }
 
}


.img-container {
    position: relative;
    padding-bottom: 56.25%;
    height: 0; overflow: hidden;
    margin-bottom:20px;
}

.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px; height: 0; overflow: hidden;
    margin-bottom:20px;
}
 
.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.hideMobile {
color: #7d7d7d;
font-size: 11px;
font-weight: lighter;
text-transform:uppercase;
line-height: 49px;
font-family: Arial;
}