@import url('https://fonts.googleapis.com/css?family=Roboto+Condensed:400,700&subset=latin-ext');
html, address, blockquote,
body, dd, div, dl, dt, fieldset, form,
frame, frameset, h1, h2, h3, h4, h5, h6, 
noframes, ol, p, ul, center,
dir, hr, menu, pre   { display: block; unicode-bidi: embed }
li              { display: list-item }
head            { display: none }
table           { display: table }
tr              { display: table-row }
thead           { display: table-header-group }
tbody           { display: table-row-group }
tfoot           { display: table-footer-group }
col             { display: table-column }
colgroup        { display: table-column-group }
td, th          { display: table-cell }
caption         { display: table-caption }
th              { font-weight: bolder; text-align: center }
caption         { text-align: center }
body            { margin: 8px }
h1              { font-size: 2em; margin: .67em 0 }
h2              { font-size: 1.5em; margin: .75em 0 }
h3              { font-size: 1.17em; margin: .83em 0 }
h4, p, blockquote, ul, 
fieldset, form, 
ol, dl, dir,
menu            { margin: 1.12em 0 }
h5              { font-size: .83em; margin: 1.5em 0 }
h6              { font-size: .75em; margin: 1.67em 0 }
h1, h2, h3, h4,
h5, h6, b,
strong          { font-weight: bolder }
blockquote      { margin-left: 40px; margin-right: 40px }
i, cite, em,
var, address    { font-style: italic }
pre, tt, code,
kbd, samp       { font-family: monospace }
pre             { white-space: pre }
button, textarea,
input, select   { display: inline-block }
big             { font-size: 1.17em }
small, sub, sup { font-size: .83em }
sub             { vertical-align: sub }
sup             { vertical-align: super }
table           { border-spacing: 2px; }
thead, tbody,
tfoot           { vertical-align: middle }
td, th, tr      { vertical-align: inherit }
s, strike, del  { text-decoration: line-through }
hr              { border: 1px inset }
ol, ul, dir,
menu, dd        { margin-left: 40px }
ol              { list-style-type: decimal }
ol ul, ul ol,
ul ul, ol ol    { margin-top: 0; margin-bottom: 0 }
u, ins          { text-decoration: underline }
br:before       { content: "\A"; white-space: pre-line }
center          { text-align: center }
:link, :visited { text-decoration: underline }
:focus          { outline: thin dotted invert }

@media print {
  h1            { page-break-before: always }
  h1, h2, h3,
  h4, h5, h6    { page-break-after: avoid }
  ul, ol, dl    { page-break-before: avoid }
}

body, html, input, select, textarea {
	font-family: 'Roboto Condensed', roboto, tahoma, arial;
	font-size: 18px;
}

body, html {
	background: rgb(220, 220, 220);
}
html {
	height: 100%;
}
body {
	margin: 30px 50px 100px 50px;
	height: 100%;
}
::-webkit-scrollbar {
    width: 12px;
    height: 12px;
    background-color: #fff
}

::-webkit-scrollbar-button {
    width: 0;
    height: 0
}

::-webkit-scrollbar-track {
    background-color: #fff
}

::-webkit-scrollbar-thumb {
    background: #969696
}

h1 ,h2, h3, .logo {
	font-weight: bold;
	text-align: center;
	font-size: 40px;
	padding: 30px 60px 15px 60px;
	margin: 0;
	line-height: 140%;
	color: #6f582b;
}
h1 span, .logo span {
	font-weight: normal;
	color: black;
}
h2 {
	font-size: 50px;
	text-align: left;
	padding: 50px 60px 15px 60px;
}
h3 {
	font-size: 25px;
	text-align: left;
	padding: 30px 60px 15px 60px;
}
.logo {
	text-align: left;
	float: left;
	padding-top: 0;
	padding-bottom: 0;
}
.contact {
	text-align: right;
	float: right;
	padding-top: 20px;
	padding-bottom: 0;
}
.main {
	max-width: 1400px;
	background: rgb(255, 255, 255);
	margin: 50px auto;
	overflow: hidden;
	position: relative;
	-webkit-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.3);
	box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.3);
	-webkit-transition: all .4s ease;
	-moz-transition: all .4s ease;
	transition: all .4s ease
}
.main:hover {
	-webkit-box-shadow: 0px 0px 40px 0px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 0px 40px 0px rgba(0,0,0,0.3);
	box-shadow: 0px 0px 40px 0px rgba(0,0,0,0.3);
}
img {
	max-width: 100%;
}
p {
	padding: 6px 60px 6px 60px;
	line-height: 180%;
	margin: 0;
}
a {
	color: #6f582b;
}
.gallery ul, .gallery ul li {
	padding: 0;
	margin: 0;
}
.gallery {
	white-space: nowrap;
	overflow: auto;
}
.gallery ul{
	white-space: nowrap;
    width: max-content;
}
.gallery ul li {
	display: inline-block;
	vertical-align: middle;
	max-height: 200px;
	overflow: auto;
	background-color: #ffffff;
}
.gallery ul li img {
	display: inline-block;
	vertical-align: middle;
	max-height: 200px;
	-webkit-filter: grayscale(.9) contrast(0.8) brightness(1.4);
	filter: grayscale(.9) contrast(0.8) brightness(1.4);
	-webkit-transition: all .4s ease;
	-moz-transition: all .4s ease;
	transition: all .4s ease;
	mix-blend-mode: multiply;
}
.gallery ul li img:hover, .gallery ul li img:focus {
	-webkit-filter: grayscale(0) contrast(1) brightness(1);
	filter: grayscale(0) contrast(1) brightness(1);
}
.box {
	width: 50%;
	float: left;
}
.box1 {
	width: 33.33%;
	float: left;
}
.box2 {
	width: 66.66%;
	float: left;
}
.full p {
	font-size: 25px;
}
.full {
	padding: 0 0 50px 0;
	margin-top: 20px;
}
.mainpic,.mainpic:after {
    background: url(../img/mainpic1.jpg);
    position: absolute;
    height: 100%;
    max-height: 100%;
    left: 50%;
    background-size: cover;
    background-position: center;
	
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	transition: all 1s ease
}
.mainpic:after {
	content: "";
	background: rgba(255,255,255,1);
	width: 100%;
	left: 0;
	background: -moz-linear-gradient(left, rgba(255,255,255,1) 0%, rgba(255,255,255,0.53) 20%, rgba(255,255,255,0) 100%);
	background: -webkit-gradient(left top, right top, color-stop(0%, rgba(255,255,255,1)), color-stop(20%, rgba(255,255,255,0.53)), color-stop(100%, rgba(255,255,255,0)));
	background: -webkit-linear-gradient(left, rgba(255,255,255,1) 0%, rgba(255,255,255,0.53) 20%, rgba(255,255,255,0) 100%);
	background: -o-linear-gradient(left, rgba(255,255,255,1) 0%, rgba(255,255,255,0.53) 20%, rgba(255,255,255,0) 100%);
	background: -ms-linear-gradient(left, rgba(255,255,255,1) 0%, rgba(255,255,255,0.53) 20%, rgba(255,255,255,0) 100%);
	background: linear-gradient(to right, rgba(255,255,255,1) 0%, rgba(255,255,255,0.53) 20%, rgba(255,255,255,0) 100%);
}
#maps {
	min-height: 400px;
	height: 100%;
	position: absolute;
	left: 0;
}
#maps iframe {
	width: 100%;
	height: 100%;
}
.footer, .footer:hover {
	background-color: transparent;
	text-align: left;
	
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
}
.contacts {
	float: right;
	padding-bottom: 50px;
}
@media (max-width:1100px){

	.box, .box1, .box2 {
		width: 100%;
		float: none;
	}
	h2 {
		font-size: 40px;
	}
	.mainpic {
		position: relative;
		left: 0;
		height: 0;
		padding-bottom: 80%;
	}
	.mainpic:after {
		background: rgba(255,255,255,1);
		background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,0.7) 20%, rgba(255,255,255,0) 100%);
		background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,1)), color-stop(20%, rgba(255,255,255,0.7)), color-stop(100%, rgba(255,255,255,0)));
		background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,0.7) 20%, rgba(255,255,255,0) 100%);
		background: -o-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,0.7) 20%, rgba(255,255,255,0) 100%);
		background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,0.7) 20%, rgba(255,255,255,0) 100%);
		background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(255,255,255,0.7) 20%, rgba(255,255,255,0) 100%);
	}
	#maps {
		position: relative;
	}
	.full {
		padding: 0;
	}
}

@media (min-width:1100px){
	h2 {
		padding-right: 20px !important;
	}
}
@media (min-width:1600px){
	h1, h2, h3, p, .logo {
		padding-left: 100px;
		padding-right: 100px;
	}
	.main {
		width: 1500px;
	}
}
@media (max-width:700px){
	body {
		margin: 15px 20px 100px 20px;
	}
	body, html, input, select, textarea {
		font-size: 16px;
	}
	h1, h2, h3, p, .logo {
		padding-left: 30px;
		padding-right: 30px;
	}
	h2 {
		font-size: 30px;
	}
	.full p {
		font-size: 20px;
	}
}