/*==========  Desktop First Method  ==========*/

/* Large Devices, Wide Screens */
@media only screen and (max-width : 1200px) {
	.container {
	    max-width: 1170px;
	}
	header h1{
		font-size: 35px;
	}
	.tel-top span{
		font-size: 25px;
		line-height: 20px;
	}
	.hot-offer h4{
		font-size: 25px;
	}
	.discount-txt {
	    font-size: 20px;
	}
	.tabs-menu a{
		font-size: 10px;
	}
	.styled-select select{
		width: 100%;
		max-width: 150px;
	}
	.ro-body input{
		width: 50px;
		padding-left: 10px;
	}
	.delivery .button-wrp{
		top: 20px;
	}
	.thirty{
		font-size: 3.5em;
	}
	.logo-title{
	  font-size: 2em;
	}
	.logo p{
	  font-size: 0.7em;
	}
}

/* Medium Devices, Desktops */
@media only screen and (max-width : 992px) {
.fix-menu{
		display: none;
	}
	body{
		margin-left: 0;
	}
	.ro-body{
		padding-left: 0;
	}
	.styled-select select{
		max-width: none;
		margin-bottom: 10px;
	}
	.num{
		margin-right: 0;
	}
}

/* Small Devices, Tablets */
@media only screen and (max-width : 768px) {
	.logo{
		text-align: center;
	}
	nav .row{
		align-items: center;
	}
	.work-wrp{
		display: block;
	}
	.tel-top{
		justify-content: center;
	}
	.work-day{
		padding: 10px 0 0;
	}
	.top-girl img, .tab-img, #jimg{
		width: auto;
		display: block;
		margin: 0 auto 20px;
	}
	.tabs-menu a{
		padding: 10px 5px;
	}
	.zamer-layer, 
	.delivery-layer{
		background: none!important;
		position: relative;
	}
	.zamer-layer{
		padding-left: 15px;
		padding-right: 15px;
	}
	.zamer-layer::after{
		content: '';
		display: block;
		background: url(../img/zamerchik.png) no-repeat bottom center;
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		z-index: -1;
		opacity: .3;
	}
	.delivery-layer::after{
		content: '';
		display: block;
		background: url(../img/delivery.png) no-repeat bottom center;
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		z-index: -1;
		opacity: .3;
	}
	.calc-menu{
		flex-wrap: wrap;
		justify-content: flex-start;
	}
	.calc-menu a{
		margin: 5px;
	}
	footer .work-day{
		border: none;
	}
	.header-txt{
		padding-left: 15px;
	}
}

/* Extra Small Devices, Phones */
@media only screen and (max-width : 480px) {
	.container{
		max-width: 480px;
		width: 100%;
	}
	.top-girl img, .tab-img, #jimg{
		width: 100%;
		display: block;
		margin: 0 auto 20px;
	}
	.work-day, .border-left{
		border: none;
	}
	.logo{
		text-align: center;
	}
	header h1, 
	.tab-info h2{
		font-size: 24px;
	}
	.hot-offer{
		padding: 0 20px;
	}
	.hot-offer h4{
		font-size: 20px;
	}
	.thirty{
		font-size: 2.5em;
	}
	.discount-txt{
		font-size: 15px;
	}
	.tabs-menu, 
	.tabs-menu a{
		display: block;
		margin-top: -1px;
	}
	.tabs-menu li:first-child a,
	.tabs-menu li:last-child a{
		border-radius: 0;
	}
	.four-i li{
		text-align: center;
	}
	.four-i li img{
		float: none;
		margin-bottom: 15px;
	}
	.zamer h2, 
	.delivery h2{
		text-align: center;
		font-size: 21px;
		margin-left: 0;
	}
	.tabz h2, 
	.zal-p h2{
		text-align: center;
		font-size: 23px;
		margin: 15px auto;
	}
	.zamer form{
		margin-top: 0;
	}
	.ro-title h3{
		font-size: 19px;
	}
	.row1{
		padding-left: 0;
	}
	.ro-body{
		display: flex;
    	justify-content: space-between;
	}
	.calc-menu a{
		width: 30px;
		height: 30px;
	}
	.pliss-menu a{
		padding: 10px;
		font-size: 14px;
	}
	.price-layer{
		width: auto;
	}
	.price-layer > div{
		right: 0;
	}
	footer .logo img{
		width: 70%;
	}
	footer{
		text-align: center;
	}
	footer p,
	footer a{
		margin-top: 15px;
		display: block;
	}
}

/* Custom, iPhone Retina */
@media only screen and (max-width : 360px) {

	header h1, .tab-info h2 {
	    font-size: 21px;
	}
	.discount-txt{
		font-size: 12px;
	}
	.main_form .button-wrp{
		padding: 0;
	}

}


/*==========  Mobile First Method  ==========*/

/* Custom, iPhone Retina */
@media only screen and (min-width : 320px) {

}

/* Extra Small Devices, Phones */
@media only screen and (min-width : 480px) {

}

/* Small Devices, Tablets */
@media only screen and (min-width : 768px) {

}

/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) {

}

/* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {
    .container {
	    max-width: 1170px;
	}
}