/*HTML Template Design by Separateweb.com*/

/*offline fonts*/
@font-face {
    font-family: 'tt_normsbold';
    src: url('../webfonts/ttnorms-bold-webfont.woff2') format('woff2'),
         url('../webfonts/ttnorms-bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'tt_normsregular';
    src: url('../webfonts/ttnorms-regular-webfont.woff2') format('woff2'),
         url('../webfonts/ttnorms-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
.fp-warning, .fp-watermark a {opacity: 0;}

/*scrollbar Theme*/
::-webkit-scrollbar {width:0px;}
::-webkit-scrollbar-track { background: #fff;}
::-webkit-scrollbar-thumb:hover {background: #f5f5f5;}
::-webkit-scrollbar-thumb {background: #f9f9f9 ;}

/* Global Typography Settings */
*,html {
    -webkit-font-smoothing: antialiased;
    -moz-os-font-smoothing: grayscale;
    box-sizing: border-box;
    padding: 0;
    margin: 0;
    outline: none;
    vertical-align: baseline;
}
body {
    font-family: 'tt_normsregular';
    color: #fff;
    font-weight: 300;
    font-style: normal;
    font-size: 22px;
    line-height: 32px;
    outline: none;
    overflow-x: hidden;
}
.animation, .btn{
-webkit-transition: 1.1s cubic-bezier(.16, .84, .442, .98);
-o-transition: 1.1s cubic-bezier(.16, .84, .442, .98);
transition: 1.1s cubic-bezier(.16, .84, .442, .98);
}

h1, h2,h3,h4,h5,h6{  font-family: 'tt_normsbold';}
h1, h2,h3,h4,h5,h6,p,ul,address{padding: 0; margin: 0;}
ul{list-style: none;}
h1{font-size: 60px; font-weight: 700; line-height: 72px;}
h2{font-size: 50px; font-weight: 700; line-height: 62px;}
h3{font-size: 40px; font-weight: 700; line-height: 52px;}
h4{font-size: 30px; font-weight: 500; line-height: 42px;}
h5{font-size: 22px; font-weight: 500; line-height: 30px;}
h6{font-size: 18px; font-weight: 500; line-height: 28px;}
a{text-decoration: none;}
.f15{font-size: 15px;}
.f14{font-size: 14px;}

/*theme Help Classes*/
.index-up{position: relative; z-index: 5;}
.index-down{position: relative; z-index: 0;}
.v-center{align-items: center;}
.italic{font-style: italic;}


.div-space{padding-top: 100px; padding-bottom: 100px;}
/*margin top*/
.mb0{margin-bottom: 0 !important;}
.mr10{margin-right: 10px;}
.mt5{margin-top: 5px;}
.mt10{margin-top: 10px;}
.mt15{margin-top: 15px;}
.mt20{margin-top: 20px;}
.mt25{margin-top: 25px;}
.mt30{margin-top: 30px;}
.mt35{margin-top: 35px;}
.mt40{margin-top: 40px;}
.mt45{margin-top: 45px;}
.mt50{margin-top: 50px;}
.mt55{margin-top: 55px;}
.mt60{margin-top: 60px;}
.mt65{margin-top: 65px;}
.mt70{margin-top: 70px;}
.mt75{margin-top: 75px;}
.mt80{margin-top: 80px;}
.mt85{margin-top: 85px;}
.mt90{margin-top: 90px;}
.mt95{margin-top: 95px;}
.mt100{margin-top: 100px;}
.mt105{margin-top: 105px;}
.mt110{margin-top: 110px;}
.mt115{margin-top: 115px;}
.mt120{margin-top: 120px;}
.mt125{margin-top: 125px;}
.mt130{margin-top: 130px;}
.mt135{margin-top: 135px;}
.mt140{margin-top: 140px;}
.mt145{margin-top: 145px;}
.mt150{margin-top: 150px;}

/*margin bottom*/
.mb5{margin-bottom: 5px;}
.mb10{margin-bottom: 10px;}
.mb15{margin-bottom: 15px;}
.mb20{margin-bottom: 20px;}
.mb25{margin-bottom: 25px;}
.mb30{margin-bottom: 30px;}
.mb35{margin-bottom: 35px;}
.mb40{margin-bottom: 40px;}
.mb45{margin-bottom: 45px;}
.mb50{margin-bottom: 50px;}
.mb55{margin-bottom: 55px;}
.mb60{margin-bottom: 60px;}
.mb65{margin-bottom: 65px;}
.mb70{margin-bottom: 70px;}
.mb75{margin-bottom: 75px;}
.mb80{margin-bottom: 80px;}
.mb85{margin-bottom: 85px;}
.mb90{margin-bottom: 90px;}
.mb95{margin-bottom: 95px;}
.mb100{margin-bottom: 100px;}
.mb105{margin-bottom: 105px;}
.mb110{margin-bottom: 110px;}
.mb115{margin-bottom: 115px;}
.mb120{margin-bottom: 120px;}
.mb125{margin-bottom: 125px;}
.mb130{margin-bottom: 130px;}
.mb135{margin-bottom: 135px;}
.mb140{margin-bottom: 140px;}
.mb145{margin-bottom: 145px;}
.mb150{margin-bottom: 150px;}

/*padding top*/
html .pt0{padding-top: 0;}
.pt5{padding-top: 5px;}
.pt10{padding-top: 10px;}
.pt15{padding-top: 15px;}
.pt20{padding-top: 20px;}
.pt25{padding-top: 25px;}
.pt30{padding-top: 30px;}
.pt35{padding-top: 35px;}
.pt40{padding-top: 40px;}
.pt45{padding-top: 45px;}
.pt50{padding-top: 50px;}
.pt55{padding-top: 55px;}
.pt60{padding-top: 60px;}
.pt65{padding-top: 65px;}
.pt70{padding-top: 70px;}
.pt75{padding-top: 75px;}
.pt80{padding-top: 80px;}
.pt85{padding-top: 85px;}
.pt90{padding-top: 90px;}
.pt95{padding-top: 95px;}
.pt100{padding-top: 100px;}
.pt105{padding-top: 105px;}
.pt110{padding-top: 110px;}
.pt115{padding-top: 115px;}
.pt120{padding-top: 120px;}
.pt125{padding-top: 125px;}
.pt130{padding-top: 130px;}
.pt135{padding-top: 135px;}
.pt140{padding-top: 140px;}
.pt145{padding-top: 145px;}
.pt150{padding-top: 150px;}

/*padding bottom*/
.pb5{padding-bottom: 5px;}
.pb10{padding-bottom: 10px;}
.pb15{padding-bottom: 15px;}
.pb20{padding-bottom: 20px;}
.pb25{padding-bottom: 25px;}
.pb30{padding-bottom: 30px;}
.pb35{padding-bottom: 35px;}
.pb40{padding-bottom: 40px;}
.pb45{padding-bottom: 45px;}
.pb50{padding-bottom: 50px;}
.pb55{padding-bottom: 55px;}
.pb60{padding-bottom: 60px;}
.pb65{padding-bottom: 65px;}
.pb70{padding-bottom: 70px;}
.pb75{padding-bottom: 75px;}
.pb80{padding-bottom: 80px;}
.pb85{padding-bottom: 85px;}
.pb90{padding-bottom: 90px;}
.pb95{padding-bottom: 95px;}
.pb100{padding-bottom: 100px;}
.pb105{padding-bottom: 105px;}
.pb110{padding-bottom: 110px;}
.pb115{padding-bottom: 115px;}
.pb120{padding-bottom: 120px;}
.pb125{padding-bottom: 125px;}
.pb130{padding-bottom: 130px;}
.pb135{padding-bottom: 135px;}
.pb140{padding-bottom: 140px;}
.pb145{padding-bottom: 145px;}
.pb150{padding-bottom: 150px;}
/**/

/**custom css**/
.btn{
    background: #587dfa;
    color: #fff;
    display: inline-block;
    grid-gap: 8px;
    padding: 0 30px;
    border-radius: 30px;
    line-height: 60px;
    align-items: center;
    font-size: 20px;
}

.btn:hover{
    background: #224fe7;
    color: #fff; 
    border-radius: 8px;  
}

.widepad{
    padding-left: 100px;
    padding-right:100px;
}
.bigfont{ font-family: 'tt_normsbold';}

.herodiv{ width: 100%; height: 100vh; overflow: hidden; position: relative;}

.fp-table {  
    background-color: #050a30 !important;
}

.heropart {
    display: grid;
    grid-template-columns: auto 50%;
    grid-gap: 30px;
    align-items: center;
}
.mr-auto{margin: 0 auto;}

.heroleft {
    text-align:justify;
    float:left;
}
.heroright{
    text-align:justify;
    float:right;
}


.heroleft h1 {
    font-size: 70px;
    font-weight: 700;
    line-height: 80px;
}

.top-text{
    font-size: 50px;
    font-weight: 700;
    line-height: 60px;   
}
.mar-top{
    padding-top: 30px;
}
.bt-mar{
    margin-top: 80px;
}
/*
 no-repeat center center fixed; 
   -webkit-background-size: cover;
   -moz-background-size: cover;
   -o-background-size: cover;
   background-size: cover;


.meshbg {
    background-image: url(bitomic.gif);
    background-position: right bottom, left top;
    background-repeat: no-repeat, repeat;
    background-size:cover;
    background-color: hsla(241,100%,47%,1) !important;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;

}
*/
.firstimg .img-fluid {
    max-width: 80%;
    height: auto;
    margin: 0 auto;
}

.img-fluid1{
    max-width: 80%;
    height: auto;
    margin: 0 auto;
}

.servicescontainer{
    display: flex;
    text-align:center;
  }
  

 @media screen and (max-width: 960px) {
      .servicescontainer{
      flex-direction: column;
    }
}
.mediablock {
    display: flex;
    grid-gap: 25px;
    align-items: center;
}
.mediablock div:first-child {
    flex-shrink: 0;
}

.iconside img{width: 60px;}

.mediablock + .mediablock{margin-top: 20px;}

.part2logo {
    margin: 0 auto 50px;
    text-align: center;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    align-content: center;
}
.part2logo img {
    width: 280px;
}
.part2logo img.gif {
   position: absolute;
}

.contentside{
    font-family: 'tt_normsbold';
}

.servicesfont {
    color: white;
    font-size: 55px;
    font-weight: 700;
    line-height: 65px;
    text-align: center;
    
}
.servicesmar{
    margin-top:40px;
}

.serviceslist{   
    display: grid;
    grid-template-columns:repeat(5, 1fr);
    grid-gap: 60px;
    text-align:center;
}

.topimg{
    width:10%;
    height:auto;
    padding:8px;
}
.serviceslist a {
    color: #fff;
    font-family: 'tt_normsbold';
    font-size: 100px;
}
.fsize{
    cursor:pointer;
    font-size: 18px;
    font-weight: bold;
}
.fsize1{
    font-size:15px;
}
.fsize2{
    font-size:15px;
    text-align:justify;
}
.serviceslist a:hover {
    color: #6ce5e8;
}


.hcenter {
    height: 100%;
    display: grid;
    align-content: center;
}

.iconslist {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    grid-gap: 60px;   
}
.socialmedialist {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-gap: 40px;  
     
}
.socialmedialisttop {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(4, 100px);
    grid-gap: 10px;  
     
}
.iconimg{
    width:100%;
}
.contctblock{    text-align: center;}
.contctblock a.bbltk {
    background: #cb1180;
    position: relative;
    color: #fff;
    padding: 0 50px;
    line-height: 70px;
    display: inline-block;
    border-radius: 14px;
    margin: 30px 0 40px 0;
    font-size: 32px;
    font-style: italic;
    font-weight: bold;
}
.socisicons a img{width: 70px;}
.socisicons {
    display: flex;
    align-items: center;
    justify-content: center;
    grid-gap: 30px;
}

.contctblock a.bbltk::after{
    content: '';
    position: absolute;
    left: 42%;
    top: 100%;
    width: 0;
    height: 0;
    border-left: 20px solid transparent;
    border-right: 20px solid transparent;
    border-top: 20px solid #cb1180;
    clear: both;
}

#fp-nav { 
    right: 10px;
}
#fp-nav ul li a span, .fp-slidesNav ul li a span{background: #fff;}

.logoprt {
    margin: 100px 0 0 0 !important;
}
.cntactheading{margin-top: 30px;}

img{max-width: 100%;    height: auto;}

.leftside, .rightside {
    padding: 2%;
    text-align: left;
  }
  
  @media ( min-width : 600px ){
      .flexbox {
      width: 100%;
      margin: 0 auto;
      display: -webkit-flex;
      display: flex;
      }
    .leftside,
    .rightside {
      -webkit-flex: 1;
      flex: 1;
      background: none;
    }
  }

/***************************/
/** Responsive CSS**/
/***************************/

/**width between 1920 to 1500**/
@media screen and (max-width:1920px) and (min-width:1500px) {
    .top-text{
        font-size: 70px;
        font-weight: 800;
        line-height: 70px;   
    }


}

@media only screen and (max-width:1700px) {
    .heroleft h1 {
        font-size: 60px;
        line-height: 70px;
    }
}

@media only screen and (max-width:1450px) {
    .widepad {
        padding: 0 50px;
    }
    .heroleft h1 {
        font-size: 45px;
        font-weight: 700;
        line-height: 55px;
    }
    h2 {
        font-size: 40px;
        font-weight: 700;
        line-height: 50px;
    }
    body {      
        font-size: 20px;
        line-height: 30px; 
    }

    .iconslist {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        grid-gap: 10px;
        margin-top: 20px;
    }

    .serviceslist {
        display: grid;
        grid-template-columns: repeat(5, 1fr);
        grid-gap: 40px;
    }
    .cntactheading{margin-top: 20px;}

    .contctblock a.bbltk {       
        padding: 0px 40px;
        line-height: 60px;       
        margin: 20px 0 20px 0;
        font-size: 28px;        
    }

}
/**width over 1200px**/
@media only screen and (max-width: 1300px) {
    .servicesmar{
        margin-top:40px;
    }
    .mr-auto {
        margin: 0 auto;      
    }
    .firstimg .img-fluid {
        max-width: 60%;
        height: auto;
        margin: 0 auto;
    }
    .heroleft h1 {
        font-size: 40px;
        font-weight: 700;
        line-height: 50px;
    }
    .part2logo img {
        width: 200px;
    }
    h2 {
        font-size: 35px;
        font-weight: 700;
        line-height: 45px;
    }
    .mediablock + .mediablock {
        margin-top: 20px;
    }
    body {
        font-size: 18px;
        line-height: 28px;
    }
    .servicesfont {
        font-size: 40px;
        line-height: 50px;
        margin-bottom: 30px;
    }
    .iconslist img {
        max-width: 60%;
        height: auto;
    }
    .contctblock a.bbltk {
        padding: 0px 40px;
        line-height: 50px;
        margin: 10px 0 10px 0;
        font-size: 28px;
    }
    .serviceslist a {
        color: #fff;
        font-family: 'tt_normsbold';
        font-size: 22px;
    }
    .logoprt {
        margin: 50px 0 0 0 !important;
    }
    .iconslist {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        grid-gap: 10px;
        margin-top: 0px;
    }
    .iconside img {
        width: 40px;
    }
    .iconslist a{margin: 0 auto; text-align: center;}
    .socisicons a img {
        width: 60px;
    }
}

/**width under 1199**/
@media only screen and (max-width:1199px) {
    .servicesmar{
        margin-top:80px;
    }

}
/**width under 992**/
@media only screen and (max-width: 992px) {
    .heroleft h1 {
        font-size: 45px;       
        line-height: 55px;
    }
    body {
        font-size: 20px;
        line-height: 30px;
    }

    h2 {
        font-size: 42px;      
        line-height: 52px;
    }
    .serviceslist a {      
        font-size: 20px;
    }
    .servicesmar{
        margin-top:80px;
    }


}
/**width under 767**/
@media only screen and (max-width: 767px){
    .top-text{
        font-size: 30px;
        font-weight: 500;
        line-height: 30px;   
    }
    .widepad {
        padding: 0 20px;
    }
    .serviceslist {    
        grid-template-columns: repeat(3, 1fr);
        grid-gap: 40px;
    }
    .fsize1{
        font-size:14px;
    }


    .heropart { grid-template-columns: auto; grid-gap: 20px; padding: 30px 0;}
    .mediablock + .mediablock {
        margin-top: 20px;
    }
    .heroleft h1 {
        font-size: 35px;
        line-height: 45px;
    }
    .heroright {
        width: 100%;
        height: 420px;
    }
    .heroright img {
        width: 100%;
        height: 100%;
        object-fit: contain;
        margin: 0 auto;
        text-align: center;
        display: block;
    }
    h2 {
        font-size: 28px;
        line-height: 35px;
    }
    .btn {      
        width: 90%;
        text-align: center;
        justify-content: center;
        margin: 30px auto 0;
    }
    .mediablock {
        display: flex;
        grid-gap: 25px;
        align-items: center;
        margin-top: 20px;
    }
    .iconside img {
        width: 30px;
    }

    .part2logo img {
        width: 200px !important;
    }
    body {
        font-size: 18px;
        line-height: 28px;
    }
    .serviceslist {
        grid-template-columns: repeat(3, 1fr);
        grid-gap: 30px;
    }
    .serviceslistmobile {
        text-align: center;
    }
    .serviceslistmobile p{
        padding:10px;
        margin-left:25%;
        text-align:center;
    }
    .servicesfont {     
        font-size: 40px;    
        line-height: 50px;       
    }

    .iconslist {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        grid-gap: 10px;
        margin-top: 20px;
    }
    .hideclass{
        visibility:hidden;
    }
  
}
/**width under 575**/
@media only screen and (max-width: 575px) {

    .heroleft h1 {
        font-size: 30px;
        line-height: 38px;
    }
    .heroleft .mt30{margin-top: 15px;}
    .btn {
        width: 100%;
        text-align: center;
        justify-content: center;
        margin: 20px auto 0;
        line-height: 50px;
    }
    .heroright {
        width: 100%;
        height: 320px;
    }
    .heropart {      
        grid-gap: 20px;
        padding: 30px 0;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

    .heroright2 {
        width: 100%;
        height: auto;
    }

    .part2logo {
        margin: 0 auto 15px;       
    }

    .serviceslist a {
        font-size: 16px;
    }
    .serviceslist {      
        grid-gap: 20px;
    }

    .mediablock + .mediablock {
        margin-top: 15px;
    }

    body {
        font-size: 16px;
        line-height: 24px;
    }
    .fsizetwo{
        font-size:11px;
    }
    .bt-mar{
        margin-top: 60px;
    }
    .hideclass{
        visibility:hidden;
    }
    

}
/**width under 360**/
@media only screen and (max-width: 510px) {
    .heroright {
        width: 100%;
        height: 45%;
    }
    .heroleft h1 {
        font-size: 25px;
        line-height: 34px;
    }
    h2 {
        font-size: 22px;
        line-height: 28px;
    }
    .part2logo img {
        width: 160px !important;
    }
    body {
        font-size: 15px;
        line-height: 22px;
    }
    .socisicons a img {
        width: 60px;
    }
    .servicesfont {
        font-size: 30px;
        line-height: 50px;
    }

    .heropart {
        padding: 0;
        grid-gap: 20px;
        padding: 50px 0 0 0;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
    }
    .heroright2 .mt20{margin-top: 10px;}
    .mediablock + .mediablock {
        margin-top: 10px;
    }
    .part2logo img {
        width: 140px !important;
    }
    .firstimg{margin-top: 30px;}
    .part2logo {
        margin: 15px auto 15px;
    }
    .hideclass{
        visibility:hidden;
    }
    
}
/**width under 370**/
@media only screen and (max-width: 360px) {
    
    .hideclass{
        visibility:hidden;
    }
  
}
/**width under 300**/
@media only screen and (max-width: 300px) {
    
    .fsize1{
        font-size:9px;
    }
    .top-text{
        font-size: 25px;
        font-weight: 500;
        line-height: 25px;   
    }
    .bt-mar{
        margin-top: 5px;
    }
    .hideclass{
        visibility:hidden;
    }
  

}