/* *** Header *** */

.header_bar, .header_bar_placeholder
{
	height: 60px;
}

.header_name, .header_name:visited, .header_name:active, .header_name:hover
{
	text-decoration: none;
	margin-right: 20px;
	line-height: 60px;
	color: #FFFFFF;
}

.header_name:active, .header_name:hover
{
	text-decoration: underline;
}

.header_credits, .header_credits:visited, .header_credits:active, .header_credits:hover
{
	text-decoration: none;
	line-height: 60px;
	color: #FFFF00;
	font-weight: bold;
}

.header_credits img
{
	width: 16px;
	height: 16px;
	margin-top: 22px;
}

.header_credits:active, .header_credits:hover
{
	text-decoration: underline;
}

.header_bar
{
	position: fixed;
	background-color: #3a838c;
	color: #FFFFFF;
	z-index: 1000;
	
	width: 100%;
}

#header_reviews
{
	height: 60px;
	line-height: 20px;
	overflow: hidden;
	padding-top: 0px;
	padding-bottom: 0px;
	padding-right: 50px;
}

#text-rotator
{
	position: relative;
	height: 22px;
	overflow: hidden;
	height: 60px;	
}

#text-rotator span
{
	display: flex;
	align-items: center; 	
	height: 60px;
	position: absolute;
	left: 0;
	top: 0;
	opacity: 0;
	transition: opacity 1s ease-in-out;
	width: 100%;
}

#text-rotator span.active
{
	opacity: 1;
}	

#text-rotator span b
{
	color: #FFFF00;
}

#dd_lan
{
	margin-top: 12px;
	
}

.dd_lan_li, .dd_lan_li:active, .dd_lan_li:visited, .dd_lan_li:hover
{
	background-color: #FFFFFF;
	border-radius: 10px;
	margin-left: 10px;
	height: 35px !important;
}

.dd_lan_li:visited, .dd_lan_li:hover
{
	background-color: #efefef;
	color: #3a838c !important;
}

.dd_lan_li a:visited, .dd_lan_li a:hover
{
	color: #3a838c !important;
}

.dd_lan_li > .menu_item, .dd_lan_li > .menu_item_sub, .dd_lan_li > .menu_item_sub:hover, .dd_lan_li > .menu_item_sub_selected
{
	line-height: 15px !important;
	width: auto;
}

.dd_lan_li > .menu_item_sub_selected
{
	background-color: #FFFFFF !important;
	border-bottom-left-radius: 0px !important;
	border-bottom-right-radius: 0px !important;

}

#mmenu99, #mmenu99:visited, #mmenu99:active, #mmenu99:hover
{
	background-color: #FFFFFF !important;
	color: #3a838c !important;
	border-radius: 10px;
	color: #3a838c !important;
	background-image: url('../images/icons/headerbar_lan.png'); background-repeat: no-repeat; background-position: 0px 0px;
	padding-left: 30px;
	padding-right: 0px;
	
	width: 40px !important;
	
}

#mmenu99:active, #mmenu99:hover
{
	background-color: #efefef !important;
}

#menu99
{
	width: 70px !important;
	background-color: #efefef !important;
	color: #3a838c !important;
	
	border-radius: 10px !important;
	border-top-left-radius: 0px !important;
	border-top-right-radius: 0px !important;	
}

#menu99 a, #menu99 a:visited, #menu99 a:active, #menu99 a:hover
{
	width: 60px !important;
	min-width: 60px !important;
	color: #3a838c !important;

	padding-right: 0px !important;
}


.header
{
	
}

.header_div
{
	
}

.header_table
{
	display: table;
}
.header_tr
{
	display: table-row;
}
.header_td_logo, .header_td_menu
{
	display: table-cell;
	height: 97px;
	vertical-align: middle;
}

.header_td_logo
{
	padding-right: 40px;
}

.header_teaser
{
	background-color: #3a838c;
	background-image: url('../images/layout/bg_home.jpg'); background-repeat: repeat-x; background-position: center top;
	background-attachment: fixed;

	width: 100%;
	height: 385px;
}

.header_teaser_sub
{
	background-color: #3a838c;
	background-image: url('../images/layout/bg_home.jpg');
	background-repeat: repeat-x;
	background-position: center 60px;
	
	background-attachment: fixed;
		
	width: 100%;
	height: 285px;
}

.header_teaser_div
{
	padding-top: 30px;
}

.header_teaser_stats, .header_op_stats
{
	float: right;
	border-left: 1px solid #FFFFFF;
	padding-left: 20px;
	padding-top: 10px;
	padding-bottom: 0px;
	color: #FFFFFF;
	width: 210px;
	height: 315px;
	
	text-shadow: 0px 0px 3px rgba(0, 0, 0, 0.65);
}

.header_op_stats
{
	width: 270px;
	height: 347px;
}

.header_teaser_stats b, .header_op_stats b
{
	color: #ffff00;
}

.header_teaser_stats_stars
{
	margin-bottom: 10px;
}

.header_op_stats_stars
{
	padding-bottom: 10px;
}

.header_op_stats_stars_div
{
	padding-bottom: 12px;
}

.header_op_stats_stars img
{
	width: 167px;
	height: 35px;
}

.header_teaser_info, .header_op_info
{
	border: 1px solid #FFFFFF;
	border-radius: 10px;
	padding: 20px;
	padding-top: 10px;
	padding-bottom: 0px;
	
	width: 400px;
	height: 315px;
	
	font-size: 14px;
	line-height: 20px;
	color: #FFFFFF;
	text-shadow: 0px 0px 3px rgba(0, 0, 0, 0.65);
}

.header_op_info
{
	width: 50%;
	padding: 20px;
	overflow: auto;
}

.full_span_teaser_info
{
	background-image: url('../images/layout/bg_dark.png');
	
	border: 1px solid #FFFFFF;
	border-radius: 10px;
	padding: 20px;
	padding-top: 10px;
	
	width: 400px;
	
	font-size: 14px;
	line-height: 20px;
	color: #FFFFFF;
	text-shadow: 0px 0px 3px rgba(0, 0, 0, 0.95);
	
	margin: 0px auto;
}

.header_teaser_info b, .header_op_info b, .header_teaser_info strong, .header_op_info strong
{
	color: #ffff00;
	font-style: italic;
}


.circled-list
{
	list-style: none;
	counter-reset: step;
	padding-left: 0;
	margin-bottom: 30px;
	margin-top: -20px;
}

.circled-list li
{
	counter-increment: step;
	position: relative;
	padding-left: 3rem;
	margin: 1rem 0;
	margin-bottom: 10px;
	padding-top: 0px;
	
}

.circled-list li b
{
	color: #FFFF00;
}

.circled-list li::before 
{
	content: counter(step);
	position: absolute;
	left: 0;
	top: 0.1em;
	
	width: 2rem;
	height: 2rem;
	line-height: 2rem;
	
	border-radius: 50%;
	border: 2px solid #FFFF00;
	color: #FFFF00;
	
	text-align: center;
	font-weight: 600;
	font-size: 0.95rem;
}



#dd_menu > li > .menu_item, #dd_menu > li > .menu_item:visited, #dd_menu > li > .menu_item:active,
#dd_menu > li > .menu_item_selected, #dd_menu > li > .menu_item_selected:visited, #dd_menu > li > .menu_item_selected:active, #dd_menu > li > .menu_item_selected:hover,
#dd_menu > li > .menu_item_sub, #dd_menu > li > .menu_item_sub:visited, #dd_menu > li > .menu_item_sub:active,
#dd_menu > li > .menu_item_sub_selected, #dd_menu > li > .menu_item_sub_selected:visited, #dd_menu > li > .menu_item_sub_selected:active
{
	border: 1px solid #ffffff;
	border-radius: 10px;
	line-height: 16px;
	padding-left: 14px;
	padding-right: 14px;
	padding-top: 8px;
	padding-bottom: 8px;
	margin-left: 20px;
}

#dd_menu > li > .menu_item:active, #dd_menu > li > .menu_item:hover, #dd_menu > li > .menu_item_selected, #dd_menu > li > .menu_item_selected:visited, #dd_menu > li > .menu_item_selected:active, #dd_menu > li > .menu_item_selected:hover
{
	color: #3a838c;
	border: 1px solid #3a838c;
}

.menu_item_hamburger, .menu_item_hamburger:visited, .menu_item_hamburger:active, .menu_item_hamburger:hover
{
	padding-left: 36px !important;
	border-radius: 10px;
}

.menu_item_hamburger, .menu_item_hamburger:visited
{
	border: 1px solid #FFFFFF;
}

.menu_item_hamburger:active, .menu_item_hamburger:hover
{
	border: 1px solid #3a838c !important;
}

.menu_div
{
	display: inline-block;
}

.logo
{
	display: block;
	
	background-image: url('../images/layout/logo.png'); background-repeat: no-repeat; background-position: left top;
	
	width: 235px;
	height: 37px;
}



/* *** Slideshow *** */
.slideshow
{

}

.slideshow_div
{
	min-height: 392px;
}

/* *** Full width slideshow *** 
.slideshow_div
{
	width: 100%;
}
*/

/* *** Restrict height slideshow *** 
.camera_wrap
{
	max-height: 400px !important;
}
*/




/* *** Verschillende constructies van main deel (=onder menu/slideshow) van website *** */
.main
{
	outline: none;
	padding-top: 40px;
}

.main_div
{
	/* min-height: 260px; */
}

.main_cols
{
	display: table;
}

.main_cols_tr
{
	display: table-row;
}

.main_cols_content
{
	display: table-cell;
	width: 50%;

	padding-right: 20px;
	border-right: 1px solid #333;
}

.main_cols_sidebar
{
	display: table-cell;
	width: 50%;
	padding-left: 20px;
}

.full_span
{
	background-image: url('../images/layout/bg_full_span.jpg');
	background-size: cover;
	background-position: center;
	background-attachment: fixed;	
	padding-bottom: 10px;
}

.tweeluik_table
{
	display: table;
}

.tweeluik
{
	display: table-cell;
	border-width: 1px;
	width: 50%;
	border-radius: 10px;
}

.tweeluik_marge
{
	display: table-cell;

}

.tweeluik_static_sidebar_left
{
	display: block;
	border-width: 1px;
	width: 640px;
	border-radius: 10px;
	margin: 0px auto;
}

.tweeluik_static_sidebar_right
{
	display: table-cell;
	border-width: 0px;
	width: 240px;
}

.static_sidebar, .static_sidebar_fixed
{
	width: 198px;
	border-width: 1px;
}

.static_sidebar_fixed
{
	position: fixed;
	top: 100px;
}

.drieluik
{
	text-align: center;
}

.drieluik_bg_color
{
	padding-top: 0px; 
	padding-bottom: 0px;
}

.drieluik_1, .drieluik_2, .drieluik_3
{
	display: inline-block;
	width: 300px;
	text-align: center;
}

.drieluik_1 img, .drieluik_2 img, .drieluik_3 img
{
	display: block;
	width: 300px;
	border-radius: 10px;
}


/* *** Horizontal scroller *** */
.horizontal_scroller
{
	width: 100%;
	overflow: auto;
}

.horizontal_scroller_left, .horizontal_scroller_left:visited,
.horizontal_scroller_right, .horizontal_scroller_right:visited
{
	position: absolute;
	z-index: 100;
	display: inline-block;

	width: 40px;
	margin-top: 160px;

	line-height: 40px;
	
	text-decoration: none;	
	text-align: center;
}

.horizontal_scroller_left
{
	
}

.horizontal_scroller_right
{
	margin-left: 940px;
}

/* *** Extra grote schermen: left/right buiten de 980px breedte plaatsen: cool! *** */
@media only screen and (min-width:1100px) 
{
	.horizontal_scroller_left
	{
		margin-left: -50px;
	}
		
	.horizontal_scroller_right
	{
		margin-left: 990px;
	}
}
	

/* *** Sidebar *** */
.sidebar_movie
{
		
}

.sidebar_movie video
{
	max-width: 100%;
}

.sidebar_news_a, .sidebar_news_a:visited, .sidebar_news_a:active
{
	display: block;
		
	text-decoration: none;
}

.sidebar_news_a b
{
	display: block;
	text-decoration: underline;	
}

.sidebar_news_a:hover b
{

}
	
.sidebar_images
{
		
}

.sidebar_images a, .sidebar_images a:visited, .sidebar_images a:active
{
	display: inline-block;
	
	margin-bottom: 5px;	
	border-width: 4px;
}

.sidebar_images a:hover
{

}

.sidebar_images a, .sidebar_images img
{
	width: 85px;
	height: 85px;
}

.sidebar_a, .sidebar_a:visited, .sidebar_a:active
{

}


/* *** News *** */
.news
{
	display: table;
	text-decoration: none;
	margin-bottom: 20px;
}

.news_tr
{
	display: table-row;
}

.news_img
{
	display: table-cell;
	padding-right: 0px;
	padding-top: 25px;
	
}

.news_img img
{
	width: 135px;
	height: 90px;
	padding-right: 25px;
}

.news_text
{
	display: table-cell;	
}

.news_date
{
	font-size: 10px; 
	opacity: 0.5;
}

.news:active .news_img img, .news:hover .news_img img
{
	width: 150px;
	height: 100px;
	padding-right: 10px;

	transition: width 250ms ease-in-out, height 250ms ease-in-out, padding-right 250ms ease-in-out;
}

.news:active, .news:hover
{
	transition: color 250ms ease-in-out;
}


/* *** Miscellaneous *** */
.avatar_table
{
	display: table;
}

.avatar_tr
{
	display: table-row;
}

.avatar_td
{
	display: table-cell;
}

.avatar_td:first-child
{
	padding-right: 15px;
}

.avatar
{
	border-radius: 50px;
}

.green
{
	background-color: #00FF00 !important;
	color: #00FF00 !important;
}

.paginatie
{
	text-align: center;
}

.paginatie a, .paginatie span
{
	text-decoration: none;
	padding: 10px;
	padding-top: 5px;
	padding-bottom: 5px;
}

.paginatie_prev_disabled, .paginatie_next_disabled
{
	opacity: 0.5;
}

.paginatie_nr_selected, .paginatie_nr_selected:active, .paginatie_nr_selected:visited, .paginatie_nr_selected:hover
{
	font-weight: normal;
	border-radius: 10px;
	margin-right: 2px;
	margin-left: 2px;
}

.paginatie_nr
{
	margin-right: 2px;
	margin-left: 2px;
}

.account_status_flag
{
	display: inline-block;
	padding: 5px;


	color: #FFFFFF;
	font-size: 14px;
	font-weight: bold;
	line-height: 14px;
	
	text-align: center;
	
	float: right;
}

.reseller_account
{

}

.admin_account
{

}

.link_pdf, .link_pdf:visited, .link_pdf:active, .link_pdf:hover,
.link_youtube, .link_youtube:visited, .link_youtube:active, .link_youtube:hover
{
	display: table-cell;
	vertical-align: middle;
	
	background-image: url('../images/extensies/pdf.png'); background-repeat: no-repeat; background-position: left top;
	
	text-decoration: none;
	padding-left: 60px;
	height: 50px;
}

.link_youtube, .link_youtube:visited, .link_youtube:active, .link_youtube:hover
{
	background-image: url('../images/extensies/youtube.png');
}

.youtube
{

}

.youtube_iframe
{
	background-image: url('../images/icons/youtube_play_button.png'); background-repeat: no-repeat; background-position: center center;
	background-color: #3a838c;
	
	/*width: 470px; height: 300px; */
	
	width: 100%;
	height: 325px;	
}

.icon_question, .icon_question:visited, .icon_question:active, .icon_question:hover
{
	background-image: url('../images/icons/question.png'); background-repeat: no-repeat; background-position: left center;
	display: inline-block;
	text-decoration: none;
	width: 16px;
	
}


/* *** Footer *** */
.footer
{
	font-size: 14px;
	line-height: 20px;
}

.footer_div
{
	display: table;
}

.footer_td1, .footer_td2
{
	display: table-cell;

	font-size: 14px;
	line-height: 20px;
}

.footer_td2
{
	text-align: right;
}

.footer a, .footer a:visited, .footer a:active
{	

}

.footer a:hover
{
	opacity: 1;
}

.share_images img
{
	margin-bottom: 3px;
}

.sitemap, .landingspages
{
	display: table;
}

.landingspages
{
	margin: 0px auto;
	
}

.landingspages_sub, .landingspages_sub a, .landingspages_sub a:visited
{
	color: #787878;
}



.sitemap_sub, .landingspages_sub
{
	display: table-cell;
	padding-left: 40px;
}

.sitemap_sub:first-child, .landingspages_sub:first-child
{
	padding-left: 0px;
}


/* *** Form *** */
.captcha
{
	background-color: #efefef;
	
	display: inline-block;
	
	width: 377px;
	max-width: calc(100% - 20px);
	
	padding: 10px;
	padding-right: 0px;
}

.area .captcha
{
	background-image: url('../images/layout/bg_light.png'); 
}

.captcha_div
{
	display: table-cell;
	vertical-align: middle;
	padding-right: 10px;
}

.form_input_captcha
{
	width: 55px;
	text-align: center;
	line-height: 25px;
	border-width: 1px;
}

.form_input, .form_select, .form_textarea, .form_input_captcha
{
	color: #3a838c;
	font-size: 16px;
}

.form_input, .form_textarea, .form_select
{
	padding: 10px;	
	margin-bottom: 5px;
	border-width: 1px;
}


select {
  height: 44px;
  padding: 0 12px;
  font-size: 16px;
  line-height: 16px;
  border: 1px solid #ccc;
  border-radius: 10px;
  box-sizing: border-box;
}

select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;

  background-color: white;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 10 6' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23666' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 10px center;
  background-size: 10px 6px;

  padding-right: 32px; /* space for arrow */
}


.form_input, .form_textarea
{
	width: 375px;
	max-width: calc(100% - 20px);
}

.form_textarea
{
	height: 100px;
}

.form_input_medium
{
	width: 210px;
}

.form_input_kort
{
	width: 135px;
}

.form_input_mini
{
	width: 65px;
}

.ster
{
	
}

.button, .button:visited, 
.button_alt, .button_alt:visited,
.button_disabled
{
	display: inline-block;
	font-weight: bold;
	padding: 6px;
	padding-left: 19px;
	padding-right: 19px;
	border: 1px solid #3a838c;
	
	margin-bottom: 5px;

	text-align: center;
	text-decoration: none;
	
}

.button::first-letter, .button_alt::first-letter, .button_disabled::first-letter
{
	text-transform: uppercase;
}


.button:hover, .button:active,
.button_alt:hover, .button_alt:active,
.area .button_alt, .area .button_disabled
{
	background-image: url('../images/layout/bg_light.png'); 
}

.button_alt, .button_alt:visited
{
	background-color: transparent !important;
	font-weight: normal;
	color: #3a838c !important;
}

.button_alt:active, .button_alt:hover
{
	background-color: #3a838c !important;
	font-weight: normal;
	color: #FFFFFF !important;

}

.button_disabled
{
	opacity: 0.5;
}

.button_winkelwagen, .button_winkelwagen:hover
{
	background-image: url('../images/icons/cart_hamburger.png'); background-repeat: no-repeat; background-position: 5px 15px !important;
	padding-left: 35px !important;
}

.x_button, .x_button:visited
{
	display: inline-block;
	
	width: 30px;
	height: 30px;
	
	line-height: 30px;
	text-align: center;

	text-decoration: none;
	
	float: right; 
	
	margin-left: 20px;
}

.x_button:hover, .x_button:active
{
	background-image: url('../images/layout/bg_light.png'); 
}

.input_aantal
{
	display: table;
}

.input_aantal_minus, .input_aantal_plus
{
	display: table-cell;
	background-repeat: no-repeat; background-position: center center;
	background-color: #ffcccc;

	border-width: 1px;

	min-width: 24px;	
}

.input_aantal_minus
{
	background-image: url('../images/icons/input_aantal_minus.png');
	
	border-right-width: 0px;
		
	-webkit-border-top-right-radius: 0px;
	-webkit-border-bottom-right-radius: 0px;
	-moz-border-radius-topright: 0px;
	-moz-border-radius-bottomright: 0px;
	border-top-right-radius: 0px;
	border-bottom-right-radius: 0px;
	
}

.input_aantal_plus
{
	background-image: url('../images/icons/input_aantal_plus.png');
	
	border-left-width: 0px;	
		
	-webkit-border-top-left-radius: 0px;
	-webkit-border-bottom-left-radius: 0px;
	-moz-border-radius-topleft: 0px;
	-moz-border-radius-bottomleft: 0px;
	border-top-left-radius: 0px;
	border-bottom-left-radius: 0px;
}

.input_aantal_aantal
{
	display: table-cell;

	border-width: 1px;
}

.input_aantal_aantal input
{
	width: 35px;
	height: 44px;
	
	text-align: center;
	line-height: 44px;
	
	margin: 0px;
	padding: 0px;
	border: 0px;
}


#cookie
{
	display: none;
	position: fixed;
	bottom: 10px;
	left: 10px;
	padding: 10px;
	
	background-color: #DDDDDD;
	border: 1px solid #3a838c;
	border-radius: 10px;
}


a.skip-main
{
	left:-999px;
	position:absolute;
	top:auto;
	width:1px;
	height:1px;
	overflow:hidden;
	z-index:-999;
}

a.skip-main:focus, a.skip-main:active
{
	color: #fff;

	left: auto;
	top: auto;
	width: 30%;
	height: auto;
	overflow:auto;
	margin: 10px 35%;
	padding:5px;

	border: 4px solid white;
	text-align:center;
	font-size:1.2em;
	z-index: 999;
}


/* *** Op *** */
#home_tabs_select
{
	display: none;
	padding-bottom: 15px;
}

.ops
{
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 20px;
  
	font-size: 0px;
	margin-bottom: 15px;	
}

.op, .op:visited, .op:active, .op:hover
{
	display: inline-block;
  
	background-color: #efefef;
	width: 254px;
	height: 330px;
	border-radius: 10px;
	
	text-decoration: none;
	
	color: #3a838c;
	
	/*margin-right: 20px;
	margin-bottom: 20px;*/
}


.op:active, .op:hover
{
	box-shadow: 0 0 2px rgba(58, 131, 140, 1);
}

/*
.op:nth-child(5n)
{
	margin-right: 0px;
}
*/

.op_stars
{
	position: absolute;
	margin-left: 9px;
	margin-top: 9px;
}

.op_stars img
{
	width: 80px;
}

.op_status
{
	position: absolute;
	margin-left: 188px;
	margin-top: 8px;

	width: 58px;
	text-align: center;
	color: #FFFFFF;
	font-weight: bold;
	font-size: 10px;
	line-height: 18px;
	border-radius: 5px;
	
	background-color: #3a838c;
}

.busy .op_status
{
	background-color: #ff0000;
}

.busy .op_button_chat, .busy .op_button_chat:visited, .busy .op_button_chat:active, .busy .op_button_chat:hover,
.offline .op_button_chat, .offline .op_button_chat:visited, .offline .op_button_chat:active, .offline .op_button_chat:hover
{
	background-color: transparent !important;
	border: 1px solid #3a838c !important;
	color: #3a838c !important;
	opacity: 0.5;
}

.offline .op_status
{
	background-color: #222222;
}

.busy .op_avatar
{
	filter: grayscale(100%);
	opacity: 0.5;
}

.offline .op_avatar
{
	filter: grayscale(100%);
	opacity: 0.5;
}

.op_avatar
{
	position: absolute;
	margin-left: 52px;
	margin-top: 27px;
}

.op_avatar img
{
	width: 150px;
	height: 150px;	
	border-radius: 150px;
	
	box-shadow: 0 0 6px rgba(255, 255, 255, 1), 0 0 16px rgba(255, 255, 255, 1), 0 0 32px rgba(255, 255, 255, 1);	
}

.op_name
{
	position: absolute;
	margin-left: 0px;
	margin-top: 190px;
	
	width: 254px;
	text-align: center;
	font-size: 22px;
	font-weight: bold;
	
}

.op_specialisation
{
	position: absolute;
	margin-left: 0px;
	margin-top: 213px;
	
	width: 254px;
	text-align: center;
	font-size: 12px;
	font-weight: bold;
	text-transform: uppercase;
	
}

.op_desc
{
	position: absolute;
	margin-left: 10px;
	margin-top: 240px;
	
	width: 234px;
	height: 35px;
	
	text-align: center;
	font-size: 14px;
	line-height: 18px;
	font-style: italic;
	overflow: hidden;
}

.op_desc_scroll
{	
	animation: bounce-scroll 6s ease-in-out infinite;
	
}

@keyframes bounce-scroll {
  0%   { transform: translateY(0); }
  50%  { transform: translateY(-60%); }
  100% { transform: translateY(0); }
}


.op_button_chat, .op_button_chat:visited,
.op_button_info, .op_button_info:visited
{
	position: absolute;
	margin-left: 10px;
	margin-top: 286px;
	
	width: 109px;
	height: 31px;
	
	text-align: center;
	font-size: 16px;
	line-height: 31px;

	border: 1px solid #3a838c;
	border-radius: 10px;

}

.op_button_info
{
	margin-left: 131px;
}

.op_button_chat:active, .op_button_chat:hover,
.op_button_info:active, .op_button_info:hover
{
	background-color: #3a838c;
	color: #efefef;

}

/* *** Bedankjes *** */
.thanks
{
	font-size: 0px;
	margin-bottom: 15px;
}


.thank, .thank:visited, .thank:active, .thank:hover,
.thank_full, .thank_full:visited, .thank_full:active, .thank_full:hover
{
	display: inline-block;

	border: 1px solid #3a838c;
	width: 252px;
	height: 230px;
	border-radius: 10px;
	
	text-decoration: none;
	
	color: #3a838c;
	
	margin-right: 20px;
	margin-bottom: 20px;
}

.thank:nth-child(5n), .thank_full:nth-child(5n)
{
	margin-right: 0px;
}


.thank_avatar
{
	position: absolute;
	margin-left: 11px;
	margin-top: 14px;
	
}

.thank_avatar img
{
	width: 35px;
	height: 35px;	
	border-radius: 35px;
	
}

.thank_user
{
	position: absolute;
	margin-left: 56px;
	margin-top: 10px;
	
	width: 180px;
	text-align: left;
	font-size: 14px;	
}

.thank_op
{
	position: absolute;
	margin-left: 56px;
	margin-top: 28px;
	
	width: 180px;
	text-align: left;
	font-size: 14px;
	font-weight: bold;
	
}

.thank_x, .thank_x:visited, .thank_x:active, .thank_x:hover
{
	position: absolute;
	display: block;
	font-size: 16px;
	line-height: 36px;
	width: 36px;
	border-radius: 36px;
	background-color: #FF0000;
	color: #FFFFFF;
	font-weight: bold;
	text-decoration: none;
	text-align: center;
	
	margin-left: 223px;
	margin-top: -8px;
	
}

.thank_x:active, .thank_x:hover
{
	background-color: #FF6666;
	color: #FFFFFF;
}


.thank_op a, .thank_op a:visited, .thank_op a:active, .thank_op a:hover
{
	text-decoration: none;
}

.thank_desc
{
	position: absolute;
	margin-left: 10px;
	margin-top: 62px;
	
	width: 232px;
	text-align: left;
	font-size: 16px;
	line-height: 20px;
	height: 121px;
	overflow: auto;
}

.thank_stars
{
	position: absolute;
	margin-left: 9px;
	margin-top: 192px;
}

.thank_stars img
{
	width: 110px;
}

.thank_stars_desc
{
	position: absolute;
	margin-left: 126px;
	margin-top: 194px;
	
	text-align: left;
	font-size: 14px;
	font-weight: bold;
	
}

#desc
{
	width: 258px; 
	height: 110px;
}

.blogs
{
	font-size: 0px;
	margin-bottom: 15px;
}


.blog, .blog:visited, .blog:active, .blog:hover,
.blog_full, .blog_full:visited, .blog_full:active, .blog_full:hover
{
	display: inline-block;

	width: 252px;
	height: 230px;
	border-radius: 10px;
	
	text-decoration: none;
	
	background-color: #efefef;
	color: #3a838c;
	
	margin-right: 20px;
	margin-bottom: 20px;
}

.blog:active, .blog:hover,
.blog_full:active, .blog_full:hover
{
	box-shadow: 0 0 2px rgba(58, 131, 140, 1);
}


.blog:nth-child(5n), .blog_full:nth-child(5n)
{
	margin-right: 0px;
}

.blog_img
{
	position: absolute;
	margin-left: 0px;
	margin-top: 0px;
}

.blog_img img
{
	width: 252px;
	height: 175px;
	border-top-left-radius: 9px;
	border-top-right-radius: 9px;
}

.blog_title
{
	position: absolute;
	margin-left: 10px;
	margin-top: 182px;
	
	width: 220px;
	text-align: left;
	font-size: 16px;	
	
	line-height: 20px;
}

.blog_item_img
{
	float: right;
	margin-left: 20px;
	margin-bottom: 20px;
}

.home_info_box
{
	background-color: #efefef;
	border-radius: 10px;
	
	margin-bottom: 20px;
	
	font-size: 14px;
	line-height: 20px;
	
	min-height: 387px;
}

.home_info_box_img
{
	float: right;
	margin-left: 20px;
}

.home_info_box_div
{
	padding: 20px;
}

.facebook, .facebook:visited, .facebook:active, .facebook:hover
{
	background-image: url('../images/icons/facebook.png'); background-repeat: no-repeat; background-position: 0px 0px;
	display: inline-block;
	line-height: 32px;
	padding-left: 38px;
	font-weight: bold;
	color: #305891;
	text-decoration: none;
	border-radius: 100px;
	padding-right: 10px;
}

.facebook:active, .facebook:hover
{
	background-color: #305891;
	color: #FFFFFF;

}

.webdesign
{
	display: inline-block;
	margin: 0px auto;
	font-size: 12px;
	color: #AAAAAA;
}

.header_op
{
	background-image: url('../images/layout/bg_full_span.jpg');
	background-size: cover;
	background-position: center;
	background-attachment: fixed;
	
	height: 385px;
	
}

.header_op_img_2
{
	height: auto; 
	padding-bottom: 40px;
}

.header_op_buttons
{
	padding-top: 40px;
}

.header_op_link_back, .header_op_link_back:visited, .header_op_link_back:active, .header_op_link_back:hover,
.header_op_link_prev, .header_op_link_prev:visited, .header_op_link_prev:active, .header_op_link_prev:hover,
.header_op_link_next, .header_op_link_next:visited, .header_op_link_next:active, .header_op_link_next:hover
{
	background-image: url('../images/layout/bg_dark.png');
	display: inline-block;
	border: 1px solid #FFFFFF;
	border-radius: 10px;
	color: #FFFFFF;
	text-decoration: none;
	padding-left: 10px;
	padding-right: 10px;
	line-height: 33px;
	margin-left: 10px;
}

.header_op_link_back, .header_op_link_back:visited, .header_op_link_back:active, .header_op_link_back:hover { margin-left: 0px; }
.header_op_link_prev, .header_op_link_prev:visited, .header_op_link_prev:active, .header_op_link_prev:hover { padding-left: 5px; }
.header_op_link_next, .header_op_link_next:visited, .header_op_link_next:active, .header_op_link_next:hover { padding-right: 5px; }

.header_op_link_back:active, .header_op_link_back:hover,
.header_op_link_prev:active, .header_op_link_prev:hover,
.header_op_link_next:active, .header_op_link_next:hover
{
	border: 1px solid #FFFF00;
	color: #FFFF00;
}

.header_op_link_back
{
	float: left;
}

.header_op_link_prev, .header_op_link_next
{
	float: right;
}

.header_op_link_prev img, .header_op_link_next img
{
	border-radius: 100px;
	width: 27px;
	height: 27px;
	margin-top: 3px;
}

.header_op_top
{
	text-align: center;
}

.header_op_avatar
{
	position: absolute;
	border-radius: 200px;
	
	width: 344px;
	height: 344px;
	margin-left: -182px;
	margin-top: -250px;
	
	border: 15px solid #FFFFFF;
	
	box-shadow: 0 0 26px rgba(255, 255, 255, 1), 0 0 36px rgba(255, 255, 255, 1), 0 0 62px rgba(255, 255, 255, 1);	
}

#header_op_status
{
	position: absolute;
	display: inline-block;
	background-color: #3a838c;
	
	width: 116px;
	border-radius: 20px;
	border: 2px solid #FFFFFF;
	text-align: center;
	font-size: 20px;
	font-weight: bold;
	line-height: 36px;
	color: #FFFFFF;
	margin-left: -58px;
	margin-top: 80px;
}

#header_op_status.offline { background-color: #222222; }
#header_op_status.busy { background-color: #FF0000; }

.header_op_top_left
{
	position: absolute;
	display: inline-block;
	width: 310px;
	
	text-align: right;
	margin-left: -485px;
	margin-top: 30px;
	
		
}

.header_op_top_right
{
	position: absolute;
	display: inline-block;
	width: 310px;
	
	text-align: left;
	margin-left: 180px;
	margin-top: 30px;
	
		
}

.header_op_top_left b, .header_op_top_right b
{
	background-color: #efefef;
	color: #3a838c;
	padding-left: 5px;
	padding-right: 5px;
	border-radius: 5px;
	line-height: 23px;
}

.header_op_stars
{
	padding-top: 130px;
	padding-bottom: 10px;
	text-align: center;
	
}

.header_op_title
{
	text-align: center;
	padding-bottom: 10px;
}

.header_op_title h1
{
	font-size: 60px;
	font-weight: bold;
	line-height: 60px;
	
}

.header_op_specialisation
{
	font-size: 24px;
	font-weight: bold;
	text-transform: uppercase;
	padding-bottom: 20px;
}

.header_op_slogan
{
	font-size: 24px;
	font-style: italic;
	padding-bottom: 20px;
}

.header_op_buttons_chat, .header_op_buttons_chat:visited
{
	display: inline-block;
	width: 200px;
	
	border-radius: 15px;
	padding: 10px;
	padding-left: 25px;
	padding-right: 25px;
	
	font-size: 20px;
	font-weight: bold;
	text-decoration: none;
	background-color:  #3a838c;
	color: #FFFFFF;
	text-align: center;
	
	border: 2px solid #FFFFFF;      
	/* box-shadow: 0 0 0 2px #3a838c; */
	
}

.header_op_buttons_chat:active, .header_op_buttons_chat:hover
{
	background-image: url('../images/layout/bg_light.png');
	color: #FFFF00;
	border: 2px solid #FFFF00; 
	
}	
.header_op_buttons_chat:hover > .header_op_buttons_chat_icon
{
	background-image: url('../images/icons/chat_hover.png');
}

.header_op_buttons_chat_icon
{
	display: inline-block;
	width: 31px;
	height: 24px;
	background-image: url('../images/icons/chat.png'); background-repeat: no-repeat; background-position: 0px 0px;
	
}

.header_op_buttons_chat_ani
{
	position: relative;
	border-radius: 16px;
	overflow: hidden;
	display: inline-block;
	place-items: center;
	background: #efefef;
	padding: 2px;
	
	box-shadow: 0 0 0 2px #efefef;
}

/* spinning gradient layer */
.header_op_buttons_chat_ani::before {

  content: "";
  position: absolute;
  inset: 0;
  background: conic-gradient(
    #efefef,
    #3a838c,
    #efefef,
    #3a838c,
    #efefef
  );

  transform-origin: 50% 50%;
  transform: rotate(0deg);
  animation: spin 2s linear infinite;
  
}

/* content stays above */
.header_op_buttons_chat_ani span {
  position: relative;
  z-index: 1;
}

@keyframes spin {
  to { transform: rotate(360deg);}
}

.header_op_chat
{
	text-align: center;	
	padding-bottom: 20px;
}

.header_op_chat .button, .header_op_chat .button_disabled
{
	margin-top: 7px;
}

.credit, .credit_white, .credit_yellow
{
	display: inline-block;
	background-image: url('../images/icons/credit.png'); background-repeat: no-repeat; background-position: 0px bottom;
	width: 16px;
	height: 18px;
	

}

.credit_white { background-image: url('../images/icons/credit_white.png'); }
.credit_yellow { background-image: url('../images/icons/credit_yellow.png'); }


.split_left, .split_right
{
	display: inline-block;
	
	background-color: #efefef;
	padding: 20px;
	border-radius: 10px;
	margin-bottom: 20px;
	
	width: calc(50% - 10px - 20px - 20px);
	
	height: 270px;
	overflow: auto;
}

.split_left
{
	margin-right: 10px;
}

.split_right
{
	margin-left: 10px;
}

.credits, .credits:visited, .credits:active, .credits:hover
{
	display: inline-block;
	background-color: #FFFFFF;
	
	width: 225px;
	height: 270px;
	
	border-radius: 10px;
	
	text-decoration: none;
	padding: 15px;
	
	margin: 10px;

	color: #3a838c;
}

.credits:active, .credits:hover
{
	box-shadow: 0 0 2px rgba(58, 131, 140, 1);
}

.credits:active > .credits_button, .credits:hover > .credits_button
{
	background-color: #3a838c;
	color: #FFFFFF;
}

.credits_title
{
	font-size: 22px;
}

.credits_img
{
	padding-bottom: 10px;
}

.credits_amount
{
	padding-bottom: 15px;
}

.credits_price
{
	font-size: 36px;
	font-weight: bold;
	padding-bottom: 7px;
}

.credits_price_sub
{
	color: #969696;
	font-size: 12px;
	font-weight: bold;	
	padding-bottom: 15px;
}

.credits_button
{
	border: 1px solid #3a838c;
	padding: 5px;
	border-radius: 10px;
}

.credits_valuta, .credits_valuta:visited, .credits_valuta:active, .credits_valuta:hover,
.credits_valuta_selected, .credits_valuta_selected:visited, .credits_valuta_selected:active, .credits_valuta_selected:hover
{
	background-color: #efefef;
	color: #969696;
	border: 1px solid #969696;
	
	display: inline-block;
	line-height: 36px;
	width: 36px;
	text-align: center;
	text-decoration: none;
	
	border-radius: 10px;
	font-weight: bold;
	font-size: 20px;
}

.credits_valuta:active, .credits_valuta:hover
{
	border: 1px solid #000000;
	color: #000000;
}

.credits_valuta_selected, .credits_valuta_selected:visited, .credits_valuta_selected:active, .credits_valuta_selected:hover
{
	background-color: #969696;
	color: #efefef;
}

#credits_sub
{
	color: #969696;
	font-size: 14px;
	font-style: italic;
	padding-top: 10px;
	padding-bottom: 20px;
	display: none;
}



.settings, .settings:visited, .settings:active, .settings:hover
{
	display: inline-block;
	background-color: #FFFFFF;
	
	width: 225px;
	height: 205px;
	
	border-radius: 10px;
	
	text-decoration: none;
	padding: 10px;
	
	margin: 10px;
	color: #3a838c;
}

.settings:active, .settings:hover
{
	box-shadow: 0 0 2px rgba(58, 131, 140, 1);
}


.settings_img
{
	padding-bottom: 10px;
}

.settings_img img
{
	width: 85px;
	height: 85px;
}

.settings_title
{
	font-weight: bold;
	padding-bottom: 5px;
}

.icon_link_del, .icon_link_info
{
	display: inline-block;
	background-image: url('../images/icons/delete.png'); background-repeat: no-repeat; background-position: 0px 0px;
	
	padding-left: 34px;
	
	min-height: 28px;
	line-height: 28px;
	
	margin: 10px;
	font-weight: bold;
}

.icon_link_info
{
	background-image: url('../images/icons/info.png');
}

.will_be_checked
{
	display: block;
	font-size: 12px;
	background-color: #3a838c;
	color: #FFFFFF;

	text-align: center;
	line-height: 16px;
	margin-bottom: 2px;
	border-radius: 10px;
}

.chat
{
	padding-top: 30px;
	padding-bottom: 30px;

}

.chat_op
{
	display: inline-block;
	background-color: #FFFFFF;
	border-radius: 10px;
	font-weight: bold;	
	line-height: 36px;
	padding-right: 10px;
	margin-left: 10px;
}

.chat_op img
{
	border-radius: 60px;
	width: 60px;
	height: 60px;
	border: 5px solid #FFFFFF;
	margin-left: -10px;
	
	margin-top: -18px;
	margin-bottom: -18px;
}

.chat_op span
{
	font-weight: normal;
	color: #969696;
}

.button_credits, .button_credits:visited, .button_credits:active, .button_credits:hover
{
	display: inline-block;
	font-weight: bold;
	padding: 7px;
	padding-left: 20px;
	padding-right: 20px;
	
	margin-bottom: 5px;

	text-align: center;
	text-decoration: none;
	border-radius: 10px;
	
	margin-right: 10px;
	background-color: #FFFFFF;
	
	color: #3a838c;
}

.chat_header
{
	min-height: 65px;
}

#chat_div
{
	background-image: url('../images/layout/bg_light_2.png');
	padding: 20px;
	border-radius: 10px;
	overflow: auto;

	scrollbar-width: thin; /* Firefox */
	scrollbar-color: rgba(255,255,255,.8) transparent;
}

#chat_div::-webkit-scrollbar, .thank_desc::-webkit-scrollbar
{
	width: 6px;
}

#chat_div::-webkit-scrollbar-track, .thank_desc::-webkit-scrollbar-track
{
	background: transparent;
}

#chat_div::-webkit-scrollbar-thumb, .thank_desc::-webkit-scrollbar-thumb
{
	background-color: rgba(255,255,255,0.65);
	border-radius: 999px;
	transition: background-color .2s ease;
}

#chat_div::-webkit-scrollbar-thumb:hover, .thank_desc::-webkit-scrollbar-thumb:hover
{
	background-color: rgba(255,255,255,0.95);
}

#chat_input_div
{
	background-color: #FFFFFF;
	border-radius: 10px;
	
	height: 40px;
	padding: 15px;
	padding-right: 10px;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 5px;
	margin-top: 15px;
}

#chat_input
{
	width: calc(100% - 140px);
	height: 40px;
	border-radius: 5px;
	padding-left: 10px;
	padding-right: 10px;
	
	font-size: 20px;
}

#chat_button
{
	display: inline-block;
	font-weight: bold;
	padding: 9px;
	padding-left: 15px;
	padding-right: 15px;
	margin-top: -1px;
	text-align: center;
	text-decoration: none;
	border-radius: 10px;
	
	background-color: #3a838c !important;
	
	color: #FFFFFF;
	width: 80px;
	
	float: right;
}

#chat_button:active, #chat_button:hover
{
	background-image: url('../images/layout/bg_light.png'); 
}

.chat_msg
{
	background-image: url('../images/layout/bg_light_2.png');
	/* background-color: #FFFFFF; */
	border-radius: 10px;
	margin: 0px auto;
	max-width: 675px;
	padding: 20px;
}

.message_system
{
	background-image: url('../images/icons/ai.png'); background-repeat: no-repeat; background-position: 0px 0px;
	
	text-align: center;
	font-size: 14px;
	text-align: center;
	color: #989898;
	width: fit-content;
	padding-bottom: 15px;
	margin: 0px auto;
	padding-left: 24px;
}

.message_you
{
	background-repeat: no-repeat, no-repeat;
	background-position: 0px 0px, 40px 0px;
	background-size: 40px 40px, 12px 38px;
	
	padding-left: 50px;
	max-width: 70%;
	
	margin-bottom: 15px;
	
	width: fit-content;
}

.message_you_div
{	
	
	background-color: #FFFFFF;
	border-radius: 10px;
	padding: 10px;
}

.message_me
{
	background-repeat: no-repeat, no-repeat;
	background-position: right 0px, right 0px;
	background-size: 40px 40px, 50px 38px;
	
	padding-right: 50px;
	max-width: 70%;
	
	margin-left: auto;
	margin-bottom: 15px;
	
	width: fit-content;
}

.message_me_div
{	
	
	background-color: #FFFFFF;
	color: #989898;
	border-radius: 10px;
	padding: 10px;
}

.flash {

  animation: flashFade 1.2s ease-in-out infinite;
}

@keyframes flashFade {
  0%   { opacity: 1; }
  50%  { opacity: 0.5; }
  100% { opacity: 1; }
}

.home_tabs
{
	padding-bottom: 15px;
}

.home_tab_selected, .home_tab_selected:visited, .home_tab_selected:active, .home_tab_selected:hover,
.home_tab, .home_tab:visited, .home_tab:active, .home_tab:hover
{
	background-color: #FFFFFF;
	display: inline-block;
	border: 1px solid #3a838c;
	padding-left: 10px;
	padding-right: 10px;
	border-radius: 10px;
	line-height: 32px;
	text-decoration: none;
	color: #3a838c;
	margin-right: 1px;
}

.home_tab, .home_tab:visited, .home_tab:active, .home_tab:hover
{
	border: 1px solid #FFFFFF;
}

.home_tab:active, .home_tab:hover
{
	border: 1px solid #3a838c;
}



.border-anim
{
	display: inline-block !important;
	width: 280px;
	
	margin-left: -2px;
	padding: 2px;
	border-radius: 12px;
	background: linear-gradient(270deg, #FFFFFF, #74bcc5, #FFFFFF);
	background-size: 600% 600%;
	animation: gradientMove 2s ease infinite;
	
}

.border-anim-gone
{
	margin-left: -2px;
	padding: 2px;
	border-radius: 12px;
}


@keyframes gradientMove {
  0% { background-position: 0% 100%; }
  50% { background-position: 100% 00%; }
  100% { background-position: 0% 100%; }
}

.currency_usd, .currency_gbp
{
	display: none;
}

/*
.currency_eur.hide, .currency_usd.hide, .currency_gbp.hide, .hide
{
	display: none !important;
}
*/

.dots
{
	display: inline-block;
}

.dots span
{
	opacity: 0.2;
	animation: wave 1.2s infinite ease-in-out;
}

.dots span:nth-child(1) { animation-delay: 0s; }
.dots span:nth-child(2) { animation-delay: 0.2s; }
.dots span:nth-child(3) { animation-delay: 0.4s; }

@keyframes wave
{
	0%, 100% { opacity: 0.2; }
	50% { opacity: 1; }
}

.settings_flash
{
	animation: backgroundFlash 1.2s infinite ease-in-out;
}

@keyframes backgroundFlash
{
	0%, 100% { background-color: #FFFFFF; }
	50% { background-color: #FFFF00; }
}

#chat_history_link
{
	background-image: url('../images/icons/settings_3_small.png'); background-repeat: no-repeat; background-position: 0px 0px;

	display: block;
	padding-bottom: 20px;
	padding-left: 29px;
	text-decoration: none;
	
}

.flashyText {

  background: linear-gradient(90deg, #DDDDDD, #3a838c, #DDDDDD);
  background-size: 300% 300%;

  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;

  animation: gradientMove 3s ease infinite;
}

@keyframes gradientMove {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}


.flashyText2 {

  background: linear-gradient(45deg, #DDDDDD, #3a838c, #DDDDDD);
  background-size: 400% 400%;

  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;

  animation: waveMove 5s ease infinite;
}

@keyframes waveMove {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}




.fun-pop {
  display: inline-block;
  animation: shakeSoft 3s ease-in-out infinite;
}

@keyframes shakeSoft {
  0%, 90%, 100% {
    transform: translateX(0);
  }
  92% { transform: translateX(-2px); }
  94% { transform: translateX(2px); }
  96% { transform: translateX(-2px); }
  98% { transform: translateX(2px); }
}

.error_box
{
	display: inline-block;
	background-color: #FF0000;
	color: #FFFFFF;
	border-radius: 10px;
	padding: 10px;
	font-weight: bold;
}


.box_50_left, .box_50_right
{
	display: inline-block;
	border: 1px solid #3a838c;
	border-radius: 10px;
	padding: 20px;
	height: 150px;
	
	width: calc(50% - 40px - 2px - 10px);
}

.box_50_left
{
	margin-right: 10px;
}

.box_50_right
{
	margin-left: 10px;
}

.flex_container
{
	display: flex;
	gap: 20px;
	margin-bottom: 20px;
}

.flex_box
{
	flex: 1;                
	border: 1px solid #3a838c;
	border-radius: 10px;
	padding: 20px;
	box-sizing: border-box; 
}

.large_number
{
	font-size: 20px;
	margin-bottom: 2px;
}

.large_number b
{
	float: right;
}

.stats_info_box_item
{
	padding-bottom: 5px;
}

.stats_info_box_item span
{
	float: right;
}


.stats_info_box
{
	background-color: #efefef;
	border-radius: 10px;
	padding: 15px;
	padding-top: 10px;
	padding-bottom: 5px;
	margin-top: 5px;
	
	font-size: 14px;
}
	
.toggle-link {
  position: relative;
  padding-left: 30px;
  text-decoration: none;
  
}

/* Circle */
.toggle-link::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 18px;
  height: 18px;
  border: 2px solid #3a838c;
  border-radius: 50%;
}

/* Plus / Minus */
.toggle-link::after {
  content: "+";
  position: absolute;
  left: 0;
  top: 50%;
  width: 18px;
  height: 18px;
  transform: translateY(-50%);
  display: flex;
  align-items: center !important;
  text-align: center;
  justify-content: center;
  text-indent: 4px;
  font-weight: bold;
  font-size: 14px;
}

/* Active state (minus) */
.toggle-link.active::after {
  content: "−";
  text-indent: -3px;
}	

.toggle-link::after {
  transition: transform 0.2s ease;
}

.toggle-link.active::after {
  transform: translateY(-50%) rotate(180deg);
}



.sparkle {
  width: 16px;
  height: 16px;
  background: #9dc1c6;
  clip-path: polygon(
    50% 0%,
    65% 35%,
    100% 50%,
    65% 65%,
    50% 100%,
    35% 65%,
    0% 50%,
    35% 35%
  );
  position: absolute;

  animation: twinkle 2s infinite ease-in-out;
}

@keyframes twinkle {
  0% {
    transform: scale(0.2) rotate(0deg);
    opacity: 0;
  }
  50% {
    transform: scale(1) rotate(45deg);
    opacity: 1;
  }
  100% {
    transform: scale(0.2) rotate(90deg);
    opacity: 0;
  }
}

.sparkle-container {
  position: relative;
  width: 100%;
  height: 100px;
 /* overflow: hidden;*/
  margin: 0px auto;

}
