/*== 
  Fonts 
==*/

@font-face {
  font-family: 'Uni Neue';
  src: local('Uni Neue Regular'), local('Uni-Neue-Regular'),
      url('../fonts/uni_neue/regular.woff2') format('woff2'),
      url('../fonts/uni_neue/regular.woff') format('woff'),
      url('../fonts/uni_neue/regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: 'Uni Neue';
  src: local('Uni Neue Bold'), local('Uni-Neue-Bold'),
      url('../fonts/uni_neue/bold.woff2') format('woff2'),
      url('../fonts/uni_neue/bold.woff') format('woff'),
      url('../fonts/uni_neue/bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
}

@font-face {
font-family: 'Uni Neue';
src: local('Uni Neue Heavy'), local('Uni-Neue-Heavy'),
    url('../fonts/uni_neue/heavy.woff2') format('woff2'),
    url('../fonts/uni_neue/heavy.woff') format('woff'),
    url('../fonts/uni_neue/heavy.ttf') format('truetype');
font-weight: 900;
font-style: normal;
}

@font-face {
  font-family: 'Roboto';
  src: local('Roboto Regular'), local('Roboto-Regular'),
      url('../fonts/roboto/regular.woff2') format('woff2'),
      url('../fonts/roboto/regular.woff') format('woff'),
      url('../fonts/roboto/regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: 'Roboto';
  src: local('Roboto Bold'), local('Roboto-Bold'),
      url('../fonts/roboto/bold.woff2') format('woff2'),
      url('../fonts/roboto/bold.woff') format('woff'),
      url('../fonts/roboto/bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
}

/*== 
General 
==*/
*{box-sizing: border-box;}
html{height: 100%;}
body{font-weight: 400; word-wrap: break-word; letter-spacing: 1px;; margin: 0; min-width: 320px; min-height: 100%; background: url('../img/blank.jpg'); display: flex; flex-direction: column;}

ul, li{list-style-type: none; padding: 0; margin: 0;}
img{max-width: 100%; max-height: 100%;}
a{color: #000;}
a:hover{text-decoration: none;}

.container{max-width: 1200px; padding: 0 30px; margin: 0 auto;}
main{flex: 1 0 auto;}
.del_link {color: red; text-decoration: underline; cursor: pointer;}

/* LoadProgressBar */
.js_progress { color: #666; }
.load_error { color: #B33; }
.pr {
	border: 2px solid #666;
	width: 310px;
	height: 40px;
	margin: 5px auto;
}
.pr_line {
	box-sizing: border-box;
	height: 100%;
	width: 0px;
	background-color: #3B3;
}
.success_final { color: #3B3; }
.disp_none {display: none;}

/*== 
  Auth 
==*/
.auth-container{flex: 1 0 auto; display: flex; justify-content: center; align-items: center;}
.auth{font: 700 24px 'Uni Neue'; width: 475px; padding-top: 250px; margin: 60px 0; background: url('../img/logo_auth.png') top no-repeat;}

.auth .text-field:first-child{margin-bottom: 30px;}
.auth .text-field label{padding: 0 0 10px 20px; display: block;}
.auth .text-field input[type="text"], .text-field input[type="password"]{font: 400 20px 'Roboto'; line-height: 24px; color: #293340; padding: 0 20px; width: 100%; height: 48px; background: #fff; border: 1px solid #c5c5c5; border-radius: 10px; transition: border-color 0.2s ease;}
.auth .text-field input[type="text"]:focus, .text-field input[type="password"]:focus{border-color: #fcb229; outline: none;}
.auth .text-field input.error{border-color: #ff0000!important;}

.auth .submit-field{text-align: center; margin: 40px 0 0;}
.auth .submit-field input[type="submit"]{cursor: pointer; font: 700 24px 'Uni Neue'; text-transform: uppercase; line-height: 55px; width: 200px; background-color: #fcb229; border: 0; transition: background-color 0.2s ease;}
.auth .submit-field input[type="submit"]:hover{background-color: #ffbe46;}
*::placeholder{opacity: 1;}

.admin_error {font-size: 14px; color: red;}

/*== 
  Header 
==*/
header{padding: 12px 0; background-color: #f6f6f6; border-bottom: 2px solid #e7e7e7;}
header .container{display: flex; align-items: center;}

header .logo{width: 52px; height: 51px; background: url('../img/logo_admin.png') 0 0 no-repeat; flex-shrink: 0;}
header .user-bar{font: 16px 'Roboto'; line-height: 18px; flex-grow: 1; display: flex;}
header .user-bar .stat{text-align: center; flex-grow: 1;}
header .user-bar .user{display: flex}
header .user-bar .user .name{padding-right: 8px; margin-right: 8px; border-right: 1px solid #000;}

header .user-bar .user a{color: #000; text-decoration: none; border-bottom: 1px solid #000;}
header .user-bar .user a:hover{border-color: #f6f6f6;}


/*== 
  Upload block 
==*/
.upload{font-family: 'Roboto'; font-size: 16px; text-align: center; max-width: 580px; margin: 60px auto 70px;}
.upload .title{font-size: 24px;}
.upload p{font-size: 18px; line-height: 24px;}

.upload .status-error{color: #d40000; margin: 10px 0;}
.upload .comment{margin-top: 10px;}

.upload .file-field label{font: 400 20px 'Uni Neue'; line-height: 54px; text-transform: uppercase; cursor: pointer; padding: 0 20px; margin: 10px 0 5px; background-color: #fcb229; display: inline-block; transition: background-color 0.2s ease;}
.upload .file-field label:hover{background-color: #ffbe46;}
.upload .file-field input[type="file"]{display: none;}

.upload .submit-field{margin-top: 45px;}
.upload .submit-field input[type="submit"]{font: 400 20px 'Uni Neue'; line-height: 50px; color: #000; text-transform: uppercase; cursor: pointer; padding: 0 40px 0 25px; background-color: #cfcfcf; background-image: url('../img/arrow.png'); background-position: 93.5% center; background-repeat: no-repeat; border: 0; transition: background-color 0.2s ease;}
.upload .submit-field input[type="submit"]:hover{background-color: #d9d9d9;}

/*== 
  Orders
==*/
.container.orders{padding-bottom: 60px; background-color: #fbfbfb; border: 1px solid #e7e7e7; border-top: 0; overflow: hidden;}

.orders .search{padding: 10px 0; margin: 25px 0; background-color: #f6f6f6; border: 1px solid #e7e7e7; border-radius: 3px; display: flex;}
.orders .search input[type="submit"]{margin: 0 25px 0 15px; width: 20px; height: 19px; background: url('../img/icons/search.png') 0 0 no-repeat; border: 0; flex-shrink: 0;}
.orders .search input[type="text"]{font: 14px 'Roboto'; padding-right: 15px; background: none;  border: 0; flex-grow: 1;}

.orders-list{font: 14px 'Roboto'; overflow: auto;}
.orders-list table{width: 100%; border-collapse: collapse;}
.orders-list table th{font-size: 14px; font-weight: 400; color: #fff; text-transform: uppercase; padding: 10px 15px; background-color: #293340; border-bottom: 1px solid #fcb229;}
.orders-list table th:first-child{text-align: left;}
.orders-list table td{padding: 15px; width: 16.66666666666667%;}
.orders-list table td{border: 1px dotted #000;}
.orders-list table td:first-child{border-left: 0;}
.orders-list table td:last-child{border-right: 0;}

.nav{font: 700 18px 'Roboto'; text-align: center; margin-top: 60px;}

/*== 
  Footer 
==*/
.footer{font-family: 'Uni Neue'; font-weight: 400; color: #fff; padding: 40px 0 88px 0; background-color: #293340; flex: 0 0 auto;}

/* Copyright */
.footer .copyright{font-size: 20px; line-height: 36px; letter-spacing: 2px; text-align: center; margin-bottom: 15px;}

/* Social */
.social{display: flex;}
.social a{font-size: 16px; text-decoration: none; text-align: center; line-height: 29px; font-weight: 400; width: 31px; height: 31px; border-radius: 50%; background-repeat: no-repeat;  transition: 0.2s;}
.social a:not(:first-child){margin-left: 19px;}
.social a.fa-youtube{font-size: 14px;}
.social a.fa-youtube::before, .social a.fa-instagram::before{margin-left: 1px;}
.footer .social{justify-content: center;}
.footer .social a{color: #293340; background-color: #e9e9e9; border: 1px solid #e9e9e9;}
.footer .social a:hover{color: #e9e9e9; background-color: initial;}

@media all and (max-width: 992px) {
.container{padding: 0 15px;}

/*== 
  Header 
==*/
header .logo{width: 35px; height: 35px; background-size: 100%;}

/* Icon menu */
.icon-menu-container{padding-right: 10px; display: flex; flex-grow: 1; justify-content: flex-end;}
.icon-menu .bar1, .icon-menu .bar2, .icon-menu .bar3 {width: 25px; height: 2px; background-color: #000; margin: 5px 0; transition: 0.4s;}
.icon-menu.change .bar1{transform: rotate(-45deg) translate(-1px, 6px);}
.icon-menu.change .bar2{opacity: 0;}
.icon-menu.change .bar3{transform: rotate(45deg) translate(-4px, -9px);}

header .user-bar{padding: 15px 15px 25px; width: 100%; background-color: #f6f6f6; position: absolute; top: 55px; left: 0; display: none; box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.05);}
header .user-bar .stat{text-align: left; padding-bottom: 10px;}
header .user-bar.change{display: flex; flex-direction: column;}
header .user-bar .user{align-items: flex-start; flex-direction: column;}
header .user-bar .user .name{padding: 0; margin: 0 0 2px 0; border: 0;}

/*== 
  Auth 
==*/
.auth{padding-top: 130px; margin: 40px 0; width: 290px; background-image: url('../img/logo_auth_mobile.png');}
.text-field:first-child{margin-bottom: 20px;}
.submit-field{margin: 30px 0 0;}

/*== 
  Upload block 
==*/
.upload{padding: 0 15px; margin: 30px auto 60px;}

/*== 
  Orders
==*/
.container.orders{padding-bottom: 40px;}
.orders .search input[type="submit"]{margin: 0 15px;}
.nav{margin-top: 40px;}

/*== 
  Footer 
==*/
.footer{padding: 30px 0 40px;}
.footer .copyright{margin-bottom: 25px;}
}