*{
    margin: 0;
    padding: 0;
}
.main_div{
    /* border: 1px solid red; */
    /* background-color: white; */
    background-color: #010916;
}
/* ............................................................................................................... */
/*nav bar*/
.nav_main{
    /* border: 1px solid rgb(132, 236, 118); */
    /* background-color: #0A182E; */
    display: flex;
    justify-content: space-between;
    
}
.left_nav{
    
    margin: 0px 30px;
}
.what{
    color: white;
    font-family: cursive;
    font-weight: bold;
    font-size: 22px;
    padding: 5px 10px;
}
.what span{
    color:#0099E1;
    
}
.right_nav{
    /* border: 1px solid yellow; */
    display:flex;
    justify-content: space-evenly;
    padding: 0px 10px;
    align-items: center;
    margin: 0px 20px;
}
.list{
    /* border: 1px solid paleturquoise; */
  
}
.list ul{
    display: flex;

    
}
.list ul li{
    list-style: none;
    color: white;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    padding: 10px 8px;
    font-size: 16px;
    /* border: 1px solid red; */
}
.hire_me{
    height: 4vh;
    border: none;
    background-color:#010916;
    border: 1px solid rgba(255, 255, 255, 0.342);
    color: white;
    padding: 2px 8px;
    border-radius: 30px 10px;
    font-family: calibri;
    font-size: 15px;
    margin: 0px 15px;
}
.download_cv{
    height: 4vh;
    border: none;
    background-color:#010916 ;
    border: 1px solid rgba(255, 255, 255, 0.342);
    color: white;
    padding: 2px 8px;
    border-radius: 30px 10px;
    font-family: calibri;
    font-size: 15px;
    /* margin: 0px 0px; */
}
/* ................................................................................................................. */
.second_section{
    /* background-color: #0A182E; */
    /* padding:30px 50px ; */
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 40px;
    width: 63vw;
    padding: 28px 0px;
    margin: auto;
 
    /* justify-content: space-between; */
    /* border: 1px solid yellow; */
}
.left_second_section{
    /* border: 1px solid red; */
    width: 250px;
    /* margin:30px 120px; */
}
.img{
    /* border: 1px solid yellow; */
    width: 250px;
    height: 300px;
    border-radius: 50% 10% 50% 10%/10% 50% 10% 50%;
    /* border-radius: 50%; */
   box-shadow: 1px 1px 10px #0099E1; 

}

.img img{
    /* width: 450px;
    height:300px;  */
    width: 100%;
    height: 100%;
    border-radius: 50% 10% 50% 10%/10% 50% 10% 50%;


    /* border-radius: 50%; */
    /* align-items: center; */
    /* margin: 0px 15px; */
    /* filter: drop-shadow(1px 1px  5px#0099E1); */
}
.right_second_section{
 
    /* border: 1px solid yellow; */
    margin-left: 100px;
}
.hello{
    width: 18vw;
    font-family: calibri;
    color: white;
    font-size: 30px;
    /* margin: 2px 2px; */
    /* border: 1px solid red; */
}
.name{
    width: 30vw;
    font-family:Lucida Sans;
    font-size: 35px;
    color: white;
    /* border: 1px solid red; */
    /* margin: 2px 2px; */
}

.i-am{
  font-family:calibri;
    font-size: 28px;
    color: white;  
    font-weight: bold;
    /* border: 1px solid red; */
width: 30vw;
    margin: 2px 2px;
}
.i-am span{
    color: #0099E1;


}
.paragraph{
    font-family: calibri;
    color: rgba(255, 255, 255, 0.74);
    /* border: 1px solid red; */
    font-size: 17px;
    width: 30vw;
    margin: 2px 2px;

}
.four_icon{
    display: inline-flex;
    margin: 2px 2px;

}
.facebook{
    border: 2px solid #0099E1;
padding: 5px 5px;
border-radius: 50%;
}
.facebook i{
    color: #0099E1;
}
.instagram{
    border: 2px solid #0099E1;
padding: 5px 5px;
border-radius: 50%;
margin-left: 5px;
}
.instagram i{
    color: #0099E1;
}
.link{
    border: 2px solid #0099E1;
padding: 5px 5px;
border-radius: 50%;
margin-left: 5px;

}
.link i{
    color: #0099E1;
}
.twiter{
    border: 2px solid #0099E1;
padding: 5px 5px;
border-radius: 50%;
margin-left: 5px;

}
.twiter i{
    color: #0099E1;
}
.get{
    margin:  15px 0px;
}
.get_in_touch{
    background-color: #010916;
    color: white;
    border: none;
    padding: 6px 8px;
    border-radius: 10px 10px;
    font-family: calibri;
    border: 1px solid rgba(255, 255, 255, 0.342);

}
/* ................................................................................................................ */
.about_section{
    /* border: 1px solid yellow; */
    /* margin-top: 10px; */
}
.a_bit{
    font-family: calibri;
    color: white;
    /* border: 1px solid red; */
    text-align: center;
    width: 8.5vw;
    margin: auto;
padding: 5px 8px;
border-radius: 5px 5px;
box-shadow: 1px 1px 3px #0099E1;
}

.who{
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    color: #0099E1;
    font-size: 38px;
    text-align: center;
    margin-top: 20px;
    /* border: 1px solid red; */
}
.my_text{
    /* border: 1px solid red; */
    font-family: calibri;
        color: rgba(255, 255, 255, 0.74);
    /* border: 1px solid red; */
    font-size: 17px;
    width: 80vw;
  margin: auto;
  margin-top: 10px;

}
.full_main{
    /* border: 1px solid red; */
margin-top: 20px;
display: flex;
}
.left_div{
    /* background-image: url(back5.webp);
    background-size: cover; */
    background-color:#010916;
    width: 22vw;
    box-shadow: 1px 1px 7px  rgba(212, 205, 205, 0.26);
    /* height: 90vh; */
    padding: 30px 0px;
    margin: 2% 0%;
    margin-left: 7%;
    /* border: 1px solid red; */
}
.left_image{
    /* border: 1px solid red; */
    width: 200px;
    height: 200px;
    border-radius: 50%;
    overflow: hidden;
    margin: auto;
    box-shadow: 1px 1px 7px #0099E1;
  
}
.left_image:hover{
    box-shadow: 1px 1px 30px #0099E1;
    transition: 0.2s;
}

.left_image img{
    width: 100%;
    height: 100%;
    /* width: 300px;
    height: 200px; */
    margin: 0px 20px 0px 0px;
}
.sharing{
    /* border: 1px solid red; */
    font-size: 30px;
    font-family: calibri;
    color: white;
    margin-top: 10px;
}
.text1{
    text-align: center;
    font-size: 30px;
    font-family: calibri;
    color: white;
    /* border: 1px solid green; */
}
.learn{

    border: none;
    border: 1px solid rgba(255, 255, 255, 0.342);
    background-color: #010916;
    color: white;
    font-size: 10px;
    padding: 10px 10px;
    letter-spacing: 2px;
    margin: 20px 90px;

}
.middle_div{
    /* border: 1px solid rgb(172, 233, 4); */
    /* display: flex; */
    margin-top: 2%;
    /* padding: 0px 20px; */
}
.middle1{
    display: flex;
    /* border: 1px solid red; */
    /* padding: 0px 0px; */
    /* margin: 20px 0px; */
}
.middle2{
    display: flex;
    margin-top: 35px;
  /* margin: 30px 0px; */
}
.sub_middle1{
    /* border: 1px solid yellow; */
    width: 12vw;
    /* height: 35vh; */
    background-color: rgba(255, 255, 255, 0.795);
    /* box-shadow: 1px 1px 7px #0099E1; */
    margin-left: 30px;
}
.graphic_icon{
    margin-top: 30px;
    margin-left: 10px;
    /* border: 1px solid red; */
}
.graphic_icon i{
    color:#C5861C; 
 font-size: 40px;
}
.graphic_text{
    font-family: calibri;
    /* border: 1px solid yellow; */
    font-size: 25px;
    margin-top: 15px;
    margin-left: 10px;

}
.more{
    /* border: 1px solid red; */
    font-family: calibri;
    margin-top: 5px;
    margin-left: 10px;
   color: rgb(14, 11, 11);
    /* font-weight: bold; */
}
.sub_middle1 .border_bottom{
    width: 3vw;
    height: 0.3vh;
    background-color: rgb(14, 11, 11);
    margin-left: 10px;
}
.sub_middle1 .last_border1{
    background-color: #C5861C;
    width: 12vw;
    height: 1vh;
    margin-top: 49px;
}


.design_icon{
    margin-top: 30px;
    margin-left: 10px;
    /* border: 1px solid red; */
}
.design_icon i{
    color:#0A9DA3; 
 font-size: 40px;
}
.design_text{
    font-family: calibri;
    /* border: 1px solid yellow; */
    font-size: 25px;
    margin-top: 15px;
    margin-left: 10px;

}
.more{
    /* border: 1px solid red; */
    font-family: calibri;
    margin-top: 5px;
    margin-left: 10px;
   color: rgb(14, 11, 11);
    /* font-weight: bold; */
}
.sub_middle1 .border_bottom{
    width: 3vw;
    height: 0.3vh;
    background-color: rgb(14, 11, 11);
    margin-left: 10px;
}
.sub_middle1 .last_border2{
    background-color:#0A9DA3;
    width: 12vw;
    height: 1vh;
    margin-top: 49px;
}
.software_icon{
    margin-top: 30px;
    margin-left: 10px;
    /* border: 1px solid red; */
}
.software_icon i{
    color:#154D8B; 
 font-size: 40px;
}
.software_text{
    font-family: calibri;
    /* border: 1px solid yellow; */
    font-size: 25px;
    margin-top: 15px;
    margin-left: 10px;

}
.more{
    /* border: 1px solid red; */
    font-family: calibri;
    margin-top: 5px;
    margin-left: 10px;
   color: rgb(14, 11, 11);
    /* font-weight: bold; */
}
.sub_middle1 .border_bottom{
    width: 3vw;
    height: 0.3vh;
    background-color: rgb(14, 11, 11);
    margin-left: 10px;
}
.sub_middle1 .last_border3{
    background-color: #154D8B;
    width: 12vw;
    height: 1vh;
    margin-top: 48px;
}
.application_icon{
    margin-top: 30px;
    margin-left: 10px;
    /* border: 1px solid red; */
}
.application_icon i{
    color:#3b074e; 
 font-size: 40px;
}
.application_text{
    font-family: calibri;
    /* border: 1px solid yellow; */
    font-size: 25px;
    margin-top: 15px;
    margin-left: 10px;

}
.more{
    /* border: 1px solid red; */
    font-family: calibri;
    margin-top: 5px;
    margin-left: 10px;
   color: rgb(14, 11, 11);
    /* font-weight: bold; */
}
.sub_middle1 .border_bottom{
    width: 3vw;
    height: 0.3vh;
    background-color: rgb(14, 11, 11);
    margin-left: 10px;
}
.sub_middle1 .last_border4{
    background-color: #3b074e;
    width: 12vw;
    height: 1vh;
    margin-top: 48px;
}
.right_div{
    /* border: 1px solid red; */
    margin-left: 30px;
    width: 32vw;
}
.row1{
    /* border: 1px solid rgb(229, 255, 0); */
    display: flex;
    justify-content: space-between;
    margin-top: 32px;
}
.number1{
    /* border:1px solid pink; */
    font-family: Lucida Handwriting;
    color: #0099E1;
    font-size: 50px;
}
.two_text{
    /* border: 1px solid green; */
    /* margin-left: 10px; */
}
.heading{
    /* border: 1px solid wheat; */
    font-family: calibri;
    color: white;
    font-size:20px;
 
}
.para1{
    /* border: 1px solid red; */
     font-family: calibri;
    color: rgba(255, 255, 255, 0.473);
    font-size: 15px;

}

.para2{
    /* border: 1px solid red; */
     font-family: calibri;
color: rgba(255, 255, 255, 0.473); 
    font-size: 15px;
}
/* ..................................................................... */
/*skill section*/
.skill_main{
    /* border: 1px solid red; */
    margin-top: -20px;
}
.my_skills{
       font-family: calibri;
    color: white;
    /* border: 1px solid red; */
    text-align: center;
    width: 4.5vw;
    margin: auto;
padding: 5px 10px;
border-radius: 5px 5px;
box-shadow: 1px 1px 3px #0099E1; 
}
.two_skills{
    width: 85vw;
    /* border: 1px solid red; */
    display: flex;
    margin: auto;
    /* margin-top: 20px; */
    padding:20px 0px ;
    justify-content: space-between;
}
.design_skills{
    width: 40vw;
    /* height: 28vh; */
    box-shadow: 1px 1px 7px  rgba(212, 205, 205, 0.26);
    padding: 5px 8px;
    /* border: 1px solid green; */
}
.development_skills{
    width: 40vw;
    /* height: 28vh; */
    box-shadow: 1px 1px 7px  rgba(212, 205, 205, 0.26);
padding: 5px 5px;
    /* border: 1px solid green; */
}
.development_skill_heading{
    /* border: 1px solid red; */
    font-family: calibri;
    color: white;
    font-size: 20px;
    margin: 5PX 0PX;
}
.design_skill_heading{
    /* border: 1px solid red; */
    font-family: calibri;
    color: white;
    font-size: 20px;
    margin: 5PX 0PX;
}
.photoshop{
    /* border: 1px solid green; */
    font-family: calibri;
    color: rgba(255, 255, 255, 0.582);
    font-size: 15px;
}
.percentage{
    float: right;
    font-family: calibri;
    color: white;
}
progress{
/* color: #fd09b4; */
width: 100%;
margin: 3px 0px;
/* box-shadow: 1px 1px 1px gray; */
/* background-color:#323232 ; */
}
/*project section*/
.service_main{
    /* border: 1px solid green; */
    margin-top: 8px;
}
.my_services{
           font-family: calibri;
    color: white;
    /* border: 1px solid red; */
    text-align: center;
    width: 6.2vw;
    margin: auto;
padding: 5px 10px;
border-radius: 5px 5px;
box-shadow: 1px 1px 3px #0099E1; 

}
.service_four_main{
    width: 85vw;
    /* border: 1px solid red; */
    margin: auto;
    display: flex;
    /* margin-top: 10px; */
    padding: 15px 0px;
    justify-content: space-between;
}
.service1{
    width: 42vw;
    /* height: 30vh; */
    /* border: 1px solid red; */
}
.project_row1{
    /* border: 1px solid yellow; */
    display: flex;
    padding: 10px 10px;
    justify-content: space-between;
}
.project_img{
width: 7vw;
height: 12vh;
/* border: 1px solid pink; */
border-radius: 10px 10px;
}
.project_img img{
    width: 100%;
    height: 100%;
    border-radius: 10px 10px;
}
.about_project{
    /* border: 1px solid green; */
    width: 30.5vw;
}
.project_name{
    font-family: calibri;
    font-style: italic;
    color: white;
    font-size: 20px;
text-align: right;
    width: 30.5vw;
    /* border: 1px solid red; */
}
.project_name1{
        font-family: calibri;
    font-style: italic;
    color: white;
    font-size: 20px;
text-align:left;
    width: 30.5vw;
}
.project_text{
     width: 30.5vw;
       /* border: 1px solid red; */
          color: rgba(255, 255, 255, 0.507);
             font-family: calibri;
margin-top: 3px;

}
.project_text1{
         width: 30.5vw;
       /* border: 1px solid red; */
          color: rgba(255, 255, 255, 0.507);
             font-family: calibri;
margin-top: 3px;
margin-left: 18px;

}
.industry_name{
       font-family: calibri;
          color: rgba(255, 255, 255, 0.507);
margin-top: 3px;

text-align: right;
    width: 30.5vw;
    /* border: 1px solid red;  */
}
.industry_name1{
       font-family: calibri;
          color: rgba(255, 255, 255, 0.507);
margin-top: 3px;

text-align:left;
    width: 30.5vw;
    /* border: 1px solid red;  */
}
.service2{
     width: 42vw;
    /* height: 30vh; */
    /* border: 1px solid red;  */
}
/* ............................................................. */
/*experience section*/
.experience_main{
    /* border: 1px solid rgb(14, 243, 212); */
}
.my_experience{
        font-family: calibri;
    color: white;
    /* border: 1px solid red; */
    text-align: center;
    width: 7.5vw;
    margin: auto;
padding: 5px 2px;
border-radius: 5px 5px;
box-shadow: 1px 1px 3px #0099E1;    
}
.my_experience_two_section{
    /* border: 1px solid rgb(114, 228, 8); */
     width: 85vw;
     margin: auto;
     display: flex;
     justify-content: space-between;
     margin-top: 20px;
}
.my_experience_1st_section{
    /* border: 1px solid rgb(121, 45, 1); */
       width: 42vw;
     
}
.education{
    /* border: 1px solid rgb(240, 255, 33); */
    font-family: calibri;
    color: white;
    font-size: 20px;
    margin-left: 38px;
   
}
.my_experience_1st_main_section{
    /* border: 1px solid rgb(236, 8, 8); */
       /* width: 41vw; */
       display: flex;
       justify-content: space-evenly;

}
.long_border{
    /* border: 1px solid red; */
    width: 0.2vw;
    /* height: 30vh; */
    background-color: #0099E1;
    margin-top: 16px;
    position: relative;
    border-radius: 2px;
}
.circle1{
    width: 13px;
    height: 13px;
    background-color: #0099E1;
    border-radius: 50%;
    position: absolute;
    top: 0;
    left: -5px;
}
.circle2{
    width: 13px;
    height: 13px;
    background-color: #0099E1;
    border-radius: 50%;
    position: absolute;
    top: 138px;
    left: -5px;
}
/* .circle3{
    width: 13px;
    height: 13px;
    background-color: #0099E1;
    border-radius: 50%;
    position: absolute;
   bottom: 0;
   right: -5px;
} */
.text_box{
    /* border: 1px solid green; */
    width:37.9vw;
   
}
.text_box1{
    padding: 10px 10px;
    border: 2px solid #0099E1;
    border-radius: 5px 5px;
     margin-top: 16px;
}
.year_main{
    display: flex;

}
.year_icon{
    
}
.year_icon i{
    color: #0099E1;
}
.year{
    font-family: calibri;
    color: #0099E1;
}
.school_degree{
    font-family: calibri;
color: white;
    font-size: 20px;
}
.about_school{
    font-family: calibri;
    color: rgba(255, 255, 255, 0.678);
}