@import url('http://fonts.cdnfonts.com/css/chivo');
 *{
     margin: 0;
     padding: 0;
}
body {
    margin: 0;
    display: flex;
}
 .sidebar {
     height: 100%;
     width: 280px;
     z-index: 1;
     top: 0;
     left: 0;
     background-color: white;
     overflow-x: hidden;
     transition: 0.5s;
     padding: 0px 24px;
}
 .sidebar #Content-sidebar {
     display: all;
}
 .content-sidebar a {
     padding: 15px 5px;
     text-decoration: none;
     font-size: 16px;
     color: #422716;
     display: block;
     transition: 0.3s;
     font-family: 'Titillium Web';
     font-weight: 600;
     text-decoration: none;
}
 .content-sidebar a:hover{
     background-color:#E2DBD3;
     border-radius: 8px;
     text-decoration: none;
     color: #422716;
}
 .content-sidebar p {
     padding: 8px 8px 8px 5px;
     text-decoration: none;
     font-size: 12px;
     color: #1F140D;
     display: block;
     transition: 0.3s;
     margin: 0;
     font-family: chivo;
     font-weight: 400;
}
 .logo-row{
     display: flex;
     margin: 0px 0px;
     width: 100%;
     padding: 0 5px;
}
 .logo-row img{
     width: 194px;
     height: 32px;
     margin: 14px 0;
}
 .logo-row a {
     padding: 8px 8px 8px 20px;
     font-size: 25px;
     color: #818181;
     transition: 0.3s;
}
 .sidebar .close-button {
     font-size: 30px;
     margin-left: auto;
     text-decoration: none;
}
 .close-button {
     pointer-events: none;
     display: none;
}
 .close-button {
     font-size: 20px;
     cursor: pointer;
     color: white;
     padding: 10px 15px;
     border: none;
     margin-left: auto;
}
 a.close-button:hover {
     background-color: transparent;
     text-decoration: none;
     color: black;
}
 #main {
     right: 0;
     width: calc(100% - 270px);
     height: 100%;
     background-color: #FAF5F1;
     display: block;
}
 hr.line{
     border: 1px solid #422715;
     opacity: .1;
     margin: 0;
     margin-left: -25px;
     margin-right: -25px;
}
 div.navbar{
     display: flex;
     width: 95%;
     margin: auto;
     top: 0;
     padding: 16px;
     display: fixed;
     z-index: 10;
}
 .dropbtn {
     background-color: transparent;
     color: #422716;
     padding: 8px 16px 8px 16px ;
     font-size: 16px;
     border: 1px solid #E2DBD3;
     cursor: pointer;
     border-radius: 8px ;
}
 .dropdown {
     position: relative;
     display: inline-block;
}
 .dropdown-content {
     display: none;
     position: absolute;
     right: 0;
     background-color: #f9f9f9;
     min-width: 160px;
     box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
     z-index: 300;
}
 .dropdown-content a {
     color: black;
     padding: 12px 16px;
     text-decoration: none;
     display: block;
}
 .dropdown-content a:hover {
     background-color: #f1f1f1;
}
 .dropdown:hover .dropdown-content {
     display: block;
}
 .dropdown:hover .dropbtn {
     background-color: #fff;
}
 .navbar-hr{
     margin-top: 0px;
     margin-bottom: 0px;
     border: 1px solid #422715;
     opacity: .1;
}
 .content{
     background-image: url(/images/bg.svg);
     background-repeat: no-repeat;
     min-height: 80vh;
}
 .card-right-top{
     margin-top: -100px;
     display: block;
     height: auto;
     cursor: pointer;
     float: right;
     margin-right: 5%;
     background-color: transparent;
}
 .slider-box{
     display: block;
     width: 93%;
     height:580px ;
     margin: auto;
     background-color: transparent;
     margin-top: 30px;
}
 .top{
     width: 100%;
     height: auto;
     background-color: transparent;
     padding: 30px 0;
}
 .middle{
     width: 100%;
     height: 15%;
     background-color: white;
     display: block;
     border-radius: 8px 8px 0 0;
}
 .bottom{
     margin-top: -70px;
     width: 100%;
     height: auto;
     background-color: white;
     border-radius: 0 0 8px 8px;
     padding-bottom:40px;
}
 .inner-bottom{
     width: 95%;
     margin: auto;
     background-color: white;
     height: auto;
     padding-top: 50px;
}
 .inner-text-bottom{
     width: 95%;
     margin: auto;
     background-color: white;
     height: auto;
}
 .box{
     width: 176px;
     height: 200px;
     position: relative;
}
 .hex1 {
     width: 176px;
     height: 200px;
     display: inline-block;
     color:#422716;
     filter: url('#goo');
}
 .hex1::before {
     content: "";
     display: block;
     background:currentColor;
     padding-top: 115%;
    /* 100%*cos(30) */
     clip-path: polygon(0% 25%,0% 75%,50% 100%,100% 75%,100% 25%,50% 0%);
}
 .hex2{
     height: 188px;
     width: 164px;
     display: inline-block;
     position: absolute;
     top: 6px;
     left: 6px;
     color:#954989;
     filter: url('#goo');
}
 .hex2::before {
     content: "";
     display: block;
     background:currentColor;
     padding-top: 115%;
    /* 100%*cos(30) */
     clip-path: polygon(0% 25%,0% 70%,100% 70%,100% 75%,100% 25%,50% 0%);
}
 .hex3 {
     width: 176px;
     height: 200px;
     display: inline-block;
     color:#f9f5f1;
     filter: url('#goo');
}
 .hex3::before {
     content: "";
     display: block;
     background:currentColor;
     padding-top: 115%;
    /* 100%*cos(30) */
     clip-path: polygon(0% 25%,0% 75%,50% 100%,100% 75%,100% 25%,50% 0%);
}
 .hex4{
     height: 188px;
     width: 164px;
     display: inline-block;
     position: absolute;
     top: 6px;
     left: 6px;
     color:#fff;
     filter: url('#goo');
}
 .hex4::before {
     content: "";
     display: block;
     background:currentColor;
     padding-top: 115%;
    /* 100%*cos(30) */
     clip-path: polygon(0% 25%,0% 70%,100% 70%,100% 75%,100% 25%,50% 0%);
}
 .kocka-next{
     width: 100%;
     height: 5%;
     background-color: #f9f5f1;
     position: absolute;
     top: 70%;
}
 .kocka{
     width: 100%;
     height: 5%;
     background-color: #422716;
     position: absolute;
     top: 70%;
}
 .hex5 {
     width: 176px;
     height: 200px;
     display: inline-block;
     color:#f2ece6;
     filter: url('#goo');
}
.hex5withBorder {
    width: 176px;
    height: 200px;
    display: inline-block;
    color:#422716;
    filter: url('#goo');
}
 .hex5::before {
     content: "";
     display: block;
     background:currentColor;
     padding-top: 115%;
    /* 100%*cos(30) */
     clip-path: polygon(0% 25%,0% 75%,50% 100%,100% 75%,100% 25%,50% 0%);
}

.hex5withBorder::before {
    content: "";
    display: block;
    background:currentColor;
    padding-top: 115%;
   /* 100%*cos(30) */
    clip-path: polygon(0% 25%,0% 75%,50% 100%,100% 75%,100% 25%,50% 0%);
}
 .hex6{
     height: 188px;
     width: 164px;
     display: inline-block;
     position: absolute;
     top: 6px;
     left: 6px;
     color:#f9f5f1;
     filter: url('#goo');
}
 .hex6::before {
     content: "";
     display: block;
     background:currentColor;
     padding-top: 115%;
    /* 100%*cos(30) */
     clip-path: polygon(0% 25%,0% 70%,100% 70%,100% 75%,100% 25%,50% 0%);
}
 .true{
     width: 35px;
     height: 40px;
     position: absolute;
     top: 14px;
     left: 125px;
}
 .true-Sugestion-icon{
     width: 45px;
     height: 52px;
}
 .hex7 {
     position: absolute;
     width: 35px;
     height: 40px;
     display: inline-block;
     color:#f2ece6;
     filter: url('#goo1');
}
 .hex7::before {
     content: "";
     display: block;
     background:currentColor;
     padding-top: 115%;
    /* 100%*cos(30) */
     clip-path: polygon(0% 25%,0% 75%,50% 100%,100% 75%,100% 25%,50% 0%);
}

.hex7withBorder {
    position: absolute;
    width: 35px;
    height: 40px;
    display: inline-block;
    color:#422716;
    filter: url('#goo1');
}
.hex7withBorder::before {
    content: "";
    display: block;
    background:currentColor;
    padding-top: 115%;
   /* 100%*cos(30) */
    clip-path: polygon(0% 25%,0% 75%,50% 100%,100% 75%,100% 25%,50% 0%);
}
 .hex8 {
     position: absolute;
     width: 27px;
     height: 32px;
     top: 4px;
     left: 4px;
     display: inline-block;
     color:#954989;
     filter: url('#goo1');
     z-index: 10;
}
 .hex8::before {
     content: "";
     display: block;
     background:currentColor;
     padding-top: 115%;
    /* 100%*cos(30) */
     clip-path: polygon(0% 25%,0% 75%,50% 100%,100% 75%,100% 25%,50% 0%);
}
 .icon{
     z-index: 100;
     position: absolute;
     top: 50%;
     right: 50%;
     transform: translate(50%,-50%);
}
 .kocka-prev{
     width: 100%;
     height: 5%;
     background-color: #f2ece6;
     position: absolute;
     top: 70%;
}
 .hexagone-number{
     position: absolute;
     top: 35%;
     right: 50%;
     transform: translate(50%,-50%);
     z-index: 10;
     font-size:48px;
     font-weight: 600;
     font-family: 'Titillium Web';
}
 .hexagone-number-non-active{
     position: absolute;
     top: 40%;
     right: 50%;
     transform: translate(50%,-50%);
     z-index: 10;
     font-size:48px;
     font-weight: 600;
     font-family: 'Titillium Web';
}
 .hexagone-day-above-number{
     position: absolute;
     top: 55%;
     right: 50%;
     transform: translate(50%,-50%);
     z-index: 10;
     font-size:16px;
     font-weight: 400;
     font-family: chivo;
}
 .hexagone-currently{
     position: absolute;
     top: 80%;
     right: 50%;
     transform: translate(50%,-50%);
     z-index: 20;
     font-size:16px;
     font-weight: 400;
     font-family: chivo;
}
 .text-beige{
     color:#f9f5f1;
}
 .text-brown{
     color: #422716;
}
 .text-white{
     color:#fff;
}
 .set-size {
     font-size: 10em;
}
 .charts-container:after {
     clear: both;
     display: table;
}
 .pie-wrapper {
     height: 1em;
     width: 1em;
     float: left;
     margin: 15px;
     position: relative;
}
 .pie-wrapper:nth-child(3n + 1) {
     clear: both;
}
 .pie-wrapper .label {
     background: #34495e;
     border-radius: 50%;
     bottom: 0.4em;
     color: #ecf0f1;
     cursor: default;
     display: block;
     font-size: 0.25em;
     left: 0.4em;
     line-height: 2.8em;
     position: absolute;
     right: 0.4em;
     text-align: center;
     top: 0.4em;
}
 .pie-wrapper .label .smaller {
     color: #bdc3c7;
     font-size: 0.45em;
     padding-bottom: 20px;
     vertical-align: super;
}
 .pie-wrapper--solid {
     border-radius: 50%;
     overflow: hidden;
}
 .pie-wrapper--solid:before {
     border-radius: 0 100% 100% 0 / 50%;
     content: '';
     display: block;
     height: 100%;
     margin-left: 50%;
     transform-origin: left;
}
 .pie-wrapper--solid .label {
     background: transparent;
}
 .pie-wrapper--solid.progress-88 {
     background: linear-gradient(to right, green 50%, yellow 50%);
}
 .pie-wrapper--solid.progress-88:before {
     background: orange;
     transform: rotate(136.8deg);
}
 .hextemp {
     width: 176px;
     height: 200px;
     display: inline-block;
     color:#F9F5F1;
     filter: url('#goo');
}
 .hextemp::before {
     content: "";
     display: block;
     background:currentColor;
     padding-top: 115%;
    /* 100%*cos(30) */
     clip-path: polygon(0% 25%,0% 75%,50% 100%,100% 75%,100% 25%,50% 0%);
}
 .hextemp1{
     height: 188px;
     width: 164px;
     display: inline-block;
     position: absolute;
     top: 7px;
     left: 6px;
     color:transparent;
     filter: url('#goo');
     z-index: 0;
     overflow: hidden;
     clip-path: polygon(0% 25%,0% 75%,50% 100%,100% 75%,100% 25%,50% 0%);
}
 .hextemp1::before {
     content: "";
     display: block;
     background:currentColor;
     padding-top: 115%;
    /* 100%*cos(30) */
     clip-path: polygon(0% 25%,0% 75%,50% 100%,100% 75%,100% 25%,50% 0%);
     overflow: hidden;
     box-shadow: 5px 10px #888888;
}
 .hextemp2{
     height: 188px;
     width: 164px;
     display: inline-block;
     position: absolute;
     top: 7px;
     left: 6px;
     color:#F9F5F1;
     filter: url('#goo');
     z-index: 0;
     overflow: hidden;
     clip-path: polygon(0% 25%,0% 75%,50% 100%,100% 75%,100% 25%,50% 0%);
}
 .hextemp2::before {
     content: "";
     display: block;
     background:currentColor;
     padding-top: 115%;
    /* 100%*cos(30) */
     clip-path: polygon(0% 25%,0% 75%,50% 100%,100% 75%,100% 25%,50% 0%);
     overflow: hidden;
     transform: scale(.9, .9);
}
 .hextemp3{
     height: 188px;
     width: 164px;
     display: inline-block;
     position: absolute;
     top: 7px;
     left: 6px;
     color:white;
     filter: url('#goo');
     z-index: 0;
     overflow: hidden;
     clip-path: polygon(0% 25%,0% 75%,50% 100%,100% 75%,100% 25%,50% 0%);
}
 .hextemp3::before {
     content: "";
     display: block;
     background:currentColor;
     padding-top: 115%;
    /* 100%*cos(30) */
     clip-path: polygon(0% 25%,0% 75%,50% 100%,100% 75%,100% 25%,50% 0%);
     overflow: hidden;
     transform: scale(.8, .8);
}
 .text-box {
     width: 100%;
     position: absolute;
     top: 50%;
     right: 50%;
     transform: translate(50%,-50%);
     z-index: 0;
}
 .progress-number{
     font-family: 'Titillium Web';
     font-size: 48px;
     line-height: 52px;
     font-weight: 700;
     margin: 0;
     margin-bottom: 10px;
     text-align: center;
}
 .progress-text{
     font-family: chivo;
     font-size:14px;
     line-height: 18px;
     font-weight: 400;
     margin: 0;
     text-align: center;
}
 @keyframes growProgressBar {
     0%, 33% {
         --pgPercentage: 0;
    }
     100% {
         --pgPercentage: var(--value);
    }
}
 @property --pgPercentage {
     syntax: '<number>';
     inherits: false;
     initial-value: 0;
}
 div[role="progressbar"] {
     --size: 184px;
     --fg: #954989;
     --bg: #F2ECE6ff;
     --pgPercentage: var(--value);
     animation: growProgressBar 3s 1 forwards;
     width: var(--size);
     height: var(--size);
     border-radius: 50%;
     display: grid;
     place-items: center;
     background: radial-gradient(closest-side, transparent 0 99.9%), conic-gradient(var(--fg) calc(var(--pgPercentage) * 1.66666667%), var(--bg) 0) ;
     font-family: 'Titillium Web';
     font-size: calc(var(--size) / 5);
     color: var(--fg);
}
 div[role="progressbar"]::before {
     counter-reset: percentage var(--value);
     content: counter(percentage) '%';
}
 .progress{
     margin-top: -186.5px;
     margin-left: -10px;
}
 .sugestion-box{
     width: 93%;
     height: auto;
     background-color: #fff;
     margin: auto;
     border-radius: 8px;
     padding: 24px;
     margin-bottom: 100px;
}
 .sugestion-top{
     display: flex;
}
 .true-Sugestion-icon{
     width: 45px;
     height: 52px;
}
 .hexSug {
     position: absolute;
     width: 45px;
     height: 52px;
     display: inline-block;
     color:#954989;
     filter: url('#goo1');
}
 .hexSug::before {
     content: "";
     display: block;
     background:currentColor;
     padding-top: 115%;
    /* 100%*cos(30) */
     clip-path: polygon(0% 25%,0% 75%,50% 100%,100% 75%,100% 25%,50% 0%);
}
 .hexSug1 {
     position: relative;
     width: 41px;
     height: 48px;
     top: 2px;
     left: 2px;
     display: inline-block;
     color:#e4d2e1;
     filter: url('#goo1');
     z-index: 0;
}
 .hexSug1::before {
     content: "";
     display: block;
     background:currentColor;
     padding-top: 115%;
    /* 100%*cos(30) */
     clip-path: polygon(0% 25%,0% 75%,50% 100%,100% 75%,100% 25%,50% 0%);
}
 .hex-sug-text{
     position: relative;
     top: -42px;
     z-index: 0;
     text-align: center;
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 20px;
     line-height: 28px;
}
 .sug-text{
     display: block;
     padding-left: 26px;
}
 .subtitle{
     display: flex;
     justify-content: space-between;
}
 p.info{
     margin: 0 16px 0 0px;
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 400x;
     font-size: 16px;
     line-height: 18px;
     color: #8e7d73;
}
 ul.list{
     margin-left: 30px;
}
 .normal{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 400;
     font-size: 16px;
     line-height: 20px;
     color: rgba(31, 20, 13, 0.6);
}
.normal1{
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    color: #422716;
}
 .singleDay__smallText{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 400;
     font-size: 18px;
     line-height: 28px;
     color: #422716;
     opacity: 0.6;
}
 .singleDay__middleText{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 24px;
     line-height: 32px;
     color: #422716;
}
 .title-recept{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 20px;
     line-height: 28px;
     color: #422716;
}
 .button-check-program{
     padding:9px 18px ;
     background-color:#954989 ;
     border-radius: 8px;
     border: none;
     color: white;
}
 .button-check-program:hover{
     padding:8px 17px ;
     background-color:#fff ;
     border-radius: 8px;
     border: 2px solid #954989;
     transition: .2s;
     color: #000;
}
 a.check-program{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 16px;
     line-height: 24px;
     color: #fff;
}
 a.check-program:hover{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 16px;
     line-height: 24px;
     color: #000;
     text-decoration: none;
}
 .gm-text{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 32px;
     line-height: 48px;
     color: #422716;
}
 .gm-subtitle{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 400;
     font-size: 16px;
     line-height: 24px;
     color: #422716;
}
 .icon-size{
     width: 30px;
     margin-right: 10px;
}
 .mt-1{
     padding: 7px 0 0 0 ;
     margin: 0;
}
.truePrev1{
    width: 35px;
    height: 40px;
    position: absolute;
    top: 50%;
    left: -3%;
}
.trueNext1{
    width: 35px;
    height: 40px;
    position: absolute;
    top: 50%;
    right: -3%;
}
 .margin-top30px{
     margin-top: 30px;
}
 .truePrev{
     width: 35px;
     height: 40px;
     position: absolute;
     top: 35%;
     left: -4.5%;
}
 .trueNext{
     width: 35px;
     height: 40px;
     position: absolute;
     top: 35%;
     right: -4.5%;
}
 .hexprev {
     position: absolute;
     width: 50px;
     height: 60px;
     display: inline-block;
     color:#f2ece6;
     filter: url('#goo1');
     clip-path: polygon(0% 25%,0% 75%,50% 100%,100% 75%,100% 25%,50% 0%);
}
 .hexprev::before {
     content: "";
     display: block;
     background:currentColor;
     padding-top: 115%;
    /* 100%*cos(30) */
}
 .hexprev1 {
     position: absolute;
     width: 45px;
     height: 55px;
     top: 2.5px;
     left: 2.5px;
     display: inline-block;
     color:#f4b900;
     filter: url('#goo1');
     z-index: 10;
}
 .hexprev1::before {
     content: "";
     display: block;
     background:currentColor;
     padding-top: 115%;
    /* 100%*cos(30) */
     clip-path: polygon(0% 25%,0% 75%,50% 100%,100% 75%,100% 25%,50% 0%);
}
 .icon{
     z-index: 100;
     position: absolute;
     top: 50%;
     right: 50%;
     transform: translate(50%,-50%);
}
 .hex {
     position: relative;
     margin: auto;
     width: 30px;
     height: 50px;
     border-radius: 5px;
     background: white;
     transition: opacity .5s;
}
 .hex:before, .hex:after {
     position: absolute;
     width: inherit;
     height: inherit;
     border-radius: inherit;
     background: inherit;
     content: '';
}
 .hex:before {
     -webkit-transform: rotate(60deg);
     transform: rotate(60deg);
}
 .hex:after {
     -webkit-transform: rotate(-60deg);
     transform: rotate(-60deg);
}
 .hexP {
     position: absolute;
     top: 0px;
     left: 2.5px;
     width: 30px;
     height: 50px;
     border-radius: 5px;
     background: #eee9e4;
     transition: opacity .5s;
     transform: scale(.85,.85);
}
 .hexP:before, .hexP:after {
     position: absolute;
     width: inherit;
     height: inherit;
     border-radius: inherit;
     background: inherit;
     content: '';
}
 .hexP:before {
     -webkit-transform: rotate(60deg);
     transform: rotate(60deg);
}
 .hexP:after {
     -webkit-transform: rotate(-60deg);
     transform: rotate(-60deg);
}
 .textSliderButton{
     position: absolute;
     top: 60%;
     left: 50%;
     transform: translate(-50%,-50%);
}
 .footer{
    width: 93%;
    padding: 30px 0;
    display: flex;
    margin: auto;
    position: relative;
    bottom: 0;
}
 .footer1{
    width: 93%;
    padding: 30px 0;
    display: flex;
    margin: auto;
    position:absolute;
    bottom: 0;
    left: 3.5%;
}
 .footer__left{
     display: flex;
}
 .space-right15px{
     margin-right: 25px;
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 400;
     font-size: 16px;
     line-height: 24px;
     color: rgba(66, 39, 22, 0.6);
}
 a.space-right15px{
     text-decoration: none;
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 16px;
     line-height: 24px;
     color: #422716;
}
 .footer__right{
     margin-left: auto;
     display: flex;
}
 .footer__icons {
     margin-left: 15px;
}
/* Ask Expert for Q&A start */
 .accordion {
     background-color: #fff;
     color: #444;
     cursor: pointer;
     padding: 18px;
     width: 100%;
     border: none;
     text-align: left;
     outline: none;
     font-size: 15px;
     transition: 0.4s;
     margin: 0px 0;
     border-radius: 8px;
}
 .active {
     background-color: #e5d3dc;
     border-radius: 8px 8px 0 0;
     border-bottom: 1px solid #eee ;
     color: #954989;

}
 .accordion:hover {
     background-color: #e5d3dc;
     color: #954989;
}
 .accordion:after {
     content: '\002B';
     color: #351602;
     font-weight: bold;
     float: right;
     margin-left: 5px;
}
 .active:after {
     content: "\2212";
}
 .panel-accordion {
     padding: 0px 20px;
     background-color: #e5d3dc;
     max-height: 0;
     overflow: hidden;
     transition: max-height 0.2s ease-out;
     border: 0;
     border-radius: 0 0 8px 8px;
}
 .padding-y16{
     padding: 16px 0;
     width: 60%;
     color: #954989;
}
 .width45prc{
     width: 45%;
}

.width45prc2{
    width: 45%;
    margin: auto;
}
 .faq-content{
     width: 93%;
     margin: auto;
     background-color: transparent;
     height: auto;
     margin-top: 45px;
     margin-bottom: 40px;
}
 .faq-content__middle{
     margin-top: 40px;
}
 .faq-content__middle__accordion{
     margin-top: 12px;
}
 .faq-content__bottom__contactForm{
     margin-top: 40px;
}
 input[type=text], select {
     width: 100%;
     padding: 12px 20px;
     margin: 8px 0;
     display: block;
     border: 1px solid #ccc;
     border-radius: 4px;
     box-sizing: border-box;
}
 input[type=submit] {
     width: auto;
     background-color: #f4b900;
     color: #422716;
     padding: 12px 18px;
     margin: 8px 0;
     border: none;
     border-radius: 8px;
     cursor: pointer;
     float: right;
}
 select#country{
     width: 100%;
     margin: 9px 0;
     border: 1px solid #E1DCDA;
     border-radius: 8px;
}
 input#title.normal{
     height: 45px;
     border: 1px solid #E1DCDA;
     border-radius: 8px;
}
 input[type=submit]:hover {
     background-color: #f4b900;
}
 .form__question{
     display: flex;
     width: 100%;
}
 .form__question_item1{
     display: block;
     width: 48%;
     margin-right: 2%;
}
 .form__question_item{
     display: block;
     width: 50%;
}
 .form__question__textarea{
     display: block;
     margin-top: 20px;
}
 textarea#areatext{
     width: 100%;
     margin: 8px 0;
     border: 1px solid #E1DCDA;
     border-radius: 8px;
     padding: 16px 20px;
}
 textarea:focus, input:focus{
     outline: none;
}
 form{
     margin-bottom: 100px;
}
 .noneMobile{
     display: all;
}
 .no-decoration{
     text-decoration: none;
     font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 600;
    font-size: 14px;
    line-height: 20px;
    color: #351602;
    opacity: 0.6;
}
 .no-decoration:hover{
     text-decoration: none;
     color: #422716;
}
 .singleDay_image{
     background:url(images/singleDay.png);
     opacity: 1;
     height: 400px;
     background-position: center;
     background-repeat: no-repeat;
     background-size: cover;
}
 .overlay{
     position: absolute;
     background-color: black;
     height: 400px;
     opacity: 0.5;
     width: -webkit-fill-available;
     max-width: 1400px;
}
 .content__singleDay{
     width: 93%;
     margin: auto;
     background-color: #fff;
     height: auto;
     margin-top: -48px;
     border-radius: 8px;
     padding: 32px;
     position: relative;
}
 .singleDay_text-img{
     display: flex;
}
 .singleDay__left{
     display: block;
     width: 55%;
}
 .singleDay__right{
     width: 45%;
}
 img.shema{
     width: 80%;
     margin-left: 10%;
}
 .singleDay__image__content{
     width: 93%;
     margin: auto;
     top: 60%;
     left: 0;
     display: flex;
     position: relative;
}
 .singleDay__text{
     display: block;
     padding-left: 26px;
}
 .singleDay__image__content__text{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 32px;
     line-height: 48px;
    /* identical to box height, or 150% */
     margin-left: 15px;
     margin-top: -60px;
     color: #FFFFFF;
}
 .singleDay__image__content__icon{
     margin-right: 20px;
}
 .singleDay__icon__title{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 32px;
     line-height: 48px;
     display: flex;
     align-items: center;
     color: #FFFFFF;
}
 .singleDay__icon__text{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 400;
     font-size: 16px;
     line-height: 24px;
     color: #FFFFFF;
     margin-right: 15px;
}
 .singleDay__video{
     margin: 40px 0;
     border-radius: 8px;
}
.video__imported{
    border-radius: 8px;
}
 .sugestion__content__main{
     display: flex;
}
 .sugestion__content__left{
     width: 60%;
     height: auto;
}
 .sugestion__content__right{
     width: 40%;
     padding: 0 3%;
     /* background-image: url("<%= elm.acf.image %>");
     background-position: center center;
     background-size: cover;
     background-repeat: no-repeat; */
}
.sugestion__content__right__img{
    width: 100%;
    height: 100%;
    min-height: 300px;
    border-radius: 8px;
}
.sugestion__content__right__img2{
    width: 100%;
    min-height: 300px;
    height: 100%;
    border-radius: 8px;
}
 .sugestion__content__right img{
     border-radius: 8px;
     width: auto;
     max-width: 400px;
     height: 300px;
     margin: auto;
     margin-left: calc((100% - 400px)/2);
}
 .player {
     border-radius: 8px;
     max-height: 600px;
     height: auto;
     width: 100%;
     position: relative;
}
 video{
     border-radius: 5px;
     height: auto;
     width: 100%;
}
 .controls {
     opacity: 0.4;
     transition: 1s all;
     display: flex;
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
}
 button.play{
     background-color: transparent;
     background-image: url(./images/pocni.svg);
}
 button.stop{
     background-color: transparent;
     background-image: url(images/stop.svg);
}
 .player:hover .controls, player:focus .controls {
     opacity: 1;
}
 button {
     border: 0;
}
 @media only screen and (max-width: 1092px) {
     .sugestion__content__left{
         width: 50%;
    }
     .sugestion__content__right{
         width: 50%;
         padding-top: 50px;
    }
}
 @media only screen and (max-width: 735px) {
     .middle{
         display: none;
    }
     .bottom {
         margin-top: 0px;
         padding-top: 20px;
         border-radius: 8px;
    }
     .subtitle{
         display: block;
    }
     .none{
         display: none;
    }
     p.info{
         margin-bottom: 5px;
    }
     .gm-text{
         font-family: 'Titillium Web';
         font-style: normal;
         font-weight: 600;
         font-size: 28px;
         line-height: 40px;
         color: #422716;
    }
}
 @media only screen and (max-width: 992px) {
    .singleDay__icon__title{
        font-family: 'Titillium Web';
        font-style: normal;
        font-weight: 600;
        font-size: 25px;
        line-height: 35px;
        display: flex;
        align-items: center;
        color: #FFFFFF;
   }
     body {
         display: block;
    }
     #main {
         width: 100%;
         background-color: #FAF5F1;
    }
     div.navbar{
         display: none;
    }
     .inner-bottom {
         width: 100%;
         height: auto;
         margin-bottom: 50px;
    }
     .sidebar {
         height: auto;
         width: 100%;
         overflow: hidden;
         background-color: #faf5f1;
         position: fixed;
         z-index: 100;
    }
     .sidebar #Content-sidebar {
         display: none;
    }
     .sidebar .close-button {
         font-size: 30px;
         margin-left: auto;
         text-decoration: none;
    }
     .close-button {
         font-size: 20px;
         cursor: pointer;
         color: white;
         padding: 10px 15px;
         border: none;
         margin-left: auto;
    }
     a.close-button:hover {
         background-color: transparent;
         text-decoration: none;
         color: black;
    }
     .truePrev{
         margin-top: 30px;
         width: 35px;
         height: 40px;
         position: absolute;
         top: 100%;
         left: 30%;
    }
     .trueNext{
         margin-top: 30px;
         width: 35px;
         height: 40px;
         position: absolute;
         top: 100%;
         right: 30%;
    }
    .truePrev1{
        margin-top: 30px;
        width: 35px;
        height: 40px;
        position: absolute;
        top: 100%;
        left: 30%;
   }
    .trueNext1{
        margin-top: 30px;
        width: 35px;
        height: 40px;
        position: absolute;
        top: 100%;
        right: 30%;
   }
     .content-sidebar{
         background-color: white;
         margin-left: -26px;
         padding-left: 26px;
         margin-right: -26px;
         padding-right: 26px;
         padding-bottom: 30px;
         border-bottom: 2px solid #432715 ;
    }
     .slider-box{
         height:630px ;
    }
     .content{
         padding-top: 60px;
    }
    .content1{
        padding-top: 0px;
   }
     .sugestion-box{
         margin-top: 30px;
    }
     .close-button {
         pointer-events:all;
         display: block;
    }
     .footer{
         width: 93%;
         padding: 30px 0;
         display: block;
         margin: auto;
    }
    .footer1{
        width: 93%;
        padding: 30px 0;
        display: block;
        margin: auto;
   }
     .footer__left{
         display: block;
         text-align: center;
         margin-bottom: 20px;
    }
     .footer__right{
         margin: auto;
         width: 228px;
         padding-bottom: 30px;
         padding-top: 15px;
    }
     .footer__icons {
         margin:auto;
    }
     .form__question{
         display: block;
         width: 100%;
    }
     .form__question_item1{
         display: block;
         width: 100%;
    }
     .form__question_item{
         display: block;
         width: 100%;
    }
     .width45prc{
         width: 100%;
    }

    .width45prc2{
        width: 100%;
    }
     .noneMobile{
         display: none;
    }
     .singleDay_text-img{
         display: block;
    }
     .singleDay__left{
         display: block;
         width: 100%;
    }
     .singleDay__right{
         width: 100%;
    }
     .singleDay__image__content{
         top: 55%;
    }
     .sugestion__content__main{
         display: block;
         margin: 30px 0;
    }
     .sugestion__content__left{
         width: 100%;
    }
     .sugestion__content__right{
         width: 100%;
    }
}
/* Meet Our team CSS */
 .meetOurTeam__box{
     display: block;
     width: 93%;
     margin: auto;
     margin-top: 30px;
     margin-bottom: 30px;
}
 .meetOurTeam__box__bottom{
     display: grid;
     grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
     grid-gap: 25px;
     align-items: center;
     margin: 32px 0 48px 0;
}
 .card__expert {
     box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
     width: 270px;
     max-width: 300px;
     margin: auto;
     text-align: center;
     font-family: arial;
     padding: 20px ;
     background-color: white;
     border-radius: 8px;
}
 .card-title {
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 16px;
     line-height: 24px;
     text-align: center;
     color: #422716;
     margin-top: 20px;
}
 button.card__expert-button {
     border: none;
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 16px;
     line-height: 24px;
    /* identical to box height, or 150% */
     text-align: center;
     color: #422716;
     background-color: transparent;
}
.card__expert-button1{
    border: none;
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
   /* identical to box height, or 150% */
    text-align: center;
    color: #422716;
    background-color: transparent;
    display: flex;
}
 .card__expert__img{
     width: 90px;
     height: 90px;
     border-radius: 50%;
}
 a {
     text-decoration: none;
     font-size: 22px;
     color: black;
}
 button:hover, a:hover {
     opacity: 0.7;
}
 hr.card-hr{
     margin-left: -20px;
     margin-right: -20px;
     margin-top: 20px;
}
/* Meet Our team CSS KRAJ */
/* All RECIPES CSS */
 .card__component__box{
     display: grid;
     grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
     grid-gap: 25px;
     align-items: center;
     margin: 32px 0 48px 0;
}
 .card__component{
     width: 340px;
     height: 270px;
     border-radius: 8px;
     background-color: white;
     display: none;
     margin: auto;
}
 .card__component__image__box{
     position: relative;
     height: 60%;
}
 .card__component__img{
     width: 100%;
     height: 100%;
     border-radius: 8px 8px 0 0 ;
     filter:brightness(65%) ;
     opacity: .9;
}
 .card__component__icon__number{
     position: absolute;
     top: 20px;
     left: 20px;
}
 .card__component__icon__play{
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%,-50%);
}
 .card__component__info{
     padding: 16px 20px;
}
 .card__component__number{
     position: absolute;
     top: 30px;
     left: 29px;
     color: #FDFBF9;
     z-index: 1;
}
 .card__component__title{
     font-family: 'Titillium Web';
     font-style: bold;
     font-weight: bold;
     font-size: 16px;
     line-height: 24px;
    /* or 150% */
     color: #422716;
}
 .card__component__text{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 400;
     font-size: 14px;
     line-height: 20px;
     color: #422716;
}
 .card__component__img__locked{
     width: 100%;
     height: 100%;
     border-radius: 8px 8px 0 0 ;
     filter:brightness(20%) ;
     opacity: .9;
}
 .card__component__icon__locked{
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%,-50%);
     border-radius: 8px 8px 0 0;
     opacity: .8;
}
 .card__component__meal__info, .card__component__meal__ingridients, .card__component__meal__time{
     display: flex;
     margin-top: 10px;
     margin-right: 20px;
}
 .card__component__meal__ingridients__text{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 400;
     font-size: 14px;
     line-height: 20px;
     margin: auto;
}
/* NOVA KARTICA COUPONS */
 .card__component__box__promotional{
     display: grid;
     grid-template-columns: repeat(auto-fill, minmax(370px, 1fr));
     grid-gap: 20px;
     align-items: center;
     margin: 32px 0 48px 0;
}
 .card__component__promotional{
     width: 370px;
     height: 300px;
     border-radius: 8px;
     background-color: white;
     display: none;
     margin: auto;
}
 .card__component__image__box__promotional{
     position: relative;
     height: 180px;
     width: 96%;
     padding-top: 2%;
     margin: auto;
}
 .card__component__img__promotional{
     width: 100%;
     height: 100%;
     border-radius: 8px 8px 0 0 ;
     opacity: 1;
}
 .card__component__info__promotional{
     padding: 16px 20px;
}
 .card__component__number__promotional{
     position: absolute;
     top: 30px;
     left: 29px;
     color: #FDFBF9;
     z-index: 1;
}
 .card__component__title__promotional{
     font-family: 'Titillium Web';
     font-style: bold;
     font-weight: bold;
     font-size: 18px;
     line-height: 24px;
    /* or 150% */
     color: #422716;
}
 .card__component__text__promotional{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 400;
     font-size: 14px;
     line-height: 20px;
     color: #422716;
}
 .card__component__img__locked__promotional{
     width: 100%;
     height: 100%;
     border-radius: 8px 8px 0 0 ;
     filter:brightness(10%) ;
     opacity: .9;
}
 .card__component__icon__locked__promotional{
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%,-50%);
     border-radius: 8px 8px 0 0;
     opacity: .8;
}
 .card__component__meal__info__promotional, .card__component__meal__ingridients__promotional, .card__component__meal__time__promotional{
     display: flex;
     margin-top: 10px;
     margin-right: 20px;
}
 .card__component__meal__ingridients__text__promotional{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 400;
     font-size: 14px;
     line-height: 20px;
     margin: auto auto auto 10px;
}
/* ZAKLJUCANE KARTICE */
 @media screen and (max-width: 992px) {
     .card__component__promotional{
         width: 340px;
         height: 300px;
         border-radius: 8px;
         background-color: white;
         display: none;
         margin: auto;
    }
}
/* KRAJ KARTICE COUPONS */
 #loadMore {
     width: 200px;
     display: block;
     text-align: center;
     margin: 20px auto;
     padding: 9px 24px;
     border-radius: 10px;
     border: 1px solid transparent;
     background-color: #e2dbd3;
     transition: .3s;
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 16px;
     line-height: 24px;
    /* identical to box height, or 150% */
     text-align: center;
     color: #422716;
}
 #loadMore:hover {
     color: #422716;
     background-color: #e2dbd3;
     border: 1px solid #e2dbd3;
     text-decoration: none;
}
 .noContent {
     color: #000 !important;
     background-color: transparent !important;
     pointer-events: none;
     text-decoration: none;
}
 #loadMorePromotional {
     width: 150px;
     display: block;
     text-align: center;
     margin: 20px auto;
     padding: 9px 24px;
     border-radius: 10px;
     border: 1px solid transparent;
     background-color: #e2dbd3;
     transition: .3s;
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 16px;
     line-height: 24px;
    /* identical to box height, or 150% */
     text-align: center;
     color: #422716;
}
 #loadMorePromotional:hover {
     color: #422716;
     background-color: #e2dbd3;
     border: 1px solid #e2dbd3;
     text-decoration: none;
}
/* All RECIPES CSS KRAJ */
/* Meet Our team CSS */
 .card__content__testimonials__box{
     display: grid;
     grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
     grid-gap: 25px;
     align-items: center;
     margin: 32px 0 48px 0;
}
 .card__testimonials {
     box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
     width: 340px;
     max-width: 340px;
     margin: auto;
     text-align: center;
     font-family: arial;
     padding: 20px ;
     background-color: white;
     border-radius: 8px;
}
 .card__testimonials__img{
     width: 90px;
     height: 90px;
     border-radius: 50%;
}
 .rating {
     width: auto;
     margin: 12px 0;
}
 .checked {
     color: #FFD800;
}
 .card-title {
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 16px;
     line-height: 24px;
     text-align: center;
     color: #422716;
     margin-top: 20px;
}
 button.card__testimonials__button {
     border: none;
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 16px;
     line-height: 24px;
    /* identical to box height, or 150% */
     text-align: center;
     color: #422716;
     background-color: transparent;
}
 a {
     text-decoration: none;
     font-size: 22px;
     color: black;
}
 button:hover, a:hover {
     opacity: 0.7;
}
/* Meet Our team CSS KRAJ */
/* POCETAK NAVBAR LANDING PAGE */
 .body__landing__page{
     background-color:#F9F5F1;
     display: block;
}
 .topnav {
     background-color: #f9f5f1;
     overflow: hidden;
     width: 100%;
     margin: auto;
     height: 70px;
     display: flex;
     justify-content: space-between;
     padding: 16px 10%;
     z-index: 100;
     position: fixed;
     top: -1px;
     border-bottom: 1px solid #eee;
}
 .topnav.scrolled {
     background-color: #f9f5f1 !important;
     transition: background-color 200ms linear;
     width: 100%;
     padding-left: 10%;
     padding-right: 10%;
     top: 0px;
     left: 0%;
     z-index: 100000;
}
 .topnav__logo{
     margin: 7px 0;
}
 .topnav__content{
     justify-content: space-between;
     padding: 10px;
}
 .topnav__content__items {
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 14px;
     line-height: 20px;
     align-items: center;
     color: #422716;
     padding: 0px 16px 0 16px;
     text-decoration: none;
}
 .topnav__content__items:hover {
     background-color: #E2DBD3;
     color: black;
     padding: 10px 16px;
     border-radius: 8px;
     text-decoration: none;
}
.topnav__content__go__back, .topnav__content__go__back:hover{
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 600;
    font-size: 14px;
    line-height: 20px;
    color: #351602;
    opacity: 0.6;
    text-decoration:none;
}
.topnav__content__item__purple {
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 600;
    font-size: 14px;
    line-height: 20px;
    align-items: center;
    color: #964A8B;
    padding: 0px 16px 0 16px;
    text-decoration: none;
}
.topnav__content__item__purple:hover {
    background-color: #E2DBD3;
    color: #964A8B;
    padding: 10px 16px;
    border-radius: 8px;
    text-decoration: none;
}
 .topnav__join__small{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 400;
     font-size: 12px;
     line-height: 18px;
     text-align: right;
     color: #422614;
     opacity: 0.6;
     margin: 0;
}
 .topnav__join__bigger{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 14px;
     line-height: 20px;
     text-align: right;
     color: #422614;
     margin: 0;
}
.topnav__join__bigger__mobile, .topnav__join__bigger__mobile:hover{
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 600;
    font-size: 21px;
    line-height: 27px;
    text-align: right;
    color: #964A8B;
    margin: 0;
    text-decoration: none;
}
 .topnav__join__small:hover{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 400;
     font-size: 12px;
     line-height: 18px;
     text-align: right;
     color: #422614;
     opacity: 0.6;
     margin: 0;
     text-decoration: none;
}
 .topnav__join__bigger:hover{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 14px;
     line-height: 20px;
     text-align: right;
     color: #422614;
     margin: 0;
     text-decoration: none;
}
 .topnav__join__normal{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 400;
     font-size: 14px;
     line-height: 20px;
     text-align: right;
     color: #422614;
     margin: 0;
}
 .topnav__icon{
     display: none;
}
/* KRAJ NAVBAR LANDING PAGE */
/* POCETAK LANDIN PAGE */
 .first__container__landing__page{
     width: 100%;
     min-height: 100vh;
     height: auto;
     display: flex;
     background-color: #FAF5F1;
     overflow: hidden;
     position: relative;
}
 .first__container__landing__page__inner__box{
     width: 80%;
     min-height: 450px;
     height: auto;
     background-color: transparent;
     padding: 12% 10%;
     display: flex;
}
 .first__container__landing__page__inner__box__left{
     width: 60%;
     height: auto;
     min-height: 450px;
     background-color: transparent;
}
 .first__container__landing__page__inner__box__right{
     width: 40%;
     height: auto;
     min-height: 450px;
     background-color: transparent;
}
 .first__container__landing__page__flower{
     position:absolute;
     left:0px;
     bottom: 0;
}
 .first__container__landing__page__hexagons{
     position: absolute;
     right: 0%;
     top: 0%;
     overflow: hidden;
}
 .first__container__landing__page__inner__box__right__image{
     position: relative;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
}
 .first__container__landing__page__inner__box__left__title{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 56px;
     line-height: 64px;
     color: #422716;
}
 .first__container__landing__page__inner__box__left__text{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 400;
     font-size: 20px;
     line-height: 32px;
     color: #422716;
     opacity: 0.6;
}
 .first__container__landing__page__inner__box__left__buttons{
     display: flex;
     position: relative;
}
 .first__container__landing__page__inner__box__left__choose__button{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 16px;
     line-height: 24px;
     color: #422716;
}
 .first__container__landing__page__inner__box__left__buttons{
     display: flex;
}
 .first__container__landing__page__inner__box__left__buttons__button{
     padding:12px 26px;
     background-color: #e2dbd3;
     border-radius: 8px;
     margin-right: 10px;
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 700;
     font-size: 16px;
     line-height: 24px;
     text-align: center;
     color: #000;
     text-decoration: none;
}
 .first__container__landing__page__inner__box__left__buttons__button:hover{
     text-decoration: none;
}
 .second__container__landing__page{
     width: 100%;
     min-height: 100vh;
     height: auto;
     display: flex;
     display: relative;
     background-color: white;
}
 .second__container__landing__page__right{
     width: 50%;
     background-color: transparent;
     height: auto;
     position: relative;
}
 .second__container__landing__page__left{
     width: 50%;
     min-height: 400px;
     height: auto;
     background-color: transparent;
     position: relative;
}
 .second__container__landing__page__macbook{
     position: relative;
     top: 55%;
     left: 0%;
     transform: translate(-0%, -50%);
}
 .second__container__landing__page__right__inner{
     position: relative;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
     padding-right: 15%;
     padding-left: 5%;
}
 .second__container__landing__page__right__inner__button{
     padding:12px 26px;
     background-color: #964A8B;
     border-radius: 8px;
     margin-right: 10px;
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 700;
     font-size: 16px;
     line-height: 24px;
     text-align: center;
     color: #fff;
     text-decoration: none;
}
 .second__container__landing__page__right__inner__button:hover{
     text-decoration: none;
     color: #fff;
     transition: .5s;
     background-color: #964A8B;
     opacity: .9;
}
.second__container__landing__page__right__inner__button:focus{
    text-decoration: none;
    color: #fff;
    transition: .5s;
    background-color: #964A8B;
    opacity: .9;
}
.second__container__landing__page__right__inner__button:active{
    text-decoration: none;
    color: #fff;
    transition: .5s;
    background-color: #964A8B;
    opacity: .9;
}
 .third__container__landing__page{
     width: 100%;
     min-height: 100vh;
     height: auto;
     background-color: #FAF5F1;
     padding-top: 10%;
     position: relative;
}
 .third__container__landing__page__hexagon__down__left{
     position: absolute;
     left: 0px;
     top: 5%;
}
 .third__container__landing__page__inner__box{
     width: 80%;
     height: auto;
     background-color: transparent;
     display: block;
     opacity: 10000;
     position: relative;
     margin: auto;
}

 .third__container__landing__page__inner__box__top{
     background-color: transparent;
     width: 100%;
     min-height: 180px;
     height: auto;
     padding: 15px 0;
     background-color: transparent;
}
 .third__container__landing__page__inner__box__top__title{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 40px;
     line-height: 56px;
     color: #422716;
}
 .third__container__landing__page__inner__box__top__subtitle{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 400;
     font-size: 16px;
     line-height: 24px;
     color: #422716;
     opacity: 0.6;
}
 .fourth__container__landing__page{
     background-color: white;
     width: 100%;
     height: 100vh;
     position: relative;
     padding-top: 10%;
}
 .fourth__container__landing__page__inner__box{
     width: 90%;
     margin: 0 0 0 10%;
     background-color: transparent;
     height: auto;
     display:flex;
     position: relative;
}
 .fourth__container__landing__page__inner__box__left{
     width: auto;
     height: auto;
     background-color: transparent;
     padding-right: 5%;
     padding-top: 5%;
     position: relative;
}
 .fourth__container__landing__page__inner__box__right{
     width: auto;
     height: auto;
     background-color: transparent;
     text-align: right;
     position: relative;
}
 .fourth__container__landing__page__inner__box__left__title{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 40px;
     line-height: 56px;
     color: #422716;
}
 span.purple{
     color: #964A8B;
}
 .fourth__container__landing__page__inner__box__left__subtitle{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 400;
     font-size: 16px;
     line-height: 24px;
    /* or 150% */
     color: #422716;
     opacity: 0.6;
     width: 70%;
     margin-top: 30px;
}
 .image__landing__woman{
     width: auto;
     height: auto;
     /* float: right; */
}
 .fifth__container__landing__page{
     background-color: #F9F5F1;
     width: 100%;
     height: 100vh;
     position: relative;
}
 .fifth__container__landing__page__grana{
     position: absolute;
     top: 0;
     right: 0;
}
 .fifth__container__landing__page__inner{
     position: relative;
     top: 10%;
     width: 80%;
     margin: auto;
     background-color: transparent;
     text-align: center;
}
 .testimonials__card{
     width: 100%;
     max-width: 1000px;
     margin: auto;
     height: auto;
     background-color: transparent;
     display: flex;
}
 .testimonials__card__left{
     width: 40%;
     background-color: transparent;
}
 .testimonials__card__right{
     text-align: left;
     padding: 5%;
}
 .testimonials__card__left__image{
     width: 320px;
     height: 320px;
     border-radius: 50%;
     margin: auto;
}
 .fifth__container__landing__page__inner__top__title{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 40px;
     line-height: 56px;
     text-align: center;
     color: #422716;
}
 .fifth__container__landing__page__inner__top__subitle{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 400;
     font-size: 16px;
     line-height: 24px;
     text-align: center;
     color: #422716;
     opacity: 0.6;
     width: 50%;
     margin: auto;
}
 .fifth__container__landing__page__inner__bottom{
     margin: 7% 0;
}
 .testimonials__card__right{
     text-align: left;
}
 .testimonials__card__right__name{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 32px;
     line-height: 48px;
     color: #422716;
}
 .testimonials__card__right__job{
     font-family: 'Chivo';
     font-style: normal;
     font-weight: 400;
     font-size: 16px;
     line-height: 24px;
     color: #422716;
}
 .testimonials__card__right__text{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 400;
     font-size: 20px;
     line-height: 32px;
     color: #422716;
     opacity: 0.6;
     padding: 0 20px;
}
 .sixth__container__landing__page{
     width: 100%;
     height: 100vh;
     background-color:#F9F5F1;
     position: relative;
     overflow: hidden;
}
 .sixth__container__landing__page__bg__hexagon{
     position: absolute;
     right: 2%;
     bottom: 2%;
}
 .sixth__container__landing__page__inner{
     width: 80%;
     height: auto;
     background-color: white;
     position: relative;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
     padding: 5%;
     display: flex;
     justify-content: space-between;
}
 .sixth__container__landing__page__inner__left{
     width: 50%;
     height: auto;
     background-color: transparent;
}
 .sixth__container__landing__page__inner__right{
     width: 45%;
     height: auto;
     background-color: transparent;
}
 .sixth__container__landing__page__inner__right__image{
     float: right;
     width: 100%;
     overflow: hidden;
}
 .form__landing__page__nameandsurname{
     display: flex;
}
 .form__landing__page__name{
     display: block;
     width: 48%;
}
 input#fname, input#lname{
     width: 100%;
     padding: 5px 10px;
     font-family: 'Chivo';
     font-style: normal;
     font-weight: 400;
     font-size: 14px;
     line-height: 17px;
}
 input#date, input#email{
     padding: 5px 10px;
     font-family: 'Chivo';
     font-style: normal;
     font-weight: 400;
     font-size: 14px;
     line-height: 17px;
}
.input[type="date"]{
    padding: 5px 10px;
    font-family: 'Chivo';
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 17px;
    -webkit-appearance: none;
    -moz-appearance: none;
}
 .form__landing__page__button {
     padding: 12px 18px;
     background-color:#964A8B ;
     border-radius: 8px;
     float: right;
     margin-top: 30px;
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 16px;
     line-height: 24px;
     color: #fff;
     flex: none;
     order: 0;
     flex-grow: 0;
}
 .form__landing__page__button:hover {
     padding: 12px 18px;
     background-color:#964A8B ;
     border-radius: 8px;
     float: right;
     margin-top: 30px;
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 16px;
     line-height: 24px;
     color: #fff;
     flex: none;
     order: 0;
     flex-grow: 0;
     opacity: 1;
     text-decoration: none;
}
 .form__landing__page__title{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 40px;
     line-height: 56px;
     color: #422716;
}
 .form__landing__page__text{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 400;
     font-size: 16px;
     line-height: 24px;
     color: #964A8B;
     opacity: 0.6;
}
 label{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 14px;
     line-height: 24px;
     color: #422716;
     flex: none;
     order: 0;
     flex-grow: 0;
     margin-top: 10px;
}
/* KRAJ LANDING PAGE */
 .survey__all__content{
     display: block;
     width: 100%;
     min-height: 100vh;
     background-color: #F9F5F1;
}
 .navbar__survey{
     display: flex;
     width: 100%;
     height:70px;
     padding: 15px 10%;
     background-color: #F9F5F1;
}
 .navbar__survey__left{
     padding-top: 7px;
     width: 33.33%;
}
.navbar__survey__left1{
    padding-top: 7px;
    width: 33.33%;
}
 .navbar__survey__middle{
     text-align: center;
     padding-top: 5px;
     width: 33.33% 
}
.navbar__survey__middle1{
    text-align: center;
    padding-top: 5px;
    width: 33.33%;
    float: center;
}
 .navbar__survey__bottom{
     width: 33.33%;
}
 .survey__content{
     min-height: 100vh;
     width: 100%;
     background-color: transparent;
}
 .survey__left__bg{
     position: relative;
     top: 5%;
}
 .survey__right__bg{
     position: absolute;
     bottom: 5%;
     right: 0;
}
 .survey__content__center{
     width: 60%;
     height: 600px;
     background-color: transparent;
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
     text-align: center;
     padding: 5%;
     display:block;
}
 .question{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 400;
     font-size: 40px;
     line-height: 56px;
     text-align: center;
     color: #422716;
     flex: none;
     order: 0;
     flex-grow: 0;
}
 .survey__content__center__info{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 400;
     font-size: 16px;
     line-height: 24px;
     text-align: center;
     color: #422716;
     opacity: 0.6;
     flex: none;
     order: 1;
     flex-grow: 0;
}
 .question__answer__buttons{
     height: auto;
     background-color: transparent;
     display: block;
     padding: 20px;
     text-align: center;
}
 .question_answer{
     width: 300px;
     text-decoration: none;
     padding: 12px;
     background-color: transparent;
     border: 1px solid #E2DBD3;
     border-radius: 8px;
     display: block;
     text-align: center;
     margin: 10px auto;
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 16px;
     line-height: 24px;
    /* identical to box height, or 150% */
     text-align: center;
     color: #422716;
}
 .question_answer:hover{
     width: 300px;
     text-decoration: none;
     padding: 12px;
     background-color: #E2DBD3;
     border: 1px solid #E2DBD3;
     border-radius: 8px;
     display: block;
     text-align: center;
     margin: 10px auto;
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 16px;
     line-height: 24px;
    /* identical to box height, or 150% */
     text-align: center;
     color: #422716;
}
 @media screen and (max-width: 992px) {
     .topnav {
         width: 100%;
         margin: 0;
         padding: 16px 0;
         z-index: 10000;
         position: fixed;
         display: block;
         left: 0%;
         top: -1px;
         overflow: visible;
    }
     .topnav.scrolled {
         padding-left: 0%;
         padding-right: 0%;
         top: -1px;
         left: 0%;
         padding: 16px 0;
    }
     .topnav__logo{
         margin: 7px 0;
         padding: 0 16px;
    }
     .topnav__content{
         margin-top: 15px;
         justify-content: none;
         padding: 30px;
         display: none;
         background-color: white;
         width: 100%;
         text-align: center;
         height: auto;
         border-bottom: 1px solid #ccc;
    }
     .topnav__content__items {
         display: block;
         text-align: center;
         font-family: 'Titillium Web';
         font-style: normal;
         font-weight: 600;
         font-size: 18px;
         line-height: 30px;
         align-items: center;
         color: #422716;
         padding: 10px 0;
         text-decoration: none;
    }
     .topnav__join{
         display: none;
    }
     .topnav__icon{
         display: block;
         position: absolute;
         right: 40px;
         top: 35px;
    }
     .navbar__survey__left{
         width: 25%;
    }
     .navbar__survey__left{
         width: 50%;
    }
     .navbar__survey__middle{
         display: none;
    }
    .navbar__survey__middle1{
        display: all;
   }
     .navbar__survey__bottom{
         width: 50%;
    }
     .survey__content__center{
         width:100%;
    }
     .survey__right__bg{
         display: none;
    }
     .question{
         font-family: 'Titillium Web';
         font-style: normal;
         font-weight: 400;
         font-size: 33px;
         line-height: 45px;
         text-align: center;
         color: #422716;
         flex: none;
         order: 0;
         flex-grow: 0;
         margin-top: 30px;
    }
     .first__container__landing__page{
         width: 100%;
         min-height: 100vh;
         height: auto;
         padding: 100px 0;
         position: relative;
    }
     .first__container__landing__page__inner__box{
         width: 90%;
         height: auto;
         top: 0;
         left: 0;
         margin: auto;
         transform: none;
         display: block;
    }
     .first__container__landing__page__inner__box__left{
         width: 100%;
         height: auto;
         padding: 20px;
         margin-bottom: 50px;
         position: relative;
    }
     .first__container__landing__page__inner__box__right{
         width: 100%;
         height: auto;
         position: relative;
    }
     .first__container__landing__page__inner__box__right__image{
         position: absolute;
         top: 50%;
         left: 50%;
         margin: auto;
    }
     .first__container__landing__page__inner__box__left__buttons{
         display: block;
    }
     .first__container__landing__page__inner__box__left__title{
         font-family: 'Titillium Web';
         font-style: normal;
         font-weight: 600;
         font-size: 44px;
         line-height: 48px;
         color: #422716;
    }
     .first__container__landing__page__flower{
         position:0;
         left:0px;
         bottom: 0;
         display: none;
    }
     .second__container__landing__page{
         width: 100%;
         min-height: auto;
         height: auto;
         position: relative;
         display: block;
    }
     .second__container__landing__page__left{
         display: none;
    }
     .second__container__landing__page__right{
         width: 100%;
         min-height: 100vh;
         height: auto;
         position: relative;
         margin-bottom: 50px;
    }
     .second__container__landing__page__right__inner{
         position: absolute;
         top: 50%;
         left: 0%;
         transform: translate(-0%, -50%);
         padding-right: 0%;
         padding: 10%;
    }
     .third__container__landing__page{
         width: 100%;
         min-height: 100vh;
         height: auto;
         background-color: #FAF5F1;
         position: relative;
    }
     .fourth__container__landing__page{
         width: 100%;
         height: auto;
         background-color: white;
         padding-bottom: 50px;
    }
     .fourth__container__landing__page__inner__box{
         width: 80%;
         margin: 0%;
         display: block;
    }
     .fourth__container__landing__page__inner__box__left{
         width: auto;
         height: auto;
         background-color: transparent;
         padding-right: 5%;
         padding-top: 0%;
    }
     .fourth__container__landing__page__inner__box__right{
         text-align: center;
         margin: 10% 0;
    }
     .image__landing__woman{
         width: 100%;
         height: auto;
    }
     .fourth__container__landing__page__inner__box__left__subtitle{
         width: 100%;
         margin-top: 30px;
    }
     .fifth__container__landing__page{
         height: auto;
         position: relative;
         padding: 15% 0;
    }
     .testimonials__card{
         display: block;
    }
     .testimonials__card__left__image{
         width: 300px;
         height: 300px;
         border-radius: 50%;
         text-align: center;
         margin: auto;

    }
     .fifth__container__landing__page__inner__top__subitle{
         width: 100%;
    }
     .testimonials__card__right{
         width: 100%;
         text-align: center;
    }
     .testimonials__card__left{
         width: 100%;
    }
     .sixth__container__landing__page {
         width: 100%;
         min-height: 120vh;
         background-color: #F9F5F1;
         position: relative;
         overflow: hidden;
         margin-bottom: 40px;
    }
     .sixth__container__landing__page__inner__left{
         width: 100%;
         min-height: auto;
         background-color: transparent;
    }
     .sixth__container__landing__page__inner__right{
         display: none;
    }
     .sixth__container__landing__page__inner__right__image{
         float: right;
         width: 100%;
         overflow: hidden;
         margin-top: 30px;
    }
     .form__landing__page__nameandsurname{
         display: block;
         justify-content: space-between;
    }
     .form__landing__page__name{
         display: block;
         width: 100%;
    }
}
 .register__container{
     display: flex;
     margin: 0;
     padding: 0;
     box-sizing: border-box;
     width: 100%;
     height: auto;
     min-height: 100vh;
}
 .register__container__left{
     width: 40%;
     background-color: white;
     height: auto;
     display: block;
     padding: 3% 5%;
     text-align: center;
}
 .register__container__left__logo{
     width: 190px;
     height: 60px;
     margin: auto;
}
 .register__container__left__title{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 40px;
     line-height: 65px;
     color: #422716;
     margin-top: 10px;
}
 .register__container__left__text{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 400;
     font-size: 18px;
     line-height: 28px;
     text-align: center;
     color: rgba(66, 39, 22, 0.6);
}
 span{
     font-weight: 600;
     color: rgba(66, 39, 22, 1);
}
 .nameANDsurname{
     display: flex;
}
 .name{
     width: 48%;
}
 .surname{
     width: 48%;
}
 label{
     float: left;
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 14px;
     line-height: 24px;
     color: #422716;
}
 input{
     font-family: 'Chivo';
     font-style: normal;
     font-weight: 400;
     font-size: 14px;
     line-height: 17px;
     color: #9D9D9D;
}
 .registerbtn{
     width: 100%;
     background-color: #954989;
     padding: 9px 40%;
     border-radius: 8px;
     margin-top: 10px;
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 16px;
     line-height: 24px;
     color: #fff;
}
 .register__container__right{
     width: 60%;
     height: auto;
     overflow: hidden;
     padding: 7% 4% 7% 4%;
     position: relative;
     background-image:  linear-gradient( rgb(227, 227, 227, .1), rgb(255, 255, 255, 1)), url(/images/01_Invitation.png);
     background-repeat: no-repeat;
     background-size: cover;
     background-position: right;
    }
 .register__container__right__bg{
     position: absolute;
     top: 100px;
     left: -90px;
}
 .register__container__right__macbook{
     position: absolute;
     right: -7%;
     bottom: -10%;
}
 .register__container__right__macbook__login{
     position: absolute;
     right: -7%;
     bottom: -10%;
}
 .register__testimonials__info{
     z-index: 100;
     position: absolute;
     left: 64px;
     right: 64px;
     bottom: 10%;
}
 .register__testimonial{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 32px;
     line-height: 48px;
     color: #422716;
}
 .register__person{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 20px;
     line-height: 30px;
     color: #422716;
}
 .register__job{
     font-family: 'Chivo';
     font-style: normal;
     font-weight: 400;
     font-size: 16px;
     line-height: 24px;
     color: #422716;
     opacity: 0.6;
}
 .register__testimonials__person__info{
     display: flex;
     justify-content: space-between;
     padding-right: 64px;
     margin-top: 30px;
}
 p.href-text{
     width: 100%;
     text-align: center;
     border-bottom: 1px solid #000;
     line-height: 0.1em;
     margin: 10px 0 20px;
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 400;
     font-size: 16px;
     color: rgba(31, 20, 13, 0.6);
}
 span.href-text {
     background:#fff;
     padding:0 10px;
}
 .sign-in__buttons{
     display: flex;
     width: 100%;
     justify-content: space-between;
}
 .sign-in__buttons__google, .sign-in__buttons__fb{
     width: 47%;
}
 .google.btn, .fb.btn{
     width: 48%;
     padding: 9px auto;
     background-color:#E2DBD3 ;
     width: 100%;
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 16px;
     line-height: 24px;
     text-align: center;
     color: #422716;
}
 @media screen and (max-width: 992px) {
     .register__container{
         display: block;
         height: auto;
    }
     .register__container__left{
         width: 100%;
         background-color: white;
         height: 100vh;
         padding: 5% 5%;
    }
     .register__container__right{
         display: none;
    }
     .google.btn, .fb.btn{
         padding: 9px auto;
    }
}
 @media screen and (max-width: 1350px) {
     .sign-in__buttons{
         display: block;
    }
     .google.btn, .fb.btn{
         width: 100%;
    }
     .sign-in__buttons__google, .sign-in__buttons__fb{
         width: 100%;
         margin-top: 15px;
    }
}
 @media screen and (max-width: 1700px) {
     .register__container__right__macbook__login{
         position: absolute;
         right: -8%;
         bottom: -35%;
    }
}
 .single__promotion__coupon__box{
     width: 93%;
     height: auto;
     margin: auto;
     margin-top: 40px;
     margin-bottom: 30px;
     background-color: white;
     padding: 20px;
     border-radius: 8px;
}
 .single__promotion__coupon__box__image__box{
     width: 100%;
     height: auto;
     max-height: 500px;
     overflow: hidden;
     border-radius: 8px;
}
 .single__promotion__coupon__box__image{
     width: 100%;
     height: auto;
     border-radius: 8px;
}
 .single__promotion__coupon__box__title{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 32px;
     line-height: 48px;
     color: #422716;
}
 .single__promotion__coupon__box__text{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 400;
     font-size: 18px;
     line-height: 28px;
    /* or 156% */
     color: #422716;
     opacity: 0.6;
}
 .single__promotion__coupon__box__inputANDbutton{
     display: flex;
     width: 100%;
}
 .input__copy{
     position: relative;
     width: 100%;
}
 .copyButton{
     position: absolute;
     top: 25px;
     right: 20px;
     background-color: transparent;
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 16px;
     line-height: 24px;
     color: #422716;
     flex: none;
     order: 0;
     flex-grow: 0;
}
.copyButton2{
    position: absolute;
    top: 7px;
    right: 20px;
    background-color: transparent;
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    color: #422716;
    flex: none;
    order: 0;
    flex-grow: 0;
}
 .labelANDinput{
     display: block;
     width: 80%;
}
 .copyINPUT{
     width: 80%;
}
 .label__promotion__coupon{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 16px;
     line-height: 24px;
     color: #422716;
     flex: none;
     order: 0;
     flex-grow: 0;
}
 .single__promotion__coupon__button,.single__promotion__coupon__button:hover,.single__promotion__coupon__button:active {
     padding: 12px 18px;
     background-color:#964A8B ;
     border-radius: 8px;
     height: 48px;
     margin-top: 20px;
     margin-left: 0px;
     text-align: right;
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 16px;
     line-height: 24px;
     color: #fff;
     flex: none;
     order: 0;
     flex-grow: 0;
     float: right;
     text-decoration:none;
     opacity: 1;
}
 @media screen and (max-width: 992px) {
     .single__promotion__coupon__box__inputANDbutton{
         display: block;
         width: 100%;
    }
     .single__promotion__coupon__button{
         width: 100%;
         margin-top: 50px;
         margin-left:0px;
    }
     .labelANDinput{
         display: block;
         width: 100%;
    }
     .copyINPUT{
         width: 100%;
    }
}
 .account__setting__main__box{
     width: 100%;
     height: 550px;
     background-color: white;
     border-radius: 8px;
     display: flex;
}
 .account__setting__main__box__left{
     padding: 20px;
     width: 25%;
     height: 100%;
     background-color: white;
     border-right: 1px solid #eee;
}
 .acc {
     padding: 15px 5px;
     text-decoration: none;
     font-size: 16px;
     color: #422716;
     display: block;
     transition: 0.3s;
     font-family: 'Titillium Web';
     font-weight: 600;
     text-decoration: none;
}
 .acc:hover{
     background-color:#E2DBD3;
     border-radius: 8px;
     text-decoration: none;
     color: #422716;
}
 a.log__out{
     padding: 15px 5px;
     text-decoration: none;
     background-color: transparent;
     font-size: 16px;
     color: #422716;
     display: block;
     transition: 0.3s;
     font-family: 'Titillium Web';
     font-weight: 600;
}
 a.log__out:hover{
     text-decoration: none;
     background-color: #f58c82;
     color: #422716;
     opacity: 1;
     border-radius: 8px;
}
 .account__setting__main__box__right{
     padding: 20px;
     width: 75%;
}
 .account{
     width: 70%;
     height: 100%;
     background-color: transparent;
     display: block;
}
 .password{
     width: 70%;
     height: 100%;
     background-color: transparent;
     display: none;
}
 form.input{
     width: 100%;
     border: 1px solid #ccc;
     border-radius: 8px;
}
 input[type=text], select {
     width: 100%;
     padding: 12px 20px;
     margin: 4px 0;
     display: block;
     border: 1px solid #ccc;
     border-radius: 4px;
     box-sizing: border-box;
}
 form{
     margin-bottom: 0px;
}
 #birthday, input{
     width: 100%;
     height: 41px;
     border: 1px solid #ccc;
     border-radius: 4px;
     padding: 0 10px;
}
 form label {
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 14px;
     line-height: 24px;
     color: #422716;
     flex: none;
     order: 0;
     flex-grow: 0;
}
 .general__info{
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 20px;
     line-height: 28px;
     color: #422716;
}
 .acc__settings__button{
     padding: 9px 18px;
     background-color:#FFCC27;
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 16px;
     line-height: 24px;
     color: #422716;
     flex: none;
     order: 0;
     flex-grow: 0;
     border-radius: 8px;
     text-decoration: none;
}
 .acc__settings__button:hover, .acc__settings__button:visited, .acc__settings__button:active, .acc__settings__button:focus {
     padding: 9px 18px;
     background-color:#FFCC27;
     font-family: 'Titillium Web';
     font-style: normal;
     font-weight: 600;
     font-size: 16px;
     line-height: 24px;
     color: #422716;
     flex: none;
     order: 0;
     flex-grow: 0;
     border-radius: 8px;
     text-decoration: none;
     opacity: .9;
}
 @media screen and (max-width: 992px) {
     .account__setting__main__box{
         width: 100%;
         height: auto;
         background-color: white;
         border-radius: 8px;
         display: block;
    }
     .account__setting__main__box__left{
         width: 100%;
         height: auto;
         border-bottom: 1px solid #ccc;
    }
     .account__setting__main__box__right{
         padding: 20px;
         width: 100%;
    }
     .account{
         width: 100%;
         height: 100%;
         background-color: transparent;
         display: block;
    }
}
 






/* NEW CSS JUST FOR LANDING */
.body__landing__page{
    background-color:#F9F5F1;
    display: flex;
    flex-direction: column;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
.container__landing__fullwidth__transparent{
    width: 100%;
    height: 100%;
    padding: 10% 0; 
    position: relative;
}
.container__landing__fullwidth__gradient{
    width: 100%;
    height: 100%;
    padding: 10% 0; 
    position: relative;
    background: linear-gradient(0deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 69.86%);
}
.container__landing__fullwidth__white{
    width: 100%;
    height: 100%;
    background-color: white;
    padding: 10% 0; 
}
.inner__container__centered__80width{
    width: 80%;
    max-width: 1400px;
    margin: auto;
    display: flex;
    flex-direction: row;
    z-index: 100;
}
.inner__container__centered__100width2{
    width: 100%;
    margin: auto;
    display: flex;
    flex-direction: row;
}
.inner__container__centered__80width__left{
    width: 50%;
    height: auto;
    padding: 5% 0;
    z-index: 100;
}
.inner__container__centered__80width__left2{
    width: 75%;
    height: auto;
    padding: 5% 0;
    z-index: 100;
}
.inner__container__centered__80width__right{       
    width: 50%;
    height: auto;
    padding: 5% 0;
}
.inner__container__centered__100width__left__image__jar{
    float: right;
}
.inner__container__centered__100width{
    width: 100%;
    max-width: 1400px;
    margin: auto;
    display: flex;
    flex-direction: row;
}
.inner__container__centered__100width__left{
    width: 50%;
    height: auto;
    padding: 5% 0;
}
.inner__container__centered__100width__left1{
    width: 50%;
    height: auto;
    padding: 5% 0;
}
.inner__container__centered__100width__left__image__macbook__second{
    float : right;
    width: 100%;
    height: auto;
}
.inner__container__centered__100width__right__inner{
    padding-right: 10%;
}
.inner__container__centered__100width__right{
    width: 50%;
    height: auto;
    padding: 5% 0;
}
.inner__container__centered__100width__right__second{
    width: 50%;
    height: auto;
    padding: 5% 0 5% 5%;
}
.third__container__landing__page__inner__box{
    width: 100%;
    height: auto;
    background-color: transparent;
    display: block;
    opacity: 10000;
    position: relative;
    margin: auto;
}
.first__container__landing__page__inner__box__left__2min{
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    color: #422716;
}
.third__container__landing__page__inner__box__top{
    background-color: transparent;
    width: 100%;
    min-height: 180px;
    height: auto;
    padding: 15px 0;
    background-color: transparent;
}
.third__container__landing__page__inner__box__top__title{
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 600;
    font-size: 40px;
    line-height: 56px;
    color: #422716;
}
.third__container__landing__page__inner__box__top__subtitle{
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #422716;
    opacity: 0.6;
}
.third__container__landing__page__inner__box__bottom{
    /* display:grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    grid-gap: 20px;
    align-items: left;
    height: auto; */
    display: flex;
    align-items: center;
}
.third__container__landing__page__inner__box__bottom2{
    display: flex;
}
.third__container__landing__page__inner__box__bottom__card{
    min-width: 320px;
    width: auto;
    max-width: 450px;
    height: auto;
    display: inline-block;
    background-color: white;
    padding: 20px 30px;
    margin: 10px
}
.third__container__landing__page__inner__box__bottom__card2{
    min-width: 320px;
    width: auto;
    max-width: 400px;
    height: auto;
    display: inline-block;
    background-color: white;
    padding: 20px 30px;
    margin: 10px
}
.third__container__landing__page__inner__box__bottom__card__images__box{
    display: flex;
}
.third__container__landing__page__inner__box__bottom__card__images__box__number{
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 700;
    font-size: 64px;
    line-height: 56px;
    display: flex;
    color: #F2EFEB;
    position: relative;
    margin-left: auto;
}
.third__container__landing__page__inner__box__bottom__card__info__title{
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 600;
    font-size: 24px;
    line-height: 32px;
    color: #422716;
}
.third__container__landing__page__inner__box__bottom__card__info__text{
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #422716;
    opacity: 0.6;
    margin-top: 10px;
}
.inner__container__centered__100width__left__padding__left{
    padding-left: 10%;
    width: 60%;
}
.inner__container__centered__100width__right__image__0{
    width: 40%;
}
.inner__container__centered__80width__fifthe__solo__content
{
    width: 100%;
    max-width: 1400px;
    margin: auto;
    display: flex;
    flex-direction: column;
}
.inner__container__centered__80width__left__contact__form{
    width: 100%;
    padding: 0 10%;
}
.inner__container__centered__80width__right__inner{
    width: 100%;
    padding-right: 10%;
}
.inner__container__centered__80width__right__inner__image{
    width: 100%;
}
.inner__container__centered__80width__white{
    background-color: white;
    width: 80%;
    max-width: 1400px;
    margin: auto;
    display: flex;
    flex-direction: row;
}
.text__align__center__mobile{
    text-align:center;
}

@media screen and (max-width: 1200px) {
    .third__container__landing__page__inner__box__bottom{
        display:grid;
        grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
        grid-gap: 20px;
        align-items: left;
        height: auto;
    }
    .third__container__landing__page__inner__box__bottom2{
        display:grid;
        grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
        grid-gap: 20px;
        align-items: left;
        height: auto;
    }
}


@media screen and (max-width: 992px) {
    .inner__container__centered__80width{
        flex-direction: column;
        padding: 15% 0; 
    }
    .inner__container__centered__80width__left{
        width: 100%;
    }
    .inner__container__centered__80width__left2{
        width: 100%;
    }
    .inner__container__centered__80width__right{       
        width: 100%;
    }
    .inner__container__centered__100width__right__second{
        width: 100%;
        height: auto;
        padding: 5% 0 5% 0%;
    }
    .inner__container__centered__100width{
        flex-direction: column;
        padding: 0 10%;
    }
    .inner__container__centered__100width2{
        flex-direction: column;
        padding: 0 10%;
    }
    .inner__container__centered__100width__left{
        display: none;
    }
    .inner__container__centered__100width__left1{
        padding: 0% 0;
        width: 100%;
    }
    .inner__container__centered__100width__left__image__macbook{
        left:0px;
    }
    .inner__container__centered__100width__right{
        width: 100%;
    }
    .inner__container__centered__100width__left__padding__left{
        padding-left: 0%;
        width: 100%;
        padding: 10% 0;
    }
    .inner__container__centered__100width__right__image__0{
        width: 100%;
    }
    .inner__container__centered__80width__left__contact__form{
        width: 100%;
        padding: 0 0;
    }
    .inner__container__centered__80width__right__inner{
        width: 100%;
        padding-right: 0%;
    }
    .inner__container__centered__80width__white{
        background-color: transparent;
        width: 80%;
        margin: auto;
        display: flex;
        flex-direction: column;
    }
    .inner__container__centered__100width__left__image__jar{
        float: none;
    }
}
/* NEW CSS JUST FOR LANDING END */





/* CSS FOR CARDS YOGA VIDEOS/RECIPES/MOTIVATIONAL TASKS */
.horizontal__card__box{
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(520px, 1fr));
    grid-gap: 20px;
    align-items: center;
    margin: auto;
    margin: 32px 0 48px 0;
}
.horizontal__card__inner{
    width: 100%;
    height: 100%;
    padding: 8px;
    border-radius: 8px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    background-color: white;
    margin: none;
}
.horizontal__card{
    width: 520px;
    height: auto;
    padding: 8px;
    border-radius: 8px;
    display: none;
    flex-direction: row;
    justify-content: space-between;
    background-color: white;
    margin: none;
}
.horizontal__card__left{
    width: 45%;
    height: auto;
    background-color: transparent;
    text-align: left;
    border-radius: 8px;
    position: relative;
}
.horizontal__card__right{
    width: 50%;
    background-color: transparent;
    padding: 5px 0;
    height: auto; /*promijeni u auto */
}
.horizontal__card__right__inner{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding: 0 15px 0 0;
    margin-top: 20px;
}

.horizontal__card__left__image{
    width: 100%;
    height: auto;
}
.horizontal__card__left__image__box{
    width: 100%;
    height: 168px;
}
.horizontal__card__left__image__hover{
    width: 100%;
    height: 149px;
    position: absolute;
    top: 0;
    left: 0;
    /* transform: translate(-50%, -50%); */
    background-color: #E2DBD3;
    opacity: .95;
    border-radius: 8px;
}
.horizontal__card__left__image__hover2{
    width: 100%;
    height: 168px;
    position: absolute;
    top: 0;
    left: 0;
    /* transform: translate(-50%, -50%); */
    background-color: #E2DBD3;
    opacity: .95;
    border-radius: 8px;
}
.horizontal__card__left__image__hover3{
    width: 100%;
    height: 186px;
    position: absolute;
    top: 0;
    left: 0;
    /* transform: translate(-50%, -50%); */
    background-color: #E2DBD3;
    opacity: .95;
    border-radius: 8px;
}
.locked__icon{
    position: absolute;
    top: 40%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.available__text{
    width: 100%;
    text-align: center;
    position: absolute;
    top: 75%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: rgba(66, 39, 22, 0.6);
}
.available__text1{
    width: 100%;
    text-align: center;
    position: absolute;
    top: 125px;
    left: 0px;
    /* transform: translate(-50%, -50%); */
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: rgba(66, 39, 22, 0.6);
}
.yoga__title{
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 600;
    font-size: 18px;
    line-height: 27px;
    color: #422716;
}
.yoga__descritpion{
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
    color: rgba(66, 39, 22, 0.6);
}
.yoga__teacher__title{
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 600;
    font-size: 14px;
    line-height: 20px;
    color: #422716;
    margin: 0;
}
.yoga__teacher__description{
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    color: rgba(66, 39, 22, 0.6);
    margin: 0;
}
.yoga__teacher__image{
    border-radius: 50%;
    width: 42px;
    height: 42px;
}
.hexagone__number__left{
    position: absolute;
    left: 10px;
    top: 10px;
}
.hexagone__number__left__inner__number{
    position: absolute;
    top: 19px;
    left: 19px;
}
.food__for__energy, .food__for__energy:hover, .food__for__energy:active {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 500;
    font-size: 12px;
    line-height: 104%;
    display: flex;
    align-items: center;
    color: #F5BD4F;
    padding: 6px 12px;
    background-color: #fef8ed;
    border-radius: 8px;
    text-decoration: none;
    opacity: 1;
}
.food__for__sleep, .food__for__sleep:hover, .food__for__sleep:active {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 500;
    font-size: 12px;
    line-height: 104%;
    display: flex;
    align-items: center;
    color: #964A8B;
    padding: 6px 12px;
    background-color: #f5ecf3;
    border-radius: 8px;
    text-decoration: none;
    opacity: 1;
}
.food__for__relax, .food__for__relax:hover, .food__for__relax:active {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 500;
    font-size: 12px;
    line-height: 104%;
    display: flex;
    align-items: center;
    color: #4DA0BA;
    padding: 6px 12px;
    background-color: #edf6f8;
    border-radius: 8px;
    text-decoration: none;
    opacity: 1;
}

#loadMoreYoga {
    width: 200px;
    display: block;
    text-align: center;
    margin: 20px auto;
    padding: 9px 24px;
    border-radius: 10px;
    border: 1px solid transparent;
    background-color: #e2dbd3;
    transition: .3s;
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
   /* identical to box height, or 150% */
    text-align: center;
    color: #422716;
}
#loadMoreYoga:hover {
    color: #422716;
    background-color: #e2dbd3;
    border: 1px solid #e2dbd3;
    text-decoration: none;
}
@media screen and (max-width: 1420px) {
    .horizontal__card__box{
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(330px, 1fr));
        grid-gap: 20px;
        align-items: center;
        margin: 20px 0 35px 0;
        justify-content: center;
        align-content: center;
    }
    .horizontal__card{
        width: 330px;
        flex-direction: column;
        margin: auto;
    }
    .horizontal__card__inner{
        display: flex;
        flex-direction: column;
    }
    .horizontal__card__left{
        width: 100%;
    }
    .horizontal__card__right{
        width: 100%;
    }
    .horizontal__card__left__image{
        width: 100%;
        height: auto;
    }
}


@media screen and (max-width: 992px) {
    /* NISTA JER SU KARTICE HORIZONTALNE I BOLJE DA SE PRELOME NA 1420px */
}
/* CSS FOR CARDS YOGA VIDEOS/RECIPES/MOTIVATIONAL TASKS END */




.testimonials__card__stories{
    max-width: 350px;
    margin: 0 auto;
    height: auto;
    background-color: transparent;
    display: block;
    text-align: center;
}

.testimonials__card__left__stories{
    width: 100%;
    justify-content: center;
    text-align: center;
}
.testimonials__card__left__image__stories{
    width: 50%;
    height: auto;
    border-radius: 50%;
    margin: auto;
}
.testimonials__card__right__stories{
    width: 100%;
    text-align: center;
}
.multiple-slider{
    display: flex;
}
.testiomonials__watch__video{
    display: flex;
    width: 200px;
    margin: auto;
    text-align: center;
}
.watch__testimonials__text, .watch__testimonials__text:hover , .watch__testimonials__text:active{
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    text-align: center;
    color: #422716;
    margin-top: 10px;
    text-decoration: none;
    margin: auto;
}
.container__why__to__choose{
    width: 100%;
    height: auto;
    display: flex;
    flex-direction: row;
    background-color: transparent;
    justify-content: space-between;
}
.container__why__to__choose__left{
    width: 55%;
    height: auto;
    display: block;
    background-color: transparent;
    padding-right: 10%;
}
.container__why__to__choose__right{
    width: 42%;
    height: auto;
    background-color: transparent;
    text-align: right;
}
.container__why__to__choose__image{
    width: 100%;
    height: auto;
    border-radius: 8px;
}
.container__why__to__title{
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 600;
    font-size: 32px;
    line-height: 48px;
    color: #422716;
}
.container__why__to__item{
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    color: #422716;
    flex: none;
    order: 1;
    flex-grow: 0;
    margin-bottom: 18px;
}
.green__true{
    margin-right: 18.5px;
    width: 18.5px;
    height: 18.5px;
}
.container__why__to__choose__button, .container__why__to__choose__button:hover{
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 600;
    font-size: 18px;
    line-height: 32px;
    color: #FFFFFF;
    padding: 8px 16px;
    background-color: #964A8B;
    width: fit-content;
    border-radius: 8px;
    opacity: 1;
    text-decoration: none;
}
.container__why__to__choose__icons__box{
    display: flex;
    width: auto;
}
.container__why__to__choose__icon{
    margin-right: 20px;
}


@media screen and (max-width: 992px) {
    .container__why__to__choose{
        width: 100%;
        height: auto;
        display: block;
        background-color: transparent;
        justify-content: space-between;
    }
    .container__why__to__choose__left{
        width: 90%;
        height: auto;
        display: block;
        margin: auto;
        background-color: transparent;
        padding-right: 10%;
    }
    .container__why__to__choose__right{
        width: 90%;
        height: auto;
        margin: auto;
        background-color: transparent;
        text-align: right;
    }
}


.SingleVideo__yellow__hexagone{
    display: flex;
    flex-direction: row;
}
.singleVideo__icon__title{
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 600;
    font-size: 32px;
    line-height: 48px;
    display: flex;
    align-items: center;
    color: #422716;
}
.singleVideo__icon__text{
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 28px;
    color: #422716;
}
.singleVideo__image__content__text{
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 600;
    font-size: 32px;
    line-height: 48px;
   /* identical to box height, or 150% */
    margin-left: 15px;
    margin-top: -60px;
    color: #000;
}

.single__video__text__content{
    width: 100%;
    height: auto;
    display: flex;
    justify-content: space-between;
}
.single__video__text__content__left{
    width: calc(100% - 114px);
    height: auto;
    background-color: white;
    border-radius: 8px;
    padding: 32px;
}
.single__video__text__content__right{
    width: 90px;
    height: 100%;
    background-color: white;
    display: flex;
    flex-direction: column;
    border-radius: 8px;
    text-align: center;
    padding: 24px 0;
}
.singleVideo__author__inner{
    width: 250px;
    justify-content: space-between;
    display: flex;
    flex-direction: row;
    margin-top: 20px;
}
.share__icon{
    position: relative;
    width: 42px;
    height: 46px;
    margin: 8px auto;
}
.single__video__text__content__right__share{
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    text-align: center;
    color: #422716;
}


@media screen and (max-width: 992px) {
    .single__video__text__content{
        display: block;
    }
    .single__video__text__content__left{
        width: 100%;
        height: 100%;
        padding: 32px 20px;
    }
    .single__video__text__content__right{
        width: fit-content;
        height: fit-content;
        background-color: white;
        display: flex;
        flex-direction: row;
        padding: 10px 20px;
        margin-top: 24px;
    }
    .share__icon{
        position: relative;
        width: 42px;
        height: 46px;
        margin: 8px 8px;
    }
    .single__video__text__content__right__share{
        display: none;
    }
    .singleVideo__icon__title{
        font-size: 25px;
        line-height: 35px;
    }
}

.content__singleNormal{
    width: 93%;
    margin: auto;
    background-color: #fff;
    height: auto;
    margin-top: 0;
    border-radius: 8px;
    padding: 32px;
    position: relative;
}
.singleContent__image{
    width: 93%;
    height: auto;
    margin: 32px auto;
    border-radius: 8px;
    position: relative;
    text-align: center;
}
.singleContent__image__style{
    width: 100%;
    height: auto;
    /* max-height: 450px; */
    border-radius: 8px;
}

img.shema__single__row{
    width: 50%;
    margin-left: 25%;
}


@media screen and (max-width: 992px) {
    img.shema__single__row{
        width: 100%;
        margin-left: 0%;
    }
    .singleContent__image{
        margin: 22px auto;
    }
}

.content__single__article{
    width: 93%;
    margin: auto;
    height: auto;
    justify-content: space-between;
    display: flex;
}
.content__single__article__left{
    width: 70%;
    height: auto;
}
.content__singleArticle__text {
    width: 100%;
    background-color: #fff;
    height: auto;
    margin-top: 0;
    border-radius: 8px;
    padding: 32px;
    position: relative;
}
.content__single__article__right{
    width: 28%;
    height: 100%;
    background-color: white;
    border-radius: 8px;
    padding: 32px;
}   
.single__article__author__image{
    width: 100%;
    margin: 15px 0;
    border-radius: 8px;
}
.single__article__author__title{
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 600;
    font-size: 20px;
    line-height: 32px;
    color: #422716;
}
.single__article__author__about{
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 28px;  
    color: rgba(66, 39, 22, 0.6);
}

@media screen and (max-width: 992px) {
    .content__single__article{
        display: block;
    }
    .content__single__article__left{
        width: 100%;
        height: auto;
    }
    .content__single__article__right{
        width: 100%;
        margin: 20px 0;
    } 
}



.card__articles__box{
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    grid-gap: 20px;
    align-items: center;
    margin: 32px 0 48px 0;
}

.card__articles{
    width: 250px;
    background-color: white;
    display: none;
    /* flex-direction: column; */
    height: auto;
    border-radius: 8px;
    padding: 8px 8px 20px 8px;
    margin: auto;

}

.card__articles__top__image{
    width: 100%;
    height: 140px;
    border-radius: 8px;
}
.card__articles__middle__title{
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    color: #422716;
    margin: 20px 12px 12px 12px;
}

.yoga__teacher__image1{
    border-radius: 50%;
    width: 42px;
    height: 42px;
    margin-top: 5px;
}
.card__articles__top__image__overlay{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #E2DBD3;
    opacity: .95;
    border-radius: 8px;
}
.card__articles__top__image__overlay01{
    width: 100%;
    height: 100%;
    position: absolute;
    top:0;
    left: 0;
    /* transform: translate(-50%, -50%); */
    background-color: transparent;
    opacity: 1;
    border-radius: 8px;
}
.card__articles__footer__info{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding: 10px 12px;
}
.card__articles__top{
    position: relative;
}
.card__articles__top__image__icon{
    position: absolute;
    left: 10px;
    top: 10px;
}
.card__articles__top__image__number{
    position: absolute;
    top: 19px;
    left: 19px;
}
.recipes__images{
    width: 100%;
    max-height: 350px;
    height: auto;
    border-radius: 8px 8px 0 0 ;
}

.content__singleArticle__text__with__image {
    width: 100%;
    background-color: #fff;
    height: auto;
    margin-top: 0;
    border-radius: 0 0 8px 8px;
    padding: 32px;
    position: relative;
}
.single__recipes18px{
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 28px;
    color: #422716;
    opacity: 0.6;
}
.single__recipes__title{
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 600;
    font-size: 24px;
    line-height: 37px;
    /* identical to box height */
    color: #422716;
}
.content__singleArticle__text__with__image__left{
    width: 40%;
    background-color: transparent;
    height: auto;
    display: block;
    padding-right: 10px;
}
.content__singleArticle__text__with__image__right{
    width: 60%;
    background-color: transparent;
    height: auto;
    display: block;
}
.content__singleArticle__text__with__image__box{
    display: flex;
}
.content__singleArticle__text__with__image__left__title{
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 600;
    font-size: 20px;
    line-height: 32px;
    color: #422716;
}
.recipe__item{
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 28px;
    color: #422716;
}
.recipes__item{
    display: flex;
}
.success__item{
    display: flex;
    width: 100%;
}
.plus__circle{
    height: 22px;
    width: 22px;
    margin-right: 10px;
    margin-top: 5px;
}
.step__text{
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 28px;
    color: #422716;
    opacity: 0.6;
}


@media screen and (max-width: 992px) {
    .content__singleArticle__text__with__image__box{
        display: block;
    }
    .content__singleArticle__text__with__image__left{
        width: 100%;
        background-color: transparent;
        height: auto;
        display: block;
        padding-right: 10px;
    }
    .content__singleArticle__text__with__image__right{
        width: 100%;
        background-color: transparent;
        height: auto;
        display: block;
    }
}

.modal__button{
    display: flex;
    background-color: transparent;
}


.icons__box__item{
    display: flex;
    width: 180px;
    justify-content: space-between;
    margin: auto;
}
.icons__box__item img {
    width: 50px;
    height: 50px;
    margin-right: 5px;
}
.icons__box__item__text{
    margin: auto auto;
    font-size: 12px;
    font-weight: normal;
}

.icons__box{
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    grid-gap: 10px;
    margin: 20px 0;
}
.card__landing__slider__box{
    width: 33%;
    background-color: red;
    height: auto;
}
.meet__the__expert__card__landing{
    width: 340px;
    height: auto;
    max-height: 530px;
    background-color: white;
    border-radius: 8px;
    position: relative;
    margin: auto;
}

.meet__the__expert__card{
    width: 340px;
    height: auto;
    max-height: 530px;
    background-color: white;
    border-radius: 8px;
    position: relative;
    margin: auto;
    display: none;
}
.meet__the__expert__card__top{
    width: 100%;
    min-height: 150px;
    background-color: white;
    border-radius: 8px 8px 0 0;
    background-image: url(/images/expert__bg.png);
}
.meet__the__expert__card__img{
    width: 179px;
    height: 179px;
    margin-left: -1.5px;
    margin-top: -1.5px;

}
.meet__the__expert__card__content{
    width: 100%;
    height: auto;
    min-height: 300px;
    padding: 100px 32px 32px 32px;
}

.meet__the__expert__card__top__img__box{
    position: absolute;
    top: 55px;
    width: 190px;
    height: 190px;
    left: 74px;
    border-radius:50%;
    border: 7px solid white;
    box-sizing: border-box;
}
.meet__the__expert__card__title{
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 600;
    font-size: 20px;
    line-height: 30px;
    color: #422716;
}
.meet__the__expert__card__job{
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    /* or 150% */
    
    
    color: rgba(66, 39, 22, 0.6);
}
.meet__the__expert__card__text{
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    /* or 150% */
    
    
    color: rgba(66, 39, 22, 0.6);
}

.meet__the__expert__video{
    margin: 0 0 40px 0;
    border-radius: 8px 8px 0 0;
}

video.expert{
    border-radius: 8px 8px 0 0;
    height: auto;
    width: 100%;
}
iframe.expert{
    border-radius: 8px 8px 0 0;
    height: auto;
    width: 100%;
}
.model__text{
    width: 95%;
    margin: auto;
}
.model__title{
    font-family: 'Titillium Web';
font-style: normal;
font-weight: 600;
font-size: 20px;
line-height: 30px;
/* identical to box height, or 150% */


color: #422716;
}
.modal__text{
    font-family: 'Titillium Web';
font-style: normal;
font-weight: 400;
font-size: 16px;
line-height: 24px;
color: rgba(66, 39, 22, 0.6);
}

.card__meet__the__expert__box{
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
    grid-gap: 20px;
    align-items: center;
    margin: 32px 0 48px 0;
}
    /* The Modal (background) */
    .modal {
        display: none; /* Hidden by default */
        position: fixed; /* Stay in place */
        z-index: 1; /* Sit on top */
        /* left: 50%;
        top: 50%;
        transform: translate(-50%, -50%); */
        padding-top: 70px; /*Location of the box*/
        left: 0;
        top: 0;
        width: 100%; /* Full width */
        height: 100%; /* Full height */
        overflow: auto; /* Enable scroll if needed */
        background-color: rgba(249, 245, 241, 0.8);; /* Black w/ opacity */
      }
      
      /* Modal Content */
      .modal-content {
        background-color: #faf5f1;
        margin: auto;
        padding: 0 0 20px 0;
        border-radius: 8px;
        width: 60%;
      }
      
      /* The Close Button */
      .close {
        color: #aaaaaa;
        position: absolute;
        right: -50px;
        top: 0;
        font-size: 28px;
        font-weight: bold;
      }
      
      .close:hover,
      .close:focus {
        color: #000;
        text-decoration: none;
        cursor: pointer;
      }

@media screen and (max-width: 992px) {
    .modal {
        padding-top: 100px; /* Location of the box */
      }
      .first__container__flower{
        display: none;
    }
    .modal-content {
        background-color: #faf5f1;
        margin: auto;
        padding: 0 0 20px 0;
        border-radius: 8px;
        width: 80%;
      }
      .close {
        color: #aaaaaa;
        position: absolute;
        right: -25px;
        top: 0;
        font-size: 28px;
        font-weight: bold;
      }
}

.first__container__hexagons{
    position: absolute;
    right: 0;
    top: 0;
    z-index: -10;
}
.first__container__flower{
    position: absolute;
    bottom: 0;
}
.hexagone__image__third__container{
    position: absolute;
    top: 10%;
    left: 0;
}
.grana__image__testimonial{
    position: absolute;
    right: 0;
    top: 0;
    z-index: -1;
}

.inner__container__centered__90width{
    width: 90%;
    margin-left: 10%;
    display: flex;
    flex-direction: row;
    z-index: 100;
}

.container__landing__fullwidth__transparent__img{
    width: 100%;
    height: 100%;
    padding: 10% 0; 
    position: relative;
    background-position:center;
    background-repeat: no-repeat;
    background-size:cover;
}



.box__what__is__included__in__program{
    width: 80%;
    height: 100%;
    margin: auto;
    background-color: transparent;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(30%, 1fr));
    grid-gap:0%;
    align-items: center;
    padding: 20px;
}
.box__what__is__included__in__program__card{
    width: 100%;
    height: 290px;
    background-color: transparent;
    text-align: center;
    padding: 20px;
}

@media screen and (max-width: 992px) {
    .box__what__is__included__in__program{
        width: 100%;
        margin: auto;
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(100%, 1fr));
        grid-gap:0%;
        align-items: center;
        padding: 20px;
    }
    .box__what__is__included__in__program__card{
        width: 100%;
        text-align: center;
        padding: 20px;
    }
}
.box__what__is__included__in__program__card__title{
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 600;
    font-size: 24px;
    line-height: 32px;
    text-align: center;
    color: #422716;
}
.box__what__is__included__in__program__card__text{
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    text-align: center;
    color: #422716;
    opacity: 0.6;
}



.slider1__image__left__top{
    position: absolute;
    top: 13%;
    left: 5%;
    z-index:-1;
}

@media screen and (max-width: 992px) {
    .slider1__image__left__top{
        display: none;
    }
}
.below__testimonials__box{
    width: 80%;
    height: 100%;
    margin: 100px  auto 0 auto;
    background-size: cover;
    background-position: center;
    position: relative;
    padding: 70px 20px 100px 20px;
    text-align: center;
}
.below__testimonials__box__content__title{
    font-family: 'Titillium Web';
font-style: normal;
font-weight: 600;
font-size: 40px;
line-height: 56px;
/* identical to box height, or 140% */

text-align: center;

color: #FFFFFF;

}
.below__testimonials__box__content__text{

font-family: 'Titillium Web';
font-style: normal;
font-weight: 400;
font-size: 16px;
line-height: 24px;
text-align: center;
color: #FFFFFF;
opacity: 0.6;
}

@media screen and (max-width: 992px) {
    .below__testimonials__box{
        width: 100%;
    }
    .below__testimonials__box__content__title{
        font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 600;
    font-size: 30px;
    line-height: 46px;
    /* identical to box height, or 140% */
    
    text-align: center;
    
    color: #FFFFFF;
    
    }
}

.below__testimonials__box__content__button,.below__testimonials__box__content__button:hover{
    font-family: 'Titillium Web';
        font-style: normal;
        font-weight: 600;
        font-size: 16px;
        line-height: 24px;
        color: #422716;
    padding: 12px 18px;
    background-color:#FFCC27;
    border-radius: 8px;
    opacity: 1;
    text-decoration: none;
}


.modal__text{
    font-family: 'Titillium Web';
font-style: normal;
font-weight: 600;
font-size: 16px;
line-height: 24px;
/* identical to box height, or 150% */
margin-top: 10px;
margin-left: 10px;

color: #422716;

}

.survey__body{
    min-height: 100vh;
}
.survey__final__image{
    width: 80%;
    height: auto;
    margin: auto;
}
.survey__final__image__style{
    width: 100%;
    max-height: 500px;
    height: auto;
}
@media screen and (max-width: 992px) {
    .survey__final__image{
        width: 100%;
        height: auto;
        margin: auto;
    }
    .survey__final__image__style{
        width: 100%;
        max-height: 300px;
        height: auto;
    }
}

.survey__button__options{
    display: flex;
    width: 100%;
}
.survey__button__options__buttons, .survey__button__options__buttons:hover{
    font-family: 'Titillium Web';
font-style: normal;
font-weight: 600;
font-size: 16px;
line-height: 24px;
text-align: center;
color: #FFFFFF;
padding:12px 18px;
background-color:#964A8B ;
border-radius: 8px;
margin: auto;
min-width: 150px;
text-decoration: none;

}
.survey__title{
    font-family: 'Titillium Web';
font-style: normal;
font-weight: 600;
font-size: 40px;
line-height: 56px;
/* or 140% */

text-align: center;

color: #422716;
}


/* SURVEY NEW */

.survey__final{
    display: block;
    width: 100%;
    min-height: 100%;
    height: auto;
    padding: 10% 10%; 
    background-image: url("/images/01_Invitation.png"), linear-gradient(to right, #F8F5F0, #F8F5F0); /* W3C */
    background-repeat: no-repeat;
    background-size: cover;
}
.survey__content__final__title{
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 600;
    font-size: 56px;
    line-height: 64px;
    color: #422716;
}
.survey__content__final__text{
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 28px;
    color: #422716;
    opacity: 0.6;
}
@media screen and (max-width: 992px) {
    .survey__final{
        padding: 15% 10%; 
    }
    .survey__content__final__title{
        font-family: 'Titillium Web';
        font-style: normal;
        font-weight: 600;
        font-size: 36px;
        line-height: 50px;
        color: #422716;
    }
}


.box__for__checkbox{
    display: flex;
    float: left;
    width: 100%;
}

.box{
    margin: auto;
}

.width55prc{
    width: 55%;
}
.content{
    max-width: 1400px;
    margin: auto;
} 
.content1{
    max-width: 1400px;
    margin: auto;
    min-height: 100vh;
}
@media screen and (max-width: 992px) {
    .width55prc{
        width: 100%;
    }
}



/* SHARE CSS */
.cover{
    background:rgba(249, 245, 241, 0.8);
    backdrop-filter: blur(4px);
    position:fixed;
    left: 0;
    top: 0;
    width:100%;
    height:100vh;
    display:none;
    z-index: 1000;
  }
  .contents{
    width:50%;
    height:400px;
    background:#fff;
    border-radius:8px;
    position:absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align:center;
    padding: 20px;
  }
  .closebtn{
    padding:5px 15px;
    position:absolute;
    top: 0;
    text-align:center;
    left: calc( 100% + 10px);
    width:auto;
    height: auto;
  }
  .invite__title{
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 600;
    font-size: 20px;
    line-height: 30px;
    text-align: center;
    color: #422716;
  }
  .invite__text{
    font-family: 'Titillium Web';
font-style: normal;
font-weight: 400;
font-size: 16px;
line-height: 24px;
text-align: center;
color: rgba(66, 39, 22, 0.6);
  }
  .contents__button__box{
    width: 90%;
    margin: auto;
    background-color: transparent;
    height: auto;
    display: flex;
    justify-content: space-between;

  }
  .share__buttons a{
    width: 160px;
    height: auto;
    border-radius: 8px;
    border: 1px solid #ccc;
    margin: auto;
  }
  @media screen and (max-width: 992px) {
    .contents{
        width:95%;
        height:auto;
        margin: auto;
        background:#fff;
        border-radius:8px;
        position:absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        text-align:center;
        padding: 20px;
      }
      .contents__button__box{
        width: 90%;
        display: block;
        text-align: center;
      }
      .share__buttons{
        margin: 10px auto;
      }

}
.player iframe{
    width: 100%;
    min-height: 500px;
    height: auto;
}
@media screen and (max-width: 992px) {
    .player iframe{
        width: 100%;
        min-height: 350px;
        height: auto;
    }
}

.everest-forms .evf-field-container .evf-frontend-row input[type=checkbox], .everest-forms .evf-field-container .evf-frontend-row input[type=radio] {
    width: auto;
    flex: 0 0 16px;
}
 input#check1, input#check2{
    min-width: 10px;
 }
 @media screen and (max-width: 992px) {
    input#check1, input#check2{
        min-width: 15px;
     }
 }

 .footer__items, .footer__items:active{
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    /* identical to box height, or 150% */
    color: #422716;
    opacity: 0.6;
    margin-right: 15px;
    text-decoration: none;
 }
 .footer__items:hover{
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    /* identical to box height, or 150% */
    color: #422716;
    opacity: 1;
    margin-right: 15px;
    text-decoration: none;
    transition: 0.8s;
 }
 .submit__button{
    width: auto;
    background-color: #964A8B;
    color: #fff;
    padding: 10px 18px;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    float: right;
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    flex: none;
    order: 0;
    flex-grow: 0;
 }

.fourth__container__landing__page__inner__box__left__icon__box{
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    grid-gap: 5px;
}
 .iconANDtext{
    float: left;
    display: flex;
    flex-direction: row;
    width: 280px;
 }
 .iconANDtextright{
    display: flex;
    flex-direction: column;
    margin-left: 5px;
 }
 .procenti{
    font-size: 25px;
    font-weight: 800;
    color: #964A8B;
    margin: 0;
 }
 .procetni__text{
    font-weight: 500;
 }
 /* ------------------- NORDIN CSS ------------------------ */
    .regPrivacy{
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 600;
    font-size: 14px;
    line-height: 24px;
    color: #954989;
    flex: none;
    order: 0;
    flex-grow: 0;
    }

    .loader-wrapper {
      width: 100%;
      height: 100%;
      position: absolute;
      top: 0;
      left: 0;
      background-color: white;
      display:flex;
      justify-content: center;
      align-items: center;
      z-index: 10000;
      overflow: hidden;
    }
    .loader {
      display: inline-block;
      width: 70px;
      height: 70px;
      position: relative;
      border: 4px solid #053146;
      animation: loader 2s infinite ease;
    }
    .loader-inner {
      vertical-align: top;
      display: inline-block;
      width: 100%;
      background-color: #ffe2b8;
      animation: loader-inner 2s infinite ease-in;
    }

    /* .hexLoader {
      background: #053146;
      -webkit-clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0% 50%);
      clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0% 50%);
      animation: loader 2s infinite ease;
      position: relative;
      width: 70px;
      height: 70px;
    } */
   .hexLoader{
    position: relative;
    height: 170px;
    width: 150px;
    content: url(/images/pcela.png);
    animation: loader 4s infinite ease;
  }

    @keyframes loader {
      0% { transform: rotate(0deg);}
      25% { transform: rotate(180deg);}
      50% { transform: rotate(180deg);}
      75% { transform: rotate(360deg);}
      100% { transform: rotate(360deg);}
    }
    @keyframes loader-inner {
      0% { height: 0%;}
      25% { height: 0%;}
      50% { height: 100%;}
      75% { height: 100%;}
      100% { height: 0%;}
    }


    #scroll{
        margin-top: -150px;
        margin-bottom: -100px
    }
    #scroll2{
        margin-top: -70px;
        margin-bottom: -100px
    }
    #scroll3{
        margin-top: -150px;
        margin-bottom: -70px
    }

    @media screen and (max-width: 992px) {
        #scroll{
            margin-bottom: 220px;
        }
        #scroll2{
            margin-bottom: 360px;
        }
        #scroll3{
            margin-bottom: 250px;
        }
    }

    .survey__final1{
        display: block;
        width: 100%;
        min-height: 100%;
        height: auto;
        padding: 7% 6%; 
        background-image: url("/images/selectLangPromo.png"), linear-gradient(to right, #F8F5F0, #F8F5F0); /* W3C */
        background-repeat: no-repeat;
        background-size: contain;
        background-position: right;
    }
    
    .question_answer1{
        width: 229px;
        text-decoration: none;
        padding: 12px;
        background-color: transparent;
        border: 1px solid #E2DBD3;
        border-radius: 8px;
        display: block;
        text-align: center;
        /* margin: 10px auto; */
        font-family: 'Titillium Web';
        font-style: normal;
        font-weight: 600;
        font-size: 16px;
        line-height: 24px;
        text-align: center;
        color: #422716;
        margin-top: 20px;
    }
    #centriraj{
        margin-left: 40px;
    }
    #mobileLogo{
        display: none;
    }
        @media screen and (max-width: 992px) {
        .survey__final1{
            background-image: none;
            text-align: center;
            margin-top: -50px;
        }
        .question__answer__buttons{
            text-align: -webkit-center;
        }
        #centriraj{
            margin-left: 0;
        }
        #mobileLogo{
            display: block;
        }
    }