html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, textarea,
table, caption, tbody, tfoot, thead, tr, th, td
{
  margin:               0;
  padding:              0;
  border:               0;
  outline:              0;
}


@font-face
{
  font-family:          'GaretBook';
  src:                  url('/assets/fonts/Garet-Book.ttf');
}
@font-face
{
  font-family:          'GaretBold';
  src:                  url('/assets/fonts/Garet-Bold.ttf');
}
@font-face
{
  font-family:          'GaretHeavy';
  src:                  url('/assets/fonts/Garet-Heavy.ttf');
}

html
{
  font-size:            1.4vw;
}

body
{
  background-color:     #FFFFFF;
  font-family:          'GaretBook';
  font-weight:          normal;
  font-size:            1em;
}


strong
{
  font-family:          'GaretBold';
}


a
{
  color:                #9A725C;
  text-decoration:      none;
}
a:hover
{
  color:                #D8B99B;
}


.content-button, .overlay-button
{
  padding:              0.5vw 1vw 0.5vw 1vw;
  color:                #FFFFFF;
  background-color:     #9B4219;
  border-radius:        20vw;
  border:               none;
  text-transform:       uppercase;
  cursor:               pointer;
}
.content-button
{
  transition:           background-color 0.25s ease-in-out, color 0.25s ease-in-out;
}
.content-button:hover
{
  background-color:     #E7E0D8;
  color:                #9B4219;
}


header, footer
{
  font-family:          'GaretBook';
  font-weight:          normal;
  font-size:            1.1vw;
}


header
{
  background-color:     #E7E0D8;
  width:                100vw;
  height:               6vw;
  overflow:             hidden;
  margin-bottom:        3px;
  position:             fixed;
  top:                  0vw;
  left:                 0vw;
  z-index:              9000;
}

header #logo_container
{
  margin:               0.5vw 2vw 1vw 4.3vw;
  float:                left;
}

header #logo
{
  background:           url('/assets/img/logo.svg') no-repeat center;
  background-size:      contain;
  width:                10vw;
  height:               5vw;
}

header #menu
{
  float:                right;
  overflow:             hidden;
  height:               100%;
  display:              flex;
}

header #menu ul
{
  display:              flex;
  align-self:           flex-end;
  margin:               0px 0vw 0px 0vw;
  list-style-type:      none;
  padding-bottom:       10px;
}

header #menu ul li, header #menu ul li a
{
  display:              inline;
  font-family:          'GaretBook';
  font-weight:          normal;
  font-size:            1.1vw;
  padding:              0vw 0vw 0.9vw 0vw;
  margin:               0vw;
  color:                #7D4E24;
  text-align:           center;
  text-decoration:      none;
  text-transform:       uppercase;
}
header #menu ul li::before
{
  content:              "";
  display:              inline-flex;
  width:                0vw;
  padding:              0vw 0vw 0vw 1.3vw;
}
header #menu ul li::after
{
  content:              "";
  display:              inline-flex;
  height:               40%;
  width:                0vw;
  border-right:         0.2vw solid #7D4E24;
  padding:              0vw 1.3vw 0vw 0vw;
}
header #menu ul li:last-child::after
{
  border-right:         none;
}

header #menu ul li a:hover
{
  color:                #AB6E4D;
}

header #menu ul li.hovered
{
  background-image:     linear-gradient(to right, #9B4219, #9B4219);
  background-size:      0.5vw 0.5vw;
  background-position:  50% 100%;
  background-repeat:    no-repeat;
}


footer
{
  background-color:     #9B4219;
  overflow:             hidden;
  margin-top:           3px;
  position:             relative;
}

footer #logo
{
  background:           url('/assets/img/logo-footer.svg') no-repeat center;
  background-size:      contain;
  width:                15vw;
  height:               7.5vw;
}

footer #logo_container
{
  margin:               2.8vw 0.2vw 0.2vw 5%;
  float:                left;
}

footer #contacts-container
{
  float:                right;
  height:               100%;
  width:                calc(92% - 127px);
  max-width:            70vw;
  color:                #E7E0D8;
  overflow:             hidden;
}

footer #contact-titles
{
  margin-top:           2.5vw;
  padding-bottom:       0.8vw;
  border-bottom:        0.2vw solid #E7E0D8;
  overflow:             hidden;
}

footer #contact-titles #social, footer #contacts #social
{
  float:                right;
  width:                10vw;
  overflow:             hidden;
}

footer #contact-titles #contact-info, footer #contacts #contact-info
{
  float:                right;
  width:                58vw;
  overflow:             hidden;
}

footer #contacts #social a div
{
  width:                30px;
  height:               30px;
  display:              block;
  margin:               1.5vw 2vw 1.5vw 2vw;
}
footer #contacts #social a #facebook
{
  background-image:     url('/assets/img/social-fb_footer.png');
}
footer #contacts #social a #instagram
{
  background-image:     url('/assets/img/social-instagram_footer.png');
}

footer #contacts #contact-info #phone, footer #contacts #contact-info #address
{
  float:                left;
  margin-top:           1vw;
}
footer #contacts #contact-info #phone
{
  width:                45%;
}
footer #contacts #contact-info #address
{
  width:                50%;
}


#main-panel
{
  background-color:     #FFFFFF;
  color:                #9A725C;
  position:             relative;
  margin-top:           7vw;
}
#main-panel::after
{
  content:              "";
  clear:                both;
  display:              block;
  width:                100%;
}


#presentation-panel
{
  width:                100%;
  overflow:             hidden;
}

.text-panel
{
  width:                44vw;
  margin:               0vw;
  padding:              4vw 0.1% 1vw 4vw;
  float:                left;
  position:             relative;
  z-index:              2000;
}

.title
{
  width:                100%;
  padding-bottom:       5%;
}

.title h1
{
  font-family:          'GaretHeavy';
  font-weight:          normal;
  font-size:            2.15em;
  letter-spacing:       0.15em;
  text-transform:       uppercase;
  line-height:          120%;
}

.text-panel .content-home::before
{
  content:              "";
  border-top:           1px solid #9A725C;
  margin-left:          15%;
  width:                100%;
  display:              inline-block;
  position:             relative;
  z-index:              100;
}

.text-panel .content-home .social
{
  float:                left;
  width:                calc(44vw / 5);
  overflow:             hidden;
}

.text-panel .content-home .social a div
{
  width:                40px;
  height:               40px;
  display:              block;
  margin:               2vw auto 1vw auto;
}

.text-panel .content-home .social a #facebook
{
  background-image:     url('/assets/img/social-fb.png');
}
.text-panel .content-home .social a #instagram
{
  background-image:     url('/assets/img/social-instagram.png');
}

.text-panel .content-home .text-container,
.text-panel .content .text-container
{
  padding:              1% 0% 0% 1vw;
}

.text-panel .content-home .text-container .text,
.text-panel .content .text-container .text
{
  float:                left;
  width:                70%;
  padding:              11% 0vw 0vw 2vw;
  border-left:          1px solid #9A725C;
  margin-top:           -7%;
}
.text-panel .content .text-container .text
{
  padding-top:          0%;
  margin-top:           4%;
}
.text-panel .content-home .text-container .text::after,
.text-panel .content .text-container .text::after
{
  content:              "";
  float:                left;
  position:             relative;
  width:                0.6vw;
  height:               0.6vw;
  border:               0.4vw solid #FFFFFF;
  background-color:     #9B4219;
  margin:               22% 0vw 0vw -2.6vw;
  z-index:              2000;
}

.text-panel .content-home .text-container .text h2,
.text-panel .content .text-container .text h2
{
  font-family:          'GaretBold';
  font-size:            1.1em;
  color:                #734219;
}

.text-panel .content-home .text-container .text p,
.text-panel .content .text-container .text p
{
  color:                #9A725C;
  margin-bottom:        8%;
  font-size:            1em;
}
.text-panel .content-home .text-container .text p strong,
.text-panel .content .text-container .text p strong
{
  color:                #734219;
}

.text-panel .content-home .text-container .text .content-button,
.text-panel .content .text-container .text .content-button
{
  margin-left:          1%;
  display:              inline-block;
  margin-bottom:        5%;
}

#presentation-panel .picture-panel
{
  width:                49%;
  height:               100%;
  margin:               0vw;
  padding:              0vw;
  float:                right;
  overflow:             hidden;
  position:             relative;
}

#presentation-panel .picture-panel .picture
{
  float:                right;
  width:                90%;
  margin-left:          -90%;
  margin-bottom:        20%;
  position:             relative;
}

#presentation-panel .picture-panel .picture img
{
  width:                100%;
  height:               auto;
  position:             relative;
  box-shadow:           -10ex 9ex 0ex 4ex rgba(231,224,216,0.4);
  z-index:              1000;
}

#presentation-panel .picture-panel .picture .decoration
{
  float:                left;
  position:             relative;
  width:                0vw;
  height:               0vw;
  border:               1.2vw solid #9B4219;
  margin:               -1.8vw 0vw 0vw -1.2vw;
  z-index:              2000;
}


#link-panel
{
  width:                100%;
  overflow:             hidden;
  margin:               5% auto 5% auto;
}

#link-panel #link-container
{
  width:                90%;
  margin:               0vw auto 0vw auto;
  overflow:             hidden;
}

#link-panel #link-container
{
  width:                90%;
  margin:               0vw auto 0vw auto;
  overflow:             hidden;
}

#link-panel #link-container .link-block
{
  padding:              6% 0% 4.5% 0%;
  width:                30%;
  overflow:             hidden;
  float:                left;
  position:             relative;
}
#link-panel #link-container .link-block:first-child
{
  margin-right:         5%;
}
#link-panel #link-container .link-block:last-child
{
  margin-left:          5%;
}

#link-panel #link-container .link-block
{
}

#link-panel #link-container .link-block img
{
  width:                100%;
  display:              block;
  position:             relative;
  z-index:              800;
}

#link-panel #link-container .link-block .overlay
{
  width:                100%;
  padding-top:          100%;
  margin-top:           -100%;
  background-color:     rgba(155,66,25,0.65);
  position:             relative;
  z-index:              800;
  opacity:              0;
  transition:           opacity 0.5s ease-in-out;
}
#link-panel #link-container .link-block .overlay:hover
{
  opacity:              1;
}

#link-panel #link-container .link-block .overlay .overlay-content
{
  position:             absolute;
  top:                  0;
  left:                 0;
  bottom:               0;
  right:                0;
  text-align:           center;
  color:                #FFFFFF;
}

#link-panel #link-container .link-block .overlay .overlay-content .overlay-text
{
  width:                100%;
  height:               15%;
  margin-top:           32%;
  margin-bottom:        10%;
  display:              inline-block;
}

#link-panel #link-container .link-block .overlay .overlay-content .overlay-button
{
  background-color:     #E7E0D8;
  color:                #9B4219;
  display:              inline-block;
}

#link-panel #link-container #link-block-01, #link-panel #link-container #link-block-03
{
  box-shadow:           10ex 0ex 0ex 15ex rgba(231,224,216,0.4);
  z-index:              500;
}

#link-panel #link-container #link-block-02
{
  z-index:              600;
}


#contact-panel
{
  width:                100%;
  position:             relative;
  display: inline-block;
}

#contact-panel #picture-container
{
  width:                60%;
  height:               100%;
  margin:               0vw;
  padding:              8% 0% 9% 0%;
  margin:               2% 0.2% 2% 4%;
  float:                left;
  overflow:             hidden;
  position:             relative;
  z-index:              1000;
}

#contact-panel #picture-container .picture
{
  float:                left;
  width:                90%;
  position:             relative;
}

#contact-panel #picture-container .picture img
{
  width:                100%;
  height:               auto;
  position:             relative;
  box-shadow:           -50ex -6ex 0vw 20ex rgba(231,224,216,0.4);
  z-index:              1000;
}

#contact-panel #picture-container .decoration
{
  float:                left;
  position:             relative;
  width:                0vw;
  height:               0vw;
  border:               1.2vw solid #9B4219;
  margin:               -1.2vw 0vw 0vw -1.2vw;
  z-index:              2000;
}

#contact-panel #text-container
{
  float:                right;
  position:             relative;
  width:                25%;
  margin:               10% 5% 10% 2vw;
}

#contact-panel #text-container p
{
  float:                right;
  text-align:           right;
  width:                90%;
  color:                #9A725C;
  font-size:            1em;
}
#contact-panel #text-container p strong
{
  color:                #734219;
}

#contact-panel #text-container .content-button
{
  float:                right;
  margin-top:           5%;
}

#contact-panel #decoration-01, #contact-panel #decoration-02
{
  position:             absolute;
  width:                15vw;
  height:               30vw;
  background-size:      contain;
  background-repeat:    no-repeat;
  z-index:              8000;
}

#contact-panel #decoration-01
{
  left:                 0vw;
  top:                  -5vw;
  background-image:     url('/assets/img/decoro-01.svg');
}

#contact-panel #decoration-02
{
  right:                0vw;
  bottom:               0vw;
  background-image:     url('/assets/img/decoro-02.svg');
}

#contact-panel #decoration-03
{
  position:             absolute;
  width:                1px;
  height:               70vw;
  left:                 50vw;
  bottom:               2vw;
  background-size:      contain;
  background-repeat:    no-repeat;
  background-color:     #9A725C;
  z-index:              100;
}


#showroom-panel, #brand-panel
{
  padding:              4% 4% 2vw 4%;
  position:             relative;
  display:              inline-block;
}
#showroom-panel .text-panel,
#showroom-panel .picture,
#brand-panel .text-panel,
#brand-panel .brand-logo
{
  width:                33%;
  padding:              0vw 0.15% 0.2% 0.15%;
  float:                left;
  position:             relative;
  z-index:              10;
}

#showroom-panel .picture img
{
  width:                100%;
}

#logo-panel
{
  overflow:             hidden;
}

#brand-panel .text-panel,
#brand-panel .brand-logo
{
  width:                22%;
  min-height:           10vw;
  max-height:           10vw;
  padding:              2vw 2vw 2vw 2vw;
}

#brand-panel .brand-logo img
{
  overflow:             hidden;
}

#brand-panel .brand-logo img
{
  max-width:            100%;
  min-width:            10vw;
  min-height:           10vw;
}

.shadow
{
  background-color:     rgba(231,224,216,0.4);
  width:                99%;
  height:               20vw;
  padding:              0% 0% 0% 0%;
  margin:               0vw 0.15vw 0vw -15vw;
  position:             absolute;
  z-index:              1;
}

.title .shadow
{
  width:                calc(33% * 0.92);
  right:                4.1%;
  margin-top:           -10vw;
}

.title .shadow .decoration
{
  position:             absolute;
  width:                0vw;
  height:               0vw;
  border:               0.5vw solid #9B4219;
  margin:               -0.5vw 0vw 0vw -0.5vw;
  top:                  0vw;
  left:                 0vw;
  z-index:              2000;
}

.text-container .shadow
{
  width:                99%;
  top:                  35vw;
  right:                0vw;
}


#prestige-panel
{
  width:                100vw;
  background-color:     #E7E0D8;
  margin-top:           -10.5vw;
  margin-bottom:        0.5vw;
  position:             relative;
/*
  display:              inline-block;
*/
  display:              flex;
  z-index:              1500;
}
/*
#prestige-panel::after
{
  content:              "";
  clear:                both;
}
*/

#prestige-panel #prestige-about
{
  padding:              4vw 4vw 3vw 4vw;
  width:                85vw;
  display:              inline-block;
  float:                right;
}
#prestige-panel #prestige-about p
{
  margin-bottom:        1vw;
}

#prestige-panel #prestige-monogram
{
  width:                14vw;
  float:                left;
  display:              inline-block;
  background:           url('/assets/img/monogramma.svg') #9B4219 no-repeat center;
  background-size:      contain;
}

#photo-panel
{
  width:                92vw;
  padding:              0vw 4vw 0vw 4vw;
  display:              inline-block;
  background-color:     rgba(231,224,216,0.4);
}

#photo-panel img
{
  width:                100%;
}


#presentation-panel .title-only
{
  margin-top:           5vw;
}

#side-panel
{
  width:                46vw;
  height:               25vw;
  margin:               0vw 4vw 1vw 0vw;
  float:                right;
}

#side-panel #side-box
{
  width:                100%;
  height:               100%;
  background-color:     rgba(231,224,216,0.4);
  position:             relative;
}

#side-panel #side-box .decoration
{
  position:             absolute;
  width:                0vw;
  height:               0vw;
  border:               0.5vw solid #9B4219;
  margin:               -0.5vw 0vw 0vw -0.5vw;
  bottom:               -0.5vw;
  right:                -0.5vw;
  z-index:              2000;
}

#contact-box-panel
{
  width:                92vw;
  margin:               0vw 4vw 0vw 4vw;
  display:              flex;
}

#contact-box-panel h2
{
  font-family:          'GaretBold';
  font-size:            1.1em;
  color:                #734219;
  letter-spacing:       0.1em;
  text-transform:       uppercase;
}

#contact-box-panel p
{
  color:                #9A725C;
  margin-bottom:        2vw;
  font-size:            1em;
}
#contact-box-panel p strong
{
  color:                #734219;
}

#contact-box-panel #contact-box-container
{
  display:              inline-block;
  position:             relative;
  width:                38vw;
  margin:               0vw 2.5vw 0vw 0.5vw;
  padding:              3vw 1vw 1vw 4vw;
  background-color:     rgba(231,224,216,0.4);
}

#contact-box-panel #contact-box-container #contact-box
{
  width:                100%;
  height:               100%;
  margin:               0vw 0vw 0vw 0vw;
  position:             relative;
  display:              inline-block;
}

#contact-box-panel #contact-box-container .decoration
{
  position:             absolute;
  width:                0vw;
  height:               0vw;
  border:               0.5vw solid #9B4219;
  margin:               -0.5vw 0vw 0vw -0.5vw;
  top:                  0vw;
  left:                 0vw;
  z-index:              2000;
}

#contact-box-panel #contact-form-container
{
  display:              inline-block;
  position:             relative;
  width:                46vw;
  margin:               0vw;
  padding:              0vw;
}

#contact-box-panel #contact-form-container #contact-form input,
#contact-box-panel #contact-form-container #contact-form textarea,
#contact-box-panel #contact-form-container #contact-form button
{
  font-family:          "GaretBook";
  font-size:            1em;
}

#contact-box-panel #contact-form-container #contact-form input,
#contact-box-panel #contact-form-container #contact-form textarea
{
  width:                100%;
  border:               2px solid #DDC2A9;
  display:              block;
  margin:               0.5vw 0vw 0.5vw 0vw;
  color:                #9A725C;
}
#contact-box-panel #contact-form-container #contact-form textarea
{
  resize:               none;
}

#contact-box-panel #contact-form-container #contact-form button
{
  margin-top:           1vw;
  float:                right;
}

#response-box
{
  float:                left;
  margin:               1vw 0vw 0.1vw 0vw;
  padding:              0.1vw 0.5vw 0.1vw 0.5vw;
  background-color:     rgba(231,224,216,0.4);
  color:                #734219;
  font-family:          'GaretBold';
  opacity:              0;
}
