*{font-family: "Open Sans", sans-serif; margin: 0px;}
body{background-color:rgba(236, 228, 215, 0.6);}
.nav1{position: sticky; top: 0; background-color:#664e32; z-index: 1;}
.row1 .col-md-3{height: 80px; background-color:#664e32}
.row1 .col-md-3 h3{ font-weight: 600; color: white; }
.row1 .col-md-9{padding-right: 150px;height: 80px;  background-color:#664e32; gap: 10px;}
.row1 .col-md-9 button{background-color:rgba(236, 228, 215, 0.6); color: black; font-size: 14px;  border: none;box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;font-weight: 400;}
.row1 .col-md-9 button:hover{ font-size: 14px; 
    border: none;box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;font-weight: 500;
    border-radius: 50px 15px;}
.row2{margin-top: 100px;} 
/* .row2 .col-md-6{ height: 400px;} */
.row2 .col-md-6 {
    padding: 0px 125px;
}
.row2 .col-md-6 img{ height: 400px; width:400px; border-radius: 50%; border: 5px solid rgba(102, 78, 50,0.4); padding: 5px; background-color: white;}
.row2 .col-md-6 p{ text-align: center; font-weight: 400;}
.row2 .col-md-6 span{font-size: 30px; font-weight: 600;}
.row2 .col-md-6 .infobtn{ position: absolute; margin-top: 150px;}
.row2 .col-md-6 .text{ display: block; margin-left: 28px;}
.row2 .col-md-6 .infobtn .btn1{  border: 2px solid black; border-radius: 15px; font-size: 13px; color: #664e32;
    font-weight: 400; box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
}
.row2 .col-md-6 .infobtn .btn1:hover{
    border: 2px solid black; border-radius: 15px; font-size: 13px; color: white;
    font-weight: 400; box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px; background-color: #664e32; 
}
.row2 .col-md-6 .infobtn .btn2{
    border: 2px solid black; border-radius: 15px; 
    color: #664e32; font-size: 13px; box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
    font-weight: 400; 
}
.row2 .col-md-6 .infobtn .btn2 a{
   text-decoration: none; color: #664e32;
}
.row2 .col-md-6 .infobtn .btn2 a:hover{
   text-decoration: none; color: white;
}
.row2 .col-md-6 .infobtn .btn2:hover{
    border: 2px solid black; border-radius: 15px; background-color: #664e32;
    color: white; font-size: 13px; box-shadow: rgba(247, 245, 245, 0.24) 0px 3px 8px;
}
.row3{
    margin-top: 50px; 
}
.row3 .col1{
    padding: 15px; height: 300px; width:550px; 
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;margin-right: 25px;
}
.row3 .col1 .abtbtn{
    height: 40px; width: 40px; border-radius: 50%; border: 1px solid black; margin-left: 280px; background-color: transparent; box-shadow: none;
}
.row3 .col1 .abtbtn:hover{
    height: 40px; width: 40px; border-radius: 50%; border: 1px solid white; margin-left: 280px; background-color: transparent; box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
   
}
.row3 .col1 .abtbtn i{
    font-size: 21px; color: #664e32;justify-content: center; display: flex;
}
.row3 .col1 h6{
    margin-left: 340px; margin-top: -30px; font-size: 13px; font-weight: 400;
}
.row3 .col-md-6 p{
    text-align: justify;
}
.row3 .col2 img{
    height: 300px; width: 550px;
}
.row3 .col2{
    padding: 15px; height: 300px; width:550px; 
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
}
.row4 img{
    height: 90px; width: 90px; border-radius: 50%; box-shadow: rgba(0, 0, 0, 0.9) 0px 4px 12px; 
}
.row4 .col-md-8 p{
   width: 600px; text-align: justify; font-size: 14px; font-weight: 400; 
}
.row5 .col-md-8 p{
   width: 600px; text-align: justify; font-size: 14px; font-weight: 400; 
}
.row6 .col-md-8 p{
   width: 600px; text-align: justify; font-size: 14px; font-weight: 400; 
}
.row5 img{
    height: 90px; width: 90px; border-radius: 50%; box-shadow: rgba(0, 0, 0, 0.9) 0px 4px 12px; 
}
.row6 img{
    height: 90px; width: 90px; border-radius: 50%; box-shadow: rgba(0, 0, 0, 0.9) 0px 4px 12px; 
}
.row7 .progress-bar {
    background-color: #664e32; width: 650px; border-radius: 8px;
}
.row7 .progress{
    width: 100%; background-color: #e0d5c7; border-radius: 8px;
}
.row7 .skillbar{
    width: 51%; display: flex; margin-left: 50px; margin-top: 25px;
}
.row7 .skillbar p{
    font-size: 14px; font-weight: 600;
}
.row8 .col-md-1{
     writing-mode: vertical-rl; transform: rotate(180deg);
    height: 200px; 
}
.row8 .col-md-6{
     flex-direction: column; height: 200px; 
}
.row8 .col-md-5{
     height: 200px;
}
.row8{
    margin-top: 20px; background-color: #664e32; color: white; border-radius: 15px;
    
}
.row8 .col-md-6 .adbox{
    width: 300px; 
}
.row8 .col-md-6 .adbox i{
    padding-right: 10px; color: white;
}
.row8 .col-md-6 h6{
    font-weight: 600;
}
.row8 .col-md-6 p{
    font-weight: 500; font-size: 13px; 
}
.row8 .col-md-5 i{
    padding-right: 5px;
}
a{
    text-decoration: none; color: white;
}
a:hover{
    text-decoration: none; color: white;
}
.row10{
    width: 65%;  
}
.row10 .col-md-4{
      width:380px; 
}
.col-md-4 .card{
    padding:10px; overflow: hidden; box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px; background-color:rgba(236, 228, 215, 0.6); 
}
.col-md-4 .card img{
    border-radius:8px; transition: 0.4s all ease-in-out;
}
.col-md-4 .card img:hover{transition: 0.4s all ease-in-out; transform: scale(1.2); }

.card .card-title{margin-top: 10px; font-weight:800; color: #664e32;  text-transform: uppercase;}
.card .card-text{text-align: justify; color: #664e32;}




@media only screen and (min-width:1023px) and (max-width:1366px) {
    .row2 .col1{
        display: flex ; align-items: center ;  justify-content:start!important; 

    }
    .row2 .col2{
        display: flex ; align-items: center ;  justify-content:start !important; 
    }
    .row3 .col2 img{
        height: 300px; width: 550px; 
    }
    .row3 .col2{
        margin-top: 15px; height: 300px; width:550px; 
        box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
    }
    .row3 .col1{
        height: 300px; width:550px; 
        box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px; margin-left: 21px;
    }

}


@media only screen and (min-width:531px) and (max-width:1022px){
    .row1 .col-md-3{
         display: flex !important; align-items: center !important; justify-content: center !important;
    }
    .row1 .col-md-9{
        display: flex; align-items: center; justify-content: center !important; padding-right: 0px;
    }
    .row2{
        margin-top: 40px;
    }
    .row2 .col1{
        display: flex ; align-items: center ;  justify-content: center !important; width:100%; 
    }
    .row2 .col2{
        display: flex ; align-items: center ;  justify-content: center !important; width:100%;
    }
   
    .row2 .col-md-6 img{ 
        height: 300px; width:300px; border-radius: 50%; border: 5px solid rgba(102, 78, 50,0.4); padding: 5px; background-color: white; 
        
    }
    

    .row2 .col-md-6 p{  text-align: center; font-weight: 400; margin-top: 15px;}
    .row2 .col-md-6 span{font-size: 30px; font-weight: 600;}
    .row2 .col-md-6 .infobtn{ position: absolute; margin-top: 150px;}
    .row2 .col-md-6 .text{ display: block; margin-left: 0px;}
    .row2 .col-md-6 .infobtn .btn1{  border: 2px solid black; border-radius: 15px; font-size: 13px; color: #664e32;font-weight: 400; box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;}
    .row3{
        margin-top: 50px; 
    }
    .row3 .col1{
        padding: 10px; height: 300px; width:480px; 
        box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;margin-right: 0px;
    }
    .row3 .col1 .abtbtn{
        height: 40px; width: 40px; border-radius: 50%; border: 1px solid black; margin-left: 280px; background-color: transparent; box-shadow: none;
    }
    .row3 .col2{
        padding: 15px; height: 300px; width:480px; margin-top: 15px;
        box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
    }
    .row3 .col2 img{
        height: 300px; width: 480px;
    }
    .row4 .col-md-4{
        display: flex; align-items: center; justify-content: center !important;
    }
    .row4 .col-md-4 img{
        height: 90px; width: 90px; border-radius: 50%; box-shadow: rgba(0, 0, 0, 0.9) 0px 4px 12px; 
    }
    .row4 .col-md-8{
        display: flex; align-items: center; justify-content: center !important; margin-top: 15px;
    }
    .row4 .col-md-8 p{
       width: 480px; text-align: justify; font-size: 14px; font-weight: 400;  
    }
    .row5 .col-md-4{
        display: flex; align-items: center; justify-content: center !important;
    }
    .row5 .col-md-8{
        display: flex; align-items: center; justify-content: center !important; margin-top: 15px;
    }
    .row5 .col-md-8 p{
       width: 480px; text-align: justify; font-size: 14px; font-weight: 400; 
    }
   
    .row6 .col-md-4{
        display: flex; align-items: center; justify-content: center !important;
    }
    .row6 .col-md-8{
        display: flex; align-items: center; justify-content: center !important; margin-top: 15px;
    }
    .row6 .col-md-8 p{
        width: 480px; text-align: justify; font-size: 14px; font-weight: 400; 
     }
     .row8 .col-md-1{
        writing-mode: vertical-rl; transform: rotate(270deg); 
       height: 150px; 
       @media only screen and (min-width:768px) and (max-width:1022px){
        transform: rotate(180deg);
       }
   }
   .row8 .col-md-5 p{
    margin-right: 200px;
   }
   .row10 .col-md-4{
    width:100%; 
}
.row10{
    width:75%;  
}
.col-md-4 .card img{
    border-radius:8px; transition: 0.5s all ease-in-out;
}
.col-md-4 .card img:hover{transition: 0.5s all ease-in-out; transform: scale(1.2); }
.card{margin-top: 15px;}
}

@media only screen and (min-width:300px) and (max-width:530px) {
    .row1 .col-md-3{
         display: flex !important; align-items: center !important; justify-content: center !important;
    }
    .row1 .col-md-9{
        display: flex; align-items: center; justify-content: center !important; padding-right: 0px; 
    }
    .row2{
        margin-top: 40px;
    }
    .row2 .col-md-6{
        display: flex ; align-items: center ;  justify-content: center !important;
        margin-left: 0px;
    }
    .row2 .col-md-6 .col2{
        display: flex ; align-items: center ;  justify-content: center!important;
        
    }
   
    .row2 .col-md-6 img{ 
        height: 250px; width:250px; border-radius: 50%; border: 5px solid rgba(102, 78, 50,0.4); padding: 5px; background-color: white; 
    }

    .row2 .col-md-6 p{ margin-left: 0px; text-align: center; font-weight: 400; margin-top: 15px;}
    .row2 .col-md-6 span{font-size: 25px; font-weight: 600;}
    .row2 .col-md-6 .infobtn{ margin-left: 0px; position: absolute; margin-top: 150px;}
    .row2 .col-md-6 .text{ display: block; margin-left: 0px;}
    .row2 .col-md-6 .infobtn .btn1{  border: 2px solid black; border-radius: 15px; font-size: 13px; color: #664e32;font-weight: 400; box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;}
    .row3{
        margin-top: 50px; 
    }
    .row3 .col1{
        padding: 10px; height: 380px; width:350px; 
        box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px; margin-right: 0px;
    }
    .row3 .col1 .abtbtn{
        height: 40px; width: 40px; border-radius: 50%; border: 1px solid black; margin-left: 180px; background-color: transparent; box-shadow: none;
    }
    .row3 .col1 .abtbtn:hover{
        height: 40px; width: 40px; border-radius: 50%; border: 1px solid white;
         margin-left: 180px; background-color: transparent; 
        box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
    }
    .row3 .col1 h6{
        margin-left: 240px; margin-top: -30px; font-size: 13px; font-weight: 400;
    }
    .row3 .col2{
        padding: 0px; height: 210px; width:350px; margin-top: 15px;
        box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
    }
    .row3 .col2 img{
        height: 210px; width:350px;
    }
    .row4 .col-md-4{
        display: flex; align-items: center; justify-content: center !important;
    }
    .row4 .col-md-4 img{
        height: 90px; width: 90px; border-radius: 50%; box-shadow: rgba(0, 0, 0, 0.9) 0px 4px 12px; 
    }
    .row4 .col-md-8{
        display: flex; align-items: center; justify-content: center !important; margin-top: 15px;
    }
    .row4 .col-md-8 p{
       width: 320px; text-align: justify; font-size: 14px; font-weight: 400;  
    }
    .row5 .col-md-4{
        display: flex; align-items: center; justify-content: center !important;
    }
    .row5 .col-md-8{
        display: flex; align-items: center; justify-content: center !important; margin-top: 15px;
    }
    .row5 .col-md-8 p{
       width: 320px; text-align: justify; font-size: 14px; font-weight: 400; 
    }
   
    .row6 .col-md-4{
        display: flex; align-items: center; justify-content: center !important;
    }
    .row6 .col-md-8{
        display: flex; align-items: center; justify-content: center !important; margin-top: 15px;
    }
    .row6 .col-md-8 p{
        width: 320px; text-align: justify; font-size: 14px; font-weight: 400; 
     }
     .row8 .col-md-1{
        writing-mode: vertical-rl; transform: rotate(270deg); 
       height: 150px; 
   }
   .row8 .col-md-5 p{
    margin-right: 200px;
   }
   .row10 .col-md-4{
    width:100%; 
}
.row10{
    width:100%;  
}
.card{margin-top: 15px;}
}