/*Обнуление*/
*{padding:0;margin:0;border:0;}
*,*:before,*:after{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;}
:focus,:active{outline:none;}
a:focus,a:active{outline:none;}
nav,footer,header,aside{display:block;}
html,body{height:100%;width:100%;font-size:100%;font-size:14px;-ms-text-size-adjust:100%;-moz-text-size-adjust:100%;-webkit-text-size-adjust:100%;}
input,button,textarea{font-family:inherit;}
input::-ms-clear{display:none;}
button{cursor:pointer;}
button::-moz-focus-inner{padding:0;border:0;}
a,a:visited{text-decoration:none;}
a:hover{text-decoration:none;}
ul li{list-style:none;}
img{vertical-align:top;}
h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit;}
div{margin: 0;padding: 0;}
/*--------------------*/
/* body{
  background: url(https://i.pinimg.com/originals/aa/08/ff/aa08ffec857b922e26b0d9ef727b0fc9.jpg);
  background-size: auto;
} */
body{
  max-width: none !important;
  color: white;
  background-color: rgba(0, 0, 0, 0.25);
}

.links:link, .mail:visited, .mail:link, .mail:hover, .phone:visited, .phone:link, .phone:hover{
  text-decoration: none;
  color:white;
}
a:hover{
  text-decoration: underline;
  color: rgb(133, 133, 133);
}
a.links:visited{
  color:grey
}
img{
  position: absolute;
  z-index: -1;
  opacity: 0.1;
  height: 100%;
  width: 100%;
}
.wrapper {
  padding: 5% 10%;
  flex: 1 100%;
  height: 100hv;
}

.main-container{
}

.content {
  display:flex;
  flex-wrap: nowrap;
  justify-content: center;
}

.about, .personal{
  flex: 1 1 auto;
}
.about{
  flex-basis: 200px;
  font-size: 1em;
  flex: 1 1 auto;
  background: rgba(71, 71, 71, 0.8);
  border: 1px solid rgba(0, 0, 0, 0.5);
  border-right: none;
  padding: 2%;
}
.personal{
  flex-basis: 50px;
  min-width: 400px;
}
.big-text{
  font-size: 2.5em;
  text-align: left;
  margin: 5%
}
.main-text{
  font-size:2em;
  margin: 3%;
  text-align: left;
}
.info{
  margin: 3%;
  text-align: left;
}
.main .big-text{
  text-align: center !important;
}
.main .main-text{
  text-align: center !important;
}
.important{
  margin: auto !imp
  text-align: center !important;
}
.info{
  font-size: 1.5em;
}
.main{
  background: rgba(10, 10, 10, 0.9);
  border: 1px solid rgba(20, 20, 20, 0.5);
}
/* .not-main{
  border: 1px solid rgba(0, 0, 0, 0.5);
} */
.contacts, .education, .languages{
  padding: 5%;
  background-color:rgba(0, 0, 0, 0.8);
}
.skills .info{
  padding-left: 3%;
}
.some-skills{
  margin-top: 30px;
}
/* progress[value]::-webkit-progress-bar {
-webkit-writing-mode: horizontal-tb !important;
appearance: progress-bar;
box-sizing: border-box;
display: inline-block;
height: 1em;
width: 10em;
vertical-align: -0.2em;
} */
.progress{
  margin: 1%;
}
progress{
  height: 10px;
  margin: 0 0 0.22em 0;
}
progress[value]::-webkit-progress-value {
  background-color: rgb(68, 68, 68);
  border-radius: 20px;
}
progress[value]::-webkit-progress-bar {
  background-color: #ffffff;
  border-radius: 20px;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25) inset;
}

.content{
  box-shadow: 10px 10px 20px rgb(149, 149, 149);
}
.big-text{
  text-shadow: 2px 2px 2px rgb(120, 120, 120);
}
.main-text{text-shadow: 2px 2px 1px rgb(120, 120, 120);}
@media screen and (max-width: 1024px){
.wrapper {
  padding: 2% 5%;
}
.personal{
  min-width: 300px;

}
}

@media screen and (max-width: 700px){
  .wrapper {
    padding: 0 !important;
  }
  .content{
    flex-wrap: wrap;
  }
  .about{
    border-right: 1px solid rgba(0, 0, 0, 0.5);
    order: 2;
  }
  .personal{
    order:1;
  }
}