/*  Special styles for new dayplanner */

.ClsPosRelative {
    position: relative;
}

.ClsPosAbsolute {
    position: absolute;
}

#myOverlay {
    z-index: 900;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #aaaaaa;
    opacity: 0.3;
}

/* Start css settings Dayplan and Weekplan */

.PupDayTimeTitle {
    width: 7%;
}

.PupDayMonTitle,
.PupDayTueTitle,
.PupDayWedTitle,
.PupDayThuTitle,
.PupDayFriTitle {
    background-repeat: no-repeat;
    background-size: cover;
    overflow: hidden;
    padding-top: 0.8em;
}

.PupDayTasksTitle,
.PupDayMonTitle {
    background-image: url('/css/Amvc/images/IdyiaSvg/KartelRand_Mon.svg');
}

.PupDayTueTitle {
    background-image: url('/css/Amvc/images/IdyiaSvg/KartelRand_Tue.svg');
}

.PupDayWedTitle {
    background-image: url('/css/Amvc/images/IdyiaSvg/KartelRand_Wed.svg');
}

.PupDayThuTitle {
    background-image: url('/css/Amvc/images/IdyiaSvg/KartelRand_Thu.svg');
}

.PupDayFriTitle {
    background-image: url('/css/Amvc/images/IdyiaSvg/KartelRand_Fri.svg');
}

#PP6702001_PupDayProg_Container {
    background-color: white;
}

/* End css settings Dayplan and Weekplan */

/* Start CSS settings specific for PupFrstPage       */
#PP6701001_PupPortalTitle_Container {
    font-family: 'Lilita One', LilyUPC;
}

.ClsPP6701001ContainerSize {
/*    padding-left: 2%;
*/    border-width: 0;
    margin: 0;
    border-style: solid;
    font-size:inherit;
}

#PP6701001_PupPortalThrdContainer,
#PP6701001_PupPortalThrdTitle_Rect {
    color: #338CBC;
}

#PP6701001_PupPortalFrthContainer,
#PP6701001_PupPortalFrthTitle_Rect {
    color: #4A852B;
}
#PP6701001_ScndContainer,
#PP6701001_ThrdContainer,
#PP6701001_FrthContainer {
    height: 100%;
    background: url('/css/Amvc/images/IdyiaSvg/blaadjes.svg') no-repeat;
    background-size: cover;
}

.FP_Container {
    background: url('/css/Amvc/images/IdyiaSvg/blaadjes.svg') no-repeat;
}

.PPFrstDayBgCol {
    background-color: #ED237C;
}

.ClsPP6701001-Menu {
    color: white;
    margin-left: 10%;
}

.PP6702001_TimeContainer {
    opacity: 0;
}

.ClsFillerCss {
    opacity: 0;
    background-color: transparent;
    width: 7%;
    height: 1em;
}


.PupDayTimeTitle {
    width: 7%;
}

.ClsClrBodyLesPartColTr {
    background-color: rgba(240, 240, 240, 0.7);
}

/* CSS used in PP6703501 templates */
#btnStartLesson,
#btnStopLesson {
    margin-top: 4px;
    margin-left: 1em;
}

/*  Special styles for new dayplanner */

.ClsSchedLesson {
    border: 1px solid #ebebeb;
}

.ClsSchedDisc {
    width: 100%;
    clear: both;
    overflow: hidden;
    opacity: 0.9;
    border: 1px solid #ccc;
}

.ClsPupDayTtl,
.ClsPupDayCntnr {   /* ? */
    float: left;
    width: 17.8%;
}

.ClsPupDayTtl {
    height: 100%;
    overflow: hidden;
}

#PP6702001_PupTasksTitle_Rect,
#PP6702001_PupDayProgMonTitle_Rect,
#PP6702001_PupDayProgTueTitle_Rect,
#PP6702001_PupDayProgWedTitle_Rect,
#PP6702001_PupDayProgThuTitle_Rect,
#PP6702001_PupDayProgFriTitle_Rect {
    background-image: url('/css/Amvc/images/IdyiaSvg/KartelRand_Task.svg');
    background-size: cover;
}


/* Classes for smileys */

/* Classes for smileys */

.ClsSmileyTaskDif_1,
.ClsSmileyTaskDif_2,
.ClsSmileyTaskDif_3,
.ClsSmileyJudgment_1,
.ClsSmileyJudgment_2,
.ClsSmileyJudgment_3,
.ClsSmileyJudgment_4,
.ClsSmileyJudgment_5 {
    width: 4em;
    height: 4em;
    float: left;
}

.ClsSmileyTaskDif_1 {
    background: url('/css/Amvc/images/IdyiaSvg/oneofthree_1.svg') no-repeat;
    background-size: 3em 3em;
    background-position: center;
}

.ClsSmileyTaskDif_2 {
    background: url('/css/Amvc/images/IdyiaSvg/oneofthree_2.svg') no-repeat;
    background-size: 3em 3em;
    background-position: center;
}

.ClsSmileyTaskDif_3 {
    background: url('/css/Amvc/images/IdyiaSvg/oneofthree_3.svg') no-repeat;
    background-size: 3em 3em;
    background-position: center;
}

.ClsSmileyJudgment_0 {
    background-color: @IdyiaInpGrey;
    background-size: 3em 3em;
    background-position: center;
}

.ClsSmileyJudgment_1 {
    background: url('/css/Amvc/images/IdyiaSvg/oneoffive_1.svg') no-repeat;
    background-size: 3em 3em;
    background-position: center;
}

.ClsSmileyJudgment_2 {
    background: url('/css/Amvc/images/IdyiaSvg/oneoffive_2.svg') no-repeat;
    background-size: 3em 3em;
    background-position: center;
}

.ClsSmileyJudgment_3 {
    background: url('/css/Amvc/images/IdyiaSvg/oneoffive_3.svg') no-repeat;
    background-size: 3em 3em;
    background-position: center;
}

.ClsSmileyJudgment_4 {
    background: url('/css/Amvc/images/IdyiaSvg/oneoffive_4.svg') no-repeat;
    background-size: 3em 3em;
    background-position: center;
}

.ClsSmileyJudgment_5 {
    background: url('/css/Amvc/images/IdyiaSvg/oneoffive_5.svg') no-repeat;
    background-size: 3em 3em;
    background-position: center;
}

/* Lesson PupilTarget Color*/
.ClsColorTarget { color: #4a852b !important; }

.ClsSmileySelected {
    border: 1px solid blue;
}
#divEmptyFt {
    background-color: silver
}
/* Adaptations for header because of nav */
.ClsSetTo100 {
    width: 25%;
}

#UserNameCssNIntern {
    padding-top: 1rem !important;
}
#OwnLogo {
    padding-top: 0;
}

/*  large devices (desktops) xl */
@media screen and (max-width: 1199px) {
    header {
        font-size: 0.8rem; /* 0.75rem; */
    }

    #divEmptyFt {
        background-color: rgb(87, 240, 87) /* Green */
    }
    #OwnLogo {
        padding-top: 0;
    }

    .ClsSetTo100 {
        width: 25%;
    }
}

/*  medium devices (tablets) lg */
@media screen and (max-width: 991px) {
    header, #EloHeader, #EloBody /*, #AppDivHeaderBox, #AppDivContentPage*/ {
        font-size: 0.8rem; /* 0.7rem; */
    }

    #divEmptyFt {
        background-color: yellow
    }
    #OwnLogo {
        padding-top: 0;
    }
}

/*  small devices (landcape phones) md */
@media screen and (max-width: 768px) {
    header, #EloHeader, #EloBody /*, #AppDivHeaderBox, #AppDivContentPage*/ {
        font-size: 0.8rem; /* 0.65rem; */
    }
    #divEmptyFt {
        background-color: red
    }
    #OwnLogo {
        padding-top: 0;
    }
}

/* extra small devices (portrait phones)  sm */
@media screen and (max-width: 575px) {
    header, #EloHeader, #EloBody /*, #AppDivHeaderBox, #AppDivContentPage*/ {
        font-size: 0.8rem; /* 0.65rem; */
    }
    #OwnLogo {
        padding-top: 0;
    }

    #divEmptyFt {
        background-color: transparent;
    }
}