@import url("reset.css");
@import url("header.css");
@import url("home.css");

@import url("footer.css");

/* ------------------------------------------------------------------------------------ */
body {
  font-family: Montserrat, sans-serif;
  line-height: 1;
	/* background: url(../img/first.webp) no-repeat center top / cover, #181916; */
}

/* ------------------------------------------Главная------------------------------------- */
.profile-page {
  margin: 90px auto 40px;
  /* height: 100vh; */
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;  
}

.admin-page {
  /* margin: 10px auto; */
  /* max-width: 1200px; */
  position: relative;
  height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background: rgba(65,105,225,0.5);
}

.home-page,
.log_in-page,
.forgot-page,
.register-page,
.newpass-page {
  height: 100vh;
  background: url(../img/first.webp) no-repeat center top / cover;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}


.container_form { 
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items:center;
  /* justify-content: space-between; */
  /* height: 100vh;  */
}


/* -------------------Form---------------------- */
.container {
  /* display: flex; */
  align-items:center;
}
.form_titles {
  margin: 0 auto;  
  background: rgba(28,34,24,0.80);
  box-shadow: 0px 7px 17px rgba(186,186,186,0.7);
	border-radius: 4px;
	width: 320px; 
	padding: 5px;
	color: #858585;
	text-decoration: none;
	text-align: center;
  /* font-weight: bold; */
	font-size: 10px;
}
.form_titles:hover{
  box-shadow: 0px 7px 17px rgba(255,199,191,0.7);
  color: #FFC7BF;
}
.form_titles button{
  background: rgba(28,34,24,0.80);
	width: 300px;
	border-radius: 10px;
	box-shadow: 0px 7px 17px rgba(186,186,186,0.7);
	border-radius: 4px;
	display: block;
  padding: 10px;
	margin: 0 auto;
	color: #858585;
	text-decoration: none;
	text-align: center;
	/* text-transform: uppercase; */
	/* font-weight: bold; */
	font-size: 16px;
	margin-top: 10px;
  margin-bottom: 5px;
}
.form_titles button:hover {
  box-shadow: 0px 7px 17px rgba(255,199,191,0.7);
  color: #FFC7BF;
}
.form_titles label{
  margin-top: 5px;
}
input {
  margin-top: 5px;
  /* margin: 5px 0; */
  padding: 2px 10px;
  border: unset;
  border-radius: 2px;
  border-bottom: 2px solid #09E114;
  outline: none;
}
.form_titles textarea{
  margin: 5px 0;
}
.form_titles .capcha{
  display: flex;
  justify-content: space-around;
  align-items:center;
  margin: 10px;
}
.form_login p{
  margin: 5px 0;
  line-height: 1.5;
}
.form_link {
  margin: 5px;
  font-size: 14px;
  /* color: #de7d7a; */
  color:#09E114;
  display: inline;
  /* width: 100%; */
}
.form_link:hover{
  /* box-shadow: 0px 7px 17px rgba(255,199,191,0.7); */
  color: #FFC7BF;
}
/* ------------------END Form---------------------- */
/* ------------------Log_in------------------------ */
.log_in {
	background: rgba(28,34,24,0.80);
	width: 540px;
	border-radius: 10px;
	box-shadow: 0px 7px 17px rgba(186,186,186,0.7);
	border-radius: 4px;
	display: block;   
	padding: 10px 0px 0px 0px;
	margin: 0 auto;
	color: #858585;	
	text-decoration: none;
	text-align: center;
	/* text-transform: uppercase; */
	font-weight: bold;
	font-size: 25px;
	margin-top: 30px;
}
.log_in input {
	text-align: center;
    
}
.log_in a {
	font-size: 10px;
	color: #FFC7BF;
}
.log_in:hover {
box-shadow: 0px 7px 17px rgba(255,199,191,0.7);
color: #FFC7BF;
display: block;
}
.form_login {
  margin:0 auto;
  display: flex;
  flex-direction: column;
  width: 300px;
}
form .input{
  justify-content: center;
}
textarea.form_messages {
  min-height: 20px;
  max-height: 60px;
  resize: vertical;
  padding: 0 10px;
  /* margin-bottom: 10px; */
}
button {
  padding: 10px;
  background: #e3e3e3;
  border: unset;
  cursor: pointer;
}
/* -----------profile--------------- */
.msg {
  border: 2px solid #FFC7BF;
  border-radius: 3px;
  padding: 5px;
  text-align: center;
  font-weight: bold;
}
.profile-mes {
  display: flex;
  align-items:center;
  justify-content: center; 
}
.profile-mes .msg{
  background: rgba(227,227,227,0.7);
  /* position: fixed; */
  border:2px solid #de7d7a;
  border-radius: 3px;
  padding: 10px;
  text-align: center;
  font-weight: bold;
  font-size:34px;
  color: rgb(0, 0, 0);
}
/* -----------End profile--------------- */

/* ---------------------------------------------UAMP--------------------------------------- */
.uamp {
  margin: 90px auto 40px;
  max-width: 1200px;
  position: relative;
  /* height: 100vh; */
  /* display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center; */
  
}
/* .uamp label {
  margin: 10px;
  color: #333;
  font-weight: bold;
} */
/* .menu_uamp {
  align-items:flex-start;
  justify-content: space-between;

}
.menu_uamp ul{
  width: 300px;
  position: absolute;  
  top: 70px;
  right: 10px;
  display: flex;
  justify-content: space-between;
}
.menu_uamp a {
  color: #BABABA;  
  box-shadow: 0px 7px 17px rgba(94, 94, 94, 0.7);  
  font-size: 16px;
  padding: 5px;
}  
.menu_uamp a:hover{
  box-shadow: 0px 7px 17px rgba(255,199,191,0.7);
  color: #FFC7BF;
} */

/* .menu_uamp li{
  display: inline;
  background: rgba(28,34,24,0.70);
  box-shadow: 0px 2px 6px rgba(186,186,186,0.5);
  border-radius: 3px;
  color: #BABABA;
	text-decoration: none;
	text-transform: uppercase;
	font-size: 14px;
} */
/* .menu_uamp li:hover {
border: 1px solid rgba(186,186,186,0.50);
box-shadow: 0px 2px 6px rgba(255,199,191,0.5);
color: #FFC7BF;
} */
.uamp_view {
  margin: 0 auto;
  width: 90%;
  height:280px;
  overflow: hidden;
  overflow-x: scroll;
  white-space:nowrap;
}
.child {
  object-fit: cover;
  display: inline-block;
  vertical-align: top;
  height:100%;
}
/* ----------END uamp--------------- */
/* ------------popup--------------- */
.shell_popup {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.popup{
  width: 80%;
  background: #bababa;  
  border-radius: 6px;
  position: absolute;
  /* top: 0; */
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(0.1);
  text-align: center;
  padding: 0 30px 30px;
  color: #333;
  visibility: hidden;
  transition: transform 0.4s, top 0.4s;
}
.open-popup {
  border: 1px solid #333;
  box-shadow: 0px 7px 17px rgba(255,199,191,0.7);
  visibility: visible;
  top: 50%;
  transform: translate(-50%, -50%) scale(1);
}
.popup img {
  width: 30px;
  margin-top: 10px;
  /* border-radius: 50%; */
  border: 1px solid #333;
  background:#333;
  opacity: 0.6;
  border-radius: 5%;
  box-shadow: 0 0px 5px 5px rgba(255,199,191, 0.9);
}
.popup h2 {
  font-size: 38px;
  font-weight: 500;
  margin: 30px 0 10px;  
}
.popup button {
  width: 50%;
  margin-top: 50px;
  padding: 10px 0;
  background: #09E114;
  color: #fff;
  border: 0;
  outline: none;
  font-size: 18px;
  border-radius: 4px;
  cursor: pointer;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
}
/* ----------END popup------------- */

/* -----------------------"uman-cash-d" --------------------------- */
.uman-d {
  display: block;
}
.uman-m {
  display: none;
  }

@media all and (max-width: 700px) {
  .uman-m {
  display: block;
  }
  .uman-d {
  display: none;
  }
}
/* ----------------------END "uman-cash-d" ------------------------ */


/* ----------медиа запросы------------ */
@media all and (max-width: 440px) {
  .profile__user {
    display: none;
  }
}
@media all and (max-width: 500px) {
  .logo{
    display: none;
  }
  .logo-m {
   display: block; 
  }
}
@media all and (min-width: 501px) {
  .logo-m{
    display: none;
  }
  .logo {
   display: block; 
  }
}

@keyframes submenu{
  0%{
    opacity: 0.999;
    transform: rotatex(90deg);
  }
  40%{
    transform: rotatex(-20deg) rotatey(7deg);
  }
  60%{
    transform: rotatex(20deg) rotatey(-5deg);
  }
  100%{
    opacity: 1;
    transform: rotatex(0deg);
    animation-timing-function: ease-in-out
  }
}

/*---------------- MENU UAMP ---------------*/
.uamp-menu *{
  margin: 0;
  padding: 0;
  
 }
 .uamp-menu ul,
 .uamp-menu li{
  list-style: none;
 }
 .uamp-menu > ul{
  display: flex;
  justify-content: center;
 }
 .uamp-menu > ul li{
  position: relative;
  border-right: 1px solid #c7c8ca;
  
 }
 .uamp-menu > ul li:first-child{
  border-left: 1px solid #b2b3b5;
 }
 .uamp-menu > ul li:last-child{
  border-right: 1px solid #babbbd;
 }
 .uamp-menu > ul li a{
  display: block;
  background: rgb(201,201,201); 
  background: -moz-linear-gradient(top,  rgba(201,201,201,1) 0%, rgba(246,246,246,1) 2%, rgba(196,197,199,1) 98%, rgba(117,117,119,1) 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top,  rgba(201,201,201,1) 0%,rgba(246,246,246,1) 2%,rgba(196,197,199,1) 98%,rgba(117,117,119,1) 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom,  rgba(201,201,201,1) 0%,rgba(246,246,246,1) 2%,rgba(196,197,199,1) 98%,rgba(117,117,119,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c9c9c9', endColorstr='#757577',GradientType=0 ); /* IE6-9 */
 
  padding: 10px 30px 10px 30px;
  font-size: 14px;
  color: #454547;
  text-decoration: none;
  text-transform:uppercase;
  transition: all 0.3s ease;
 }
 .uamp-menu img{
   height: 18px; 
   margin-right: 5px;
 }
 
 .uamp-menu li a:hover{
  background: rgb(224,225,229);
  background: -moz-linear-gradient(top,  rgba(224,225,229,1) 0%, rgba(69,69,71,1) 2%, rgba(69,69,71,1) 98%, rgba(224,225,229,1) 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top,  rgba(224,225,229,1) 0%,rgba(69,69,71,1) 2%,rgba(69,69,71,1) 98%,rgba(224,225,229,1) 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom,  rgba(224,225,229,1) 0%,rgba(69,69,71,1) 2%,rgba(69,69,71,1) 98%,rgba(224,225,229,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e0e1e5', endColorstr='#e0e1e5',GradientType=0 ); /* IE6-9 */
 
  color: #FFC7BF;
  box-shadow: 0px 2px 6px rgba(255,199,191,0.8);
  transition: all 0.3s ease;
 }
 
 
 .uamp-menu li ul{
  position: absolute;
  min-width: 150px;
  display: none;
 }
 .uamp-menu li:hover > ul{
   display: block;
  }
 .uamp-menu li > ul li{
  border: 1px solid #c7c8ca;
 }
 .uamp-menu li > ul li a{
  padding: 10px;
  text-transform: none;
  background: #e4e4e5;
 }
 .uamp-menu li > ul li ul{
  position: absolute;
  right: -150px;
  top: 0;
 }
 
 /* ----------------------Медиа запрос-------------------- */
 .uamp-menu [type="checkbox"],
 .uamp-menu label.switchSubmenu{
  display: none;
 }
 .uamp-menu label.switchMenu{
  background: rgb(201,201,201);
  background: -moz-linear-gradient(top,  rgba(201,201,201,1) 0%, rgba(246,246,246,1) 2%, rgba(196,197,199,1) 98%, rgba(117,117,119,1) 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top,  rgba(201,201,201,1) 0%,rgba(246,246,246,1) 2%,rgba(196,197,199,1) 98%,rgba(117,117,119,1) 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom,  rgba(201,201,201,1) 0%,rgba(246,246,246,1) 2%,rgba(196,197,199,1) 98%,rgba(117,117,119,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c9c9c9', endColorstr='#757577',GradientType=0 ); /* IE6-9 */
 
  display: none;
  padding: 15px 40px;
  text-transform: uppercase;
  font-size: 14px;
  cursor: pointer;
  position: relative;
 }
 .uamp-menu label.switchMenu .icon-menu-uamp{
  position: absolute;
  top: 15px;
  left: 12px;
  font-size: 18px;
 }
 
 
 @media all and (max-width: 900px){
  .uamp-menu{
   overflow: hidden;
  }
  .uamp-menu ul{
   display: block;
   max-height: 0;
   transition: max-height 0.3s;
  }
  .uamp-menu li>ul li ul{
   position: absolute;
   right: auto;
   top: auto;
  }
  .uamp-menu label.switchMenu{
   display: block;
  }
  
  input.switchMenu:checked + label.switchMenu{
   background: #454547;
   color: #fff;
  }
  input.switchMenu:checked ~ ul,
  input.switchSubmenu:checked ~ ul{
   display: block;
   position: relative;
   max-height: 5000px;
   transition: max-height 2s ease-in;
  }
  .uamp-menu label.switchSubmenu{
   position: absolute;
   top: 0;
   right: 0;
   width: 100%;
   height: 100%;
   cursor: pointer;
   display: block;
  }
  input.switchSubmenu:checked ~ a{
   background: #454547;
   color: #fff;
  }
  .uamp-menu label.switchSubmenu .icon-menu-uamp:before{
   content: "\21D3";
   color: #454545;
   box-shadow: 0px 7px 17px rgba(255,199,191,0.7);
   font-style: normal;
   font-weight: bold;
  }
  .uamp-menu label.switchSubmenu .icon-menu-uamp{
   position: absolute;
   top: 10px;
   right: 30px;
  }
  .uamp-menu input.switchSubmenu:checked ~ label.switchSubmenu .icon-menu-uamp::before{
   content: "\21D1";
   color: #FFC7BF;
   box-shadow: 0px 7px 17px rgba(255,199,191,0.7);
   font-style: normal;
   font-weight: bold;
  }
  .profile-mes .msg {
    font-size: 20px;
  }
 }
/*--------------END MENU UAMP --------------*/





/*-------------- Бургер -------------*/
/* .menu_uamp {  
  height: 50px;  
}
#burger,
[for=burger] {
  display: none;
}
@media screen and (max-width: 500px) {
  
  
  [for=burger] {
    display: block;
    position: fixed;
    width: 30px;
    text-align: center;
    left: 10px;
    top: 62px;
    color:#09E114;
    font-size: 30px;
  }
  [for=burger]::before {
    content: '☰';
  }
  [for=burger]:hover {
    color:#09E114;
  }
  .menu_uamp nav {
    display: none;
    position: fixed;
    top: 0;
    left: 10px;
    margin-top: 95px;
    padding: 10px;       
    width: 120px;
    user-select: none;
  }  
  .menu_uamp nav ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
    display: block;
    position: unset;
  }
  .menu_uamp nav li {
    margin: 20px 0;
  }
  #burger:checked+label+nav {
    display: block;
    animation: show .5s ease;
    background: rgba(28,34,24,0.80);	
	  border-radius: 5px;
	  box-shadow: 0px 7px 17px rgba(186,186,186,0.7);
  	
  }
  #burger:checked+[for=burger]::before {
    content: '✖';
    color: #de7d7a;
  }
  #burger:checked+[for=burger]:hover {
    color: #957ade;
  }
}
@keyframes show {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 0.5;
  }
  100% {
    opacity: 1;
  }
} */
/*--------------END Бургер -------------*/