/*--------[Основная разметка блоков]------------*/

.g_fon{
    width: 100%;
    height:100%;
    position: fixed;
    background: rgba(2,2,2,0.5);
    top: 0px;
    left: 0px;
    z-index: 9999999999999999;
    display:none;
		overflow-x:hidden;
		overflow-y: scroll;
    display: flex;
    justify-content: center;
    align-items: center;
}
.g_pos{
	/*display: table;*/
	z-index: 9;
	border-radius: 3px;
	margin: 0 auto;
}
.g_frame{
  background: rgba(255,255,255,255);
	border: none; 
	border-radius: 3px;	
  box-shadow: 0 0 10px rgba(0,0,0,0.5); 
	position :relative;
	/*overflow: hidden;*/
}/*
.g_frame::after{
    content: "x";
    position: absolute;
    top: -.2rem;
    width: 2rem;
    right: -.2rem;
    height: 2rem;
    background: white;
    border-radius: var(--radius);
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    color: silver;
		
		transition: color .3s;
}
.g_frame::after:hover{    
    color: #444;
}
*/
.g_cross{
	position: absolute;
  top: 0;
  right: 0;
	z-index: 2;
	width: var(--padding-big);
	height: var(--padding-big);
	background: white;
	color: silver;
	
	display: flex;
	justify-content: center;
	align-items: center;
	
	cursor: pointer;
	border-top: 2px solid #999;
	
	transition: color .2s;
}
.g_cross:hover{
	color: #444;
}
.g_cross::before{
	content: "×";
}


.no_select {
user-select: none;
-o-user-select: none;
-moz-user-select: none;
-khtml-user-select: none;
}

.g_iframe{
	min-width: 400px;
	min-height: 400px;
	width: 85vw;
	height: 85vh;
	background: white;
}
.g_iframe_ticket{
	min-width: 400px;
	min-height: 400px;
	height: 85vh;
	background: white;
}

.g_bottom{
	padding: var(--padding);
	background: white;
	width: 85vw;
	min-width: 400px;
}
/*----------*/

.g_close::before{
	content: "×";
	position: absolute;
	top: 0em;
	right: 0.4em;
	font-size: 4rem;
}
.g_close::before{
	color: #bebebe;
	text-shadow: 0 1px 3px #000000;
	opacity: 0.2;
	transition: opacity .2s .1s, color .2s .1s;
}
.g_close:hover::before{
	color: #bebebe;
	opacity: 1;
}


.show {
	animation: fadeIn ease-in-out .2s;
	animation-fill-mode: forwards;
}
.hide {
	animation: fadeOut ease-in-out .2s;
	animation-fill-mode: forwards;
}
@keyframes fadeIn {
	0% {opacity:0; display: flex}
	100% {opacity:1;}
}
@keyframes fadeOut {
	0% {opacity:1;}
	100% {opacity:0; display: none}
}

@media (min-width: 739px) {
	.g_cross {
		display: none;
	}
}