@charset "UTF-8";
/*
Theme Name: Meticulo Custom Theme.
Theme URI: https://dientweb.net/
Author: the DientWeb team
Author URI: https://dientweb.net/
*/

*       {box-sizing: border-box;list-style:none;outline:none;transition: 0.5s;}
:root   {--primary-color:#DD9000; --grey-link-color:#858585;--grey-text:#707070;}

html, body 	{float:left;width:100%;margin:0;padding:0;height: 100%;background: #fff;overflow-x:hidden;}
body 		{font-family: 'Poppins', sans-serif;color:#000;}
ul 			{margin:0;padding:0;}
a 			{text-decoration:none;color: inherit;}
p 			{float: left;width: 100%;font-size: 15px;line-height: 25px;letter-spacing: 0px;}
h1          {font-size: 40px;line-height: 48px;margin: 20px 0 14px;}
h2          {font-size:33px;margin:0;line-height: 34px;}
h3          {font-size: 22px;}
h1,h2,h3    {float: left;width: 100%;font-weight: bold;}
.screen-reader-text {display: none;}
#wrapper 	{width: 1200px;float: none;margin:0 auto;}
#wrapper925 {width: 925px;float: none;margin:0 auto;}
#wrapper-slide {width:1180px;float: none;margin:0 auto;}
#wrapper-small {width:850px;float: none;margin:0 auto;}

p {color: #575757;font-size: 14px;}
.nomargin {margin: 0 !important;}
.spacer-p 

.inc-btns {float: none;margin:0 auto;max-width: 445px;text-align: center;}
.pry-btn, .sec-btn, .tir-btn {float: left;width: auto;font-weight: 500;box-sizing: border-box;}
.pry-btn a, .sec-btn a, .tir-btn a {color:#fff !important;float: left;width:auto;border-radius:8px !important;padding: 12px 20px;font-size: 13px;}
.pry-btn a {background: #DE9B1E !important;}
.sec-btn a {background: #000 !important;}
.tir-btn a {background: #BE7C01 !important;}
.pry-btn a:hover, .sec-btn a:hover, .tir-btn a:hover {background: #191e12 !important;color:#fff !important;
    box-shadow: 6px 6px 0px 0px rgba(222, 155, 30, 0.75)!important;
    -webkit-box-shadow: 6px 6px 0px 0px rgba(222, 155, 30, 0.75)!important;
    -moz-box-shadow: 6px 6px 0px 0px rgba(222,155,30,0.75)!important;}

.spacer-btn .pry-btn, .spacer-p {margin:60px 0 70px !important;}
.spacer-p {float: left;width: 100%;color: #575757;font-size: 14px;}

.three-buttons {float: left;width:100%;margin-top: 30px;display: flex;gap:25px;}
.three-buttons .pry-btn {margin-top: 0 !important;}

/*header*/
#head {display: flex; flex-direction: row; align-items: center; justify-content: space-between; width: 100%; padding: 0 0 50px 0; position: fixed; top: 0; left: 0; z-index: 9999; background: url('img/mnbg.png') no-repeat center center; background-size: cover;}
.logo       {float:left;width:auto;height:auto;}
.logo img   {width:auto;max-width: 100%;height:auto;float: left;}
.menuu      {float: right;width: auto;font-weight: 500;position: relative;margin-top: 20px;}
.search-form {float: left;width: 100%;border: 1px solid #ccc;border-radius: 4px;}
input[type="search"] {float: left;width: 90%;box-sizing: border-box;padding: 14px;border: none;outline: none;margin: 5px 0;}
.search-submit {border: none;background: transparent url('img/search.png') no-repeat center center;box-sizing: border-box;padding: 13px;width: 10%;text-align: center;outline: none;border-left: 1px solid #ccc;margin: 6px 0;color: transparent;}

.header-btns {float: right;width: auto;margin-top: 18px;}

#home-banner  {float: left;width:100%;background: #ccc;}

.section-box {float: left;width:100%;padding:80px 0;margin: 0 0 -2px;}
.section-box50 {float: left;width:100%;padding:50px 0;}
.section-box-st-bb {float: left;width:100%;padding:20px 0 120px;}
.section-box-to {float: left;width:100%;padding:40px 0 0 0;}
.section-box-st-sb {float: left;width:100%;padding:20px 0 60px;}


.page-id-11 .section-box {float: left;width: 100%;padding: 0 0 100px;margin: 0;}

.white-on-black-sec {float: left;width:100%;padding:130px 0 30px;}
.white-on-black-sec h3 {color:#fff;font-size: 36px;line-height: 40px;margin: 0 0 40px;}
.white-on-black-sec h4 {background: url('img/tick.png') no-repeat top left;padding: 0 0 0 26px;margin: 0;}

.black-on-white-sec {float: left;width:100%;padding:60px 0 30px;}
.black-on-white-sec h3 {color:#000;font-size: 36px;line-height: 40px;margin: 0 0 40px;}

.bullet-header {float:left;width:100%;margin-bottom: 25px;}
.bullet-header h4 {color: #fff;}
.bullet-header p {color: #AEAEAE;margin: 0 0 25px;}

.white-on-black-sec .pre-text {color: #AEAEAE;}

.full-width {float: left;width:100%;}
.seventy-left {float: left;width:65%;}
.thirty-right {float:right;width:34%;}

.full-width img {width:100%;height:auto;}
.nextstep {float: left;width:100%;margin: 30px 0 40px;}
.nextstep h4 {margin:0;}
.nextstep p {color:#474747;margin: 4px 0 23px;line-height: 20px;font-size: 13px;}

.grey-bullet-box {width: 100%;margin-top:25px;float:left;}
.grey-bullet {float: left;width: 50%;background: url('img/tick2.png') no-repeat top -12px left;padding: 0 0 8px 53px;margin-bottom: 20px;}
.grey-bullet h4 {margin: 0;}
.grey-bullet p {margin:0;}

.horizon-grey-bullet .grey-bullet  {width: 33.3%;position: relative;}
.horizon-grey-bullet .grey-bullet img {position: absolute; top: 0; right: 36px;width: auto;}
.horizon-grey-bullet .grey-bullet:first-child {padding-right:8%;}
.horizon-grey-bullet .grey-bullet:nth-child(2) {padding-right: 5%;}

.home-intro         {float: left !important;width: 100% !important;padding: 0 20% 0;box-sizing: border-box;text-align: center;}
.home-intro h2      {font-size: 40px;padding: 0 24%;box-sizing: border-box;float: left;width: 100%;line-height: 42px;}
.home-intro p       {padding:0 3%;box-sizing: border-box;float: left;width:100%;}

.h-card {position: relative;border-radius: 10px;height: 360px;padding: 30px;box-sizing: border-box;width: 100%;overflow: hidden;float: left;background-size: cover;}
.h-card:hover {box-shadow: 10px 10px 0px 0px rgba(222,155,30,0.75);-webkit-box-shadow: 10px 10px 0px 0px rgba(222,155,30,0.75);-moz-box-shadow: 10px 10px 0px 0px rgba(222,155,30,0.75);}
.hc-content {position: absolute;bottom: 30px;width: 84%;box-sizing: border-box;}
.h-card h3, .h-card p {color:#fff;}
.h-card h3 {font-size: 20px;margin: 0;line-height: 24px;}
.h-card p  {font-size: 13px;line-height: 18px;}
.h-card .pry-btn {display: none;}
.h-card:hover .pry-btn {display: block;margin-top: 14px;}


.h-card2a, .h-card2b, .h-card2c {position: relative;border-radius: 10px;height: 216px;padding: 30px;box-sizing: border-box;width: 100%;overflow: hidden;float: left;background: #E5E5E5;color:#000;}
.h-card2a:hover, .h-card2b:hover, .h-card2c:hover {box-shadow: 10px 10px 0px 0px rgba(222,155,30,0.75);-webkit-box-shadow: 10px 10px 0px 0px rgba(222,155,30,0.75);-moz-box-shadow: 10px 10px 0px 0px rgba(222,155,30,0.75);background:#000;color:#fff;}
.hc-content2 {position: absolute;bottom: 30px;width: 84%;box-sizing: border-box;}
/* .hc-content h3 {margin-bottom: 50px;} */

.h-card2a {background:#E5E5E5 url('img/fp-c.png') no-repeat top 40px right 40px;}
.h-card2a:hover {background: #000 url('img/fp-w.png') no-repeat top 40px right 40px;}

.h-card2b {background:#E5E5E5 url('img/fu-c.png') no-repeat top 40px right 40px;}
.h-card2b:hover {background: #000 url('img/fu-w.png') no-repeat top 40px right 40px;}

.h-card2c {background:#E5E5E5 url('img/fs-c.png') no-repeat top 40px right 40px;}
.h-card2c:hover {background: #000 url('img/fs-w.png') no-repeat top 40px right 40px;}

.pre-text {font-size: 12px;}
.double-btn {float: left;width: 100%;margin-top: 20px;display: flex;gap: 25px;}
.padded-left {padding-right: 10% !important;}
.padded-left h3 {font-size: 36px;line-height: 40px;margin: 0 0 40px;}

.padded-left2 {padding-right: 10% !important;}
.padded-left2 h3 {font-size: 36px;line-height: 40px;margin: 0;}

#hgrey-box .vc_row[data-vc-full-width]     {float:left !important; width:100% !important; padding-bottom: 100px !important;}

#page-header {float: left;width: 100%;background-size: cover;background-position: center;background-repeat: no-repeat;color: #fff;margin-bottom: 60px;}
#page-header, #page-header #wrapper {height:550px;position: relative;}
#page-header::before {content: "";position: absolute;inset: 0;background: rgba(0,0,0,0.4);z-index: 0;}

#page-header h1 {margin:0;font-size:55px;}
#page-header p {color:#a8a8a8;}
sect
.header-content {position: absolute;bottom:50px;width: 60%;}


.header-breadcrumb {position: absolute;width:30%;bottom:110px;right: 0;}
.breadcrumb {font-size:12px;text-align: right;}
.breadcrumb a {background:#000;padding:2px 5px;border-radius:4px;}
.breadcrumb a:hover {background: #DE9B1E;}
.breadcrumb span {color: #efefef;}
.breadcrumb-sep {font-size: 11px;color: #999;margin: 0;vertical-align: middle;}

.page-id-131 .header-content {width:50%;}
#page-content   {float: left;width:102%;}
#page-content #wrapper {width: 1228px;}

#page-content h4 {float: left;width: 100%;margin: 20px 0 0 0;}
#font-sm-box h3 {font-size: 35px;line-height: 40px;margin: 0 0 10px 0;}
#font-sm-box ul {float:left;width: 100%;margin:12px 13px 0;}
#font-sm-box li {font-size: 14px;color:#575757; list-style: disc;line-height: 25px;}
.incontent .pry-btn {margin-top:0; float:left;}
.page-id-11 .incontent .pry-btn {margin-top:40px;}
.grey-bullet h4 {margin-top:0 !important;}

#foot-means {text-align: center;padding-bottom: 80px;}
#foot-means p {font-size: 13px;}

#footer  {float: left;width:100%;margin:0;color:#7c7c7c;font-size: 11px;background: #000;padding: 60px 0 50px;}

.main-footer {float: left;width:100%; margin-bottom: 60px;border-bottom: 1px solid #414141;padding-bottom: 60px;}
.mf-left-sec {float:left;width:30%;padding-right:10%;}
.mf-middle-sec {float: left;width:30%;padding:0 5%;}
.mf-right-sec {float:right;width:40%;padding-left:5%;}
.mf-left-sec h4, .mf-middle-sec h4, .mf-right-sec h4 {font-size:20px;margin: 13px 0;}
.mf-left-sec li, .mf-middle-sec li {display: block;line-height:33px;font-size: 14px;color: #fff;}
.main-footer p {color:#b4b4b4;margin: 0 0 40px;line-height: 20px;font-size: 13px;}

.post-footer {float: left;width:100%;}

.pf-button {float: left;margin-right: 50px;}
.pf-copy ul li {list-style: none;display: inline-block;margin-right: 6px;}
.pf-copy 		        {float: left;width: auto;}
.pf-copy p, .pf-copy a {color:#b4b4b4;}
.pf-copy a:hover {color:#fff;}
.pf-social 		        {float: right;width: auto;}
.pf-copy p, .pf-social p {font-size: 12px;float: left;width: auto;}
.connect-media {float: right;width: auto;margin: 10px;}
.connect-media li {list-style: none;display: inline-block;padding: 5px;}

.category #page-header {margin-bottom: 0;}
.post-grid {float: left;width: 98%;display: grid;grid-template-columns: repeat(2, 1fr);gap:50px;margin: 80px 0;}
.post-item {position: relative;width: 100%;overflow: hidden;background: #F5F5F5;border-radius: 20px;padding: 40px;}
.post-item:hover {background:#000; color:#fff;}
.post-item:hover p {color:#fff;}
.post-item:hover .exc-letter p {color:#000;}
.post-item h2 {font-size: 20px;
    line-height: 29px;
    padding-right: 14%;}
.post-item p {color:#575757;font-size:14px;}
.exc-letter {float: left;background: #D9D9D9;padding: 0px 20px;border-radius: 100px;height: 50px;line-height: 0px;font-weight: bold;margin-bottom: 14px;}
.exc-letter p{line-height: 16px;font-size: 20px !important;}

li.postbox  {width:30%;overflow-x: hidden;}
.prtimg {float: left;width: 100%;border-radius: 8px;overflow: hidden;}
.prtimg img {height: auto;width: 250%;float: right;}
.postbox_cnt p {font-size: 14px;margin-bottom: 0;}
.post-item:hover img {transform: scale(1.1);transition: 0.5s;}
.post-item:hover a {color: #DD9000;}

.post-loop {float:left;width:100%;margin-bottom: 100px;}
.post-loop h3 {margin: 0;}
.post-loop li {list-style:disc;color:#575757;float: left;width: 100%;margin: 0 0 6px 20px;font-size: 14px;}

.header-content {position: absolute !important;bottom: 50px !important;width: 60% !important;}

/*==========================================================================================================================
CONTACT FORM
============================================================================================================================*/

.form-box {float:left; width:100%; margin-top:30px;padding: 30px;border-radius: 20px; background:#EFEFEF;border: 1px solid #D9D9D9;}
.form-box p {float:left;width:100%;font-size: 14px;line-height: 24px;margin:0;}

.wpcf7-form-control-wrap input[type="text"], 
.wpcf7-form-control-wrap input[type="email"],
.wpcf7-form-control-wrap input[type="date"],
.wpcf7-form-control-wrap select,
.wpcf7-form-control-wrap input[type="tel"],
.wpcf7-textarea, .wpcf7-submit    {float:left;width:100%;padding:15px;box-sizing:border-box;font-family: 'Poppins', sans-serif;outline:none;border-radius: 4px;}

.wpcf7-form-control-wrap input[type="text"], 
.wpcf7-form-control-wrap input[type="email"],
.wpcf7-form-control-wrap input[type="date"],
.wpcf7-form-control-wrap select,
.wpcf7-form-control-wrap input[type="tel"],
.wpcf7-textarea   {border: 1px solid #DEDEDE;background: #fff;border-radius:8px;margin-bottom:12px !important;}

.wpcf7-textarea  {height: 150px;border-radius: 20px;}
.wpcf7-list-item {margin:0 0 7px;}
.wpcf7-submit {color:#fff;float: left;width:100%;background:#DE9B1E;padding:16px 15px;border-radius: 10px;border:0;outline:none;cursor: pointer;margin-top: 20px;}

.wpcf7-submit:hover {background: #191e12 !important;color:#fff !important;
    box-shadow: 6px 6px 0px 0px rgba(222, 155, 30, 0.75)!important;
    -webkit-box-shadow: 6px 6px 0px 0px rgba(222, 155, 30, 0.75)!important;
    -moz-box-shadow: 6px 6px 0px 0px rgba(222,155,30,0.75)!important;} 

.wpcf7-submit:hover {background: #70A81B}

.padded-left {padding-right: 3% !important;}

.newsletter-form {float: left;width:100%;}
.newsletter-form input {width: 70%;}
.newsletter-form input, .newsletter-form button {border-radius: 8px;border: none;outline: none;padding: 15px;font-family: 'Poppins', sans-serif;}

.newsletter-form button {float:right;color:#fff !important;width:25%;border-radius:8px !important;padding: 15px 20px;font-size: 13px;background: #DE9B1E !important;}
.newsletter-form button:hover {background: #191e12 !important;color:#fff !important;
    box-shadow: 6px 6px 0px 0px rgba(222, 155, 30, 0.75)!important;
    -webkit-box-shadow: 6px 6px 0px 0px rgba(222, 155, 30, 0.75)!important;
    -moz-box-shadow: 6px 6px 0px 0px rgba(222,155,30,0.75)!important;}

.form-grp       {float:left;width:100%;}
.form-right     {float:right;}
.form-left      {float:left;}
.form-right, .form-left     {width:49%;}
.mobile-nav-menu {display: none;float: right;width: auto;margin-top: 20px;}

/*===========================================================================================================================
mobile styles
===========================================================================================================================*/

@media (max-width:1024px) {
    #wrapper, #page-content #wrapper {width: 94%;}
    .menuu, .header-btns {display: none;}
    .mobile-nav-menu {display: block;}
    #head {padding: 10px 0 12px;}
    .home-intro {padding: 0;}
    #grey-gap {padding: 0px 2% 10px;}
    .section-title h2 {padding-right: 0;}
    #connect-section p {padding-right: 0;}
    #service-left h2 {margin: 0;}
    .page-id-18 h2 {margin:-10px 0 0 0 !important; font-size: 22px !important;}
    .left-half h3, .right-half h3 {font-size: 18px;margin: 40px 0 0;}
    #foot-means h2 {font-size: 24px;line-height: 10px;}
}

@media (max-width:800px) {
    #wrapper, #wrapper-small   {width: 700px;}
    .pf-left, .pf-right {width: 100%;float: left;}
    .pf-left {margin-top:10px;}
    .pf-right {margin:0 0 10px;padding-top:0;}
    .pf-left p, .pf-right p {margin:0;width:100%;}
    .connect-media {margin: 5px 0;}
    #jostats li:nth-child(2) {margin:0 9%;}
    .postbox_cnt p {font-size: 14px;line-height: 20px;}
    .single #page-header h1 {font-size: 33px;line-height: 35px;}
    .newsletter-form input {width: 100%;margin-bottom: 10px;}
    .newsletter-form button {float: left; width: 100%;}
    .mobile-nav-menu {margin-top:6px;}
}

@media(max-width:736px){
    .section-title {margin: 62px 0 -23px !important;float: left;}
    .inc-btns .pry-btn, .inc-btns .sec-btn {margin-top: 70px;}
    #foot-means {float: left;width: 103%;}
    .service-image {float: left;padding-left: 0;width: 103%;margin-top: 30px;}
    .post-grid {grid-template-columns: repeat(2, 1fr);gap: 20px;}
    .page-header-title {width: 100%;}
    .breadcrumbs {float: left;text-align: left;}
    .breadcrumbs a {margin: 0 5px 0 0;}
    .fordesk {display: none;}
    .full-width img {display: none;}
    .logo img {display: block;}
    .section-box-st-bb {padding: 50px 0 20px;margin-top:50px;}
    .section-box50 {padding: 0 0 100px;}
    .section-box {padding: 50px 0;}
    .home .section-box-st-bb {padding: 0 0 100px;margin-top: 0;}
    .mf-middle-sec {padding: 0 0 0 2%;}
    .page-id-19 .section-box-st-bb {padding: 0 0 60px;margin-top: 0;}
    .page-id-13 .section-box-st-sb {padding: 0;}
    #wrapper, #wrapper-small {width: 658px;}
    .page-id-13 #footer {margin-top: 60px !important;}
    .mf-left-sec {padding-right: 5%;}
    .page-id-131 .section-box-st-bb,
    .page-id-143 .section-box-st-bb,
    .page-id-157 .section-box-st-bb {padding: 0 0 20px;margin-top: 0;}
    #page-header h1 {font-size: 32px;line-height: 35px;}
    #font-sm-box h3 {font-size: 26px;line-height: 30px;}
    .h-card .pry-btn {display: block;}
    .page-id-21 .section-box-st-bb {padding: 0 0 20px;margin-top: 0;}
   .horizon-grey-bullet {float:left;width:100%;}
   .page-id-206 .section-box-st-bb,
   .page-id-196 .section-box-st-bb,
   .page-id-211 .section-box-st-bb,
   .page-id-17 .section-box-st-bb,
   .page-id-221 .section-box-st-bb,
   .page-id-15 .section-box-st-bb,
   .page-id-245 .section-box-st-bb {padding: 0 0 40px;margin-top: 0;}
}

@media (max-width:600px) {
    #wrapper,#wrapper-small {width: 90%;}
    .padded-left h3, .padded-left2 h3 {font-size: 26px;line-height: 40px;margin: 0 0 20px;}
    .home-intro h2 {font-size: 40px;padding: 0;}
    .double-btn {flex-direction: column;}
    .double-btn .pry-btn, .double-btn .sec-btn {text-align:center;}
    .header-content {bottom: 90px !important;width: 100% !important;height: auto;bottom: 83px;position: absolute;}
    .header-breadcrumb {bottom:50px;width: 100%;}
    .breadcrumb {text-align: left;}
    .vc_column_container>.vc_column-inner {float: left !important;width:100% !important;}
    .vc_column-inner {float:left !important;width:100% !important;}
    #font-sm-box h3 {font-size: 20px;}
}

@media (max-width:450px) {
    .inc-btns .pry-btn, .inc-btns .sec-btn {margin-top: 70px;margin: 50px 1px 0 !important;}
    #jostats ul {margin-bottom: 60px;float: left;}
    #jostats li {width: 100% !important;margin: 0 0 25px 0 !important;padding: 0 !important;border: 0 !important;}
    #connect-section {width:105%;}
    #connect-section h2 {margin-bottom: 11px;font-size: 30px;}
    #connect-section p {padding-right: 70px;}
    #page-header h1 {font-size: 26px;}
    .page-id-18 #grey-box {width: 105%;padding: 50px 0 50px;margin-bottom: 0;}
    #white-box {float: left;width: 105%;padding: 50px 0 50px;}
    .form-right, .form-left {width: 100%;}
    #grey-box {width: 105%;}
    .post-grid {grid-template-columns: repeat(1, 1fr);gap: 20px;}
    .home-intro h2 {font-size: 28px;margin: -10px;line-height: 34px;}
    .home-intro {padding: 20px 5% 0;}
    .inc-btns .pry-btn {margin: 50px 0 15px !important;float: left;width: 100% !important;}
    .inc-btns .sec-btn {margin:0 !important;float: left;width: 100% !important;}
    .pry-btn a, .sec-btn a {width:100%;}
    #connect-section p {padding-right: 27%;}
    .grey-bullet {width: 100%;}
    .seventy-left, .thirty-right {width: 100%;}
    .home-intro {padding: 0 !important;}
    .section-box-st-bb {padding: 0 0 20px;margin-top: 0;}
    #page-header p {line-height: 20px;}
    .mf-left-sec, .mf-middle-sec, .mf-right-sec {width: 100%;float: left;}
    .mf-left-sec, .mf-middle-sec {border-bottom: 1px solid #414141;padding: 0 0 30px 0 !important;margin:  0 0 30px 0 !important;}
    .mf-right-sec {padding: 0 !important;}
    .horizon-grey-bullet .grey-bullet {width: 100%;}
    .vc_column-inner {float:left !important;width:100% !important;}
}

@media (max-width:360px) {
    .section-title {float: left;padding-right: 0%;box-sizing: border-box;width: 100%;}
    #connect-section p {padding-right: 0;}
    .inline-btns {width:100%;}
    .inline-btns .pry-btn, .inline-btns .sec-btn {float: left; width: 100%;}
    .inline-btns .sec-btn {margin: 20px 0 0 0 !important;text-align: center;}
    .form-box {width: 109%;}
    .section-box {width: 103%;}
}

@media (max-width:320px) {
   
}
