/* .......................media screen for large screen................ */

@media screen and (min-width: 1375px) and (max-width: 2400px) {
  
 /* .................about section......................... */

.about-section {
    width: 100%;
    height: 100vh;
    float: left;
    background-color: #212529 ;
}

.about-section-center {
    width: 100%;
    height: 100vh;
    float: left;
    /* text-align: center; */
    color: #dee3e4;
    /* font-size: 32px; */
    /* padding-top: 60px; */
}
/* .........................uppar section of about section................................ */
.about-section-upper {
    width: 100%;
    height: 20vh;
    opacity: 5;

    color: #dee3e4;
    font-size: 80px;
    text-align: center;
    padding-top: 30px;
    /* border: 5px solid red; */
}
    /* ................lower part of about section.............................. */
.about-section-lower {
    width: 100%;
    height: 80vh;
    /* border: 5px solid red; */
   
}
.about-section-lower-center{
    width: 80%;
    margin: 0 auto;
    height: 450px;
    /* border: 3px solid red; */
    margin-top: 20px;
}
.about-section-row{
    width: 100%;
    height: 70vh;
    /* border: 5px solid #a220c9; */
}
/*  ...................box1............................ */
.about-section-box1{
    width: 58%;
    height: 50vh;
    float: left;
    /* border: 5px solid #20c997; */
    border-radius: 20px;
    text-align: center;
    padding-top: 50px;
    margin-top: 8%;
}

.about-section-lower-left {

    width: 90%;
    float: left;
    color: #dee3e4;
    font-size: 50px;
    padding-left: 10px;
    text-align: justify;
}

.about-section-lower-left span {
    color: #20c997;
}

.about-section-lower-left div {
    font-size: 18px;

}
/* .........................box2........................... */
.about-section-box2{
    width: 38%;
    height: 50vh;
    float: left;
    /* border: 5px solid #20c997; */
    border-radius: 20px;
    padding-left: 20px;
    padding-top: 50px;
    margin-left: 2%;
    margin-top: 8%;
}
.about-section-lower-right {
    width: 80%;
    float: left;
    color: #dee3e4;
    font-size: 22px;
    text-align: justify;
    padding-top: 10px;
}

.about-section-lower-right span {
    color: #20c997;
}
.downloadcv-button{
    border: 3px solid #20c997;
    width: 150px;
    height: 50px;
    background-color: #20c997;
    color: #dee3e4;
    font-size: 20px;
    border-radius: 30px;
    text-align: center;
    margin-top: 10px;
}
.about-section-lower-right div :hover{
    color: burlywood;
    background-color: #111418;
 }
/* ...................skills section....................... */
.skills-section {
    width: 100%;
    height: 115vh;
    float: left;
    background-color: #3d4041;
   
}

.skills-section-center {
    width: 100%;
    height: 115vh;
    float: left;

}
/* ...........uppar part of skills section.................... */
.skills-section-upper {
    width: 100%;
    height: 20vh;
    color: #dee3e4;
    font-size: 80px;
    text-align: center;
    opacity: 5;
    padding-top: 35px;
    /* border: 3px solid greenyellow;  */
}
/* ...........lower part of skills section.................... */
.skills-section-lower {
    width: 100%;
    height: 90vh;
     opacity: 0.76;
    /* border: 5px solid violet; */
    padding-top: 80px;
    padding-left: 50px;
    text-align: center;
}


.skill {
    width: 200px;
    float: left;
    background-color: rgb(255, 255, 255);
    text-align: center;
    padding: 8px;
    margin: 11px;
    border-radius: 5px;
}

.skill img {
    width: 80%;
}

.skill-name {
    font-size: 16px;
}

.skills-section-row1{
    width: 90%;
    height: 350px ;
    float: left;
    padding-left: 100px; 
    padding-top: 80px;
    text-align: center;
    /* border: 3px solid greenyellow; */
    margin: 2%; 
}

.skills-section-row2{
    width: 90%;
    height: 350px ; 
    float: left;
    padding-left: 100px;
    padding-top: 10px;
    margin-top: 3%;
    margin: 2%; 
    text-align: center;
    /* border: 3px solid greenyellow; */
}














/* ...........row1.................... */
/* .skills-section-row1{
    width: 100%;
    height: 350px ;
    float: left;
    padding-left: 50px; 
    padding-top: 10px;
    text-align: center;
    border: 3px solid greenyellow; 
} */
/* ...........row2.................... */
/* .skills-section-row2{
    width: 100%;
    height: 350px ; 
    float: left;
    padding-left: 50px;
    padding-top: 10px;
    margin-top: 3%;
    text-align: center;
    border: 3px solid greenyellow;
}
.skills-section-col{
    width: 18%;
    height: 320px ;
    font-size: 30px;
    color: #dee3e4;
    border:  7px solid #ebf5f2;
    text-align: center;
    float: left;
    padding-top: 20px;
    border-radius: 15px;
    margin-left: 1%;
}
.logo {
    width: 220px;
    padding: 7px;
    border-radius: 20px;
    border:5px solid #dee3e4;
}  */




/*...............project section...................  */
 
.projects-section {
    width: 100%;
    height: 150vh;
    float: left;
    background: #212529
}
/* ................uppar part of project section..................... */
.project-section-uppar{
    width: 100%;
    height: 20vh;
    float: left;
    font-size: 80px;
    color: #dee3e4;
    text-align: center;
    padding: 30px;
    opacity: 5;
    /* border: 7px solid #dee3e4 ; */
}
.project-section-lower{
    width: 100%;
    height: 110vh;
    float: left;
    text-align: center;
    /* padding: 50px; */
    /* border: 5px solid #20c997; */
}
/* ...............box1.................... */
.project-section-box1{
    width: 40%;
    height: 45vh ;
    float: left;
    /* border: 5px solid #dee3e4; */
    border-radius: 20px;
    text-align: right;
    padding-top: 85px;
    margin-left: 7%;
    margin-top: 6%;
}
/* ........................box2......................... */
.project-section-box2{
    width: 40%;
    height: 45vh ;
    float: left;
    /* border: 5px solid #dee3e4; */
    margin-left: 3%;
    margin-top: 6%;
    border-radius: 20px;
    text-align: left;
    padding-top: 90px;

}
/* ..........................box3......................... */
.project-section-box3{
    width: 40%;
    height: 45vh ;
    float: left;
    /* border: 5px solid #dee3e4; */
    margin-left: 7%;
    margin-top: 3%;
    border-radius: 20px;
    text-align: right;
    /* padding-top: 20px; */
}
/*.............................. box4......................... */
.project-section-box4{
    width: 40%;
    height: 45vh ;
    float: left;
    /* border: 5px solid #dee3e4; */
    margin-left: 3%;
    margin-top: 3%;
    border-radius: 20px;
    text-align: left;
    /* padding-top: 40px; */
}
.project-section-down{
    width: 100%;
    height: 20vh;
    float: left;
    font-size: 74px;
    color: #dee3e4;
    text-align: center;
    padding-top: 30px;
    /* border: 5px solid #dee3e4; */
}


.portfolio-class {
    width: 540px;
    padding: 10px;
    border-radius: 20px;
}





/* ......................contact section........................ */
.contact-section {
    width: 100%;
    height: 105vh;
    float: left;
    background-color: #3d4041;
    
}

.contact-section-center {
    width: 100%;
    height: 105vh;
    float: left;

}
/* ................uppar part of contact section.................. */
.contact-section-upper {
    width: 100%;
    height: 20vh;
    float: left;
    /* border: 5px solid #20c997; */
    color: #dee3e4;
    font-size: 80px;
    text-align: center;
    opacity: 5;
    padding-top: 12px;
}
/* ................lower part of contact section.................. */
.contact-section-lower {
    width: 100%;
    height: 90vh;
    float: left;
   /* border: 5px solid #dee3e4; */
}

.contact-section-lower-left {
    width: 50%;
    height: 25vh;
    float: left;
    text-align: center;
    color: #dee3e4;
    /* border: 5px solid #20c997; */
    padding-top: 20px;
    font-size: 25px;
}

.contact-section-lower-right {
    width: 50%;
    height: 25vh;
    float: left;
    text-align: center;
    color: #dee3e4;
    /* border: 5px solid #dee3e4; */
    padding-top: 20px;
    font-size: 25px;
}

.contact-logo {
    border-radius: 60%;
    width: 150px;
}
/* ................bottom part of contact section.................. */
.contact-section-lower-bottom {
    width: 100%;
    height: 60vh;
    float: left;
    text-align: center;
    color: #20c997;
    font-size: 40px;
    padding-top: 25px;
    /* border: 5px solid burlywood; */
    margin-top: 10px;
}
.google-map{
    width: 100%;
}

/* ................footer.................. */
.footer {
    width: 100%;
    height: 20vh;
    float: left;
    text-align: center;
    font-size: 20px;
    padding-top: 80px;
    
    color: #dee3e4;
    background-color: #2e3030;
}

.footer a {
    color: #20c997;
}
   



}