/*@font-face {
  font-family: mfont;
  src: url(font.ttf);
}*/

* {
    box-sizing: border-box;
    -webkit-user-select: none; /* Safari */
    -ms-user-select: none;     /* IE 10+ */
    user-select: none;         /* Standard syntax */
    /*font-family: mfont;*/
    font-weight: 500;

    font-family: "Google Sans Flex", sans-serif;
    font-optical-sizing: auto;
    /*font-weight: <weight>;*/
    font-style: normal;
    font-variation-settings:
        "slnt" 0,
        "wdth" 100,
        "GRAD" 0,
        "ROND" 0;
}

body, html {
  margin: 0;
  padding: 0;
  font-family: Arial, sans-serif;
  background-color: #f9f9f9;
  min-height: 100vh;
}

.container {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 90%;
  /*max-width: 500px;*/
  max-width: 540px;
  margin: 20px auto; /* space from the top */
  padding: 10px;
}

button {
  width: 100%;
  padding: 20px;
  margin: 10px 0;
  font-size: 20px;
  cursor: pointer;
  border: none;
  /*border-radius: 8px;*/
  border-radius: 20px;
  background-color: #8A8A8A;
  transition: background-color 0.3s, transform 0.2s;
  color: white;
  
  box-shadow: 0px 3px 10px 0px rgba(31, 31, 31, 0.25);
}

button:hover {
  background-color: #3890f5;
  transform: translateY(-3px);
}

.folder {
    background-color: #575757;
}

.image_ {
    background-color: #f96161!important;
}

.corr_ {
    background-color: #00cd0a!important;
}

.chapt_ {
    background-color: #0082ff!important;
}

.enn_ {
    background-color: #f96161!important;
}

.enn_corr {
    background: linear-gradient(90deg,rgba(249, 97, 97, 1) 50%, rgba(0, 205, 10, 1) 50%)!important;
}

.supptp_ {
    background-color: #ff4b27!important;
}

.fiche_ {
    background-color: #fffa00!important;
}

.corrtp_ {
    background-color: #ff9200!important;
}

.exam_ {
    background-color: #ff3df7!important;
}

/**/

.folder_c {
    background-color: #575757;
}

.image_c {
    background-color: #f96161!important;
}

.corr_c {
    background-color: #00cd0a!important;
}

.chapt_c {
    background-color: #0082ff!important;
}

.enn_c {
    background-color: #f96161!important;
}

.enn_corr_c {
    background: linear-gradient(90deg,rgba(249, 97, 97, 1) 50%, rgba(0, 205, 10, 1) 50%)!important;
}

.supptp_c {
    background-color: #ff4b27!important;
}

.fiche_c {
    background-color: #fffa00!important;
}

.corrtp_c {
    background-color: #ff9200!important;
}

.exam_c {
    background-color: #ff3df7!important;
}

.enn_c:hover, .corr_c:hover, .image_c:hover, .chapt_c:hover, .supptp_c:hover, .fiche_c:hover, .corrtp_c:hover, .exam_c:hover {
    /*background-color: white!important;*/
    background-color: #3890f5!important;
}


/*.enn_c:hover, .corr_c:hover, .image_c:hover, .chapt_c:hover, .supptp_c:hover, .fiche_c:hover, .corrtp_c:hover, .exam_c:hover .result-title {
    color: black!important;
}*/

.a_es { background-color: #ff595e; }
.b_es { background-color: #fe7116; }
.c_es { background-color: #8ac926; }
.d_es { background-color: #1982c4; }
.e_es { background-color: #D100D1; }
.f_es { background-color: #800080; }
.g_es { background-color: #2c002c; }

.a_eer { background-color: #af070c; }
.b_eer { background-color: #ffca3a; }
.c_eer { background-color: #8ac926; }
.d_eer { background-color: #52a675; }
.e_eer { background-color: #D100D1; }
.f_eer { background-color: #800080; }
.g_eer { background-color: #2c002c; }

.a_es_s6 { background-color: #219EBC; }
.b_es_s6 { background-color: #126782; }
.c_es_s6 { background-color: #ffca3a; }
.d_es_s6 { background-color: #FD9E02; }
.e_es_s6 {background-color: #d25500;}
.f_es_s6 { background-color: #AE2012; }
.g_es_s6 { background-color: #3f0b0d; }

.a_eer_s6 { background-color: #8ECAE6; }
.b_eer_s6 { background-color: #126782; }
.c_eer_s6 { background-color: #023047; }
.d_eer_s6 { background-color: #FD9E02; }
.e_eer_s6 {background-color: #ff6700;}
.f_eer_s6 { background-color: #AE2012; }
.g_eer_s6 { background-color: #3f0b0d; }

.a_s1 { background-color: #d11f1f; }
.b_s1 { background-color: #fc6500; }
.c_s1 { background-color: #f6a020; }
.d_s1 { background-color: #f8cc1b; }
.e_s1 { background-color: #7fc748; }
.f_s1 { background-color: #007f4e; }
.g_s1 { background-color: #004027; }

.a_s2 { background-color: #00326c; }
.b_s2 { background-color: #0050d8; }
.c_s2 { background-color: #ffc518; }
.d_s2 { background-color: #ff8809; }
.e_s2 { background-color: #ed4700; }
.f_s2 { background-color: #e02f00; }
.g_s2 { background-color: #000000; }

.a_s3 { background-color: #086272; }
.b_s3 { background-color: #1abc9c; }
.c_s3 { background-color: #2ecc70; }
.d_s3 { background-color: #f1c40e; }
.e_s3 { background-color: #e77e23; }
.f_s3 { background-color: #e74d3c; }
.g_s3 { background-color: #3398db; }
.h_s3 { background-color: #9b58b6; }

/*.a_s4 { background-color: #00202e; }
.b_s4 { background-color: #003f5c; }
.c_s4 { background-color: #58508d; }
.d_s4 { background-color: #bc5090; }
.e_s4 { background-color: #ff6361; }
.f_s4 { background-color: #ffa600; }
.g_s4 { background-color: #ffbd40; }*/

.a_s4 { background-color: #00202e; padding: 18px; margin: 7px 0px; }
.b_s4 { background-color: #003f5c; padding: 18px; margin: 7px 0px; }
.c_s4 { background-color: #2c4875; padding: 18px; margin: 7px 0px; }
.d_s4 { background-color: #8a508f; padding: 18px; margin: 7px 0px; }
.e_s4 { background-color: #bc5090; padding: 18px; margin: 7px 0px; }
.f_s4 { background-color: #ff6361; padding: 18px; margin: 7px 0px; }
.g_s4 { background-color: #ff8531; padding: 18px; margin: 7px 0px; }
.h_s4 { background-color: #ffa600; padding: 18px; margin: 7px 0px; }
/*.i_s4 { background-color: #ffd380; }*/
.i_s4 { background-color: #ffbd40; padding: 18px; margin: 7px 0px; }

/*
Mobile-specific styles
@media (max-width: 900px) {
    button {
        padding: 24px;
        font-size: 24px;
    }
}

Extra small phones
@media (max-width: 400px) {
    button {
        padding: 28px;
        font-size: 26px;
    }

}*/


