body{margin: 0; padding: 0; font-family: 'Oxanium', cursive;}
html {scroll-behavior: smooth; box-sizing: border-box;}
*{margin: 0; padding: 0;}
p{font-family: 'Poppins', sans-serif;  font-size: 14px;  letter-spacing: 0.5px;  text-align: justify; color: #676565; font-weight: 400; line-height: 25px; padding: 0; margin: 0;}
.tnb{padding: 70px 0;}
.pnm{padding: 0; margin: 0;}
.small-title {color: #913b8c; font-size: 20px; font-weight: 600; position: relative; padding: 10px 0 0; display: inline-block;}
.small-title:before {position: absolute; top: 0; content: ''; left: 0; width: 100%; background: #903b8b; height: 2.5px;}
.big-title {color: #3c3b3c; font-size: 24px; font-weight: 700; position: relative; padding: 10px 0; } 
.big-title h2{font-size: 40px; color: #903b8b; text-transform: uppercase;}
/*nav*/
.model_appoin .modal-header h4{background: #903b8b; width: 100%;  text-align: center; color: #fff; padding: 10px;}
.model_appoin .modal-footer .btn{background: #903b8b; color: #fff;}
.model_appoin .modal-body p{text-align: center;  font-size: 30px; color: #903b8b;}
.new-nav{padding: 0; margin: 0;}
.new-nav ul li a{color: #3d107b; font-size: 16px; font-weight: 600; margin: 0 22px; letter-spacing: 0.5px; position: relative;}
.new-nav ul li a:hover{text-decoration: none; color: #913b8c; }
.new-nav ul li a:before{position: absolute; content: ''; left: 0; width:0%; bottom: -7px; background: #913b8c; height: 2px; transition: 0.5s;}
.new-nav ul li a:hover:before{width: 100%;}
.app_btn{background: #903b8b; padding: 10px 20px; border-radius: 5px; border: 0; color: #fff; letter-spacing: 0.5px;
    font-weight: 500; font-size: 14px; margin: 0 0 0 15px; position: relative; z-index: 1; overflow: hidden;}
.app_btn:before{position: absolute; content: ''; width: 100%; height: 100%; background: #bb4db5; bottom: -60px; left: 0; border-radius: 5px; z-index: -1; transition: 0.2s;  }   
.app_btn:hover:before{bottom: 0;} 
.main-nav img{width: 100%; max-width: 230px; padding: 5px 0; }

/*slider*/
.main-slider{position: relative;}
.slider-img:before{position: absolute; content: ''; top: 0; left: -140px; background: #000000b8; width: 60%; height: 100%; transform: skew( 
15deg); border-right: 8px solid #cc53c5;}

.slider-img{position: relative;}
.slider-img img{width: 100%;}
.slider-text{position: absolute; top: 100px; left: 0; right: 0; color: #fff;}
.slider-text span{letter-spacing: 0.5px; color: #e6e6e6; font-size: 14px; font-weight: 400; animation-delay: 1s; animation-duration: 1s;}
.slider-text h2{margin: 10px 0; padding: 0; font-size: 75px;  font-weight: 700; animation-delay: 1s; animation-duration: 1s;}
.slider-text b{color: #e05ed9; font-weight: 700; }
.slider-text p{font-size: 14px; color: #e6e6e6; font-weight: 300; letter-spacing: 0.5px; padding: 0 50% 0 0; margin: 0; animation-delay: 1s; animation-duration: 1s;}
.slider-text .more_btn{background: #903b8b; color: #fff;  font-size: 16px; letter-spacing: 0.5px;  padding: 13px 40px; display: inline-block; margin: 30px 0 0; text-decoration: none; border-radius: 5px; box-shadow: 3px 3px 1px #903b8b9c; transition: 0.5s; animation-delay: 1s; animation-duration: 1s;}
.slider-text .more_btn:hover{box-shadow: 3px 3px 7px #ce59c7;}

/*main-services*/
.main-services{margin-top: -40px;}
.three-services{border-radius: 5px; box-shadow: 1px 1px 10px #0000003b; padding: 10px; display: flex; position: relative; background: #fff; z-index: 1;}
.three-services:before{content: ''; position: absolute; right: 0; bottom: 0; width: 35px; height: 35px; background: #913B8C;     border-radius: 0 0 5px 0; transition: 0.5s;}
.three-services:hover:before{width: 100%; height: 100%; border-radius: 5px; z-index: -1;}
.three-services:hover h3{color: #fff;}
.three-services .ser-icon{background: #903b8b; width: 130px; height: 100px; text-align: center; padding: 15px;}
.three-services .ser-icon .fa{color: #fff; font-size: 70px;}
.three-services .ser-icon img{width: 92%;}
.three-services .ser-text{margin: 0 auto; padding: 28px 0;}
.three-services .ser-text h3{font-weight: 600; font-size: 24px; padding: 0; margin: 0; transition: 0.5s;}


/*abut-text*/
.main-about{position: relative;}
.main-about:before{content: ''; background: url(../images/footer-side.png) no-repeat; width: 370px; height: 260px; left: 0; bottom: -119px; position: absolute;}
.abut-text img{width: 100%;}
.abut-text {margin:20px 0 0;} 
.abut-text  a{background: #903b8b; padding: 13px 30px; border-radius: 5px; border: 0; color: #fff; letter-spacing: 0.5px; font-weight: 500; font-size: 14px; margin: 20px 0 0; position: relative; z-index: 1; overflow: hidden; text-decoration: none; display: inline-block; position: relative;} 
.abut-text  a:before { position: absolute; content: '';  width: 100%;  height: 100%; background: #bb4db5;
    bottom: -50px; left: 0; border-radius: 5px; z-index: -1; transition: 0.2s;}

.abut-text a:hover:before {bottom: 0;}
.abut-info{margin: 15px 0 -30px -60px; background: #fff; padding: 15px;}
.pro-img{position: relative; margin: 5px; overflow: hidden; border: 2px solid #fff;}
.pro-img img{width: 100%; max-width: 600px; transition: 0.5s; height: 364px;}
.pro-img:hover img { transform: rotate(2deg) scale(1.2);}
.pro-img:hover .pro-inner-text{background: #913b8c; padding: 20px 10px;}
.pro-inner-text{position: absolute; bottom: 0; background: #903b8b; padding: 10px; width: 100%; transition: 0.5s;}
.pro-inner-text h4{color: #ffffff; font-size: 18px; margin: 0; font-weight: 600; text-align: center; letter-spacing: 0.5px;}
.pro-right-img{overflow: hidden; margin: 5px; position: relative; border: 2px solid #fff;}
.pro-right-img img{width: 100%; transition: 0.5s; }
.pro-right-img:hover img { transform: rotate(2deg) scale(1.2);}
/*.main-products*/

.main-products{background: #5a0c56;}
.pro-right-text .small-title{color: #fff;}
.pro-right-text .small-title:before{background: #fff;}
.pro-right-text .app_btn{ position: absolute;  left:0px; transform: translate(100%, 100%); font-size: 18px;}
.pro-right-text{position: absolute; top: 34%; right: 0; width: 100%; background: #000000b5; padding: 20px; height: 30%; }

/*advan-info*/
.main-advantages{position: relative;}
.main-advantages:before{content: ''; background: url(../images/footer-side.png) no-repeat; width: 370px; height: 260px; right: 0; top: -119px; position: absolute; transform: rotate(180deg);}
.advan-info{padding: 30px 0;}
.advan-info ul{padding: 0; margin: 10px 0 0;}
.advan-info ul li{padding: 0 0 0 30px; margin:0; list-style-type: none; display: list-item; position: relative;}
.advan-info ul li:before{position: absolute; content: '\f00c'; left: 0; top:0; color: #913b8c; font-family: FontAwesome;}

/*call_action*/
.call_action{background: url(../images/call_bg.jpg) no-repeat center center fixed; position: relative; margin: 0 0 100px; }
.call_action:before{position: absolute; top: 0; left: 0; background: rgb(0 0 0 / 88%); width: 100%; height: 100%; content: '';}
.call-text h4{color: #fff; text-align: center; font-size: 40px; font-weight: 600;}
.call-text p{color: #ababab; text-align: center; padding: 0px 200px;}
.call-left{background: #fff; padding: 50px 40px; box-shadow: 1px 1px 10px #0000003b;}
.call-left .app_btn{margin: 20px 0 0;}
.tow-call{margin: 30px 15px -150px;}
.call-right{background: url(../images/call_bg.jpg) no-repeat center center; box-shadow: 1px 1px 10px #0000003b; position: relative; }
.call-right:before{position: absolute; content: ''; width: 100%; height: 100%; background: #903b8bf7; top: 0; left: 0;}
.text-test p{text-align: center; color: #fff;}
.text-test{text-align: center; padding: 22px;}
.text-test img{width: 13%; margin: 30px auto 15px; border-radius: 50%;}
.text-test span{color: #dedede; display: block; font-size: 20px;  font-weight: 500;}
.text-test label{color: #dedede; display: block; font-size: 14px;  font-weight: 200;}
.call-right .bx-viewport{height: 292px !important;}

/*network-text*/
.our-network{position: relative;}
/*.our-network:before{content: ''; background: url(../images/side-img-1.png) no-repeat; width: 370px; height: 260px; left: 0; bottom: 0; position: absolute;}*/
.network-text{padding: 50px 0;}
.network-text ul{padding: 0; margin: 0;}
.network-text ul li{padding: 0 0 15px; margin: 0; list-style-type: none; display: inline-block; width: 49%;}
.network-text ul li h5{color: #903b8b; padding: 10px; margin: 0; font-size: 24px; font-weight: 500; background: #E9DDDD;
    border-radius: 5px;}
.network-text ul li:nth-child(2) h5{margin: 0 0 0 10px;}
.network-text ul li h5 .fa{transform: rotate(90deg);  margin: 0 10px 0 10px;}  
.network-text ul li h5{position: relative; z-index: 1; overflow: hidden; transition: 0.5s;}
.network-text ul li h5:before{background: #913b8c; position: absolute; content: ''; width: 100%; height: 100%; top: 0; left: -165px; z-index: -1;border-radius: 5px; transform: rotate(90deg); transition: 0.3s; } 
.network-text ul li h5:hover:before{transform: rotate(0deg); left: 0px }
.network-text ul li h5:hover{color: #fff;}
.network-img{position: relative; overflow: hidden;}
.network-img img{width: 100%; transition: 0.5s; }
.network-img:hover img { transform: rotate(2deg) scale(1.2);}
.network-img-text {position: absolute; top: 222px; left: 0; width: 100%; background: #913b8cc4;}
.network-img-text h5 span{font-size: 30px;}
.network-img-text h5{ text-align: center; margin: 0; padding:100px 0; color: #fff; font-size: 40px; }

/*main-footer*/
.main-footer{background: url(../images/footer-bg.jpg) no-repeat center center fixed; position: relative; z-index: 1; background-size: cover;}
.main-footer:before{background: linear-gradient(to top, #340e69f2 , #5a0c56); width: 100%; height: 100%; position: absolute; content: ''; top: 0; left: 0; z-index: -1;}
.main-footer:after{content: ''; background: url(../images/footer-side.png) no-repeat; width: 370px; height: 260px;
    left: 0; top: -110px; position: absolute;}
.footer-logo{text-align: center;}
.footer-logo img{width: 100%; max-width: 185px;}
.footer_social {text-align: center; margin: 30px 0 ;}
.footer_social  ul{padding: 0; margin:0; }
.footer_social  ul li{padding: 0; margin:0; list-style-type: none; display: inline-block;  }
.footer_social  ul li a{color: #fff; padding: 0 5px;}
.footer-text h5{color: #fff; font-size: 20px; text-transform: uppercase; letter-spacing: 0.5px; font-weight: 400; margin: 0 0 15px;}
.footer-text ul{padding: 0; margin: 0;}
.footer-text ul li{padding: 0; margin: 0; list-style-type: none; display: list-item; line-height: 35px; color: #c5c5c5; font-size: 16px; font-weight: 300;}
.footer-text ul li a{color: #c5c5c5; font-size: 16px; font-weight: 300; letter-spacing: 0.5px; text-decoration: none; transition: 0.5s; }
.footer-text ul li a:hover{color: #de60d7; padding: 0 0 0 5px;}
.footer-text ul li a .fa {transform: rotate(90deg); margin: 0 10px 0 0px;}

.main-footer .col-md-4:nth-child(2) .footer-text{padding: 0 50px;}
.main-footer .col-md-4:nth-child(3) .footer-text{padding: 0 107px; border-right: 1px solid #7551a9; border-left: 1px solid #7551a9;}
.main-footer .col-md-4:nth-child(4) .footer-text{padding: 0 40px;}
.main-footer .col-md-4:nth-child(4) .footer-text .fa{color: #fff; margin: 0 5px 0px 0px;}
.copy-right-left p{text-align: left; color: #c5c5c5; font-weight: 300; font-size: 14px; font-family: 'Oxanium', cursive;}
.copy-right-left span{color: #ff5bf5; font-weight: 500; text-transform: uppercase;}
.copy-right-right p{text-align: right; color: #c5c5c5; font-weight: 300; font-size: 14px;}  
.copy-right{border-top: 1px solid #7551a9; padding: 30px 0 0; margin: 30px 0 0;}
.copy-right-right a{color: #c5c5c5; text-decoration: none;}
.copy-right-right a:hover{color: #c5c5c5;} 

header{
     // set animation
        -webkit-transition: all 0.4s ease;
        transition: all 0.4s ease;
}
        
header.sticky {
    position: fixed;           
    width: 100%;
    background: #fff;
    text-align: left;
    margin:  0;
    z-index: 500;
    box-shadow: 1px 1px 10px #0000003b;
}
/*animation*/
.round-shape-four {
    position: absolute;
    right: 52.5%;
    top: 1%;
    width: 240px;
    height: 240px;
    border-radius: 50%;
    border: 1px solid #7551a9;
    animation: rotated 10s infinite linear;
    z-index: -1;
}

.round-shape-four:before {
    content: "";
    width: 10px;
    height: 10px;
    position: absolute;
    top: 50%;
    left: -5px;
   background-image: linear-gradient(to right, #FF3900 , #FF8E00 );
    border-radius: 50%;
}

@-webkit-keyframes rotated {
    from {  -webkit-transform: rotate(0deg) translateX(150px) rotate(0deg); }
    to   {  -webkit-transform: rotate(0deg) translateX(150px) rotate(-360deg); }
}

/*inner-header*/
.inner-header{background: url(../images/inner-bg.jpg) no-repeat top center; background-size: cover; position: relative; }
.inner-header:before{position: absolute; content: ''; width: 100%; height: 100%; background: linear-gradient(to top, #340e69f2 , #5a0c56); top: 0; left: 0;}
.inner-header-text{padding: 70px 0;}
.inner-header-text h5{color: #fff; font-size: 36px;  font-weight: 400; letter-spacing: 0.5px;}
.inner-header-text h5 a{ color: #fff; font-size: 16px;  font-weight: 400; letter-spacing: 0.5px;}
.key_features{}
.key_features ul{padding: 0; margin: 0;}
.key_features ul li{padding: 0 0 0 30px; margin: 0; list-style-type: none; display: list-item; position: relative;}
.key_features ul li:before { position: absolute; content: '\f00c';  left: 0;  top: 0; color: #913b8c; font-family: FontAwesome;}

/*install-text*/
.install-text {text-align: center;}
.install-text .small-title{text-align: center; font-size: 20px; }
.install-text .big-title{text-align: center; font-size: 30px;}
.install-text p{text-align: center; padding: 0% 26% 0% 26%;}
.install-type-three{margin: 60px auto 0;}
.install-type-three p{margin: 30px 0 0;}
.install-type-text{text-align: center;}
.install-type-text p{text-align: center;}
.install-type-text .fa{color: #903b8b; font-size: 60px;}
.install_icon{display: inline-block; padding: 40px; width: 130px; border: 2px solid #913b8c; border-radius: 5px; position: relative; transition: 0.5s;}
.install_icon:before{position: absolute; background: #913b8c; content: '1'; top: -35px;  left: 0;  width: 60px; height: 60px;
    font-size: 40px; color: #fff; right: 0; margin: 0 auto; border-radius: 5px;}
.install-type-three  .col-md-4:nth-child(2) .install_icon:before{content: '2';}
.install-type-three  .col-md-4:nth-child(3) .install_icon:before{content: '3';}
.install-type-text:hover .install_icon{background: #913b8c;}
.install-type-text:hover .fa{color: #fff;}
.install-type-text h4{ padding: 15px 0; margin: 0;  font-size: 22px; font-weight: 600;}

/*policy*/
.policynvision{margin: -100px 0 0;  position: relative; z-index: 5;}
.policy{background: url(../images/call_bg.jpg) no-repeat center center;  position: relative;  margin: 0 ; z-index: 1; padding: 120px;}
.policy:before {position: absolute; top: 0; left: 0; background: rgb(0 0 0 / 88%); width: 100%; height: 100%; content: ''; z-index: -1;}
.policy_text h5{font-size: 24px; font-weight: 700; margin: 15px 0; padding: 0;}
.policy_icon .fa{font-size: 50px;}
.policy-right{background: #903b8b; text-align: center; color: #fff; padding: 20px; box-shadow: 1px 1px 10px #0000003b; transition: 0.5s;}
.policy-right p{color: #fff;}
.policy-right:hover{background: #fff; color: #903b8b; margin: -10px 0 0;}
.policy-right:hover p{color: #903b8b;}
.policy-left{background: #fff; text-align: center; color: #903b8b; padding: 20px; box-shadow: 1px 1px 10px #0000003b; transition: 0.5s;}
.policy-left p{color: #903b8b;}
.policy-left:hover{background: #fff; color: #903b8b; margin: -10px 0 0;}
.policy-left:hover p{color: #903b8b;}

/*inner-services-text*/
.inner-services-text{text-align: center;}
.inner-services-text p{text-align: center; padding: 0% 50px;}
.main-services-text p{ padding: 0;}
.main-services-text .fa{transform: rotate(90deg);  color: #913b8c;  font-size: 20px; margin: 5px 8px 0 0px;}
.main-services-text b{color: #913b8c;}
.main-services-text h4{ padding: 15px 0; margin: 0;  font-size: 22px; font-weight: 600;}
.main-services-icon { display: inline-block; padding: 20px; width: 130px;  border: 2px solid #913b8c; border-radius: 5px; position: relative; transition: 0.5s; background: linear-gradient(to top, #340e69f2 , #5a0c56);}
.inner-main-services .big-title{text-align: center;}
.inner-main-services{margin: 30px 0 0; }
.mt{margin-top: 30px;}
.main-services-text3{text-align: center; margin: 30px 0 0; padding: 10px;}
.main-services-text3 h3{color: #903b8b; font-size: 24px; font-weight: 500;}
.main-services-text3 .fa{    color: #616361; font-size: 55px;  font-weight: 500;  margin: 0 0 25px; border: 2px solid #e4e4e4;
    padding: 10px; border-radius: 5px; width: 100px;  height: 80px;}
/*contact us*/
.contact-address{margin: 30px 0 0;}
.contact-address ul { padding: 0; margin: 0;}
.contact-address ul li { padding: 0; margin: 0; list-style-type: none; display: list-item; line-height: 35px; color: #676565;
    font-size: 14px;  font-weight: 400; font-family: 'Poppins', sans-serif; letter-spacing: 0.5px;}
.contact-address .fa{color: #913b8c; margin: 0 10px 0px 0px; font-size: 18px;}
.contact-social .fa{font-size: 30px; font-size: 18px;}
.contact-social{margin: 30px 0 0; position: relative; z-index: 2;}
.contact-social ul { padding: 0;  margin: 0;}
.contact-social ul li { padding: 0; margin: 0; list-style-type: none;  display: inline-block;}
.contact-social ul li a { color: #913b8c; padding: 0 5px;}
.contact-social ul li a:hover { color: #000; }
.contact_form{box-shadow: 1px 1px 10px #0000003b; width: 100%; padding: 40px; position: relative;}
.contact_form input{height: 53px;border-radius: 10px; border-color: #ddd;}
.contact_form button{background: #903b8b;  padding: 15px 30px;  border-radius: 5px; border: 0; color: #fff; letter-spacing: 0.5px; font-weight: 500; font-size: 16px; margin: 0 ; position: relative; z-index: 1; overflow: hidden; text-decoration: none; display: inline-block;}
.contact_form button:before { position: absolute; content: '';  width: 100%; height: 100%;  background: #923d8d;  bottom: -54px; left: 0;
    border-radius: 5px;  z-index: -1; transition: 0.2s; }
.contact_form button:hover:before{bottom: 0;}
.contact_form .form-control:focus{border-color: #800d79a6 !important; box-shadow: none;}

/*.why_us*/
.why_us { background: #f1eaea54;}
.product-text img{width: 100%;}
.product-text .title-line{color: #913b8c;
    display: block;
    font-size: 16px;
    font-weight: 500;
    margin: 0 0 15px;
    background: #f1eded;
    padding: 14px 10px;
    text-align: center;}
.product-text .big-title h2{font-size: 24px; font-weight: 600;}



#preloader { position: fixed;top: 0;left: 0; right: 0; bottom: 0; background-color: #222;
  /* change if the mask should have another color then white */
  z-index: +9999;
  /* makes sure it stays on top */
}

#status {
  width: 900px;
  height: 500px;
  position: absolute;
  left: 50%;
  /* centers the loading animation horizontally one the screen */
  top: 50%;
  /* centers the loading animation vertically one the screen */
  background-image: url(../images/loader.gif);
  /* path to your loading animation */
  background-repeat: no-repeat;
  background-position: center;
  transform: translate(-50%, -50%);
  /*margin: -100px 0 0 -100px;*/
  /* is width and height divided by two */
}

.bx-wrapper .bx-pager, .bx-wrapper .bx-controls-auto{bottom: 20px;}
/*fiexdcss*/
.bx-wrapper{border: 0; margin-bottom: 0; box-shadow: none; background: none;}
.mnp{margin: 0; padding: 0;}
.bx-wrapper .bx-pager.bx-default-pager a{background: #ffffff36;}
.bx-wrapper .bx-pager.bx-default-pager a.active{background: #d454cc;}
/*.bx-viewport{height: auto !important;}*/
/*top-btn-css*/
#back-to-top-btn { display: none;position: fixed;bottom: 20px;right: 35px;font-size: 26px; width: 50px;
  height: 50px; background-color:#913b8c;color: #333; cursor: pointer;outline: none; border-radius: 20%;
  transition-duration: 0.2s; transition-timing-function: ease-in-out; transition-property: background-color, color; border: 1px solid white; z-index: 2;  }
#back-to-top-btn img{margin: 0 auto; position: absolute; left: 50%; right: 50%; transform: translate(-50%, -50%);}
#back-to-top-btn:hover {background-color: #903b8b;}
.quality_policy{background: #f7f7f7b5;}
