/* ======================================================
BASE TYPOGRAPHY
====================================================== */

html{
font-size:1.35rem;
line-height:1.35rem;
}

body{
font-family:"new-atten-round",sans-serif;
font-weight:300;
font-style:normal;
background:#ffffff;
}

h1,h2,h3,h4,h5,h6,
.h1,.h2,.h3,.h4,.h5,.h6{
font-family:"new-atten-round",sans-serif;
font-weight:300;
font-style:normal;
}

strong,.strong,bold,.bold{
font-weight: 700;
}

p{
margin-top:0;
margin-bottom:0.5rem;
}


/* ======================================================
GTRANSLATE
====================================================== */

.gtranslate_wrapper img,
.goog-te-gadget img {
    width: 20px !important;
    height: auto !important;
}

.gtranslate_wrapper a {
    margin-right: 10px;
    display: inline-block;
}

/* ======================================================
HEADER
====================================================== */

#sp-header{
box-shadow:0 0 0px rgba(50,32,32,0.0);
}

#sp-header .sp-module{
margin-left:0;
}

#sp-header.header-with-modal-menu a{
color:#252525;
}

#sp-header.header-with-modal-menu .sp-contact-info > li{
opacity:1;
}

/* ======================================================
FOOTER
====================================================== */

#sp-bottom {
  padding: 0px;
  font-size: inherit;
  line-height: inherit;
}


/* ======================================================
BTN secondary
====================================================== */


.btn-secondary{
background:#000000 !important;
border-color:#000000 !important;
color:#ffffff !important;
}

.btn-secondary:hover{
background:#D7742C !important;
border-color:#D7742C !important;
color:#ffffff !important;
}

.btn-secondary:focus,
.btn-secondary:active{
background:#D7742C !important;
border-color:#D7742C !important;
color:#ffffff !important;
box-shadow:none !important;
}


/* ======================================================
joomla artikel blog
====================================================== */


.article-details .article-header h1, .article-details .article-header h2, .article-details .article-header h4 {
  font-size: 2rem;
	line-height: 2.1rem;
}

/* ======================================================
MENU
====================================================== */

.sp-megamenu-parent > li > a,
.sp-megamenu-parent > li > span{
font-size:inherit;
}

#modal-menu{
background:#f4f4f4;
}

#modal-menu ul.sp-megamenu-parent > li > a,
#modal-menu ul.sp-megamenu-parent > li > span{
font-size:26px;
font-weight:inherit;
line-height:1rem;
}

#modal-menu ul.sp-megamenu-parent > li:not(:last-child){
margin-bottom:20px;
}

#modal-menu ul.sp-megamenu-parent .sp-dropdown .sp-dropdown-inner{
padding:0;
background:#ffffff;
}

#modal-menu ul.sp-megamenu-parent .sp-dropdown .sp-dropdown-inner ul > li > a{
font-weight:inherit !important;
font-size:26px !important;
padding-top:21px;
}

.sp-megamenu-parent .sp-dropdown li.sp-menu-item{
margin-top:-24px;
	margin-bottom: 10px;
}

.sp-megamenu-parent .sp-dropdown li.sp-menu-item > a,
.sp-megamenu-parent .sp-dropdown li.sp-menu-item span:not(.sp-menu-badge){
padding:0;
}


/* ======================================================
TABLE RESPONSIVE
====================================================== */

.responsive-table th{
hyphens:auto;
word-break:break-word;
}

.responsive-table td,
.responsive-table th{
padding-top:1rem;
padding-bottom:1rem;
}

@media (max-width:768px){

.responsive-table thead{
display:none;
}

.responsive-table tr{
display:block;
border:1px solid #dee2e6;
margin-bottom:1rem;
}

.responsive-table td{
display:grid;
grid-template-columns:minmax(140px,45%) 1fr;
gap:1rem;
align-items:start;
text-align:left;
padding:1rem;
border-bottom:1px solid #dee2e6;
}

.responsive-table td:last-child{
border-bottom:none;
}

.responsive-table td::before{
content:attr(data-label);
font-weight:600;
hyphens:auto;
word-break:break-word;
}

}


/* ======================================================
FLOATING ADDON
====================================================== */

.floating-addon{
position:fixed;
top:30%;
right:10px;
transform:translateY(-50%);
display:flex;
flex-direction:column;
gap:8px;
z-index:1000;
transition:opacity .5s,transform .5s;
opacity:0;
pointer-events:none;
}

.floating-addon.visible{
opacity:1;
pointer-events:auto;
}


/* BUTTON */

.addon-button{
text-decoration:none;
border:none;
background:none;
cursor:pointer;
display:flex;
justify-content:flex-end;
align-items:center;
}


/* CONTAINER */

.addon-content{
display:flex;
align-items:center;
justify-content:flex-end;
height:60px;
min-width:60px;
background:#000000;
border-radius:30px;
position:relative;
transition:background .4s,width .4s,padding .4s;
padding:0;
overflow:visible;
}


/* ICON */

.icon-wrapper{
width:60px;
height:60px;
border-radius:50%;
display:flex;
align-items:center;
justify-content:center;
flex-shrink:0;
}

.icon-wrapper img{
width:28px;
height:28px;
object-fit:contain;
}


/* TEXT */

.addon-text{
opacity:0;
max-width:0;
margin-right:0;
overflow:hidden;
white-space:nowrap;
color:#ffffff;
font-size:1rem;
font-weight:500;
transition:opacity .4s,max-width .4s,margin-right .4s;
display:flex;
align-items:center;
}


/* HOVER */

.addon-button:hover .addon-content,
.addon-button.active .addon-content{
background:#d7742c;
min-width:190px;
padding-left:18px;
}

.addon-button:hover .addon-text,
.addon-button.active .addon-text{
opacity:1;
max-width:140px;
margin-right:16px;
}


/* SCROLL ANIMATION */

.hidden{
opacity:0;
transform:translateY(20px);
transition:opacity .6s,transform .6s;
}

.visible{
opacity:1;
transform:translateY(0);
}

.com-users-login__remember, .com-users-login__remind, .plg_system_webauthn_login_button, .com-users-login__reset, .mod-login-logout__login-greeting {
	display: none;
}



/* MOBILE */

@media (max-width:768px){

.floating-addon{
display:none;
}

}