.accordeon {
	margin-bottom: 15px;
	position: relative;
}


.accordeon article { margin-bottom: 10px; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out; }
	

.accordeon article aside { 
	display: none; 
	border: 1px solid #dddddd; 
	border-top: none; 
	padding: 15px 25px 25px; 
    background:#fff;
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
}
.accordeon article:after {
	content: '\e818';
	font-family: "egapark-icons";
	position: absolute;
	top:19px;
	right:20px;
	font-size: 30px;
	-webkit-transition: all 0.5s; 
    transition: all 0.5s;
	pointer-events: none;
    color:#fff;
}
.accordeon article.active:after {
	-moz-transform: rotate(180deg);
	-ms-transform: rotate(180deg);
	-o-transform: rotate(180deg);
	-webkit-transform: rotate(180deg);
	transform: rotate(180deg);
    color:#fff;
    transition: all 0.5s;
}

.accordeon article h4 { 
    color: #fff;
    margin-bottom: 0px;
    text-align: left;  
}
		
.accordeon article button { 
    padding: 1.1em 1.4em;
	width: 100%; 
	line-height: 38px; 
	margin-bottom: 0;
	cursor: pointer; 
	background: #df003a;
	-webkit-box-shadow: 2px 2px 3px -2px rgba(0, 0, 0, 0.4);
	box-shadow: 2px 2px 3px -2px rgba(0, 0, 0, 0.4);
	color: #fff;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
    transition: border-radius 0.8s ease-in-out;
    transition: color 0.3s ease-in-out;
    transition: background 0.5s ease-in-out;
    outline-offset: 3px;
    outline-color: rgba(223,0,58, 0.5);
    -moz-outline-radius: 0px;    
}

.accordeon article.active button {
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
    transition: border-radius 0.1s ease-in-out;
    transition: color 0.3s ease-in-out;
    transition: background 0.3s ease-in-out;
}

.accordeon article h3 { 
	font-size: 28px;
    line-height: 30px;
    margin-bottom: 15px;
	margin-top: 15px;
}	
		
			
	
					
					
@media screen and (max-width: 480px) {
	.accordeon article { margin-bottom: 6px; }
	.accordeon article button {  line-height: 30px; background-size: 30px 30px;  }
    .accordeon article:after {
      
        top:16px;
        right:20px;
        font-size: 30px;
   
    }
}					
			
			
@media screen and (max-width: 350px) {
	.accordeon article { margin-bottom: 4px; }
	.accordeon article button { line-height: 26px; background-size: 26px 26px;  }
    .accordeon article:after {
      
        top:13px;
        right:20px;
        font-size: 30px;
   
    }
}