*{margin: 0;
padding: 0;
font-family: 'Josefin Sans', sans-serif;}
img{
    max-width: 100%;
}
a{
    text-decoration: none;}
.justify {
        text-align: justify;
        /* padding: 11px 9px; */

    }

.text-right{text-align: right;}
.text-center{text-align: center;}
.text-left{text-align: left;}
.clear::after{
    content:'';
    display: block;
    clear: both;
}
.left{
    float: left;
    }
    .right{
        float: right;
    }


.mid-part{
    max-width: 1200px;
    margin: auto;
}

.header-logo {
    width: 30%;
    
   }
.header-menu{    width: 60%;
   }
.header-btn{width: 10%;
         text-align: right;}

/* Starting part */
.header {
    background-color: #ecf0f1;
    border-bottom: 1px solid #ccc;
    padding: 10px 0;
   position: fixed;
   top: 0;
   left: 0;
   z-index: 99;
   width: 100%;
   
}


.header a{color:#000}

.logo img {
    height: 50px;
    float: left;
    margin-right: 10px;
  
  
}
.logo span {
    display: inline-block;
    margin-top: 28px;
    padding: 0px 13px;
    font-size: 20px;
    font-weight: 700;
    color: #e67e22;
}

/* Menu */

.primary-menu{}
.primary-menu ul{}
.primary-menu ul li{display: inline-block;
                      position: relative;}
.primary-menu ul li ul{
    width: 250px;
    position: absolute;
    top: 100%;
    left: 0;
    background-color: #ecf0f1;
    visibility: hidden;
    opacity: 0;
    transition: 0.6s;
    transform: scale(0);
    transform-origin: top center;
   
}
.primary-menu ul li:hover ul{
    visibility: visible;
    opacity: 1;
    transform: scale(1);
    z-index: 9;
  
}

.primary-menu ul li ul a{
   
}
.primary-menu ul li a{display: block;
                    padding: 0 30px;
                    font-size: 18px;
                    line-height: 60px;
  }
 

.btn{
    padding: 10px 11px;
    display: inline-block;
    border:2px solid #16a085;
    margin: 20px 0;
    border-radius: 10px;
    color: #555;
    font-weight: 800;
}
.btn:hover {
    padding: 10px 11px;
    display: inline-block;
    background: #16a085;
    margin: 20px 0;
    border-radius: 10px;
    color: bisque;
    transition: 0.4s;
}
h4{
   
    padding: 50px;
    text-align: center;
   
   

}
/* middle section */

.middle-section{
    background-image: url('./img/contact-banner.jpg')  ;
    background-size: cover;
    padding: 100px 0;
    color: #fff;
    position: relative;
    z-index: 1;
    margin-top: 100px;
}
.middle-section::after{
    content:'';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.4);
    z-index: -1;
   
}
.middle-section h1 {
    font-size: 35px;
    margin: 14px 0;
    color: #fff;
}
.middle-section p {
    font-size: 18px;
    line-height: 30px;
}
.btn-class{
    padding: 10px 11px;
    display: inline-block;
    border:2px solid #16a085;
    margin: 20px 16px;
    border-radius: 10px;
    color: #fff;
    font-weight: 800;
}
.btn-class:hover {
    background: hsl(168, 28%, 28%);
    color: bisque;
    transition: 0.4s;
}

/* about */
.about-us{
    background-color: #ecf0f1;
    padding: 20px;
}
.about-title{
padding: 20px 0;
}
.about-title h1{
   font-size: 34px;
    padding: 10px 0;
}
.about-title p {
    margin: 10px;
    color: #032;
}
.service-part{
   
}
.box-part {
    width: 30%;
    box-shadow: rgb(0 0 0 / 40%) 4px 5px 15px 0px;
    box-sizing: border-box;
    padding: 31px 10px;
    margin: 8px 0;
    margin-left: 28px;
}
.icon-part {
    min-height: 100px;
    width: 20%;
    
    margin-top: 15px;
}
.icon-part a {
    font-size: 20px;
    color: #fff;
    background-color: #16a085;
    padding: 10px;
    border-radius: 20px;
}

.icon-text{
    margin-top: 15px; width: 80%;}
.icon-text span{

}
.icon-part img {
    height: 31px;
    background: burlywood;
    padding: 10px;
    border-radius: 26px;
    /* display: inline-block; */
}

.icon-text p {
        margin-top: 15px;
        line-height: 20px;
    }

.new-part{
    
    padding: 50px 0;
    background-color: #bdc3c7;
}
/* h4:hover {
    content: '';
    display: block;
    
    background-image: url('./img/contact-banner.jpg');
    padding: 200px;
    background-size: cover;
    background-repeat: no-repeat;
    opacity: 1;
   transition: 0.6s;
} */

.video{
    width: 45%;
   
}
.content-text{
    width: 50%;
    
}
.first-part {
    margin-bottom: 30px;
    padding: 10px 0;
    /* background: blanchedalmond; */
    border: 5px solid blanchedalmond;
    border-radius: 43px 0;
}

.line-height{
    line-height: 20px;
}
.content-text p{
   margin: 0 20px;
   line-height: 20px;
   
}
.content-text p::first-letter{
    color: red;
    font-size: 30px;
    text-transform: capitalize;
   
}

footer {
    background-color: #000;
    color: #fff;
    padding: 50px 0;
}
.contact-img{
    margin: 20px 0;
}