@font-face {
    font-family: "raleway-regular";
    src: url("../Fonts/raleway-regular.ttf") format("woff2"),
    url("../Fonts/raleway-regular.ttf") format("woff");
}

body.pquizQuiz,
div.pquizQuiz {
    width: 90%;
    margin: 50px auto 0;
    font-size: 14px;
    clear: both;
    font-family: Arial, sans-serif;
}

.pdocNavBar .colFirst { text-align: left; }
.pdocNavBar .colLast { text-align: right; }
.col111 .colFirst,
.col111 .col { width: 32%; }
.colLast {
    margin: 0;
    padding-left: 1%;
}
.colFirst {
    margin: 0;
    padding-right: 1%;
    float: left;
}

.pdocHeader hr,
.pdocFooter hr{ display : none; }

.didierSubject{
    display: inline-block;
    padding: 2px 15px;
    float: right;

    text-align:center;
    font-size: 24px;
    text-decoration: underline;
    text-decoration-color: #fbad18;
    color: #ffffff;

    background: #fbad18;
}
.didierSubject:first-letter { text-transform: uppercase; }
.didierDifficulty{
    display: inline-block;
    margin-top: 5px;
    margin-bottom: 25px;
    padding: 0 33px;
    float: right;

    font-family: "raleway-regular", sans-serif;
    font-size: 20px;
    color: #fbad18;
    clear: both;
}
.didierDifficulty:before{ content: "Niveau "; }
h1{clear: both;}
h1 span.pdocTitle,
h1.pdocTitle{
    font-family: "raleway-regular", sans-serif;
    font-size: 24px;
    color: #9b235b;
    font-variant: all-small-caps;
}

.pquizElements{padding-left: 0;}

.pquizInstructions > .pdocP.first:first-child,
.pquizInstructions > .pdocSection1.first .first{
    font-size: 16px;
    font-weight: bold;
    color: #000000;
}
.pquizInstructions .pdocP{
    font-size: 16px;
    font-weight: normal;
    color: #000000;
}

form .pquizSubmit,
form .pquizSubmit:hover,
form .pquizRedo,
form .pquizRedo:hover,
form .pquizRetry,
form .pquizRetry:hover,
form .pquizUserAnswer,
form .pquizUserAnswer:hover,
form .pquizRightAnswer,
form .pquizRightAnswer:hover,
.pquizRightAnswer.pquizButton,
.pquizRightAnswer.pquizButton:hover,
.pquizButtons .pquizRedo,
.pquizButtons .pquizRedo:hover,
.pquizButtons a.pquizUserAnswer,
.pquizButtons a.pquizUserAnswer:hover,
.pdocAnimButton.pdocAnimClearDrawCanvas,
.pdocAnimButton.pdocAnimClearDrawCanvas:hover{
    padding: 10px 15px;
    font-size: 16px;
    letter-spacing: 2px;
    color: #ffffff;
    border: none;
    border-radius: 2px;
}
.pquizButton{ font-family: "raleway-regular", sans-serif; }
form .pquizSubmit,
form .pquizRedo,
form .pquizRetry,
form .pquizUserAnswer,
form .pquizRightAnswer,
.pquizRightAnswer.pquizButton,
.pquizButtons .pquizRedo,
.pquizButtons .pquizRedo:hover,
.pquizButtons a.pquizUserAnswer,
.pquizButtons a.pquizUserAnswer:hover{ margin-bottom: 20px; }

form .pquizSubmit,
form .pquizSubmit:hover,
form .pquizRedo,
form .pquizRedo:hover,
form .pquizRetry,
form .pquizRetry:hover,
form .pquizRightAnswer,
form .pquizUserAnswer,
form .pquizUserAnswer:hover,
.pquizButtons .pquizRedo,
.pquizButtons .pquizRedo:hover,
.pquizButtons a.pquizUserAnswer,
.pquizButtons a.pquizUserAnswer:hover{ background: #61b444 !important; }


.pdocAnimButtons,
.pquizButtons {background-color: #fff !important; }

form .pquizRightAnswer,
form .pquizRightAnswer:hover,
a.pdocAnimButton.pdocAnimClearDrawCanvas,
a.pdocAnimButton.pdocAnimClearDrawCanvas:hover,
.pquizRightAnswer.pquizButton,
.pquizRightAnswer.pquizButton:hover{ background: #ef4030; }

.pdocP input,
.pdocTable input { font-size: 14px; }

input.answerOk, textarea.answerOk,
.pquizCategoryLegendItem.answerOk,
.pquizCategoryDrop.answer .pquizCategoryItem.answerOk,
.pquizCategoriesItems.answer .pquizCategoryItem.answerOk,
.pquizSelectChoices.answerOk,
.answerOk{ border-bottom: 2px solid #5dbc56 !important; }


.pquizDropzone.pquizDrop.answerKo ,
.pquizDropzone.pquizDrop.answerOk {border-bottom: 0 none !important}
.pquizDropzone.pquizDrop.answerOk .pquizItemDropped { border-bottom: 2px solid #5dbc56 !important;}
.pquizDropzone.pquizDrop.answerKo .pquizItemDropped { border-bottom: 2px solid #ef4030 !important;}

.pquizChoiceCheckbox.selected.answerOk{ border-bottom: 0 none !important; }
.pquizChoiceCheckbox.selected.answerKo{ border-bottom: 0 none !important; }

td.pquizCategoryChoice.pquizChoiceRadio.selected.answerOk,
.pquizCategoryChoice.pquizChoiceRadio.selected.answerKo {border-bottom: 0 none !important}

.pquizSelectChoices.answerKo,
input.answerKo, textarea.answerKo,
input.answerKo, textarea.answerKo,
.answerKo{ border-bottom: 2px solid #ef4030 !important; }


.pquizDrop.answerOk .pquizItem{
    border: none;
    background: #d8efee;
    margin-bottom: 0;
}
.pquizDrop.answerKo .pquizItem{
    border: none;
    background: #f09aa1;
    color: #fff;
    margin-bottom: 0;
}

.pdocImage.pdocImageDropzone .pquizDropzone.pquizDrop.answerOk .pquizItem.pquizItem.pquizItemImage.pquizItemDropped.pquizItemImageDropped,
.pdocImage.pdocImageDropzone .pquizDropzone.pquizDrop.answerKo .pquizItem.pquizItem.pquizItemImage.pquizItemDropped.pquizItemImageDropped{
    background: transparent;
}

.pquizGlobalScore{
    font-family: "raleway-regular", sans-serif;
    font-size: 18px;
    text-transform: uppercase;
    color: #fbad18;
}
.pquizScoreButton.pquizButton{
    font-family: "raleway-regular", sans-serif;
    text-transform: uppercase;
    font-size: 18px;
}
.didierStrategyText,
.pquizStrategyText,
.didierScriptText,
.didierExplanationText{
    display: none;
    margin-top: 1em;
    padding: .5em;
}

.didierScriptText legend{ color : #61b444; }
.didierScriptText{ border: 1px solid #61b444; }
/*.didierScriptText .pdocSection1.first #sect2{ margin-bottom: -10px; }*/
.didierScriptText ol.pdocList {padding: 0 15px; }

.didierStrategyText,
.pquizStrategyText{ border: 1px solid #F2CB12; }


.didierExplanationText{ border: 1px solid #9b235b; }
.didierExplanationText legend{color: #9b235b; }


.pdocAnimButton, .pquizButton,
.pdocAnimButton:hover, .pquizButton:hover{
    border: none;
    background: none;
}

.pdocAudioPlayer span[data-player="button-play"].pause, .pdocAudioPlayer div[data-player="button-play"].pause{ background-image: url(../Images/player_green_pause.png); }
.pdocAudioPlayer span[data-player="button-play"].play, .pdocAudioPlayer div[data-player="button-play"].play{ background-image: url(../Images/player_green.png); }

input{
    border: 0 none;
    font-size: 14px;
    background-color: #fff;
    padding: 2px;
    border-bottom: 2px dotted grey;
    font-family: Arial, sans-serif;
}

.pdocAudioPlayer [data-player="cursor"]{ background: #61b444; }

.pquizPoint{ background: #d8efee; }
.pquizPoint.selected{ background: #21bdb7; }

.pdocTable th{text-align: center;}
.pdocTable th, .pdocTable td{ border: 1px solid #9b235b;    color: #000 !important; }

.pquizInstructions .pdocTable td ,
.pquizInstructions .pdocP.pdocTable td ,
.pdocSection-instructions .pdocTable td ,
.pdocSection-instructions .pdocP .pdocTable td {
    font-weight: normal!important;
    color: #000 !important;
}

.pdocHighlight {font-weight: bold;}

.publiquiz {clear: both;}

.pquizChoiceRadio.selected.answerOk::before{ color: #5dbc56;margin-right: 15px; }
.pquizChoiceCheckbox.selected.answerOk::before{ color: #5dbc56;margin-right: 15px; }
.pquizChoiceRadio.selected.answerKo::before{ color: #ef4030; margin-right: 15px;}
.pquizChoiceCheckbox.selected.answerKo::before{ color: #ef4030; margin-right: 15px;}

.pquizChoiceCheckbox::before{ content: url("../Images/case-a-cocher_seule.png");margin-right: 15px; }
.pquizChoiceCheckbox.selected::before{ content: url("../Images/case-a-cocher_bleu.png");margin-right: 15px; }
.pquizChoiceCheckbox.answerKo::before{ content: url("../Images/case-a-cocher_faux.png");margin-right: 15px; }
.pquizChoiceCheckbox.answerOk::before{ content: url("../Images/case-a-cocher_juste.png");margin-right: 15px; }

.pquizChoiceRadio::before{ content: url("../Images/case-a-cocher_seule.png");margin-right: 15px; }
.pquizChoiceRadio.selected::before{ content: url("../Images/case-a-cocher_bleu.png");margin-right: 15px; }
.pquizChoiceRadio.answerKo::before{ content: url("../Images/case-a-cocher_faux.png"); margin-right: 15px;}
.pquizChoiceRadio.answerOk::before{ content: url("../Images/case-a-cocher_juste.png");margin-right: 15px; }


.pquizItem,
.pquizItem.dragging,
.pquizCategory, .pquizCategoryItem{
    position : relative;
    border: none;
    border-radius: 0;
    background-color: #2196bd;
    color: #fff;
    font-size: 16px;
}
.pquizItemImage,
.pquizItemImage.dragging{
    border-radius: 0;
    border: 2px solid #2196bd;
    background: transparent;
    color: #fff;
    font-size: 16px;
}

.pquizItemAudio,
.pquizItemAudio.dragging{
    background-color : transparent;
    border :1px solid #21bdb7;
    color: #000;
}

span.pquizItem.pquizItemDropped,
.pquizCategoryItem.pquizCategoryItemDropped{
    border: none;
    border-radius: 0;
    background-color: #21bdb7;
    color: #fff;
    font-size: 16px;
}
span.pquizItemImage.pquizItemDropped{
    border-radius: 0;
    background-color: transparent;
    border: 2px solid #21bdb7;
    color: #fff;
    font-size: 16px;
}


/* ~~~~~~~ pdocMedia ~~~~~~~~ */

.pdocMedia {
    position: relative;
    font-family: sans-serif;
}

/* ~~~~~~~ pdocImage ~~~~~~~~ */

.pdocImage {
    max-width: 100%;
    max-height: 100%;
}

.pdocImageHotspot,
.pdocImageDropzone {
    float: left;
    position: relative;
    line-height: 0;
}

/* ~~~~~~ pquizDropzone ~~~~~~ */

.pdocHotspot, .pdocHotspotSpot,
.pquizDropzone {
    font-family: sans-serif;
    line-height: 2em;
    text-align: left;
}


.pquizCompositeNext img,
.pquizCompositePrevious img{ width: 30px; }

.pquizCompositeNext img{ margin-left: 20px; }

ul.pdocList{
    list-style: disc;
    font-size: 14px;
    color : #000;

}
ul.pdocList li p{ color : #000000 ;}
.pdocList-ordered ol{list-style-type: lower-latin; }

.noclue .pquizPoint.pquizBgColor1, .pquizBgColor1{ background-color: #21bdb7; }
.pquizQuiz-phonetique [data-engine="pointing-categories"] .pquizPoint.answerKo.pquizBgColor1,
.pquizQuiz-phonetique[data-engine="pointing-categories"] .pquizPoint.answerKo.pquizBgColor1{
    border-bottom :none !important;
    border-top: 2px solid #ef4030 !important;
}
.pquizQuiz-phonetique [data-engine="pointing-categories"] .pquizPoint.answerOk.pquizBgColor1,
.pquizQuiz-phonetique[data-engine="pointing-categories"] .pquizPoint.answerOk.pquizBgColor1{
    border-bottom: none !important;
    border-top: 2px solid #5dbc56 !important;
}

[data-engine="pointing-categories"] .pquizCategory,
[data-engine="pointing-categories"] .pquizCategory{
    background : transparent;
    color : #000;
    border: 1px solid #7f7f7f;
    border-radius: 5px;
}

[data-engine="pointing-categories"] .pquizCategory.selected,
[data-engine="pointing-categories"] .pquizCategory.selected{ background : #0086cb; color : #ffffff; }

.noclue .pquizPoint.pquizBgColor2, .pquizBgColor2{ background-color: #ff8a67; }

.noclue .pquizPoint.pquizBgColor3, .pquizBgColor3{ background-color: #fbad18; }

.pdocSection-article{ background : #eeeeee; padding: 20px 0 20px 0; }
.pquizInstructions .pdocSection-article{ font-weight: normal !important; }

.pdocSection-blog{ background : #c6e7e6; padding: 20px 0 20px 0; }
.pquizInstructions .pdocSection-blog{ font-weight: normal !important;}

.pdocSection-article input,
.pquizInstructions .pdocSection-article input,
.pdocSection-blog input,
.pquizInstructions .pdocSection-blog input{ padding : 3px 5px 3px; }

.pdocSection-article,
.pdocSection-blog{ padding: 10px; }

.pquizChoice.pquizChoiceRadio img{margin-left: 20px;}

li.pquizChoice.pquizChoiceRadio:before{
    display: inline-block;
    width: 20px;
}
li.pquizChoice.pquizChoiceRadio.answerOk,
li.pquizChoice.pquizChoiceRadio.answerKo{ border-bottom: none !important; }


.pquizNoMark .answerOk,
.pquizNoMark .answerKo{ border-bottom: 0 none !important;}

.pquizElement.pquizNoMark fieldset {display: none!important;}

.pquizNoMark .pquizPoint.selected.answerOk,
.pquizNoMark .pquizPoint.selected.answerKo{ border-bottom: 0 none !important;}

.pquizNoMark .pquizDrop.answerOk
.pquizNoMark .pquizDrop.answerKo{ border-bottom: 0 none !important;}

.pquizNoMark .answerOk.pquizChoiceCheckbox.selected::before,
.pquizNoMark .answerKo.pquizChoiceCheckbox.selected::before {
    content: url("../Images/case-a-cocher_bleu.png");
    margin-right: 15px;
}

textarea.pquizChoice{width: 100%;}

.pdocPhonetic{
    font-family: "raleway-regular", sans-serif;
    font-weight: normal;
    font-variant: all-small-caps;
}
.pdocTable.pdocTable-noline-noexpand th{
    border: 0;
    background-color: initial;
}

.pquizQuiz-top-line .answerKo,
.pquizQuiz-top-line .answerKo{
    border-bottom : none !important;
    border-top: 2px solid #ef4030 !important;
}

.pquizQuiz-top-line .answerOk {
    border-bottom : none !important;
    border-top: 2px solid #5dbc56 !important;
}

@media screen and (max-width: 360px){
    .pdocAudioPlayer{
        width: 100%;
        margin-bottom: 80px;
    }
    .pdocAudioPlayer .play{ width: 15%; }
    .pdocAudioPlayer [data-player="player-info"]{ width: 80%; }
    .pdocAudioPlayer [data-player="timeline"]{ width: 100%; }
}