/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 10 nov. 2020, 12:31:10
    Author     : franc
*/

/* BODY & HTML */

html{
    font-family: 'Lato', sans-serif;
    /* background: linear-gradient(#4e367d, black) no-repeat; */
    min-height:100%;
    height:auto;
}
body{
    background: transparent;
    /* fill:#9A0089;*/
}



/* Classe des types d'éléments */

.elmt_type{
    font-weight:100!important;
    transform:skewX(-15deg);
    box-shadow:6px 6px 0px #000;
}

/* rollSkater */ .elmt_type1{ background-color:#9A0089!important; }
/* athletiSkater */ .elmt_type2{ background-color:#0c0c61!important;}
/* Topskater */ .elmt_type3{ background-color:#ffb100!important;}
/* Elastiskater */ .elmt_type4{ background-color:#1ba1e2!important;}
/* Jumpskater */ .elmt_type5{ background-color:#00c300!important;}
/* Danceskater */ .elmt_type6{ background-color:#ff0084!important;}
/* Spinnerskater */ .elmt_type7{ background-color:#ff5200!important;}

/* rollSkater */ .elmt_text1{ fill:#9A0089!important; }
/* athletiSkater */ .elmt_text2{ fill:#0c0c61!important;}
/* Topskater */ .elmt_text3{ fill:#f39c12!important;}
/* Elastiskater */ .elmt_text4{ fill:#1ba1e2!important;}
/* Jumpskater */ .elmt_text5{ fill:#00c300!important;}
/* Danceskater */ .elmt_text6{ fill:#ff0084!important;}
/* Spinnerskater */ .elmt_text7{ fill:#ff5200!important;}

.icon-play{
    background-image: url('../public/icons/play-fill.svg');
    background-repeat: no-repeat;
    background-size: cover;
    height:45px;
    width:45px;
}

.f1{filter: invert(14%) sepia(54%) saturate(3762%) hue-rotate(288deg) brightness(116%) contrast(149%);}
.f2{filter: invert(20%) sepia(92%) saturate(1364%) hue-rotate(223deg) brightness(90%) contrast(90%);}
.f3{filter: invert(66%) sepia(65%) saturate(2166%) hue-rotate(356deg) brightness(101%) contrast(91%);}
.f4{filter: invert(53%) sepia(89%) saturate(1503%) hue-rotate(166deg) brightness(92%) contrast(91%);}
.f5{filter: invert(39%) sepia(94%) saturate(1469%) hue-rotate(91deg) brightness(104%) contrast(115%);}
.f6{filter: invert(23%) sepia(94%) saturate(6905%) hue-rotate(320deg) brightness(97%) contrast(109%);}
.f7{filter: invert(50%) sepia(88%) saturate(5568%) hue-rotate(3deg) brightness(107%) contrast(102%);}

.bg-image {
    background-image: url('../public/img/logo_blanc.png') ;
    background-size: cover;
    background-position: center center;
}

.badge-class{
    background:linear-gradient(#660240, #cf103c) no-repeat;
    color:white;
    box-shadow : 0 3px 20px;
}

.thumb-post img{
    object-fit: none; /* Do not scale the image */
    object-position: center; /* Center the image within the element */
    width: 150px;
    height: 150px;
    margin-bottom: 1rem;

}


.bouton-unora
{
    background: -webkit-linear-gradient(right,#ba164b,#8d0e66,#5e10a5);
    border:0;
}

h1{
    width:100%;
    color:white;
}

.table-100{
    width:100%;
}

#table_id thead>tr{
    background-color: #43a6da;
    color: white;
}

#table_id_info{
    color:white;
}

.txt-sur-image {
    margin: -50px 10px 20px; 
    position: relative;
    height:50px;
    font-size: 50px;
    font-weight: bold;
    font-family: Rubik ;
}

.txt-sur-image-droite {
    margin: -25px 10px 0px; 
    position: relative;
    font-size: 15px;
    font-weight: bold;
    font-family: open sans ;
}

.border-1 {
    border-width:1px !important;
}
.border-2 {
    border-width:2px !important;
}
.border-3 {
    border-width:3px !important;
}
.border-4 {
    border-width:4px !important;
}
.border-5 {
    border-width:5px !important;
}


.bg-grey{
    background-color:#bbb;
}

.desactive{
    opacity:0.2;
}
.termine{
    filter: invert(0.9) drop-shadow(0px 0px 3px #ecf0f1);
    
}

.achat{
    opacity:0.7;
    filter: invert(0.9) drop-shadow(0px 0px 7px #ecf0f1) ;
}


a{
    color:white;   
}

.fill-blanc{
    color:white;
}
.fill-jaune{
    color:yellow;
}
.fill-orange{
    color:#e67e22;
}

.fill-green{
    color:#009900;
}

.fill-opacity{
    color:white;
    opacity:0.3;
}


.custom-file-input ~ .custom-file-label:lang(fr)::after {
    content: "Parcourir";
}


.img-trans{
    opacity:0.85;
}

/* bienvenue*/
.CommType0{
    background-color:#8e44ad;
}
/* connexion */
.CommType1{
    background-color:#7f8c8d;
}
/* réalisation*/
.CommType2{
    background-color:#2980b9;
}
/* Séance réalisée */
.CommType14{
    background-color:#2980b9;
}
/* validation*/
.CommType3{
    background-color:#27ae60;
}
/* validation Séance*/
.CommType15{
    background-color:#27ae60;
}
/* badge*/
.CommType4{
    background-color:#16a085;
}
/* Level*/
.CommType5{
    background-color:#f39c12;
}
/* Achat*/
.CommType6{
    background-color:#8e44ad;
}
/* Non validé */
.CommType7{
    background-color:#c0392b;
}
/* Séance Non validé */
.CommType16{
    background-color:#c0392b;
}
/* Duel validé */
.CommType8{
    background-color:#1abc9c;
}
/* Duel refusé*/
.CommType9{
    background-color:#e74c3c;
}
/* Nouveau duel */
.CommType10{
    background-color:#be2edd;
}
/* Duel gagné */
.CommType11{
    background-color:#27ae60;
}
/* Duel perdu */
.CommType12{
    background-color:#f0932b;
}
/* Evenements spéciaux*/
.CommType13{
    background: -webkit-linear-gradient(right,#6a1b9a,#f50057);
}
/* Flammes*/
.CommType17{
    background: -webkit-linear-gradient(right,#f39c12,#c0392b);
}

/* Flammes*/
.seance{
    background: -webkit-linear-gradient(left,#f6e58d,#ffbe76);
}

/* Flammes*/
.val_pat{
background: linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(95,1,105,1) 0%, rgba(81,0,255,1) 100%);
}

h1, h2, h3, h4, h5{
    font-family: 'Rubik';
}

.h1, .h2, .h3, .h4, .h5{
    font-family: 'Rubik';
}

.niv1{
    background-color:#FFC312;
}
.niv2{
    background-color:#ED4C67;
}
.niv3{
    background-color:#B53471;
}
.niv4{
    background-color:#833471;
}
.niv5{
    background-color:#6F1E51;
}

.textNiv1{
    background-color:#000;
    color:#FFC312;
}
.textNiv2{
    background-color:#000;
    color:#ED4C67;
}
.textNiv3{
    background-color:#000;
    color:#B53471;
}
.textNiv4{
    background-color:#000;
    color:#833471;
}
.textNiv5{
    background-color:#000;
    color:#6F1E51;
}