/* Color */
.bg-uno{background-color: var(--color-uno)!important}
.bg-uno-light{background-color: rgba(var(--rgb-uno), 0.4);}
.bg-uno-supalight{background-color: rgba(var(--rgb-uno), 0.2);}
.c-uno{color: var(--color-uno)!important}
.c-uno-light{color: rgba(var(--rgb-uno), 0.4);}
.c-uno-supalight{color: rgba(var(--rgb-uno), 0.2);}
.bg-dos{background-color: var(--color-dos)!important}
.bg-dos-light{background-color: rgba(var(--rgb-dos), 0.4);}
.bg-dos-supalight{background-color: rgba(var(--rgb-dos), 0.2);}
.c-dos{color: var(--color-dos)!important}
.c-dos-light{color: rgba(var(--rgb-dos), 0.4);}
.c-dos-supalight{color: rgba(var(--rgb-dos), 0.2);}
.bg-text{background-color: var(--color-text)!important}
.c-text{color: var(--color-text)!important}
.bg-text-medium{background-color: var(--color-text-medium)!important}
.c-text-medium{color: var(--color-text-medium)!important}
.bg-text-light{background-color: var(--color-text-light)!important}
.c-text-light{color: var(--color-text-light)!important}
.bg-text-supalight{background-color: var(--color-text-supalight)!important}
.c-text-supalight{color: var(--color-text-supalight)!important}
.bg-bloc-1{background-color: var(--color-bloc-1)!important}
.c-bloc-1{color: var(--color-bloc-1)!important}
.bg-bloc-2{background-color: var(--color-bloc-2)!important}
.c-bloc-2{color: var(--color-bloc-2)!important}
.bg-bloc-3{background-color: var(--color-bloc-3)!important}
.c-bloc-3{color: var(--color-bloc-3)!important}
.bg-fond{background-color: var(--color-fond)!important}
.c-fond{color: var(--color-fond)!important}
.bg-sidebar{background-color: var(--color-sidebar)!important}
.c-sidebar{color: var(--color-sidebar)!important}
.bg-white{background-color: var(--color-white)!important}
.c-white{color: var(--color-white)!important}
.bg-buttons{background-color: var(--color-buttons)!important}
.c-buttons{color: var(--color-buttons)!important}
.bg-success{background-color: var(--color-success)!important}
.c-success{color: var(--color-success)!important}
.bg-error{background-color: var(--color-error)!important}
.c-error{color: var(--color-error)!important}
.bg-warning{background-color: var(--color-warning)!important}
.c-warning{color: var(--color-warning)!important}

/* Border */
.br-0{border-radius: 0!important}
.br-2{border-radius: 2px!important}
.br-5{border-radius: 5px!important}
.br-50{border-radius: 50%!important}

/* Text */
.text-xl, .text-xl *{
    font-family: 'Poppins';
    font-size: 20px;
    line-height: 22px;
}
.text-l, .text-l *{
    font-family: 'Poppins';
    font-size: 18px;
    line-height: 20px;
}
.text-m, .text-m *{
    font-family: 'Poppins';
    font-size: 16px;
    line-height: 18px;
}
.text-s, .text-s *{
    font-family: 'Poppins';
    font-size: 14px;
    line-height: 16px;
}
.text-xs, .text-xs *{
    font-family: 'Poppins';
    font-size: 11px;
    line-height: 13px;
}
.text-upper{text-transform: uppercase;}
.text-bold{font-weight: 700;}
.text-semibold{font-weight: 600;}
/* Display */
.d-block{
    display: block!important;
}
.d-inline-block{
    display: inline-block!important;
}
.d-none{
    display: none!important;
}
.d-flex{
    display: flex!important;
}
.d-flex-col{
    display: flex;
    flex-direction: column;
}
.flex-grow{
    flex-grow: 1;
}
.flex-wrap{
    flex-wrap: wrap;
}
/* Position */
.text-center{
    text-align: center;
}
.text-start{
    text-align: start;
}
.text-end{
    text-align: end;
}
.text-justify{
    text-align: justify;
}
.align-items-start{
    align-items: flex-start;
}
.align-items-center{
    align-items: center;
}
.align-items-end{
    align-items: end;
}
.justify-content-center{
    justify-content: center;
}
.justify-content-between{
    justify-content: space-between;
}
.justify-content-end{
    justify-content: end;
}
/* Sizing*/
.w-50{width: 50%!important;}
.w-100{width: 100%!important;}
.h-50{height: 50%!important;}
.h-100{height: 100%!important;}
/* Box Shadow */
.box-s-bold{
    box-shadow: 0px 1px 4px #585A74!important;
}
.box-s-light{
    box-shadow: 0px 1px 4px rgba(116, 116, 116, 0.25)!important;
}
/* Float for image */
.float-right{
    float: right;
}
.float-left{
    float: left;
}
/* Input, Select, textarea, label Lien */
input:not([type="checkbox"]):not([type="radio"]), select{
    height: 32px;
    border-radius: 5px;
    font-family: 'Poppins';
    font-size: 14px;
    line-height: 16px;
    color: var(--color-text);
    border: none;
    padding: 4px 12px;
    box-sizing: border-box;
    box-shadow: 0px 2px 3px rgba(184, 180, 180, 0.25);
}
input::placeholder{
    font-family: 'Poppins';
    font-size: 14px;
    line-height: 16px;
    color: var(--color-text);
}
input:not([type="checkbox"]):not([type="radio"]):focus, select:focus, textarea:focus{
    outline: 2px solid var(--color-uno);
}
input[type="submit"], input[type="reset"], input[type="button"]{
    padding: 4px 8px!important;
    background: var(--color-uno);
    border: 1px solid var(--color-uno);
    font-family: 'Poppins'!important;
    font-size: 14px!important;
    line-height: 16px;
    color: var(--color-white)!important;
}
input[type="submit"]:hover, input[type="reset"]:hover, input[type="button"]:hover{
    background: var(--color-white);
    border: 1px solid var(--color-uno);
    color: var(--color-uno)!important;
}
.inputbox{
    padding: 4px;
    border: 1px solid var(--color-bloc-2);
}
.inputbox:hover{
    border: 1px solid var(--color-bloc-2);
}
.inputbox:focus{
    border: 1px solid var(--color-bloc-2);
}
input.button1:focus, input.button2:focus{
    transition: all ease-in-out 0.15;
    border: 1px solid var(--color-white)!important;
}
textarea{
    border-radius: 5px;
    font-family: 'Poppins';
    font-size: 14px;
    line-height: 16px;
    color: var(--color-text);
    padding: 8px;
    resize: none;
}
#mpage-body-modern input, #mpage-body-modern textarea {
    font-size: 14px !important;
}
dd label{
    color: var(--color-text);
}
label{
    font-family: 'Poppins';
    font-size: 14px;
    line-height: 16px;
    color: var(--color-text);
}
body#phpbb a:link,body#phpbb a:visited{
    color: var(--color-uno);
}
a:hover, a:hover > *{
    color: var(--color-dos);
    text-decoration: underline;
}

/* General for element quote, code, etc... */
dl.codebox{
    background-color: unset;
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 16px;
    text-align: justify;
    border: none;
    color: var(--color-text);
}
dl.codebox dt{
    border-bottom: none;
}
dl.codebox dt > button{
    font-family: "Poppins";
}
/* Element quote */
blockquote{
    text-align: justify;
}
#phpbb blockquote{
    margin: 12px auto;
    padding: 8px;
    background: unset;
    border: none;
    font-size: 14px;
    max-width: 70%;
}
blockquote blockquote{
    background-color: unset;
    font-size: unset;
    margin: 8px;
    background-color: rgba(255 ,255, 255, 0.2) !important;
}
blockquote div{
    margin-left: unset;
}
blockquote cite{
    color: var(--color-uno);
    text-transform: uppercase;
    font-family: 'Poppins';
    font-weight: 700;
    font-size: 14px;
    line-height: 16px;
    margin-bottom: 5px;
}
/* Element code */
.codebox::after{
    content: '';
}
dl.codebox code{
    border: 1px solid rgba(var(--rgb-uno), 0.6);
    border-radius: 5px;
    padding: 10px 16px;
    color: var(--color-text);
    word-break: break-word;
}
/* Element spoiler */
dl.codebox.spoiler .spoiler_title{
    background-color: rgba(var(--rgb-dos), 0.6);
    border-radius: 5px;
    color: var(--color-white);
    font-weight: 700;
    line-height: 14px;
    text-transform: uppercase;
    padding: 8px 12px;
}
.spoiler_content{
    border: 1px solid rgba(var(--rgb-dos), 0.6);
    padding: 10px 16px;
    margin: 12px 20px;
    border-radius: 5px;
}
/* Element hide */
dl.codebox.hidecode{
    border: 1px solid rgba(var(--rgb-uno), 0.6);
    background: var(--color-bloc-3);
    padding: 10px 16px;
    border-radius: 5px;
}
dl.codebox.hidecode > dt{
    display: none;
}
/* Redéfinition de classes natives */
.panel{
    background-color: var(--color-bloc-1)!important;
}
body#phpbb .row1, body#phpbb .row2, body#phpbb .row3{
    background-color: unset!important;
}
.corners-top, .corners-bottom{
    display: none!important;
}
h1.page-title{
    font-family: 'Poppins';
    font-size: 32px;
    line-height: 43px;
    color: var(--color-text);
}
table.table1 *{
    font-family: 'Poppins';
    font-size: 14px;
    line-height: 16px;
}
table.table1 td{
    color: var(--color-text);
    font-size: 14px;
}
form[action="/search?search_id=watchsearch"] table.table1 tbody tr td:first-child, form[action="/search?search_id=watchsearch"] table.table1 thead tr th:first-child{
    display: none;
}
a.topictitle:hover{
    color: currentColor;
}
table.table1 tbody td{
    border-top: none!important;
}
table.forumline{
    background: var(--color-bloc-1);
    padding: 8px;
    border-radius: 5px;
}
table.forumline th.thCornerL, table th.thTop, table th.thCornerR{
    background-color: rgba(var(--rgb-dos), 0.4);
}
table.forumline td.catHead{
    font-family: 'Poppins';
    font-size: 20px;
    line-height: 36px;
    color: var(--color-text);
}
body#phpbb h3, body#phpbb .h3, body#phpbb .content h2, body#phpbb .panel h2, body#phpbb .content h2.h3, body#phpbb .panel h2.h3{
    color: var(--color-text);
    border: none;
    font-family: 'Poppins';
    font-size: 14px;
    line-height: 19px;
}
a.button1, input.button1, a.button2, input.button2, button.button2, .external-module .external-more a{
    padding: 4px 8px!important;
    background: var(--color-uno);
    border: 1px solid var(--color-uno)!important;
    font-family: 'Poppins'!important;
    font-size: 14px!important;
    line-height: 16px;
    color: var(--color-white)!important;
    border-radius: 5px;
    box-sizing: border-box;
    box-shadow: 0px 2px 3px rgba(184, 180, 180, 25%);
}
a.button1:hover, input.button1:hover, a.button2:hover, input.button2:hover, button.button2:hover, .external-module .external-more a:hover{
    background: var(--color-white);
    color: var(--color-uno)!important;
}
.pagination span strong{
    background-color: var(--color-bloc-2);
    border: 1px solid var(--color-bloc-2);
    color: var(--color-white);
    font-size: 11px;
}
.pagination span a, .pagination span a:link, .pagination span a:visited, .pagination span a:active{
    color: var(--color-text);
    background-color: var(--color-bloc-1);
    border: 1px solid var(--color-bloc-1);
    font-size: 11px;
}
.pagination span a:hover {
    background-color: var(--color-bloc-2);
    border: 1px solid var(--color-bloc-2);
    color: var(--color-white);
    text-decoration: none;
}
.pagination span a.pag-img {
    background: none!important;
    border: none!important;
}
table.table1 tbody tr:hover, table.table1 tbody tr.hover {
    background-color: unset;
    color: currentColor;
}
#cp-main h1{
    color: var(--color-text);
    text-align: center;
    font-weight: 700;
}

#cp-main .panel{
    border-radius: 5px;
    padding: 8px 16px;
}

#cp-main table.table1 thead th{
    text-transform: unset;
    border: unset;
    text-align: center;
    color: var(--color-text);
}

#cp-main .panel p.right-box{
    margin: 16px 0 8px;
}
#cp-main fieldset.submit-buttons{
    display: flex;
    gap: 8px;
    margin: 8px 0;
}

/* Mobile */
body#mpage-body-modern .search-topic-category span{
    color: white;
}

/* Elements CSS */
.delimiter-uno{
    width: 100%;
    position: relative;
    display: block;
    border-bottom: 2px solid var(--color-uno);
    margin: 16px 8px;
    box-sizing: border-box;
}
.delimiter-uno::before{
    content: '';
    position: absolute;
    display: block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: var(--color-uno);
    top: 0;
    left: 0;
    transform: translateY(-40%);
}
.delimiter-uno::after{
    content: '';
    position: absolute;
    display: block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: var(--color-uno);
    top: 0;
    right: 0;
    transform: translateY(-40%);
}
.delimiter-dos{
    border-bottom: 3px solid var(--color-dos);
    position: relative;
    margin: 15px;
    color: var(--color-dos);
    text-align: center;
    display: block;
    width: calc(100% - 30px);
}
.delimiter-dos.left::before{
    content: '';
    position: absolute;
    display: block;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background-color: var(--color-dos);
    bottom: -9px;
    left: -5px;
}
.delimiter-dos.right::after{
    content: '';
    position: absolute;
    display: block;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background-color: var(--color-dos);
    bottom: -9px;
    right: -5px;
}

/* Rewrite icons */
.sprite-icon_topic_latest, .sprite-icon_topic_newest{
    background: unset;
    display: inline-block;
    width: 10px;
    height: 10px;
    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='m4.497 20.835l16.51-7.363c1.324-.59 1.324-2.354 0-2.944L4.497 3.164c-1.495-.667-3.047.814-2.306 2.202l3.152 5.904c.245.459.245 1 0 1.458l-3.152 5.904c-.74 1.388.81 2.87 2.306 2.202'/%3E%3C/svg%3E");
    background-color: currentColor;
    -webkit-mask-image: var(--svg);
    mask-image: var(--svg);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
}