

/* RESET */

*{margin: 0 0 0 0px; padding: 0 0 0 0px; border-collapse:collapse; box-sizing: border-box;}
a {outline: none;}

/* ШРИФТ */

@font-face {
    font-family: 'GroteskPro';
    font-style: bold;
    font-weight: 900;
    src: url(fonts/AkzidenzGroteskPro-MdEx.html) format('woff');
}
@font-face {
    font-family: 'GroteskPro';
    font-style: Extra Light;
    font-weight: 100;
    src: url(fonts/AkzidenzGroteskPro-LightEx.html) format('woff');
}


/* ALL */
body{
 /* min-width:1280px;  */
background:#333333;
background: url(background1005.jpg)center 100%; /* Путь к фоновому изображению */
}


.transition{
transition:1s;
}


/* СТАНДАРТ */
div {font-family:  'Tahoma', 'Arial', sans-serif; font-size:20px; color:#000000; transition: 300ms; font-style: normal; font-weight: 400;}


h1, h2, h5, b.zaglav {
display: inline-block;
font-weight: 400;
color:#dd9988; 
text-shadow: #000000 1px 1px 0, #000000 -1px -1px 0, #000000 -1px 1px 0, #000000 1px -1px 0;
}
b.zaglav {font-size:38px;}
h1 {font-size:42px; margin:50px 20px 50px 20px; }
h2 {font-size:54px;}
h3 {font-size:22px;}
h4 {font-size:28px;}
h5 {font-size:16px;}

h1, b.bindex{
 /* min-width:1280px;  */
display: inline-block;
font-size:58px;
position: absolute;
margin: 0; 
margin-top: -280px;
transform: translate(-50%, -50%);
}


b{font-weight: 600; font-style: bold;}
b.bslider {font-size:54px; margin:20px;}


a:link, a:visited {color: #dd9988; text-decoration: none; transition: 200ms;}
a:hover, a:active {color: #f8d7c6;}


.allblock {
 /* min-width:1280px;  */
overflow: hidden;
text-align:center;
font-size:0px;
}

.contents{
display: inline-block; /* выравнивет вложенные блоки по центру */
vertical-align:top; /* выравнивет вложенные блоки по верхней границе */
min-width:220px;
}


/* МОБИЛЬНАЯ ВЕРСИЯ */
@media screen and (orientation: portrait) {
.contents{font-size:40px;}
}

.dublediv {
min-width: 50%;
width: 50%;
}

.triplediv {
min-width: 29%;
width: 30%;
}

.quadrodiv {
min-width: 25%;
width: 25%;
}

.texthidden{overflow:hidden; height:auto; max-height: 4700px;}
.textopen{max-height: 4700px;}

@media screen and (orientation: portrait) {
.triplediv, .dublediv, .quadrodiv{width:100%;}
.texthidden{max-height:1000px;}
.texthidden::before {
content: '  \00A0  \00A0  \00A0  \00A0  ... ЧИТАТЬ ПОДРОБНЕЕ   '; 
white-space: pre; 
font-size:30px;
color: #ffffff; 
/* background: linear-gradient(to top, rgba(80, 23, 14, 1)20%, rgba(220, 153, 136, 0.9)60%, rgba(80, 23, 14, 0)100%); */
background: linear-gradient(to left, rgba(80, 23, 14, 1)10%, rgba(220, 153, 136, 1)45%, rgba(248, 215, 198, 1)65%, rgba(80, 23, 14, 1)95%);
padding:20px 0 30px 0 ;
top: 930px;
position: relative;
display: block;
text-align:right;
align:right;
min-width:60%;
cursor: pointer;
}

}


/* МОБИЛЬНАЯ ВЕРСИЯ КОНЕЦ */


.ptext p{
margin: 40px 0px 0px 0px;
}
.ptext p:first-letter {
margin: 0px 0px 0px 20px ;
}



/* ГРАДИЕНТНАЯ ЗАЛИВКА для DIV с фоновой картинкой*/
.gradientdg {
max-height:800px;
background: radial-gradient(circle, rgba(0, 0, 0, 0.0), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.8));
}

.gradientdgs {
background: linear-gradient(to right, rgba(0, 0, 0, 0.8)20%, rgba(0, 0, 0, 0.3)50%, rgba(0, 0, 0, 0.1)90%);
}

.gradientdgr {
background: linear-gradient(to left, rgba(0, 0, 0, 0.8)50%, rgba(0, 0, 0, 0.5)60%, rgba(0, 0, 0, 0.2)90%);
}

/* FORMS */

input, select{
font-family: 'Tahoma', 'Arial', sans-serif; color: #574845;
background: #ffffff;
width:160px;
height:46px;
/* border-radius: 6px; */
padding:8px;
/* margin: 0px 10px 2px 0px; */
transition:300ms;
}
input:focus{
border-color: #00c000;
background: #ffffff;
}

input[type=submit]{
background: #000000;
color: #dddddd; 
}
input[type=submit]:hover{
color: #000000;
background: #dd9988;
}


.contactform input:focus:invalid, .contactform textarea:required:invalid {
background: #fff url(icons/invalid.png) no-repeat top;
border-color:#c00000;
}

.contactform input:required:valid, .contactform textarea:required:valid {
background: #fff url(icons/valid.png) no-repeat 98% center;
box-shadow: 0 0 5px #5cd053;
border-color: #00c000; 
}


textarea{
font-family: 'Tahoma', 'Arial', sans-serif; color: #574845; 
background: #ffffff;
resize: none;
padding: 12px 1% 12px;
/* margin: 0px 10px 2px 0px; */
transition:300ms;
/* border-radius: 2px; border: 5px; border-style: solid; border-color:#000000; */
/* box-shadow: 0 0 0 2px #dd9988, 0 0 0 7px #000000; */
}
textarea:focus{
border-color: #00c000;
background: #ffffff;
}
button {
font-family: 'Tahoma', 'Arial', sans-serif; font-size:18px;
height:46px;
min-width:300px;
background: #000000;
color: #dd9988;
}
button:hover {
background: #dd9988;
color: #000000;
}

/* МОБИЛЬНАЯ ВЕРСИЯ */
@media screen and (orientation: portrait) {
textarea, input, select, button{font-size:36px;}
textarea {padding:18px;  height:500px; }
input, button {padding:18px;  height:90px;}
 button {min-width:500px;}
}
/* МОБИЛЬНАЯ ВЕРСИЯ КОНЕЦ */

form::after {
content: '\A \A \2611 \00A0 даю согласие на обработку персональных данных '; 
white-space: pre; 
font-size:12px;
color: #ffffff; 
top: -20px;
position: relative;
display: inline-block;
min-width:60%;
}
@media all and (orientation: landscape){
form::after {
color: #ff0000; 
}
}




/* РАМКИ */
.pborder, .aborder{
border-radius: 40px; border: 5px; border-style: solid; 
border-color:#000000;
box-shadow: 0 0 0 2px #dd9988, 0 0 0 7px #000000;
margin:10px;
}
.aborder{
cursor:pointer; 
transition: 300ms;
color: #dddddd;
}
.aborder:hover{
border-color:#dd9988;
box-shadow: 0 0 0 2px #000000, 0 0 0 0px #000000;
color:#000000; 
}


/* SCRIPTS */

#id{
margin-top:1250px;
}

li {
/*list-style-image: url(/pictrs/icons/guest_ico.png); Путь к изображению маркера */
/*list-style: none; Убираем исходные маркеры */
/*background: url(/pictrs/icons/libg.png) no-repeat 0px 5px; Параметры фона */
padding-left: 10px; /* Смещаем текст вправо */ 
margin-left: 20px; /* Смещаем текст вправо */ 
line-height: 1.5;
}


/* СЛАЙДЕР */

.hslider {overflow:hidden; width:100%; height:800px;}
.inslider h3 {font-family: 'Tahoma', 'Arial', sans-serif; color: #eeeeee; font-size:20px; text-shadow: 1px 2px 2px #666666;}
.inslider b{ background: rgba(40, 10, 0, 0.4) 0%;}
.inslider {
width:100%;
height:800px;
}

.inslideranim{
animation-duration: 5s; /* время движения */
animation-name: slidein; /* тип движения */
animation-iteration-count: infinite; /* повтор движения */
animation-direction: alternate; /* повторение в обратную сторону */
}

@keyframes slidein {
from {width: 100%; padding-left:0%;}
to {width: 120%; margin-left: -10%; padding-left:10%;}
}

.inslideranimindex{
animation-duration: 5s; /* время движения */
animation-name: slideindex; /* тип движения */
animation-iteration-count: infinite; /* повтор движения */
animation-direction: alternate; /* повторение в обратную сторону */
}

@keyframes slideindex {
from {width: 100%;}
to {width: 120%; margin-left: -10%;}
}

.insliderx {
width:100%;
height:800px;
margin-top: -800px;
}

.insliderz {
width:100%;
height:800px;
margin-top: -800px;
animation-duration: 20s; /* время движения */
animation-name: slideinz; /* тип движения */
animation-iteration-count: infinite; /* повтор движения */
animation-timing-function: linear;
}

@keyframes slideinz {
from {margin-top:-800px; opacity: 0.0;}
3% {margin-top:-800px; opacity: 0.0;}
9% {margin-top:-800px; opacity: 1.0;}
24% {margin-top:-800px; opacity: 1.0;}
26% {margin-top:-800px; opacity: 0.0;}

27% {margin-top:-1600px; opacity: 0.0;}
30% {margin-top:-1600px; opacity: 1.0;}
49% {margin-top:-1600px; opacity: 1.0;}
51% {margin-top:-1600px; opacity: 0.0;}

52% {margin-top:-2400px; opacity: 0.0;}
55% {margin-top:-2400px; opacity: 1.0;}
74% {margin-top:-2400px; opacity: 1.0;}
76% {margin-top:-2400px; opacity: 0.0;}

77% {margin-top:-3200px; opacity: 0.0;}
80% {margin-top:-3200px; opacity: 1.0;}
97% {margin-top:-3200px; opacity: 1.0;}
99% {margin-top:-3200px; opacity: 0.0;}

100% {margin-top:-800px; opacity: 0.0;}
}


.insliderz b.zaglav{
animation-duration: 5s; /* время движения */
animation-name: slideinb; /* тип движения */
animation-iteration-count: infinite; /* повтор движения */

}

@keyframes slideinb {
from { transform: scale(2); opacity: 0.0;}
20% {transform: scale(2); opacity: 0.0;}
30% {opacity: 1.0;}
35% {transform: scale(1);}
97% {opacity: 1.0;}
99% {opacity: 0.0;}
100% { opacity: 0.0;}
}


.insliderz button, .logoimg{
animation-duration: 5s; /* время движения */
animation-name: slideinbutton; /* тип движения */
animation-iteration-count: infinite; /* повтор движения */
}
@keyframes slideinbutton{
60% {opacity: 1.0;}
75% {opacity: 0.4;}
90% {opacity: 1.0;}
}

.slidelogo{
animation-duration: 5s; /* время движения */
animation-name: slidelogo; /* тип движения */
animation-iteration-count: infinite; /* повтор движения */
}
@keyframes slidelogo{
from {opacity: 0.0;transform:rotate(360deg);}
55% {opacity: 0.0;}
75% {opacity: 1.0;transform:rotate(0deg);}
100% {opacity: 1.0;}
}


/* INSERT МЕНЮ */
.insertmenu{
z-index:2;
width:100%;
 /* min-width:1280px;  */
top:740px;
position: absolute; 
/* background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 41%, rgba(0, 0, 0, 1)40%); */
}

.insertmenu li{
font-family: 'Tahoma', 'Arial', sans-serif; font-size:15px;;
display: inline-block;
overflow: hidden;
width: 150px;
min-width: 150px;
max-width: 170px;
max-height:230px;
list-style-type: none;
font-weight: 900;
padding: 4px ;
margin: 0px;
color:#dddddd;
transition: 300ms;
}
@media (min-width: 1200px) { 
.insertmenu li{
margin: 0px 2% 0px 2% ;
}
}

.insertmenu li:hover{
color:#dd9988; 
text-shadow: #000000 1px 1px 0, #000000 -1px -1px 0, #000000 -1px 1px 0, #000000 1px -1px 0;
}

.fixedmenu{
z-index:2;
top:40px;
position: fixed; 
background: linear-gradient(to bottom, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 1)); 
box-shadow: 0px 10px 20px 0px rgba(0,0,0,0.5); 
}

.fixedmenu li{
color:#dd9988; 
}

.fixedmenu img{
margin-top:4px;
width: 50px;
height:50px;
}
.fixedmenu:hover img{
width: 100px;
height:100px;
}

.fixedplus{

z-index:3;
top:0px;
background: linear-gradient(to bottom, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.8)); 
}
.fixedplus li{
width: 170px;
min-width: 50px;
max-width: 170px;
max-height:230px;
list-style-type: none;
font-size:14px;
font-weight: 600;
color:#f1f1f1;
margin: 0px 0px 0px 0px;
}
.mobilmenu{ display: none;}
.mobilmenufix{display: none ; position: fixed; z-index:3; 
min-width:100%;font-size:50px; color:#f1f1f1;
background: linear-gradient(to bottom, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.9)); 
}
/* МОБИЛЬНАЯ ВЕРСИЯ */
@media screen and (orientation: portrait) {
.fixedplus{visibility: hidden;}
.fixedmenu{visibility: hidden; transition:60ms; }
.insertmenu {top:1170px;}
.mobilmenu{display: block ;}
.mobilmenufix{display: block ;}
}

/* МОБИЛЬНАЯ ВЕРСИЯ КОНЕЦ*/


.rico{
transition:300ms;
border-style: solid; 
border-radius:50%;
border-color:#000000;
margin:10px;
padding: 5px;
width: 100px;
height:100px;
box-shadow: 0 0 0 2px #dd9988, 0 0 0 7px #000000;
background: #000000;
transition:600ms;
}

div:hover > .rico, li:hover > .rico{
border-color:#dd9988;
box-shadow: 0 0 0 2px #000000, 0 0 0 0px #000000;
background: #dd9988;
}


/* ДОБАВКА С МЕДИА ЗАПРОСОМ */
@media screen and (max-width:600px) {
/* .fixedmenu{height:46px;} */
}


/* END INSERT МЕНЮ */


/* LEFT MENU */

div.hidmodal{
height:100%;
width:0px;
top: 0;
left: -340px;
bottom: 0;
z-index: 4;
position: fixed; 
overflow:hidden;
}


div.openmodal{
top: 0;
left: 0;
bottom: 0;
z-index: 4;
background: linear-gradient(to left, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 1));
position: fixed; 
height:100%;
width:100%;
overflow-x:hidden;
}


.openmodal li, .hidmodal li{
cursor: pointer;
font-family: 'GroteskPro'; font-size:14px;
min-height:46px;
width: 300px;
list-style-type: none;
font-weight: 900;
padding: 8px 1px 12px 1px; 
margin: 12px 0px 0px 0px;
border-radius: 40px; border: 5px; border-style: solid; border-color:#000000;
box-shadow: 0 0 0 2px #dd9988, 0 0 0 7px #000000;
background: #000000;
transition:600ms;
}


li.closeon:hover, li.closeoff{
color: #000000;
border-color:#dd9988;
box-shadow: 0 0 0 2px #000000, 0 0 0 0px #000000;
background: #dddddd;
}


li .sdvig {
color: #dd9988; 
}

li:hover .sdvig {color:#000000;}
li .osdvig {color:#000000;}
li:hover .osdvig {color:#000000;}


.closeon{
min-height:20px; 
max-height:20px; 
overflow:hidden;
}

.closeoff{
min-height:100px; 
max-height:1120px; 
overflow:visible;
}


.podmenu img{width:50px; height:50px; margin: -12px 10px 0 -10px; float: left;}
.podmenu {
display: inline-block; 
color:#000000;
height:50px; 
font-style: normal;
font-weight:normal; 
width: 98%; 
border-radius: 40px; border: 5px; border-style: solid; border-color:#000000;
box-shadow: 0 0 0 2px #dd9988, 0 0 0 7px #000000;
background: linear-gradient(to bottom, rgba(80, 23, 14, 1)10%, rgba(220, 153, 136, 1)45%, rgba(248, 215, 198, 1)65%, rgba(220, 153, 136, 1)75%); 
padding:8px 0 8px 0;
margin:10px;
color: #50170e; 
transition:400ms;
}
@media screen and (orientation: portrait) {
.podmenu {font-size:36px; padding:18px 0 18px 0;  height:90px; }
.podmenu img{width:80px; height:80px; margin: -18px 10px 0 -10px; float: left;}
}



.podmenu:hover{
color: #000000;
border-color:#dd9988;
box-shadow: 0 0 0 2px #000000, 0 0 0 0px #000000;
background: linear-gradient(to top, rgba(80, 23, 14, 1)10%, rgba(220, 153, 136, 1)45%, rgba(248, 215, 198, 1)65%, rgba(220, 153, 136, 1)75%); 
}


/* БЛОК - ГОРИЗОНТАЛЬНАЯ КАРТИНКА */
.photodiv{
overflow: hidden;

width:300px;
height:200px;
vertical-align:top; /* выравнивет вложенные блоки по верхней границе */
display: inline-block; /* выравнивет вложенные блоки по центру */
margin:10px; /* внешний отступ */

/* border-radius: 5px; border: 5px; border-style: solid; border-color:#000000; */
/* box-shadow: 0 0 0 2px #dd9988, 0 0 0 7px #000000; */
}


/* GALERY */
.photoimg {

height:200px;
width:300px;
transition:300ms;
object-fit: contain;
}
.photodiv:hover .photoimg{
height:240px;
width:360px;
margin: -20px;
}

.photobg {
vertical-align:top; 
height:200px;
width:300px;
display: inline-block; 
overflow: hidden;
margin-top: -200px; 
background: radial-gradient(circle, rgba(0, 0, 0, 0.0), rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.9));
}
/* Втавка фото-видео иконки */ 
.photobg:after{
content: ''; /* Добавляемый текст */ 
width:40px; 
height:30px; 
position: absolute;
margin-left: -298px;
}
[class|="photobg fico"]:after{
background-image: url('photoico.png');
}
[class|="photobg vico"]:after{
background-image: url('videoico.png');
}
[class|="photobg zico"]:after{
background-image: url('zoomico.png');
}

.overtext{
display: inline-block; 
overflow: hidden;
vertical-align:top; 
width:300px;
color:#dddddd;
margin-top: 0px; 
transition:500ms;
opacity: 0; 
font-size:16px;
font-weight: 600;

}
.gallery{
margin-top: 150px;
padding:4px;
min-height:100px;
text-align:center;
background: rgba(0, 0, 0, 0.4);
opacity: 1; 
}

.photodiv:hover .overtext{
background: rgba(0, 0, 0, 0.0);

opacity: 1; 
color:#dd9988; 
text-shadow: #000000 1px 1px 0, #000000 -1px -1px 0, #000000 -1px 1px 0, #000000 1px -1px 0;
margin-top: 100px;

}

/* CARUSEL */

.carusel{
width:80%;
position: relative;
overflow: hidden;
border: 0px;
border-style: solid;
border-color:#efefef;
border-radius:12px;
text-align:left;
/*border-radius: 0px; border: 5px; border-style: solid; border-color:#000000; */
/*box-shadow: 0 0 0 2px #dd9988, 0 0 0 7px #000000; */
}

/* STRELKI */
.sbutton{
width:80px;
height:100px;
margin-left:5px; margin-right:5px;
cursor:pointer;
}
.sbutton:hover{
animation-duration: 200ms; /* время движения */
animation-name: btleft; /* тип движения */
animation-iteration-count: 6; /* повтор движения */
animation-direction: alternate; /* повторение в обратную сторону */
animation-timing-function: linear;
}
@keyframes btleft {
from {margin-left:5px; margin-right:5px;}
to {margin-left:12px; margin-right:-2px;}
}


/* ACCORDION MENU */
.lohgmemu {cursor:s-resize;color: #dddddd; background:#000000; padding:12px; width:100%; overflow:hidden; height:auto; max-height:60px; transition:1s;}
.lohgmemu:hover {background:#dddddd;}
/*.white {background: linear-gradient(to left, rgba(80, 23, 14, 1)10%, rgba(220, 153, 136, 1)45%, rgba(248, 220, 198, 1)65%, rgba(80, 23, 14, 1)95%);  color: #000000;} */
 .white {background: linear-gradient(to left, rgba(80, 23, 14, 1)10%, rgba(220, 153, 136, 1)45%, rgba(248, 215, 198, 1)65%, rgba(80, 23, 14, 1)95%);  color: #000000;}




.lohgmemuz {cursor:n-resize; padding:12px; width:100%; overflow:hidden; height:auto; max-height: 2700px; transition:2s; }
.lohgmemuz b{color: #f7941d; font-size:32px; padding:42px; 
display: inline-block;
padding:0px 20px 0px 20px;
color:#dd9988; 
text-shadow: #000000 1px 1px 0, #000000 -1px -1px 0, #000000 -1px 1px 0, #000000 1px -1px 0; font-weight: 400;
transition:600ms;
}


.lohgmemu b{width:800px; line-height:36px; margin-left: 20%; float:left; text-align:left; transition:600ms;
}
.lohgmemu:hover b{color:#ffffff; margin-left: 25%; 
display: inline-block;
padding:0px 20px 0px 20px;
color:#dd9988; 
text-shadow: #000000 1px 1px 0, #000000 -1px -1px 0, #000000 -1px 1px 0, #000000 1px -1px 0;
}


.lohgmemu b:before{
content:'\2228'; /* Добавляемый текст */ 
font-size:22px;
font-weight: bold;
padding-right: 30px;
}


.showimg img{opacity: 0.6; filter: alpha(Opacity=60); transition:600ms;}
.showimg img:hover{opacity: 1; filter: alpha(Opacity=100);}


.klients{
background:#000000;
}
.klients img{
margin:0;
padding:0;
border:0px solid;
width:10%;
opacity: 0.5; filter: alpha(Opacity=50); 
transition:600ms;
}
.klients img:hover{
opacity: 1; filter: alpha(Opacity=100);
}

/* БЛОК С ДВИЖУЩИМСЯ ФОНОМ */



/* фон с движением  */

.divmbg{
width:160%;
height:100%;
transition:1400ms;
}

a:hover .divmbg{
margin-left: -60%;
transition:ease 2s 0s ;
}


/* вложенный с контентом  */
.divminsert{
color:c1c1c1;
position: relative;
height:100%;
min-height:100%;
background: rgba(0, 0, 0, 0.4); 
transition:600ms;
}

.divminsert:hover img{
transform:rotateY(360deg);
transition:600ms;
}

.icorotat:hover img{
transform:rotateY(360deg);
transition:600ms;
}

/* ЛЮБАЯ ГАММА ПРОЗРАЧНЫЙ ФОН */
.transbgall {background-color: transparent;}
.transbg:hover {background: rgba(0, 0, 0, 0.8); color:ffffff;}
/* БЛОК С ДВИЖУЩИМСЯ ФОНОМ КОНЕЦ */




.ramkanew {
min-width:300px;
min-height: 200px;
border-radius: 10px; border: 0px; border-style: solid; border-color:#c9836e;
display: inline-block;
box-shadow:  0px 8px 1px #ae553e, -8px 0px 1px #c9836e, 8px 0px 1px #c9836e, 0px -8px 1px #eeb2a3; 
padding:8px;
transition:200ms;
margin: 20px;
/* background-size: cover; */
background-size: 100%; 
background-position: center center;
}
.ramkanew:hover {
/* background-position-x: 280px; */
box-shadow:  0px 8px 1px #ae553e, -8px 0px 1px #c9836e, 8px 0px 1px #c9836e, 0px -8px 1px #eeb2a3; 
background-size: 115%;
border-color:#dd9988;
}

.round {
width:180px;
height: 180px;
min-width:180px;
min-height: 180px;
max-width:180px;
max-height: 180px;
border-radius: 50%;
text-align: center;
margin-bottom:80px;

}
.round div{
display: inline-block;
position: absolute;
transform: translate(-50%, -50%);
 font-weight: 400;
color:#f1f1f1;
max-width:180px;
max-height:40px;
height:40px;
margin-top:200px;
}






