.but_brown {
	min-height:44px;
	height:44px;
	width:300px;
	min-width:240px;
	text-align:center;
	background-color: #d5a98e;
	margin: 0px auto 0 auto; 
	box-sizing: border-box;	
	padding-top: 14px;
	font-family:'PT Sans', sans-serif;
	font-size:18px;
	letter-spacing:0em;
	line-height:18px;
	color:#ffffff; 	
	text-transform:uppercase;
	text-decoration: none;
	
	display:block;
	position: absolute;
	transition:background-color .4s;
outline:none;
	 
}
.but_brown:hover {
	background-color: #a08778;
}
.but_green, .but_green_light, .but_red_light  {
	line-height:52px;
	min-height:52px;
	height:52px;
	width:352px;
	text-align:center;
	margin: 0px auto 20px auto; 
	box-sizing: border-box;	
	font-size:18px;
	letter-spacing:0em;
	text-transform:uppercase;
	text-decoration: none;
	display:block;
	transition:background-color .4s;
}
.but_green {
	background-color: #00963f;
	font-family:'PT Sans', sans-serif;
	color:#ffffff; 	
	border: 1px solid #00963f;
}
.but_green:hover {
	background-color: white;
	color: #00963f;
	border: 1px solid #00963f;
}

.but_green_light {
	background-color: #fff;
	font-family:'PT Sans', sans-serif;
	color: #d1dd94;
	border: 1px solid #d1dd94;
}

.but_red_light {
	background-color: #fff;
	font-family:'PT Sans', sans-serif;
	color: red;
	border: 1px solid red;
}



.but_green_light:hover {
	background-color: white;
	color: #00963f;
	border: 1px solid #00963f;
}

/*2*/
@media only screen and (min-width: 1088px) and (max-width: 1184px){
	.but_brown {min-height:44px;height:44px;width:300px;min-width:240px;padding-top: 14px;font-size:18px;line-height:18px;}
	.but_green, .but_green_light  {line-height:52px;min-height:52px;height:52px;width:320px;margin: 0px auto 18px auto; font-size:18px;}
}
/*3*/
@media only screen and (min-width: 896px) and (max-width: 1088px){
	.but_brown {min-height:44px;height:44px;width:300px;min-width:240px;padding-top: 14px;font-size:18px;line-height:18px;}
	.but_green, .but_green_light  {line-height:46px;min-height:46px;height:46px;width:400px;margin: 0px auto 18px auto; font-size:16px;}
}
/*4*/
@media only screen and (min-width: 736px) and (max-width: 896px){
	.but_green, .but_green_light  {line-height:46px;min-height:46px;height:46px;width:496px;margin: 0px auto 18px auto; font-size:16px;}
}
/*5*/
@media only screen and (min-width: 520px) and (max-width: 736px){
	.but_green, .but_green_light  {line-height:46px;min-height:46px;height:46px;width:100%;margin: 0px 0 18px 0; font-size:16px;}
}
/*6*/
@media only screen and (max-width: 520px){
	.but_green, .but_green_light  {line-height:46px;min-height:46px;height:46px;width:100%;margin: 0px 0 18px 0; font-size:5vw;}
}


.but_url_green {
	font-family:'PT Sans', sans-serif;
	font-size: 18px;
	letter-spacing: 0.075em;
	position:relative;
	text-transform:uppercase;
	text-decoration:none; 
	color:#6f8966
}
@media only screen and (max-width: 640px){
	.but_url_green {	font-size: 16px;}
}
.but_url_green::before, .but_url_green::after {

	position:absolute;
	left:0;
	width:100%;
	height:1px;
	content:'';
	transition:-webkit-transform .3s;
	transition:transform .3s;
	transition:transform .3s, -webkit-transform .3s;
	background:#6f8966

	}
.but_url_green::before  {bottom: 0px;}	
.but_url_green::after {bottom: -3px;}

.but_url_green:hover:before{-webkit-transform:translateY(1px);-ms-transform:translateY(1px);transform:translateY(1px)}
.but_url_green:hover:after{-webkit-transform:translateY(-1px);-ms-transform:translateY(-1px);transform:translateY(-1px)}

/************************************/
/* ПЕРЕКЛЮЧАТЕЛЬ on/off				*/
.switch input, .switch_pol input  {
    /* Вначале делаем его равным размеру контейнера, в котором он находится */
    position: absolute;
    width: 100%;
    height: 100%;
    /* Затем, перемещаем его вверх, относительно других элементов */
    z-index: 100;
    /* Делаем его невидимым */
    opacity: 0;
    /* А это для эргономичности */
    cursor: pointer;
}
.switch, .switch_pol {
    width: 90px;
    height: 25px;
    position: relative;
	display: inline-block;
	line-height:1;
	margin: 10px 10px 0 10px;
	text-align: left;
}

.switch label  {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
    background: #a5a39d;
    border-radius: 20px;
    box-shadow:
        inset 0 3px 8px 1px rgba(0,0,0,0.2),
        0 1px 0 rgba(255,255,255,0.5);
}
.switch_pol label  {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
    background: #e498ce;
    border-radius: 20px;
    box-shadow:
        inset 0 3px 8px 1px rgba(0,0,0,0.2),
        0 1px 0 rgba(255,255,255,0.5);
}

.switch label:after, .switch_pol label:after  {
    content: "";
    position: absolute;
    z-index: -1;
    top: -4px; right: -4px; bottom: -4px; left: -4px;
    border-radius: inherit;
    background: #ccc; /* Fallback */
    background: linear-gradient(#f2f2f2, #ababab);
    box-shadow: 0 0 5px rgba(0,0,0,0.3),
        0 1px 1px rgba(0,0,0,0.25);
}

.switch label:before, .switch_pol label:before  {
    content: "";
    position: absolute;
    z-index: -1;
    top: -9px; right: -9px; bottom: -9px; left: -9px;
    border-radius: inherit;
    background: #eee; /* Fallback */
    background: linear-gradient(#e5e7e6, #eee);
    box-shadow: 0 1px 0 rgba(255,255,255,0.5);
    -webkit-filter: blur(1px); /* Smooth trick */
    filter: blur(1px); /* Future-proof */
}

.switch label i, .switch_pol label i  {
    display: block;
    height: 100%;
    width: 60%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 2;
    border-radius: inherit;
    background: #b2ac9e; /* Fallback */
    background: linear-gradient(#f7f2f6, #b2ac9e);
    box-shadow:
        inset 0 1px 0 white,
        0 0 4px rgba(0,0,0,0.3),
        0 2px 2px rgba(0,0,0,0.2);
}
.switch label i:after, .switch_pol label i:after {
    content: "";
    position: absolute;
    left: 15%;
    top: 25%;
    width: 70%;
    height: 50%;
    background: #d2cbc3; /* Fallback */
    background: linear-gradient(#cbc7bc, #d2cbc3);
    border-radius: inherit;
}

.switch label i:before {
    content: "нет";
    position: absolute;
    top: 50%;
    right: -50%;
    margin-top: -6px;
    color: #444444; /* Fallback */
   /* color: rgba(0,0,0,0.4);*/
    font-style: normal;
    font-weight: bold;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 12px;
    text-transform: uppercase;
    text-shadow: 0 1px 0 #bcb8ae, 0 -1px 0 #97958e;
}
.switch_pol label i:before {
    content: "ж";
    position: absolute;
    top: 50%;
    right: -40%;
    margin-top: -6px;
    color: #513649; /* Fallback */
   /* color: rgba(0,0,0,0.4);*/
    font-style: normal;
    font-weight: bold;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 12px;
    text-transform: uppercase;
    text-shadow: 0 1px 0 #bcb8ae, 0 -1px 0 #97958e;
}
.switch input:checked ~ label, .switch_pol input:checked ~ label  { /* Background */
    background: #9abb82;
}
 
.switch input:checked ~ label i, .switch_pol input:checked ~ label i  { /* Toggle */
    left: auto;
    right: -1%;
}
 
.switch input:checked ~ label i:before  { /* On/off */
    content: "да";
    right: 115%;
    color: #4b5c3d;
    text-shadow: 0 1px 0 #afcb9b, 0 -1px 0 #6b8659;
}
.switch_pol input:checked ~ label i:before  { /* On/off */
    content: "М";
    right: 115%;
    color: #4b5c3d;
    text-shadow: 0 1px 0 #afcb9b, 0 -1px 0 #6b8659;
}