/*body{margin:0;padding:0;font-family:'Open Sans',sans-serif; overflow-x:hidden}*/
.loading-main{width:100%;background: /*--linear-gradient(84deg, rgb(8, 66, 146,1) 0%, rgb(92, 197, 189,1) 100%)--*/ url(../images/loadingbg.jpg) center top no-repeat;height:auto; float:left; min-height:100vh;background-size:cover;padding:40px 0 40px;}
.loadingabso { position:absolute; width:100%; height:100%; background:rgba(1,50,116,0.8);}
.loadinglogomain { float: none;width: 120px; display: inline-block;margin: 0px 0 0; border-right: solid 1px rgba(255,255,255,0.1);background: #fff; padding: 25px 12px 17px; border-radius: 0 0 10px 10px; position: relative; top: -42px;}
.loadingimg { float: none;background: #fff;width: 140px;display: inline-block;height: 140px;border-radius: 100%;margin: 0 0 20px;box-shadow: rgba(0,0,0,0.2) 0px 0px 30px 12px;}
.loadingimg img {margin: 20px 0 0;display: inline-block;width: 100px;}
.loadinglogo{text-align:center;color: #fff;position: relative;padding: 0 0 0 48px;font-size: 16px;letter-spacing: 2px;}
.loadinglogo img{max-width:80px;width:100%;height:auto}
.loadinglogo strong {display: block;font-size: 21px;letter-spacing: 1px;}

.loadercontent {/*--background: rgba(0,0,0,0.1);--*/border-radius: 8px;padding:30px 20px 40px; margin:60px 0 0;font-size: 30px;font-weight: 600;line-height: normal; position:relative;}
.loading-container{width:500px;margin:0 auto; max-width:90%; float:none;}
.loading-region{width:100%;float:left;border:solid #059d43 2px;border-radius:10px;margin:50px 0 0;background:#059d43; display:none;}
.loading-region ul{margin:0;padding:0;list-style:none; position:relative;}
.loading-region ul li{line-height:normal;margin:0;padding:20px 20px;width:50%;float:left;box-sizing:border-box;color:#fff;position:relative;font-family:'Open Sans',sans-serif;padding-left:95px;font-size: 14px;font-weight: 300;letter-spacing: 1px;}
.loading-region ul li span{display:block;font-size:18px;font-weight:600;margin:4px 0 0;letter-spacing:0px;}
.loading-region ul li.country::before{content:'';background:url(../images/countrybg.png) center bottom no-repeat;position:absolute;left:20px;width:60px;height:45px;background-size:100%}
.loading-region ul li.city::before{content:'';background:url(../images/citybg.png) center bottom no-repeat;position:absolute;left:42px;width:37px;height:45px;background-size:100%}
.loading-region ul h1{font-size:15px;font-weight:300;color:#fff;padding:10px 0 0 30px;border-top:solid 1px #038a3a;clear:left}
.cloud{position:absolute;width:510px;height:325px;overflow:hidden}
.cloud.big{top:10px;transform:scale(0.8);-webkit-animation:bigCloud 12s linear;animation:bigCloud 12s linear;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-direction:forwards;animation-direction:forwards; display:none;}

.cloud.small{top:70px;transform:scale(0.4);-webkit-animation:smallCloud 25s linear;animation:smallCloud 25s linear;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-direction:forwards;animation-direction:forwards;-webkit-animation-delay:0s;animation-delay:0s;display:none;}

.cloud .cloudin{position:absolute}
.cloud .c1{width:252px;height:232px;bottom:-5px;background:url(../images/planeicon.png) left top no-repeat; background-size:170px}
@-webkit-keyframes bigCloud{0%{transform:translateX(-200px) scale(0.8)}
100%{transform:translateX(1500px) scale(0.8)}
}
@keyframes bigCloud{0%{transform:translateX(-200px) scale(0.8)}
100%{transform:translateX(1500px) scale(0.8)}
}
@-webkit-keyframes smallCloud{0%{transform:translateX(-200px) scale(0.4)}
100%{transform:translateX(1500px) scale(0.4)}
}
@keyframes smallCloud{0%{transform:translateX(-200px) scale(0.4)}
100%{transform:translateX(1500px) scale(0.4)}
}

.loading-content-container{width:770px;margin:0 auto; float:none;}
.loading-content{width:100%;float:left;margin:90px 0 0;position:relative;bottom:0;background-color:#d1e7ff;border-radius: 15px; overflow:hidden;padding:15px 0px;border: solid 10px rgba(255,225,255,0.3);
-webkit-background-clip: padding;
-moz-background-clip: padding;
background-clip: padding-box;}
.loading-content h2{color:#000;margin: 0 0 10px;}
.loading-content ul{margin:0;padding:0px 20px;list-style:none;width:57%;float:left; text-align:left;border-left: solid 1px #e6e6e6;}
.loading-content ul:first-child { width:43%;border-left:none;}
.loading-content ul li{line-height:normal;margin:0px;padding:6px 0;float:left;box-sizing:border-box;color:#000;position:relative;padding-left:32px; width:100%; font-size:13px;}
.loading-content ul li::before{content:'';background:url(../images/tickicon.png) center bottom no-repeat;position:absolute;left:3px;width:19px;height:17px;background-size:100%}
/* circles rotating begin */
.icon__circles-rotating{box-sizing:border-box;position:absolute;--size:50px;--color1:#00732f;--color2:black;width:var(--size);height:var(--size);border-top:calc(var(--size) / 10) solid transparent;border-left:calc(var(--size) / 10) solid transparent;border-bottom:calc(var(--size) / 10) solid var(--color1);border-right:calc(var(--size) / 10) solid var(--color1);border-radius:999px;left:43%;top:20%;transform:rotate(0);animation:anim__circle1-rotate 1s linear infinite}
.icon__circles-rotating::after{position:absolute;content:"";---background-color:#00000033;width:var(--size);height:var(--size);border-bottom:calc(var(--size) / 10) solid var(--color2);border-right:calc(var(--size) / 10) solid var(--color2);border-left:calc(var(--size) / 10) solid transparent;border-top:calc(var(--size) / 10) solid transparent;border-radius:999px;top:-25%;left:-25%;transform:rotate(0) scale(0.5);animation:anim__circle2-rotate 0.5s linear infinite}
@keyframes anim__circle1-rotate{to{transform:rotate(360deg)}}
@keyframes anim__circle2-rotate{to{transform:rotate(-360deg) scale(0.5)}}
@media screen and (max-width:568px){
.loading-region ul li{width:100%;}	
.loading-region ul li.city::before {left: 32px;}
.icon__circles-rotating {left: 75%;top: 10%;}
}

.lds-ellipsis{display:inline-block;position:relative;width:100%;height:200px}
.lds-ellipsis div{position:absolute;top:70px;width:180px;height:180px;border-radius:50%;background:#fff;animation-timing-function:cubic-bezier(0,1,1,0)}
.lds-ellipsis .circle{font-size:13px;text-align:center;padding:25px 20px 0;line-height:19px;border:solid 10px rgba(255,225,255,0.3);-webkit-background-clip:padding;-moz-background-clip:padding;background-clip:padding-box}
.lds-ellipsis .circle img{width:50px;margin:0 auto 10px}
.loadingtitle{position:absolute;font-size:10em;-webkit-text-stroke:3px #f1e229;-webkit-text-fill-color:transparent;bottom:70px;line-height:normal;text-align:center;width:100%;font-weight: 600;}
.lds-ellipsis div:nth-child(1){left:-42px;animation:lds-ellipsis1 1.6s infinite;-webkit-animation:lds-ellipsis1 1.6s infinite}
.lds-ellipsis div:nth-child(2){left:-42px;animation:lds-ellipsis2 1.6s infinite;-webkit-animation:lds-ellipsis2 1.6s infinite}
.lds-ellipsis div:nth-child(3){left:170px;animation:lds-ellipsis2 1.6s infinite;-webkit-animation:lds-ellipsis2 1.6s infinite}
.lds-ellipsis div:nth-child(4){left:380px;animation:lds-ellipsis3 1.6s infinite;-webkit-animation:lds-ellipsis3 1.6s infinite}

@-webkit-keyframes lds-ellipsis1{0%{-webkit-transform:scale(0)}
100%{-webkit-transform:scale(1)}
}
@keyframes lds-ellipsis1{0%{transform:scale(0)}
100%{transform:scale(1)}
}
/*-----*/

@-webkit-keyframes lds-ellipsis2{0%{-webkit-transform:translate(0,0)}
100%{-webkit-transform:translate(210px,0)}
}

@keyframes lds-ellipsis2{0%{transform:translate(0,0)}
100%{transform:translate(210px,0)}
}
/*-----*/
@-webkit-keyframes lds-ellipsis3{0%{-webkit-transform:scale(1)}
100%{-webkit-transform:scale(0)}
}

@keyframes lds-ellipsis3{0%{transform:scale(1)}
100%{transform:scale(0)}
}

.animate-charcter{background-image:linear-gradient( 90deg,rgba(255,255,255,0),rgb(241,226,41));background-size:auto auto;background-clip:border-box;background-size:200% auto;background-clip:text;text-fill-color:transparent;-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:textclip 3s linear infinite}
@keyframes textclip{to{background-position:-100% center}
}


.absoicon1{position:absolute;left:5%;top:120px;width:105px;-webkit-animation:rotation 38s linear infinite;animation:rotation 38s linear infinite}
.absoicon2{position:absolute;left:15%;top:360px;width:110px;-webkit-animation:rotationright 38s linear infinite;animation:rotationright 38s linear infinite}
.absoicon3{position:absolute;right:15%;top:130px;width:80px;-webkit-animation:rotation 38s linear infinite;animation:rotation 38s linear infinite}
.absoicon4{position:absolute;right:10%;top:450px;width:90px;-webkit-animation:rotation 38s linear infinite;animation:rotation 38s linear infinite}
.absoicon5{position:absolute;right:44%;top:120px;width:70px;-webkit-animation:rotationright 38s linear infinite;animation:rotationright 38s linear infinite}
.absoicon6{position:absolute;right:50%;top:570px;width:90px;-webkit-animation:rotationright 38s linear infinite;animation:rotationright 38s linear infinite}
.absoicon1 img,.absoicon2 img,.absoicon3 img,.absoicon4 img, .absoicon5 img, .absoicon6 img{opacity:0.2; display:none;}


@-webkit-keyframes rotation{from{transform:rotate(0deg)}
to{transform:rotate(-360deg)}
}
@keyframes rotation{from{transform:rotate(0deg)}
to{transform:rotate(-360deg)}
}


@-webkit-keyframes rotationright{from{transform:rotate(0deg)}
to{transform:rotate(360deg)}
}
@keyframes rotationright{from{transform:rotate(0deg)}
to{transform:rotate(360deg)}
}



.snippet {
  position: relative;
}
.stage {
  position: absolute;
  right: -32px;
  top: 23px;
}
.dot-pulse {
  position: relative;
  left: -9999px;
  width: 10px;
  height: 10px;
  border-radius: 5px;
  background-color: #fff;
  color: #fff;
  box-shadow: 9999px 0 0 -5px;
  animation: dot-pulse 1.5s infinite linear;
  animation-delay: 0.25s;
}
.dot-pulse::before, .dot-pulse::after {
  content: "";
  display: inline-block;
  position: absolute;
  top: 0;
  width: 10px;
  height: 10px;
  border-radius: 5px;
  background-color: #fff;
  color: #fff;
}
.dot-pulse::before {
  box-shadow: 9984px 0 0 -5px;
  animation: dot-pulse-before 1.5s infinite linear;
  animation-delay: 0s;
}
.dot-pulse::after {
  box-shadow: 10014px 0 0 -5px;
  animation: dot-pulse-after 1.5s infinite linear;
  animation-delay: 0.5s;
}

@keyframes dot-pulse-before {
  0% {
    box-shadow: 9984px 0 0 -5px;
  }
  30% {
    box-shadow: 9984px 0 0 2px;
  }
  60%, 100% {
    box-shadow: 9984px 0 0 -5px;
  }
}
@keyframes dot-pulse {
  0% {
    box-shadow: 9999px 0 0 -5px;
  }
  30% {
    box-shadow: 9999px 0 0 2px;
  }
  60%, 100% {
    box-shadow: 9999px 0 0 -5px;
  }
}
@keyframes dot-pulse-after {
  0% {
    box-shadow: 10014px 0 0 -5px;
  }
  30% {
    box-shadow: 10014px 0 0 2px;
  }
  60%, 100% {
    box-shadow: 10014px 0 0 -5px;
  }
}

