@charset "UTF-8";
/*!
 * v1.1.0 (24 avril 2018)
 * @author: Antony RAVENACH
 * @url : www.widea.fr
 */


/*
 * Thème couleurs & polices
 */
:root {
    --color-primary: #004169;
    --color-secondary: #43B9DB;
    --color-tertiary: #08b400;

    --font-primary: 'Montserrat', sans-serif;
    --font-secondary: 'Roboto', sans-serif;
}


/*
 * Soft reset knacss
 */
b, strong {
    font-weight: 700;
}
h1, h2, h3, h4, h5, h6 {
    line-height: 1.2;
}
.page-container.wrapper-inner {
    padding-top: 0;
}
.page-container li:before,
.page-container li li:before {
    display: none;
}
.page-container li {
    padding: 0;
}

.page-inscription .h2-like {
    font-size: 2.4rem;
    font-weight: 400;
}
.page-inscription .h3-like {
    font-size: 1.8rem;
    font-weight: 600;
}
.page-inscription .h4-like {
    font-size: 1.6rem;
    font-weight: 600;
}
.radio,
.checkbox {
   width: 1.8rem;
   min-width: 1.8rem;
   height: 1.8rem;
   box-shadow: inset 0 0 0 1px var(--color-primary); 
}
    .radio:checked,
    .checkbox:checked {
        background-size: 65% 65%;
        box-shadow: inset 0 0 0 1px var(--color-tertairy); 
        background-color: var(--color-tertiary); 
    }
        .radio:checked + label,
        .checkbox:checked + label {
            color: var(--color-tertiary); 
        }

ul.is-unstyled {
    margin: 0;
}
    .is-unstyled li {
        display: flex;
        margin-top: 1.5rem;
    }
        .is-unstyled label {
            font-size: 1.5rem;
            line-height: 1.3;
            padding: 0 0 0 0.8rem;
            margin: 0;
        }

@media (max-width: 1023px) {
    .page-inscription .pal {
        padding: 2rem;
    }
    .page-inscription .prl {
        padding-right: 2rem;
    }
    .page-inscription .pll {
        padding-left: 2rem;
    }
    .page-inscription .mtl {
        margin-top: 2rem;
    }

    .br-mobile {
        display: block;
        margin-top: 1rem;
    }
}

@media (max-width: 767px) {
    .page-inscription .h2-like {
        font-size: 2rem;
    }
    .page-inscription .h3-like {
        font-size: 1.6rem;
    }
    .page-inscription .h4-like {
        font-size: 1.4rem;
    }

    .page-inscription .w50 {
        width: 100%;
    }
    .page-inscription .w50.prl,
    .page-inscription .w50.pll {
        padding: 0;
    }
    .page-inscription .w50.prl:first-child {
        margin-bottom: 2rem;
    }
}


/*
 * Page inscription
 */

.page-inscription {
    font-family: var(--font-primary);
    font-size: 1.5rem;
    line-height: 1.5;
    color: var(--color-primary);
}

/* .container {
    width: 100%;
    max-width: 120rem;
    margin: auto;
} */

/** Alert message */
.page-inscription .alert {
    font-size: 1.8rem;
    margin: 2rem 0;
    padding: 4rem 2rem;
    text-align: center;
    background-color: #C00;
    color: #FFF;
}
    .alert-hide {
        display: none;
    }

.page-inscription .alert-message {
    color: #C00;
}

/** Bloc : général */
.bloc {
    background-color: #F8F8FA;
}

.bloc-border {
    padding: 2rem;
    background-color:#FFF;
    border: 0.1rem solid #C3D6DE;
    border-radius: 0.5rem;
}
@media (max-width: 767px) {
    .bloc-border {
        padding: 0;
        background-color:#F8F8FA;
        border: 0;
        border-radius: 0;
    }
}

/** Bloc : titre */
.page-inscription .title {
    color: #FFF;
    text-transform: uppercase;
    background-color: var(--color-primary);
    display: flex;
    flex-direction: row;
}

.page-inscription .title-icone {
    background-color: #43B9DB;
    width: 6rem;
    min-width: 6rem;
    height: 6rem;
    display: flex;
    align-items: center;
    justify-content: center;
}   
    .page-inscription .title-icone img {
        height: 4rem;
    }
    .page-inscription .title .h2-like {
        margin: 0;
        padding: 0 2rem;
        display: flex;
        align-items: center;
    }

/** Formulaire */
form p {
    margin-bottom: 3rem;
}
@media (max-width: 767px) {
    form p {
        margin-bottom: 2rem;
    }
}
    form p:last-child {
        margin-bottom: 0;
    }
    
label {
    font-size: 1.4rem;
    font-weight: 500;
    margin-bottom: 0.3rem;
}
@media (max-width: 767px) {
    label {
        font-size: 1.4rem;
        margin-bottom: 0.15rem;
    }
}
    label span {
        color: #C00;
        padding-left: 0.5rem;
    }
    .bloc-selection label span {
        color: var(--color-primary);
    }
    
[type=color], [type=date], [type=datetime-local], [type=email], [type=month], [type=number], [type=password], [type=search], [type=submit], [type=tel], [type=text], [type=time], [type=url], [type=week], select, textarea {
    font-size: 1.5rem;
    line-height: 1;
    font-weight: 500;
    outline: 0;
    color: var(--color-primary);
    width: 100%;
    height: 4.2rem;
    border: 0;
    border: 1px solid var(--color-primary);
    border-radius: 0.5rem;
    transition: all 0.5s ease;
    background-color: #FFF;
    box-shadow: none;
}
    
input:focus,
textarea:focus,
select:focus,
input:hover,
textarea:hover,
select:hover {
    background-color: #FFF;
    box-shadow: 0 0 0 1px var(--color-primary) inset;
}
    input.input-validation-error:focus,
    textarea.input-validation-error:focus,
    select.input-validation-error:focus {
        border-color: #C00;
        background-color: #FFF;
    }

textarea {
    line-height: 1.5;
    min-height: 6rem;
    height: 10rem;
    resize: vertical;
}
    
.input-disabled {
    color: #CCC;
    border-color: #CCC;
    cursor: default;
}
    .input-disabled input,
    .input-disabled input:hover {
        border-color: #CCC;
        cursor: default;
    }
        .input-disabled input:hover + label {
            color: #CCC;
        }

.maxlength {
    font-size: 1.2rem;
    font-weight: 500;
    padding-top: 0.5rem;
}

/** Bloc sélection programme de la journée */
.bloc-selection li:first-child {
    margin: 0;
}
.color-table {
    color: #C00 !important;
}
.color-atelier {
    color: #C0CF00 !important;
}
.color-formation {
    color: #43B9DB !important;
}
.checkbox:checked + label .color-atelier,
.checkbox:checked + label .color-formation {
    color: var(--color-tertiary); 
}

@media (max-width: 767px) {
    .bloc-selection .h3-like,
    .bloc-frais .h3-like {
        border-bottom: 1px solid var(--color-primary);
        padding-bottom: 0.5rem;
        margin-bottom: 2rem;
    }
}

/** Bloc restauration */
.bloc-restauration li:first-child {
    margin: 0;
}
.bloc-restauration .alert-message {
    margin-top: 2rem;
}

/** Bloc réglements */
.bloc-reglements li:first-child {
    margin: 0;
} 

/** Input : erreurs */
.input-validation-error,
#frais-inscription.bloc-erreur {
    border-color: #C00;
    background-color: #FEF8F8;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}
    .input-validation-error:focus,
    .input-validation-error:hover {
        box-shadow: none;
    }

.field-validation-error {
    display: block;
    font-size: 1.3rem;
    line-height: 1.5;
    font-weight: 500;
    background-color: #C00;
    color: #FFF;
    padding: 0.7rem 1rem;
    border-bottom-right-radius: 0.5rem;
    border-bottom-left-radius: 0.5rem;
}

#code_invitation.input-validation-success {
    border-color: #08b400;
} 

#total {
    font-size: 1.8rem;
    line-height: 1;
    background-color: #C0CF00;
    color: #FFF;
    width: 28rem;
    font-weight: 500;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: right;
    border-radius: 0.5rem;
}

#totalttc {
    background-color: #FFF;
    font-size: 2.4rem;
    font-weight: 500;
    color: var(--color-primary);
    height: 5.4rem;
    width: 13rem;
    margin-left: 1.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 1rem;
    border: 0.15rem solid #C0CF00;
    border-top-right-radius: 0.5rem;
    border-bottom-right-radius: 0.5rem;
}

@media (max-width: 767px) {
    #nv-adr-oui.mlm {
        margin: 0;
    }
}
#nv-adr label {
    padding-left: 0;
}

.submit {
    text-align: center;
    margin: 4rem 0 0 0;
}
    .submit input {
        font-size: 1.8rem;
        line-height: 1;
        font-weight: 500;
        color: #FFF;
        background-color: #C0CF00;
        max-width: 20rem;
        height: auto;
        border: 0;
        padding: 2rem;
        cursor: pointer;
        margin: 0;
    }
        .submit input:hover {
            background-color: var(--color-primary);
        }

        .submit input.loading {
            background-image: url("public/theme/images/loading.svg");
            background-size: 25px 25px;
            background-position:right center;
            background-repeat: no-repeat;
        }

.mentions {
    font-size: 1.2rem;
    line-height: 1.7;
    margin-top: 6rem;
    text-align: center;
}
@media (max-width: 1023px) {
    .mentions {
        margin-top: 4rem;
    }
}

.title-icone.w150 {
    width: 15rem;
}

/* Maison du hand : class image 
height 5rem
aidil 3rem
page  3.5rem
*/

.titre-etape {
    display: none;
}