body {
   font-face {
     font-family: Roboto;
     src: url("assets/fonts/Roboto.ttf");
   }

   display: flex;
   flex-direction: column;
   justify-content: space-between;
   min-width: 320px;
   min-height: 70vh;
   margin: 10px;
   padding: 10px;
   font-family: 'Roboto',
   sans-serif;
   font-size: 20px;
   font-weight: 400;
   line-height: 1.5;
   color: rgb(9, 10, 10);

   * {
     box-sizing: border-box;
   }
 }

 .header {
   background-color: rgb(233, 24, 24);
   display: block;
   unicode-bidi: isolate;
 }

 .nav-link {
   transition: 0.3s;
   position: relative;
   font-weight: 500;
   line-height: 60px;
   font-size: 25px;
   text-decoration: none;
   padding: 0 18px;
   color: beige;
 }

 .avatar {
   width: 300px;
   height: 325px;
   object-fit: cover;
   border-radius: 90%;
   box-shadow: 0px 0px 0px 0px rgba(7, 7, 7, 0.6);
   filter: grayscale(0.100);
   transition: 0.3s;
 }



 .section {
   width: calc 50%;
   padding: 5px;
   padding-bottom: 25px;
   border-bottom: 5px solid beige;

   section {
     display: block;
     unicode-bidi: isolate;
   }

   * {
     box-sizing: border-box;
   }
 }

 .page-title {
   font-weight: bold;
   font-size: 36px;
   line-height: 42px;
   font-family: "Verdana", sans-serif;
   text-align: center;
 }

 .container {
   display: flex;
   justify-content: center;
   flex-direction: row;
   max-width: 1440px;
   margin: 0 auto;
   min-height: 20px;
 }

 .pre {
   padding: 0;
   margin: 0;

   * {
     box-sizing: border-box;
   }

   pre {
     display: block;
     font-family: monospace;
     unicode-bidi: isolate;
     white-space: pre;
     margin-block: 1em;
     margin-inline: 0px;
   }
 }


 .container-1 {
   display: flex;
   justify-content: space-between;
 }

 .container-1sub {
   display: flex;
   justify-content: flex-start;
   flex-direction: column;
   padding: 30px;
   width: 40%;
   height: 40%;

 }

 .container-1sub2 {
   display: flex;
   justify-content: space-between;
   flex-direction: column;
   padding: 30px;
   height: 60%;
   width: 60%;

 }

 .section-profile {
   display: flex;
   justify-content: space-around;
   width: 100%;
   padding: 50px 30px 35px;
   border-bottom: 15px solid beige;
 }

 .main-title {
   margin-bottom: 20px;
   font-size: 40px;
   font-weight: 400;
   text-transform: uppercase;
   letter-spacing: 5px;
   color: rgb(233, 24, 24);
 }

 .section-title {
   margin-bottom: 20px;
   font-size: 25px;
   font-weight: 400;
   text-transform: uppercase;
   letter-spacing: 5px;
   color: rgb(233, 24, 24);
 }


 .section-profile-title {
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-content: center;
   text-align: center;
   text-transform: uppercase;
 }

 .section-subtitle {
   margin-bottom: 10px;
   font-size: 30px;
   font-weight: 400;
   text-transform: uppercase;
   letter-spacing: 5px;
   color: rgb(233, 24, 24);
   padding: 40px 0px 0px;

   h3 {
     position: relative;
     font-size: 1.17em;
     margin-block-start: 1em;
     margin-block-end: 1em;
     margin-inline-start: 0px;
     margin-inline-end: 0px;
     font-weight: bold;
     unicode-bidi: isolate;
   }
 }

 .nav-list {
   display: flex;
   justify-content: space-around;
   align-items: center;
   list-style: none;
   padding: 0 20px;
   line-height: 50px;
 }

 html {
   scroll-behavior: smooth;
 }



 .avatar-container {
   text-align: start;
 }

 .contacts-item:nth-child(5)::before {
   background-image: url(./assets/svg5.svg);
 }

 .contacts-item:nth-child(4)::before {
   background-image: url(./assets/svg4.svg);
 }

 .contacts-item:nth-child(3)::before {
   background-image: url(./assets/svg3.svg);
 }

 .contacts-item:nth-child(2)::before {
   background-image: url(./assets/svg2.svg);
 }

 .contacts-item:nth-child(1)::before {
   background-image: url(./assets/svg1.svg);
 }

 .section-item::before {
   content: "";
   width: 30px;
   height: 30px;
   background-size: cover;
   background-image: url(./assets/always1.svg);
   display: inline-block;
   margin-right: 5px;
 }

 .section-item{
  display: flex;
  align-items: center;
 }

 .contacts-item {
  display: flex;
  align-items: center;
 }

 .footer {
   background-color: rgb(233, 24, 24);
   padding: 20px;

   footer {
     display: block;
     unicode-bidi: isolate;
   }

   * {
     box-sizing: border-box;
   }
 }

 .footer-container {
   display: flex;
   justify-content: space-around;
   align-items: center;
   margin: 0;
   color: beige;
 }

 .rss::before {
   content: "";
   width: 40px;
   height: 40px;
   background-size: cover;
   background-image: url(./assets/svgfoot.svg);
   display: inline-block;
   margin-right: 5px;
 }

 .rss {
   color: beige;
   display: flex;
   align-items: center;
 }

 .rssc {
   width: 121px;
   height: 45px;
   background-image: url(./assets/rs-school-logo.svg);
   background-size: contain;
   background-repeat: no-repeat;
   color: beige;

   * {
     box-sizing: border-box;
   }

   a:-webkit-any-link {
     color: -webkit-link;
     cursor: pointer;
     text-decoration: underline;
   }
 }

 ul {
   list-style: none;
   padding: 0;
 }