Files
ms1inscription-v5/css/style.css
2026-06-16 14:09:53 -04:00

1270 lines
28 KiB
CSS
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

/* GLOBAL */
* {margin: 0; padding: 0;}
img {border: none; max-width: 100%;}
.special td, .special th {padding: 3px;}
.clearer {clear: both;}
table {border-collapse: collapse; font-size: 1em;}
hr {margin: 5px 0;}
p{word-wrap: break-word;}
img{max-width: 100%; height:auto;}
#sponsors img{max-width: 93%;}
/* BODY */
body {
color: #262d35;
background: #e2e3e6 url(../images/site.jpg) no-repeat center center fixed;
background-size: cover;
font-family: 'Lato', sans-serif;
}
/* EN-TÊTE */
header {
color: #fff;
}
.ms1-header-top {
background-color: #333c49;
}
.ms1-header-top li a {
color: #fff;
line-height: 40px;
text-decoration: none;
text-transform: uppercase;
}
.ms1-header-top li a:hover, .ms1-header-top li.active a {
color: #f3954a;
font-weight: bold;
text-decoration: none;
}
.ms1-header-bottom {
background-color: rgba(30, 35, 41, 0.9);
}
.ms1-header-bottom a {
color: #fff;
text-decoration: none;
}
.ms1-header-bottom a:hover {
color: #fff;
text-decoration: underline;
}
.btn-menu{display: none; border:none; color:#fff; padding: 7px 10px; font: 100 16px/28px 'Lato', sans-serif;}
.btn-menu:hover{color:#fff; border:none; background:transparent;}
/* MILIEU */
#main, #page_logo {
/*opacity: 0.95;*/
}
/* ==================================================
* CART-STEPS
* ================================================== */
.cart-steps {
margin-bottom: 1rem;
}
.cart-steps .cart-steps-item {
background-color: #ccc;
border: .25rem solid #fff;
color: #111;
font-size: 1.2rem;
font-weight: bold;
padding: .5rem .5rem .5rem 1rem;
text-transform: uppercase;
}
.cart-steps .cart-steps-item.active {
background-color: #f3954a;
color: #fff;
}
/* PANIER */
#quitter_pas_login,
#panier_boite_login,
#panier_nouveau_compte {}
#quitter_pas_login div.titre,
#panier_boite_login div.titre,
#panier_nouveau_compte div.titre {background: #f3954a; color: #262d35; margin-bottom: 10px; padding: 5px; text-align: center;}
/* PANIER CHECKOUT*/
#panier_l {float: left; width: 100%;}
#panier_r {border: 1px dashed #fff; background: #262d35; color: #fff; float: right; width: 28%;}
#panier #rabais, #panier #options, #panier #paiement {border: 1px solid #ccc; color: #262d35; margin-bottom: 20px;}
#panier_l img {vertical-align: middle;}
#panier_r #adresse, #panier_r #annulation, #panier_r #promo, #panier #paiement, #panier #rabais, #panier #options {padding: 20px;}
#panier_r .titre, #panier #rabais .titre, #panier #rabais .sous-titre, #panier #options .titre { margin-bottom: 15px;}
#panier_r a {color: #fff; text-decoration: underline;}
#panier_r a:hover {color: #fff; text-decoration: none;}
#panier_r div.img_cartes {margin-bottom: 10px; text-align: center; width: 100%;}
#panier_r div.img_cartes img {float: none; margin: 0; padding: 0 5px;}
.img_cartes img.active {
border: 1px solid #333;
}
.img_cartes img.inactive {
opacity: .2;
}
div#loading {display: none; position: fixed; z-index: 1000; top: 0; left: 0; height: 100%; width: 100%; background: url(../images/ajax-loader2.gif) 50% 50% no-repeat;}
#page .wrapper {display: block; max-width:1004px; margin:0 auto; padding:20px 65px 100px; background: #fff; opacity:0.95; min-height:60vh;}
#page_logo .wrapper {display: block; max-width:1004px; margin:0 auto; padding:0 65px 25px; background: #fff; border-bottom: 1px solid #262d35;}
#rabais .titre {font-weight: bold;}
#rabais .titre, #panier #rabais .sous-titre {display:block; float:left; margin: 15px auto;}
#rabais label.form{width:12%;}
#rabais input[type="text"] {float: left; display: block; padding:5.75px;}
#rabais button {float: left; display: block;}
#adresse, #acheteur{border:1px solid #666; width:35%; padding:22px; float:left; margin:0 20px 30px 0;}
#creationcompte{width:55%; display: block; float:left; padding:22px; border:1px solid #666;}
#creationcompte .connect{display: block; float: left; margin:10px 0 0; text-align: left; width:100%;}
#creationcompte .connect input{max-width:200px; margin:0 5px 0 0!important; padding: 4px;}
table.special{border-bottom:1px solid #666!important;}
table.special tbody tr th{background: #f3954a!important;}
.inactif{opacity:0.5;}
.inactif:hover{background: #f3954a; color:#333;}
p.right{display:block; float:right; width:39%; text-align: center; clear:both;}
.paiement_inactif {position: absolute; background: rgba(0,0,0,0.7); width:100%; max-width: 1004px; height: 336px;}
.paiement_inactif p {display: block; float: right; width: 35%; margin: 30px; color:#fff;}
p.facebook_dialog {display: block; font-size: 28px; height: 28px; line-height: 28px; padding: 10px 0; vertical-align: middle;}
p.facebook_dialog img {margin-right: 5px;}
p.print-receipt {font-size: 16px; text-align: right; width: 100%;}
p.print-receipt img {padding-right: 3px; vertical-align: text-top;}
p.retry-checkout {font-size: 16px;}
/* LISTE DES ÉVÉNEMENTS */
#page div.box_equipe {border-bottom: 5px solid #f3a566; margin-bottom: 10px; padding: 10px 0;}
.card.box_participant .card-header {
background-color: #f3a566;
color: #fff;
}
.card.box_participant {
border-color: #f3a566;
}
.btn_cancel_event_promo, .btn_cancel_event_client, .link_confirmation {padding: 2px 8px; font-weight: bold; margin: 2px 0 2px;}
.btn_edit_event, .btn_edit_event_promo {font-weight: bold;}
#main div.sep {border-bottom: 1px dashed #ccc; margin: 10px 0; padding-top: 10px; width: 100%;}
/* PIED DE PAGE */
#sponsors {margin: 0 auto; background: #ecedf0; padding: 25px 0;}
#sponsors ul {list-style: none; margin: 0 auto; text-align: center;}
#sponsors ul li {display: inline-block; *display:inline; margin: 0 10px;}
#sponsors ul li img {padding: 10px; vertical-align: middle;}
footer {
background-color: #333c49;
color: #fff;
}
footer a {
color: #fff;
text-decoration: none;
}
.ms1-footer-top a:hover, .ms1-footer-top a.active {
color: #f3954a;
font-weight: bold;
text-decoration: none;
}
.ms1-footer-bottom {
background-color: #262d35;
}
footer i {
font-size: 35px!important;
margin: 10px 0 10px 5px;
}
/* TITRES */
h1 {color: #262d35; text-transform: uppercase; margin-bottom: 10px; margin-top:20px;}
h2 {color: #262d35; text-transform: uppercase; margin-bottom: 10px; margin-top:20px;}
h3 {color: #262d35; text-transform: uppercase; margin-bottom: 5px;}
h4 {color: #262d35; text-transform: uppercase; margin-bottom: 10px;}
h4 span {color: #262d35; }
footer h1,
footer h2,
footer h3,
footer h4 {
color:#fff;
}
h2.box_paiement{width:35.4%; margin:5px 0;}
i.fa.fa-file-text-o {font-size: 45px; width: 50px; display: block; float: left;}
/* LIENS */
a {
color: #f3954a;
text-decoration: none;
}
a:hover {
color: #f3954a;
text-decoration: underline;
}
a[href^="mailto:"] {
/* These are technically the same, but use both */
overflow-wrap: break-word;
word-wrap: break-word;
-ms-word-break: break-all;
/* This is the dangerous one in WebKit, as it breaks things wherever */
word-break: break-all;
/* Instead use this non-standard one: */
word-break: break-word;
/* Adds a hyphen where the word breaks, if supported (No Blink) */
-ms-hyphens: auto;
-moz-hyphens: auto;
-webkit-hyphens: auto;
hyphens: auto;
}
/* LISTES */
ul.promoteur {width: 100%; margin: 5px 0 5px!important;}
ul.promoteur li{list-style:none; margin-bottom: 15px; background: none!important;}
/* FORMULAIRES */
label.error-dash {
background-position: left top;
background-repeat: no-repeat;
display: block;
float: none;
font-style: italic;
font-weight: bold;
line-height: 18px;
margin: 5px 5px 5px 5px;
padding-left: 18px; width: auto;
background-image: url(../images/error.png); color: #c33;
background-color: #ffb;
}
div.error-dash{
background-color: #FFB;
border: 1px solid #FEB;
margin-bottom: 10px;
padding: 3px;
display: block;
clear: both;
}
label.error,
label.success,
label.msg,
label.promo {
font-size: 0.9rem;
font-style: italic;
font-weight: bold;
margin: 5px;
}
label.error { color: #c33; }
label.error:before {
content: '\f071';
color: #c33;
font-family: fontawesome;
font-style: normal;
font-weight: normal;
padding-right: 5px;
}
label.success {background-image: url(../images/tick.png); color: #529214;}
label.msg {background-image: url(../images/information.png); color: #0072bc; padding:0 20px;}
div.error {display: none;}
div.error, div.msg {/*background-color: #ffb;*/ margin-bottom: 10px; display: block; clear: both;}
table.resultats>tbody>tr:nth-of-type(even) input {
background: #fff;
}
header ::-webkit-input-placeholder {
text-align: center;
}
header :-moz-placeholder { /* Firefox 18- */
text-align: center;
}
header ::-moz-placeholder { /* Firefox 19+ */
text-align: center;
}
header :-ms-input-placeholder {
text-align: center;
}
fieldset {border: none; margin-bottom: 10px;}
fieldset legend {color: #262d35; font-weight: bold; padding: 2px 5px;}
fieldset label.form {color: #262d35; float: left; margin: 8px 5px; text-align: right; width: 35%;}
fieldset label.info {color: #262d35; margin: 5px;}
fieldset #panier_r label.form {display: block; float: none; margin: 5px 0; text-align: left; width: auto;}
fieldset #panier_r input, fieldset #panier_r textarea, fieldset #panier_r select, fieldset #panier_r p, fieldset #panier_r button, fieldset #panier_r img {float: left; margin: 5px 5px 5px 0;}
fieldset #panier_l img {float: none; margin: 0 3px 0 0;}
fieldset br {clear: left;}
fieldset p img {float: none; margin: 0; padding-right: 3px; vertical-align: text-top;}
.img_cartes img{margin:0 5px!important;}
div.boutons p.boutons_l, div.boutons p.boutons_m, div.boutons p.boutons_r {float: left; width: 32%;}
div.boutons button {float: none; margin: 0; width: 200px;}
div.bouton {display: block; text-align: right; }
/* TABLEAUX */
td.highlighted {color: #fff;}
td.grayed {color: #666; text-decoration: line-through;}
/* MISC */
.img_cadre {border: 1px solid #a39f7a;}
table.tab-rabais td, table.tab-rabais th {padding: 3px;}
table.resultats,
table.stats {width:90%; max-width: 1240px; display: block; clear: both; margin: 10px auto;}
table.resultats td,
table.stats td,
table.stats th {padding: 8px;}
table.stats td,
table.stats th {border: 1px solid #fff;}
table.resultats tr.HeaderRow td,
table.stats th {background: #f3a566; color: #262d35; font-weight: bold; width:auto!important;}
table.stats td {background: #444;}
table.resultats tr.OddRow td, table.resultats > tbody > tr:nth-of-type(odd) {background: #FAFDFF; width: auto!important;}
table.resultats tr.EvenRow td, table.resultats > tbody > tr:nth-of-type(even) {background: #E6E6E6; width: auto!important;}
table.resultats td.BestTimeOverall {color: #FF00FF; font-weight: bold;}
table.resultats td.BestTime {color: #00FF00; font-weight: bold;}
table.resultats td.PitIn {color: #FF0000; font-weight: bold;}
table.resultats td.PitOut {color: #FFFF00; font-weight: bold;}
table.resultats td img {height: 1.1em;}
#Time {max-width: 1240px; margin: 0 auto 0.5em auto; font-size: 1em; font-weight: bold; text-align: right;}
#DayTime {color: #FFFF00; float: left}
#ElapsedTime {color: #00FF00; margin-right: 1em}
#RemainingTime {color: #FF0000;}
img.img_status {height: 1.1em; margin-bottom: 5px;}
tr.OddRowCancelled, table.resultats > tbody > tr.RowCancelled:nth-of-type(odd) {
font-weight: bold;
color: #ffCD00;
font-style: italic;
background: #262d35;
}
tr.EvenRowCancelled, table.resultats > tbody > tr.RowCancelled:nth-of-type(even) {
font-weight: bold;
color: #ffCD00;
font-style: italic;
background: #222;
}
table.resultats > tbody > tr.RowIncomplete:nth-of-type(odd) {
font-weight: bold;
color: #f26522;
font-style: italic;
background: #262d35;
}
table.resultats > tbody > tr.RowIncomplete:nth-of-type(even) {
font-weight: bold;
color: #f26522;
font-style: italic;
background: #222;
}
td#available form input{max-width: 50%;}
/* TABLE */
.table thead tr,
.table tfoot tr {
background-color: #f3a566;
color: #262d35;
}
div.pagination{
color: #f58400;
text-align: center;
}
span.pagination-links{
background-color: #f58400;
border: 1px solid #fff;
}
a.pagination{
padding: 10px;
color: #000;
}
.disabled {
background:#EEE;
color: #fff;
text-align: center;
}
.dash-qte {
width: 100px;
}
.dash-bib{
width:100%;
}
.btn_bib{
cursor:pointer;
}
.input-readonly{
background-color: #fff;
}
.sel-input-readonly{
background-color: #fff;
/*width:150px;*/
}
.sel-input{
/*width:150px;*/
}
.button-promoteur {
background: #f3954a;
border: 3px solid #333;
color: #333;
cursor: pointer;
display: block;
font-size: 1em;
font-weight: bold;
line-height: 130%;
outline: none;
overflow: visible;
text-decoration: none;
text-transform: lowercase;
width: 100px;
height: 100px;
margin: 0px auto;
}
.button-promoteur:hover{
border: 3px solid #333;
}
/*RESPONSIVE*/
@media screen and (max-width: 1145px) {
#page ul.evenements li{
width:22%;
}
}
@media screen and (max-width: 1045px) {
.wrapper, #footer .wrapper{
padding:0 45px;
}
#footer_r, #footer_l {
margin-top:10px;
}
}
@media screen and (max-width: 1024px) {
.logo {
max-width: 300px;
}
}
@media screen and (max-width: 974px) {
#header{
min-height:260px!important;
margin-bottom: 0!important;
}
#header .middle {
min-height: 260px;
}
}
@media screen and (max-width: 925px) {
.titre_desktop {display: none;}
.titre_mobile{display: block;}
.client_logo{width:100%;}
#header{
min-height:260px!important;
margin-bottom: 0px!important;
}
#header .middle {
min-height: 260px;
}
}
@media screen and (max-width: 820px) {
#page ul.evenements li{
width:30%;
}
.btn-menu{
display: block;
float: right;
}
.menu{
display: none;
width: 100%;
position: absolute;
top: 40px;
left: 0;
}
.menu li{
background: #262d35;
width: 100%;
text-align: left;
}
.top .menu_top ul li a {
margin:0;
text-align: center;
padding: 5px 0 15px;
}
.top .lang li a{
padding: 0!important;
}
.top .menu_top {
float: none;
}
.top .menu_top ul.lang li a:before {
content: "";
}
.paiement_inactif{width: 83%; height:31%;}
}
@media screen and (max-width: 768px) {
.client_logo {
padding: 25px 0 0!important;
}
.wrapper, #footer .wrapper{
padding:30px;
}
#header .wrapper{
padding:0 30px;
}
#page ul.evenements li{
width:45%;
}
fieldset label.form {
text-align: left;
width: 95%;
}
div.boutons p.boutons_l, div.boutons p.boutons_m, div.boutons p.boutons_r{width: 100%;}
div.boutons button {
float: right;
}
#adresse, #acheteur, #creationcompte{width: 92%;}
.paiement_inactif{width: 84%; height:49%;}
}
@media screen and (max-width: 570px) {
fieldset label.form {
text-align: left;
width: 100%;
}
form fieldset select{
width: 75%;
}
form fieldset select p{
width: 100%;
}
fieldset p{
margin: 5px 0;
}
.paiement_inactif {
width: 89%;
height: 73%;
}
#adresse, #acheteur, #creationcompte {
width: 85%;
}
#rabais{
width: 78%;
}
.special{
font-size: 0.79em!important;
}
#footer i {
margin: 10px 2px 10px 2px;
}
/* TITRES */
h2.box_paiement { width: 100%;margin: 5px 0;}
}
/* Aspect général de la coche */
input[type="checkbox"]:checked:before, input[type="radio"]:checked:before {
font-family: 'FontAwesome';
content: "\F00C";
font-size: 18px;
color: #f3954a;
background: #ecedf0;
line-height: 15px;
}
input[type="checkbox"], input[type="radio"] {
font-size: 14px;
border:7px solid #ecedf0!important;
outline: 1px solid #b7b6b6;
/*outline: none;*/
}
input[type="checkbox"]:checked, input[type="radio"]:checked {
background: transparent!important;
border: none!important;
outline: 1px solid #b7b6b6;
/*outline: none;*/
}
/* PRELOADER */
#preloader {
background-color: rgba(0,0,0,0.6);
height: auto;
min-height: 100%;
position: fixed;
top: 0;
left: 0;
width: 100%;
z-index: 9999;
}
#spinner {
background: #fff;
border-color: #ccc;
border-radius: 8px;
color: #333;
font-size: 80px;
margin: -65px 0 0 -133px;
padding: 15px;
position: absolute;
top: 50%;
left: 50%;
width: auto;
}
#spinner span {
font-size: 2rem;
font-weight: bold;
vertical-align: middle;
}
/* CHECKOUT */
span.termes {
font-size: 1.2em;
}
.form-message {
background: #ffc;
border: 1px solid #ddd;
border-radius: 8px;
display: none;
padding: 10px;
margin: 10px auto;
max-width: 350px;
}
.form-message label {
display: block;
}
#page a.under-dash {
border-bottom: 1px dashed;
text-decoration: none;
}
#page a.under-dash:hover {
border-bottom: none;
text-decoration: none;
}
/* ICÔNES SPÉCIALES */
.ico-question, .ico-cart {
font-size: 24px;
}
.fa-file-pdf-o.ico-question {
color: red;
}
.fa-question-circle.ico-question {
color: #0000ff;
}
/* TRANSFERT D'ÉPREUVE */
.xfer_sign,
.donation_sign {
/*color: #333;*/
font-weight: bold;
margin-left: 5px;
}
.xfer-box .message {
margin-bottom: 15px;
padding: 15px 0;
}
.xfer-box .details {
border: 1px solid #333;
margin-bottom: 15px;
padding: 15px;
}
.xfer-box .details .titre,
.xfer-box .details .value {
display: block;
padding: 5px 0;
}
.xfer-box .details .titre {
float: left;
font-weight: bold;
text-align: right;
width: 30%;
}
.xfer-box .details .value {
float: right;
text-align: left;
width: 66%;
}
@media screen and (max-width: 767px) {
.xfer-box .details .titre,
.xfer-box .details .value {
float: none;
text-align: left;
width: 99%;
}
}
/* DISABLED - READONLY */
:disabled {
background-color: #999;
}
div.rabais {
color: #777;
text-decoration: line-through;
}
.frm_search{
display: none;
}
.div_open{
display: block;
}
.lbl_hint{
color: grey;
text-transform: lowercase;
font-style: italic;
font-size: 0.7em;
}
.white-popup-block {
background: #FFF;
padding: 20px 30px;
text-align: left;
max-width: 650px;
margin: 40px auto;
position: relative;
}
.special{
height: 50px;
}
/*Thermometre*/
.left, .right {
display: block;
float: left;
margin: 2% 0 2% 5%;
min-height: 185px;
}
.right{
float: right;
margin: 5% 10% 20px 0;
}
.left p{
margin: 15px auto;
font-size: 20px;
line-height: 28px;
}
.therm-number {
font-size: 11px;
color:#000;
}
@media screen and (max-width: 767px) {
.left, .right{
margin:2% 0;
}
.right{
margin:2% 0 50px 20px;
}
.left p{
font-size: 16px;
line-height: 20px;
}
}
.don-stats, .don-thermo {
display: block;
float: left;
margin: 2% 0 2% 5%;
min-height: 185px;
}
.don-thermo {
/*float: right;*/
margin: 5% 15%;
}
.don-stats p {
margin: 15px auto;
font-size: 20px;
line-height: 28px;
}
@media screen and (max-width: 767px) {
.don-stats, .don-thermo {
float: none;
margin:2% 0;
}
.don-thermo {
margin:2% 25%;
}
.don-stats p {
font-size: 16px;
line-height: 20px;
}
}
@media screen and (max-width: 499px) {
.don-stats, .don-thermo {
float: none;
margin:2% 0;
}
}
/* DONS */
.box-donateurs {
margin: 0 auto;
width: 70%;
}
.floatl {
float: left;
}
.floatr {
float: right;
}
.trie a {
color: #AAFFAA;
}
/* COMPTE CLIENT */
ul.ms1-menu-compte {
clear: both;
list-style: none;
margin: 0.5rem 0;
}
ul.ms1-menu-compte li {
color: #111;
font-size: 1rem;
font-weight: bold;
margin: 0.5rem;
text-transform: uppercase;
}
ul.ms1-menu-compte li i {
font-size: 1.5rem;
margin-right: 0.5rem;
width: 30px;
}
ul.ms1-menu-compte li small {
font-size: 0.8rem;
margin-left: 0.5rem;
text-transform: none;
}
ul.ms1-menu-compte li a {
background-color: #ccc;
border: #999 0.05rem solid;
border-radius: 0.25rem;
color: #111;
display: block;
margin: auto;
padding: 1rem 2rem;
text-decoration: none;
}
ul.ms1-menu-compte li a:hover, ul.ms1-menu-compte li a:active {
background-color: #f3954a;
color: #fff;
text-decoration: none;
}
.bloc_archives {
background-color: #ccc;
margin: 50px 0;
padding: 15px;
}
.bloc_archives .more_sign {
color: #333;
font-weight: bold;
margin-left: 5px;
}
.bloc_archives .more_link {
color: #333;
font-size: 1.2rem;
font-weight: bold;
}
/*Block Headline*/
.headline {
display: block;
margin: 10px 0 25px 0;
border-bottom: 1px dotted rgba(0,0,0,0.2);
}
.headline h2,
.headline h3,
.headline h4 {
margin: 0 0 -2px 0;
padding-bottom: 5px;
display: inline-block;
border-bottom: 2px solid #262d35;
width: auto;
}
/* ==================================================
* SCROLL TOP
* ================================================== */
.scroll-top-wrapper {
background-color: #f3954a;
border-radius: 5px;
bottom: 20px;
color: #fff;
height: 36px;
line-height: 36px;
opacity: 0;
overflow: hidden;
position: fixed;
right: 20px;
text-align: center;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
visibility: hidden;
width: 36px;
z-index: 999;
}
.scroll-top-wrapper:hover {
color: #fff;
background-color: #f3954a;
}
.scroll-top-wrapper.show {
cursor: pointer;
opacity: 1.0;
visibility :visible;
}
.scroll-top-wrapper i.fa {
line-height: inherit;
}
/* GOOGLE reCAPTCHA */
.grecaptcha-badge {
visibility: hidden;
}
/* TABLEAU PRDOMOTEUR */
.btn-promoteur {
border-width: 0.25rem;
height: 8rem;
width: 8rem;
}
.btn-promoteur i {
font-size: 4rem;
vertical-align: middle;
}
.prix-epreuve-actuel {
font-size: 1.75rem;
margin: .5rem;
}
.prix-epreuve-actuel div {
height: 7rem;
margin: auto;
padding: 2rem 0;
width: 7rem;
}
.cents {
font-size: .75rem;
vertical-align: text-top;
}
.prix-epreuve-dernier {
font-style: italic;
margin: .25rem;
text-decoration: line-through;
}
.prix-epreuve-date {
margin: .25rem;
}
.badge-notification {
position: absolute;
font-size: 1rem;
margin-top: -1.5rem;
margin-left: -2rem;
}
.prix-note {
position: absolute;
bottom: 1.8rem;
left: 50%;
transform: translateX(-50%);
font-size: 0.65rem;
color: #fff;
white-space: nowrap;
text-align: center;
max-width: 90%;
}
.popover {
max-width: 400px;
}
.popover-content a {
word-break: break-word!important;
word-wrap: break-word!important;
}
.epr-wrapper{
display:flex;
flex-direction:column;
gap:20px;
}
/* MSIN-4379 — Refonte layout dossards v4 : 2 colonnes, Tippy, gestion masquée. */
/* CONTENEUR 2 BLOCS */
.epr-row{
display:grid;
grid-template-columns: 220px 1fr;
gap:15px;
align-items:stretch;
}
.epr-col-right{
display:flex;
flex-direction:column;
gap:15px;
min-width:0;
}
.epr-block-gestion{
display:none;
}
.epr-block-assign .epr-content{
display:flex;
flex-direction:column;
gap:10px;
}
.epr-line-header{
background:#fff3cd;
font-weight:700;
}
.epr-action-row{
display:flex;
align-items:center;
gap:6px;
flex-wrap:wrap;
}
.btn-aide-bib{
width:22px;
height:22px;
padding:0;
border-radius:50%;
border:1px solid #adb5bd;
background:#f8f9fa;
color:#495057;
font-size:12px;
font-weight:700;
line-height:1;
cursor:pointer;
}
.btn-aide-bib:hover,
.btn-aide-bib:focus{
background:#e9ecef;
color:#212529;
}
.tippy-box[data-theme~='ms1-bib']{
background-color:#1e293b;
color:#f8fafc;
font-size:12px;
line-height:1.45;
}
.tippy-box[data-theme~='ms1-bib'] .tippy-arrow{
color:#1e293b;
}
/* BLOCS */
.epr-block{
border:1px solid #ddd;
display:flex;
flex-direction:column;
}
/* HEADER */
.epr-header{
background:#2f5fd0;
color:#fff;
padding:10px;
font-weight:bold;
}
.bib-container .batch-checkbox{
display:none;
}
.bib-container.batch-mode .batch-checkbox{
display:block;
}
/* CONTENU */
.epr-content{
padding:10px;
flex:1;
}
/* CENTRE TABLE */
.epr-table{
display:flex;
flex-direction:column;
gap:6px;
}
.epr-line{
display:grid;
grid-template-columns: 80px 80px 50px 50px 50px 50px 50px 30px 30px;
gap:6px;
align-items:center;
}
.batch-checkbox{
display:none;
}
/* ACTIONS */
.epr-actions{
display:flex;
flex-direction:column;
gap:6px;
}
/* MOBILE */
@media (max-width:768px){
.epr-row{
grid-template-columns: 1fr;
}
}
.bib-view {
width: 100%;
border: 1px solid #d9d9d9;
background: #f3f3f3;
}
.bib-view-header {
display: grid;
grid-template-columns: 1.6fr 1fr 0.7fr;
background: #3f63c9;
color: #fff;
font-weight: 700;
font-size: 15px;
}
.bib-view-header > div {
padding: 14px 16px;
}
.bib-view-row {
display: grid;
grid-template-columns: 1.6fr 1fr 0.7fr;
border-top: 1px solid #e1e1e1;
}
.bib-view.team-mode .bib-view-header,
.bib-view.team-mode .bib-view-row{
grid-template-columns: 1.5fr 1fr 0.7fr 1fr 0.8fr;
}
.bib-view-row:nth-of-type(odd) {
background: #f3f3f3;
}
.bib-view-row:nth-of-type(even) {
background: #ececec;
}
.bib-view-row > div {
padding: 14px 16px;
font-size: 15px;
color: #2f3640;
}
.bib-view-race {
line-height: 1.4;
}
.bib-view-name,
.bib-view-number {
display: flex;
align-items: flex-start;
}
.bib-view-empty {
padding: 14px 16px;
background: #f3f3f3;
color: #2f3640;
border-top: 1px solid #e1e1e1;
}
.bib-view-footer {
padding: 12px 16px;
text-align: right;
background: #f3f3f3;
border-top: 1px solid #e1e1e1;
}
.bib-error {
max-height: 80px;
overflow-y: auto;
white-space: normal;
word-break: break-word;
}
.epr-row.batch-mode .btn-auto,
.epr-row.batch-mode .btn-reset{
display:none;
}
/* MSIN-4379 — Étape 2 : styles du mode « auto » (masque batch, verrouille édition des plages).
Prochain tour : étape 67 (logique PHP à l'achat, pas de CSS supplémentaire prévu). */
.epr-row.auto-mode .btn-assign-batch,
.epr-row.auto-mode .btn-reset,
.epr-row.auto-mode .batch-config-container {
display: none;
}
.epr-row.auto-mode .btn-auto {
display: none;
}
.epr-row.auto-mode .btn-save-range,
.epr-row.auto-mode .btn-delete-range,
.epr-row.auto-mode .btn-add-range {
visibility: hidden;
}
.epr-row.auto-mode .bib-start,
.epr-row.auto-mode .bib-end {
pointer-events: none;
background: #eee;
}
.epr-row.batch-mode .btn-go-batch {
display: none;
}
.epr-row.batch-mode .btn-save-range,
.epr-row.batch-mode .btn-delete-range,
.epr-row.batch-mode .btn-add-range{
visibility:hidden;
}
.epr-row.batch-mode .bib-start,
.epr-row.batch-mode .bib-end{
pointer-events:none;
background:#eee;
}
.bib-view-info {
margin-bottom:10px;
padding:10px;
border-radius:6px;
}
.info-success {
background:#d4edda;
color:#155724;
font-weight:bold;
}
.info-partial {
background:#fff3cd;
color:#856404;
}
.info-error {
background:#f8d7da;
color:#721c24;
}
.info-default {
background:#f1f1f1;
color:#555;
}
.bib-view-header > div{
white-space:nowrap;
}
.team-mode-title{
font-size:11px;
color:#666;
margin-top:8px;
margin-bottom:4px;
}
.team-mode-box{
margin-top:10px;
padding:8px;
background:#f7f7f7;
border:1px solid #ddd;
border-radius:6px;
}
.team-mode-title{
font-size:12px;
font-weight:600;
color:#444;
margin-bottom:8px;
}
.team-mode-option{
display:flex;
align-items:flex-start;
gap:6px;
margin-bottom:6px;
font-size:12px;
color:#333;
}
.team-mode-option.disabled{
color:#999;
}
.team-mode-option input[type="radio"]{
margin-top:2px;
}