@charset "UTF-8";
/* CSS Document */




/*Schriftart Ende */


  html {
    box-sizing: border-box;
  }
  *,*::before,*::after {
    box-sizing: inherit;
  }








.flexbox-scrolllinks{
	margin-top:10px;
	position:relative;	
	margin:auto;	
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;	
	flex-direction:row;
	flex-wrap: wrap;
    border: 0px solid #333;
	margin-bottom:5px;
	align-items: center;
	-ms-flex-pack: center;
    justify-content: space-around;	
}


.scrolllink-btn{	
	margin:10px;	
	height:100px;
	width:100px;
	cursor: pointer;
	text-align:center;	
	border: double 1.2px transparent;
	border-radius: 10px;
	background-image: linear-gradient(#FFFFFF, #FFFFFF), radial-gradient(circle at top left, #37F19E, #37F19E);	
	background-origin: border-box;
	background-clip: content-box, border-box;
	transition: all 0.3s ease-out;	
}


.scrolllink-btn:hover{
	background-image: radial-gradient(circle at top left,#000000, #000000), radial-gradient(circle at top left, #000000, #000000);	
	transition: all 0.3s ease-out;	
	box-shadow: rgba(57,241,159, 1.0) 2px 2px, rgba(122,245,190, 0.7) 4px 4px, rgba(174,249,216, 0.5) 6px 6px, rgba(207,252,232, 0.5) 8px 8px, rgba(233,253,244, 0.5) 10px 10px;
}




.scrolllink-btn-text{	
	font-family: 'Mainfont-Bold';	
	font-size:13px;
	color:#101010;
}

.scrolllink-btn:hover .scrolllink-btn-text{
	transition: all 0.3s ease-out;
	color:#FAFAFA;
}




.scrolllink-btn svg{	
	fill: #303030;
	pointer-events: auto;
	transition: all 0.3s ease-out
}

.scrolllink-btn:hover svg{
	fill: #FAFAFA;
	transition: all 0.3s ease-out;
}








.accordion-wrapper {	
    border-radius: 15px;
    overflow: hidden;
    box-shadow: 0 4px 2px -2px rgba(50, 50, 50, 0.5);
    width: 100%;
    margin:0 auto;
	margin-top:20px;
	margin-bottom:60px;
}

.accordion {
    width: 100%;
    color: white;
    overflow: hidden;
    margin-bottom: 16px;	
}


.accordion:last-child{
    margin-bottom: 0;
}


.accordion-label {
    display: flex;
    -webkit-box-pack: justify;
    justify-content: space-between;
    padding: 18px;
    background: rgba(240,240,240,.99);
	color:#101010;
    font-family: 'Mainfont-Bold';
    cursor: pointer;
    font-size: 17px;
	transform-origin: center center;
}

.accordion-label:hover {
    background: rgba(220,220,220,1);
	color:#101010;
	transition: 0.3s;
}



.accordion-label::after {
    content: "\276F";
    width: 16px;
    height: 16px;	
	margin-top:-1px;	
    text-align: center;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;	
}


.accordion-content {
    max-height: 0;
    padding: 0 16px;
    color: rgba(0,0,0,1);
    background: white;
    -webkit-transition: all 0.0s;
    transition: all 0.0s;
}


.accordion-content p{
    margin: 0;
    color: rgba(0,0,0,.99);
    font-size: 18px;
}


input:checked + .accordion-label {
    background: rgba(0,0,0,1);
	transform-origin: center center;
	color:#FFFFFF;
}


input:checked + .accordion-label::after {	
	margin-top:3px;	
   -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
}


input:checked ~ .accordion-content {    
	max-height: none;
    padding: 16px;
}








.scroll-to-category{
	position: absolute;	
	margin-top:-50px;
	right: 0px;			
	margin-right: 20px;
	margin-bottom: 30px;	
}


.scroll-to-category > button{
	background-color: #FFFFFF;
	border: 0px solid #333;
	cursor: pointer;
	font-size:16px;
	color: #101010;
}


.scroll-to-category > button:hover{
	color:#707070;	
}

















/*Tablet View*/
@media (min-width: 768px){	



.flexbox-scrolllinks{
	margin-top:15px;
    justify-content: space-around;	
}



.scrolllink-btn{
	border: double 2px transparent;
	border-radius: 15px;
	height:130px;
	width:130px;
}


.scrolllink-btn-text{	
	font-family: 'Mainfont-Bold';	
	font-size:15px;	
}


.scrolllink-btn:hover{
	box-shadow: rgba(57,241,159, 1.0) 3px 3px, rgba(122,245,190, 0.7) 6px 6px, rgba(174,249,216, 0.5) 9px 9px, rgba(207,252,232, 0.5) 12px 12px, rgba(233,253,244, 0.5) 15px 15px;
}


.accordion-wrapper {	
    border-radius: 20px;
}


.accordion-label {    
    font-size: 18px;
}
	


}





/*Desktop View*/

@media (min-width: 1024px){		
	
.scrolllink-btn{	
	border: double 2px transparent;
	border-radius: 18px;
	height:150px;
	width:150px;
}


.scrolllink-btn-text{
	margin-top: 0px;
	font-family: 'Mainfont-Bold';	
	font-size:17px;	
}	


.scrolllink-btn:hover{
	box-shadow: rgba(57,241,159, 1.0) 5px 5px, rgba(122,245,190, 0.7) 10px 10px, rgba(174,249,216, 0.5) 15px 15px, rgba(207,252,232, 0.5) 20px 20px, rgba(233,253,244, 0.5) 25px 25px;
}


	

.accordion-wrapper {	
    border-radius: 25px;
}


.accordion-label {    
    font-size: 19px;
}


	
	
}