/* 1 Reset Css #res 2 Font Face #face 3 Inputs #input 4 Global Styles #glob 5 Wrappers #wrap 6 Custom CSS #custom 7 Media Query #media */ /*================================= 1 Reset Css ( #res ) =================================*/ html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}body{line-height:1}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}nav ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}a{text-decoration:none;outline:0;margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent;color:#006db7;transition:all 0.5s ease 0s;}ins{background-color:#ff9;color:#000;text-decoration:none}mark{background-color:#ff9;color:#000;font-style:italic;font-weight:700}del{text-decoration:line-through}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}table{border-collapse:collapse;border-spacing:0}hr{display:block;height:1px;border:0;border-top:1px solid #ababab;margin:50px auto; padding:0} img {-ms-interpolation-mode: bicubic; border: 0; height: auto; vertical-align: middle; transition:all 0.5s ease 0s;} .ie8 img {height: auto; width: auto\9;} .ie8 img.size-large {max-width: 60%; width: auto;} :hover{transition:all 0.5s ease 0s;} ul{list-style:none; margin:0; padding:0;} li{list-style:none;} #wp-toolbar ul:after{content:none} .last_li , .last{margin-right:0 !important; padding-right:0 !important} .first_li, .first{margin-left:0 !important; padding-left:0 !important} .clearfix:after , ul:after , ol:after , .full_row:after , .modal-body:after {content:"";display:block;clear:both;visibility:hidden;line-height:0;height:0}html[xmlns] .clearfix{display:block}* html .clearfix{height:1%} /*================================= 2 Font Face ( #face ) =================================*/ /* TypoGraphy */ /* */ /*================================= 3 Inputs ( #input ) =================================*/ input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance:none; margin:0;} ::-webkit-input-placeholder {color:#343434; font-style:normal;} :-moz-placeholder {color:#343434; font-style:normal;} ::-moz-placeholder {color:#343434; font-style:normal;} :-ms-input-placeholder {color: #343434; font-style:normal;} button::-moz-focus-inner {border: 0} :focus {outline:none;} ::-moz-focus-inner {border:0;} input[type=number] {-moz-appearance:textfield} input[type=number]::-webkit-outer-spin-button, input[type=number]::-webkit-inner-spin-button {-webkit-appearance: none; margin: 0} input[type="submit"]:hover {background:#f47638} input[type=submit]{padding:18px 20px; background:#f49438; color:#fff; display:block; margin:0 auto; font-weight: 300; text-transform: uppercase; width: 100%; transition: all 0.3s linear 0s} input[type=submit] , input[type=button]{cursor:pointer; border:0} input:focus{outline:none;} body textarea{resize:none; height:94px; font-size:18px; font-style:normal; color:#343434; line-height:31px; padding:10px 0 0 15px; border-color:#f49438; background-color: #f6f6f6 } input[type="text"], input[type="tel"], input[type="password"], input[type="date"], input[type="email"], input[type="number"], textarea{background:#f6f6f6; border: 0; border-bottom: 1px solid #f49438; border-radius:0; color:#343434; font-size: 18px; font-weight: 400; line-height: 26px; width:100%; height:36px; padding:5px 15px; box-shadow:none; -webkit-appearance:none; } input[type="text"]:focus, input[type="tel"]:focus, input[type="password"]:focus, input[type="date"]:focus, input[type="email"]:focus, input[type="number"]:focus, textarea:focus { background:#f3f3f3} form label{color: #006db7; font-size: 16px; display: block; font-weight: 900; margin-bottom:0; text-transform:uppercase} .form_row{padding-bottom:25px} .form_row.msg_row{padding-bottom:10px} .form_row.submitrow{padding-bottom:0} input:required{box-shadow:none} /*input:required:focus{background-color: rgba(223, 73, 73, 0.2); border: 1px solid #df4949; box-shadow:none} */ *{-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;} /*================================= 4 Global Styles (#glob) =================================*/ /* Gobal #GAB */ .x:before {position:absolute; content:''} /* Vertical Middle */ .x:before /*Parent Before*/ {content: ''; display: inline-block; height: 100%; vertical-align: middle; margin-right: -0.25em} .x /* Child class */ {display: inline-block; vertical-align: middle} /* HR Rules */ hr{} /* Image Alignment */ .alignnone , a img.alignnone {margin: 5px 0 50px} .aligncenter, div.aligncenter {display: block; margin: 5px auto 20px auto} .alignright , a img.alignright{float:right; margin: 5px 0 20px 60px} .alignleft , a img.alignleft {float: left; margin: 5px 60px 20px 0} a img.aligncenter {display: block; margin-left: auto; margin-right: auto} h1 b , h1 strong , h2 b , h2 strong , h3 b , h3 strong , h4 b , h4 strong , h5 b , h5 strong , h6 b , h6 strong{font-weight: 700} h1{color:#ffffff; font-size: 35px; line-height: 45px; text-transform: uppercase; font-weight: 300;} h2{color:#ffffff; font-size: 35px; line-height: 45px; text-transform: uppercase; font-weight: 300; margin-bottom:20px;} h3{color:#18365b; font-size: 25px; font-weight: 700; line-height: 25px; text-transform: uppercase; margin-bottom: 25px;} h4{color: #18365b; font-size: 22px; font-weight: 700; line-height: 55px;} h5{color: #18365b; font-size: 20px; font-weight: 700; line-height: 25px;} h6{} p , .band_spacer ul li, .band_spacer ol li{color: #767676; font-size: 18px; font-weight: 300; line-height: 28px; margin-bottom:20px} p:last-child{margin-bottom:0} p.intro{color: #18365b; font-size: 25px;font-weight: 300; line-height: 35px; margin-bottom: 20px} p a{color:#f47638; } p strong{font-weight:7 00} p em{font-style:italic} p a:hover{text-decoration:underline; color: #c25119} .band_spacer ul , .band_spacer ol{padding-bottom:22px} .band_spacer ul li, .band_spacer ol li{margin-bottom:5px; position:relative; color:#767676} .band_spacer ul li{padding-left:13px;} .band_spacer ul li:before {color: #444444; content: "-"; font-weight: 300; left: 0; position: absolute; font-size:18px;} .band_spacer ul ul , .band_spacer ol ul , .band_spacer ol ol{padding:5px 0} .band_spacer ol{counter-reset: section} .band_spacer ol li{padding-left:22px} .band_spacer ol > li:before {color:#767676; content:counter(section, decimal) "."; counter-increment:section; padding-right:5px; font-size:18px; position:absolute; left:0} .band_spacer ol ul li{padding-left:20px} .band_spacer ol ol li{list-style:lower-alpha outside; padding-left:30px; margin-left:20px} .band_spacer ol ol li:before{content:none} .band_spacer ol ol li{padding-left:10px} a:focus, a:hover{outline:none; text-decoration:none;} .visible_tab{display:none} /* ================================= 5 Wrappers #wrap ================================= */ body{background:#ffffff; font-family: 'Montserrat', sans-serif; line-height: 1; color:#767676; font-weight: 300; padding-right:0 !important} .container{max-width:1372px; width:100%; padding-left: 100px; padding-right: 100px;} .full_row{width:100%; float:none; margin:0 auto} .small_container{max-width:930px; margin:0 auto; float:none; padding-left: 15px; padding-right: 15px;} .site_full{max-width:1690px; margin:0 auto; position:relative} .ht_btn, .hero_band li a{font-size: 18px; font-weight: 300; background-color: #f49438; padding: 14px 21px; display: inline-block; color:#fff; text-transform: uppercase} .ht_btn:hover , .nav_cover > ul > li > a.ht_btn:hover{background-color: #f47638; color: #fff} .ht_btn.ghost_btn , .ghost_btn{background-color:rgba(255,255,255,0.25);} .ht_btn.ghost_btn:hover , .ghost_btn:hover{background-color:rgba(255,255,255,1); color: #f47638} .border_btn{background-color:#f49438; border: 1px solid #f49438; color: #fff} .border_btn:hover{background-color:transparent ; border: 1px solid #f49438; color: #f49438} .industries_btn {margin-top:30px;} .btn_group .ht_btn{margin-right: 20px} /* ================================= 6 Custom CSS #custome ================================= */ .main_header{background-color: rgba(0,0,0,0.50); position: fixed; top: 0; left: 0; width: 100%; transform: translateY(0)} .main_header.nav-up{transform: translateY(-53px); background: rgba(0, 0, 0, 0.7)} .main_header.nav-down{transform: translateY(0)} .main_header.nav-up .bottom_nav .logo{margin-top: 20px;} .main_header.nav-up .nav_cover > ul > li > a{padding: 40px 13px 36px ;} .main_header.nav-up .nav_cover > ul > li > a.ht_btn{font-weight: 300; padding: 16px 21px;} .main_header.nav-up .nav_cover > ul > li.sub_menu a {padding-right: 20px;} .top_nav{background: #18365b; padding: 10px 0} .top_nav p{float: left; color:#fff; font-size: 15px; font-weight: bold; margin-bottom: 0} .top_nav p a{color:#fff} .top_nav p i{display: inline-block; height: 33px; width: 33px; border-radius: 100%; background-color: rgba(255,255,255,0.20); line-height: 33px; text-align: center; font-size: 15px; margin:0 5px;} .top_nav ul{float: right;} .top_nav ul li{display: inline-block; margin-left: 42px;} .top_nav ul li:first-child{margin-left: 0;} .top_nav ul li a{color:#fff; padding:8px 0; display: inline-block; font-size: 15px;font-weight: bold} .top_nav ul li a:hover{color:#f47638} .bottom_nav .logo{margin-top: 30px; display: inline-block} .bottom_nav .logo img{max-width: 100%} .nav_cover > ul{float: right;} .nav_cover > ul > li{display: inline-block; position: relative} .nav_cover > ul > li > a{font-size: 18px; font-weight: bold; padding:50px 15px 46px; display: block; text-transform: uppercase; color: #fff;} .nav_cover > ul > li:hover > a{background-color:#000000} .nav_cover > ul > li:first-child{margin: 0} .nav_cover > ul > li.sub_menu a{padding-right: 25px; position: relative} .nav_cover > ul > li.sub_menu > a:after{content: "\f103"; font-size:10px; font-weight: bold; font-family:'FontAwesome'; height: 12px; margin: auto; margin-left: 3px; position:absolute; top:6px; bottom:0; color: #f49438} .nav_cover > ul > li > a.ht_btn {padding: 16px 19px; font-weight: 300;} .sub_menu > ul{background-color: #000000; left: 0; margin-top: 10px; opacity: 0; position: absolute; text-align: left; top: 100%; transition: all 0.2s ease 0s; visibility: hidden; width: 300px; padding-bottom: 10px} .sub_menu > ul *{ transition:all 0s} .nav_cover > ul > li:hover > ul {margin-top: 0; opacity: 1; visibility: visible;} .sub_menu > ul > li > a {color: #fff; display: block; font-size: 18px; font-weight: bold; line-height: 20px; padding:11px 14px 9px; text-transform: uppercase; transition: background-color 0.2s ease 0s} .sub_menu > ul > li > a:hover{background-color: #f47638} #myModal.modal{text-align: center; padding: 0!important; z-index:214744; display: block !important; opacity: 1; pointer-events: none} #myModal.modal.show{pointer-events: auto; background:#fff} #myModal.modal .modal-dialog:before{content: ''; display: inline-block; height: 100%; vertical-align: middle; margin-right: -5px;} #myModal .modal-content{background-color: transparent; height:100%; display: inline-block; text-align: left; vertical-align: middle; width:100%; box-shadow: none; border: 0; pointer-events: none} .modal-open #myModal.modal , .modal-open #myModal .modal-content .modal-body ,.modal-open #myModal .modal-content{pointer-events: auto;} #myModal .modal-dialog{width:100%; height: 100%; margin: 0 auto !important; transform: none !important; max-width: 100%;} #myModal .modal-content .left_pop{width:28%; float: left; background:url(../img/../img/modal.jpg) no-repeat #0a3058; padding:60px 60px 25px 40px; text-align: right; background-size: 100% 628px; transition-timing-function: cubic-bezier(0.1, 0.57, 0.1, 1); transition-duration: 500ms; transform: translateX(calc(-100% - 40px)); background-position: top center; opacity: 0; z-index: 0; position: relative} #myModal .modal-content .left_pop:before {background: rgba(0, 0, 0, 0) linear-gradient(#ff0000, #008000); bottom: 0; content: ""; height: calc(100% - 600px); left: 0; position: absolute; width: 100%;} #myModal .modal-content .left_pop:after{content: ""; top:0; position: absolute; left: 0; right: 0; width: 100%; height: 100%; background:rgba(24,54,91,0.85); z-index: -1;} #myModal.modal.show .modal-content .left_pop{ transform: translateX(0px); opacity: 1} #myModal.modal.show .modal-content .right_pop{ transform: translateX(0px); opacity: 1;} #myModal .modal-content .left_pop:before {background:rgba(0, 0, 0, 0) linear-gradient(to bottom, rgba(30, 87, 153, 0) 0%, #1b3353 100%); top: 490px;content: ""; height: 140px; left: 0; position: absolute; width: 100%; z-index: -1} #myModal .modal-content .left_pop img{margin-top:0px; display: inline-block; margin-bottom: 35px; max-width: 100%;} #myModal .modal-content .left_pop p{color:#fff; max-width: 280px; float: right; text-transform: uppercase; font-size: 20px;} #myModal .modal-content .left_pop p strong{font-weight: 700;} #myModal .modal-content .right_pop{width:72%; float: right; padding: 50px 50px 60px; background:#fff; -webkit-transform: translateX(calc(100% + 40px)); -ms-transform: translateX(calc(100% + 40px)); transform: translateX(calc(100% + 40px)); transition-timing-function: cubic-bezier(0.1, 0.57, 0.1, 1); transition-duration: 500ms; opacity: 0; overflow: hidden} #myModal .modal-content .modal-body{padding: 0;} #myModal .modal-content .right_pop > span{color: #18365b; font-size: 35px; font-weight: 700; line-height: 45px; margin-bottom: 5px; display: block;} #myModal .modal-content .right_pop strong{color: #848484; font-size: 20px; line-height: 30px; font-weight: 500; margin-bottom: 30px; display: block} #myModal .modal-content .right_pop .form_main{max-width: 420px; } #myModal .modal-body{display: flex; height: auto; min-height: 100%} #myModal .close.rid_btn{ right:30px;z-index: 999; background-color: #18365b; padding:0; transition:all 0.3s linear 0s; color:#fff; position: absolute; opacity: 0; top:30px; transform:translateX(calc(100% + 70px)); width:48px; height: 48px; line-height: 45px} #myModal .close.rid_btn:after{position:absolute; content: "\f00d"; font-family:'FontAwesome'; color:#fff; font-size: 40px; line-height: 42px; text-transform: uppercase; font-weight: 400; left: 0; top:0; width: 100%; text-align: center;} #myModal.modal.show .close.rid_btn{transform:translate(0); opacity: 1} form label{font-size: 16px; font-weight: 700; line-height: 28px; text-transform: capitalize; color: #6a6b6b; display: block; margin-bottom: 2px;} .form_col{margin-bottom:12px;} form sup{top:-6px; color:#ff0000} .form_main .msg_col{margin-bottom: 20px;} #myModal .modal-open{overflow:visible} .light_ancor a{color:#b1aea4 !important;} .wrni{color: #18365b;font-size: 15px; line-height: 20px; font-weight: 300; padding-left:0; position: relative; margin-top: 5px; margin-bottom: 10px;} .wrni sup{font-size: 21px; font-weight: bold} /*.wrni:after{position: absolute; content: "\f06a"; font-family:'FontAwesome'; font-size:20px; color: #848484; left: 0; top: 0}*/ .row_small {margin-left: -10px;margin-right: -10px;} .row_small>[class^="col-"]{padding-left: 10px; padding-right: 10px;} .hero_band{padding-top:166px; background:url(../img/header-banner.jpg) no-repeat top center; background-size: cover; height: 525px} .hero_band > .container > .row > .col-6{padding-top: 50px;} .hero_band .col-6 > h1{font-size:35px; font-weight: 700; color: #fff; line-height: 45px; text-transform: uppercase; display: block;} .hero_band .col-6 > span{font-weight: 300; font-style: normal; font-size: 35px; text-transform: uppercase; color:#fff; display: block; margin-bottom: 15px; line-height: 45px;} .hero_band .col-6 .ht_btn{margin-right:20px;} .form_cover{background-image: url('data:image/svg+xml;utf8,'); background-repeat: no-repeat; background-size: 100% auto; padding:22px 40px 54px 40px; margin-top: 10px; position: relative; z-index: 0} .form_cover p{font-size: 22px; color: #18365b} .form_cover p b{display: block; font-weight: 700;} .form_cover::before {background: #ffffff; bottom:0; content:""; height: 60%; left: 0; position: absolute; width: 100%; z-index: -1;} .form_cover .wrni{font-size: 14px; margin-top: 15px; margin-bottom: 22px; color: #6a6b6b} .form_cover .wrni strong{font-weight: 700;} .form_cover input[type="submit"]{position: absolute; bottom: 0; left: 0; width: 100%} .form_cover .col-12{position: static;} .band_spacer{padding:60px 0;} .proof_points li{color:#18365b !important; position: relative; font-size: 18px; font-size: 18px; line-height: 45px !important; text-transform: uppercase; padding-left: 20px; z-index: 0; margin-bottom: 13px !important;} .proof_points li:before{content: "" !important; width: 48px; height: 48px; background-color: #fff; position: absolute; left: 0; top: 0; z-index: -1; bottom: 0; margin: auto} .proof_points li b{font-weight: bold; color:#18365b} .proof_points{background:#f6f6f6;} .proof_points li:last-child{margin-bottom: 0;} .our_values{background:url(../img/values-background.jpg) no-repeat; background-size: cover} .our_values .col-6{max-width: 430px;} .our_values p{font-size: 18px; color:#fff} .services_band h2{font-weight:700; color: #18365b; margin-bottom:10px;} .services_band li{ width:33.333%; float: left; padding-left:15px; padding-right: 15px; margin-bottom: 30px !important;} .services_band ul{margin-left:-15px; margin-right: -15px; padding-left: 60px} .services_band.band_spacer li:before{display: none} .services_band li a{ display: block; background: url(../img/servce_img.png) no-repeat #18365b; padding: 28px 22px; min-height: 180px; background-position: bottom center; background-size: 100% auto; display: block; color:#fff !important; line-height: normal; position: relative; border-radius: 3px; } .services_band li a:after{content: ""; height: 100%; width: 100%; position: absolute; top: 0; left: 0; border: 3px solid #18365b; border-radius: 3px; opacity: 0; transition: all 0.3s linear 0s; pointer-events: none} .services_band li a:hover:after{opacity: 1} .services_band li a:hover{background-color: #f47638; border-color: ; border-radius: 3px; box-shadow: 0 0 0 rgba(0, 1, 1, 0.2);} .services_band li a span{font-size: 16px; display: block; font-weight: 700; text-transform: uppercase; line-height: 1.3} .services_band li a b{font-size: 14px; font-weight: 300; position: absolute; bottom: 30px; left: 22px; text-transform:none} .aboutus_band{background-color: #f49438;} .aboutus_band p , .aboutus_band h2 {color:#fff} .aboutus_band .img_col{background: url(../img/about-us-band.jpg) no-repeat; background-size: cover} .aboutus_band .content_col{padding:60px 45px; max-width: 630px; position: relative;} .aboutus_band .content_col:before{content: ""; width: 0; height: 0; border-style: solid; border-width: 0 90px 90px 0; border-color: transparent #f49438 transparent transparent; position: absolute; right: 100%; top: 0;} .pre_footer{background:url(../img/prefooter-background.jpg) no-repeat; background-size:cover; padding: 40px 0; border-top:9px solid #606060; border-bottom:9px solid #606060;} .pre_footer span{color:#fff; text-transform: uppercase; font-size: 23px; max-width: 550px; text-align: center; line-height: 35px; vertical-align: middle} .pre_footer span b{font-weight: bold} .pre_footer .ht_btn{height:48px ; vertical-align: middle; margin-left: 50px;} .pre_footer .row{align-items: center} .midd_footer{background-color: #474747; padding: 25px 0 ; position: relative} .midd_footer h3{font-size:25px; font-weight: bold; text-transform: uppercase; display: block; padding-bottom:10px; border-bottom: 1px solid #858585; margin-bottom: 5px; text-align: center; opacity: 0.5; color: #ffffff} .midd_footer li{display: block; text-align: center; } .midd_footer li a{display: inline-block; padding: 10px 0; line-height: 20px; font-weight: 700; text-transform: uppercase; color:#fff; max-width: 260px; font-size: 15px;} .midd_footer li a:hover{color:#f47638} .midd_footer .small_container{padding: 0 25px;} .midd_footer .row{margin-right: -60px; margin-left: -60px;} .midd_footer .row > [class^="col-"]{padding-left: 60px; padding-right: 60px;} .midd_footer:before{background-image:url('data:image/svg+xml;utf8,'); background-repeat: no-repeat; content: ""; max-width: 1425px; position: absolute; top: 0; left: 0; top: 100%; right: 0; width: 100%; margin: auto; height: 100%; background-position: top center; max-height: 100px} .bottom_footer{background-color: #18365b; padding: 100px 0 50px; text-align: center} .bottom_footer a.footer_logo{display: block; margin-bottom: 40px;} .bottom_footer a.footer_logo img{max-width: 100%} .bottom_footer p{color:#fff; font-size: 15px; font-weight: bold} .bottom_footer p i{font-style: normal; margin: 0 10px } .bottom_footer p a{color:#fff} .fpm_brand{color:#fff; font-size: 15px; } .fpm_brand:hover{text-decoration: none; color: #fff} .fpm_brand b{margin-left: 13px; position: relative; width: 133px; height:33px; display: inline-block; vertical-align: middle} .fpm_brand b:hover:before{opacity: 0;} .fpm_brand b:hover:after{opacity: 1;} .fpm_brand b:before{content: ""; height: 100%; width: 100%; background:url(../img/normal_fpm.png) no-repeat; position: absolute; left: 0; top: 0; opacity: 1; transition: all 0.3s linear 0s } .fpm_brand b:after{content: ""; height: 100%; width: 100%; background:url(../img/hover_fpm.png) no-repeat; position: absolute; left: 0; top: 0;opacity: 0; transition: all 0.3s linear 0s } .cd-top.desk {bottom:50px; color: #FFF !important; display: inline-block; font-size:22px; font-weight: 500; height: 50px; line-height:50px; overflow: hidden; position: fixed; right: 50px; text-align: center; text-transform: uppercase; transition:opacity 0.3s linear 0s, visibility 0.3s linear 0s; visibility: hidden; white-space: nowrap; width: 50px; opacity: 0; background-color: #f49438 ; border-radius:3px} .cd-top.desk.cd-is-visible {opacity: 1; visibility: visible; z-index:9999;transition: all 0.3s linear 0s;} .cd-top.desk:hover {background-position: center -102px !important; color: #FFF !important; background-color: #f47638 ; box-shadow:0 20px 30px rgba(0, 0, 0, 0.15); transition: all 0.3s linear 0s; opacity:1} .hero_band .content_col ul{display: none} .sticky_foot{position: fixed; bottom: 0; left: 0; width: 100%; z-index: 999; display: none; background-color: #4e4e4e; justify-content: space-between; align-content: center} .sticky_foot .cd-top {align-self: center;display: flex;height: 14px; font-weight: 13px; color: #ffffff; margin: 0 22px;} .sticky_foot .ht_btn{font-size: 13px; padding:5px 9px;border-radius: 3px; margin: 4px 21px; font-weight: 700;} .call_mobile{background-color: #000 !important; height: 35px; position: relative; width: 49px; font-size: 20px; text-align: center; line-height: 35px; color: #fff; left:-15px; display: none} .call_mobile:hover{color:#fff; background-color: #f49438} .navicon{width: 49px; background-color: #f49438 !important; height: 35px; position: relative} .navicon *{display: block} .navicon span:before{width: 19px; height: 1px; background-color: #fff; content: ""; position: absolute; top: 5px; right: 0} .navicon span:after{width: 28px; height: 1px; background-color: #fff; content: ""; position: absolute; top: 11px; right: 0} .navicon span {border-bottom: 1px solid #ffffff;float: right; height: 19px; width: 20px; position: relative; margin-right: 10px; transition: all 0.3s;} .navicon i {bottom: 7px; color:#ffffff; font-size: 10px; font-style: normal; right: 10px; line-height: 0; position: absolute; font-weight: 700} a.navicon:after {background: #ffffff; bottom: 0; content: ""; height: 1px; left: 0; margin: auto; position: absolute; right: 0; top: 0; transform:rotate(40deg); width: 40px; opacity: 0; transition: all 0.3s;} a.navicon:before {background:#ffffff; bottom:0; content:""; height:1px; left:0; margin:auto; position:absolute; right:0; top:0; transform:rotate(-40deg); width:40px; opacity: 0; transition: all 0.3s;} .mm-opened a.navicon:after , .mm-opened a.navicon:before{opacity: 1; } .mm-opened a.navicon span , .mm-opened .navicon i{opacity: 0;} .page_title{min-height: 300px; background:url(../img/header-banner.jpg) no-repeat; background-size: cover; padding-top: 170px; background-position: top center; position: relative;} .page_title h1{font-weight: 700; padding: 30px 50px 100px; position: relative} .page_title h1:before{content: '\f101'; font-size:35px; color: #f49438; position: absolute; font-family:'FontAwesome'; left: 0} .page_title:after{ content: ""; background-image: url('data:image/svg+xml;utf8, '); width: 100%; height: 100px; position: absolute; background-size: 100% auto; background-repeat: no-repeat; left: 0; bottom: -1px; background-position: bottom center} .intro_blurb.band_spacer{padding-top: 40px} .intro_blurb img{margin-bottom:30px; max-width: 100%} .hotspot{margin-top: 45px;} .hotspot ul{-moz-column-count: 2; -moz-column-gap:40px; -webkit-column-count:2; -webkit-column-gap:40px;column-count: 2;column-gap: 40px; padding-bottom: 0} .hotspot ul li{margin-bottom: 18px !important; padding-left: 0} .hotspot ul li:before{display: none} .hotspot a{color: #f47638; font-size: 18px; font-weight: 300;line-height: 30px; text-transform: uppercase; padding: 8px 20px; border: 1px solid #eaeaea; display: inline-flex; box-shadow: 0 0 0 rgba(0, 0, 0, 0.1); transition: all 0.3s linear 0s; width:100%;} .hotspot a:hover{box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);} .hotspot a:hover:before{left: 8px} .hotspot a:before{content: '\f054'; font-size: 18px; color:#f47638; font-family:'FontAwesome'; margin-right: 18px; position: relative; left: 0; transition: all 0.3s} .two_col .row{margin-left: -40px; margin-right: -40px;} .two_col .row [class^="col-"]{padding-left: 40px; padding-right: 40px;} .gray_band{background-color: #f6f6f6} .branding{background-image:url(../img/Branding.png); background-repeat: no-repeat; background-position: right bottom} .spec_heading{background-color: #18365b; padding: 22px 0 24px;} .spec_heading h2{font-size: 30px; line-height: 40px; margin-bottom: 0; text-transform: none; font-weight: 700; display: block; text-align: center} .spec_heading .container p.intro {color:#fff; text-align:center;} .spec_heading .container p { margin-bottom:0 !important;} .spec_heading .container p.intro_spacer {padding: 15px 0; margin-bottom:0 !important;} .band_spacer li a{color:#f47638} .band_spacer li a:hover{color: #f49438;} .band_spacer li p a:hover{color: #c25119; text-decoration: underline;} .form_col b{ font-size: 16px; font-weight: 700; display: block; line-height: 28px;} .radio_call input , .radio_call label{display:inline-block; cursor: pointer} .radio_call input[type="radio"] {display:none;} .radio_call input[type="radio"] + label {color:#767676; font-weight: 300; margin-bottom: 0} .radio_call input[type="radio"] + label:before {content: ""; display:inline-block; width:15px; height:15px; margin:-2px 10px 0 0; vertical-align:middle; background:transparent; cursor:pointer; border-radius: 100%; border: 1px solid #767676} .radio_call input[type="radio"]:checked + label:before {background:#767676;} /*.drop_cover .form_cover{clip-path: polygon(89% 0, 100% 14%, 100% 100%, 0% 100%, 0 0); box-shadow: none} */ .drop_cover{filter: drop-shadow(0 0 60px rgba(0,0,0,0.25)); } .call_us{padding-left: 45px} .call_block{margin-bottom:15px} .call_block a p{transition: all 0.3s linear 0s} .call_block a h4:hover , .call_block a p:hover{color:#f47638} .call_us > h5{margin-bottom:18px; margin-top: 3px} .call_us > p{font-size: 18px; line-height: 30px; } .call_us p i{margin-right:15px} .call_us h4{line-height: 30px; white-space: nowrap; transition: all 0.3s linear 0s} .call_us h4 a{color: #18365b;} .call_us h4 a:hover{ color:#f47638} .industries_band{text-align:center} .industries_band i{color: #f49438; font-size: 20px; font-weight: 400; line-height: 52px; background-color:#fff; display: inline-block;width: 59px; height: 52px; text-align: center; margin-bottom: 28px;} .industries_band h5{/* max-width: 130px; */ margin: 0 auto} .industries_band .col-3{margin-bottom:25px;} .faq_band h4{text-transform: uppercase; margin-bottom: 20px;} .accordion{margin-bottom: 30px;} .accordion-section h4{margin-bottom: 0} .accordion-section{border: 1px solid #f4f4f4; transition: all 0.3s linear 0s; margin-bottom: 11px;} .accordion-section:hover{border-color:#f49438; box-shadow: 0 3px 5px rgba(7, 5, 4, 0.05); } .accordion-section p{font-size: 18px;} .accordion-section-content {display: none; padding: 12px 30px 25px 20px; border-top: 1px solid #f4f4f4; transition: border 0.3s} .accordion-section-title{color: #18365b;font-size: 20px; font-weight: 700;line-height: 25px; padding: 8px 40px 10px 30px; display: block; position: relative; text-transform: none !important} .accordion-section-title:hover{color:#18365b} .accordion-section-title:before{content: "\f078";color: #f49438; font-size: 15px; font-weight: 400; line-height: 16px; font-family:'FontAwesome'; position: absolute; right: 14px; height: 16px; top:0; bottom: 0; margin: auto; transition: all 0.3s linear 0s; transform: rotate(90deg)} .accordion-section-title.active:before{transform: rotate(0)} .accordion-section:hover .accordion-section-content{border-color: #f49438} .cta_band {background:#ececec;} .cta_band .img_band{background:url(../img/cta-band.jpg) no-repeat; background-size: cover} .cta_band .content_col{padding-left: 45px; padding-bottom: 30px; padding-top: 30px} .cta_band h3{margin-bottom:20px;} .cta_band p{margin-bottom: 25px } form label.error{display: none !important;} input.error , textarea.error{border-color:red !important; background-color: rgba(255, 0, 0,0.1);} #message , #message2{margin: 15px 0; color: #197924; font-weight: bold} /* ================================= 7 Media Query #media ================================= */ /********************************* Mobile Potrait #MP ********************************/ @media screen and (max-width: 320px) and (orientation: portrait) {} /********************************* Mobile Potrait ********************************/ @media screen and (max-width: 480px) and (orientation: portrait) {} /********************************* Mobile landscape ********************************/ @media screen and (max-width: 480px) and (orientation: landscape) {} /* ================================= Common For All mobile definitions #mx ================================= */ @media all and (max-width: 767px) { html * {max-height:1000000px} .top_nav , .nav_cover , .cd-top.desk , .hero_band .ht_btn , .aboutus_band .content_col:before , .band_spacer br {display:none} h1{font-size:28px; line-height:normal} h2{font-size:21px; line-height: 1.4; } h3{font-size:20px; margin-bottom: 15px;} h4{font-size:18px; line-height: 1.4} .col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9{width: 100%; max-width: 100%; flex: 0 0 100%} p, .band_spacer ul li, .band_spacer ol li{font-size:16px; line-height:24px} p.intro{font-size:20px; line-height:30px} .container{padding-left:15px; padding-right: 15px;} /* Image Alignment */ .alignnone , a img.alignnone , .aligncenter, div.aligncenter , .alignright , a img.alignright , .alignleft , a img.alignleft{margin: 20px auto 30px; float:none} .main_header {background-color: #4e4e4e;} .logo_col .logo{max-width: 156px; position: absolute; left: 0; right: 0; margin: 4px auto 0; } .logo_col img{max-width:100%} .hero_band{padding-top: 30px; height: auto; background-image: none} .hero_band .col-6 > h1{font-size: 25px; line-height: 30px; text-align: center} .hero_band .col-6 > span{display: block; font-size: 25px; line-height: 30px; text-align: center} .hero_band .col-6 > h1 br{display: none} .hero_band .content_col{background: url("../img/banner.jpg") no-repeat; background-size: cover; padding-bottom: 30px; padding-top: 50px} .hero_band > .container > .row > .col-6{padding-top: 30px;} .hero_band .content_col ul.row{display: inline-flex; margin-left: -5px; margin-right: -5px;} .hero_band .content_col ul.row [class^="col-"]{padding-left: 5px; padding-right: 5px;} .hero_band .content_col ul li {margin-bottom: 10px} .hero_band .content_col ul li a{width: 100%; height: 100%; align-items:center; justify-content:center; display: flex; min-height: 48px; font-size: 13px; text-align: center; padding: 14px 18px; line-height: 15px} .hero_band .content_col ul li a.ghost_btn{background-color:rgba(255,255,255,0.25);} .hero_band .content_col ul li a.ghost_btn:hover{background-color:rgba(255,255,255,1); color: #f47638} .form_cover{padding: 20px 20px 54px;} .form_cover p {color: #18365b; font-size: 15px; line-height: normal; margin-bottom: 10px;} .sticky_foot{display: flex} .band_spacer{padding: 40px 0} .proof_points li{font-size: 16px; line-height: 30px !important; padding-left: 13px; } .proof_points li:before{height: 30px; width: 30px; bottom: auto} .services_band .col-3{margin-bottom: 40px} .services_band ul{padding-left: 0;} .services_band li{ width: 100%; margin-bottom: 25px;} .services_band li:last-child{margin-bottom: 0} .aboutus_band .img_col{height: 300px} .aboutus_band .content_col {max-width: 100%;padding: 30px 20px;} .pre_footer{padding: 30px 0} .pre_footer .row{display: block; text-align: center} .pre_footer .ht_btn{margin-left: 0} .pre_footer span{display: block; margin-bottom: 20px; padding:0 20px } .midd_footer .row{margin-left: -15px; margin-right: -15px;} .midd_footer .row > [class^="col-"]{padding-left: 15px; padding-right: 15px;} .midd_footer .row .col-6{margin-bottom: 40px;} .midd_footer h3{font-size: 20px;} .midd_footer:before{background-size: 100%; padding-bottom: 0} .main_header.nav-up {transform: translateY(0);} .fpm_brand{font-size: 13px} .bottom_footer{padding: 50px 0 ; } .bottom_footer p , .bottom_footer p a{font-weight: 400; line-height: 24px} .bottom_footer a.footer_logo{margin-bottom: 30px;} .services_band li a{max-width: 260px; margin: 0 auto} #myModal .modal-content .left_pop:before{display: none;} #myModal .modal-content .left_pop {width:100%; order: 2; padding: 29px 20px 25px 20px;} #myModal .modal-content .right_pop{width:100%; order: 1; padding: 30px 30px 40px} #myModal .modal-body{flex-flow: wrap} #myModal .modal-content .left_pop img{margin: 0 auto 40px; display: block} #myModal .modal-content .left_pop p{margin: 0 auto; float: none} #myModal .modal-content .right_pop > span{font-size: 28px;} .call_mobile{display: inline-block;} .two_col .row{margin-left: -15px; margin-right: -15px;} .two_col .row [class^="col-"]{padding-left: 15px; padding-right: 15px;} .page_title:after{bottom: -1px} .page_title{min-height: auto; padding-top: 35px} .page_title h1 {padding: 30px 30px 50px; font-size: 25px;} .page_title h1:before{top:24px;} .intro_blurb img{margin-bottom: 15px;} .hotspot{margin-top: 20px;} .hotspot h3{margin-bottom: 20px} .hotspot ul{-moz-column-count: 1; -moz-column-gap: 0; -webkit-column-count:1; -webkit-column-gap:0;column-count: 1;column-gap: 0;} .hotspot a{font-size: 16px} .hotspot a:hover:before{left: 0} .hotspot a::before{left: -6px;} .hotspot ul li:last-child{margin-bottom: 0 !important} .two_col .row .col-6:first-child{margin-bottom: 20px} .spec_heading h2{font-size: 22px; line-height: 28px;} .spec_heading{padding: 14px 0} .call_us{padding-left: 15px; margin-top: 30px;} .call_us > h5{margin-bottom: 5px; margin-top: 0} .btn_group .ht_btn {display: inline-block;font-size: 13px; margin-right: 10px;padding: 13px 16px;} .industries_band i{margin-bottom: 20px; } .industries_band .col-3{margin-bottom: 35px;} .accordion-section-title{padding: 8px 40px 10px 20px; font-size:18px; font-weight: 400; line-height: 26px; font-weight: 400} .cta_band .img_band {height: 120px; margin: 0 auto; max-width: calc(100% - 30px);} .hero_band ul .col-6{flex: 0 0 50%; max-width: 50%} .fpm_brand b{margin-top:5px } .btn_group{text-align: center} .cta_band .content_col{padding: 30px 30px 30px 35px} .branding{ background-size:300px} body.modal-open #page {height: 0; overflow: hidden !important;} } /********************************* ipad portrait #ip ********************************/ @media only screen and (min-width : 768px) and (max-width: 1024px) { .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 {float: left} .col-md-12 {width: 100%} .col-md-11 {width: 91.66666667%} .col-md-10 {width: 83.33333333%} .col-md-9 {width: 75%} .col-md-8 {width: 66.66666667%} .col-md-7 {width: 58.33333333%} .col-md-6 {width: 50%} .col-md-5 {width: 41.66666667%} .col-md-4 {width: 33.33333333%} .col-md-3 {width: 25%} .col-md-2 {width: 16.66666667%} .col-md-1 {width: 8.33333333%} h1{font-size:38px} h2{font-size:28px; line-height: 1.3} h3{font-size:22px} h4{font-size:21px} p, .band_spacer ul li, .band_spacer ol li{font-size:18px} p.intro{font-size:20px} .hidden-tab , .nav_cover , .top_nav .hidden-tab , .nav_cover , .top_nav , .cd-top.desk {display:none} /* Image Alignment */ .alignnone , a img.alignnone , .aligncenter, div.aligncenter , .alignright , a img.alignright , .alignleft , a img.alignleft{margin: 30px auto; float:none} .alignleft, a img.alignleft{margin: 5px 30px 20px 0; float: left; } .alignright, a img.alignright{margin: 5px 0 20px 30px; float: left} .visible_tab{display:block !important} .container , .small_container{padding-left: 30px; padding-right: 30px;} .logo_col{width:100%; flex: 0 0 100%; max-width: 100%;} .logo_col .logo{max-width: 170px; position: absolute; left: 0; right: 0; margin: 4px auto 0; } .logo_col img{max-width:100%} .visible_tab.call_mobile{display: inline-block !important} a.navicon{top:0; height: 40px; right: -30px;} .call_mobile{height: 40px; width: 45px; line-height: 40px; left: -30px;} .hero_band{padding-top: 30px} .hero_band .col-6 > h1, .hero_band .col-6 > span{font-size: 26px; line-height: 36px;} .form_cover p{font-size: 16px; line-height: normal; margin-bottom: 10px;} .form_cover{z-index: 0; padding: 22px 25px 54px} .form_cover:before {background: #ffffff; bottom: 0; content: ""; height: 50%; left: 0; position: absolute; width: 100%;z-index: -1;} input[type="text"], input[type="tel"], input[type="password"], input[type="date"], input[type="email"], input[type="number"], textarea{height: 34px;} form label{margin-bottom: 0} .form_col{margin-bottom: 8px} .form_cover .row{margin-left: -10px; margin-right: -10px} .form_cover .row .col-6{padding-left: 10px; padding-right: 10px } .proof_points li:before{height: 28px;width: 28px; bottom: auto;} .proof_points li{margin-bottom:13px; line-height: 30px !important; padding-left: 16px; font-size: 16px !important; } .band_spacer{padding: 40px 0} .services_band ul{padding-left: 0} .services_band li a{padding: 15px 20px; min-height: 160px} .services_band.band_spacer{padding: 40px 0 20px} .aboutus_band .content_col:before{border-width: 0 60px 60px 0} .aboutus_band .content_col{padding: 30px 40px;} .pre_footer .ht_btn{margin-left: 20px;} .midd_footer .row{margin-left: -15px; margin-right: -15px;} .midd_footer .row > [class^="col-"]{padding-left: 15px; padding-right: 15px;} .midd_footer{padding: 35px 0 25px} .services_band p{font-size: 16px;} .cd-top.desk{bottom:25px; right:30px;} .nice-select span.current{font-size: 12px} .nice-select{padding-right:10px; padding-left: 10px} .sticky_foot {display: flex;} #myModal .modal-content .left_pop{padding: 50px 20px 25px;} #myModal .modal-content .left_pop p{font-size: 16px; line-height: 1.4} .page_title{min-height: auto; padding-top: 40px;} .hotspot ul {-moz-column-gap: 30px; -webkit-column-gap:30px; column-gap: 30px;} .call_us h4{white-space: normal} .page_title h1{padding-bottom: 60px;} .two_col .row{margin-left: -15px; margin-right: -15px;} .two_col .row [class^="col-"]{padding-left: 15px; padding-right: 15px;} .page_title:after{bottom: -1px;} .cta_band .content_col {padding: 30px 30px 30px 35px} .branding{ background-size:300px} } /********************************* ipad landscape #il ********************************/ @media only screen and (min-width : 1025px) and (max-width: 1260px) { .container{padding-left: 60px; padding-right: 60px;} .nav_cover > ul > li.sub_menu a{padding-right: 15px;} .nav_cover > ul > li > a{padding:50px 10px 46px; font-size: 14px; font-weight: 400} } @media only screen and (min-width : 1025px) and (max-width: 1100px) { } @media only screen and (min-width : 1261px) and (max-width: 1366px) { .nav_cover > ul > li.sub_menu a{padding-right: 20px;} .container{padding-left:80px; padding-right: 80px} .nav_cover > ul > li > a{font-size: 16px;} } /* ================================= Small Computer #Sc ================================= */ @media only screen and (min-width : 1300px) { .first_col , .first_li{padding-left:0 !important; margin-left:0 !important} .last_col , .last_li{padding-right:0 !important; margin-right:0 !important} } /* ================================= Large Computer #lc ================================= */ @media screen and (min-width: 1450px) {} /* IE10 Only CSs */ @media screen and (min-width:0\0) {} /* ie10, ie11+ */ @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {}