/*------Подключение шрифтов-------*/
@font-face {
  font-family: 'RobotoSlab 300';
  src: 
     url('../fonts/RobotoSlab-Light.ttf')  format('truetype'), /* Safari, Android, iOS */ 
}

@font-face {
  font-family: 'RobotoSlab 400';
  src: 
     url('../fonts/RobotoSlab-Regular.ttf')  format('truetype'), /* Safari, Android, iOS */ 
}


@font-face {
  font-family: 'RobotoSlab 500';
  src: 
     url('../fonts/RobotoSlab-Medium.ttf')  format('truetype'), /* Safari, Android, iOS */ 
}

@font-face {
  font-family: 'RobotoSlab 600';
  src: 
     url('../fonts/RobotoSlab-SemiBold.ttf')  format('truetype'), /* Safari, Android, iOS */ 
}


@font-face {
  font-family: 'RobotoSlab 700';
  src: 
     url('../fonts/RobotoSlab-Bold.ttf')  format('truetype'), /* Safari, Android, iOS */ 
}

@font-face {
  font-family: 'RobotoSlab 800';
  src: 
     url('../fonts/RobotoSlab-ExtraBold.ttf')  format('truetype'), /* Safari, Android, iOS */ 
}



/* ------ Спецификация ------ */

body {
	font-family: 'Roboto Slab', serif;
	color: #000;
	padding: 0;
	letter-spacing: 0em;
	margin: 0;
	font-size: 14px;
}

div, p, form, input, a, span, button {
	box-sizing: border-box;
}

p {
	margin: 0;
    font-size: 14px;
    margin-bottom: 1em;
}

ul, li {
	display: block;
	padding: 0;
	margin: 0;
}

h1, h2, h3, h4, h5, h6 {
	font-weight: 700;
	color: #000;
}

h1 {
	font-size: 50px;
	font-weight: 600;
}

h2 {
	font-size: 24px;
}

h3 {
	font-size: 22px;
}

h4 {
	font-size: 14px;
}

a, a:hover, a:active {
	text-decoration: none;
}

a, button, input {
	transition: all 0.5s ease;
}

a {
	color: #fff;
}

input, input:hover, input:focus, input:active,
button, button:hover, button:focus, button:active

 {
	outline: none;
}

.container-fluid_plain {
	padding: 0;
}

.btn {
	width: 250px;
	height: 57px;
	background: rgba(0, 0, 0, 0.8);
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.5);
	color: #fff;
	font-weight: 600;
	font-size: 20px;
	padding-top: 13px;
	margin-top: 80px;
	border-radius: 0;
}

.btn:hover {
	background: #fff;
}

.btn:active {
	opacity: 70%;
}



/*Бургер*/

.menu-collapse {
	display: none;
}


/*Первый экран*/

.header {
	padding-bottom: 150px;
	background: url('../img/back1.png') no-repeat ;
	background-size: 100%; /* Современные браузеры */
}

.cap {
	background: rgba(255, 255, 255, 0.66);
}

.menu {
	margin-top: 40px;	
}

.menu__item {
	font-weight: 700;
	font-size: 18px;
	color: #000;
	margin-right: 51px;
}

.menu__item:hover {
	color: rgba(255, 255, 255, 0.7);
}

.menu__item:active {
	color: #fff;
}

.logo {
	margin-top: 5px;	
}

.infohead {
	margin-top: 35px;
	font-weight: 600;	
	font-size: 15px;

}

.infohead__tel {
	margin-bottom: 0;
	margin-left: 30px;	
}

.offer {
	margin-top: 140px;
	padding-left: 96px;

}

.offer__title {
	color: #FFFFFF;
	text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.5);
}

.offer__text {
	font-weight: 500;
	font-size: 30px;
	color: #FFFFFF;
	width: 490px;
	margin-top: 20px;
	text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.5);
}

/*Товар*/

.product {
	padding-top: 50px;
	padding-bottom: 70px;	
}

.slider-item {
	justify-content: center;	
}

.slider__img {
	box-shadow: 4px 4px 10px 4px rgba(0, 0, 0, 0.15);

}

.slick-prev {
	/*left: 150px;	*/
}

.slick-next {
		/*right: 150px;	*/
}

.old {
	font-weight: 400;
	font-size: 16px;
	color: #000;
	text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
	margin-right: 10px;	
	margin-top: 2px;	
}

.new {
	font-weight: 800;
	font-size: 20px;
	line-height: 26px;
	letter-spacing: 0.085em;
	color: #FE1313;
	text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);

}

.price {
	justify-content: center;	
}

.btn-prod {
	color: 	#000;
	width: 160px;
	height: 40px;
	border: 1px solid #000000;
	display: block;	
	font-family: 'Roboto Slab';
	font-style: normal;
	font-weight: 700;
	font-size: 20px;
	text-align: center;	
	padding-top: 3px;
}

.bt {
	justify-content: center;
	margin-top: 23px;
}

.btn-prod:hover {
	background: #000;
	color: #fff;
}

.btn-prod:active {
	opacity: 70%;
}


/*Что входт в набор*/

.contents {
	border: 1px solid #000;	
	padding-left: 56px;
	padding-bottom: 60px;			
}

.content__texts {
	font-weight: 400;
	font-size: 18px;
	margin-top: 30px;	
}

.content__title {
	margin-top: 45px;		
}

.content__text {
	font-weight: 400;
	font-size: 20px;
}


/*Рецепты*/

.recipe__title {
	padding-top: 90px;
	margin-bottom: 20px;
	text-align: center;
	font-weight: 700;
}
.bottle__title {
	font-weight: 700;
	font-size: 20px;
	margin-top: -30px;	
	color: #FFFFFF;
	text-shadow: 1px 0 1px rgba(0, 0, 0, 0.5), 
0 1px 1px rgba(0, 0, 0, 0.5), 
-1px 0 1px rgba(0, 0, 0, 0.5), 
0 -1px 1px rgba(0, 0, 0, 0.5);
;

}

.bottle__text {
	font-weight: 500;
	font-size: 16px;
	margin-top: -20px;
	line-height: 18px;	
	color: #FFFFFF;
	text-shadow: 1px 0 1px rgba(0, 0, 0, 0.5), 
0 1px 1px rgba(0, 0, 0, 0.5), 
-1px 0 1px rgba(0, 0, 0, 0.5), 
0 -1px 1px rgba(0, 0, 0, 0.5);
;
}

.bottle {	
	text-align: center;	
	padding-top: 10px;
	padding: 10px;
	background: url(../img/backbot1.png) no-repeat center center;
}

.bottle__img3 {
	margin-bottom: 20px;
}

.bottle-two {
padding-top: 30px;
padding-bottom: 10px;	
	background: url(../img/backbot2.png) no-repeat center center !important;
}

.bottle-three {	
	padding-top: 30px;
	padding-bottom: 20px;
	background: url(../img/backbot3.png) no-repeat center center !important;
}
.bottle-four {	
	padding-bottom: 20px;
	padding-top: 10px;
	background: url(../img/backbot4.png) no-repeat center center !important;
}
.bottle-five {	
	padding-bottom: 20px;
	padding-top: 10px;
	background: url(../img/backbot5.png) no-repeat center center !important;
}

.btn-r {
	font-size: 16px;
	padding-top: 8px;
	margin-top: 20px;
	margin-bottom: 114px;
}


/*Инструкция*/

.point {
	align-items: center;	
}

.point__text {
	font-weight: 600;
	font-size: 15px;
	line-height: 20px;
	text-align: center;
	margin-left: -20px;	
	padding-top: 10px;	
}

.oblepiha {
	margin-left: 50%;
	margin-top: -70px;	
}

.instruction__title {
	margin-bottom: 44px;
	margin-left: 97px;	
}
.point-three {
	width: 470px;
	justify-content: center;
	margin-top: -30px;
	/*margin-left: -80px;				*/
}

.arrow {
	margin-top: -40px;	
	margin-left: 100px;	
}


/*Доставка*/

.bord {
	border: 1px solid #000;
	padding-top: 51px;
	text-align: center;	
}

.way {
	border: 1px dashed #000000;
	padding-top: 83px;
	width: 350px;
height: 280px;
}

.way-two {
	border: none;
}

.delivery__title {
	margin-bottom: 80px;
}

.way__price {
	font-weight: 600;
	font-size: 24px;
}

.way__text {
	font-weight: 500;
	font-size: 16px;
	margin-top: 20px;
}

.way__img1 {
	margin-top: -7px;
}

.way__img3 {
	margin-top: -10px;
}

.way__img2 {
	margin-top: 30px;
}

.info {
	text-align: left;
	margin-top: 69px;
	font-weight: 300;
	font-size: 18px;
	margin-bottom: 50px;
}


/*Условия хранения*/

.storages__img {
	width: 24px;
	height: 24px;
	margin-right: 16px;
}

.storage {
	padding-top: 68px;
	padding-left: 44px;
}

.storages__text {
	font-weight: 400;
	font-size: 16px;
	margin-top: 20px;
}

.storages__item {
	align-items: center;
	margin-top: -30px;
}

.storages__texts {
	font-weight: 400;
	font-size: 13px;
	margin-top: 20px;
	margin-left: 40px;
}

.storages__title {
	margin-bottom: 20px;
}

.storage__img {
	margin-left: 100px;
	margin-top: -78px;
}
 
 /*Футер*/

 .footer {
 	background: #000;
 	color: #fff;
 	padding-top: 46px;
 }

 .contacts__title {
 	color: #fff;
 	margin-bottom: 26px;
 }

 .contacts__first {
 	font-weight: 600;
	font-size: 20px;
 }

 .time {
 	font-weight: 400;
	font-size: 17px;
 }

 .contacts__tel, .contacts__email {
 	font-weight: 400;
	font-size: 17px;
 }

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

 .inst {
 	margin-right: 20px;
 }

 .contacts {
 	padding-left: 70px;
 }



 /*Модальное окно*/
 
 .wrapper {
 	 width: 300px;
    height: 314px;
 	margin: 0 auto;
 	background: #fff;
 	display: flex;
 	justify-content: center;
 	text-align: center;
 }
 .form__title {
 	padding-top: 30px;
 	margin-bottom: 20px;
 }
 .form__input {
 	border: 1px solid #000;
    margin-bottom: 15px;
    height: 37px;
    padding-left: 7px;
    width: 207px;
   font-family: 'Roboto Slab', serif;
 }
 .form__button {
 	margin-top: 0;
    width: 174px;
    height: 40px;
    padding-top: 5px;
	background: rgba(0, 0, 0, 0.8);
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.5);
	color: #fff;
	font-weight: 600;
	font-size: 20px;
	border-radius: 0;

 }
 .box-modal_close {
 	margin-left: 85%;
    color: #fff;
    margin-bottom: 10px;
 }


/*------Media Queries------*/

/* 992-1200 */
@media screen and (max-width: 1200px) {
	.menu__item {
		margin-right: 11px;
	}
	.logo {
		margin-left: -20px;
	}
	.offer-btn {
		margin-top: 0;
	}
	.offer {
		padding-left: 0;
	}
	.bottle-two {
		padding-top: 23px;
	}
}

/* 768-992 */
@media screen and (max-width: 992px) {
	.oblepiha {
		margin-left: 0;
	}
	.point__text-two {
		width: 350px;
	}
	.point-three, .kruassan {
		margin-top: 20px;
	}
	.arrow {
		margin-left: 0;
	}
	.point__text-five {
		width: 350px;
	}
	.point-five {
		margin-top: -50px;
		margin-bottom: 30px;
	}
	.way-three {
		padding-top: 27px;
	}
	.storage__img {
		display: none;
	}
	.storage {
		padding-bottom: 40px;
	}
	.footer__img {
		margin-left: -38px;
	}
	.footer {
		padding-bottom: 30px;	
	}
}

/* 576-768 */
@media screen and (max-width: 768px) {
	.burger {
		margin-top: 35px;
	}
	.menu {
		display: none !important;
	}

	.bar {
		display: block !important;
	}
	.menu-collapse {
		z-index: 2;
		position: absolute;
		width: 40%;
		 background: #fff;
    	border-bottom: 1px solid #000;
		height: 100%;

		right: 0;

		box-shadow: 0px 100px 100px 1000px rgb(0 0 0 / 50%);

	} 
	.menu-collapse__img {
		right: 10px;
   	 position: absolute;
    top: 10px;
	}
	.menu-list {
	 margin-top: 100px;
	text-align: right;	
	}
	.menu__item {
		margin-bottom: 10px;
		display: block;
	}
	.bar {
		z-index: 3;
	}
	.infohead {
		text-align: right;
	}
	.infohead__tel {
		margin-left: 0;
	}
	
	h1 {
		font-size: 36px;
	}
	.offer__text {
		font-size: 18px;
	}
	.offer {
		margin-top: 63px;
	}
	.btn {
		width: 130px;
		height: 30px;
		font-size: 10px;
		padding-top: 7px;
	}
	.slider__img {
		width: 300px;
		height: 180px;
	}
	.point__text {
		width: 230px;
	}
	.point {
		justify-content: center;

	}
	.oblepiha {
	 position: absolute;
    width: 132px;
    left: 414px;
    top: -13px;
	}
	.obl {
		position: relative;
	}
	.point__text-three {
		width: 300px;
	}
	.kruassan {
		left: 5px;
    position: absolute;
    width: 120px;
    top: -57px;
	}
	.kru {
		position: relative;
	}
	.arrow {
		    width: 100px;
    position: absolute;
    left: 431px;
	}
	.arr {
		position: relative;
	}
	.point-five {
		margin-top: 0;
	}
	.way {
		width: 350px;
		height: 280px;
	}
	.way-three {
		padding-top: 76px;
	}
	.storages__title {
    margin-bottom: 45px;
	}
	.footer__img {
		display: none;
	}
	.logo__img {
		width: 92px;
	}
	.logo {
		margin-left: -4px;
		margin-top: 13px;
	}
	.burger {
    margin-top: 18px;
    margin-left: -25px;
	}
	h1 {
		font-size: 32px;
	}
	.offer__text {
		font-size: 15px;
		width: 270px;
		margin-top: 0;
	}
	.offer {
		margin-top: 20px;
	}
	.offer-btn {
		width: 120px;
		height: 30px;
	}
	.burger {
		margin-top: 8px;
		margin-left: 90%;
	}
	
	
	.slider__img {
		width: 262px;
height: 156.32px;
	}
	.slick-prev,.slick-next {
    display: none !important;
	}
	.btn-prod {
		width: 100px;
	height: 25px;
	font-size: 12px;
	}
	h2 {
		font-size: 17px;
		font-weight: 600;
	}
	.contents {
		padding-left: 28px;
	}

	.content__texts {
		font-size: 13px;
		margin-top: 14px;
	}
	.content__text {
		font-size: 14px;
		font-weight: 400;
	}
	.recipe__title {
		padding-top: 49px;
	}
	.btn-r {
		padding-top: 4px;
		width: 116px;
    height: 30px;
	}
	.oblepiha, .kruassan, .arrow {
		display: none;
	}
	.point {
		margin-left: -32px;
		font-size: 13px;

	}
	.point-three {
		width: auto;
	}
	.delivery__title {
		margin-bottom: 30px;
	}
	.bord {
		padding-top: 30px;
	}
	.info {
		font-size: 14px;
		margin-top: 34px;
	}
	.storages__text {
		font-size: 13px;
		margin-top: 26px;
	}
	.storage {
		padding-left: 12px;
		padding-top: 38px;
	}
	.storages__title {
		margin-bottom: 30px;
	}
	.contacts {
		padding-left: 18px;
	}
	.contacts__first {
		font-size: 15px;
	}
	.contacts__tel,.contacts__email {
		font-size: 15px;
	}
	
	
	


}

/* 320-576 */
@media screen and (max-width: 576px) {
	.cap {
		background: none;
	}
	.menu__item {
		font-size: 14px;
	}
	.header {
		padding-bottom: 50px;
	}
	.offer__btn {
		font-size: 13px !important;
	}
	
}





