*{
    padding:0; margin:0;
}
body,html {
    width:100%;
	height: auto;
	}
h1, p {
    margin-bottom:20px;
}
.content-main {
    max-width:100%; margin:0 auto;
}
.card{
    position: relative;
    
    float: left;
    
    width: 300px;
    height:600px;
    
    background: #fff;
    
    border-radius: 5px;
    
    overflow: hidden;
    
    font-family: sans-serif;
    
    margin-right: 15px;
}

.card-image{
    
    width: 100%;
    
}

.card-body{
    padding: 4px 7px;
}

.card-title{
    margin-top: 4px;
    font-size: 11px;
}

.card-title a{
    text-decoration: none;
    color: #000;
}

.card-title a:hover{
    
    color: red;
}

.card-sale::before{
    content: 'SALE';
    background: #ff0036;
    color:#fff;
    padding: 2px 4px;
    border-radius: 3px;
}

.card-price{
    font-size: 14px;
    font-weight: bold;
    margin-top: 4px;
}

.card-discount{
    font-size: 11px;
    margin-top: 4px;
}

.card-discount-price{
    color: #a2a2a2;
    text-decoration: line-through;
}

.card-discount-size{
    color: #ff5555;
    font-weight: bold;
    background: #fff1f1;
}

.card-delivery{
    font-size: 11px;
    margin-top: 4px;
    color: #897f72;
}

.card-options{
    font-size: 11px;
    margin-top: 8px;  
    font-weight: bold;
}

.card-options-plus::before{
    content: 'plus';
    font-style: italic;
    background: #fffc00;
    padding: 2px 3px;
    font-weight:normal;
    border-radius: 3px;
}

.card-options span{
    color: #696969;
    background: #f5f5f5;
    padding: 3px 3px 2px 2px;
    font-weight:bold;
    border-radius: 3px;
}

.card-options img{
    position: relative;
    top:4px;
    width: 15px;
}

.card-table{
    font-size: 11px;
}

.leftbox {
    font-size:18px;
    float:left; width:21%;
}
.news {
    margin-left:6px;
}
.without {
    margin-left:6px;
}
.content {
    font-size:18px;
    float:left; width:54%; padding:2%; margin-bottom:30px;
}
.side-bare {
    float:right; width:21%;
}
.side-block {
    padding:4%; margin-bottom:30px;
}
@media screen and (max-width:1115px) {
	.meny,.html, .css, .php, .js, .con {
	font-size:14px;
	}
  ul, li {
	font-size:14px;
	}
}
@media screen and (max-width:975px) {
	.min {
	display: none;
	}
	.rf {
	font-size: 14px;
	}
}
@media screen and (max-width:800px) {
    .leftbox {
	display: none;
	}
	.content {
	width:96%; float:left;
	}
	.side-bare {
    float:none; width:100%;
	}
	.side-block {
	float:right; width:44%; padding:2%;
	}
	.side-block: first-child {
	float:left;
	}
	.rf {
	font-size: 12px;
	}
	.rf2{
	display:none;
	}
}
@media screen and (max-width:650px) {
	.min2 {
	display: none;
	}
}
@media screen and (max-width:480px) {
	.side-block {
	float:left; width:96%; padding:2%;
	}
	.side-block: first-child {
	float:none; 
	}
	.meny,.html, .css, .php, .js, .con {
	font-size:12px;
	}
	.meny {
	max-height:45px;
	}
  ul, li {
	font-size:12px;
	}
}
@media screen and (max-width:420px) {
	.meny,.html, .css, .php, .js, .con {
	font-size:10px;
	}
	.meny {
	max-height:40px;
	}
	.menu {
	    max-height:40px;
	}
  ul, li {
	font-size:10px;
	}
	.micro{
	display: none;
	}
}
	html, body {
	
	height: 100%;
		
    margin: 0;
		
    padding:0;
	
   }
	.watch{
	margin-left:1%;
	}
    .wrapper {
		
    min-height: 100%;
		
    height: auto !important;
		
    height: 100%;
		
    margin: 0 0 -40px 0; /* отрицательный нижний отступ на высоту футера */

    padding: 0;
	
   }
	
    .footer-push {
		
    height: 40px;
		
	}
	
    .footer {
	clear:both;	
    background: blue;
	margin: -40px auto 0 auto;
	padding: 0;
	height: 40px;
	
   }
	#more {
	    
    display: none;
	
   }
     .meny{             /*Общий блок*/
	background: blue;     /*Фон общего блока*/
	padding: 0px;     /*Отступ от пунктов меню*/
	border-radius: 5px;     /*Закруглённые углы*/
	box-shadow: 0px 0px 0px 0px #0ea8f4;     /*Рамка общего блока*/
	width: 100%;     /*Ширина*/
	height: 50px;     /*Высота*/
	font-size:16px;
	}
  .html, .css, .php, .js, .con{         /*Пункты меню - размещение*/
	float: left;     /*Размещаем горизонтально*/
	margin: 10px 0px 0px 0px;     /*Отступ между пунктами*/
	width: 20%; 	/*Ширина пунктов*/
	}
  ul {             /*Пункты подменю*/
	width: 20%;     /*Ширина пунктов подменю*/
	list-style: none;     /*Убираем маркеры*/
	padding: 0;     /*Поля вокруг текста*/
	margin: 0 0 0 0;     /*Отступы вокруг подменю*/
	font-family: Arial, sans-serif;     /*Шрифт текста в меню*/
	font-size: 16px;     /*Размер текста в меню*/
	text-align: center;     /*Текст по центру*/
	}
  li ul {             /*Размещаем подменю*/
	position: absolute; z-index: 1000;    /*Подменю позиционируются абсолютно*/
	display: none;     /*Скрываем подменю*/
	margin-left: 0px;     /*Сдвиг подменю вправо или влево*/
	margin-top: 0px;     /*Сдвиг подменю вверх или вниз*/
	}
  li a {              /*Ссылка в подменю*/ 
	display: block;     /*Ссылка*/
	padding: 5px;     /*Поля вокруг текста*/
	text-decoration: none;     /*Убираем подчеркивание*/
	color: black;     /*Цвет текста*/
	border-radius: 5px;    /*Закруглённые углы пунктов меню*/
	box-shadow: 0px 0px 0px 2px #0ea8f4;     /*Рамка пунктов меню*/
	background: #7df9ff;     /*Фон для старых браузеров*/
	background: -moz-radial-gradient(center, ellipse cover, #7df9ff 50%, #FBFFFF);     /*Переходящий фон (градиент) пунктов меню*/
		background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(50%,#7df9ff), color-stop(100%,#FBFFFF)); 
			background: -webkit-radial-gradient(center, ellipse cover, #7df9ff 50%, #FBFFFF);
				background: -o-radial-gradient(center, ellipse cover, #7df9ff 50%, #FBFFFF);
					background: -ms-radial-gradient(center, ellipse cover, #7df9ff 50%, #FBFFFF);
	}
  li a:hover {         /*Ссылки подменю при наведении курсора*/
	color: #ffe;     /*Цвет текста при наведении*/
	box-shadow: 0px 0px 5px 2px #0ea8f4; /*Рамка при наведении*/
	background: #009494;     /*Фон при наведении*/
	background: -moz-radial-gradient(center, ellipse cover, #009494, #FBFFFF);     /*Градиент при наведении*/
	background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,#009494), color-stop(100%,#FBFFFF)); 
		background: -webkit-radial-gradient(center, ellipse cover, #009494, #FBFFFF);
			background: -o-radial-gradient(center, ellipse cover, #009494, #FBFFFF);
				background: -ms-radial-gradient(center, ellipse cover, #009494, #FBFFFF);
	}
   li a:active{        /*При нажатии */
	color: #ef7a04;
	box-shadow: 0px 0px 15px 5px #0ea8f4;
	}
  li:hover ul {         /*Подменю при наведении курсора*/
	display: block;     /*Подменю отображается при наведении курсора*/
   }
.cap {
    float:left;
    margin:0 auto;
    width: 100%;
}
  .best {
    float:left;
    width:27%;
	max-width:100%;
	min-width:180px;
}
.logotip {
    float:left;
    width:60%;
	max-width:100%;
	min-width:180px;
}
 .slogan {
    margin-top: 5%;
    float:left;
    width:50%;
	text-align: center;
	font-size:25px;
	font: sans-serif;
    color: black;
    text-shadow: #cad5e2 1px 1px 0, #cad5e2 2px 2px 0, 
                 #cad5e2 3px 3px 0, #cad5e2 4px 4px 0, 
                 #cad5e2 5px 5px 0;
 }
   .atribute {
    width:20%;
	float:right;
	text-align: center;

  }
    .ind {
    float:; width:100%
  }
  .menu{
	float: left;
	width:100%;
	background:blue;
	height:50px;
	}
  @media screen and (max-width:1000px){
  	.slogan{
	font-size:20px;
	margin-top: 3%;
	}
	.atribute{
	font-size:14px;
	}
}
  @media screen and (max-width:780px){
    .atribute {
	float:none;
	width:100%;
	}
	.slogan {
	width:73%;

	}
	.ind: first-child {
	float:left;
	}
	.ind {
	float:right;
	width:50%;
	}
	.ind2 {
	margin-right:45%;
  }
    .ind1 {
	margin-right:50%;
	}
	.mini {
	display: none;
	}
}
  @media screen and (max-width:680px){
    .slogan{
	font-size:16px;
	margin-top: 1%;
	margin-left:3%;
	width:60%;
	}
}	
  @media screen and (max-width:555px){
    .atribute {
	display:none;
	}
}
  @media screen and (max-width:505px){
    .slogan {
	float:none;
	width:90%;
	font-size:13px;
	margin-top:6%;
	}
	.best {
	width:30%;
	float:none;
	}
	.SB {
	display:none;
	}
}

.foto1 {
    text-align:center;

}


#gb_container {
	margin: 0 auto;
	border: 3px solid #EEEEEE;
	width: 100%;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	padding: 5px 5px 5px 5px;
}

.msg_container {
	
	margin-bottom: 10px;
	border: 2px solid #999;
	
}

.msg_header {

	background: #CCC;
	border-bottom: 1px solid #999;
	padding: 3px 3px 3px 3px;
	
}

.msg_body {

	padding: 10px 10px 10px 10px;
	
}

.msg_footer {

	background: #E5E5E5;
	border-top: 1px solid #BBB;
	padding: 5px 5px 5px 5px;
	color: #AAA;
	
}

.msg_header   a {

	color: black;
	
	
}

input, textarea {
	border: solid 1px #CCCCCC;
	padding: 4px;
	outline: 0;
	font: Verdana;
	width: 200px;
	background: #F9F9F9;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
}

p label {
	margin-left: 10px;
	font-style: italic;
	color: #c0c0c0;
}

input [name="name"]{
	margin-top: 10px;
}

textarea {
	width: 400px;
	height: 150px;
	line-height: 150%;
}
textarea1 {
	width: 60%;
	height: 150px;
    line-height: 150%;
}

.send input {
	width: auto;
	margin-bottom: 10px;
	border: 2px solid #E0E0F3;
	font: Verdana;
	background-color: #E5E5F8;
}



input:hover, textarea:hover, input:focus, textarea:focus {
	border-color: #A0A0A0;
}

.send input:hover {
	border: 2px solid #C0C0E3;
}

#mainform {

	margin-top: 20px;
	margin-left: 10px;
	border-top: 1px solid #e3e3e3;
	
}
#gb_container table {

	margin-left: 20px;
	margin-bottom: 20px;	

}

#gb_container td {

	border: 1px solid #E5E5E5;
	padding: 10px 10px 10px 10px;

	
}	
#gb_container h2  {
	text-align: center;
}

.admin_login{
	width:300px;
	border:1px solid #ccc;
	padding:15px;
	position:absolute;
	left:50%;
	top:50%;
	margin:-100px 0 0 -150px;
}
.open_form {
	cursor:pointer;
	text-align:center;
	margin-bottom: 10px;
	border: solid 1px #CCCCCC;
	padding: 4px;
	outline: 0;
	font-family: Verdana;
	width: 200px;
	background: #E0E0F3;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}
.open_form:hover, button:hover {
	color:#ffe;
	background: #009494;
}
button {
	border: solid 1px #CCCCCC;
	padding: 4px;
	outline: 0;
	font: Verdana, Geneva, sans-serif;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	width: auto;
	background-color: #E5E5F8;
}

#add_mes {
	z-index:100;
	border: 1px solid #074775;
	padding:10px;
	margin-top:200px;
	margin-left:300px;
	width:270px;
	height:50px;
	position:absolute;
    font-style: italic;
    font-size:25px;
	text-align:center;
	background-image:url(images/loading11.gif);
	background-position:bottom center;
	background-repeat:no-repeat;
	background-color:#ffffff;
}
.blink {
    -webkit-animation: blink 3s linear infinite;
    animation: blink 3s linear infinite;
}
@-webkit-keyframes blink{
    0% {color: rgba(100,0,200,1);}
    50% {color: rgba(100,0,200,0);}
    100% {color: rgba(100,0,200,1);}
}
@keyframes blink {
  0% {color:rgba(100,0,200,1);}
  50% {color:rgba(100,0,200,0);}
  100% {color:rgba(100,0,200,1);}
}