/* style.css - the main style for RTL page */

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

@font-face {
    font-family: 'RTL United Text';
    src: url('../font/RTLUnitedTextRegular.woff2') format('woff2'),
         url('../font/RTLUnitedTextRegular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
	font-display: swap;
}

@font-face {
    font-family: 'RTL United Text';
    src: url('../font/RTLUnitedTextBold.woff2') format('woff2'),
         url('../font/RTLUnitedTextBold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
	font-display: swap;
}

body {
	background: #FFF;
	color: #262626;
	font-weight: 400;
	font-style: normal;
	font-family: 'RTL United Text', sans-serif;
}

img { display: block; }

.main-wrap {
	width: 1160px;
	padding-left: 20px;
	padding-right: 20px;
	max-width: 100%;
	margin: 0 auto;
}

.footer-wrap {
	width: 1160px;
	max-width: 100%;
	margin: 0 auto;
}

.head-1 {
	display: flex;
	padding: 20px 0;
}

.rtl-logo {
	text-decoration: none;	
}

.head-2 {
	display: flex;
	justify-content: space-between;
	align-items: center;
	height: 88px;
	border-top: 2px solid #F1F2F4;
	border-bottom: 2px solid #F1F2F4;
	overflow: hidden;
}
.h-2-1 {
	font-size: 24px;
	line-height: 24px;
	color: #000;
}
.h-2-2 {
	display: flex;
	align-items: center;
	gap: 14px;
	font-size: 14px;
	line-height: 14px;
	color: #000;
}
.h-2-2 a { text-decoration: none; }

.head-3 {
	padding: 16px 0;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	overflow: hidden;
}
.h-3-r {
	display: flex;
	align-items: center;
	gap: 12px;
}
.h-3-link {
	display: flex;
	align-items: center;
	text-decoration: none;
	gap: 8px;
	cursor: pointer;
	color: #262626;
	height: 40px;
	padding: 0 16px;
	background: #F6F6F6;
	border-radius: 20px;
	white-space: nowrap;
}
.h-3-link i {
	font-size: 20px;
	width: 20px;
	height:20px;
	line-height: 1;
	flex: 0 0 auto;
}
.h-3-link span {
	font-size: 14px;
	line-height: 14px;
	font-weight: 700;
}

.hero-block {
	height: 480px;
	background-color: #CCC;
	padding: 96px 32px 32px;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	align-items: center;
	text-align: center;
	color: #FFF;
	line-height: 1;
	position: relative;
	z-index: 0;
}
.hero-block.hb-v2 {
	height: 440px;
}
.hb-main {
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	align-items: center;
	position: relative;
	z-index: 2;
}
.hb-bg {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	z-index: 0;
	background: #CCC url('../images/EB-hero.webp') no-repeat center center;
	background-size: cover;
}
.hb-bg.hb-bg_beach {
	background-image: url('../images/hero-img_beach.webp');
}
.hb-bg.hb-bg_city {
	background-image: url('../images/hero-img_city.webp');
}
.hb-bg.hb-bg_city.article1 {
	background-image: url('../images/teneriffa.webp');
}
.hb-bg.hb-bg_city.article2 {
	background-image: url('../images/malediven.webp');
}
.hb-bg.hb-bg_city.article3 {
	background-image: url('../images/Marrakesh.webp');
}
.hb-gradient {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.6) 100%);
	z-index: 1;
}
.hb-counter {
	font-size: 54px;
	font-weight: 700;
	margin-bottom: 12px;
}
.hb-title-1 {
	font-size: 28px;
	margin-bottom: 32px;
}
.hb-title-2 {
	font-size: 40px;
	font-weight: 700;
	margin-bottom: 40px;
}
.hb-open-wizard {
	cursor: pointer;
	display: flex;
	align-items: center;
	gap: 8px;
	color: #262626;
	background: #FFF;
	padding: 0 24px;
	height: 64px;
	border-radius: 32px;
}
.hb-open-wizard span {
	font-size: 20px;
	font-weight: 700;
}
.hb-open-wizard i {
	font-size: 24px;
	width: 24px;
	height: 24px;
	line-height: 1;
	flex: 0 0 auto;
}
.hb-all-destinations {
	padding-top: 24px;
	font-size: 16px;
}
.hb-all-destinations a {
	color: #FFF;
	text-decoration: underline;
}
.hb-all-destinations a:hover {
	text-decoration: none;
}

.tb-m-title {
	padding: 40px 0 10px;
	border-bottom: 2px solid #F1F2F4;
	color: #000;
	font-weight: 700;
	font-size: 24px;
	line-height: 24px;
}

.tb-main {
	display: flex;
	flex-wrap: wrap;
	gap: 40px;
	padding: 20px 0;
}
.tb-item {
	cursor: pointer;
	display: flex;
	flex-direction: column;
	gap: 10px;
	flex: 1 1 auto;
	text-decoration: none;
	color: #000;
	width: 31%;
	width: calc(33% - 26px);
}
.tbi-img {
	height: 200px;
	width: 100%;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
}
.tbi-title {
	font-size: 20px;
	line-height: 24px;
	font-weight: 700;
}
.tbi-subtitle {
	color: #9F9F9F;
	font-size: 14px;
	line-height: 14px;
}
.tbi-txt {
	font-size: 16px;
	line-height: 24px;
	color: #262626;
}

.content-block {
	display: flex;
	flex-direction: column;
	gap: 96px;
	padding: 80px 0;
}

.cb-1 {
	display: flex;
	align-items: center;
	gap: 32px;
}
.cb-1-1 {
	width: 460px;
	max-width: 100%;
	flex: 1 0 auto;
}
.cb-1-1 img {
	width: 460px;
	height: auto;
	max-width: 100%;
}
.cb-1-2 {
	flex: 1 1 auto;
	width: 668px;
	max-width: 100%;
}
.cb-1-2 h2 {
	margin: 0 0 10px;
	font-size: 22px;
	line-height: 24px;
	font-weight: 700;
}
.cb-1-2 div {
	display: flex;
	flex-direction: column;
	gap: 24px;
	color: #6D6D6D;
}
.cb-1-2 p {
	margin: 0;
	color: #6D6D6D;
	font-size: 18px;
	line-height: 28px;
}

.cb-head {
	text-align: center;
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.cb-head h3 {
	font-size: 24px;
	line-height: 24px;
	font-weight: 700;
}
.cb-head div {
	font-size: 16px;
	line-height: 16px;
	color: #9F9F9F;
}
.cb-head div.under-text {
	color: #6D6D6D;
        font-size: 18px;
        line-height: 28px;
}
.sp-black-button-container span.sp-login-blck {
        color: #fff;
    	font-size: 20px;
	font-style: normal;
	font-weight: 600;
	border-radius: 32px;
	padding-left: 30px;
	padding-right: 30px;
	background-color: #262626;
	height: 64px;
	line-height: 64px;
	display: inline-block;
}
.sp-benefits-container-new {
	padding-top: 32px;
	display: flex;
	justify-content: space-between;
	gap: 20px;
	width: 100%;
}
.sp-black-button-container {
	margin-top: 30px;
}
.sp-benefits-container-new .spbc {
    height: 130px;
    padding: 20px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border-radius: 20px;
    background-color: #f7f7f7;
    width: 16.66%;
    text-align: center;
    display: flex;
}
.sp-benefits-container-new .spbc img {
    width: 36px;
}
.sp-benefits-container-new .spbc-sub {
    margin-top: 10px;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 16px;
    color: #262626;
}
.cb-2 {
	display: flex;
	flex-direction: column;
	gap: 64px;
}
.cb-2-main {
	display: flex;
	flex-wrap: wrap;
	gap: 56px;
}
.cb-2-item {
	display: flex;
	align-items: center;
	gap: 24px;
	width: 32%;
	width: calc(33% - 37px);
}
.cb2i-img {
	width: 88px;
	height: 88px;
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #FFF;
	color: #FF4500;
	border-radius: 20px;
	box-shadow: -1px 2px 5px 0 rgba(0, 0, 0, 0.04), -5px 8px 9px 0 rgba(0, 0, 0, 0.04), -11px 18px 13px 0 rgba(0, 0, 0, 0.02), -19px 32px 15px 0 rgba(0, 0, 0, 0.01), -30px 50px 16px 0 rgba(0, 0, 0, 0);
}
.cb2i-img i {
	font-size: 32px;
	width: 32px;
	height: 32px;
	line-height: 1;
}
.cb2i-txt h4 {
	font-size: 18px;
	line-height: 18px;
	font-weight: 700;
	margin: 0 0 8px;
}
.cb2i-txt div {
	color: #6D6D6D;
	font-size: 16px;
	line-height: 18px;
}

.cb-3 {
	padding: 40px 0;
	display: flex;
	flex-direction: column;
	gap: 50px;
}

.cb-4 {
	display: flex;
	gap: 24px;
	justify-content: space-between;
}
.cb4-item {
	background: #F7F7F7;
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: 32px;
	width: 32%;
}
.cb4-item b {
	font-size: 24px;
	line-height: 24px;
	font-weight: 700;
}
.cb4-item span {
	font-size: 20px;
	line-height: 24px;
}

.cb-5 {
	display: flex;
	flex-direction: column;
	gap: 36px;
	padding: 44px 0;
}
.cb-5-title {
	text-align: center;
	font-size: 24px;
	line-height: 24px;
	font-weight: 700;
}
.cb-5-main {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 44px;
}

.foot-logos {
	display: flex;
	justify-content: space-between;
	gap: 10px;
	padding: 40px 30px;
	background: #F7F7F7;
}
.fl-1 {
	display: flex;
	align-items: center;
	gap: 24px;
}
.fl-2 {
	display: flex;
	align-items: center;
	gap: 12px;
}

.footer-block {
	display: flex;
	flex-direction: column;
	gap: 40px;
	padding: 56px 30px;
	background: #F7F7F7;
}
.foot-1-title {
	font-size: 24px;
	line-height: 24px;
	font-weight: 700;
}
.footers-cols {
	display: flex;
	justify-content: space-between;
	gap: 40px;
}
.footers-cols ul {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 24px;
	font-size: 14px;
	line-height: 14px;
	width: 32%;
}
.footers-cols ul a {
	text-decoration: none;
	color: #262626;
}
.footers-cols ul a:hover, .footers-cols ul a:active {
	text-decoration: underline;
}
.footers-cols ul b {
	display: block;
	font-size: 16px;
	line-height: 16px;
	font-weight: 700;
}
.footer-line {
	border: none;
	height: 1px;
	width: 100%;
	background: #E7E7E7;
}

.footer-bottom {
	display: flex;
	align-items: center;
	justify-content: space-between;
	background: #262626;
	color: #FFF;
	padding: 28px 30px;
}
.fb-1 {
	display: flex;
	align-items: center;
	gap: 14px;
	font-size: 14px;
	line-height: 14px;
}
.fb-2 {
	display: flex;
	align-items: center;
	gap: 30px;
}
.fb-soc {
	display: flex;
	align-items: center;
	gap: 8px;
}
.fb-soc a {
	display: flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	color: #FFF;
	background: #4F4F4F;
	height: 24px;
	width: 24px;
	font-size: 14px;
	border-radius: 12px;
}
.fb-soc a i {
	font-size: 14px;
	width: 14px;
	height: 14px;
	line-height: 1;
}
.fb-2 img {
	height: 24px;
}

.sb-head {
	padding: 40px 0 8px;
	border-bottom: 2px solid #F1F2F4;
	font-size: 24px;
	line-height: 24px;
	font-weight: 700;
}
.sb-main {
	display: flex;
	justify-content: space-between;
	gap: 40px;
	padding: 20px 0;
}
.sb-link {
	display: flex;
	align-items: center;
	gap: 8px;
	flex: 1 1 auto;
	width: 32%;
	text-decoration: none;
	padding: 20px;
	background: #F7F7F7;
	color: #262626;
}
.sb-link i {
	font-size: 32px;
	flex: 0 0 auto;
	width: 48px;
	height: 48px;
	line-height: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	background-position: center center;
	background-repeat: no-repeat;
}
.sb-link span {
	font-size: 24px;
	line-height: 24px;
	font-weight: 700;
	text-decoration: underline;
}
.sb-link:hover span {
	text-decoration: none;
}
.spring-ico {
	background-image: url('../images/spring-ico.svg');
}
.autumn-ico {
	background-image: url('../images/autumn-ico.svg');
}

#overlay {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.65);
	z-index: 1000;
	justify-content: center;
	align-items: center;
}
#overlay.open-popup {
	display: flex;
}
#iframeContainer {
	position: relative;
	background-color: #fff;
	max-width: 900px;
	max-height: 600px;
	width: 100%;
	height: 100%;
	overflow: hidden;
	border-radius: 12px;
}
iframe {
	width: 100%;
	height: 100%;
	position: relative;
	opacity: 1;
	transition: opacity 0.2s linear;
}
.iframe-loading iframe {
	opacity: 0;
}
.close-btn {
	cursor: pointer;
	position: absolute;
	top: 20px;
	right: 20px;
	z-index: 10;
	font-size: 20px;
	color: #888;
	padding: 0;
	border: none;
	background-color: #f6f6f6;
	width: 36px;
	height: 36px;
	line-height: 36px;
	text-align: center;
	border-radius: 18px;
}
.close-btn:hover {
	color: #000;
}
.loading {
	font-size: 16px;
	line-height: 18px;
	position: absolute;
	display: none;
	left: 50%;
	top: 50%;
	margin-top: -32px;
	margin-left: -32px;
}
.open-popup .loading {
	display: block;
	animation: spin 1.5s linear infinite;
}
.hb-hero-button-container a {
	height: 64px;
	line-height: 64px;
	font-size: 20px;
	font-style: normal;
	font-weight: 600;
	color: #fff;
	background-color: #262626;
	padding-top: 0;
	padding-bottom: 0;
	border-radius: 32px;
	padding-left: 35px;
	padding-right: 35px;
	text-decoration: none;
	transition: 0.5s;
	display: inline-block;
}
.hero-block.hero-gewinnen {
	display: block;
	text-align: left;
	padding-top: 50px;
}
.hero-block.hero-gewinnen .hb-main {
	display: block;
	text-align: left;
}
.hb-tp-rating {
	margin-top: 30px;
}
h1.gewinnen-title {
	font-size: 54px;
	font-weight: 700;
}
img.sp-social-rating {
	max-width: 100%;
}
@media (max-width: 948px) {
	.cb-1-1 {
		flex: 1 1 auto;
	}

	.sb-main {
		flex-wrap: wrap;
		gap: 20px;
	}
	.sb-link {
		width: 47%;
	}
}

@media (max-width: 768px) {
	.h-2-1 {
		font-size: 14px;
	}
	.h-2-2 {
		flex-direction: column;
		gap: 0;
		align-items: flex-end;
	}
	.h-2-2 span {
		font-size: 10px;
		line-height: 10px;
	}
	.h-2-2 img {
		height: 24px;
		width: auto;
	}

	.h-3-link {
		height: 32px;
		padding: 0 12px;
	}
	.h-3-link span {
		font-size: 12px;
		line-height: 12px;
	}
	.h-3-link i {
		font-size: 16px;
		width: 16px;
		height: 16px;
	}

	.hero-block {
		height: 570px;
	}
	.hb-counter {
		font-size: 44px;
	}
	.hb-title-1 {
		font-size: 20px;
	}
	.hb-title-2 {
		font-size: 30px;
		line-height: 32px;
	}
	.tb-item {
		width: 100%;
	}

	.cb-1 {
		flex-direction: column;
	}
	.cb-2-2 h2 {
		font-size: 20px;
		line-height: 22px;
	}
	.cb-2-2 p {
		font-size: 16px;
		line-height: 26px;
	}

	.cb-head h3 {
		font-size: 22px;
		line-height: 26px;
	}
	.cb-head div {
		line-height: 24px;
	}

	.cb-2-item {
		width: 100%;
		align-items: flex-start;
	}
	.cb2i-img {
		width: 60px;
		height: 60px;
		border-radius: 12px;
	}
	.cb2i-img i {
		width: 24px;
		height: 24px;
		font-size: 24px;
	}
	.cb2i-txt div {
		font-size: 14px;
		line-height: 20px;
	}

	.cb-4 {
		flex-direction: column;
	}
	.cb4-item {
		width: 100%;
	}

	.cb-5 {
		gap: 20px;
	}
	.cb-5-title {
		font-size: 16px;
		line-height: 18px;
		font-weight: 400;
	}
	.cb-5-main {
		transform: scale(0.6);
	}

	.footer-wrap {
		display: block;
	}
	.foot-logos {
		display: block;
		padding-bottom: 8px;
	}
	#iframeContainer {
		max-width: 100%;
		max-height: 100%;
		border-radius: 0;
	}
	.fl-1 {
		gap: 20px;
	}
	.fl-1 img {
		max-height: 20px;
	}
	.fl-2 {
		margin-top: 10px;
	}
	.fl-2 img {
		max-height: 30px;
	}
	.footers-cols,.footers-cols ul {
		display: block;
		width: 100%;
	}
	.footers-cols ul li {
		margin-bottom: 20px;
	}
	.footers-cols ul:last-child li:last-child {
		margin-bottom: 0;
	}
	.footer-bottom {
		display: block;
	}
	.fb-1,.fb-2 {
		justify-content: center;
	}
	.fb-1 {
		margin-bottom: 20px;
	}
}

@media (max-width: 520px) {
   .sb-main {
	flex-direction: column;
   }
   .sb-link {
	width: 100%;
   }
   .sp-benefits-container-new {
        padding-top: 32px;
        display: flex;
        justify-content: space-between;
        gap: 4%;
        width: 100%;
        flex-wrap: wrap;
    }
    .sp-benefits-container-new .spbc {
        width: 48%;
        margin-bottom: 4%;
    }
   h1.gewinnen-title {
	font-size: 32px;
   }
}
@media (max-width: 408px) {
	.h-3-r {
		gap: 8px;
	}
}
@media (max-width: 400px) {
	.h-3-r {
		gap: 4px;
	}
	.h-3-link {
		gap:4px;
	}
	.h-3-link span:last-child {
		display:none;
	}
}
@media (max-width: 354px) {
	.h-3-link {
		padding: 0 8px;
	}
}

@-moz-keyframes spin { 
    100% { -moz-transform: rotate(360deg); } 
}
@-webkit-keyframes spin { 
    100% { -webkit-transform: rotate(360deg); } 
}
@keyframes spin { 
    100% { 
        -webkit-transform: rotate(360deg); 
        transform:rotate(360deg); 
    } 
}

