@media screen and (min-width:685px) and (max-width:800px){
.header .title H1{	font-size: 33px; }
.header .title span{font-size: 47px; }
H2 {	font-size: 29px; padding-right: 5px; padding-left: 5px;}
.causes .block .row{	min-height: 60px;}	
h3                 { font-size: 22px; }
p                 { font-size: 16px; }
.causes .block .row img{	width: 20px; height: 20px;}
.causes .block .row p{	width: 80%;}
.bonus H2, .bonus_hour H2, .bonus_reg H2, .bonus_opt H2{	font-size: 29px;}	
}
@media screen and (min-width:501px) and (max-width:684px){
.header .title H1{	font-size: 23px; padding-top: 15px;	padding-bottom: 15px;}
.header .title span{font-size: 33px; }
H2 {	font-size: 26px; padding-right: 5px; padding-left: 5px;}
.causes .block .row{	min-height: 100px;}	
h3                 { font-size: 20px; }
p                 { font-size: 14px; }
.causes .block .row img{	width: 20px; height: 20px;}
.causes .block .row p{	width: 80%;}
.bonus H2, .bonus_hour H2, .bonus_reg H2, .bonus_opt H2{	font-size: 26px;}				
}
@media screen and (min-width:481px) and (max-width:500px){
.header .title H1{	font-size: 22px; padding-top: 15px;	padding-bottom: 15px;}
.header .title span{font-size: 32px; }	
H2 {	font-size: 26px; padding-right: 5px; padding-left: 5px;}
.causes .block .row{	min-height: 100px;}	
h3                 { font-size: 18px; }
p                 { font-size: 14px; }
.causes .block .row img{	width: 20px; height: 20px;}
.causes .block .row p{	width: 80%;}
.bonus H2, .bonus_hour H2, .bonus_reg H2, .bonus_opt H2{	font-size: 26px;}
}
@media (max-width:480px){
.header .title H1{	font-size: 14px; 	padding-top: 15px;	padding-bottom: 15px;}
.header .title span{font-size: 19px; }
H2 {	font-size: 24px; padding-right: 5px; padding-left: 5px;}
.causes .block .row{	min-height: 160px;}	
h3                 { font-size: 16px; }
p                 { font-size: 14px; }
.causes .block .row img{	width: 20px; height: 20px;}
.causes .block .row p{	width: 80%;}
.bonus H2, .bonus_hour H2, .bonus_reg H2, .bonus_opt H2{	font-size: 24px;}	
[class^="but"] {
	margin-right: auto;
	margin-left: auto;	
	max-width: 310px;
}
.overlay:target+.popup {
    top: 5%;
    opacity: 1;
    visibility: visible;
}
.header .stock{
	margin-left: auto;
	margin-right: auto;
	width: 310px;
}
.reviews .block{
	text-align: center;
	vertical-align: top;
	display: inline-block;
	width: 100%;
	min-width: 280px;
	margin-bottom: 5px;
}
.reviews .block img{
	border-radius: 150px 150px 150px 150px;
	-moz-border-radius: 150px 150px 150px 150px;
	-webkit-border-radius: 150px 150px 150px 150px;
	border: 4px solid #000099;
	height: 100px;
	width: 100px;
	margin-top: 5px;	
	margin-left: 5px;
	margin-right: auto;
	display: block;
	float: none;	
	top: 5px;
	left: 30px;
}
.reviews .block H3{
	font-size: 18px;
	width: 310px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	display: block;
	position: relative;
	left: 0;
	top: 0;
}
.reviews .block p{
	display: block;
	padding: 10px;
	width: 90%;
	border-radius: 50px 5px 5px 5px;
	-moz-border-radius: 5px 5px 5px 5px;
	-webkit-border-radius: 5px 5px 5px 5px;
	background-color: rgba(176, 235, 235, 1);
	top: 35px;
	right: 0px;
	float: none;
	font-size: 16px;
	text-align: left;
	vertical-align: top;
	z-index: 2;
	margin-left: auto;
	margin-right: auto;
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
	color: #005984;
}
.reviews .block p:before{
	z-index: -1;
	width: 45px;
	height: 49px;
	position: absolute;
	content: "";
	top: -20px;
	left: 100px;
	border: none;
	-webkit-transform: rotateZ(-100deg)  translateX(-5px) skewX(-36deg);
	transform: rotateZ(-100deg)  translateX(-5px) skewX(-36deg);
	background-color: rgba(176, 235, 235, 1);
}
}
@media (max-width:645px){
.header .wrapper_bg .wrapper .logo{
	text-align: center;
	width: 100%;
}
.header .wrapper_bg .wrapper .logo p{
	margin-right: auto;
	margin-left: auto;
}
.header .wrapper_bg .wrapper .logo span{
	margin-right: auto;
	margin-left: auto;
}
.header .wrapper_bg .wrapper .phone{
	width: 100%;
	text-align: center;
}
.header .wrapper_bg .wrapper .phone .block {
	text-align: center;
	width: 200px;
}
.contacts .block{
	text-align: center;
	vertical-align: top;
	display: inline-block;
	width: 100%;
	min-width: 310px;
	margin-bottom: 10px;
}
.header{
	background-size: auto 100%;	
}
}
@media screen and (min-width:481px) and (max-width:775px){
.header .stock{
	margin-left: auto;
	margin-right: 10px;
}	
}