@import url('https://fonts.googleapis.com/css2?family=Oxygen&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed:wght@700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Work+Sans:wght@500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Fira+Sans:wght@300&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Source+Sans+Pro&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@300&display=swap');

body {
	padding-top:60px;
	background-color:#96CEB4;
	font-family: 'Fira Sans', sans-serif;
	font-size:19px;
}

a {
	color:#FFEEAD;
	text-decoration: none;
}

a:hover {
	color:#96CEB4;
}

p {
	color:black;
	font-size:19px;
}

nav {
	font-family:russo one;
}

h1 {
	font-family:russo one;
}
h2 {
	font-family:russo one;
}
h3 {
	font-family:russo one;
}
.btn-primary {
	background-color:#73a9ca3d;
	border-color:#FFF;
	color:#FFF;
	padding:0 10px;
}
.btn-primary:hover {
	background-color:#73a9ca3d;
	border-color:#FFF;
	color:#FFF;
	padding:0 10px;
}
.omzet-wrapper {
	font-size:0.8rem;
	background-color:#324960;
	color:black!important;
}
.title-year {
	font-family:russo one;
	text-align:center;
	color:#96CEB4;
}
.style-years {
	padding:0;
	text-align:center;
	font-family:russo one;
}
.style-years a {
	color:#FFEEAD;
	font-family:russo one;
}
.style-years a:hover {
	color:#FFEEAD;
	font-family:russo one;
}
.style-months {
	padding:5px 0 20px;
	text-align:center;
}
.style-year-current {
	color:#FFF;
	background-color:#73a9ca3d;
}
.style-year-old {
	background-color:#c7faff5e;
	color:black;
}
.style-month-year {
	background-color:#c7faff5e;
}
.style-total-omzet {
	color:#FFF;
	background-color:#73a9ca3d;
}
.style-month-year-current {
	color:#FFF;
	background-color:#73a9ca3d;
}
.style-result-omzet a{
	color:black;
}
.style-result-omzet a:hover {
	color:#378285;
}
.style-align-right {
	text-align:right;
}
.style-row-labels {
	margin-bottom:10px;
	border-style:none none solid;
	border-color:#FFEEAD;
	border-width:2px;
	color:white;
}
.color-even {
	color:#27585a;
	padding:10px 0 10px;
	background-color:#a6d8c0;
}
.color-odd {
	background-color:#96CEB4;
	padding:10px 0 10px;
	color:#27585a;
}
.color-even a{
	color:#27585a;
}
.color-even a:hover{
	color:#FFEEAD;
}
.color-odd a{
	color:#27585a;
}
.color-odd a:hover{
	color:#FFEEAD;
}
.logbar {
	background-color:white;
}
.bg_dark_no {
	background-color:#378285;
	padding:5px 0 20px;
}
.bg_dark {
	background-color:#378285;
	color:white;
}

.bg_dark a {
	color:#FFEEAD;
}

.bg_dark a:hover {
	color:#96CEB4;
}

.bg_dark p {
	color:white;
	font-size:19px;
	
}
.bg_dark_nofluid {
	background-color:#378285;
	color:white;
	border-radius:20px;
}
.bg_dark_nofluid a {
	color:#FFEEAD;
}

.bg_dark_nofluid a:hover {
	color:#96CEB4;
}

.bg_dark_nofluid p {
	color:white;
	font-size:19px;
	
}

.rate_img img {
	margin:auto;
	display:block;
	width:100%;
}

.rate_img {
	padding:0 0 20px;
}

.rand_hostel img {
	margin:auto;
	display:block;
	width:100%;
}

.rect-img-container {
  position: relative;
}

.rect-img-container::after {
  content: "";
  display: block;
  padding-bottom: 100%;
}

.rect-img {
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.border_h_add {
	border-style:solid none none;
	border-color:#FFEEAD;
	border-width:3px;
	
}

.hostelbox {
	background-color:#96CEB4;
	padding:10px;
	margin:0 0 5px;
	border-radius:10px;
	color:black;
}
.hostelbox p {
	color:black;
}

.hosteltext {

	text-align:center;
	
}


.title_private {
	margin-top:75px;
	padding:50px 0 50px;
	border-style:solid none none;
	border-color:#FFEEAD;
	border-width:3px;
	font-size:20px;
}

.priv_text {
	padding:40px 100px 40px;

}

.priv_price {
	position:relative;
	top:0;
	left:17%;
	background-color:#FFEEAD;
	padding:50px;
	text-align:center;
	border-radius:100%;
	max-width:200px;
	
}

.priv_mob {
	position:relative;
	border-style:solid;
	border-color:#FFEEAD;
	border-width:1px;
	text-align:center;
}
.priv_mob_inh {
	padding:0;
}
.priv_mob_ss {
	position:relative;
	padding:0 0 8px 5px;
	text-align:center;
}
.priv_price_text {
	position:relative;
	top:0;
}

.sel_date {
	text-align:center;
}

.cent_input {
	position:relative;
	left:25%;
}

.cent_input_sel {
	position:relative;
	left:45%;
}

.contact h1 {
	color:#FFEEAD;
}

.contact {
	margin-top:50px;
	font-size:18px;
}

.carousel-item {
  height: 100vh;
  min-height: 350px;
  max-height:550px;
  background: no-repeat center center scroll;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.map-responsive {
    overflow:hidden;
    padding-bottom:56.25%;
    position:relative;
    height:0;
}
.map-responsive iframe {
    left:0;
    top:0;
    height:100%;
    width:100%;
    position:absolute;
}

.button_ss {
	padding:10px 0 0;
	text-align:center;
	font-size:25px;
}

.view_button {
	margin:0 0 0 0;
	padding:20px 0 15px 0;
	border-style:solid;
	border-width:3px;
	border-radius:25px;
	text-align:center;
	color:#FFEEAD;
	
}

 
.rowbordertj {
	padding:25px 0 0;
	text-align:center;
}
.rowbordertj2 {
	margin-top:30px;

}

.surfpic_text {

	color:#FFEEAD;
	font-size:25px;
	text-align:center;
	padding:30px 0 0;
}


.logo_index p {
	margin-top:15px;
	text-align:center;
	font-size:28px;
}
.stars {
	color:#FFEEAD;
}

.logo_msp_index {
	text-align:center;
}
.titel_h1 h1 {
	color:#FFEEAD;
	font-size:60px;
}
.logout {
	text-align:right;
}
.logout a {
	color:#D9534F;
}

.border_am {

	padding-top:15px;
	border-style:solid none none;
	border-width:3px;
	border-color:#FFEEAD;
	font-size:22px;
}
.dash_1 {
	color:dark-grey;
}
.wrapper {	
	padding:30px 0 0 0; 
}
.wrap_photos {
	margin:8px 0 8px;
	padding:10px 0 20px;
	border-style:solid none solid;
	border-color:white;
	border-width:1px;
}

.wrap_draft {
	background-color:#378285;
	border-radius:5px;
	padding:10px;
	text-align:justify;
	color:white;
}
.wrap_draft p {
	color:white;
}

.dash_1 h1 {
	color:#FFEEAD;
	font-size:65px;
	margin:10px 0 20px 0;
}


.dash_11 {
	padding:0 0 25px;
	text-align:center;
	line-height:15px;
}



.dash_buttons {
	padding:25px 0 25px;
}

.d_border {
	padding:5px 25px 20px;
	color:black;
	text-align:center;
}
.d_border h1 {
	color:#FFEEAD;
	font-size:65px;
}

.d_border p {
	font-size:20px;
}

.styling_d {
	text-align:center;
}
.styling_d h1 {
	color:#FFEEAD;
	margin-bottom:0;
}
.styling_b {
	margin-top:5px;
	padding:50px 25px 50px 25px;
	border-style:solid;
	border-width:3px;
	border-radius:20px;
	border-color: #FFEEAD;
}
.styling_b img {
	margin:auto;
	display:block;
	width:100%;	
}

.resp_img img {
	margin:auto;
	display:block;
	height:155px;	
}
.omzet-title {
	padding:25px;
	text-align:center;
	border-style:solid;
	border-width:1px;
	border-color: #FFEEAD;
	font-size:1.5em;
}
.omzet-prev-title {
	background-color:#378285;
	padding:25px;
	text-align:center;
	font-size:1.5em;
}
.month-style {
	padding:10px;
	border-style:solid;
	border-width:1px;
	border-radius:10px;
	border-color: #FFEEAD;
	text-align:center;
}
.styleOmzet {
	padding:20px;
	margin-bottom:10px;
	background-color:#378285;
	border-radius:20px;
	color:white;
	font-family: 'Fira Sans', sans-serif;
	font-size:18px;
}
.styleOmzet h2 {
	color:#FFEEAD;
}
.styleColOmzet {
	padding:10px 0 20px;
}
.totalOmzet {

	text-align:center;
	font-family:russo one;
	color:black;
}

.bgTotalOmz {
	padding:10px;

	color: #FFEEAD;
}
.bgTotalOmz h2 {
	color: black;
}

.row_border {
	margin-bottom:15px;
	border-style: none none solid;
	border-color: #FFEEAD;
	border-width: 3px;
}

.navbar-custom {
    background-color: #378285;

}
.navbar-custom a:hover {
    color: #FFEEAD;

}
.navbar-text {
	color:#FFEEAD;
}


.custom-toggler .navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255,238,173, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}
.custom-toggler.navbar-toggler {
  border-color:#FFEEAD;
} 

.index_title {
	margin:30px 0 50px 0;
	padding:10px 10px 10px 10px;
	color:#FFEEAD;
	font-size: 4vw;
}
.index_title h1{
	font-size: 8vw;
}

.date_text {
	margin:60px 0 25px 0;
	color:#212529;
	font-size:18px;
	text-align:justify;
}

.date_text_sm {
	margin-top:25px;
	padding:12px 0 1px 0;
	background-color:#FFEEAD;
	border-radius:15px;
	color:#212529;
	font-size:12px;
	text-align:center;
}
.date_text_sm a {
	color:#D9534F;
}


.indexWrapperDsktp {
	padding:50px 0 50px;
	font-size:20px;
}
.indexWrapperDsktp p {
	font-size:20px;
}

.purch_but {
	margin:20px 0 40px 0;
	text-align:left;
}

.purch_email {
	margin:50px 0 0 0;
	text-align:left;

	
}

.dash_sta {
	margin-top:20px;
	color:#FFEEAD;
	text-align:left;
	
}

.prijs_dash {
	padding:50px;
	border-style:solid;
	border-radius:20px;
	border-color:#FFEEAD;
	border-width:3px;
}


.prijs_dash_t h1 {
	margin-bottom:25px;
	color:#FFEEAD;
	font-size:50px;
}


.pricing_text {

	color:white;
	font-size:20px;
	text-align:center;
	
}

.pricing_text h1 {
	font-size:30px;
	color:#FFEEAD;
}

.pricing_text_mob {

	color:white;
	font-size:20px;
	text-align:center;
	
}

.pricing_text_mob h1 {
	font-size:30px;
	color:#FFEEAD;
}

.date_eye  {
	color:#FFEEAD;
}


.social_foot a {
	color:#6c757d;
}


.social_foot {
	line-height:0em;
}

.surfspot {
	background-color: #378285;
	border-radius: 5px;
	margin:5px;
	padding:12px 10px 1px 10px;
}

.mob_index_ss {
	background-color: #378285;
	border-radius: 5px;
	padding:10px;
	color:white;
	font-size:18px;
	margin-bottom:5px;
}




.index_dates {
	padding:0 15px 0;
	

}
.index_dates2 {
	margin:20px 0 35px;
	text-align:center;
	font-size:25px;
}

.index_wrappert {
	padding:0 0 25px 0;
	text-align:center;
	font-size:18px;
}




.orderbox {
	padding:10px 0 10px 0;
}

.orderbox img {
	margin:auto;
	display:block;
	width:100%;
}



.surfspot_titel {
	background-color: #96CEB4;
	color:#FFEEAD;
	padding:20px 20px 20px 20px;
	border-radius: 0px;
}

.ss_date_s {
	margin:50px 0 50px 0;
	border-style:solid none solid;
	border-color:#FFEEAD;
	border-width:3px;
	padding:20px 0 20px 0;
	font-size:25px;
	text-align:center;
}

.stext {
	
	text-align:right;
	font-size:20px;
}
.star_pic {
	padding:0 0 25px;
	color:#FFEEAD;
	text-align:center;
}

.productbox {
	position:relative;
	padding: 0 0 0;
}

.productbox img {
	margin:auto;
	display:block;
	width:100%;
}



.date_selecter {

	padding:0 0 20px 0;
	text-align:center;
	font-size:25px;
	color:#212529;
}

.stext_j {
	text-align: justify;
	padding:0 1px 5px 1px;
	font-size:20px;
	color:white;
}
.index_border {
	margin-top:30px;
	padding-bottom:0;

}



.insta {
	padding-top:50px;
	border-style:solid none none;
	border-width:3px;
	border-color:#FFEEAD;
	text-align:center;
	font-size:30px;
}

.insta_mob {
	padding-top:50px;
	text-align:center;
	font-size:30px;
}

.insta a {
	color:#FFEEAD;
}



.insta img {
	margin:auto;
	display:block;
	max-width:30px;
}

.random_pic {

	padding:75px 0 75px;
	


}
.indexTitleDsktp {
	margin-bottom:30px;
	padding-bottom:5px;
	border-style:none none solid;
	border-color:#FFEEAD;
	border-width:1px;
	color:#FFEEAD;
	text-align:center;
}
.indexTitleDsktp h1 {
	color:#FFEEAD;
	font-size:35px;
}

.random_pic1 img {
	margin:auto;
	display:block;
	width:100%;
}

.r_pic_mob img {
	margin:auto;
	display:block;
	width:100%;
}

.r_pic {
	position:relative;
	margin-top:20px;
	text-align:left;
	font-size:18px;
}
.r_pic a {
	color:#212529;
}


.pos_abs {
	position:absolute;
	margin:-10px -10px 0 0;
	padding:0 0 0 90%;
}
.order_s {
	font-size:20px;
	margin-top:20px;
	color:#212529;
}
.order_s h1 {
	font-size:25px;
	color:#FFEEAD;
}


}
.order_s h1 {
	color:#FFEEAD;
}

.order_t {
	border-style:none none solid;
	border-width:2px;
	border-color:#FFEEAD;
}

.index_s-ss {
	padding:25px 0 25px;
	border-style:solid;
	border-width:2px;
	border-radius:20px;
	border-color:#FFEEAD;
	margin-top:10px;
	color:#212529;
	text-align:center;
	font-size:20px;

}

.index_d-ss {
	padding:15px 0 10px;
	margin-bottom:10px;
	color:black;
	text-align:center;
	border-style:solid;
	border-width:2px;
	border-color:#FFEEAD;
}

.index_v-ss {
	padding:5px 0 5px;
	border-radius:20px;
	background-color:#378285;
	margin-top:5px;
	color:#212529;
	text-align:center;
	font-size:20px;
	line-height:1em;
}

.index_s-ss-nb {
	padding:50px 0 36px;
	margin-top:10px;
	color:black;
	text-align:center;
	font-size:20px;
	border-style:solid;
	border-width:2px;
	border-radius:20px;
	border-color:#FFEEAD;

}
.index_s-ss-nb h1 {
	font-size:25px;
}

.bordertj {
	margin-bottom:25px;
	border-style:none none solid;
	border-width:2px;

	border-color:#FFEEAD;


}
.bordertj_onder {

	border-style:none none solid;
	border-width:2px;

	border-color:#FFEEAD;


}
.bordertj_boven {
	margin-top:20px;
	border-style:solid none none;
	border-width:2px;
	border-color:#FFEEAD;


}

.download {
	margin:0 0 0 0;
	padding:2px;
	text-align:center;
}

.download a {
	
	font-size:30px;
	
}
.download img {
	margin:auto;
	display:block;
	width:100%;
}

.index_s-s {
	padding-top:20px;
	border-style:solid;
	border-radius:10px;
	border-color:#FFEEAD;
	border-width:1px;
	margin-top:5px;
	color:#212529;
	text-align:center;
	font-size:15px;

}
.index_flex {
	padding-top:20px;
	margin-top:5px;
	color:#212529;
	text-align:center;
	font-size:20px;

}
.index_flex h2 {
	color:#FFEEAD;
}
.index_s-s h2 {
	color:#FFEEAD;
}
.e_order {
	margin-top:5px;
	color:#212529;
	text-align:center;
	font-size:15px;
}

.index_s-ss img {
	max-width:30px;
}
.index_s-ss h1 {
	margin-top:10px;
	color:#212529;
	font-size:22px;
}
.index_date {
	margin:75px 0 75px 0;
	padding:20px 50px 20px 50px;
	text-align:center;
	color:dark-grey;
	font-size:25px;
	border-style:solid none  solid;
	border-color:#FFEEAD;
}
.link_dash {
	margin-top:25px;
}
.link_da {
	margin-top:45px;
	text-align:center;
}

.img_ss2 img {
	margin:auto;
	display:block;
	width:100%;
}

.index_surfspot {
	padding:30px;
	text-align:center;
}

.index_surfspot h1 {
	font-size:45px;
	color:#212529;
}
.pad_index_s {
	padding:50px 0 0 0;
	color:dark-grey;
	text-align:center;
	font-size:30px;
}
.pad_index_s img {
	max-width:50px;
}
.pad_index_s h1 {
	margin-top:20px;
	font-size:40px;
}
.pad_index_s_m {
	padding:10px 0 0 0;
	color:dark-grey;
	text-align:center;
	font-size:20px;
}
.pad_index_s_m img {
	max-width:35px;
}
.pad_index_s_m h1 {
	margin-top:20px;
	font-size:30px;
}
.pad_index_sd {
	margin:0 0 15px 0;
	padding:10px 0 0 0;
	color:#FFEEAD;
	border-style:solid;
	border-radius:10px;
	text-align:center;
	font-size:25px;
}
.pad_index_sd img {
	max-width:40px;
}
.pad_index_sd h1 {
	margin-top:20px;
}


.date_title p {
	color:#212529;
	font-size:25px;
}
.date_title a{
	color:#212529;
}
.date_title h1 {
	color:#FFEEAD;
	font-size:50px;
}

.JesterBox div 
{ 
visibility: hidden;
position: fixed;
top: 5%; right: 5%; bottom: 5%; left: 5%;
z-index: 75;
text-align: center;

display: flex;
justify-content: center;
align-items: center;
}

.JesterBox div:before
{
content: '';
position: fixed;
top: 0; right: 0; bottom: 0; left: 0;
z-index: 74;

background-color: rgba(0, 0, 0, 0);
transition: all 0.5s ease-out;
}

.JesterBox div img
{
position: relative;
z-index: 77;
max-width: 100%;
max-height: 100%;

margin-left: -9999px;
opacity: 0;
transition-property: all, opacity;
transition-duration: 0.5s, 0.2s;
transition-timing-function: ease-in-out, ease-out;
}

.JesterBox div:target { visibility: visible; }

.JesterBox div:target:before { background-color: rgba(0, 0, 0, 0.7); }

.JesterBox div:target img
{
margin-left: 0px;
opacity: 1;
}
.but_custom {
	background-color:transparent;
	border-color:#FFEEAD;
	color:white;
	width:95%;
}
.but_custom_dark {
	background-color:#378285;
	border-color:#FFEEAD;
	color:white;
	width:95%;
}
.btn.btn-primary.but_custom_dark_f {
	background-color:#378285;
	border-style:none;
	color:white;
	width:100%;
}
.btn.btn-primary.but_custom_light_f {
	background-color:#96CEB4;
	border-style:none;
	color:black;
	width:100%;
}
.btn.btn-primary.but_custom_dark_f[disabled] {
	background-color:grey;
}
.btn.btn-primary.but_custom_light_f[disabled] {
	background-color:grey;
}

.but_custom_small {
	background-color:transparent;
	border-color:#FFEEAD;
	color:white;
}

.dash_mob {
	padding-top:65px;
	padding-bottom:75px;
	text-align:center;
	color:#FFEEAD;
	font-size:19px;
}
.dash_mob h1 {
	color:#FFEEAD;
	font-size:45px;
}
.dash_mob p {
	font-size:19px;
	
}
.dash_mob_eo {
	text-align:center;
	font-size:19px;
	font-family: 'Fira Sans', sans-serif;
}
.dash_mob_eo h1 {
	color:#FFEEAD;
	font-size:45px;
}
.dash_mob_eo h2 {
	color:#FFEEAD;
	font-size:26px;
}

.dash_mob_np {
	text-align:center;
	color:#FFEEAD;
	font-size:19px;
}
.dash_mob_np h1 {
	color:#FFEEAD;
	font-size:45px;
}
.dash_mob_np p {
	font-size:19px;
	
}
.dash_mob_count {
	padding:10px 0 10px 0;
	border-style:solid;
	border-radius:10px;
	border-color:#FFEEAD;
	border-width:1px;
}

.dash_mob_npta {
	color:#FFEEAD;
	font-size:19px;
}
.dash_mob_npta h1 {
	color:#FFEEAD;
	font-size:45px;
}
.dash_mob_npta p {
	font-size:19px;
}

.index_wrap_date {
	background-color:#378285;
	border-radius:5px;
	padding:10px;
	color:white;
	font-size:20px;
}
.index_wrap_date p {
	font-size:20px;
	color:white;
}
.index_wrap_date h2 {
	color:#FFEEAD;
	font-size:30px;
}

.dividert {
	color:#FFEEAD;
}
.wrapper_ss_dsktp {
	padding:50px 0 100px;
}

.wrapper_ss_mob {
	padding:0 0 15px;
}

.content_ss_mob {
	color:#FFEEAD;
	text-align:right;
}
.content_ss_mob h1 {
	font-size:28px;
	padding-bottom:20px;
	text-align:left;
}
.content_ss_mob p {
	font-size:18px;
	text-align:justify;
}

.content_dsktp_mob {
	color:#FFEEAD;
	text-align:right;
}
.content_dsktp_mob h1 {
	font-size:38px;
	padding-bottom:0;
	text-align:left;
	color:#FFEEAD;
}

.content_dsktp_mob h2 {
	font-size:28px;
	padding-bottom:0;
	text-align:left;
	color:black;
}
.content_dsktp_mob p {
	font-size:20px;
	text-align:justify;
}
.content_dsktp_mob a {
	color:#FFEEAD;
}

#loader {
	position: absolute;
	left: 54%;
	top: 60%;
	z-index: 1;
	width: 120px;
	height: 120px;
	margin: -76px 0 0 -76px;
	border: 16px solid #f3f3f3;
	border-radius: 50%;
	border-top: 16px solid #3498db;
	-webkit-animation: spin 2s linear infinite;
	animation: spin 2s linear infinite;
}

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

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

#loadDiv {
	display: none;
}

.showPhotosSelector {
	margin-top:5px;
	margin-bottom:5px;
	padding:18px 10px 10px;
}
@keyframes slideInFromLeft {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(0);
  }
}
.aniLeft {  
  
  animation: 1s ease-in-out 0s 1 slideInFromLeft;
  
}
.styleTitleMob {
	margin-bottom:25px;
	text-align:center;
	color:#FFEEAD;
	border-style:none none solid;
	border-color:#FFEEAD;
	border-width:0.5px;
}
.styleTitleMob h1 {
	color:#FFEEAD;
	font-size:30px;
	padding-bottom:5px;
}

.wrapIndexMobTab {
	padding-top:25px;
}

.row-flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.contentFlex {
  height: 100%;
}

.contentFlexVert {
	margin: 0;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
.message-frame {
  position: fixed;
  bottom: 10px;
  left: 10px;
  width: 300px;
  height: 100px;
  background-color: rgba(80, 149, 41, 0.83);
  color: white;
  text-align: center;
  padding: 20px;
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 10px;
  z-index: 9999;
}
.message-frame .close-btn {
	position: absolute;
	top: 10px;
	right: 10px;
	background: none;
	border: none;
	color: white;
	font-size: 20px;
	cursor: pointer;
}