body {
    margin: 0;
    font-family: Arial
}


/*services*/
.list {
   
    position: absolute;
   
    left: 50%;
    transform: translate(-50%,-50%)
}

    .list .li {
        list-style-type: none;
        width: 200px;
        height: 200px;
        opacity: .25;
        position: absolute;
        left: 50%;
        margin-left: -100px;
        border-radius: 2px;
       transition: transform 1s, opacity 1s;
        background-image: url('../Image/slide-1.jpeg');
    }
  
    
    .list .act {
        opacity: 1;
    }

    .list .prev,
    .list .next {
        cursor: pointer;
    }

    .list .prev {
        transform: translateX(-220px) scale(.85);
    }

    .list .next {
        transform: translateX(220px) scale(.85);
    }

    .list .hide {
        transform: translateX(-420px) scale(.85);
    }

    .list .new-next {
        transform: translateX(420px) scale(.85);
    }

    .list .hide,
    .list .new-next {
        opacity: 0;
        transition: opacity .5s, transform .5s;
       
    }
/*socialMedia*/


.fa {
    padding: 15px;
    font-size: 20px;
    width: 50px;
    text-align: center;
    text-decoration: none;
    margin: 5px 2px;
    border-radius: 50%;
      background-color: #ffff;
}

    .fa:hover {
        color:#fff;
        background-color: #ffcc19;
    }
    
.fa-phone{
    color:black;
}
.fa-facebook {
   
    color: black;
}
.fa-instagram {
   
    color: black;
}
.fa-linkedin {
    
    color: black;
}
.fa-twitter {
   
    color: black;
}
.fa-home {
    padding: 5px;
    font-size: 15px;
    width:25px;
   
}

/*footer-form*/
.formbox{
    background-color:transparent;
    border-radius:10px;
    font-size:22px;
    border-color:#ffff;
}
.h1-f {
    font-size: xx-large;
    text-align: center;
    padding-top: 60px;
    margin-top: 0px;
    color: #fff
}

@media Screen and (min-width:1200px){
    .f-r-1{
        margin-left:5%;
        margin-right:5%;
    }
}
@media Screen and (min-width:980px){
    .f-r-1{
        margin-left:0px;
        margin-right:0px;
    }
}
@media Screen and (min-width:480px){
    .f-r-1{
        margin-left:0px;
        margin-right:0px;
    }
}

.foot-bg {
    
    background-image: url('../Image/footer-bg.jpg');
}
.col-r {
    margin-left: 100px;
    margin-right: 100px
}
.col-ft-text {
    text-align:center
}
.btn-f {
    border-radius: 12px;
    background-color: #ffcc19;
    font-size: 15px;
    padding: 5px;
    width: 100px;
    border: none;
    color:black;
}
.btn-f:hover{
    background-color:white;
    color:black;
}
.hr-f{
    background-color:#ffcc19;
    width:80%;
    border-color:#ffcc19
}
.rt-2{
    text-align:center;
    color:#fff
}
#rcorners2 {
    border-radius: 25px;
   margin-top:5px;
   margin-bottom:5px;
   
    background-color: #ffcc19;
}
/*Header*/
.imag-head{
    width:100%;
    height:400px;
    margin-top:8px;
}
/*Service *//* Create two equal columns that floats next to each other */
/* Create three equal columns that floats next to each other */
.column-s {
    float: left;
    width: 33.33%;
    padding: 10px;
    /* Should be removed. Only for demonstration */
}
.column-s a {
    color:black
}
.column-s li{
    margin-top:5%;
    margin-bottom:5%;
}
    .column-s a.active{
        color: black;
        border-bottom: 5px solid #ffcc19;
    }
    
/* Clear floats after the columns */
.row-s:after {
    content: "";
    display: table;
    clear: both;
}
.ab-home {
    margin-left: 250px;
    margin-right: 250px;
    align-content: center
}
/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {
    .column-s {
        width: 100%;
    }

    .sec {
        margin-left: 0px;
        margin-right: 0px;
        margin-top: 0px;
        margin-bottom: 0px
    }

    .sec-2 {
        margin-left: 0px;
        margin-right: 0px;
        margin-top: 0px;
        margin-bottom: 0px
    }

    
}
@media screen and (min-width:600px){
    .sec {
        margin-left: 10px;
        margin-right: 10px;
        margin-top: 0px;
        margin-bottom: 0px
    }

    .sec-2 {
        margin-left: 10px;
        margin-right: 10px;
        margin-top: 0px;
        margin-bottom: 0px
    }
    .ab-home{
        margin-left:0px;
        margin-right:0px;
    }
}

.row-a2 {
    margin-left: 100px;
    margin-right: 100px
}
@media screen and (min-width:450px) {
    .sec {
        margin-left: 10px;
        margin-right: 10px;
        margin-top: 0px;
        margin-bottom: 0px
    }
    .row-a2{
        margin-left:0px;
        margin-right:0px
    }
    .sec-2 {
        margin-left: 10px;
        margin-right: 10px;
        margin-top: 0px;
        margin-bottom: 0px
    }
    .ab-home {
        margin-left: 0px;
        margin-right: 0px;
    }
}
@media screen and (min-width:350px) {
    

    .row-a2 {
        margin-left: 0px;
        margin-right: 0px
    }

  

    .ab-home {
        margin-left: 0px;
        margin-right: 0px;
    }
}
@media screen and (min-width:980px) {
    .sec {
        margin-left: 10px;
        margin-right: 10px;
        margin-top: 0px;
        margin-bottom: 0px
    }

    .sec-2 {
        margin-left: 10px;
        margin-right: 10px;
        margin-top: 0px;
        margin-bottom: 0px
    }
    .ab-home {
        margin-left: 5px;
        margin-right: 5px;
      
    }
}


@media screen and (min-width:1000px) {
 .ab-home{
        margin-left:50px;
        margin-right:170px;
    }
    
}
@media Screen and (max-width:1200){
    .ab-home{
        margin-left:2.5%;
        margin-right:2.5%
    }
}
@media screen and (min-width:1200px) {
    .sec {
        margin-left: 5%;
        margin-right: 5%;
        margin-top: 0px;
        margin-bottom: 0px
    }

    .sec-2 {
        margin-left: 5%;
        margin-right: 5%;
        margin-top: 0px;
        margin-bottom: 0px
    }
    .ab-home {
        margin-left: 60px;
        margin-right: 60px;
        align-content: center
    }
}
.sec {
    margin-left: 5%;
    margin-bottom: 0px;
    margin-top: 0px;
    margin-right: 5%;
}
.sec-2 {
    margin-left: 10%;
    margin-right: 10%;
    background-color: white;
    padding-bottom: 100px;
    padding-top: 60px
}
.dropdown {
    
    display: inline-block;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #00000080;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    padding: 12px 16px;
    z-index: 1;
}

.dropdown:hover .dropdown-content {
    display: block;
}