body {
	font-family:"Roboto";
	font-size:1.3em;
	margin:0;
	line-height:1.5;
	box-sizing: border-box;
}
@media (max-width : 570px ){
	body { font-size:1.0em}}
a { text-decoration:none; color:inherit}
img {max-width:100%}
h1 { color:#E70E07; margin: 20px;font-family:"Montserrat-SemiBold";}
h2 { color:#E70E07; margin:50px auto;font-family:"Montserrat-SemiBold"; text-align:center; border-bottom:1px solid #E70E07; display:table;
}
.head {
	width:100%;
	display:flex;
	text-align:center
}
.logotip {
	display:inline-block;
	background:#E70E07;
	color:#ffffff;
	box-sizing:border-box;
	padding:15px;
	font-size:0.7em;
	font-family:"Montserrat-SemiBold"
}
@media (max-width : 570px ){
	.logotip { display:none}}
.items {
	display:inline-block;
	text-align:center;
	vertical-align:top;
	margin:auto
}
.spisok {
	display:inline-block;
	font-weight:bold;
	margin:10px;
	vertical-align: middle
}
.spisok ul {margin:0px 5px; padding:5px 0}

.spisok li { display:inline-block; margin:0 10px ; text-align:center; font-size:0.9em}
.spisok a:hover {color:#E70E07}
.zamer {
	display:inline-block;
	font-size:0.6em;
	font-weight:bold;
	margin:10px;
	vertical-align:top
}
.zamer1 {
	display:inline-block;
	margin:10px;
	text-align:center;
	background:#E70E07;
	color:#FFFFFF;
	box-sizing:border-box;
	padding:15px;
	border-radius:3px
}
.zamer2 {
	display:inline-block;
	margin:10px;
	text-align:center;
	background:#E70E07;
	color:#FFFFFF;
	box-sizing:border-box;
	padding:15px;
	border-radius:3px
}
 .zamer1:hover, .zamer2:hover{
    background: #FF0B0F;
}
.phone {
	display:inline-block;
	margin:10px;
	font-family:"Roboto Bold";
	vertical-align:middle;
	color:#3c3c3b;
}
.phone span {
	color:#E70E07
}
.items span {
	color:#E70E07
}
.time {
	font-size:0.7em;
    font-family:"Roboto";
}
.main {
	width:100%;
	display:flex;
	background-image:url(img/bg2.jpg);
	background-repeat:no-repeat;
	background-size:100%;
}
.logotip2 {
	display:inline-block;
	background:#FFFFFF;
	color:#E70E07;
	box-sizing:border-box;
	padding:5px;
	font-size:0.7em;
	font-family:"Montserrat-SemiBold"
}
.logotip2:before {
  content: '';
  display: inline-block;
  height: 100%;
  vertical-align: middle;
}
.logotip2 span {display: inline-block; vertical-align:middle}
@media (max-width : 570px ){
	.logotip2 { display:none}}
.logo {width:66px}
.items2 {
	display:inline-block;
	text-align:center;
	margin:auto
}
.first-block {
	display:inline-block;
	text-align:left;
	padding-top:3%;
	margin:20px 30px;
	margin-left:0
}
.goroda {
	background:rgba(255,255,255,0.70);
	box-sizing:border-box;;
	padding:5px 10px;
	font-size:1.1em;
	text-align:center
}
.goroda-text {display:inline-block; text-align:left; margin:5px; vertical-align: middle; }
.goroda span { color:#E70E07}
.goroda-map { display:inline-block; margin:0 10px; vertical-align:middle; text-align:center}
.goroda-map img {width:190px;}

.second-block {
	display:inline-block;
	background-image:url(img/bg-calc.png); 
	text-align:center;
	box-sizing:border-box;
	padding:10px;
	margin:30px 10px;
	color:#E70E07;
	vertical-align:top;
	text-shadow:0 1px #000000
}
.zamer3 {
	margin:10px;
	text-align:center;
	background:#E70E07;
	color:#FFFFFF;
	box-sizing:border-box;
	padding:15px
}
.second-block span {
	font-size:0.85em;
	color:#fff;
	font-weight:normal
}
.main2, .zamershik, .okna {
	width:100%;
	display:flex;
}

@media (max-width : 670px ){
.zamershik { display: inline-block}}
.pic {vertical-align:middle; margin-bottom:-8px}
.zamershik2 {
    text-align:left;
	font-family:"Roboto";
	margin:auto;
	padding:10px;
	box-sizing:border-box;
	vertical-align:middle;
}

.zamershik2 h3 { background:#E70E07; font-size:1.1em; color:#fff;padding:5px 30px; box-sizing:border-box; margin-bottom:40px}
.zamershik2 p { border-bottom:1px solid #E70E07; padding-bottom:10px; font-weight:bold}
.zamershik2 span { font-size:0.8em; font-weight:normal}
.kvadrat { width:25px; vertical-align:middle; display:inline-block}
.knopka {
	display:table;
	margin:50px auto 0;
	background:#E70E07;
	color:#fff;
	padding:5px 50px;
	font-size:0.8em;
	font-family:"Roboto Bold";
	border-radius:3px
}
 .knopka:hover{
    background: #FF0B0F;
}
.okna {
	width:100%;
	display:flex;
	background-color:#f3f4f5;
}
.okna1 {
	display:inline-block;
	text-align:center;
	margin:40px auto;
}
.okna1-text {
	text-align:left;
	padding:25px;
	padding-bottom:50px;
	margin-left:auto;
	box-sizing:border-box;
	color:#000;
	background:#fff;
	box-shadow:0 0 10px #CCCCCC;
}
 .okna1-text li {color:#E70E07}
.okna1-text li span {
  color:#000;
}
.okna1-text h4 {color:#E70E07}
.cena {
	display:inline-block;
	width:270px;
	background:#fff;
	margin:40px 5px;
	font-family:"Roboto Bold";
	box-shadow:0 0 10px #CCCCCC;
}
	.cena span {
	color:#E70E07
}
.cena p { border-bottom:2px solid #E70E07; display:table; margin:20px auto}
.phone2 {
	margin:40px auto;
	text-align:center;
	padding:5px 10px;
	box-sizing:border-box
}
.phone2 p {
	color:#E70E07; font-family:"Montserrat-SemiBold";
}
.profil {
	width:100%;
	display:flex;
}
.profil1 {
	display:inline-block;
	text-align:center;
	margin:40px auto
}
.steklo {
	display:inline-block;
	padding:10px;
	box-sizing:border-box;
	vertical-align:middle;
	font-size:0.9em
}
.steklopaket {float:right; margin:0 0px 20px 20px}
.steklo-text:before {
  content: '';
  display: inline-block;
  height: 100%;
  vertical-align: middle;
}
 .steklo li {color:#E70E07}
.steklo li span {
  color:#000;
}
.rassrochka {
	display:flex;
	font-family:"Montserrat-SemiBold";
	border-top:2px solid #E70E07;
	border-bottom:2px solid #E70E07;
	margin-top:2px
}
@media (max-width : 870px ){
.rassrochka { display: inline-block; text-align:center}}
.rassrochka1 {
	display:inline-block;
	background:#E70E07;
	color:#fff;
	font-size:2.4em;
	padding:5px;
	
}
.rassrochka1-text { border:1px solid #fff; padding:35px }
@media (max-width : 370px ){
.rassrochka1 { font-size:2.0em}}
.rassrochka2 {
	display:inline-block;
	font-size:1.1em;
	line-height:1.0;
	margin:20px;
	vertical-align:middle;
	text-align:center;
	
}
.rassrochka3 span { font-size:2.0em; color:#E70E07}
.rassrochka3 {
	display:inline-block;
	text-align:center;
	margin:auto
}
.six {
	width:100%;
    display:table;
    padding:40px 0;
	text-align:center;
	margin:0
}
.six1 {
	display:inline-block;
	margin:5px;
	text-align:center;
	width:240px;
	box-shadow:0 0 10px #CCCCCC;
	vertical-align:top
}
.six1 p {margin:15px auto; font-size:1.2em; font-weight:bold; padding:0 5px }
.balkon {
	text-align:center;
	background-color:#f3f4f5;
	padding:30px 0
}

.balkon h3 { color:#E70E07; margin: 20px;font-family:"Montserrat-SemiBold";}
.balkon ul { text-align:left; margin:10px 20%}
@media (max-width : 670px ){
.balkon ul { margin:10px 5%}}
.balkon li {color:#E70E07}
.balkon li span {
  color:#000;
}
.balkon1 {
	background:url(img/balkon1.jpg);
	display:inline-block;
	width:45%;
	margin:20px auto;
	max-width:450px
}
@media (max-width : 767px ){
.balkon1 { width:100%}}
.holod {
	background:url(img/bg-calc.png);
	color:#fff;
	padding:20px;
	box-sizing:border-box;
	font-family:"Montserrat-SemiBold";
	text-align:left
}
.holod img { width:50px; vertical-align:middle}
.holod-name, .holod-price { display:inline-block; vertical-align:middle}
.holod-name {color:#ffff00;}
.holod-price { float:right; background:#E70E07; padding:10px 5px; box-sizing:border-box }
.holod2 {
	background:url(img/bg-calc.png);
	color:#ffff00;
	margin-top:290px;
	padding:20px;
	text-shadow:0 1px #000000
}
.balkon2 {
	background:url(img/balkon2.jpg);
	background-size:100%;
	display:inline-block;
	width:45%;
	margin:20px auto;
	max-width:450px
}
@media (max-width : 767px ){
.balkon2 { width:100%}}
.doors {
	margin:90px 0 0 0;
	padding:10px 0 90px 0;
}
.elporta {
	border:2px solid #000; border-radius:2px; padding:3px; width:150px; margin-bottom:20px}
.doors-text {
	margin:5%
}
.doors-text ul { margin: 5%}
.doors-text li {color:#E70E07}
.doors-text li span {
  color:#000;
}
.meneger { display:table; text-align:center; padding:1% 1% 0; font-weight:bold}
.meneger img { }
.six2 {
	display:inline-block;
	margin:20px 5px;
	text-align:center;
	width:240px;
	vertical-align:top
}
.six2 p {margin:15px auto; font-weight:bold;}
.icon2 { width:100px}
.last {
	border-bottom:2px solid #E70E07;
	text-align:center;
	font-size:1.5em;
	color:#E70E07;
	font-family:'Oswald', sans-serif;
	margin-bottom:1px;
	padding-bottom:10px}
.footer{
	background:#E70E07;
	color:#fff;
	text-align:center;
	margin:0;
	font-size:0.75em;
	padding:5px;
	border-top:1px solid #fff
}

@font-face {
			font-family:"Roboto"; 
			src: url(fonts/roboto/Roboto-Regular.ttf)
}
@font-face { 
			font-family:"Roboto Bold";
			src:url(fonts/roboto/Roboto-Bold.ttf) 
}
@font-face { 
			font-family:"Montserrat";
			src: url(fonts/Montserrat-Regular.eot);
			src:url(fonts/Montserrat-Regular.ttf)
}
@font-face { 
			font-family:"Montserrat-SemiBold";
			src:url(fonts/Montserrat-SemiBold.eot);
			src:url(fonts/Montserrat-SemiBold.ttf)
}

/* форма обратной связи */
.overlay {
    top: 0;
    right:0;
    bottom:0;
    left: 0;
    z-index: 10;
    display: none;
    background-color: rgba(0, 0, 0, 0.50) ; /* фон затемнения */
    position: fixed; /* фиксированное поцизионирование */
    cursor: default; /* тип курсара */
}
/* активируем слой затемнения */
.overlay:target {
    display: block;
}
/* стили модального окна */
.popup {
	top: -50%;
    right: 0;
    left: 50%;
	text-align:center;
    z-index: 20;
    background-color:#f3f4f5;
    position:fixed; 
	width: 300px;
	border-radius: 5px;
    box-shadow: 0 15px 20px rgba(0,0,0,.22),0 19px 60px rgba(0,0,0,.3);
    -webkit-transform: translate(-50%, -500%);
    -ms-transform: translate(-50%, -500%);
    -o-transform: translate(-50%, -500%);
    transform: translate(-50%, -500%);
    -webkit-transition: -webkit-transform 0.6s ease-out;
    -moz-transition: -moz-transform 0.6s ease-out;
    -o-transition: -o-transform 0.6s ease-out;
    transition: transform 0.6s ease-out;
}

/* активируем модальный блок */
.overlay:target+.popup {
      -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    -o-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    top: 20%;
}
@media (max-width : 767px ){
	.overlay:target+.popup {
	top: 5%;}}
	
	 .form{
        width: 270px;
        margin: 10px auto 20px;
		text-align:center
    }
    #messegeResult{
        border-radius: 5px;
        height: 100px;
        width: 270px;
        background:#E70E07;
		margin:auto;
        margin-bottom: 40px;
		text-align: center;
    }
        #messegeResult p{
            color: #fff;
            font: 16px 'PT Sans', sans-serif;
            padding: 30px 20px;
            
        }
    #formMain{
        width: 270px;
		text-align:center
    }

        #formMain input{
            height: 50px;
            border-radius: 25px;
            font: 14px 'PT Sans', sans-serif;
			border: 1px solid #E70E07;
        }

        #name{
            width: 210px;
            margin-bottom: 20px;
            padding-left: 60px;
			color: #2e363f;
        }
        #telephone{
            width: 210px;
            margin-bottom: 20px;
			color: #2e363f;
			text-align:center
        }
        #button{
            width: 240px;
			margin:auto;
            font-size: 16px !important;
            cursor: pointer;
            background: #E70E07; /* Old browsers */
            box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.40);
			color:#fff
        }
            #button:hover{
                background: #DB0003; /* Old browsers */
            }
.close {
    top: 0px;
    right: -3px;
    width: 24px;
    height: 24px;
    position: absolute;
    padding: 0;
    text-align: center;
	border:none
}
.close:before {
    color:#222;
    content: "X";
    font-size: 14px;
	border:none;
	font-family:"Montserrat";
}