/* Базовые стили */
.banner{
		position:relative;
		display:flex;
		flex-direction:column;
		justify-content:center;
		align-items:center;
		margin:0 auto;
		padding:60px 5%;
		width:100%;
		min-height:100vh;
		height:auto;
		background-attachment:scroll !important;
		background-repeat:no-repeat !important;
		background-size:cover !important;
		background-position:center center !important;
		z-index:1;
		}
/* Для Retina-экранов (iPhone 4 и новее) */
@media only screen and (-webkit-min-device-pixel-ratio: 2){
.banner{
		background-attachment: scroll !important;
		}
}		
.banner:before{
		content:'';
		display:block;
		width:100%;
		height:100%;
		position:absolute;
		top:0;
		left:0;
		background-color:rgba(29,30,37,0.5);
		z-index:2;
		transition:all 1s ease-out;
		}
		
.banner:hover:before{
		background-color:rgba(29,30,37,0.8);
		}
	
.hot{
		position:relative;
		display:flex;
		flex-direction:row;
		flex-wrap:wrap;
		justify-content:center;
		align-content:center;
		align-items:center;
		width:80%;
		max-width:200px;
		font-size:16px;
		margin:20px auto 0px;
		padding:12px;
		font-weight:600;
		text-align:center;
		text-decoration:none;
        transition:all 1s ease-out;
		background:#D8493E;
		color:#FFF;
		z-index:10;
		}
.hot:hover{
		background:#CDBA91;
		}	
	
		
.banner-all,
.banner-card{
		min-height:70vh;
		height:auto;
		flex-direction:column;
		justify-content:center;
		align-content:center;
		padding:40px 5%;
		}
		
.banner-all:before,
.banner-card:before{
		content:'';
		display:block;
		width:100%;
		height:100%;
		position:absolute;
		top:0;
		left:0;
		background-color:rgba(29,30,37,0.2);
		z-index:2;
		transition:all 1s ease-out;
		}
		
.banner-all:hover:before,
.banner-card:hover:before{
		background-color:rgba(29,30,37,0.5);
		}
		
/* Текстовые элементы */
.banner h1,
.banner strong,
.banner p,
.banner a.shop-now{
		display:block;
		font-weight:600;
		color:#FFF;
		text-align:center;
		z-index:3;
		width:100%;
		}
		
.banner h1{
		text-transform:uppercase;
		margin:20px auto;
		color:#CDBA91;
		font-size:32px;
		line-height:1.2;
		}
		
.banner-all h1,
.banner-card h1{
		text-align:center;
		font-size:32px;
		margin:0 0 15px 0;
		}
		
.banner-all p,
.banner-card p{
		margin:0 0 15px 0;
		}
		
.banner-all p svg,
.banner-all p img,
.banner-card p svg,
.banner-card p img{
		display:block;
		height:1em;
		width:1em;
		fill:#FFF;
		font-size:30px;
		margin:0 auto;
		transition:all 2s ease-out;
		}
		
.banner-all p img,
.banner-card p img{
		border-radius:8px;
		}
		
.banner strong{
		font-size:24px;
		}
		
.banner p{
		font-size:18px;
		line-height:1.4;
		}
		
.banner a.shop-now{
		width:80%;
		max-width:200px;
		margin:20px auto 0 auto;
		font-size:16px;
		padding:12px;
		border:1px solid #45474D;
		}
		
.vstavka{
		width:100%;
		min-height:70vh;
		height:auto;
		background-attachment:scroll !important;
		background-repeat:no-repeat !important;
		background-size:cover !important;
		background-position:center center !important;
		}
/* Маленькие устройства (вертикальные телефоны, 576px и выше) */
		@media (min-width:576px){
/* Стили для "больших" мобильных */
.banner h1{
		font-size:40px;
		}
		
.banner-all h1,
.banner-card h1{
		font-size:40px;
		}
		
.banner strong{
		font-size:28px;
		}
		
.banner p{
		font-size:20px;
		}
		}	
/* Средние устройства (горизонтальные телефоны/маленькие планшеты, 768px и выше) */
		@media (min-width:768px){
/* Стили для планшетов */
.banner{
		padding:90px 7%;
		}
		
.banner h1{
		font-size:48px;
		}
		
.banner-all h1,
.banner-card h1{
		font-size:48px;
		text-align:left;
		}
		
.banner-all,
.banner-card{
		flex-direction:row;
		justify-content:flex-start;
		padding:60px 7%;
		}
		}	
/* Большие устройства (планшеты/небольшие ноутбуки, 992px и выше) */
		@media (min-width:992px){
/* Стили для небольших десктопов */
.banner{
		background-attachment:fixed !important;
		}
		
.vstavka{
		background-attachment:fixed !important;
		}
		
.banner h1{
		font-size:55px;
		}
		
.banner-all h1,
.banner-card h1{
		font-size:55px;
		}
		
.banner strong{
		font-size:35px;
		}
		
.banner p{
		font-size:24px;
		}
		
.banner a.shop-now{
		width:150px;
		font-size:20px;
		padding:15px;
		}
		}
/* Очень большие устройства (ноутбуки и десктопы, 1200px и выше) */
		@media (min-width:1200px){
/* Стили для больших экранов */
.banner{
		position:relative;
		display:flex;
		flex-direction:column;
		flex-wrap:wrap;
		justify-content:center;
		align-content:center;
		align-items:center;
		margin:0 auto;
		padding:90px 7%;
		width:100%;
		height:100vh;
		background-attachment:fixed !important;
		background-repeat:no-repeat !important;
		background-size:cover !important;
		background-position:center bottom !important;
		z-index:1;
		}
.banner:before{
		content:'';
		display:block;
		width:100%;
		height:100%;
		position:absolute;
		top:0;
		left:0;
		right:0;
		bottom:0;
		background-color:rgba(29,30,37,0.5);
		z-index:2;
		-webkit-transition:all 1s ease-out;
		-moz-transition:all 1s ease-out;
		-ms-transition:all 1s ease-out;
		-o-transition:all 1s ease-out;
		transition:all 1s ease-out;
		}
.banner:hover:before{
		background-color:rgba(29,30,37,0.8);
		}
.banner-all{
		height:70vh;
		flex-direction:row;
		justify-content:flex-start;
		align-content:center;
		align-items:center;
		}
.banner-card{
		height:70vh;
		flex-direction:row;
		justify-content:flex-start;
		align-content:center;
		align-items:center;
		}
.banner-all:before,
.banner-card:before{
		content:'';
		display:block;
		width:100%;
		height:100%;
		position:absolute;
		top:0;
		left:0;
		right:0;
		bottom:0;
		background-color:rgba(29,30,37,0.2);
		z-index:2;
		-webkit-transition:all 1s ease-out;
		-moz-transition:all 1s ease-out;
		-ms-transition:all 1s ease-out;
		-o-transition:all 1s ease-out;
		transition:all 1s ease-out;
		}
.banner-all:hover:before,
.banner-card:hover:before{
		background-color:rgba(29,30,37,0.5);
		}	
		
.banner h1,
.banner strong,
.banner p,
.banner a.shop-now{
		display:block;
		font-weight:600;
		font-size:35px;
		color:#FFF;
		text-align:center;
		z-index:3;
		}
.banner h1{
		text-transform:uppercase;
		margin:30px auto;
		color:#CDBA91;
		font-size:55px;
		}
.banner-all h1,
.banner-card h1{
		text-align:left;
		font-size:55px;
		margin:0;
		color:#CDBA91;
		text-transform:uppercase;
		}
.banner-all p,
.banner-card p{
		margin:0;
		}
.banner-all p svg,
.banner-all p img,
.banner-card p svg,
.banner-card p img{
		display:block;
		height:1.2em;
		width:1.2em;
		fill:#FFF;
		font-size:50px;
		-webkit-transition:all 2s ease-out;
		-moz-transition:all 2s ease-out;
		-ms-transition:all 2s ease-out;
		-o-transition:all 2s ease-out;
		transition:all 2s ease-out;
		}	
.banner-all p img,
.banner-card p img{
		border-radius:10px;
		}			
		
.banner strong{
		font-size:35px;
		}
.banner p{
		font-size:24px;
		}
.banner a.shop-now{
		width:150px;
		margin:30px auto 0 auto;
		font-size:20px;
		color:#CDBA91;
		padding:15px;
		border:1px solid #45474D;
		text-decoration:none;
		-webkit-transition:all 1s ease-out;
		-moz-transition:all 1s ease-out;
		-ms-transition:all 1s ease-out;
		-o-transition:all 1s ease-out;
		transition:all 1s ease-out;
		}
.banner a.shop-now:hover{
		color:#FFF;
		border:1px solid #CDBA91;
		}
		
.vstavka{
		width:100%;
		height:70vh;
		background-attachment:fixed !important;
		background-repeat:no-repeat !important;
		background-size:100% auto !important;
		background-position:center center !important;
		}
.hot{
        width:150px;
        margin:30px auto 0 auto;
        font-size:20px;
        color:#FFF;
        padding:15px;
    	}
}