* {
	margin: 0;
	padding: 0;
	font-family: "hypatia-sans-pro", sans-serif;
	text-align: justify;
	box-sizing: border-box;
}

.header {
	width: 100%;
	height: 732px;
	background-image: url(header.jpg);
	background-size: cover;
}

.header .content {
	position: absolute;
	left: 100px;
	top: 200px;
	width: 750px;
}

.head-logo {
	margin-bottom: 35px;
	width: 230px;
	height: 64px;
}

.header h1 {
	color: #00657f;
	font-family: kazimirtext;
	font-size: 34px;
	font-weight: 600;
	line-height: 48px;
	margin-bottom: 10px;
}

.header p {
	color: #00485a;
	font-family: "hypatia-sans-pro", sans-serif;
	font-size: 20px;
	font-weight: 400;
	line-height: 36px;
	margin-bottom: 25px;
}

.header a {
	display: inline-block;
	margin-right: 25px;
	color: #00485a;
	font-family: kazimirtext;
	font-size: 18px;
	font-weight: 500;
	line-height: 62px;
	width: 250px;
	height: 62px;
	border-radius: 31px;
	border: 2px solid #00485a;
	text-align: center;
	text-decoration: none;
}

.header a:hover {
	color: #00485a;
	background: #fff;
}

.menu {
	width: 278px;
	height: 100%;
	background-color: #ffffff;
	position: absolute;
	top: 732px;
	left: 0;
}

.menu.fixed {
	position: fixed;
	top: 0;
}

body {
	background-color: #f8f8f8;
}

.clearfix::after {
  content: "";
  clear: both;
  display: table;
}

.logo {
	width: 155px;
	height: auto;
	margin: 26px 0 19px 26px;
  position: relative;
}

.menu-item {
	border-top: 1px solid #efefef;
	padding: 10px 0;
	color: #00657f;
}

.menu-item:last-child {
	border-bottom: 1px solid #efefef;
}

.menu-item h3, .menu-item h4 a {
	display: block;
	padding: 0 26px;
	font-family: "hypatia-sans-pro", sans-serif;
	font-weight: 700;
	font-size: 16px;
	line-height: 43px;
	position: relative;
	cursor: pointer;
}

.menu-item a {
	color: #00657f;
	text-decoration: none;
	display: block;
	padding: 0 26px;
	font-size: 16px;
	font-weight: 400;
	line-height: 43px;
	transition: 0.3s opacity;
}

.menu-item a:hover {
	opacity: 0.6;
}

.arw {
	background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAAJCAYAAADpeqZqAAAAwUlEQVQoU3XRPw4BQRTH8e9bUVsdpU5W6QQOoRESQtSOMEdQC7HJisYhnEBJdEo61GKfjM1m/zHVTPL7zHvzRkiWAJo6/93aIEzMDEfb3E9Ddrt3Id3tlqh6PqEcWJq5MDQu5fAEUkfZ8MxBCyqej9AHvfJyvKjS1DQJdY9QAwl4HEffiha4rTXoAOWGIx0W5hyhAtQAuY3R2gokA2w0QUV4AWmkK8T3Z1EeplpKD6eIYki4Badn35Cf5m8Upf7+2wcicE/6SsC9mgAAAABJRU5ErkJggg==');
	background-repeat: no-repeat;
	background-position: center;
	width: 25px;
	height: 24px;
	position: absolute;
	right: 38px;
	top: 50%;
	transform: translateY(-50%) rotate(-90deg);
	transition: 0.2s transform;
}

.active .arw {
	transform: translateY(-50%) rotate(0deg);
}

.menu-item h3 + div {
	max-height: 0;
	overflow: hidden;
	transition: 0.6s all;
}

.menu-item.active h3 + div {
	max-height: 600px;
}

.edited {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	box-sizing: border-box;
	height: 70px;
	line-height: 70px !important;
	color: #b6b6b6;
	font-size: 14px;
	font-weight: 300;
	line-height: 48px;
	padding: 0 30px;
	background: #fff;
	border-top: 1px solid #f2f2f2;
}

.element {
	padding: 25px 40px 40px 317px;
	max-width: 1500px;
	margin-bottom: 40px;
	/*border-top: 1px solid #f2f2f2;*/
}

.element.sm {
	padding: 0 40px 0 317px;
	margin-bottom: 28px;
	
}

.element.sm h2 {
	margin-bottom: 0;
}

.element h1 {
	margin-top: 50px;
	color: #00657f;
	font-size: 40px;
	font-weight: 700;
	line-height: 48px;
	font-family: kazimirtext;
	margin-bottom: 15px;
}

.element h2 {
	color: #00657f;
	font-size: 24px;
	font-weight: 700;
	line-height: 48px;
	font-family: kazimirtext;
	margin-bottom: 15px;
}

.element p {
	color: #00485a;
	font-size: 20px;
	font-weight: 400;
	line-height: 40px;
}

.element strong {
	color: #00657f;
	font-weight: 700;
}

.element ol {
	color: #fff;
	font-size: 20px;
	font-weight: 300;
	line-height: 40px;
	padding-left: 30px;
}

.sub-el {
	margin-bottom: 44px;
}

.tov-img {
	max-width: 100%;
}

.lightbox {
	background: #00657f;
	width: 100%;
	height: 100%;
}

.btn {
	width: 185px;
	height: 185px;
	border-radius: 6px;
	border: 1px solid #00485a;
	background-color: #ffffff;
	line-height: 185px;
	text-align: center;
	color: #00657f;
	font-family: kazimirtext;
	font-size: 74px;
	font-weight: 700;
	text-transform: uppercase;
	display: inline-block;
	text-decoration: none;
	margin: 0 20px;
	transition: 0.3s opacity;
	opacity: 1;
}

.btn:hover {
	opacity: 0.8;
}

.btn-wrap {
	text-align: center;
	position: relative;
	top: 50%;
	transform: translateY(-50%);
}

.lightbox h2 {
	color: #ffffff;
	font-family: kazimirtext;
	font-size: 54px;
	font-weight: 700;
	line-height: 48px;
    position: absolute;
    text-align: center;
    width: 100%;
    top: 15%;
}

.lity-container .lity-close,
.lity-container .lity-close:hover,
.lity-container .lity-close:focus,
.lity-container .lity-close:active,
.lity-container .lity-close:visited {
	position: absolute;
	text-shadow: none;
	font-size: 55px;
	line-height: 55px;
	width: 55px;
	height: 55px;
	top: 5px;
  right: 10px;
}

.lity-container {
	width: 100%
}

.lity-container .lity-close {
	opacity: 0;
	transition: 1s opacity;
}

.lity-opened .lity-container .lity-close {
	opacity: 1 !important;
}
.half-element {
	width: 33.333333333%;
	float: left;
}

.logo-dl {
	width: 48px;
	height: 48px;
	border: 1px solid #c07509;
	border-radius: 50%;
	background-color: #eaa138;
	display: block;
	background-image: url(dl.svg);
	background-position: center;
	background-repeat: no-repeat;
	position: absolute;
}

.hor-logo {
	width: calc(50% - 20px);
	min-width: 490px;
	height: 315px;
	border-radius: 10px;
	float: left;
	margin: 10px;
	box-sizing: border-box;
	position: relative;
}

.hor-logo img {
	position: relative;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
}

.hor-logo a {
	bottom: 13px;
	right: 13px;
	opacity: 0;
	transition: 0.4s opacity;
}

.hor-logo:hover a {
	opacity: 1;
}

.rec-logo {
	width: calc(50% - 20px);
	min-width: 490px;
	height: 531px;
	border-radius: 10px;
	float: left;
	margin: 10px;
	box-sizing: border-box;
	position: relative;
}

.rec-logo img {
	position: relative;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
}

.rec-logo a {
	bottom: 13px;
	right: 13px;
	opacity: 0;
	transition: 0.4s opacity;
}

.rec-logo:hover a {
	opacity: 1;
}


.circ-logo {
	width: 245px;
	height: 245px;
	border-radius: 50%;
	float: left;
	margin-right: 20px;
	margin-bottom: 40px;
	box-sizing: border-box;
	position: relative;
}

.circ-logo img {
	position: relative;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
}

.circ-logo a {
	bottom: -24px;
	left: 50%;
	transform: translateX(-50%);
	opacity: 0;
	transition: 0.4s opacity;
	z-index: 9;
}

.circ-logo:hover a {
	opacity: 1;
}

.color {
	width: 200px;
	float: left;
	margin-right: 35px;
	height: 340px;
}

.color .col-circ {
	border-radius: 50%;
	width: 118px;
	height: 118px;
	margin: 0 0 23px 0;
}

.card {
	float: left;
	position: relative;
	margin-bottom: 20px;
}

.card:nth-child(2) {
	margin-right: 20px;
}

.card a {
	bottom: 13px;
	right: 13px;
	opacity: 0;
	transition: 0.4s opacity;
}

.card:hover a {
	opacity: 1;
}

.lity-content {
	transform: scale(1) !important;
}

.lightslider img {
	width: 100%;
	height: auto;
}

.slider-wr {
	position: relative;
	border-radius: 10px;
	overflow: hidden;
	display: inline-block;
}

.slider-wr a {
	bottom: 23px;
	right: 18px;
	opacity: 0;
	transition: 0.4s opacity;
}

.slider-wr:hover a {
	opacity: 1;
}

.lSSlideOuter .lSPager.lSpg {
	display: none;
}

#font h1,
#font h2.sec ,
#font h3,
#font h4 {
	color: #00657f;
	font-family: kazimirtext;
	margin: 40px 0 20px;
}

#font h1,
#font h2.sec {
	font-weight: 700;
}

#font h1 {
	font-size: 40px;
	line-height: 40px;
	margin-top: 20px;
}

#font h2.sec {
	font-size: 28px;
	line-height: 40px;
}

#font h3 {
	font-size: 22px;
	font-weight: 900;
	line-height: 40px;
	margin-top: 30px;
}

#font h4 {
	font-size: 80px;
	font-weight: 200;
	line-height: 80px;
}

#font p {
	font-size: 20px;
	font-weight: 400;
	line-height: 40px;
}

#font .fontbox {
	margin: 45px 45px 0 0;
}

.fontbox {
	color: #ffffff;
	font-family: kazimirtext;
	font-size: 40px;
	font-weight: 300;
	line-height: 60px;
	text-transform: uppercase;
	height: 295px;
	width: 279px;
	background-size: 100%;
	padding-top: 32px;
	padding-left: 22px;
	display: inline-block;
	background-repeat: no-repeat;
}

.fontbox.one {
	background-image: url(assets/fontbox-1.png);
	border: 1px solid #ffffff;
}

.fontbox.two {
	background-image: url(assets/fontbox-2.png);
	border: 1px solid #96641c;
}

.sub-menu a {
	max-height: 0;
	opacity: 0;
	transition: 0.3s all;
	margin-left: 10px;
	font-size: 14px;
	line-height: 33px;
}

.sub-menu .hl {
	max-height: 100px;
	opacity: 1;
	margin-left: 0;
	font-size: 16px;
	line-height: 43px;
}

.sub-menu:hover a {
	max-height: 100px;
	opacity: 1;
}

.sub-menu .hl:hover {
	opacity: 1;
}

.sub-menu a:hover {
	opacity: 0.6;
}

.sub-menu:hover .hl {
	/*max-height: 0;
	opacity: 0;*/
}

.sympack, .patpack {
	float: left;
	margin-right: 25px;
	position: relative;
	width: calc(50% - 25px);
}

.sympack a, .patpack a {
	opacity: 0;
	position: absolute;
	bottom: 13px;
	right: 30px;
}

.sympack:hover a, .patpack:hover a {
	opacity: 1;
}

.sympack img, .patpack img {
	/*max-width: 500px;*/
	height: auto;
}

.card {
	width: calc(50% - 20px);
}

.card img {
	width: 100%;
}

.wslider {
	margin-bottom: -5px;
}

.wslider a {
	bottom: 17px;
}

@media only screen and (max-width: 1440px) {
	.card, .sympack, .patpack {
		width: calc(50% - 50px);
	}
	.sympack, .patpack {
		margin-bottom: 15px;
	}
	.card img, .social-img, #logo-usage img, #pattern img {
		width: 100%;
		height: auto;
	}
	.hor-logo, .rec-logo {
		min-width: auto;
	}
	.hor-logo img, .rec-logo img {
		width: 75%;
		height: auto;
	}
}