a {
	
	color: grey;
}
.header-wrap {
	height: 100vh;
	margin: 0px;
	background-image: url('/img/4aes.jpg');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}


.offer {
   
	margin-top: -24vh;
	background: linear-gradient(to bottom, rgba(0, 0, 0, 1),
		rgba(0, 0, 0, 1), 
		rgba(255, 255, 255, 1), rgba(255, 255, 255, 1),
	rgba(255, 255, 255, 1), rgba(255, 255, 255, 1),rgba(255, 255, 255, 1), 
	rgba(255, 255, 255, 0));
	text-transform: uppercase;
	text-align: center;
	padding-top: 30px;
	height: 140ex;
	position: relative;
	z-index: 1;
	

}
.offer a {
	
	color: white;
}
.offer h1 span{
	color: red;
	font-size: 84px;
	margin-left: 5px;
}

.item {
	display: inline-block;
	height: 260px;
	width: 30ex;
	margin-top: 55px;
}
.item p{
	color: black;
	font-size: 20px;
	font-weight: normal;
	text-transform: none;
	margin-top: 20px;
}
.item p span {
	font-weight: lighter;
	color: red;
}
.item h2 {
	margin-bottom: 20px;
}
.it-ico {
	color: black;
	font-size: 38px;
}
.offeritem {
	padding: 2.5ex;
	display: flex;
	justify-content: space-around;

}
.offeritem h2 {
	text-shadow: 0 0 10px black, 3px 3px 2px black;

	}
.locations {
	background-image: url('/img/port.jpg');
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	display: block;
	margin-top: -25ex;
	height: 115ex;
	padding-top: 15ex;
	text-align: center;
	
}

.mob-loc-cap {
	display: none;
	text-shadow: 0 0 10px white, 3px 3px 2px white;
}
.mob-loc-cap .seccap {
	color: black;
}
.caption {
	height: 100ex;
	width: 10%;

	float: left;

}
.caption h3 {
	margin: 2px auto;
	width: 40px;
	font-size: 90px;
	line-height: 68px;
	word-wrap: break-word;
	text-transform: uppercase;
	text-shadow: 0 0 10px black, 3px 3px 2px black;
}
.caption h3 span {
	margin-left: 2px;
}
.caption h3 span:nth-of-type(2) {
	margin-left: 3px;
}
.caption h3 span:nth-of-type(3) {
	margin-left: 8px;
}
.caption h3 span:nth-of-type(4) {
	margin-left: 2px;
}

.loc-gallery {
	top: -860px;
	box-sizing: border-box;
	
	width: 87.47%;
	float: right;
	padding: 0ex 2.5ex 0ex 2.5ex;
	display: flex;
	margin: auto;
	
}

.loc-item {
	box-sizing: border-box;
	float: left;
	width: 27ex;
	height: inherit;
	margin: 0;
	border-top: 5px solid rgba(0, 0, 0, 0.5);
	border-bottom: 5px solid rgba(0, 0, 0, 0.5);
	transition: 0.3s linear;
	}

.link-wrap {
	display: block;
	box-sizing: border-box;
	padding-top: 520px; 
	text-transform: uppercase;
	text-align : center;
	position: relative;
	z-index: 2;
	
	height: 100%;
	
	color: white;
	text-shadow: 0 0 10px black, 3px 3px 2px black;
	font-size: 32px;
	transition: 0.3s;
}
.loc-back{
	background-position-x: -100px;
	transition: 0.3s;
	background-size: 960px auto;
	background-repeat: no-repeat;
}
.second {
	display: none;
}
.prp {
	background-image: url('/img/loc/prp.jpg');
	}

.duga {
	background-image: url('/img/loc/duga.jpg');

}
.jupiter{
	background-image: url('/img/loc/jupiter.jpg');
	
}
.wheel {
	background-image: url('/img/loc/wheel.jpg');
	
}
.primary {
	padding-top: 490px;
}
.more{
	background-image: url('/img/loc/more.jpg');

}
.loc-item:hover:not(.nohover) {
	
	
	width: 490px;
	position: relative;
	z-index: 3;
	transition: 0.3s linear;

}
.loc-item:hover:not(.nohover) {
	transition: 0.8s;
	background-position-x: -250px;
	border-left: 10px solid rgba(0, 0, 0, 0.5);
	position: relative;
}
.loc-item:hover:not(.nohover) a {
	padding-top: 510px;
	font-size: 50px;
	transition: 0.3s;
	
}
.loc-item.wheel:hover:not(.nohover) a {
	padding-top: 437px;
}
.loc-item.more:hover:not(.nohover) {
	background-position-x: -300px;
	transition: 1s;
	
}
.about {
	
	padding-top: 30ex;
	margin-top: -23ex;
	height: 150ex;
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0),
		rgba(0, 0, 0, 1), rgba(0, 0, 0, 1),
		rgba(0, 0, 0, 1), rgba(0, 0, 0, 1), rgba(0, 0, 0, 1),
	 rgba(0, 0, 0, 1), rgba(0, 0, 0, 0));
} 
.about-text {
	text-align: center;
	float: left;
	position: relative;
	z-index: 1;
	background-color: white;
	width: 640px;
	height: 460px;
	padding: 50px 10px 50px 10px ;
	margin: 130px 0px 0px 70px;
	font-size: 22px;
	border-radius: 5px;
}
.about-text p {

	font-size: 20px;
	font-weight: normal;
}
.about-pic {
	
	background-image: url('/img/about.jpg');
	background-position: center;
	background-size: cover;
	display: block;
	width: 640px;
	height: 720px;
	    float: right;
    margin: -570px 10px 10px 10px;
	


}
.none {
	background-color: rgb(255, 0, 0) ;
	transition: 1s;
}
.line {
	height: 8px;
	width: 35px;
	
	position: absolute;
	margin: 70.5px 0px 0px 390px;
	transition: 1s;
}
.contact-button {
    display: flex;
    width: 250px;
    height: 50px;
    background-color: rgb(255, 0, 0);
    border-radius: 65px 0px 65px 0px;
    margin: 50px auto;
    text-transform: uppercase;
    box-shadow: 0px 3px 10px black;
}

.contact-button p{
	font-size: 35px;
	margin: auto;
	text-shadow: 0 0 10px black, 3px 3px 2px black;
}

.contact-button:hover p{
	font-size: 36.75px;
}
.contact-button:hover {
	width: 262.5px;
    height: 52.5px;
    box-shadow: 0px 5px 10px black;
}
.contact-button:active {
	width: 237.5px;
    height: 47.5px;
	background-color: rgb(150, 0, 0);
    box-shadow: 5px 10px 5px black;
}
.contact-button:active p{
	font-size: 33.25px;
}
.blog {
	text-align: center;
	padding-top: 90px;
	position: relative;
	height: 130ex;
	
	margin: -120px 30px 20px 30px;
	
}

.maincap{
	text-transform: uppercase;
	
	line-height: 60px;
}

.seccap {
	color: grey;
	margin-bottom: 30px;
}
.blog-item {
	display: inline-block;
	width: 70ex;
	height: 42ex;
	background-color: grey;
	margin: 15px 15px;
	transition: .2s;
}
.blog-item a {
	padding-top: 13ex;
	color: grey;
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0),
		rgba(0, 0, 0, 0), rgba(0, 0, 0, 0),
		rgba(0, 0, 0, 0), rgba(0, 0, 0, 0),
		rgba(0, 0, 0, .6), rgba(0, 0, 0, .7), 
		rgba(0, 0, 0, .8), rgba(0, 0, 0, .5));
}

.blog-back {
	background-size: cover;
	background-position: center;
}


.what {
	background-image: url('/img/blog/why.jpg');	
}
.equipment {
	background-image: url('/img/blog/equipment.jpg');
}
.meal {
	background-image: url('/img/blog/meal.jpg');	
}
.soon {
	background-image: url('/img/blog/soon.jpg');
}

.blog-item:hover  a{

	color: white;
	transition: .2s;
}

.contact {
	
	padding-top: 30ex;
	margin-top: -23ex;
	height: 130ex;
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0),
		rgba(0, 0, 0, 1), rgba(0, 0, 0, 1),
		rgba(0, 0, 0, 1), rgba(0, 0, 0, 1), rgba(0, 0, 0, 1),
	 rgba(0, 0, 0, 1));
} 
.contact-text {
	text-align: center;
	float: right;
	position: relative;
	z-index: 1;
	background-color: white;
	width: 640px;
	height: 460px;
	padding: 50px 10px 50px 10px ;
	margin: 130px 70px 0px 0px;
	font-size: 22px;
	border-radius: 5px;
}
.contact-pic {
	
	background-image: url('/img/contact.jpg');
	background-position: center;
	background-size: cover;
	background-color: black;
	width: 640px;
	height: 720px;
	position: absolute;
	left: 2.5ex;

}
.contact_links {
	width: 100%;
	color: black;
	text-align: left;
	margin: 50px 80px; 
}
.contact_span {
	margin-left: 10px;

}

.contact_p {
 	margin-top: 15px;
}
.contact_links1 {
	width: 50%;
	float: left;
	height: 95px;
}
.contact_links2 {
	width: 30%;
	height: 95px;
	
	display: flex;
	padding-right: 50px;
}

.contact_links2 a {
	margin: auto;
}

.contact_links2 i {
	transition: .3s;
	font-size: 30px;
	color: black;
}

.contact_links2 i:hover {
	color: red;
	transform: rotate(15deg);
	transition: .3s;
}

.line2 {
	height: 8px;
	width: 35px;
	position: absolute;
	margin: 70.5px 10px 0px 175px;
	transition: 1s;
}

/*MEDIA QUERIES*/

@media screen and ( max-width: 1250px){
.offeritem {
    padding: 3.5ex;
}
.blog-item {
    display: inline-flex;
    width: 50ex;
    height: 42ex;
}
.blog-item a {
	font-size: 22px;
	padding-top: 215px;
	width: 100%;
}
.about-text {   
   width: 540px;
}
.about-pic {
	transform: scale(-1, 1);
	margin-left: 280px;
}
.line {
	    margin-left:  340px;
}}

@media screen and ( max-width: 959px){
.item {
	width: 280px;
    display: inline-table;
    margin: 15px;
}
.offeritem {
	display: block;
}
.offeritem:nth-of-type(2) .item{
	width: 200px;
}
.offer {
	height: 185ex;
	background: linear-gradient(to bottom, rgba(0, 0, 0, 1),
		rgba(0, 0, 0, 1), 
		rgba(255, 255, 255, 1), rgba(255, 255, 255, 1),
	rgba(255, 255, 255, 1), rgba(255, 255, 255, 1),
	rgba(255, 255, 255, 1), rgba(255, 255, 255, 1),
	rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
}
.caption {
    width: 10ex;
}
.about-text {
	margin: 130px 0px 0px 10px;
}
.about-pic {
	margin-left: 260px;
	width: 480px;
}
.blog {
	height: 210ex;
}
.blog-item {
	width: 80ex;
}
.contact-text {
	width: 480px;
}
.contact-pic {
	width: 480px;
}
.contact_links {
	width: 50%; 
	margin: auto;
}
.contact_links1 {
	width: 100%;
	text-align: left;
}
.contact_links2 {
	width: 100%;
	padding: 0;
}
.line2{
	    margin: 70.5px 10px 0px 95px;
}}

@media screen and (max-width: 799px){

.item {
	width: 240px;
}
.offer {
	height: 225ex;
}
.loc-gallery {
	width: 86.5%
}
.blog-item {
    width: 72ex;
}
.about-text {
	float: none;
	margin: -80px auto;
	background-color: #ffffffc9;
}
.about-pic{
	width: 100%;
        float: right;
    margin: -290px 10px 10px 10px;
}	
.contact-text {
	background-color: #ffffffc9;
	width: 400px;
}
.contact_links {
	width: 60%;
}
.line2 {
    margin: 69.5px 0px 0px 290px;
}}


@media screen and (max-width: 638px){

.line, .line2 {
	display: none;
}
.offer {
    height: 100%;
    padding-bottom: 120px;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 1),
	rgba(0, 0, 0, 1), 
	rgba(255, 255, 255, 1), rgba(255, 255, 255, 1),
	rgba(255, 255, 255, 1), rgba(255, 255, 255, 1),
	rgba(255, 255, 255, 1), rgba(255, 255, 255, 1),
	rgba(255, 255, 255, 1), rgba(255, 255, 255, 1),
	rgba(255, 255, 255, 1), rgba(255, 255, 255, 1),
	rgba(255, 255, 255, 1), rgba(255, 255, 255, 1),
	rgba(255, 255, 255, 1), rgba(255, 255, 255, 1),
	rgba(255, 255, 255, 1), rgba(255, 255, 255, 1),
	rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
}
.locations {
	margin-top: -30ex;
	height: 100%;
	    padding-bottom: 120px;

}
.loc-gallery {
	display: unset;
	float: none;
}
.about-text h2:after, .contact-text h2:after {
	content: '';
	width: 20px;
    margin-bottom: 0px;
    margin-left: 5px;
    height: 9px;
    background-color: red;
    display: inline-block;
}
	

.loc-item {
	float: none;
    display: block;
    width: 100%;
    height: 150px;
}
.wheel a {
	padding: 0;
}
.caption {
	display: none;
}
.mob-loc-cap {
	display: block;
    position: relative;
    z-index: 1;
}
.link-wrap {
	padding: 0;
}
.loc-item a:hover  {
	font-size: 30px;
}
.prp {
	background-position-x: -22px;
    background-size: 114%;
    background-position-y: -85px;


}
.duga {
	background-size: 123%;
    background-position-y: -54px;
    background-position-x: -12px;
}
.jupiter {
    background-size: 115%;
  	background-position-x: -30px;
    background-position-y: -89px;
}
.wheel {
    background-size: 103%;
    background-position-x: 0px;
    background-position-y: -39px;
}
.more {
    background-size: 141%;
    background-position-y: -68px;
    background-position-x: -51px;
}

.blog-item {
    width: 80vw;
}
.primary {
	display: none;
}
.second {
	display: block; 
}
.about-text {
	display: block;
	width: 100%;
	height: auto;

}
.about-pic {
	margin: -340px 10px 10px 10px;

}
.blog {
	margin: -130px 0px 20px 0px; 
}
.blog-item {
	    width: 95%;
	    margin: 0px 5px 15px 5px; 
}


.contact-text {
	margin: 0;
	width: 100%;
}
.contact_links {
    width: 85%;
}
.contact-pic {
	height: 100%;
    width: 100%;
    position: inherit;
}













}
