<script>
var toggleBtn = document.getElementsByClassName('toggleBtn');
for (var i = 0; i < toggleBtn.length; i++){
toggleBtn[i].addEventListener('click', toggleContent.bind(null, toggleBtn[i].target));
}
function toggleContent(target){
toggleContentDisplayNone()
var content = document.getElementById(target);
if(content.style.display === 'none'){
content.style.display = 'block';
}
}
function toggleContentDisplayNone(){
var contents = document.getElementsByClassName('cloak')
for(var i = 0; i < contents.length; i++){
contents[i].style.display = 'none';
}
}
</script>
<style>
.customBtn {
border-radius:8px;
display:inline-block;
cursor:pointer;
color:#ffffff !important;
font-size:16px;
font-weight:bold;
padding: 8px 32px;
text-decoration:none;
margin: 1px;
width: 530px;
min-width: 50%;
max-width: 600px;
text-decoration: none;
}
.customBtn:active {
position:relative;
top:1px;
}
.btnAzul{
background-color:#609af7;
}
.btnAzul:hover {
background-color:#4d84db;
text-decoration: none;
}
.btnVerde{
background-color:#38d161;
}
.btnVerde:hover {
background-color: #31b754;
text-decoration: none;
} </style> |