/* -----------------------------------

VARIABLES

-------------------------------------*/
/* -----------------------------------

MAIN INFO

-------------------------------------*/
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box; }

html {
  background-color: #fff;
  color: #000;
  font-family: "Poppins";
  font-weight: 300;
  font-size: 15px;
  text-rendering: optimizeLegibility;
  scroll-behavior: smooth; }

.pointer {
  cursor: pointer; }

a,
a:hover {
  text-decoration: none; }

.hr-small {
  border: 0px;
  border-top: 2px solid #000;
  width: 100px; }

button:focus {
  outline: none; }

.bg-white {
  background-color: #fff; }

.bg-black {
  background-color: #121212; }

.text-black {
  color: #000; }

.uppercase {
  text-transform: uppercase; }

.logo {
  height: 60px; }

/* -----------------------------------

HEADINGS

-------------------------------------*/
@font-face {
  font-family: Droid;
  src: url(../DroidSerif-Regular.ttf); }
@font-face {
  font-family: English;
  src: url(../english-111-vivace-bt_[allfont.net].ttf); }
@font-face {
  font-family: Qaskin;
  src: url(../YouthTouchDemoRegular-4VwY.ttf); }
h1 {
  font-family: 'Italianno', cursive;
  font-size: 4rem; }

h2 {
  font-family: 'Italianno', cursive;
  font-size: 4rem; }

h3 {
  font-family: 'Playfair Display', serif;
  font-size: 2rem; }

h4 {
  font-family: 'Playfair Display', serif; }

h5 {
  font-family: 'Raleway', sans-serif;
  text-transform: uppercase;
  letter-spacing: 2px; }

p {
  font-family: 'Raleway', sans-serif;
  font-weight: 400;
  letter-spacing: 2px; }

.handwriting {
  font-family: 'Italianno', cursive; }

/* -----------------------------------

NAVBAR

-------------------------------------*/
.logo-main {
  width: 100px; }

.nav-link {
  font-family: 'Raleway', sans-serif;
  font-weight: 400;
  letter-spacing: 1px; }

.nav-link:hover,
.nav-link:active {
  color: #cbad77 !important;
  transition-duration: 0.5s; }

.navbar-hover-img {
  opacity: 0; }

.nav-link:hover .navbar-hover-img {
  opacity: 1;
  transition-duration: 0.5s; }

/* -----------------------------------

HEADER

-------------------------------------*/
#header-main {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  height: 70vh; }

#header-small {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  height: 40vh; }

/* -----------------------------------

FOOTER

-------------------------------------*/
/* -----------------------------------

BUTTONS

-------------------------------------*/
.btn {
  text-transform: uppercase;
  font-size: 0.9rem;
  letter-spacing: 2px; }

/* -----------------------------------

MODALS

-------------------------------------*/
.close {
  font-weight: 300;
  font-size: 2rem; }

/* -----------------------------------

OTHER

-------------------------------------*/
.bg-old {
  background: url(../img/bg-old-vertical.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover; }

.bg-old-vertical {
  background: url(../img/bg-old-vertical.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover; }

.bg-img {
  background: url(../img/Photos/bg-img.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover; }

.m-negative {
  margin-bottom: -50px;
  z-index: 1; }

.w-85 {
  width: 85%; }

.w-90 {
  width: 90%; }

.border-dot {
  border-bottom: 1px dotted #cbad77; }

.hr-primary {
  background-color: #cbae775e; }

.visible-md {
  visibility: hidden; }

.logo-big {
  height: 110px; }

.ornament-sm {
  transform: scale(0.7);
  -webkit-transform: scale(0.7);
  -moz-transform: scale(0.7);
  -ms-transform: scale(0.7);
  -o-transform: scale(0.7); }

.hidden {
  visibility: hidden; }

/* -----------------------------------

ANIMATIONS

-------------------------------------*/
.js--wp-1,
.js--wp-2,
.js--wp-3,
.js--wp-4,
.js--wp-5,
.js--wp-6,
.js--wp-7,
.js--wp-gl-1,
.js--wp-gl-2,
.js--wp-gl-3,
.js--wp-gl-4,
.js--wp-gl-5,
.js--wp-gl-6,
.js--wp-gl-7,
.js--wp-gl-8 {
  opacity: 0; }

.js--wp-1 .animated,
.js--wp-2 .animated,
.js--wp-3 .animated,
.js--wp-4 .animated,
.js--wp-5 .animated,
.js--wp-6 .animated,
.js--wp-7 .animated,
.js--wp-gl-1 .animated,
.js--wp-gl-2 .animated,
.js--wp-gl-3 .animated,
.js--wp-gl-4 .animated,
.js--wp-gl-5 .animated,
.js--wp-gl-6 .animated,
.js--wp-gl-7 .animated,
.js--wp-gl-8 .animated {
  opacity: 1;
  -webkit-animation-duration: 0.9s;
  animation-duration: 0.9s; }

.js--wp-1,
.js--wp-2 {
  -webkit-animation-delay: 0.3s;
  animation-delay: 0.3s; }

.js--wp-3 {
  -webkit-animation-delay: 0.5s;
  animation-delay: 0.5s; }

.js--wp-4 {
  -webkit-animation-delay: 0.8s;
  animation-delay: 0.8s; }

.js--wp-6 {
  -webkit-animation-delay: 0.2s;
  animation-delay: 0.2s; }

.js--wp-7 {
  -webkit-animation-delay: 0.5s;
  animation-delay: 0.5s; }

/* -----------------------------------

QUERIES

-------------------------------------*/
@media (min-width: 576px) {
  .w-sm-50 {
    width: 50% !important; }

  h1 {
    font-size: 5rem; }

  #header-main {
    height: 90vh; } }
@media (min-width: 768px) {
  .w-md-50 {
    width: 50% !important; }

  .w-md-75 {
    width: 75% !important; }

  .m-negative {
    margin-bottom: -100px;
    z-index: 1; }

  h2 {
    font-size: 5rem; }

  .bg-old {
    background: url(../img/bg-old.jpg); } }
@media (min-width: 992px) {
  .logo {
    height: 80px; }

  h1 {
    font-size: 7rem; } }
@media (min-width: 1200px) {
  .visible-md {
    visibility: visible; }

  .logo {
    height: 90px; }

  .w-xl-50 {
    width: 50% !important; } }
/* -----------------------------------

USEFUL

-------------------------------------*/
.img-container {
  position: relative; }
  .img-container::after {
    content: "";
    display: block;
    padding-bottom: 100%; }
  .img-container img {
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover; }

.img-container-col {
  position: relative;
  height: 100%; }
  .img-container-col::after {
    content: "";
    display: block;
    padding-bottom: 100%; }
  .img-container-col img {
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover; }

.hover-dark {
  background-color: transparent; }

.hover-dark:hover {
  background-color: rgba(0, 0, 0, 0.123); }

.anchor {
  padding-top: 100px;
  margin-top: -100px; }

.link-hover .link-icon-hover {
  color: #000; }

.link-hover:hover .link-icon-hover {
  color: #ff0000;
  transition-duration: 1s; }
