/* ============================================================================= Global Styles ========================================================================== */ article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; } audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; } audio:not([controls]) { display: none; }[hidden] { display: none; } html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; -webkit-font-smoothing: antialiased;} html, button, input, select, textarea { font-family: "DIN-Regular"; color: #222; } body { margin: 0; font-size: 1em; line-height: 1.4; } ::-moz-selection { background: #00acdc; color: #fff; text-shadow: none; } ::selection { background: #00acdc; color: #fff; text-shadow: none; } a { color: #ffde00; text-decoration: none;}a:visited { color: #ffde00; }a:hover { color: #ffde00;}a:focus {}a:hover, a:active {outline: 0;opacity: 0.7;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";} b, strong {font-weight: bold;} blockquote { margin: 1em 40px;} dfn { font-style: italic; } hr { display: block; height: 1px; border: 0; border-top: 1px dashed #ccc; margin: 2em 0; padding: 0; } ins { background: #ff9; color: #000; text-decoration: none; } mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; } pre, code, kbd, samp { font-family: monospace, serif; _font-family: 'courier new', monospace; font-size: 1em; } pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; } small { font-size: 85%; } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.25em; } ul, ol { margin: 1em 0; padding: 0 0 0 0px; } dd { margin: 0 0 0 40px; } nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; } img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; } svg:not(:root) { overflow: hidden; } figure { margin: 0; } form { margin: 0; } fieldset { border: 0; margin: 0; padding: 0; } label { cursor: pointer; } legend { border: 0; *margin-left: -7px; padding: 0; white-space: normal; } button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; outline-color: #ffde00;} button, input { line-height: normal; } button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; *overflow: visible; } button[disabled], input[disabled] { cursor: default; } input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; *width: 13px; *height: 13px; } input[type="search"] { -webkit-appearance: textfield; box-sizing: content-box; } input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; } button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } textarea { overflow: auto; vertical-align: top; resize: vertical; } input:valid, textarea:valid { } input:invalid, textarea:invalid { background-color: #f0dddd; } table { border-collapse: collapse; border-spacing: 0; } td { vertical-align: top; } .chromeframe { margin: 0.2em 0; background: #ccc; color: black; padding: 0.2em 0; } ::-webkit-input-placeholder { color:inherit; } :-moz-placeholder { /* Firefox 18- */ color:inherit; } ::-moz-placeholder { /* Firefox 19+ */ color:inherit; } :-ms-input-placeholder { color:inherit; } /* ============================================================================= Grid Styles ========================================================================== */ *, *:after, *:before {box-sizing: border-box;} .grid-pad {padding: 10px 0 0px 0px;} .grid:after {content: "";display: table;clear: both;} [class*='col-'] {float: left;} [class*='col-'] {padding: 0 8px;} [class*='col-']:last-of-type {} .grid-pad > [class*='col-']:last-of-type {} .grid {margin: 0;} /* Full */ .col-1-1 {width: 100%;} /* Halves */ .col-1-2 {width: 50%;} /* Thirds */ .col-1-3 {width: 33.33%;}.col-2-3 {width: 66.66%;} /* Quarters */ .col-1-4 {width: 25%;}.col-2-4 {width: 50%;}.col-3-4 {width:75%;} /* Fifths */ .col-1-5 {width:20%;}.col-2-5 {width:40%;}.col-3-5 {width:60%;}.col-4-5 {width:80%;} /* Sixths */ .col-1-6 {width:16.66%;}.col-2-6 {width:33.33%;}.col-3-6 {width:50%;}.col-4-6 {width:66.66%;}.col-5-6 {width:83.33%;} /* Sevenths */ .col-1-7 {width:14.28%;}.col-2-7 {width:28.57%;}.col-3-7 {width:42.85%;}.col-4-7 {width:57.14%;}.col-5-7 {width:71.42%;}.col-6-7 {width:85.71%;} /* Eighths */ .col-1-8 {width:12.5%;}.col-2-8 {width:25%;}.col-3-8 {width:37.5%;}.col-4-8 {width:50%;}.col-5-8 {width:62.5%;}.col-6-8 {width:75%;}.col-7-8 {width:87.5%;} @media screen and (min-width: 480px) and (max-width: 699px) { .col-1-1 {width: 100%;} .col-1-2 {width: 50%;margin-bottom: 10px;} .col-1-3, .col-2-3 {width: 100%; padding-right:0px;margin-bottom: 10px;} .col-1-4, .col-2-4, .col-3-4 {width: 100%; padding-right:0px;margin-bottom: 10px;} } @media screen and (min-width: 0px) and (max-width: 479px) { .col-1-1 {width: 100%;} .col-1-2 {width: 100%; padding-right:0px;margin-bottom: 10px;} .col-1-3, .col-2-3 {width: 100%; padding-right:0px;margin-bottom: 10px;padding: 0;} .col-1-4, .col-2-4, .col-3-4 {width: 100%; padding-right:0px;margin-bottom: 10px;} .grid-pad{padding:0px;} } /* ============================================================================= Non-Semantic Helper Classes ========================================================================== */ .hidden { display: none !important; visibility: hidden; } .clearfix:before, .clearfix:after { content: ""; display: table; } .clearfix:after { clear: both; } .clearfix { *zoom: 1; } .vert_align {position: relative;top: 50%;-webkit-transform: translateY(-50%);transform: translateY(-50%);} /* ============================================================================ Primary ========================================================================== */ html{background: #ffde00;font-family: "DIN-Regular";overflow-x: hidden;} html:before{display: block; content: ' ';height: 100%;background: #ffde00;width: 7px;position: fixed;z-index: 9;} html:after{display: block;content: ' ';height: 100%;background: #ffde00;width: 7px;position: fixed;z-index: 99;right: 0px;top: 0px;} body{margin: 0px 7px; color:#fff;position: relative;height:100%;} body:before{display: block; content: ' ';width: 100%;height: 7px;position: fixed;top: 0px;z-index: 9;background: #ffde00;left: 0px;} body:after{display: block; content: ' ';width: 100%; height: 7px; background: #ffde00; position: fixed; bottom: 0px;z-index: 9;} html.on-device:before, html.on-device:after, .on-device body:before, .on-device body:after{display: none;} .inner{margin: 0 auto;padding: 50px 5%;} body.admin-bar:before{ top:32px; } #rightRam .col-1-3.green, .entry-icons-ram .col-1-3.green, .entry-icons-ram .col-1-2.green{background-color: #45b969;} #rightRam .col-1-3.orange, .entry-icons-ram .col-1-3.orange, .entry-icons-ram .col-1-2.orange{background-color: #F47920;} #rightRam .col-1-3.blue, .entry-icons-ram .col-1-3.blue, .entry-icons-ram .col-1-2.blue{background-color: #00acdc;} #rightRam .col-1-3.yellow, .entry-icons-ram .col-1-3.yellow, .entry-icons-ram .col-1-2.yellow{background-color: #14265d;} .entry-icons-ram .entryPanel { padding: 3em 2em 5em; position: relative; overflow: hidden; border-radius: 4px;} .entry-icons-ram .entryPanel .panelInner { position:relative; padding: 0px;} .entry-icons-ram .entryPanel p { max-width: 100%;} .entry-icons-ram .entryPanel h2 { font-size:3em; } .entry-icons-ram .entryPanel h2 span { color:inherit; font-size:14px; position:relative; top:-1.8em; padding-left:1px} .entry-icons-ram .entryPanel .button { position:relative; top: 2em; margin: 0 0 2em; color: #FFF !important; border-color: #FFF !important;} .entry-icons-ram .entryPanel:before { position:relative; content:""; background: #F47920; width:100%; height:100%; display:block; position: absolute; border: none; bottom: 80px;} .entry-icons-ram .green:before { background:#45b969; } .entry-icons-ram .orange:before { background:#F47920; } .entry-icons-ram .blue:before { background:#00acdc; } #content .entry-icons-ram .col-1-3:nth-child(1) a.button, #content .entry-icons-ram .col-1-3:nth-child(2) a.button, #content .entry-icons-ram .col-1-3:nth-child(3) a.button{color:white;background:transparent;border:2px solid white} @media screen and (min-width:1200px) and (max-width:1400px){ .entry-icons-ram .entryPanel h2{font-size: 2.55em;} } @media screen and (max-width:1200px){ .page-template-page-ram-entry-php .col-1-3{width:50%;margin-bottom: 20px;} .page-template-page-ram-entry-php .col-1-3:nth-child(2n+1){clear:both;} } @media screen and (max-width:1024px){ body{overflow-x: hidden;} } @media screen and (max-width:800px){ .page-template-page-ram-entry-php .col-1-3{width:100%;margin-bottom: 10px;} .entry-icons-ram .entryPanel{padding: 20px 20px 1px;min-height: 0px;} .entry-icons-ram .entryPanel h2{font-size: 2.7em;margin: 10px 0px -6px;} .entry-icons-ram .entryPanel.orange{background: #F47920;} .entry-icons-ram .entryPanel.blue{background: #00acdc;} .entry-icons-ram .entryPanel.green{background: #45b969;} #content .entry-icons-ram .entryPanel .button{margin: 0px;top: 0px;} } /* wrap */ .wrap{position: relative;-webkit-transition: -webkit-transform .33s cubic-bezier(.5,.03,.66,1);transition: -webkit-transform .33s cubic-bezier(.5,.03,.66,1);transition: transform .33s cubic-bezier(.5,.03,.66,1);transition: transform .33s cubic-bezier(.5,.03,.66,1), -webkit-transform .33s cubic-bezier(.5,.03,.66,1);z-index: 2;background: #0c1431;} .wrap.slide{-webkit-transform: translate3d(-250px, 0px, 0px);transform: translate3d(-250px, 0px, 0px);} /* ============================================================================ Typography ========================================================================== */ h2{font-family: "DIN-Light";font-weight: 100;text-transform: uppercase;font-size: 60px;line-height: 88%;} .home-slider h2{margin: 0px 0px 20px 0px;font-family: "DIN-Bold";font-style: italic;letter-spacing: -0.03em;max-width: 550px;} .entryPanel h2,.panelInner h2{font-size: 2em;position: relative;font-family: "DIN-Bold";} h3{font-family: "DIN-Bold";font-weight: normal; text-transform: uppercase;} h4{} p{color: #d1d2d4;line-height: 1.6em;font-size: 100%;} /* ============================================================================ Typography - New 27 April 2017 ========================================================================== */ h2.title {font-family: "DIN-Bold";font-weight: 100;text-transform: uppercase;font-size: 66px;line-height: 88%; font-style:italic; letter-spacing: -0.03em; color:#ffde00;} @media screen and (max-width:1024px){ body{font-size:90%;} h2{font-size: 410%;} h2.title{} .entryPanel h2{} } @media screen and (max-width:700px){ body{font-size: 80%;margin: 0px;} h2.title{} .entryPanel h2{} } @media screen and (max-width:450px){ body{font-size: 70%;} .home-slider h2,h2.title{font-size: 330%;} .entryPanel h2{} } /* ============================================================================ Buttons - icons ========================================================================== */ .icon{font-family: "motus";text-decoration: none;} a.button{color: #091849;font-family: "DIN-Regular";font-weight: normal;display: inline-block;padding: 6px 27px 4px 13px;font-size: 14px;margin: 5px 0px;position: relative;border-radius: 2px;outline: none !important;background-color: #ffde00;} a.button:hover{border-color: rgba(255, 255, 255, 0.5);} .button.large{font-size: 16px;padding: 12px 23px;margin: .2em 0px;border-width: 3px;text-transform: uppercase;font-family: "DIN-Bold";background: #ffde00;border: 0px;color: #091849;} .button.large:hover{opacity: 0.9;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";} .button.large.video:after{font-size: 120%;top: 10px;} .entryPanel .button{background: transparent;border: 2px solid white;color: #fff;} @media screen and (max-width:500px){ .button{} .button.large{font-size: 16px;padding: 7px 15px;} a.button.large:after{ top: 12px; right: 10px; } .button.large.video{padding-right: 29px;} .button.large.video:after{top: 6px;right: 7px;} } /* ============================================================================ Header ========================================================================= */ /* off canvas nav */ #mnav{position: fixed;top: 0px;z-index: 0;background: #ffde00;width: 260px;height: 100%;padding: 77px 30px 0px;right: 0px;} #mnav .icon-close{display:block;color: rgba(9, 24, 73, 0);position: fixed;right: 34px;font-size: 0;cursor: pointer;top: 27px;} #mnav .icon-close:before{font-size: 28px;color: #091849;} #mnav ul{ width: 100%; height: 100%;} #mnav ul li{float: none;line-height: 42px;width: 100%;font-size: 107%;display: block;} #mnav ul li a{display: block;width: 100%;margin: 0px;border-bottom: 1px solid rgba(9, 24, 73, 0.05);text-transform: uppercase;color: #091849;} #mnav ul li.current_page a{ font-family:"DIN-Bold";} /* search */ a.icon.searchIcon{color: #fff;font-size: 25px;margin: 15px 21px 10px 10px;float: right;padding: 5px 10px;} a.icon.searchIcon:hover{color:#d1d2d4;} a.icon.searchIcon.selected{color: #ffde00;} .searchArea{background: #ffde00; width: 100%;-webkit-transition: all 0.3s ease;transition: all 0.3s ease;height: 0px;overflow: hidden;position: relative; z-index: 2;} form#search_form{width: 100%;border-radius: 4px;} .searchArea.active{display: block; height: 85px;} form#search_form input#searchInput{border: 0px;background: transparent;height: 85px;width: 100%;padding: 0px 20px;color: #091849;outline: none;font-weight: 100;font-size: 170%;opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";text-align: right;} form#search_form input#searchInput:focus{opacity:1.0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";} form#search_form input#searchSubmit{font-family: "motus";border: 0px;background: transparent;color: #fff;width: 13%;text-align: right;font-size: 25px;top: 7px;position: relative;outline: none;float: right;padding-right: 29px;line-height: 64px;display: none;} /* header */ #header{border-bottom: 1px solid rgba(255, 255, 255, 0.12);padding-top: 8px;position: absolute;width: 100%;z-index: 9;} #header h1{margin: 14px 0px 21px 21px;display: inline-block;float: left;} #header h1 a{color: transparent;font-size: 0px;line-height: 0px;text-indent: -9999px;background: url(../img/motus-logo.svg) no-repeat;width: 250px;height: 46px;display: block;top: 0px;position: relative;} .no-svg #header h1 a{background: url(../img/motus-logo.png) no-repeat; background-size: 100%;} a.mobileNav{display:none;} a.mobileNav.selected{color: #ffde00;} /* main nav */ #nav{display: inline-block;margin: 0px 20px;float: right;} #nav ul{} #nav ul span.close{display: none;} #nav ul li{display: inline-block;font-size: 16px;font-family: "DIN-Regular";text-transform: uppercase;position: relative;margin-left: 30px;} #nav ul li.page-item-67 a:before{content: ' ';opacity:0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";display: block;width: 30px;height: 18px;position: absolute;bottom: 5px;border-bottom: 18px solid rgb(24, 37, 82);border-left: 15px solid transparent;border-right: 15px solid transparent;margin: auto;left: 0;right: 0;-webkit-transition: all 0.3s ease;transition: all 0.3s ease;} #nav.open_mm ul li.page-item-67 a:before{opacity:1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";} .scroll #nav.open_mm ul li.page-item-67 a:before{display:none;} #nav ul li a{color: #FFFFFF;padding: 34px 16px;display: inline-block;position: relative;} #nav ul li a:hover{color:#d1d2d4;} #nav ul li.current_page_item a, #nav ul li.current_page_ancestor a{color: #ffde00;} span.ramph{color: #ffde00;font-family: "DIN-Light";display: inline-block;float: right;text-align: right;padding: 22px 20px 0px;text-transform: uppercase;line-height: 120%;font-size: 80%;} span.ramph span{display: block;font-size: 140%;color: white;} span.ramph span a{color:white;} /* drop down nav */ #nav ul.sub-menu{display: block;position:absolute;background: rgb(13, 28, 74);-webkit-transition: all 0.3s ease;transition: all 0.3s ease;opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";pointer-events: none;} #nav li:hover ul.sub-menu{opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";pointer-events: all;} #nav ul.sub-menu li{font-size: 14px;margin: 0 0 4px 0;display: block;border-bottom: 1px solid rgba(46, 61, 109, 0.53);} #nav ul.sub-menu li:last-child{border:0px;} #nav ul.sub-menu li a{color: #ffde00;padding: 9px 13px;min-width: 200px;} @media screen and (min-width:1101px){ #header{position: fixed;-webkit-transition: all 0.3s ease; transition: all 0.3s ease;} #header.scroll{background: rgba(24, 37, 82, 0.8);z-index: 999;/* height: 60px; */} #header.scroll:hover{background: rgba(24, 37, 82, 0.9);} } @media screen and (min-width:1101px) and (max-width:1550px){ #header h1 a{position: absolute;top: 24px;} #nav{margin: 0px 0px;} #nav ul li{font-size: 14px;} #nav ul li a{padding: 34px 5px;} #nav ul li.page-item-67 a:before{bottom:0px;} } @media screen and (max-width: 1200px){ a.mobileNav{display: block;float: right;padding: 20px 30px 20px 15px;font-size: 25px;color: #fff;} #header h1 a {margin-bottom:10px;} #nav{display:none;} a.icon.searchIcon{margin: 0px;padding: 27px 20px;} form#search_form input#searchInput{font-size: 170%;padding-left: 15px;} } @media screen and (max-width:700px){ #header h1{margin: 26px 0px 0px 12px;} form#search_form input#searchInput, .searchArea.active{height: 70px;} } @media screen and (max-width:550px){ #header h1{width: 136px;height: 25px;background-size: 100%;margin: 19px 0px 0px 12px;} #header h1 a{background-size: 100%;width: 135px;height: 46px;} a.mobileNav{padding: 10px 16px;} #mnav .icon-close{top: 16px;right: 22px;} span.ramph{display: block;clear: both;width: 100%;padding: 0px 10px 10px 10px;text-align: left;font-size: 100%;} span.ramph span{display: inline;padding-left: 7px; font-size: 120%;} a.icon.searchIcon{padding: 10px 6px;} form#search_form input#searchInput, .searchArea.active{height: 50px;} form#search_form input#searchInput{padding-right: 14px;} } /* ============================================================================= Promo (homepage) ========================================================================== */ #promo{position:relative; overflow: hidden; background: #091849;background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMTAwJSI+CiAgICA8c3RvcCBvZmZzZXQ9IjAlIiBzdG9wLWNvbG9yPSIjMDkxODQ5IiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzFmMzU3MSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#091849), color-stop(100%,#1f3571));background: -webkit-linear-gradient(-45deg, #091849 0%,#1f3571 100%);background: -webkit-linear-gradient(315deg, #091849 0%,#1f3571 100%);background: linear-gradient(135deg, #091849 0%,#1f3571 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#091849', endColorstr='#1f3571',GradientType=1 );} #promo .inner{min-height: 810px;position: relative;z-index: 2;background: url(../img/rams_2016.png) no-repeat bottom -120px right;} @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { /* chrome retina background-attachment:fixed bug - switching off */ #promo .inner{background: url(../img/3rams.png) no-repeat scroll bottom right;} } #promo.searchOpen .inner{background-attachment: scroll;} #promo:before{content:' '; display:block;width: 100px;height: 100px;background: url(../img/warranty.svg) no-repeat scroll;background-size: 100%;position: absolute;bottom: 53px;right: 70px;z-index: 9;} #promo:after{content:' '; display: none;background: transparent url(../img/3rams.png) no-repeat bottom right;width: 1049px;height: 818px;position: absolute;bottom: -50px;right: 0px;z-index: 1;opacity: 0.4;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";} .promoCopy{padding-top: 170px;} #promo h2{margin-bottom: 0.4em;} #promo p{max-width: 470px;margin-bottom: 1.6em;font-size: 120%;} .vidModal{margin: 0 auto; padding: 0px 5%;background: rgba(9, 24, 73, 0.95);position: absolute;top: 0px;width: 100%;z-index: 9;max-height: 100%;visibility: hidden;display: none;} .showVid .vidModal{visibility: visible;display: block;} .vidPad{} .vidModal iframe{margin: 0px auto;display: block;width: 860px;height: 480px;max-width: 100%;background: #000;} a.closeVid.icon{position: absolute;top: 0px;background: #ffde00;color: rgba(9, 24, 73, 1);width: 60px;height: 60px;line-height: 60px;text-align: center;font-size: 200%;border-radius: 50px;right: 30px;top: 34px;cursor: pointer;} a.closeVid.icon:hover{opacity: 0.9;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";} @media screen and (max-width:1300px){ #promo:after{right: -220px;} #promo:before{bottom: 30px;top: initial;right: 33px;} #promo .inner{background-size: 920px;background-position: bottom -140px right -140px;} .vidModal iframe{} } @media screen and (max-width:1024px){ #promo:after{right: -220px;width: 840px;background-size: 100%;opacity: 0.4;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";} #promo:before{} #promo .inner{background-size: 920px;background-position: bottom -20px right -210px;} .vidModal iframe{ height: 350px;width: 630px;} } @media screen and (max-width:700px){ #promo:after{right: -230px; opacity: 0.25; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=25)"; background: transparent url(../img/3rams_small.png) no-repeat bottom right;background-size: 100%;width: 670px;} #promo .inner{min-height: 630px;} .promoCopy{padding-top: 130px;} #promo:before{} #promo .inner{background-image: url(../img/rams_2016_transparent.png);background-size: 699px;} .vidModal iframe{height: 210px;width: 360px;} } @media screen and (max-width:450px){ #promo:after{width: 490px;left: -100px;} #promo .inner{min-height: 510px;} .promoCopy{padding-top: 100px;} #promo p{font-size:14px;} #promo:before{width: 70px;height: 70px;} #promo .inner{background-position: -170px 20px;} .vidModal iframe{height: 150px;width: 250px;} } /* ============================================================================= Right ram (homepage) ========================================================================== */ #rightRam{z-index: 3;background: #14265d;} #rightRam .overlay{width: 100%;} #rightRam h2.title{margin-bottom: 41px;} #rightRam .col-1-3, .entry-icons-ram .col-1-3,.entry-icons-ram .col-1-2{padding: 41px 2% 40px;border-right: 2px solid #14265d;margin-bottom: 11px;background: rgba(255, 255, 255, 0.1);} .entry-icons-ram .col-1-3,.entry-icons-ram .col-1-2{border-right:2px solid #e8ecee;background: rgb(255, 255, 255);} #rightRam .col-1-3:nth-child(1), #rightRam .col-1-3:nth-child(2), #rightRam .col-1-3:nth-child(3){background-image: url(../img/blueAngle.png);background-repeat: no-repeat;background-position: bottom right;background-size: 40px;} .entry-icons-ram .col-1-3:nth-child(1), .entry-icons-ram .col-1-2:nth-child(1), .entry-icons-ram .col-1-3:nth-child(2), .entry-icons-ram .col-1-2:nth-child(2), .entry-icons-ram .col-1-3:nth-child(3), .entry-icons-ram .col-1-2:nth-child(3),.entry-icons-ram .col-1-2:nth-child(4){background-image: url(../img/greyAngle.png);background-repeat: no-repeat;background-position: bottom right;background-size: 40px;} #rightRam .col-1-3 a.link-overlay{display: none;} #rightRam .col-1-3 .col-1-3{width:100%; padding: 50px 0px 0px;} #rightRam .col-1-3 .box{/* border-bottom: 1px solid rgba(255, 255, 255, 0.08); */padding: 20px 0px;} #rightRam .col-1-3 .box h3{margin: 0px 0px 0.3em;color: #fff;} #rightRam .col-1-3 .box p{margin: 0px 0px 0.5em;font-size: 100%;} #rightRam .inner{padding: 0px;} #rightRam .entryPanel{position: relative;} #rightRam .inner > .grid > .col > .grid{display:none;} #rightRam .entryPanel:hover{} #rightRam .inner > .grid > .col{display: -moz-flex;display: -webkit-box;display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;position: relative;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;} #rightRam .col-1-3:nth-child(4) h2, #rightRam .col-1-3:nth-child(5) h2, #rightRam .col-1-3:nth-child(6) h2 {font-family: "Din-Light";} #rightRam .inner > .grid > .col-1-3{background: transparent none repeat scroll 0 0;width: 100%;padding: 71px 7%;} #rightRam .inner > .grid > .col-1-3 .col-1-3{padding: 0px 20px 0 0;float: left;width: 33%;background: transparent;} .link-overlay{position: absolute;top: 0px;left: 0px;right: 0;display: block;bottom: 0;z-index: 3;} #rightRam sub{color: rgba(255, 255, 255, 0.48);clear: both;display: block;margin-bottom: 18px;height: 30px;bottom: initial;line-height: initial;padding-top: 20px;} .entryPanel:before{content:' '; display: none;width: 0px;height: 0px;background: transparent;position: absolute;border-left: 60px solid #0C0C20;border-top: 80px solid transparent;bottom: 0px;left: 0px;} .panelInner{z-index: 2;-webkit-transform: translateY(0%);transform: translateY(0%);top: 0;} .panelInner p{font-size: 15px;} [class*="orange"] .panelInner p,[class*="blue"] .panelInner p,[class*="green"] .panelInner p,[class*="yellow"] .panelInner p, [class*="orange"] .panelInner h2 a,[class*="blue"] .panelInner h2 a,[class*="green"] .panelInner h2 a,[class*="yellow"] .panelInner h2 a {color:white;} .panelInner h2 a{ color: #48535a; } .panelInner p.sub{margin: 0px;color: rgba(255, 255, 255, 0.75);font-size: 100%;display: none;} .panelInner h2{margin: 0px;} .panelInner h2 a{position: relative;font-weight: normal;} .home .panelInner h2 a{color:white} .panelInner h2 a:hover{color:rgba(255,255,255,0.75);} .panelInner h2 span{font-size: 30%;position: absolute;padding-left: 3px;top: -4px;color: white;} #rightRam .col-2-3 .grid{display:none;} #rightRam .col-1-3 .grid{display:block;} .entry-icons-ram .col-1-3:nth-child(4) h2 a,.entry-icons-ram .col-1-3:nth-child(5) h2 a,.entry-icons-ram .col-1-3:nth-child(6) h2 a{color: #48535a;} .entry-icons-ram .col-1-3:nth-child(4) p,.entry-icons-ram .col-1-3:nth-child(5) p,.entry-icons-ram .col-1-3:nth-child(6) p{color: #48535a;} .entry-icons-ram .col-1-3 a{} @media screen and (max-width:1024px){ #rightRam h2.title{max-width: 100%;margin-bottom: 16px;} #rightRam .col-1-3{width: 100%;padding-right: 0%;} #rightRam .col-1-3 .col-1-3{width: 33.33%; padding-right: 30px;} #rightRam .col-2-3{width: 100%;} #rightRam .inner{} #rightRam .entryPanel{height: auto;padding: 35px 5%;margin-bottom: 2px;} #rightRam .entryPanel:hover{} .panelInner{top: 0%;-webkit-transform: translateY(0%);transform: translateY(0%);} .panelInner p{line-height: 1.3em;margin-bottom: 17px;} .entryPanel .button{margin: 0px;position: relative;left: 0px;right: initial;float: none;top: 0px;} #rightRam .col-2-3 .grid{display:block;padding-top: 30px;} #rightRam .inner > .grid > .col-1-3 .col-1-3{width:100%;float: none;-webkit-clip-path: none;clip-path: none;margin: 0;border-bottom: 1px solid rgba(255, 255, 255, 0.08);} } @media screen and (max-width:800px){ .entry-icons-ram .col-1-3{padding: 30px 7% 22px;} .entry-icons-ram .col-1-3 .panelInner{padding:0;} } @media screen and (max-width:550px){ #rightRam h2.title{margin-bottom: 20px;max-width: 88%;} #rightRam .col-1-3{padding: 25px 5%;} #rightRam .col-1-3 .col-1-3{width: 100%;margin: 0px 0px 20px;padding: 0px;} .panelInner p{ font-size: 13px; } } @media screen and (max-width:450px){ #rightRam{} #rightRam h2.title{font-size: 330%;} #rightRam .col-1-3{padding-top: 0px;} #rightRam .inner{padding: 30px 5% 0px;} #rightRam .entryPanel{border-radius: 0px;width: 100%;font-size: 100%;padding: 0px;} .orange{background: #f47920;} .blue{background: #00acdc;} .green{background: #45b969;} .panelInner{padding: 20px 14px;} .panelInner h2{/* font-size: 230%; */} .entryPanel .button{padding: 7px 22px 7px 7px;font-size: 10px;} a.button.large:after{top: 7px;right: 6px;} #rightRam .inner > .grid > .col-1-3{padding: 41px 5% 18px;} } /* ============================================================================= Industry fader (homepage) ========================================================================== */ #industry{} #industry li{background-size: cover;background-position: center;} #industry .inner{ padding: 140px 5% 160px;min-height: 650px; background: rgba(14, 26, 63, 0.39);} #industry li h3{text-transform: uppercase;font-weight: normal;} #industry li h2{margin: 0px 0px 0.4em;} #industry li p{max-width: 560px;font-size: 110%;color: #fff;} @media screen and (max-width:1024px){ #industry li{background-size: cover;} #industry .inner{min-height: 570px;} } @media screen and (max-width:700px){ #industry li{display: block;float: none;padding: 0px;background: transparent;background-position: center;background-size: auto 100%;border: 0px;} #industry .inner{padding: 250px 5% 40px;} .flex-control-nav{bottom: initial !important;top: 33px;} } @media screen and (max-width:450px){ #industry li{display: block;float: none;padding: 0px;background: transparent;background-size: auto 100%;background-position: bottom;} #industry .inner{padding: 180px 5% 50px;min-height: 455px;} #industry li h2{font-size: 300%;} .flex-control-nav{bottom: initial !important;top: 40px;} } /* ============================================================================= 100hr promise (multipage) ========================================================================== */ #promise{background: #091849; background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#091849), color-stop(100%,#1f3571)); background: -webkit-linear-gradient(-45deg, #091849 0%,#1f3571 100%); background: -webkit-linear-gradient(315deg, #091849 0%,#1f3571 100%); background: linear-gradient(135deg, #091849 0%,#1f3571 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#091849', endColorstr='#1f3571',GradientType=1 );} #promise .inner{padding: 67px 5% 40px;} #promise .col-{width: 33.33%;} #promise img{max-width: 90%;} #promise h2{margin-bottom: 30px;margin-top: 0.6em;} #promise h2 span{color: #ffde00;} #promise h3{margin-top: 3em;margin-bottom: 2em;} #promise a.button{} ol.numbers{} ol.numbers li{position: relative;padding-left: 43px;line-height: 1em;font-size: 110%;list-style-type: none;margin-bottom: 1.8em;} ol.numbers li:before{content:' '; display:block;position: absolute;background: #ffde00;width: 30px;height: 30px;left: 0px;top: -7px;border-radius: 50px;} ol.numbers li:after{content:' '; display:block;position: absolute;left: 0px;top: 0px;color: #091849;width: 30px;text-align: center;font-family: "DIN-Bold";font-size: 17px;} ol.numbers li:nth-child(1):after{content: '1';} ol.numbers li:nth-child(2):after{content: '2';} ol.numbers li:nth-child(3):after{content: '3';} ol.numbers li:nth-child(4):after{content: '4';} ol.numbers li:nth-child(5):after{content: '5';} ol.numbers li:nth-child(6):after{content: '6';} ol.numbers li:nth-child(7):after{content: '7';} @media screen and (max-width:1300px){ #promise h2{font-size: 460%;} } @media screen and (max-width:850px){ #promise .col-:nth-child(1){width:50%;float: right;} #promise .col-:nth-child(2){width:50%;} #promise .col-:last-child{width: 100%;} #promise img{max-width: 100%;} #promise h2{font-size: 410%;} #promise h3{margin-top: 4em;} ol.numbers li{width: 50%;float: left;} ol.numbers li:before{top: -10px;} ol.numbers li:after{top: -3px;} } @media screen and (max-width:700px){ #promise h3{margin-top: 4em;} } @media screen and (max-width:550px){ #promise .col-{width: 100% !important;float: none !important;padding-right: 0px;} #promise .col-:nth-child(2){padding-left: 8px;} #promise img{margin: 0 auto;display: block;padding-left: 5%;max-width: 300px;} #promise h2{/* font-size: 330%; */margin: 0px 0px 0.5em;} } @media screen and (max-width:380px){ #promise .inner{padding: 30px 5% 20px;} #promise .col-:nth-child(2){padding-left: 0px;} #promise img{max-width: 100%;} #promise h3{margin-top: 2em;} ol.numbers li{width: 100%;padding-left: 35px;} ol.numbers li:before{width: 25px;height: 25px;} ol.numbers li:after{width: 25px;font-size: 14px;top: -4px;} } /* ============================================================================ Testimonials (multipage) ========================================================================== */ #testimonial{background: #091849;background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMTAwJSI+CiAgICA8c3RvcCBvZmZzZXQ9IjAlIiBzdG9wLWNvbG9yPSIjMDkxODQ5IiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzFmMzU3MSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#091849), color-stop(100%,#1f3571));background: -webkit-linear-gradient(-45deg, #091849 0%,#1f3571 100%);background: -webkit-linear-gradient(315deg, #091849 0%,#1f3571 100%);background: linear-gradient(135deg, #091849 0%,#1f3571 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#091849', endColorstr='#1f3571',GradientType=1 );position: relative;} #testimonial .overlay{width: 100%;background: transparent url(../img/bga.jpg) no-repeat fixed center;background-size: cover;} #testimonial .inner{padding: 90px 5%;overflow: hidden; position:relative;background: rgba(22, 32, 66, 0.8);} #testimonial h2{text-align: center;font-size: 473%;max-width: 100%;margin: 0.6em 0px;} #testimonial .col-1-2{padding: 0px 5%;position: relative;text-align: center;} #testimonial .avatar{display: inline-block;border-radius: 50%;margin-right: 0px;overflow: hidden;} #testimonial span.arrow{height: 17px;background: transparent url(../img/arrows.gif);position: absolute;z-index: 1;left: 165px;display: block;top: 28px;box-shadow: 0px 0px 0px black;width: 10px;} #testimonial .col-1-2:last-child .avatar{text-align: center;} #testimonial .avatar img{width: 55px;} #testimonial .quote{/* background: white; */border-radius: 9px;padding: 20px 0px;position: relative;overflow: hidden;text-align: ce;} #testimonial .col-1-2:last-child span.arrow{right: 165px;left: initial;background-position: -1px -11px;} #testimonial blockquote{margin: 0px;font-size: 115%;line-height: 1.6em;} #testimonial p.author{margin-bottom: 0px;font-size: 80%;display: inline-block;color: #fff;margin: 0px;position: relative;top: -25px;} @media screen and (max-width:1100px){ #testimonial .col-1-2{width: 100%;margin-bottom: 62px;} #testimonial .col-1-2:last-child{margin-bottom:0px;} } @media screen and (max-width:850px){ #testimonial .inner{padding: 60px 5%;} #testimonial .col-1-2, #testimonial h2{text-align:left;padding: 0px;margin: 11px 0px;} #testimonial h2{font-size: 410%;} #testimonial p.author{ font-size: 100%;} } @media screen and (max-width:550px){ #testimonial .inner{padding: 30px 5% 30px;} #testimonial h2{font-size: 330%;} #testimonial .col-1-2{padding: 0px;margin-bottom: 25px;} #testimonial .avatar{width: 30px;height: 30px;display: inline-block;margin-right: 10px;} #testimonial span.arrow{display:none;} #testimonial .col-1-2:last-child .avatar{margin-left: 10px;} #testimonial .avatar img{width: 100%;} #testimonial .quote{padding: 10px 0px;} #testimonial p.author{top: -11px;} } /* ============================================================================= Footer styles ========================================================================== */ #footer{background: transparent url(../img/bga.jpg) no-repeat fixed center;background-size: cover;position: relative;} .footer1{background: rgba(12, 20, 49, 0.8);text-align: center;} .footer1 h2{text-align: center; font-size: 280%; max-width: 100%; margin: 0.6em 0px;} .footer1 h3{text-align: center; font-size: 103%; max-width: 100%; margin: 0.6em 0px;font-family: "DIN-Regular";} .footer1 h3 span{padding: 10px;color: rgba(255, 255, 255, 0.35);} .footer2{background: rgba(7, 11, 25, 0.8);} .footer2 .col-1-3{padding-right: 4%;} .footer2 h3{font-size: 130%;text-transform: uppercase;margin-bottom: 0.3em;color: #fff;} .footer2 p{font-size: 100%;margin-top: 0px;line-height: 1.3em;color: #B6B6B6;} .footer2 p.copyright{margin-top: 20px;font-size: 13px;} .footer2 p.copyright a{color: #B6B6B6;} .form{margin: 30px 0px;} [class="ninja-forms-form"] .field-wrap{margin-bottom:0px;margin-right: 1%; position:relative;} [class="ninja-forms-form"] .field-wrap.ninja-forms-error:after{content:'*';display:block;position:absolute;right: -12px;top: 0px;} .ninja-forms-required-items{font-size: 12px;margin-bottom: 13px;} .form input, .text-wrap.label-inside input, input[type="text"], input[type="number"], textarea, input[type="email"], textarea, input[type="tel"], input[type="password"]{background: #fff;border: 0px;padding: 10px;margin-bottom: 4px;max-width: 100%;width: 100%;} .text-wrap.label-inside input.ninja-forms-req{} .ninja-forms-field-error{display:none;} .honeypot-wrap { display:none; } input[type="submit"].woocommerce-Button.button {font-family: "DIN-Regular";font-weight: normal; display: inline-block;padding: 10px 16px;/* font-size: 14px; */position: relative;background: #ffde00;border: 0px;color: #091849; margin-right: 20px;} .landing-page .form input, .landing-page .text-wrap.label-inside input, .landing-page input[type="text"], .landing-page textarea, input[type="email"], .landing-page select { width:100%; } .landing-page select {margin:-1px 0 3px;display:block;} .landing-page .submit-wrap { padding:10px 0 0; } .form input:focus{background: #fff;outline: none;color: #474747;} input[type="submit"], .form input[type="submit"], .ninja-forms-form-wrap input[type="submit"]{ font-family: "DIN-Regular"; font-weight: normal; display: inline-block; padding: 10px 16px;; /* font-size: 14px; */ position: relative; background: #ffde00; border: 0px; color: #091849;} @media screen and (max-width:1024px){ #footer{ background: #151e3f; } } @media screen and (max-width:850px){ .footer1 h2{text-align: left;} .footer1 h3{text-align: left;} } /* ============================================================================= Content styles ========================================================================== */ #content{ display: block; } #content hgroup{background: url(../img/reception.jpg) no-repeat bottom left;background-size: cover !important;background-position: center !important;} #content hgroup .overlay{background: rgba(12, 20, 49, 0.74);} /*#content hgroup .inner{padding-top: 180px;max-width: 1500px;position: relative;}*/ #content hgroup .inner{padding-top: 150px;max-width: 1500px;position: relative;} #content hgroup.headerBg{background: url(../img/headerSlide.jpg);} #content hgroup.headerBg .inner{padding: 0px;min-height: 87px;} #content hgroup h2{} #content hgroup p{max-width: 650px;} #content .main, #contactlayer{background: #E5EAEC;position: relative;display: block;} #content .main img{max-height: 100%;height:auto;margin: auto !important;} #content .main .inner, #contactlayer .inner{color: #48535a;max-width: 1500px;padding: 50px 5% 100px;} .sideBox .featured-image img { margin:0 !important; } .sideBox .featured-image { padding:0 6px; } .main *{color: #48535a;} .main a{color: #00ACDC;} .main h3{font-size: 26px;} .main h4{font-size: 24px;font-weight: 400;margin-bottom: 0.4em;} .main h5{} .main p{} .main p strong{font-family: "DIN-Bold";} .main ul, .main ol{margin-left: 22px;font-size: 115%;} .main ul li, .main ol li{/* margin-bottom: 0.4em; */} .main blockquote{background: #fff;padding: 1px 20px 1px 75px;margin: 1em 0px 1.6em;border-left: 2px solid rgba(24, 37, 82, 0.39);position: relative;} .main blockquote:before{content:'"';display:block;position: absolute;top: 0px;left: 20px;font-size: 70px;color: #DDD;font-family: arial;font-style: italic;} .main blockquote p, #content .col-2-3 blockquote p:first-of-type{font-size: 115%;position: relative;} #content .col-2-3{padding-right: 2%;} #content .col-1-3.sidebar{float: right;width: 28%;border-left: 1px solid #bccbd2;padding-bottom: 110px;padding-left: 0;margin-top: 26px;} .col-1-3.sidebar .sideBox{border-bottom: 1px solid #BCCBD2;padding: 26px 20px;} .col-1-3.sidebar .sideBox:first-child { padding-top:0; } .col-1-3.sidebar h3{text-transform: uppercase; font-size: 100%;} .col-1-3.sidebar ul{font-size: 100%;} .sideBox ul{margin-left:0px;} .col-1-3.sidebar li{list-style: none;font-size: 90%;position: relative;padding-left: 16px;margin-bottom: 5px;} .col-1-3.sidebar li.current_page_item { opacity:0.5; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; } .col-1-3.sidebar li:before{content:' '; display:block;width: 4px;height: 4px;background: #999;position: absolute;border-radius: 50px;top: 6px;left: 0px;} .col-1-3.sidebar li a{color:#48535a;} .single .col-1-3.sidebar ul{border-bottom: 1px solid #bccbd2; padding: 10px 0px 10px 20px; padding-bottom: 20px; margin-bottom: 17px;margin-left: 0px;margin: 0px;} .single .col-1-3.sidebar ul ul{padding: 0px;border: 0px;} #content .col-1-3.sidebar form label{display: none;} #content .col-1-3.sidebar form input{width: 60%;display: inline-block;margin-left: -4px;} #content .col-1-3.sidebar form input[type="submit"]{width: 40%;padding: 10px 3px;max-width: 74px;} #content table {} #content table.product-range-list img { max-width:100%; max-height: 40px; width: auto; height: auto;} #content table.product-range-list .product-thumbnail { width: 120px; height: 40px; display: inline-block; padding-right: 10px; text-align: center;} #content table.product-range-list p { display:inline-block; padding:0 0; } #content table td.width20{padding-top: 26px;padding-right: 7%;border: 0px;} .width20 span.icon{background: #8eb6c6;color: #fff;text-align: center;font-family: 'DIN-Bold';width: 80px;display: block;height: 80px;border-radius: 60px;line-height: 78px;background-size: 100%;} #content a.button{color: #48535a;border-color: rgba(72, 83, 90, 0.2);} tr.shipping p {margin-top: 5px;font-size: 12px;} #blog .col-1-3{margin-bottom:20px;} #blog .col-1-3:nth-child(3n+1){clear:both;} .woocommerce div.product form.cart .variations select {display: inline-block;margin-right: 1em;border: 0px;padding: 12px;width: 100% !important;} .woocommerce div.product form.cart div.quantity:before {content: 'Qty';width: 15%;position: relative;display: inline-block;text-align: left;} .woocommerce div.product form.cart .variations {margin-bottom: 1px;} .woocommerce .quantity .qty {width: 84% !important;text-align: left !important;padding: 13px;} .woocommerce div.product form.cart div.quantity {float: none !important;display: block;width: 100%;} .woocommerce div.product form.cart .variations {margin-bottom: 0 !important;} .woocommerce div.product form.cart .variations tr { border-bottom:1em solid #E5EAEC;} .woocommerce div.product form.cart .variations label {font-weight: 100 !important; text-transform:capitalize;} .woocommerce div.product form.cart .variations td { padding: 0px !important; width: 80% !important;} .woocommerce div.product form.cart .variations td.label { padding: 5px 0 0 0 !important; width: 15% !important;} .woocommerce-variation-price { margin-bottom: 1em; text-align: right; } .woocommerce div.product form.cart {max-width: 480px;} .woocommerce table.shop_table {border-radius: 0px !important;border: 0px !important;text-align: right !important;} .woocommerce a.remove {height: auto;} .woocommerce form .form-row label, .woocommerce-page form .form-row label {font-size: 13px;} .woocommerce form .form-row .required { text-decoration: none;} .woocommerce form.checkout_coupon, .woocommerce form.login, .woocommerce form.register {border: 1px solid #d3ced2;padding: 20px;margin: 2em 0;text-align: left;border-radius: 5px;max-width: 450px;} tr.woocommerce-cart-form__cart-item.cart_item {background: white;} .product-subtotal span.woocommerce-Price-amount.amount, .product-price span.woocommerce-Price-amount.amount, .product-subtotal .woocommerce-Price-currencySymbol, .product-price .woocommerce-Price-currencySymbol {color: #48535a; font-size: 18px;} td.product-remove { max-width: 41px;} a.reset_variations { display: none !important;} td.actions { padding: 0px !important; padding-top: 10px !important;} input#coupon_code { width: 220px !important; padding: 12px !important; border: 0px;} .woocommerce table.shop_table td {border: 0px !important;padding-right: 0px !important;} form.woocommerce-cart-form .quantity .qty { width: 100px !important;text-align: left !important;} .woocommerce .col2-set .col-1, .woocommerce-page .col2-set .col-1 { border-right: 1px solid #cecece;padding-right: 4%;} .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt {background: #ffde00 !important;color: #48535a !important;font-weight: 100;} .payment_box p { margin-top: 0px;} .woocommerce a.remove {height: auto !important;} a.checkout-button.button.alt.wc-forward {background: #ffde00 !important;font-size: 16px;font-weight: 100;max-width: 220px;float: right;} .woocommerce .cart_totals table.shop_table { background: none;} .woocommerce .cart_totals table.shop_table td, .woocommerce .cart_totals table.shop_table th {text-align: right;} .cart_totals h2 {text-align: right;font-size: 21px;font-family: 'Din-Bold';} table.shop_table.shop_table_responsive.cart.woocommerce-cart-form__contents thead th {background: #CBD3D6; font-weight: 100;font-size: 12px;} .actions input[type="submit"] {background: #cbd3d6 !important;} .woocommerce .cart .button, .woocommerce .cart input.button {float: none;font-size: 15px;font-weight: 100;color: #48535a !important; border-radius: 0px !important; height: 41px;} .woocommerce .cart-collaterals, .woocommerce-page .cart-collaterals {max-width: 400px; float: right;} .cart_totals .woocommerce-Price-currencySymbol, span.woocommerce-Price-amount.amount, .cart_totals .span.product-price.no-alt { font-size: 21px; line-height: 26px; } .woocommerce-MyAccount-navigation li {margin-bottom: 12px;} .woocommerce-account .woocommerce-MyAccount-navigation ul {margin: 0px;} .woocommerce-MyAccount-content .woocommerce-Price-currencySymbol, .woocommerce-MyAccount-content span.woocommerce-Price-amount.amount, .woocommerce-MyAccount-content .span.product-price.no-alt {font-size: 17px;color: #48535a;} .woocommerce-MyAccount-content mark { background: none !important;font-style: normal;} .woocommerce-MyAccount-content .woocommerce table.shop_table th {padding: 12px 12px 9px;} .woocommerce-MyAccount-content h2 {font-size: 40px;} .woocommerce .woocommerce-customer-details address { border: 0px !important;padding-left: 3px !important;} .woocommerce-MyAccount-content .woocommerce .col2-set, .woocommerce-MyAccount-content .woocommerce-page .col2-set {width: 100%; margin-top: 40px;} .woocommerce-account .addresses .title h3 { float: left; margin-top: 0px;} \ .woocommerce-MyAccount-content fieldset { margin-top: 42px !important;} .woocommerce-MyAccount-content fieldset legend {font-weight: 700;} .woocommerce-MyAccount-content input.woocommerce-Button.button { color: #48535a; background: #ffde00; font-weight: 100; padding: 12px 18px 10px;} .woocommerce-MyAccount-content fieldset { margin-top: 40px;} .woocommerce table.my_account_orders .button { white-space: nowrap;color: #48535a;background: #ffde00; font-weight: 100;padding: 12px 18px 10px;} .select2-container--default .select2-selection--single .select2-selection__rendered {text-align: left;} .select2-results__option {color: black;} .select2-search--dropdown { border-top: 1px solid #aaaaaa;} .error404 #content { padding: 180px 40px; background: rgba(0, 0, 0, 0) url(../img/bga.jpg) no-repeat fixed center; background-size: cover; } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .error404 #content{background: rgba(0, 0, 0, 0) url(../img/bga.jpg) no-repeat scroll center;} } .error404 #content h2 { margin: 0; font-size: 800%; line-height: 1em;} .error404 #content .inner { max-width:600px; margin:0px auto; text-align: center;} @media screen and (min-width:700px)and (max-width:1000px){ #blog .col-1-3{width:50%;} #blog .col-1-3:nth-child(3n+1){clear:none;} #blog .col-1-3:nth-child(2n+1){clear:both;} .entry-icons .col-1-3{width:50%;margin-bottom: 15px;} .entry-icons .col-1-3:nth-child(2n+1){clear:both;} } @media screen and (max-width:768px) { .woocommerce table.shop_table td {border-bottom:1px solid #e5eaec !important;padding:10px} td.product-remove {width:100% !important;max-width:100% !important;} form.woocommerce-cart-form .quantity .qty { width: 100px !important;text-align: right !important;} input#coupon_code { width: 48% !important;padding:14px !important} .woocommerce .col2-set .col-1, .woocommerce-page .col2-set .col-1 {border-right:0px;} } @media screen and (max-width:856px) { .woocommerce .quantity .qty {width:83% !important;} } @media screen and (max-width:700px){ #content hgroup .inner{padding: 170px 5% 20px;} #content hgroup.headerBg{background: url(../img/headerSlide_small.jpg);} #content hgroup.headerBg .inner{min-height: 84px;} #content .main .inner{padding: 20px 5%;} #content .col-1-3.sidebar{width:100%;border-left: 0px;padding-bottom: 0px;padding: 10px;} #content .col-1-3.sidebar:before { display:block; width:100%; border-top: 1px solid #BCCBD2; margin-bottom: 30px; content:""; } .col-1-3.sidebar .sideBox{padding-left:0px;padding-right: 0;} .col-1-3.sidebar .sideBox:last-of-type{border-bottom:0px;} .single .col-1-3.sidebar ul{padding: 7px 10px 14px;} .single .col-1-3.sidebar ul:last-of-type{border-bottom:0px;} .woocommerce .quantity .qty {width:84% !important;} } @media screen and (max-width:450px){ #content hgroup .inner{padding: 140px 5% 20px;} .col-1-3.sidebar h3{font-size: 120%;} .col-1-3.sidebar li{font-size: 120%;} .main h3{font-size: initial;} .main h4{font-size: initial;} .main h5{} .main p{} .error404 #content{padding: 70px 20px 1px;} #content .sideLink a.button { width:100%; } } @media screen and (max-width:330px) { .woocommerce div.product form.cart div.quantity:before {width:14%;} } /* ============================================================================= Breadcrumb styles ========================================================================== */ .breadcrumbs{border-bottom: 1px solid rgba(188, 203, 210, 0.5);overflow: hidden;} #content .main .breadcrumbs .inner{padding: 0px 5%;max-width: 1500px;} .breadcrumbs ul{margin: 0px;} .breadcrumbs ul li{} .breadcrumbs ul li{float: left; line-height: 51px; padding: 0px 24px 0px; font-size: 10px;position: relative;list-style: none;text-transform: uppercase;} .breadcrumbs ul li:first-child{padding-left:0px;} .breadcrumbs ul li:after{display:block; content:' ';border-right: 1px solid rgba(188, 203, 210, 0.5);height: 56px;position: absolute;top: 0px;right: 0px;-webkit-transform: rotate(-16deg); transform: rotate(-16deg);} .breadcrumbs ul li a{color: #00acdc;display: block;} @media screen and (max-width:700px){ .breadcrumbs{border: 0px;padding-top: 30px;} .breadcrumbs ul li{border: 1px solid rgba(188, 203, 210, 0.5);margin-right: 3px;padding: 9px 13px;line-height: 7px;border-radius: 30px;} .breadcrumbs ul li:first-child{padding-left: 13px;} .breadcrumbs ul li:after{display: none;} .breadcrumbs ul li a{} } /* ============================================================================= Range styles ========================================================================== */ .range{margin-bottom: 60px;} .range h3{font-size: 150%;} .range .col-{width: 20%;margin-bottom: 10px;} .range .col-:last-of-type{padding-right:10px;} .productTile, .entry-icon, .search-tile{background: #fff;padding: 20px;text-align: center;position: relative;overflow: hidden;-webkit-transition: all 0.2s ease; transition: all 0.2s ease;} .productTile h3 a {color: #48535a;} .productTile:hover, .entry-icon:hover {-webkit-transform: translate(0px, -7px);transform: translate(0px, -7px);box-shadow: 0px 12px 11px -9px rgba(0, 0, 0, 0.2);} #content .main .productTile img{max-height: 32px;margin: 25px 0px 13px;} .productTile h3{margin-bottom: 0.4em;font-size: 120%;} .productTile p{margin-top: 0px;} .productTile a.overlay, .entry-icon a.overlay{background: rgba(229, 234, 236, 0.0);width: 100%;height: 100%;position: absolute;top: 0px;left: 0px;-webkit-transition: all 0.2s ease;transition: all 0.2s ease;} .productTile a.overlay:hover, .entry-icon a.overlay:hover {background: rgba(229, 234, 236, 0.0);} .productTile h3 a { color: #48535a;} .productSku {display: none;} .entry-icons .productTile { padding:0; } #content .main .productTile .post-thumbnail-wrapper img { width:100%; height:auto; max-height: none; margin: 0;} @media screen and (min-width:1300px){ .range .col- .productTile{min-height: 160px;} } @media screen and (max-width:1024px){ .range .col-{width: 33.33%;} } @media screen and (max-width:700px){ .productTile{height: 170px;} .range .col-, .range .col-:last-of-type{padding-right: 1px;margin-bottom:1px} #content .main .productTile img{margin: 10px 0px;} } @media screen and (max-width:450px){ .range{ margin-bottom: 3em;} .productTile{height: 150px;} .range .col-, .range .col-:last-of-type{padding-right: 1px;margin-bottom:1px;width: 50%;} } @media screen and (max-width:380px){ .range{margin-bottom: 2em;} .productTile{height: 130px;font-size: 90%;padding: 12px;} } /* ============================================================================= Product & Cart ========================================================================== */ .cart:before{display:block;content:' ';/* border-top: 67px solid white; */position: absolute;top: 0px;border-left: 13px solid transparent;left: -13px;} .cart a{display:block;color: #868891;font-size: 16px;/* padding: 15px 28px 20px 21px; */-webkit-transition: all 0.2s ease;transition: all 0.2s ease;color: #48535a;font-size: 19px;font-weight: 600;text-transform: uppercase;} .cart span.icon{font-family: "motus";color: #868891;font-size: 21px;position: relative;top: 3px;padding: 0px 2px;} .cart span.cartNumber{background: #00acdc;color: white;font-size: 10px;width: 20px;height: 20px;display: inline-block;top: -4px;right: -5px;border-radius: 30px;text-align: center;line-height: 20px;position: relative;} .cart-button {float: right;margin-top: 16px;} .cart-button:after {display: block;content: ' '; border-right: 1px solid rgba(188, 203, 210, 0.5); height: 56px; position: absolute;top: 0px;-webkit-transform: rotate(-16deg);transform: rotate(-16deg); margin-left: 49px;} .cart-button:before {display: block; content: ' ';border-right: 1px solid rgba(188, 203, 210, 0.5); height: 56px;position: absolute;top: 0px;-webkit-transform: rotate(-16deg); transform: rotate(-16deg);margin-left: -25px;} .account-button {float: right;margin-top: 16px;margin-right: 53px;} .account-button:after {display: block;content: ' '; border-right: 1px solid rgba(188, 203, 210, 0.5); height: 56px; position: absolute;top: 0px;-webkit-transform: rotate(-16deg);transform: rotate(-16deg); margin-left: 49px;} .account-button:before {display: block; content: ' ';border-right: 1px solid rgba(188, 203, 210, 0.5); height: 56px;position: absolute;top: 0px;-webkit-transform: rotate(-16deg); transform: rotate(-16deg);margin-left: -25px;} .woocommerce a.remove:hover { color: red !important;background: none !important;} .entry-icon, .search-tile { background:#FFF; padding:0; } .entry-icon .inner-pad, .search-tile .inner-pad { padding: 0.5em 1.5em; text-align: left;} .entry-icon .inner-pad h3, .search-tile h3{font-size: 24px;margin-bottom: 0px;margin-top: 12px;} .entry-icon .inner-pad h3 a, .search-tile h3 a{color: #48535a;} .entry-icon .inner-pad h4.meta, .search-tile h4{font-weight: normal;font-size: 13px;color: #B5B5B5;margin-top: 5px;} .entry-icon .inner-pad p, .search-tile p{font-size: 15px;} @media screen and (max-width:700px) { .cart-button:before, .cart-button:after {display: none;} .cart-button {border: 1px solid rgba(164, 169, 172, 0.5);height:30px;width:30px;padding:5px;border-radius:100px;margin-top: 0px;} .account-button:before, .account-button:after {display: none;} .account-button {border: 1px solid rgba(164, 169, 172, 0.5);height:30px;width:30px;padding:5px;border-radius:100px;margin-top: 0px;} .cart a {font-size:12px;} } #content .main .entry-icon img { width:100%; height:auto; margin:0; } .product{} #content .main.product .inner{padding-top: 100px;} .product .col-1-2:first-child{padding-right: 4%;} #productPhotos{ position: relative;} #productPhotos:before{content:' ';display:block;width: 70px;height: 70px;background: url(../img/warranty.svg) no-repeat scroll;background-size: 100%;position: absolute;top: -35px;left: -35px;z-index: 1;border-radius: 70px;box-shadow: 0px 5px 10px -6px rgba(0, 0, 0, 0.89);} .photoWrap{background: #fff;padding: 8%;height: 330px;-webkit-transform-style: preserve-3d;transform-style: preserve-3d;margin-bottom: 4px;text-align: center;} .photoWrap img{position: relative;top: 50%;-webkit-transform: translateY(-50%);transform: translateY(-50%);} #productPhotos ul{margin: 0px;} #productPhotos ul li{width: 33.33%;float: left;list-style-type: none;padding-right: 5px;} #productPhotos ul li:last-child{padding-right:0px;} #productPhotos ul li a{padding: 20px;background: #fff;display: block;} #productPhotos ul li a:hover{opacity:0.75;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";} .productInfo{} .productInfo ul{list-style-type:none;margin:0px; padding:0px;} .productInfo li{} .productInfo li label{display: inline-block;width: 25%;} .productInfo li select, .productInfo li input{width: 70%;padding: 8px;margin-bottom: 10px;border: 0px;} .productInfo li select{} .productInfo li input{} .productInfo li#product-title{} .productInfo li#product-title h2{font-size: 400%;} .productInfo li#product-prices{} .productInfo li#product-prices p{font-size: 140%;color: #9FA3AC;} .productInfo li#product-prices p span{color: #9FA3AC;} .productInfo li#product-description{} .productInfo li#product-description p{font-size: 100%;} .productInfo li#product-variants{padding: 14px 0px 28px;} .productInfo li#product-variants .selector-wrapper{} .productInfo li#product-add{} .productInfo li#product-add input[type="submit"]{font-size: 18px; padding: 14px 37px 14px 20px; margin: .2em 0px; border-width: 3px; text-transform: uppercase; font-family: "DIN-Bold"; background: #ffde00; border: 0px; color: #091849;max-width: 150px;} #product-title h2.title { font-family: "DIN-Light";font-style: normal; color: #48535a;margin-top: 0px;} .entry-icons .col-1-3{margin-bottom:20px;} .entry-icons .col-1-3:nth-child(3n+1){clear:both;} .productSku {display: none;} .woocommerce-Price-currencySymbol, span.woocommerce-Price-amount.amount, .span.product-price.no-alt { color: #9FA3AC;font-size: 25px;} .woocommerce div.product form.cart .button {font-size: 15px;padding: 14px 24px;margin: .2em 0px;border-width: 3px;text-transform: uppercase;font-family: "DIN-Bold";background: #FFDE00 !important;border: 0px;color: #091849;max-width: 150px;margin-top: 25px;} span.product-price.no-alt { color: #9fa3ac;font-size: 24px;} p#price {margin-top: -34px;} div#full_description {margin-top: 25px;} form.woocommerce-shipping-calculator > p {margin-top: 4px;} a.shipping-calculator-button {font-size: 14px;} .cart_totals td {min-width: 147px;} .woocommerce .cart-collaterals .cart_totals, .woocommerce-page .cart-collaterals .cart_totals {width: 100% !important;} @media screen and (max-width:450px) { p#price {margin-top: -15px;} } /* Product Gallery */ #product-photo-thumbs a { border:4px solid #FFF; } #product-photo-thumbs a.selected { border: 4px solid rgba(255, 236, 108, 0.61); } #full_description a[href*=".pdf"]{ font-family: "DIN-Regular"; font-weight: normal; display: inline-block; padding: 6px 27px 4px 13px; font-size: 14px; margin: 5px 8px 5px 0; position: relative; border-radius: 2px; border: 1px solid rgba(255, 255, 255, 0.2); color: #48535A; border-color: rgba(72, 83, 90, 0.2);} #full_description a[href*=".pdf"]:after { content:'d'; display: block; font-family: 'motus'; position: absolute; right: 8px; top: 6px; } #full_description p > a {font-family: "DIN-Regular";font-weight: normal;display: inline-block;padding: 10px 16px; position: relative; background: #D6DBDC; border: 0px; color: #091849; margin-bottom: 10px;} @media screen and (max-width:700px){ .product .col-1-2{width: 100%;} .product .col-1-2:first-child{padding-right: 0px;margin-bottom: 3em;} .photoWrap{height: 240px;} .productPhotos:before{} #content .main.product .inner{padding-top: 33px;} .cart{position: relative;text-align: right;} .entry-icons .col-1-3{width:50%;} .entry-icons .col-1-3:nth-child(2n+1){clear:both;} .entry-icon .inner-pad h3{font-size: 18px;} .entry-icon .inner-pad h4.meta{font-size: 12px;margin-bottom: 0px;} .entry-icon .inner-pad p{font-size: 13px;} } @media screen and (max-width:450px){ .entry-icons .col-1-3{width:100%; padding-left:0px;margin-bottom: 8px;} } /* Select2 */ .select2-container--default .select2-selection--single .select2-selection__rendered {padding: 8px;} .select2-container--default .select2-selection--single {border: 0px !important;border-radius: 0px !important;height: 40px !important;} .select2-container--default .select2-selection--single .select2-selection__arrow { top: 7px;} /* ============================================================================= calculators and conversions & technical tables ========================================================================== */ body[class*="page-calculators"], body[class*="page-conversions"]{} body.page-template-page-conversion-php #content .col-2-3, body.page-template-page-calculators-php #content .col-2-3{padding: 0px 8px;} #conversions .grid{border-bottom: 1px solid #bccbd2;padding: 10px 0px 40px;} #conversions .grid:last-of-type{border:0px;} #conversions .col-1-3 input{display: inline;width: 50%;} #conversions .col-1-3 label{display: inline;background: rgba(188, 203, 210, 0.38); border: 0px; padding: 10px; margin-bottom: 4px; max-width: 100%;} body[class*="page-calculators"] input{display: inline;} body[class*="page-calculators"] label{display: inline;background: rgba(188, 203, 210, 0.38); border: 0px; padding: 10px; margin-bottom: 4px; max-width: 100%;font-weight: normal;margin-right: -4px;} body[class*="page-calculators"] #shaftbuckling input{margin-right: 10px;} body[class*="page-calculators"] hr{max-width:20%} #shaftbuckling, #oilvolume, #pushpull, #strokegivenopen{border-bottom: 1px solid #bccbd2;padding: 10px 0px 40px;} p.results span{font-family: "DIN-Bold"; font-weight: normal; text-transform: uppercase;} /* tables styling */ #content table.techtable{width: 100%;text-align: left;margin: 30px 0px;} #content table.techtable th{font-family: "DIN-Bold"; font-weight: normal; text-transform: uppercase;background: rgba(24, 62, 82, 0.35);color: white;border-right: 1px dotted white;} #content table.techtable tr:nth-child(odd){} #content table.techtable tr:nth-child(even){background: rgba(0, 0, 0, 0.02);} #content .pinned tr:nth-child(even){background: rgba(0, 0, 0, 0.02);} table.table3 td{width: 33.33%;} table.table4 td{width: 25%;} table.table5 td{width: 20%;} /* responsive tables styling */ table th{font-weight:bold;}table td,table th{padding:9px 10px;text-align:left;} @media only screen and (max-width: 767px) { table.responsive{margin-bottom:0;} .pinned{position:absolute;left:0;top:0;background: #E5EAEC;width:35%;overflow:hidden;overflow-x:scroll;border-right:1px solid #ccc;border-left:1px solid #ccc;box-shadow: 0px 0px 24px rgba(0, 0, 0, 0.23);} .pinned table{border-right:none;border-left:none;width:100%;} .pinned table th,.pinned table td{white-space:nowrap;} .pinned table th{font-family: "DIN-Bold";font-weight: normal;text-transform: uppercase;background: rgba(24, 62, 82, 0.35);color: white;border-right: 1px dotted white;} .pinned td:last-child{border-bottom:0;} #content table.techtable{margin:0px;} div.table-wrapper{position:relative;margin-bottom:20px;overflow:hidden;border-right:1px solid #ccc;} div.table-wrapper div.scrollable table{margin-left:35%;} #content table.responsive{margin:0px;margin-left: 35%;} div.table-wrapper div.scrollable{overflow:scroll;overflow-y:hidden;position: relative;} div.table-wrapper:before{content:' ';display:block;position: absolute;height: 100%;width: 25px;z-index: 9;background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMC42NSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(0,0,0,0)), color-stop(100%,rgba(0,0,0,0.65))); background: -webkit-linear-gradient(left, rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); background: linear-gradient(to right, rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000',GradientType=1 );filter: alpha(opacity=20); opacity: 0.2; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=20)";pointer-events: none;right: 0px;} table.responsive td,table.responsive th{position:relative;white-space:nowrap;overflow:hidden;} table.responsive th:first-child,table.responsive td:first-child,table.responsive td:first-child,table.responsive.pinned td{display:none;} } @media screen and (max-width:1400px){ #conversions .col-1-3{width:50%;} } @media screen and (max-width:450px){ #conversions .col-1-3{width:100%;padding:0px 3%;margin-bottom: 3px;} #conversions .col-1-3 input{width:60%;} body[class*="page-calculators"] label{display:block;} body[class*="page-calculators"] input{display: inline-block;} body[class*="page-calculators"] #shaftbuckling input{width: 80%;margin-right: 9px;margin-top: -4px;margin-bottom: 18px;min-height: 40px;} body[class*="page-calculators"] #oilvolume input{width: 100%; margin-top: -4px; margin-bottom: 18px; min-height: 40px;} body[class*="page-calculators"] #pushpull input{width: 100%; margin-top: -4px; margin-bottom: 18px; min-height: 40px;} body[class*="page-calculators"] #strokegivenopen input{margin-top: -4px;margin-bottom: 18px;} body[class*="page-calculators"] #strokegivenopen label{display: inline;} body[class*="page-calculators"] #openmid input{margin-top: -4px; margin-bottom: 18px;} body[class*="page-calculators"] #openmid label{display: inline;} } /* ============================================================================= Search Page ========================================================================== */ .search-tile { background:#FFF;padding: 0.5em 1.5em; text-align: left; } .grid.search-tiles .col-1-3 { margin-bottom:1em;} .grid.search-tiles .col-1-3:nth-child(3n+1) { clear:both; } /* ============================================================================= Shopify Styles Specific ========================================================================== */ .cart-link a { float:right; padding: 22px 46px 30px 30px; border-left: 1px solid rgba(255, 255, 255, 0.12); height: 83px;} .cart-link a:hover { background:rgba(0,0,0,0.2); } .cart-link a:before { color:#FFF; content:"g"; font-family:"motus"; font-size:1.5em; display:inline-block; } .cart-link a span[data-amount]{ background: #00ACDC; color: #FFF; font-size: 10px; width: 20px; height: 20px; display: inline-block; top: -15px; left: 4px; border-radius: 30px; text-align: center; line-height: 20px; position: relative; } .cart-link a span[data-amount="0"]{ display:none; } /* Cart */ table.product-table { text-align:left; } table.product-table thead { font-size:0.9em; opacity: 0.4; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)"; text-transform:uppercase; border-bottom: 10px solid #E5EAEC; } table.product-table thead th { padding:0 1em; } tr.product-row { width:100%; background:#FFF; border-bottom: 6px solid #E5EAEC;} tr.product-row td { padding:1em; border-right: 2px solid #FAFAFA; } tr.product-row td:last-child { border:none; } tr.product-row td.image { width:200px; text-align:center; } tr.product-row td.image img { padding: 30px 20px; max-width:100%; height:auto; } tr.product-row td.desc { } tr.product-row td.price { } tr.product-row td.qty { } tr.product-row td.qty input { width: 60px; } tr.product-row td.total { } header.scroll .cart-link a { padding: 10px 40px 6px 21px; height:100%; } [data-handle="easy-ram"] .productTile { background:orange; } [data-handle="rampart"] .productTile { background:green; } /* ============================================================================= WP Comment Section ========================================================================== */ #respond{border-top: 1px solid #bccbd2;margin: 40px 0px; padding-top: 10px;} .wp-caption { border: 1px solid #ddd; text-align: center; background-color: #f3f3f3; padding-top: 4px; margin: 10px; /* optional rounded corners for browsers that support it */ border-radius: 3px; } .wp-caption img { margin: 0; padding: 0; border: 0 none; } .wp-caption p.wp-caption-text { font-size: 11px; line-height: 17px; padding: 0 4px 5px; margin: 0; } img.alignright { padding: 4px; margin: 0 0 2px 7px; display: inline; } img.alignleft { padding: 4px; margin: 0 7px 2px 0; display: inline; } ol.commentlist{margin:0px;list-style-type:none;} .commentlist .reply {; /* right: 0px; */} .comment-edit-link, .commentlist .reply a { background: rgba(0, 0, 0, 0.15); text-decoration: none; padding: 2px 7px; font-size: 12px; border-radius: 100px; color: #FFF !important; width: 50px; text-align: center; display: inline-block;} .comment-edit-link:hover, .commentlist .reply a:hover { background:rgba(0,0,0,.5); color:#FFF; } .commentlist .reply a { } .commentlist li { background:#FAFAFA; padding:1em; border-bottom:2px solid #FFF ; position: relative;} .comment-author, .comment-meta { font-size: 12px; } .comment-author { float:left; } .comment-author cite { font-size:16px; position:relative; } .comment-author img { border-radius:100px; background:#AAA; margin-right: 5px;} .comment-meta { float:right; margin-top: 5px; margin-right: 0px;} .comment-body > p { padding: 1em 0; width:100%; display:block; clear:both; margin: 0; font-size: 100%;} .commentmetadata a { text-decoration:none; color: #B0B0B0;} .commentmetadata a.comment-edit-link{left: 40px;} /* ============================================================================= WP Comment Section ========================================================================== */ .product-spec table { width:100%;} .product-spec table p { font-size:inherit; line-height:inherit; } .product-spec table tr:first-child { border-top: 1px solid rgba(0, 0, 0, 0.06); } .product-spec table td h5 { font-size: 1em; text-transform:uppercase; font-family: "DIN-Bold"; font-weight: normal; margin: 0;} .product-spec table a { display:inline-block; font-size:12px; border: 1px solid; padding: 4px 5px 2px; line-height: 1em; margin: 2px; border-radius: 3px;} .product-spec table a.normal { display:inline; font-size:1em; border:none; padding:0; margin:0; border-radius:0; } .product-spec table a:hover { opacity:0.5; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; } .product-spec table {width: 100%;text-align: left;margin: 30px 0px;} .product-spec table th{font-family: "DIN-Bold"; font-weight: normal; text-transform: uppercase;background: rgba(24, 62, 82, 0.35);color: white;border-right: 1px dotted white;} .product-spec table tr:nth-child(odd){} .product-spec table tr:nth-child(even){background: rgba(0, 0, 0, 0.02);} .product-spec table th, .product-spec table td { min-width:120px; } .product-spec table th:last-child , .product-spec table td:last-child { border-right:none; } @media screen and (max-width:800px){ .product-spec table tr { display:block; width:100%; border-top: 1px solid rgba(0, 0, 0, 0.06); } .product-spec table tr:nth-child(2){ border-top:2px solid rgba(0, 0, 0, 0.06); } .product-spec table td { font-size:1em; display:block; width:100%; border:none; border-bottom: 1px dashed rgba(0, 0, 0, 0.06);} .product-spec table td:first-child { font-size:1em; text-transform:uppercase; font-family: "DIN-Bold"; font-weight: normal; margin: 0; } .product-spec table td:last-child { border:none; } .product-spec table tr:first-child { display:none; } } /* ============================================================================= mobile background fixes ========================================================================== */ .device-ios .wrap.slide, .device-android .wrap.slide{background: #0c1431;} .device-ios #mnav, .device-android #mnav{} .device-ios #promo, .device-android #promo{background: #091849;} .device-ios #promo .inner, .device-android #promo .inner{background-attachment: scroll;} .device-ios #rightRam .overlay, .device-android #rightRam .overlay{background-attachment: scroll;} .device-ios #testimonial, .device-android #testimonial{background: #091849;} .device-ios #industry, .device-android #industry{} .device-ios #testimonial .overlay, .device-android #testimonial .overlay{background-attachment: scroll;} .device-ios #promise, .device-android #promise{background: #152C6B;} /* ============================================================================= Modal Styles ========================================================================== */ .modal-is-open { overflow:hidden !important; } #modal { position:fixed; width:100%; height:100%; top:0px; left:0px; overflow: hidden; z-index: 9999999999999999999; } #modal .pageContent #modal { position:relative; height:auto; z-index:1; left:auto; top:auto; overflow:auto; } #modal .close { position: fixed; font-family:"motus"; text-align:center; line-height: 57px; font-size: 23px; border-radius: 0 0 0 10px; color: #FFF; z-index:3; text-decoration: none; top: 0px; background: #FFDE00; color: #091849; width: 60px; height: 60px; line-height: 60px; text-align: center; font-size: 200%; border-radius: 50px; right: 30px; top: 34px; cursor: pointer;} #modal .close:hover, #modal .close:focus { text-decoration:none; outline:none; } #modal .close-overlay { position:fixed; background:none; width: 98%; height:100%; left:0px; top:0px; z-index:-1; } #modal.keyboard-open { height:300%; } #modal .modal-bkgd { background: url(../img/overlay-black.png); background: rgba(9, 24, 73, 0.95); width:100%; height:100%; position: absolute; top: 0; left: 0; z-index: 1;} #modal .modal-content { margin: 0; width: 100%; height: 100%; position: relative; z-index: 2; overflow: auto;} #modal .modal-block { width: 50%; max-width: 700px; margin: 5% auto; position: relative;} #modal .modal-item { width: 100%; height: inherit; margin: 0px auto; padding: 0; border-radius: 0; display: none;} #modal .modal-item .ninja-forms-success-msg { display:none; } #modal .modal-item.video { padding:0; background:none; box-shadow:none; } #modal .modal-item iframe { width:100%; max-width:100%; border-radius:4px; box-shadow:0px 1px 2px rgba(0,0,0,0.6); height: 339px;} @media screen and (min-width: 767px) { #modal .modal-block{ margin-top: 5%;} } @media screen and (max-width: 400px) { #modal .modal-item{ padding: 0 15px; border-radius: 0; box-shadow:none;} .modal-block{} .modal-bkgd{} #modal .close { top: 5px; right: auto;} } @media screen and (max-width: 1024px){ #modal .close-overlay { display:none; } #modal .close { font-size:20px; height:40px; line-height:40px; width:40px; top:15px; right:15px; } #modal .modal-block { width:80%; margin: 75px auto 0;} } @media screen and (max-width: 768px){ #modal .modal-block { width: 100%; margin: 75px auto 0 auto;} #modal .modal-item{ padding: 0 15px; } } /* Wordpress Gallery Styling */ #modal .modal-item img { max-width:100%; max-height: 100%;} #modal .modal-item .image-wrapper { position:relative; text-align:center; } #modal .modal-item .image-wrapper p { color: #FFF; margin: 0; padding: 0.8em 0.5em;} #modal .modal-item .image-wrapper .button { position:absolute; top: 49%; right: 100%; margin: 0 10px; background: #FFF; color: #222;} #modal .modal-item .image-wrapper .button:hover { opacity: 0.8; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; } #modal .modal-item .image-wrapper .button.next { left: 100%; right: auto; } #modal .modal-item .image-wrapper .button.prev { padding: 6px 13px 4px 27px; } #modal .modal-item .image-wrapper .button.prev:before { content: 'd'; display: block; font-family: "motus"; position: absolute; left: 7px; top: 5px; /* IE 9 */ -webkit-transform: rotate(180deg); /* Chrome, Safari, Opera */ transform: rotate(180deg);} #modal .modal-item .image-wrapper .button.prev:after { display:none; } @media screen and (max-width:1024px){ #modal .modal-item .image-wrapper .button { float:left; margin: 0 0 1em 0; position:relative; left:auto !important; right:auto !important; font-size: 12px;} #modal .modal-item .image-wrapper .button.next { float:right; } } .gallery { margin: 0px auto !important; width:auto; float: left;} .gallery:after { content:""; display:table; clear:both; } .gallery .gallery-item { max-width: 140px !important; width: auto !important; margin: 0 !important; padding: 6px; float: none !important; display: inline-block;} .gallery .gallery-item img { border:none !important; margin: 0 !important; width: 100%; height: auto; border: 4px solid #FFF !important;} .gallery .gallery-item a { outline:none !important; } .gallery .gallery-item a:hover img { } .gallery .gallery-caption { font-size:12px; display:none; } .gallery br { display:none; } @media screen and (max-width:500px){ .gallery .gallery-item { width:33.33% !important; } } /* ============================================================================= Landing Page Template ========================================================================== */ .landing-page { min-height: 100vh; overflow: hidden; } .landing-page h3, .landing-page h4 {font-family: 'DIN-Light';font-weight: 100;text-transform: uppercase;letter-spacing:0.1em;font-size: 2em;} .landing-page p { line-height: 1.8em;} h3 strong, h4 strong { font-weight:inherit; } .landing-page ul {font-size: 1.1em;padding-left: 20px;} .landing-page li { margin:20px 0; } .landing-page .header {position:absolute;top: 0 !important;width:100%;padding: 30px 20px 10px 25px;z-index: 9;} .landing-page .header [data-toggle]{ color:#FFF; display:block; float:right; text-align: right; display:none; } .landing-page .header [data-toggle]:after { content:""; font-family:"SSStandard"; font-size:1.2em; position:relative; top:0.2em; } .landing-page .header [data-toggle]:before { content: "Share"; font-size: 14px; padding-right: 0.7em; font-family: 'DIN-Light'; font-weight: normal;} .logged-in .landing-page .header {top:32px;} .landing-page .header a.logo { width: 172px; height: 60px; float: left; background-image: url(../img/motus-logo.png); background-size: 100%; font-size: 0px; color: transparent; text-indent: -9999px; background-repeat: no-repeat;} .landing-page .header .share-actions { float:right; height:60px; } .landing-page .banner { color:#FFF; height: 80vh; position: relative; background: #009A4C no-repeat center; background-attachment: fixed; background-position: 50% 0px; background-size: 100% auto;} .landing-page .banner[style*="background-image"]:before { content:""; position:absolute; top:0; left: 0; width:150%; height: 100%; right: 0; background-color: rgba(0, 43, 54, 0.35);} .landing-page .banner .inner{height:inherit;} .landing-page .intro h2 { font-family: 'DIN-Light'; font-size: 5em; line-height:1em; margin: 0px; text-transform: uppercase; font-weight: normal; color: #FFFFFF; text-shadow: 0px 6px 10px rgba(0, 0, 0, 0.19);} .landing-page .intro p { font-size: 28px; font-family: 'DIN-Regular', sans-serif; color: white;} .landing-page .actions a.button {background: #ffde00;} .landing-page .share-actions-wrapper { float:left; } .landing-page .share-actions-wrapper:before { content:"Share this:"; color:#FFF; font-family: 'DIN-Light'; font-weight: normal; display: block; float: left; padding: 0.3em 0.5em;} .landing-page .content .inner {max-width: 1400px;padding: 60px 5%;} /* Image */ .landing-page .banner.image { height:auto; } .landing-page .banner.image .inner { position:absolute; max-width: 100%; width: 100%; top: 0; left: 0; height: 100%;} .landing-page .banner.image .actions { position:absolute; width: 100%; left: 0; bottom: 1em; text-align: center;} .landing-page .banner.image a.button { background: #009A4C; border-color:transparent; box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.25);} .landing-page .image-wrapper { text-align:center; overflow: hidden;} .landing-page .image-wrapper img { max-width:100%; max-height: 92vh; height:auto; width: auto; position: relative;} /* Basic */ .landing-page .banner.basic .intro {position:relative;top:50%;-webkit-transform: translate(0%, -50%);transform: translate(0%, -50%);text-align: left;max-width: 920px;-webkit-transition: all 0.6s ease-in-out;transition: all 0.6s ease-in-out;padding-top: 80px;} .landing-page .banner.basic .intro img { margin-bottom:2em; } .landing-page .banner.basic.video-open .intro { opacity:0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";-webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%);} /* Content */ .landing-page section.content { background: #FFF; color: #666;} .landing-page section.content.green{background: #091849; background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#091849), color-stop(100%,#1f3571)); background: -webkit-linear-gradient(-45deg, #091849 0%,#1f3571 100%); background: -webkit-linear-gradient(315deg, #091849 0%,#1f3571 100%); background: linear-gradient(135deg, #091849 0%,#1f3571 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#091849', endColorstr='#1f3571',GradientType=1 );} .landing-page section.content .col-2-3 { padding-right:5em; } .landing-page section.content .col-2-3 p{font-family: 'DIN-Regular', sans-serif; font-size: 18px;color: rgb(147, 147, 147);} .landing-page blockquote {border: 0px;font-weight: 300;line-height: 1.6em;font-size:1.2em;position: relative;color: #666;font-family: 'DIN-Regular', sans-serif;margin: 0;padding-left: 2em;margin-top: 40px;} .landing-page blockquote p{font-size: 1.2em;line-height: 1.6em;color: inherit;} .landing-page blockquote small {display: block;font-size: 70%;margin: 1em 0;font-weight: 800;} .landing-page blockquote:before{content: '\201C';display: block;position: absolute;left: 1%;font-size: 2em;line-height: normal;color: rgba(0, 0, 0, 0.24);font-weight: 300;} .landing-page .green .inner{text-align: center;max-width: 700px;} .landing-page .green .white{color: white;} .landing-page .green h2{font-size: 34px;font-family: 'DIN-Light';text-transform: uppercase;font-weight: normal;margin-bottom: 0;} .landing-page .green p{margin-bottom: 30px;} .landing-page .green .placeholder-form{display: block;background-color: rgba(255, 255, 255, 0.16);padding: 30px;} /* Footer */ .landing-page section.footer { background: #222; color: #BBB;} .landing-page section.footer a.button{ color: #091849; font-family: 'ProximaNova', arial, helvetica, sans-serif; padding: 3px 13px; border: 0px; border-radius: 4px; background: #FFDE00; height:auto; } .landing-page section.footer a.button:after{display:none;} .landing-page section.footer a.button:hover{} .landing-page section.footer h4, .landing-page section.footer h3 { color:#DDD; } .landing-page section.footer .col-2-5 { font-size:12px; padding-right:4em; } .landing-page section.footer .col-1-5 { padding-top:1em; } .landing-page section.footer .inner { padding-top: 2em; padding-bottom: 2em; } .landing-page section.footer p{color: rgb(141, 141, 141);} /* Video */ .landing-page .video-wrapper {position:absolute;top:0;left:0;width:100%;left:0;background: rgba(14, 25, 56, 0.65);height: 100%;z-index: 999;-webkit-transition: all 0.6s ease-in-out;transition: all 0.6s ease-in-out;text-align: center;overflow: hidden;opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";-webkit-transform: translate(100%, 0%);transform: translate(100%, 0%);} .landing-page .video-wrapper.open { -webkit-transform: translate(0%, 0%); transform: translate(0%, 0%); opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";} .landing-page .video-wrapper #wistia-video { position:relative; top:50%; -webkit-transform: translate(0%, -50%); transform: translate(0%, -50%);} .landing-page .video-wrapper #wistia-video.visible { } .landing-page .video-wrapper .inner { padding: 50px !important; height: inherit !important; max-width: 100%;} .landing-page .video-wrapper iframe { max-width: 100%; } .landing-page .video-wrapper a.close {position:absolute;left:0;background: rgba(255, 255, 255, 0.12);display:block;top:50%;width: 30px;line-height: 1;padding: 2em 0px;border-radius: 0 4px 4px 0;text-align: center;z-index: 9;-webkit-transform: translate(0%, -50%);transform: translate(0%, -50%);} .landing-page .video-wrapper a.close:before {content: 'f';font-family: "motus";font-size: 30px;} @media screen and (max-width:1400px){ .landing-page .banner {background-attachment: scroll;background-size: 130% auto;} } @media screen and (max-width:1024px){ .landing-page .banner {background-size: auto 100%;background-attachment: initial;height: auto;} .landing-page .banner .inner{height: auto;padding: 280px 6% 60px;} .landing-page .intro h2{font-size: 60px;max-width: 90%;} .landing-page .intro p{font-size: 23px;margin: 9px 0px 30px;} .landing-page .banner.basic .intro{top: 0%;-webkit-transform: translate(0%, 0%); transform: translate(0%, 0%);} .landing-page section.content{} .landing-page section.content .inner{ padding: 57px 6% 30px;} .landing-page section.content .col-2-3{padding: 0px;width: 100%;float: none;} .landing-page section.content .col-1-3{width: 100%;} .landing-page .banner.basic.video-open .intro { opacity:0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";-webkit-transform: translate(-50%, 0%); transform: translate(-50%, 0%);} } @media screen and (min-width:881px){ .landing-page .header .share-actions { display:block !important; } } @media screen and (max-width:880px){ .landing-page .banner .inner { padding-top:200px; box-shadow: none;} .landing-page section.footer .col-2-5{width:50%;} .landing-page section.footer .col-1-5{width:100%;} .landing-page .banner.image .inner { position:relative; height:auto; padding:0; } .landing-page .banner.image .inner .actions { position:relative; height:auto; padding:1em; bottom:auto; } .landing-page .header { position:relative; width:100%; top: auto !important; overflow: hidden; padding: 0;} .landing-page .header a.logo { height: 80px; width: 160px; margin: 1em; display: block; background-size: 90% auto; background-position: 15px center;} .landing-page .header .share-actions { height: 35px; float: none; height: auto; display: none;} .landing-page .header [data-toggle] { display:block; padding: 1.6em 1em 1em; height: 80px;} .landing-page .share-actions { width:100%; float:none; background: #191919; padding: 1em 1em 0.8em;} .landing-page .share-actions-wrapper:before { display:none; } .landing-page .share-actions-wrapper { float:right; } .landing-page .actions a.button { font-size:14px; } .landing-page .green h2 { font-size:28px } } @media screen and (max-width:520px){ .landing-page .share-actions-wrapper:before{display:none;} .landing-page .stButton .stLarge{ width: 20px !important; height: 20px !important; background-size: 100% auto !important; } .landing-page .header .share-actions{} .landing-page .banner {} .landing-page .banner .inner{padding: 170px 6% 37px;} .landing-page .intro h2{font-size: 30px;} .landing-page .intro p{font-size: 14px;} .landing-page .banner.basic .intro{} .landing-page section.content{} .landing-page section.content .inner,.landing-page section.footer .inner{padding: 20px 6% 30px;} .landing-page section.content .col-2-3 p,.landing-page blockquote p{font-size: 13px;} .landing-page section.content .col-2-3{} .landing-page section.content .col-1-3{} .landing-page section.footer .col-2-5{width:100%;padding-right: 0px;} .landing-page .actions a.button { font-size:12px; } } /* Slick slider --------------------------- */ .slick-slider{position: relative;display: block;box-sizing: border-box;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;-webkit-touch-callout: none;-khtml-user-select: none;-ms-touch-action: pan-y;touch-action: pan-y;-webkit-tap-highlight-color: transparent;} .slick-list{position: relative;display: block;overflow: hidden;margin: 0;padding: 0;} .slick-list:focus{outline: none;} .slick-list.dragging{cursor: pointer;cursor: hand;} .slick-slider .slick-track,.slick-slider .slick-list{-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} .slick-track{position: relative;top: 0;left: 0;display: block;} .slick-track:before,.slick-track:after{display: table;content: '';} .slick-track:after{clear: both;} .slick-loading .slick-track{visibility: hidden;} .slick-slide{display: none;float: left;height: 100%;min-height: 1px;outline: none;} .slick-slide.vheight-70{height:70vh;} [dir='rtl'] .slick-slide{float: right;} .slick-slide img{display: block;} .slick-slide.slick-loading img{display: none;} .slick-slide.dragging img{pointer-events: none;} .slick-initialized .slick-slide{display: -moz-flex;display: -webkit-box;display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;-webkit-box-align: center;-ms-flex-align: center;align-items: center;background-size: cover;background-position: center;} .slick-loading .slick-slide{visibility: hidden;} .slick-vertical .slick-slide{display: block;height: auto;border: 1px solid transparent;} .slick-arrow.slick-hidden {display: none;} /* Dots */ .slick-dots{position: absolute;bottom: 40px;z-index: 9;width:100%;text-align:center;margin:0px;padding:0px;} .slick-dots button{background: rgba(255, 255, 255, 0.35);} .slick-dots li{font-size:0px;display:inline-block;margin: 0 5px;} .slick-dots button{border: 0px;width: 10px;height: 10px;display: block;border-radius: 20px;padding: 0px;outline: none;} .slick-dots li.slick-active{} .slick-dots li.slick-active button{background: #ffffff;} .slick-dotted.slick-slider { margin-bottom: 0px; padding-bottom: 0px;} @media screen and (max-width:450px){ .slick-dots button{} } /* Arrows */ .slick-prev, .slick-next{font-size: 0;line-height: 0;position: absolute;top: 50%;display: block;width: 20px;height: 20px;margin-top: -10px;padding: 0;cursor: pointer;color: transparent;border: none;outline: none;background: transparent;z-index: 1;} .slick-prev:hover,.slick-prev:focus,.slick-next:hover,.slick-next:focus{color: transparent;outline: none;background: transparent;} .slick-prev:hover:before,.slick-prev:focus:before,.slick-next:hover:before,.slick-next:focus:before{opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";} .slick-prev.slick-disabled:before,.slick-next.slick-disabled:before{opacity: .25;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=25)";} .slick-prev:before,.slick-next:before{font-size: 26px;line-height: 1;opacity: .75;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";color: white;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;font-family: framework;} .slick-prev{left: 25px;} [dir='rtl'] .slick-prev{right: -25px;left: auto;} .slick-prev:before{content: 'i';} [dir='rtl'] .slick-prev:before{content: '>';} .slick-next{right: 29px;} [dir='rtl'] .slick-next{right: auto;left: -25px;} .slick-next:before{content: 'j';} [dir='rtl'] .slick-next:before{content: '<';} @media screen and (max-width:1024px){ .slick-prev, .slick-next{display:none !important;} } /* ============================================================================= Make an enquiry box and anchor button ========================================================================== */ #content a.button[href="#enquiry-box"]{display: inline-block !important;position: absolute;right: 5%;bottom: 70px;} #content a.button[href="#enquiry-box"]:after {content: 'd'; font-family: 'motus';position: absolute;margin-left: 6px;} #enquiry-box{display: block;background-color: white;margin: 0px;position: relative;} .enquiry-img{background: url(https://www.motushydraulics.co.nz/wp-content/uploads/2014/06/Interior-2.jpg);position: absolute;width: 40%;left: 0;top: 0;bottom: 0;background-size: cover;background-position: -120px 0;} .enquiry-form{padding: 5%;width: 60%;float: right;} .enquiry-form input, .enquiry-form textarea{background: rgb(229, 234, 236);width: 100%;border: 0px;padding: 10px;margin-bottom: 4px;max-width: 100%;} .enquiry-form input[type="submit"]{background: #ffde00;width: auto;padding: 10px 20px;} .hs-form-field{margin-bottom:10px;} @media screen and (max-width:920px){ #content a.button[href="#enquiry-box"]{position:relative;bottom: 0;right: 0;} } @media screen and (max-width:600px){ #enquiry-box{margin-top: 20px;} .enquiry-img{position: relative;height: 120px;background-size: 100%;width: 100%;} .enquiry-form{float: none;width: 100%;} } /* ============================================================================= Print Styles ========================================================================== */ @media print, (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 120dpi) { } @media print { * {background: transparent !important; color: black !important; box-shadow:none !important; text-shadow: none !important; -webkit-filter:none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: h5bp.com/s */ a, a:visited {text-decoration: underline; } a[href]:after {content: " (" attr(href) ")"; } abbr[title]:after {content: " (" attr(title) ")"; } .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } /* Don't show links for images, or javascript/internal links */ pre, blockquote {border: 1px solid #999; page-break-inside: avoid; } thead {display: table-header-group;} tr, img {page-break-inside: avoid;} img {max-width: 100% !important;} @page {margin: 0.5cm;} p, h2, h3 {orphans: 3; widows: 3;} h2, h3 {page-break-after: avoid;} } /* mega menu */ #mega_menu{background: rgb(13, 28, 74);position: absolute;width: 100%;top: 90px;padding: 0px 0%;-webkit-transition: all 0.3s ease;transition: all 0.3s ease;opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";pointer-events: none;display: block;} .scroll #mega_menu{/* top: 60px; */} #nav.open_mm + #mega_menu, #mega_menu.opened{opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";pointer-events: all;} #mega_menu > ul{display: -moz-flex;display: -webkit-box;display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;position: relative;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;} #mega_menu > ul > li{float: left;width: 19.8%;padding: 32px 30px;border-right: 1px solid rgba(255, 255, 255, 0.12);} #mega_menu > ul > li > a{font-family: "DIN-Bold";font-weight: normal;text-transform: uppercase;color: white;display: block;margin-bottom: 12px;} #mega_menu > ul > li > ul{} #mega_menu > ul > li > ul > li{font-size: 14px;margin: 0 0 4px 0;} #mega_menu > ul > li > ul > li > a{display: block;} @media screen and (max-width:1100px){ #mega_menu{display:none;} } /* slider */ .slide{height: 818px;} .slide .inner{padding: 100px 10%;margin: 0;position: relative;top: 0px;width: 100%;} .slide .intro-copy{} .inner-700{max-width:700px;} .slide p{color:white;} @media screen and (max-width:1280px){ .home-slider .slide{background-size: 100% auto;background-repeat: no-repeat;background-color: #122359;background-position: center right -70px;} .home-slider .slide .inner{padding: 20px 50px;max-width: 60%;} .home-slider .slide .intro-copy{} } @media screen and (max-width:760px){ .home-slider .slide{background-image: none !Important;} .home-slider .slide .inner{ max-width: 100%; padding: 20px 7%; } } @media screen and (max-width:650px){ .slide{min-height: 560px;height: 500px;} .slide .inner{top:0px;} } /* entry icons ram - range */ .grid.entry-icons-ram{display: -moz-flex;display: -webkit-box;display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;position: relative;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;} /* payment page */ #paymentform{background: #0c1431;} #paymentform table{width:100%} #paymentform .inner{max-width:700px;margin:auto} /* wp video / iframe */ .wp-video{width:100%;max-width:100%;height:auto !important;} .wp-video video{width:100%;max-width:100%;height:auto !important;} iframe{width:100%;max-width:100%;} /* ============================================================================= Standard Ram anchors ========================================================================== */ .collectionmenu {float:left;width:100%;/*margin: 0 0 20px 0;*/margin: 20px 0 60px 0;} .collectionmenu ul {margin:0;padding:0;} .collectionmenu li { list-style:none; float:left; padding:10px; margin: 0 15px 15px 0; border:1px solid rgba(188, 203, 210, 0.5); } .collectionmenu li a:hover {color:#48535a;text-decoration:underline;} /* ============================================================================= Product Filter ========================================================================== */ .product-filter {color: #FFF;/*margin: 80px 0 50px;clear: both;*/margin: 0 0 50px;clear: both;} .product-filter * {color:inherit;} .product-filter-title h3 {text-transform:none;display:inline-block;border-radius:6px 6px 0 0;vertical-align: bottom;font-family: "DIN-Bold";text-transform: uppercase;font-size: 150%;line-height: 1;color: #48535a;} .product-filter-title h3 span {font-size:15px;text-transform:none;font-family: "DIN-Bold";text-transform: uppercase;} .product-filter-header {} .product-filter-tile {float:left;width: 22%;position:relative;border-right: 2px solid rgba(0, 0, 0, 0.1);} .product-filter-tile.disabled:before {content:"";position:absolute;width:100%;height:100%;z-index:99999;left: 0;top: 0;} .product-filter-tile:last-child {border-right: none;background: rgba(0, 0, 0, 0.04);width: 34%;} .product-filter-tile.completed:last-child { background:none; } .product-filter-tile h3 {font-size:40px;margin: 60px 20px 40px;text-align: center;position: relative;-webkit-transition: all 0.25s ease-in-out;-moz-transition: all 0.25s ease-in-out;-o-transition: all 0.25s ease-in-out;transition: all 0.25s ease-in-out;} .product-filter-tile .tile-inner:before, .product-filter-tile .tile-inner:after {/* content:"01"; */font-size: 15px;text-transform:uppercase;padding: 0;display:inline-block;position:relative;-moz-border-radius: 100px;-webkit-border-radius: 100px;border-radius: 100px;border: inherit;line-height: 1;text-align:center;vertical-align: middle;font-family: "DIN-Bold";font-weight: normal;padding: 11px 10px;position: absolute;left: 50%;top: 30px;margin: 0 0 0 -18px;width: 36px;height: 36px;-webkit-transition: all 0.25s ease-in-out;-moz-transition: all 0.25s ease-in-out;-o-transition: all 0.25s ease-in-out;transition: all 0.25s ease-in-out;top: 0;left: 0;margin: 0 !important;-moz-border-radius: 0 0 6px 0;-webkit-border-radius: 0 0 6px 0;border-radius: 0 0 6px 0;background: rgba(0, 0, 0, 0.05) !important;} .product-filter-tile:nth-child(1) .tile-inner:before { content:"01"; } .product-filter-tile:nth-child(2) .tile-inner:before { content:"02"; } .product-filter-tile:nth-child(3) .tile-inner:before { content:"03"; } .product-filter-tile:nth-child(4) .tile-inner:before {content: "Product" !important;letter-spacing:0.02em;padding: 10px 20px;width: 110px;margin-left: -55px;font-family: 'DIN-Bold' !important;text-transform: capitalize !important;} .product-filter-tile.completed .tile-inner:before, .product-filter-tile.completed .tile-inner:after {content: '\70';font-family: 'framework';text-transform: lowercase;} .product-filter-tile .tile-inner:after {background: rgb(255, 255, 255);z-index:1;content:"p";font-family:"motus";text-transform:none;font-size: 25px;padding: 7px 2px;color: #FFFFFF;opacity: 0;-webkit-transform: translate(0px, -10px);-moz-transform: translate(0px, -10px);-o-transform: translate(0px, -10px);-ms-transform: translate(0px, -10px);transform: translate(0px, -10px);} .product-filter-tile.completed .tile-inner:after {opacity:1;-webkit-transform: translate(0px, 0px);-moz-transform: translate(0px, 0px);-o-transform: translate(0px, 0px);-ms-transform: translate(0px, 0px);transform: translate(0px, 0px);} .product-filter-tile.completed .tile-inner:before { opacity:0; } .product-filter-tile:nth-child(4).completed .tile-inner:before {opacity: 1;} .product-filter-tile:nth-child(4).completed .tile-inner:after { display:none; } .product-filter-tile .custom-select {position:relative;-webkit-transition: all 0.25s ease-in-out;-moz-transition: all 0.25s ease-in-out;-o-transition: all 0.25s ease-in-out;transition: all 0.25s ease-in-out;} .product-filter-tile .custom-select:after {pointer-events:none;content: "\76";font-family: "framework";position:absolute;top:50%;line-height:1;font-size: 17px;right: 14px;margin:-0.5em 0;} .product-filter-tile .custom-select select {width: 100%;outline:none;font-size: 20px;font-family: inherit;display: inline-block;background: none;padding: 13px 40px 14px 15px;font-size: 16px;line-height: 1;border: 0;-webkit-appearance: none;font-family: "DIN-Bold";font-weight: normal;-moz-border-radius: 4px;-webkit-border-radius: 4px;border-radius: 4px;background: rgba(0, 0, 0, 0.15);} .product-filter-tile .custom-select select:hover { cursor:pointer; } .product-filter-tile .tile-inner {padding: 0;position: relative;padding: 80px 30px 40px;text-align: center;height: 250px;} .product-filter-tile .tile-inner label {display:block;font-size: 22px;padding: 10px 0 20px;line-height: 1;font-family: "DIN-Bold";-webkit-transition: all 0.25s ease-in-out;-moz-transition: all 0.25s ease-in-out;-o-transition: all 0.25s ease-in-out;transition: all 0.25s ease-in-out;text-align: left;} .product-filter-tile.disabled .tile-inner {background: rgba(0, 0, 0, 0.04);} .product-filter-tile.disabled label {color: rgba(0, 0, 0, 0.15);} .product-filter-tile.disabled .custom-select {opacity: 0.5;pointer-events: none;} .product-filter-tile .tile-inner .final-product {margin: 15px 0px 0;position: relative;text-align: center;color: #48535a;min-height: 150px;} .product-filter-tile .tile-inner .final-product:before {z-index:1; content:"?";position:absolute;top:50%;left:0;width:100%;text-align:center;font-family:"DIN-Bold";font-size: 80px;line-height:1;color: rgba(0, 0, 0, 0.15);margin: -0.55em 0;-webkit-transition: all 0.25s ease-in-out;-moz-transition: all 0.25s ease-in-out;-o-transition: all 0.25s ease-in-out;transition: all 0.25s ease-in-out;} .product-filter-tile.completed .tile-inner .final-product:before {opacity:0;-webkit-transform: translate(0px, 25px);-moz-transform: translate(0px, 25px);-o-transform: translate(0px, 25px);-ms-transform: translate(0px, 25px);transform: translate(0px, 25px);} #easyram .final-product-tile { position:relative; z-index:50;} .alt-selector {position:relative;} .alt-selector ul {display: none;list-style:none;margin:0;position: absolute;width: 300px;border-radius: 4px;color: #48535a;z-index: 999;box-shadow: 0px 2px 10px rgba(57, 57, 57, 0.39);overflow: hidden;top: 10px;left: 10px;background: rgba(255, 255, 255, 0.8);} .alt-selector li {display:block;padding: 0;text-align:left;margin:0;position: relative;border-bottom: 1px solid #EEE;} .alt-selector li:last-child { border:none; } .alt-selector ul a {padding: 10px 14px;display:block;line-height: 1;font-size: 13px;outline: none !important;background: #FFF right center no-repeat;background-size: 70px auto;\: -20px;background-position: 95%;color: inherit;} .alt-selector .selected {color: #3282CE;background-color: rgb(255, 255, 255);border-left: 4px solid;} .alt-selector li:first-child a { border:none; } .alt-selector a:hover {opacity: 0.7;color: inherit;} .alt-selector-option {text-align:left;display:block;padding: 13px 40px 14px 15px;font-size: 16px;line-height: 1;border: 0;-webkit-appearance: none;font-family: "DIN-Bold";font-weight: normal;-moz-border-radius: 4px;-webkit-border-radius: 4px;border-radius: 4px;background: rgba(0, 0, 0, 0.15);color: white !important;} .alt-selector-close {position:fixed;width:100%;height:100%;background: none;display:block;top:0;left:0;display: none;} .collectionmenu a { color: #48535a;font-size: 15px;} .alt-selector.open .alt-selector-close { display:block; } .alt-selector.open ul { display:block; } .final-product-tile[data-filters*="style_"] {background:#FFF no-repeat center top;} .final-product-tile[data-filters*="style_"] img {opacity: 0 !important;} .alt-selector a[data-value="style_Blank-With_no_mounts"], .final-product-tile[data-filters*="style_Blank-With_no_mounts"] .product-image { background-image:url(../assets/blank-with-no-mounts.png); } .alt-selector a[data-value="style_Clevis-Clevis"], .final-product-tile[data-filters*="style_Clevis-Clevis"] .product-image {background-image: url(../assets/clevis-clevis.png);} .alt-selector a[data-value="style_Solid_Base-Collar"], .final-product-tile[data-filters*="style_Solid_Base-Collar"] .product-image {background-image: url(../assets/solid-base-collar.png);} .alt-selector a[data-value="style_Tongue-Collar"], .final-product-tile[data-filters*="style_Tongue-Collar"] .product-image {background-image: url(../assets/tongue-collar.png);} @media all and (-ms-high-contrast: none), (-ms-high-contrast: active){ /* IE10+ CSS styles go here */ .product-filter-tile .custom-select:after { display:none; } .product-filter-tile .custom-select select {padding: 0px 0 0 10px;height:35px;background:#EEE;-mox-border-radius:0;-webkit-border-radius:0;border-radius:0;color:#222;} .alt-selector { color:#000; } .alt-selector .alt-selector-option:after {pointer-events: none;content: "m";font-family: "motus";position: absolute;top: 50%;line-height: 1;font-size: 20px;right: 9px;margin: -0.5em 0;color: #000;} .alt-selector .alt-selector-option {background: #FFF;color: #000000;border-radius: 0px;padding: 11px 30px 13px 11px;height: 40px;} } @-moz-document url-prefix() { /* IE10+ CSS styles go here */ .product-filter-tile .custom-select:after { display:none; } .product-filter-tile .custom-select select {padding: 0px 0 0 10px;height:35px;background:#EEE;-mox-border-radius:0;-webkit-border-radius:0;border-radius:0;color:#222;} .alt-selector { color:#000; } .alt-selector .alt-selector-option:after {pointer-events: none;content: "m";font-family: "motus";position: absolute;top: 50%;line-height: 1;font-size: 20px;right: 9px;margin: -0.5em 0;color: #000;} .alt-selector .alt-selector-option {background: #FFF;color: #000000;border-radius: 0px;padding: 11px 30px 13px 11px;height: 40px;} } /* Colour */ #easyram .product-filter-header {background: #f47920;} #easyram select option { background-color:#d0671b;} .product-button {display: block;padding: 4px 10px 15px;background: #FFF;margin: 0;line-height: 1;width: 100%;position: relative;font-family: "DIN-Bold";font-weight: normal;text-transform: uppercase;color: #48535a;-webkit-transition: all 0.25s ease-in-out;-moz-transition: all 0.25s ease-in-out;-o-transition: all 0.25s ease-in-out;transition: all 0.25s ease-in-out;outline: none !important;-webkit-transform: translate(0px, 25px);-moz-transform: translate(0px, 25px);-o-transform: translate(0px, 25px);-ms-transform: translate(0px, 25px);transform: translate(0px, 25px);opacity: 0;border-radius: 0 0 3px 3px;font-size: 13px;} .product-button span {/* font-size:12px; */display:inline-block;color: #848D92;position: relative;/* top: -2px; */padding-left: 5px;display: none;} .product-button:hover {color: #767F85;} .product-filter-tile.product-tile .tile-inner {padding: 22px 20px 30px;} .product-filter-tile .product-image {display: block;padding: 6px 5px 6px;width: 100%;position: relative;-webkit-transition: all 0.2s ease;-moz-transition: all 0.2s ease;-o-transition: all 0.2s ease;transition: all 0.2s ease;outline: none;z-index: 1;min-height: 110px;background: #FFF center 18px no-repeat;background-size: 220px auto;} .product-image:hover { opacity: 0.8; } #content .product-filter-tile .product-image img {margin: 0 0 40px;height: 70px;display: inline-block;-webkit-transition: all 0.2s ease;-moz-transition: all 0.2s ease;-o-transition: all 0.2s ease;transition: all 0.2s ease;} .product-filter-tile .product-image span {display:block;font-family: "DIN-Bold";font-weight: normal;text-transform: uppercase;color: #48535a;font-size: 14px;padding: 8px 5px 10px;-webkit-transition: all 0.2s ease;-moz-transition: all 0.2s ease;-o-transition: all 0.2s ease;transition: all 0.2s ease;position: absolute;width: 100%;bottom: 2px;} .product-filter-tile .product-image:hover > * { opacity:0.7; } .product-filter-tile .tile-inner .final-product p {display:block;margin: 0;background: #FFF;border-top: 1px solid #EEE;padding: 6px 4px;} .product-filter-tile .tile-inner .final-product p a {display:inline-block;font-size: 14px;margin: 0;height: 14px;line-height: 1.1;margin-right: 10px;padding-right: 10px;border-right: 1px solid #E6E6E6;} .product-filter-tile .tile-inner .final-product p:last-child a { font-size: 13px; padding: 12px 23px 25px; margin: auto; border-width: 3px; text-transform: uppercase; font-family: "DIN-Bold"; background: #ffde00; border: 0px; color: #091849; } .product-filter-tile .tile-inner .final-product p a:hover {color: #828B91;} .product-filter-tile.completed .product-button {opacity: 1;-webkit-transform: translate(0px, 0px);-moz-transform: translate(0px, 0px);-o-transform: translate(0px, 0px);-ms-transform: translate(0px, 0px);transform: translate(0px, 0px);} @media screen and (max-width:1400px){ .product-filter-tile .tile-inner { padding:50px 20px 20px; } } @media screen and (max-width:1000px){ .product-filter-tile {width:50%;border-bottom: 2px solid rgba(0, 0, 0, 0.1);} .product-filter-tile:last-child { width:50%; } .product-filter-tile:nth-child(2n) { border-right:none; } .product-filter-tile:nth-child(2n+1){ clear:both; } .product-filter-tile:nth-child{ } } @media screen and (max-width:600px){ .product-filter-tile, .product-filter-tile:last-child { width:100%; } .product-filter-tile .tile-inner {padding: 10px 50px 20px 20px;height: auto;} .product-filter-tile .tile-inner:before, .product-filter-tile .tile-inner:after { left:auto; right:0; border-radius:0 0 0 6px; } .product-filter-tile:nth-child(4) .tile-inner:before { left:0; right:auto; border-radius:0 0 6px 0; } .product-filter-tile .tile-inner .final-product {min-height: 80px;height: auto;} .product-filter-tile .product-image { background-size:180px auto; } #content .product-filter-tile .product-image img { height:auto; max-width:80%; width:250px; } .alt-selector ul {width:100%;} .alt-selector ul a {font-size:12px;padding:10px;background-position: 94%;background-size: auto 62%;} } @media screen and (max-width:400px){ .product-filter-tile .tile-inner label {font-size:15px;padding-bottom: 8px;} .product-filter-tile .custom-select select { padding:10px; height:40px; } .product-filter-tile:nth-child(4) .tile-inner:before {font-size:15px;text-transform:none;text-align: left;width: auto;} .product-button { font-size:14px; height: auto; padding:14px 30px; } }