@media (max-width: 1100px) { /* это будет показано при разрешении монитора до 930 пикселей */
    body{ 
        zoom:80%;
    }
}

a {
	color: rgb(70, 62, 115);
	font-family: "Arial";
}

a:hover{
	color: #FFC800;
	transition: all 0.3s ease-in-out;
	text-decoration: underline;
}

.icon-site-map {
	background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAeCAYAAABe3VzdAAAACXBIWXMAAEnRAABJ0QEF/KuVAAAE50lEQVR4nM2Wb0gbZxyAzxRRFBJJq1HbrpCaji3NJQ3hEppLz1JTzNRZY06bVvoHxcSptUp0NSlqoqjtaJKqoRszxiXFFIU1tTNqEo1FyHBDpsIYG2Or26plbGMUZHRs++3DXLF6iVY6sw/Pp7vn3of73Z8XAQDk/8y2xYSEBLZMJvuiuLgYwlFUVARCoXCMRqPF7XhgRkaGrqOzAx48mILQxyFKglNBqKmpgaSkJO6OB3I4HF1HZweEQiGYnZ2lZHp6Gi7XXgYmk/l6VAJbjC0wPDwMo6OjlHjueaCqqgqYTOZrUQnU6/XQ/0E/uG67KHE4HKDRaKIXqNPpwGKxgNVq3YDFYoEbN25AaWlp9AKrq6vBZDKB0WgEk8lEyfnz56MXqNFooLGxMSJnz56N3ktSWVkJzc3NETl37hwwmUzBjgcePHiwrqGhAZwuZ3icTrh48SIwGIydH3F8fDxLKBSOEAQxRxDEQ4IgvpfL5X+dOHFihSCIRYIgvpHJZHMcDscSExND2/FAKlAUDaanp9e9zGu+1EAejzeZnp5e+58HxsbG0tlsdgeKordXuYOi6Icoio6gKOpHUXSCgqBUKn0qFouXwxyfWHW9KIoOr15v8PDhwwNpaWlaBEFithwoEAgmeDzeRGpqah2LxdoSqampdWKx+BGXy/Vu1WGxWHV79+59G8Owxf3799dvKTAxMfEVqVT6ZNeuXfHbGHEgLS3thUe8Z8+eYpFINL+lQDqdjkkkkuVtPoOB7TyDdDr9DYlEskQZuG/fvreOHj06g+P4VziOL2ZmZv4sl8tBJpP9gOP4Io7jCyKRaCIxMfG5b1lcXBxLIBDcw3H8MxzHH+I4vpiVlfX78ePHn6x6X0ul0k85HM476z8zDAZDgmHYAxzHP1+35ner7pcSieSTlJSUU0hBwamndz13IRAIQGCCgkAAbr17C7hc7ntrF2Gz2XUtLS3g8/sgGAxSMu4bh4oKLTAYjFfXukKhcNjpdMLk5CSlNzU1BR6PB06ePPkrcubMGRgbH4OFhYWwDAwMAJ/Pt69dhMPh6DqvdcLMzAzMz89TEgqFoLa2dsNmQSwWeweHBmFubi6s6/P5oKCgAJDTp0/D4ODgP3cwDL2971MGmkwmGPGOgN/vp+T+R/ehqnrjhhXDMK+j3xHW8/v9MDQ0BPn5+YAUFRWB3W4H9x13WG7evEkZaDAYwHXbBW63mxKnywlarZYy0GazhfXcbjfY7XbIy8sDRKVSgdVqhZ6eng10d3dDd3c3tLe3UwbW19dDV1fXs/PW0tXVBVarFcrKyigDr1+/Tun965rNZsjNzQVEqVRCW1tbRJqamigDL126BK2trc+gci9cuEAZaDQaN3VzcnIAyc/PB4PBEJGGhgbg8/mO9YFarXZTt6SkZMOGFcMw75UrVzZ1FQrFCwX2rQusr6iogKtXr0YkTOBoY2Pjpq5CoQBEqVT+YbfbIRJmsxlQFH1uxBkZGTq9Xg99fX0RKS8vh6SkpOdGLBKJvDabLaLXa++F7OzsFeTQoUPXVCrVklqtXlar1T+q1eqlNTxWq9VLCoXi2927d2eu+2ezjx07Nk+S5FIYHhcWFi4dOXJkiEajxa51k5OT38zOzl5cPe8nkiRXSJL8kyTJ30iS/IUkyeW8vLxHBw4cqHnh/+1O8zfStxAYoSKhjwAAAABJRU5ErkJggg==) no-repeat;
    display: block;
    height: 19px;
    width: 45px;   
}

body{
	height: 90px;
	margin: 0;
	padding: 0;font-family: "Arial";
}

#container{	
	height:auto;
	width:1200px;
	margin: auto;
}

#header{
   height: 150px;
   margin-bottom: 5px;
}

#header-logo {
    float: left;
    margin: -15px 0 0 30px;
}

#header-logo img {
    width: 155px;
}

#head-0 {
	overflow: hidden;
}

#head-0 ul {
    margin: 5px 0 0 250px;
}

#head-0 li {
	float: left;
	list-style: none;
}

#head-0 a {
	text-decoration: none;
	color: #fff;
}

#head-0 a:hover{
	color: #FFC800;
	transition: all 0.3s ease-in-out;
	text-decoration: underline;
}

#wr-head{
    position: absolute;
    width: 100%;
    height: 150px;
    padding: 0;
    margin: 0;
    margin: 25px 0 0 0;
    z-index: -1;
    left: 0;
}

#main{
	background-color: rgba(33, 80, 121, 0.75);
	padding-bottom: 5px;
	border-radius: 5px;
	margin: 10px 0;
}

#top-menu .dropdown ul li:last-child {
	border-right: none !important;
}

#top-menu {
    margin-left: 230px;
    overflow: hidden;
}

#top-menu a {
    font-size: 18px;
    text-decoration: none;
}

#top-menu a:hover{
	color: #FFC800;
	transition: all 0.3s ease-in-out;
	text-decoration: underline;
}

#left-menu{
    position: relative;
    float: left;
    width: 220px;
    font-family: Times New Roman,Verdana;
    font-size: 16px;
    border-radius: 10px;
    margin-left: 5px;
    box-shadow: 0px 0px 10px 3px #fff;
}

#right-menu{
    display: none;
    float: right;
    width: 220px;
}

#center-punct{
    display: block;
    background: rgb(80, 116, 146);
    overflow: hidden;
    border-radius: 10px;
}

#center-page{    
    display: block;
    margin: 0 0 3px 230px;
    background:rgba(48, 86, 108, 0.36);
    overflow: hidden;
}

#content{
	min-height: 700px;
	background: rgb(220, 220, 220);
	padding: 5px;
	margin: 0 5px 0 235px;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;
	font-size: 14px;
	border-radius: 10px;
	line-height: 160%;
	text-align: justify;
	box-shadow: 0px 0px 10px 2px #fff;
}   

#page_text{
    font-family: "Arial";
    font-size: 16px;
    color: #396496;
    line-height: 160%;
}

#page_text table{
    font-family: "Arial";
    font-size: 16px;
    color: #396496;
    line-height: 160%;
}


#page_text p{
     text-indent: 20px; /* Отступ первой строки в пикселах */
     margin: 10px 0 0 0; /* Отступ от p */
}

#page_text ul{
    margin: 0; /* Отступ от p */
}

#footer{
    color: #fff;
    text-align: center;
    font-family: "Arial";
    margin: 5px 0 0 0;
    padding: 15px 0;
    font-size: 14px;
    background: rgb(118, 134, 148);
    border-radius: 5px;
}

#footer p{
    margin: 0;
}

#img1{
   /*background-image: url(/public/img/mychem/background/info.png);  Путь к фоновому рисунку */
    background-position: 50% 100%; /* Положение фона */
    background-repeat: no-repeat; /* Отменяем повторение фона */
}

.ca-menu{
    padding:0;
    margin:20px auto;
    width: 1070px;
}
.ca-menu li{
	margin: 25px;
    width: 200px;
    height: 200px;
    overflow: hidden;
    position: relative;
    float: left;
    border: 5px solid #fff;
    background: #e2f0ff;
    -webkit-box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
    -moz-box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
    box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
    margin-right: 4px;
    -webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
    transition: all 300ms linear;
    -webkit-border-radius: 60px;
    -moz-border-radius: 60px;
    border-radius: 60px;
}
.ca-menu li:last-child{
    margin-right: 0px;
}
.ca-menu li a{
    text-align: left;
    width: 100%;
    height: 100%;
    display: block;
    color: #333;
    position: relative;
}
.ca-icon{
    font-family: 'WebSymbolsRegular', cursive;
    color: #c5e4f4;
    font-size: 90px;
    text-shadow: 1px 0px 1px rgba(255,255,255,0.7);
    line-height: 150px;
    position: absolute;
    width: 100%;
    height: 50%;
    left: 0px;
    top: 0px;
    text-align: center;
    -webkit-transition: all 200ms linear;
    -moz-transition: all 200ms linear;
    -o-transition: all 200ms linear;
    -ms-transition: all 200ms linear;
    transition: all 200ms linear;
}
.ca-content{
    position: absolute;
    left: 0px;
    width: 100%;
    height: 50%;
    top: 50%;
}
.ca-main{
    font-size: 25px;
    color: #005382;
    opacity: 0.8;
    text-align: center;
    -webkit-transition: all 200ms linear;
    -moz-transition: all 200ms linear;
    -o-transition: all 200ms linear;
    -ms-transition: all 200ms linear;
    transition: all 200ms linear;
}
.ca-sub{
    text-align:center;
    font-size: 14px;
    color: #666;
    line-height: 40px;
    opacity: 0.8;
    -webkit-transition: all 200ms linear;
    -moz-transition: all 200ms linear;
    -o-transition: all 200ms linear;
    -ms-transition: all 200ms linear;
    transition: all 200ms linear;
}
.ca-menu li:hover{
    border-color:rgba(109, 96, 175, 0.58);
    z-index: 999;
    -webkit-border-radius: 70px;
    -moz-border-radius: 70px;
    border-radius: 70px;
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -o-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
}
.ca-menu li:hover .ca-icon{   
    color: transparent;
    -webkit-animation: moveFromTop 400ms ease;
    -moz-animation: moveFromTop 400ms ease;
    -ms-animation: moveFromTop 400ms ease;
}
.ca-menu li:hover .ca-main{
     color: #005382;  
     text-shadow: 0px 0px 20px #7C49AC;   
    -webkit-animation: moveFromTop 300ms ease;
    -moz-animation: moveFromTop 300ms ease;
    -ms-animation: moveFromTop 300ms ease;
}
.ca-menu li:hover .ca-sub{
    color: #000;
    -webkit-animation: moveFromBottom 500ms ease;
    -moz-animation: moveFromBottom 500ms ease;
    -ms-animation: moveFromBottom 500ms ease;
}
@-webkit-keyframes moveFromTop {
    from {
        -webkit-transform: translateY(-300%);
    }
    to {
        -webkit-transform: translateY(0%);
    }
}
@-moz-keyframes moveFromTop {
    from {
        -moz-transform: translateY(-300%);
    }
    to {
        -moz-transform: translateY(0%);
    }
}
@-ms-keyframes moveFromTop {
    from {
        -ms-transform: translateY(-300%);
    }
    to {
        -ms-transform: translateY(0%);
    }
}
@-webkit-keyframes moveFromBottom {
    from {
        -webkit-transform: translateY(200%);
    }
    to {
        -webkit-transform: translateY(0%);
    }
}
@-moz-keyframes moveFromBottom {
    from {
        -moz-transform: translateY(200%);
    }
    to {
        -moz-transform: translateY(0%);
    }
}
@-ms-keyframes moveFromBottom {
    from {
        -ms-transform: translateY(200%);
    }
    to {
        -ms-transform: translateY(0%);
    }
}

.punct_conf{
	cursor: pointer;
    overflow: hidden;
  	text-align: center; 
    border: 5px solid #fff;
    background: #e2f0ff;
    font-size: 20px;
    font-weight: bold;
    -webkit-box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
    -moz-box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
    box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
    margin-right: 4px;
    margin-bottom: 0;
    -webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
    transition: all 300ms linear;
    -webkit-border-radius: 60px;
    -moz-border-radius: 60px;
    border-radius: 60px;
}
.punct_conf:hover{
    border-color:rgba(109, 96, 175, 0.58);
    z-index: 999;
    	    -webkit-border-radius: 70px;
    -moz-border-radius: 70px;
    border-radius: 70px;
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -o-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
}
.sort_conf{
	 border: 3px solid #fff;
    background: #e2f0ff;
    -webkit-box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
    -moz-box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
    box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
    margin-right: 4px;
	cursor: pointer;
	font-weight: bold;
	font-size: 20px;
	 border-radius: 70px;
	 overflow: hidden;
	color: red;
	width:300px;
	padding: 5px;
}
.sort_type{	
	display: none;
	position: absolute;
	color:black;
	margin: 5px 0 0 150px;	
	 border: 3px solid #fff;
	 border-top: none;
    background: #e2f0ff;
    -webkit-box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
    -moz-box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
    box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
}
.sort_type > div{
	font-size: 18px;
	text-align: center;
	color:black;
	padding: 10px;
	 border: 3px solid #fff;
	 border-top: none;
    background: #e2f0ff;
    -webkit-box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
    -moz-box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
    box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
}
.about_conf{
	display: none;
	width: 50%;
	cursor: pointer;
    overflow: hidden;
  	margin: 0 auto;
    -webkit-border-radius: 0 0 60px 60px;
    -moz-border-radius: 0 0 60px 60px;
    border-radius: 0 0 60px 60px;
    border: 5px solid #fff;
    border-top: none;
    background: #e2f0ff;
}
.about_conf_menu{
	width: 50%;
	cursor: pointer;
    overflow: hidden;
    font-size: 16px;
    text-align: center;
   	margin: 0 auto;
    -webkit-border-radius: 0 0 60px 60px;
    -moz-border-radius: 0 0 60px 60px;
    border-radius: 0 0 60px 60px;
    border: 5px solid #fff;
    border-top: none;
    background: #e2f0ff;
}
.about_conf_menu:hover{
    font-weight: bold;
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -o-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
}
.clear {clear: both;}

/* Форма входа авторизация */
.autForm{
    border: 4px double rgba(38, 21, 238, 0.95);
    margin: 0 auto;
    width:350px;
    text-align: center;
    background: rgba(145, 132, 214, 0.58);
}
.autForm p{
    margin: 0 0 5px 0;
}
.autForm .errorAuth{
    font-size: 24px;
    color: #ca0000;
}
.autForm .formField{
    width:200px;
    height:20px;
    text-align: center;
    border: 1px groove green;
    font-family: 'Times New Roman', Times, serif;    
}
.autForm .btnLogin{
    background: #6292c2;
    border: 2px solid #eee;
    height: 30px;
    width: 100px;
    overflow: hidden;
    display: block;
    color: white;
    cursor:pointer;
  
    /*Скругленные углы*/
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;

    /*Градиент*/
    background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
    background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
    background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
    background-image: -ms-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
    background-image: linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));

      /*Переход*/
    -webkit-transition: All 0.5s ease;
    -moz-transition: All 0.5s ease;
    -o-transition: All 0.5s ease;
    -ms-transition: All 0.5s ease;
    transition: All 0.5s ease;
}
.autForm .btnLogin:hover{
 width: 150px;
}
/* -------------------------------------- */

/* Оформление оболочки(div) в котрой лежат всве поля */
#mu_registred { 
    margin:10px auto 5px;   
    width:500px;
}
#mu_registred  hr{
    margin:10px 0;
    color:red;
    width:460px;
    height:2px;
    background:red;
    clear:both;
}
#mu_registred  div{ 
    margin: 20px 0 0 0; 
}
#button_reg_conf{
    text-align:centr;
    background: #6292c2;
    border: 2px solid #eee;
    height: 30px;
    width: 200px;
    overflow: hidden;
    display: block;
    color: white;
    cursor:pointer;

    /*Скругленные углы*/
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;

    /*Градиент*/
    background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
    background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
    background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
    background-image: -ms-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
    background-image: linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));

    /*Переход*/
    -webkit-transition: All 0.5s ease;
    -moz-transition: All 0.5s ease;
    -o-transition: All 0.5s ease;
    -ms-transition: All 0.5s ease;
    transition: All 0.5s ease;
}
#button_reg_conf:hover{
 width: 300px;
}
#mu_registred  div#mu_abstracts{
    height: 75px;
}
#mu_registred label{
    position: static; 
    padding: 0;
    font-size:18px; 
}
#mu_registred .form_field{  
    width: 150px;
    text-align: center;
    padding: 2px;
    background:#F0F0FC;
    margin: 0 40px 0 0;
    border: 2px solid gray;
    float: right;
    font-family: 'Times New Roman', Times, serif;
    font-size: 14px;
}
#mu_registred .form_field_select{   
    width: 158px;
    margin: 0 40px 0 0;
    border: 2px solid gray;
    float: right;
    background:#F0F0FC;
}
#mu_registred  .form_field_che{
    margin: 5px 110px 0 0;
    float: right;
}
#mu_registred  #mu_sex img{
    float:right;
    margin: 0 10px 0 0;
}
#mu_registred  #mu_sex input{
    float:right;
    margin: 0 10px 0 0;
}
#mu_registred .form_field:focus{    
    border:2px solid green;
}
#mu_registred img.title_reg_field{
    margin: 0 20px 0 0;
    float:right;
}
#mu_registred div#mu_capch{
    font-size:18px;
    float:left; 
    margin:0 0 20px 0;
    background:black;
    color:white;
}
#mu_registred div#mu_capch img{
    height:20px;
    margin: 0 5px;
    width:21px;
}
p#title_reg_field{ 
    display: none; 
    position: absolute;
    padding: 10px; left: 5px;
    font-size: 0.8em;
    border: 1px solid #7FD7F7;
    background: #E5F6FD;
    -moz-border-radius: 5px;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    z-index: 9999;}
p#title_reg_field #vtipArrow{ 
    position: absolute;
    top: -10px; 
    left: 15px 
}
.btnLk{
    background: #6292c2;
    border: 2px solid #001fff;
    height: 30px;
    width: 100px;
    overflow: hidden;
    display: block;
    color: white;
    cursor:pointer;
  
    /*Скругленные углы*/
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;

    /*Градиент*/
    background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
    background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
    background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
    background-image: -ms-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
    background-image: linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
  
    /*Переход*/
    -webkit-transition: All 0.5s ease;
    -moz-transition: All 0.5s ease;
    -o-transition: All 0.5s ease;
    -ms-transition: All 0.5s ease;
    transition: All 0.5s ease;
}
.btnLk:hover{
 width: 150px;
}


/*
==============================================
CSS3 ANIMATION CHEAT SHEET
==============================================

Made by Justin Aguilar

www.justinaguilar.com/animations/

Questions, comments, concerns, love letters:
justin@justinaguilar.com
==============================================
*/

/*
==============================================
slideDown
==============================================
*/

.slideDown{
    animation-name: slideDown;
    -webkit-animation-name: slideDown;  

    animation-duration: 1s; 
    -webkit-animation-duration: 1s;

    animation-timing-function: ease;    
    -webkit-animation-timing-function: ease;    

    visibility: visible !important;                     
}

@keyframes slideDown {
    0% {
        transform: translateY(-100%);
    }
    50%{
        transform: translateY(8%);
    }
    65%{
        transform: translateY(-4%);
    }
    80%{
        transform: translateY(4%);
    }
    95%{
        transform: translateY(-2%);
    }           
    100% {
        transform: translateY(0%);
    }       
}

@-webkit-keyframes slideDown {
    0% {
        -webkit-transform: translateY(-100%);
    }
    50%{
        -webkit-transform: translateY(8%);
    }
    65%{
        -webkit-transform: translateY(-4%);
    }
    80%{
        -webkit-transform: translateY(4%);
    }
    95%{
        -webkit-transform: translateY(-2%);
    }           
    100% {
        -webkit-transform: translateY(0%);
    }   
}

/*
==============================================
slideUp
==============================================
*/


.slideUp{
    animation-name: slideUp;
    -webkit-animation-name: slideUp;    

    animation-duration: 1s; 
    -webkit-animation-duration: 1s;

    animation-timing-function: ease;    
    -webkit-animation-timing-function: ease;

    visibility: visible !important;         
}

@keyframes slideUp {
    0% {
        transform: translateY(100%);
    }
    50%{
        transform: translateY(-8%);
    }
    65%{
        transform: translateY(4%);
    }
    80%{
        transform: translateY(-4%);
    }
    95%{
        transform: translateY(2%);
    }           
    100% {
        transform: translateY(0%);
    }   
}

@-webkit-keyframes slideUp {
    0% {
        -webkit-transform: translateY(100%);
    }
    50%{
        -webkit-transform: translateY(-8%);
    }
    65%{
        -webkit-transform: translateY(4%);
    }
    80%{
        -webkit-transform: translateY(-4%);
    }
    95%{
        -webkit-transform: translateY(2%);
    }           
    100% {
        -webkit-transform: translateY(0%);
    }   
}

/*
==============================================
slideLeft
==============================================
*/


.slideLeft{
    animation-name: slideLeft;
    -webkit-animation-name: slideLeft;  

    animation-duration: 1s; 
    -webkit-animation-duration: 1s;

    animation-timing-function: ease-in-out; 
    -webkit-animation-timing-function: ease-in-out;     

    visibility: visible !important; 
}

@keyframes slideLeft {
    0% {
        transform: translateX(150%);
    }
    50%{
        transform: translateX(-8%);
    }
    65%{
        transform: translateX(4%);
    }
    80%{
        transform: translateX(-4%);
    }
    95%{
        transform: translateX(2%);
    }           
    100% {
        transform: translateX(0%);
    }
}

@-webkit-keyframes slideLeft {
    0% {
        -webkit-transform: translateX(150%);
    }
    50%{
        -webkit-transform: translateX(-8%);
    }
    65%{
        -webkit-transform: translateX(4%);
    }
    80%{
        -webkit-transform: translateX(-4%);
    }
    95%{
        -webkit-transform: translateX(2%);
    }           
    100% {
        -webkit-transform: translateX(0%);
    }
}

/*
==============================================
slideRight
==============================================
*/


.slideRight{
    animation-name: slideRight;
    -webkit-animation-name: slideRight; 

    animation-duration: 1s; 
    -webkit-animation-duration: 1s;

    animation-timing-function: ease-in-out; 
    -webkit-animation-timing-function: ease-in-out;     

    visibility: visible !important; 
}

@keyframes slideRight {
    0% {
        transform: translateX(-150%);
    }
    50%{
        transform: translateX(8%);
    }
    65%{
        transform: translateX(-4%);
    }
    80%{
        transform: translateX(4%);
    }
    95%{
        transform: translateX(-2%);
    }           
    100% {
        transform: translateX(0%);
    }   
}

@-webkit-keyframes slideRight {
    0% {
        -webkit-transform: translateX(-150%);
    }
    50%{
        -webkit-transform: translateX(8%);
    }
    65%{
        -webkit-transform: translateX(-4%);
    }
    80%{
        -webkit-transform: translateX(4%);
    }
    95%{
        -webkit-transform: translateX(-2%);
    }           
    100% {
        -webkit-transform: translateX(0%);
    }
}

/*
==============================================
slideExpandUp
==============================================
*/


.slideExpandUp{
    animation-name: slideExpandUp;
    -webkit-animation-name: slideExpandUp;  

    animation-duration: 1.6s;   
    -webkit-animation-duration: 1.6s;

    animation-timing-function: ease-out;    
    -webkit-animation-timing-function: ease -out;

    visibility: visible !important; 
}

@keyframes slideExpandUp {
    0% {
        transform: translateY(100%) scaleX(0.5);
    }
    30%{
        transform: translateY(-8%) scaleX(0.5);
    }   
    40%{
        transform: translateY(2%) scaleX(0.5);
    }
    50%{
        transform: translateY(0%) scaleX(1.1);
    }
    60%{
        transform: translateY(0%) scaleX(0.9);      
    }
    70% {
        transform: translateY(0%) scaleX(1.05);
    }           
    80%{
        transform: translateY(0%) scaleX(0.95);     
    }
    90% {
        transform: translateY(0%) scaleX(1.02);
    }   
    100%{
        transform: translateY(0%) scaleX(1);        
    }
}

@-webkit-keyframes slideExpandUp {
    0% {
        -webkit-transform: translateY(100%) scaleX(0.5);
    }
    30%{
        -webkit-transform: translateY(-8%) scaleX(0.5);
    }   
    40%{
        -webkit-transform: translateY(2%) scaleX(0.5);
    }
    50%{
        -webkit-transform: translateY(0%) scaleX(1.1);
    }
    60%{
        -webkit-transform: translateY(0%) scaleX(0.9);      
    }
    70% {
        -webkit-transform: translateY(0%) scaleX(1.05);
    }           
    80%{
        -webkit-transform: translateY(0%) scaleX(0.95);     
    }
    90% {
        -webkit-transform: translateY(0%) scaleX(1.02);
    }   
    100%{
        -webkit-transform: translateY(0%) scaleX(1);        
    }
}

/*
==============================================
expandUp
==============================================
*/


.expandUp{
    animation-name: expandUp;
    -webkit-animation-name: expandUp;   

    animation-duration: 0.7s;   
    -webkit-animation-duration: 0.7s;

    animation-timing-function: ease;    
    -webkit-animation-timing-function: ease;        

    visibility: visible !important; 
}

@keyframes expandUp {
    0% {
        transform: translateY(100%) scale(0.6) scaleY(0.5);
    }
    60%{
        transform: translateY(-7%) scaleY(1.12);
    }
    75%{
        transform: translateY(3%);
    }   
    100% {
        transform: translateY(0%) scale(1) scaleY(1);
    }   
}

@-webkit-keyframes expandUp {
    0% {
        -webkit-transform: translateY(100%) scale(0.6) scaleY(0.5);
    }
    60%{
        -webkit-transform: translateY(-7%) scaleY(1.12);
    }
    75%{
        -webkit-transform: translateY(3%);
    }   
    100% {
        -webkit-transform: translateY(0%) scale(1) scaleY(1);
    }   
}

/*
==============================================
fadeIn
==============================================
*/

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

    animation-duration: 1.5s;   
    -webkit-animation-duration: 1.5s;

    animation-timing-function: ease-in-out; 
    -webkit-animation-timing-function: ease-in-out;     

    visibility: visible !important; 
}

@keyframes fadeIn {
    0% {
        transform: scale(0);
        opacity: 0.0;       
    }
    60% {
        transform: scale(1.1);  
    }
    80% {
        transform: scale(0.9);
        opacity: 1; 
    }   
    100% {
        transform: scale(1);
        opacity: 1; 
    }       
}

@-webkit-keyframes fadeIn {
    0% {
        -webkit-transform: scale(0);
        opacity: 0.0;       
    }
    60% {
        -webkit-transform: scale(1.1);
    }
    80% {
        -webkit-transform: scale(0.9);
        opacity: 1; 
    }   
    100% {
        -webkit-transform: scale(1);
        opacity: 1; 
    }       
}

/*
==============================================
expandOpen
==============================================
*/


.expandOpen{
    animation-name: expandOpen;
    -webkit-animation-name: expandOpen; 

    animation-duration: 1.2s;   
    -webkit-animation-duration: 1.2s;

    animation-timing-function: ease-out;    
    -webkit-animation-timing-function: ease-out;    

    visibility: visible !important; 
}

@keyframes expandOpen {
    0% {
        transform: scale(1.8);      
    }
    50% {
        transform: scale(0.95);
    }   
    80% {
        transform: scale(1.05);
    }
    90% {
        transform: scale(0.98);
    }   
    100% {
        transform: scale(1);
    }           
}

@-webkit-keyframes expandOpen {
    0% {
        -webkit-transform: scale(1.8);      
    }
    50% {
        -webkit-transform: scale(0.95);
    }   
    80% {
        -webkit-transform: scale(1.05);
    }
    90% {
        -webkit-transform: scale(0.98);
    }   
    100% {
        -webkit-transform: scale(1);
    }                   
}

/*
==============================================
bigEntrance
==============================================
*/


.bigEntrance{
    animation-name: bigEntrance;
    -webkit-animation-name: bigEntrance;    

    animation-duration: 1.6s;   
    -webkit-animation-duration: 1.6s;

    animation-timing-function: ease-out;    
    -webkit-animation-timing-function: ease-out;    

    visibility: visible !important;         
}

@keyframes bigEntrance {
    0% {
        transform: scale(0.3) rotate(6deg) translateX(-30%) translateY(30%);
        opacity: 0.2;
    }
    30% {
        transform: scale(1.03) rotate(-2deg) translateX(2%) translateY(-2%);        
        opacity: 1;
    }
    45% {
        transform: scale(0.98) rotate(1deg) translateX(0%) translateY(0%);
        opacity: 1;
    }
    60% {
        transform: scale(1.01) rotate(-1deg) translateX(0%) translateY(0%);     
        opacity: 1;
    }   
    75% {
        transform: scale(0.99) rotate(1deg) translateX(0%) translateY(0%);
        opacity: 1;
    }
    90% {
        transform: scale(1.01) rotate(0deg) translateX(0%) translateY(0%);      
        opacity: 1;
    }   
    100% {
        transform: scale(1) rotate(0deg) translateX(0%) translateY(0%);
        opacity: 1;
    }       
}

@-webkit-keyframes bigEntrance {
    0% {
        -webkit-transform: scale(0.3) rotate(6deg) translateX(-30%) translateY(30%);
        opacity: 0.2;
    }
    30% {
        -webkit-transform: scale(1.03) rotate(-2deg) translateX(2%) translateY(-2%);        
        opacity: 1;
    }
    45% {
        -webkit-transform: scale(0.98) rotate(1deg) translateX(0%) translateY(0%);
        opacity: 1;
    }
    60% {
        -webkit-transform: scale(1.01) rotate(-1deg) translateX(0%) translateY(0%);     
        opacity: 1;
    }   
    75% {
        -webkit-transform: scale(0.99) rotate(1deg) translateX(0%) translateY(0%);
        opacity: 1;
    }
    90% {
        -webkit-transform: scale(1.01) rotate(0deg) translateX(0%) translateY(0%);      
        opacity: 1;
    }   
    100% {
        -webkit-transform: scale(1) rotate(0deg) translateX(0%) translateY(0%);
        opacity: 1;
    }               
}

/*
==============================================
hatch
==============================================
*/

.hatch{
    animation-name: hatch;
    -webkit-animation-name: hatch;  

    animation-duration: 2s; 
    -webkit-animation-duration: 2s;

    animation-timing-function: ease-in-out; 
    -webkit-animation-timing-function: ease-in-out;

    transform-origin: 50% 100%;
    -ms-transform-origin: 50% 100%;
    -webkit-transform-origin: 50% 100%; 

    visibility: visible !important;     
}

@keyframes hatch {
    0% {
        transform: rotate(0deg) scaleY(0.6);
    }
    20% {
        transform: rotate(-2deg) scaleY(1.05);
    }
    35% {
        transform: rotate(2deg) scaleY(1);
    }
    50% {
        transform: rotate(-2deg);
    }   
    65% {
        transform: rotate(1deg);
    }   
    80% {
        transform: rotate(-1deg);
    }       
    100% {
        transform: rotate(0deg);
    }                                   
}

@-webkit-keyframes hatch {
    0% {
        -webkit-transform: rotate(0deg) scaleY(0.6);
    }
    20% {
        -webkit-transform: rotate(-2deg) scaleY(1.05);
    }
    35% {
        -webkit-transform: rotate(2deg) scaleY(1);
    }
    50% {
        -webkit-transform: rotate(-2deg);
    }   
    65% {
        -webkit-transform: rotate(1deg);
    }   
    80% {
        -webkit-transform: rotate(-1deg);
    }       
    100% {
        -webkit-transform: rotate(0deg);
    }       
}


/*
==============================================
bounce
==============================================
*/


.bounce{
    animation-name: bounce;
    -webkit-animation-name: bounce; 

    animation-duration: 1.6s;   
    -webkit-animation-duration: 1.6s;

    animation-timing-function: ease;    
    -webkit-animation-timing-function: ease;    
    
    transform-origin: 50% 100%;
    -ms-transform-origin: 50% 100%;
    -webkit-transform-origin: 50% 100%;     
}

@keyframes bounce {
    0% {
        transform: translateY(0%) scaleY(0.6);
    }
    60%{
        transform: translateY(-100%) scaleY(1.1);
    }
    70%{
        transform: translateY(0%) scaleY(0.95) scaleX(1.05);
    }
    80%{
        transform: translateY(0%) scaleY(1.05) scaleX(1);
    }   
    90%{
        transform: translateY(0%) scaleY(0.95) scaleX(1);
    }               
    100%{
        transform: translateY(0%) scaleY(1) scaleX(1);
    }   
}

@-webkit-keyframes bounce {
    0% {
        -webkit-transform: translateY(0%) scaleY(0.6);
    }
    60%{
        -webkit-transform: translateY(-100%) scaleY(1.1);
    }
    70%{
        -webkit-transform: translateY(0%) scaleY(0.95) scaleX(1.05);
    }
    80%{
        -webkit-transform: translateY(0%) scaleY(1.05) scaleX(1);
    }   
    90%{
        -webkit-transform: translateY(0%) scaleY(0.95) scaleX(1);
    }               
    100%{
        -webkit-transform: translateY(0%) scaleY(1) scaleX(1);
    }       
}


/*
==============================================
pulse
==============================================
*/

.pulse{
    animation-name: pulse;
    -webkit-animation-name: pulse;  

    animation-duration: 1.5s;   
    -webkit-animation-duration: 1.5s;

    animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
}

@keyframes pulse {
    0% {
        transform: scale(0.9);
        opacity: 0.7;       
    }
    50% {
        transform: scale(1);
        opacity: 1; 
    }   
    100% {
        transform: scale(0.9);
        opacity: 0.7;   
    }           
}

@-webkit-keyframes pulse {
    0% {
        -webkit-transform: scale(0.95);
        opacity: 0.7;       
    }
    50% {
        -webkit-transform: scale(1);
        opacity: 1; 
    }   
    100% {
        -webkit-transform: scale(0.95);
        opacity: 0.7;   
    }           
}

/*
==============================================
floating
==============================================
*/

.floating{
    animation-name: floating;
    -webkit-animation-name: floating;

    animation-duration: 1.5s;   
    -webkit-animation-duration: 1.5s;

    animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
}

@keyframes floating {
    0% {
        transform: translateY(0%);  
    }
    50% {
        transform: translateY(8%);  
    }   
    100% {
        transform: translateY(0%);
    }           
}

@-webkit-keyframes floating {
    0% {
        -webkit-transform: translateY(0%);  
    }
    50% {
        -webkit-transform: translateY(8%);  
    }   
    100% {
        -webkit-transform: translateY(0%);
    }           
}

/*
==============================================
tossing
==============================================
*/

.tossing{
    animation-name: tossing;
    -webkit-animation-name: tossing;    

    animation-duration: 2.5s;   
    -webkit-animation-duration: 2.5s;

    animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
}

@keyframes tossing {
    0% {
        transform: rotate(-4deg);   
    }
    50% {
        transform: rotate(4deg);
    }
    100% {
        transform: rotate(-4deg);   
    }                       
}

@-webkit-keyframes tossing {
    0% {
        -webkit-transform: rotate(-4deg);   
    }
    50% {
        -webkit-transform: rotate(4deg);
    }
    100% {
        -webkit-transform: rotate(-4deg);   
    }               
}

/*
==============================================
pullUp
==============================================
*/

.pullUp{
    animation-name: pullUp;
    -webkit-animation-name: pullUp; 

    animation-duration: 1.1s;   
    -webkit-animation-duration: 1.1s;

    animation-timing-function: ease-out;    
    -webkit-animation-timing-function: ease-out;    

    transform-origin: 50% 100%;
    -ms-transform-origin: 50% 100%;
    -webkit-transform-origin: 50% 100%;         
}

@keyframes pullUp {
    0% {
        transform: scaleY(0.1);
    }
    40% {
        transform: scaleY(1.02);
    }
    60% {
        transform: scaleY(0.98);
    }
    80% {
        transform: scaleY(1.01);
    }
    100% {
        transform: scaleY(0.98);
    }               
    80% {
        transform: scaleY(1.01);
    }
    100% {
        transform: scaleY(1);
    }                           
}

@-webkit-keyframes pullUp {
    0% {
        -webkit-transform: scaleY(0.1);
    }
    40% {
        -webkit-transform: scaleY(1.02);
    }
    60% {
        -webkit-transform: scaleY(0.98);
    }
    80% {
        -webkit-transform: scaleY(1.01);
    }
    100% {
        -webkit-transform: scaleY(0.98);
    }               
    80% {
        -webkit-transform: scaleY(1.01);
    }
    100% {
        -webkit-transform: scaleY(1);
    }       
}

/*
==============================================
pullDown
==============================================
*/

.pullDown{
    animation-name: pullDown;
    -webkit-animation-name: pullDown;   

    animation-duration: 1.1s;   
    -webkit-animation-duration: 1.1s;

    animation-timing-function: ease-out;    
    -webkit-animation-timing-function: ease-out;    

    transform-origin: 50% 0%;
    -ms-transform-origin: 50% 0%;
    -webkit-transform-origin: 50% 0%;       
}

@keyframes pullDown {
    0% {
        transform: scaleY(0.1);
    }
    40% {
        transform: scaleY(1.02);
    }
    60% {
        transform: scaleY(0.98);
    }
    80% {
        transform: scaleY(1.01);
    }
    100% {
        transform: scaleY(0.98);
    }               
    80% {
        transform: scaleY(1.01);
    }
    100% {
        transform: scaleY(1);
    }                           
}

@-webkit-keyframes pullDown {
    0% {
        -webkit-transform: scaleY(0.1);
    }
    40% {
        -webkit-transform: scaleY(1.02);
    }
    60% {
        -webkit-transform: scaleY(0.98);
    }
    80% {
        -webkit-transform: scaleY(1.01);
    }
    100% {
        -webkit-transform: scaleY(0.98);
    }               
    80% {
        -webkit-transform: scaleY(1.01);
    }
    100% {
        -webkit-transform: scaleY(1);
    }       
}

/*
==============================================
stretchLeft
==============================================
*/

.stretchLeft{
    animation-name: stretchLeft;
    -webkit-animation-name: stretchLeft;    

    animation-duration: 1.5s;   
    -webkit-animation-duration: 1.5s;

    animation-timing-function: ease-out;    
    -webkit-animation-timing-function: ease-out;    

    transform-origin: 100% 0%;
    -ms-transform-origin: 100% 0%;
    -webkit-transform-origin: 100% 0%; 
}

@keyframes stretchLeft {
    0% {
        transform: scaleX(0.3);
    }
    40% {
        transform: scaleX(1.02);
    }
    60% {
        transform: scaleX(0.98);
    }
    80% {
        transform: scaleX(1.01);
    }
    100% {
        transform: scaleX(0.98);
    }               
    80% {
        transform: scaleX(1.01);
    }
    100% {
        transform: scaleX(1);
    }                           
}

@-webkit-keyframes stretchLeft {
    0% {
        -webkit-transform: scaleX(0.3);
    }
    40% {
        -webkit-transform: scaleX(1.02);
    }
    60% {
        -webkit-transform: scaleX(0.98);
    }
    80% {
        -webkit-transform: scaleX(1.01);
    }
    100% {
        -webkit-transform: scaleX(0.98);
    }               
    80% {
        -webkit-transform: scaleX(1.01);
    }
    100% {
        -webkit-transform: scaleX(1);
    }       
}

/*
==============================================
stretchRight
==============================================
*/

.stretchRight{
    animation-name: stretchRight;
    -webkit-animation-name: stretchRight;   

    animation-duration: 1.5s;   
    -webkit-animation-duration: 1.5s;

    animation-timing-function: ease-out;    
    -webkit-animation-timing-function: ease-out;    

    transform-origin: 0% 0%;
    -ms-transform-origin: 0% 0%;
    -webkit-transform-origin: 0% 0%;        
}

@keyframes stretchRight {
    0% {
        transform: scaleX(0.3);
    }
    40% {
        transform: scaleX(1.02);
    }
    60% {
        transform: scaleX(0.98);
    }
    80% {
        transform: scaleX(1.01);
    }
    100% {
        transform: scaleX(0.98);
    }               
    80% {
        transform: scaleX(1.01);
    }
    100% {
        transform: scaleX(1);
    }                           
}

@-webkit-keyframes stretchRight {
    0% {
        -webkit-transform: scaleX(0.3);
    }
    40% {
        -webkit-transform: scaleX(1.02);
    }
    60% {
        -webkit-transform: scaleX(0.98);
    }
    80% {
        -webkit-transform: scaleX(1.01);
    }
    100% {
        -webkit-transform: scaleX(0.98);
    }               
    80% {
        -webkit-transform: scaleX(1.01);
    }
    100% {
        -webkit-transform: scaleX(1);
    }       
}

/* css3 открывание картинок */
.lb-album{
    list-style: none;
    width: 900px;
    margin: 0 auto;
    font-family: 'BebasNeueRegular', 'Arial Narrow', Arial;
}
.lb-album li{
    float: left;
    margin: 5px;
    position: relative;
}
.lb-album li > a,
.lb-album li > a img{
    display: block;
}
.lb-album li > a{
    width: 150px;
    height: 150px;
    position: relative;
    padding: 10px;
    background: #f1d2c2;
    -webkit-box-shadow: 1px 1px 2px #fff, 1px 1px 2px rgba(158,111,86,0.3) inset;
    -moz-box-shadow: 1px 1px 2px #fff, 1px 1px 2px rgba(158,111,86,0.3) inset;
    box-shadow: 1px 1px 2px #fff, 1px 1px 2px rgba(158,111,86,0.3) inset;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px 4px 4px 4px;
}
.lb-album li > a span{
    position: absolute;
    width: 150px;
    height: 150px;
    top: 10px;
    left: 10px;
    text-align: center;
    line-height: 150px;
    color: rgba(27,54,81,0.8);
    text-shadow: 0px 1px 1px rgba(255,255,255,0.6);
    font-size: 24px;
    opacity: 0;
    filter: alpha(opacity=0); /* internet explorer */
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=0)"; /*IE8*/
    background: rgb(241,210,194);
    background: -moz-radial-gradient(center, ellipse cover, rgba(255,255,255,0.56) 0%, rgba(241,210,194,1) 100%);
    background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,rgba(255,255,255,0.56)), color-stop(100%,rgba(241,210,194,1)));
    background: -webkit-radial-gradient(center, ellipse cover, rgba(255,255,255,0.56) 0%,rgba(241,210,194,1) 100%);
    background: -o-radial-gradient(center, ellipse cover, rgba(255,255,255,0.56) 0%,rgba(241,210,194,1) 100%);
    background: -ms-radial-gradient(center, ellipse cover, rgba(255,255,255,0.56) 0%,rgba(241,210,194,1) 100%);
    background: radial-gradient(center, ellipse cover, rgba(255,255,255,0.56) 0%,rgba(241,210,194,1) 100%);
    -webkit-transition: opacity 0.3s linear;
    -moz-transition: opacity 0.3s linear;
    -o-transition: opacity 0.3s linear;
    -ms-transition: opacity 0.3s linear;
    transition: opacity 0.3s linear;
}
.lb-album li > a:hover span{
    opacity: 1;
    filter: alpha(opacity=99); /* internet explorer */
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=99)"; /*IE8*/
}
.lb-overlay{
    width: 0px;
    height: 0px;
    position: fixed;
    overflow: hidden;
    left: 0px;
    top: 0px;
    padding: 0px;
    z-index: 99;
    text-align: center;
    background: rgb(241,210,194);
    background: -moz-radial-gradient(center, ellipse cover, rgba(255,255,255,0.56) 0%, rgba(241,210,194,1) 100%);
    background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,rgba(255,255,255,0.56)), color-stop(100%,rgba(241,210,194,1)));
    background: -webkit-radial-gradient(center, ellipse cover, rgba(255,255,255,0.56) 0%,rgba(241,210,194,1) 100%);
    background: -o-radial-gradient(center, ellipse cover, rgba(255,255,255,0.56) 0%,rgba(241,210,194,1) 100%);
    background: -ms-radial-gradient(center, ellipse cover, rgba(255,255,255,0.56) 0%,rgba(241,210,194,1) 100%);
    background: radial-gradient(center, ellipse cover, rgba(255,255,255,0.56) 0%,rgba(241,210,194,1) 100%);
}
.lb-overlay > div{
    position: relative;
    color: rgba(27,54,81,0.8);
    opacity: 0;
    filter: alpha(opacity=0); /* internet explorer */
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=0)"; /*IE8*/
    width: 550px;
    margin: 10px auto 0px auto;
    text-shadow: 0px 1px 1px rgba(255,255,255,0.6);
    -webkit-transition: opacity 0.3s linear 1.3s;
    -moz-transition: opacity 0.3s linear 1.3s;
    -o-transition: opacity 0.3s linear 1.3s;
    -ms-transition: opacity 0.3s linear 1.3s;
    transition: opacity 0.3s linear 1.3s;
}
.lb-overlay div h3,
.lb-overlay div p{
    padding: 0px 20px;
    width: 200px;
    height: 60px;
}
.lb-overlay div h3{
    font-size: 36px;
    float: left;
    text-align: right;
    border-right: 1px solid rgba(27,54,81,0.4);
}
.lb-overlay div h3 span,
.lb-overlay div p{
    font-size: 16px;
    font-family: Constantia, Palatino, "Palatino Linotype", "Palatino LT STD", Georgia, serif;
    font-style: italic;
}
.lb-overlay div h3 span{
    display: block;
    line-height: 6px;
}
.lb-overlay div p{
    text-align: left;
    float: left;
    width: 260px;
}
.lb-overlay a.lb-close{
    background: rgba(27,54,81,0.8);
    z-index: 1001;
    color: #fff;
    position: absolute;
    top: 43px;
    left: 50%;
    font-size: 15px;
    line-height: 26px;
    text-align: center;
    width: 50px;
    height: 23px;
    overflow: hidden;
    margin-left: -25px;
    opacity: 0;
    filter: alpha(opacity=0); /* internet explorer */
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=0)"; /*IE8*/
    -webkit-box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
    -moz-box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
    box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
    -webkit-transition: opacity 0.3s linear 1.2s;
    -moz-transition: opacity 0.3s linear 1.2s;
    -o-transition: opacity 0.3s linear 1.2s;
    -ms-transition: opacity 0.3s linear 1.2s;
    transition: opacity 0.3s linear 1.2s;
}
.lb-overlay img{
    /* height: 100%; For Opera max-height does not seem to work */
    max-height: 100%;
    position: relative;
    -webkit-box-shadow: 1px 1px 4px rgba(0,0,0,0.3);
    -moz-box-shadow: 1px 1px 4px rgba(0,0,0,0.3);
    box-shadow: 0px 2px 7px rgba(0,0,0,0.2);
}
.lb-overlay:target {
    width: auto;
    height: auto;
    bottom: 0px;
    right: 0px;
    padding: 80px 100px 120px 100px;
}
.lb-overlay:target img {
    -webkit-animation: fadeInScale 1.2s ease-in-out;
    -moz-animation: fadeInScale 1.2s ease-in-out;
    -o-animation: fadeInScale 1.2s ease-in-out;
    -ms-animation: fadeInScale 1.2s ease-in-out;
    animation: fadeInScale 1.2s ease-in-out;
}
.lb-overlay:target a.lb-close,
.lb-overlay:target > div{
    opacity: 1;
    filter: alpha(opacity=99); /* internet explorer */
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=99)"; /*IE8*/
}
@-webkit-keyframes fadeInScale {
  0% { -webkit-transform: scale(0.6); opacity: 0; }
  100% { -webkit-transform: scale(1); opacity: 1; }
}
@-moz-keyframes fadeInScale {
  0% { -moz-transform: scale(0.6); opacity: 0; }
  100% { -moz-transform: scale(1); opacity: 1; }
}
@-o-keyframes fadeInScale {
  0% { -o-transform: scale(0.6); opacity: 0; }
  100% { -o-transform: scale(1); opacity: 1; }
}
@-ms-keyframes fadeInScale {
  0% { -ms-transform: scale(0.6); opacity: 0; }
  100% { -ms-transform: scale(1); opacity: 1; }
}
@keyframes fadeInScale {
  0% { transform: scale(0.6); opacity: 0; }
  100% { transform: scale(1); opacity: 1; }
}

/* 
    100% Height for Opera as the max-height seems to be ignored, not optimal for large screens 
    http://bricss.net/post/11230266445/css-hack-to-target-opera 
*/
x:-o-prefocus, .lb-overlay img {
    height: 100%;
}

/* js lightbox открывание картинок */

/* Preload images */
body:after {
  content: url(/public/img/global/icon/close.png) url(/public/img/global/icon/loading.gif) url(/public/img/global/icon/prev.png) url(/public/img/global/icon/next.png);
  display: none;
}

.lightboxOverlay {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 9999;
  background-color: black;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
  opacity: 0.8;
  display: none;
}

.lightbox {
  position: absolute;
  left: 0;
  width: 100%;
  z-index: 10000;
  text-align: center;
  line-height: 0;
  font-weight: normal;
}

.lightbox .lb-image {
  display: block;
  height: auto;
  max-width: inherit;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
}

.lightbox a img {
  border: none;
}

.lb-outerContainer {
  position: relative;
  background-color: white;
  *zoom: 1;
  width: 250px;
  height: 250px;
  margin: 0 auto;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
  border-radius: 4px;
}

.lb-outerContainer:after {
  content: "";
  display: table;
  clear: both;
}

.lb-container {
  padding: 4px;
}

.lb-loader {
  position: absolute;
  top: 43%;
  left: 0;
  height: 25%;
  width: 100%;
  text-align: center;
  line-height: 0;
}

.lb-cancel {
  display: block;
  width: 32px;
  height: 32px;
  margin: 0 auto;
  background: url(/public/img/global/icon/loading.gif) no-repeat;
}

.lb-nav {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 10;
}

.lb-container > .nav {
  left: 0;
}

.lb-nav a {
  outline: none;
    }

.lb-prev, .lb-next {
  height: 100%;
  cursor: pointer;
  display: block;
}

.lb-nav a.lb-prev {
  width: 34%;
  left: 0;
  float: left;
  background: url(/public/img/global/icon/prev.png) left 48% no-repeat;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  -webkit-transition: opacity 0.6s;
  -moz-transition: opacity 0.6s;
  -o-transition: opacity 0.6s;
  transition: opacity 0.6s;
}

.lb-nav a.lb-prev:hover {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}

.lb-nav a.lb-next {
  width: 64%;
  right: 0;
  float: right;
  background: url(/public/img/global/icon/next.png) right 48% no-repeat;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  -webkit-transition: opacity 0.6s;
  -moz-transition: opacity 0.6s;
  -o-transition: opacity 0.6s;
  transition: opacity 0.6s;
}

.lb-nav a.lb-next:hover {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}

.lb-dataContainer {
  margin: 0 auto;
  padding-top: 5px;
  *zoom: 1;
  width: 100%;
  -moz-border-radius-bottomleft: 4px;
  -webkit-border-bottom-left-radius: 4px;
  border-bottom-left-radius: 4px;
  -moz-border-radius-bottomright: 4px;
  -webkit-border-bottom-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

.lb-dataContainer:after {
  content: "";
  display: table;
  clear: both;
}

.lb-data {
  padding: 0 4px;
  color: #ccc;
}

.lb-data .lb-details {
  width: 85%;
  float: left;
  text-align: left;
  line-height: 1.1em;
}

.lb-data .lb-caption {
  font-size: 13px;
  font-weight: bold;
  line-height: 1em;
}

.lb-data .lb-number {
  display: block;
  clear: left;
  padding-bottom: 1em;
  font-size: 12px;
  color: #999999;
}

.lb-data .lb-close {
  display: block;
  float: right;
  width: 30px;
  height: 30px;
  background: url(/public/img/global/icon/close.png) top right no-repeat;
  text-align: right;
  outline: none;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
  opacity: 0.7;
  -webkit-transition: opacity 0.2s;
  -moz-transition: opacity 0.2s;
  -o-transition: opacity 0.2s;
  transition: opacity 0.2s;
}

.lb-data .lb-close:hover {
  cursor: pointer;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}


/* Левое меню на главной */

#left-menu .l-menu ul{
  margin: 0px;
  padding: 0;
  }
.l-menu li{
    list-style :none;
    text-align: left;
}
.l-menu a{
    color: #FFF;
    text-decoration: none;
}
.l-menu ul.container{   
    margin: 0 auto;
    padding: 0;
}
.l-menu li.menu{
    padding: 5px 0;
}
#left-menu .l-menu li.menu.active_l {
    background-color: rgba(29, 28, 28, 0.5);
}
#left-menu .l-menu li.menu.active_l a.box1{
	color: #FFC800;
}
#left-menu .l-menu li.menu:hover{
    background-color: rgba(29, 28, 28, 0.5);
}
.l-menu li.button a{
   /* width: 200px;
    height: 34px;
    font-size: 21px; */
   display: block;
   overflow: hidden;
   position: relative;
   padding: 5px 20px 5px 20px;
}
.l-menu li.button a.box1:hover{
	color: #FFC800;
	transition: all 0.3s ease-in-out;
	text-decoration: none;
}
.l-menu li.button a span{
    /* This span acts as the right part of the section's background */
    height:44px;
    position:absolute;
    right:0;
    top:0;
    width:4px;
    display:block;
}
li.subblock_c.active_l a{
	color: #FFC800;
}
.l-menu li.button a.box1, li.button a.box2, li.button a.box3, li.button a.box4, li.button a.box5, li.button a.box6{
    color: rgb(999, 999, 999);
    font-weight: bold;
}
.dropdown{
    width: 220px;
    display: none;
    /* padding-top: 10px; */
}
#left-menu .dropdown{
    padding-top: 15px;
}
#left-menu .dropdown li{
    /* border-bottom: solid 1px white; */
    padding: 5px 25px;
    font-size: 16px;
}
#top-menu .dropdown li{
    padding: 0px 10px;
    font-size: 16px;
}

.active_c{
    background-color: rgba(181, 180, 180, 0.3) !important;
    border-radius: 5px;
}
.punct_menu_lvl_1 .active_c{
    color: #FFC800;
}


/* Левое меню на главной (конец)  */


/* Таблица новостой гланой стрнаниці*/
.mp-news {
    overflow: hidden;
    font-family: arial;
    font-size: 15px;
    line-height: 100%;
    text-align: center;
}
.mp-news div {
    float: left;
    width: 314px;
    height: 210px;
    margin: 5px 0 0 4px;
    overflow: hidden;
}
.mp-news div:nth-child(3n+1){
    margin: 5px 0 0 0;
}
.mp-news div img {
    width: 315px;
    height: 210px;
    transition: transform 1s cubic-bezier(0.68, 0.33, 0.29, 1.61);
}
.mp-news div:hover img {
    transform: scale3d(1.1,1.1,1);
}
.mp-news .mp_news_comment {
    background-color: rgba(0, 0, 0, 0.7);
    position: relative;
    bottom: 54px;
    height: 55px !important;
    margin: 0 !important;
    width: 40%;
    padding: 5px 0 0 0;
    transition: 0.2s width;
}
.mp-news div:hover .mp_news_comment {
    width: 100%;
}
.mp-news div:last-child div {
    /* text-align: center;
    font-weight: bold;
    padding: 15px 0 0 0 ; */
}
.mp-news a {
    text-decoration: none;
    color: white;
}

/* CONTAINER slider */

/* These are just the demo styles and these can be removed and Orbit 
will still work like a champ (except any content block needs a background which
our demo gets from this sheet) */
    
.content { background: url(/public/img/front/slider/slider_3.jpg); }
.content h1 {
	font-size: 40px; 
	text-transform: uppercase; 
	font-weight: bold; 
	text-align: center;
	/*margin-top: 180px;*/
	color: #222;
	line-height: 50px;  }
.content h3 {
	text-align: center; 
	font-size: 22px; 
	color: #222; }  

/* CSS for jQuery Orbit Plugin 1.2.3
 * www.ZURB.com/playground
 * Copyright 2010, ZURB
 * Free to use under the MIT license.
 * http://www.opensource.org/licenses/mit-license.php
 

/* PUT IN YOUR SLIDER ID AND SIZE TO MAKE LOAD BEAUTIFULLY
   ================================================== */
#featured { 
	width: 950px;
	height: 350px;
	background: #000 url('/public/img/front/slider/loading.gif') no-repeat center center;
	overflow: hidden;
}
#featured>img,  
#featured>div,
#featured>a {
    display: none;
}




/* CONTAINER
   ================================================== */

div.orbit-wrapper {
    width: 1px;
    height: 1px;
    position: relative;
}
div.orbit {
    width: 1px;
    height: 1px;
    position: relative;
    overflow: hidden;
}
div.orbit>img {
    position: absolute;
    top: 0;
    left: 0;
    display: none;
}
div.orbit>a {
    border: none;
    position: absolute;
    top: 0;
    left: 0;
    line-height: 0; 
    display: none;
}
.orbit>div {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* Note: If your slider only uses content or anchors, you're going to want to put the width and height declarations on the ".orbit>div" and "div.orbit>a" tags in addition to just the .orbit-wrapper */

/* TIMER
   ================================================== */

div.timer {
    width: 40px;
    height: 40px;
    overflow: hidden;
    position: absolute;
    top: 10px;
    right: 10px;
    opacity: .6;
    cursor: pointer;
    z-index: 1001;
}
span.rotator {
    display: block;
    width: 40px;
    height: 40px;
    position: absolute;
    top: 0;
    left: -20px;
    background: url(/public/img/front/slider/rotator-black.png) no-repeat;
    z-index: 3;
}
span.mask {
    display: block;
    width: 20px;
    height: 40px;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
    overflow: hidden;
}
span.rotator.move {
    left: 0;
}
span.mask.move {
    width: 40px;
    left: 0;
    background: url(/public/img/front/slider/timer-black.png) repeat 0 0;
}
span.pause {
    display: block;
    width: 40px;
    height: 40px;
    position: absolute;
    top: 0;
    left: 0;
    background: url(/public/img/front/slider/pause-black.png) no-repeat;
    z-index: 4;
    opacity: 0;
}
span.pause.active {
    background: url(/public/img/front/slider/pause-black.png) no-repeat 0 -40px;
}
div.timer:hover span.pause,
span.pause.active {
    opacity: 1;
}

/* CAPTIONS
   ================================================== */

.orbit-caption {
    display: none;
    font-family: Arial, Verdana;
}
.orbit-wrapper .orbit-caption {
    background: #000;
    background: rgba(0,0,0,.6);
    z-index: 1000;
    color: #fff;
	text-align: center;
	padding: 7px 0;
    font-size: 16px;
    position: absolute;
    right: 0;
    bottom: 0;
    width: 100%;
}

/* DIRECTIONAL NAV
   ================================================== */

div.slider-nav {
    display: block;
}
div.slider-nav span {
    width: 31px;
    height: 33px;
    text-indent: -9999px;
    position: absolute;
    z-index: 1000;
    top: 50%;
    /* margin-top: -50px; */
    cursor: pointer;
 }
div.slider-nav span.right {
    background: url(/public/img/front/slider/right-arrow.png);
    right: 0;
}
div.slider-nav span.left {
    background: url(/public/img/front/slider/left-arrow.png);
    left: 0;
}

/* BULLET NAV
   ================================================== */

.orbit-bullets {
       position: absolute;
    z-index: 1000;
    list-style: none;
    /* bottom: -40px; */
    /* left: 10%; */
    /* margin-left: -50px; */
    top: 10px;
    padding: 0;
}
.orbit-bullets li {
    float: left;
    margin-left: 5px;
    cursor: pointer;
    color: #999;
    text-indent: -9999px;
    background: url(/public/img/front/slider/bullets.png) no-repeat 7px 0;
    width: 14px;
    height: 7px;
    overflow: hidden;
}
.orbit-bullets li.active {
    color: #222;
    background-position: -8px 0;
}
.orbit-bullets li.has-thumb {
    background: none;
    width: 100px;
    height: 75px;
}
.orbit-bullets li.active.has-thumb {
    background-position: 0 0;
    border-top: 2px solid #000;
}


/* Слайдер фоток сотруднеков факультета */


/*************************************************
*
*   project:    liteAccordion - horizontal accordion plugin for jQuery
*   author:     Nicola Hibbert
*   url:        http://nicolahibbert.com/horizontal-accordion-jquery-plugin
*   demo:       http://www.nicolahibbert.com/demo/liteAccordion
*
/*************************************************/
/****************************************** Core */
.accordion { text-align: left; font: 'Helvetica Neue', Verdana, Arial; }
.accordion ol { position: relative; overflow: hidden; height: 100%; margin: 0; padding: 0; list-style-type: none; }
.accordion li > h2 { color: black; font-weight: normal; margin: 0; z-index: 2; position: absolute; top: 0; left: 0; -webkit-transform: translateX(-100%) rotate(-90deg); -webkit-transform-origin: right top; -moz-transform: translateX(-100%) rotate(-90deg); -moz-transform-origin: right top; 
    -o-transform: translateX(-100%) rotate(-90deg); -o-transform-origin: right top; -ms-transform: translateX(-100%) rotate(-90deg); -ms-transform-origin: right top; transform: translateX(-100%) rotate(-90deg); transform-origin: right top; filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3); }
.accordion li > h2 span { display: block; padding-right: 8%; text-align: right; height: 90%; margin-top: 5px; }
.accordion li > h2 b { display: inline-block; position: absolute; top: 10%; top: 42%\9; left: 10%; left: 5%\9; text-align: center; -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1); }
.accordion li > h2:hover { cursor: pointer; }
.accordion li > div { height: 100%; position: absolute; top: 0; z-index: 1; overflow: hidden; background: white; }
.accordion noscript p { padding: 10px; margin: 0; background: white; }

/****************************************** Basic */
.basic li > h2 { background: #333; color: white; line-height: 1.8em; }
.basic li > div h3 { margin: 15px 10px; }
.basic li > div p { margin: 10px; font-size: 14px; }

/****************************************** Dark */
.dark { border: 9px solid #353535; border-bottom-width: 8px; padding: 5px 5px 6px 0; background: #030303; -webkit-box-shadow: 0 -1px 0 #5b5b5b inset, 0 5px 15px rgba(0, 0, 0, 0.4); -moz-box-shadow: 0 -1px 0 #5b5b5b inset, 0 5px 15px rgba(0, 0, 0, 0.4); -o-box-shadow: 0 -1px 0 #5b5b5b inset, 0 5px 15px rgba(0, 0, 0, 0.4); 
    box-shadow: 0 -1px 0 #5b5b5b inset, 0 5px 15px rgba(0, 0, 0, 0.4); }
.dark li > h2 { background: #030303; font-size: 16px; line-height: 2.7em; text-shadow: 0 -1px 0 #030303; }
.dark li > h2 span { background: #353535; color: white; }
.dark li > h2 b { background: #353535\9; color: #030303; font-size: 20px; text-shadow: -1px 1px 0 #5b5b5b; }
.dark h2.selected span, .dark h2.selected span:hover { background: #434343; background: -webkit-gradient(linear, left top, right top, color-stop(0, #353535), color-stop(1, #555555)); background: -moz-linear-gradient(top left, #353535 0%, #555555 100%); }
.dark h2.selected b { background: #434343\9; }
.dark li > div { background: #030303; margin-left: 5px; }

/*************************************** Rounded */

/****************************************** gray */
.gray { border: 9px solid rgba(156, 154, 155,1); border-bottom-width: 8px; padding: 5px 5px 6px 0; background: #545454; -webkit-box-shadow: 0 -1px 0 #5b5b5b inset, 0 5px 15px rgba(0, 0, 0, 0.4); -moz-box-shadow: 0 -1px 0 #5b5b5b inset, 0 5px 15px rgba(0, 0, 0, 0.4); -o-box-shadow: 0 -1px 0 #5b5b5b inset, 0 5px 15px rgba(0, 0, 0, 0.4); 
    box-shadow: 0 -1px 0 #5b5b5b inset, 0 5px 15px rgba(0, 0, 0, 0.4); }
.gray li > h2 { background: #4E4D4D; font-size: 16px; line-height: 2.7em; text-shadow: 0 -1px 0 #030303; }
.gray li > h2 span { background: rgba(156, 154, 155,1); color: white; }
.gray li > h2 b { background: #353535\9; color: #030303; font-size: 20px; text-shadow: -1px 1px 0 #5b5b5b; }
.gray h2.selected span, .gray h2.selected span:hover { background: #434343; background: -webkit-gradient(linear, left top, right top, color-stop(0, #353535), color-stop(1, #555555)); background: -moz-linear-gradient(top left, #353535 0%, #555555 100%); }
.gray h2.selected b { background: #434343\9; }
.gray li > div { background: #736F6F; margin-left: 5px; }

/*************************************** Rounded */


.rounded { -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; }
.rounded li > h2 span { -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; }

/***************************************** Light */
/**************************************** Stitch */
/**
 * SyntaxHighlighter
 * http://alexgorbatchev.com/SyntaxHighlighter
 *
 * SyntaxHighlighter is donationware. If you are using it, please donate.
 * http://alexgorbatchev.com/SyntaxHighlighter/donate.html
 *
 * @version
 * 3.0.83 (July 02 2010)
 * 
 * @copyright
 * Copyright (C) 2004-2010 Alex Gorbatchev.
 *
 * @license
 * Dual licensed under the MIT and GPL licenses.
 */
.syntaxhighlighter a,
.syntaxhighlighter div,
.syntaxhighlighter code,
.syntaxhighlighter table,
.syntaxhighlighter table td,
.syntaxhighlighter table tr,
.syntaxhighlighter table tbody,
.syntaxhighlighter table thead,
.syntaxhighlighter table caption,
.syntaxhighlighter textarea {
  -moz-border-radius: 0 0 0 0 !important;
  -webkit-border-radius: 0 0 0 0 !important;
  background: none !important;
  border: 0 !important;
  bottom: auto !important;
  float: none !important;
  height: auto !important;
  left: auto !important;
  line-height: 1.1em !important;
  margin: 0 !important;
  outline: 0 !important;
  overflow: visible !important;
  padding: 0 !important;
  position: static !important;
  right: auto !important;
  text-align: left !important;
  top: auto !important;
  vertical-align: baseline !important;
  width: auto !important;
  box-sizing: content-box !important;
  font-family: "Consolas", "Bitstream Vera Sans Mono", "Courier New", Courier, monospace !important;
  font-weight: normal !important;
  font-style: normal !important;
  font-size: 1em !important;
  min-height: inherit !important;
  min-height: auto !important;
}
.syntaxhighlighter {
  width: 100% !important;
  margin: 1em 0 1em 0 !important;
  position: relative !important;
  overflow: auto !important;
  font-size: 1em !important;
}
.syntaxhighlighter.source {
  overflow: hidden !important;
}
.syntaxhighlighter .bold {
  font-weight: bold !important;
}
.syntaxhighlighter .italic {
  font-style: italic !important;
}
.syntaxhighlighter .line {
  white-space: pre !important;
}
.syntaxhighlighter table {
  width: 100% !important;
}
.syntaxhighlighter table caption {
  text-align: left !important;
  padding: .5em 0 0.5em 1em !important;
}
.syntaxhighlighter table td.code {
  width: 100% !important;
}
.syntaxhighlighter table td.code .container {
  position: relative !important;
}
.syntaxhighlighter table td.code .container textarea {
  box-sizing: border-box !important;
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  width: 100% !important;
  height: 100% !important;
  border: none !important;
  background: white !important;
  padding-left: 1em !important;
  overflow: hidden !important;
  white-space: pre !important;
}
.syntaxhighlighter table td.gutter .line {
  text-align: right !important;
  padding: 0 0.5em 0 1em !important;
}
.syntaxhighlighter table td.code .line {
  padding: 0 1em !important;
}
.syntaxhighlighter.nogutter td.code .container textarea, .syntaxhighlighter.nogutter td.code .line {
  padding-left: 0em !important;
}
.syntaxhighlighter.show {
  display: block !important;
}
.syntaxhighlighter.collapsed table {
  display: none !important;
}
.syntaxhighlighter.collapsed .toolbar {
  padding: 0.1em 0.8em 0em 0.8em !important;
  font-size: 1em !important;
  position: static !important;
  width: auto !important;
  height: auto !important;
}
.syntaxhighlighter.collapsed .toolbar span {
  display: inline !important;
  margin-right: 1em !important;
}
.syntaxhighlighter.collapsed .toolbar span a {
  padding: 0 !important;
  display: none !important;
}
.syntaxhighlighter.collapsed .toolbar span a.expandSource {
  display: inline !important;
}
.syntaxhighlighter .toolbar {
  position: absolute !important;
  right: 1px !important;
  top: 1px !important;
  width: 11px !important;
  height: 11px !important;
  font-size: 10px !important;
  z-index: 10 !important;
}
.syntaxhighlighter .toolbar span.title {
  display: inline !important;
}
.syntaxhighlighter .toolbar a {
  display: block !important;
  text-align: center !important;
  text-decoration: none !important;
  padding-top: 1px !important;
}
.syntaxhighlighter .toolbar a.expandSource {
  display: none !important;
}
.syntaxhighlighter.ie {
  font-size: .9em !important;
  padding: 1px 0 1px 0 !important;
}
.syntaxhighlighter.ie .toolbar {
  line-height: 8px !important;
}
.syntaxhighlighter.ie .toolbar a {
  padding-top: 0px !important;
}
.syntaxhighlighter.printing .line.alt1 .content,
.syntaxhighlighter.printing .line.alt2 .content,
.syntaxhighlighter.printing .line.highlighted .number,
.syntaxhighlighter.printing .line.highlighted.alt1 .content,
.syntaxhighlighter.printing .line.highlighted.alt2 .content {
  background: none !important;
}
.syntaxhighlighter.printing .line .number {
  color: #bbbbbb !important;
}
.syntaxhighlighter.printing .line .content {
  color: black !important;
}
.syntaxhighlighter.printing .toolbar {
  display: none !important;
}
.syntaxhighlighter.printing a {
  text-decoration: none !important;
}
.syntaxhighlighter.printing .plain, .syntaxhighlighter.printing .plain a {
  color: black !important;
}
.syntaxhighlighter.printing .comments, .syntaxhighlighter.printing .comments a {
  color: #008200 !important;
}
.syntaxhighlighter.printing .string, .syntaxhighlighter.printing .string a {
  color: blue !important;
}
.syntaxhighlighter.printing .keyword {
  color: #006699 !important;
  font-weight: bold !important;
}
.syntaxhighlighter.printing .preprocessor {
  color: gray !important;
}
.syntaxhighlighter.printing .variable {
  color: #aa7700 !important;
}
.syntaxhighlighter.printing .value {
  color: #009900 !important;
}
.syntaxhighlighter.printing .functions {
  color: #ff1493 !important;
}
.syntaxhighlighter.printing .constants {
  color: #0066cc !important;
}
.syntaxhighlighter.printing .script {
  font-weight: bold !important;
}
.syntaxhighlighter.printing .color1, .syntaxhighlighter.printing .color1 a {
  color: gray !important;
}
.syntaxhighlighter.printing .color2, .syntaxhighlighter.printing .color2 a {
  color: #ff1493 !important;
}
.syntaxhighlighter.printing .color3, .syntaxhighlighter.printing .color3 a {
  color: red !important;
}
.syntaxhighlighter.printing .break, .syntaxhighlighter.printing .break a {
  color: black !important;
}

/**
 * SyntaxHighlighter
 * http://alexgorbatchev.com/SyntaxHighlighter
 *
 * SyntaxHighlighter is donationware. If you are using it, please donate.
 * http://alexgorbatchev.com/SyntaxHighlighter/donate.html
 *
 * @version
 * 3.0.83 (July 02 2010)
 * 
 * @copyright
 * Copyright (C) 2004-2010 Alex Gorbatchev.
 *
 * @license
 * Dual licensed under the MIT and GPL licenses.
 */
.syntaxhighlighter {
  background-color: white !important;
}
.syntaxhighlighter .line.alt1 {
  background-color: white !important;
}
.syntaxhighlighter .line.alt2 {
  background-color: white !important;
}
.syntaxhighlighter .line.highlighted.alt1, .syntaxhighlighter .line.highlighted.alt2 {
  background-color: #e0e0e0 !important;
}
.syntaxhighlighter .line.highlighted.number {
  color: black !important;
}
.syntaxhighlighter table caption {
  color: black !important;
}
.syntaxhighlighter .gutter {
  color: #afafaf !important;
}
.syntaxhighlighter .gutter .line {
  border-right: 3px solid #6ce26c !important;
}
.syntaxhighlighter .gutter .line.highlighted {
  background-color: #6ce26c !important;
  color: white !important;
}
.syntaxhighlighter.printing .line .content {
  border: none !important;
}
.syntaxhighlighter.collapsed {
  overflow: visible !important;
}
.syntaxhighlighter.collapsed .toolbar {
  color: blue !important;
  background: white !important;
  border: 1px solid #6ce26c !important;
}
.syntaxhighlighter.collapsed .toolbar a {
  color: blue !important;
}
.syntaxhighlighter.collapsed .toolbar a:hover {
  color: red !important;
}
.syntaxhighlighter .toolbar {
  color: white !important;
  background: #6ce26c !important;
  border: none !important;
}
.syntaxhighlighter .toolbar a {
  color: white !important;
}
.syntaxhighlighter .toolbar a:hover {
  color: black !important;
}
.syntaxhighlighter .plain, .syntaxhighlighter .plain a {
  color: black !important;
}
.syntaxhighlighter .comments, .syntaxhighlighter .comments a {
  color: #008200 !important;
}
.syntaxhighlighter .string, .syntaxhighlighter .string a {
  color: blue !important;
}
.syntaxhighlighter .keyword {
  color: #006699 !important;
}
.syntaxhighlighter .preprocessor {
  color: gray !important;
}
.syntaxhighlighter .variable {
  color: #aa7700 !important;
}
.syntaxhighlighter .value {
  color: #009900 !important;
}
.syntaxhighlighter .functions {
  color: #ff1493 !important;
}
.syntaxhighlighter .constants {
  color: #0066cc !important;
}
.syntaxhighlighter .script {
  font-weight: bold !important;
  color: #006699 !important;
  background-color: none !important;
}
.syntaxhighlighter .color1, .syntaxhighlighter .color1 a {
  color: gray !important;
}
.syntaxhighlighter .color2, .syntaxhighlighter .color2 a {
  color: #ff1493 !important;
}
.syntaxhighlighter .color3, .syntaxhighlighter .color3 a {
  color: red !important;
}

.syntaxhighlighter .keyword {
  font-weight: bold !important;
}


.head-fak{
    height: 160px;
    margin-top: 15px;
}  
.head-fak img{
    float: left;
    width: 150px;
    height: 150px;
}
.head-fak h2{
    margin: 0 0 20px 160px;
    color: rgb(0, 0, 128);
}
.contact-fak{
    float: left;
    margin: 0 0 0 10px;
    font-family: "Arial";
    font-size: 16px;
    color: #396496;
    width: 790px;
} 
.contact-fak p{
    margin: 0; 
}
.news-fak{
    padding: 7px 5px;
    float: right;
    border: 2px dotted green;
}
.soc-con-fak {
    border-top: 2px solid;    
    padding: 2px 0 0 0;
    overflow: hidden;
}
.soc-con-fak img{
    width:20px;
}

figure { 
    display: block;
     width: 100%; 
     height: 100%; 
     margin: 0 
}
figure img {
        width: 185px;
}
figcaption { 
    display: block;
    width: 60%;
    padding: 10px 15px; 
    position: absolute;
    bottom: 20px;
    right: 30px; 
    z-index: 3;
    background: #545454;
    /*background: rgba(0,0,0,0.7);*/
    color: white;
    -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;
}


/*Нижня галерея для факультетов*/

.rg-image-wrapper{
    position:relative;
    padding:20px 30px;
    background:transparent url(/public/img/front/slider_fak/black.png) repeat top left;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    min-height:20px;
}
.rg-image{
    position:relative;
    text-align:center;
    line-height:0px;
}
.rg-image img{
    max-height:100%;
    max-width:100%;
}
.rg-image-nav a{
    position:absolute;
    top:0px;
    left:0px;
    background:#000 url(/public/img/front/slider_fak/nav.png) no-repeat -20% 50%;
    width:28px;
    height:100%;
    text-indent:-9000px;
    cursor:pointer;
    opacity:0.3;
    outline:none;
    -moz-border-radius: 10px 0px 0px 10px;
    -webkit-border-radius: 10px 0px 0px 10px;
    border-radius: 10px 0px 0px 10px;
}
.rg-image-nav a.rg-image-nav-next{
    right:0px;
    left:auto;
    background-position:115% 50%;
    -moz-border-radius: 0px 10px 10px 0px;
    -webkit-border-radius: 0px 10px 10px 0px;
    border-radius: 0px 10px 10px 0px;
}
.rg-image-nav a:hover{
    opacity:0.8;
}
.rg-caption {
    text-align:center;
    margin-top:15px;
    position:relative;
}
.rg-caption p{
    font-size:11px;
    letter-spacing:2px;
    font-family: 'Trebuchet MS', 'Myriad Pro', Arial;
    line-height:16px;
    padding:0 15px;
    text-transform:uppercase;
}
.rg-view{
    height:30px;
}
.rg-view a{
    display:block;
    float:right;
    width:16px;
    height:16px;
    margin-right:3px;
    background:#464646 url(/public/img/front/slider_fak/views.png) no-repeat top left;
    border:3px solid #464646;
    opacity:0.8;
}
.rg-view a:hover{
    opacity:1.0;
}
.rg-view a.rg-view-full{
    background-position:0px 0px;
}
.rg-view a.rg-view-selected{
    background-color:#6f6f6f;
    border-color:#6f6f6f;
}
.rg-view a.rg-view-thumbs{
    background-position:0px -16px;
}
.rg-loading{
    width:46px;
    height:46px;
    position:absolute;
    top:50%;
    left:50%;
    background:#000 url(/public/img/front/slider_fak/ajax-loader.gif) no-repeat center center;
    margin:-23px 0px 0px -23px;
    z-index:100;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    opacity:0.7;
}

/* Elastislide Style */
.es-carousel-wrapper{
    background: #101010;
    padding:10px 27px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    position:relative;
    -moz-box-shadow:0px 1px 3px rgba(0, 0, 0, 0.9);
    -webkit-box-shadow:0px 1px 3px rgba(0, 0, 0, 0.9);
    box-shadow:0px 1px 3px rgba(0, 0, 0, 0.9);
    position:relative;
    margin-bottom:20px;
}
.es-carousel{
    overflow:hidden;
    background:#000;
}
.es-carousel ul{
    display:none;
    padding: 0;
}
.es-carousel ul li{
    height:100%;
    float:left;
    display:block;
}
.es-carousel ul li a{
    display:block;
    border-style:solid;
    border-color:#222;
    opacity:0.8;
    -webkit-touch-callout:none;
    /* option */
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}
.es-carousel ul li.selected a{
    border-color:#fff;
    opacity:1.0;
}
.es-carousel ul li a img{
    display:block;
    border:none;
    max-height:100%;
    max-width:100%;
}
.es-nav span{
    position:absolute;
    top:50%;
    left:8px;
    background:transparent url(/public/img/front/slider_fak/nav_thumbs.png) no-repeat top left;
    width:14px;
    height:26px;
    margin-top:-13px;
    text-indent:-9000px;
    cursor:pointer;
    opacity:0.8;
}
.es-nav span.es-nav-next{
    right:8px;
    left:auto;
    background-position:top right;
}
.es-nav span:hover{
    opacity:1.0;
}

/*лайдерушишчка на факультетах англ */
.acc_content{
   display: none;
}

.punct_menu_lvl_1 {
    float:left;
    position: relative;
    margin: 5px;
    font-size: 16px;
    /*width: 240px;
    padding: 6px 40px;*/
}
.once_c_p {	
	width: 100%;
}
.cssmenu a,.punct_menu_lvl_1 a {
    color: #fff;
    display: block;
    text-align: center;
    height: 24px;
    text-decoration: none;
    /*background: url('/public/img/global/icon/punct_menu_bkgd.gif');*/
}
.cssmenu a,.punct_menu_lvl_1 a:hover {
    color: #FFC800;
    transition: all 0.3s ease-in-out;
}
.cssmenu ul li {
    float: left;
    min-height: 1px;
    line-height: 1em;
    vertical-align: middle;
}
.cssmenu ul li.hover,
.cssmenu ul li:hover {
    position: relative;
    z-index: 599;
    cursor: default;
}
.cssmenu ul ul {
    list-style: none;
    margin-top: 1px;
    position: absolute;
    top: 1px;
    left: 99%;
    z-index: 598;
    width: 100%;
}
.cssmenu ul ul li {
    float: none;
}
.cssmenu ul ul ul {
    top: 1px;
    left: 99%;
}
/*.cssmenu ul li:hover > ul {
    visibility: visible;
}*/
.cssmenu ul li {
    float: none;
}
.cssmenu ul ul li {
    font-weight: normal;
}
.cssmenu ul li > ul {
    display: none;
}
.cssmenu ul ul {
    padding: 0 0 0 20px;
}
        
.bbb {
 	display: block !important;
}
.aaa {
 	display: none;
}
.active a {
	background: url('/public/img/front/menu_img/h_punct1.gif') no-repeat !important;
}
.example-image {
	height: 300px;
	width: 200px;
	border: whitesmoke 1px solid;
}
.qqq {
	width: 700px;
}
#site-search {
    width: 130px;
    color: grey;
    font-style: italic;
    margin-left: 50px;
    border: 1px solid transparent;
    padding-left: 10px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
}
.vline {
    border-right: 2px solid rgb(999, 999, 999) !important;
    padding: 0 20px 0 20px ;
}

#head-text {
    text-align: center;
}
#head-text a {
    text-decoration: none;
    color: #fff;
    font-family: arial;
    font-weight: bold;
    font-size: 48px;
}

.fkns {
	margin-top: 20px;
    font-family: "Arial";
    font-size: 16px;
    color: #396496;
}
.fkns div {
	margin: 0 0 15px 0;
}
.fkns span {
	text-indent: 20px;
}

.fkns  p {
    margin: 0 0 0 15px;
}

.fkns b p {
	margin: 0 0 0 0px;
}

.fkns ul {
    margin: 0 ;
}

.ns p {
    margin: 0 ;
}

.ns li {
    margin-left: 70px;
    font-style: italic;
}


   

        
@media screen and (min-width: 1200px) {/* если окно браузера больше максимальной ширины сайта */ 
    html {
        margin-left: calc(100vw - 100%);
        margin-right: 0;
    }
}
 
/* Starter CSS for Flyout Menu */
.cssmenu {
	/*border: 1px solid black;*/
	margin: auto;
	margin-bottom: 20px;
	cursor: pointer;
}
.cssmenu {
    list-style: none;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
}

.l_menu ul {
display: none;
}
.cssmenu ul {
  list-style: none;
  padding: 0px;
  margin: 0px;
  text-indent: 0px;
}
.cssmenu li {
  /*margin-top: 3px; */
}

   /*скролл для подъема на вверх страницы */
.scrollup {
    width:40px;
    height:40px;
    opacity:0.3;
    position:fixed;
    bottom:50px;
    right:50px;
    display:none;
    text-indent:-9999px;
    background: url(/public/img/global/icon/scroll_top.png) no-repeat;
}
.table_vstup {
	font-size: 15px;
}