/* prefixed by https://autoprefixer.github.io (PostCSS: v7.0.26, autoprefixer: v9.7.3) */

body,div,p{
	margin:0;
	padding:0;
}

img{
	border:0;
}

img{
	vertical-align:bottom;
}

a *{
	cursor:pointer;
}

html{
	min-width:220px; 
	height:100%;
}

body{
	font:12px/1.2 Arial, Helvetica, sans-serif;
	position:relative;
	min-width:220px;
	height:100%;
	color:#000;
    -ms-text-size-adjust: none;
    -moz-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
	background: url(bg.jpg);
/*background-size: contain;*/
}

a{
	text-decoration:none; 
}

.btn{
	-webkit-transition:all .3s;
	     -o-transition:all .3s;
	        transition:all .3s;
}

*{
	-webkit-box-sizing:border-box;
	        box-sizing:border-box;
}
*:before,*:after{
	-webkit-box-sizing:border-box;
	        box-sizing:border-box;
}
* ::-moz-selection{
	color:#fff; 
	background:#2600ff;
}
* ::selection{
	color:#fff; 
	background:#2600ff;
}
.bg{
	position:absolute;
	top:0;
	right:0;
	left:0;
	width:100%;
	height:100%; 
	/*background:#666;*/
/*	background: url(bg.png);*/
}

@-webkit-keyframes fadeIn{
	0%{
		opacity:0;
	}

	100%{
		opacity:1;
	}
}

@keyframes fadeIn{
	0%{
		opacity:0;
	}

	100%{
		opacity:1;
	}
}

.fadeIn{
	-webkit-animation-name:fadeIn;
	        animation-name:fadeIn;
}

.wrapper{
	position:relative;
	z-index:10001; 
	display:table;
	width:100%;
	height:100%;
	table-layout:fixed;
}

.container{
	display:table-row;
	height:100vh;
}

.block{
	display:table-cell;
	padding:0 10px; 
	vertical-align:middle;
}

.animated{
	-webkit-animation-duration:.3s;
	        animation-duration:.3s;

	-webkit-animation-fill-mode:both;

	        animation-fill-mode:both;
}

.animated_bg{
	-webkit-animation-duration:1.2s;
	        animation-duration:1.2s;

	-webkit-animation-fill-mode:both;

	        animation-fill-mode:both;
}

.box{
	position:relative;
	overflow:hidden;
	min-width:290px;
	max-width:500px;
	margin:0 auto;
	text-align:center;
	border:1px solid #b3b3b3;
	border-radius:5px;
	background:#fff;
	-webkit-box-shadow:2px 2px 10px rgba(0, 0, 0, .1);
	        box-shadow:2px 2px 10px rgba(0, 0, 0, .1);
}

@-webkit-keyframes zoomIn{
	0%{
		-webkit-transform:scale3d(.3, .3, .3);
		        transform:scale3d(.3, .3, .3); 
		opacity:0;
	}

	50%{
		opacity:1;
	}
}

@keyframes zoomIn{
	0%{
		-webkit-transform:scale3d(.3, .3, .3);
		        transform:scale3d(.3, .3, .3); 
		opacity:0;
	}

	50%{
		opacity:1;
	}
}

.zoomIn{
	-webkit-animation-name:zoomIn;
	        animation-name:zoomIn;
}

.zoomIn2{
	-webkit-animation-name:zoomIn;
	        animation-name:zoomIn;
	        -webkit-animation-delay:3s;
	                animation-delay:3s;
}

.top_panel{
	font-size:24px;
	font-weight:bold;
	line-height:26px;
	padding:15px 18px;
	text-align:left; 
	border-bottom:1px solid #e0e0df;
}
@media screen and (min-width: 0) and (max-width: 620px){
	.top_panel{
		font-size:20px;
		line-height:22px;
		padding:10px 15px;
	}
}
@media screen and (max-width: 1000px) and (max-height: 475px){
	.top_panel{
		display:none;
	}
}

.item{
	margin:15px 0 0;
}
@media screen and (max-width: 1000px) and (max-height: 435px){
	.item{
		margin-top:10px;
	}
}

.accept{
	width:100px;
	height:100px; 
	margin:0 auto 10px;
}
@media screen and (max-width: 1000px) and (max-height: 435px){
	.accept{
		width:75px;
		height:75px;
	}
}
@media screen and (max-width: 1000px) and (max-height: 375px){
	.accept{
		width:45px;
		height:45px;
	}
}
.accept img{
	display:block;
	width:100%;
	height:auto;
}

.title{
	font-size:0;
	color:#555;
}
.title .sign{
	font-size:30px;
	position:relative;
	display:inline-block;
	vertical-align:top;
}
@media screen and (min-width: 0) and (max-width: 620px){
	.title .sign{
		font-size:26px;
		line-height:28px;
	}
}
@media screen and (max-width: 1000px) and (max-height: 400px){
	.title .sign{
		font-size:20px;
		line-height:22px;
	}
}

.text{
	font-size:20px;
	margin:10px 0 0; 
	color:#777;
}
@media screen and (min-width: 0) and (max-width: 620px){
	.text{
		font-size:16px; 
		margin-top:5px;
	}
}
@media screen and (max-width: 1000px) and (max-height: 400px){
	.text{
		font-size:14px;
		line-height:16px;
	}
}

.holder{
	font-size:0; 
	margin:15px 0 0;
}
@media screen and (min-width: 0) and (max-width: 620px){
	.holder{
		padding:0 10px;
	}
}
@media screen and (max-width: 1000px) and (max-height: 435px){
	.holder{
		margin-top:10px;
	}
}

.btmNew{
	margin:0 auto 5px;
	max-width: 320px;
	display: none;
}

.btn{
	font-family:Arial, Helvetica, sans-serif; 
	font-size:25px;
	cursor:pointer;
	vertical-align:top;
	color:#fff;
	border:1px solid #61c161;
	border-radius:5px;
	outline:none;
	background: #57CA3A;
	background: -o-linear-gradient(top,  rgba(87,202,58,1) 0%,rgba(47,159,58,1) 100%);
	background: -webkit-gradient(linear,  left top, left bottom,  from(rgba(87,202,58,1)),to(rgba(47,159,58,1)));
	background: linear-gradient(to bottom,  rgba(87,202,58,1) 0%,rgba(47,159,58,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#57ca3a', endColorstr='#2f9f3a',GradientType=0 );
	-webkit-box-shadow:inset 0 0 0 1px #7ecc7e;
	        box-shadow:inset 0 0 0 1px #7ecc7e;
        -webkit-appearance:none;
	-webkit-box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.75);
        box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.75);
	text-shadow: 0px 0px 20px rgba(5,5,5,0.37), 0px 0px 20px rgba(5,5,5,0.37);
	display: block;
	margin: 0 auto;
	padding: 0px;
	max-width: 320px;
}

@media screen and (min-width: 0) and (max-width: 620px){
	.btmNew{
		margin:0 auto 5px;
		min-width: 260px;
	}
	.btn{
		padding: 0;
		line-height: 25px;
		min-width:260px;
	}
}
@media screen and (max-width: 1000px) and (max-height: 500px){
	.btmNew{
		margin:0 auto 3px;
	}
	.btn{
		line-height:25px;
		padding:0;
	}
}
@media screen and (max-width: 1000px) and (max-height: 400px){
	.btmNew{
		margin:0 auto 5px;
	}
	.btn{
		line-height:25px;
		padding: 0;
	}
}
.btn span{
	font-size:30px; 
	display:inline-block;
	vertical-align:middle;
	padding: 10px 0px;
}
@media screen and (min-width: 0) and (max-width: 620px){
	.btn span{
		font-size:28px;
	}
}
@media screen and (max-width: 1000px) and (max-height: 400px){
	.btn span{
		font-size:25px;
	}
}
.btn .ico_arrow{
	display:inline-block;
	margin:0 0 0 15px;
	vertical-align:middle;
}
.btn .ico_arrow img{
	display:inline-block;
	vertical-align:middle;
}

.cancel{
	margin-top:15px;
	padding:15px; 
	text-align:center;
	border-top:1px solid #fff;
	background:#fff;
	-webkit-box-shadow:inset 0 1px 1px #fff;
	        box-shadow:inset 0 1px 1px #fff;
}
@media screen and (max-width: 1000px) and (max-height: 500px){
	.cancel{
		padding:10px;
	}

}
@media screen and (max-width: 1000px) and (max-height: 435px){
	.cancel{
		margin-top:10px;
	}
}
@media screen and (max-width: 1000px) and (max-height: 375px){
	.cancel{
		padding:5px;
	}
}

.footer{
	background: #666666;
	padding: 0px;

	position: absolute;
    top: -webkit-calc(100% - 30px);
    top: -moz-calc(100% - 30px);
    top: calc(100% - 30px);
    left: 0;
    right: 0;
    margin: 0 auto;
}

.footer__text{
	font-family: 'Arial Narrow';
	text-align: center;
	margin-bottom: 10px;
	font-size: 12px;
	color: #ababab;
}
.btn-container {
    margin: 10px auto;
    max-width: 1140px;
    width: 70%;
    min-width: 290px;
    display: flex;
    justify-content: space-between;
}
.btn-bottom {
    color: #ffffff82;
    font-family: Arial;
    padding: 10px 15px;
    text-align: center;
    font-size: 15px;
    width: 25%;
    margin: 0 5px;
		background-color: #fff3;
		line-height: 1;
}
.tr4 {
    display: block;
    text-align: center;
    color: #ababab;
    font-weight: bold;
}

/**/
/**/
/*POPUP STYLES*/

.popup_progress_box{
	max-width: 300px;
	width: 100%;
	margin: 0 auto 15px;
}
.counter{
	font-size: 40px;
	text-align: center;
	
}
.loading_bar_container{
	width: 100%;
	background: lightgray;
	height: 25px;
	border-radius: 15px;
	overflow:hidden;
}
.loading_bar_container>div{
	background: orange;
	height: 25px;
	border-radius: 15px;
}
.loading_bar{
	width: 0%;
}
/*Media Requests*/
/*PC*/
/*4k mac*/
/*6720x3780*/
/*в браузере: 3360x1755*/
@media screen and (max-width: 3380px)and (max-height:1760px){
  .block{
      -webkit-transform: scale3d(2,2,2);
              transform: scale3d(2,2,2);
              height: 100%;
  }
  .container{
  	height: 100vh;
  }
  .footer{
  	font-size: 24px;
  }
}
/*4K windows*/
/*3840x2160*/
/*в браузере: 2543x1300*/
@media screen and (max-width: 2600px)and (max-height:1350px){
	.block{
	    -webkit-transform: scale3d(1.5,1.5,1.5);
	            transform: scale3d(1.5,1.5,1.5);
	            height: 100%;
	}
	.container{
		height: 100vh;
	}
	.footer{
		font-size: 18px;
	}
}

/*2K*/
/*2048x1536*/
/*в браузере: 2031x1386*/
@media screen and (max-width: 2033px)and (max-height:1390px) {
	.block{
	    -webkit-transform: scale3d(1.2,1.2,1.2);
	            transform: scale3d(1.2,1.2,1.2);
	            height: 100%;
	}
	.footer{
		font-size: 12px;
	}
}

/*1920x1200*/
/*в браузере: 1903x1050*/
@media screen and (max-width: 1920px)and (max-height:1060px) {
	.block{
	    -webkit-transform: scale3d(1,1,1);
	            transform: scale3d(1,1,1);
	            height: 100%;
	}
	.container{
		height: 100vh;
	}
	
	.footer{
		font-size: 12px;
	}
}
/*Media requests*/
/*Windows 1440*900 */
@media screen and (max-width: 1440px)and (max-height:789px) {
	.btmNew{
		margin:0 auto 5px;
	}
	.btn{
		padding: 0px;
	}
}
/*Ipad Pro 12.9 2018 - album*/
@media screen and (max-width: 1367px)and (max-height:981px) {
	.btmNew{
		margin:0 auto 5px;
	}
    .btn{
    	padding: 0px;
    }
}
/*Ipad Pro 12.9 2017 - Portrait*/
@media screen and (max-width: 1025px)and (max-height:1327px) {
}

/*Nexus 7 - Album - Mozilla*/
/*Ipad Pro 11 2018 - portrait*/
@media screen and (max-width: 835px)and (max-height:1151px) {
}
/*Iphone XS max, Iphone XR - Album - Safary*/
/*Tab 4  - Portrait*/
@media screen and (max-width: 801px)and (max-height:1160px) {
	.popup_progress_box{
		margin-bottom: 5px;
		margin-top: -100px;
	}
}
/*Nexus 7 - Album - Chrome*/
@media (orientation: landscape) and (max-width: 900px)and (max-height:500px) {
    .counter{
    	font-size: 28px;
    }
	.popup_progress_box{
		margin-bottom: 5px;
		margin-top: -3vh;
	}
}
/*Samsung Galaxy J5 - Album /office*/
@media screen and (max-width: 641px)and (max-height:281px) {
	.btmNew{
		margin:0 auto 5px;
	}
	.popup_progress_box{
		margin-bottom: 5px;
	}
	.btn{
		padding: 0px;
	}
	.btn span{
		padding: 5px 0px;
	}
	.counter{
		font-size: 20px;
	}
	.loading_bar_container,
	.loading_bar_container>div{
		height: 10px;
		border-radius: 10px;
	}
}
/*Iphone 5S - Album - Chrome*/
@media screen and (max-width: 569px)and (max-height:244px) {
	.counter{
		font-size: 20px;
	}
	.popup_progress_box{
		margin-bottom: 5px;
		margin-top: -100px;
	}
	.loading_bar_container,
	.loading_bar_container>div{
		height: 10px;
		border-radius: 10px;
	}
	.btmNew{
		margin:0 auto 5px;
	}
	.btn{
		padding: 0px;
	}
	.btn span{
		padding: 5px 0px;
	}

}
/*Iphone 4S - Album */
@media screen and (max-width: 481px)and (max-height:209px) {
	.loading_bar_container,
	.loading_bar_container>div{
		height: 10px;
		border-radius: 10px;
	}
}
/*Iphone Xs max, Iphone XR - Port - Safary*/
@media screen and (max-width: 415px)and (max-height:832px) {
	.counter{
		font-size: 30px;
	}
}

/*Iphone 4S - Port */
@media screen and (max-width: 321px)and (max-height:357px) {
	.loading_bar_container,
	.loading_bar_container>div{
		height: 10px;
		border-radius: 10px;
	}
	.counter{
		font-size: 20px;
	}
}

@media screen and (max-width: 500px) and (max-height: 870px) {
	.btn-container {
		width: 100%;
	}
	.btn-bottom {
		padding: 10px;
		font-size: 14px;
	}
}