@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: 52px auto 0;
    font-size: 18px;
    clear: both;
    font-family: Arial, sans-serif;
}

/* ~~~~~ pdocHighlight (color) ~~~~~*/

.pdocHighlightColor1 { text-decoration: none; color: #a36aac;}
.pdocHighlightColor2 { text-decoration: none; color: #00c0b4;}
.pdocHighlightColor3 { text-decoration: none; color: #f36f21;}
.pdocHighlightColor4 { text-decoration: none; color: #6abd49;}
.pdocHighlightColor5 { text-decoration: none; color: #f05296;}
.pdocHighlightColor6 { text-decoration: none; color: #fbad18;}
.pdocHighlightColor7 { text-decoration: none; color: #ff8a67;}
.pdocHighlightColor8 { text-decoration: none; color: #ea3c69;}
.pdocHighlightColor9 { text-decoration: none; color: #9b235b;}
.pdocHighlightColor10 { text-decoration: none; background-color: #ff8a67;border-radius: 3px;}
.pdocHighlightColor11 { text-decoration: none; color: #fff; background-color: #0086cb;border-radius: 3px;}
.pdocHighlightColor12 { text-decoration: none; background-color: #00c0b4;border-radius: 3px;}



/* ~~~~~~~ pdocNavBar ~~~~~~ */

.pdocNavBar .col { text-align: center; }
.pdocNavBar .colLast { text-align: right; }
.pdocNavBar hr { clear: both; color: #e5e5e5; }
.pdocNavBar a { border: none; }
.pdocNavBar a:hover { background-color: transparent; }
.pdocToc .pdocNavBar,
.pdocToc .pdocNavBar div { padding-top: 0; }
.pdocToc .pdocNavBar a { padding: 0; }

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

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


/* ~~~~~~ didierSubject ~~~~~~ */
.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, .pquizChoiceCheckbox.selected.answerKo{border-bottom: none  !important;}

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

td.pquizChoiceCheckbox.selected.answerOk,
td.pquizChoiceCheckbox.selected.answerKo{ border-bottom: 1px solid #9b235b  !important; }

td.pquizCategoryChoice.pquizChoiceRadio.selected.answerOk,
td.pquizCategoryChoice.pquizChoiceRadio.selected.answerKo {border-bottom: 1px solid #9b235b !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 : #3b71b8; }
.didierScriptText{ border: 1px solid #3b71b8; }
/*.didierScriptText .pdocSection1.first #sect2{ margin-bottom: -10px; }*/
.didierScriptText ol.pdocList {padding: 0 15px; }

.didierStrategyText,
.pquizStrategyText{ border: 1px solid #ea3c69; }
.didierStrategyText legend{color:#ea3c69;}


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

.pquizHelpText{ border: 1px solid #6abd49; }
.pquizHelpText legend{color: #6abd49; }

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

.pdocAnimButton.pdocAnimClearDrawingCanvas{
    border:#6abd49 solid 2px;
    text-shadow: none;
    color:black;
}

.pdocAnimButton.pdocAnimClearDrawingCanvas:hover{
    background-color: #6abd49;
    color:#fff;
}

.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; }

.pdocTable.pquizTableCategories table {width:80%}
.pdocTable.pquizTableCategories tbody th{text-align: left;}

.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;
}

.pquizItem.cat1, .pquizChoice.cat1 {
    background-color: #21bdb7;
    color: #fff;
}
.pquizItem.cat1.pquizItemDropped {
    background-color: #21bdb7;
    color: #fff;
}

.pquizItem.cat2, .pquizChoice.cat2 {
    background-color: #fbad18;
    color: #fff;
}

.pquizItem.cat2.pquizItemDropped {
    background-color: #fbad18;
    color: #fff;
}

.pquizItem.cat3, .pquizChoice.cat3 {
    background-color: #ff8a67;
    color: #fff;
}

.pquizItem.cat3.pquizItemDropped {
    background-color: #ff8a67;
    color: #fff;
}



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

span.pquizItem.pquizItemDropped{
    margin-bottom:0;
}



.pquizCategoryItemDropped.answerKo, .pquizCategoryItemDropped.answerOk,.pquizCategoryItemDropped.pquizItemAudio.answerKo, .pquizCategoryItemDropped.pquizItemAudio.answerOk{
    color: #fff !important;
}


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


.pquizCategoriesBasket .legend{
    font-size: 100%;
}

/* ~~~~~~~ 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;
    text-shadow:none;
}


.pquizCompositeNavigation{
    display:flex;
    flex-direction: row;
    justify-content: space-evenly;
}

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



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; }

.noclue .pquizPoint.pquizBgColor4, .pquizBgColor4{ background-color: #f05296; }

.noclue .pquizPoint.pquizBgColor5, .pquizBgColor5{ background-color: #a36aac; }

.noclue .pquizPoint.pquizBgColor6, .pquizBgColor6{ background-color: #c0c0ff; }

.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%;}

h1 .pdocPhonetic {
    font-size: 19px;
    margin: 0 2px;
}
.pdocPhonetic{
    font-family: "raleway-regular", sans-serif;
    font-weight: normal;
}
.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%; }
}

input[maxlength="1"]{
    border: 0.8px solid grey;
    text-align: center;
}