@charset "utf-8";
/* CSS Document */
.modal-window {
-webkit-transform: translate(0, 100%);
-moz-transform: translate(0, 100%);
-o-transform: translate(0, 100%);
-ms-transform: translate(0, 100%);
transform: translate(0, 100%);
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 9999;
opacity: 0;
line-height: 1.3;
display: none\9;
background:rgba(0,0,0,0.65);
}
.modal-window:target {
-webkit-transform: translate(0, 0);
-moz-transform: translate(0, 0);
-o-transform: translate(0, 0);
-ms-transform: translate(0, 0);
transform: translate(0, 0);
opacity: 1;
}
.is-active.modal-window {
display: block\9;
}
.modal-window:target {
display: block\9;
}
.modal-window .modal-inner iframe,
.modal-window .modal-inner > div.txt {
position: absolute;
top: 10%;
left: 50%;
z-index: 20;
margin-left: -490px;
width: 980px;
height:550px;
overflow: hidden;
-webkit-box-shadow: 0 0 30px rgba(0, 0, 0, 0.6);
box-shadow: 0 0 30px rgba(0, 0, 0, 0.6);
}
.modal-window .modal-inner > div.txt{ margin-left:-200px; width:400px; height:200px; top:20%; background:#fff; box-sizing:border-box; padding:30px 10px;}
.modal-window .modal-inner > div.txt p{ margin-bottom:10px; text-align:center;}
.modal-window .modal-close {
display: block;
text-indent: -100px;
overflow: hidden;
}
.modal-window .modal-close:before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 10;
}
.modal-window .modal-close:after {
content: '\00d7';
position: absolute;

top: 7%;
left: 50%;
border-radius:50%;
z-index: 20;
margin-left: 480px;

background: #3182e5;
color:#fff;
padding: 0 8px;
font-size: 2em;
text-decoration: none;
text-indent: 0;
-webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.6);
box-shadow: 0 0 10px rgba(0, 0, 0, 0.6);
}

.modal-window {
-webkit-transition: opacity 0.4s;
-o-transition: opacity 0.4s;
transition: opacity 0.4s;
}

@media screen and (max-width: 960px) and (min-width:641px){
.modal-window .modal-inner {
	position: relative;
	top: 0;
	right:40%;
	text-align:center;
	z-index: 9999;
	width: 90%;
	padding-top: 50%;
	vertical-align:middle;
}
.modal-window .modal-inner iframe,
.modal-window .modal-inner > div.txt {
	top:10%;
  position: absolute;
  width: 100% !important;
  max-width:980px;
  height: 100% !important;
  display: block;
  margin: 0px auto;
}
.modal-window .modal-inner > div.txt { top:30% !important; height:200px !important; }
.modal-window .modal-close:after {
content: '\00d7';
position: absolute;
top: 2%;
left:50%;
margin-left: 43%;

border-radius:50%;
z-index: 9999;

background: #3182e5;
color:#fff;
padding: 0 7px;
text-align:center;
font-size: 2em;
width:20px;
height:34px;
line-height:1;

text-decoration: none;
text-indent: 0;
-webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.6);
box-shadow: 0 0 10px rgba(0, 0, 0, 0.6);
}
}



@media screen and (max-width:640px){
.modal-window .modal-inner {
	position: relative;
	top: 0;
	right:40%;
	text-align:center;
	z-index: 9999;
	width: 90%;
	padding-top: 50%;
	vertical-align:middle;
}
.modal-window .modal-inner iframe,
.modal-window .modal-inner > div.txt {
	top:60%;
  position: absolute;
  width: 100% !important;
  max-width:980px;
  height: 100% !important;
  display: block;
  margin: 0px auto;
}
.modal-window .modal-inner > div.txt{ padding:30px 10px; height:200px !important;}
.modal-window .modal-close:after {
content: '\00d7';
position: absolute;
top: 15%;
left:50%;
margin-left: 40%;

border-radius:50%;
z-index: 9999;

background: #3182e5;
color:#fff;
padding: 0 7px;
text-align:center;
font-size: 2em;
width:20px;
height:34px;
line-height:1;

text-decoration: none;
text-indent: 0;
-webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.6);
box-shadow: 0 0 10px rgba(0, 0, 0, 0.6);
}
}
