@charset "utf-8";
/* CSS Document */

/*html {
	font-size: 100%;
	line-height: 100%;
}*/

html,
body {
    overflow-x: hidden;
}

body {
    color: #555454;
    font-family: "Carlito", sans-serif;
    /*font-style: normal;*/
    font-weight: 300;
    /*margin: 0;*/
    /*position: relative;*/
    font-size: 1rem;
}

.container {
    padding: 0 10px;
}

.container--no-pad {
    padding: 0;
}

.flex {
    display: flex;
    -moz-box-orient: horizontal;
    flex-flow: row wrap;
    justify-content: space-between;
}

.relative {
    position: relative;
}

.center {
    text-align: center;
}

.two_columns {
    column-count: 2;
    column-gap: 50px;
    column-rule: 1px dashed #9d9d9d;
}

.grey_bg .two_columns {
    column-rule: none;
}

.modul2 + .two_columns {
    margin-top: 65px;
}

#page-wrapper {
    height: 100%;
}

table,
td,
tr {
    border: 1px solid grey;
}

td {
    padding: 10px;
    vertical-align: middle;
}

@media screen and (max-width: 1200px) {
    .modul2 + .two_columns {
        margin-top: 25px;
    }
}

/* Spaces
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.marTop {
    margin-top: 80px;
}

.marBot {
    margin-bottom: 25px;
}

/* Typography
–––––––––––––––––––––––––––––––––––––––––––––––––– */

a {
    color: #555454;
}

p {
    font-size: 1.125rem;
    /*18px*/
    line-height: 1.9;
}

p + p {
    margin-top: 35px;
}

h2 + p,
h3 + p {
    margin-top: 25px;
}

p a {
    text-decoration: underline;
}

p a:hover {
    color: #1f7c87;
}

strong {
    font-weight: 700;
}

h1,
h2 {
    font-family: "Carlito", sans-serif;
}

h1 {
    font-size: 3rem;
    /*48px*/
    color: #555454;
}

h1.line {
    background-image: url(../images/bg_line.gif);
    background-repeat: repeat-x;
    background-position: center center;
    text-align: center;
    margin: 0 30px;
}

h1.line span {
    background-color: #fff;
    padding: 0 20px;
    display: inline-block;
}

h2 {
    font-size: 2.5rem;
    /*40px*/
    line-height: 1.2;
}

h3 {
    font-size: 25px;
    font-weight: 300;
}

h4 {
    font-family: "Carlito", sans-serif;
    font-size: 25px;
    font-weight: 700;
    line-height: 1.2;
    border-bottom: 1px solid #d5d5d5;
    padding-bottom: 18px;
    margin-bottom: 18px;
    display: block;
    margin-right: 30px;
}

/******MEDIA QUERIES******/

@media screen and (max-width: 1200px) {
    h1.line {
        text-align: left;
        margin-left: 0;
        margin-right: 15px;
    }
    h1.line span {
        padding: 0 20px 0 15px;
    }
    .center {
        text-align: left;
    }
}

@media screen and (max-width: 480px) {
    h1 {
        font-size: 1.875rem;
        /*30px*/
    }
    h2 {
        font-size: 1.563rem;
        /*25px*/
    }
    h3 {
        font-size: 1.25rem;
        /*20px*/
    }
    h2 + p,
    h3 + p {
        margin-top: 15px;
    }
    h1.line span {
        padding: 0 0 0 15px;
    }
    p {
        font-size: 1rem;
    }
    p + p {
        margin-top: 15px;
    }
}

/* Forms
–––––––––––––––––––––––––––––––––––––––––––––––––– */

input,
select,
textarea {
    padding: 0 0 0 10px;
    border: none;
    font-family: "Carlito", sans-serif;
    font-size: 0.875rem;
    color: #555454;
    background-color: #fff;
}

/*buttons*/

button,
a.button,
.modul4 .grid_4 span.button {
    border: none;
    font-family: "Carlito", sans-serif;
    font-size: 16px;
    background-color: #8caf3e;
    color: #fff;
    padding: 20px 30px;
    display: inline-block;
    cursor: pointer;
    font-weight: 700;
    transition: background 0.3s ease;
}

button:hover,
a.button:hover,
.modul4 .grid_4 span.button:hover {
    background-color: #6d8830;
}

a.yellow,
.modul4 .grid_4 span.yellow {
    background: rgba(232, 182, 18, 0.8) none repeat scroll 0 0;
    color: #fff;
    transition: background 0.3s ease;
}

a.yellow:hover,
.modul4 .grid_4 span.yellow:hover {
    background: rgba(212, 166, 16, 1) none repeat scroll 0 0;
}

a.blue {
    background-color: #1f7c87;
}

a.blue:hover {
    background-color: #175b63;
}

a.transparent {
    background-color: rgba(255, 255, 255, 0);
    border: 1px solid #767676;
    color: #767676;
}

a.transparent:hover {
    background: #f4f4f4;
}

/* Fixed header
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.headerExtra {
    background: rgba(0, 0, 0, 0.5);
    padding: 10px 196px 10px 0;
    text-align: right;
}

.headerExtra a {
    color: #fff;
    font-size: 0.9675rem;
    /*15px*/
    transition: all 0.3s ease;
    border-right: 1px solid #fff;
    padding-right: 10px;
    margin-right: 5px;
}

.headerExtra a:hover {
    opacity: 0.8;
}

.headerExtra a:last-child {
    border-right: none;
    padding-right: 0px;
    margin-right: 0px;
}

.fixed_header {
    /*background: #fff;*/
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    z-index: 3;
}

@media screen and (max-width: 768px) {
    .fixed_header {
        position: relative;
    }
}

.h_line {
    border-bottom: 5px solid #d9d9d9;
}

header {
    background-color: #fff;
    padding: 0 35px;
    height: 95px;
    justify-content: center;
    align-items: center;
}

/*logo*/

.logo-desktop .desktop {
    width: 230px;
    display: block;
}

.logo-desktop .mob {
    display: none;
}

/*nav*/

nav {
    display: flex;
    align-items: center;
    position: relative;
}

.menuLink {
    margin-right: 38px;
}

.menuLink a {
    color: #373737;
    font-size: 1.063rem;
    /*17px*/
    height: 94px;
    padding-top: 42px;
    display: inline-block;
}

.menuLink a:hover,
.menuLink a.active {
    color: #1f7c87;
}

/*podmenu*/

.podmenu {
    position: absolute;
    left: 0;
    top: 99px;
    background-color: #fff;
    width: 100%;
    border-bottom: 5px solid #d9d9d9;
    border-left: 5px solid #d9d9d9;
    border-right: 5px solid #d9d9d9;
    display: none;
}

.podmenu .wrapper {
    display: flex;
    min-height: 300px;
    justify-content: space-between;
}

.podmenu .grid_4,
.podmenu .grid_8 {
    align-items: stretch;
}

.podmenu .links {
    padding: 20px 20px;
}

.podmenu .links a {
    border-bottom: 1px dashed #a2a2a2;
    margin-bottom: 15px;
    padding-bottom: 15px;
    display: block;
    height: auto;
    padding-top: 0;
}

.podmenu .links a:last-child {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

.podmenu strong {
    text-transform: uppercase;
    margin-bottom: 10px;
    margin-bottom: 15px;
    display: block;
}

.podmenu .banner {
    transition: background 0.5s linear;
}

/*mob_nav*/

.mob_nav {
    width: 30px;
    height: 30px;
    cursor: pointer;
    position: absolute;
    top: 35px;
    right: 15px;
    display: none;
}

.mob_nav .sp_nav {
    display: block;
    width: 30px;
    overflow: hidden;
}

.mob_nav .sp_nav span {
    background: #555454;
    border-radius: 4px;
    display: block;
    height: 4px;
    margin: 5px 0;
    position: relative;
    transform: rotate(0);
    top: 0;
    left: 0;
    opacity: 1;
    transition: none 0.5s ease;
    transition-property: transform, top, left, opacity;
}

html.mm-opened .sp_nav span.top-bar {
    transform: rotate(45deg);
    top: 10px;
}

html.mm-opened .sp_nav span.middle-bar {
    opacity: 0;
    left: -40px;
}

html.mm-opened .sp_nav span.bottom-bar {
    transform: rotate(-45deg);
    top: -7px;
}

#_jq_sp_menu {
    background-color: #1f7c87;
    z-index: 10;
}

.navigation_active {
    padding: 20px;
    background-color: #343433;
}

.navigation_active h3 {
    font-size: 26px;
    margin: 30px 0 15px 0;
    color: #646461;
    font-weight: 700;
}

.navigation_active a {
    color: #e0e0e0;
    border-bottom: 1px solid #434342;
    display: block;
    padding: 15px 0;
    font-size: 14px;
}

.navigation_active a:last-child {
    border-bottom: none;
}

.mob_active {
    background-color: #1f7c87;
    z-index: 10;
    position: absolute;
    left: 0;
    top: 94px;
    padding: 15px;
    width: 100%;
    display: none;
}

.mob_active li {
    border-bottom: 1px dashed #fff;
    margin-bottom: 20px;
    padding-bottom: 20px;
}

.mob_active li:last-child {
    border-bottom: none;
    padding-bottom: 0;
    margin-bottom: 0;
}

.mob_active a {
    color: #fff;
    font-weight: 700;
}

.mob_active .sub {
    padding: 20px 0 10px 00px;
}

.mob_active .sub li {
    border-bottom: none;
    padding-bottom: 0px;
}

.mob_active .sub li:last-child {
    padding-bottom: 0;
}

.mob_active .sub a {
    font-weight: 300;
}

.mob_active .lang_nav {
    background-color: #fff;
    padding: 20px;
    cursor: pointer;
}

/*mob lang*/

.lang_nav .lang_active {
    margin-top: 10px;
    display: none;
    border-top: 1px dashed #555454;
    padding-top: 15px;
}

.lang_nav .lang_active li {
    margin-bottom: 15px;
    padding-bottom: 0;
}

.lang_nav .lang_active li:last-child {
    margin-bottom: 0;
}

.lang_nav .lang_active a {
    color: #555454;
    font-weight: 300;
}

/*bookBtn*/

.bookBtn {
    background-color: #e8b612;
    position: relative;
    overflow: hidden;
}

.bookBtn a {
    color: #fff;
    padding: 20px 30px;
    display: inline-block;
    font-weight: 700;
    position: relative;
    z-index: 10;
}

.bookBtn .fill,
.btn .fill {
    animation-name: emptyAction;
    animation-iteration-count: 1;
    animation-timing-function: cubic-bezier(0, 0.4, 0.6, 0.8);
    animation-duration: 2s;
    animation-fill-mode: forwards;
    opacity: 1;
    position: absolute;
    top: 57px;
    left: 0;
    width: 350px;
    height: auto;
    z-index: 9;
}

.bookBtn:hover > .fill,
.btn:hover > .fill {
    animation-name: fillAction;
    animation-iteration-count: 1;
    animation-timing-function: cubic-bezier(0, 0.4, 0.6, 0.8);
    animation-duration: 0.4s;
    animation-fill-mode: forwards;
}

.bookBtn #waveShape,
.btn #waveShape {
    animation-name: waveAction;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    animation-duration: 1s;
}

@keyframes fillAction {
    0% {
        transform: translate(0, -15px);
    }
    100% {
        transform: translate(0, -50px);
    }
}

@keyframes emptyAction {
    0% {
        transform: translate(0, -50px);
    }
    100% {
        transform: translate(0, -15px);
    }
}

@keyframes waveAction {
    0% {
        transform: translate(-135px, 0);
    }
    100% {
        transform: translate(0, 0);
    }
}

.m_rez {
    display: none;
    position: absolute;
    left: 0;
    margin-left: 20px;
    bottom: 27px;
}

.m_rez a {
    padding: 15px 25px;
}

/*lang*/

.lang {
    margin-left: 30px;
    position: relative;
    /*margin-top: -5px;*/
}

.lang a {
    font-size: 0.875rem;
    /*14px*/
    display: inline-block;
    color: #a2a2a2;
    border-left: 1px solid #a2a2a2;
    border-right: 1px solid #a2a2a2;
    /*padding: 44px 30px 41px 30px;*/
    height: 95px;
    line-height: 95px;
    padding: 0 30px;
}

.lang span.icon {
    margin-left: 3px;
    transition: transform 0.8s ease-in-out;
    display: inline-block;
}

.lang a:hover span.icon {
    transform: rotate(360deg);
}

.lang .active {
    background-color: #fff;
    padding: 0px 30px 17px 29px;
    position: absolute;
    border-left: 1px solid #a2a2a2;
    border-right: 1px solid #a2a2a2;
    border-bottom: 1px solid #a2a2a2;
    display: none;
    width: 100%;
}

.lang .active a {
    display: block;
    border-right: none;
    border-left: none;
    padding: 10px 0;
    height: auto;
    line-height: normal;
}

.lang .active a:hover {
    color: #1f7c87;
}

.lang .active a:last-child {
    border-bottom: none;
}

/******MEDIA QUERIES******/

@media screen and (max-width: 1500px) {
    /*nav*/
    .menuLink {
        margin-right: 25px;
    }
}

@media screen and (max-width: 1400px) {
    /*nav*/
    .menuLink {
        margin-right: 20px;
    }
    .menuLink a {
        font-size: 16px;
    }
    .bookBtn a {
        padding: 17px 23px;
    }
    .lang a {
        padding: 0 25px;
    }
    .lang .active {
        padding: 0px 30px 17px 25px;
    }
}

@media screen and (max-width: 1285px) {
    /*nav*/
    .menuLink {
        margin-right: 15px;
    }
    .bookBtn a {
        padding: 17px 17px;
    }
    .lang {
        margin-left: 15px;
    }
    .lang a {
        padding: 0 17px;
    }
    .lang .active {
        padding: 0px 30px 17px 17px;
    }
}

@media screen and (max-width: 1200px) {
    /*nav*/
    .menuLink {
        margin-right: 10px;
    }
    .menuLink a {
        font-size: 15px;
    }
    .bookBtn a {
        padding: 17px 11px;
    }
    .lang {
        margin-left: 15px;
    }
    .lang a {
        padding: 0 17px;
    }
    .lang .active {
        padding: 0px 30px 17px 17px;
    }
}

@media screen and (max-width: 1200px) {
    .headerExtra {
        display: none;
    }
}

@media screen and (max-width: 1135px) {
    /*nav*/
    header {
        padding: 0 15px;
    }
    .headerExtra {
        padding: 10px 15px 10px 0;
    }
    nav {
        display: none;
    }
    .mob_nav {
        display: block;
    }
    .m_rez {
        display: block;
    }
    /*logo*/
    .logo-desktop {
        position: absolute;
        top: 9px;
        left: 50%;
        transform: translateX(-50%);
    }
}

@media screen and (max-width: 660px) {
    header {
        padding: 0 15px;
    }
}

@media screen and (max-width: 550px) {
    header {
        height: 65px;
    }
    .headerExtra a {
        font-size: 0.875rem;
    }
    .mob_nav {
        top: 20px;
    }
    .logo-desktop {
        left: 15px;
        right: auto;
        top: 10px;
        transform: none;
    }
    .logo-desktop .desktop {
        display: none;
    }
    .logo-desktop .mob {
        width: 145px;
        display: block;
    }
    .bookBtn {
        display: none;
    }

    .mobToolbar li .foot-mob-nav span {
        background: #fff;
        border-radius: 4px;
        display: block;
        height: 2px;
        margin: 0 auto 4px auto;
        position: relative;
        top: 0;
        left: 0;
        width: 20px;
    }

    .mobToolbar li .foot-mob-nav span:nth-child(3) {
        margin-bottom: 10px;
    }
}

@media screen and (max-width: 485px) {
    .fixed_header {
        /*position:relative;*/
    }
}

/* Header
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.header {
    height: 100vh;
    z-index: 1;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
}

.header-slider {
	height: 100%;
	width: 100%;
}

.header-slider-img {
	background-size: cover;
	height: 100svh;
	width: 100%;
}

.header-nav {
	
}

.header-nav-left {
	position: absolute;
	top: 50%;
	left: 20px;
}

.header-nav-right {
	position: absolute;
	top: 50%;
	right: 20px;
}

.header-nav a {
	display: block;
	width:20px;
	transition:all .3s ease;
	&:hover {
		opacity: 0.8;
	}
}



/******MEDIA QUERIES******/

@media screen and (max-width: 1200px) {
    .header {
        margin: 0;
    }
}

/*slider txt*/

.slider_txt {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    right: 0;
    color: #fff;
    text-align: center;
}

.slider_txt strong {
    font-family: "Carlito", sans-serif;
    font-size: 6vw;
    display: block;
}

.slider_txt span {
    font-weight: 300;
    font-size: 2.5vw;
    display: block;
    margin-top: 5px;
    font-family: "Carlito", sans-serif;
}

.slider_txt a {
    width: 100px;
    height: 100px;
    display: inline-block;
    text-indent: -9999px;
    margin-top: 15px;
}

.slider_txt .play {
    background-image: url(../images/icon_360_index.png);
    background-size: 100px;
    background-repeat: no-repeat;
}

.slider_txt .stop {
    background-image: url(../images/icon_video_stop.png);
    background-size: 48px;
}

.slider_txt a {
    animation: beat_anim 1s infinite;
}

.slider_txt a:hover {
    animation-play-state: paused;
}

@keyframes beat_anim {
    0% {
        /*transform: scale( 1 );*/
    }
    20% {
        transform: scale(0.75);
    }
    40% {
        transform: scale(1);
    }
    60% {
        transform: scale(0.75);
    }
    80% {
        transform: scale(1);
    }
    100% {
        transform: scale(1);
    }
}

.header .video {
    display: none;
    text-align: center;
}

.header .video video {
    position: absolute;
}

/*booking*/

.booking {
    position: absolute;
    left: 0;
    right: 0;
    top: -110px;
    text-align: left;
    width: 100%;
    overflow: visible;
}

.header_booking {
    max-width: 740px;
}

.booking_bungalows {
    max-width: 100%;
}

.booking span {
    color: #fff;
    font-size: 12px;
    font-weight: 400;
    margin-bottom: 10px;
    display: block;
    font-family: "Carlito", sans-serif;
    line-height: 20px;
}

.booking ul {
    display: flex;
    background: rgba(0, 0, 0, 0.5);
    padding: 30px;
}

.booking li {
    width: 50%;
    margin-right: 15px;
    position: relative;
}

.booking li.btn {
    flex: 1;
}

.header_small .booking li {
    width: 50%;
}

.header_small .booking li.btn {
    flex: 1;
}

.booking input,
.booking select {
    height: 50px;
    width: 100%;
}

.booking li a {
    position: absolute;
    right: 10px;
    top: 9px;
    max-width: 30px;
}

.booking li.btn {
    width: 180px;
    margin-right: 0;
    flex: 1;
}

.booking button {
    background: rgba(232, 182, 18, 0.8);
    color: #fff;
    /*font-size:15px;*/
    border: 1px solid #fff;
    height: 50px;
    width: 100%;
    padding: 0;
}

.booking button:hover {
    background: rgba(212, 166, 16, 1) none repeat scroll 0 0;
}

/* calendar */

.calendar {
    width: 48%;
    border-radius: 5px;
    overflow: hidden;
    display: block;
    margin-bottom: 10px;
    padding: 0 8px 10px 8px;
    box-sizing: border-box !important;
}

.calendar-box {
    font-size: 16px;
    font-weight: 700;
    color: #fff;
    display: block;
    margin: 0 0 15px 0;
    text-transform: uppercase;
    text-align: center;
    letter-spacing: 1px;
    background-color: #2e858f;
    padding: 20px;
}

.calendar span {
    font-size: 14px;
    font-weight: 400;
    color: #6f6f6f;
    text-align: center;
    width: 14.27%;
    height: 20px;
    /*display: inline-block;*/
    float: left;
    overflow: hidden;
    line-height: 3;
    padding-bottom: 14%;
    border-bottom: 1px solid #ebe9e9;
    border-right: 1px solid #ebe9e9;
    margin-bottom: 0;
}


.accomodation .calendar span {
height:calc(100% / 7);
padding:0;
}

.accomodation .calendar-content {
height:100%;
}

.accomodation .calendar-content-main-div {height:100%;}

.calendar span:nth-last-child(-n + 7) {
    border-bottom: none;
}

.calendar span.no-right-border {
    border-right: none;
}

.calendar span.no-bottom-border {
    border-bottom: none;
}

.calendar span.date-disabled {
    color: #cbcbcb;
}

.calendar span.date-occupied {
    color: #cbcbcb;
}

.calendar-content-main-div {
    display: none;
}

.calendar-content {
    display: flex;
    justify-content: center;
    background-color: #fff;
    position: relative;
    z-index: 50000;
    padding: 10px 20px 0 20px;
}

.calendar-wrapper {
    display: flex;
    justify-content: center;
}

._jq_kalendar_datum_odb {
    cursor: pointer;
}

._jq_kalendar_datum_odb:hover,
.calendar span.active,
._jq_kalendar_datum_odb:hover .calendar-date,
.calendar span.active .calendar-date,
.calendar span.date-arrival:hover,
.calendar span.date-departure:hover {
    background-color: rgba(140, 175, 62, 1);
    color: #ffffff;
}

.calendar-legend {
    display: flex;
    justify-content: center;
    margin-top: 30px;
    margin-bottom: 60px;
}

.calendar-legend__item {
    font-size: 14px;
    display: flex;
    align-items: center;
}

.calendar-legend__item {
    margin-right: 15px;
}

.calendar-legend__item:last-child {
    margin-right: 0;
}

.cube-grey {
    background-color: #a2a2a2;
    width: 15px;
    height: 15px;
    display: inline-block;
    margin-right: 10px;
}

.cube-blue {
    background-color: rgba(140, 175, 62, 1);
    width: 15px;
    height: 15px;
    display: inline-block;
    margin-right: 10px;
}

.cube-red {
    background-color: #fe0101;
    width: 15px;
    height: 15px;
    display: inline-block;
    margin-right: 10px;
}

.cal-arrow svg {
    width: 21px;
}

.cal-arrow-left {
    transform: rotate(90deg);
    position: absolute;
    left: 10px;
    top: 31px;
	z-index:10;
}

.cal-arrow-right {
    transform: rotate(-90deg);
    position: absolute;
    right: 10px;
    top: 31px;
z-index:10;

}

.accomodation .calendar-content-close {
        text-align: center;
        padding: 20px;
        position: absolute;
        top: -50px;
        width: 100%;
        background-color: #fff;
    }

.accomodation .calendar-content-close svg {
        width: 20px;
        fill: #555454;
    }

/******MEDIA QUERIES******/

@media screen and (max-width: 768px) {
    .booking ul {
        /*display: block;*/
    }
    .booking li {
        /*width: 100%;*/
        /*margin-bottom: 15px;*/
    }
    .booking {
        top: -110px;
    }
}

@media screen and (max-width: 478px) {
    .booking {
        top: -155px;
    }
    .booking li {
        width: 100%;
    }
}

@media screen and (max-width: 1024px) {
    .calendar-content {
        flex-direction: column;
        padding: 60px 0 0 0;
        margin: 0 0px;
        position: fixed;
        left: 0;
        top: 0;
        height: 100vh;
        justify-content: flex-start;
        width: 100%;
    }

    .calendar-wrapper {
        flex-direction: column;
    }

    .calendar-content-close, .accomodation .calendar-content-close {
        text-align: center;
        padding: 20px;
        position: fixed;
        top: 0;
        width: 100%;
        background-color: #fff;
    }

    .calendar-content-close svg {
        width: 20px;
        fill: #555454;
    }

    .calendar-content-div {
        height: 100vh;
        overflow-y: auto;
        width: 100%;
    }

    .calendar {
        width: 100%;
    }

    .cal-arrow {
        display: none;
    }

    .calendar span {
        line-height: 4;
    }
}

@media screen and (max-width: 600px) {
    .slider_txt strong {
        font-size: 11vw;
    }

    .slider_txt span {
        font-size: 5.5vw;
    }
}

@media screen and (max-width: 480px) {
    .slider_txt {
        /*display: none;*/
    }

    .booking ul {
        flex-direction: column;
        align-items: center;
        padding: 20px;
    }

    .booking li {
        margin-right: 0;
    }

    .header_small .booking li {
        width: 100%;
    }

    .booking li:first-child {
        margin-bottom: 15px;
    }

    .booking li.btn {
        margin-bottom: 0;
    }

    .slider_txt strong {
        font-size: 13vw;
    }

    .slider_txt span {
        font-size: 7.5vw;
    }
}

/*booking bungalows*/

.modul2 h4 {
    margin-right: 0;
}

.booking_bungalows {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    padding: 0;
    overflow: visible;
}
.booking_bungalows ul {
    flex-wrap: wrap;
    background-color: transparent;
    padding: 0;
}
.booking_bungalows li {
    width: 65%;
}
.booking_bungalows li:nth-child(odd) {
    margin-right: 2.5%;
}

@media screen and (max-width: 485px) {
    .booking_bungalows li:nth-child(2n + 1) {
        margin-right: 0;
    }
}

.booking_bungalows {
    /*background-color: #fff;*/
}
.booking_bungalows input,
.booking_bungalows select {
    background-color: #ffffff;
}

.booking_person svg {
    width: auto;
    height: 25px;
    fill: #1f7c87;
}
.booking_person--small svg {
    height: 20px;
    width: auto;
}

.modul2 .modul2_buttons a.button {
    margin-top: 0;
    display: flex;
    align-items: center;
    margin-right: 10px;
    padding: 20px 15px;
    width: 33%;
}
.modul2 .modul2_buttons a.button:last-child {
    margin-right: 0;
}
.modul2_buttons {
    margin-bottom: 30px;
    display: flex;
}
.modul2_buttons img {
    width: 25px;
    margin-right: 7px;
    vertical-align: text-bottom;
}
.modul2_buttons--bungalows {
    margin-bottom: 20px;
}

.booking_bungalows .calendar-content {
    width: 100%;
    top: 0px;
    overflow-x: hidden;
    padding: 10px 5px 0 5px;
}

.booking_bungalows .calendar-content:before {
    content: "";
    background-color: #fff;
    width: 40px;
    height: 100%;
    position: absolute;
    left: -40px;
    top: 0;
}

.booking_bungalows .calendar-content:after {
    content: "";
    background-color: #fff;
    width: 40px;
    height: 100%;
    position: absolute;
    right: -40px;
    top: 0;
}

@media screen and (max-width: 1200px) {
    .modul2 .modul2_buttons a.button {
        width: 25%;
    }
    .booking_bungalows li {
        width: 50%;
    }
}

@media screen and (max-width: 768px) {
    .booking_bungalows .calendar-content {
        padding: 60px 0 0 0;
    }
}

@media screen and (max-width: 485px) {
    .modul2 .modul2_buttons a.button {
        width: 33%;
    }
    .booking_bungalows li {
        width: 100%;
    }

    .booking li.btn {
        width: 100%;
    }

    .b_list li {
        margin-right: 0;
    }
}


/*header_small*/



.header_small {
    padding-top: 95px;
    min-height: 600px;
    }

.head-no-img {min-height:auto; padding-top:135px;}

.header_small img {
    width: 100%;
}

.header_small .booking {
    top: 490px;
    max-width: 740px;
}

/******MEDIA QUERIES******/

@media screen and (max-width: 1200px) {
    .header_small {
        margin: 0 0 40px 0;
    }

    .header_small .booking {
    }

	.head-no-img {padding-top:95px;}
	
}

@media screen and (max-width: 768px) {
    .header_small {
        z-index: 4;
    }
	.head-no-img {padding-top:0px;}

}
@media screen and (max-width: 480px) {
    .header_small .booking {
        top: 445px;
    }


}

/* Content
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.content {
    position: relative;
    z-index: 1;
    background-color: #fff;
}

/*modul1*/


.modul1 .zoom-in:before {
	content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background:linear-gradient(180deg,rgba(42, 123, 155, 0) 0%, rgba(61, 61, 61, 0) 60%, rgba(0, 0, 0, 0.83) 100%);
}

.modul1 {
    padding: 35px 40px 0 40px;
}

.tablet {
    display: block;
}

.modul1 .grid_4,
.modul1 .grid_5,
.modul1 .grid_3 {
    margin: 0 1% 0 0;
    position: relative;
}

.modul1 .grid_4 {
    width: 32.66%;
}

.modul1 .grid_5 {
    width: 41.08%;
}

.modul1 .grid_3 {
    width: 24.25%;
}

.modul1 div:last-child {
    margin-right: 0;
}

.modul1 .grid_4 img {
    width: 100%;
}

.modul1 .info {
    position: absolute;
    bottom: 20px;
    left: 0;
    right: 0;
    padding: 0 20px;
}

.modul1 .info .nsl {

    color: #fff;
    font-size: 24px;
    font-weight: 700;
    display: inline-block;

}

.modul1 .info .txt {
    margin-right: 16px;
    display: table;
	color: #fff;
	margin-top: 5px;
}

.modul1 .info .txt p {
    line-height: normal;
    font-size: 1.3rem;
}

.modul1 .info .txt small {
    font-size: 1.125rem;
    /*18px;*/
}

.modul1 a.button {
    margin-top: 10px;
}

.modul1 .half {
    overflow: hidden;
}

.modul1 {
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    transition: all 0.3s ease;
    opacity: 1;
}

.modul1 .wrapper:hover .zoom-in:not(:hover) {
    opacity: 0.6;
}

/******MEDIA QUERIES******/

    .modul1 {
        padding: 35px 10px 0 10px;
    }
    .modul1 .grid_4 {
        /*width:100%; margin-bottom:10px;*/
    }
    .modul1 .grid_4 .half {
        /*margin-bottom:10px;*/
    }
    .modul1 {
        padding: 40px 0 0 0;
        overflow: auto;
        margin: 0 15px;
    }
    .modul1 .wrapper {
        width: 1200px;
    }
    .modul1 .zoom-in:hover {
        transform: none;
        opacity: 1;
        z-index: 1;
    }
    .modul1:hover .zoom-in:not(:hover) {
        opacity: 1;
    }
    .desktop {
        display: none;
    }
    .tablet {
        display: block;
    }
    .tablet .m1_tablet {
        width: 420px;
        height: 420px;
        margin-right: 1.5%;
        flex: 0 0 auto;
        position: relative;
    }
    .tablet .m1_tablet .zoom-in {
        height: 420px;
    }
    .tablet .wrapper {
        display: flex;
        flex-direction: row;
    }

@media screen and (max-width: 855px) {
    .modul1 .wrapper {
        width: 855px;
    }
}

@media screen and (max-width: 488px) {
    .modul1 {
        padding: 15px 0 0 0;
    }
    .modul1 .wrapper {
        width: 715px;
    }
    .modul1 .info .nsl {
        font-size: 1rem;
    }
    .modul1 .info .txt p {
        font-size: 1rem;
    }
    .tablet .m1_tablet {
        width: 280px;
        height: 350px;
    }
    .tablet .m1_tablet .zoom-in {
        height: 350px;
    }
}

/*title (outside any module)*/

.title {
    margin-top: 60px;
}

/*modul2*/

.modul2 {
    margin-top: 60px;
    clear: both;
}

.txt_intro {
    margin-top: 30px;
}

.modul2 .row {
    display: flex;
    flex-wrap: wrap;
    position: relative;
    /*z-index: 5;*/
}

/*image*/

.modul2 .image {
    width: 85%;
}

/*text*/

.modul2 .text {
    background-color: #fff;
    display: flex;
    align-items: center;
    position: absolute;
    right: 0px;
    top: 0;
    padding: 40px;
    width: 50%;
    max-width: 660px;
}

.modul2 .text .grid_8 {
    width: 100%;
    position: relative;
    margin-right: 0;
}

.modul2 a.button {
    margin-top: 40px;
}

.modul2 .text .fade {
    position: relative;
    max-height: 135px;
    overflow: hidden;
}

.modul2 .text .fade:after {
    content: "";
    position: absolute;
    top: 50px;
    left: 0;
    height: 85px;
    width: 100%;
    background: linear-gradient(0deg, rgb(255, 255, 255) 0%, rgba(255, 255, 255, 0) 100%);
}

.modul2 .text .grid_8 .cal-arrow-left {
    left: -5px;
}

.modul2 .text .grid_8 .cal-arrow-right {
    right: -5px;
}

.modul2 .text .grid_8 

/*toolbox (icons over pictures)*/

.toolbox {
    position: absolute;
    left: 0;
    right: 0;
    bottom: -29px;
    text-align: center;
}

.toolbox a.ikona {
    margin: 0 5px;
    background-color: #fff;
    border-radius: 50%;
    padding: 10px;
    display: inline-block;
    transition: all 0.3s ease-in-out;
}

.toolbox a.ikona:hover {
    transform: scale(1.8);
}

.toolbox a img {
    max-width: 35px;
}

/******MEDIA QUERIES******/

@media screen and (max-width: 1260px) {
    .modul2 {
        margin-top: 30px;
    }
    .modul2 .image {
        width: 100%;
    }
    /*.modul2 .text {
		position: relative;
		top: 0;
		padding: 45px 15px 0px 15px;
		width: 100%;
	}*/
    .two_columns {
        column-count: 1;
    }
    .toolbox {
        z-index: 5;
    }
    .title {
        margin-top: 40px;
    }
}

@media screen and (max-width: 480px) {
    .modul2 .text {
        padding: 35px 15px 0 15px;
    }
}

/*modul3*/

.modul3 {
    clear: both;
    margin-top: 60px;
}

.modul3 .row {
    text-align: center;
}

.modul3 h1 {
    margin-bottom: 35px;
}

.grey_bg {
    background-color: #1f7c87;
    border-bottom: 5px solid #d9d9d9;
    padding: 65px 15px 40px 15px;
    color: #fff;
}

.list ul li {
    margin: 0 30px 40px 7px;
    font-size: 1.125rem;
    /*18px;*/
    line-height: normal;
    background-image: url(../images/icon_bullet.png);
    background-repeat: no-repeat;
    background-position: left center;
    padding-left: 20px;
    display: inline-block;
    margin-bottom: 30px;
    min-width: 23%;
    background-size: 10px;
}

@media screen and (max-width: 480px) {
    .modul3 {
        margin-top: 40px;
    }
    .modul3 h1 {
        margin-bottom: 20px;
    }
}

/*@media screen and (max-width: 1200px) {
.modul3 {margin-top:40px;}
}*/

/*modul4*/

.modul4 {
    margin-top: 40px;
    padding: 0 1%;
    overflow: hidden;
    position: relative;
    /*cursor: pointer;*/
}

.modul4 .wrapper {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: 31%;
    /*overflow-x: auto;*/
    overscroll-behavior-inline: contain;
    scroll-snap-type: inline mandatory;
}

.modul4 .wrapper > * {
    scroll-snap-align: start;
}

.modul4 .grid_4 {
    /*margin: 0 1% 0 0;*/
    width: auto;
    position: relative;
    overflow: hidden;
}

.modul4 .grid_4 img {
    width: 100%;
}

.modul4 .omega {
    margin-right: 0;
}

.modul4 .info {
    position: absolute;
    bottom: 20px;
    left: 0;
    right: 0;
    padding: 0 5%;
    text-align: center;
    transform: translateY(0);
    transition: transform 0.25s ease;
}

.modul4 .grid_4:hover .info {
    transform: translateY(-40px);
}

.modul4 .info .nsl {
    background: rgba(140, 175, 62, 1);
    color: #fff;
    padding: 17px;
    font-size: 22px;
    font-weight: 700;
    display: inline-block;
    margin-bottom: -7px;
}

.modul4 .info .txt {
    background: rgba(255, 255, 255, 0.9);
    font-size: 1.375rem;
    /*22px;*/
    padding: /*2%;*/ 15px;
    display: table;
    margin: 0 auto;
}

.modul4 .info .txt p {
    line-height: 1.4;
}

.modul4 .grid_4 span.button {
    margin-top: 10px;
    opacity: 0;
    transform: translateY(150%);
    transition-delay: 0s, 0s, 0s, 0s;
    transition-duration: 0.25s, 0.25s, 0.15s, 0.15s;
    transition-property: opacity, transform, box-shadow, background;
    /*transition-timing-function: cubic-bezier(1, 0.53, 0.79, 0.68);*/
}

.modul4 .grid_4:hover span.button {
    opacity: 1;
    transform: translateY(0px);
}

.modul4 .nav {
    clear: both;
    overflow: hidden;
}

.modul4 .nav ul {
    text-align: center;
    clear: both;
    margin-top: 20px;
}

.modul4 .nav ul li {
    position: absolute;
    top: 40%;
    /*display: none;*/
}

.modul4 .nav ul li.left {
    left: 35px;
}

.modul4 .nav li.right {
    right: 35px;
}

.modul4 .nav ul li a {
    position: relative;
    opacity: 0.7;
}

.modul4 .nav ul li a:hover {
    opacity: 0.8;
}

.modul4 .nav li svg {
    width: 60px;
}

.modul4 .nav li.left svg {
    transform: rotate(-180deg);
}

/*.modul4 .nav ul li a:before {
    color: #fff;
    content: "×";
    display: inline-block;
    font-family: 'Carlito', sans-serif;
    font-size: 240px;
    font-weight: bold;
    height: 151px;
    line-height: 117px;
    overflow: hidden;
    position: absolute;
    width: 103px;
}

.modul4 .nav ul li a:after {
	border-color: rgba(255, 255, 255, 0) rgba(255, 255, 255, 0) rgba(255, 255, 255, 0) white;
	border-style: solid;
	border-width: 25px 0 25px 24px;
	content: "";
	display: inline-block;
	height: 0;
	position: absolute;
	width: 0;
}

.modul4 .nav ul li.left a:before {
    transform: rotateZ(180deg);
}

.modul4 .nav ul li.left a:after {
    transform: rotateZ(180deg);
    left: -22px;
    top: 49px;
}

.modul4 .nav ul li.right a:before {
    transform: rotateZ(0deg);
}

.modul4 .nav ul li.right a:after {
    transform: rotateZ(0deg);
    left: 101px;
    top: 51px;
}*/

.modul4 div:last-child {
    margin-right: 0;
}

.modul4 .grid_4 {
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    transition: all 0.3s ease;
    opacity: 1;
}

.modul4 .grid_4 a {
    display: none;
}

/*.modul4 .wrapper:hover .grid_4:not(:hover) {
	opacity: 0.5;
}*/

/******MEDIA QUERIES******/

@media screen and (max-width: 1200px) {
    /*.modul4 {
		padding: 60px 0 0 0;
		overflow: auto;
		margin: 0 15px;
	}
	.modul4 .wrapper {
		width: 1200px;
		display: flex;
	}
	.modul4 .nav {
		display: none;
	}
	.modul4 .grid_4 {
		flex: 0 0 auto;
	}*/
    .modul4 .wrapper {
        overflow-x: auto;
    }

    .modul4:hover .grid_4:not(:hover) {
        opacity: 1;
    }

    .modul4 .nav {
        display: none;
    }
}

/*@media screen and (max-width: 855px) {
	.modul4 .wrapper {
		width: 855px;
	}
}*/

/*@media screen and (max-width: 488px) {
	.modul4 {
		padding: 40px 0 0 0;
	}
	.modul4 .wrapper {
		width: 715px;
	}
}*/

@media screen and (max-width: 700px) {
    .modul4 .wrapper {
        grid-auto-columns: 45%;
    }
}

@media screen and (max-width: 600px) {
    .modul4 .info {
        transform: translateY(0);
    }
}

@media screen and (max-width: 488px) {
    .modul4 .wrapper {
        grid-auto-columns: 75%;
    }
}

/* Bungalovi
–––––––––––––––––––––––––––––––––––––––––––––––––– */

/*intro*/

.bungalow .intro {
    text-align: center;
}

.intro p {
    margin: 40px 0;
}

/*icons (dodatni sadrzaji)*/

.icons {
    display: flex;
}

.icons .left {
    background-color: #ececec;
    padding: 55px 40px 55px 40px;
    font-size: 50px;
    color: #1f7c87;
    font-weight: 400;
    border-right: 10px solid #1f7c87;
    width: 30%;
    text-align: right;
    min-width: 300px;
}

.icons .left small {
    font-size: 1.813rem;
    /*29px;*/
    font-weight: 300;
    color: #555454;
    display: block;
}

.icons .right {
    background-color: #fcfcfc;
    width: 70%;
    display: flex;
    align-items: center;
    padding: 0 40px;
    overflow-x: auto;
}

.icons ul {
    display: flex;
    align-items: flex-start;
}

.icons li {
    margin: 0 20px;
    text-align: center;
}

.icons li p {
    line-height: 1.2;
    margin-top: 15px;
}

.icons .right img {
    max-width: 70px;
}

/******MEDIA QUERIES******/

@media screen and (max-width: 1200px) {
    .icons .right {
        flex-wrap: no-wrap;
        overflow-x: auto;
    }
    .icons li {
        flex: 0 0 auto;
    }
    .icons {
        flex-direction: column;
    }
    .icons .left {
        width: 100%;
        text-align: left;
        font-size: 29px;
        padding: 25px 15px;
    }
    .icons .left small {
        display: inline-block;
    }
    .icons .right {
        width: 100%;
        padding: 20px;
    }
}

/*bungalow list*/

/*text*/

.b_list .grid_6 {
    padding: 30px 0;
}

/*.b_list .text {
	width: 40%;
	padding: 40px;
}*/

.b_list strong.nsl {
    font-size: 25px;
    font-weight: 700;
    border-bottom: 1px solid #d5d5d5;
    padding-bottom: 10px;
    margin-bottom: 18px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    /*margin-right: 30px;*/
}

.nsl-persons {
    width: 100%;
    margin-top: 10px;
    font-weight: 400;
    font-size: 16px;
}
.nsl-persons p {
    display: inline;
    margin-right: 7px;
}

.b_list li {
    display: block;
    margin: 0 0 20px 0;
}

/*@media screen and (max-width: 485px) {

	.b_list li {
		margin-right:0;
	}
}*/

.b_list .border {
    /*border-right: 1px solid #d5d5d5;*/
    /*padding-right: 25px;
    margin-right: 25px;*/
}

.price small {
    display: block;
    color: #8b8989;
    font-size: 1.25rem;
    /*20px;*/
    margin-bottom: 10px;
}

.price strong {
    font-size: 2.813rem;
    /*45px;*/
    font-weight: 400;
    margin-right: 5px;
}

.price span {
    font-size: 1.563rem;
    /*25px;*/
}

.b_list .btns {
    display: flex;
}

.booking_bungalows li.btn {
    /*width:48.75%;*/
    flex: 1;
}

.b_list .btns ._jq_btn_prikazi_manje {
    display: none;
}

.details-overlay-bg {
    background-color: rgba(0, 0, 0, 0.6);
    height: 100%;
    width: 100%;
    position: absolute;
    z-index: 5000;
    left: 0;
    top: 0;
    display: none;
}
.details-overlay {
    position: absolute;
    top: 50%;
    left: 50%;
    background-color: #fff;
    padding: 0;
    z-index: 5000;
    transform: translateX(-50%);
    width: 50%;
    max-height: 100vh;
    overflow-y: auto;
}
.details-overlay-close-div {
    position: sticky;
    width: 100%;
    height: 40px;
    background-color: #fff;
    z-index: 5001;
    top: 0;
}
.details-overlay-close {
    position: absolute;
    top: 11px;
    right: 20px;
}
.details-overlay-close svg {
    width: 18px;
    height: auto;
}

.details-overlay-text {
    padding: 30px;
}

.details-overlay-gallery {
    position: relative;
}
.details-overlay-gallery-right {
    position: absolute;
    right: 0px;
    top: 50%;
    transform: translateX(-50%);
}
.details-overlay-gallery-right svg {
    fill: #fff;
    width: 25px;
}

.details-overlay-gallery-left {
    position: absolute;
    left: 20px;
    top: 50%;
    transform: translateX(-50%);
}
.details-overlay-gallery-left svg {
    fill: #fff;
    width: 25px;
    transform: rotate(180deg);
}

.details-overlay-gallery img {
    width: 100%;
}

.details-overlay-map {
    padding: 0;
}

@media screen and (max-width: 1500px) {
    .details-overlay {
        width: 90%;
    }
}

@media screen and (max-width: 600px) {
    .details-overlay {
        width: 100%;
    }
    .details-overlay {
        /*padding: 40px 0 0 0;*/
    }
    .details-overlay-text {
        padding: 20px;
    }
    .details-overlay-gallery-left svg,
    .details-overlay-gallery-right svg {
        width: 15px;
    }
}

/******MEDIA QUERIES******/

@media screen and (max-width: 1700px) {
    .modul2 .text {
        width: 50%;
        max-width: 620px;
    }

    /*.modul2 .text .grid_8 {
        width: 100%;
        position: relative;
    }*/
}

@media screen and (max-width: 1200px) {
    .bungalow .intro {
        text-align: left;
    }
    .b_list .modul2:last-child .text {
        padding: 40px 15px 0 15px;
    }
    .modul2 .text {
        display: block;
        width: 100%;
        padding: 40px 15px 0 15px;
        position: relative;
        max-width: 100%;
    }
    .b_list .border {
        border-right: none;
        margin: 0;
        padding: 0;
    }
    .b_list .grid_6 {
        width: 100%;
        padding: 0;
    }
    .b_list .second {
        background-color: #fafafa;
        text-align: center;
        padding: 20px 0;
        margin-top: 15px;
    }
    .b_list .second .btns {
        display: block;
    }
    .modul2 a.button {
        margin-top: 15px;
    }

    .modul2 .text .grid_8 {
        width: 100%;
    }
    .modul2_buttons {
        position: absolute;
        top: -70px;
        width: 100%;
        justify-content: center;
    }
    .modul2 .modul2_buttons a.transparent {
        background-color: #fff;
    }
    .modul2 .text strong.nsl,
    .modul2 .text .grid_8 h4 {
        margin-top: 40px;
    }
}

@media screen and (max-width: 855px) {
    .booking_bungalows ul {
        display: flex;
    }
}

@media screen and (max-width: 500px) {
    .modul2_buttons img {
        /*display:none;*/
    }
    .modul2 .modul2_buttons a.button {
        margin-right: 5px;
        font-size: 14px;
        padding: 15px;
    }
    .modul2_buttons {
        top: -75px;
    }
}

/* Contact
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.contact {
    margin-top: 60px;
}

.contact .title {
    margin-bottom: 60px;
}

.contact .title p {
    margin-top: 10px;
}

.contact .info {
    display: none;
}

.contact .tabs a {
    padding: 25px 50px;
    display: inline-block;
    background-color: #e8b612;
    color: #fff;
    font-weight: 700;
    transition: background 0.3s ease, color 0.3s ease;
}

.contact .tabs .active,
.contact .tabs a:hover {
    background-color: #f3f3f3;
    color: #545454;
}

.contact .form {
    background-color: #f3f3f3;
    padding: 40px;
}

.contact .form ul {
    display: flex;
    align-items: flex-end;
}

.contact .form li {
    margin-right: 20px;
    margin-bottom: 25px;
    width: 100%;
    position: relative;
}

.contact .form li:last-child {
    margin-right: 0;
}

.contact .form input,
.contact .form select {
    width: 100%;
    height: 50px;
}

.contact .form label {
    margin-bottom: 10px;
    display: block;
}

.contact .form p {
    display: block;
}

.contact .form p {
    font-weight: 700;
    font-size: 16px;
    margin-bottom: 5px;
}

.contact .form-kids {
    flex-wrap: wrap;
}

.contact .form-kids li {
    width: 32.1%;
}

.contact .form .pick li {
    width: auto;
}

.contact .form .pick label {
    display: inline-block;
    line-height: 24px;
}

.contact .form input[type="checkbox"], .contact .form input[type="radio"] {
    width: auto;
    height: auto;
}

.contact ul.message {
    display: block;
    margin-bottom: 20px;
}

.contact ul textarea {
    width: 100%;
    min-height: 200px;
}

.contact .form .c-box {
    display: block;
    margin-bottom: 30px;
}

.contact .form .c-box li {
    display: flex;
    align-items: center;
    margin-bottom: 15px;
}

.contact .form .c-box label {
    margin-bottom: 0;
    margin-left: 5px;
}

.contact .contact-sub li {
    margin-bottom: 0;
}

.contact-sub li:first-child {
    width: 60%;
}

.contact-sub li:first-child select {
    background-color: #fff;
}

/*prijava za zaposlenjem*/

.contact .form .row {
    border-bottom: 1px solid #a2a2a2;
    margin-bottom: 40px;
    padding-bottom: 15px;
}

.contact .form .row h3 {
    margin-bottom: 25px;
}

.contact .form .row .pick li {
    margin-bottom: 0;
}

.contact .form .row .pick label {
    margin-bottom: 0;
}

.contact .form .row .option {
    margin-bottom: 20px;
}

.contact .form .row select {
    margin-bottom: 25px;
}

.contact .modul2 .text {
    align-items: flex-start;
}

.contact .txt {
    margin-left: 60px;
    line-height: 28px;
}

.contact .txt:first-child {
    margin-left: 0;
}

.contact .txt strong {
    margin-bottom: 10px;
    display: block;
}

.contact .txt ul {
    margin-bottom: 20px;
}

.contact .txt ul:nth-child(2) {
    margin-bottom: 0;
}

.res svg {
    width: 20px;
    position: absolute;
    right: 13px;
    top: 41px;
    opacity: 0.4;
    transition: all 0.3s ease;
    cursor: pointer;
}

/******MEDIA QUERIES******/

@media screen and (max-width: 650px) {
    .modul2 .text {
        display: block;
    }
    .contact .txt {
        margin-left: 0;
    }
}

@media screen and (max-width: 600px) {
    .contact .form {
        padding: 40px 20px;
    }
    .contact .form ul {
        display: block;
    }
    .contact .form .pick li {
        margin-bottom: 5px;
    }
    .contact .form-kids li {
        width: 100%;
    }
    /*prijava*/
    .contact .form .row .pick li {
        margin-bottom: 10px;
    }
}

/* Blog
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.blog {
    margin-top: 40px;
}

.blog h3 {
    font-weight: 700;
    margin-bottom: 20px;
}

.blog li {
    margin-bottom: 20px;
    border-bottom: 1px dashed grey;
    padding-bottom: 20px;
}

.blog li:last-child {
    border-bottom: 0;
}

.blog .grid_4 date {
    display: block;
    color: #1f7c87;
    margin-bottom: 5px;
}

.blog .grid_4 strong {
    display: block;
}

.blog .grid_4 p {
    /*line-height: 26px;*/
}

.blog .grid_4 span {
    display: inline-block;
    /*line-height: normal;*/
}

.blog .grid_8 .tags_nsl {
    line-height: 26px;
    margin: 0px;
}

.blog .grid_8 date {
    color: #1f7c87;
    margin-right: 10px;
    margin-bottom: 10px;
    display: inline-block;
}

/*TAGOVI*/

.blog a.tagovi0 {
    font-size: 0.875em;
    font-weight: 400;
    line-height: 1.25em;
}

.blog a.tagovi1 {
    font-size: 0.875em;
    text-transform: uppercase;
    font-weight: 400;
    line-height: 1.25em;
}

.blog a.tagovi2 {
    font-size: 0.875em;
    font-weight: 700;
    line-height: 1.25em;
}

.blog a.tagovi3 {
    font-size: 0.875em;
    font-weight: 400;
    font-style: italic;
    line-height: 1.25em;
}

.blog a.tagovi4 {
    font-size: 0.875em;
    font-weight: 400;
    line-height: 1.25em;
}

.blog a.tagovi5 {
    font-size: 1em;
    text-transform: uppercase;
    font-weight: 400;
    line-height: 1.25em;
}

.blog a.tagovi6 {
    font-size: 1em;
    font-weight: 700;
    line-height: 1.25em;
}

.blog a.tagovi7 {
    font-size: 1em;
    font-weight: 400;
    font-style: italic;
    line-height: 1.25em;
}

/******MEDIA QUERIES******/

@media screen and (max-width: 855px) {
    .blog .grid_8 {
        width: 100%;
        margin-right: 0;
        margin-bottom: 40px;
    }
    .blog .grid_4 {
        width: 100%;
        background-color: #fafafa;
        padding: 30px 15px;
    }
}

/* Gallery
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.gallery .row {
    margin: 40px 35px 0 35px;
}

.gallery .pic {
    /*position:relative;*/
}

.gallery .overlay {
    position: absolute;
    background: rgba(232, 182, 18, 0.7) none repeat scroll 0 0;
    width: 100%;
    /*height:100%;*/
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 25px;
    font-weight: 700;
    padding: 20px 10px;
}

.gallery .btn {
    text-align: center;
    margin-top: 15px;
}

.gallery .row a {
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    transition: all 0.3s ease;
    opacity: 1;
}

.gallery .row:hover a:not(:hover) {
    opacity: 0.6;
}

/******MEDIA QUERIES******/

@media screen and (max-width: 1200px) {
    .gallery .zoom-in:hover {
        transform: none;
        opacity: 1;
        z-index: 1;
    }
    .gallery .row:hover a:not(:hover) {
        opacity: 1;
    }
}

/* EmploymentForm
–––––––––––––––––––––––––––––––––––––––––––––––––– */

/*title*/

.employmentForm .section a.title {
    background-color: #4b9ab1;
    padding: 20px 15px;
    margin: 25px 0 40px 0;
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.employmentForm .section a.title h4 {
    padding: 0;
    margin: 0 0 0px 0;
    color: #fff;
    border-bottom: 0;
    line-height: 1.4;
}

.employmentForm .section a.title span {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 10px 0 10px;
    border-color: #fff transparent transparent transparent;
}

/*form*/

.employmentForm form {
    line-height: 1.5;
}

.employmentForm .main_div {
    /*display: none;*/
}

.employmentForm ul {
    display: flex;
    flex-wrap: wrap;
    padding-bottom: 10px;
}

.employmentForm li {
    width: 33%;
    padding: 0 10px;
    margin-bottom: 30px;
}

.employmentForm li:last-child {
    margin-bottom: 15px;
}

/*quarterWidth*/
.employmentForm li.quarterWidth {
    width: 25%;
}

/*fullWidth*/

.employmentForm li.fullWidth,
.employmentForm li.add {
    width: 100%;
}

.employmentForm .fullWidth input,
.employmentForm .fullWidth select {
    width: 33%;
}

/*regular*/

.employmentForm input,
.employmentForm select,
.employmentForm textarea {
    border: 1px solid #e2e2e2;
    height: 50px;
    width: 100%;
}

.employmentForm textarea {
    padding: 10px;
}

.employmentForm input[type="checkbox"],
.employmentForm input[type="radio"] {
    width: auto;
    height: auto;
}

/*label*/

.employmentForm label {
    display: block;
    margin-bottom: 15px;
}

.employmentForm small {
    color: #c21807;
}

/*extra*/

.employmentForm .extra {
    display: none;
    background-color: #ececec;
    padding: 40px 15px;
}

.employmentForm .extra .calendar {
    width: 33%;
}

.employmentForm .extra .calendar input {
    width: 100%;
}

/*split*/

.employmentForm .split3,
.employmentForm .split2 {
    display: flex;
}

.employmentForm .split3 select,
.employmentForm .split2 div {
    margin: 0 15px 0 0;
}

.employmentForm .split3 select:last-child,
.employmentForm .split2 div:last-child {
    margin: 0;
}

/*check*/

.employmentForm li.check span {
    margin-right: 20px;
    margin-bottom: 10px;
    display: block;
}

.employmentForm li.gender label {
    display: inline-block;
    margin-right: 10px;
}

.employmentForm li .category {
    margin-bottom: 10px;
    display: block;
}

/*langs*/

.employmentForm .langs .add {
    margin-top: 0px;
}

/*calendar*/

.employmentForm .calendar {
    position: relative;
}

.employmentForm .calendar a {
    position: absolute;
    right: 20px;
    top: 9px;
    max-width: 30px;
}

.employmentForm .split2 .calendar input {
    width: 100%;
}

.employmentForm p {
    margin-left: 10px;
    font-size: 14px;
    color: #c21807;
    text-align: right;
    margin-bottom: 20px;
}

/*button*/

.employmentForm button {
    /*float:right; */
    margin-right: 10px;
    background-color: #4b9ab1;
}

.employmentForm li.button {
    width: 100%;
    display: flex;
    justify-content: flex-end;
}

/*add*/

.employmentForm .add {
    /*text-align:right;*/
    margin-top: -15px;
    margin-right: 10px;
}

.employmentForm .add a {
    background-color: #4b9ab1;
    color: #fff;
    font-size: 31px;
    font-weight: 700;
    width: 40px;
    height: 40px;
    display: inline-block;
    text-align: center;
    line-height: 40px;
    border-radius: 50%;
    transition: all 0.3s ease;
}

.employmentForm .add a:hover {
    opacity: 0.8;
}

.employmentForm .add-no-mar {
    margin-top: 0;
    position: relative;
}

/*save*/

.employmentForm .add a.save {
    background-color: #ececec;
    color: #fff;
    font-size: 31px;
    font-weight: 700;
    width: 40px;
    height: 40px;
    display: inline-block;
    text-align: center;
    line-height: 40px;
    border-radius: 0;
    transition: all 0.3s ease;
    background-image: url(../images/icon_save.png);
    background-repeat: no-repeat;
    background-position: center center;
}

/*remove*/

.employmentForm .remove a {
    background-color: #4b9ab1;
    color: #fff;
    font-size: 20px;
    font-weight: 700;
    width: 20px;
    height: 20px;
    display: inline-block;
    text-align: center;
    line-height: 18px;
    border-radius: 50%;
    transition: all 0.3s ease;
}

.employmentForm .remove a:hover {
    opacity: 0.8;
}

/*warning*/

.employmentForm .warning {
    border: 1px solid red;
}

/******MEDIA QUERIES******/

@media screen and (max-width: 768px) {
    .employmentForm li,
    .employmentForm li.quarterWidth,
    .employmentForm .fullWidth input,
    .employmentForm .fullWidth select,
    .employmentForm .extra .calendar {
        width: 100%;
    }
    .employmentForm input[type="checkbox"],
    .employmentForm input[type="radio"] {
        width: auto;
        height: auto;
    }
    .employmentForm .add {
        text-align: left;
    }
}

/* Footer
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.footer {
    clear: both;
    color: #fff;
    padding-top: 70px;
    z-index: 1;
    position: relative;
    background-color: #fff;
}

.footer .container {
    padding: 0 15px;
}

/*instagram*/

.footer .instagram {
    text-align: center;
    overflow: hidden;
}

.footer .instagram-title {
    font-family: "Carlito", sans-serif;
    color: #555454;
    font-size: 35px;
    margin: 35px 0 30px 0;
    display: block;
    padding: 0 20px;
}

.footer .instagram .grid_3 {
    width: 24.325%;
    margin-right: 0.9%;
}

.footer .instagram .grid_3:last-child {
    margin-right: 0;
}

.footer .instagram .grid_3 div {
    padding-top: 100%;
}

/*newsletter*/

.footer .newsletter {
    background-color: #4b9ab1;
    padding: 50px 0;
    margin-top: 10px;
}

.footer .newsletter .container form {
}

.footer .newsletter span {
    font-size: 1.375rem;
    /*22px;*/
    text-transform: uppercase;
}

.flex-wrap {
    display: flex;
    /*justify-content:center;*/
    align-items: center;
    justify-content: space-between;
}

.newsletter .col-right {
    width: 75%;
    display: flex;
}

.newsletter .col-left {
    width: 30%;
}

.footer .newsletter input {
    height: 54px;
    width: 70%;
    margin: 0 2%;
}

.footer .newsletter button {
    height: 54px;
    width: 30%;
    background-color: #e8b612;
    color: #fff;
    font-size: 1rem;
    padding: 0;
    transition: background 0.3s ease;
}

.footer .newsletter button:hover {
    background: rgba(212, 166, 16, 1) none repeat scroll 0 0;
}

.footer .newsletter a {
    color: #fff;
}

.footer .newsletter a:hover {
    font-weight: 700;
}

.footer .grid_4 img {
    width: 100%;
    max-width: 200px;
}

.footer .grid_4:nth-child(2) img {
    width: 100%;
    max-width: 300px;
}

.footer .grid_4:last-child a:first-child {
    margin-bottom: 40px;
    display: inline-block;
}

.footer .newsletter input[type="checkbox"] {
    width: auto;
    height: auto;
    margin: 0;
}

.footer .c-box-div {
    display: none;
}

.footer .c-box {
    margin: 15px 0 0 30%;
    display: flex;
    align-items: center;
}

.footer .c-box label {
    line-height: normal;
    margin-left: 10px;
}

.footer_phobs {
    padding-top: 0;
}

/******MEDIA QUERIES******/

@media screen and (max-width: 1280px) {
    .footer {
        padding-top: 40px;
    }
    .footer_phobs {
        padding-top: 0;
    }
}

@media screen and (max-width: 1200px) {
    .footer .newsletter {
        padding: 30px 0;
    }
}

@media screen and (max-width: 768px) {
    .footer .instagram-title {
        margin-bottom: 40px;
    }
    .footer .instagram .grid_3 {
        width: 49.85%;
        margin-right: 0.3%;
    }
    .footer .instagram .grid_3:nth-child(odd) {
        margin-right: 0;
    }
    .footer .instagram .grid_3:nth-child(-n + 2) {
        margin-bottom: 0.3%;
    }
    .footer .newsletter {
        padding: 30px 0 10px 0;
    }
    .flex-wrap {
        flex-direction: column;
        text-align: center;
    }
    .newsletter .col-left,
    .newsletter .col-right {
        width: 100%;
    }
    .footer .newsletter span {
        display: block;
        margin-bottom: 20px;
    }
    .footer .newsletter input {
        margin: 0;
        width: 100%;
    }
    .footer .grid_4:last-child a:first-child {
        margin-right: 15px;
    }
    .footer .c-box {
        margin: 15px 0 0 0;
    }

    .footer .newsletter {
        margin-top: 2px;
    }
}

/*sitemap*/

.footer .sitemap {
    background-color: #2e858f;
    overflow: hidden;
}

.footer .sitemap .container {
    border-bottom: 1px solid #205b62;
    padding: 60px 10px;
}

.footer .sitemap strong {
    font-size: 1.375rem;
    /*22px;*/
    font-weight: 700;
    margin-bottom: 30px;
    display: block;
}

.footer .sitemap li {
    margin-bottom: 15px;
}

.footer .sitemap a {
    color: #fff;
}

.footer .sitemap a:hover {
    font-weight: 700;
}

/*links*/

.footer .links {
    background-color: #2e858f;
}

.footer .links .container {
    border-top: 1px solid #3fb6c4;
    padding: 60px 15px;
}

.footer .links .container .grid_8 {
    display: flex;
}

.footer .links .container .grid_8 a {
    padding: 0 15px;
}

.footer .links .container .grid_8 a:last-child {
    padding: 0 0 0 15px;
}

/******MEDIA QUERIES******/

@media screen and (max-width: 1200px) {
    .footer .sitemap .container {
        padding: 45px 15px 0px 15px;
    }
    .footer .links .container .grid_8 a {
        padding: 0 10px;
    }
    .footer .links .container .grid_8 a:last-child {
        padding: 0 0 0 10px;
    }
}

@media screen and (max-width: 1024px) {
    .footer .links .grid_4 {
        width: 100%;
        text-align: center;
        margin-bottom: 20px;
    }
    .footer .links .grid_4 a {
        margin-bottom: 20px;
    }
    .footer .links .container .grid_8 {
        width: 100%;
    }
    .footer .links .container .grid_8 a {
        padding: 0 5px;
    }
    .footer .links .container .grid_8 a:last-child {
        padding: 0 0 0 5px;
    }
}

@media screen and (max-width: 768px) {
    .sitemap .grid_3 {
        width: 100%;
        margin-bottom: 12px;
        border-bottom: 1px solid #fff;
    }
    .sitemap .grid_3:last-child {
        border-bottom: none;
    }
    .sitemap .grid_3 ul {
        display: none;
    }
    .footer .sitemap strong {
        margin-bottom: 12px;
    }
    .footer .links .container {
        padding: 20px 10px;
    }
    .footer {
        padding-top: 35px;
    }
    .footer_phobs {
        padding-top: 0;
    }
}

@media screen and (max-width: 480px) {
    .footer .sitemap strong,
    .footer .newsletter span {
        font-size: 1.2rem;
    }
}

/*copyright*/

.footer .copyright {
    padding: 20px 0;
    text-align: center;
    color: #858585;
    line-height: normal;
    font-size: 0.875rem;
    /*14px;*/
}

.footer .copyright a {
    color: #858585;
}

.footer .copyright a:hover {
    color: #2e858f;
}

/* Cookies
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.content {
    position: relative;
    z-index: 1;
    background-color: #fff;
}

.cookies {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: #3c3c3c;
    color: #fff;
    padding: 25px 200px 25px 15px;
    z-index: 8;
    display: none;
}

.cookies p {
    font-size: 1rem;
    line-height: normal;
}

.cookies p a {
    color: #fff;
    text-decoration: underline;
}

.cookies p a:hover {
    color: #e8b612;
}

.cookies a.button {
    position: absolute;
    right: 15px;
    top: 50%;
    padding: 13px 15px;
    font-size: 0.875rem;
    /*14px;*/
    margin-top: -20px;
}

/* Animations
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.zoom-in {
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

.zoom-in:hover {
    /*transform: scale(1.05);*/
    opacity: 1;
    z-index: 9;
}

/******MEDIA QUERIES******/

@media screen and (max-width: 660px) {
    .cookies {
        text-align: center;
        padding: 25px;
    }
    .cookies p {
        font-size: 13px;
    }
    .cookies a.button {
        position: relative;
        top: auto;
        right: auto;
        margin-top: 20px;
        font-size: 0.8125rem;
        /*13px;*/
    }
}

/* Mob toolbar
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.content {
    position: relative;
    z-index: 1;
    background-color: #fff;
}

@media screen and (max-width: 855px) {
    .content {
        z-index: 3;
    }
}

.mobToolbar {
    background-color: #2e858f;
    border-top: 5px solid #fff;
    position: fixed;
    z-index: 7;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 10px 0;
    display: none;
}

.mobToolbar ul {
    display: flex;
    align-items: center;
    justify-content: space-around;
}

.mobToolbar li {
    display: inline-block;
    width: 25%;
    text-align: center;
    color: #fff;
    font-size: 0.6875rem;
    /*11px;*/
    font-family: "Carlito", sans-serif;
    font-weight: 400;
}

.mobToolbar li span {
    display: block;
    margin-bottom: 8px;
}

.mobToolbar li span img {
    max-width: 16px;
}

.mobToolbar a {
    color: #fff;
}

/******MEDIA QUERIES******/

@media screen and (max-width: 480px) {
    .mobToolbar {
        /*display: block;*/
    }
}

/*POSTAVLJANJE UREĐAJA*/

#tablet-wide {
    display: none;
}

#tablet {
    display: none;
}

#smartphone {
    display: none;
}

/******MEDIA QUERIES******/

@media screen and (max-width: 1024px) {
    #desktop {
        display: none;
    }
    #tablet-wide {
        display: block;
    }
    #tablet {
        display: none;
    }
    #smartphone {
        display: none;
    }
}

@media screen and (max-width: 768px) {
    #desktop {
        display: none;
    }
    #tablet-wide {
        display: none;
    }
    #tablet {
        display: block;
    }
    #smartphone {
        display: none;
    }
}

@media screen and (max-width: 480px) {
    #desktop {
        display: none;
    }
    #tablet-wide {
        display: none;
    }
    #tablet {
        display: none;
    }
    #smartphone {
        display: block;
    }
}

/*2025*/

/*carousel*/

.offer {
    text-align: center;
    margin: 40px 0;
}

.offer h2 {
    font-size: 24px;
    margin-bottom: 20px;
}

.slider-container {
    position: relative;
    overflow: hidden;
    width: 100%;
}

.slider {
    display: flex;
    cursor: grab;
    overflow-x: scroll;
}

.slide {
    flex: 0 0 auto;
    width: 33%;
    position: relative;
    text-align: left;
    min-width: 400px;
}

.slide img {
    width: 100%;
    padding: 0 10px;
    height: auto;
}

.slide .info {
    position: absolute;
    bottom: 30px;
    left: 0;
    right: 0;
    padding: 0 40px;
}

.slide .info .nsl {
    background: rgba(140, 175, 62, 0.7);
    color: #fff;
    padding: 15px;
    font-size: 22px;
    font-weight: 700;
    display: inline-block;
}

.slide .info .txt {
    background: rgba(255, 255, 255, 0.7);
    padding: 15px;

    margin-right: 16px;
    display: table;
}

.accomodation {
    display: flex;
	margin-top: 60px;
	position: relative;
    background-color: rgba(187, 179, 147, 0.1);
}

.accomodation .calendar-content-main-div {
	position: absolute;
	width: 100%;
	left: 0;
	top: 0;
}

.accomodation-content {
    width: 50%;
    display: flex;
}

.accomodation-img {
    padding-top: 26%;
    width: 40%;
    background-size: cover;
    background-position: center;
}

.accomodation-text {
    border-right: 1px solid #d5d5d5;
    padding: 40px;
    width: 60%;

    .nsl {
        font-size: 25px;
        font-weight: 700;
        border-bottom: 1px solid #d5d5d5;
        padding-bottom: 10px;
        margin-bottom: 18px;
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        margin-right: 30px;
    }

    p {
        margin-bottom: 30px;
    }
}

.accomodation-book {
    padding: 40px;
    width: 40%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.accomodation-buttons button, .accomodation-buttons a {
    width: 100%;
    margin-top: 10px;
    padding: 0;
    height: 50px;
    text-align: center;
    text-transform: uppercase;
	display: flex;
	align-items: center;
	justify-content: center;
}

.accomodation-book ul {
    flex-direction: column;
}
.accomodation-book ul li {
    width: 100%;
}

.accomodation-book ul li.btn {
    width: 100%;
    margin-top: 10px;
}

@media (max-width: 1400px) {
    .accomodation-content {
        width: 60%;
    }

    .accomodation-book {
        width: 50%;
    }
}

@media (max-width: 960px) {
    .accomodation {
        flex-direction: column;
    }

    .accomodation-content {
        width: 100%;
        margin-top: 20px;
    }

    .accomodation-img {
        width: 100%;
		padding-top: 80%;
    }

    .accomodation-book {
        width: 50%;
		padding: 10px 10px 10px 30px;
    }
	
	.accomodation-text {
		padding:10px;
	}
}

@media (max-width: 700px) {
    .accomodation-content {
        flex-direction: column;
    }
	
	.accomodation-text {
		.nsl {
			margin-right: 0;
		}
	}

    .accomodation-text {
        width: 100%;
    }

    .accomodation-book {
        width: 100%;
        padding: 0 10px;
		margin-top: 20px;
    }
}

@media (max-width: 360px) {
    .slide {
        min-width: 320px;
    }
}

.loyalty-banner {
    width: 100%;
    background-color: #4b9ab1;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 1.5rem;
    color: #fff;
	margin-top: 60px;
}

.loyalty-content {
    display: flex;
    gap: 1rem;
    flex: 1 1 60%;
}

.loyalty-logo {
    width: 110px;
    height: auto;
    flex-shrink: 0;
	padding-left: 20px;
	margin-right: 20px;
}

.loyalty-text {
    flex: 1 1 auto;
	padding: 20px 0;
}

.loyalty-text p {
    margin-top: 0px;
}

.loyalty-list {
	margin-top: 10px;
    font-size: 1rem;
    line-height: 1.6;
}

.loyalty-list li {
    display: flex;
    align-items: center;
	margin-bottom:10px;
}

.loyalty-list img {
    width: 20px;
    margin-right: 5px;
}

.loyalty-button-wrap {
    flex-shrink: 0;
}

.loyalty-button-wrap a {
	height: 100%;
	display: flex;
	align-items: center;
	font-size: 18px;
}

@media (max-width: 1260px) {
	 .loyalty-banner {
		margin-top:40px;	 
	}
}

@media (max-width: 768px) {
    .loyalty-banner {
        flex-direction: column;
        align-items: flex-start;
		gap:10px;
    }
	
	.loyalty-logo {
		padding-top:20px;
		width:100px;
	}

    .loyalty-content {
        flex-direction: column;
    }

    .loyalty-button-wrap {
        width: 100%;
        text-align: left;
    }
	
	.loyalty-button-wrap a {
		justify-content: center;
	}
	
	.loyalty-text {
		padding: 0 20px 0px 20px;
	}
	
	.loyalty-text p {
    	margin-top: 10px;
	}
}