@charset "utf-8";

:root {  
    /** @font family declaration **/
    --ff-regular:'Lexend-Regular';
    --ff-bold:'Lexen-Bold';
    --ff-medium:'Lexend-Medium';
    --ff-light:'Lexend-Light';
    --ff-semibold:'Lexend-SemiBold';
    --ff-black:'Lexend-Black';
 
    /** common color declaration **/
     --bg-brown: #8c1f0b;
     --bg-brown-alter: #df6953;
     --bg-white: #ffffff;
     --bg-lblue: #D3EDFF;
     --bg-lviolet: #F9F9FF;
     --txt-white: #ffffff;
     --txt-dgrey: #1B3139;
     --txt-lgrey: #707070;
     --txt-grey:#71798A;

     --txt-brown: #8c1f0b;

 } 

/* CSS Document */
body { padding:0px; margin:0px;  background-color: var(--bg-white); font-size:16px; color:#303030; line-height:20px; font-family:var(--ff-regular);}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, main, nav, section, audio, video, source { display: block; margin: 0; padding: 0; }
a, img { border: medium none; }
a { color: #303030; text-decoration: none;  }
div { margin: 0; padding: 0; }
p { font-size:16px; line-height:24px; padding:0px; margin:0px; color:#303030;} 
h1, h2, h3, h4, h5, h6 { font-weight:normal; padding:0px; margin:0px; line-height: 30px; }
a{ color: #303030; outline:none; }
ul, li { list-style:none;}
a:focus, :focus{ outline:none; }
ul,ol { list-style-type:none; padding:0px; margin:0px; }
.clearfix:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } 
.clearfix { display: inline-block; }
html[xmlns] .clearfix { display: block; } 
* html .clearfix { height: 1%; }
* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
*:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.clear { clear: both; line-height: 1px; padding:0px; height:0px; font-size:1px; }
.left { float:left; }
.right { float:right; }
.anim { transition:all 1s ease; -moz-transition:all 1s ease; -webkit-transition:all 1s ease; -o-transition:all 1s ease; }
.anim2 { transition:all .5s ease; -moz-transition:all .5s ease; -webkit-transition:all .5s ease; -o-transition:all .5s ease; }
.row { width:1180px; margin:auto; padding:0px;}
.align-center { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap;}
.flex-start { align-items: flex-start;}

header { float: left; width: 100%; position: relative; z-index: 9; padding: 10px 0; background: var(--bg-white);}
.logo { float: left; width: 220px;}
.logo a { float: left; display: block; width: 100%;}
.logo img {float: left; width: 100%;}
.talk-btn a { font-size: 12px; line-height: 16px; transition: all 0.4s ease; background: var(--bg-brown); color: var(--txt-white); text-transform: uppercase; font-family: var(--ff-bold); padding: 12px 15px; border-radius: 3px;}
.talk-btn a:hover { background: var(--bg-brown-alter);}
.is-sticky header { box-shadow: 0 0 10px rgba(0,0,0,0.1);}
nav ul { display: flex; flex-wrap: wrap; column-gap: 25px; }
nav ul li { flex: 0 1 auto; }
nav ul li a { font-size: 18px; transition: all 0.4s ease; }
nav ul li a:hover { color: var(--txt-brown); }
nav ul li.active a { color: var(--txt-brown);}

header.is-sticky { top: 0; left: 0; width: 100%; z-index: 10; position: fixed; background: var(--bg-white); box-shadow: 0 0 4px rgba(0,0,0,0.1);
-webkit-animation: 500ms ease-in-out 0s normal none 1 running fadeInDown; animation: 500ms ease-in-out 0s normal none 1 running fadeInDown;}
.fadeInDown { -webkit-animation-name:fadeInDown; animation-name:fadeInDown}
@-webkit-keyframes fadeInDown {
    from {
     opacity:0;
     -webkit-transform:translate3d(0,-100%,0);
     transform:translate3d(0,-100%,0)
    }
    to {
     opacity:1;
     -webkit-transform:translate3d(0,0,0);
     transform:translate3d(0,0,0)
    }
}
@keyframes fadeInDown {
    from {
     opacity:0;
     -webkit-transform:translate3d(0,-100%,0);
     transform:translate3d(0,-100%,0)
    }
    to {
     opacity:1;
     -webkit-transform:translate3d(0,0,0);
     transform:translate3d(0,0,0)
    }
}

/***banner css***/
.main-banner { float: left; width: 100%; position: relative; }
.main-banner img { float: left; width: 100%;}

/**who we are**/
.who-we-sec { float: left; width: 100%; background: #fff7f0; padding:90px 0 70px; background-size: cover;}
.mision { flex: 0 1 42%; background: #ffffff; padding: 70px 50px; border-radius: 10px; position: relative;}
.mision::before { position: absolute; display: block; content: ""; top: -25px; left: 25px; background: url(../images/quote.svg) no-repeat 0 0; width: 61px; height: 53px;}
.mision h2 { color: var(--txt-dgrey); font-size: 48px; font-family: var(--ff-light); line-height: 50px; margin-bottom: 20px;}
.mision p { color: var(--txt-lgrey); font-size: 20px; line-height: 30px;}

.who-we-rht { flex: 0 1 45%; }
.who-we-rht h2 { color: var(--txt-dgrey); font-size: 40px; font-family: var(--ff-bold); line-height: 46px; margin-bottom: 25px;}
.who-we-rht p span { color: var(--txt-lgrey); font-size: 20px; line-height: 30px; border-left: 4px solid var(--bg-blue); display: block; padding-left: 15px;}
.who-we-rht p { color: var(--txt-lgrey); font-size: 16px; line-height: 26px; margin-bottom: 20px;}
.who-we-rht p:last-child { margin-bottom: 0;}

/***what we do**/
.title-sec { float: left; width: 100%; text-align: center; margin-bottom: 40px;}
.title-sec h2 { color: var(--txt-dgrey); font-size: 40px; font-family: var(--ff-bold); line-height: 46px; }
.title-sec p { color: var(--txt-lgrey); font-size: 18px; line-height: 30px; margin-top: 20px; }

.who-we-do-sec { float: left; width: 100%; padding:70px 0 70px; background: var(--bg-white); }
.who-we-do-sec .title-sec { padding: 0px 100px;}
.who-we-do-sec .title-sec h2 { color: var(--txt-brown);}
.who-we-do-sec .title-sec p { margin-bottom: 15px; }
.who-we-do-sec .title-sec p span { color: var(--txt-brown);}

.abt-tit-cont {display: flex;flex-wrap: wrap;width: 100%; column-gap: 4%;}
.lft-abt {flex: 0 1 48%;}
.rht-abt {flex: 0 1 48%;}
.abt-tit-cont p { color: var(--txt-lgrey);font-size: 16px;line-height: 26px; margin-bottom: 15px; }
.abt-tit-cont p span { color: var(--txt-brown); font-size: 20px; line-height: 30px; font-family: var(--ff-bold);}
.abt-tit-cont p span i { font-style: italic; }

.service-sec { float: left; width: 100%; padding:70px 0px; background: #ffe6e0; }
.service-list { float: left; width: 100%; }
.service-list ul { float: left; width: 100%; display: flex; flex-wrap: wrap; column-gap: 2%; row-gap: 20px; justify-content: center; }
.service-list ul li { flex: 0 1 32%; }
.service-list ul li a { float: left; width: 100%; padding: 15px 15px; background: var(--bg-white); border-radius: 5px; text-align: center; transition: all 0.4s ease; }
.service-list ul li a h3 { color: var(--txt-brown); font-size: 20px; line-height: 30px; font-family: var(--ff-semibold); } 
.service-list ul li a:hover { background: var(--bg-brown); }
.service-list ul li a:hover h3 { color: var(--txt-white); }

/***benefits css**/
.benefits-sec { float: left; width: 100%; background: var(--bg-lviolet); padding: 70px 0; }
.benefits-sec .title-sec { margin-bottom: 25px; }
.benefits-sec .title-sec p { font-size: 18px; color: var(--txt-brown); font-family: var(--ff-semibold); margin-bottom: 0px; }
.img-div { float: left; width: 100%; margin-bottom: 30px; }
.img-div img { float: left; width: 100%; }
.benefits-sec p { color: var(--txt-lgrey);font-size: 16px;line-height: 26px; margin-bottom: 15px; text-align: center;}

/***how we different****/
.who-we-diff-sec { float: left; width: 100%; padding: 70px 0;}
.who-we-diff-sec .title-sec h2 { color: var(--txt-brown);}
.shiva-cont-out { float: left; width: 100%; display: flex; flex-wrap: wrap; column-gap: 4%; }
.cont-lft {flex: 0 1 48%;}
.cont-lft img { float: left; width: 100%; border-radius: 20px;}
.cont-rgt {flex: 0 1 48%;}
.cont-rgt p { color: var(--txt-dgrey);font-size: 16px;line-height: 26px; margin-bottom: 15px; }

.full-width-cont { float: left; width: 100%; margin-top: 35px;}
.full-width-cont p { color: var(--txt-dgrey);font-size: 16px;line-height: 26px; margin-bottom: 15px; }
.full-width-cont p span { font-family: var(--ff-semibold); }
ul.list-cont { float: left; width: 100%; margin: 0px 0px 30px; display: flex; flex-wrap: wrap; row-gap: 12px; padding-left: 30px; }
ul.list-cont li { flex: 0 1 100%; color: var(--txt-dgrey); font-size: 16px;line-height: 26px; position: relative;}

ul.list-cont.list-cont-dot li { padding-left: 20px;}
ul.list-cont.list-cont-dot li::before { content: ""; position: absolute; left: 0px; top: 10px; width: 6px; height: 6px; border-radius: 10px; background: var(--txt-brown); }

.shiva-margin30 { margin: 30px 0px 50px; }

.full-width-cont h3 { color: var(--txt-dgrey); font-size: 22px; line-height: 28px; margin-bottom: 15px; font-family: var(--ff-bold);}

.hight-light-cont { float: left; width: 100%; margin-top: 25px; }

/***offering****/
.offering-sec { float: left; width: 100%; padding: 70px 0; background: #fff7f0; background-size: cover; }
.offering-sec p { color: var(--txt-dgrey);font-size: 16px;line-height: 26px; margin-bottom: 15px; }
ul.col-two-lst { float: left; width: 100%; display: flex; flex-wrap: wrap; column-gap: 4%; row-gap: 10px; }
ul.col-two-lst li { flex: 0 1 48%; }

/***tools***/
.tools-sec { float: left; width: 100%; padding: 70px 0; background: #fff;}
.tools-sec .title-sec h2 { color: var(--txt-brown);}
.tools-sec h3 { color: var(--txt-dgrey); font-size: 22px; line-height: 28px; margin-bottom: 15px; font-family: var(--ff-bold);}
.tools-sec p { color: var(--txt-dgrey);font-size: 16px;line-height: 26px; margin-bottom: 15px; }
.help-us-cont { float: left; width: 100%; margin-top: 50px; }
.help-us-cont h4 { color: var(--txt-dgrey); font-size: 20px; line-height: 26px; margin-bottom: 25px; font-family: var(--ff-bold); }
.help-us-cont p { color: var(--txt-dgrey);font-size: 16px;line-height: 26px; margin-bottom: 15px; }
.table-cont { float: left; width: 100%; margin-bottom: 30px; }
.table-cont table { border: 1px solid #ccc; border-collapse: collapse; width: 100%;}
.table-cont table tr td { border-bottom: 1px solid #ccc; padding: 8px 10px; border-right: 1px solid #ccc; }
.table-cont table tr td:first-child { color: var(--txt-brown); font-family: var(--ff-semibold); width: 250px;}

ul.bank-lst { float: left; width: 100%; display: flex; flex-wrap: wrap; row-gap: 20px; column-gap: 4%;}
ul.bank-lst li { flex: 0 1 48%;}

/**unleash css***/
.unleash-sec  { float: left; width: 100%; padding: 70px 0; background: var(--bg-lviolet);}
.unleash-lft { flex: 0 1 30%; border-left: 4px solid var(--bg-brown); padding-left: 20px;}
.unleash-lft h2 { color: var(--txt-dgrey); font-size: 40px; font-family: var(--ff-bold); line-height: 52px;  }
.unleash-lft h3 { font-size: 28px; line-height: 32px; color: var(--txt-dgrey);}
.unleash-rht { flex: 0 1 56%; }
.unleash-rht p { font-size: 18px; line-height: 28px; color: var(--txt-lgrey); margin-bottom: 20px;}
.unleash-rht p:last-child { margin-bottom: 0;}

/**contact css***/
.contact-title { float: left; width: 100%; text-align: center;}
.contact-title h2 { color: var(--txt-white); font-family: var(--ff-bold); font-size: 40px; line-height: 48px; position: relative; padding-bottom: 20px; margin-bottom: 20px;}
.contact-title h2::after { position: absolute; display: block; content: ""; background: var(--bg-white); height:3px; width: 60px; bottom: 0; left: 0; right: 0px; margin: 0px auto;}

.address-sec { float: left; width: 100%; position: relative; padding: 70px 0px; background: var(--bg-brown); }
.address-inn { padding: 40px 20px; float: left; width: 100%; border-radius: 10px; box-shadow: 0 0 20px rgba(0,0,0,0.1); margin-top: 0px; background: var(--bg-white);}
.address-sec ul { display: flex; flex-wrap: wrap; justify-content: center;}
.address-sec ul li { flex: 0 1 45%; margin-right:3%; padding-right: 3%; border-right: 2px solid #F5F5F5; text-align: center; }
.address-sec ul li h3 { color: var(--txt-dgrey); font-size: 19px; line-height: 24px; margin-bottom: 15px; font-family: var(--ff-bold); }
.address-sec ul li a { color: var(--txt-dgrey); font-size: 18px; line-height: 30px; transition: all 0.4s ease; }
.address-sec ul li a:hover { text-decoration: underline; color: var(--txt-brown); }
.address-sec ul li:last-child { border-right: none; padding: 0; margin: 0; }
.address-sec ul li .ico {display: inline-flex; align-items: center; justify-content: center; margin-bottom: 20px; width: 60px; height: 60px; border-radius: 40px; background: var(--bg-brown); color: var(--txt-white); font-size: 22px; }

/**footer***/
footer { background: var(--bg-lviolet); float: left; width: 100%; padding: 20px 0;}
footer p { text-align: center; font-size: 16px; line-height: 22px; color: var(--txt-grey);} 
.scrollTop a {  display: flex; align-items: center; justify-content: center;  background-color: var(--bg-brown);  width: 50px;  height: 50px; text-align: center;  border-radius: 50px; position: fixed; 
bottom: 40px; right: 40px; border: 2px solid var(--bg-white); transition: background-color .3s,  opacity .5s, visibility .5s; opacity: 0; visibility: hidden; z-index: 1000; box-shadow: 0 0 10px rgba(0,0,0,0.08);  }
.scrollTop a i { color: var(--txt-white); font-size: 20px;}
.scrollTop a:hover { background: var(--bg-brown);}
.scrollTop a:hover i { color:var(--txt-white);}
.scrollTop.show a { opacity: 1; visibility: visible;  }

/*mobile-menu-start*/
body.over { overflow: hidden; }
.mobile-menu { -webkit-overflow-scrolling: touch; /* smooth scroll on iOS */ position:fixed; top:71px; bottom: 0; width:100%; height: calc(100% - 71px); overflow: auto;  z-index: 1000; border-top: none; padding: 30px 0 50px; opacity: 0; visibility: hidden; transition: all 0.4s ease; background: var(--bg-brown); border-bottom:none; }
.mobile-menu.slow { opacity: 1; visibility: visible; }
.mobile-menu .nav { width: 100%; background: var(--bg-brown); float: left;  padding: 0 0 75px 0; height:100%;}
.m-menu { width: 28px; height: 18px; margin: 0px 0 0 0; -webkit-transform: rotate(0deg);-moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .5s ease-in-out;-moz-transition: .5s ease-in-out; -o-transition: .5s ease-in-out; transition: .5s ease-in-out; cursor: pointer; float: left; position: relative; left: 0; top: auto; display:none; z-index:9; }
.m-menu a { display: block; height: 100%;}
.m-menu span { display: block; position: absolute; height: 2px; width: 28px; background: var(--bg-brown); border-radius: 0px; opacity: 1;left: 0; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg);  -webkit-transition: .25s ease-in-out;-moz-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out; }  
.m-menu span:nth-child(1) { top: 0px; width: 14px; -webkit-transform-origin: left center; -moz-transform-origin: left center; -o-transform-origin: left center; transform-origin: left center; }
.m-menu span:nth-child(2) { top: 8px;  right: 0; left: auto; -webkit-transform-origin: left center; -moz-transform-origin: left center; -o-transform-origin: left center; transform-origin: left center; }
.m-menu span:nth-child(3) { top: 16px; left: auto; right: 0px; width: 14px; -webkit-transform-origin: left center; -moz-transform-origin: left center; -o-transform-origin: left center; transform-origin: left center; }
.m-menu a:hover span { background: var(--bg-brown);}
.m-menu.open span:nth-child(1) { width: 28px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); top: -1px; left: 4px; background: var(--bg-brown);}
.m-menu.open span:nth-child(2) { width: 0%; opacity: 0;}
.m-menu.open span:nth-child(3) { width: 28px; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); top: 18px; left: 4px; background:var(--bg-brown); }

.mobile-menu ul { display: flex; flex-wrap: wrap; row-gap: 10px;}
.mobile-menu ul li { flex: 1 1 100%; display: flex; flex-wrap: wrap; justify-content: space-between;}
.mobile-menu ul li a { width: calc(100% - 50px); font-size: 20px; color: var(--txt-white); line-height: 1; font-family: var(--ff-regular); display: block; padding:8px 30px 8px 0; position: relative; transition: all 0.4s ease;}
.mobile-menu ul li.menu-item-has-children > .arrow { position: relative; width: 35px; height: 35px; border: 0px solid rgba(255,255,255,0.2); cursor: pointer; display: flex; align-items: center; justify-content: center; }
.mobile-menu ul li.menu-item-has-children > .arrow::after { display: block; content: ""; width: 10px; height: 10px; border-right: 2px solid var(--bg-white);
border-bottom: 2px solid var(--bg-white); transform: rotate(45deg); transition: transform 0.3s ease-in-out; margin-left: 0px;position: absolute; right: auto; top: auto;}
.mobile-menu ul li.menu-item-has-children.active > span.arrow::after { transform: rotate(-135deg); top: 12px; }
.mobile-menu ul li ul { display: none; padding:20px 0 10px 15px; width: 100%; }
.mobile-menu ul li ul li { margin-bottom: 18px; }
.mobile-menu ul li ul li:last-child { margin-bottom: 0; }
.mobile-menu ul li ul li a { font-size: 16px; font-family: var(--ff-regular); padding: 0; color: var(--txt-white); }
.mobile-menu ul li ul li a::after { display: none; }
.mobile-menu ul li a:hover { color: var(--txt-white); opacity: 0.7;}
 
.mobile-menu .mobile-btns { width: 100%; display: flex; flex-wrap: wrap; column-gap: 2%; row-gap: 10px; justify-content: center; margin-top: 50px;}
.mob-social { float: left; width: 100%; margin-top: 35px; } 
.mobile-menu .mob-social ul { width: 100%; display: flex; flex-wrap: wrap; justify-content: center; column-gap: 25px; }
.mobile-menu .mob-social ul li { flex: 0 1 auto; }
.mobile-menu .mob-social ul li a { width: auto; padding: 0px 0px; font-size: 22px;}

.mobile-shape { width: 200px; position: absolute; right: 0px; bottom: -20px; opacity: 0.1; z-index: -1; }



