.container {
	width: 80%;
	margin: 30px auto;
	overflow: hidden;
}
.container ul li {
	list-style:none;
	float: left;
	font: 10px/1.5 Verdana, Helvetica, Sans-serif;
	width: 46%;
	margin: 2% 2% 20px 2%;
}
.container ul li a { 
	color: #5d5f5d;
}
 
.container ul li a img {
	max-width: 100%;
}
 
/* Media Queries */
@media only screen and (max-width : 940px),
only screen and (max-device-width : 940px){ 
	
	.container ul li {
		width: 21%;
	}
} 
@media only screen and (max-width : 720px),
only screen and (max-device-width : 720px){ 
 
	.container ul li {
		width: 29.33333%
	}
}
@media only screen and (max-width : 530px),
only screen and (max-device-width : 530px){ 
	.container ul li {
		width: 46%
	}
}
@media only screen and (max-width : 320px),
only screen and (max-device-width : 320px){  
	.container ul li {
		width: 96%
	}
}

/* Верхнее правое меню ===================================================== */

#nav {
    display: table;
    padding: 0px;
    position: relative; 
}
#nav ul {
   background:#3d6898; /* Цвет содержимого */
    border: 1px solid #3d6898;
    border-radius:3px;
    -khtml-border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    box-sizing: border-box; 
    box-shadow:0 0.1px  0.3px #d9d8e3;
    margin-top:8px;
    left: -9999px;
    overflow: hidden;
    padding: 0 0 0;
    position: absolute;
    top: -9999px;
}
#nav li {
    float: left;
    position: relative;
}
#nav li a {
    color: #FFFFFF;
    display: block;
    font-size: 13px;
    font-family: 'Open Sans', sans-serif;
    padding: 0 10px;
    text-decoration: none;
}
#nav li:hover > a {
 background-color: #3d6898; /* Цвет при наведении на одиночную кнопку */
 color: #FFFFFF; 
 width: 100%;
}
#nav li:hover > a.hsubs {
 background-color: #3d6898; /* Цвет при наведении на главную кнопку с подменю */
 color: #fff;
 height: 42px !important;
 line-height: 42px !important;
}
#nav li:hover ul.subs {
 left: 0;
 top: 34px;
 width: 135px;
}
#nav li:hover ul.subs2 {
 left: 0;
 top: 34px;
 width: 145px;
}
#nav li:hover ul.subs3 {
 left: 0;
 top: 34px;
 width: 150px;
}
#nav ul li {
 width: 100%;
 font-weight: normal;
 height: 32px !important;
 line-height: 32px !important;
}
#nav ul li:hover > a {
 background: #4a76a8 !important; /* Цвет при наведении на пункты подменю */
 box-sizing: border-box;
 font-weight: normal;
 height: 32px !important;
 line-height: 32px !important;

}
 
#submenu {
	float: right; /*Положение меню*/
}

/* Перенос текста ========================================================= */
@import url(http://fonts.googleapis.com/css?family=Philosopher&subset=cyrillic);

p {
    text-align: justify; /* текст необходимо растянуть на всю ширину блока, чтобы в дальнейшем переносить */ 
    /* свойство переноса слов для разных браузеров */
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    hyphens: auto;
    font-weight: normal;
    color: #000;
    font-family: 'Open Sans', sans-serif;
    font-size: 15px;
    line-height: 1.482; margin-top: -10px !important;
}

/* Верхнее левое меню ================================================================== */

#leftmenu ul.line{
	padding: 0px 0px 0px 0px !important;
	margin-left:52px;
	display: block;
	height: 42px;
	list-style-type: none;
}

#leftmenu ul.line li{
	float: left; /*Положение кнопок меню*/
	margin:0px 0px 0px 0px; /*Расстояние между кнопок кнопок меню*/
	padding: 0px 8px 2px 0px;
	height: 42px;
	display: block;
	position: relative;
	background: #4a76a8;
    border-right: 1px solid #4a76a8;
}

#leftmenu ul.line li:hover, #leftmenu ul.line li.selected{
	background: #3d6898; /*Цвет меню при наведении*/
}

#leftmenu ul.line li:hover a, #leftmenu ul.line li.selected a{
	color: #e7e4e4; /*Цвет шрифта при наведении*/
}

#leftmenu ul.line li:first-child{
	background: #4a76a8; /*Постоянный цвет первой кнопки*/
    border-right: none;
}

#leftmenu ul.line li:first-child:hover{
	background: #3d6898; /*Цвет при наведении*/
}

#leftmenu ul.line li:last-child{
    border-right: none;
}

#leftmenu ul.line li:first-child a{
	color: #fff; /*Цвет шрифта первой кнопки*/
    text-shadow: 0 0 0 #fff;
	font-size: 18px;
    font-weight: normal;
    position: relative;
    top: 0.5px;
    right: 0;
}

#leftmenu ul.line a{
    color: #fff; /*Цвет шрифта кнопок*/
	margin: 0px 0px 0px;
	padding: 12px 2px 10px 10px; 
	font-size: 18px;
    font-weight: bold;
	text-decoration: none;
	height: 18px;
	line-height: 19px;
	display: block;
	font-weight: normal;
    transition: background 0s ease 0s, color 0.2s linear 0s;
}

.fa::after { 
    content: "";
    padding-right: 5px;
}

#leftmenu {
	float: left; /*Положение меню*/
}

#leftmenu li:last-child {
background-position-x: 0 !important;
}

/* Слайдшоу фон сайта ================================================================== */

.cb-slideshow,
.cb-slideshow:after { 
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    z-index: 0; 
}
.cb-slideshow:after { 
    content: '';
    background: transparent url(../images/pattern.png) repeat top left; 
}
    .cb-slideshow li span {
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0px;
        left: 0px;
        color: transparent;
        background-size: cover;
        background-position: 50% 50%;
        background-repeat: none;
        opacity: 0;
        z-index: 0;
        -webkit-backface-visibility: hidden;
        -webkit-animation: imageAnimation 48s linear infinite 0s;
        -moz-animation: imageAnimation 48s linear infinite 0s;
        -o-animation: imageAnimation 48s linear infinite 0s;
        -ms-animation: imageAnimation 48s linear infinite 0s;
        animation: imageAnimation 48s linear infinite 0s;
    }
.cb-slideshow li div { 
    z-index: 1000;
    position: absolute;
    bottom: 30px;
    left: 0px;
    width: 100%;
    text-align: center;
    opacity: 0;
    color: #fff;
    -webkit-animation: titleAnimation 48s linear infinite 0s;
    -moz-animation: titleAnimation 48s linear infinite 0s;
    -o-animation: titleAnimation 48s linear infinite 0s;
    -ms-animation: titleAnimation 48s linear infinite 0s;
    animation: titleAnimation 48s linear infinite 0s; 
}
.cb-slideshow li div h3 { 
    font-family:tahoma, arial, verdana, sans-serif, Lucida Sans;
    font-size: 28px;
    padding: 0;
    line-height: 28px; 
}
.cb-slideshow li:nth-child(1) span { 
    background-image: url(../images/1.png);
}
.cb-slideshow li:nth-child(2) span { 
    background-image: url(../images/2.png);
    -webkit-animation-delay: 6s;
    -moz-animation-delay: 6s;
    -o-animation-delay: 6s;
    -ms-animation-delay: 6s;
    animation-delay: 6s; 
}
.cb-slideshow li:nth-child(3) span { 
    background-image: url(../images/3.png);
    -webkit-animation-delay: 12s;
    -moz-animation-delay: 12s;
    -o-animation-delay: 12s;
    -ms-animation-delay: 12s;
    animation-delay: 12s; 
}
.cb-slideshow li:nth-child(4) span { 
    background-image: url(../images/4.png);
    -webkit-animation-delay: 18s;
    -moz-animation-delay: 18s;
    -o-animation-delay: 18s;
    -ms-animation-delay: 18s;
    animation-delay: 18s; 
}
.cb-slideshow li:nth-child(5) span { 
    background-image: url(../images/5.png);
    -webkit-animation-delay: 24s;
    -moz-animation-delay: 24s;
    -o-animation-delay: 24s;
    -ms-animation-delay: 24s;
    animation-delay: 24s; 
}
.cb-slideshow li:nth-child(6) span { 
    background-image: url(../images/6.png);
    -webkit-animation-delay: 30s;
    -moz-animation-delay: 30s;
    -o-animation-delay: 30s;
    -ms-animation-delay: 30s;
    animation-delay: 30s; 
}
.cb-slideshow li:nth-child(7) span { 
    background-image: url(../images/7.png);
    -webkit-animation-delay: 36s;
    -moz-animation-delay: 36s;
    -o-animation-delay: 36s;
    -ms-animation-delay: 36s;
    animation-delay: 36s; 
}
.cb-slideshow li:nth-child(8) span { 
    background-image: url(../images/8.png);
    -webkit-animation-delay: 42s;
    -moz-animation-delay: 42s;
    -o-animation-delay: 42s;
    -ms-animation-delay: 42s;
    animation-delay: 42s; 
}
.cb-slideshow li:nth-child(9) span { 
    background-image: url(../images/9.png);
    -webkit-animation-delay: 48s;
    -moz-animation-delay: 48s;
    -o-animation-delay: 48s;
    -ms-animation-delay: 48s;
    animation-delay: 48s; 
}
.cb-slideshow li:nth-child(2) div { 
    -webkit-animation-delay: 6s;
    -moz-animation-delay: 6s;
    -o-animation-delay: 6s;
    -ms-animation-delay: 6s;
    animation-delay: 6s; 
}
.cb-slideshow li:nth-child(3) div { 
    -webkit-animation-delay: 12s;
    -moz-animation-delay: 12s;
    -o-animation-delay: 12s;
    -ms-animation-delay: 12s;
    animation-delay: 12s; 
}
.cb-slideshow li:nth-child(4) div { 
    -webkit-animation-delay: 18s;
    -moz-animation-delay: 18s;
    -o-animation-delay: 18s;
    -ms-animation-delay: 18s;
    animation-delay: 18s; 
}
.cb-slideshow li:nth-child(5) div { 
    -webkit-animation-delay: 24s;
    -moz-animation-delay: 24s;
    -o-animation-delay: 24s;
    -ms-animation-delay: 24s;
    animation-delay: 24s; 
}
.cb-slideshow li:nth-child(6) div { 
    -webkit-animation-delay: 30s;
    -moz-animation-delay: 30s;
    -o-animation-delay: 30s;
    -ms-animation-delay: 30s;
    animation-delay: 30s; 
}
.cb-slideshow li:nth-child(7) div { 
    -webkit-animation-delay: 36s;
    -moz-animation-delay: 36s;
    -o-animation-delay: 36s;
    -ms-animation-delay: 36s;
    animation-delay: 36s; 
}
.cb-slideshow li:nth-child(8) div { 
    -webkit-animation-delay: 42s;
    -moz-animation-delay: 42s;
    -o-animation-delay: 42s;
    -ms-animation-delay: 42s;
    animation-delay: 42s; 
}
.cb-slideshow li:nth-child(9) div { 
    -webkit-animation-delay: 48s;
    -moz-animation-delay: 48s;
    -o-animation-delay: 48s;
    -ms-animation-delay: 48s;
    animation-delay: 48s; 
}

/* Animation for the slideshow images */
@-webkit-keyframes imageAnimation { 
    0% { opacity: 0;
    -webkit-animation-timing-function: ease-in; }
    8% { opacity: 1;
         -webkit-animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 0 }
    100% { opacity: 0 }
}
@-moz-keyframes imageAnimation { 
    0% { opacity: 0;
    -moz-animation-timing-function: ease-in; }
    8% { opacity: 1;
         -moz-animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 0 }
    100% { opacity: 0 }
}
@-o-keyframes imageAnimation { 
    0% { opacity: 0;
    -o-animation-timing-function: ease-in; }
    8% { opacity: 1;
         -o-animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 0 }
    100% { opacity: 0 }
}
@-ms-keyframes imageAnimation { 
    0% { opacity: 0;
    -ms-animation-timing-function: ease-in; }
    8% { opacity: 1;
         -ms-animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 0 }
    100% { opacity: 0 }
}
@keyframes imageAnimation { 
    0% { opacity: 0;
    animation-timing-function: ease-in; }
    8% { opacity: 1;
         animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 0 }
    100% { opacity: 0 }
}
/* Animation for the title */
@-webkit-keyframes titleAnimation { 
    0% { opacity: 0 }
    8% { opacity: 1 }
    17% { opacity: 1 }
    19% { opacity: 0 }
    100% { opacity: 0 }
}
@-moz-keyframes titleAnimation { 
    0% { opacity: 0 }
    8% { opacity: 1 }
    17% { opacity: 1 }
    19% { opacity: 0 }
    100% { opacity: 0 }
}
@-o-keyframes titleAnimation { 
    0% { opacity: 0 }
    8% { opacity: 1 }
    17% { opacity: 1 }
    19% { opacity: 0 }
    100% { opacity: 0 }
}
@-ms-keyframes titleAnimation { 
    0% { opacity: 0 }
    8% { opacity: 1 }
    17% { opacity: 1 }
    19% { opacity: 0 }
    100% { opacity: 0 }
}
@keyframes titleAnimation { 
    0% { opacity: 0 }
    8% { opacity: 1 }
    17% { opacity: 1 }
    19% { opacity: 0 }
    100% { opacity: 0 }
}

/* Show at least something when animations not supported */
.no-cssanimations .cb-slideshow li span{
	opacity: 1;
}

/* monitors and laptops */
@media screen and (max-width: 1240px) {
    #submenu {display: none; /*Оключение меню*/}
}
@media screen and (max-width: 1140px) { 
    .cb-slideshow li div h3 { font-size: 24px }
    .modalbutton {display: none; /*Оключение кнопок*/}
}
@media screen and (max-width: 600px) { 
    .cb-slideshow li div h3 { font-size: 24px }
}