*{
    margin: 0;
    padding: 0;
}

body{

    background: url("../homeimages/background.jfif");
    background-size:cover;
    background-attachment: fixed;
}

.head{
    position:absolute;
    top: 0;
    background-color: rgba(40, 97, 119, 0.993);
    height:120px;
    width: 100%;
    opacity: 0.8;
    position: fixed;
    z-index: 1;
}
.links{
 
    left: 900px;
    top:30px;
    position: absolute;
    z-index: 1;
    position: fixed;
}

.links a{

    padding-right: 20px;
    text-decoration: none;
    font-size: 22px;
    font-weight: 400;
    color: blanchedalmond;
   
}
.logo img{

    height: 120px;
    width:150px;
    left :0px;
    top:0px;
    position: absolute;
    z-index: 1;
    position: fixed;
}

.carouselhome{

    position: absolute;
    width:100%;
    top: 0;
}

.carouselhome img{

height: 500px;
width: 100%;
}

.cardgroup{

    position: absolute;
    top: 1600px;
    left: 100px;
    
}

.lbl{

    position: absolute;
    top: 450px;
    
    
}

.lbl label{
float: left;
width: 300px;
color: blue;
    font-weight: 700;
    font-size: 20px;
    background-color: rgba(94, 96, 201, 0.623);
    
}

.card{

    float: left;
    

}

#free{

    position: absolute;
    top: 0px;
}
.card:hover{

    transform: scale(1.1); 
}

video{

    position: absolute;
    top: 1700px;
}

.explore{
    position: absolute;
    top: 590px;
    left: 100px;
    right: 150px;

}

.vid{

    position: absolute;
    top: 2200px;
    left: 100px;
}



.row1{
    position: absolute;
    top: 3000px;
    left:100px;
    width:600px;
    height: 1080px;
    border-right: darkblue solid 3px;
}


.row1 #imgq1{
    float: right;
    position: relative;
    top: 0px;
    left:20px;
}

.row1 #q1{

    position: relative;
    top: 30px;
}

.row1 #imgq2{
    float: left;
    position: relative;
    top: 20px;
    
}

.row1 #q2{

    position: relative;
    top: 30px;
}

.row1 #imgq3{
    float: right;
    position: relative;
    top: 20px;
    
}

.row1 #q3{

    position: relative;
    top: 30px;
}




.row2{
    position: absolute;
    top: 3000px;
    left:700px;
    width:700px;
    height: 1080px;
    border-left: rgb(1, 1, 10) 1px solid;
}

.row2 #img1{
    float: right;
    position: relative;
    top: 20px;
    left:20px;
}

.row2 #p1{

    position: relative;
    top: 30px;
}

.row2 #img2{
    float: left;
    position: relative;
    top: 20px;
    
}

.row2 #p2{

    position: relative;
    top: 30px;
}

.row2 #img3{
    float: right;
    position: relative;
    top: 20px;
    
}

.row2 #p3{

    position: relative;
    top: 30px;
}

footer{
background-color: rgba(204, 164, 89, 0.699);
    color: white;
    text-align: center;
    position: absolute;
    top: 4200px;
    width: 100%;
    height: 150px;
}


footer i{
    font-size: 40px;
    

}

.fa-facebook-square{
    background:white;
     /* color:rgb(13, 13, 196);*/
     color: rgb(22, 19, 185);  
  }

  .fa-twitter-square{

    background-color: blanchedalmond;
    color: rgb(52, 111, 221);
  }

  .fa-youtube{
      background-color: red;
      color: white;

  }

.fa-whatsapp-square{
    background-color: white;
    color: green;
}

  .fa-instagram-square{
      background-color: white;
      color: rgb(97, 74, 97);
  }
  .fa-linkedin
  {
      background-color: white;
      color: blue;

  }

  .fa-pinterest{
      background-color: red;
      color: white;
  }

  @media screen and (max-width: 1200px){

    footer{

        width:100%;
        overflow-y: auto;
    
    }
}



@media screen and (max-width: 900px){
    


    .cardgroup{
display: none;

    }

    .row1{
        display: none;        
    }

    .row2{
        display: none;
    }
}

@media screen and (max-width: 800px){

    .vid{
        display: none;
    }
}