@import url(reset.css);
@media all{
	body, html{background: fixed url(../img/main-bg.jpg) no-repeat  center center; background-size: cover; height:100%; width:100%; color:#444444;}
	p, h2, .subHeading {word-wrap: break-word;}
	p span, .dang{font-weight: bold;font-size: 22px;font-style: italic; word-wrap: break-word;}
	ul li p{text-indent: 10px;}
	.dang {color: #FD6347;}
    .clear{ clear: both; }
	p { font-size: 20px; text-indent: 25px; }	
	h1{font:60px Arial, Helvetica, sans-serif;margin:0 0 10px;text-align:center;color:#000;text-shadow:1px 1px 1px #fff; }
	h2 {font:44px Arial, Helvetica, sans-serif; color:#fff;text-align:center;margin:0 0 20px;text-shadow:2px 2px 2px #000;}
	h3 {font:27px Arial, Helvetica, sans-serif; color:#534848; text-indent:20px; margin:0 0 7px; text-shadow:2px 2px 2px #7E8794;}
	h4 {font:30px Arial, Helvetica, sans-serif; color:#fff; margin:0 0 8px; text-align:center; text-shadow:1px 1px 1px #000;}
	h5 {font:24px Arial, Helvetica, sans-serif; color:#fff; text-indent:20px; margin:0 0 7px; text-shadow:2px 2px 2px #000;}
    .subHeading{display:block; font:38px Arial, Helvetica, sans-serif; margin:20px 0 50px; text-align:center; color:#fff; text-shadow:2px 2px 2px #000; border-radius:5px; box-shadow:5px 10px 15px #000;}
	.center {max-width:960px;width:100%;margin:0 auto;}
	#wrapper {width:100%;  min-height:100%; height:auto; position:relative;}
	#service .center .part, #shop .center .part {background-color: rgba(234,234,234, 0.8); border-radius: 10px;}
	#installation .center .part, #repair .center .part{background:rgba(126,135,148, 0.8); border-radius: 10px;}
/* ------------------------------------- table  -----------------------------------*/
	table { width: 100%; border: 1px; border-color: #000; border-collapse: separate; border-spacing: 1px; border-style: inset; margin:10px auto;}
	td, th {height: 50px; padding:5px; vertical-align:middle; border:1px solid #000; word-wrap:break-word;}
	table p{ word-wrap:break-word; text-indent: 1px;}
    .w1 {width: 80%;}
    .w2 {width: 20%;}
	.w3 {width: 35%;}
	.w4 {width: 13%;}
/* ---------------------------------- /table  -----------------------------------*/
/* -------------------------------------- header ----------------------------- */
	#header{ display:block; position:fixed; z-index:100; left:0; top:0; height:49px; width:100%; overflow:hidden; padding:14px 0 18px; background-color:rgba(8,41,78, 0.9); box-shadow:inset 0 -20px 20px -20px #000;}
	#content{padding:82px 0 95px;}
	#mini-mainNav{display: none;}
	#mainNav{display:block;text-align:center;}
	#mainNav li{display:inline-block;margin:0 2px;}
	#mainNav a, #mini-mainNav a{color:#fff;position:relative;display:inline-block;padding:4px 21px;text-decoration:none;text-shadow: 1px 1px #000;font:20px bold Tahoma;line-height:40px;background:#2d3239;background-image: linear-gradient(to top, #414852 0%, #606a78 100%);box-shadow: inset 0 2px 3px #000, 0 1px 3px #000;border-radius: 25px;border: 2px solid #434343;}
    #mainNav a:hover , #mainNav li.activePage a {background-image: linear-gradient(to bottom, #19325A 0%, #7b91b1 100%);box-shadow: inset 0 1px 1px #000, 0 -1px 1px #000;border: 2px solid #434343;}
/* ------------------------------------- /header ------------------------------- */
/* --------------------------------------- Главная main ----------------------- */
	#main{display:block; width:100%; padding:24px 0;}
	#main .center .akciya{background-color: rgba(234,234,234, 0.7); border-radius: 10px;}
	#main h5 {color:#000; text-shadow:1px 1px 1px #fff; font-weight:bold;font-style: italic;}
	#main .main-img img{max-width:30%;}
	.tel {text-align: center;margin-bottom: 25px;}
	.tel a{text-decoration: none;font: 50px bold Tahoma;color: red;text-shadow: 2px 2px 2px #000 ;background: #eaeaea;box-shadow: 5px 10px 15px #000;padding: 5px;border-radius: 10px;}
	.akciya h3{text-align:center; color:red; font-size: 42px; font-weight:bold;}
	.akciya p{text-align:center;color:red;font-style: italic;font-size:35px; font-weight:bold; text-shadow:1px 1px 1px #000;}
/* ---------------------------------------- /Главная main -------------------------------- */
/* -------------------------------------- mobilyslider -----------------------------------------------*/
.slider { width:500px; height:200px; position:relative; margin: 1px auto 15px; box-shadow: 5px 10px 15px #000; }
.sliderContent { width:500px; height:200px; position:relative; overflow:hidden; }
.sliderArrows a { display:block; text-indent:-9999px; outline:none; z-index:50; background-image:url(../img/gfx/prev_next.png); width:42px; height:42px; position:absolute; top:50%; margin-top:-34px;}
.prev { background-position:0 0; left:15px; }
.prev:hover { background-position:0 -44px; }
.next { right:15px; background-position:-44px 0; }
.next:hover { background-position:-44px -44px; }
.sliderContent .item { position:absolute; width:500px; height:200px; background:#fff; }
.sliderContent .item img{ width:97%; height:85%; margin: 5px; border: 1px solid grey; border-radius: 5px; }
.sliderBullets { position:absolute; bottom:0; z-index:50; margin: 5px; }
.sliderBullets a { display:block; float:left; text-indent:-9999px; outline:none; margin-left:5px; width:10px; height:11px; background:url(../img/gfx/bullets.png) no-repeat; }
.sliderBullets .active { background-position:0 -11px; }
.sliderContent a { outline:none; }
/* ---------------------- /mobilyslider ----------------------------------------------*/
/*-------------------- установка installation + ремонт repair + contactUs--------------------*/
	#installation, #repair, #contactUs {width:100%; padding:30px 0 0; color:#fff;}
	#installation p span {font-style: italic;}
	.num {list-style-type: decimal;margin: 5px 0 5px 25px;}
	.num li {font-size: 26px;}
	.num ul li {font-size: 20px;}
	#installation ul, #service ul, #repair ul  {font:20px Arial, Helvetica, sans-serif;margin: 5px 0 5px 10px;list-style-type: disc; padding-left:10px;}
	#installation p, #repair p {text-shadow: 1px 1px 1px #000;}
	.part{display: block; padding:10px 2px; width:100%; height:auto; margin:0 0 30px; border-bottom:2px solid #505a68;  border-top:2px solid #505a68; border-radius: 10px; }
	.partImg, .forBigImg {padding:1px;background:#fff;border:4px solid #646E7D;border-radius: 5px;margin: 5px 20px 20px 0;width:200px;overflow:hidden;float: left;box-shadow: 5px 10px 15px #000;}
	.partImg img, .forBigImg img{display: block;max-width:100%;}
/*---------------------------- /installation + repair + contactUs----------------*/
/*------------------------ обслуживание service--------------------*/
	#service, #shop {height:auto;width:100%; padding:30px 0 0;}
/* ------------------------------------ /обслуживание service----------------------------------------*/
/* -------------------------------------- магазин -------------------------------------*/
	#shop .shop-price{overflow-x:scroll;} 
	.shop-price td, .shop-price th{height:auto; word-wrap:break-word; padding:1px;}
	#shop ul{list-style-type:disc; margin-left:10px;}
	#shop .shopDescription {text-align:center; margin:0 0 15px; font:bold 27px Arial, Helvetica, sans-serif; color:red; text-shadow:0px 1px 1px #000;}
	.imgCost {float: left;margin-right:20px;}
	#shop .forBigImg{float:none;}
	.shopCost{text-decoration:line-through;}
	.shopCostDiscount{text-shadow:0 1px 1px #000; font-weight:bold; color:red;}
	.forBigImg img:hover{cursor:pointer;}
/* ------------------------ /магазин -------------------------------------*/
/* --------------------------контакты----------------------------*/
	#contactUs {color:#fff;}
	#contactUs .center .part{ border:none;}
	#contactUs a{color:#00b3ac; font-size:30px; font-weight:bold; line-height:50px; text-shadow:1px 1px 1px #000;}
/* -----------------------------------------/контакты------------------------------------*/
/*-----------------------------------------наверх-----------------------------------------*/
	#toTop { width:35px; height: 35px; padding:5px; position:fixed; bottom:15px; right:10px; cursor:pointer; display:none; opacity: 1.0; z-index:10;}
	#toTop:hover {opacity: 0.7;}
/*------------------------------/наверх-------------------------*/
/*----------------------------- footer------------------------------*/
	#footer{ display:block; width:100%; overflow:hidden; padding:24px 0; line-height:16px; color:#000;  text-shadow:1px 1px 1px #fff; position:absolute; bottom:0;}
	.ya-share2{ max-width:960px; width:100%; margin:0 auto; padding: 5px; margin-bottom: 20px; }
	#footer a{color:#000;}
}
/*----------------------------------- /footer-------------------------------------------*/
/*----------------------------------- device-width -------------------------------------------*/
@media all and (max-width: 960px){
	.center{ padding:0 10px; width:auto;}
	#header{ padding:10px 0; height:49px; overflow:hidden; position:fixed;}
	#content{padding:50px 0 95px;}
}
/*----------------------------------- -------------------------------------------*/
@media all and (max-width: 820px){
	#mainNav a{ padding:4px 15px; line-height:40px; border-radius: 25px; border:2px solid #434343;}
}
/*----------------------------------- -------------------------------------------*/
@media all and (max-width: 780px){
	body{font-size:13px;}
	h1{font-size:60px;}
	.subHeading{font-size:30px;}
	#header #mainNav a{ padding:4px 10px; }
}
/*----------------------------------- -------------------------------------------*/
@media all and (max-width: 700px){
	#header #mainNav a, #mini-mainNav a, #mini-mainNav p{ color:#fff; font:22px bold Tahoma; padding:4px; background:none; background-image:none; box-shadow:none; border-radius:0; border:none; }
	h1{font-size:46px;}
	h2{font-size:40px;}
	h3{font-size:24px;}
	h4{font-size:30px;}
	#header #mainNav a:hover , #mini-mainNav a:hover ,
	#header #mainNav li.activePage a, #mini-mainNav li.activePage a { text-decoration:underline; color:#7b91b1; text-shadow:none; cursor:pointer; }
}
/*----------------------------------- -------------------------------------------*/
@media all and (max-width: 670px){
	#header #mainNav a{padding:2px;}
	.slider, .sliderContent, .sliderContent .item{ width:450px; height: 150px; padding-bottom:15px;}
}
/*----------------------------------- -------------------------------------------*/
@media all and (max-width: 504px){
	body p {font-size:16px;}
	.flex-direction-nav{display:none;}
	h1{font-size:40px;}
	h2{font-size:36px;}
	h3{font-size:22px;}
	.akciya h3{font-size:30px;}
	h4{font-size:28px;}
	.akciya p{font-size:24px;}
	.subHeading{font-size:26px;}
	#header{ height: auto;}
	.slider, .sliderContent, .sliderContent .item{ width: 400px; height:100px;}
	#mainNav{ display: none;}
	#mini-mainNav{ display: block;}
    #mini-mainNav li { display:block; width:auto; float:none; border-bottom:0; margin-bottom:0;}
    #mini-mainNav .menu-toggle { display: block;}
    #mini-mainNav .menu-toggle { line-height:20px; padding:5px; cursor:pointer;}
    #mini-mainNav ul {display:none;}
}
/*----------------------------------- -------------------------------------------*/
@media all and (max-width: 480px){
	.slider, .sliderContent, .sliderContent .item{ width: 290px; height:100px;}
}
/*----------------------------------- -------------------------------------------*/
@media all and (max-width: 360px){
	.partImg { float:none; margin:2px auto 20px auto; }
	.imgCost { float:none;}
	.forBigImg{ margin:2px auto 20px auto; }
}
/*----------------------------------- -------------------------------------------*/
@media all and (max-width: 320px){
	h1, h2 {font-size:28px;}
	h5{font-size:20px;}
	#header{ height:auto;}
	#mainNav{ display: none;}
	#mini-mainNav{ display: block;}
    #mini-mainNav li { display:block; width:auto; float:none; border-bottom:0; margin-bottom:0; }
    #mini-mainNav .menu-toggle { display: block;}
    #mini-mainNav .menu-toggle p { line-height: 20px; padding: 5px; }
    #mini-mainNav ul {display: none;}
    .slider, .sliderContent, .sliderContent .item{ width:100%; height:70px;}
	.sliderBullets a {display:none;}
	#shop #container a img, #shop #container a { width:90px;}
	#content{padding-bottom:105px;}
}
/*----------------------------------- -------------------------------------------*/
@media all and (max-width: 240px){
	.sliderBullets a {margin-left:3px;}
}