* {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
/*	transition:0.2s;*/
}
body {
	font-family: 'open sans';
	overflow: hidden; 
	width: 100%;
	height: 100%;
}


/*-------------------------------------*/
/*------------START ANIMATE------------*/
/*-------------------------------------*/
#page-preloader {
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: #fff;
    z-index: 500;
	overflow: hidden;
	}

#start {
    margin: auto;
    width: 100%;
    text-align: center;
    top: 0;
    bottom: 0;
    height: 260px;
    position: absolute;
	}
.letter { font-size: 72pt; display: inline-block; color: #575656; opacity: 0;  font-family: 'DaxlinePro', sans-serif; font-weight: 600; letter-spacing: -2px;}
#letter1, #letter2 { color: #bd1e85; }

#start.active #letter1 { opacity: 1; -webkit-transition: all .1s ease; -moz-transition: all .1s ease; -ms-transition: all .1s ease; -o-transition: all .1s ease; transition: all .2s ease;}
#start.active #letter2 { opacity: 1; -webkit-transition: .1s all .1s ease; -moz-transition: .1s all .1s ease; -ms-transition: .1s all .1s ease; -o-transition: .1s all .1s ease; transition: .2s all .1s ease;}
#start.active #letter3 { opacity: 1; -webkit-transition: .1s all .2s ease; -moz-transition: .1s all .2s ease; -ms-transition: .2s all .1s ease; -o-transition: .2s all .1s ease; transition: 1.5s all .8s ease;}
#start.active #letter4 { opacity: 1; -webkit-transition: .1s all .3s ease; -moz-transition: .1s all .3s ease; -ms-transition: .3s all .1s ease; -o-transition: .3s all .1s ease; transition: 1.5s all 1.1s ease;}
#start.active #letter5 { opacity: 1; -webkit-transition: .1s all .4s ease; -moz-transition: .1s all .4s ease; -ms-transition: .4s all .1s ease; -o-transition: .4s all .1s ease; transition: 1.5s all 1.2s ease;}
#start.active #letter6 { opacity: 1; -webkit-transition: .1s all .5s ease; -moz-transition: .1s all .5s ease; -ms-transition: .5s all .1s ease; -o-transition: .5s all .1s ease; transition: 1.5s all 1.4s ease;}
#start.active #letter7 { opacity: 1; -webkit-transition: .1s all .6s ease; -moz-transition: .1s all .6s ease; -ms-transition: .6s all .1s ease; -o-transition: .6s all .1s ease; transition: 1.5s all 1.6s ease;}
#start.active #letter8 { opacity: 1; -webkit-transition: .1s all .7s ease; -moz-transition: .1s all .7s ease; -ms-transition: .7s all .1s ease; -o-transition: .7s all .1s ease; transition: 1.5s all 1.8s ease;}
#start.active #letter9 { opacity: 1; -webkit-transition: .1s all .8s ease; -moz-transition: .1s all .8s ease; -ms-transition: .8s all .1s ease; -o-transition: .8s all .1s ease; transition: 1.5s all 2s ease;}
#start.active #letter10 { opacity: 1; -webkit-transition: .1s all .9s ease; -moz-transition: .1s all .9s ease; -ms-transition: .9s all .1s ease; -o-transition: .9s all .1s ease; transition: 1.5s all 2.2s ease;}
#start.active #letter11 { opacity: 1; -webkit-transition: .1s all 1.0s ease; -moz-transition: .1s all 1.0s ease; -ms-transition: 1.0s all .1s ease; -o-transition: 1.0s all .1s ease; transition: 1.5s all 2.4s ease;}

.transcription { font-size: 20pt; color: #575656; font-family: Arial, sans-serif;; opacity: 0; position: relative; top: -15px; margin-bottom: 15px;}
#start.active  .transcription { transition: .6s all 2.2s ease; opacity: .6; top: 0px;}

.wor { font-size: 20pt; color: #575656; display: inline-block;  opacity: 0; font-weight: 600;}

#start.active #wor1 {opacity: 1; transition: 1.0s all 2.8s ease;}
#start.active #wor2 {opacity: 1; transition: 1.0s all 3.8s ease;}
#start.active #wor3 {opacity: 1; transition: 1.0s all 4.8s ease;}

.load { 
	position: relative; 
	background: #bd1e85; 
	height: 6px;  
	left: 0; 
	top: 0;
	width: 0;
    transition: 5s all .2s ease;
    margin: 35px 0;
	}
#start.active .load { width: 100%; }

/*-------------------------------------*/
/*-------------------------------------*/
/*-------------------------------------*/


/*-------------------------------------*/
/*-------------IFRAME LINE-------------*/
/*-------------------------------------*/
#frame { position: fixed; width: 0; height: 0; top: 0; left: 0; z-index: 100; display: none;}
#frame-mob {   
	display: none;
	position: fixed;
    top: 0;
    background: #BD1E85;
    background: rgba(189, 30, 133, 0.8);
    width: 100%;
    height: 52px;
	z-index: 250;
	}
#frame.active, #frame-mob.active { display: block;}

#frame-mob #frame_image_mob { right: 10px; color: #fff; top: 1px; } 
#frame-mob #frame_image_mob .black { color: #fff; } 
#frame-mob #frame_button_mob { background: none; }


#frame_image, #frame_image_mob {
	font-size: 34px;
	font-family: 'DaxlinePro', sans-serif;
    font-weight: bold;
	position:fixed ;
	cursor:pointer;
	color: #bd1e85;
	top: 3px;
	transition: .2s all .3s ease;
	}
#frame_image .black { color: #404040; transition: .2s all .3s ease;}
#frame.menuopened #frame_image, #frame.menuopened #frame_image .black { color: #fff;	transition: .2s all .3s ease; }

/*--------------line------------------*/
.frame_line, .close_line { background: #bd1e85; position:fixed; width:10px; height:10px; }
.close_line { background: #ff6fcc; }

/*----------not animate---------------*/
#frame_line_top, #frame_line_bottom { width: 0;}
#frame_line_left, #frame_line_right { height: 0; }

#frame .frame_line:before {
	position: absolute; 
	left: 0;
	top: 0;
	content: ""; 
	background: #FF6FCC ;
	}
/*-----------line hover---------------------*/
#frame #frame_line_top.frame_line_first:before,
#frame #frame_line_bottom.frame_line_first:before { height: 10px; width: 0; }
#frame #frame_line_right.frame_line_first:before,
#frame #frame_line_left.frame_line_first:before { width: 10px; height: 0; }

#frame.menuopened #frame_line_top.frame_line_first:before,
#frame.menuopened #frame_line_bottom.frame_line_first:before { width: 100%; }
#frame.menuopened #frame_line_right.frame_line_first:before,
#frame.menuopened #frame_line_left.frame_line_first:before { height: 100%;}

#frame.menuopened #frame_line_top.frame_line_first:before,
#frame.menuopened #frame_line_left.frame_line_first:before {
    -webkit-transition: all .2s linear;
    -moz-transition: all .2s linear;
    -ms-transition: all .2s linear;
    -o-transition: all .2s linear;
    transition: all .2s linear;	
	}	
	
#frame.menuopened #frame_line_right.frame_line_first:before, 
#frame.menuopened #frame_line_bottom.frame_line_first:before {
    -webkit-transition: .2s all .2s linear;
    -moz-transition: .2s all .2s linear;
    -ms-transition: .2s all .2s linear;
    -o-transition: .2s all .2s linear;
    transition: .2s all .2s linear;	
	}

#frame #frame_line_right.frame_line_first:before, 
#frame #frame_line_bottom.frame_line_first:before {
    -webkit-transition: all .2s linear;
    -moz-transition: all .2s linear;
    -ms-transition: all .2s linear;
    -o-transition: all .2s linear;
    transition: all .2s linear;
	}
#frame #frame_line_top.frame_line_first:before,
#frame #frame_line_left.frame_line_first:before {
    -webkit-transition: .2s all .2s linear;
    -moz-transition: .2s all .2s linear;
    -ms-transition: .2s all .2s linear;
    -o-transition: .2s all .2s linear;
    transition: .2s all .2s linear;	
	}	
	
/*------button line----------------*/
#frame_button, #close_button, #frame_button_mob {
	background: #bd1e85;
	position:fixed ;
	width:52px ;
	height:52px ;
	cursor:pointer;
	-webkit-transition: all .4s ease;
	-moz-transition: all .4s ease;
	-ms-transition: all .4s ease;
	-o-transition: all .4s ease;
	transition: all .4s ease;
}
#frame.menuopened #frame_button, #close_button { background: #FF6FCC; }

#frame.menuopened #frame_button .con, #frame-mob.menuopened #frame_button_mob .con, .close_con { 
	 -moz-transform: rotateZ(45deg); /* Для Firefox */
    -ms-transform: rotateZ(45deg);/* Для IE */
    -webkit-transform: rotateZ(45deg); /* Для Safari, Chrome, iOS */
    -o-transform: rotateZ(45deg); /* Для Opera */
	transform: rotateZ(45deg); 
	}
.con, .special-con { cursor: pointer; display: inline-block; }

.bar {
	display: block;
    height: 4px;
    width: 33px;
    background: #fff;
    margin: 6px auto;
    }

.con {
      width: auto;
      margin: 9px 11px;
      -webkit-transition: all .5s ease;
      -moz-transition: all .5s ease;
      -ms-transition: all .5s ease;
      -o-transition: all .5s ease;
      transition: all .5s ease;
    }
	
.col {
      display: inline-block;
      width: 24%;
      text-align: center;
      height: auto;
      position: relative;
    }

.middle { margin: 0 auto; }

.bar {
      -webkit-transition: all .5s ease;
      -moz-transition: all .5s ease;
      -ms-transition: all .5s ease;
      -o-transition: all .5s ease;
      transition: all .5s ease;
    }

.con:hover .top, #frame.menuopened #frame_button .top, #frame-mob.menuopened #frame_button_mob .top, .close_top {
      -webkit-transform: translateY(10px) rotateZ(90deg);
      -moz-transform: translateY(10px) rotateZ(90deg);
      -ms-transform: translateY(10px) rotateZ(90deg);
      -o-transform: translateY(10px) rotateZ(90deg);
      transform: translateY(10px) rotateZ(90deg);
      
    }

.con:hover .bottom, #frame.menuopened #frame_button .bottom, #frame-mob.menuopened #frame_button_mob .bottom{
      -webkit-transform: translateY(-10px) rotateZ(90deg);
      -moz-transform: translateY(-10px) rotateZ(90deg);
      -ms-transform: translateY(-10px) rotateZ(90deg);
      -o-transform: translateY(-10px) rotateZ(90deg);
      transform: translateY(-10px) rotateZ(90deg);
    }

.close_con  {position: relative; top: 9px; left: 4px;}
/*-------------------------------------*/
/*-------------------------------------*/
/*-------------------------------------*/


/*-------------------------------------*/
/*---------------MENU------------------*/
/*-------------------------------------*/
#menu {
	position:fixed ;
	top:0;
	width:100% ;
	height:0% ;
	overflow:hidden;
	z-index: 90;
	opacity: 0;
	-webkit-transition: opacity .2s ease;
	-moz-transition: opacity .2s ease;
	-ms-transition: opacity .2s ease;
	-o-transition: opacity .2s ease;
	transition: .2s all .7s ease;
	}
#menu.menuopened {
	height:100% ;
	opacity: 1;
	-webkit-transition: .2s all .3s ease;
	-moz-transition: .2s all .3s ease;
	-ms-transition: .2s all .3s ease;
	-o-transition: .2s all .3s ease;
	transition: .2s all .3s ease;
	}

#menu  .menu-animate {
	background:#BD1E85;
	width: 25%;
	position: absolute;
	top: 0;
	height: 0%;
	}
#menu.menuopened  .menu-animate { height: 100%;}

#menu  #manim1.menu-animate {
	left: 0;
	transition: .4s all .5s linear;
	}
#menu  #manim2.menu-animate {
	left: 25%;
	transition: .4s all .4s linear;
	}
#menu  #manim3.menu-animate {
	left: 50%;
	transition: .4s all .3s linear;
	}
#menu  #manim4.menu-animate {
	left: 75%;
	transition: all .6s linear;
	}

#menu.menuopened  #manim1.menu-animate {
	transition: all .6s linear;
	}
#menu.menuopened  #manim2.menu-animate {
	transition: .4s all .3s linear;
	}
#menu.menuopened  #manim3.menu-animate {
	transition: .4s all .4s linear;
	}
#menu.menuopened  #manim4.menu-animate {
	transition: .4s all .5s linear;
	}
	

	
.menu_column { position:relative; float: left; width: 50%; }
#menu_column_left { padding-left: 100px; }
#menu_column_left  .menu_column_header { margin-left:16px; }
#menu_column_right { }
.menu_column_header {
	font-size: 12px;
	color:#FF6FCC;
	padding-bottom: 5px;
	min-width:104px ;
	border-bottom:2px solid #FF6FCC ;
	margin-bottom:30px;
	display:inline-block;
}
.menu_column_elem {
	color: #fff;
    font-size: 55px;
    margin-bottom: 0px;
    padding-left: 16px;
    font-weight: bold;
    cursor: pointer;
    text-transform: lowercase;
    line-height: 60px;
	height: 65px;
	overflow: hidden;
	position :relative; 
}
.menu_column_elem a { text-decoration: none; }
.menu_column_elem p.white { color: #fff; }
.menu_column_elem p.pig { color: #FF6FCC; right: 15px; position: relative;}

.menu_column_elem .menu-container {
      -webkit-transition: all .2s linear;
      -moz-transition: all .2 linear;
      -ms-transition: all .2s linear;
      -o-transition: all .2s linear;
      transition: all .2s linear;
	  position: relative;
	  top: -65px;
	}
.menu_column_elem:hover .menu-container, .menu_column_elem.selected  .menu-container{
		top: 0px;
      -webkit-transition: all .2s linear;
      -moz-transition: all .2s linear;
      -ms-transition: all .2s linear;
      -o-transition: all .2s linear;
      transition: all .2s linear;
}
.menu_subcolumn { display: inline-block; vertical-align: top; }
.menu_column_text { color: #fff; font-size: 13px; margin-bottom: 18px; }

#menu_subcolumn_left { margin-right: 65px;}
.menu_column_href {
	display: block;
	font-size: 11px;
	margin-bottom: 4px;
	color: #CE56A4;
	text-decoration: underline;
}
.menu_column_href:hover { text-decoration: none; }
.menu_column_href span { color:#fff ; }
@media only screen and (max-width: 800px),
only screen and (max-device-width: 800px) {
	.menu_column_elem { 
		font-size: 30px;
		line-height: 35px;
		height: 35px;
		}
	.menu_column_elem .menu-container {    top: -35px;}
	}

/*-------------------------------------*/
/*-------------------------------------*/
/*-------------------------------------*/


/*-------------------------------------*/
/*-----------ANIMATE LOAD--------------*/
/*-------------------------------------*/	
#frame-load { position: absolute; height: 0px; width: 100%;  }
#frame-load.active { height: 6px; }
.load-right, .load-left { 
	background: #fff; 
	height: 6px; 
	position: absolute; 
	-webkit-transition: all .7s ease;
    -moz-transition: all .7s ease;
    -ms-transition: all .7s ease;
    -o-transition: all .7s ease;
    transition: all .7s ease;
	top: 0; 
	width: 0px;
	}
.load-right { right: 50%;}
.load-left { left: 50%; }

.load-proces { 
	position: absolute; 
	background: #bd1e85; 
	height: 6px;  
	left: 0; 
	top: 0;
	width: 0;
	-webkit-transition: 2s all .7s ease;
    -moz-transition: 2s all .7s ease;
    -ms-transition: 2s all .7s ease;
    -o-transition: 2s all .7s ease;
    transition: 2s all .7s ease;
	}
#frame-load.active .load-right, #frame-load.active .load-left { width: 50%;  }
#frame-load.active .load-proces { width: 100%; }
/*-------------------------------------*/
/*-------------------------------------*/
/*-------------------------------------*/


/*-------------------------------------*/
/*--------------FOOTER-----------------*/
/*-------------------------------------*/
#footer { position: relative; }
#footer_contacts{
    background: #bd1e85;
    padding: 50px 0 50px 50%;
    color: #fff;
    font-family: 'open sans';
    font-size: 12px;
	position: absolute;
    bottom: 0;
    width: 100%;
    opacity: 0;
	-webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -ms-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease;
	z-index: 5;
}


#footer_contacts.fixed { 
	position: fixed; 
	bottom: 0; 
	opacity: 0.8;
	-webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -ms-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease;
	}
#footer_contacts.absolute {
	position: absolute;
	bottom: 0;
	opacity: 0.8;
	}

.footer_column{ display: inline-block; vertical-align: top; }
#footer_column_1 { margin-right: 54px; }
#footer_column_2 { margin-right: 85px; }
#footer_contacts a { color: #fff; display: block; }
#footer_contacts a:hover { text-decoration:none; }

#map-canvas { /*margin-top: 250px;*/ height: 1000px; }
/*-------------------------------------*/
/*-------------------------------------*/
/*-------------------------------------*/


/*-------------------------------------*/
/*------------MAIN PAGE----------------*/
/*-------------------------------------*/

/*
#map_tag {
	position: absolute;
    top: -230px;
	bottom: 0;
    left: 0;
	right: 0;
    width: 108px;
    height: 143px;
    margin: auto;
    background: url(../img/map_tag.png) no-repeat;
	background-size: 100%; 
	background-position: center bottom;
	opacity: 0.8;
    z-index: 1;
}
*/ 


div#about_emg {
	color: #575656;
    font-size: 12px;
	line-height: normal;
	font-family: 'open sans';
	background-size: cover;
}
#about_emg_pretitle {}
#about_emg_title {
	font-size: 72;
    font-family: 'DaxlinePro';
    font-weight: bold;
}
#about_emg_title span {
	color: #BD1E85;
}
#about_emg_desc {
	font-weight: 600;
    font-size: 20px;
}
#about_emg_awards{
	max-width: 770px;
	margin: 0 auto 60px;
}
#about_emg_awards img {
	margin: 40px 30px 0;
	vertical-align: middle;
}


#clients , #about_emg {
    background: url(../img/client_bg.jpg) no-repeat 50% 50%;
    background-attachment: fixed;
	background-size: 100%;
    font-size: 0;
    line-height: 0;
   /* padding: 120px 0 180px;*/
    text-align: center;
	position: relative;
    z-index: 6;
	padding: 0; display: table; width: 100%;
}
#clients {  }
.client_align { display: table-cell; vertical-align: middle; }

#client_container {
    max-width: 1000px;
    margin: auto;
}
.client {
	width: 202px;
    height: 202px;
    display: inline-block;
    background: url() no-repeat 50% 50%;
    border: 2px solid white;
    margin-top: -2px;
    margin-left: -2px;
	opacity:0;
	position: relative;
	}

.client.visible{
	opacity:1;
	-webkit-transition: .6s all .4s ease;
    -moz-transition: .6s all .4s ease;
    -ms-transition: .6s all .4s ease;
    -o-transition: .6s all .4s ease;
    transition: .6s all .4s ease;
}

.client .client_text {
	font-size: 20px; 
	text-transform: uppercase; 
	font-weight: bold; 
	line-height: 24px; 
	font-family: 'Verdana', sans-serif; 
	position: absolute;
	top: 32%;
	bottom: 0;
	right: 0;
	left: 0; 
	margin: auto; 
	}
.client .client_text span { font-size: 17px; }
.case_cont {
	background: url() #fff no-repeat;
    /*background-attachment: fixed; */
	/*background-position: center center;*/
	background-size: 100%;
	position: relative;
}
.case {
	margin: auto;
	background: url() #bd1e85 no-repeat;
	background-size: 100% auto;
    /*background-attachment: fixed;*/
	/*background-position: center center;*/
	position: relative; 
}

.case_text {
    text-align: center;
    position: absolute;
    top: 0;
	bottom: 0;
	right: 0;
    left: 0;
	margin: auto;
	width: 100%;
	height: 100px;
	transition:0.5s;
	transition-delay:0.5s;
}

.case_header {
	font-family:'open sans';
	font-weight:bold;
	font-size:36px;
	color:#fff;
	text-transform: uppercase;
}
.case_desc, .case_title {
	font-family:'open sans';
	font-size:16px;
	color:#fff;
	margin-top: 2px;
}

.case_play {
    background: #fff;
    display: inline-block;
    border-radius: 32px;
	height:0;
	margin:0;
	padding:0;
	overflow:hidden;
	transition:0.5s;
	transition-delay:0.5s;
	font-size: 0;
	cursor: pointer; 
}
.case_play_text {
	font-family: 'DaxlinePro';
	font-size:12px;
	font-weight:bold;
	color:#bd1e85;
	display: inline-block;
    vertical-align: middle;
	padding: 0;
	width: 0px;
	height: 17px;
    overflow: hidden;
	transition:0.5s;
	cursor: pointer; 
}
.case_play_text_wrapper {
    width: 100px;
    text-align: center;
}
.case_play_button {
	background: #bd1e85 ;
	display: inline-block;
    vertical-align: middle;
	width: 0px;
    height: 0px;
	border-radius: 26px;
	transition:0.5s;
	transition-delay:0.5s;
}
.case_play_button_arrow {
	height:100%;
	background:url(../img/case_show_arrow.png) no-repeat 10px 8px ;
}

.case:hover .case_text {
	height: 155px;
	transition:0.5s;
}
.case:hover .case_play {
	height:32px;
    padding: 2px;
    margin: 10px 0 14px;
	transition:0.5s;
}
.case:hover .case_play_button {
	width: 28px;
    height: 28px;
	transition:0.5s;
}
.case:hover .case_play_text {
    width: 100px;
    padding: 0px 10px 0 12px;
	transition:0.5s;
	transition-delay:0.5s;
}	

.pig_title {
    font-family: 'open sans';
    font-weight: bold;
    font-size: 36px;
    color: #bd1e85;
    text-transform: uppercase;
    margin: 0px 20px 50px;
    line-height: 40px;
	text-align: center;
	}
#footer .pig_title {
    position: absolute;
    top: 13%;
    z-index: 5;
    margin: auto;
    right: 0;
    left: 0;
    padding: 0 20px;
}
/*-------------------------------------*/
/*-------------------------------------*/
/*-------------------------------------*/


/*-------------------------------------*/
/*---------TWO PAGE (CASE)-------------*/
/*-------------------------------------*/	
#framevideo {
	position: fixed;
    left: 0;
	top: 0;
    right: 0;
    bottom: 0;
/*	background: #bd1e85;
	background: rgba(189,30,133,.8);*/
    z-index: 999;
	text-align: center;
	width: 100%;
	height: 100%;
	border: none;

	}
/*
#video.active { 
	opacity: 1; 
	overflow: visible; 
	width: 100%;
	-webkit-transition: opacity .4s ease;
    -moz-transition: opacity .4s ease;
    -ms-transition: opacity .4s ease;
    -o-transition: opacity .4s ease;
    transition: opacity .4s ease;
}	
*/

.bl-videoclose { width: 100%; height: 100%; }
.bl-video {
    position: absolute;
    margin: auto;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    height: 480px;
	width: 854px;
}

.bl-soc {
	z-index: 500;
	text-align: center;
	padding: 15px 0; 
	}

.videoclose { position: absolute; right: -20px; top: -20px; cursor: pointer; }
.videoclose:after, .videoclose:before  { content: ""; display: block; background: #fff; width: 20px; height: 2px; position: relative;}
.videoclose:after  { 
	-moz-transform: rotate(45deg); /* Для Firefox */
    -ms-transform: rotate(45deg); /* Для IE */
    -webkit-transform: rotate(45deg); /* Для Safari, Chrome, iOS */
    -o-transform: rotate(45deg); /* Для Opera */
	transform: rotate(45deg);}
.videoclose:before  { 
	-moz-transform: rotate(-45deg); /* Для Firefox */
    -ms-transform: rotate(-45deg); /* Для IE */
    -webkit-transform: rotate(-45deg); /* Для Safari, Chrome, iOS */
    -o-transform: rotate(-45deg); /* Для Opera */
	transform: rotate(-45deg); 
	top: 2px;
	}

/*--------animate--------------------------*/
.iframe-animate {
	width: 0;
	height: 0;
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	overflow: hidden;
	z-index: 500;
	transition: 0.1s all .8s linear;
	}
.iframe-animate.mob { width: 100%; height: 100%;  background: rgba(189,30,133,.8);}
.iframe-animate.menuopened  {
	width: 100%; height: 100%; 	transition: all .1s linear;
	}
.iframe-animate  .menu-animate {
	background: #bd1e85;
	background: rgba(189,30,133,.8);
	width: 25%;
	position: absolute;
	top: 0;
	height: 0%;
	}
.iframe-animate.menuopened  .menu-animate { height: 100%;}

.iframe-animate  #manim1.menu-animate {
	left: 0;
	transition: .4s all .5s linear;
	}
.iframe-animate  #manim2.menu-animate {
	left: 25%;
	transition: .4s all .4s linear;
	}
.iframe-animate  #manim3.menu-animate {
	left: 50%;
	transition: .4s all .3s linear;
	}
.iframe-animate  #manim4.menu-animate {
	left: 75%;
	transition: all .6s linear;
	}

.iframe-animate.menuopened  #manim1.menu-animate {
	transition: all .6s linear;
	}
.iframe-animate.menuopened  #manim2.menu-animate {
	transition: .4s all .3s linear;
	}
.iframe-animate.menuopened  #manim3.menu-animate {
	transition: .4s all .4s linear;
	}
.iframe-animate.menuopened  #manim4.menu-animate {
	transition: .4s all .5s linear;
	}
/*-------------------------------------*/
/*-------------------------------------*/
/*-------------------------------------*/


/*-------------------------------------*/
/*----------------GAME-----------------*/
/*-------------------------------------*/	


/*------------game page-----------------*/
#game_one, #game_two, #game_three, #game_four { display: none; }
.igame{ 
	position: absolute;
	margin: auto;
	width: 100%;
	top: 0;
	text-align: center; 
	color: #575656;
	font-size: 12px; 
	background: rgba(255,255,255,0.9);
	}
.game-align {
	margin: auto;
    position: absolute;
    height: 105px;
    top: 0px;
    bottom: 0px;
    right: 0;
    left: 0;	
	}
#game_one .mob-device {
    margin: auto;
    position: absolute;
    height: 275px;
    top: 0px;
    bottom: 60px;
    right: 0;
    left: 0;
	}
.align-bottom  { 
	bottom: 65px;
    position: absolute;
    margin: auto;
    right: 0;
    left: 0;
	}
    
#game_one .game-align { height: 275px; bottom: 60px;}
#game_one .game-align img { margin: 25px 0 20px;}
#game_one .align-bottom img { margin-bottom: 5px;}
 
#game_one .title { font-size: 24px;} 
#game_one .bigtitle { font-size: 36px; margin-top: 8px;} 
#game_one .title-pig { color: #fff; background: #bb2584; margin: 0 1px; padding: 0 5px;} 

#game_two { color: #bb2584; }
#game_two img { margin-top: 25px; margin-right: 24px;}

#game_three .game-align { height: 157px; }
#game_three p { line-height: 14px;}
#game_three  img { margin-top: 45px;}

#game_four { background: rgba(255,255,255,1); }
#game_four .game-align { height: 250px;}
#game_four .bigtitle { color: #bb2584; font-size: 120px; font-family: 'DaxlinePro'; font-weight: 600; line-height: 112px; margin: 20px 0 28px;}
#game_four .title { font-size: 24px; }
#game_four .align-bottom img { margin-bottom: 10px; }

/*-------------------------------------*/
/*-------------------------------------*/
/*-------------------------------------*/


/*-------------------------------------*/
/*-----------PAGE AUTH-----------------*/
/*-------------------------------------*/
.bgauth {  background: url(../img/client_bg.jpg) no-repeat 50% 50%;     background-size: cover; width: 100%; height: 100%; margin: 0; padding: 54px 20px 20px 20px;  }
.blauth { 
	border: 10px solid #bd1e85;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    padding: 20px;
	display: table;
	text-align: center; 
	}
.formauth {
	display: table-cell;
	vertical-align: middle;
	margin: auto;
	}

.formauth p.title {}
.formauth input[type="number"] {
    -webkit-appearance: none;
    border: 1px solid #404040;
    border-radius: 32px;
    padding: 5px 25px;
    width: 230px;
    font-family: 'open sans';
    font-size: 16px;
    display: block;
	margin: 10px auto;
	}
.formauth input[type="submit"] {
    -webkit-appearance: none;
    background: #bd1e85;
    color: #fff;
    border: none;
    padding: 7px 25px;
    width: 230px;
    border-radius: 32px;
	font-family: 'open sans';
	font-size: 16px; 
	}
	
#log, #log2 { position: absolute; top: 50px; left: 50px; }
#log2 { top: 150px; }


/*-------------------------------------*/
/*-------------------------------------*/
/*-------------------------------------*/


/*-------------------------------------*/
/*----------------MOBILE-----------------*/
/*-------------------------------------*/	
@media only screen and (max-width: 1050px),
only screen and (max-device-width: 1050px) {
	#game, #clients { background-size: auto 100%; }
	}
@media only screen and (max-width: 970px),
only screen and (max-device-width: 970px) {
	.menu_column_elem { font-size: 40px; line-height: 50px; height: 50px;}
	.menu_column_elem .menu-container { top: -50px; }
	}

	
@media only screen and (max-width: 800px),
only screen and (max-device-width: 800px) {
	a { -webkit-appearance: none; color: #fff; }
	.letter { font-size: 46px; letter-spacing: -4px;}
	.load { margin: 20px 0; }
	.transcription, .wor { font-size: 15px; margin-bottom: 7px;}
	
	#game_one .game-align {     
		padding: 0 50px 0;
		height: 209px;
		top: 30px;
		bottom: 0;
		margin: auto;
		} 	
	#game_one .title { font-size: 15px; line-height: 23px;}
	#game_one .game-align img {  margin: 15px 0 10px;}
	#game_one .bigtitle { font-size: 25px; margin-top: 1px; }
	.align-bottom { bottom: 35px; }

	#game_four .game-align, .align-bottom  { padding: 0 40px; }	
	#game_four .bigtitle { font-size: 40px; line-height: 80px;}
	#game_four .title { font-size: 14px; }
	#game_four .align-bottom p { font-size: 11px; }
	
	
	.menu_column_header { margin-bottom: 5px; }
	.menu_column_elem { 
		font-size: 20px;
		line-height:25px;
		height: 25px;
		}
	.menu_column_elem .menu-container { top: -25px;}
	.menu_column_href { float: left; margin-right: 10px;}
	.menu_column_elem p.pig { right: 7px;} 
	
	#clients , #about_emg { padding: 30px 30px; } 
	.client { width: 120px; height: 120px; background-size: 75% auto;}
	.client .client_text {     font-size: 12px; line-height: 20px;}
	.client .client_text span {     font-size: 10px; line-height: 16px;}
	.case_play {     
		height: 30px;
		padding: 2px;
		margin: 10px 0 14px;
		}
	.case_play_text {  width: 100px; padding: 0px 10px 0 12px;}
	.case_play_button { width: 26px; height: 26px;}
	/*.case_cont, .case  { background-attachment: scroll; } */
	
	#footer_contacts { padding: 10px 40px 40px;}
	#footer_column_1 { width: 100%; margin: 0 0 10px; }
	#footer_column_2 { width: 100%; margin: 0 0 10px; }
	#footer_contacts a { float: left; margin-right: 10px; }
	#map_tag { width: 70px; }
	
	.bl-video { width: 100%; height: 100%; display: table;}
	.videoshow {
		position:relative;
		padding-bottom:56.25%;
		height:0;
		overflow:hidden;
		display: table-caption;
		}
	.videoshow iframe,.videoshow object,.videoshow embed {
		position:absolute;
		top:0;
		left:0;
		width:100%;
		height:100%;
		}
	.videoclose { right: 0px; top: -14px;}
	/*-----not-animate----------------------------*/
	#menu .menu-animate, #menu.menuopened, #menu, #frame_image, #frame.menuopened #frame_image, #frame.menuopened #frame_image .black, #frame #frame_image .black,
	.frame_line, #frame.menuopened .frame_line_first:before, #frame .frame_line_first:before, #frame_button, #close_button, .con, .bar, 
	.menu_column_elem .menu-container, .menu_column_elem .menu-container:hover,
	.client.visible, .client, 
	#footer_contacts.fixed, #footer_contacts
	{ transition: none !important; }
	}
@media only screen and (max-width: 870px),
only screen and (max-device-width: 870px) { .case_header, .pig_title { font-size: 30px;} .pig_title { margin: 0px 20px 30px;}
	}
@media only screen and (max-width: 780px),
only screen and (max-device-width: 780px) { .case_header, .pig_title { font-size: 20px;}
	}	
@media only screen and (max-width: 470px),
only screen and (max-device-width: 470px) { .case_header, .pig_title { font-size: 16px;}
	}		
@media only screen and (max-width: 520px),
only screen and (max-device-width: 520px) { 
	.menu_column { width: 100%; }
	#menu_column_left { padding-left: 40px; margin-bottom: 15px; }
	#menu_column_right { padding-left: 57px; }
	}
	
