body {
background: #f6f6fa;
padding: 40px 40px 40px 40px;
font-family: "Montserrat", sans-serif;
display: flex;
}
ul, ol {
    margin-top: 0;
    margin-bottom: 0;  
}
.wrapper {
    background: #ffffff;
    display: flex;
    flex-direction: row-reverse;
    width: 1200px;
    margin: 0 auto;
}

/* main-content */
.main-content {

    padding-left: 88px;
    padding-top: 80px;
    padding-right: 40px;
    padding-bottom: 80px;
    box-sizing: border-box;
}

/* sidebar */

.sidebar {
    background: #e0ebfe;
    padding-top: 40px;
    padding-bottom: 40px;
    box-sizing: border-box;
width: 370px;
}

.sidebar-content {
    padding-left: 40px;
    padding-top: 40px;
    padding-right: 40px;
    box-sizing: border-box;

}
.contacts-title {
    color: #161d2a;
    font-size: 22px;
    font-weight: 700;
    line-height: normal;
    margin-top: 0;
    margin-bottom: 8px;

}
/* contacts */
.contacts-type {
font-weight: 400;
font-size: 14px; 
color: #161d2a;
line-height: 24px;
margin-right: 8px;
}
.contacts-linc {
font-weight: 400;
font-size: 14px; 
color: #2979ff;
line-height: 24px;
text-decoration-line: underline;
}
.contacts-item {
    margin-top: 0;
    margin-bottom: 6px;
}
.contacts-container {
margin-bottom: 40px;
}


/* skills-container */

.skills-container {
margin-bottom: 40px;
}
.skills-title {
    font-weight: 700;
    font-size: 22px;  
    color: #161d2a;
    line-height: normal;
    margin-top: 0;
    margin-bottom: 8px;
}

.skills-list {
padding-left: 21px;
}
.skills-list-item {
font-weight: 400;
font-size:  14px;
line-height: 24px;
color: #161d2a;
}
/* soft skills */
.soft-skills-container {
margin-bottom: 16 px;
}
.soft-skills-list {
padding-left: 21px;  
}
.soft-skills-title {
font-weight: 700;
font-size: 22px;
color: #161d2a;
line-height: normal;
margin-top: 0;
margin-bottom: 8px;
}
.soft-skills-item {
    font-weight:400;
    font-size:14px;  
    color: #161d2a;
    line-height: 24px;
}
/* main content */
.my-profession {
    font-weight:700;
    font-size: 14px; 
    color: #000;
    line-height: 17px;
    margin-top: 0;
    margin-bottom: 8px;
}
.my-name {

font-weight: 700;
font-size: 45px;
color: #000;
margin-bottom: 12px;
margin-top: 0;

}
.my-descr {
font-weight: 400; 
font-size: 14px ;
color: #595959;
line-height: 24px;
}
.my-info {
margin-bottom: 40px;
}
/* my projects */
.my-projects-title{
font-weight: 700; 
font-size: 22px;
color: #000;
margin-bottom: 8px;
margin-top: 0;
}

.my-projects-item {
font-weight: 700;
font-size: 14px;
color: #000;
line-height: 24px;
}
.my-projects-list {
padding-left: 16px;

}

.my-projects-item-link{
    font-weight: 400;
    font-size: 14px; 
    text-decoration: underline;
    color: #005fff;
    line-height: 24px;
}
.my-projects-item-tech {
font-weight: 400;
font-size: 14px ;
color: #595959;
line-height: 24px;
}

.my-projects-container {
margin-bottom: 40px;
}

/* work experience */

.work-experience-title {
font-weight: 700;
font-size: 22px;
color: #000;
line-height: 27px;
margin-top: 0;
margin-bottom: 8px;
}
.work-experience-company {
font-weight: 700;
font-size: 16px;
color: #000;  
margin-top: 0;
margin-bottom: 12px;
}
.company-name {
font-weight: 700;
font-size: 16px;
color: #6d9bf5;  
margin-top: 0;
margin-bottom: 12px;
}
.work-experience {
margin-bottom: 40px;
}

.work-experience-period {
font-weight: 400;
font-size:  12px;
color: #a8a8a8;
line-height: 15px;
margin-bottom: 8px;

}

.work-experience-period-separ {
color: #000;
}
.work-experience-duties-list {
    padding-left: 16px;   
}
.work-experience-duties-item {
font: 400;
font-size: 14px;
color: #595959;
line-height: 24px;
}
.work-experience-container {
    margin-bottom: 12px;
}
/* my education */

.my-education-title {
font-weight: 700;
font-size: 22px ;
color: #000;
line-height: 27px;
margin-top: 24px;
margin-bottom: 8px;
}
.my-education-place {
font-weight: 700; 
font-size: 16px;
color: #6d9bf5;
line-height: 27px;
margin-top: 0;
margin-bottom: 8px;
}
.my-education-specialty {
font-weight: 700; 
font-size: 14px;
color: #000;
margin-top: 0;
margin-bottom: 8px;
}
.my-education-separ {
font-weight:400;
font-size: 12px;
color: #000;
 }
 @media screen and (max-width: 960px) {
    body {
    padding: 20px;
    }
    .main-content {
    padding: 40px;
    }
    
}

  @media screen and (max-width: 800px) {
    .sidebar {
        width: 370px;
    }
    .my-photo {
        width: 250px;
    }
    .sidebar-content {
        padding: 20px;
    }
  }
  @media screen and (max-width: 600px) {
    body {
      padding: 0;  
    }
    .sidebar {
        width: 200px;
    }
    .my-photo {
        width: 200px;
  }
    .main-content {
    padding: 20px;
}
.my-name {
    font-size: 28px;
}
 }
 @media screen and (max-width: 510px) {
    .wrapper {
    flex-direction: column;
}
    .sidebar {
    width: 100%;
    }
    .my-photo {
    width: 100%;
    
  }

 }