@import url('https://fonts.googleapis.com/css2?family=Cabin:ital,wght@1,400;1,700&family=Poppins:wght@300;400;500;600;700');
@import url('https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.css');
@import url('https://cdn.jsdelivr.net/npm/video.js/dist/video-js.min.css');
@import url('https://cdn.jsdelivr.net/npm/hamburgers/dist/hamburgers.min.css');
@import url('fa.css');

/*//////////////////////////////////////////////////////////*/
/*/ GENERAL STYLES                                          */
/*//////////////////////////////////////////////////////////*/

body,html{
	margin: 0px;
	padding: 0px;
	width: 100%;
	height: 100%;
	box-sizing: border-box;
    font-family: 'Poppins', sans-serif;
}

*{
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	box-sizing: border-box;
}

:root {
    --white: #ffffff; 
    --darkgrey: #131313;
    --grey: #767676;
    --lightgrey: #B1B1B1;
    --light: #F6F6F6;
    --black: #000000; 
    --primary: #BC1A1A;
}

.container_wide{
    max-width: calc(1200px + 80px);
    margin-left: auto;
    margin-right: auto;
    padding: 0px 40px;
}

.container_medium{
    max-width: calc(975px + 80px);
    margin-left: auto;
    margin-right: auto;
    padding: 0px 40px;
}

.container_small{
    max-width: calc(750px + 80px);
    margin-left: auto;
    margin-right: auto;
    padding: 0px 40px;
}

.container_slider{
    max-width: calc(975px);
    margin-left: auto;
    margin-right: auto;
    position: relative;
    padding: 0px 40px;
}

/*//////////////////////////////////////////////////////////*/
/*/ GENERAL TEXT STYLES                                     */
/*//////////////////////////////////////////////////////////*/

a{
	text-decoration: none;
	color: inherit;
}

h2{
    margin: 0;
    padding: 0;
    margin-bottom: 20px;
    color: var(--black);
    font-size: 18px;
    font-weight: 700;
    font-family: 'Poppins', sans-serif;
}

p{
    margin: 0;
    color: var(--black);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 28px;
    margin-bottom: 20px;
    font-family: 'Poppins', sans-serif;
}

p a{
    position: relative;
    color: var(--primary);
    text-decoration: none;
}

p a::before {
    content: "";
    position: absolute;
    display: block;
    width: 100%;
    height: 1px;
    bottom: 0;
    left: 0;
    background-color: var(--primary);
    transform: scaleX(0);
    transform-origin: top left;
    transition: transform 0.3s ease;
}

p a:hover::before {
    transform: scaleX(1);
}

ul,
ol{
    margin: 0px;
    padding-left: 15px;
    margin-bottom: 20px;
}

ul li::marker,
ol li::marker {
    color: var(--primary);
    font-weight: 700;
    font-size: 14px;
}

ul li,
ol li{
    padding-left: 20px;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 28px;
    font-family: 'Poppins', sans-serif;
}

article img{
    width: 100%;
    border-radius: 20px;
    margin-bottom: 20px;
}

blockquote{
    border-left: 3px solid var(--primary);
    padding-left: 20px;
    margin-left: 0px;
}

.btn{
    display: inline-block; 
    background-color: var(--black);
    color: var(--white);
    border-radius: 500px;
    padding: 15px 20px;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    transition: background-color 0.3s;
    margin-top: 15px;
    font-family: 'Poppins', sans-serif;
}

.btn:hover {
    background-color: var(--primary);
}

.btn.btn_arrow{
    padding-right: 40px;
}

article .btn.btn_arrow::after{
    content: "\f061";
    font-family: "Font Awesome 6 Pro";
    font-weight: 500;
    font-size: 18px;
    position: relative;
    right: -20px;
    top: 2px;
}

article .alignleft, img.alignleft {
	margin-right: 1.5em;
	display: inline;
	float: left;
    border-radius: 20px;
    width: auto;
}

article .alignright, img.alignright {
	margin-left: 1.5em;
	display: inline;
	float: right;
    border-radius: 20px;
    width: auto;
}

article .aligncenter, img.aligncenter {
	margin-right: auto;
	margin-left: auto;
	display: block;
	clear: both;
    border-radius: 20px;
    width: auto;
}

/*//////////////////////////////////////////////////////////*/
/*/ HEADER                                                  */
/*//////////////////////////////////////////////////////////*/

header{
    position: relative;
    height: 850px;
}

#navbar{
    position: absolute;
    top: 0;
    z-index: 100;
    width: 100%;
    height: 80px;
    background: rgba(0, 0, 0, 0.2);
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    filter: blur(0);
    -webkit-filter:blur(0px);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

#navbar .container_wide{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    height: 100%;
}

#navbar .logo{
    height: 100%;
    display: flex;
    align-items: center; 
    max-width: 150px;
}

#navbar nav{
    display: flex;
    height: 100%;
}

#navbar nav ul{
    list-style-type: none;
    margin: 0;
    padding: 0;
    position: relative;
    display: flex;
    justify-content: flex-end;
}

#navbar nav ul li{
    padding-left: 0px;
    line-height: 80px;
    color: var(--white);
    text-shadow: 0px 0px 15px rgba(0, 0, 0, .30);
    font-size: 13px;
    font-weight: 500;
}

#navbar nav ul li a{
    display: block;
    padding-left: 25px;
    padding-right: 25px;
    text-align: center;
    transition: color 0.3s;
}

#navbar nav ul li.active{
    font-weight: 700;
}

#magic-line {
    position: absolute;
    bottom: -2px;
    left: 0;
    height: 2px;
    background: var(--white);
    transition: all 0.02s;
}

.tabs:after {
    visibility: hidden;
    display: block;
    content: "";
    clear: both;
    height: 0;
}

*:first-child + html .tabs {
    zoom: 1;
}

#navbar #hamburger{
    margin-top: 13px;
    display: none;
}

#navbar #hamburger .hamburger-inner,
#navbar #hamburger .hamburger-inner::before,
#navbar #hamburger .hamburger-inner::after{
    background-color: white;
    height: 1.3px;
}

#mobilemenu{
    width: 100%;
    color: var(--white);
    position: absolute;
    top: 80px;
    z-index: 200;
    width: 100%;
    background: rgba(0, 0, 0, 0.4);
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    filter: blur(0);
    -webkit-filter:blur(0px);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    max-height: 0;
    transition: max-height 0.5s ease-in-out;
    overflow: hidden;
    display: none;
}

#mobilemenu.open {
	max-height: 500px;
}

#mobilemenu ul{
    list-style-type: none;
    padding: 0px;
    margin: 0px;
}

#mobilemenu ul li{
    text-shadow: 0px 0px 4px rgba(0, 0, 0, .2);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    padding: 15px 20px;
    font-size: 13px;
    font-weight: 500;
}

#post_hero{
    position: absolute;
    top: 0;
    z-index: 1;
    width: 100%;
    height: 850px;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}

#post_hero .container_wide{
    height: 100%;
    display: flex;
    align-items: end;
}

#post_hero .post_info{
    position: relative;
    width: calc(100% - 200px);
}

#post_hero .post_info::before{
    position: absolute;
    right: 0px;
    display: block;
    z-index: 1;
    content: '';
    background-color: rgba(159, 20, 20, 0.7);
    width: 5000px;
    height: 100%;
    border-radius: 0px 20px 0px 0px;
    border: 1px solid rgba(255, 255, 255, 0.30);
    border-bottom: 0px;
    background: rgba(0, 0, 0, 0.01);
    backdrop-filter: blur(30px);
    -webkit-backdrop-filter: blur(30px);
    filter: blur(0);
    -webkit-filter:blur(0px);
    top: -1px;
}

#post_hero .post_info .content{
    position: relative;
    z-index: 2;
    margin-top: 65px;
    margin-right: 65px;
    color: var(--white);
}

#post_hero .post_info .content .title h1{
    margin: 0px;
    padding: 0px;
    font-size: 50px;
    font-weight: 700;
    line-height: 64px;
}

#post_hero .post_info .content .details{
    margin-top: 30px;
    margin-bottom: 120px;
}

#post_hero .post_info .content .details ul{
    list-style-type: none;
    margin: 0px;
    padding: 0px;
}

#post_hero .post_info .content .details ul li{
    float: left;
    font-size: 13px;
    font-weight: 400;
    margin-right: 50px;
}

#post_hero .post_info .content .details ul li:last-of-type{
    margin-right: 0px;
}

#post_hero .post_info .content .details ul li .icon{
    margin-right: 10px;
}

.element{
    margin-bottom: 100px;
}


/*//////////////////////////////////////////////////////////*/
/*/ POST FOOTER STYLES                                      */
/*//////////////////////////////////////////////////////////*/


#post_footer{
    border-top: 1px solid #E3E3E3;
    border-bottom: 1px solid #E3E3E3;
}

#post_footer .container_wide{
    display: flex;
}

#post_footer .prev_post,
#post_footer .next_post{
    width: 33.33%;
    display: flex;
    align-items: center;
    padding-top: 40px;
    padding-bottom: 40px;
}

#post_footer .prev_post .arrow,
#post_footer .next_post .arrow{
    font-size: 23px;
    color: var(--lightgrey);
    transition: transform .3s ease;
}

#post_footer .prev_post .arrow{
    margin-right: 20px;
}

#post_footer .next_post .arrow{
    margin-left: 20px;
}

#post_footer .prev_post .thumb img,
#post_footer .next_post .thumb img{
    width: 75px;
    height: 50px;
    object-fit: cover;
    border-radius: 4px;
    transition: opacity 0.3s linear 2s;
}

#post_footer .prev_post .details,
#post_footer .next_post .details{
    padding-right: 20px;
    padding-left: 20px;
    margin-top: -5px;
}

#post_footer .prev_post .details span,
#post_footer .next_post .details span,
#post_footer .social_share span{
    color: var(--grey);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    text-transform: uppercase;
    display: block;
    width: 100%;
}

#post_footer .prev_post .details a,
#post_footer .next_post .details a{
    color: var(--black);
    font-size: 13px;
    font-weight: 600;
    line-height: normal;
    display: inline-block;
}

#post_footer .prev_post:hover .arrow{
    transform: translate(-10px, 0px);
}
#post_footer .next_post:hover .arrow{
    transform: translate(10px, 0px);
}


#post_footer .social_share{
    width: 33.33%;
    padding-top: 40px;
    padding-bottom: 40px;
    text-align: center;
    border-left: 1px solid #E3E3E3;
    border-right: 1px solid #E3E3E3;
}

#post_footer .social_share ul{
    list-style-type: none;
    margin: 0px;
    padding: 0px;
    display: inline-block;
    margin-top: 10px; 
}
#post_footer .social_share ul li{
    float: left;
    margin-left: 7px;
    margin-right: 7px;
    padding-left: 0px;
}

#post_footer .social_share ul li a img{
    transition: transform .2s;
}

#post_footer .social_share ul li a:hover img{
    transform: scale(1.2); 
}

#post_footer .social_share ul li img{
    width: 25px;
    height: 25px;
}


/*/ AUTHOR FOOTER //////////////////////////////////////////*/

#author{
    border-top: 1px solid #E3E3E3;
    border-bottom: 1px solid #E3E3E3;
    margin-top: -1px;
    padding: 50px 0px;
}

#author .container_small{
    display: flex;
}

#author .profile_pic img{
    width: 100%;
    max-width: 150px;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    border-radius: 1000px;
    margin-top: 10px;
}

#author .info{
    width: 100%;
    padding-left: 30px;
}

#author .info span{
    color: var(--grey);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
}

#author .info h3{
    margin: 0px;
    padding: 0px;
    color: var(--black);
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
}

#author .info p{
    color: var(--darkgrey);
    font-size: 13px;
    font-style: italic;
    font-weight: 300;
    line-height: 24px;
    margin-top: 10px;
    margin-bottom: 0px;
    display: block;
}


/*/ NEWSLETTER FOOTER //////////////////////////////////////*/

#footer_newsletter{
    background-color: var(--light); 
    border-top: 1px solid #E3E3E3;
    border-bottom: 1px solid #E3E3E3;
    text-align: center;
    padding: 50px 0px;
    margin-top: -1px;
}

#footer_newsletter h3{
    margin: 0px;
    padding: 0px;
    color: #000;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
}

#footer_newsletter p{
    margin: 0px;
    padding: 0px;
    color: var(--darkgrey);
    font-size: 13px;
    font-style: italic;
    font-weight: 300;
    line-height: 24px;
    margin-top: 20px; 
    margin-bottom: 20px;
}

#footer_newsletter form input{
    background-color: var(--white);
    border: 1px solid #E3E3E3;
    border-radius: 100px 0px 0px 100px;
    padding: 10px 20px;
    font-family: 'Poppins', sans-serif;
    font-size: 14px;
    margin-right: -5px;
    width: 315px;
}

#footer_newsletter form input:focus{
    outline: none;
    border-color: var(--lightgrey);
}

#footer_newsletter form button{
    background-color: var(--black);
    border-radius: 0px 100px 100px 0px;
    border: 1px solid #E3E3E3;
    font-family: 'Poppins', sans-serif;
    font-size: 14px;
    color: #FFF;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    padding: 10px 20px;
}

#footer_newsletter form button:hover{
    background-color: rgb(62, 62, 62);
}


/*//////////////////////////////////////////////////////////*/
/*/ POST FOOTER STYLES                                      */
/*//////////////////////////////////////////////////////////*/

footer{
    padding: 100px 0px;
    border-top: 1px solid #E3E3E3;
    margin-top: -1px;
}

footer .container_wide{
    display: flex;
    gap: 40px;
}

footer .col{
    width: 100%;
}

footer .col:first-of-type{
    width: 60%;
}

footer .col h3{
    margin: 0;
    padding: 0;
    color: var(--black);
    color: #000;
    font-size: 15px;
    font-style: normal;
    font-weight: 700;
    margin-bottom: 20px;
}

footer .col ul{
    list-style-type: none;
    margin: 0;
    padding: 0;
}

footer .col ul li{
    color: var(--black);
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 28px;
    padding-left: 0px;
}

footer .col ul li a{
    position: relative;
    color: var(--black);
    transition: color .3s;
}

footer .col ul li a:hover{
    color: var(--grey);
}

footer .col ul li a::after{
    position: absolute;
    right: -5px;
    content: " >";
    color: white;
    transition: color .3s ease, right .3s ease;
}

footer .col ul li a:hover::after{
    right: -10px;
    color: var(--grey);
}

footer .col ul li.all{
    font-weight: 600;
}

footer .col ul li.all a::after{
    content: "";
}

#closer{
    background-color: var(--darkgrey);
    padding: 30px 0px;
}

#closer .container_wide{
    display: flex;
    align-items: center;
}

#closer .logo{
    width: 50%;
    padding-right: 20px;
}

#closer .center{
    width: 100%;
    text-align: right;
}

#closer .center p{
    color: var(--lightgrey);
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
}

#closer .socials {
    position: relative;
    width: 50%;
    display: flex;
    justify-content: flex-end;
}

#closer .socials ul {
    list-style-type: none;
    margin: 0px;
    padding: 0px;
    display: inline-block;
}

#closer .socials ul li {
    float: left;
    margin-left: 7px;
    margin-right: 7px;
    padding-left: 0px;
}

#closer .socials ul li img {
    width: 25px;
    height: 25px;
}














/*//////////////////////////////////////////////////////////*/
/*/ HOMEPAGE STYLING                                        */
/*//////////////////////////////////////////////////////////*/

#homepage_hero{
    position: absolute;
    top: 0;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    width: 100%;
    height: 750px;
}

#homepage_hero .make_darker{
    position: relative;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
}

#homepage_hero .container_wide{
    position: relative;
    top: -750px;
    display: flex;
    align-items: center;
    margin-top: 80px;
    height: 480px;
}

#homepage_hero .welcome{
    text-align: center;
    color: var(--white);
    padding: 0px 20%;
}

#homepage_hero .welcome h1{
    margin: 0px;
    padding: 0px;
    font-size: 50px;
    font-weight: 700;
}

#homepage_hero .welcome h2{
    font-size: 20px;
    font-weight: 400;
    color: var(--white);
}

#homepage_hero .welcome .btn-transparent-arrow{
    display: inline-block; 
    color: var(--white);
    border-radius: 500px;
    border: 1px solid #FFF;
    background: rgba(217, 217, 217, 0.01);
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    padding: 10px 20px;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    transition: background-color 0.3s;
    margin-top: 15px;
}

#homepage_hero .welcome .btn-transparent-arrow:hover {
    background-color: rgba(0, 0, 0, 0.276);
}

#homepage_hero .welcome .btn-transparent-arrow{
    padding-right: 40px;
}

#homepage_hero .welcome .btn-transparent-arrow::after{
    content: "\f061";
    font-family: "Font Awesome 6 Pro";
    font-weight: 500;
    font-size: 18px;
    position: relative;
    right: -20px;
    top: 2px;
}

/*/ LATEST POSTS ///////////////////////////////////////////*/

.pullup-homepage{
    position: relative;
    z-index: 2;
    margin-top: -290px;
}

article.container_wide{
    background-color: var(--white);
    border-radius: 20px;
    padding-top: 30px;
}

article .latest_posts h2{
    margin-bottom: 0px;
}

article .latest_posts .posts{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: 1fr;
    grid-column-gap: 30px;
}

article .latest_posts .posts .post{
    position: relative;
    height: 300px;
    border-radius: 20px;
    overflow: hidden;
}

article .latest_posts .posts .post .post_img{
    position: absolute;
    top: 0; left: 0;
    z-index: 1;
    object-fit: cover;
    height: 100%;
    transition: scale 1s ease;
}

article .latest_posts .posts .post:hover .post_img{
    scale: 1.2;
}

article .latest_posts .posts .post .make_darker{
    position: absolute;
    z-index: 2;
    border-radius: 15px;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.80) 100%);
    width: 100%;
    height: 100%;
}

article .latest_posts .posts .post .info{
    position: relative;
    z-index: 2;
    display: flex;
    align-content: space-between;
    flex-wrap: wrap;
    height: 100%;
    padding: 30px;
    color: var(--white);
}

article .latest_posts .posts .post .info .location{
    display: inline-block;
    flex-basis: 100%;
}

article .latest_posts .posts .post .info .location .marker{
    border-radius: 500px;
    border: 1px solid rgba(255, 255, 255, 0.20);
    background: rgba(255, 255, 255, 0.01);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    font-size: 11px;
    font-weight: 400;
    display: inline-block;
    flex-basis: 100%;
    padding: 5px 10px;
}

article .latest_posts .posts .post .info .title{
    flex-basis: 100%;
}
article .latest_posts .posts .post .info .location .icon{
    color: var(--white);
    margin-right: 5px;
}

article .latest_posts .posts .post .info .title h2{
    color: var(--white);
}


/*/ ALL DESTINATIONS ON HOMEPAGE ///////////////////////////*/

article .all_destinations h2{
    margin-bottom: 0px;
}

article .all_destinations .destinations{
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: 1fr;
    grid-column-gap: 30px;
    grid-row-gap: 30px;
}

article .all_destinations .destinations .destination{
    position: relative;
    height: 200px;
    border-radius: 20px;
    overflow: hidden;
    color: var(--light);
    background-color: var(--light);
}

article .all_destinations .destinations .destination .post_img{
    position: absolute;
    top: 0; left: 0;
    z-index: 1;
    object-fit: cover;
    height: 100%;
    transition: scale 1s ease;
}

article .all_destinations .destinations .destination:hover .post_img{
    scale: 1.2;
}

article .all_destinations .destinations .destination .overlay{
    position: absolute;
    width: 100%;
    z-index: 2;
    bottom: 0px;
    background: rgba(0, 0, 0, 0.30);
    backdrop-filter: blur(2.5px);
    -webkit-backdrop-filter: blur(2.5px);
    color: var(--white);
    font-size: 13px;
    font-weight: 600;
    padding: 10px 20px;
}

article .all_destinations .destinations .destination .overlay .icon{
    margin-right: 15px;
}

/*/ HOMEPAGE INFO OVER ONS! ////////////////////////////////*/

article .welcome_us{
    display: grid;
    grid-template-columns: 2fr 1fr;
    grid-template-rows: repeat(1, 1fr);
    grid-column-gap: 50px;
}

article .welcome_us .welcome h2{
    font-size: 28px;
}

article .welcome_us .photo{
    height: 100%;
}

article .welcome_us .photo img{
    height: 100%;
    object-fit: cover;
}








/*//////////////////////////////////////////////////////////*/
/*/ POST TYPE ARCHIVE PAGE                                  */
/*//////////////////////////////////////////////////////////*/

#small_hero{
    position: absolute;
    top: 0;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    width: 100%;
    height: 500px;
}

#small_hero .make_darker{
    position: relative;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
}

#small_hero .container_wide{
    position: relative;
    top: -500px;
    display: flex;
    align-items: center;
    margin-top: 80px;
    height: 220px;
}

#small_hero .welcome{
    color: var(--white);
}

#small_hero .welcome h1{
    margin: 0px;
    padding: 0px;
    font-size: 30px;
    font-weight: 700;
}

.pullup-posttype{
    position: relative;
    z-index: 2;
    margin-top: -550px;
}

/*/ ALLE POSTS /////////////////////////////////////////////*/

section.all_posts{
    margin-top: 7px;
}

section.all_posts .posts{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: 1fr;
    grid-column-gap: 30px;
    grid-row-gap: 30px;
}

section.all_posts .posts .post .image{
    border-radius: 15px 15px 0px 0px;
    overflow: hidden;
    width: 100%;
    height: 225px;
}

section.all_posts .posts .post .image img{
    border-radius: 0px 0px 0px 0px;
    object-fit: cover;
    height: 100%;
    transition: scale 1s ease;
}

section.all_posts .posts .post .image:hover img{
    scale: 1.2;
}

section.all_posts .posts .post .content{
    border-left: 1px solid #E3E3E3;
    border-right: 1px solid #E3E3E3;
    padding: 30px;
}

section.all_posts .posts .post .content .description{
    min-height: 220px;
}

section.all_posts .posts .post .content h2:hover{
    color: var(--grey);
}

section.all_posts .posts .post .content .details ul{
    list-style-type: none;
    margin: 0px;
    padding: 0px;
}
section.all_posts .posts .post .content .details ul li{
    margin: 0px;
    padding: 0px;
    font-size: 13px;
    color: var(--grey);
}

section.all_posts .posts .post .content .details ul li .icon{
    margin-right: 10px;
}

section.all_posts .posts .post .button_area a{
    position: relative;
    width: 100%;
    border-radius: 0px 0px 15px 15px;
    background-color: var(--black);
    color: var(--white);
    display: block;
    padding: 15px 30px;
    font-size: 14px;
    font-weight: 600;
}

section.all_posts .posts .post .button_area a::after{
    content: "\f061";
    font-family: "Font Awesome 6 Pro";
    font-weight: 500;
    font-size: 14px;
    position: absolute;
    right: 30px;
    top: 18px;
    transition: right .3s ease;
}

section.all_posts .posts .post .button_area a:hover{
    background-color: var(--primary);
}

section.all_posts .posts .post .button_area a:hover::after{
    right: 20px;
}












.editor-post-title{
    font-family: 'Poppins', sans-serif;
    font-size: 50px;
    font-weight: 700;
}

















/*//////////////////////////////////////////////////////////*/
/*/ IT'S TIME FOR MOBILE STYLING VOOR TELEFOONTJES          */
/*//////////////////////////////////////////////////////////*/


@media only screen and (max-width: 800px) {
    
    #navbar nav{display: none;}
    #navbar #hamburger{display: block;}
    #mobilemenu{display: block;}

    header{height: 580px;}
    #post_hero{height: 580px;}
    #post_hero .post_info{width: 100%;}
    #post_hero .post_info .content{margin-top: 30px;}
    #post_hero .post_info .content .title h1{font-size: 20px; line-height: 30px;}
    #post_hero .post_info .content .details{margin-top: 15px; margin-bottom: 30px;}
    #post_hero .post_info .content .details ul li{float: none; font-size: 12px; margin-bottom: 8px;}

    #quote_under_hero{margin-bottom: 30px;}
    #quote_under_hero .quote_info{width: 100%;}
    #quote_under_hero .quote_info .content{padding: 30px 30px 30px 0px;}
    #quote_under_hero .quote_info .content h2{font-size: 17px; line-height: 24px;}

    article img{border-radius: 10px; margin-bottom: 20px;}
    article .btn{padding: 10px 20px; font-size: 12px;}
    article .element{margin-bottom: 50px;}

    article .photo_caption{margin-bottom: 50px;}
    article .photo_caption .photo img{border-radius: 10px;}
    article .photo_caption .photo .caption{border-radius: 0px 0px 10px 10px; padding: 10px 10px 10px 15px;}
    article .photo_caption .photo .caption .icon{padding-right: 10px; font-size: 12px; margin-top: 4px;}
    article .photo_caption .photo .caption p{font-size: 11px; font-weight: 500;}
    article .photoslider .swiper-pagination{margin-bottom: -50px;}

    article .location_rating .title{display: block;}
    article .location_rating .title .rating{margin-top: -10px; margin-bottom: 10px;}
    article .location_rating .icon:first-of-type{padding-left: 0px;}

    article .col2_numbers ol{margin-top: 30px; -webkit-column-count: 1; -moz-column-count: 1; column-count: 1;}

    article .col3_photolocation{grid-template-columns: repeat(1, 1fr);grid-row-gap: 20px;}
    article .col3_photolocation .col img{border-radius: 10px;}
    article .col3_photolocation .col .location{margin-top: -20px;}

    article .portraits {gap: 20px;}
    article .portraits .column:nth-child(2) {margin-top: 100px;}
    article .portraits .column img {margin-bottom: 20px;}

    article .col3_bullets ul{margin-top: 20px; -webkit-column-count: 2; -moz-column-count: 2; column-count: 2;}
    
    #post_footer .container_wide{flex-wrap: wrap;}
    #post_footer .social_share{order: -1; width: 100%; flex-basis: 100%; padding-top: 20px; padding-bottom: 20px;  border-left: none; border-right: none; border-bottom: 1px solid #E3E3E3;}
    #post_footer .prev_post, #post_footer .next_post{padding-top: 30px; padding-bottom: 30px; width: 50%;}
    #post_footer .prev_post{border-right: 1px solid #E3E3E3;}
    #post_footer .prev_post .arrow{margin-right: 0px; margin-left: -20px;} 
    #post_footer .next_post .arrow{margin-left: 0px; margin-right: -20px;}
    #post_footer .prev_post .thumb img,#post_footer .next_post .thumb img{display: none;}


    #footer_newsletter form input{border-radius: 100px; width: 100%; margin-bottom: 20px;}
    #footer_newsletter form button{border-radius: 100px;}

    footer{padding-top: 20px; padding-bottom: 20px;}
    footer .container_wide{display: block;}
    footer .col{border-bottom: 1px solid #E3E3E3; width: 100%; padding-top: 30px; padding-bottom: 30px;}
    footer .col:first-of-type{width: 100%;}
    footer .col:last-of-type{border-bottom: none;}

    #closer .container_wide{ align-items: center;}
    #closer .center{text-align: right;}
    #closer .socials {display: none;}



    .pullup-homepage{margin-top: -50px;}

    #homepage_hero{height: 560px;}
    #homepage_hero .container_wide{top: -560px; height: calc(520px - 80px);}
    #homepage_hero .welcome{padding: 0px;}
    #homepage_hero .welcome h1{font-size: 30px;}
    #homepage_hero .welcome h2{font-size: 17px;}
    
    article .latest_posts .posts{grid-template-columns: repeat(1, 1fr); grid-row-gap: 30px;}
    
    article .all_destinations .destinations{grid-template-columns: repeat(2, 1fr); grid-row-gap: 30px; margin-bottom: 20px;}
    article .all_destinations{margin-bottom: 100px;}
    
    article .welcome_us{grid-template-columns: 1fr; grid-template-rows:(2, 1fr); grid-row-gap: 30px;}
    article .welcome_us .photo{height: auto;}
    article .welcome_us .photo img{height: auto;}

    .pullup-posttype{margin-top: -280px;}
    #small_hero{height: 400px;}
    #small_hero .container_wide{top: -400px; height: 220px;}

    section.all_posts .posts{grid-template-columns: repeat(1, 1fr);}

    
}