﻿
:root {

    --bs-primary: #D5A75A;

    --color01:#D5A75A;
    --color02:#171717;
    --color03:#c1c1c1;
    --color04:#f7f7f7;
    
    --color10:white;
    --color11:black;
 
    --font-title:"Playfair Display", serif;
    --font-body:"Mulish", sans-serif;
}

body {
    font-family:var(--font-body);
    font-size:16px;
    color:var(--color11);
}

h1, h2, h3 { font-family:var(--font-title); position:relative; display:inline-block; }
h1.center, h2.center, h3.center { display:block; width:100%; text-align:center; }
h1 { font-size:2.2em; margin:40px 0; padding:0; }
h2 { font-size:1.6em; margin:25px 0; padding:0; }
h3 { font-size:1.4em; margin:15px 0; padding:0; }
h1.underline::after, h2.underline::after, h3.underline::after { content:""; display:block; width:100px; height:3px; background-color:var(--color01); margin-top:8px; }
h1.underline.center::after, h2.underline.center::after, h3.underline.center::after { left:0; right:0; position:absolute; margin-left:auto; margin-right:auto; }
p { margin:10px 0; padding:0; }
a,a:visited { color:var(--color01); font-weight:600; }

.pagelayout { max-width:1400px; width:100%; margin-left:auto; margin-right:auto; }
.flex { display:flex; flex-wrap:nowrap; }

.header { height:100px; width:100%; position:relative; }
.header .header-top{ height:100px; width:100%; background-color:var(--color01); color:var(--color11); display:flex; }
.header .header-bottom{ height:60px; width:100%; background-color:var(--color10); color:var(--color11); text-align:right; }
.header .logo-container { width:25%; height:160px; display:flex; justify-content:flex-end; align-items:center; position:absolute; z-index:10; left:0; top:0; background-color:var(--color02); border-bottom-right-radius:30px; }
.header .logo-container .logo{ height:100%; display:flex; align-items:center;  }
.header .logo-container .logo a{ width:calc(100% - 40px); margin-right:40px; height:80%; width:auto; display:block; }
.header .logo-container .logo img{ height:100%; }
.header .header-flex { display:flex; justify-content:right; align-items:center; height:100%; }
.header .header-flex .menu-container { width:60px; }
.header .header-flex .slogan { flex-grow:1; text-align:left; margin-left:300px; }
.header .header-flex .slogan img{ width:360px; text-align:left; }
.header .header-flex .icon-contacts { width:160px; height:48px; position:relative; }
.header .header-flex .icon-contacts a{ display:block; width:48px; height:48px; border-radius:24px; background-color:var(--color02); margin-right:15px; }
.header .header-flex .icon-contacts a.email{ position:absolute; top:0; left:0; background-image:url(/images/ico-email.svg); background-repeat:no-repeat; background-position:center center; background-size:26px; }
.header .header-flex .icon-contacts a.phone{ position:absolute; left:40px; background-image:url(/images/ico-phone.svg); background-repeat:no-repeat; background-position:center center; background-size:auto 26px; }
.header .header-flex .menu-container .menu-button { width:48px; height:48px; display:block; 
                                                    background:none; border:none;
                                                    background-image:url(/images/ico-menu.svg); background-repeat:no-repeat; background-position:center center; background-size:auto 26px;
                                                    display:block;
}

.submenu { }
.submenu .flex{ justify-content:flex-end; }
.breadcrumb { text-align:right; display:flex; height:100%; justify-content:flex-end; padding-top:20px; }
.twolayer,.twolayer.image{ display:flex; flex-wrap:wrap; }
.twolayer.image .image-content{ width:50%; }
.twolayer.image .image-content img{ max-width:100%; border-radius:30px; }
.twolayer.image div:first-child.image-content{ padding-right:60px; }
.twolayer.image div:last-child.image-content{ padding-left:60px; }
.twolayer.image .text-content{ width:50%; }
.twolayer .column { width:50%; }

.button { width:auto; height:48px; display:table; line-height:48px; font-size:1.2rem; text-decoration:none; text-transform:uppercase; border:none;
          border-radius:5px; border:1px solid var(--color01); color:var(--color01); text-align:center; padding:0 30px;
           transition: transform 0.45s ease;
            transform-origin: center; cursor:pointer;
}
.button:hover { transform: scale(1.05); }
.button.light { background:none; }
.button.black { background-color:var(--color01); color:var(--color10); }
.button i{ font-size:1rem; margin-left:10px; font-weight:normal; }

.footer { background-color:var(--color02); padding:60px 0; margin-top:60px; color:var(--color10); }

.footer a:hover,.footer .links ul li a:hover,.footer .contacts .contact a:hover { text-decoration:none; }
.footer .links{ color:var(--color10); padding-right:60px; min-width:300px; }
.footer .links .web{ margin-bottom:20px; }
.footer ul,.footer ul li{ margin:0; padding:0; list-style:none; }
.footer .links ul,.footer .links ul li a{ color:var(--color10); margin:5px 0; text-decoration:none; }
.footer .links ul li a { padding:0 0; display:block; }
.footer .contacts { min-width:300px; padding-right:60px;  }
.footer .contacts .info{ color:#b3b3b3; }
.footer .contacts .company{ color:var(--color01); font-weight:bold; font-size:1.2em; }
.footer .contacts .contact a { text-decoration:none; color:white; }
.footer .contacts .contact { margin:10px 0; }
.footer .contacts .contact .title { color:#b3b3b3; }
.footer .contacts .contact i { color:#b3b3b3; margin-right:10px; }
.footer h3 { color:var(--color01); }
#fast-contact-form { }
#fast-contact-form .flex{ flex-wrap:wrap; }
#fast-contact-form .flex .item{ padding:5px; }
#fast-contact-form .flex .item.firstname,#fast-contact-form .flex .item.lastname,#fast-contact-form .flex .item.phone,#fast-contact-form .flex .item.email{ width:50%; }
#fast-contact-form .flex .item.subject { width:100%; }
#fast-contact-form .flex .item.subject ul{ list-style-type:none; display:flex; }
#fast-contact-form .flex .item.subject ul li.form-check .form-check-input{ margin:0; padding:0; margin-right:10px; margin-top:5px; }
#fast-contact-form .flex .item.subject ul li { padding-right:10px; }
#fast-contact-form .flex .item.description { width:100%; margin-bottom:15px; }
#fast-contact-form .flex .item.description textarea{ height:6em; }
#fast-contact-form .flex .buttons { width:150px; margin:5px; }
#fast-contact-form .flex .accepted { width:calc(100% - 160px); padding-left:5px; }
#fast-contact-form .flex .item .title,#fast-contact-form .form-check-label  { color:gray; }
#fast-contact-form .flex .item .title i { font-size:0.8rem; color:var(--color01); margin-left:5px; }
.form-control { 
    background-color:#3b3b3b; color:#b3b3b3;
    border:1px solid #494949;
}
.form-check-input:checked { background-color: var(--color01);
    border-color: var(--color01); }
.form-check-input:focus { box-shadow: 0 0 0 .25rem rgba(179, 132, 59, .25); }
.form-control:focus { 
    border-color: #D5A75A;
    box-shadow: 0 0 0 .25rem rgba(179, 132, 59, .25);
    background-color:#565656;
    color:#e1e1e1;
}
.footer a, .footer .links ul li a, .footer .contacts .contact a { text-decoration:underline; }

.modal-header { background-color:var(--color01); }
.modal-body {  }
.modal-footer {  }
.modal .btn-primary { background-color:var(--color01); border:none; }

.side-menu {
    position: fixed;
    top: 0;
    right: 0;
    width: 50%;
    max-width: 1100px;
    height: 100vh;
    background: var(--color02);
    color:var(--color10);
    z-index: 1050;
    transform: translateX(100%);
    transition: transform 0.3s ease;
    overflow-y: auto;
}

body.menu-open .side-menu {
    transform: translateX(0);
}

.side-menu-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.4);
    z-index: 1040;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

body.menu-open .side-menu-overlay {
    opacity: 1;
    visibility: visible;
}

body.menu-open {
    overflow: hidden;
}

.side-menu ul { margin:0; padding:0; list-style:none; }
.side-menu ul li{ margin:0; padding:0; list-style:none; }

@media (max-width: 1099px) {
    .side-menu {
        width: 90%;
        max-width: none;
    }
}

.header {
    position: relative;
    z-index: 1000;
}

.header.is-fixed {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background: #fff;
    transform: translateY(0);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}

.header.is-fixed.is-hidden {
    transform: translateY(-100%);
}

.logo-container.fix {
    height:100px;
    border-bottom-right-radius:0;
}

body.menu-open .side-menu { padding:30px; }
body.menu-open .side-menu .close-button{ border:none; background-color:var(--color01); color:var(--color11); width:48px; height:48px; border-radius:24px; font-size:26px; }
body.menu-open .side-menu ul { margin-top:30px; }
body.menu-open .side-menu .web,body.menu-open .side-menu .home { padding-bottom:30px; }
body.menu-open .side-menu .web { padding-top:30px; }
body.menu-open .side-menu li a { font-size:1.2rem; padding:2px 0; margin:0 0 5px 0; display:inline-block; color:var(--color10); }
body.menu-open .side-menu li a:hover { text-decoration:none; }
body.menu-open .side-menu li i { margin-right:10px; color:var(--color01); }







