/*
Theme Name: АО "Хабаровский судостроительный завод"
Author: 
Author URI: tamerlan.info
Description: Официальный сайт Акционерного общества "Хабаровский судостроительный завод". АО "ХСЗ" лидер судостроения на Дальнем Востоке. Предприятие имеет огромный опыт строительства кораблей и судов разных классов и назначений из всех видов материалов применяемых в судостроении. На заводе принята наиболее прогрессивная технологическая схема постройки судов поточно-позиционным методом, позволяющая вести ускоренное серийное строительство заказов.
Version: 2.0
Text Domain: aohsz
*/

/* ======================================================================= */
/* ================== ОБЩИЕ ПАРАМЕТРЫ ==================================== */
/* ========================================================================== */


@font-face {
	font-family:DINPro;
	src:url('assets/fonts/DINPro.eot') format('eot'), 
		url('assets/fonts/DINPro.woff2') format('woff2'),
		url('assets/fonts/DINPro.woff') format('woff'),
		url('assets/fonts/DINPro.ttf') format('truetype'),
		url('assets/fonts/DINPro.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family:DINPro-Bold;
	src:url('assets/fonts/DINPro-Bold.eot') format('eot'),
		url('assets/fonts/DINPro-Bold.woff2') format('woff2'),
		url('assets/fonts/DINPro-Bold.woff') format('woff'),
		url('assets/fonts/DINPro-Bold.ttf') format('truetype'),
		url('assets/fonts/DINPro-Bold.svg') format('svg');
	font-weight:bold;
	font-style:normal;
}

@font-face {
	font-family:DINPro-Black;
	src:url('assets/fonts/DINPro-Black.eot') format('eot'),
		url('assets/fonts/DINPro-Black.woff2') format('woff2'),
		url('assets/fonts/DINPro-Black.woff') format('woff'),
		url('assets/fonts/DINPro-Black.ttf') format('truetype'),
		url('assets/fonts/DINPro-Black.svg') format('svg');
	font-weight:bolder;
	font-style:normal;
}


body {
    background-color: #253B4D;
    font-family: DINPro, sans-serif;
    position: relative;
}

.center {
    margin: 0 auto;
}
/* ================== ГЛАВНАЯ СТРАНИЦА ==================================== */

main {
	position: relative;
	width: 1242px;
    top: 124px;
}

/* ============================= НОВОСТНОЙ СЛАЙДЕР ============================= */

.slideshow-container {
	width: 1242px;
	height: 650px;
    position: absolute;
    margin: 0 auto;
    padding: 0;
}


/* ============================= НОВОСТНОЙ БЛОК ============================= */

#block-news {
	width: 1242px;
	height: 814;
	display: flex;
    position: relative;
    top: 528px;
    border-bottom: 1px solid rgba(0, 101, 179, 0.3);
    border-top: 1px solid rgba(0, 101, 179, 0.3);
}

#big-news {
    background-color: white;
    height: 381px;
    width: 1242px;
    position: absolute;
}

#paragraf {
    height: 100%;
    width: 50%;
    float: left;
    padding-top: 10px;
}

#img-news-big {
    height: 100%;
    width: 50%;
    float: right;
    overflow: hidden;
}

/* ЗАПАСНАЯ ПЛОЩАДКА*/

#big-news2 {
    background-color: white;
    height: 382px;
    width: 1242px;
    position: absolute;
    top: 838px;
    border-top: 1px solid rgba(0, 101, 179, 0.3);
}

#paragraf2 {
    height: 100%;
    width: 50%;
    float: right;
    padding-top: 10px;
}

#img-news-big2 {
    height: 100%;
    width: 50%;
    float: left;
    overflow: hidden;
}

#img-news-big img {
    width: 100%;
    height: 100%;
    -webkit-transition-timing-function: ease;
    -webkit-transition-duration: 0.5s;
}

#img-news-big2 img {
    width: 100%;
    height: 100%;
    -webkit-transition-timing-function: ease;
    -webkit-transition-duration: 0.5s;
}

#img-news-big img:hover {
    -webkit-transform: scale(1.1);
    -webkit-transition-timing-function: ease;
    -webkit-transition-duration: 0.5s;
}

#img-news-big2 img:hover {
    -webkit-transform: scale(1.1);
    -webkit-transition-timing-function: ease;
    -webkit-transition-duration: 0.5s;
}

#head-big {
    padding: 10px 5% 0px;
    padding-bottom: 15px;
}

#head-big a {
    text-decoration: none;
	border-bottom: 1px solid rgba(0, 101, 179, 0.3);
	color: #253b4d;
	line-height: 1.5;
    font-size: 28px;
    font-weight: bold;
	-webkit-transition-timing-function: ease;
    -webkit-transition-duration: 0.3s;
}

#head-big2 a {
    text-decoration: none;
	border-bottom: 1px solid rgba(0, 101, 179, 0.3);
	color: #253b4d;
	line-height: 1.5;
    font-size: 28px;
    font-weight: bold;
	-webkit-transition-timing-function: ease;
    -webkit-transition-duration: 0.3s;
}

#head-big > a:hover {
    color: #EE1C25;
    -webkit-transition-timing-function: ease;
    -webkit-transition-duration: 0.3s;
}

#head-big2 > a:hover {
    color: #EE1C25;
    -webkit-transition-timing-function: ease;
    -webkit-transition-duration: 0.3s;
}

#data-big {
    font-size: 18px;
    color: #7d8e9d;
    padding-left: 5%;
    margin-top: 5px;
}

#preview-big p {
    line-height: 1.5em;
    font-size: 18px;
    color: #000;
    padding: 5px 5%;
}


.news {
	height: 170px;
	width: 413px;
	background-color: white;
	margin: auto;
    position: relative;
    text-align: center;
    border-top: 1px solid rgba(114, 126, 138, 0.3);
    border-right: 1px solid rgba(114, 126, 138, 0.3);
    -webkit-transition-timing-function: ease;
    -webkit-transition-duration: 0.5s;
    top: 381;
    float: left;
}

.news:hover {
    box-shadow: 0 0 50px 5px #253B4D;
    z-index: 1;
    -webkit-transition-timing-function: ease;
    -webkit-transition-duration: 0.5s;
}
.head-post {
    width: 350px;
    height: 80px;
    text-align: left;
    line-height: 1.5;
    padding: 25px 20px 25px 40px;
}

.head-post > a {
    color: black;
    font-size: 18px;
    font-weight: bold;
    border-bottom: 1px solid rgba(0, 101, 179, 0.3);
    color: #253b4d;
    text-decoration: none;
    -webkit-transition-timing-function: ease;
    -webkit-transition-duration: 0.3s;
}

.head-post > a:hover {
    color: #EE1C25;
    -webkit-transition-timing-function: ease;
    -webkit-transition-duration: 0.3s;
}

.data {
    width: 413.5px;
    height: 40px;
}

.data time {
    font-size: 18px;
    color: #7d8e9d;
    padding-top: 10px;
}

#img-news {
    width: 413px;
    height: 286px;
    overflow: hidden;
}

#img-news > img {
    width: 100%;
    height: 100%;
    border-right: 1px solid rgba(114, 126, 138, 0.3);
    -webkit-transition-timing-function: ease;
    -webkit-transition-duration: 0.7s;
}

#img-news > img:hover {
    -webkit-transform: scale(1.1);
    -webkit-transition-timing-function: ease;
    -webkit-transition-duration: 0.5s;
}

#preview {
    width: 413.5px;
    height: 130px;
}

#preview > p {
    color: black;
    line-height: 1.4;
    font-weight: 400;
    padding: 10px 18px 18px 15px;
    font-size: 14px;
}

/* ============================= ЧЁРНЫЙ БЛОК ============================= */

#leader {
	width: 1242px;
	height: 265px;
	background-color: black;
	border-bottom: 1px solid #253B4D;
	display: inline-block;
	color: white;
    position: relative;
	top: 935;
}

#leader > section {
	width: 1100px;
	margin: auto;
	font-size: 22px;
	padding: 10px;
}


/* ============================= БЛОК С ПРОЕКТАМИ И КНОПКА============================= */


#block-project {
    color: white;
	width: 100%;
	cursor: pointer;
	border-bottom: 2px solid white;
    position: relative;
	top: 930;
}

/* а45-2 */

#a45-2 {
	width: 803px;
	height:400px;
	overflow: hidden;
	position: relative;
	float: left;
}

#a45-2 img {
	display: block;
	position: absolute;
}

.animate {
	transition: all .8s;
	filter: blur(0);
}

#a45-2 h3 {
	position: absolute;
	top: 0;
	left: 50;
	font-size: 32px;
	opacity: 0;
	transition: all .7s;
}

#a45-2 p {
	position: absolute;
	font-size: 20px;
	padding: 20px 50px;
	top: 100;
	text-align: center;
	opacity: 0;
	transition: all .8s;
}

#a45-2 button {
	position: absolute;
	padding: 12px 50px;
	border-radius: 8px;
	background-color: #D81816;
	color: white;
	top: 320;
	left: 300;
	opacity: 0;
	transition: all .9s;
}

#a45-2:hover .animate {
	transform: scale(1.1);
	transition: all .6s;
	filter: blur(3px) brightness(60%);
}

#a45-2:hover h3 {
	opacity: 1;
	transition: all .7s;
}

#a45-2:hover p {
	opacity: 1;
	transition: all .8s;
}

#a45-2:hover button {
	opacity: 1;
	transition: all .9s;
}

/* АРИУС */

#arius {
	width: 439px;
	height:200px;
	overflow: hidden;
	position: relative;
	float: left;
}

#arius img {
	display: block;
	position: absolute;
}

#arius h3 {
	position: absolute;
	top: 10;
	left: 10;
	font-size: 16px;
	opacity: 0;
	transition: all .7s;
}

#arius p {
	position: absolute;
	font-size: 16px;
	padding: 20px 50px;
	top: 40;
	text-align: center;
	opacity: 0;
	transition: all .8s;
}

#arius button {
	position: absolute;
	padding: 5px 20px;
	border-radius: 8px;
	background-color: #D81816;
	color: white;
	top: 150;
	left: 150;
	opacity: 0;
	transition: all .9s;
}

#arius:hover .animate {
	transform: scale(1.1);
	transition: all .6s;
	filter: blur(3px) brightness(60%);
}

#arius:hover h3 {
	opacity: 1;
	transition: all .7s;
}

#arius:hover p {
	opacity: 1;
	transition: all .8s;
}

#arius:hover button {
	opacity: 1;
	transition: all .9s;
}

/* НИС-5 */

#nis-5 {
	width: 439px;
	height:200px;
	overflow: hidden;
	position: relative;
	float: left;
}

#nis-5 img {
	display: block;
	position: absolute;
}

#nis-5 h3 {
	position: absolute;
	top: 10;
	left: 20;
	font-size: 15px;
	opacity: 0;
	transition: all .7s;
}

#nis-5 p {
	position: absolute;
	font-size: 16px;
	padding: 10px 40px;
	top: 40;
	text-align: center;
	opacity: 0;
	transition: all .8s;
}

#nis-5 button {
	position: absolute;
	padding: 5px 20px;
	border-radius: 8px;
	background-color: #D81816;
	color: white;
	top: 150;
	left: 150;
	opacity: 0;
	transition: all .9s;
}

#nis-5:hover .animate {
	transform: scale(1.1);
	transition: all .6s;
	filter: blur(3px) brightness(60%);
}

#nis-5:hover h3 {
	opacity: 1;
	transition: all .7s;
}

#nis-5:hover p {
	opacity: 1;
	transition: all .8s;
}

#nis-5:hover button {
	opacity: 1;
	transition: all .9s;
}

/* СВП-50 */

#svp {
	width: 608px;
	height: 312px;
	overflow: hidden;
	position: relative;
	float: left;
}

#svp img {
	display: block;
	position: absolute;
}

#svp h3 {
	position: absolute;
	top: 10;
	left: 20;
	font-size: 22px;
	opacity: 0;
	transition: all .7s;
}

#svp p {
	position: absolute;
	font-size: 18px;
	padding: 10px 40px;
	top: 80;
	text-align: center;
	opacity: 0;
	transition: all .8s;
}

#svp button {
	position: absolute;
	padding: 5px 20px;
	border-radius: 8px;
	background-color: #D81816;
	color: white;
	top: 250;
	left: 230;
	opacity: 0;
	transition: all .9s;
}

#svp:hover .animate {
	transform: scale(1.1);
	transition: all .6s;
	filter: blur(3px) brightness(60%);
}

#svp:hover h3 {
	opacity: 1;
	transition: all .7s;
}

#svp:hover p {
	opacity: 1;
	transition: all .8s;
}

#svp:hover button {
	opacity: 1;
	transition: all .9s;
}

/* МЕРКУРИЙ */

#mercury {
	width: 634px;
	height: 312px;
	overflow: hidden;
	position: relative;
	float: left;
}

#mercury img {
	display: block;
	position: absolute;
}

#mercury h3 {
	position: absolute;
	top: 10;
	left: 20;
	font-size: 22px;
	opacity: 0;
	transition: all .7s;
	text-align: center;
}

#mercury p {
	position: absolute;
	font-size: 18px;
	padding: 10px 40px;
	top: 100;
	text-align: center;
	opacity: 0;
	transition: all .8s;
}

#mercury button {
	position: absolute;
	padding: 5px 20px;
	border-radius: 8px;
	background-color: #D81816;
	color: white;
	top: 250;
	left: 250;
	opacity: 0;
	transition: all .9s;
}

#mercury:hover .animate {
	transform: scale(1.1);
	transition: all .6s;
	filter: blur(3px) brightness(60%);
}

#mercury:hover h3 {
	opacity: 1;
	transition: all .7s;
}

#mercury:hover p {
	opacity: 1;
	transition: all .8s;
}

#mercury:hover button {
	opacity: 1;
	transition: all .9s;
}

/* ОЛИМПИЯ */

#olimpia {
	width: 711px;
	height: 358px;
	overflow: hidden;
	position: relative;
	float: left;
}

#olimpia img {
	display: block;
	position: absolute;
}

#olimpia h3 {
	position: absolute;
	top: 10;
	left: 5;
	font-size: 22px;
	opacity: 0;
	transition: all .7s;
	text-align: center;
}

#olimpia p {
	position: absolute;
	font-size: 18px;
	padding: 10px 20px;
	top: 130;
	text-align: center;
	opacity: 0;
	transition: all .8s;
}

#olimpia button {
	position: absolute;
	padding: 5px 20px;
	border-radius: 8px;
	background-color: #D81816;
	color: white;
	top: 270;
	left: 300;
	opacity: 0;
	transition: all .9s;
}

#olimpia:hover .animate {
	transform: scale(1.1);
	transition: all .6s;
	filter: blur(3px) brightness(60%);
}

#olimpia:hover h3 {
	opacity: 1;
	transition: all .7s;
}

#olimpia:hover p {
	opacity: 1;
	transition: all .8s;
}

#olimpia:hover button {
	opacity: 1;
	transition: all .9s;
}

/* Буксир 2310 */

#project2310 {
	width: 531px;
	height: 358px;
	overflow: hidden;
	position: relative;
}

#project2310 img {
	display: block;
	position: absolute;
}

#project2310 h3 {
	position: absolute;
	top: 10;
	left: 5;
	font-size: 22px;
	opacity: 0;
	transition: all .7s;
	text-align: center;
}

#project2310 p {
	position: absolute;
	font-size: 16px;
	padding: 10px 20px;
	top: 100;
	text-align: center;
	opacity: 0;
	transition: all .8s;
}

#project2310 button {
	position: absolute;
	padding: 5px 20px;
	border-radius: 8px;
	background-color: #D81816;
	color: white;
	top: 270;
	left: 200;
	opacity: 0;
	transition: all .9s;
}

#project2310:hover .animate {
	transform: scale(1.1);
	transition: all .6s;
	filter: blur(3px) brightness(60%);
}

#project2310:hover h3 {
	opacity: 1;
	transition: all .7s;
}

#project2310:hover p {
	opacity: 1;
	transition: all .8s;
}

#project2310:hover button {
	opacity: 1;
	transition: all .9s;
}

/*===========================================*/

/* Буксир 22030 */

#project22030 {
	width: 621px;
	height: 325px;
	overflow: hidden;
	position: relative;
	float: left;
}

#project22030 img {
	display: block;
	position: absolute;
}

#project22030 h3 {
	position: absolute;
	top: 10;
	left: 90;
	font-size: 28px;
	opacity: 0;
	transition: all .7s;
	text-align: center;
}

#project22030 p {
	position: absolute;
	font-size: 16px;
	padding: 10px 20px;
	top: 100;
	text-align: center;
	opacity: 0;
	transition: all .8s;
}

#project22030 button {
	position: absolute;
	padding: 5px 20px;
	border-radius: 8px;
	background-color: #D81816;
	color: white;
	top: 270;
	left: 250;
	opacity: 0;
	transition: all .9s;
}

#project22030:hover .animate {
	transform: scale(1.1);
	transition: all .6s;
	filter: blur(3px) brightness(60%);
}

#project22030:hover h3 {
	opacity: 1;
	transition: all .7s;
}

#project22030:hover p {
	opacity: 1;
	transition: all .8s;
}

#project22030:hover button {
	opacity: 1;
	transition: all .9s;
}

/* МУРЕНА */

#murena {
	width: 621px;
	height: 325px;
	overflow: hidden;
	position: relative;
}

#murena img {
	display: block;
	position: absolute;
}

#murena h3 {
	position: absolute;
	top: 10;
	left: 40;
	font-size: 26px;
	opacity: 0;
	transition: all .7s;
	text-align: center;
}

#murena p {
	position: absolute;
	font-size: 18px;
	padding: 10px 20px;
	top: 110;
	text-align: center;
	opacity: 0;
	transition: all .8s;
}
#murena:hover .animate {
	transform: scale(1.1);
	transition: all .6s;
	filter: blur(3px) brightness(60%);
}

#murena:hover h3 {
	opacity: 1;
	transition: all .7s;
}

#murena:hover p {
	opacity: 1;
	transition: all .8s;
}
#murena a {
	color: white;
}
/*=========== КНОПКА =====================*/

#button-prolect {
	background-color: #E31E24;
	color: white;
	margin-top: 10px;
	width: 100%;
	height: 50px;
	border-radius: 10px;
	font-weight: bolder;
	font-size: 28px;
	top: 928;
	position: relative;
}

.button-a {
	color: white;
	text-decoration: none;
}



/* =============== СТРАНИЦЫ ============== */

/* =============== 404.PHP =============== */

.fon-page {
	width: 1242px;
	min-height: 1080px;
    max-height: 5000px;
	background-color: white;
    top: 124;
    margin-bottom: -783px;
	position: relative;
}

#php404 {
	text-align: center;
	font-weight: bold;
	font-size: 64px;
	margin-top: 160px;
	position: absolute;
}

/* ================================ СТРАНИЦЫ ИЗ МЕНЮ ====================== */

.header-page {
    margin: 0;
    font-size: 3.4em;
    padding: 40px 0 0 60px;
}

.contacts-khv {
    margin: 70px 0 0 60px;
    float: left;
}

.contacts-khv h2 {
    color: #314A5F;
    margin-bottom: 50px;
}

.contacts-khv p {
    font-size: 18px;
    line-height: 1.5em;
}

.adres {
    margin-bottom: 30px;
}

.contacts-khv a {
    text-decoration: none;
    font-weight: 500;
    border-bottom: 1px solid rgba(0, 101, 179, 0.3);
    color: #0098DA;
}

.weather {
    margin-top: 30px;
}

.map {
    width: 300px;
    height: 300px;
    float: right;
}



/*===================== СТАТЬИ =============================*/

.article {
    width: 90%;
    margin: auto;
    line-height: 1.5em;
    font-size: 20px;
    text-align: justify; 
    margin-top: 50px;
    padding-bottom: 100px;
}

.article h3 {
    margin: 45px 0 45px 0;
    font-size: 28px;
    color: #466DAB;
}

.article p {
    margin-bottom: 30px;
}

.article ul > li {
    list-style-type: circle;
    line-height: 2em;
}

.article ol > li {
    list-style-type: 1;
    line-height: 2em;
}

/*============ ВАКАНСИИ ==============*/

.job {
	width: 1200px;
	height: 1000px;
	margin: 0 auto;
}