/* MEDIA QUERIES FOR RESPONSIVNES ON DIFFERENT DEVICES */

.section-marge{
    margin-top: 70px;
}
.div-margin{
    margin-bottom: 30px;
}
/*For data %, appply with JS*/
.positive{
    color:#4CAF50 ;
}
.negative{
    color:#F44336 ;
}
.triangle-up{
    border-bottom: 10px solid #4CAF50;
    border-right: 5px solid transparent;
    border-left: 5px solid transparent;
}
.triangle-down{
    border-top: 10px solid #F44336;
    border-right: 5px solid transparent;
    border-left: 5px solid transparent;
}
strong{
    color: var(--clr-info);
}


/* xs */
@media(min-width :475px){
    .container{
        max-width: 475px;
    }
   
}
/* s */
@media(min-width :640px){
    .container{
        max-width: 640px;
    } 
}
/* m */
@media(min-width :768px){
   .container{
        max-width: 768px;
    }
    .section-marge{
        margin-top: 4rem;
    }

}
/* l */
@media(min-width :1024px){
    .container{
        max-width: 1024px;
    }
    /* .section-marge{
        margin-top: 6rem;
    } */
    
    
}
/* xl */
@media(min-width :1280px){
    .container{
        max-width: 1280px;
    }
    body{
        font-size: var(--size-sm);
    }
}
/* 2xl */
@media(min-width :1536px){
    .container{
        max-width: 1536px;
    }
    
}

/* xs */
/* @media(min-width :475px){
 
} */
/* s */
/* @media(min-width :640px){
   
} */
/* m */
/* @media(min-width :768px){
 
} */
/* l */
/* @media(min-width :1024px){
   
} */
/* xl */
/* @media(min-width :1280px){

} */
/* 2xl */
/* @media(min-width :1536px){