:root {
    --white: 253, 253, 253;
    --black: 30,30,30;

    --red: 175, 95, 83;
    --gold: 189, 153, 85;
    --gray: 244, 244, 245;
    --beige: 225, 218, 215;

    --accent-font: LiberationNarrow, sans-serif;
    --main-font: Liberation, sans-serif;

    --error-bg: rgb(var(--red));
    --error-color: #ff9595;
 }

 :root {
    --body-bg: rgb(var(--white));
    --loader-color: rgb(var(--gold));
    --loader-opacity: 0.5;
    --body-text: rgb(var(--black));

    --body-font: normal normal 16px/1.2 var(--main-font);
    --menu-font: normal normal 18px/1.2 var(--accent-font);
    --menu-slogan-font: normal normal 40px/1.1 var(--accent-font);
    --menu-slogan-padding: 0;

    --first-slogan-text: rgb(var(--black));
    --menu-case: uppercase;
    --menu-spacing: 10px;
    --header-font: normal normal 54px/0.9 var(--accent-font);
    --subheader-font: bold normal 25px/0.8 var(--accent-font);
    --subheader-case: uppercase;
    --accented-font: normal normal 50px/0.8 var(--accent-font);
    --button-font: bold normal 20px/1.2 var(--accent-font);
    --button-case: uppercase;
    --button-padding: 6px 20px 4px;
    --button-text: rgb(var(--gold));
    --button-hover-text: rgb(var(--red));
    --button-bg: transparent;
    --button-border: 0;
    --input-font: var(--main-font);

    --menu-text: rgb(var(--black));
    --menu-active: rgb(var(--red));
    --menu-item-radius: 0;
    --menu-bg: transparent;
    --menu-stuck-bg: rgb(var(--white));
    --menu-mobile-panel-bg: var(--menu-stuck-bg);
    --menu-mobile-bg: rgba(var(--beige),0.9);
    --menu-mobile-text: var(--menu-text);
    --menu-mobile-active: var(--menu-active);
    --menu-mobile-padding: 150px 20px 0 40px;
    --menu-mobile-inner-padding: 0;
    --menu-padding: 35px 0px 35px;
    --menu-inner-padding: 8px 12px 6px;
    --menu-toggle: rgb(var(--red));
    --menu-icon-text: rgb(var(--gold));
    --menu-icon-hover: rgb(var(--red));
    --menu-icon-bg: transparent;

    --mark-bg: rgba(var(--red),0.5);
    --mark-text: rgb(var(--white));

    --menu-toggle-height: 2px;

    --first-height: 91vh;
    --first-text: rgb(var(--black));
    --first-font: bold normal 78px/0.8 var(--accent-font);
    --first-case: uppercase;

    --first-plain-bg: rgba(var(--white),1);

    --inside-first-text: rgb(var(--red));
    --inside-first-font: var(--first-font);
    --inside-first-height: 400px;

    --first-button-text: transparent;
    --first-button-hover-text: transparent;
    --first-button-bg: url(/images/doublearrow.png) left/contain no-repeat;
    --first-button-hover-bg: var(--first-button-bg);

    --primary-bg: rgb(var(--white));
    --primary-text: rgb(var(--black));
    --primary-header: rgb(var(--red));
    --primary-subheader: rgb(var(--gold));
    --primary-button-hover-text: rgb(var(--white));
    --link-hover: rgb(var(--red));

    --accent-header: rgb(var(--red));

    --input-bg:rgba(var(--black),0.1);
    --input-text:rgb(var(--black));
    --label-text: rgba(var(--gold),1);

    --invert-bg: rgba(var(--beige),1);
    --invert-subheader: rgb(var(--white));
    --invert-header: rgb(var(--white));
    --invert-header-font: bold normal 54px/0.9 var(--accent-font);
    --invert-text: rgb(var(--white));
    --invert-button-bg: transparent;
    --invert-button-text: rgb(var(--white));
    --invert-button-hover-text: rgb(var(--red));
    --invert-button-border: 2px solid rgb(var(--white));
    --invert-button-hover-border: 2px solid rgb(var(--white));

    --input-radius: 0;
    --button-radius: 0;
    --block-radius: 0;
    --accent-radius: 0;
    --icon-radius: 0;
    --icon-hover: rgb(var(--gold));
    --icon-hover-bg: transparent;
    --loader-radius: 0;

    /*
    --first-before-bg: linear-gradient(to bottom, rgba(var(--white),1) 0px, transparent 200px);
    --image-before-bg: linear-gradient(135deg, rgba(var(--pink),0.2) 0px, rgba(var(--orange),0.3) 100%), linear-gradient(135deg, rgba(var(--white),0.8) 0px, rgba(var(--white),0.9) 100%); */
    --image-before-bg: linear-gradient(to right, rgba(var(--black),0.25) 0px, rgba(var(--black),0) 60%);

    --footer-font-size: 20px;
    --footer-text: rgba(var(--white),0.5);
    --footer-bg: rgb(var(--black));
    --footer-font: normal normal 14px/1.1 var(--main-font);
    --footer-padding: 10px 0 30px 0;
    --icon-text: rgba(var(--white),0.8);
    --icon-bg: transparent;
    --icon-hover-text: rgb(var(--gold));

    --logo-fixed: 50px;
    --logo-stuck: 50px;
    --logo-mobile: 50px;

    --accented-padding:  20px;
    --quote-bg: rgb(var(--white));
    --quote-padding: 20px 70px;
    --quote-border: 0;
    --quote-radius: 0;
    --quote-scroll-bg: transparent;
    --quote-color: rgba(var(--gold),0.5);

    --payment-success-padding: 35px 50px;

   --services-image: 200px;

   --totop-bg: rgba(var(--red),0.5);
   --totop-hover-bg: rgb(var(--gold),0.5);
   --totop-text: rgb(var(--white));

   --info-bg: rgb(var(--gray));
   --info-padding: 40px 40px 40px 40px;

   --snackbars-bg: rgb(var(--red));

 }

 @media(max-width:992px) {
   :root {
      --services-image: 150px;
      --inside-first-height: auto;
   }
   .bg-invert-accent h2, .bg-accent h2 {
      flex-direction: column;
   }
 }

 @media (max-width:768px) {
   :root {
      --first-shadow: 0 0 30px rgba(var(--purple),0.9), 0 0 10px rgba(var(--purple),0.6);
      --slick-arrow-offset: -40px;
      --menu-slogan-padding: 0;
   }
 }

 @media (max-width:496px) {
   :root {
      --first-font: bold normal 60px/0.8 var(--accent-font);
      --inside-first-font: normal normal 70px/0.9 var(--accent-font);
      --first-shadow: 0 0 30px rgba(var(--purple),1), 0 0 10px rgba(var(--purple),0.9);
      --owl-arrow-size: 30px;

   }
 }

@font-face {
   font-family: "Liberation";
   src:url(../fonts/user/LiberationSans-Regular.ttf);
   src:url(../fonts/user/LiberationSans-Regular.ttf)format("truetype");
   font-weight:400;
   font-style:normal
}

@font-face {
   font-family: "Liberation";
   src:url(../fonts/user/LiberationSans-Bold.ttf);
   src:url(../fonts/user/LiberationSans-Bold.ttf)format("truetype");
   font-weight:600;
   font-style:normal
}

@font-face {
   font-family: "Liberation";
   src:url(../fonts/user/LiberationSans-Italic.ttf);
   src:url(../fonts/user/LiberationSans-Italic.ttf)format("truetype");
   font-weight:400;
   font-style:italic
}

@font-face {
   font-family: "Liberation";
   src:url(../fonts/user/LiberationSans-BoldItalic.ttf);
   src:url(../fonts/user/LiberationSans-BoldItalic.ttf)format("truetype");
   font-weight:600;
   font-style:italic;
}

@font-face {
   font-family: "LiberationNarrow";
   src:url(../fonts/user/LiberationSansNarrow-Regular.ttf);
   src:url(../fonts/user/LiberationSansNarrow-Regular.ttf)format("truetype");
   font-weight:400;
   font-style:normal
}

@font-face {
   font-family: "LiberationNarrow";
   src:url(../fonts/user/LiberationSansNarrow-Bold.ttf);
   src:url(../fonts/user/LiberationSansNarrow-Bold.ttf)format("truetype");
   font-weight:600;
   font-style:normal
}

@font-face {
   font-family: "LiberationNarrow";
   src:url(../fonts/user/LiberationSansNarrow-Italic.ttf);
   src:url(../fonts/user/LiberationSansNarrow-Italic.ttf)format("truetype");
   font-weight:400;
   font-style:italic
}

@font-face {
   font-family: "LiberationNarrow";
   src:url(../fonts/user/LiberationSansNarrow-BoldItalic.ttf);
   src:url(../fonts/user/LiberationSansNarrow-BoldItalic.ttf)format("truetype");
   font-weight:600;
   font-style:italic;
}

.menu-button {
   border: 2px solid rgb(var(--red));
   position: absolute;
}

.rd-navbar-fixed .rd-navbar-nav {
   position: relative;
   padding-bottom: 30px;
}

.rd-navbar-static  .menu-button {
      right: 15px;
   }

.rd-navbar-static .rd-navbar-nav-wrap {
   padding-right: 170px;
   margin-left: -30px;
}

@media(min-width:1200px) {
   .rd-navbar-static .rd-navbar-nav-wrap {
      padding-right: 210px;
      margin-left: 0px;
   }

}

.rd-navbar-fixed .rd-navbar-element {
   position: relative;
   left: -5px;
}

.rd-navbar-fixed .menu-button {
   display: inline-block;
   bottom: -30px;
   left: -20px;
}

.menu-button> a {
   padding: var(--button-padding) !important;
   font-weight: bold !important;
}

.brand__slogan span {
   color: rgb(var(--red));
   display: inline-block;
   margin-right: -10px;
   font-weight: bold;
}

body {
   letter-spacing: 0.03em;
}

.brand__slogan {
   display: block !important;
}

.brand__logo-small, .brand__logo-large {
   display: none;
}

.rd-navbar-nav li.current>a {
   background: rgba(var(--red),1) !important;
   color: rgb(var(--white)) !important;
   font-weight: bold !important;
}

.rd-navbar-fixed .list-inline>li {
   padding-left: 0;
   padding-right: 0;
}

.rd-navbar-fixed li.current>a {
   display: inline-block;
   padding: var(--button-padding);
   position: relative;
   left: -20px;
   min-width: 150px;
}

.first-block {
   background-color: rgba(var(--beige));
}

.first-block mark {
   display: inline-block;
   padding: 10px;
   margin: 5px;
   margin-left: -10px;
}

.first-block .button {
   height: 50px;
}

.first-block .button:hover {
   opacity: 0.7;
}

mark:nth-of-type(2n+1) {
   background-color: rgba(var(--gold),0.5);
}

.bg-primary .infoblock, .bg-accent .infoblock {
   border: 2px solid rgb(var(--black));
   padding: 60px 70px;
}

@media(max-width: 468px) {
   .bg-primary .infoblock, .bg-accent .infoblock, #news .range {
      padding: 30px 35px;
   }
}

@media(min-width:768px) {

   .bg-accent .infoblock {
      display: flex;
      justify-content: space-between;
      
   }
   
   .bg-accent .infoblock h2 + .content {
      flex-basis: 66%;
      width: 66%;
   }
   
   .bg-accent .infoblock h2 {
      padding-right: 30px;
      width:  33%;
   }

}

.right-arrow {
   position: relative;
   top: -3px;
   left: 0;
   transition: left 0.3s ease-in-out;
}

.button:hover .right-arrow {
   left: 10px;
}

.bg-primary .button, .bg-accent .button {
   padding-left: 0 !important;
   padding-right: 0 !important;
   text-align: left;
   min-width: unset !important;
}

.post-info {
   transition: 0.3s;
}

#coaching_for_you .post-info {
   min-height: 220px;
}


#moments .post-info {
   min-height: 150px;
}

#areas .post-info {
   min-height: 80px;
   display: inline-flex;
   align-items: center;
}

@media(min-width:1200px) {

   #moments .post-info {
      min-height: 180px;
   }
   

}

.infoblock-has-image-top {
   position: relative;
}

.infoblock-has-image-top .post-info {
   padding-top: 70px !important;
}

.infoblock-image-top {
   margin: var(--info-padding);
   margin-top: 20px;
   position: absolute;
   left: 15px;
   top: 0;
   height: 40px;
}

.post-info:hover, .mark-click.clicked {
   background: rgb(var(--red));
}

.post-info:hover p, .mark-click.clicked p {
   color: rgb(var(--white));
}

#coaching_for_you .buttons-after {
   text-align: center;
   padding: var(--info-padding);
   border: 2px solid rgb(var(--black));
   margin-left: 15px;
   margin-right: 15px;
   min-height: 220px;
   display: inline-flex;
   justify-content: center;
   align-items: center;
   opacity: 0;
   animation: fadeInLeftSmall 0.5s forwards;
   animation-delay: 0.7s;
   flex-basis: calc(100% - 30px);
   width: calc(100% - 30px);
}

@media(min-width:768px) {
   #coaching_for_you .buttons-after {
      flex-basis: calc(50% - 30px);
      width: calc(50% - 30px);
   }
}

@media(min-width:992px) {
   #coaching_for_you .buttons-after {
      flex-basis: calc(33.33333% - 30px);
      width: calc(33.33333% - 30px);
   }
}

@media(min-width:1200px) {
   #coaching_for_you .buttons-after {
      flex-basis: calc(25% - 30px);
      width: calc(25% - 30px);
   }
}

.text-black {
   color: rgb(var(--black)) !important;
}

.text-faded {
   opacity: 0.5;
}

.bg-invert h2 {
   text-transform: uppercase;
   max-width: 70%;
}

@media(max-width:768px) {

   #book_you.bg-invert h2 {
      word-break: break-word;
   }

}

.button-ujarak {
	position: relative;
	z-index: 0;
	transition: background 0.4s .3s, border-color 0.4s, color 0.4s 0.05s;
}

.first-block .button-ujarak::before {
   display: none !important
}

.button-ujarak::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 101%;
	background: rgb(var(--white));
	z-index: -1;
	opacity: 0;
	transform: scale3d(0.7, 1, 1);
	transition: transform 0.42s, opacity 0.42s;
	border-radius: inherit;
}

.bg-primary .button-ujarak::before {
   background: rgb(var(--red));
}

.button-ujarak, .button-ujarak::before {
	transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
}

.button-ujarak:hover {
	transition: background 0.4s .3s, border-color 0.4s, color 0.4s;
}

.button-ujarak:hover::before {
	opacity: 1;
	transform: translate3d(0, 0, 0) scale3d(1, 1, 1);
}

@media(max-width:768px) {
   .first-block {
      background-position: 60% center;
   }
}

.inside-first-block {
   padding: 0 !important;
}

.inside-first-block + section {
   padding-top: 20px;
}

@media(min-width:992px) {
   .inside-first-block {
      display: inline-block;
      width: 25%;
      margin-top: 20px;
    }

   .inside-first-block * {
      display: inline-block !important;
      width: 100% !important;
   }
   
   .inside-first-block h1 {
      max-width: 250px !important;
      padding-left: 30px;
   }
   
   .inside-first-block .shell {
      min-width: unset !important;
      justify-content: flex-end;
      padding: 0 !important;
   }
   
   .inside-first-block + section {
      display: inline-block;
      width: 75%;
      position: relative;
      top: -100px;
      margin-bottom: -100px;
   }
}

@media(min-width:1230px) {

   #call form {
      margin-right: -15px;
   }

   .inside-first-block + section {
      width: calc(1200px*0.75);
      margin-bottom: -100px;
      position: relative;
      left: 15px;
   }

   .inside-first-block {
      width: calc(25% + calc(50% - 600px)/2);
   }

   .rd-navbar-static  .menu-button {
      right: 30px;
   }
}

@media(max-width:992px) {
   .inside-first-block {
      margin-top: calc(var(--logo-mobile) + 10px);
   }
}

.flex-first {
   display: flex !important;
   justify-content: flex-end;

}

.flex-first::before {
   display: none;
}

.bg-primary+.bg-primary {
   margin-top: 0 !important;
}

.bg-primary + .bg-accent {
   margin-top: -100px !important;
}

.bg-invert .post-info {
   background: rgba(var(--gold),0.85);
}

.bg-invert p:not(.heading-2) {
   background: linear-gradient(135deg, rgba(var(--black),0.9), rgba(var(--black),0.5));
   text-shadow: 0 0 15px rgba(var(--black),1);
   max-width: 70%;
   padding: 20px;
}

.bg-invert .post-info:hover {
   background: rgba(var(--red),0.85);
}

.bg-invert .post-info h2 {
   max-width: 100%;
}

@media(max-width:768px) {
   .bg-invert .post-info h2 {
      font-size: 40px;
   }  
}


.bg-invert .post-quote p {
   max-width: 100%;
   padding: 0;
   background: transparent;
   text-shadow: none;
   color: rgb(var(--black));
}

.infoblock-has-image-left {
   flex-direction: row !important;
}

.infoblock-image-left {
   outline: 1px solid rgba(var(--black),0.1);
   padding: 0;
}

#languages img {
   height: 30px;
}

#languages h2 {
   margin-bottom: 30px;
}

#languages h3 {
   margin-bottom: 10px;
}


#areas .post-info {
   padding: 20px !important;
}

#areas p {
   font-size: 20px;
   text-transform: uppercase;
   font-family: var(--accent-font);
   font-weight: bold;
   line-height: 0.9;
}

@media(max-width:500px) {
   .rd-navbar-fixed .rd-navbar-brand {
      left: 10px;
   }
}

.form-wrap .button, .bg-primary .form-button, .bg-accent .form-button {
   padding: var(--button-padding) !important;
   border: 2px solid rgb(var(--red));
   min-width: 150px !important;
   max-width: 200px !important;
   text-align: center;
   color: rgb(var(--black));
}

.bg-primary .form-button, .bg-accent .form-button {
   margin-left: -2px !important;
   max-width: 350px !important;
   min-width: 200px !important;
}

.footer-calendly {
   display: inline-flex;
   align-items: center;
}

.footer-calendly:before {
   content: "";
   width: 18px;
   height: 18px;
   display: inline-block;
   margin-right: 7px;
   background-image: url(/images/calendly.svg);
   background-size: contain;
   background-position: center center;
   position: relative;
   left: -3px;
}

p .fa:before {
   width: 25px;
   display: inline-block;
}


#feedback .range {
   align-items: center;
   margin-bottom: -60px;
}

@media(max-width:992px) {
   #feedback .heading-2 {
      padding-left: var(--owl-arrow-size, 70px);
      padding-right: calc(var(--owl-arrow-size, 70px) - 20px);
      margin-left: 0 !important;
   }
}

@media(min-width:992px) {
   #feedback .heading-2 {
      margin-top: -40px !important;
   }
}

.post-quote {
   display: flex;
   flex-direction: column;
   justify-content: center;
}

.post-boxed {
   padding: 0;
}

.reviews-image-wrapper {
   position: relative;
   display: inline-flex;
   background-color: rgb(var(--beige));
   cursor: zoom-in;
   margin-bottom: 20px;
}

.reviews-image-wrapper::before {
   content: "";
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background-color: rgba(var(--beige),0.5); 
   mix-blend-mode: multiply;
   z-index: 10;

}



@media(min-width:768px) {

   .reviews-image-wrapper {
      position: absolute;
      height: calc(100% - 50px);
      overflow: hidden;
      width: 150px;
      bottom: 25px;
      left: 25px;
      margin-bottom: 0px;
   }

   .reviews-image {
      object-fit: cover;
   }
   
   .post-quote:has(.reviews-image) {
      padding-left: 200px;
   }
   
   .post-quote:has(.reviews-image)::before {
      display: none;
   }

}

#news {
   margin-top: -70px;
}

#news .range div:first-child h2 {
   color: rgb(var(--red)) !important;
}

#news .range h3 {
   color: rgb(var(--black));
}

#news .range {
   margin-left: 0;
   margin-right: 0;
   border-color: transparent;
   background: rgb(var(--gray));
   padding: 45px 55px 70px;
}

@media(max-width: 468px) {
   #news .range {
      padding: 15px 20px 50px;
   }
}

#news .range div:not(:first-child)::before {
   content: "";
   width: 30px;
   height: 30px;
   background: url(/images/doublearrow.png);
   background-size: contain;
   transform: rotate(0deg);
   filter: invert(1);
   margin-bottom: 10px;
}


@media(min-width:768px) {

   #news .range div:not(:first-child)::before {
      /* margin-left: -10px;*/
   }

   #news .range div:first-child {
      position: absolute;
      left: 50px;
      width: calc(33% - 20px);
   }
   
   #news .range div:first-child h2 {
      margin-top: -10px !important;
   }
   
   #news .range {
      padding-left: calc(33% + 30px);
   }

}

.text-bold>a {
   font-weight: bold !important;
}