/*!
Theme Name:   Gravity Park Theme
Author:       Web Arts Guys
Author URI:   https://web-arts.bg
Description:  This is the main WP Theme for Gravity Park Project. The theme is created and customized for Gravity Park and meets their requirements at highest level.
Version:      1.0
Requires PHP: 7.0.0
License:      Private
Text Domain:  GravityPark
Tags:         Gravity, Park, Customized, WebArtsGuys
*/

/* Font = Montserrat Alternates / Bold */
/* Yellow = #fbde00 */
/* Purple = #524fa1 */

@import url('styles/animations.css');

/* --- Global variables --- */
:root{
	--primary-color: #47297B;
	/* --primary-color: #524fa1; */
	/* --secondary-color: #F5BD1F; */
	--secondary-color: #fbde00;
	--gray-color: #8f8f8f;
	--black-color: #333;
	--swiper-theme-color: #2275BC;
	--borderWidth: 2px;
	--borderRadius: 20px;
  }

/* --- Reset settings --- */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section { display: block; }
table { border-collapse: collapse; border-spacing: 0;}

/* --- Animations classes --- */
.slide-in-bottom.active {
	-webkit-animation: slide-in-bottom 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	        animation: slide-in-bottom 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

.bounce-in-top.active {
	-webkit-animation: bounce-in-top 1.1s both;
	        animation: bounce-in-top 1.1s both;
}

.bounce-in-bottom.active {
	-webkit-animation: bounce-in-bottom 0.8s both;
	        animation: bounce-in-bottom 0.8s both;
}

.bounce-top.active {
	-webkit-animation: bounce-top 0.9s both;
	        animation: bounce-top 0.9s both;
}

.jello-horizontal.active {
	-webkit-animation: jello-horizontal 0.9s both;
	        animation: jello-horizontal 0.9s both;
}

/* --- General settings --- */
html, body {min-height: 100%; scroll-behavior: smooth; font-size: calc(12px + (20 - 14) * ((100vw - 300px) / (1600 - 300)));  font-family: "Montserrat Alternates", system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;}
body{margin: 0; padding: 0; color: var(--black-color); background: #fff;}
html, body, p{font-weight: 400;}

h1 {font-size: 1.95em; line-height: 1.25em; margin: 0.67em 0;}
h2 {font-size: 1.65em; line-height: 1.25em; margin: 0.83em 0; font-weight: 700;}
h3 {font-size: 1.30em; line-height: 1.25em; margin: 1.00em 0; font-weight: 700;}
h4 {font-size: 1.15em; line-height: 1.25em; margin: 1.33em 0; font-weight: 700;}
h5 {font-size: 0.75em; line-height: 1.25em; margin: 0.67em 0; font-weight: 700;}
h6 {font-size: 0.55em; line-height: 1.25em; margin: 0.67em 0; font-weight: 700;}

a{margin: 0; font: inherit; color: inherit; text-decoration: none; z-index: 3;} 
/* ul{padding: 0; list-style: none;} */
figure {margin: 0;}
figcaption{font-size: 0.85em;}

input, select, textarea, canvas{width: 100%; padding: 11px; border: 0; border-radius: 5px; border: 1px solid var(--primary-color); box-sizing: border-box; resize: vertical; font-family: "Montserrat Alternates", system-ui, sans-serif; background: #fff;} /* box-sizing: content-box; */
/* input[type="checkbox"], input[type="radio"]{width: 13px;} */
input[type="checkbox"], input[type="radio"]{width: auto; margin: 11px 5px;}
:focus-visible{outline: none;}
input::placeholder, textarea::placeholder{font-family: "Montserrat Alternates", system-ui, sans-serif;}
input::-ms-input-placeholder , textarea::-ms-input-placeholder {font-family: "Montserrat Alternates", system-ui, sans-serif;}

/* .main{min-height: 76vh;} */
.narrow{margin: 0 auto; width: 92%; max-width: 1340px;}
.slim{margin: 0 auto; width: 92%; max-width: 1140px;}
.flexrow{display: flex; justify-content: space-between;}
.gridflow{display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); gap: 15px 2%;}
.section{margin: 5em auto;}
.anime{opacity: 0;}
.anime.active{opacity: 1;}
/* .button{position: relative; padding: 8px 16px; display: inline-block; color: #fff; background: var(--primary-color); text-transform: uppercase; font-size: 0.75em; letter-spacing: 0.6px; font-weight: 500; margin-top: 15px; transition: 0.2s all;}
.button:hover{background: var(--secondary-color); color: var(--black-color);}
.button.reverted{color: var(--black-color); background: var(--secondary-color);}
.button.reverted:hover{background: var(--primary-color); color: #fff;} */

.button {display: block; width: fit-content; margin-top: 15px; padding: 10px 20px; text-transform: uppercase; font-size: 0.8em; letter-spacing: 0.6px; font-weight: 500; color: #fff;border-radius: 5px; background-size: 200% auto; background-image: linear-gradient(to right, #614385 0%, #516395  51%, #614385  100%);transition: 0.3s; border: 0;}
.button.center{margin: 0 auto;}
.button:hover{background-position: right center; color: #fff; text-decoration: none;}
.button.reverted{background-image: linear-gradient(to right, #F09819 0%, #EDDE5D  51%, #F09819  100%); color: #000;}
.button.reverted:hover{color: #fff;}

.underlinedTitle{text-transform: uppercase;}
.underlinedTitle:after{content: ''; display: block; background-color: var(--secondary-color); width: 90%; max-width: 130px; height: 5px;}
.underlinedTitle.center:after{margin-left: auto; margin-right: auto;}
.center{text-align: center;} 
.center .underlinedTitle, 
.center .underlinedTitle:after{margin: 5px auto; text-align: center;}
/* .swiper-wrapper{padding-bottom: 35px;} */
.overlay{position: relative;}
.overlay .narrow{position: relative; z-index: 2;}
.overlay:before{content: ''; position: absolute; background: var(--primary-color); opacity: 0.5; top: 0; left: 0; width: 100%; height: 100%; z-index: 1;}

.parallax{background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover;}
.img-wrap img{width: 100%; height: 100%; object-fit: cover;}
#page .section a, #archive .content a, #errorPage a{color: var(--primary-color);}

.cky-notice-btn-wrapper{row-gap: 10px;}

/* --- Forms --- */
.response{flex: 0 0 100%; min-height: 16px; line-height: 1em; margin-bottom: 15px; color: #444; padding: 7px 16px;}
.response.error {border-left: 5px solid #f00; background: #F2F2F2;}
.response.success {border-left: 5px solid #0f0; background: #F2F2F2;}
.globalForm{position: relative;}
.globalForm .input{margin: 10px 0;}
.globalForm .text.input{padding: 15px 0 15px 20px;}
.globalForm .text {resize: vertical;}
.globalForm .submit {margin-top: 20px; width: fit-content; font-family: "Montserrat Alternates", system-ui, sans-serif;}
.globalForm .button{width: fit-content;}
.globalForm input::placeholder, .globalForm textarea::placeholder{font-weight: 500;}
.globalForm input:-ms-input-placeholder , .globalForm textarea:-ms-input-placeholder{font-weight: 500;}
.loaderWrapper{position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(255, 255, 255, 0.6); display: flex; align-items: center; justify-content: center;}
.loaderWrapper .loader{ width: 48px; height: 48px; border: 5px solid var(--secondary-color); border-bottom-color: #dedede; border-radius: 50%; display: inline-block;box-sizing: border-box; animation: rotation 1s linear infinite;}


/* --- Swiper --- */
/* .swiper-container{position: relative; overflow: hidden;}
.swiper-pagination{z-index: 1;}
.swiper-pagination-bullet{width: 16px; height: 16px; background: var(--black-color); margin: 0 4px;}
.swiper-pagination-bullet-active{background: var(--swiper-pagination-color,var(--swiper-theme-color));}
.swiper-section .swiper-button-next{right: -50px;}
.swiper-section .swiper-button-prev{left: -50px;} */


/* === Header === */
#header{width: 100%; margin: 0; font-size: 0.8em; position: fixed; top: 0; left: 0; right: 0; z-index: 10; padding: 10px 0; transition: 0.3s all;}
#header .headerBar{align-items: center;}
#header.scrolled{background: var(--primary-color); /* background: rgba(0,0,0,0.5); */}
#header .logo{height: 70px;}
#header .logo img{width: auto;}

.menu .social{position: relative;}
.menu .social.dashicons{font-size: 22px; height: 24px; width: 24px;}
.menu .social a{font-size: 0 !important; position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.menu .social.tiktok{width: 18px; height: 18px; display: block; background: url("https://gravitypark.bg/wp-content/themes/gravity/images/icons/tik-tok.svg") no-repeat center center; background-size: contain;}
.menu .social.tiktok:hover{filter: invert(35%) sepia(100%) saturate(1205%) hue-rotate(10deg) brightness(105%) contrast(90%);}

#nav{display: flex; justify-content: space-between; align-items: center;}
#nav .menu{display: flex; justify-content: space-between; align-items: center; list-style-type: none; margin: 0; padding: 0; flex-flow: row nowrap;}
#nav .menu .menu-item{flex-grow: 1; text-align: center; margin: 5px; transition: all 0.3s ease-out; color: #fff;}
#nav .menu .menu-item a{display: block; text-decoration: none; font-weight: 500; letter-spacing: 0.5px; color: inherit; padding: 5px 8px;}
#nav .menu .menu-item:hover,
#nav .menu .menu-item.current-menu-item{color: var(--secondary-color);}
#nav .menu .first-menu-item{margin-left: 0;}
#nav .menu .last-menu-item{margin-right: 0;}

#nav.socialNav{display: none;}

.marquee-container {--gap: 3rem; position: relative; display: flex; overflow: hidden; user-select: none; gap: var(--gap); background: #47297b10; color: var(--secondary-color); text-transform: uppercase; padding: 5px 0; font-size: 1.3em;}
.marquee-text {flex-shrink: 0; display: flex; justify-content: space-around; gap: var(--gap); min-width: 100%; animation: scroll 15s linear infinite;}
.marquee-text > * {flex: 0 0 auto; margin: 2px;}
@keyframes scroll { from { transform: translateX(0); } to { transform: translateX(calc(-100% - var(--gap))); } }

	/* --- Hamburger --- */
#hamburger{display: none; background: none; outline: 0; border: 0; border-top: 5px solid #fff; border-bottom: 5px solid #fff; width: 46px; height: 34px; position: relative; font-size: 0px; color: #080357; transition: border 0.1s ease-out; z-index: 10; cursor: pointer;}
#hamburger:before, #hamburger:after{content: ''; display: block; width: 100%; height: 5px; position: absolute; top: 50%; left: 50%; background: #fff; transform: translate(-50%, -50%); transition: transform 0.3s ease; z-index: 120;}
#hamburger.active:before{transform: translate(-50%, -50%) rotate(45deg); transition-delay: 0.2s; }
#hamburger.active:after{transform: translate(-50%, -50%) rotate(-45deg); transition-delay: 0.2s; }
#hamburger.active{border: unset;}


/* --- Intro --- */
#intro{background: #fff; position: relative;}
#intro .introImage{height: 90vh; clip-path: polygon(100% 0, 100% 85%, 50% 100%, 0 85%, 0% 0%);}
#intro .introImage:before{content: ""; display: block; position: absolute; width: 100%; height: 100%; background: #47297b; opacity: 0.8;     z-index: 1;}
#intro .introImage img{z-index: 0;}
#intro .text-wrap{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: #fff; text-align: center; z-index: 2;}
#intro .text-wrap .title{font-size: 2.8em;}
#intro .text-wrap .slogan{font-size: 1.5em; font-weight: 400;}
#intro .logo{height: 200px;}
#intro .logo img{width: auto; max-width: 100%; object-fit: contain;}


/* --- Small Intro --- */
#smallIntro{display: flex; height: 50vh; background-position: center; background-repeat: no-repeat; background-size: cover; color: #fff; clip-path: polygon(100% 0, 100% 85%, 50% 100%, 0 85%, 0% 0%); padding: 100px;}
#smallIntro .wrapper{display: flex; flex-flow: column; justify-content: flex-end; margin: 15px auto;}
#smallIntro .wrapper .subtitle{font-size: 1em; max-width: 780px; font-weight: inherit;}


/* === Breadcrumbs === */
#breadcrumbs{display: flex; flex-flow: row wrap; align-items: baseline; list-style: none; padding: 10px 0 0; font-size: 0.8em; text-transform: uppercase;}
#breadcrumbs a{color: #fff;}
#breadcrumbs a:hover{color: var(--secondary-color);}
#breadcrumbs li:last-child a{color: var(--secondary-color);}
#breadcrumbs .chunk{display: inline;}
/* #breadcrumbs .separator{padding: 0 10px; font-size: 26px; line-height: 0; vertical-align: middle; color: var(--secondary-color);} */
#breadcrumbs .separator{padding: 0 10px; font-size: 1.4em; line-height: 1.4em; color: var(--secondary-color);}


/* === Pagination === */
.postPagination{margin: 70px auto; }
.postPagination .screen-reader-text{display: none;}
.postPagination .nav-links{display: flex; flex: 0 0 100%; justify-content: center;}
.postPagination .page-numbers{display: flex; justify-content: space-between; width: 4vh; height: 4vh; align-items: center; justify-content: center; font-size: 1em; font-weight: 700; transition: 0.2s all ease-in-out; background: var(--primary-color); color: #fff; margin: 0 2px; border-radius: 5px;}
.postPagination .page-numbers:hover,
.postPagination .page-numbers.current{background: var(--secondary-color); color: var(--black-color);}

/* --- Article sharer --- */
.sharer{margin: 45px auto 60px; max-width: 980px; border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; }
.sharer .list{list-style-type: none;display: flex; justify-content: center; flex-flow: row nowrap; padding: 10px 0; }
.sharer .list .item{display: inline; margin: 0 1%;}
.sharer .list .item .dashicons:before{font-size: 28px; width: 28px; height: 28px;}
.sharer .list .item a{color: var(--secondary-color); text-decoration: none; padding: 10px; }
.sharer .list .sms{display: none;}
.sharer .list .fb a:hover{color: #1877F2;} 
.sharer .list .tw a:hover{color: #1da1f2;} 
.sharer .list .li a:hover{color: #0077B5;} 
.sharer .list .wa a:hover{color: #25D366;} 
.sharer .list .ml a:hover{color: #0489c9;} 
.sharer .list .ig a:hover{color: #833AB4;} 
.sharer .list .yt a:hover{color: #ff0000;} 
.sharer .list .sms a:hover{color: #0084ff;}


/* --- Icon list with description --- */ 
.iconList{list-style: none; margin: 50px auto; padding: 0; grid-template-columns: repeat(auto-fill, minmax(min(100%, 290px), 1fr)); gap: 25px 5%;}
.iconList .item{flex: 0 0 30%; display: flex; flex-flow: column; align-items: flex-start;}
.iconList .item .icon{height: 35px; width: auto; margin-bottom: 15px;}
.iconList .item .title{font-size: 1em;  margin-right: auto;}
.iconList .item .desc{font-size: 0.9em;}
.iconList .item br{display: none;}


/* --- Sections with image background --- */
/* .imageBackground{position: relative; min-height: 60vh;}
.imageBackground .title{margin: 15px auto;}
.imageBackground .containerImage{position: absolute; top: 0; left: 0; width: 55%; height: 100%; box-sizing: border-box;}
.imageBackground .wrapper{position: relative; z-index: 3; width: 40%; height: 60vh; display: flex; flex-flow: column; justify-content: center;} */


/* --- Attractions Section --- */
.attractions .gridflow {column-gap: 4%;}
.attractions .gridflow .article {overflow: visible;}
.attractions .gridflow .article .imageContainer{ position: relative; display: inline-block; background-color: #47297ba1; border-radius: var(--borderRadius); transform: rotate(-2deg); box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1); transition: 0.2s all; overflow: visible; padding: 5px;}
.attractions .gridflow .article .imageContainer img{display: block; border-radius: 15px; width: 100%; height: 100%; object-fit: cover; transform: rotate(4deg);}
.attractions .gridflow .article:hover .imageContainer{transform: rotate(0deg);}
.attractions .gridflow .article:hover .imageContainer img{transform: rotate(0deg);}


/* --- Declaration Section --- */

.backgroundImageOverlay{position: relative; display: flex; flex-flow: column; justify-content: center; min-height: 500px; color: #fff; margin: 7em auto; background-position: center; background-repeat: no-repeat; background-size: cover; border-radius: var(--borderRadius); }
.backgroundImageOverlay:before{content: ""; display: block; position: absolute; width: 100%; height: 100%; background: #47297b; opacity: 0.6; z-index: 0; border-radius: var(--borderRadius);}
.backgroundImageOverlay .text{z-index: 1;}

#frontPage .declaration .desc{max-width: 760px; width: 90%; display: block; margin: 20px auto; font-size: 1.1em;}
#frontPage .declaration .button{margin: 50px auto 0;}


/* --- Counter Section --- */
#counter .box{display: flex; flex-flow: column; justify-content: center; align-items: center; position: relative;}
#counter .box .digit{font-size: 3em; font-weight: 900; color: var(--secondary-color); }
#counter .box .text b{display: block; text-transform: uppercase; font-size: 1.3em;}
/* #counter .box .icon{position: absolute; top: 50%; width: 70%; opacity: 0.1; transform: translateY(-50%); filter: invert(12%) sepia(46%) saturate(4559%) hue-rotate(254deg) brightness(96%) contrast(86%);} */
#counter .box .icon{width: 30%; margin-bottom: 50px; filter: invert(12%) sepia(46%) saturate(4559%) hue-rotate(254deg) brightness(96%) contrast(86%);}


/* --- About us Section --- */
/* #frontPage .about{display: flex; justify-content: space-between; background: var(--primary-color); color: #fff; margin: 7em auto; border-radius: var(--borderRadius);}
#frontPage .about .wrapper.left{flex: 0 0 400px; width: 400px; height: 400px; transform: rotate(45deg); overflow: hidden; position: relative; border: 2px solid var(--secondary-color); margin: 30px auto; border-radius: var(--borderRadius);}
#frontPage .about .wrapper.left img{position: absolute; top: 50%; left: 50%; width: 150%; height: 150%; object-fit: cover; transform: translate(-50%, -50%) rotate(-45deg);}
#frontPage .about .wrapper.right {display: flex; flex-flow: column; justify-content: center; margin: 0 150px;}
#frontPage .about .wrapper.right .underlinedTitle{margin-bottom: 0;}
#frontPage .about .wrapper.right a{display: block; width: fit-content; margin-top: 30px;} */



.containerSquareImage{display: flex; justify-content: space-between; background: var(--primary-color); color: #fff; margin: 7em auto; border-radius: var(--borderRadius);}
.containerSquareImage .wrapper.left{flex: 0 0 400px; width: 400px; height: 400px; transform: rotate(45deg); overflow: hidden; position: relative; border: 2px solid var(--secondary-color); margin: 30px auto; border-radius: var(--borderRadius);}
.containerSquareImage .wrapper.left img{position: absolute; top: 50%; left: 50%; width: 150%; height: 150%; object-fit: cover; transform: translate(-50%, -50%) rotate(-45deg);}
.containerSquareImage .wrapper.right {display: flex; flex-flow: column; justify-content: center; margin: 0 100px 0 150px;}
.containerSquareImage .wrapper.right .underlinedTitle{margin-bottom: 0;}
.containerSquareImage .wrapper.right a{display: block; width: fit-content; margin-top: 30px;}

.containerSquareImage.reverted{flex-flow: row-reverse;}
    

/* --- Subscribe Section --- */
/* #frontPage .subscribe input{font-size: 0.8em;} */
#frontPage .subscribe .desc{max-width: 90%;}
#frontPage .subscribe div.tnp-subscription{margin-left: 0; max-width: 70%;}
#frontPage .subscribe .tnp-email{outline: none;}
#frontPage .subscribe .tnp-privacy-field a{display: inline;}
#frontPage .subscribe .tnp-field-button{margin-top: 15px;}
#frontPage .subscribe .tnp-submit{display: block; background-image: linear-gradient(to right, #F09819 0%, #EDDE5D 51%, #F09819 100%); color: #000; padding: 10px 20px; font-size: 0.8em;}
#frontPage .subscribe .tnp-submit:hover{color: #fff;}


/* --- Post Aricles --- */
.section.news .button{display: block; width: fit-content; margin: 30px auto;}
.news .gridflow.singles .article{background: #f5f5f5; padding: 30px; border-radius: var(--borderRadius);}
.news .gridflow.singles .imageContainer{border-radius: var(--borderRadius);}

.gridflow.singles{margin: 2em auto;}
.gridflow.singles .article{align-items: flex-start; text-align: left;}
.gridflow.singles .article .wrapper{display: flex; flex-flow: column; flex-grow: 1;}
.gridflow.singles .article .imageContainer{ width: 100%;  height: 300px; position: relative; overflow: hidden;}
.gridflow.singles .article .textContainer{display: flex; flex-flow: column; flex-grow: 1; margin: 30px 0;}
.gridflow.singles .article .title{margin: 0 0 15px 0; font-size: 1.2em; transition: 0.3s color;}
.gridflow.singles .article .desc{margin-top: auto;}
.gridflow.singles .article:hover .title{color: var(--secondary-color);}
.gridflow.singles .article .dateContainer{display: flex; align-items: center;}
.gridflow.singles .article .dashicons{margin-right: 5px;}
.gridflow.singles .article .date{font-size: 0.8em; margin: 5px 0;}
.gridflow.singles .article .underlinedButton{display: block; width: fit-content; margin-top: auto;}


/* === Archive: Post & Home Page Articles === */
.gridflow.post .article{overflow: visible;}
.gridflow .article{position: relative; display: flex; flex-flow: column; align-items: center; overflow: hidden;}
.gridflow .article .image{width: 100%; height: 100%; object-fit: cover; transition: 0.3s all;}
.gridflow .article:hover .image{transform: scale(1.1);}


/* === Single: Posts === */
#single li{line-height: 1.5em;}
#single .recent .gridflow{margin: 3em auto;}


/* === About us Page === */
.iconsSection{grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); padding: 0;}
.iconsSection .item{list-style: none; text-align: center;}
.iconsSection .item .icon{max-width: 120px; margin-bottom: 30px; filter: invert(12%) sepia(46%) saturate(4559%) hue-rotate(254deg) brightness(96%) contrast(86%);}
.iconsSection .item:hover .icon{filter: invert(82%) sepia(71%) saturate(2136%) hue-rotate(357deg) brightness(96%) contrast(105%);}
.iconsSection .item .title{font-size: 1.1em;}


/* === Contacts Page === */
#contactPage .iconsInfo {display: flex; flex-flow: row wrap; justify-content: space-between; gap: 30px;}
#contactPage .iconsInfo .underlinedTitle{flex: 0 0 100%;}
#contactPage .iconsInfo .article{display: flex; flex-flow: column; flex: 1 0 30%; align-items: center; line-height: 1.5em;}
#contactPage .iconsInfo .article:hover .dashicons{color: var(--primary-color);}
#contactPage .iconsInfo .article .dashicons{width: auto; min-width: 50px; height: 50px; font-size: 3em; color: var(--secondary-color);}
#contactPage .iconsInfo .article .icon.tiktok{background: url("https://gravitypark.bg/wp-content/themes/gravity/images/icons/tik-tok-yellow.svg") no-repeat center center; background-size: contain;}
#contactPage .iconsInfo .article:hover .icon.tiktok{background: url("https://gravitypark.bg/wp-content/themes/gravity/images/icons/tik-tok-purple.svg") no-repeat center center; background-size: contain;}


#contactPage .iconsInfo .article .title{text-transform: uppercase;}
#contactPage .mapForm{display: flex; justify-content: space-between; gap: 2%;}
#contactPage .mapForm .item.left{flex: 0 0 60%; min-height: 530px;}
#contactPage .mapForm .item.right{flex: 1 0 auto;}
#contactPage .mapForm .item.left iframe{width: 100%; height: 100%;}
#contactPage .mapForm .item .title{margin: 0.5em 0;}
#contactForm {display: flex; flex-flow: column; justify-content: space-between; position: relative;}
#contactForm .input{margin: 10px 0; padding: 1em 0 0.9em 1.2em; font: inherit; font-size: 0.8em; outline: 0; border: 0;}
#contactForm .input:not(.button){background: #f5f5f5;}
#contactForm .message{resize: vertical;}
#contactForm .submit{display: flex; align-items: center; justify-content: center; margin: 10px 0 0; padding: 1em 1.2em.9em; cursor: pointer; font-weight: 500;}
#contactForm .response{flex: 0 0 100%; margin-bottom: 15px; font-size: 0.8em;}
#contactForm .response.error{border-left: 5px solid #f00; padding: 7px 16px; color: #1e1e1e;}
#contactForm .response.success{border-left: 5px solid #0f0; padding: 7px 16px; color: #1e1e1e;}


/* --- 404 Page --- */
#errorPage{display: flex; flex-flow: column; text-align: center; min-height: unset; padding: 5% 0 7%;}
#errorPage .digits{display: flex; flex-wrap: nowrap; justify-content: center; align-items: center;}
#errorPage .digits .errorText{font-size: 19vw; line-height: 0; margin: 0 3%; text-align: justify;}
#errorPage .digits .null{height: 13vw; object-fit: contain;}


/* --- Declaration Page --- */
#declarationForm .newsletter, 
#declarationForm .input, 
#declarationForm .select,
#declarationForm canvas{margin: 15px 0;}
#declarationForm .field-error {border: 1px solid red !important;}
#declarationForm .radioWrapper{display: flex; align-items: center; gap: 15px; margin: 15px 0; padding: 3px 0; border-radius: 5px;}
#declarationForm #personalForm{font-size: 0.8em;}
#declarationForm .innerWrapper{display: flex; justify-content: space-between;}
#declarationForm label {flex-basis: 48%;}
#declarationForm label sup {color: red;}

#declarationForm #declarationType{flex-flow: row wrap; margin-bottom: 70px;}
/* #declarationForm #declarationType label{flex-basis: 100%; font-weight: 700;} */
#declarationForm #declarationType .title{margin: 0;}
#declarationForm #declarationType label{flex-basis: 100%;}

#declarationForm .innerWrapper .birthday{display: flex; justify-content: space-between;}
#declarationForm .innerWrapper .birthday > select{flex-basis: 30%;}
#declarationForm .innerWrapper .gender > label{flex-basis: auto;}
#declarationForm .innerWrapper.small{max-width: 48%;}
#declarationForm .innerWrapper.small > label{flex-basis: 100%;}
#declarationForm .innerWrapper.signature > label{text-align: center;}
#declarationForm .innerWrapper.small.signature{display: flex; align-items: center;}
#declarationForm .innerWrapper.small.signature .button{margin-left: 10px; border: none; background: #ccc; color: #000; cursor: pointer;}
#declarationForm .childForm{margin: 30px 0;}
#declarationForm .childForm .button{cursor: pointer;}


/* --- Prices Page --- */
.page-prices .packs .gridflow {grid-template-columns: repeat(auto-fill, minmax(min(100%, 400px), 1fr));}
.page-prices .packs .pack {display: flex; flex-flow: column; align-items: center; justify-content: space-between;}
.page-prices .packs .pack .price{text-align: center;}
#page.page-prices .button{color: #fff; margin: 0 auto;}


/* GDPR Plugin */
#cmplz-document, .editor-styles-wrapper .cmplz-unlinked-mode {max-width: 100%;}
#cmplz-cookies-overview .cmplz-dropdown.cmplz-dropdown-cookiepolicy summary div, #cmplz-document .cmplz-dropdown.cmplz-dropdown-cookiepolicy summary div, .editor-styles-wrapper .cmplz-unlinked-mode .cmplz-dropdown.cmplz-dropdown-cookiepolicy summary div {grid-template-columns: 2fr auto 1fr auto 25px;}



/* Footer */
#footer{padding: 40px 0; background: var(--primary-color); color: #fff; clip-path: polygon(50% 0, 100% 20%, 100% 100%, 0 100%, 0 20%); padding-top: 100px;}
#footer a{transition: 0.3s color; color: #fff;}
#footer a:hover{color: var(--secondary-color);}
#footer .credit a{color: var(--secondary-color);}
#footer .credit a:hover{color: inherit;}
#footer .rowF{display: flex; flex-flow: row wrap; justify-content: space-between; align-items: flex-end;}
#footer .rowF:after{content: ''; display: block; width: 100%; height: 1px; background: #fff; margin: 20px 0;}
#footer .logo{display: flex; flex-flow: column;}
#footer .img-wrap{width: 150px; margin-bottom: 20px;}
#footer .img-wrap img{object-fit: contain;}
#footer .fNav .social{border: 0;}
#footer .fNav .social{margin-right: 10px; padding-right: 10px;}
#footer .fNav.social ul{justify-content: flex-start;}
#footer .fNav .social a{font-size: 0;}
#footer .fNav .social:hover:before{color: var(--secondary-color);}
#footer .fNav{flex: 1 0 50%; margin: 10px 0;}
#footer .fNav ul{display: flex; align-items: center; justify-content: flex-end; margin: 0; padding: 0;}
#footer .fNav ul .dashicons-before{font-size: 1em;}
#footer .fNav ul li{display: flex; gap: 10px; align-items: center; border-right: 1px solid #fff; padding-right: 1vw; margin-right: 1vw;}
#footer .fNav ul li:last-child{border: none; padding: 0; margin: 0;}
#footer .fNav li a{line-height: 1em; font-size: 16px; white-space: nowrap;}
#footer .fInfo{display: flex; justify-content: space-between; letter-spacing: 0.5px;}
#footer .fInfo .cpr{display: flex; align-items: center; margin: 0 0 15px; flex-grow: 1;}
#footer .fInfo .cprText{margin: 0 1vw 0 0; line-height: 1em; font-size: initial;}
#footer .fInfo .sepr{font-size: initial; border-left: 1px solid #fff; padding: 2px 1vw 0; line-height: 1em;}
#footer .fInfo .credit{font-size: initial; margin: 0;}

#performance{font-size: 12px;}

/* --- Responsive design ---*/

@media screen and (max-width:1200px){
	
}

@media screen and (max-width:1024px){
	html, body {font-size: calc(14px + (20 - 14) * ((100vw - 300px) / (1600 - 300))); overflow-x: hidden; position: relative;}

	#hamburger{display: flex;}
	#nav{position: absolute; top: 100%; left: 0; transform: translateX(+100%); background: var(--primary-color); transition: all 0.5s ease-in-out; padding: 0 4%; border-radius: 0; width: 100%; margin-left: 0;}

	/* #headerNavList li:nth-last-child(-n+3) {display: none;} */
	/* #nav.socialNav{display: block;} */
	/* #nav.socialNav ul{flex-flow: row;} */

	/* #nav .menu{flex-flow: column; align-items: flex-start;} */
	#nav .menu{flex-flow: row wrap;}
	#nav.active{display: block; transform: translateX(0);}
	#nav .menu .menu-item{flex: 0 0 100%; text-align: left;}
	#nav .menu .menu-item.social{flex: 0 0 30%; text-align: center; margin: 20px auto;}
	#nav .menu .menu-item a{padding: 15px 15px 11px; font-size: 1.2em;}
	#nav .menu .menu-item.about:hover .sub-menu{display: flex; padding: 0;}
	#nav .menu .menu-item:hover .sub-menu{display: none;}

	.containerSquareImage{flex-flow: column !important;}
	.containerSquareImage .wrapper.left{flex: 0 0 300px; width: 300px; height: 300px; margin: 0 auto;}
	.containerSquareImage .wrapper.right{margin: 100px 0 50px 0; text-align: center;}
	.containerSquareImage .wrapper .desc{width: 90%; max-width: 700px; margin: 1em auto;}
	.containerSquareImage .wrapper .underlinedTitle:after,
	.containerSquareImage .wrapper .button{margin: 0 auto;}
	.containerSquareImage div.tnp-subscription{margin: auto !important;}

	.news .gridflow.singles .article{padding: 20px;}

	/* gap: 2.5em 0; */
	#counter{gap: 5em 0; flex-flow: row wrap;} 
	#counter .box{flex: 0 0 50%;}
	
	#footer .member{flex-flow: row wrap; justify-content: center;}
	#footer .rowF{flex-flow: column; align-items: center; text-align: center;}
	#footer .fNav ul{flex-flow: column; align-items: center;}
	#footer .fNav.social ul{flex-flow: row; justify-content: center; gap: 15px;}

	#footer .fNav ul li{padding: 0; margin: 0; border-right: 0;}
	#footer .fNav ul li a{line-height: 2em;}
	#footer .fInfo{flex-flow: column; text-align: center;}
	#footer .fInfo .cpr{flex-flow: column wrap;}
	#footer .fInfo .sepr{border: 0; padding: 0; line-height: 2em;}
	#footer .fInfo .cprText{line-height: 2em;}
	#footer .fInfo .credit{overflow: hidden;}

	#contactPage .iconsInfo{gap: 30px;}
	#contactPage .iconsInfo .article{flex: 0 0 46%;}
	#contactPage .mapForm{flex-flow: column; gap: 20px;}
	#contactPage .mapForm .item.left{min-height: unset;}
	#contactPage .mapForm .item.left iframe{height: 50vh;}

	#declarationForm .innerWrapper{flex-flow: column;}
	#declarationForm .innerWrapper > label {flex-basis: 100%;}
	#declarationForm .innerWrapper .birthday > select{flex-basis: 30%;}
	#declarationForm .innerWrapper.small{max-width: 100%;}
}

@media screen and (max-width:900px){
	
}


@media screen and (max-width:786px){
	.flexrow{flex-flow: row wrap;}
	.button, #frontPage .subscribe .tnp-submit{font-size: 0.9em;}
	#smallIntro {padding: 50px;}
	#smallIntro .wrapper {margin: 30px auto;}
}

@media screen and (max-width:600px){
	
}

@media screen and (max-width:500px){
	/* .imageBackground .wrapper{width: 100%;} */
	#counter .box{flex: 0 0 100%;}
	#contactPage .iconsInfo{flex-flow: column;}
	/* .tnp-subscription input[type=submit], .tnp-profile input[type=submit]{width: auto !important;} */
}

@media screen and (max-width:345px){
	.gridflow{overflow: hidden;}
}