/*================== backgrounds ==============*/

.fullscreen-background #homepage {
background:url(../images/backgrounds/background-image3.jpg) 50% 0 no-repeat; 
}
@media screen and (max-width: 530px){
    .fullscreen-background #homepage {
    background:url(../images/backgrounds/mobi.jpg) 50% 0 no-repeat; 
    }
}
nav a.brand h1 {
background:url(../images/website-logo/logo2w.png) 0 0 no-repeat;
 background-size: 148.75px 52.25px !important;
    margin-top: -10px;
    padding-right: 101px;
    padding-bottom: 52px;
}
.light .scroll-navbar a.brand h1{
background:url(../images/website-logo/logo2b.png) 0 0 no-repeat !important;
 background-size: 148.75px 52.25px !important;

}
@media screen and (max-width: 320px){
    .light .scroll-navbar a.brand h1{
     background-size: 120.4875px 42.3225px !important;
     margin-top: -6px;
    }
}
@media screen and (min-width: 320px) and (max-width: 768px){
    .light .scroll-navbar a.brand h1{
     background-size: 120.4875px 42.3225px !important;
     margin-top: -6px;
    }
}
/*================== backgrounds ==============*/
.feature-part{
    background: #F7F7F7;
    padding-bottom: 65px;
    padding-top: 65px;
    margin-bottom: 35px;

}
/*================== Cover portion text ==============*/



.slogan p{
	line-height: 2.125em;
}
.slogan figure {
    margin-top: 115px;
}

.slogan figure img{
    margin: auto;
}

@media screen and (max-width: 320px){
    .slogan figure img{
     margin-top: 105px !important;  
    }

}
@media screen and (min-width: 320px) and (max-width: 767px){
    .slogan figure img{
     margin-top: 132px !important;
    }

}
@media screen and (min-width: 768px) and (max-width: 1008px){
    .slogan figure img{
     margin-top: 45px !important;
    }

}
#feat-figure img{
    margin: auto;
}

.jumbo-text{
    font-size: 36px;
}
@media screen and (max-width: 320px){
    .jumbo-text{
        font-size: 18px;
    }
}
@media screen and (min-width: 321px) and (max-width: 768px){
    .jumbo-text{
        font-size: 20px;
    }
}
@media screen and (min-width: 769px) and (max-width: 1200px){
    .jumbo-text{
        font-size: 28px;
    }
}
/*================== Cover portion text ==============*/

/*================== Book now modal background==============*/

.light .modal-backdrop {
 background-color: rgba(29, 17, 35, 0.90) !important;
}

/*================== Book now modal background==============*/



/*================== Book now modal start==============*/

.reg-here{
    width: 100%;
    padding: 0px 40px 0px 40px;
}
.reg-here form .input-group{
    margin-top: 15px;
    border: 1px solid #E8E8E8;
    border-radius: 3px;
    color: #777;
}
.reg-here form .input-group input{
    width: 100%;
    color: #777;
    background: none;
    font-size: 14px;
    height: 45px;
    padding: 0 15px 0 5px;
    outline: none;
    border: none;
    position: relative;
}

.reg-here form .input-group-addon{
    background-color: transparent;
    border: none;
    font-size: 18px;
    color: #777;
}

.reg-here form li textarea{
    border: none;
    color: #555;
    background: none;
    font-size: 14px;
    padding:13px;
    border-radius: 3px;
    width: 100%;
    resize: none;
    outline: none;
    padding-left: 20px;
}
.reg-here button{
    float: right;
    padding: 12px;
    font-size: 12px;
    margin-bottom: 30px;

}
@media screen and (max-width: 320px){
.reg-here button{
    text-align: center;
}
}
.reg-here button:hover{
    padding: 12px;
    font-size: 12px;
    margin-bottom: 30px;
}
 .require{
    position: absolute;
    right: 15px;
    color: red;
    top: 13px;
    font-weight: 600;
 }
 .msgbox i{
    position: absolute;
    top: 18px;
 }
 i.cntct-msgbox{
    position: absolute !important;
    top: 18px !important;
 }
 /*==================Book now modal end ===============*/



/*================== Teaser text quotes ==============*/


.teaser p{
    font-size: 36px;
    text-transform: none;
    text-align: center;
}
@media screen and (max-width: 320px){
    .teaser p{
        font-size: 18px;
    }
}
@media screen and (min-width: 321px) and (max-width: 768px){
.teaser p{
        font-size: 20px;
    }
}
@media screen and (min-width: 769px) and (max-width: 1200px){
.teaser p{
        font-size: 28px;
    }
}
/*================== Teaser text quotes end ==============*/


/*========= index heading details ============*/

.text-content{
    margin-bottom: -10px;
     margin-top: 20px;
 }
 .content1 p{
 text-align: center;
 padding-left: 180px;
 padding-right: 180px;
 margin-bottom: 40px;
 line-height: 26px;
}
p.about-para{
    margin-bottom: 70px;
}
@media screen and (max-width: 320px){
    .content1 p{
     padding-left: 35px;
     padding-right: 35px;
    }
}
@media screen and (min-width: 321px) and (max-width: 768px){
    .content1 p{
     padding-left: 35px;
     padding-right: 35px;
    }
}
@media screen and (min-width: 769px) and (max-width: 1200px){
    .content1 p{
     padding-left: 90px;
     padding-right: 90px;
    }
}

/*========= index text heading ============*/

/*========= Tarrif details ============*/
.price-details{
    margin-bottom: 50px;
}
.price-details p{
	text-align: center;
    font-size: 26px;
    background-color:#e84058;
    padding-top: 15px;
    padding-bottom: 15px;
    margin-bottom: 0px;
    margin-top: 0px;
    color: #fff;
    font-weight: 400;
    border-radius: 5px;
    width: 380px;
    margin: auto;
}

/*========= Tarrif details end ============*/

/*=============  tarrif table starts ==========*/
table {
    border-collapse: collapse;
    width: 50%;
    margin: auto;
    margin-bottom: 50px;

}

th, td {
    text-align: left;
    padding: 12px;
    text-align: center;
    font-size: 18px;
    font-weight: 100;
}

tr:nth-child(even){background-color: #f2f2f2}

th {
    background-color:rgba(69, 59, 75, 0.7);
    color: white;
    text-align: center;
    }

    @media screen and (min-width: 321px) and (max-width: 480px) {
        th, td {
            font-size: 14px;
        }
    }
    @media screen and (max-width: 320px) {
        th, td {
            font-size: 12px;
        }
    }


/*=============  tarrif table end ==========*/

@media screen and (max-width: 768px){
    .price-details p{
        font-size: 18px;
        width: 270px;
        font-size: 20px;


    }
}
.light footer {
    background: #1d1123 !important;
}

.light .icon-box figure, .light .icon-round figure, .light .icon-square figure{
	background:#1d1123 !important;
	border-radius: 50px;
}

.mask-overlay {
 background:rgba(29, 17, 35, 0.49);
}

/*========= centered icon boxes start ============*/

.wrapper .text-center img{
	 width:70px; 
	 border-radius: 50px; 
	 margin-bottom: 25px;
}
/*========= centered icon boxes ends ============*/

/*============= features section start ==========*/
.pull-down .icon-box img{
	 width:70px;
	 border-radius: 50px; 
	 margin-bottom: 10px;
}
/*============= features section end ============*/

/*============-- overview section --==============*/

#whyclap .device-box img{
	 width:70px;
	 border-radius: 50px;
	  margin-bottom: 25px;
}
/*=============  overview section ends ==========*/

/*=============  pictogram  starts ==========*/

.light .price-plan {
    border:none !important;
}
.md-scrn{
    position: relative;
}
    
      .price-plan .pg-nos {
        font-weight: bold;
        font-size: 16px;
        margin: 10px; }
      .price-plan .pg-title {
        text-transform: uppercase;
        font-weight: bold;
        margin-bottom: 10px;
        font-size: 15px;
        color: #555; }
      .price-plan .pg-des {
        font-size: 13px;
        margin: auto;
        width: 80%; }

        .price-plan img.picto-img{
            width: 140px;
         }
        .price-plan img.pg-arrw{
            padding-left: 57px;
            position: absolute;
            padding-top: 57px;
            width: 80px;
        }
        
        .price-plan img.pg-img 
        {
            max-width: 160px;
            margin: auto;
            margin-bottom: 10px;
        }
        .price-plan img.pg-arrw-down{
            position:absolute;
            }
    @media screen and (max-width: 320px) {
        .md-scrn{
            margin-bottom: 60px;
        }
        .price-plan img.pg-arrw{
            display: none;
        }
        img.arrow-for-ms-display{
            display: none;
         }
        .price-plan img.pg-arrw-down{
            margin-top: 273px;
            margin-left: -87px;
        }
    }
    @media screen and (max-width: 480px) {
        .md-scrn{
            margin-bottom: 60px;
        }
        .price-plan img.pg-arrw{
            display: none;
        }
        img.arrow-for-ms-display{
            display: none;
         }
        .price-plan img.pg-arrw-down{
            margin-top: -35px;
                margin-left: -78px;
                 width: 20px;
        }
    }

    @media screen and (min-width: 481px) and (max-width: 767px) {
        .md-scrn{
           width: 45%;
           display: inline-block;
            vertical-align: top;
            min-height: 310px;
        }

        .price-plan img.pg-arrw{
            display: none;
        }
        img.arrow-for-ms-display{
            margin-top: 90px;
            width: 13px;
        }
        .price-plan img.pg-arrw-down{
           display: none;
        }

  }
  @media screen and (min-width: 768px) and (max-width: 991px) {

        .price-plan img.pg-arrw{
            padding-left: 14px;
            width: 26px !important;
        }
       .price-plan img.pg-arrw-down{
           display: none;
        }
        img.arrow-for-ms-display{
            display: none;
        }

  }
  @media screen and (min-width: 992px) and (max-width: 1199px) {
        .price-plan img.pg-arrw{
            padding-left: 42px;
        }
        .price-plan img.pg-arrw-down{
           display: none;
        }
        img.arrow-for-ms-display{
            display: none;
        }
    }
  @media screen and (min-width: 1200px) and (max-width: 1679px) {
        .price-plan img.pg-arrw{
            padding-left: 65px;

        }
        .price-plan img.pg-arrw-down{
           display: none;
        }
        img.arrow-for-ms-display{
            display: none;
        }
    }

  @media screen and (min-width: 1680px) and (max-width: 1919px) {
        .price-plan img.pg-arrw{
            padding-left: 63px;
        }
        .price-plan img.pg-arrw-down{
           display: none;
        }
        img.arrow-for-ms-display{
            display: none;
        }
    }  
  @media screen and (min-width: 1920px) {
        .price-plan img.pg-arrw{
            padding-left: 67px;
        }
        .price-plan img.pg-arrw-down{
           display: none;
        }
        img.arrow-for-ms-display{
            display: none;
        }
    } 



/*=======================  pictogram end ============================*/

/*=======================  services image sm screen start ============================*/

@media screen and (min-width: 481px) and (max-width: 767px) {
    #feat-figure img {
        width: 50% !important;
    }
}
/*=======================  services image sm screen  end ============================*/
/*=======================  COVER PHONE IMAGE RESPONSIVE ============================*/


@media screen and (min-width: 768px) and (max-width: 991px) {
    .slogan img{
        margin-top: 40px;
    }
}
/*=======================  COVER PHONE IMAGE RESPONSIVE END ============================*/




/*================================== back to top button end ====================================*/

#return-to-top {
    position: fixed;
    bottom: 30px;
    right: 30px;
    display: block;
    text-decoration: none;
    -webkit-border-radius: 35px;
    -moz-border-radius: 35px;
    border-radius: 35px;
    display: none;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
    z-index: 1;
    opacity: 0.3;
}

#return-to-top:hover {
opacity: 1;
}
 
#return-to-top img{
    width: 40px;
}

/*================================== back to top button end ====================================*/


/*================================== email table ====================================*/

table 
    {
        margin-top:5px;
        border-collapse: collapse;
        width: 95%;
                /*margin-right:50px;*/
    }
th, td 
    {
         border: 1px solid #ddd;
         padding: 15px;
         text-align: left;
         border-bottom: 1px solid #ddd;
    }
      
      /*tr:nth-child(even){background-color: #f2f2f2}*/

/*================================== email table ====================================*/