
.blocChalkBoard {
    position : relative;
    float : left;
    width : 140px;
    height : 150px;
    padding : 4px;
    border : 1px solid #ddd;
    background-position: center 15px;
    background-repeat: no-repeat;
    border-radius: 7px;
    cursor : pointer;
    margin : 5px;
    border-radius : 2px;
}
.blocChalkBoard:hover {
    background-color:#EBEDEF;
}

.ludiButtonSave {
    background-color: cornflowerblue;
    color: white;
    border: solid 1px rgb(72, 113, 189);
    padding: 10px;
    padding-top: 7px;
    padding-bottom: 7px;
    border-radius: 6px;
    margin: 2px;
    font-size: 14px;
    cursor: pointer;
    color: white;
    text-align: center;
}


.hide-ctrlstudio {
    display : none;
}

.blocMood:hover {
    background-color:#ffde83;
}

.blocChalkBoard .titleChalkBoard {
    position : absolute;
    background-color: #CEE3F6;
    text-align: center;
    left : 0px;
    bottom : 0px;
    right : 0px;
    padding-top: 5px;
    padding-bottom: 5px;
    min-height: 5px;
}

.pell-content h5{
    font-size : 18px;
    font-weight : bold;
    margin-top : 10px;
    margin-bottom : 10px;
}
.pell-content p{
   margin-left : 10px;
}

.iconimage{
    width:30px;
    background-image : url("../img/icon-image.png");
    background-position : center center;
    background-repeat : no-repeat;
}
.icontitle{
    width:30px;
    background-image : url("../img/icon-title.png");
    background-position : center center;
    background-repeat : no-repeat;
}
.iconlist{
    width:30px;
    background-image : url("../img/icon-list.png");
    background-position : center center;
    background-repeat : no-repeat;
}

.btnAddText{
    position : relative;
    border : 0px solid #ddd;
    width : 32px;
    height : 42px;
    cursor : pointer;
    background-image : url("../img/fieldadd.gif");
    background-position : center center;
    background-repeat : no-repeat;
}

#interface-contain{
    background-image : url("../img/object-zone.png");
    background-position : left center;
    background-repeat : no-repeat;
    border-top : solid 2px #D4E6F1;
    border-bottom : solid 2px #D4E6F1;
    padding-bottom : 20px;
    margin-bottom : 2px;
}

.tutocraft-icon{
    background-image : url("../img/object-tutocraft.png")!important;
}

#reviewImg {
    position : absolute;
    left : 0px;
    top : 0px;
    width : 100%;
}
#interface-editorzone {
    position : absolute;
    left : 0px;
    top : 0px;
    width : 100%;
    height : 100%;
}

.turnpages{
    background-image: url("../img/turnpages.png");
}
.turnactivepage{
    background-image: url("../img/turnactivepage.png");
}


.hvpcompildragdrop{
    background-image: url("../img/hvpcompildragdrop.png");
}

.hvpcrossword{
    background-image: url("../img/hvpcrossword.png");
}
.hvpwordsmatch{
    background-image: url("../img/hvpwordsmatch.png");
}
.hvpimagejuxapose{
    background-image: url("../img/hvpimagejuxapose.png");
}
.hvpdragthewords{
    background-image: url("../img/hvpdragthewords.png");
}
.hvpmarkthewords{
    background-image: url("../img/hvpmarkthewords.png");
}
.hvpfillintheblanks{
    background-image: url("../img/hvpfillintheblanks.png");
}

.videocondition{
    background-image: url("../img/videocondition.png");
}
.videoandactivity{
    background-image: url("../img/videoandactivity.png");
}
.videoscreenlock{
    background-image: url("../img/videoscreenlock.png");
}

.cachecacheword{
    background-image: url("../img/gameletter.png");
}
.solarsystem{
    background-image: url("../img/solarsystem.png");
}
.gameimageactive{
    background-image: url("../img/gameimageactive.png");
}
.winanim01{
    background-image: url("../img/winanim01.png");
}
.winanim02{
    background-image: url("../img/winanim02.png");
}
.winanim03{
    background-image: url("../img/escapecode.png");
}

.quizzacademy{
    background-image: url("../img/quizzacademy.png");
}
.quota{
    background-image: url("../img/quota.png");
}
.htmlpresenter {
    background-image: url("../img/htmlpresenter.png");
}
.linktoconference {
    background-image: url("../img/linktoconference.png");
}

.videohelper{
    background-image: url("../img/videohelper.png");
}
.hvphelper{
    background-image: url("../img/hvphelper.png");
}
.modxlightboxgallery{
    background-image: url("../img/modxlightboxgallery.png");
}

.learningcoins1{
    background-image: url("../img/learningcoin-1.png");
}
.learningcoins5{
    background-image: url("../img/learningcoin-5.png");
}

.quizpresenter{
    background-image: url("../img/quizpresenter.png");
}

#uploadManagerWindows {
    position : fixed;
    z-index : 10003;
    border : solid 3px #2575be;
    background-color : white;
    top : 50%;
    left : 50%;
    width : 580px;
    height : 470px;
    margin-left : -290px;
    margin-top : -225px;
    z-index : 102;
}
.uploadManagerWindows_cover {
    position : fixed;
    background-color : rgb(143, 143, 143);
    opacity : 0.5;
    top : 0px;
    left : 0px;
    right : 0px;
    bottom : 0px;
    z-index : 101;
}
.innerSelectUpload {
    position : absolute;
    left : 10px;
    top : 45px;
    right : 2px;
    bottom : 5px;
    padding : 0px;
    border:solid 0px green;
    background : white;
    overflow : hidden;
    z-index : 10010;
}
.frameUpload {
    position : relative;
    width : 97%;
    margin-left : 1%;
    height : 390px;
    border : solid 0px green;
    background : white;
    overflow : hidden;
    z-index : 10010;
}


#videoManagerWindows{
    position : fixed;
    z-index : 10003;
    border : solid 3px #2575be;
    background-color : white;
    top : 50%;
    left : 50%;
    width : 580px;
    height : 450px;
    margin-left : -290px;
    margin-top : -225px;
    z-index : 102;
}
.videoManagerWindows_cover{
    position : fixed;
    background-color : rgb(143, 143, 143);
    opacity : 0.5;
    top : 0px;
    left : 0px;
    right : 0px;
    bottom : 0px;
    z-index : 101;
}
.innerSelectVideo{
    position : absolute;
    left : 10px;
    top : 45px;
    right : 2px;
    bottom : 5px;
    padding : 20px;
    border:solid 0px green;
    background : white;
    overflow : hidden;
    z-index : 10010;
}
.inputLargeVideo {
    width : 520px;
    padding : 6px;
    border : solid 1px gray;
}

.closeZii {
    position : absolute;
    display : block;
    right : 5px;
    top : 5px;
    width : 20px;
    height : 20px;
    line-height : 20px;
    border : solid 1px green;
    font-size : 18px;
    text-align : center;
    cursor : pointer;
}

.bubblenumberpageedit {
    position : relative;
    display : inline-block;
    width : 30px;
    height : 30px;
    line-height : 30px;
    font-size : 18px;
    text-align : center;
    cursor : pointer;
    border: solid 3px #28be25;
    background-color : white;
    background-repeat : no-repeat;
    background-image : url("../img/edit.png");
    background-position : center center;
    border-radius : 15px;
}


#quizzManagerWindows{
    position : fixed;
    z-index : 10003;
    border : solid 3px #2575be;
    background-color : white;
    top : 50%;
    left : 50%;
    width : 580px;
    height : 520px;
    margin-left : -290px;
    margin-top : -265px;
    z-index : 102;
}
.quizzManagerWindows_cover{
    position : fixed;
    background-color : rgb(143, 143, 143);
    opacity : 0.5;
    top : 0px;
    left : 0px;
    right : 0px;
    bottom : 0px;
    z-index : 101;
}

.iconhvp{
    position : absolute;
    left : 0px;
    top : 0px;
    width : 38px;
    height : 20px;
    background-repeat: no-repeat;
    background-image: url("../img/hvp.png");
}

.iconmod{
    position : absolute;
    left : 0px;
    top : 0px;
    width : 28px;
    height : 32px;
    background-repeat: no-repeat;
    background-image: url("../img/chamiloodle.png");
}

.blocSeparatorLine{
    display : block;
    margin : 0px;
    padding : 0px;
    margin-top : 6px;
    height : 6px;
    border-top : solid 0px gray;
}
.blocSeparatorLineBlue{
    display : block;
    margin : 0px;
    padding : 0px;
    margin-top : 6px;
    height : 6px;
    border-top : solid 0px #D4E6F1 ;
}
.blocEditor{
    width:98%;
    border : 1px solid #ccc;
}

.zoneButtonLeftZA{
    position : relative;
    float : left;
    text-align : center;
    width : 10%;
    margin-right : 1%;
    height : 160px;
    margin-top : 1%;
}
.zoneButtonRightZA{
    position : relative;
    float : left;
    width : 85%;
    border : solid 2px black;
    margin-top : 1%;
    margin-bottom : 1%;
    overflow: hidden;
}

.buttonZA{
    position : relative;
    display : block;
    padding : 2px;
    margin : 1px;
    margin-left : 11%;
    width : 80%;
    border-radius : 9px;
    font-size : 26px;
    text-align : center;
    cursor : pointer;
    border : solid 1px #626262 ;
    text-decoration : none;
}
.buttonZA:hover{
    text-decoration: none;
}

.buttonXY{
    position : relative;
    display : block;
    padding : 2px;
    margin : 1px;
    margin-left : 11%;
    width : 80%;
    border-radius : 9px;
    font-size : 12px;
    text-align : center;
    cursor : pointer;
    text-decoration : none;
}

.actioneditorwin{
    position : absolute;
    left : 50%;
    top : 50%;
    width : 400px;
    height : 240px;
    margin-left : -200px;
    margin-top : -120px;
    display : none;
    background-color : white;
    border : solid 2px #626262;
    z-index : 100;
}
.actioneditorwintitle{
    position : absolute;
    left :-1px;
    top : 0%;
    right : -1px;
    padding : 7px;
    color :white;
    background-color : #626262;
    z-index : 100;
}
.actioneditorwinclose{
    position : absolute;
    right : 5px;
    top : 3px;
    font-size: 15px;
    width : 30px;
    height : 28px;
    text-align: center;
    color : white;
    border : solid 0px white;
    cursor : pointer;
}

.actionZASelect{
    position : absolute;
    left : 15px;
    top : 50px;
}

.checkTyp01{
    position : absolute;
    left : 15px;
    top : 174px;
}
.checkTyp02{
    position : absolute;
    left : 15px;
    top : 200px;
}

.actionZAtextArea{
    position : absolute;
    left : 15px;
    top : 85px;
    resize: none;
}

.actionBtnSave{
    position : absolute;
    right : 24px;
    bottom : 15px;

}

.areaZA{
    position : absolute;
    width : 10%;
    height : 10%;
    cursor : move;
    border : solid 2px red ;
    background-image: url("../img/backtrans.png");
    background-position: center center;
    z-index : 98;
}

.paramsZA{
    position : absolute;
    right : -23px;
    top : -23px;
    cursor : pointer;
    width : 30px;
    height : 30px;
    border-radius: 15px;
    border : solid 1px #626262 ;
    background-color: rgb(255, 255, 255);
    background-image: url("../img/maj.png");
    background-position: center center;
    background-repeat: no-repeat;
    z-index : 99;
}

.noselect {
    -webkit-touch-callout: none; /* iOS Safari */
      -webkit-user-select: none; /* Safari */
       -khtml-user-select: none; /* Konqueror HTML */
         -moz-user-select: none; /* Old versions of Firefox */
          -ms-user-select: none; /* Internet Explorer/Edge */
              user-select: none; /* Non-prefixed version, currently
                                    supported by Chrome, Edge, Opera and Firefox */
  }
.btnslidesclassic {
    background-color: cornflowerblue;
    color: white;
    border: solid 1px rgb(72, 113, 189);
    padding: 10px;
    padding-top: 7px;
    padding-bottom: 7px;
    border-radius: 6px;
    margin: 2px;
    font-size: 14px;
    cursor: pointer;
    text-align: center;
}
.btnslidesstyle {
    background-image: url(../icon/btnstyle.png);
    background-repeat: no-repeat;
    background-position: center center;
    color: white;
    border: solid 1px rgb(72, 113, 189);
    padding: 10px;
    padding-top: 7px;
    padding-bottom: 7px;
    border-radius: 6px;
    margin: 2px;
    font-size: 14px;
    cursor: pointer;
    text-align: center;
}

.closeSlidesZii {
    position: absolute;
    display: block;
    right: 5px;
    top: 5px;
    width: 20px;
    height: 20px;
    line-height: 20px;
    border: solid 0px green;
    font-size: 18px;
    text-align: center;
    cursor: pointer;
}
.headerSlidesZone {
    position: absolute;
    left:0px;
    top:0px;
    right:0px;
    height: 36px;
    background-color: #E6E6E6;
    border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}
#ZoneInImagesManage {
    overflow : hidden;
    border-radius: 3px;
    transition : all 0.3s;
}
.addFlipBtnA {
    margin-left : -56px;
    user-select : none;
}
.addFlipBtnB {
    margin-left : -13px;
    user-select: none;
}
.addFlipBtnC {
    margin-left : 33px;
    user-select : none;
}
.addFlipBtn {
    position : absolute;
    display : inline-block;
    left : 50%;
    top : 4px;
    width : 26px;
    height : 26px;
    line-height : 26px;
    font-size : 19px;
    text-align : center;
    cursor : pointer;
    background-color : #808080;
    color : white;
    border-radius : 15px;
}
.addFlipBtn:hover {
    background-color : #545454;
    color : yellow;
}

.ZoneInImagesMgA4 {
    position : fixed;
    border : solid 1px #7d7d7d;
    background-color : white;
    top : 50%;
    left : 50%;
    width : 540px;
    height : 700px; /* 0.77 */
    margin-left : -270px;
    margin-top : -350px;
    z-index : 104;
}
.headerSlidesTools {
    position : relative;
    background-image : url(../icon/headerslide.png);
    background-repeat : no-repeat;
    background-position : center center;
    left : 0px;
    top : 0px;
    right : 0px;
    height : 36px;
    background-color : #E6E6E6;
    border-bottom : 1px solid rgba(0, 0, 0, 0.2);
}

.ZoneSliderTools {
    position : fixed;
    left : 0px;
    top : 10px;
    width : 200px;
    height : 200px;
    background-color : #E6E6E6;
    border : 1px solid rgba(0, 0, 0, 0.2);
    border-top : solid 1px #7d7d7d;
    border-bottom: solid 1px #7d7d7d;
    border-right : none;
    border-left : none;
    overflow : hidden;
}
.ZoneSliderMenu {
    position : fixed;
    left : 0px;
    top : 10px;
    width : 50px;
    height : 200px;
    background-color : #273746;
    color : white;
    border-right : none;
    border-top: solid 1px #7d7d7d;
    border-bottom: solid 1px #7d7d7d;
    overflow : hidden;
}

.menuSliderTop {
    position : relative;
    float : left;
    width : 50px;
    height : 37px;
    padding : 7px;
    margin-bottom : 2px;
}

.menuSliderBlock {
    position : relative;
    float : left;
    width : 50px;
    height : 50px;
    padding : 7px;
    background-color : #273746;
    margin-bottom : 2px;
    border : 1px solid gray;
    border-right : none;
    cursor : pointer;
}
.menuSliderBlock:hover {
    background-color : #cecece;
}
.menuSliderBlock:hover svg {
    filter: invert(1);
}

.menuSliderBlockActive {
    position : relative;
    float : left;
    width : 50px;
    height : 50px;
    padding : 7px;
    background-color : white;
    margin-bottom : 2px;
    border : 1px solid white;
    border-right : none;
}
.menuSliderBlockActive svg {
    filter: invert(1);
}

.slider-tab0 {
    position : relative;
    float : left;
}
.slider-tab1 {
    position : relative;
    float : left;
    display : none;
}

.slider-draggable {
    position : relative;
    float : left;
    margin-left : 5px;
    margin-top : 5px;
    width : 78px;
    height : 90px;
    background-color : white!important;
    background-position : center center;
    border : 1px solid rgba(0, 0, 0, 0.2);
    border-radius : 5px;
    cursor : move;
}
.slider-draggable:active {
    cursor: grabbing;
    cursor: -moz-grabbing;
    cursor: -webkit-grabbing;
}

.clipart-draggable {
    position : relative;
    float : left;
    margin-left : 5px;
    margin-top : 0px;
    width : 78px;
    height : 90px;
    background-color : #E6E6E6!important;
    background-position : center center;
    border : 1px solid transparent;
    border-radius : 5px;
    cursor : move;
}
.clipart-draggable:active {
    cursor: grabbing;
    cursor: -moz-grabbing;
    cursor: -webkit-grabbing;
}

.slider-pages-obj {
    position : relative;
    float : left;
    margin-left : 10px;
    margin-top : 5px;
    width : 137px;
    height : 90px;
    background-color : #F2F4F4!important;
    background-position : center center;
    background-repeat: no-repeat;
    background-size : contain;
    border : 1px solid rgb(124, 124, 124);
    cursor : pointer;
    transition : all 0.3s;
}

.slider-pages-tools {
    overflow-y : auto;
    scrollbar-width: thin;
    scrollbar-color: #9f9f9f #ffffff;
}
.slider-pages-tools::-webkit-scrollbar {
    width: 6px;
}
.slider-pages-tools::-webkit-scrollbar-track {
    background: #ffffff;
}
.slider-pages-tools::-webkit-scrollbar-thumb {
    background-color: #9f9f9f;
    border-radius: 10px;
    border: 3px solid #ffffff;
}

.slider-dragtitle {
    position : absolute;
    left : 0px;
    bottom : 0px;
    width : 76px;
    height : 18px;
    line-height : 18px;
    font-size : 15px;
    text-align : center;
    background-color : transparent;
    color : gray;
}

.ZoneInImagesManagerWindows_cover{
    position : fixed;
    background-color : white;
    opacity : 0.9;
    top : 0px;
    left : 0px;
    right : 0px;
    bottom : 0px;
    z-index : 101;
}

.paramsQAA{
position : absolute;
right : -11px;
top : -21px;
cursor : pointer;
width : 20px;
height : 20px;
border-radius : 10px;
border : solid 1px #626262 ;
background-color: rgb(255, 255, 255);
background-image : url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" width="48px" height="48px"><path d="M 36 5.0097656 C 34.205301 5.0097656 32.410791 5.6901377 31.050781 7.0507812 L 8.9160156 29.183594 C 8.4960384 29.603571 8.1884588 30.12585 8.0253906 30.699219 L 5.0585938 41.087891 A 1.50015 1.50015 0 0 0 6.9121094 42.941406 L 17.302734 39.974609 A 1.50015 1.50015 0 0 0 17.304688 39.972656 C 17.874212 39.808939 18.39521 39.50518 18.816406 39.083984 L 40.949219 16.949219 C 43.670344 14.228094 43.670344 9.7719064 40.949219 7.0507812 C 39.589209 5.6901377 37.794699 5.0097656 36 5.0097656 z M 36 7.9921875 C 37.020801 7.9921875 38.040182 8.3855186 38.826172 9.171875 A 1.50015 1.50015 0 0 0 38.828125 9.171875 C 40.403 10.74675 40.403 13.25325 38.828125 14.828125 L 36.888672 16.767578 L 31.232422 11.111328 L 33.171875 9.171875 C 33.957865 8.3855186 34.979199 7.9921875 36 7.9921875 z M 29.111328 13.232422 L 34.767578 18.888672 L 16.693359 36.962891 C 16.634729 37.021121 16.560472 37.065723 16.476562 37.089844 L 8.6835938 39.316406 L 10.910156 31.521484 A 1.50015 1.50015 0 0 0 10.910156 31.519531 C 10.933086 31.438901 10.975086 31.366709 11.037109 31.304688 L 29.111328 13.232422 z"/></svg>');
background-size : 90% 90%;
background-position : center center;
background-repeat : no-repeat;
z-index : 99;
}

.resizeQAA{
position : absolute;
right : 0px;
top : 50%;
width : 10px;
height : 10px;
margin-top: -5px;
border-top-left-radius : 5px;
border-bottom-left-radius : 5px;
background-color: white;
border : solid 1px gray ;
cursor : e-resize;
}

.resizeHAA{
position : absolute;
left : 50%;
bottom : 0px;
width : 10px;
height : 10px;
margin-left: -5px;
border-top-left-radius : 5px;
border-top-right-radius : 5px;
background-color: white;
border : solid 1px gray ;
cursor : n-resize;
}

.areaQAA{
position : absolute;
min-width : 4%;
min-height : 4%;
cursor : move;
border : solid 1px red ;
background-image: url("../img/backtrans.png");
background-position: center center;
z-index : 98;
}

.areaQAA0{
position : absolute;
min-width : 4%;
min-height : 4%;
cursor : move;
border : solid 1px blue ;
background-image: url("../img/arealoupetrans.png");
background-position: center center;
z-index : 98;
}

.areaQAA1{
position : absolute;
min-width : 4%;min-height : 4%;
cursor : move;
border : solid 1px rgb(84, 110, 76) ;
background-image: url("../img/areanextpage.png");
background-position: center center;
z-index : 98;
}
.areaQAA2{
position : absolute;
min-width : 4%;min-height : 4%;
cursor : move;
border : solid 1px rgb(134, 88, 123) ;
background-image: url("../img/areaprevpage.png");
background-position: center center;
z-index : 98;
}
.areaQAA3{
position : absolute;
min-width : 4%;min-height : 4%;
cursor : move;
border : solid 1px rgb(219, 137, 36) ;
background-image: url("../img/areatopage.png");
background-position: center center;
z-index : 98;
}
.areaQAA4{
position : absolute;
min-width : 4%;min-height : 4%;
cursor : move;
background-color: rgb(164, 164, 164);
background-image: url('loupe.png');
background-position: center center;
background-repeat: no-repeat;
z-index : 98;
}
.areaQAA5{
position : absolute;
min-width : 4%;min-height : 4%;
cursor : move;
border : solid 1px rgb(219, 137, 36) ;
background-color: rgb(255, 255, 255);
background-position: center center;
z-index : 98;
}
.areaQAA6{
position : absolute;
min-width : 4%;min-height : 4%;
cursor : move;
border : solid 1px rgb(219, 137, 36) ;
background-image: url("../img/areatolink.png");
background-position: center center;
z-index : 98;
}
.areaQAA7{
position : absolute;
min-width : 4%;min-height : 4%;
cursor : move;
border : solid 1px rgb(1, 1, 1);
background-color :rgb(255, 255, 255,0.5);
background-position: center center;
z-index : 98;
}
.areaQAA8{
position : absolute;
min-width : 4%;min-height : 4%;
cursor : move;
border : solid 1px rgb(1, 1, 1);
background-color :rgb(255, 255, 255,0.5);
background-position: center center;
z-index : 98;
}
.areaQAA9,.areaQAA20{
position : absolute;
min-width : 4%;min-height : 4%;
cursor : move;
border : solid 1px rgb(1, 1, 1);
background-color : transparent;
background-size : contain;
background-position: center center;
z-index : 98;
}
.areaQAA10{
    position : absolute;
    min-width : 4%;min-height : 4%;
    cursor : move;
    border : solid 1px rgb(1, 1, 1);
    background-color : transparent;
    background-size : contain;
    background-position: center center;
    z-index : 98;
}

.styleQAA1{
    background-image : url("../icon/rendcursor.png");
    background-size : cover;
    background-color :rgb(255, 255, 255,0.1);
}
.styleQAA2{
    background-image : url("../icon/point-circle.svg");
    background-size : contain;
    background-color :rgb(255, 255, 255,0.1);
    background-repeat : no-repeat;
}
.styleQAA3{
    background-image : url("../icon/pointcircle3.svg");
    background-size : contain;
    background-color :rgb(255, 255, 255,0.1);
    background-repeat : no-repeat;
}
.styleQAA4{
    background-image : url("../icon/loupe4.svg");
    background-size : 45px 45px;
    background-color :rgb(255, 255, 255,0.1);
    background-repeat : no-repeat;
}
.styleQAA5{
    background-image : url("../icon/pointcircle5.svg");
    background-size : contain;
    background-color :rgb(255, 255, 255,0.1);
    background-repeat : no-repeat;
}
.iconQAA5{
    background-image : url("../icon/pointcircle5.svg");
    background-size : 45px 45px;
    background-color :rgb(255, 255, 255,0.1);
    background-repeat : no-repeat;
}
.styleQAA6{
    background-image : url("../icon/quiz6.svg");
    background-size : contain;
    background-color :rgb(255, 255, 255,0.1);
    background-repeat : no-repeat;
}
.styleQAA7{
    background-image : url("../icon/video7.svg");
    background-size : contain;
    background-color :rgb(255, 255, 255,0.1);
    background-repeat : no-repeat;
}
.styleQAA8{
    background-image : url("../icon/btnnext.svg");
    background-size : contain;
    background-color :rgb(255, 255, 255,0.1);
    background-repeat : no-repeat;
}
.styleQAA9{
    background-image : url("../icon/btnprev.svg");
    background-size : contain;
    background-color :rgb(255, 255, 255,0.1);
    background-repeat : no-repeat;
}
.iconQAA7{
    background-image : url("../icon/video7.svg");
    background-size : 45px 45px;
    background-color :rgb(255, 255, 255,0.1);
    background-repeat : no-repeat;
}

.editPageZii{
    position : absolute;
    text-align : center;
    background-color : white;
    border : solid 1px #626262 ;
    display :  none;
    right : 4px;
    top : 4px;
    background-image : url("../img/edit.png");
    background-position : center center;
    height : 25px;
    width : 25px;
    cursor : pointer;
    border-radius : 2px;
}

.numberPageZii{
    position : absolute;
    font-size : 14px;
    text-align : center;
    background-color : white;
    border : solid 1px #626262 ;
    right:5px;bottom:3px;
    height:27px;border-radius:6px;
    width:60px;padding:3px;
}

#logFlipA{
    position : absolute;
    font-size : 14px;
    text-align : center;
    background-color : white;
    border : solid 1px #626262 ;
    border-bottom: none;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    left : 50%;
    bottom : 0px;
    width : 200px;
    margin-left:-100px;
    height : 24px;
    line-height : 24px;
    z-index : 10014;
}

#loadSliderImgProcess {
    position : absolute;
    left : 0px;
    top : 0px;
    right : 0px;
    bottom : 0px;
    background-color : white;
    background-image : url(../icon/headerslide.png);
    background-repeat : no-repeat;
    background-position : center center;
    z-index : 10015;
}

.innerZiiArea , .editorZiiArea {
    position:absolute;
    left : 10px;
    top : 37px;
    right : 10px;
    height : 300px;
    overflow: hidden;
    border : dotted 1px #626262;
}
.innerZiiArea{
    background : white;
    overflow : hidden;
    transition: opacity 0.3s;
    z-index : 10010;
}
.editorZiiArea{
    overflow : hidden;
    z-index : 10012;
}

#QuickActiveAreaManager{
    position : fixed;
    z-index : 10003;
    border-radius: 3px;
    border : solid 1px #787878;
    background-color : white;
    top : 50%;
    left : 50%;
    width : 440px;
    height : 380px;
    margin-left : -220px;
    margin-top : -190px;
    z-index : 10010;
}

.QuickActiveAreaManager_title{
    position:relative;
    left : 0px;
    top : 0px;
    right : 0px;
    height : 36px;
    font-size : 18px;
    line-height : 36px;
    border-bottom : solid 1px gray;
    cursor : pointer; 
    background : #f8f8f8;
}

.closeQuickActiveAreaManager{
    position:absolute;
    right:5px;
    top:5px;
    width:20px;
    font-size:18px;
    height:20px;
    line-height:20px;
    text-align:center;
    cursor:pointer;
}

.innerQuickActiveAreaManager{
    position : absolute;
    left : 10px;
    top : 45px;
    right : 10px;
    bottom : 10px;
    overflow : hidden;
    border : solid 1px green;
    background : white;
    overflow : hidden;
    z-index : 10010;
}

.innerQuickActiveAreaTxtEditor{
    position : absolute;
    left : 10px; top : 45px;
    right : 10px; bottom : 10px;
    overflow : hidden;
    border : solid 1px green;
    background : white;
    overflow : hidden;
    display : none;
    z-index : 10011;
}

.innerQuickActiveAreaTxtLink{
    position : absolute;
    padding : 10px;
    left : 10px; top : 45px;
    right : 10px; bottom : 10px;
    overflow : hidden;
    border : solid 1px green;
    background : white;
    overflow : hidden;
    display : none;
    z-index : 10011;
}

.innerQuickActiveQuiz{
    position : absolute;
    padding : 10px;
    left : 10px; top : 45px;
    right : 10px; bottom : 10px;
    overflow : hidden;
    border : solid 1px purple;
    background : white;
    overflow : hidden;
    display : none;
    z-index : 10011;
}

.innerQuickActiveColorStyle{
    position : absolute;
    left : 10px; top : 45px;
    right : 10px; bottom : 10px;
    overflow : hidden;
    border : solid 1px green;
    background : white;
    overflow : hidden;
    display : none;
    z-index : 10011;
}

.slide-style{
    position : relative;
    float : left;
    width : 60px;
    height : 70px;
    margin-top : 5px;
    margin-left : 5px;
    border-radius : 6px;
    background-color : #f8f8f8;
    border : solid 1px gray;
}

.labelstyleQAA{
    position : absolute;
    left : 0px;
    top : 0px;
    width : 60px;
    height : 70px;
    cursor : pointer;
}

.slide-style input[type="radio"]{
    position : absolute;
    left : 43%;
    padding : 5px;
    transform: scale(1.5);
    bottom : 5px;
}

.slide-sty-nonecursor{
    background-image : url("../icon/nonecursor.png");
    background-repeat : no-repeat;
    background-position : center 10px;
}

.slide-sty-circlepoint , .slide-sty-1{
    background-image : url("../icon/rendcursormin.png");
    background-repeat : no-repeat;
    background-position : center 10px;
}

.slide-sty-2{
    background-image : url("../icon/iconstyle2.png");
    background-repeat : no-repeat;
    background-position : center 10px;
}
.slide-sty-3{
    background-image : url("../icon/iconstyle3.png");
    background-repeat : no-repeat;
    background-position : center 10px;
}
.slide-sty-4{
    background-image : url("../icon/iconloupe4.png");
    background-repeat : no-repeat;
    background-position : center 6px;
}
.slide-sty-5{
    background-image : url("../icon/pointcircle5.png");
    background-repeat : no-repeat;
    background-position : center 6px;
}
.slide-sty-6{
    background-image : url("../icon/iconquiz6.png");
    background-repeat : no-repeat;
    background-position : center 6px;
}
.slide-sty-7{
    background-image : url("../icon/iconstyle7.png");
    background-repeat : no-repeat;
    background-position : center 6px;
}
.slide-sty-8{
    background-image : url("../icon/btnnext8.png");
    background-repeat : no-repeat;
    background-position : center 6px;
}
.slide-sty-9{
    background-image : url("../icon/btnprev9.png");
    background-repeat : no-repeat;
    background-position : center 6px;
}

.QuickActiveAreaManager_Cover{
    position : fixed;
    background-color : rgb(143, 143, 143);
    opacity : 0.5;
    top : 0px;
    left : 0px;
    right : 0px;
    bottom : 0px;
    z-index : 10009;
}

.QuickActiveAreaManager_option_mid {
    position : relative;
    float : left;
    height : 36px;
    width : 48%;
    font-size : 18px;
    line-height : 36px;
    margin-left : 1%;
    margin-top : 5px;
    margin-bottom : 0px;
    border-radius : 10px;
    border : solid 1px gray;
    background : #f8f8f8;
}

.titleActiveAreaManager{
    position : relative;
    display : inline-block;
    font-size : 16px;
    margin : 0px;
    margin-right : 4px;
    padding : 0px;
    width : 100px;
    text-align : right;
}

.QuickActiveAreaManager_option {
    position : relative;
    float : left;
    height : 39px;
    width : 97%;
    font-size : 18px;
    line-height : 39px;
    margin-left : 1%;
    margin-top : 5px;
    margin-bottom : 0px;
    border : solid 0px gray;
    background : #f8f8f8;
}
.QuickActiveAreaManager_option input[type="radio"],.QuickActiveAreaManager_option_mid input[type="radio"] {
    margin-left : 10px;
    transform : scale(1.5);
    cursor : pointer; 
}

.QuickActiveAreaManager_option input[type="text"],.QuickActiveAreaManager_option_mid input[type="text"] {
    transform : scale(1);
    margin : 2px;
    margin-top : -1px;
    padding : 2px;
    height : 24px;
    font-size : 16px;
}
.QuickActiveAreaManager_option input[type="number"],.QuickActiveAreaManager_option_mid input[type="number"] {
    margin-left : 10px;
    font-size : 16px;
    transform : scale(1);
}

.QuickActiveAreaManager_option label , .QuickActiveAreaManager_option_mid label {
    padding-left : 10px;
    padding-right : 20px;
    width : 80%;
    cursor : pointer;
    user-select: none;
}

.QuickActiveAreaManager_option_sty {
    position : relative;
    float : left;
    height : 60px;
    width : 97%;
    font-size : 18px;
    line-height : 39px;
    margin-left : 1%;
    margin-top : 5px;
    background : #f8f8f8;
}
.box_option_sty{
    position : absolute;
    left : 106px;
    top : 3px;
    height : 50px;
    width : 70px;
    cursor : pointer;
    border : solid 0px gray;
    background-color : white;
}

.QuizCheckZii
{
  -ms-transform: scale(1.8);
  -moz-transform: scale(1.8);
  -webkit-transform: scale(1.8);
  -o-transform: scale(1.8);
  transform: scale(1.8);
  padding: 10px;
  margin-top:2px;
  margin-right:10px;
}
.commentline
{
    position : relative;
    height : 30px;
    width : 98%;
    margin : 3px;
}
.commentlabel
{
    position : relative;
    float : left;
    text-align : right;
    margin : 5px;
    width : 100px;
}
.commentinput
{
    position : relative;
    float : left;
    width : 200px;
    height : 30px;
    margin-left : 5px;
    padding : 5px;
    border : solid 1px gray;
    border-radius : 5px;
    font-size : 16px;
}

.img_tc_content_add{
    position : relative;
    float : left;
    margin-top : 10px;
    margin-left : 5%;
    width : 90%;
    height : 40px;
    z-index : 1003;
    border-top : solid 1px gray;
    cursor : pointer;
    background-image : url("../img/classique/tutocraft/add.png");
    background-repeat : no-repeat;
    background-position : center center;
}

.img_tc_content_load{
    position : relative;
    float : left;
    margin-top : 1%;
    margin-left : 5%;
    width : 90%;
    height : 90px;
    background-color : white;
    z-index : 1003;
    background-image : url("../img/classique/tutocraft/loadtable.gif");
    background-repeat : no-repeat;
    background-position : center center;
}
.img_tc_content{
    position : relative;
    float : left;
    margin-top : 1%;
    margin-left : 2%;
    width : 46%;
    height : 90px;
    border : solid 1px gray;
    overflow: hidden;
    cursor : move;
    z-index : 1003;
}
.img_tc_content img{
    width : 98%;
    height : 98%;
    object-fit : contain;
}

.tutocraft-image-container {
    position : relative;
    width : 100%;
    height : 100%;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    overflow: hidden;
}

.slider-pages-imageplus{
    overflow-y : auto;
    scrollbar-width: thin;
    scrollbar-color: #9f9f9f #ffffff;
    min-height: 450px;
    border : solid 0px purple;
}
.slider-pages-imageplus::-webkit-scrollbar {
    width: 6px;
}
.slider-pages-imageplus::-webkit-scrollbar-track {
    background: #ffffff;
}
.slider-pages-imageplus::-webkit-scrollbar-thumb {
    background-color: #9f9f9f;
    border-radius: 10px;
    border: 3px solid #ffffff;
}.tutocraft-clip-img {
    position: relative;
    display: inline-block;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background-position : center center;
    background-repeat : no-repeat;
    background-size : contain;
    background-color : transparent;
}


.tutocraft-clip-container {
    position: relative;
    display: inline-block;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.tutocraft-clipart-handpointer {
    background-image : url(../img/classique/tutocraft/handpointer.svg);
    background-position : center center;
    background-repeat : no-repeat;
    background-size : contain;
    background-color : transparent;
}
.tutocraft-clipart-trophy {
    background-image : url(../img/classique/tutocraft/trophy.svg);
    background-position : center center;
    background-repeat : no-repeat;
    background-size : contain;
    background-color : transparent;
}
.tutocraft-clipart-startflag {
    background-image : url(../img/classique/tutocraft/startflag.svg);
    background-position : center center;
    background-repeat : no-repeat;
    background-size : contain;
    background-color : transparent;
}

/*footprints*/
.tutocraft-clipart-footprints {
    background-image : url(../img/classique/tutocraft/footprints.svg);
    background-position : center center;
    background-repeat : no-repeat;
    background-size : contain;
    background-color : transparent;
}
/*cap*/
.tutocraft-clipart-cap {
    background-image : url(../img/classique/tutocraft/cap.svg);
    background-position : center center;
    background-repeat : no-repeat;
    background-size : contain;
    background-color : transparent;
}
/*kissmark*/
.tutocraft-clipart-kissmark {
    background-image : url(../img/classique/tutocraft/kissmark.svg);
    background-position : center center;
    background-repeat : no-repeat;
    background-size : contain;
    background-color : transparent;
}
/*peoplecomputer*/
.tutocraft-clipart-peoplecomputer {
    background-image : url(../img/classique/tutocraft/peoplecomputer.svg);
    background-position : center center;
    background-repeat : no-repeat;
    background-size : contain;
    background-color : transparent;
}
/*writinghand*/
.tutocraft-clipart-writinghand {
    background-image : url(../img/classique/tutocraft/writinghand.svg);
    background-position : center center;
    background-repeat : no-repeat;
    background-size : contain;
    background-color : transparent;
}

.adv_oel_convert_cover {
    position : fixed;
    left : 0;
    top : 0;
    width : 100%;
    height : 100%;
    background-color : #333;
    opacity : 0.5;
    z-index : 999;
}

.adv_oel_convert_body {
    position : fixed;
    left : 50%;
    top : 50%;
    width: 450px;
    height: 400px;
    margin: 0;
    padding: 0;
    margin-left : -225px;
    margin-top : -200px;
    font-family : Arial, sans-serif;
    font-size : 12px;
    color : #333;
    border: solid 1px #333;
    background-color : #f5f5f5;
    overflow:hidden;
    z-index: 1000;
}

.adv_oel_convert_header {
    background-color : #f5f5f5;
    border-bottom : 1px solid #ccc;
    padding : 10px;
    font-size : 16px;
    font-weight : bold;
    color : #333;
}

.adv_oel_convert_content {
    position : absolute;
    left : 10px;
    top : 50px;
    width : 430px;
    height : 340px;
    border: solid 1px #333;
}

.btn_line {
    text-align: center;
    margin-top: 2px;
}

.btn_import {
    display: inline-block;
    margin: 0.5rem 0.5rem 1rem 0.5rem;
    clear: both;
    font-family: inherit;
    font-weight: 700;
    font-size: 14px;
    text-decoration: none;
    text-transform: initial;
    border: none;
    border-radius: 0.2rem;
    outline: none;
    padding: 0 1rem;
    height: 36px;
    line-height: 36px;
    color: #fff;
    transition: all 0.2s ease-in-out;
    box-sizing: border-box;
    background: cornflowerblue;
    border-color: #454cad;
    cursor: pointer;
}

input[type=file] {
    display: inline-block;
    margin: 0.5rem 0.5rem 1rem 0.5rem;
    clear: both;
    font-family: inherit;
    font-weight: 700;
    font-size: 14px;
    text-decoration: none;
    text-transform: initial;
    border: none;
    border-radius: 10px;
    outline: none;
    padding: 0 1rem;
    padding-top: 40px;
    width: 95%;
    height: 160px;
    line-height: 120px;
    color: #5f6982;
    text-align: center;
    transition: all 0.2s ease-in-out;
    box-sizing: border-box;
    border: dashed 1px #454cad;
    background-image: url(download.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    cursor: pointer;
}

#div_loader_oel {
    position: relative;
    left: 0;
    top: 0;
    width: 100%;
    height: 180px;
    display : none;
    background: url('linear-progressbar.gif') no-repeat center center;
    z-index: 999;
}