@charset "utf-8";
/* CSS Document */
body{
	font-family: 'Roboto Slab', serif!important;
}
.container-fluid{
	background: #e2e2e2;
	
}
.header-left{
	padding:  0 0 2%; 
	color: #FFFFFF;
}
.navbar-toggler{
	z-index: 2;
}
.header-left{clip-path: polygon(0 0, 100% 0%, 60% 100%, 0% 100%);
	 background: cornflowerblue;
    }
.header-left img{
	padding-top: 5%;
	padding-bottom: 5%;
	padding-left: 7%;
}
.header-left h1{
	padding-left: 7%;
	padding-bottom: 5%;
}
.header-left p{
	padding-left: 7%; 
}
.btn-zakazat{
	margin: 8% 25%;
	border: solid 1px #6495ed;
	border-radius: 25px;		
	font-size: 1.2em;
	padding: 5px 15px;

}
.navbar-nav{
	padding-top: 15px!important;
}
ul.full-width{
	width: 100%; /* Ширина основного блока меню */
	height: 50px; /* Высота основного блока меню */
	position: relative;
	display: table;
	margin: 0;
	padding: 0;
}
ul.full-width li {
	display: table-cell;
	position: relative;
	font-size: 1.4em;
}
ul.full-width li a {
	display: block;
	position: relative;
	width: 100%;
	height: 100%;
	text-align:center;
	line-height: 50px; /* Приравниваем к высоте, чтобы выровнять текст по вертикали */
}
ul.full-width li ul {
	display: none; /* Скрываем выпадающее меню */
	position: absolute;
	width: 100%;
	margin: 0px;
	padding: 0px;
}
ul.full-width li ul li {
	display: block;
}
ul.full-width li:hover ul {
	display: block; /* Показываем выпадающее меню, где оно есть, при наведении */
}
.header-form p{
	text-align: center;
	color: #FFFFFF;
}
.header-img{
	z-index: 2;
	height: auto;
}
.header-img img{
  object-fit: cover;
  width: 88%;
  height: 100%;

}
.feedback-form{
	border: solid 1px #6495ed;
	border-radius: 25px;
	padding: 25px 15px;
	background: #6495ed;
}
.header-form input{
	width: 80%;
	margin: 15px 0px;
	border: solid 1px #6495ed;
	border-radius: 25px;		
	font-size: 1.2em;
	padding: 5px 15px;
}

.form-messendger-whatsapp{

	margin-top: -10%;
}
.form-messendger-telegram{

	margin-top: -7%;
}
.form-messendger-viber{

	margin-top: -4%;
}
.form-messendger-telephon{

	margin-top: -1%;
}
.form-messendger p{
	padding-right: 20px;
}


.form-messendger{
	position: fixed;
	right: 0px;
	display: grid;
	border-radius: 25px;
}
.div-item-messendger{
	
}
.form-messendger img{
	padding: 10px;
}
.div-item-messendger{
	display: flex;
	margin-bottom: auto;
	margin-top: auto;
}
.div-item-messendger p{
	display: none;
	margin-top: revert!important;
	text-align: center;
	width: 0px;
}
.form-messendger a{
	color: #FFFFFF!important;
	text-decoration: none;
}
.form-messendger:hover > a > #div-whatsapp{
	background: #43d854;
}
.form-messendger:hover > a > #div-telegram{
	background: #29b6f6;
}
.form-messendger:hover > a > #div-viber{
	background: #59267c;
}
.form-messendger:hover > a > #div-phone{
	background: #6495ed;
}	

.form-messendger:hover > a > .div-item-messendger{
	
	border-radius: 25px 0px 0px 25px;
}
.div-item-messendger:hover > p {
    display: block;
	width: fit-content;
}
.div-item-messendger img{
	right: 0px;
}
#div-whatsapp{
	
}
#phone{
	width: 48px;
	height: 48px;
	padding: 2px 5px 2px 10px;
	margin-left: 7px;
	margin-right: 13px;
}
.my-work {
	padding-top: 100px;
	padding-bottom: 30px;
}
.about h2{
	text-align: center;
	color: #000;
	padding-bottom: 70px;
}
.about h2 span{
	font-weight: 800;
	color: #6495ed;
}
.row-prev{
	justify-content: center;
	padding-bottom: 50px!important;
}
.row-prev>div{
	padding-bottom: 50px!important;
}
.name-scheme{
	text-align: center;
	padding: 70px 0 30px 0;
}
.item-name span{
	font-weight: 800;
	color: #6495ed;
	text-transform: uppercase;
	font-size: 1.2em;
}
.item-count{
	font-weight: 800;
	color: #6495ed;
	text-transform: uppercase;
	font-size: 2.5em;
	text-align: center;
}
.item-img img{
	width: 80%;
	height: auto;
}
.item-name{
	display: block;
    position: relative;
    margin-bottom: auto;
    margin-top: auto!important;
}
.item-count{
	display: block;
    position: relative;
    margin-bottom: auto;
    margin-top: auto!important;
}
.item-name{
	display: block;
    position: relative;
    margin-bottom: auto;
    margin-top: auto!important;
}
.item-banner img{
	width: 100%;
	height: auto;
}
.item-text{
	display: block;
    position: relative;
    margin-bottom: auto;
    margin-top: auto!important;
}
.item-text h2{
	text-align: center;
	padding-bottom: 50px;
}
.blue-line{
	width: 20%!important;
	margin-left: auto;
	margin-right: auto;
	height: 1px;
	color: #6495ed;

}
.banner-text{
	padding-top: 30px;
	text-align: center;
}
.row-properties{
	border-bottom: solid 1px #6495ed;
	padding: 15px 10px;
}
.row-price{
	padding: 2px 10px;
	font-size: 1.4em;
	font-weight: 600;

}
.my-card-footer{
	background-color:#FFF!important;
	border-top: none!important;
	padding-top: 0px!important;
}
.card-footer button{
	width: 100%;
	margin: 15px 0px;
	border: solid 1px #6495ed;
	border-radius: 25px;		
	font-size: 1.2em;
	padding: 5px 50px;
	background: #6495ed;
	color: #FFFFFF;
}
.item-scheme-nonull-right{
	border-right: 2px solid #6495ed;
}
.item-scheme-nonull-left{
	border-left: 2px solid #6495ed;
	margin-left: -3px;
}
.name-item-scheme{
	display: block;
    position: relative;
    margin-bottom: auto;
    margin-top: auto!important;
	font-size: 1.4em;
	text-transform: uppercase;
	text-align: center;
}
.null-item-scheme{
	border-bottom: 1px dotted #6495ed;
}
.work-form-messendger img{
	padding: 10px;

}
.work-form-messendger{
	margin: 25px 0px;	
}
.work-div-item-messendger{
	display: flex;
	margin-bottom: auto;
	margin-top: auto;
	width: 270px;
	border-radius: 25px;
}
.work-div-item-messendger p{
	
	margin-top: revert!important;
	text-align: center;
	width: 350px;
}
.work-form-messendger a{
	color: #FFFFFF!important;
	text-decoration: none;
}
.work-form-messendger > a > #div-whatsapp{
	background: #43d854;
}
.work-form-messendger > a > #div-telegram{
	background: #29b6f6;
}
.work-form-messendger > a > #div-viber{
	background: #59267c;
}
.work-form-messendger > a > #div-phone{
	background: #6495ed;
}
.copyright{
	text-align: center;
	bottom: 0;
	margin-bottom: auto!important;
	margin-top: auto!important;
}
.website > a{
	color: #000000!important;
	text-decoration: none;
}
.website > a > div > span{
	text-align: center;
}
.website > a > div > img{
	width: 200px;
	height: auto;
	margin-left: auto;
	margin-right: auto;
}
.contact{
	text-align: center;
}

/* Модальный (фон) */
#myModal {
  display: none; /* Скрыто по умолчанию */
  position: fixed; /* Оставаться на месте */
  z-index: 3; /* Сидеть на вершине */
  left: 10%;
  top: 10%;
  width: 80%; /* Полная ширина */
  height: 70%; /* Полная высота */
  		
  overflow: auto; /* Включите прокрутку, если это необходимо */
 /* background-color: rgb(0,0,0); /* Цвет запасной вариант  */
  /*background-color: rgba(0,0,0,0.4); /*Черный с непрозрачностью */
}
.header-img-mymodal img{
	width: 300px!important;		
	height: auto;
	display: block;
	margin-left: auto;
	margin-right: auto;
}
/* Модальное содержание */
.modal-content {
  position: relative;
  background-color: #fefefe;
  margin: auto;
  padding: 0;
  border: 1px solid #888;
  width: 80%;
  box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
  -webkit-animation-name: animatetop;
  -webkit-animation-duration: 0.4s;
  animation-name: animatetop;
  animation-duration: 0.4s
}

/* Добавить анимацию */
@-webkit-keyframes animatetop {
  from {top:-300px; opacity:0} 
  to {top:0; opacity:1}
}

@keyframes animatetop {
  from {top:-300px; opacity:0}
  to {top:0; opacity:1}
}

/* Кнопка закрытия */
.close {
  color: white;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

.modal-header {
  padding: 2px 16px;
  background-color: #6495ed;
  color: white;
}

.modal-body {padding: 2px 16px;}

.modal-footer {
  padding: 2px 16px;
  background-color: #6495ed;
  color: white;
}

@media only screen and (max-width: 1200px){
	.header-left{
		clip-path: polygon(0 0, 100% 0%, 100% 100%, 0% 100%);
	}
	.header-img{
		display: none;
	}
	ul.full-width li a {
		line-height: 36px!important;
	}
	.header-left h1{
		padding-top: 12%!important;
	}
	.form-messendger-whatsapp {
    margin-top: -20%;
	}
	.form-messendger-telegram{
	margin-top: -15%;
	}
	.form-messendger-viber{
	margin-top: -10%;
	}
	.form-messendger-telephon{
	margin-top: -4%;
	}
	.item-banner{
		padding-top: 10%;
	}
	.work-form-messendger {
    margin: 25px 20%;
	}
}
@media only screen and (max-width: 992px){
	.lvl1{
		display: block!important;
		margin: 0px!important;
	}
	.navbar-toggler{
		position: fixed;
    	right: 100px;
    	top: 50px;
		color: #FFFFFF;
	}
	.header-left h1{
		text-align: center;
		padding: 5% 0px 5% !important;
	}
	.header-left p{
		text-align: center;
		padding: 0px;
	}
	.btn-zakazat {
		margin: 8% 35%;
	}
	.row-bl{
		display: none!important;
	}
	#myModal {
    left: 5%;
    top: 10%;
    width: 90%;
    height: 80%;
}
	
	
	.modal-body >.row-bl{
		display: block!important;
	}
	.form-messendger-whatsapp {
    margin-top: -25%;
	}
	.form-messendger-telegram{
	margin-top: -17%;
	}
	.form-messendger-viber{
	margin-top: -9%;
	}
	.form-messendger-telephon{
	margin-top: 0px;
	}
	.item-banner{
	padding-top: 30%;
	}
	.work-form-messendger {
    margin: 25px 5%;
	}
	.row-item-schem{
		display: block!important;
	}
	.col-img-scheme img{
		display: block;
		margin-left: auto;
		margin-right: auto;
	}
	.item-scheme-nonull-left-small{
		border-bottom: 1px dotted #6495ed;
	}
	.item-scheme-nonull-left > .null-item-scheme{
	display: none;
	}
	.form-messendger {
    right: 10px;
    z-index: 2;
	}
	
}
@media only screen and (max-width: 768px){
	.row-properties{
		text-align: center;
	}
	.col-value{
		padding-top: 25px;
	}
	.row-price{
		text-align: center;
	}
}
@media only screen and (max-width: 576px){
	.work-div-item-messendger p{
		width: auto;
	}
	.btn-zakazat {		
		margin: 8% 25%;	
	}
	.navbar-toggler {
    right: 25px;
	}
	.form-messendger-whatsapp {
    margin-top: -35%;
	}
	.form-messendger-telegram{
	margin-top: -20%;
	}
	.form-messendger-viber{
	margin-top: -5%;
	}
	.form-messendger-telephon{
	margin-top: 15%;
	}
	.item-name{
		text-align: center;
	}
	.item-img img{
		width: 150px;
		height: 150px;
		display: block;
		margin-left: auto;
		margin-right: auto;
	}
	.item-text{
		text-align: center;
	}
	.col{
		margin-bottom: 15px;
	}
}