@charset "utf-8";
/* CSS Document */


@import url('https://fonts.googleapis.com/css2?family=Syne:wght@400..800&family=Open+Sans:wght@300;400;500;600;700;800&display=swap');

@font-face {
  font-family: 'HomemadeAppleRegular';
  src: url('../webfonts/HomemadeAppleRegular.eot');
  src: url('../webfonts/HomemadeAppleRegular.eot') format('embedded-opentype'),
       url('../webfonts/HomemadeAppleRegular.woff2') format('woff2'),
       url('../webfonts/HomemadeAppleRegular.woff') format('woff'),
       url('../webfonts/HomemadeAppleRegular.ttf') format('truetype'),
       url('../webfonts/HomemadeAppleRegular.svg#HomemadeAppleRegular') format('svg');
}

:root {
    --primary-one: #c46e49;
    --secondary: #4b8ee1;
    --primary-text-color: #06132c;
    --primary-five-light: #ffeddf;    
    --white: #ffffff;
    --black: #06132c;
    --dark-bg: #06132c;
    --light-bg:#fff1db;
    --light-grey:#f2f2f2;
    --primary-size:16px;
    --heading-size:48px;
    --sub-size:24px;
    --heading-3:18px;
    --heading-4:36px;
    --heading-5:30px;
    --fontsize72:72px;
    --font-ebold:800;
    --font-bold:700;
    --font-semi:600;
    --font-reg:400;
    --font-syne: "Syne", serif;
    --font-open: "Open Sans", sans-serif;   

  }
  

*{margin:0; padding:0;}
body{font-family: var(--font-open);}
h1, h2, h3, h4, h5, h6{font-family: var(--font-syne);}
a{-webkit-transition: all .3s ease; -moz-transition: all .3s ease; transition: all .3s ease;}
ul, ol{list-style:none; padding-left: 0;}
img{max-width:100%;}
.container{max-width: 1170px;}
p{font-size:16px; line-height:26px; color:var(--primary-text-color);}

ul.list{list-style: none; padding: 0;}
ul.list li{position:relative; padding-left:30px; font-weight:600; font-size: 16px; color: #353f4f; margin-top: 10px;}
ul.list li:before{  
	font-family: 'Font Awesome 5 Free'; font-weight: bold;
    content: '\f058';
    position:absolute; top:0; left:0;
    color:#1889f2;
}

.readmore{margin-top: 30px;}
.readmore a{text-decoration: none; color: #fff; background:var(--primary-one); border-radius: 6px; font-family: var(--font-syne); display: inline-block; padding: 14px 40px; font-size: 16px;  font-weight: bold; }
.readmore a:hover{background: #000; color: #fff;}
.readmore i{padding-left: 8px;}

.btn-primary{background-color: var(--primary-one); color: var(--white); border: none; padding:15px 40px; border-radius: 45px; font-size: 24px;}
.btn-primary:hover{background-color: var(--dark-bg); color: var(--white);}

.btn-dark{background-color:var(--dark-bg); border: none; color: var(--white); padding:15px 30px; border-radius:7px; display: inline-block; font-family: var(--font-syne); font-weight: var(--font-bold); text-decoration: none;}
.btn-dark:hover{background-color: var(--primary-one); color: var(--white);}

.btn-white{background-color:var(--white); border: none; color: var(--black); padding:15px 30px; border-radius:7px; display: inline-block; font-family: var(--font-syne); font-weight: var(--font-bold); text-decoration: none; margin-left: 15px;}
.btn-white:hover{background-color: var(--dark-bg); color: var(--white);}

.dbtitle{text-align: center;}
.dbtitle h3{font-size:var(--heading-size); color:var(--primary-text-color); font-weight: var(--font-bold); margin-bottom:10px; text-shadow:5px 0 8px rgba(0,0,0,0.1);}
.dbtitle h3 span{color: var(--primary-one);}
.dbtitle h5{font-size:var(--sub-size); color:var(--primary-one); font-weight: var(--font-bold); margin-bottom: 0;}
.dbtitle p{font-size:var(--primary-size); color:var(--primary-text-color); max-width: 970px; margin: 0 auto; }
.dbpara2 p, .jbtitle p{max-width: 970px; font-size: var(--primary-size);}
.jbtitle h3{font-size: var(--heading-4);}
.jbtitle h3 span{color: var(--primary-one);}



.section{padding:60px 0; position: relative; overflow: hidden;}
.greybg{background: #f3f4f8;}
.secimg img{border-radius: 25px;}

.container{max-width: 1500px;}



/*************************************
		Header Start
*************************************/
.header-wrap{position: relative; z-index: 10; width: 100%; padding: 15px 70px;}
.header-wrap .navbar{padding: 0; margin-top:5px;}
.navbar-nav > li{padding: 0px 20px 0px 20px;} 
.navbar-expand-lg .navbar-nav .nav-link{padding:10px 0; font-size: 16px; font-weight: var(--font-semi); position: relative;}
.navbar-light .navbar-nav .nav-link:after{width: 0; height: 3px; background-color:var(--primary-one); content:''; position: absolute; bottom: 0; left: 0; -webkit-transition: all .3s ease; -moz-transition: all .3s ease; transition: all .3s ease;}
.navbar-light .navbar-nav .nav-link.active:after, .navbar-nav li:hover .nav-link:after{width:100%;}

.navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .show>.nav-link{color: var(--primary-one);}
.navbar-expand-lg .navbar-nav .nav-link{color:var(--black);}
.navbar-expand-lg .navbar-nav .nav-link:hover{color:var(--primary-one);} 
.navbar-light .navbar-toggler{display: none;}
.header-wrap .col-lg-2{padding-left: 0;}

.header-wrap h1{text-align: center; margin-top: 15px; color: #c46e49;}


.connectbtn{background-color:var(--primary-one); color: var(--white); padding:15px 25px; border-radius:40px; display: inline-block; font-weight: var(--font-bold); text-decoration: none; margin-left: 15px; }
.connectbtn:hover{background-color: var(--dark-bg); color: var(--white);}

.close-toggler{display: none;}

.navbar-nav li .dropdown-menu{padding: 0; border: none; border-radius: 0; box-shadow: 0 5px 30px rgba(0, 0, 0, 0.2);}

.navbar-nav li.dropdown:hover .dropdown-menu{display: block;}
.navbar-nav li .dropdown-menu li a{padding: 15px 20px; font-size: 14px; font-weight: var(--font-bold); font-family: var(--font-syne); border-bottom: 1px solid #ddd;}
.navbar-nav li .dropdown-menu li:last-child a{border-bottom: none;}
.navbar-nav li .dropdown-menu li a:hover{background: #eee;}
.dropdown-item:active{background: none; color: var(--black);}

.topcall{margin-left: auto; display: flex; gap: 10px; align-items: center; justify-content: end; margin-top: 20px;}
.topcall a{text-decoration: none; color: #000;}
.topcall a span{display: block; line-height: 20px; color: #9f9f9f; text-transform: uppercase;}
.topcall a strong{font-size: 20px; font-weight: var(--font-reg); line-height: 20px;}
.topcall i{color: #ababab; font-size: 28px;}

/********* Slider Css *********/
.slider-wrap{position: relative; background:url(../images/header-bg.jpg) no-repeat right; background-size: cover; border-radius: 70px; height:600px; padding: 70px 70px; margin: 0 auto; text-align: center;} 
.slider-wrap h1{font-size:72px; font-weight: var(--font-bold); color:var(--black);}
.bannertitle{font-family: var(--font-syne); margin-top: 20px;}
.slider-wrap .text1{font-size:72px; font-weight: var(--font-bold); color:var(--white); line-height: 72px; text-shadow:0 10px 8px rgba(0,0,0,0.1);}
.slider-wrap .text2{font-size:32px; font-weight: var(--font-bold); color:#ffe200; line-height: 36px; text-shadow:0 10px 8px rgba(0,0,0,0.1);}
.slider-wrap .text3{font-size:48px; font-weight: var(--font-bold); color:var(--white); line-height: 50px; text-shadow:0 10px 8px rgba(0,0,0,0.1); background:rgba(0,0,0,0.5); display: inline-block; padding: 10px 20px; border-radius: 10px; margin-bottom: 5px; margin-top: 10px;}
.slider-wrap .text3 i{font-size: 36px;}
.slider-wrap .text4{font-size:32px; font-weight: var(--font-bold); color:var(--white); line-height: 36px; text-shadow:0 10px 8px rgba(0,0,0,0.1); margin-top: 30px;}
.slider-wrap h2{font-size:20px; font-weight: var(--font-bold); color:var(--primary-one); margin-bottom:0; margin-top: 15px;}
.slider-wrap p{font-size:36px; line-height: 40px; font-weight: var(--font-bold); color:var(--white); margin-top: 10px; margin-bottom: 50px;}



.slider-wrap .ratio{position: absolute; right:0; top: 0; width: 75%;}
.banner_info{position: relative; z-index: 2;}

.stats{display: flex; margin-top: 70px;}
.sts{flex: 0 0 33%; width: 33%; color: var(--white);}
.sts strong{display: block; font-size:90px; line-height: 80px; font-family: 'HomemadeAppleRegular'; font-weight: normal;}
.sts span{display:block;}



.boxpayint{border: 1px solid #ddd; border-radius: 10px; padding: 35px; text-align: center; min-height: 275px;}
.boxpayint .form-control{margin-bottom: 20px;}
.boxpayint h4{font-weight: 700;}


/********* Services *********/
.homeservices{background: #f3f3f3; background: linear-gradient(75deg, #4b8ee1 0%, #c46e49 100%); padding:80px 50px; border-radius: 30px; margin-top: 30px;}
.homeservices .dbtitle h5{text-transform: uppercase; color: #ffe200;}
.homeservices .dbtitle h3{font-size: 60px; color: #fff;}
.homeservices .dbtitle p{font-size:18px; line-height:30px; margin-top:30px; color: #fff;}
.hmservicebox{margin-top:30px; border-radius:35px; padding: 30px; background: #fff; border: 1px solid #ddd;}

.hmservicebox .servico img{border-radius: 15px;}
.hmservicebox h4{color: var(--primary-text-color); font-size:26px; text-decoration: none; font-weight: var(--font-bold);}
.hmservicebox p{margin-bottom: 30px; color:#666666; padding-right: 20px;}
.hmservicebox .morelink{text-decoration: none; color: var(--primary-one); font-weight: var(--font-bold); font-family: var(--font-syne);}

.visonbox.hmhr{border-bottom: 1px solid #ddd; padding-bottom: 45px; margin-top: 0;}

.hmvisonmission .visonbox .visiontitle h4{font-size: 36px; line-height: 36px;}

.shadowbt {
  text-align: center;
  margin-top: -100px;
}

/********* About *********/

.hmabout p{font-size: 18px; line-height: 30px; color:var(--black); margin-bottom: 30px;}
.abouttagline{padding:30px 20px; position: relative; font-size:var(--sub-size); font-family: var(--font-syne); font-weight: var(--font-bold); background: var(--primary-one); color: var(--white); text-align: center; border-radius: 15px; width: 270px;}
.abouttagline p{margin-bottom: 0; font-size: var(--sub-size);}
.abouttagline img{margin-bottom: 15px;}
.aboutintcontent .dbtitle{text-align: left;}
.aboutintcontent .dbtitle h3{color:var(--black);}

.hmabout ul.list{margin-bottom: 0;}
.hmabout ul.list li{color: var(--black);}
.titleflex{display: flex; gap: 30px;}

.aboutpostimg{position: relative;}
.aboutpostimg img{border-radius: 20px;}


.aboutlist li{border-bottom: 1px solid #e6e6e6; padding-bottom: 30px; margin-bottom: 30px; display: flex; gap: 30px;}
.aboutlist li .aboutico{flex: 0 0 50px; width: 50px;}
.aboutlist li h5{font-size: 24px; font-weight: var(--font-bold); margin-bottom: 0;}
.aboutlist li p{margin-bottom: 0; font-size: 18px; color: #555555;}
.aboutlist li:last-child{padding-bottom: 0; border-bottom: 0;}




.contactbox{background: linear-gradient(75deg, #c46e49 0%, #4b8ee1 100%); border-radius: 40px; padding: 40px; text-align: center;}
.contactbox .callnum{font-size: 48px; color: #fff; font-weight: 700;}
.contactbox p{font-size: 24px; color: #fff; margin-bottom: 0;}


.comingsoon{padding-top: 50px;}





/********* Testimonials *********/
.hmtestimonials{ 
  padding: 70px 0;
}


.hmtestimonials .testiBox {
    position: relative;
    border-radius: 20px;
    padding:20px;
    border: 1px solid #ddd;
    margin-top: 20px;
}
.hmtestimonials .testiBox h3{margin-top: 15px; text-align: center;font-size: 24px;}  







/********* Inner Page Common *********/



/********* Footer *********/

.footer{background: #292930; padding:40px 40px 15px 40px; margin: 0 auto; border-radius: 40px; margin-top: 40px;}
.quick-links h2{color: #fff; font-size:20px; font-weight: 600; margin-top: 0; margin-bottom:15px; position: relative;}
.quick-links h3{font-size: 16px; color: var(--primary-one); font-style: italic; margin-top: 10px; margin-bottom: 15px;}


.footer-logo-box{text-align: center;}
.footer p{color: #fff;}

.footerwrap hr{border-color: #888;}

.quick-links ul li a {
  color: #bcbcbc;
  text-decoration: none;
  font-size: 16px;
  font-weight: 400;
  display: block;
}


.footer-info ul li{
    margin-bottom:10px;
}
.footer-contact-detail p{
    margin-bottom: 0;
    font-size:14px;
    font-weight: 400;
    color:#bcbcbc;
    line-height: 16px;
}
.footer-contact-detail p+p{color: #fff; margin-bottom: 5px;}
.quick-links ul li .icon-box i{ 
    color:var(--primary-one); 
    font-size:var(--heading-3);
    margin-right: 15px; 
}

.copy-right p{color: #848484; font-size: 16px; text-align: center; padding: 20px 0; margin-bottom: 0;}
.credit, .credit a{color:#848484; font-size: 14px; text-decoration: none;}
.credit a:hover{color:var(--white); text-decoration: underline;}

.social_media{margin:0px; margin-top: 20px;}
.social_media li{display: inline-block; padding: 0 6px;}
ul.social_media li a{text-decoration: none; font-size: 24px; color: #fff; text-align: center;}
.social_media li a:hover{color: var(--secondary);}

.thankyoumsg{max-width:700px; margin: 0 auto; border-radius: 20px; box-shadow: 0 1px 5px 0 #c3cdd7; padding: 40px; border-bottom: 3px solid #1889f2; text-align: center;}
.checkmark {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  display: block;
  stroke-width: 2;
  stroke: #4bb71b;
  stroke-miterlimit: 10;
  box-shadow: inset 0px 0px 0px #4bb71b;
  animation: fill .4s ease-in-out .4s forwards, scale .3s ease-in-out .9s both;
  position:relative;
  top: 5px;
  right: 5px;
 margin: 0 auto;
}
.checkmark__circle {
  stroke-dasharray: 166;
  stroke-dashoffset: 166;
  stroke-width: 2;
  stroke-miterlimit: 10;
  stroke: #4bb71b;
  fill: #fff;
  animation: stroke 0.6s cubic-bezier(0.65, 0, 0.45, 1) forwards;

}

.checkmark__check {
  transform-origin: 50% 50%;
  stroke-dasharray: 48;
  stroke-dashoffset: 48;
  animation: stroke 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.8s forwards;
}




@keyframes stroke {
  100% {
      stroke-dashoffset: 0;
  }
}

@keyframes scale {
  0%, 100% {
      transform: none;
  }

  50% {
      transform: scale3d(1.1, 1.1, 1);
  }
}

@keyframes fill {
  100% {
      box-shadow: inset 0px 0px 0px 30px #4bb71b;
  }
}




/*********************************************
        Media Screen css
*********************************************/ 
@media screen and (max-width: 1440px) { 
  .navbar-nav > li{padding: 0px 15px 0px 15px;} 
  .slider-wrap{padding: 90px 30px;}
  
  }
@media screen and (max-width: 1300px) { 
  .slider-wrap .text1{font-size: 60px; line-height: 60px;}
  .slider-wrap .text2{font-size: 90px; line-height: 90px;}
  .slider-wrap .text3{font-size: 48px; line-height: 48px;}
  .slider-wrap .text4{font-size: 60px; line-height: 60px;}
}

@media screen and (max-width: 1200px) { 
.header-wrap .phonewrp:first-child{margin-left: 0;} 
.navbar-nav li {
    padding: 0px 14px 0 14px;
}
.header-wrap{padding: 15px 40px;}
.bannerwraper{padding: 0 40px;}
.homeservices{margin: 0 40px;}
.yearexp, .topcall{display: none;}

}

@media screen and (max-width: 1024px) { 
.hmservicebox p{padding-right: 0;}
.hmservicebox h4{font-size: 22px;}
.howitsteps li h4{font-size:24px;}
.hmtestimonials{padding: 60px 30px; margin: 0 40px;}
.homecontact{padding: 50px 30px;}
.footerwrap{padding: 0 40px;}
.whychoose{padding: 70px 30px 0 30px;}
.dbtitle h3{font-size: 40px;}
.slider-wrap .text2{font-size: 70px; line-height: 70px;}
.yearexp{display: block;
  rotate: 0deg;
  font-size: 20px;
  position: static;}

}

@media screen and (max-width: 990px) {  
.navbar-expand-lg .navbar-nav .nav-link{border-bottom: none;}
.navbar-collapse {
    position: fixed;
    top: 0px;
    bottom: 0;
    left: 100%;
    width: 80%;
    padding-right: 1rem;
    padding-left: 1rem;
    overflow-y: auto;
    visibility: hidden;
    background-color:#fff;
    transition: visibility .3s ease-in-out, -webkit-transform .3s ease-in-out;
    transition: transform .3s ease-in-out, visibility .3s ease-in-out;
    transition: transform .3s ease-in-out, visibility .3s ease-in-out, -webkit-transform .3s ease-in-out;
    z-index: 10000;
    box-shadow: -12px 0px 30px rgba(0, 0, 0, 0.2);
}
.navbar-collapse.show {
    visibility: visible;
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
}
.navbar-light .navbar-toggler{
    display: block;
    position: absolute;
    top: 50%;
    right: 50px;
    margin-top: -20px;
    background: #eee;
    padding: 10px 14px;
    font-size: 20px;
    border-radius: 5px;
}
.close-toggler {
    background: none;
    color: #888;
    padding: 5px;
    border: none;
    margin-top: 10px;
    font-size: 24px;
    position: absolute; top: 0; right: 15px;
    display: block;
}
.navbar-nav > li {
    display: block;
}
.navbar-light .navbar-nav .nav-link {
    color: #000;
}
.navbar-nav{padding-top: 70px;}
.topcall{display: flex; margin-left: 0; margin-top: 30px;}

.slider-wrap{height: auto; padding:60px 40px; border-radius:60px;}
.slider-wrap h1{font-size: 60px;}
.banner_info{margin-bottom: 40px;}
.aboutintcontent{margin-top: 40px;}
.missionimg{margin-top: 40px;}
.servimg{margin-bottom: 15px;}
.hmabout{background-position: left;}
.secimg{margin-top: 40px;}
.partnerslist li{width: 25%;}
.whywork:before{display: none;}
.whywork{background: #f4f6f8;}
.whworkbox{margin-top: 30px;}
.wedotext{padding-left: 0; margin-top: 0; padding: 0;}
.postimg22{margin-top: 20px;}
.techlist li{width: 16.6%;}
.howitsteps li{margin-bottom: 30px;}
.section{padding: 50px 15px;}
.customertxt{padding-left: 0; padding-top: 30px;}
.whowecontent{padding-right: 0;}
.txtsec1 .secimg{margin-top: 20px; margin-bottom: 30px;}
.steparrow{display: none;}
.payments{margin-bottom: 30px;}
.footer-info ul li:last-child{margin-bottom: 0;}
.contactform .col-lg-6{display: block; margin-bottom: 30px;}
.submitquery, .companycontact{border-radius: 15px;}
.whoweare .dbtitle h3{font-size: 72px; line-height: 72px;}
.whowecontent{margin-top: 20px;}
.empheader{margin-top: 0;}
.serviceslisting li:nth-child(2n) .servtext{padding: 30px;}
.serviceslisting li .servbox2{margin-bottom: 30px;}
.servpostimg{margin-top: 30px;}
.pageheader{height: 300px;}
.qualityassurance{border-radius: 15px; padding: 40px;}
.applycontent{margin-bottom: 30px;}
.aboutimg{margin-bottom: 30px;}
.footer-logo-box{margin-bottom: 40px; text-align: center;}
.footer{padding: 40px; border-radius: 50px;}

.whychooseimg{margin-bottom: 30px;}
.homecontact{padding: 50px 30px;}
.footerwrap{padding: 0 40px;}
}





@media screen and (max-width: 767px) { 
.copy-right{text-align: center; margin-top: 0;}
.partnerslist li{width: 33%;}
.dbtitle h3{font-size: var(--heading-5);}
.techlist li{width: 20%;}
.quick-links{margin-bottom: 40px;}
.payments{margin-bottom: 40px;}
.discussbg h3{font-size: var(--heading-4);}
.servtext{padding-right:0; padding-top: 20px;}
.servpostimg{margin-top: 40px;}
.ptoptext h3{font-size: 40px; line-height: 40px;}

.slider-wrap .text3, .slider-wrap .text1{font-size: 36px; line-height: 36px;}
.slider-wrap .text4, .slider-wrap .text2{font-size: 48px; line-height: 48px;}
.stats{margin-top:30px;}
.sts strong{font-size: 48px; line-height: 48px;}
.slider-wrap p{font-size: 16px;}

.howitworks .dbtitle h3{font-size: 48px; line-height: 48px;}
.servtext h4, .qualityassurance h4{font-size: 36px; line-height: 36px;}
.benefitbx{min-height: 125px;}
.hmtestimonials{margin: 0 30px; border-radius: 50px;}
.hmtestimonials .dbtitle h3{font-size: 40px; line-height: 40px;}

.aboutintcontent{margin-top: 30px;}
.homeservices .dbtitle h3{font-size: 36px;}
.homeservices .dbtitle p{margin-top: 15px;}
.hmservicebox .servico{margin-bottom: 15px;}
.serviceinfo h4{font-size: 30px;}
.hmcall span{font-size: 16px;}
.hmcall a{font-size: 16px;}
.whworkbox{padding-left: 0;}
.whworkico{position: static; margin-bottom: 15px;}
.howitsteps li p{max-width: none;}
.callbt{margin-top: 30px;}
.or, .callbt{text-align: left;}
.or{margin-left: 70px;}
.discussbg .btn-white{margin-left: 0;}
.footer{padding:40px 40px 20px;}
.qualityassurance{padding: 40px 30px;}

.pageheader{height: auto; padding: 40px 0; background-size:50% !important;}
.pageheader h1{font-size: var(--heading-4);}
.pageheader p{font-size: var(--heading-3);}
.whoweare .dbtitle h3{font-size: 48px; line-height: 48px;}
.whoweare .dbtitle{margin-bottom: 10px;}
.btcareer .dbtitle h3{font-size: var(--heading-5);}

.aboutservicwrap{display: block;}
.contactpage .dbtitle h3, .partnerswrap h3, .abouttextbox h3{font-size: 36px; line-height: 36px;}
.ptlogo{margin-bottom: 10px;}
.partnerbox{margin-bottom: 50px;}
.contactpage .innerctform{padding: 50px 35px;}
.contact-main h6{font-size: 18px;}
.footerwrap{padding: 0 15px;}
.homecontact{margin-bottom: 50px;}
.innerctform{margin-top: 20px;}
.inttitletxt h3{font-size: 48px;}
.abouttextbox h2{font-size: 40px; line-height: 40px;}

}


@media screen and (max-width: 500px) {
   
    .visonbox .visiontitle{display: block;}
    .vsimg{margin-bottom: 15px;}
    .hmvisonmission .visonbox .visiontitle h4{font-size: 30px;}

    
    .logo{padding-right: 90px;}
    .pageheader{background-size: 70% !important;}



}










.globe-container,
.globe {
	width: 550px;
	height: 550px;  
}
.globe-container {
	position: relative;   
	margin: 0 auto;
  margin-top: 30px;
}
.globe {
	position: relative;  
	display: block;
	margin: 0;
	padding: 0;
	top: 0; 
	left: 0;
}
.globe-worldmap,
.globe-worldmap-front,
.globe-worldmap-back,
.globe-sphere,
.globe-outer-shadow,
.globe-inner-shadow {
	position: absolute; 
	display: block; 
	margin: 0; 
}
.globe-sphere,
.globe-outer-shadow,
.globe-inner-shadow {
	left: 0; 
	top: 0; 
	width: 550px; 
	height: 550px;
	background-position: 0 0; 
	background-repeat: no-repeat;
}
.globe-worldmap {
	left: 0; 
	top: 0; 
	width: 550px; 
	height: 550px; 
	overflow: hidden;
	border-radius: 50%;
}
.globe-worldmap-front,
.globe-worldmap-back {
	left: 0; 
	top: 0; 
	width: 3000px; 
	height: 600px; 
	overflow: visible;
	background-image:url(../images/globe-map-01.svg);
	background-repeat: no-repeat;
  z-index: 3;
}
.globe-outer-shadow { 
	left: 30px; 
  top: auto;
	bottom:-75px; 
	width: 600px; 
	height: 90px;
	background-image:url(../images/shadow.png);
}
.globe-inner-shadow { 
	/* background-image:url(../images/sphare.svg); */
}

.globe-worldmap-front { 
	background-position: 0px 0px;
	animation: textureSpinreverse 20s linear infinite;
}
.globe-worldmap-back { 
	background-image:url(../images/globe-map-back.svg);
	background-repeat: no-repeat;
    animation: textureSpin 20s linear infinite;
    z-index: 1;
}

@keyframes textureSpin {
	from {
		transform: translateX(0);
	}
	to {
        transform: translateX(-47.5%);
	}
}
@keyframes textureSpinreverse {
	from {
        transform: translateX(-47.5%);
	}
	to {
		transform: translateX(0);
	}
}


.globe-container:before {
  content: '';
  position: absolute;
  z-index:2;
  width: 100%;
  height: 100%;
  background: url(../images/lines.png) no-repeat center center; /* Center the background */
  background-size: cover; /* Ensure the background covers the entire element */
  animation: rotate 30s linear infinite;
  left: 0;
  top: 0px;
  opacity: 1;
  }

  @keyframes rotate {
  from {
  transform: rotate(0deg);
  }
  to {
  transform: rotate(360deg);
  }
  }