.container {
max-width: 1920px;
width: auto;
padding: 80px 0 0;
box-shadow: 0 0 100px #000;
overflow: hidden;
margin: 0 auto;
}
.wrap {
width: 1410px;
margin: 0 auto;
}
.left {
float: left;
}
.right {
float: right;
}
.clear {
clear: both;
}
header {
position: fixed;
top: 0;
left: 0;
right: 0;
background: #061534;
z-index: 200;
transition: all .3s;
}
.fixed header {
box-shadow: 0 0 20px #000;
}
header .wrap {
height: 80px;
font-size: 15px;
line-height: 30px;
transition: all .3s;
}
.fixed header .wrap {
height: 50px;
}
#menu-button {
float: left;
width: 50px;
height: 50px;
padding: 14px 15px;
margin: 15px 90px 0 0;
cursor: pointer;
position: relative;
z-index: 210;
transition:all .3s;
}
.fixed #menu-button {
margin: 0 90px 0 0;
}
#menu-button i {
display: block;
height: 2px;
background: #fff;
margin: 4px 0;
transition:all .5s;
}
#menu-button:hover {
background: #fff2;
}
#menu-button:hover i {
}
#menu-button.o {
}
#menu-button.o i {
}
#menu-shadow {
position: fixed;
top: -500%;
left: 0;
right: 0;
height: 500%;
background: linear-gradient(to bottom, #0009, #0000);
transition:all .5s;
z-index: 220;
}
#menu-shadow.o {
top: 0;
}
#menu {
position: fixed;
top: -100%;
left: 0;
width: 25%;
height: 100%;
padding: 30px;
background: #061534;
font-size: 19px;
color: #fff;
transition:all .5s;
z-index: 230;
overflow: auto;
}
#menu.o {
top: 0;
box-shadow: 0 0 100px #000;
}
#menu > i {
width: 50px;
height: 50px;
position: fixed;
top: -50px;
left: 20%;
cursor: pointer;
transition:all .5s;
}
#menu > i:before, #menu > i:after {
content: '';
width: 50px;
height: 2px;
background: #fff;
position: absolute;
top: 24px;
left: 0;
}
#menu > i:before {
transform: rotate(45deg);
}
#menu > i:after {
transform: rotate(-45deg);
}
#menu.o > i {
top: 30px;
}
#menu .logo {
float: none;
margin: 0;
}
#menu .logo img {
display: inline;
}
#menu a {
color: #fff;
}
#menu nav {
font-size: 0;
margin: 20px 0;
}
#menu nav ul {
font-size: 19px;
}
#menu nav ul li {
margin: 0 0 .5em;
position: relative;
}
#menu nav ul li.sub:before {
content: '';
border: 3px solid transparent;
border-top-color: #fff;
position: absolute;
top: 15px;
right: 10px;
}
#menu nav ul li a {
display: block;
padding: 5px 15px;
line-height: 1.2;
position: relative;
overflow: hidden;
}
#menu nav ul li a:before, #menu nav ul li a:after {
content: '';
width: 100%;
height: 100%;
background: #fff1;
position: absolute;
bottom: 0;
transition:all .3s;
}
#menu nav ul li a:before {
left: -100%;
}
#menu nav ul li a:after {
left: 100%;
}
#menu nav ul li a:hover:before, #menu nav ul li a:hover:after {
left: 0;
}
#menu nav ul li div {
font-size: 17px;
margin: 0 15px 1em;
display: none;
}
#menu nav ul li.o div {
display: block;
}
#menu form {
font-size: 0;
margin: 30px 0;
}
#menu form input {
display: inline-block;
vertical-align: top;
width: calc(100% - 48px);
padding: 0 10px;
border: 2px solid #fff;
background: none;
background: #fff1;
border-radius: 0;
font-size: 17px;
color: #fff;
margin: 0;
}
#menu form button {
width: 50px;
height: 50px;
padding: 0;
border: 2px solid #fff;
background: url(../i/srch.png) no-repeat 50% 50%;
background: url(../i/srch.png) no-repeat 50% 50%, #fff1;
border-radius: 0;
font-size: 0;
margin: 0 0 0 -2px;
}
#menu form button:hover {
background-color: #fff3;
}
.logo {
float: left;
margin: 20px 0;
}
.fixed header .logo {
margin: 5px 0;
}
.logo img {
display: block;
}
#special {
float: right;
width: 30px;
height: 30px;
margin: 25px 0 0 20px;
transition:all .3s;
}
.fixed #special {
margin: 10px 0 0 20px;
}
#special img {
display: block;
margin: 9px auto;
}
#special:hover {
background: #fff2;
}
.lang {
float: right;
margin: 25px 0 0 35px;
position: relative;
transition:all .3s;
}
.fixed .lang {
margin: 10px 0 0 35px;
}
.lang > span, #contacts > span {
display: block;
font-weight: 700;
color: #fff;
cursor: pointer;
}
.lang > span:after, #contacts > span:after {
content: '';
display: inline-block;
vertical-align: middle;
border: 3px solid transparent;
border-top-color: #fff;
margin: 0 0 0 15px;
}
.lang > div, #contacts > section {
position: absolute;
top: 30px;
right: -20px;
background: #fff;
border-radius: 5px;
box-shadow: 0 3px 10px #0003;
line-height: 1.3;
}
.lang > div {
width: 80px;
padding: 5px 0;
display: none;
}
.lang:hover > div {
display: block;
}
.lang > div a {
display: block;
padding: 5px 20px;
font-weight: 700;
}
.lang > div a:hover {
background: #0001;
}
.msg {
float: right;
margin: 25px 0 0 25px;
transition:all .3s;
}
.fixed header .msg {
margin: 10px 0 0 25px;
}
.msg a {
display: inline-block;
border-radius: 50%;
background: #e3e7e2;
}
.msg a img {
display: block;
}
.msg a:hover {
background: #fff;
box-shadow: 0 0 3px #fff;
}
.msg a:hover {
}
#contacts {
float: right;
margin: 25px 0 0;
position: relative;
transition:all .3s;
}
.fixed #contacts {
margin: 10px 0 0;
}
#contacts > span {
}
#contacts > span:after {
}
#contacts > section {
width: 250px;
color: #000;
padding: 20px;
display: none;
}
#contacts:hover > section {
display: block;
}
#contacts > section div {
padding: 20px;
border-bottom: 1px solid #d9d9d9;
margin: -20px -20px 20px;
}
#contacts > section strong {
display: block;
font-size: 17px;
margin: .3em 0 0;
}
#contacts > section strong a {
}
#contacts > section span {
display: block;
font-size: 11px;
color: #333;
}
#contacts > section p {
}
#contacts > section .button {
height: 30px;
line-height: 30px;
font-size: 13px;
padding: 0 30px;
}
#contacts > section .links {
border: 0;
border-top: 1px solid #d9d9d9;
margin: 20px -20px -20px;
text-align: center;
}
#contacts > section .links a {
display: inline-block;
border-radius: 50%;
background: #b38220;
margin: 0 2px;
}
#contacts > section .links a img {
display: block;
}
#contacts > section .links a:hover {
background: #000;
}
main {
}
#top-slider, #top {
height: 800px;
background: #061534;
}
#top {
height: 520px;
overflow: hidden;
position: relative;
}
#top-slider ul {
}
#top-slider ul li {
overflow: hidden;
}
#top-slider ul li img, #top img {
position: absolute;
top: 0;
left: 50%;
width: auto;
transform: translateX(-50%);
opacity: .6;
}
#top-slider ul li div, #top div {
text-align: center;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
padding: 0 150px;
}
#top div > span, #top div > a {
display: inline-block;
padding: 0 30px;
background: #b38220;
font-size: 12px;
line-height: 20px;
color: #fff;
margin: 0 0 2em;
}
#top div > a:hover {
background: #fff;
color: #061534;
}
#top-slider ul li div > strong, #top div > strong {
display: block;
color: #fff;
font-size: 50px;
font-weight: 900;
line-height: 1.2;
text-transform: uppercase;
}
#top-slider ul li div > a {
display: inline-block;
height: 60px;
line-height: 60px;
font-size: 17px;
color: #fff;
padding: 0 64px;
background: #b38220;
border-radius: 30px;
margin: 80px 0 0;
}
#top-slider ul li div > a:hover {
background: #061534;
}
#top-slider > .simple-carousel-left, #top-slider > .simple-carousel-right, #info-slider > .simple-carousel-left, #info-slider > .simple-carousel-right, #team > .simple-carousel-left, #team > .simple-carousel-right, .img-slider > .simple-carousel-left, .img-slider > .simple-carousel-right {
width: 44px;
height: 44px;
background: url(../i/arr1.png);
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
z-index: 30;
}
.img-slider > .simple-carousel-left, .img-slider > .simple-carousel-right {
margin: -22px 0 0!important;
transform: none;
}
#top-slider > .simple-carousel-left, #info-slider > .simple-carousel-left, #team > .simple-carousel-left, .img-slider > .simple-carousel-left {
margin: 0 0 0 -683px;
}
.img-slider > .simple-carousel-left {
left: 30px;
}
#top-slider > .simple-carousel-right, #info-slider > .simple-carousel-right, #team > .simple-carousel-right, .img-slider > .simple-carousel-right {
background-position: -44px 0;
margin: 0 0 0 683px;
}
.img-slider > .simple-carousel-right {
left: auto;
right: 30px;
}
#top-slider > .simple-carousel-left:hover, #info-slider > .simple-carousel-left:hover, #team > .simple-carousel-left:hover, .img-slider > .simple-carousel-left:hover {
background-position: 0 -44px;
}
#top-slider > .simple-carousel-right:hover, #info-slider > .simple-carousel-right:hover, #team > .simple-carousel-right:hover, .img-slider > .simple-carousel-right:hover {
background-position: -44px -44px;
}
#top-slider > section {
position: absolute;
left: 0;
right: 0;
bottom: 50px;
height: 13px;
text-align: center;
z-index: 30;
}
#top-slider > section a {
display: inline-block;
vertical-align: top;
width: 13px;
height: 13px;
background: #fff;
border-radius: 50%;
opacity: .2;
margin: 0 2px;
}
#top-slider > section a:hover {
opacity: .5;
}
#top-slider > section a.active {
opacity: 1;
background: #b38220;
}
.top-links {
font-size: 0;
background: #061534;
}
.top-links .wrap {
}
.top-links a {
display: inline-block;
vertical-align: top;
width: 25%;
height: 200px;
padding: 25px 2%;
color: #6b81b2;
font-size: 13px;
text-align: center;
position: relative;
}
.top-links a:before {
content: '';
width: 1px;
height: 80px;
background: #405380;
position: absolute;
left: 0;
top: 60px;
}
.top-links a:first-child:before {
display: none;
}
.top-links a:after, .top-links a.active:after {
content: '';
width: 100%;
height: 0;
background: linear-gradient(to top, #fff0, #fff1);
position: absolute;
top: 0;
left: 0;
transition:all .3s;
}
.top-links a:hover:after, .top-links a.active:after {
height: 100%;
}
.top-links a.active:after {
border-bottom: 4px solid #ae8626;
}
.top-links a i {
display: block;
width: 40px;
height: 40px;
margin: 0 auto 10px;
}
.top-links a i img {
}
.top-links a b {
display: block;
font-size: 17px;
color: #fff;
margin: 0 0 10px;
}
.main .main-block.wrap {
padding: 60px 0;
text-align: center;
}
.main-block p {
padding: 0 8%;
font-size: 19px;
margin: 0 0 60px;
}
.main-block p strong {
color: #000;
}
.main-block div {
font-size: 0;
margin: 0 -15px;
}
.main-block div a {
display: inline-block;
vertical-align: top;
height: 500px;
width: calc(25% - 30px);
margin: 0 15px;
position: relative;
}
.main-block div a img {
}
.main-block div a span {
line-height: 90px;
padding: 0 50px;
background: #b38220;
position: absolute;
left: 0;
right: 0;
bottom: 0;
transition:all .3s;
}
.main-block div a:hover span {
line-height: 120px;
}
.main-block div a span b {
display: inline-block;
vertical-align: middle;
line-height: 1.2;
font-size: 19px;
color: #fff;
}
.main-news {
background: #c5ccd9;
background: #061534;
color: #fff;
}
.main-news ul {
font-size: 0;
width: 1440px;
padding: 60px 0;
}
.main-news ul li {
display: inline-block;
vertical-align: top;
width: calc(33.33% - 30px);
margin: 0 15px;
}
.main-news ul li > a {
float: left;
}
.main-news ul li aside {
height: 90px;
padding: 5px 0 0;
line-height: 1.2;
margin: 0 0 0 140px;
}
.main-news ul li aside strong {
display: block;
font-size: 17px;
margin: 0 0 .5em;
}
.main-news ul li aside strong a {
display: block;
color: #fff;
}
.main-news ul li aside span {
display: block;
font-size: 13px;
color: #fff;
}
.main-news ul li p {
font-size: 15px;
margin: 1em 0 0;
}
#info-slider {
height: 840px;
}
#info-slider ul {
}
#info-slider ul li {
padding: 80px 15%;
}
#info-slider ul li > img {
float: left;
height: 680px;
}
#info-slider ul li aside {
height: 680px;
padding: 60px 0 0;
margin: 0 0 0 540px;
position: relative;
}
#info-slider ul li aside strong {
display: block;
font-size: 40px;
line-height: 1;
margin: 0 0 1em;
}
#info-slider ul li aside p {
font-size: 17px;
}
#info-slider ul li aside div {
position: absolute;
left: 0;
bottom: 40px;
}
#info-slider ul li aside div b {
display: block;
}
.main main > .video {
text-align: center;
margin: 0 0 60px;
}
.main main > .video h3 {
font-size: 30px;
margin: 0 0 1em;
}
.main main > .video iframe {
}
.advantages {
background: #061534;
}
.advantages ul {
font-size: 0;
text-align: center;
}
.advantages ul li {
display: inline-block;
vertical-align: top;
width: 16.66%;
padding: 40px 10px;
font-size: 15px;
color: #fff;
}
.advantages ul li i {
display: block;
width: 60px;
height: 60px;
margin: 0 auto 15px;
}
.advantages ul li i img {
}
.main-contacts {
position: relative;
background: #eee;
}
.main-contacts .wrap {
height: 620px;
position: relative;
}
.main-contacts .wrap form {
float: right;
width: 50%;
padding: 45px 0 0 45px;
}
.main-contacts .wrap form strong {
display: block;
font-size: 30px;
margin: 0 0 1em;
}
.main-contacts .wrap form label {
}
.main-contacts .wrap form input, .main-contacts .wrap form textarea {
border: 2px solid #b0b3af;
background: none;
border-radius: 0;
box-shadow: none;
}
.main-contacts .wrap form input:focus, .main-contacts .wrap form textarea:focus {
border-color: #b38220;
background: #fff;
}
.main-contacts .wrap form input {
width: 50%;
}
.main-contacts .wrap form textarea {
width: 100%;
}
.main-contacts .wrap form button {
height: 60px;
font-size: 17px;
background: #b38220;
padding: 0 60px;
border-radius: 30px;
}
.main-contacts .wrap form button:hover {
background: #061534;
}
.main-contacts .wrap div {
width: 50%;
height: 40px;
background: #b38220;
padding: 0 20px;
font-size: 13px;
line-height: 40px;
color: #fff;
position: absolute;
bottom: 0;
left: 0;
z-index: 20;
}
.main-contacts .wrap div img {
vertical-align: middle;
margin: 0 5px 0 0;
}
.main-contacts #map {
position: absolute;
top: 0;
left: 0;
width: 50%;
height: 100%;
z-index: 10;
}
.main .partners.wrap {
padding: 20px 0;
text-align: center;
}
.partners a {
display: inline-block;
vertical-align: middle;
margin: 10px;
}
.partners a img {
display: block;
}
.chiefs {
background: #eee;
}
.chiefs .wrap {
height: 120px;
line-height: 120px;
font-size: 0;
}
.chiefs a {
display: inline-block;
width: 50%;
padding: 0 2%;
font-size: 15px;
}
.chiefs a:hover {
background: #fff8;
}
.chiefs a img {
vertical-align: middle;
margin: 0 20px 0 0;
}
.chiefs a span {
display: inline-block;
vertical-align: middle;
width: 65%;
line-height: 1.2;
}
main > .wrap {
padding: 0 240px 100px;
}
.main main > .wrap {
padding: 0;
}
.path {
font-size: 13px;
line-height: 1.2;
color: #000;
padding: 12px 0;
border-bottom: 1px solid #e6e6e6;
margin: 0 -240px 40px;
}
.path a {
color: #1779bc;
}
.path a:hover {
color: #000;
}
.path span {
color: #485366;
margin: 0 5px;
}
article {
line-height: 1.5;
}
article strong {
color: #000;
}
article img, .p-desc img {
max-width: 100%;
height: auto;
}
article ul, article ol, .p-desc ul, .p-desc ol {
color: #000;
}
article ul, .p-desc ul {
margin: 1em 0;
}
article ol, .p-desc ol {
margin: 1em 25px;
}
article ul li, .p-desc ul li {
position: relative;
padding: 0 25px;
margin: .2em 0;
}
article ul li:before, .p-desc ul li:before {
content: '—';
position: absolute;
top: 2px;
left: 0;
text-shadow: 0 1px 0 #000;
}
article ol li, .p-desc ol li {
margin: .2em 0;
}
.tbl {
overflow-x: auto;
}
article table, .p-desc table {
margin: 1em 0;
}
article table th, article table td, .p-desc table th, .p-desc table td {
}
article table th, article table td, .p-desc table th, .p-desc table td {
text-align: left;
padding: 10px 20px;
}
article table th, .p-desc table th {
border-bottom: 1px solid #b3b3b3;
}
article table td, .p-desc table td {
border-bottom: 1px solid #ccc;
}
article table th:first-child, article table td:first-child, .p-desc table th:first-child, .p-desc table td:first-child {
padding: 10px 50px 10px 0;
}
article table th:last-child, article table td:last-child, .p-desc table th:last-child, .p-desc table td:last-child {
padding: 10px 0 10px 20px;
}
article table th+th, article table td+td, .p-desc table th+th, .p-desc table td+td {
text-align: right;
}
.img-left {
float: left;
margin: 0 30px 10px 0;
}
.img-right {
float: right;
margin: 0 0 10px 30px;
}
article .button, .p-desc .button {
line-height: 1.2;
padding: 10px 20px;
height: auto;
}
.cert {
font-size: 0;
margin: 30px -3px;
}
.cert li {
display: inline-block;
vertical-align: top;
padding: 0;
margin: 0 3px 10px;
}
.cert li:before {
display: none;
}
.cert li a {
display: block;
}
.cert li a img {
display: block;
}
.form-table {
}
.form-table td {
width: 50%;
padding: 10px;
text-align: left;
}
.form-table td:first-child {
padding: 10px 10px 10px 0;
}
.form-table td:last-child {
padding: 10px 0 10px 10px;
}
.form-table label {
display: inline;
font-size: 17px;
margin: 0;
}
.form-table input, .form-table select, .form-table textarea {
display: inline;
margin: 0;
}
.form-table input[type="radio"]+label, .form-table input[type="checkbox"]+label {
display: inline;
margin: 0 10px 0 0;
}
.form-table button {
margin: 0;
}
.captcha {
}
.captcha img {
margin: 0;
}
.captcha input {
width: 180px;
text-align: center;
padding: 0;
margin: 0;
}
.img-slider {
height: 550px;
line-height: 550px;
text-align: center;
background: #c5ccd9;
margin: 2em 0;
}
.img-slider ul {
}
.img-slider ul li {
padding: 0;
margin: 0;
}
.img-slider ul li:before {
display: none;
}
.img-slider ul li img {
display: inline-block;
vertical-align: middle;
max-width: 95%;
max-height: 95%;
}
.media-list {
font-size: 0;
margin: 40px -240px 0;
text-align: center;
}
.media-list li {
display: inline-block;
vertical-align: top;
width: 380px;
height:240px;
margin: 0 15px 30px;
font-size: 17px;
text-align: left;
position:relative;
}
.media-list li a {
display:block;
height:100%;
}
.media-list li a img {
display:block;
width:100%;
height:100%;
object-fit:cover;
}
.media-list li a h2 {
position:absolute;
bottom:0;
left:0;
right:0;
padding:20px;
z-index:11;
}
.media-list li a span {
position:absolute;
bottom:10px;
right:10px;
z-index:12;
}
.media-list li a:after {
content:'';
position:absolute;
top:0;
left:0;
right:0;
bottom:0;
background:linear-gradient(to top,#eeef 0,#fff0 50%);
z-index:10;
}
.photos-inner {
font-size:0;
}
.photos-inner li {
display:inline-block;
vertical-align:top;
width:25%;
}
.photos-inner li a {
display:block;
}
.photos-inner li a img {
display:block;
width:100%;
border:1px solid #fff;
}
.catalog {
font-size: 0;
margin: 40px -75px 0;
text-align: center;
}
.catalog li {
display: inline-block;
vertical-align: top;
width: calc(33.33% - 30px);
margin: 0 15px 30px;
font-size: 17px;
text-align: left;
}
.catalog li > a {
display: block;
margin: 0 0 20px;
}
.catalog li > a img {
display: block;
}
.catalog li > strong {
display: block;
font-size: 19px;
line-height: 1.2;
}
.catalog li > strong a {
}
.catalog li > p {
color: #4c4c4c;
margin: .5em 0 0;
}
.product {
overflow: hidden;
}
.product .p-images {
float: left;
width: 48%;
margin: 0 4% 20px 0;
}
.product .p-images .p-big {
height: 402px;
border: 1px solid #e6e6e6;
overflow: hidden;
position: relative;
}
.product .p-images .p-big li {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
line-height: 400px;
text-align: center;
opacity: 0;
z-index: 10;
transition: all .3s;
}
.product .p-images .p-big li.active {
opacity: 1;
z-index: 20;
}
.product .p-images .p-big li img {
display: inline-block;
vertical-align: middle;
max-width: 98%;
max-height: 98%;
}
.product .p-images .p-thumbs {
font-size: 0;
margin: 10px 0 0;
}
.product .p-images .p-thumbs li {
display: inline-block;
border: 1px solid #fff;
cursor: pointer;
transition: all .3s;
}
.product .p-images .p-thumbs li img {
display: block;
transition: all .3s;
}
.product .p-images .p-thumbs li.active, .product .p-images .p-thumbs li:hover {
border-color: #000;
background: #000;
}
.product .p-images .p-thumbs li:hover img {
opacity: .8;
}
.product .p-info {
}
.product .p-info .p-desc {
}
.news-list {
margin: 50px 0 0;
}
.news-list li {
overflow: hidden;
margin: 0 0 30px;
}
.news-list li img {
float: left;
width: 330px;
}
.news-list li aside {
font-size: 17px;
padding: 5px 0 0;
margin: 0 0 0 360px;
}
.news-list li aside strong {
display: block;
font-size: 19px;
line-height: 1.2;
}
.news-list li aside span {
display: block;
color: #525866;
}
.news-list li aside p {
color: #4c4c4c;
margin: .5em 0 0;
}
a.more {
display: block;
width: 330px;
line-height: 46px;
font-weight: 700;
color: #1779bc;
text-align: center;
border: 2px solid #eee;
}
a.more:hover {
background: #1779bc;
border-color: #061534;
color: #fff;
}
.contacts {
}
.contacts aside {
float: left;
width: 38%;
}
.contacts #map {
height: 320px;
margin: 0 0 0 39%;
}
.contacts #map .bx-yandex-map {
width: 100%!important;
}
.contacts table {
color: #000;
margin: 20px 0;
}
.contacts table tr {
}
.contacts table th {
font-size: 17px;
text-align: left;
padding: 15px 0 15px 20px;
}
.contacts table th:first-child {
padding: 15px 0 15px;
}
.contacts table th+th {
text-align: right;
}
.contacts table td {
padding: 15px 0 20px 20px;
background: #eee;
font-size: 15px;
border-bottom: 10px solid #fff;
}
.contacts table td:first-child {
padding: 15px 50px 20px 20px;
}
.contacts table td:last-child {
padding: 15px 20px 20px 20px;
}
.contacts table td strong {
display: block;
}
.contacts table td+td {
white-space: nowrap;
text-align: right;
}
form.form {
width: 450px;
margin: 50px 0 0;
position: relative;
}
#team {
height: 760px;
background: #030b1a;
color: #fff;
margin: -81px -240px 0;
}
#team a {
color: #fff;
opacity: .8;
}
#team a:hover {
opacity: 1;
}
#team:before, #team:after {
content: '';
position: absolute;
top: 0;
width: 100%;
height: 100%;
background: #030b1a;
}
#team:before {
left: -100%;
}
#team:after {
left: 100%;
}
#team ul {
}
#team ul li, .team li {
padding: 60px 120px 60px 240px;
}
#team ul li > img, .team li > img {
float: left;
width: 450px;
}
#team ul li aside, .team li aside {
height: 640px;
padding: 35px 0 0;
margin: 0 0 0 510px;
}
#team ul li aside > strong, .team li aside > strong {
display: block;
font-size: 21px;
}
#team ul li aside > span, .team li aside > span {
display: block;
margin: 0 0 1em;
}
#team ul li aside > small, .team li aside > small {
font-size: 13px;
}
#team ul li aside > small+strong, .team li aside > small+strong {
margin: 0 0 .2em;
}
#team ul li aside > p, .team li aside > p {
}
.team {
margin: 0 -240px;
}
.team li {
border-top: 4px solid #b38220;
position: relative;
}
.team li:before, .team li:after {
content: '';
position: absolute;
top: -4px;
width: 100%;
height: 4px;
background: #b38220;
}
.team li:before {
left: -100%;
}
.team li:after {
left: 100%;
}
.gallery {
font-size: 0;
margin: 30px -10px;
}
.gallery a {
display: inline-block;
vertical-align: top;
width: calc(33.33% - 20px);
margin: 0 10px 20px;
position: relative;
}
.gallery a:before {
content: '';
position: absolute;
left: 0;
right: 0;
bottom: 0;
height: 50%;
background: linear-gradient(to top, #000b, #0000);
transition: all .2s;
}
.gallery a:hover:before {
height: 100%;
}
.gallery a.video:after, .gallery-inner a.video:after {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: url(../i/video.png) no-repeat 20px 20px;
opacity: .6;
transition: all .2s;
}
.gallery a.video:hover:after, .gallery-inner a.video:hover:after {
opacity: 1;
}
.gallery a img, .gallery-inner a img {
display: block;
width: 100%;
transition: all .2s;
}
.gallery-inner a:hover img {
opacity: .8;
}
.gallery a b {
font-size: 17px;
line-height: 1.2;
color: #fff;
position: absolute;
bottom: 20px;
left: 20px;
right: 20px;
text-shadow: 1px 1px 3px #000;
}
.gallery-inner {
font-size: 0;
}
.gallery-inner a {
display: inline-block;
vertical-align: top;
width: 25%;
border: 1px solid #fff;
background: #000;
position: relative;
}
.knkrs {
}
.knkrs table {
margin: 2em 0;
}
.knkrs table th, .knkrs table td {
padding: 10px;
border: 1px solid #ccc;
text-align: left;
vertical-align: top;
}
.knkrs table th {
}
.knkrs table td {
}
.knkrs table tr:nth-child(2n+1) {
background: #f5f9ff;
}
.knkrs table td a {
}
.knkrs table td a img {
vertical-align: middle;
margin: -4px 2px 0 0;
}
.search-page {
}
.search-page form {
font-size: 0;
}
.search-page form input {
display: inline-block;
vertical-align: top;
width: calc(100% - 120px);
margin: 0 20px 0 0;
}
.search-page form button {
display: inline-block;
vertical-align: top;
width: 100px;
padding: 0;
margin: 0;
}
.search-page hr {
height: 1px;
background: #eee;
margin: 20px 0;
}
.search-page a {
font-size: 20px;
color: #061534;
}
.search-page p {
display: block;
color: #4c4c4c;
margin: .5em 0
}
.search-page small {
color: #666;
}
.search-page small a {
font-size: 17px;
margin: 0 10px;
}
.search-page .sort {
margin: 30px 0;
}
.search-page .sort a {
font-size: 17px;
}
.search-page .sort span {
color: #ccc;
margin: 0 10px;
}
footer {
background: #061534;
color: #fff;
line-height: 30px;
}
footer .wrap {
height: 120px;
position: relative;
}
footer .logo {
margin: 40px 20px 0 0;
}
footer .wrap > p {
float: left;
font-size: 15px;
margin: 45px 20px 0 0;
}
footer .msg {
margin: 30px 0 0 20px;
}
footer .wrap > span {
float: right;
font-weight: 700;
margin: 30px 0 0 20px;
}
footer .yt {
float: left;
color: #fff;
background: url(../i/s-yt.png) no-repeat 20px 50% #fff1;
padding: 10px 20px 10px 60px;
border: 1px solid #fff5;
border-radius: 5px;
margin: 34px 0 0 70px;
}
footer .yt:hover {
background-color: #fff2;
border-color: #fff;
}
footer .dev {
position: absolute;
bottom: 10px;
right: 0;
color: #fff;
font-size: 15px;
}
#shadow {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: #000;
opacity: .6;
z-index: 250;
display: none;
}
.popup {
position: fixed;
top: 0;
left: 50%;
width: 510px;
padding: 40px 30px;
background: #fff;
box-shadow: 10px 10px 80px #000;
margin: 100px 0 0 -255px;
font-size: 15px;
z-index: 260;
display: none;
}
.popup > i {
position: absolute;
top: 0;
right: 0;
width: 50px;
height: 50px;
background: #f2f2f2;
cursor: pointer;
}
.popup > i:before, .popup > i:after {
content: '';
width: 12px;
height: 2px;
background: #000;
position: absolute;
top: 24px;
left: 19px;
}
.popup > i:before {
transform: rotate(45deg);
}
.popup > i:after {
transform: rotate(-45deg);
}
.popup > strong, form.form > strong {
display: block;
font-size: 24px;
line-height: 1.2;
color: #000;
margin: 0 0 .5em;
}
.popup form {
font-size: 0;
}
.popup form > hr, form.form > hr {
height: 1px;
background: #e6e6e6;
margin: 35px 0 25px;
}
.popup form > p, form.form > p {
font-size: 15px;
margin: 0;
}
.popup form > p sup, form.form > p sup {
vertical-align: baseline;
font-size: 20px;
color: #c00;
margin: 0 5px 0 0;
}
.popup form > p+hr, form.form > p+hr {
margin: 10px 0 20px;
}
.popup form > div, form.form > div {
position: relative;
margin: 0 0 20px;
}
.popup form > div.half, form.form > div.half {
display: inline-block;
vertical-align: top;
width: 50%;
padding: 0 15px 0 0;
}
.popup form > div.half+div.half, form.form > div.half+div.half {
padding: 0 0 0 15px;
}
.popup form > div label, form.form > div label {
display: inline-block;
vertical-align: top;
margin: 0 30px 0 0;
}
.popup form > div input, form.form > div select {
margin: 5px 0 0;
}
.popup form > div sup, form.form > div sup {
vertical-align: baseline;
font-size: 20px;
line-height: 1;
color: #c00;
position: absolute;
bottom: 12px;
right: 20px;
}
.popup form > div.half sup, form.form > div.half sup {
right: 35px;
}
.popup form > div.half+div.half sup, form.form > div.half+div.half sup {
right: 20px;
}
.popup form > button, form.form > button {
}
.popup > section, form.form > section {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: #fffe;
text-align: center;
padding: 100px 20px;
display: none;
}
.popup > section {
top: 2px;
left: 2px;
right: 2px;
bottom: 2px;
border: 2px solid #0008;
}
.popup > section div, form.form > section div {
font-size: 32px;
font-weight: 700;
color: #000;
}
.popup > section p, form.form > section p {
font-size: 18px;
}