@font-face {
  font-family: 'Roboto';
  src: url('./fonts/Roboto-Regular.ttf')  format('truetype');
}

@font-face {
  font-family: 'Roboto Bold';
  src: url('./fonts/Roboto-Bold.ttf')  format('truetype');
}

@font-face {
  font-family: 'Roboto Light';
  src: url('./fonts/Roboto-Light.ttf')  format('truetype');
}

@font-face {
  font-family: 'Lobster';
  src: url('./fonts/Lobster-Regular.ttf')  format('truetype');
}

@font-face {
  font-family: 'Raleway';
  src: url('./fonts/Raleway-VariableFont_wght.ttf')  format('truetype');
}

@font-face {
  font-family: 'Bubble';
  src: url('./fonts/bubble.ttf')  format('truetype');
}

@font-face {
  font-family: 'Merriweather';
  src: url('./fonts/Merriweather_24pt.ttf')  format('truetype');
}

:root {
  --color-primary: #300111;
}

:root {
  --color-secondary: #ff5207;
}

:root {
  --color-hover: #bd2a2a;
}

:root {
  --color-hoverlight: #ed8e65;
}

*:focus {
    outline: none;
}

html {
  background: #fff;
}
body {
  font-family: 'Roboto','PT Serif', serif;
  color: #141418;
  font-size: 16px;
  background: #f7eee7;
  padding: 0;
  margin: 0;
  
}
h1,
h2,
h3 {
  font-weight: normal;

}
h4 {
	text-align: center;
	color: #9b6954;
	margin: 0;
	margin: 10px 0;
	font-size: 20px;
}
p,
p:last-child {

}

a {
	color: var(--color-primary);
	transition: all 0.2s;
	text-decoration: none;
}

a:hover, a:focus {
	color: var(--color-hover);
	text-decoration: none;
}

hr {
	border-top: 1px solid #cabfa8;
}

button {
	background-color: var(--color-primary);
	display: inline-block;
	transition: all 0.2s;
}

button:hover {
	background-color: var(--color-hover);
}

input {
	outline:none;
}

.clear {
	clear: both;
}


.container {
	max-width: 1300px;
	padding: 0 15px;
	margin: 0 auto;
}


/*Шапка*/

#header {
	text-align: center;
	padding: 10px 0;
}

#header img {
	display: inline-block;
	width: 140px;
}

.header_tel {
	padding-top: 10px;
}

.header_tel a {
	display: inline-block;
	width: 170px;
	background: url(./images/contacts_tel.png) left center no-repeat;
	background-size: 16px auto;
	padding-left: 30px;
	font-size: 20px;
	text-align: left;
	margin: 5px 0;
}

.header_mail a {
	display: inline-block;
	width: 170px;
	background: url(./images/contacts_mail.png) left center no-repeat;
	background-size: 16px auto;
	padding-left: 30px;
	text-align: left;
	margin: 5px 0;
}

.banner {
	padding: 50px 15px;
	background: url(/images/bg1.jpg) center center no-repeat;
	background-size: cover;
	color: #fff;
	box-sizing: border-box;
}

.banner h1 {
	text-align: center;
}

.blocks {
	box-sizing: border-box;
	max-width: 800px;
	margin: 0 auto;
}

.block {
	float: left;
	width: 25%;
	padding: 20px 20px;
	box-sizing: border-box;
	text-align: center;
}

.blocks:after {
	content: '';
	display: block;
	clear: both;
}

.text {
	padding: 50px 15px;
	max-width: 800px;
	margin: 0 auto;
	box-sizing: border-box;
}



/* Подвал */

#footer {
	background: #1b1107;
	overflow: hidden;
	padding-top: 20px;
	padding-bottom: 20px;
	color: #fff;
	text-align: center;
}

/* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* --------------------------------------------------------------АДАПТАЦИЯ----------------------------------------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */



@media (max-width:1200px){
	
}

@media (max-width:1024px){
	

}

@media (max-width:992px){
	
}

@media (max-width:767px){
	
}

@media (max-width:600px){

.block {
	float: none;
	width: 100%;
	padding: 40px 20px;
}

}