/* Font awsome @import url('https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css'); Google Font CSS or other fontfaces @import url('https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i,800,800i|Raleway:200,200i,300,300i,400,400i,500,500i,600,600i,700,700i'); */ /* theme color */ /* Typography */ /* */ /* */ /* Containers */ /* Used on '.page-center' in 'Base' and in the 'Portrait tablet to landscape and desktop' media query */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small,strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, select, input, option, textarea { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; box-sizing: border-box; } article, aside, details, figcaption, figure, footer, header, hgroup, nav, section, summary { display: block; } figure,figcaption{margin:0;padding:0;} audio, canvas, video { display: inline-block; } audio:not([controls]) { display: none; height: 0; } pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word } q { quotes: none } q:before, q:after { content: ''; content: none } small { font-size: 80% } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline } sup { top: -0.5em; } sub { bottom: -0.55em } nav ul, nav ol { list-style: none; list-style-image: none; } button, input, select, textarea,option { font-size: 100%; margin: 0; vertical-align: baseline; font-family: 'Open Sans', Arial, sans-serif;font-weight:500} input[type="text"],input[type="tel"],input[type="email"]{ -webkit-appearance:none !important; } input[type="submit"] {cursor: pointer;transition:all 0.5s ease;} textarea { overflow: auto; vertical-align: top;resize:none; } table { border-collapse: collapse; border-spacing: 0 } button, html input[type="button"], input[type="reset"], input[type="submit"], textarea { -webkit-appearance: none; border-radius: 0!important; transition: all 0.5s ease ; -moz-transition: all 0.5s ease ; -ms-transition: all 0.5s ease ; -o-transition: all 0.5s ease ; -webkit-transition: all 0.5s ease ; } /* remember to define focus styles! */ :focus { outline: 0; } /* tables still need 'cellspacing="0"' in the markup */ table { border-collapse: separate; border-spacing: 0; } caption, th, td { text-align: left; font-weight: normal; } blockquote:before, blockquote:after, q:before, q:after { content: ""; } blockquote, q { quotes: "" ""; } table { border: 0 none; border-collapse: collapse; border-spacing: 0; } td { vertical-align: top; } img { border: 0 none; max-width: 100%; vertical-align:middle;height:auto} a { outline: none; cursor: pointer;transition:all 0.5s ease;} /* End hide from IE Mac */ *:before, *:after {box-sizing: border-box;} /* End Clearfix */ article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block } li { list-style: none; } /*Placeholder opacity cross browsers*/ input::-webkit-input-placeholder { color: #000; opacity:1;} /* WebKit browsers */ input:-moz-placeholder { color: #000; opacity:1;} /* Mozilla Firefox 4 to 18 */ input::-moz-placeholder { color: #000; opacity:1;} /* Mozilla Firefox 19+ */ input:-ms-input-placeholder { color: #000; opacity:1;} /* Internet Explorer 10+ */ textarea::-webkit-input-placeholder { color: #000; opacity:1;} /* WebKit browsers */ textarea:-moz-placeholder { color: #000; opacity:1;} /* Mozilla Firefox 4 to 18 */ textarea::-moz-placeholder { color: #000; opacity:1;} /* Mozilla Firefox 19+ */ textarea:-ms-input-placeholder { color: #000; opacity:1;} /* Internet Explorer 10+ */ /* Clear float */ .clear { clear: both; } .cf:before, .cf:after { content: ""; display: table } .cf:after { clear: both; } /******body ******/ body { font-size: 16px; line-height: 24px; -webkit-font-smoothing: antialiased; -webkit-text-size-adjust: none; -webkit-tap-highlight-color: rgba(0,0,0,0); font-family: 'Open Sans', Arial, sans-serif; font-weight:normal;color:#252525;} body:not(.custom-background-image)::before, body:not(.custom-background-image)::after { display: none !important; } a { text-decoration: none; transition: all 0.5s ease ; -moz-transition: all 0.5s ease ; -ms-transition: all 0.5s ease ; -o-transition: all 0.5s ease ; -webkit-transition: all 0.5s ease ; } a:hover {text-decoration: none; transition: all 0.5s ease ; -moz-transition: all 0.5s ease ; -ms-transition: all 0.5s ease ; -o-transition: all 0.5s ease ; -webkit-transition: all 0.5s ease ; } a:focus { outline: none; text-decoration: none; } p { margin-bottom: 15px;} .text-white {color:#fff;} /* display table and table cell and display flex */ .tbl {display:table;width:100%;height:100%;} .tbl-cell {display:table-cell;vertical-align:middle} .dis-flex {display:flex;align-items:center;} /* IE fixes */ select::-ms-expand {display: none;} input::-ms-clear { display:none;} /* remove auto fill yellow color */ input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill { -webkit-box-shadow: 0 0 0 100px #fff inset; -moz-box-shadow: 0 0 0 100px #fff inset; box-shadow: 0 0 0 100px #fff inset; color:#333 ; } /* hubspot fixes*/ .row-fluid [class*="span"] {min-height: 1px;} /* logo -Please use this class as logo image class*/ .h-logo img ,.f-logo img {cursor: pointer;} /* container */ .container {max-width:1170px;margin:0 auto !important; padding:0 1rem; float:none !important; } .container-small {max-width:1040px; margin-left: auto; margin-right: auto; float:none !important; } .container-small-2 {max-width:980px; margin-left: auto; margin-right: auto; float:none !important; } /* strong */ b, strong {font-weight:700;} /* header text */ h1 { font-size:40px; line-height: 1.2; margin:0 0 10px; color:#e2211c; font-family: 'Open Sans', Arial, sans-serif; font-weight:600;} h1 > span {color:#e2211c;} h2 {font-size:36px;line-height: 1.2;margin:0 0 20px;text-align:center;text-transform:uppercase;font-family: 'Open Sans', Arial, sans-serif;font-weight:600;} h3 {font-size:24px;line-height: 1.2;margin:0 0 10px;font-family: 'Open Sans', Arial, sans-serif;font-weight:600;} h4 {font-size:22px;line-height: 1.2;margin:0 0 10px;font-family: 'Open Sans', Arial, sans-serif;font-weight:600;} h5 {font-size:20px;line-height: 1.3;margin:0 0 10px;font-family: 'Open Sans', Arial, sans-serif;font-weight:600;} h6 {font-size:16px;line-height: 1.4;margin:0 0 10px;font-family: 'Open Sans', Arial, sans-serif;font-weight:600;} /* p tag */ p {font-size: 16px; line-height: 1.4;margin-bottom:15px;} /* links */ a {font-size: 16px; line-height: 1.3;color:#e2211c;} a:hover {color: #e2211c; text-decoration:underline; } /* ul li */ ul , ol {margin:20px 0;text-align:left;padding-left: 18px;} ul li ,ol li {font-size: 16px; margin-bottom: 6px; list-style:inherit;list-style-position:outside;} /* em */ em { font-size: 22px; line-height:1.5;} /** Hubspot module */ .widget-type-text span {margin-bottom:15px;display:block;} /* FlexSlider Necessary Styles hubspot default image slider */ .widget-type-image_slider {overflow:hidden;} .hs_cos_flex-slider ul {padding:0;} .hs_cos_flex-slider ul li {margin:0;padding:0;list-style:none;} .hs_cos_flex-slider {margin: 0; padding: 0;} .hs_cos_flex-slider .hs_cos_flex-slides > li {display: none; -webkit-backface-visibility: hidden; position: relative;} /* Hide the slides before the JS is loaded. Avoids image jumping */ .hs_cos_flex-slider .hs_cos_flex-slides img {width: 100%; display: block; border-radius: 0px;} .hs_cos_flex-pauseplay span {text-transform: capitalize;} .hs_cos_flex-slides:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;} html[xmlns] .hs_cos_flex-slides {display: block;} * html .hs_cos_flex-slides {height: 1%;} .hs_cos_flex-slider {margin: 0 0 60px; background: #fff; border: 0; position: relative; -webkit-border-radius: 4px; -moz-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; zoom: 1;} .hs_cos_flex-viewport {max-height: 2000px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; transition: all 1s ease;} .loading .hs_cos_flex-viewport {max-height: 300px;} .hs_cos_flex-slider .hs_cos_flex-slides {zoom: 1;} .carousel li {margin-right: 5px} .hs_cos_flex-direction-nav {*height: 0;} .hs_cos_flex-direction-nav a {width: 30px; height: 30px; margin: -20px 0 0; display: block; background: url(http://cdn2.hubspotqa.net/local/hub/124/file-52894-png/bg_direction_nav.png) no-repeat 0 0; position: absolute; top: 50%; z-index: 10; cursor: pointer; text-indent: -9999px; opacity: 0; -webkit-transition: all .3s ease;} .hs_cos_flex-direction-nav .hs_cos_flex-next {background-position: 100% 0; right: -36px; } .hs_cos_flex-direction-nav .hs_cos_flex-prev {left: -36px;} .hs_cos_flex-slider:hover .hs_cos_flex-next {opacity: 0.8; right: 5px;} .hs_cos_flex-slider:hover .hs_cos_flex-prev {opacity: 0.8; left: 5px;} .hs_cos_flex-slider:hover .hs_cos_flex-next:hover, .hs_cos_flex-slider:hover .hs_cos_flex-prev:hover {opacity: 1;} .hs_cos_flex-direction-nav .hs_cos_flex-disabled {opacity: .3!important; filter:alpha(opacity=30); cursor: default;} .hs_cos_flex_thumbnavs-direction-nav {margin: 0px;padding: 0px;list-style: none;} .hs_cos_flex_thumbnavs-direction-nav {*height: 0;} .hs_cos_flex_thumbnavs-direction-nav a {width: 30px; height: 140px; margin: -60px 0 0; display: block; background: url(http://cdn2.hubspotqa.net/local/hub/124/file-52894-png/bg_direction_nav.png) no-repeat 0 40%; position: absolute; top: 50%; z-index: 10; cursor: pointer; text-indent: -9999px; opacity: 1; -webkit-transition: all .3s ease;} .hs_cos_flex_thumbnavs-direction-nav .hs_cos_flex_thumbnavs-next {background-position: 100% 40%; right: 0px; } .hs_cos_flex_thumbnavs-direction-nav .hs_cos_flex_thumbnavs-prev {left: 0px;} .hs-cos-flex-slider-control-panel img { cursor: pointer; } .hs-cos-flex-slider-control-panel img:hover { opacity:.8; } .hs-cos-flex-slider-control-panel { margin-top: -30px; } .hs_cos_flex-control-nav {width: 100%; position: absolute; text-align: center;} .hs_cos_flex-control-nav li {margin: 0 6px; display: inline-block; zoom: 1; *display: inline;} .hs_cos_flex-control-paging li a {width: 11px; height: 11px; display: block; background: #666; background: rgba(0,0,0,0.5); cursor: pointer; text-indent: -9999px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; border-radius: 20px; box-shadow: inset 0 0 3px rgba(0,0,0,0.3);} .hs_cos_flex-control-paging li a:hover { background: #333; background: rgba(0,0,0,0.7); } .hs_cos_flex-control-paging li a.hs_cos_flex-active { background: #e2211c; cursor: default; } .hs_cos_flex-control-thumbs {margin: 5px 0 0; position: static; overflow: hidden;} .hs_cos_flex-control-thumbs li {width: 25%; float: left; margin: 0;} .hs_cos_flex-control-thumbs img {width: 100%; display: block; opacity: .7; cursor: pointer;} .hs_cos_flex-control-thumbs img:hover {opacity: 1;} .hs_cos_flex-control-thumbs .hs_cos_flex-active {opacity: 1; cursor: default;} .hs_cos_flex-slider .caption {background-color: black; position: static; font-size: 2em; line-height: 1.1em; color: white; padding: 10px 5% 10px 5%; width: 100%; top: 40%; text-align: center; } .hs_cos_flex-slider .superimpose .caption { color: white; font-size: 3em; line-height: 1.1em; position: absolute; padding: 0px 5% 0px 5%; width: 90%; top: 40%; text-align: center; background-color: transparent; } .hs_cos_flex-slider h1, .hs_cos_flex-slider h2, .hs_cos_flex-slider h3, .hs_cos_flex-slider h4, .hs_cos_flex-slider h5, .hs_cos_flex-slider h6, .hs_cos_flex-slider p { color: white; } @media screen and (max-width: 860px) { .hs_cos_flex-direction-nav .hs_cos_flex-prev {opacity: 1; left: 0;} .hs_cos_flex-direction-nav .hs_cos_flex-next {opacity: 1; right: 0;} } @media all and (max-width: 400px) { .hs_cos_flex-slider .superimpose .caption { background-color: black; position: static; font-size: 2em; line-height: 1.1em; color: white; width: 90%; padding: 0px 5% 0px 5%; top: 40%; text-align: center; } } /* hubspot form */ ul.hs-error-msgs > li > label {font-size:13px;line-height:normal;display:block;color:#e2211c;} .hs-form-field { position: relative } ul.hs-error-msgs.inputs-list { position: absolute; bottom: -18px; right: 0; list-style-type: none; padding: 2px 5px; color: white; background: #e2211c } ul.hs-error-msgs.inputs-list li label { font-size: 12px; font-weight: 600; position: relative; z-index: 9; line-height: normal; display: block;color:#fff; } ul.hs-error-msgs.inputs-list:after { content: ''; width: 8px; height: 8px; position: absolute; display: inline-block; left: 50%; background: #e2211c; margin-left: -6px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); margin-top: -4px; top: 0 } input,textarea,select {border-radius: 0; } select,textarea,input[type=color], input[type=date], input[type=datetime-local], input[type=datetime], input[type=email], input[type=month], input[type=number], input[type=password], input[type=search], input[type=tel], input[type=text], input[type=time], input[type=url], input[type=week], textarea { -webkit-appearance: none; -moz-appearance: none; background-color: #efefef; color: #000; display: block; font-size: 16px; height: 40px; padding: 0 15px; width: 100%; color:#444;border:0;border-radius:5px;} select { -webkit-appearance: none!important; -moz-appearance: none!important; background-color: transparent; background-image: url('https://2698870.fs1.hubspotusercontent-na1.net/hubfs/2698870/CAI%20Logistics%20LP-June2017/Images/download.png'); background-position: 98% center; background-repeat: no-repeat; } textarea {height:115px;padding:13px 15px;} ul li label input[type="checkbox"] , ul li label input[type="radio"] {opacity: 0;display:none !important;} ul li label span{position: relative;} ul li label input[type="checkbox"] , .input ul li label span ,ul li label input[type="radio"] {display: inline-block; vertical-align: middle; cursor: pointer;} ul li label input[type="checkbox"] + span:before , ul li label input[type="radio"] + span:before{content: '';background: #e5e5e5;border: 2px solid #ddd;display: inline-block;vertical-align: middle;width: 20px;height: 20px;padding: 2px;margin-right: 10px;text-align: center;} ul li label input[type="radio"] + span:before {border-radius:50%; } ul li label input[type="checkbox"]:checked + span:before , ul li label input[type="radio"]:checked + span:before { box-shadow: 0 0 0 5px #000 inset;} .hs-form-field {margin-bottom:24px;} .hs_submit input , .email-prefs input[type="submit"] , #email-prefs-form input[type="submit"] {background-color: #e2211c; color: #fff; padding: 12px 40px; display: inline-block; border-radius: 25px; line-height: normal; font-size:16px;text-transform:uppercase; margin-top:15px;font-weight: 600;} .hs_submit input:hover , .email-prefs input[type="submit"]:hover , #email-prefs-form input[type="submit"]:hover {background:#000;color:#fff;} .submitted-message { text-align: center; padding-top: 25px;} form ul {margin:0;padding:0;} form ul li {margin:0;padding:0;list-style:none;} div.hs-form-field > label { color: #252525; display: block; font-size: 16px; line-height: 1.2; margin-bottom: 6px;font-weight:600 } div.hs_submit {margin:0;} /*** single column ***/ form > div {width:100%;} /*** two column ***/ form fieldset {max-width:100% !important;width:100% !important;} .form-columns-1 {width:100% !important;} fieldset.form-columns-2 .input ,fieldset.form-columns-1 .input {margin-right:0 !important;} fieldset.form-columns-2 > div {width:49% !important;margin-right:2%;} fieldset.form-columns-2 > div:last-child {margin-right:0;width: 49.002% !important;} fieldset.form-columns-1 .hs-input {width:100% !important;} /*** TRooInbound Custom Class ***/ /* background */ .backg-img {background-size:cover;background-position:center center;background-repeat:no-repeat;} .backg-img-fixed {background-size:cover;background-position:center center;background-repeat:no-repeat;background-attachment:fixed;} .backg-color1 {} .backg-color2 {} /* postition */ .pos-relative {position:relative;z-index:1;} /* background overlay */ .bg-overlay {position:relative;z-index:1;} .bg-overlay:after {content:"";background-color:rgba(55,55,55,0.4);left:0;top:0;width:100%;height:100%;z-index:-1;position:absolute;} .primary-color-overlay {background-color:#e2211c;left:0;top:0;width:100%;height:100%;z-index:-1;position:absolute;opacity:0.9} /* text align */ .txt-center {text-align:center;} .txt-left {text-align:left;} .txt-right {text-align:right;} /* grid with float */ .col-float-2 {width:50%;float:left} .col-float-3 {width:33.33%;float:left} .col-float-4 {width:25%;float:left} /* grid with display inline */ .dis-inline-outer {font-size:0;} .col-dis-2 {width:50%;display:inline-block;vertical-align:top;} .col-dis-3 {width:33.33%;display:inline-block;vertical-align:top;} .col-dis-4 {width:25%;display:inline-block;vertical-align:top;} /*** Grid with some space display inline-block***/ .dis-outer-flex > span {font-size:0;} .col-dis-space-2 {width:48.5%;display:inline-block;vertical-align:top;margin-right:3%;} .col-dis-space-3 {width:32%;display:inline-block;vertical-align:top;margin-right:2%;} .col-dis-space-4 {width:23.5%;display:inline-block;vertical-align:top;margin-right:2%;} .dis-outer-flex .col-dis-space-2:nth-of-type(2n),.dis-outer-flex .col-dis-space-3:nth-of-type(3n), .dis-outer-flex .col-dis-space-4:nth-of-type(4n) {margin-right:0;} .dis-outer-flex span > .col-dis-space-2:nth-of-type(2n),.dis-outer-flex span > .col-dis-space-3:nth-of-type(3n), .dis-outer-flex span > .col-dis-space-4:nth-of-type(4n) {margin-right:0;} /*** Grid with some space display inline-block***/ .col-float-space-2 {width:48.5%;margin-right:3%;float:left;margin-bottom:25px;} .col-float-space-3 {width:32%;margin-right:2%;float:left;margin-bottom:25px;} .col-float-space-4 {width:23.5%;margin-right:2%;float:left;margin-bottom:25px;} .dis-outer-flex > span > div:nth-of-type(2n) .col-float-space-2,.dis-outer-flex > span > div:nth-of-type(3n) .col-float-space-3, .dis-outer-flex > span > div:nth-of-type(4n) .col-float-space-4 {margin-right:0;} .dis-outer-flex span > .col-float-space-2:nth-of-type(2n),.dis-outer-flex span > .col-float-space-3:nth-of-type(3n), .dis-outer-flex span > .col-float-space-4:nth-of-type(4n) {margin-right:0;} /* display */ .dis-none {display:none !important;} .dis-none-mob {} .dis-none-desk {display:none !important;} /* Ul li no bullet */ div.no-bullet ul {margin:0;padding:0;line-height: 0;} div.no-bullet ul li {list-style:none;margin:0;} ul.no-bullet {margin:0;padding:0;line-height: 0;} ul.no-bullet li {list-style:none;margin:0;} /* Section Title */ .hs-title h2 {color:#e2211c; font-family: 'Open Sans', Arial, sans-serif;font-weight:600;margin-bottom:30px} h2.cm-title {color:#e2211c;font-family: 'Open Sans', Arial, sans-serif;font-weight:600;margin-bottom:30px} /* CTA */ a.btn {background-color:#e2211c; color: #fff; padding: 12px 40px; display: inline-block; border-radius: 25px; line-height: normal; font-size:16px;text-transform:uppercase; margin-top:40px;font-weight: 600;} .btn-div a {background-color: #e2211c; color: #fff; padding: 12px 40px; display: inline-block; border-radius: 25px; line-height: normal; font-size:16px;text-transform:uppercase; margin-top:40px;font-weight: 600;} /* social UL Li */ ul.social-iicon {text-align:center;} ul.social-iicon li {display:inline-block;margin-right:15px;} ul.social-iicon li:last-child {margin-right:0;} ul.social-iicon li a {font-size:20px;color:#e2211c ;} ul.social-iicon li a i {} /* image responsive */ .image-full-size > img {width:100%;} .overflow-hid {overflow:hidden;} .overflow-vis {overflow:visible;} /* 100vh height */ .full-screen-bg {height:100vh !important;} /* text style */ .txt-uppercase {text-transform:uppercase;} .txt-underline {text-decoration:underline;} /* background color */ .bg-primary {background-color:#e2211c;} /* extra */ hr.hr-white { border: 0; border-top: 2px solid #fff; width: 140px; margin: 25px auto 18px; } /* Owl Slider control */ .testimonialll-slider .owl-controls {text-align:center;position:relative;top:-30px;} .owl-dot {display:inline-block;} .owl-dot span { width: 10px; height: 10px; border-radius: 50%; background: #e2211c ; left: 0; top: 0; display: block; margin:3px } .owl-dot.active span {background-color:#333;} /* padding */ .padding-140tb {padding:140px 0;} .padding-140t {padding:140px 0 0;} .padding-140b {padding:0 0 140px;} .padding-50t {padding:50px 0 0;} .padding-50b {padding:0 0 50px;} .padding-50tb {padding:50px 0;} /* margin */ .margin-15b {margin-bottom:15px;} .margin-15t {margin-top:15px;} .margin-15tb {margin-top:15px;margin-bottom:15px;} .margin-20b {margin-bottom:20px;} .margin-20t {margin-top:20px;} .margin-20tb {margin-top:20px;margin-bottom:20px;} .margin-25b {margin-bottom:25px;} .margin-25t {margin-top:25px;} .margin-25tb {margin-top:25px;margin-bottom:25px;} .margin-30b {margin-bottom:30px;} .margin-30t {margin-top:30px;} .margin-30tb {margin-top:30px;margin-bottom:30px;} .margin-40b {margin-bottom:40px;} .margin-40t {margin-top:40px;} .margin-40tb {margin-top:40px;margin-bottom:40px;} .text-primary { color:#e2211c!important; } .text-secondary { color:#0e1d61!important; } /************************ Navigation Changes *************************/ @media only screen and (min-width: 1024px){ .tri-menu { background:#0e1d61; position:relative; padding:2rem; } .blue-extension { position: relative; } .blue-extension:after { content:''; position: absolute; width: 50%; height:100%; background:#0e1d61; top:0; z-index:-1; right:0; } } .tri-menu-main > .row-fluid-wrapper > .row-fluid {display:flex;align-items: center;} .tri-menu .hs-menu-wrapper ul {} .tri-menu .hs-menu-wrapper ul li {margin-bottom:0;} .tri-menu .hs-menu-wrapper ul li a {font-size: 14px; text-transform: uppercase; } .tri-menu .hs-menu-wrapper > ul {} .tri-menu .hs-menu-wrapper > ul > li.hs-menu-depth-1 {margin-right: 20px;position:relative;padding-bottom:20px} .tri-menu .hs-menu-wrapper > ul > li.hs-menu-depth-1:last-child {margin-right:0;} .tri-menu .hs-menu-wrapper > ul > li.hs-menu-depth-1:after {background-color:#e2211c;content:"";position:absolute;width:100%;height:6px;left:0;bottom:-10px;visibility:hidden;opacity:0;transition:all 0.5s ease;} .tri-menu .hs-menu-wrapper > ul > li.hs-menu-depth-1.hs-item-has-children:hover:after {opacity:1;visibility:visible;} .tri-menu.custom-menu-primary .hs-menu-wrapper>ul {margin-top:20px;} .tri-menu .hs-menu-wrapper > ul > li.hs-menu-depth-1 > a {font-size: 14px; text-transform: uppercase; color:#e2211c;} .tri-menu .hs-menu-wrapper > ul > li.hs-menu-depth-1 > ul {} .tri-menu .hs-menu-wrapper > ul > li.hs-menu-depth-1 > ul > li.hs-menu-depth-2 {} .tri-menu .hs-menu-wrapper > ul > li.hs-menu-depth-1 > ul > li.hs-menu-depth-2 > a {font-size: 14px; text-transform: none; padding: 4px 0;margin:5px 0;} .tri-menu .hs-menu-wrapper > ul > li.hs-menu-depth-1 > ul > li.hs-menu-depth-2 > ul {} .tri-menu .hs-menu-wrapper > ul > li.hs-menu-depth-1 > ul > li.hs-menu-depth-2 > ul > li.hs-menu-depth-3 {} .tri-menu .hs-menu-wrapper > ul > li.hs-menu-depth-1 > ul > li.hs-menu-depth-2 > ul > li.hs-menu-depth-3 > a {font-size: 14px; text-transform: uppercase; } /***** Others Things of Headers ***********/ .tri-top-menu { background-color:#e2211c; padding:12px 0; } .fa-bold { -webkit-text-stroke: 1px #fff; color: #fff; } .text-bold { font-weight: bold; } .tabber-content { overflow: hidden; } .tri-top-menu a i {margin-right:8px;} .tri-top-menu a {margin-right:10px;color:#ffffff;} .tri-top-menu a:last-child {margin-right:0;} .tri-menu-social {text-align:right;} .tri-menu-social .fa { font-size:21px; } .custom-menu-primary .hs-menu-wrapper > ul ul {background: #e2211c;left: 0 !important; top: 46px; padding: 15px; } /* .tri-menu-main {padding: 15px 0;} */ /* .tri-menu {padding-top:15px} */ .tri-menu .hs-menu-wrapper > ul > li.hs-menu-depth-1 { margin-right:1.2rem; } .tri-menu .hs-menu-wrapper > ul > li.hs-menu-depth-1 > a { font-size: 12px; text-transform: uppercase; color: #ffffff; font-weight: 600; } @media only screen and (min-width: 1170px){ .tri-menu .hs-menu-wrapper > ul > li.hs-menu-depth-1 { margin-right:1.4rem; } .tri-menu .hs-menu-wrapper > ul > li.hs-menu-depth-1 > a { font-size: 14px; } } .tri-menu .hs-menu-wrapper > ul {padding-left:0;} .tri-menu .hs-menu-wrapper>ul>li.hs-menu-depth-1>a:hover {color:#ffffff;} /************ Simple Normal Banner with Full Background Image *******************/ .nBanner-bgimg {height:300px;} @media only screen and (min-width: 600px){ .nBanner-bgimg {height:540px;} } .interior .nBanner-bgimg {height:250px;} @media only screen and (min-width: 600px){ .interior .nBanner-bgimg {height:350px;} } .nBanner-bgimg h3 {color:#fff;font-weight:400;} .nBanner-bgcolor {background-color:#e2211c;color:#fff;height:300px;padding:40px 0;} .nBanner-slider .owl-nav img {display:none;} .nBanner-slider .owl-prev { position: absolute; width: 40px; height: 40px; left: 40px; top: 50%; transform: translate(-50%,-50%); background-image: url('https://3927798.fs1.hubspotusercontent-na1.net/hubfs/3927798/Your%20Home%20Template%20Pack/Website%20Pages%20Images/previous.png'); background-size: cover; background-position: center center; z-index: 10; } .nBanner-slider .owl-next { position: absolute; width: 40px; height: 40px; right: 40px; top: 50%; transform: translate(-50%,-50%); background-image: url('https://3927798.fs1.hubspotusercontent-na1.net/hubfs/3927798/Your%20Home%20Template%20Pack/Website%20Pages%20Images/forward.png'); background-size: cover; background-position: center center; z-index: 10; } .nBanner-bgimg .tbl-cell h1 { font-size: 23px; line-height: 1.15; font-weight: 700; color:#fff; } @media only screen and (min-width: 800px){ .nBanner-bgimg .tbl-cell h1 { font-size: 41px; } } @media only screen and (min-width: 1024px){ .nBanner-bgimg.txt-left .tbl-cell h1 { width:40%; } } /************* About History Section *******************************/ .tri-about-digit {margin-top: -101px;} .tri-about-digit .container-small {border-radius:45px;padding: 38px 0 28px;} .tri-about-digit .primary-color-overlay {border-radius:45px;} .six-box {color:#fff;} .six-box h3 {font-family:'Open Sans', Arial, sans-serif; font-weight:400} .six-box-inner {padding:30px 25px 25px;} .six-box-inner hr.hr-white {margin-top:0;} .single-img-icon {margin-bottom:11px;} .single-img-icon img {width:50px;} .single-img-icon i.fa {font-size:57px;} .single-text h6 {text-transform:uppercase;font-family:'Open Sans', Arial, sans-serif; font-weight:500;} /*************** Work Tab panel *************************************/ ul.work-tab-list { background-color: #e2211c; border-radius: 44px; box-shadow: 0 -2px 20px 0 rgba(0,0,0,.1); margin-bottom: -25px; position: relative; z-index: 10; margin-top: 25px; } ul.work-tab-list li { display: inline-block; width: 50%; text-align: center; } ul.work-tab-list li a {display:block;line-height:normal;color:#fff;text-transform: uppercase;font-family:'Open Sans', Arial, sans-serif; font-weight:700;padding: 25px 0;font-size: 20px;border-radius:44px} ul.work-tab-list li a:hover {background-color:#fff;color:#e2211c;} ul.work-tab-list li.active a{background-color:#fff;color:#e2211c;} .work-tab-list li:last-child { display: none; } /*************** Simple Hover Box V1 *****************************************/ .tri-workbox-flex {} .hover-content {position:absolute;left:0;top:0;width:100%;height:100%;background-color:rgba(55,55,55,0.6);color:#fff;padding: 30px;transition:all 0.5s ease;opacity:0;visibility:hidden;} .cm-hoverbox1:hover .hover-content {visibility:visible;opacity:1;} .cm-hoverbox1 {cursor:pointer;} .hover-box-image img{width:100%;} /*************** Animated Hover Box V2 *****************************************/ .cm-hoverbox2 img {transition: all 0.2s ease-in; width:130%; max-width: none; } @media screen and (min-width:800px) { .cm-hoverbox2 img { width:100%; } } .cm-hoverbox2 {overflow:hidden;cursor:pointer; } @media screen and (min-width:800px) { .tab-pane { display: flex; align-items: center; justify-content: center; } .tabber-content .tab-pane > a { width: 50%; height: 100%; display: block; } .tabber-content .tab-pane img { display: block; max-width: none; width:auto; } } /* .cm-hoverbox2-label { background-color: rgba(255, 255, 255, 0.8); position: absolute; bottom:40px; left:0; right:0; width:200px; color:#e2211c; text-transform:uppercase; margin: 0 auto; font-weight:700; font-size:24px; padding:8px 0; } */ .cm-hoverbox2-label { display: none; } .view-second .mask { } .cm-hoverbox2 .hover-content2 { width: 100%; height: 100%; position: absolute; overflow: hidden; top: 0; left: 0; color: #fff; padding: 30px; text-align: left; } @media screen and (max-width:800px) { #tab-0 .cm-hoverbox2 .hover-content2 { padding-top: 50px; } } .cm-hoverbox2 .hover-content2 p:first-child { text-align: center; display: none; } @media screen and (min-width:800px) { .cm-hoverbox2 .hover-content2 p:first-child { display: block; } } /****************** Client Testmonial V1 *********************************/ .client-testimonial-v1.0 {} .client-testimonial-inner {padding:60px 0;margin-top: 17px;} .testimonial-box { max-width: 800px; margin: 0 auto;/* padding: 100px 0;*/} .testimonial-box { position: relative; } .testimonial-box:after { content: " "; position: absolute; background: rgba(255, 255, 255, 0.8); display: block; z-index: -1; height: 120%; width: 100%; top: 0; left: 0; } @media screen and (min-width:800px) { .testimonial-box:after { height: 160%; width: 130%; border-radius: 30px; top: -40%; left: -15%; } } .testimonial-bubble {text-align: left;margin-bottom: 33px;} .testimonialv1-flex h2 { color:#e2211c; } .testimonial-client {justify-content:flex-end;} .c-img img {border-radius: 50%;width:30px !important;} .c-detail {padding-left: 18px;} .c-detail > h6 {margin: 0 0 2px;} .c-detail > p {font-weight: 400;margin: 0;} .testimonial-bubble em:before { content: ''; position: absolute; left: -70px; top: -50px; width: 60px; height: 60px; background: url(//www.janusintl.com/hubfs/raw_assets/public/asta-theme/images/quote-left.svg) no-repeat } @media screen and (min-width:800px) { .testimonial-bubble em:before { top: -45px; } } .testimonial-client { position: relative; } .testimonial-client:before { content: ''; position: absolute; right: -80px; top: -40px; width: 60px; height: 60px; background: url(//www.janusintl.com/hubfs/raw_assets/public/asta-theme/images/quote-right.svg) no-repeat; } @media screen and (min-width:800px) { .testimonial-client:before { top: -20px; } } .testimonialv1-flex .owl-carousel .owl-item { display:flex;align-items:center;justify-content:center;} @media screen and (min-width:800px) { .testimonialv1-flex .owl-carousel .owl-item {height:400px;} } @media screen and (max-width:1200px) { .testimonial-client:before { right: 0; } .testimonial-client { justify-content: flex-start; } } .testimonial-bubble em {font-size:20px;} /******************* Recent Post 6 Grid V1*************************************/ .recent-post-section {margin-top: 34px;} .recent-item {width:39.5%;display:inline-block;vertical-align:top;margin-right:1.2%;margin-bottom:15px;} .recent-item-image {height:330px;position:relative;overflow:hidden;} .recent-img-bg {height:100%;} .recent-body { position: absolute; bottom: 0; left: 0; padding: 20px 30px 20px; width: 100%; -webkit-transform: translate3d(0,20px,0); transform: translate3d(0,20px,0); -webkit-transition: .3s; -o-transition: .3s; transition: .3s; background-color:rgba(36,39,35,0.8)} .recent-img-bg-color {opacity:0;position: absolute; top: 100%; left: 0; height:0; width: 100%; -webkit-transition: .3s; -o-transition: .3s; transition: .3s; background-color:rgba(36,39,35,0.8)} /**/ .recent-item:hover .recent-body {-webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0);background-color:transparent;} .recent-item:hover .recent-img-bg-color {opacity:1;top:0;height:100%;} .recent-item:hover .recent-post-title {color:#fff;} .recent-item:nth-of-type(2) {width:25%;} .recent-item:nth-of-type(3) {width:33%;margin-right:0;} .recent-item:nth-of-type(4) {width:25%;} .recent-item:nth-of-type(5) {width:33%;} .recent-item:nth-of-type(6) {margin-right:0;} .recent-items-part2.recent-item:nth-of-type(1) {width:25%;margin-right:1.5%;} .recent-items-part2.recent-item:nth-of-type(2) {width:47%;margin-right:1.5%;} .recent-items-part2.recent-item:nth-of-type(3) {width:25%;margin-right:0;} .recent-post-section h3 {text-align:center;text-transform:uppercase;} .recent-body {color:#fff;} .recent-post-title {font-size:18px;font-weight:600;font-family:'Open Sans', Arial, sans-serif;margin-bottom: 5px;transition:.3s} .recent-date {font-size:12px;margin-bottom: 15px;} .recent-boddy {margin-top:5px;height:0;transition:.3s;} .recent-boddy p,.recent-boddy i,.recent-boddy h1,.recent-boddy h2,.recent-boddy h3,.recent-boddy h4,.recent-boddy h5,.recent-boddy h6,.recent-boddy a,.recent-boddy span, .recent-boddy strong ,.recent-boddy em ,.recent-boddy li,.recent-boddy ul, .recent-boddy p span , .recent-boddy p storng {font-weight:400;margin:0;padding:0;float:none;color: #fff;font-size: 14px;font-style:normal;line-height:1.3;display:inline;list-style:none;text-transform: lowercase;font-family: 'Open Sans', Arial, sans-serif;} .recent-item:hover .recent-boddy {height:auto;} /******************* Blog Subsciption Form V1 **************************************/ .blog-subscription-v1 {background-color:#e2211c; padding:50px 0} .blog-subscription-v1 .widget-type-blog_subscribe > div.cell-wrapper > span {display:flex;align-items:center;} .blog-subscription-v1 .widget-type-blog_subscribe h3 {text-transform: uppercase; color: #fff; display: inline-block; margin: 0; font-family:'Open Sans', Arial, sans-serif;font-weight:700;width:45%; } .blog-subscription-v1 .widget-type-blog_subscribe > div.cell-wrapper > span > div {width:55%;position:relative;} .blog-subscription-v1 .hs-form-field {margin:0;} .blog-subscription-v1 .hs-form-field > label {display:none;} .blog-subscription-v1 .widget-type-blog_subscribe .hs_email input {border:0;border-radius: 25px;padding: 0 150px 0 22px;height:48px;background: #fff;} .blog-subscription-v1 .widget-type-blog_subscribe .hs_submit {position: absolute; right: 0; width: 148px;top:0;} .blog-subscription-v1 .widget-type-blog_subscribe .hs_submit input {text-transform: uppercase;color: #000;font-size: 20px; background: transparent;background: #e2211c; margin:0;border-radius: 5px;font-weight: 600;width: 100%; color: #fff; padding: 7px; opacity: 0.8; border-radius: 25px; height: 48px;font-size: 16px; } .blog-subscription-v1 ul.hs-error-msgs {position:absolute;color:#fff;} .blog-subscription-v1 ul.hs-error-msgs label {color:#fff;} .hs_error_rollup {display:none !important;} .blog-subscription-v1 input::-webkit-input-placeholder { color: #c5c5c5; opacity:1;} /* WebKit browsers */ .blog-subscription-v1 input:-moz-placeholder { color: #c5c5c5; opacity:1;} /* Mozilla Firefox 4 to 18 */ .blog-subscription-v1 input::-moz-placeholder { color: #c5c5c5; opacity:1;} /* Mozilla Firefox 19+ */ .blog-subscription-v1 input:-ms-input-placeholder { color: #c5c5c5; opacity:1;} /* Internet Explorer 10+ */ .blog-recent-posts h2 { color: #e2211c; } .blog-post__body a { font-size: inherit; color: #e2211c!important; } .blog-index__post-content h2 { color: #e2211c; text-align:left; font-size:26px!important; } .blog-index__post-content h2 ~ h2 { text-transform:normal; text-align:left; font-size:16px!important; } .blog-index__post-content p, .blog-index__post-content p span { font-size:16px!important; } .blog-index__post-content a { color:inherit; font-size: inherit!important; } /************************************************************************************************************ our work page ***************************************************************************/ /***************** Work Box V3 *******************************/ .cm-hoverbox3.col-float-3 {width:31.5%;margin-right:2.75%;margin-bottom:30px;} .cm-hoverbox3 {overflow:hidden;cursor:pointer;} .work-page.tri-workbox-flex > span > div:nth-of-type(3n) .cm-hoverbox3.col-float-3 {margin-right:0;} .hover-content3 {position: absolute; bottom: 0; left: 0; padding: 30px 30px 50px; width: 100%; -webkit-transform: translate3d(0,98px,0); transform: translate3d(0,98px,0); -webkit-transition: .3s; -o-transition: .3s; transition: .3s;color:#fff;background-color: rgba(12, 19, 27, 0.6);} .cm-hoverbox3:hover .hover-content3 {-webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0);} /******************** Work tab fix on work page ******************/ ul.work-tab-list.work-page {box-shadow: 0 20px 60px 0 rgba(0,0,0,.2); margin-bottom: 40px; margin-top: -40px;} /******************************************************************************************************************** Blog Design 1 ******************************************************************************************/ /*** Blog Listing Page Background image ***/ .bg-list {display:none !important;} .blog-banner-main > div.row-fluid-wrapper {display:table;width:100%;height:100%;} .blog-banner-main > div.row-fluid-wrapper > div.row-fluid {display:table-cell;vertical-align:middle;} /********* Blog Listing ****************/ .bloog-listing {} /********** Blog list box *****************/ .post-listing {font-size:0;} .post-item {display:inline-block;vertical-align:top;width:48%;margin-left:0;position:relative;margin-bottom:30px;overflow: hidden;cursor:pointer;transition:all 0.5s ease;border-radius:5px;} .full-width-blog .post-item {width:100%;height:auto !important} .post-item:hover {-webkit-box-shadow: 0 6px 30px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0 6px 30px rgba(0, 0, 0, 0.1); -o-box-shadow: 0 6px 30px rgba(0, 0, 0, 0.1); box-shadow: 0 6px 30px rgba(0, 0, 0, 0.1);} .firstl-page .post-item:nth-of-type(even) {margin-right:4%;} .otherl-page .post-item:nth-of-type(odd) {margin-right:4%;} .firstl-page .post-item:first-child {width:100%;margin-left:0;} .full-width-blog .firstl-page .post-item:nth-of-type(even) {margin-right:0;} .full-width-blog .otherl-page .post-item:nth-of-type(odd) {margin-right:0;} .post-listt-image {position:relative;} .post-listt-image img {} .post-listt-image .post-listt-image-bg {height:345px;transition:all 0.5s ease;} .post-item:first-child .post-listt-image .post-listt-image-bg {height:355px;} .list-img-bg-only {height:100%;transition:all 0.5s ease;} .posst-content {background-color:#f1f1f1;padding:21px 26px 34px;position:relative;} .post-listt-title h2 {text-align:left;text-align: left; line-height: normal; display: block; font-size: 0;margin-bottom:25px;} .post-listt-title h2 a {font-size:24px;line-height:1.2;color:#000;text-transform:capitalize;font-family:'Open Sans', Arial, sans-serif;font-weight:600;} .post-listt-title h2 a:hover {color:#e2211c;} .posst-listt-author {} .posst-listt-author a {} .posst-listt-author a:hover {} .posst-listt-date { background-color: #e2211c; padding: 10px 5px; position: absolute; top: 7px; right: 7px; font-size: 14px; border-radius: 50%; color: #fff; text-align:center;width:65px;height:65px;line-height:20px} .posst-listt-date > span {display:block;line-height:normal;} .posst-listt-body p,.posst-listt-body i,.posst-listt-body h1,.posst-listt-body h2,.posst-listt-body h3,.posst-listt-body h4,.posst-listt-body h5,.posst-listt-body h6,.posst-listt-body a,.posst-listt-body span, .posst-listt-body strong ,.posst-listt-body em ,.posst-listt-body li,.posst-listt-body ul, .posst-listt-body p span , .posst-listt-body p storng {font-weight:400;margin:0;padding:0;float:none;color: #333;font-size: 15px;font-style:normal;line-height:1.1;display:inline;list-style:none;text-transform: lowercase;font-family: 'Open Sans', Arial, sans-serif;} .posst-listt-topic { background-color: #e2211c; padding: 5px 35px;position: absolute; bottom: 21px; left: 0; text-align:center;line-height: normal; } .posst-listt-topic a.toppic-link {color: #fff;font-size:15px;font-weight:600;line-height:20px;display:inline-block;} .posst-listt-topic a.toppic-link:hover{} .posst-listt-readmore {position:absolute;bottom:-45px;width:100%;text-align:center;transition:all 0.5s ease;} .posst-listt-readmore a {display:block;background-color: #e2211c;color:#fff;width:100%;padding:12px;text-align:center;font-size:15px;font-weight:600;} .post-item:hover .posst-listt-readmore {bottom:0;} .post-item:hover .post-listt-image-bg .list-img-bg-only {transform:scale(1.07);} .post-item:hover .post-listt-title h2 a {color:#e2211c;} .posst-social-share {} .posst-social-share ul {} .posst-social-share ul li {} .posst-social-share ul li a {} h2.postt-all {} /**** Blog list filter module ****/ .posst-tag-filter {padding:25px;background-color:#f1f1f1;border-radius:5px} .posst-tag-filter h3 {color:#e2211c;margin-bottom:23px} .posst-tag-filter ul {margin:0;padding:0;} .posst-tag-filter ul li {list-style:none;margin-bottom:15px;} .posst-tag-filter ul li:last-child {margin:0;} .posst-tag-filter ul li a {text-transform:uppercase;color:#333;font-size:16px;font-weight:600;} .posst-tag-filter ul li a span.filter-link-count {display:none;} .posst-tag-filter ul li a:hover {color:#e2211c;} /****** Blog Post ****/ .blog-pagination a {font-size: 16px; color: #fff; font-weight: 600; background-color: #0e1d61; border:none; padding: 10px 30px; border-radius:25px;} a.next-posts-link {float:right;} a.previous-posts-link {float:left;} .blog-pagination svg { vertical-align: middle; fill: #fff; } .blog-pagination__link--active, .blog-pagination__link:hover { border:none; background-color: #e2211c !important; } .blog-header form input[type=submit], .blog-header form .hs-button { background-color: #e2211c border-color: #e2211c } /************** Image Hubspot CTA ************/ .hs-cta-imgg.widget-type-cta a {background-color: transparent; padding: 0; border-radius: 0;} /********* Blog Subscription form ************/ .posst-subscription {} /******* Recent post **************/ /******* populer post **************/ .pop-post-listing {padding:25px;background-color:#f1f1f1;margin-bottom:30px;border-radius:5px} .pop-header {color:#e2211c;margin-bottom:23px} .pop-post-listing .pop-item {margin-bottom: 19px;} .pop-post-listing .pop-item:last-child {margin:0;} .pop-post-listing .pop-item .pop-image {width:24%;height:57px;float:left;} .pop-post-listing .pop-item .pop-image .pop-img-bg {width:100%;height:100%;} .pop-post-listing .pop-item .pop-content {width:71%;margin-left:5%;float:left;} .pop-post-listing .pop-item .pop-content a.pop-title {font-size:16px;font-weight:600;color:#000;} .pop-post-listing .pop-item .pop-content a.pop-title:hover {color: #e2211c;} /********* Side bar image CTA *************/ /******** RSS Feed Module *************/ /******************************************** Topic page ****************************************************/ .toppic-page-title {} /******************************************** author page ****************************************************/ .hs-author-profile {} h2.hs-author-name {} .hs-author-avatar img {} .hs-author-bio {} .hs-author-social-section {} .hs-author-social-section .hs-author-social-links a {} .hs-author-social-section .hs-author-social-links a i {} h3.hs-author-listing-header {} /************************************************************************************************************** Blog post page ******************************************************************************/ .blog-post-banner {text-align:center;height:685px;} .poost-topic-main a {color: #fff; font-size: 16px; font-weight: 600; line-height: 20px; display: inline-block;background-color: #e2211c; padding:8px 25px;} .blog-poost-titile h1 > span {font-size:48px;color:#fff;line-height:1.3;} .blog-poost-titile h1 {font-size:0;} .blog-post-banner .poost-topic-main { margin-bottom: 28px; } .blog-post-banner .post-date {display:block;} .blog-post-banner .post-by {color:#fff; font-size:24px;line-height:1.2;} .blog-post-banner .author-link {color:#fff;font-weight:600;font-size:24px;line-height:1.2;margin-bottom:10px;display: inline-block;} .blog-post-banner .post-date {color:#fff; font-size:24px;line-height:1.2;} .blog-poost-titile {margin-bottom:25px;} .blog-post-banner h5.share-header { text-align: center; text-transform: uppercase; font-size: 14px; color: #fff; letter-spacing: 1.5px; margin: 45px 0 10px; } .blog-post-banner ul { text-align: center; margin: 10px 0 0; padding: 0; } .blog-post-banner ul li { display: inline-block; vertical-align: top; list-style: none; margin: 0; margin-right: 15px; } .blog-post-banner ul li a { width: 40px; height: 40px; line-height: 40px; border-radius: 50%; color:#fff; background-color: #e2211c; display: inline-block; text-align: center; font-size:18px} .blog-post-banner ul li:last-child {margin-right:0;} .hs-blog-post .blog-list-leftsection {width:100% !important;} .hs-blog-post .blog-list-sidebar {display:none!important;} .poost-page-body {text-align:center;} .poost-page-body h1 {margin:40px 0;} .poost-page-body h2 {margin:40px 0;display:block;} .poost-page-body h2:first-child {margin-top:0;} .poost-page-body h3 {margin:25px 0;} .poost-page-body h4 {margin:25px 0;} .poost-page-body h5 {margin:25px 0;} .poost-page-body h6 {margin:25px 0;} .poost-page-body strong {font-weight:700;} .poost-page-body ul ,.poost-page-body ol { margin:35px auto;padding-left:30px;text-align:left;max-width:770px} .poost-page-body ul li {list-style-type:disc;} .poost-page-body ol li {list-style-type:decimal;} .poost-page-body li {list-style-position:outside;line-height:1.5;} .poost-page-body li:last-child {margin-bottom:0;} .poost-page-body p {line-height:1.5;max-width:770px;margin:0 auto 30px;text-align:left;} .poost-page-body p > span {} .poost-page-body em {margin:25px 0;color:#e2211c;} .poost-page-body p > img {width:100%;margin-bottom:30px;} .poost-page-body img {width:100%;max-width:770px;margin-bottom:30px;} .poost-page-body span {line-height:1.5;} .poost-page-body a {line-height:1.5;color:#e2211c;text-align:left} .poost-page-body a:hover {color:#e2211c ;} .poost-page-body blockquote{display:block;padding: 80px 20px;margin: 100px auto;position: relative;border-top: 1px solid #d1d1d1;border-bottom: 1px solid #d1d1d1;max-width:770px;} .poost-page-body blockquote * {margin:0;max-width:100%;font-size: 26px; line-height: 1.2; font-style: italic;} .poost-page-body blockquote::before , .poost-page-body blockquote::after { content:url('https://3927798.fs1.hubspotusercontent-na1.net/hubfs/3927798/Your%20Home%20Template%20Pack/Blog%20Template/queats.png');background-repeat:no-repeat;background-size:15px; font-size: 60px; font-weight: bold; position: absolute; left: 0; top: -43px; right: 0; background-color: #e2211c; width: 70px; height: 70px; color: #fff; margin: 0 auto; border-radius: 50%; line-height: 0; padding:21px} .poost-page-body blockquote::after { content:url('https://3927798.fs1.hubspotusercontent-na1.net/hubfs/3927798/Your%20Home%20Template%20Pack/Blog%20Template/queats_down.png'); bottom:-43px;top:auto;} .poost-page-body .hs-cta-wrapper a {background-color: #e2211c; color: #fff; padding: 12px 40px; display: inline-block; border-radius: 25px; line-height: normal; font-size:16px;text-transform:uppercase; margin-top:40px;} /***************** Related post *************/ .related-post-main {font-size:0;} .related-post-main .post-item:first-child .post-listt-image .post-listt-image-bg {height:345px;} .related-post-main .post-item {width:32%;margin-right:2%;} .related-post-main .post-item:last-child {margin-right:0;} .reelated-section h2.cm-title {margin-bottom:35px;} /************************************************************************************************************************************** FAQ page V1 *****************************************************************************************************/ .faq-v1flex {margin-top: 36px !important;} .accordion {border-bottom: 1px solid #efefef;padding:0 20px;margin-bottom: 22px;} .accordion_header {position:relative;padding:25px 0 10px;cursor:pointer;} .accordion_header h3 {color:#e2211c;margin-bottom:0;} .accordion_icon { position: absolute; right: 0; height: 25px; width: 25px; top: 0; color: #1f9278; bottom: 0; display: inline-block; text-align: center; font-size: 20px; margin: auto; } .accordion_content {padding:20px 0 35px;padding-right: 80px;font-size:16px;} .hide-f {display:none;} .accordion_group.expanded .hide-f {display:block;} .accordion_group.expanded .hide-s {display:none;} .FAQ-cta-section {background-color:#e2211c;} .FAQ-cta-section .cm-hs-cta a {background-color: #fff;color: #e2211c;} .faq-ask-text {font-size:30px;font-family:'Open Sans', Arial, sans-serif;font-weight:500;color:#fff;line-height:1.3} .faq-ask-img img {max-width: 220px; margin-top: -20px;} .faq-ask-cta.cm-hs-cta a {margin-top:0;} .asta-accordion { margin-top: 2rem; } .asta-accordion h2 { text-align: left; color:#e2211c; font-size:22px; padding-left:0.5rem; } .hs-accordion__item { margin: .5em; box-shadow: 0 2px 8px rgba(0,0,0,.4); border-radius: 6px; transition: .4s; overflow: hidden; } .hs-accordion__item:hover { position: relative; z-index: 1; box-shadow: 0 2px 10px -2px rgba(0,0,0,0.2), 0 20px 60px -10px rgba(0,0,0,.3); } .hs-accordion__item button { display: block; width: 100%; font-size: 1em; padding: 1em 3em 1em 2em; cursor: pointer; border-bottom: 1px solid #ddd; background-color: #0e1d61; -webkit-appearance: none; color: #fff; position: relative; text-align: left; font-family: inherit; border-radius:6px!important; } .hs-accordion__item button * { pointer-events: none; } .hs-accordion__item:last-of-type button { border-bottom-color: transparent; } .hs-accordion__item button:focus { outline: none; } .hs-accordion__item button:hover { filter: brightness(1.25); } .hs-accordion__item[aria-expanded=true] button { /* [aria-expanded=true] means accordion will be 'open' */ } .hs-accordion__item-icon { position: relative; } .hs-accordion__item-icon:before { content: "+"; position: absolute; height: 1.25em; width: 1.25em; left: -20px; top: 4px; color: #fff; font-weight: bold; } .hs-accordion__item[aria-expanded=true] .hs-accordion__item-icon:before { content: "−"; font-weight: bold; } .hs-accordion__item main { opacity: 0; max-height: 0; line-height: 1.6; display: block; } .hs-accordion__item[aria-expanded=true] main { opacity: 1; max-height: 100%; position: relative; background-color: #fff; } .hs-accordion__item-content { padding: 2em 10%; } .hs-accordion__item-content p { margin-top: 0; } .hs-accordion__item-content h3 { color: #0e1d61; } /************************************************************************************************************************************** Contact Us page V1 *****************************************************************************************************/ .asta-picture-gallery { display: -ms-flexbox; -ms-flex-wrap: wrap; -ms-flex-direction: column; -webkit-flex-flow: row wrap; flex-flow: row wrap; display: -webkit-box; display: flex; } .asta-picture-gallery .asta-picture-gallery__img { -webkit-box-flex: auto; -ms-flex: auto; flex: auto; width: 200px; margin: .5vw; } .asta-picture-gallery .asta-picture-gallery__img img { width: 100%; height: auto; } @media screen and (max-width: 400px) { .asta-picture-gallery .asta-picture-gallery__img { margin: 0; } .asta-picture-gallery { padding: 0; } } /************************************************************************************************************************************** Contact Us page V1 *****************************************************************************************************/ .contact-joinus-section h3 {color: #e2211c;margin-bottom: 30px;} .contact-joinus-section ul {} .contact-joinus-section ul li {margin-bottom:20px;} .contact-joinus-section ul li a {font-size:18px;color:#252525;font-weight:600} .contact-joinus-section ul li a:hover {color:#e2211c;} .contact-joinus-section ul li a i {color:#e2211c;font-size:30px} .contact-joinus-section ul li a span{margin-left:15px;} h3.form-title {color: #e2211c;margin-bottom:30px} /********************************************************************************************************************************** Team Module *******************************************************************************************/ /*** Team Module V1 ***/ .team-box ul.social-iicon {position: absolute; bottom: -100px; width: 100%;opacity:0;transition:all 0.5s ease;z-index:5;} .team-box ul.social-iicon li {margin-right:25px;} .team-box ul.social-iicon li a {font-size:30px;} .team-box {overflow:hidden;} .team-box-image.bg-overlay:after {z-index:1;opacity:0;transition:all 0.5s ease;} .team-box {cursor:pointer;} .cm-teambox1:hover .team-box-image.bg-overlay:after {opacity:1;} .cm-teambox1:hover .team-box-image ul.social-iicon {bottom:10px;opacity:1;} .team-content {padding:25px;background-color:#f1f1f1;} .team-rich p {margin:0;} /*********************************************************************************** About US page *****************************************************************************************/ .form-design02 h3.form-title {display:none;} .form-design02 {background-color:#EFEFEF;padding:80px 15px;} .form-design02 input, .form-design02 textarea, .form-design02 select {background-color:#fff;} .form-design02 input[type="submit"] {background-color: #e2211c;} .form-design02 .hs_submit {text-align:center;} .form-design02 form {max-width: 905px; margin: 0 auto;} .form-design02 .hs_file_upload .input {display:inline-block;position:relative;} .form-design02 div.hs-form-field.hs_file_upload > label {display:inline-block;} .form-design02 .hs_file_upload {display:flex;align-items:center;} .form-design02 div.hs-form-field.hs_file_upload > label { display: inline-block; margin: 0; font-weight: 600; margin-right: 15px; } .form-design02 .hs_file_upload .input:after { content: "Choose File"; color: #fff; background: #e2211c; width: 160px; padding:10px 15px; font-size: 15px; font-weight: 600; text-align: center; position: absolute; left: 0; top: 0; text-transform: uppercase; border-radius: 25px; } .form-design02 fieldset.form-columns-1 input[type=file].hs-input { opacity: 0; position: relative; z-index: 99; width: 160px !important; height: 43px;cursor: pointer;} .form-design02 input[type=file]:hover { color: #000000; background: rgba(68, 68, 68, 0.2); text-decoration: none; } /******************************************************************************************** Project Details Page V1 **************************************************************************/ .fech-box {height:640px;margin-bottom:30px;} .fech-box .container {height:100%;} .fech-details {height:100%;} .fech-box-inner {max-width:500px;} .fech-details { color: #fff; padding:20px;background: linear-gradient(to right,rgba(44, 152, 127,0.8) 35%,rgba(255,255,255,.2) 70%);} .fech-box.right-fech .fech-details{background: linear-gradient(to left,rgba(44, 152, 127,0.8) 35%,rgba(255,255,255,.2) 70%);} .fech-box.right-fech .fech-box-inner{margin: 0 0 0 auto;} .dis-outer-flex> span>div:last-child .fech-box {margin-bottom:0} .full-cta-section {padding:50px 0;} .full-cta-section .hs-cta-white a {margin-top:0;} .hs_set_a_date {text-align:center;margin-bottom:50px;} .hs_set_a_date .input {position:relative;margin:0 auto !important;} .hs_set_a_date .input input {opacity:0;position:relative;z-index:99;height:60px;cursor:pointer;} div.hs-form-field.hs_set_a_date > label {color: #e2211c;font-size: 20px;} .hs_set_a_date .input:after { content: "\f073"; font-family: FontAwesome; font-weight: normal; font-style: normal; margin: 0; position: absolute; font-size: 50px; top: 0; left: 0; right: 0; padding: 25px; color:#e2211c; } .hs_set_a_date .hs-datepicker { right: 0; max-width: 258px; margin: 0 auto; left:0;} .projct-amenities-box {margin-bottom:60px;text-align:center;} .projct-icon {text-align: center;width: 100%;height: 110px;} /********************************************************************************************************************* Team Page V2 **************************************************************************************************/ .team-content.team-hover-part {display:none;} .team-overlay-part {position: absolute; width: 100%; height: 100%; top: 0; z-index: 9999; left: 0;color:#fff;text-align:center;background-color: rgba(31, 146, 120,0.3);padding:50px;} .bg-color-green .bg-overlay:after {background: rgba(0,0,0,0.8);opacity:1;} .cross-btn {font-size: 50px; position: absolute; right: 10px; top: 10px; cursor: pointer;} .team-overlay-part ul.social-iicon {margin-top:25px;} .team-overlay-part ul.social-iicon li a { font-size: 25px; width: 40px; height: 40px; background: #fff; display: block; line-height: 40px; border-radius: 50%; } .op0-vi0-class {opacity:0;visibility:hidden;} .op0-vi0-class.op1-vi1-class {opacity:1;visibility:visible;} .cta-part-two {text-align:center;padding:100px 0;} .cta-part-two h2 {color:#fff;text-transform:uppercase;} /************************************************************************************************ Work Details Page V2 **************************************************************/ .work2-img-box {height:460px;} .work2-content { position: absolute; top: 50%; max-width: 200px; left: -20px; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); -ms-transform: translateY(-50%); background: #e2211c; text-align: center; color: #fff; padding: 50px 10px; } .work2-flex >span > div:nth-of-type(odd) .fa-chevron-left , .odd .fa-chevron-left {display:none;} .work2-flex >span > div:nth-of-type(even) .fa-chevron-right , .even .fa-chevron-right {display:none;} .work2-flex >span > div:nth-of-type(even) .work2-content , .even .work2-content { right:-20px;left:auto;} .work2-details {font-size:14px;line-height: 1.4;} .work2-content a { color: #1f9278; text-align: center; width: 40px; height: 40px; line-height: 40px; background-color: #fff; display: block; margin: 40px auto 0; border-radius: 50px; font-size: 20px; } /******************************************************************************** Testimonials Page V2 **************************************************************/ .left-col,.right-col {float:left;} .testimonial-img {width:20%;text-align:center;} .testimonial-img img {max-width: 150px;border-radius: 50%;height: 150px;object-fit: cover;object-position: top center;} .testimonial-content {width:80%;border-left:2px solid #e5e5e5;padding: 25px;} .testimonial2-col-box {margin-bottom:50px;} .testi-fname {font-style:italic;font-weight:700;} .cta-load-more {text-align:center;} .home-seller-module {display:none;} /********************************************************************************** Error Page ***********************************************************************************/ .error404-section {background-color:#DCE3E9;} .error404-section .cm-hs-cta a {margin-top:0;} .err404-image img {max-width:50%;} .err404-image {text-align:center} /**************************************************************************************** homepage v2 *********************************************************************************/ .video-banner-section {height: 100%;position: absolute;top: 0;width: 100%;} .email-prefs .item .item-inner.selected {background-color:#e2211c33;} /*--------------- Responsive media query style start here ----------------*/ @media (max-width:1300px) { .custom-menu-primary .hs-menu-wrapper > ul ul {left: -40px !important;} .cm-hs-cta a , .widget-type-cta a , .hs-cta-wrapper a , .btn-div a , a.btn {margin-top:20px;padding: 10px 30px;font-size: 14px;} ul.work-tab-list li a {padding: 18px 0;font-size: 18px;} /* grid with float */ .col-float-4 {width:33.33%;} /* grid with display inline */ .col-dis-4 {width:33.33%;} /*** Grid with some space display inline-block***/ .col-dis-space-4 {width:32%;margin-right:2%;} .dis-outer-flex .col-dis-space-4:nth-of-type(4n) {margin-right:2%;} .dis-outer-flex .col-dis-space-4:nth-of-type(3n) {margin-right:0;} /*** Grid with some space display inline-block***/ .col-float-space-4 {width:32%;margin-right:2%;} .dis-outer-flex > span > div:nth-of-type(3n) .col-float-space-4 {margin-right:0;} .dis-outer-flex > span > div:nth-of-type(4n) .col-float-space-4 {margin-right:2%;} .dis-outer-flex > span .col-float-space-4:nth-of-type(3n) {margin-right:0;} .dis-outer-flex > span .col-float-space-4:nth-of-type(4n) {margin-right:2%;} } @media (max-width: 1250px){ .container {padding:0 20px;} } @media (max-width: 1200px){ h1 {font-size:52px;} .custom-menu-primary .hs-menu-wrapper > ul ul {left: -50px !important;} } @media (max-width: 1100px){ .container-small {padding:0 20px;} /* header text */ h1 {font-size:48px;} h2 {font-size:32px;} .padding-140tb {padding:120px 0;} .padding-140t {padding:120px 0 0;} .padding-140b {padding:0 0 120px;} .pop-post-listing .pop-item .pop-content a.pop-title {font-size:13px;} .blog-poost-titile h1 > span {font-size:42px;} .poost-page-body blockquote * {font-size:22px;} .related-post-main .post-item:first-child .post-listt-image .post-listt-image-bg ,.related-post-main .post-listt-image .post-listt-image-bg {height:280px;} .hs-blog-post .post-listt-title h2 a,.blog-post-banner .author-link,.blog-post-banner .post-by,.blog-post-banner .post-date {font-size:20px;} .testimonial-content {margin-left:5%;} } @media (max-width: 1024px){ .tri-menu.custom-menu-primary .hs-menu-wrapper>ul {margin-top:0;} /* header text */ h1 {font-size:42px;} h2 {font-size:28px;} h3 {font-size:22px;} h4 {font-size:20px;} h5 {font-size:18px;} h6 {font-size:15px;} p {font-size: 15px; } /* links */ a {font-size: 15px;} /* ul li */ ul li ,ol li { font-size: 15px; } select, textarea, input[type=color], input[type=date], input[type=datetime-local], input[type=datetime], input[type=email], input[type=month], input[type=number], input[type=password], input[type=search], input[type=tel], input[type=text], input[type=time], input[type=url], input[type=week], textarea {font-size:15px;} .padding-140tb {padding:90px 0;} .padding-140t {padding:90px 0 0;} .padding-140b {padding:0 0 90px;} .blog-subscription-v1 {text-align:center;} .blog-subscription-v1 .widget-type-blog_subscribe h3 {display:block;width:100%;margin-bottom:25px;} .blog-subscription-v1 .widget-type-blog_subscribe > div.cell-wrapper > span > div {display:block;width:100%;max-width: 700px; margin: 0 auto;} .blog-subscription-v1 .widget-type-blog_subscribe > div.cell-wrapper > span {display:block;} .blog-poost-titile h1 > span {font-size:34px;} .poost-page-body blockquote * {font-size:20px;} .tri-menu {padding-top:0;} .custom-menu-primary .hs-menu-wrapper > ul ,.mobile-trigger .line {background:#e2211c} .custom-menu-primary .hs-menu-wrapper > ul ul li {background:#e2211c} .custom-menu-primary .hs-menu-wrapper > ul ul {padding: 0 15px;} .tri-menu .hs-menu-wrapper > ul > li.hs-menu-depth-1 > ul > li.hs-menu-depth-2 > a {padding:0;} .testimonial-bubble em:before {left:0;} .recent-item , .recent-items-part2.recent-item {width:32% !important;margin-right:2% !important;} .recent-items-part2.recent-item:nth-of-type(3) {margin-right:0 !important;} .faq-ask-text {margin-bottom:25px;} .faq-ask-text ,.faq-ask-cta {width:100% !important;text-align:center;} .txt-right.faq-ask-cta {text-align:center;} } @media (max-width: 980px){ fieldset.form-columns-2 > div,fieldset.form-columns-2 > div:last-child {width:100% !important;margin-right:0 !important;} } @media (max-width: 900px){ .blog-list-leftsection {width:100% !important;margin-bottom:70px;} .blog-list-sidebar {width:100% !important;margin-left:0 !important;} .pop-post-listing .pop-item .pop-content a.pop-title {font-size:16px;} .posst-tag-filter,.posst-tag-filter ul {text-align:center;} .pop-post-listing .pop-item .pop-image {height:100px;} .related-post-main .post-item {width:100%;margin-right:0;} .related-post-main .post-item:first-child .post-listt-image .post-listt-image-bg ,.related-post-main .post-listt-image .post-listt-image-bg {height:300px;} .hs-blog-post .blog-list-leftsection {margin:0;} } @media (max-width: 840px){ /* grid with float */ .col-float-3 {width:50%;} .col-float-4 {width:50%;} /* grid with display inline */ .col-float-3 {width:50%;} .col-dis-4 {width:50%;} /*** Grid with some space display inline-block***/ .col-dis-space-4 {width:48%;margin-right:4%;} .dis-outer-flex .col-dis-space-4:nth-of-type(3n) {margin-right:4%;} .dis-outer-flex .col-dis-space-4:nth-of-type(2n) {margin-right:0;} /*** Grid with some space display inline-block***/ .col-float-space-4 {width:48%;margin-right:4%;} .dis-outer-flex > span > div:nth-of-type(3n) .col-float-space-4 {margin-right:4%;} .dis-outer-flex > span > div:nth-of-type(2n) .col-float-space-4 {margin-right:0;} /*** Grid with some space display inline-block 3***/ .col-dis-space-3 {width:48%;margin-right:4%;} .dis-outer-flex .col-dis-space-3:nth-of-type(3n) {margin-right:4%;} .dis-outer-flex .col-dis-space-3:nth-of-type(2n) {margin-right:0;} /*** Grid with some space display inline-block 3***/ .col-float-space-3 {width:48%;margin-right:4%;} .dis-outer-flex > span > div:nth-of-type(3n) .col-float-space-3 {margin-right:4%;} .dis-outer-flex > span > div:nth-of-type(2n) .col-float-space-3 {margin-right:0;} .dis-outer-flex > span .col-float-space-3:nth-of-type(3n) {margin-right:4%;} .dis-outer-flex > span .col-float-space-3:nth-of-type(2n) {margin-right:0;} ul.work-tab-list li a {padding: 15px 0;font-size: 14px;} .testimonial-box { padding:50px 20px; } .recent-item { width: 48% !important; margin-right: 4% !important; margin-bottom: 25px;} .recent-item:nth-of-type(2n) { margin-right: 0 !important; } .recent-items-part2.recent-item:nth-of-type(2) {margin-right:2% !important;} } @media (max-width: 767px){ /* header text */ h1 {font-size:36px;} h2 {font-size:26px;} h3 {font-size:20px;} h4 {font-size:18px;} h5 {font-size:16px;} h6 {font-size:14px;} em {font-size:18px;} .testimonial-bubble em {font-size:18px;} /* p tag */ p {font-size: 14px; } /* links */ a {font-size: 14px;} /* ul li */ ul li ,ol li { font-size: 14px; } select, textarea, input[type=color], input[type=date], input[type=datetime-local], input[type=datetime], input[type=email], input[type=month], input[type=number], input[type=password], input[type=search], input[type=tel], input[type=text], input[type=time], input[type=url], input[type=week], textarea {height:40px;font-size:14px;} textarea {height:80px;} .hs-form-field { margin-bottom: 12px; } .dis-flex {display:block;} .testimonial-box .dis-flex {display:flex;} .hs_submit input {padding: 10px 40px;font-size:16px;} .hs_submit,.one-line-text {text-align:center;} .padding-140tb {padding:80px 0;} .padding-140t {padding:80px 0 0;} .padding-140b {padding:0 0 80px;} .widget-type-cta a,.hs-cta-wrapper a {padding:10px 30px;font-size:14px;margin-top:20px;} .post-listt-title h2 a {font-size:20px;} .posst-listt-body p, .posst-listt-body i, .posst-listt-body h1, .posst-listt-body h2, .posst-listt-body h3, .posst-listt-body h4, .posst-listt-body h5, .posst-listt-body h6, .posst-listt-body a, .posst-listt-body span, .posst-listt-body strong, .posst-listt-body em, .posst-listt-body li, .posst-listt-body ul, .posst-listt-body p span, .posst-listt-body p storng {font-size:14px;} .blog-pagination a, .posst-tag-filter ul li a {font-size:14px;} .pop-post-listing .pop-item .pop-content a.pop-title {font-size:14px;} .blog-subscription-v1 .widget-type-blog_subscribe .hs_submit input {font-size:14px;} .blog-poost-titile h1 > span {font-size:32px;} .poost-page-body blockquote * {font-size:18px;} .hs-blog-post .post-listt-title h2 a,.blog-post-banner .author-link,.blog-post-banner .post-by,.blog-post-banner .post-date {font-size:18px;} .poost-page-body blockquote {padding:50px 20px;} .poost-page-body blockquote::before, .poost-page-body blockquote::after {width:60px;height:60px;padding:17px;} .tri-top-menu {display:none !important;} .mobile-trigger {top:31px !important; z-index: 999!important; } .custom-menu-primary.js-enabled .hs-menu-wrapper {top: 110px;} .recent-item, .recent-items-part2.recent-item {width:100% !important;margin-right: !important;} .testimonial-img {width:100%;text-align:center;margin-bottom:15px;} .testimonial-content {margin-left:0;width:100%;} .FAQ-cta-section {padding: 0 0 50px;text-align:center;} .faq-ask-img {margin-bottom:15px;} .full-cta-section .widget-type-cta {margin-bottom:25px;} .full-cta-section .widget-type-cta:last-child {margin-bottom:0;} .contact-joinus-section {text-align:center;margin-bottom:30px;} h3.form-title {text-align:center;} .contact-joinus-section ul { display: inline-block; } } @media (max-width: 640px){ /* header text */ h1 {font-size:32px;} h2 {font-size:24px;} h3 {font-size:19px;} h4 {font-size:17px;} h5 {font-size:15px;} em {font-size:16px;} br {display:none;} .form-columns-2 .hs-form-field .hs-input {width:100% !important;} .hs_submit input {width:100%;} .firstl-page .post-item:nth-of-type(even) {margin-right:0} .post-item {width:100%;height:auto !important;margin-bottom:35px;} .post-item:first-child .post-listt-image .post-listt-image-bg {height:300px;} .post-listt-image .post-listt-image-bg {height:300px;} .blog-subscription-v1 .widget-type-blog_subscribe .hs_submit {position:static;margin: 20px auto 0;} .blog-subscription-v1 .widget-type-blog_subscribe .hs_submit input {padding: 0 22px;color:#1f9278;opacity:1;background-color:#fff;} ul.work-tab-list li a {font-size:12px;} ul.work-tab-list li {width:100%;display:block;} ul.work-tab-list {border-radius:0;} ul.work-tab-list li a {border-radius:0;} /* grid with float */ .col-float-2 , .col-float-3 , .col-float-4 , .col-dis-2 , .col-dis-3 , .col-dis-4 {width:100%;} /*** Grid with some space display inline-block***/ .col-dis-space-4 {width:100%;margin-right:0;} .dis-outer-flex .col-dis-space-4:nth-of-type(3n) {margin-right:0;} /*** Grid with some space display inline-block***/ .col-float-space-4 {width:100%;margin-right:0;} .dis-outer-flex > span > div:nth-of-type(3n) .col-float-space-4 {margin-right:0;} .dis-outer-flex > span .col-float-space-4:nth-of-type(3n) {margin-right:0;} /*** Grid with some space display inline-block 3***/ .col-dis-space-3 {width:100%;margin-right:0;} .dis-outer-flex .col-dis-space-3:nth-of-type(3n) {margin-right:0;} /*** Grid with some space display inline-block 3***/ .col-float-space-3 {width:100%;margin-right:0;} .dis-outer-flex > span > div:nth-of-type(3n) .col-float-space-3 {margin-right:0;} .dis-outer-flex > span .col-float-space-3:nth-of-type(3n) {margin-right:0;} /*** Grid with some space display inline-block 3***/ .col-dis-space-2 {width:100%;margin-right:0;} /*** Grid with some space display inline-block 3***/ .col-float-space-3 {width:100%;margin-right:0;} .recent-item { width: 100% !important; margin-right: 0 !important; } .work2-box {margin-bottom:25px;} .work2-content {width:100%;left:0;max-width:100%;background: #e2211cCC;} .work2-flex >span > div:nth-of-type(even) .work2-content , .even .work2-content {right:0;} } @media (max-width: 480px){ .padding-140tb {padding:60px 0;} .padding-140t {padding:60px 0 0;} .padding-140b {padding:0 0 60px;} ul.work-tab-list li {display:block;} } @media (min-width: 768px){ .footer-flex { display: flex; justify-content: center; } .footer-flex .f-part-one img { margin-bottom:0; } .footer-flex .f-part-two, .footer-flex .f-part-three { margin-top:3rem; } } .page-footer { background-color: #0e1d61; position:relative; border-top:10px solid #fff; } .page-footer .footer-main { padding-top:80px; } .page-footer a { color:#fff; } .page-footer a:hover { color:#fff; text-decoration: underline; } .page-footer h4 { color:#fff; } .page-footer:after { content: ''; height: 8px; width: 100%; background-color: red; top: -15px; display: block; z-index: 2; position: absolute; background-color: #0e1d61; } /* Legacy Styles to clean up */ /* ========================================================================== HubSpot Migrations Services - COS Boilerplate v2.0.0 ========================================================================== */ /* ========================================================================== 8. MISCELLANEOUS ========================================================================== */ .custom-header-top, .custom-header-bottom, .custom-footer{ padding-left: 10px; padding-right: 10px; } .body-container-wrapper > .container { padding: 3rem 2rem; } .home .body-container-wrapper { padding: 0; } .hs-lay .body-container .page-center { padding-top: 0; padding-bottom: 0; } .hs-lay .body-container { line-height: 155%; } .stacktable { width: 100%; } .st-head-row { padding-top: 1em; } .st-head-row.st-head-row-main { font-size: 1.5em; padding-top: 0; } .st-key { width: 49%; text-align: right; padding-right: 1%; } .st-val { width: 49%; padding-left: 1%; } /* RESPONSIVE EXAMPLE */ .stacktable.large-only { display: table; } .stacktable.small-only { display: none; } /* Styles that do not fit into any of the available sections above can go here. */ table, td { border: 1px solid #bbbbbb; } table { border-collapse: collapse; width: 100%; } tbody { border-top: 1px solid #ccc; } .boldtext td { font-size: 16px; font-weight: bold; } table td, table th { padding: 5px; } .boldonly td{ font-weight: bold; } table.full-table { max-width: 940px; width: 100%; } table.download-table th { background: #0e1d61; color: #ffffff; font-weight: bold; border: none; text-align:left; } table.download-table a { display: block; clear: right; height: auto; padding: 5px 0 11px; } table.download-table span.file img { height: 30px; display: inline; clear: left; float: left; margin-right: 10px; position: absolute; left: 0; top: 0; z-index:2; display: none; } table.download-table span.file { display: block; margin-bottom: 5px; position: relative; z-index: 3; } .rteindent1 { margin-left: 40px; } .custom-shop-form { margin-top: -1em; } .custom-e-quote-form { margin-bottom: 1em; padding: 0.5em; border-width: 2px; border-style: groove; border-color: threedface; margin-top: 9px; } .custom-e-quote-form .hs-richtext p:first-child { color: #127ABF; position: relative; } .custom-e-quote-form .hs-richtext p:first-child:after { content: ""; height: 2px; background: threedface; width: 100%; display: inline-block; position: absolute; top: 46%; left: 0; z-index: 1; } .custom-e-quote-form .hs-richtext p:first-child > span{ background:#fff; display:inline-block; vertical-align: middle; position: relative; z-index: 2; padding-right:8px; } .custom-e-quote-form [data-reactid=".hbspt-forms-0.0:$60.0"] p:after { display: none!important; } .custom-e-quote-form [data-reactid=".hbspt-forms-0.0:$60.0"] p{ color:inherit!important; } .home-lay .body-container { background: transparent; padding: 0; max-width: 100%; margin: 0 auto; } .custom-home-gallery-wrap { background: url(//4335336.fs1.hubspotusercontent-na1.net/hubfs/4335336/AstaDoor_June2018/Images/header-content.gif) top left repeat-x scroll; padding: 10px; } .custom-home-gallery .slick-slider { padding: 0 !important; margin: 0!important; } .custom-home-gallery button.slick-arrow,.custom-home-gallery .slick-dots { display: none!important; } .product-group-wrap { padding: 10px 0; } .product-col { border: none; text-align: center; padding: 5px; float: left; width: 25%; box-sizing: border-box; } .product-col:nth-child(4n+1) { clear: left; } .product-col img { border: 6px solid #FFF; box-shadow: 0 0 6px #A8A8A8; -moz-box-shadow: 0 0 6px #A8A8A8; -webkit-box-shadow: 0 0 6px #A8A8A8; background-color: #FFF; margin-top: 40px; } .titletolink { font-size: 16px; font-weight: bold; margin-top: 10px; color: #127ABF; text-shadow: 1px 1px 1px #EAF1EA; text-align: center; font-family: myriad pro,lucida grande; } .subtitlenolinnk { font-weight: bold; font-size: 14px; color: #127ABF; text-shadow: 1px 1px 1px #EAF1EA; text-align: center; font-family: myriad pro,lucida grande; margin-top: 2px; } .home-lay .body-container{ line-height:inherit; padding-bottom: 30px; } .custom-home-row-2{ padding-left:10px; padding-right:10px; } .err-404-lay .body-container-wrapper { padding-top: 0; } .err-404-lay .body-container-wrapper p:last-child{ margin-bottom:0; } .all-product-wrap { padding-bottom: 10px; max-width: 950px; margin: 0 auto; line-height: 155%; } .all-product-wrap h1.product-list-title { padding-bottom: 15px; } form#form_id { margin: 0; padding: 0; margin-bottom: .5em; } select#edit-field-series-tid { float: left; padding: 0 1rem; max-width: 208px; margin-top: -1px; background:#fff; border:1px solid #ccc; } form#form_id h4 { margin: 0 0 0px; color: inherit; line-height: 155%; font: 0.8em/165% "Lucida Grande","Lucida Sans Unicode",Segoe UI,Helvetica,Arial,sans-serif; font-size: 12.8px; font-weight: bold; } table.views-table.cols-3 caption { font-size: 2em; color: #555; text-align: left; padding: 5px; } .archive-wrapper { padding-top: 1px; } form#form_id:after,form#form_id:before { content: ""; display: table; width: 100%; } table.views-table.cols-3 thead th { text-align: center; background: #222222; color: #ffffff; font-weight: bold; border: none; } table.views-table.cols-3 tbody { border-top: 1px solid #ccc; } table.views-table.cols-3 tbody tr:nth-child(odd) { background-color: #F6F6F6; border-bottom: 1px solid #ccc; padding: 0.1em 0.6em; } table.views-table.cols-3 tbody tr td:first-child{ width: 155px; } table.views-table.cols-3 tbody tr td:first-child img { border: 6px solid #FFF; box-shadow: 0 0 6px #A8A8A8; -moz-box-shadow: 0 0 6px #A8A8A8; -webkit-box-shadow: 0 0 6px #A8A8A8; background-color: #FFF; display: block; margin: 5px auto; margin: 0 auto; max-width: 100px; } table.views-table.cols-3 tbody tr td { vertical-align: top; } table.views-table.cols-3 tbody tr td:first-child > span { margin: 5px auto; display: block; text-align: center; } table.views-table.cols-3 tbody tr td:first-child > span a { width: 120px; height: 19px; padding: 3px 10px; background: url(//4335336.fs1.hubspotusercontent-na1.net/hubfs/4335336/AstaDoor_June2018/Images/details.png) center no-repeat scroll; color: #666; display: block; margin: 0 auto; } .views-field-title.custom h3 { font-size: 20px; color: #369; margin: 10px; text-shadow: 1px 1px 1px #eaf1ea; } td.views-field.views-field-title.custom { padding: 5px 5px 15px 10px; color: #333; } .item-list ul { margin: 0 0 0.25em 1em; padding: 0; padding: 0 0 5px 5px; padding: 5px 0 2px 10px; } .item-list ul a { display: block; width: 100%; margin-bottom: 7px; position:relative; } .item-list ul a:before, .item-list ul a:after{ content:""; display:table; width:100%; } .cm-product-tabber-content-wrapper ul a[href*=".pdf"]:before, .cm-product-tabber-content-wrapper ul a[href*=".jpg"]:before, .item-list ul a[href*=".pdf"]:before, .item-list ul a[href*=".jpg"]:before{ height: 30px; display: inline; clear: left; float: left; margin-right: 10px; width: 30px; content: ""; background-size: 30px 30px; background-repeat: no-repeat; position: relative; top: -5px; } .item-list ul a[href*=".pdf"]:before, .cm-product-tabber-content-wrapper ul a[href*=".pdf"]:before{ background-image:url(//4335336.fs1.hubspotusercontent-na1.net/hubfs/4335336/AstaDoor_June2018/Images/application-pdf-1.png); } .item-list ul a[href*=".jpg"]:before, .cm-product-tabber-content-wrapper ul a[href*=".jpg"]:before{ background-image: url(//4335336.fs1.hubspotusercontent-na1.net/hubfs/4335336/AstaDoor_June2018/Images/image-x-generic.png); } td.views-field.views-field-field-doorcolor { padding: 5px 5px 15px 10px; color: #333; } td.views-field.views-field-field-doorcolor ul { margin: 0 0 0.25em 1em; padding: 0 0 5px 10px; list-style:none; } td.views-field.views-field-field-doorcolor ul a { display: block; margin-bottom: 5px; } .product-item em { color:#000; } .table-pagination ul { clear: both; text-align: center; list-style: none; margin: 0 0 0.25em 1em; padding: 21px 0 0 0; } .table-pagination ul li { background-image: none; display: inline; list-style-type: none; padding: 0.5em; margin: 0 0 0 5px; } .table-pagination ul li a.active { font-weight: bold; color: #7c713f; pointer-events: none; } .cm-product-post-body > a > img { display: inline; float: left; margin-right: 20px; background: transparent url(//4335336.fs1.hubspotusercontent-na1.net/hubfs/4335336/AstaDoor_June2018/Images/pattern.png); border: 1px solid #d8d8d8; padding: 10px; margin: 10px 0; margin-right: 20px; cursor:pointer; } p.product-type { margin: 0; } .cm-product-tabber { clear: both; margin: 20px 0 2px; padding: 0; border: 1px solid #CCC; position: relative; background-color: white; } ul.cm-product-tabber-listing { display: inline-block; margin: 0; border: 0; padding: 0px; position: relative; list-style: none; list-style-image: none; background-color: #dedede; border-right: 1px solid #dedede; width: 100%; height: auto; clear: both; } ul.cm-product-tabber-listing li { background-color: #fff; padding: 0 0 1px 0; background: #eee; border-right: 1px solid #ccc; margin: 0; min-width: 5em; float: left; display: list-item; } ul.cm-product-tabber-listing li a { display: block; text-decoration: none; padding: 0.5em 16px 0.3em; position: relative; top: 0px; } .cm-product-tabber-content-wrapper { padding-top: 20px; } .cm-product-tab-panel { padding: 0 1.2em; border: 0; margin-bottom: 1em; } .cm-product-attr-label { padding: 10px 0 15px; } .cm-product-tabber-content-wrapper ul { display: block; padding-left:0; } .cm-product-tabber-content-wrapper ul:after, .cm-product-tabber-content-wrapper ul:before { content: ""; display: table; width: 100%; } .cm-product-tabber-content-wrapper ul a { display: block; margin-bottom: 10px; } .cm-product-tabber-content-wrapper ul a:after { content: ""; display: block; width: 100%; clear: both; } ul.cm-product-tabber-listing li.active > a { color: #000; font-weight: bold; background: transparent; background: #fff; padding: 0.5em 15px 0.3em; } ul.cm-product-tabber-listing li.active { background-color: #fff; padding: 0 0 1px 0; } .all-product-wrap.product-post-page { max-width: 100%; } .cm-product-tabber-content-wrapper ul a:last-child { margin-bottom: 4px; } .cm-footer-info { padding-top: 10px; margin-bottom: -10px; } .cm-footer-info .field-label { font-weight: bold; } .cm-product-tab-panel.resources_content .field-label { position: relative; top: -5px; } .cm-product-tab-panel.wiring_diagram { padding-top: 5px; } .item-list ul a[href*=".pdf"]:before, .item-list ul a[href*=".jpg"]:before{ margin-right:0px; min-height:32px; } .item-list ul a[href*=".pdf"], .item-list ul a[href*=".jpg"] { position: relative; padding-left: 32px; z-index: 3; min-height: 30px; clear: both; max-width: 100%; width: 100%; box-sizing: border-box; } .item-list ul a[href*=".pdf"]:before, .item-list ul a[href*=".jpg"]:before{ position:absolute; left:0 } .product_description .field-label { margin-top: -9px; margin-bottom: -5px; } .product_description p a { margin: 0; } ul.cm-product-tabber-listing li a:hover{ outline: none!important; background-color: #ededdd!important; } table.views-table.cols-3 tbody tr td:first-child > span a:hover { background: url(//4335336.fs1.hubspotusercontent-na1.net/hubfs/4335336/AstaDoor_June2018/Images/details-over.png) center no-repeat scroll; color: #000; } .widget-span.custom-header-login { position: absolute; top: 11px; z-index: 1; width: auto; } .widget-type-password_prompt input { clear: both; display: block; margin-bottom: 15px; } .blog-pagination a { display: block; } .custom-footer-menu .hs-menu-wrapper > ul > li.active > a:hover { color: #000; } .body-container a[href*="mailto:"]:after { background: url(//4335336.fs1.hubspotusercontent-na1.net/hubfs/4335336/AstaDoor_June2018/Images/extlink_s.png) -20px center no-repeat; width: 12px; height: 10px; padding-right: 0; text-decoration: none; text-indent: -5000px; font-size: 0; display: inline-block; content: ''; vertical-align: baseline; transform: translateY(1px); } .body-container a[href*="http:"]:after { background: url('//4335336.fs1.hubspotusercontent-na1.net/hubfs/4335336/AstaDoor_June2018/Images/extlink_s.png') 2px center no-repeat; width: 12px; height: 10px; padding-right: 0; text-decoration: none; text-indent: -5000px; font-size: 0; display: inline-block; content: ''; vertical-align: baseline; transform: translateY(1px); } body.fancybox-active { overflow: hidden; } body.fancybox-iosfix { position: fixed; left: 0; right: 0; } .fancybox-is-hidden { position: absolute; top: -9999px; left: -9999px; visibility: hidden; } .fancybox-container { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 99992; -webkit-tap-highlight-color: transparent; -webkit-backface-visibility: hidden; backface-visibility: hidden; transform: translateZ(0); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; } .fancybox-outer, .fancybox-inner, .fancybox-bg, .fancybox-stage { position: absolute; top: 0; right: 0; bottom: 0; left: 0; } .fancybox-outer { overflow-y: auto; -webkit-overflow-scrolling: touch; } .fancybox-bg { opacity: 0; transition-duration: inherit; background: #000; transition-property: opacity; transition-timing-function: cubic-bezier(0.47, 0, 0.74, 0.71); } .fancybox-is-open .fancybox-bg { opacity: 0.85; transition-timing-function: cubic-bezier(0.22, 0.61, 0.36, 1); } .fancybox-infobar, .fancybox-toolbar, .fancybox-caption-wrap { position: absolute; direction: ltr; z-index: 99997; opacity: 0; visibility: hidden; transition: opacity .25s, visibility 0s linear .25s; box-sizing: border-box; } .fancybox-show-infobar .fancybox-infobar, .fancybox-show-toolbar .fancybox-toolbar, .fancybox-show-caption .fancybox-caption-wrap { opacity: 1; visibility: visible; transition: opacity .25s, visibility 0s; } .fancybox-infobar { top: 0; left: 0; font-size: 13px; padding: 0 10px; height: 44px; min-width: 44px; line-height: 44px; color: #ccc; text-align: center; pointer-events: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -webkit-tap-highlight-color: transparent; -webkit-font-smoothing: subpixel-antialiased; mix-blend-mode: exclusion; } .fancybox-toolbar { top: 0; right: 0; margin: 0; padding: 0; } .fancybox-stage { overflow: hidden; direction: ltr; z-index: 99994; -webkit-transform: translate3d(0, 0, 0); } .fancybox-is-closing .fancybox-stage { overflow: visible; } .fancybox-slide { position: absolute; top: 0; left: 0; width: 100%; height: 100%; margin: 0; padding: 0; overflow: auto; outline: none; white-space: normal; box-sizing: border-box; text-align: center; z-index: 99994; -webkit-overflow-scrolling: touch; display: none; -webkit-backface-visibility: hidden; backface-visibility: hidden; transition-property: transform, opacity; } .fancybox-slide::before { content: ''; display: inline-block; vertical-align: middle; height: 100%; width: 0; } .fancybox-is-sliding .fancybox-slide, .fancybox-slide--previous, .fancybox-slide--current, .fancybox-slide--next { display: block; } .fancybox-slide--image { overflow: visible; } .fancybox-slide--image::before { display: none; } .fancybox-slide--video .fancybox-content, .fancybox-slide--video iframe { background: #000; } .fancybox-slide--map .fancybox-content, .fancybox-slide--map iframe { background: #E5E3DF; } .fancybox-slide--next { z-index: 99995; } .fancybox-slide > * { display: inline-block; position: relative; padding: 15px; margin: 44px 0 44px; border-width: 0; vertical-align: middle; text-align: left; background-color: #fff; overflow: auto; box-sizing: border-box; background: #fff; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; max-width:80%; } .fancybox-slide > title, .fancybox-slide > style, .fancybox-slide > meta, .fancybox-slide > link, .fancybox-slide > script, .fancybox-slide > base { display: none; } .fancybox-slide .fancybox-image-wrap { position: absolute; top: 0; left: 0; margin: 0; padding: 0; border: 0; z-index: 99995; background: transparent; cursor: default; overflow: visible; transform-origin: top left; background-size: 100% 100%; background-repeat: no-repeat; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; transition-property: transform, opacity; } .fancybox-can-zoomOut .fancybox-image-wrap { cursor: zoom-out; } .fancybox-can-zoomIn .fancybox-image-wrap { cursor: zoom-in; } .fancybox-can-drag .fancybox-image-wrap { cursor: -webkit-grab; cursor: grab; } .fancybox-is-dragging .fancybox-image-wrap { cursor: -webkit-grabbing; cursor: grabbing; } .fancybox-image, .fancybox-spaceball { position: absolute; top: 0; left: 0; width: 100%; height: 100%; margin: 0; padding: 0; border: 0; max-width: none; max-height: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .fancybox-spaceball { z-index: 1; } .fancybox-slide--iframe .fancybox-content { padding: 0; width: 80%; height: 80%; max-width: calc(100% - 100px); max-height: calc(100% - 88px); overflow: visible; background: #fff; } .fancybox-iframe { display: block; margin: 0; padding: 0; border: 0; width: 100%; height: 100%; background: #fff; } .fancybox-error { margin: 0; padding: 40px; width: 100%; max-width: 380px; background: #fff; cursor: default; } .fancybox-error p { margin: 0; padding: 0; color: #444; font-size: 16px; line-height: 20px; } /* Buttons */ .fancybox-button { box-sizing: border-box; display: inline-block; vertical-align: top; width: 44px; min-width: 1px; height: 44px; margin: 0; padding: 10px; border: 0; border-radius: 0; background: rgba(30, 30, 30, 0.6); transition: color .3s ease; cursor: pointer; outline: none; } .fancybox-button, .fancybox-button:visited, .fancybox-button:link { color: #ccc; } .fancybox-button:focus, .fancybox-button:hover { color: #fff; } .fancybox-button[disabled] { color: #ccc; cursor: default; opacity: 0.6; } .fancybox-button svg { display: block; position: relative; overflow: visible; shape-rendering: geometricPrecision; width: 100%; margin: 0 auto; } .fancybox-button svg path { fill: currentColor; stroke: currentColor; stroke-linejoin: round; stroke-width: 3; } .fancybox-button--share svg path { stroke-width: 1; } .fancybox-button--play svg path:nth-child(2) { display: none; } .fancybox-button--pause svg path:nth-child(1) { display: none; } .fancybox-button--zoom svg path { fill: transparent; } /* Navigation arrows */ .fancybox-navigation { display: none; } .fancybox-show-nav .fancybox-navigation { display: block; } .fancybox-navigation button { position: absolute; top: 50%; margin: -50px 0 0 0; z-index: 99997; background: transparent; width: 60px; height: 100px; padding: 17px; } .fancybox-navigation button:before { content: ""; position: absolute; top: 30px; right: 10px; width: 40px; height: 40px; background: rgba(30, 30, 30, 0.6); } .fancybox-navigation .fancybox-button--arrow_left { left: 0; } .fancybox-navigation .fancybox-button--arrow_right { right: 0; } /* Close button on the top right corner of html content */ .fancybox-close-small { position: absolute; top: 0; right: 0; width: 40px; height: 40px; padding: 0; margin: 0; border: 0; border-radius: 0; background: transparent; z-index: 10; cursor: pointer; } .fancybox-close-small:after { content: '×'; position: absolute; top: 5px; right: 5px; width: 30px; height: 30px; font: 22px/30px Arial,"Helvetica Neue",Helvetica,sans-serif; color: #888; font-weight: 300; text-align: center; border-radius: 50%; border-width: 0; background-color: transparent; transition: background-color .25s; box-sizing: border-box; z-index: 2; } .fancybox-close-small::after { content: "×"; position: absolute; top: 5px; right: 5px; width: 30px; height: 30px; text-align: center; background-color: transparent; box-sizing: border-box; z-index: 2; font: 300 22px/30px Arial, "Helvetica Neue", Helvetica, sans-serif; border-radius: 50%; border-width: 0px; } .fancybox-close-small:focus { outline: none; } .fancybox-close-small:focus:after { outline: 1px dotted #888; } .fancybox-close-small:hover { background: transparent; } .fancybox-close-small:hover:after { color: #555; background: #eee; } .fancybox-slide--image .fancybox-close-small, .fancybox-slide--iframe .fancybox-close-small { top: 0; right: -40px; } .fancybox-slide--image .fancybox-close-small:after, .fancybox-slide--iframe .fancybox-close-small:after { font-size: 35px; color: #aaa; } .fancybox-slide--image .fancybox-close-small:hover:after, .fancybox-slide--iframe .fancybox-close-small:hover:after { color: #fff; background: transparent; } .fancybox-is-scaling .fancybox-close-small, .fancybox-is-zoomable.fancybox-can-drag .fancybox-close-small { display: none; } /* Caption */ .fancybox-caption-wrap { bottom: 0; left: 0; right: 0; padding: 60px 2vw 0 2vw; background: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.1) 20%, rgba(0, 0, 0, 0.2) 40%, rgba(0, 0, 0, 0.6) 80%, rgba(0, 0, 0, 0.8) 100%); pointer-events: none; } .fancybox-caption { padding: 30px 0; border-top: 1px solid rgba(255, 255, 255, 0.4); font-size: 14px; color: #fff; line-height: 20px; -webkit-text-size-adjust: none; } .fancybox-caption a, .fancybox-caption button, .fancybox-caption select { pointer-events: all; position: relative; /* Fix IE11 */ } .fancybox-caption a { color: #fff; text-decoration: underline; } /* Loading indicator */ .fancybox-slide > .fancybox-loading { border: 6px solid rgba(100, 100, 100, 0.4); border-top: 6px solid rgba(255, 255, 255, 0.6); border-radius: 100%; height: 50px; width: 50px; animation: fancybox-rotate .8s infinite linear; background: transparent; position: absolute; top: 50%; left: 50%; margin-top: -30px; margin-left: -30px; z-index: 99999; } @keyframes fancybox-rotate { from { transform: rotate(0deg); } to { transform: rotate(359deg); } } /* Transition effects */ .fancybox-animated { transition-timing-function: cubic-bezier(0, 0, 0.25, 1); } /* transitionEffect: slide */ .fancybox-fx-slide.fancybox-slide--previous { transform: translate3d(-100%, 0, 0); opacity: 0; } .fancybox-fx-slide.fancybox-slide--next { transform: translate3d(100%, 0, 0); opacity: 0; } .fancybox-fx-slide.fancybox-slide--current { transform: translate3d(0, 0, 0); opacity: 1; } /* transitionEffect: fade */ .fancybox-fx-fade.fancybox-slide--previous, .fancybox-fx-fade.fancybox-slide--next { opacity: 0; transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1); } .fancybox-fx-fade.fancybox-slide--current { opacity: 1; } /* transitionEffect: zoom-in-out */ .fancybox-fx-zoom-in-out.fancybox-slide--previous { transform: scale3d(1.5, 1.5, 1.5); opacity: 0; } .fancybox-fx-zoom-in-out.fancybox-slide--next { transform: scale3d(0.5, 0.5, 0.5); opacity: 0; } .fancybox-fx-zoom-in-out.fancybox-slide--current { transform: scale3d(1, 1, 1); opacity: 1; } /* transitionEffect: rotate */ .fancybox-fx-rotate.fancybox-slide--previous { transform: rotate(-360deg); opacity: 0; } .fancybox-fx-rotate.fancybox-slide--next { transform: rotate(360deg); opacity: 0; } .fancybox-fx-rotate.fancybox-slide--current { transform: rotate(0deg); opacity: 1; } /* transitionEffect: circular */ .fancybox-fx-circular.fancybox-slide--previous { transform: scale3d(0, 0, 0) translate3d(-100%, 0, 0); opacity: 0; } .fancybox-fx-circular.fancybox-slide--next { transform: scale3d(0, 0, 0) translate3d(100%, 0, 0); opacity: 0; } .fancybox-fx-circular.fancybox-slide--current { transform: scale3d(1, 1, 1) translate3d(0, 0, 0); opacity: 1; } /* transitionEffect: tube */ .fancybox-fx-tube.fancybox-slide--previous { transform: translate3d(-100%, 0, 0) scale(0.1) skew(-10deg); } .fancybox-fx-tube.fancybox-slide--next { transform: translate3d(100%, 0, 0) scale(0.1) skew(10deg); } .fancybox-fx-tube.fancybox-slide--current { transform: translate3d(0, 0, 0) scale(1); } /* Share */ .fancybox-share { padding: 30px; border-radius: 3px; background: #f4f4f4; max-width: 90%; text-align: center; } .fancybox-share h1 { color: #222; margin: 0 0 20px 0; font-size: 35px; font-weight: 700; } .fancybox-share p { margin: 0; padding: 0; } p.fancybox-share__links { margin-right: -10px; } .fancybox-share__button { display: inline-block; text-decoration: none; margin: 0 10px 10px 0; padding: 0 15px; min-width: 130px; border: 0; border-radius: 3px; background: #fff; white-space: nowrap; font-size: 14px; font-weight: 700; line-height: 40px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; color: #fff; transition: all .2s; } .fancybox-share__button:hover { text-decoration: none; } .fancybox-share__button--fb { background: #3b5998; } .fancybox-share__button--fb:hover { background: #344e86; } .fancybox-share__button--pt { background: #bd081d; } .fancybox-share__button--pt:hover { background: #aa0719; } .fancybox-share__button--tw { background: #1da1f2; } .fancybox-share__button--tw:hover { background: #0d95e8; } .fancybox-share__button svg { position: relative; top: -1px; width: 25px; height: 25px; margin-right: 7px; vertical-align: middle; } .fancybox-share__button svg path { fill: #fff; } .fancybox-share__input { box-sizing: border-box; width: 100%; margin: 10px 0 0 0; padding: 10px 15px; background: transparent; color: #5d5b5b; font-size: 14px; outline: none; border: 0; border-bottom: 2px solid #d7d7d7; } /* Thumbs */ .fancybox-thumbs { display: none; position: absolute; top: 0; bottom: 0; right: 0; width: 212px; margin: 0; padding: 2px 2px 4px 2px; background: #fff; -webkit-tap-highlight-color: transparent; -webkit-overflow-scrolling: touch; -ms-overflow-style: -ms-autohiding-scrollbar; box-sizing: border-box; z-index: 99995; } .fancybox-thumbs-x { overflow-y: hidden; overflow-x: auto; } .fancybox-show-thumbs .fancybox-thumbs { display: block; } .fancybox-show-thumbs .fancybox-inner { right: 212px; } .fancybox-thumbs > ul { list-style: none; position: absolute; position: relative; width: 100%; height: 100%; margin: 0; padding: 0; overflow-x: hidden; overflow-y: auto; font-size: 0; white-space: nowrap; } .fancybox-thumbs-x > ul { overflow: hidden; } .fancybox-thumbs-y > ul::-webkit-scrollbar { width: 7px; } .fancybox-thumbs-y > ul::-webkit-scrollbar-track { background: #fff; border-radius: 10px; box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3); } .fancybox-thumbs-y > ul::-webkit-scrollbar-thumb { background: #2a2a2a; border-radius: 10px; } .fancybox-thumbs > ul > li { float: left; overflow: hidden; padding: 0; margin: 2px; width: 100px; height: 75px; max-width: calc(50% - 4px); max-height: calc(100% - 8px); position: relative; cursor: pointer; outline: none; -webkit-tap-highlight-color: transparent; -webkit-backface-visibility: hidden; backface-visibility: hidden; box-sizing: border-box; } li.fancybox-thumbs-loading { background: rgba(0, 0, 0, 0.1); } .fancybox-thumbs > ul > li > img { position: absolute; top: 0; left: 0; max-width: none; max-height: none; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .fancybox-thumbs > ul > li:before { content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; border: 4px solid #4ea7f9; z-index: 99991; opacity: 0; transition: all 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94); } .fancybox-thumbs > ul > li.fancybox-thumbs-active:before { opacity: 1; } .fancybox-container .popup-form { margin: 44px 0; } .fancybox-close-small:after { content: " "; border-width: 0px; background: url('//4335336.fs1.hubspotusercontent-na1.net/hubfs/4335336/AstaDoor_June2018/Images/controls.png') -25px 0px no-repeat; width: 25px; height: 25px; text-indent: -9999px; } .fancybox-close-small:hover{ background:transparent!important; } .fancybox-close-small:hover:after{ background: url('//4335336.fs1.hubspotusercontent-na1.net/hubfs/4335336/AstaDoor_June2018/Images/controls.png') -25px 0px no-repeat; background-position: -25px -25px; } .product_description.only-description .field-label { margin-top: 0; } table.views-table { margin: 20px auto 0; } form#form_id, .views-reset-button a { margin-bottom: 0 !important; } .table-pagination ul li:first-child:last-child { display: none; } .responsive-table-sec .boldtext td { white-space: nowrap; } ul.hs-search-field__suggestions { max-width: 430px; padding: 10px; } ul.hs-search-field__suggestions a:hover{ background:none; } ul.inputs-list.multi-container > li > label { display: inline-block !important; width:auto; } .item-list ul, .cm-product-tabber-content-wrapper ul{ list-style:none; } /* ========================================================================== 9. MEDIA QUERIES ========================================================================== */ /* =============== Screen sizes smaller than .page-center =============== */ @media (max-width: 1070px) { .custom-menu-primary .hs-menu-wrapper > ul > li:nth-last-child(2) ul{ left:auto!important; right:0; } } @media (max-width: 999px){ .custom-menu-primary .hs-menu-wrapper > ul > li > a { margin: 0 16px 0 0; font-size: 12px; } .product-col img { width: 90%; } } @media (max-width: 850px){ .custom-menu-primary .hs-menu-wrapper > ul > li > a { margin: 0 10px 0 0; } } /* =============== Landscape tablet and smaller devices =============== */ @media (max-width: 767px) { .widget-span.custom-header-col { width: 100%; text-align: center; padding:0; margin:0 0 15px; } .header-right > div { display: block; text-align: center; width: 100%; } .custom-header-bottom { background: url(//4335336.fs1.hubspotusercontent-na1.net/hubfs/4335336/AstaDoor_June2018/Images/menu.png?t=1530089360537) left top repeat-x scroll; } .custom-menu-primary .hs-menu-wrapper > ul > li > a{ font-size: 14px; } .custom-menu-primary .hs-menu-wrapper > ul > li > a { font-size: 14px; line-height: 39px; color: #333333; font-weight: 500; } .custom-menu-primary .hs-menu-wrapper > ul > li.hs-item-has-children > a { background-image: none; } .custom-footer-menu .hs-menu-wrapper > ul > li { border-right: 0px solid #787878; padding: 0 10px!important; text-align: center; } .stacktable.large-only { display: none; } .stacktable.small-only { display: block; table-layout: fixed; box-sizing: border-box; } .small-only td, .small-only th { display: block; width: 100%; text-align: left; box-sizing: border-box; } h1 { font-size: 22px; } .rteindent1 { margin-left:0px; } input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], input[type="file"], textarea, select { max-width: 100%; } ul.hs-error-msgs.inputs-list { max-width: 100%; } .product-col img { width: auto; } .product-col { float: none; width: 100%; } table.views-table.cols-3 th { display: none; } table.views-table.cols-3 tbody td { display: block!important; width: 100%!important; box-sizing: border-box; } table.views-table.cols-3 tbody td:empty { display: none!important; } td.views-field.views-field-field-doorimg h3 { font-size: 20px; color: #369; text-shadow: 1px 1px 1px #eaf1ea; padding: 0 10px; } td.views-field.views-field-title.custom { padding: 15px 10px; } td.views-field.views-field-field-doorcolor { padding: 15px 10px; } .cm-product-post-body > a > img { float: none; margin-right: 0; display: block; } ul.cm-product-tabber-listing li { float: none; } .widget-span.custom-header-login { position: static; width: 100%; } .hs-featured-image-wrapper .hs-featured-image-link img.hs-featured-image { float: none; margin: 15px 0; max-width: 100%; max-height: none; display: block; } select#edit-field-series-tid { float: none; padding: 0; max-width: 100%; margin-bottom: 15px; } .views-submit-button, .views-reset-button { position: static; } .cm-product-tabber-content-wrapper ul a, .item-list ul a{ position: relative; z-index: 3; min-height: 35px; padding-left: 40px; box-sizing: border-box; } .cm-product-tabber-content-wrapper ul a[href*=".pdf"]:before, .cm-product-tabber-content-wrapper ul a[href*=".jpg"]:before, .item-list ul a[href*=".pdf"]:before, .item-list ul a[href*=".jpg"]:before { position: absolute; left: 0; box-sizing: border-box; } } /* =============== Landscape phones and smaller devices =============== */ @media (max-width: 479px) { .subscribe-options label { margin-left: 0; margin-right: 0; } .subscribe-options label span { font-size: 12px; } } /* layout.css */ /* Responsive Grid */ .row-fluid { width: 100%; *zoom: 1; } .row-fluid:before, .row-fluid:after { display: table; content: ""; } .row-fluid:after { clear: both; } .row-fluid [class*="span"] { display: block; float: left; width: 100%; min-height: 28px; margin-left: 2.127659574%; *margin-left: 2.0744680846382977%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; } .row-fluid [class*="span"]:first-child { margin-left: 0; } .row-fluid .span12 { width: 99.99999998999999%; *width: 99.94680850063828%; } .row-fluid .span11 { width: 91.489361693%; *width: 91.4361702036383%; } .row-fluid .span10 { width: 82.97872339599999%; *width: 82.92553190663828%; } .row-fluid .span9 { width: 74.468085099%; *width: 74.4148936096383%; } .row-fluid .span8 { width: 65.95744680199999%; *width: 65.90425531263828%; } .row-fluid .span7 { width: 57.446808505%; *width: 57.3936170156383%; } .row-fluid .span6 { width: 48.93617020799999%; *width: 48.88297871863829%; } .row-fluid .span5 { width: 40.425531911%; *width: 40.3723404216383%; } .row-fluid .span4 { width: 31.914893614%; *width: 31.8617021246383%; } .row-fluid .span3 { width: 23.404255317%; *width: 23.3510638276383%; } .row-fluid .span2 { width: 14.89361702%; *width: 14.8404255306383%; } .row-fluid .span1 { width: 6.382978723%; *width: 6.329787233638298%; } .container-fluid { *zoom: 1; } .container-fluid:before, .container-fluid:after { display: table; content: ""; } .container-fluid:after { clear: both; } @media (max-width: 767px) { .row-fluid { width: 100%; } .row-fluid [class*="span"] { display: block; float: none; width: auto; margin-left: 0; } } @media (min-width: 768px) and (max-width: 1139px) { .row-fluid { width: 100%; *zoom: 1; } .row-fluid:before, .row-fluid:after { display: table; content: ""; } .row-fluid:after { clear: both; } .row-fluid [class*="span"] { display: block; float: left; width: 100%; min-height: 28px; margin-left: 2.762430939%; *margin-left: 2.709239449638298%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; } .row-fluid [class*="span"]:first-child { margin-left: 0; } .row-fluid .span12 { width: 99.999999993%; *width: 99.9468085036383%; } .row-fluid .span11 { width: 91.436464082%; *width: 91.38327259263829%; } .row-fluid .span10 { width: 82.87292817100001%; *width: 82.8197366816383%; } .row-fluid .span9 { width: 74.30939226%; *width: 74.25620077063829%; } .row-fluid .span8 { width: 65.74585634900001%; *width: 65.6926648596383%; } .row-fluid .span7 { width: 57.182320438000005%; *width: 57.129128948638304%; } .row-fluid .span6 { width: 48.618784527%; *width: 48.5655930376383%; } .row-fluid .span5 { width: 40.055248616%; *width: 40.0020571266383%; } .row-fluid .span4 { width: 31.491712705%; *width: 31.4385212156383%; } .row-fluid .span3 { width: 22.928176794%; *width: 22.874985304638297%; } .row-fluid .span2 { width: 14.364640883%; *width: 14.311449393638298%; } .row-fluid .span1 { width: 5.801104972%; *width: 5.747913482638298%; } } @media (min-width: 1280px) { .row-fluid { width: 100%; *zoom: 1; } .row-fluid:before, .row-fluid:after { display: table; content: ""; } .row-fluid:after { clear: both; } .row-fluid [class*="span"] { display: block; float: left; width: 100%; min-height: 28px; margin-left: 2.564102564%; *margin-left: 2.510911074638298%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; } .row-fluid [class*="span"]:first-child { margin-left: 0; } .row-fluid .span12 { width: 100%; *width: 99.94680851063829%; } .row-fluid .span11 { width: 91.45299145300001%; *width: 91.3997999636383%; } .row-fluid .span10 { width: 82.905982906%; *width: 82.8527914166383%; } .row-fluid .span9 { width: 74.358974359%; *width: 74.30578286963829%; } .row-fluid .span8 { width: 65.81196581200001%; *width: 65.7587743226383%; } .row-fluid .span7 { width: 57.264957265%; *width: 57.2117657756383%; } .row-fluid .span6 { width: 48.717948718%; *width: 48.6647572286383%; } .row-fluid .span5 { width: 40.170940171000005%; *width: 40.117748681638304%; } .row-fluid .span4 { width: 31.623931624%; *width: 31.5707401346383%; } .row-fluid .span3 { width: 23.076923077%; *width: 23.0237315876383%; } .row-fluid .span2 { width: 14.529914530000001%; *width: 14.4767230406383%; } .row-fluid .span1 { width: 5.982905983%; *width: 5.929714493638298%; } } /* Clearfix */ .clearfix { *zoom: 1; } .clearfix:before, .clearfix:after { display: table; content: ""; } .clearfix:after { clear: both; } /* Visibilty Classes */ .hide { display: none; } .show { display: block; } .invisible { visibility: hidden; } .hidden { display: none; visibility: hidden; } /* Responsive Visibilty Classes */ .visible-phone { display: none !important; } .visible-tablet { display: none !important; } .hidden-desktop { display: none !important; } @media (max-width: 767px) { .visible-phone { display: inherit !important; } .hidden-phone { display: none !important; } .hidden-desktop { display: inherit !important; } .visible-desktop { display: none !important; } } @media (min-width: 768px) and (max-width: 1139px) { .visible-tablet { display: inherit !important; } .hidden-tablet { display: none !important; } .hidden-desktop { display: inherit !important; } .visible-desktop { display: none !important ; } } body { overflow-x:hidden; } /* ========================================================================== OWL CAROUSEL ========================================================================== */ .owl-theme .owl-controls .owl-page.active span, .owl-theme .owl-controls.clickable .owl-page:hover span { background: #ccc; } .hs-menu-wrapper.hs-menu-flow-horizontal>ul li.hs-item-has-children ul.hs-menu-children-wrapper li a { display: block; white-space: nowrap; overflow: hidden!important; text-overflow: ellipsis; } .container.header__lp { padding-left:0; padding-right:0; } .button, .hs-button, button, form .hs-button, form input[type=submit], .button-primary, .button-primary:hover { background-color:#e2211c; border:none; font-weight:bold; border-radius: 0; } .button:hover, .hs-button:hover, button:hover, form .hs-button:hover, form input[type=submit]:hover, .button-primary:hover { background-color:#c9211c; } .button-sm { padding:10px 20px; }