/* Table of Content ================================================== #Font-Face #Site Styles #Media Queries */ /* #Font-Face ================================================== */ @import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic,700italic); /* #Site Styles ================================================== */ /* ### general ### */ * { margin: 0px; padding: 0px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } html, body { font-family: 'Source Sans Pro', Arial; font-size: 16px; font-weight: 400; line-height: 24px; color: #716669; } body { background: #fff; -webkit-font-smoothing: antialiased; -webkit-text-size-adjust: 100%; } img { border: 0px; display: block; max-width: 100%; height: auto; } ul, li { list-style: none; } :focus { outline: none; } /* #Typography */ h1, h2, h3, h4, h5, h6 { color: #221e1f; font-family: "grad", Arial; font-weight: 700; line-height: normal; } h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { font-weight: inherit; } h1 { font-size: 60px; line-height: 60px; margin-bottom: 14px; } h2 { font-size: 40px; line-height: 40px; margin-bottom: 10px; } h3 { font-size: 26px; line-height: 34px; margin-bottom: 8px; } h4 { font-size: 24px; line-height: 30px; margin-bottom: 4px; } h5 { font-size: 22px; line-height: 24px; } h6 { font-size: 20px; line-height: 21px; } p { margin: 0 0 25px 0; } em { font-style: italic; } strong { font-weight: bold; } small { font-size: 80%; } .title { font-family: 'Source Sans Pro', Arial; font-weight: 600; margin: 0px; font-size: 16px; text-transform: uppercase; } body.page-template-archive-moments .title{ text-transform: none;} /* Blockquotes */ blockquote, blockquote p { font-size: 17px; line-height: 24px; color: #777; font-style: italic; } blockquote { margin: 0 0 20px; padding: 9px 20px 0 19px; border-left: 1px solid #ddd; } blockquote cite { display: block; font-size: 12px; color: #555; } blockquote cite:before { content: "\2014 \0020"; } blockquote cite a, blockquote cite a:visited, blockquote cite a:visited { color: #555; } hr { border: solid #221e1f; border-width: 1px 0 0; clear: both; margin: 20px auto; height: 0; max-width: 72px; } hr.less { margin: 20px auto; } hr.full { max-width: none; } /* #Links */ a { color: #f68b1f; text-decoration: none; outline: 0; } a:hover { color: #f68b1f; text-decoration: underline; } a:focus { text-decoration: inherit; color: inherit; } a.more { color: #907c75; border-bottom: 1px solid #907c75; display: inline-block; padding-bottom: 2px; } a.more i { margin-left: 5px; font-size: 13px; } a.more:hover { color: #f68b1f; border-color: #f68b1f; text-decoration: none; } /* #Buttons */ .button, button, input[type="submit"], input[type="reset"], input[type="button"] { background: #f68b1f url(../images/btn-arrow.png) no-repeat right center; border: 0px; -moz-border-radius: 30px; -webkit-border-radius: 30px; border-radius: 30px; color: #fff; display: inline-block; font-size: 16px; font-weight: 400; text-decoration: none; cursor: pointer; line-height: normal; padding: 15px 30px; padding-right: 45px; font-family: "Source Sans Pro",Arial, sans-serif; -webkit-box-shadow: 0 4px 2px 2px rgba(0,0,0,0.05); box-shadow: 0 4px 2px 2px rgba(0,0,0,0.05); -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; } .button:hover, button:hover, input[type="submit"]:hover, input[type="reset"]:hover, input[type="button"]:hover { color: #fff; text-decoration: none; background-color: #e77f17; background-position: 102% center; } .button:active, button:active, input[type="submit"]:active, input[type="reset"]:active, input[type="button"]:active { text-decoration: none; background-color: #f68b1f; -webkit-box-shadow: 0 4px 2px 2px rgba(0,0,0,0.0); box-shadow: 0 4px 2px 2px rgba(0,0,0,0.0); } .button.full-width, button.full-width, input[type="submit"].full-width, input[type="reset"].full-width, input[type="button"].full-width { width: 100%; padding-left: 0 !important; padding-right: 0 !important; text-align: center; } /* Fix for odd Mozilla border & padding issues */ button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } /* #Forms */ form {} fieldset { padding: 0px; margin: 0px; border: 0px; } input[type="text"], input[type="password"], input[type="email"], textarea, select { border: 1px solid #ccc; padding: 12px 15px; outline: none; font: 16px "Source Sans Pro", Arial, sans-serif; color: #716669; margin: 0; width: 100%; height: 50px; display: block; background: #fff; -webkit-border-radius: 0; border-radius: 0; } input[type="text"]:focus, input[type="password"]:focus, input[type="email"]:focus, textarea:focus { -moz-box-shadow: 0 0 3px rgba(0,0,0,.2); -webkit-box-shadow: 0 0 3px rgba(0,0,0,.2); box-shadow: 0 0 3px rgba(0,0,0,.2); } textarea { height: auto; } label, legend { display: block; font-weight: bold; font-size: 13px; } input[type="checkbox"] { display: inline; } label span, legend span { font-weight: normal; font-size: 13px; color: #444; } /* ### global classes ### */ .clear { clear: both; visibility: hidden; line-height: 0; height: 0; } .centering { max-width: 1220px; margin: 0px auto; position: relative; padding-left: 10px; padding-right: 10px; } .sitelogo { position: absolute; left: 0px; right: 0px; top: -187px; } .sitelogo img { margin: 0px auto; } #lang_sel { height: 30px; font-family: 'Source Sans Pro', Arial; } #lang_sel li { width: 56px; font-weight: 700; position: relative; } #lang_sel a { display: block; padding: 0px 10px; font-size: 16px; line-height: 28px; text-transform: uppercase; color: #fff; border: 1px solid rgba(255,255,255,0.50); background: #221e1f; font-family: 'Source Sans Pro', Arial; } #lang_sel a:hover { background: #221e1f; text-decoration: none; } #lang_sel ul ul { display: none; width: 56px; top: 29px; position: absolute; left: 0px; right: 0px; top: 29px; } #lang_sel a.lang_sel_sel { background: url(../images/lang-arrow.jpg) no-repeat right center; } /* ### wrapper ### */ #wrapper { position: relative; display: block; width: 100%; } /* ### main container ### */ #mainCntr { margin: 0 auto; width: 100%; padding-top: 132px; } /* ### header container ### */ #headerCntr { width: 100%; color: #fff; position: fixed; left: 0px; right: 0px; top: 0px; z-index: 110; background: #221e1f; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; } #headerCntr.hideHeader { top: -190px; } /* ### top box ### */ .topBox { padding: 15px 0px; background: url(../images/top-bg.jpg) repeat center top; } .topBox ul { float: right; margin-right: -10px; } .topBox ul li { float: left; font-weight: 700; line-height: 28px; } .topBox ul li a { color: #fff; padding: 0px 10px; display: block; border: 1px solid rgba(255,255,255,0.0); } .topBox ul li a:hover, .topBox ul li.current-menu-item a { text-decoration: none; border-color: rgba(255,255,255,0.50); } /* ### logo box ### */ .logoBox { position: absolute; top: -45px; left: -8px; } /* ### menu box ### */ .menuBox { padding: 21px 0px; float: right; } .menuBox ul.menu { float: left; } .menuBox ul.menu li { float: left; margin-left: 20px; } .menuBox ul.menu li:first-child { margin-left: 0px; } .menuBox ul.menu li a { font-size: 20px; color: #fff; line-height: 30px; font-family: "grad", Arial; font-weight: 700; } .menuBox ul.menu li a:hover, .menuBox ul.menu li.current-menu-item a, .menuBox ul.menu li.current-page-ancestor a, .single-product .menuBox ul.menu li.prod a, .tax-product_cat .menuBox ul.menu li.prod a { text-decoration: none; color: #f68b1f; } .menuBox .m-menu { display: none; font-size: 16px; color: #fff; font-weight: 700; padding: 0px 10px; border: 1px solid rgba(255,255,255,0.50); } .menuBox .m-menu span { display: block; padding-left: 30px; line-height: 28px; background: url(../images/menu-burger.jpg) no-repeat left top; } .menuBox .m-menu.active span { background-position: left bottom; } .menuBox #lang_sel { display: none; } /* ### language box ### */ .langBox { padding: 21px 0px; float: right; margin-left: 30px; height: 30px; } .langBox #lang_sel ul ul { top: 29px; } /* ### search box ### */ .searchBox { padding: 21px 0px; margin-left: 20px; float: right; } .searchBox a { display: block; width: 30px; height: 30px; text-indent: -9999px; border: 1px solid rgba(255,255,255,0.50); background: url(../images/search-icon.jpg) no-repeat center top; } .searchBox a.active { background-position: center bottom; } .searchBox form { position: absolute; right: 0px; top: 72px; width: 360px; display: none; background: #221e1f; padding: 10px; } .searchBox fieldset { position: relative; } .searchBox input, .searchBox form input:focus { background: #221e1f; color: #fff; padding-right: 50px; border: 1px solid rgba(255,255,255,0.50); } .searchBox button { padding: 0px; width: 28px; height: 28px; text-indent: -9999px; position: absolute; right: 10px; top: 10px; background: url(../images/search-icon.jpg) no-repeat center top; } /* ### quotes container ### */ #quotesCntr { background: #fff url(../images/quote-bg.png) no-repeat right center; background-size: auto 100%; } #quotesCntr h2 { padding: 50px 0px; font-weight: 300; font-style: italic; margin: 0px; font-size: 34px; text-align: center; } /* ### slider container ### */ #sliderCntr { position: relative; overflow: hidden; } #sliderCntr .cycle-slideshow { position: relative; } #sliderCntr .cycle-slideshow img { width: 100%; /* height: auto; */ height: 100%; } #sliderCntr #per-slide-template { padding: 37px 0px; position: absolute; bottom: 0; left: 0; right: 0; z-index: 101; text-align: center; background: url('../images/slider-pagger.png') repeat; } #sliderCntr #per-slide-template a { display: inline-block; position: relative; font-size: 30px; line-height: 40px; padding: 0px 38px; border-left: 1px solid #fff; color: #fff; position: relative; font-family: "Grad", "grad", "Times New Roman", serif; font-weight: 700; } #sliderCntr #per-slide-template a:first-child { border: 0px; } #sliderCntr #per-slide-template a:hover, #sliderCntr #per-slide-template a:focus, #sliderCntr #per-slide-template a.cycle-pager-active { color: #f68b1f; text-decoration: none; } #sliderCntr #per-slide-template a.cycle-pager-active:before{content:" ";display:block;position:absolute;left:0;top:-60px;float:left;width:100%;height:23px;background:url(../images/slider-arrow.png) no-repeat center; } #sliderCntr .cycle-overlay { color: #fff; position: absolute; top: 25%; left: 0; right: 0; z-index: 102; } #sliderCntr .cycle-overlay p { color: #fff; font-size: 20px; } #sliderCntr .cycle-overlay h2 { font-size: 60px; color: #fff; font-weight: 700; margin-bottom: 20px; } /* ### banner container ### */ #bannerCntr { height: 500px; background-size: cover; background-repeat: no-repeat; background-position: center top; } #bannerCntr.small { height: 250px; } /* ### np container ### */ #npCntr { padding: 5px 0px; color: #221e1f; position: relative; background: #e3d7d7; } #npCntr a, #npCntr i { color: #6e5c56; } #npCntr a:hover { color: #221e1f; text-decoration: none; } #npCntr i { margin: 0 5px; font-size: 14px; } #npCntr .page-icon { position: absolute; right: 0px; left: 0px; height: 1px; top: 0px; z-index: 3; } #npCntr .page-icon img { display: block; margin: 0px auto; margin-top: -30px; } /* ### products container ### */ #productsCntr { padding: 90px 0px; text-align: center; } #productsCntr h2 { padding-bottom: 55px; } #productsCntr.pro { padding-top: 0px; margin-left: -15px; margin-right: -15px; } /* ### head box ### */ .headBox { text-align: center; position: relative; background-position: center center; background-repeat: no-repeat; background-size: cover; } .headBox h1 { padding: 100px 0px; margin: 0px; color: #fff; } .headBox h1 a { color: #fff; text-decoration: none; } .headBox .icon { position: absolute; left: 0px; right: 0px; bottom: -25px; } .headBox .icon img { margin: 0px auto; } .headBox .inner { background-color: rgba(0,0,0,0.55); } /* ### list box ### */ .listBox { padding: 55px 10px; text-align: center; color: #221e1f; max-width: 1520px; margin: 0px auto; } .listBox p { margin-bottom: 10px; } .listBox h4 { margin-bottom: 10px; } .listBox ul { width: 100%; overflow: hidden; } .listBox ul li { width: 20%; display: inline-block; margin: 0px -2px; margin-bottom: 45px; zoom: 1; vertical-align: top; } .listBox .detail { padding: 0px 20px; } .listBox .detail img { display: block; margin-bottom: 20px; } .listBox .detail:hover a { color: #f68b1f; border-color: #f68b1f; } /* ### content container ### */ #contentCntr { padding: 80px 15px; } #contentCntr.rmv { padding-bottom: 0px; } #contentCntr .pagesBox.news { margin-left: -15px; margin-right: -15px; } /* ### intro box ### */ .introBox { max-width: 600px; margin: 0px auto; padding: 0px 10px; padding-bottom: 50px; } /* ### brands box ### */ .brandBox { padding: 20px 0px; text-align: center; } .brandBox p { margin-bottom: 10px; } .brandBox h1 { margin-bottom: 40px; } .brandBox img { margin: 0px auto; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; } .brandBox .c2 { display: none; } .brandBox .logo { padding: 36px 10px; height: 135px; margin-bottom: 1px; background: #fff; } .brandBox .logo img { padding: 3px; } .brandBox .link { display: block; position: absolute; left: 0px; top: 0px; bottom: 0px; right: 0px; } .brandBox .brand { padding: 30px 20px; float: left; width: 33.33%; } .brandBox .inner { position: relative; } .brandBox .inner:hover a { color: #f68b1f; border-color: #f68b1f; } .brandBox .inner:hover img { padding: 0px; } .brandBox .detail { padding: 20px; padding-top: 15px; color: #221e1f; background: #fff; } .brandBox .centering { max-width: 1460px; padding-left: 0px; padding-right: 0px } /* ### pages box ### */ .pagesBox { padding: 20px 0px; padding-top: 0px; } .pagesBox p { margin-bottom: 15px; } .pagesBox h1 { margin-bottom: 40px; } .pagesBox .col2 { display: none; } .pagesBox .detail { position: relative; padding: 30px 40px; color: #221e1f; background: #fff; height: 192px;} .pagesBox .subPage { position: relative; width: 33.33%; padding: 30px 20px; float: left; } .pagesBox .subPage .link { display: block; text-indent: -9999px; position: absolute; top: 30px; right: 20px; bottom: 30px; left: 20px; } .pagesBox .subPage .img { display: block; width: 100%; overflow: hidden; } .pagesBox .subPage .img img { transition: .3s; -webkit-transition: .3s; } .pagesBox .subPage:hover a { color: #f68b1f; border-color: #f68b1f; } .pagesBox .subPage:hover .img img { transform: scale(1.2); -webkit-transform: scale(1.2); } .pagesBox .centering { max-width: 1460px; padding-left: 0px; padding-right: 0px; } .pagesBox .pageicon { position: absolute; left: 0px; right: 0px; top: -25px; } .pagesBox .pageicon img { margin: 0px auto; width: auto !important; } .pagesBox.news { padding: 100px 0px; background: #e9dfdf; } .pagesBox.news h5 { margin-bottom: 10px; font-size: 20px; } .pagesBox.news h5 span { font-family: 'Open Sans'; font-size: 12px; color: #716669; font-weight: 400; } /* ### action box ### */ .actionBox { padding: 90px 0px; color: #fff; position: relative; margin: 0px -15px; text-align: center; background-position: center top; background-repeat: no-repeat; background-size: cover; } .actionBox h2 { color: #fff; } .actionBox hr { border: solid #fff; border-width: 1px 0 0; margin: 20px auto; } .actionBox .bg { position: absolute; left: 0px; right: 0px; bottom: 0px; top: 0px; background-color: rgba(45,45,45,0.85); } .actionBox .button { margin-top: 20px; } .actionBox .centering { position: relative; z-index: 1; } .actionBox.nrml { color: #716669; margin-bottom: 100px; } .actionBox.nrml .bg { background: #e9dfdf; } .actionBox.nrml h2 { color: #221e1f; } .actionBox.nrml hr { border: solid #221e1f; border-width: 1px 0 0; } /* ### image box ### */ .imageBox { padding-bottom: 100px; max-width: 1500px; margin: 0px auto; } .imageBox .wpb_column { padding: 0px; } .imageBox .image-holder img { padding: 0px; margin: 0px; float: none; display: block; } .imageBox .content-holder { padding: 105px; } .imageBox .content-holder strong { font-size: 18px; line-height: 28px; } .imageBox .pageicon { position: absolute; right: -25px; top: 50%; margin-top: -40px; } .imageBox.odds .wpb_column:first-child { float: right; } .imageBox.odds .wpb_column:last-child { float: left; } .imageBox.odds .wpb_column:first-child .pageicon { right: auto; left: -25px; } .imageBox.postList { padding: 50px 0px; } .imageBox.postList .col-sm-7 { width: 53.333333%; } .imageBox.postList .col-sm-5 { width: 46.666667%; } .page-template-archive-vacancy .imageBox { margin: 0; } .product-holder div.row.contentBox:nth-of-type(odd) div.col-sm-6:nth-of-type(1), .product-holder div.row.imageBox:nth-of-type(odd) div.col-sm-6:nth-of-type(1) { float: left; } .product-holder div.row.contentBox:nth-of-type(odd) div.col-sm-6:nth-of-type(2), .product-holder div.row.imageBox:nth-of-type(odd) div.col-sm-6:nth-of-type(2) { float: right; } .product-holder div.row.contentBox:nth-of-type(even) div.col-sm-6:nth-of-type(1), .product-holder div.row.imageBox:nth-of-type(even) div.col-sm-6:nth-of-type(1) { float: right; } .product-holder div.row.contentBox:nth-of-type(even) div.col-sm-6:nth-of-type(2), .product-holder div.row.imageBox:nth-of-type(even) div.col-sm-6:nth-of-type(2) { float: left; } .product-holder div.row.imageBox:nth-of-type(even) .pageicon { right: auto; left: -25px; } .product-holder div.row.imageBox:nth-of-type(odd) .pageicon { left: auto; right: -25px; } /* ### content box ### */ .contentBox { max-width: 1240px; margin: 0px auto; padding-bottom: 50px; } .contentBox h3 { margin-bottom: 25px; } .contentBox .content-holder { padding: 70px 20px; padding-bottom: 40px; } /* ### sitemap box ### */ .sitemapBox { text-align: center; padding-bottom: 30px; } .sitemapBox > ul > li { margin-bottom: 15px; } .sitemapBox > ul > li > a { font-weight: 700; font-size: 22px; color: #716669; } /* ### inner pages ### */ .innerPages { padding: 90px 0px; padding-bottom: 100px; margin-left: -15px; margin-right: -15px; background: #e3d7d7; } .innerPages h2 { margin-bottom: 30px; } .innerPages .img { display: block; max-width: 327px; float: left; position: relative; } .innerPages .img a { display: block; width: 100%; overflow: hidden; } .innerPages .img a img { transition: .3s; -webkit-transition: .3s; } .innerPages .img .pageicon { position: absolute; right: -25px; top: 50%; margin-top: -25px; } .innerPages .link { position: absolute; left: 0px; right: 0px; top: 0px; bottom: 0px; text-indent: -9999px; } .innerPages .inner { position: relative; width: 100%; overflow: hidden; background: #fff; max-height: 176px;} .innerPages .inner:hover a { color: #f68b1f; border-color: #f68b1f; } .innerPages .inner:hover .img a img { transform: scale(1.2); -webkit-transform: scale(1.2); } .innerPages .detail { margin-left: 327px; padding: 20px 30px; padding-right: 15px; } .innerPages .detail p { margin-bottom: 10px; color: #221e1f; font-size: 14px; } .innerPages .subPage { padding: 20px; width: 50%; float: left; } .innerPages .centering { max-width: 1460px; padding: 0px; } #centresmap { margin: 60px -15px; height: 650px; } #centresmap #iw_container { padding: 10px; } #centresmap h5 { font-family: 'Source Sans Pro', Arial; font-size: 16px; text-transform: uppercase; margin-bottom: 2px; font-weight: 600; } #centresmap p { color: #221e1f; font-size: 15px; margin: 0px; } #centresmap p a { display: inline-block; padding-right: 15px; margin-top: 15px; color: #917d76; border-bottom: 1px solid #917d76; background: url(../images/link-arrow.gif) no-repeat right 9px; } #centresmap p a:hover { text-decoration: none; border-bottom-color: #fff; } /* ### result box ### */ .resultBox { margin-bottom: 15px; padding-bottom: 15px; } .resultBox h3 { margin-bottom: 10px; } /* ### address container ### */ #addressCntr { display: table; width: 100%; } #addressCntr h2 { margin-bottom: 35px; } #addressCntr .map, #addressCntr .address { display: table-cell; position: relative; width: 50%; } #addressCntr .inner { max-width: 470px; margin: 0px auto; padding: 100px 10px; } #addressCntr .map .overlay { display: none; position: absolute; left: 0px; right: 0px; top: 0px; bottom: 0px; z-index: 4; } #addressCntr .acf-map { position: absolute; left: 0px; right: 0px; bottom: 0px; top: 0px; } #addressCntr .acf-map.active { z-index: 2; } .accordBox { padding: 10px 40px; margin-top: 15px; background: #fff; } .accordBox a { color: #907c75; text-decoration: underline; } .accordBox a:hover { text-decoration: none; } .accordBox h3 { margin: 0px; padding: 20px 0px; cursor: pointer; background: url(../images/plus-icon.png) no-repeat right center; } .accordBox .detail { color: #221e1f; } .accordBox.active h3 { background: none; cursor: default; } /* ### share container ### */ #shareCntr { text-align: center; padding-bottom: 100px; } #shareCntr a { display: inline-block; width: 50px; height: 50px; font-size: 20px; color: #fff; margin: 0px 7px; text-align: center; line-height: 50px; background: #221e1f; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; } #shareCntr a:hover { background: #f68b1f; text-decoration: none; } /* ### brands container ### */ #brandsCntr { padding: 99px 0px; position: relative; text-align: center; } #brandsCntr img { margin: 0px auto; } #brandsCntr .logo { padding: 40px 20px; height: 142px; background: #fff; } #brandsCntr .brand { padding: 50px 20px; width: 16.66%; float: left; } #brandsCntr .centering { max-width: 1460px; padding-left: 0px; padding-right: 0px; } /* ### contact container ### */ #contactCntr { padding: 100px 0px; position: relative; text-align: center; background: #f1ebea; } #contactCntr p a { color: #221e1f; } #contactCntr h2 { max-width: 310px; margin: 0px auto; margin-bottom: 40px; } #contactCntr .detail { position: relative; padding: 40px; max-width: 430px; margin: 0px auto; color: #221e1f; background: #fff; } #contactCntr .detail:before{content:" ";display:block;position:absolute;left:0;top: -25px;float:left;width:100%;height:49px;background:url(../images/phone-icon.png) no-repeat center; } /* ### footer container ### */ #footerCntr { padding: 80px 0px; color: #fff; background: #221e1f url(../images/footer-bg.jpg) no-repeat right bottom; } #footerCntr a, #footerCntr h4 { color: #fff; } #footerCntr a:hover { color: #f68b1f; text-decoration: none; } /* ### nav box ### */ .navBox { padding: 10px 0px; float: left; } .navBox > ul { float: left; } .navBox > ul > li { float: left; max-width: 170px; margin-right: 70px; } .navBox > ul > li > a { font-size: 22px; font-family: "grad", Arial; font-weight: 700; } .navBox > ul > li > ul { margin-top: 12px; } /* ### social box ### */ .socialBox { padding: 10px 0px; float: right; text-align: center; margin-bottom: 20px; } .socialBox h4 { margin-bottom: 20px; } .socialBox a { display: inline-block; width: 50px; height: 50px; font-size: 20px; color: #f68b1f !important; margin: 0px 12px; text-align: center; line-height: 50px; background: #f3eded; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; } .socialBox a:hover { background: #fff; } /* ### copyright box ### */ .copyrightBox { padding: 10px 0px; padding-left: 47px; float: left; background: url(../images/footer-logo.png) no-repeat left center; } /* ### link box ### */ .linkBox { padding: 10px 0px; float: right; } .linkBox ul { float: left; } .linkBox ul li { float: left; margin-left: 20px; } .linkBox ul li:first-child { margin-left: 0px; } /* #Media Queries ================================================== */ @media only screen and (max-width: 1500px) { .imageBox { margin-left: -15px; margin-right: -15px; } } @media only screen and (max-width: 1370px) { .innerPages .detail { padding: 11px 30px; padding-right: 10px; } .topBox ul { margin-right: 0px; } } @media only screen and (min-width: 1201px) { .menuBox .inner, .langBox { height: auto !important; display: block !important; } } /* Width: 1200px */ @media only screen and (max-width: 1200px) { h1 { font-size: 50px; } h4 { font-size: 22px; } hr { margin: 20px auto; } .menuBox .m-menu { display: block; } .menuBox .inner { display: none; position: absolute; background: #221e1f; top: 70px; right: 0px; width: 228px; } .menuBox ul.menu { float: none; border-bottom: 1px solid #4e4b4c; } .menuBox ul.menu li { float: none; font-size: 18px; margin: 0px; border-top: 1px solid #4e4b4c; } .menuBox ul.menu li a { display: block; line-height: 50px; padding: 0px 20px; } .langBox { margin-left: 20px; } #quotesCntr h2 { font-size: 30px; } #bannerCntr { height: 330px; } .centering { max-width: 799px; } #sliderCntr #per-slide-template { padding: 25px 0px; } #sliderCntr #per-slide-template a { font-size: 20px; line-height: 30px; } #sliderCntr #per-slide-template a.cycle-pager-active:before { top: -48px; } .imageBox { margin-left: -15px; margin-right: -15px; } .imageBox .content-holder { padding: 0px 70px; } .listBox.home ul li:nth-child(5), #brandsCntr .brand.lg6, #brandsCntr .brand.lg5 { display: none; } .listBox.home ul li, #brandsCntr .brand { width: 25%; } .listBox.sing ul li, .listBox ul li { width: 33.33%; } .listBox.sing ul li:nth-child(4) { display: none; } #productsCntr { padding: 50px 0px; } #productsCntr h2 { padding-bottom: 30px; } .pagesBox .centering { padding-left: 0px; padding-right: 0px; max-width: 820px; } .pagesBox .subPage { width: 50%; } .pagesBox .col2 { display: block; } .pagesBox .col3 { display: none; } .innerPages .img { float: none; max-width: none; } .innerPages .img a img { width: 100%; height: auto; } .innerPages .img .pageicon { top: auto; left: 0px; right: 0px; bottom: -25px; } .innerPages .img .pageicon img { margin: 0px auto; } .innerPages .detail { margin: 0px; padding: 30px; text-align: center; } .headBox h1 { padding: 60px 0px; } .navBox > ul > li { margin-right: 50px; } .linkBox ul li { margin-left: 10px; } .copyrightBox { padding-left: 40px; } .navBox, .navBox > ul { width: 100%; float: none; overflow: hidden; } .navBox > ul > li { width: 33.33%; max-width: none; margin-right: 0px; } .socialBox { float: none; } .socialBox a { margin: 0px 10px; } } /* Width: 960px */ @media only screen and (max-width: 959px) { .logoBox { left: 0px; } .listBox.home ul li:nth-child(4), #brandsCntr .brand.lg4 { display: none; } #sliderCntr .cycle-overlay h2 { font-size: 50px; } #sliderCntr .cycle-slideshow img { height: 370px; width: auto; max-width: none; left: auto !important; right: 0px !important; } #sliderCntr .cycle-overlay { top: 20%; } .imageBox .content-holder { padding: 0px 40px; } .listBox ul li, #brandsCntr .brand, .listBox.home ul li { width: 33.33%; } .linkBox ul li { margin-left: 8px; } } @media only screen and (max-width: 859px) { #sliderCntr .cycle-slideshow img { right: -100px !important; } div.content-holder h2 { font-size: 30px; line-height: 35px; } .brandBox .brand { width: 50%; } .brandBox .c2 { display: block; } .brandBox .c3 { display: none; } #centresmap { height: 550px; } } /* Width: 767px */ @media only screen and (min-width: 768px) { .langBox #lang_sel { height: auto !important; display: block !important; } } /* Width: 767px */ @media only screen and (max-width: 767px) { h1 { font-size: 35px; line-height: 35px; } h1.nrml { font-size: 20px; line-height: normal; } h2 { font-size: 30px; line-height: 30px; } #mainCntr { padding-top: 0px; } .headBox h1 { font-size: 30px; padding: 45px 0px; } #quotesCntr h2 { padding: 20px 0px; font-size: 24px; line-height: 28px; } .logoBox { max-width: 170px; top: -55px; } #bannerCntr { height: 210px; } .searchBox { margin-left: 15px; } .searchBox form { max-width: none; left: 0px; right: 0px; width: auto; } .menuBox .inner { left: 0px; right: 0px; width: auto; } .menuBox .m-menu { padding: 0px 8px; } .menuBox #lang_sel { display: block; margin: 20px; height: auto; } .menuBox #lang_sel ul ul { position: static; } .langBox { display: none; } .introBox { padding-left: 0px; padding-right: 0px; padding-bottom: 20px; } #contactCntr { padding-bottom: 0px; } #contactCntr .detail { max-width: none; margin-left: -10px; margin-right: -10px; } #sliderCntr { display: none; } .imageBox .pageicon { position: static; } .imageBox .pageicon img { margin: 0px auto; position: relative; top: -25px; } #npCntr { padding: 10px 0px; } #npCntr .page-icon img { margin-top: 28px; } .brandBox .brand { width: 100%; padding: 15px 0px; } .contentBox { margin-left: -15px; margin-right: -15px; } .contentBox .content-holder { padding: 0px; } div.content-holder h2 { line-height: normal; } .imageBox.postList { padding: 25px 0px; } .imageBox.postList .col-sm-7, .imageBox.postList .col-sm-5 { width: 100%; } .imageBox { padding-bottom: 50px; } .imageBox .content-holder { padding: 0px 15px; } #addressCntr { display: block; } #addressCntr .inner { padding: 40px 15px; } #addressCntr .map, #addressCntr .address { display: block; width: auto; } #addressCntr .map { height: 320px; } #addressCntr .map .overlay { display: block; } .accordBox { margin-left: -15px; margin-right: -15px; } #centresmap { height: 450px; } .listBox.home ul li:nth-child(3), #brandsCntr .brand.lg3 { display: none; } .innerPages .subPage { float: none; padding-left: 0px; padding-right: 0px; width: auto;} .listBox ul li, .listBox.sing ul li, .listBox.home ul li, #brandsCntr .brand { width: 50%; } .listBox .detail, #brandsCntr .brand { padding-left: 10px; padding-right: 10px; } .listBox ul li a.more { font-size: 13px;} .pagesBox .subPage { float: none; width: auto; padding: 20px 0px; } .pagesBox .subPage.inr { margin-left: -15px; margin-right: -15px; } .pagesBox .subPage img { width: 100%; height: auto; } .pagesBox .detail { padding: 20px 15px; } #footerCntr { padding: 10px 0px; text-align: center; } .actionBox { padding: 60px 0px; } .linkBox ul { float: none; padding-bottom: 10px; } .linkBox ul li { float: none; display: inline-block; margin: 0px 5px; } .linkBox ul li:first-child { display: block; text-align: center; } .copyrightBox { float: none; display: inline-block; } .linkBox { float: none; } .navBox { display: none; } } /* Width: 479px */ @media only screen and (max-width: 479px) { #brandsCntr .logo { padding: 30px 10px; height: 115px; } #centresmap { height: 350px; } .listBox .detail p { display: none; } }