* {padding: 0; margin: 0; box-sizing: border-box; border: 0 none; outline: 0 none; font-weight: normal; font-style: normal}
html, body {height: 100%}
body {font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; font-size: 100%; background-color: #f8f8f8; position: relative}

.scr-lim {max-width: 1200px; min-width: 340px; margin: 0 auto; padding: 0 10px}
.inline {display: inline-block}
.table {display: table; border-collapse: collapse;}
.table .tr {display: table-row}
.table .td {display: table-cell; vertical-align: middle}
.table .th {background-color: #e5e5e5;}
a {text-decoration: underline; color: #0d44a0; cursor: pointer}
a:hover {color: #f89752;}
/*.hl ?*/
.clear {clear: both;}
.focus {border-color: #008dcf !important}
.ps-link {border-bottom: 1px dotted #0d44a0; color: #0d44a0; cursor: pointer}

#header {padding: 10px 10px}
#header .table {width: 100%}
.logo img {max-width: 100%;height: auto;}
#header .phones {text-align: right;}
#header .phones div {font-size: 1.6em}
#header .phones i {font-size: 0.6em}
#header .phones .yp-2, #header .phones span {color: #3079ed}
#header .worktime, #header .phones span {text-align: right; font-size: 0.8em}

#nav {position: relative; background-color: #555; height: 46px;}
#nav ul {}
#nav li {display: inline-block;}
#nav li a {color: #fff; text-decoration: none; display: block; padding: 15px 10px; font-size: 0.9em;}
#nav li a:hover {color: #424242; background-color: #fdbe56;}
#nav .ico-menu {width: 22px; cursor: pointer; display: none; margin: 0 5px 0 20px; padding: 14px 0 0 0}
#nav .ico-menu i {display: block; font-size: 0; height: 4px; background-color: #fff;}
#nav .ico-menu i:nth-of-type(2) {margin: 3px 0}
#nav .ico-menu:hover i {background-color: #fdbe56;}
#nav .nm-s {background-color: #555; display: block !important; left: 0; position: absolute; z-index: 100; width: 210px}

#work-area {margin: 20px 0 0 0; width: 100%; position: relative;}
#work-area .inline {vertical-align: top}

#left-column, #right-column {width: 240px; vertical-align: top}
.lc-show {position: absolute; top: 0; left: 0; z-index: 100}

#model-search {margin: 0 0 20px 0; background-color: #f8f8f8}
#model-search input {padding: 0 6px}
#model-search .input {height: 35px; border: 1px solid #c4c4c4; border-radius: 3px 0 0 3px}
#model-search .input:focus {border-color: #008dcf}
#model-search .submit {height: 35px; border-radius: 0 3px 3px 0; cursor: pointer; color: #fff; font-size: 0.8em; font-weight: bold; background-color: #4d90fe;}
#model-search .submit:hover {text-shadow: 1px 1px #252525; background-color: #3079ed}

#brand-list {margin: 0 0 20px 0; border: 1px solid #c4c4c4/*#424242*/; background-color: #f8f8f8}
#brand-list .title {background-color: #c4c4c4; text-align: center; padding: 8px 0; color: #444; font-size: 1.3em}
#brand-list .brand-title {border-bottom: 1px dotted #c4c4c4; padding: 10px 10px; font-size: 1.1em; color: #444;}
#brand-list .img {display: inline-block; text-align: center; margin: 0 20px 0 0; width: 70px; overflow: hidden; opacity: 0.6; vertical-align: middle}
#brand-list .img img {max-width: 100%; max-height: 30px}
#brand-list a {color: #424242; vertical-align: middle}
#brand-list a:hover {color: #f89752}
#brand-list .brand-title .current {color: #f89752;}
/*.nav_list:last-child { border-bottom: 0; }*/
#brand-button {background-image: linear-gradient(center top , #f5f5f5, #f1f1f1); background-color: #f5f5f5; border: 1px solid #dcdcdc; border-radius: 3px; padding: 6px 12px; display: none; /*font-size: 0.9em; color: #3079ed; cursor: pointer;*/ margin: 10px 0 0 0}
#brand-button:after {content: ""; display: inline-block; margin: 0 0 0 10px; vertical-align: middle; border-color: #777 transparent; border-style: solid; border-width: 5px 5px 0; height: 0; width: 0;}
#brand-button span:hover {color: #f89752}
#brand-button span {font-weight: bold;}

#content {overflow: hidden; vertical-align: top}
#content .b {padding: 0 0 20px 20px}
#content .b p {padding: 8px 0; line-height: 1.5em; text-align: left !important}
#content .b p img {max-width: 100%; height: auto}
#content .b ul {margin: 0 0 0 20px}
#content .b table {border-collapse: collapse;}
#content .b table p {padding: 0}
#content .b table td {border: 1px solid #e4e4e4; padding: 6px 10px; width: auto !important}

h1, #info-pg-title {color: #444; font-size: 1.5em;}
h1, h2, h3, h4, h5, h6 {margin: 30px 0 10px;}
h1 {margin: 0 0 1.3em 0; /*padding: 0 0 5px 0;*/}
h2, h3, h4, h5, h6 { font-size: 1.3em; }
h5, h6 {font-size: 1em;}

.device {display: inline-block; text-align: center; margin: 0 12px 20px 0; width: 216px; overflow: hidden; position: relative; padding: 32px 8px 8px 8px; background-color: #fff; border: 1px solid #e4e4e4; vertical-align: top}
.device .title {font-weight: bold; font-size: 13px; padding: 6px; position: absolute; z-index: 10; top: 0; left: 0; width: 100%; background-color: #ffffff}
.device img {max-width: 100%; height: auto}
.device .price {padding: 6px 0 0 0; font-size: 1.2em; color: #dd4b39}

.img-inside {float: left; margin: 0 20px 10px 0}
#device_text {}

#brand-img-block {padding-top: 20px}
.brand-img {display: inline-block; height: 70px; margin: 0 30px 30px 0}
.brand-img img {max-width: 100%; max-height: 70px}

#down {}
#down .scr-lim {border-top: 1px solid #e4e4e4; padding: 20px 10px; }
#copy {font-size: 0.9em; color: #999999;}
#contact {float: right; font-family: Arial, 'Times New Roman', sans-serif; color: #333333; text-align: right;}
#phone {font-size: 24px; padding-bottom: 5px}
#counter {position: absolute; z-index: 10; right: 10px; top: 5px;}

.check-status input {padding: 0 6px}
#status-value {height: 35px; border: 1px solid #c4c4c4; border-radius: 3px 0 0 3px}
#status-value:focus {border-color: #008dcf}
.check-status .submit {height: 35px; border-radius: 0 3px 3px 0; cursor: pointer; color: #fff; text-shadow: 0 0 transparent; font-size: 13px; font-weight: bold; background-color: #4d90fe; overflow: hidden; text-indent: -27px}
.check-status .submit:hover {text-shadow: 1px 1px #252525; background-color: #3079ed}

/*
.onlineorder {position: absolute; top: 0; right: 0; height: 50px; width: 236px; cursor: pointer; background-image: url('pic/order.png'); background-size: 245px auto; background-position: 0 -75px;}
.onlineorder span {display: block; padding: 14px 12px 0 0; text-align: right; font-size: 15px; font-weight: bold; color: #fff;}
.onlineorder:hover {text-shadow: 1px 1px #252525;}
*/
.onlineorder {position: absolute; top: 5px; right: 10px; height: 36px; cursor: pointer; background-repeat: no-repeat; background-color: #4d90fe; border-radius: 5px; border: 1px solid #3079ed; padding: 3px 16px 0 16px;}
.onlineorder span {color: #fff; font-size: 17px; font-weight: bold; display: block; vertical-align: middle;}
.onlineorder span:before {content: ""; height: 28px; width: 28px; display: inline-block; background-image: url('pic/icons.png'); background-position: -4px -157px; background-size: 36px auto; background-color: #fff; border-radius: 50%; vertical-align: middle; margin: 0 5px 0 0}
.onlineorder:hover {text-shadow: 1px 1px #252525; background-color: #3079ed}

#vk_comments {padding: 20px 0 0 0; max-width: 500px !important}
#back {padding-bottom: 30px}

/*======= Notice ====*/
.note-list-block {border: 1px solid #c4c4c4; margin-bottom: 20px}
.note-list-block > .title {background-color: #c4c4c4; text-align: center; padding: 8px 0; color: #444; font-size: 1.3em}

.note-list-block .note {font-size: 0.9em; padding: 10px; border-bottom: 1px dotted #c4c4c4;}
.note-list-block .note .title {font-weight: bold;  color: #444}
.note-list-block .note .text {padding-top: 10px;}
.note-list-block .note p {line-height: 1.3em}

.moreevents {display: block; padding: 10px 0; text-align: center;}
.note-list-block .sticked {position: relative;}
.note-list-block .sticked:after {content: ''; position: absolute;top: 50%;right: -20px;margin-top: -20px; height: 40px; width: 40px;background: url('pic/icons.png') 0 -335px no-repeat;}

/* --- modal window --- */
#popup-w {display:none; position: absolute; top:0; left:0; z-index:999; width: 100%; height:100%; background-color: rgba(0, 0, 0, 0.8);}
.show-pw {display: table !important}
.m-overlay {width: 100%; height: 100%; vertical-align: middle; display: table-cell}
.m-window {max-width: 620px; min-width: 340px; margin: 0 auto; padding: 0; box-shadow: 0 0 10px rgba(0,0,0,0.8); border-radius: 5px; background-color: #fff; position: relative}
.m-window .title {background: #fabf55; background: linear-gradient(to bottom,  #fabf55 0%,#f89935 100%); color:#424242; text-shadow: 1px 1px rgba(255,255,255,0.35); font-weight: bold; text-transform: uppercase; padding: 10px 0; border-radius: 5px 5px 0 0; text-align: center; font-size: 1.2em}
.m-close {position:absolute; top: 0; right: 20px; font-size: 1.6em; font-weight:bold; cursor:pointer; text-shadow: 1px 1px rgba(255,255,255,0.35);}
.m-close:hover{color:#fff;text-shadow:1px 1px transparent;}
.m-content {}
.m-content .b1 {padding: 20px; position: relative}
.m-content form {}

.m-content .inputitem {position: relative; border: 1px solid #c4c4c4; max-width: 270px; margin-bottom: 20px;}
.m-content .inputitem input {color: #424242; width: 100%; padding: 0 10px 0 48px; height: 38px;}
.m-content .inputitem .icon {display: block; position: absolute; top: 0; left: 0; z-index: 100; height: 38px; width: 38px; background-image: url('pic/icons.png'); background-repeat: no-repeat;}
.m-content .textareaitem {position: absolute; top: 20px; right: 20px;}
.m-content .textareaitem .f-title {color: #333; font-size: 0.8em; padding: 10px 0 0 48px}
.textareaitem textarea {color: #424242; padding: 10px 10px 10px 10px; height: 130px; width: 270px;}

.m-content .pic-code {}
.m-content .pic-code input {height: 28px; border: 1px solid #c4c4c4; width: 100px; padding: 4px 10px}
.m-content .pic-code * {vertical-align: middle}

.ii6 .icon { background-position: 0 -50px; }
.ii7 .icon { background-position: 0 -90px; }
.ii4 .icon { background-position: 0 -130px; }
.ii8 .icon { background-position: 0 -170px; }

.m-content .discoun {background: url('pic/discount.jpg') 130% 10px no-repeat #424242; padding: 10px 20px;}
.m-content .discoun p.checkbox {margin-bottom: 20px; font-style: italic; color: #fff; cursor: pointer;}
.m-content .discoun h3 {color: #f6a649; font-weight: bold; font-size: 1.4em; margin: 0;}
/*.m-content .discoun h3 em {font-weight:normal;font-size: 18px; display: block}*/
.m-content .discoun ul {list-style: none;margin: 20px 0 0 30px;}

.m-content .fc-icon {float: left; margin-right: 10px; height: 30px; width: 30px; background: url('pic/icons.png') -10px -256px no-repeat;}
.m-content .cheked .fc-icon {background-position: -10px -216px; }

.m-content .iconli {color: #fff; font-size: 18px; padding: 0 0 20px 0; position: relative;}
.m-content .iconli em {padding-top: 5px; display: block; font-size: 13px; font-style: italic; color: #b2b2b2; text-shadow: 1px 1px #313131;}
.m-content .iconli:after {content: ''; position: absolute; top: 0; left: -30px; height: 20px; width: 20px; background: url('pic/icons.png') 0 -290px no-repeat;}
.m-content .li2:after {background-position: -20px -290px;}

.m-content .fsubm {padding: 10px 0; text-align: center}
.m-content .fsubm input {background: #fabf55; background: linear-gradient(to bottom,  #fabf55 0%,#f89935 100%); color:#424242; padding: 10px 20px; font-size: 1.4em; border-radius: 5px; cursor: pointer}
.m-content .fsubm input:hover {color: #fff}
.m-content .info span {display: block; padding: 10px 20px; font-weight: bold}
.m-content .good {background-color: green; color: #000}
.m-content .error {background-color: red; color: #fff}

#res-check-status {padding: 40px}

/* --------------------------------------------------------------------- */
@media (max-width: 1200px) {
     .device {margin: 0 30px 20px 30px}
}
@media (max-width: 1120px) {
     .device {margin: 0 25px 20px 25px}
}
@media (max-width: 1080px) {
     #header .worktime {display: none}
     .device {margin: 0 8px 20px 8px}
}
@media (max-width: 980px) {
     #right-column, #nav .nm-6, #nav .nm-7, #nav .nm-8, #nav .nm-9 {display: none}
	 #nav .ico-menu {display: inline-block}
     .device {margin: 0 30px 20px 30px}
}
@media (max-width: 840px) {
     #header .logo img {max-width: 200px}
	 #header .phones div {font-size: 1.2em}
	 #header .phones i {font-size: 0.8em}
	 #left-column, #nav .nm-5 {display: none}
	 #content {}
	 #content .b {padding: 0 0 20px 0}
	 #brand-button {display: inline-block}
     .device {margin: 0 16px 20px 16px}
}
@media (max-width: 770px) {
     .device {margin: 0 8px 20px 8px}
}
@media (max-width: 700px) {
     #header .logo img {max-width: 150px}
	 #nav .nm-3 {display: none}
	 #header .phones div {font-size: 1em}
	 #status-value {width: 120px}
     .device {margin: 0 35px 20px 35px}
}
@media (max-width: 600px) {
     .m-content .discoun {background-image: none}
	 .m-content .inputitem {width: 240px}
	 #header .check-status .submit {width: 80px}
	 #nav .nm-4 {display: none}
     .device {margin: 0 18px 20px 18px}
	 #content .img-inside {width: 160px}
	 #content h1 {font-size: 1.1em;}
}
@media (max-width: 530px) {
	.m-content .textareaitem {position: relative; top: auto; right: auto}
	 .m-content .inputitem {width: 300px}
	#header .phones {display: none}
     .device {margin: 0 10px 20px 0}
/*
	 #header .phones .ya-phone {display: inline-block}
	 #header .check-status {display: none}
	 #header .phones span {display: block}
	 #header .phones .yp-1 {padding: 0 10px 0 0}
	 #header .phones .yp-1:after {content: ","}
	 #header .phones i {font-size: 1em}
*/
}
@media (max-width: 480px) {
	 #nav .nm-2 {display: none}
	 .m-window .title {font-size: 0.9em}
     .device {width: 188px; margin: 0 8px 20px 0}
	 #content .img-inside {width: 120px}
}
@media (max-width: 415px) {
	 /*#nav .nm-1 {display: none}*/
	 .m-content .pic-code span {display: block}
     .device {width: 216px; margin: 0 auto 20px auto; display: block;}
}
@media (max-width: 395px) {
	 /*#nav .nm-3 {display: none}*/
	 #header .check-status .submit {text-indent: 0; width: 20px}
}