html {
    font-size: 1.0em;
    font-weight: 200;
    font-family: 'Calibri', serif;
    color: #000000;
    color: #000000;
    height: 100%;
    min-height: 100%;
}

.contayner {
    display: block;
    position: relative;
    margin-bottom: 15px;
    margin-top: 15px;
    padding-top: 5px;
    padding-left: 35px;
    cursor: pointer;
    font-size: 1em;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

    /* Hide the browser's default checkbox */
.contayner input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

/* Create a custom checkbox */
.checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 25px;
    width: 25px;
    background-color: #eee;
}

/* On mouse-over, add a grey background color */
.contayner:hover input ~ .checkmark {
    background-color: #fff;
}

/* When the checkbox is checked, add a blue background */
.contayner input:checked ~ .checkmark {
    background-color: #3586a5;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the checkmark when checked */
.contayner input:checked ~ .checkmark:after {
    display: block;
}

/* Style the checkmark/indicator */
.contayner .checkmark:after {
    left: 9px;
    top: 5px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}


.deLink {
    padding: 12px 12px 12px 12px;
    color: #2b2b2b;
    background: #f8f8f8;
 
    
    font-weight: 400;
}

.headertext {
    padding: 8px 8px 8px 8px;
    font-size: 0.8em;
}
.Paneltext2 {
    padding: 8px 0px 8px 8px;
    color: #000;
    background: #f8f8f8;


   
 
}

.boxV {
    -webkit-background-clip: padding-box; /* for Safari */
    background-clip: padding-box; /* for IE9+, Firefox 4+, Opera, Chrome */
    text-align: center;
    height: 155px;
    background-color: #56b273;
    color: #fff;
    opacity: 1;
    /*animation-name: boxV;
    animation-fill-mode: forwards;
    animation-duration: 1.0s;*/
}

.boxVText {
    font-family: 'Lato', sans-serif;
    padding-top: 25px;
    text-align: center;
    font-size: 34px;
    font-weight: 600;
    padding-bottom: 15px;
    line-height: 1.2;
    color: #fff;
    position: relative;
}

    .boxVText span {
        color: #fff;
    }

    .boxVText .N {
        font-family: 'Calibri';
        line-height: 1.0;
      
        padding-bottom: 15px;
        text-align: center;
        font-size: 16px;
        font-weight: 600;
        color: #fff;
    }



.boxH {
   
    text-align: center;
    height: 155px;
    background-color: #56b273;
    color: #fff;
    opacity: 1;
    position: relative;
    /*animation-name: boxV;
    animation-fill-mode: forwards;
    animation-duration: 1.0s;*/
}

.boxHText {
    font-family: 'Lato', sans-serif;
    text-align: center;
    font-size: 25px;
padding-top:25px;
    font-weight: 600;
    line-height: 1.2;
    color: #fff;
}

    .boxHText span {
        color: #fff;
    }

    .boxHText .N {
        font-family: 'Calibri';
        line-height: 1.0;
      
        padding-bottom: 5px;
        text-align: center;
        font-size: 16px;
        font-weight: 600;
        color: #fff;
    }
.boxW1 {
    text-align: left;
    color: #fff;
    opacity: 1;
    position: relative;

    
}
.boxW {
    text-align: left;
    color: #fff;
    opacity: 1;
    position: relative;
   
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-image: url(../images/logoS.PNG);
}

@media screen and (max-width: 720px) {

    .boxW {
       
    }
}
.boxWText {
    height:50%;
 
    font-family: 'Lato', sans-serif;
    text-align: center;
    font-size: 28px;
    padding-left: 15px;
    padding-right: 10px;
    position: relative;
    font-weight: 600;
    line-height: 1.2;
    color: #fff;
}

    .boxWText span {
        color: #fff;
    }

    .boxWText .N {
        font-family: 'Calibri';
        line-height: 1.0;
        padding-top: 35px;
  
        text-align: center;
        font-size: 16px;
        font-weight: 600;
        color: #fff;
    }
.Paneltext {
    padding: 8px 0px 8px 8px;
    color: #000;
    background: #f8f8f8;
    border-right: solid 1px #d9d9d9;
    border-bottom: solid 1px #d9d9d9;
    border-left: solid 8px #ff8750;
    font-size: 0.8em;
}

.PaneltextOrange {
    padding: 8px 8px 8px 8px;
    color: #000;
    background: #f8f8f8;
    border-right: solid 1px #d9d9d9;
    border-bottom: solid 1px #d9d9d9;
    border-left: solid 8px #ff8750;
    width: 100%;
}

.PaneltextOrangeS {
    padding: 10px 2px 10px 10px;
    color: #000;
    background: #f8f8f8;
    /*border: solid 1px #d9d9d9;
    border-left: solid 8px #ff8750;*/
    font-size: 1em;
   
}
.PaneltextOrangeVakken {
    padding: 10px 0px 10px 10px;
    color: #000;
    background: #f8f8f8;
    border-right: solid 1px #d9d9d9;
    border-left: solid 1px #d9d9d9;
    /*border-bottom: solid 1px #d9d9d9;*/
    border-top: solid 1px #d9d9d9;
    /*border-left: solid 8px #ff8750;*/
    font-size: 0.8em;
}
.PaneltextOrangeVakkenU {
    padding: 10px 0px 10px 10px;
    color: #000;
    background: #f8f8f8;
    border-right: solid 1px #d9d9d9;
    border-left: solid 1px #d9d9d9;
    border-bottom: solid 1px #d9d9d9;
    border-top: solid 1px #d9d9d9;
    /*border-left: solid 8px #ff8750;*/
    font-size: 0.8em;
}

.PaneltextYellow {
    padding: 8px 8px 8px 8px;
    color: #000;
    background: #f8f8f8;
    border-right: solid 1px #d9d9d9;
    border-bottom: solid 1px #d9d9d9;
    border-left: solid 8px #fec956;
    width: 100%;
}


.PaneltextYellowS {
    padding: 10px 2px 10px 10px;
    color: #000;
    background: #f8f8f8;
    /*border: solid 1px #d9d9d9;
    border-left: solid 8px #fec956;*/
    /*border-left: solid 8px #b388dd;*/
    font-size: 1em;
  
}

.Paneltextpurple {
    padding: 8px 8px 8px 8px;
    color: #303030;
    background: #f8f8f8;
    border-right: solid 1px #d9d9d9;
    border-bottom: solid 1px #d9d9d9;
    border-left: solid 8px #b388dd;
    width: 100%;
}


.PaneltextpurpleS {
    padding: 10px 2px 10px 10px;
    color: #303030;
    background: #f8f8f8;
    /*border: solid 1px #d9d9d9;
    border-left: solid 8px #b388dd;*/
    /*border-left: solid 8px #b388dd;*/
    font-size: 1em;
    border-radius: 10px;
}

.PaneltextBlue {
    padding: 8px 8px 8px 8px;
    color: #000;
    background: #f8f8f8;
    border-right: solid 1px #d9d9d9;
    border-bottom: solid 1px #d9d9d9;
    border-left: solid 8px #3586a5;
    width: 100%;
}

.PaneltextBlueS {
    padding: 10px 2px 10px 10px;
    color: #000;
    background: #f8f8f8;
    /*border: solid 1px #d9d9d9;
    border-left: solid 8px #3586a5;*/
    /*border-left: solid 8px #3586a5;*/
    font-size: 1em;
    border-radius: 10px;
}




.PaneltextGreen {
    padding: 8px 8px 8px 8px;
    color: #000;
    background: #f8f8f8;
    border-right: solid 1px #d9d9d9;
    border-bottom: solid 1px #d9d9d9;
    border-left: solid 8px #56b273;
    width: 100%;
}
.PaneltextGreenS {
    padding: 10px 2px 10px 10px;
    color: #56b273;
    background: #f8f8f8;
    /*border: solid 1px #d9d9d9;

    border-left: solid 8px #56b273;*/
    /*border-left: solid 8px #56b273;*/
    font-size: 1em;
   
}
.PaneltextAqua {
    padding: 8px 8px 8px 8px;
    color: #0d99b2;
    background: #f8f8f8;
    border-right: solid 1px #d9d9d9;
    border-bottom: solid 1px #d9d9d9;
    border-left: solid 8px #0d99b2;
    width: 100%;
}


.PaneltextAquaS {
    padding: 10px 2px 10px 10px;
    color: #0d99b2;
    background: #f8f8f8;
    /*border: solid 1px #d9d9d9;
    border-left: solid 8px #b388dd;*/
    /*border-left: solid 8px #b388dd;*/
    font-size: 1em;
    border-radius: 10px;
}


.circle {
    position: relative;
    top: 10px;
    left: 10px;
    text-align: center;
    width: 200px;
    height: 200px;
    border-radius: 100%;
    background-color: #E6F4F7;
}

.active-border {
    position: relative;
    text-align: center;
    width: 220px;
    height: 220px;
    border-radius: 100%;
    background-color: #39B4CC;
    background-image: linear-gradient(162deg, transparent 50%, #A2ECFB 50%), linear-gradient(90deg, #A2ECFB 50%, transparent 50%);
}


.PaneltextTool1 {
    visibility: hidden;
    position: absolute;
    left: 35px;
    top: 0;
    color: white;
    background-color: #fff;
    text-align: center;
    /*width: 105px;*/
    height: 49px;
    z-index: 988;
}

.PaneltextTool {
    visibility: hidden;
    float: left;
    cursor: pointer;
    height: 48px;
    z-index: 988;
}

.labeltextKopTooltip {
    float: left;
    height: 22px;
    padding: 3px 2px 2px 2px;
    text-align: center;
    color: #fff;
    width: 35px;
    cursor: pointer;
    font-size: 0.8em;
}

.labeltexttooltip {
    float: left;
    height: 26px;
    padding: 5px 2px 0px 2px;
    text-align: center;
    cursor: pointer;
    color: #fff;
    width: 35px;
    font-size: 0.8em;
    font-weight: 600;
}

.deBoxPanel:hover .PaneltextTool {
    visibility: visible;
    cursor: pointer;
}


.PaneltextOrangeVakkenNoTop {
    padding: 10px 5px 10px 10px;
    color: #000;
    background: #f8f8f8;
    border-right: solid 1px #d9d9d9;
    border-left: solid 1px #d9d9d9;
    font-size: 0.8em;
}

.deBoxHoofdPanel {
    position: relative;
    display: inline-block;
    border-top: #c1c1c1 1px solid;
    /*border-right: #c1c1c1 1px solid;*/
    border-left: #c1c1c1 1px solid;
    /*border-bottom: #c1c1c1 1px solid;*/
}




.deBoxPanel {
    position: relative;
    display: inline-block;
    width: 35px;
    height: 45px;
}

    .deBoxPanel:hover {
    }


.deBoxPanelTool {
    position: relative;
    display: inline-block;
    width: 35px;
    height: 48px;
}


.labeltextKop {
    float: left;
    height: 22px;
    padding: 2px 2px 2px 2px;
    text-align: center;
    background-color: #fff;
    border-right: #c1c1c1 1px solid;
    border-bottom: #c1c1c1 1px solid;
    color: #000;
    width: 35px;
    cursor: zoom-in;
    font-size: 0.8em;
}


.labeltextP {
    float: left;
    height: 26px;
    padding: 5px 2px 0px 2px;
    text-align: center;
    background-color: #fff;
    border-right: #c1c1c1 1px solid;
    border-bottom: #c1c1c1 1px solid;
    /*border-right: #c1c1c1 1px solid;
    border-left: #c1c1c1 1px solid;
   */
    color: #000;
    width: 35px;
    cursor: zoom-in;
    font-size: 0.8em;
    font-weight: 600;
}

.LabelkopH {
    float: left;
    height: 23px;
    margin-top: -4px;
    margin-right: 2px;
    padding: 4px 2px 2px 2px;
    text-align: center;
    text-decoration: none;
    border: solid 1px #d9d9d9;
    background-color: #dcdcdc;
    width: 30px;
    color: #000;
    cursor: pointer;
    font-size: 0.8em;
    font-weight: 600;
}

    .LabelkopH:hover {
        color: #fff;
        background-color: #56b273;
    }

.LabelkopO {
    float: left;
    height: 23px;
    margin-right: 2px;
    margin-top: -4px;
    padding: 4px 2px 2px 2px;
    text-align: center;
    text-decoration: none;
    border: solid 1px #d9d9d9;
    background-color: #dcdcdc;
    color: #000;
    width: 35px;
    cursor: pointer;
    font-size: 0.8em;
    font-weight: 600;
}

    .LabelkopO:hover {
        color: #fff;
        background-color: #006cbc;
    }

.LabelkopH1 {
    float: left;
    height: 23px;
    margin-right: 2px;
    margin-top: -4px;
    padding: 4px 2px 2px 2px;
    text-align: center;
    text-decoration: none;
    color: #000;
    border: solid 1px #d9d9d9;
    background-color: #dcdcdc;
    width: 35px;
    cursor: pointer;
    font-size: 0.8em;
    font-weight: 600;
}

    .LabelkopH1:hover {
        color: #fff;
        background-color: #B388DD;
    }

.LabelkopH2 {
    float: left;
    height: 23px;
    margin-right: 2px;
    margin-top: -4px;
    padding: 4px 2px 2px 2px;
    text-align: center;
    text-decoration: none;
    background-color: #dcdcdc;
    border: solid 1px #d9d9d9;
    color: #000;
    width: 35px;
    cursor: pointer;
    font-size: 0.8em;
    font-weight: 600;
}

    .LabelkopH2:hover {
        color: #fff;
        background-color: #B388DD;
    }

.LabelkopH3 {
    float: left;
    height: 22px;
    margin-right: 2px;
    margin-top: -4px;
    padding: 4px 2px 2px 2px;
    text-align: center;
    text-decoration: none;
    color: #000;
    border: solid 1px #d9d9d9;
    background-color: #dcdcdc;
    width: 30px;
    cursor: pointer;
    font-size: 0.8em;
    font-weight: 600;
}

    .LabelkopH3:hover {
        color: #fff;
        background-color: #B388DD;
    }




imgbuttonT {
    color: #000;
    width: 260px;
}



.buttontext11 {
    text-align: left;

    /*margin-left: 150px;*/
}
.buttontextR {
    float: right;
    margin-top: -8px;
    margin-right: 0px;
   
    text-align: center;
    border-left: #8cb2d6 2px solid;
    border: #8cb2d6 2px solid;
    border-top: #c1c1c1 2px solid;
    border-right: #c1c1c1 2px solid;
    /*background-color: #8cb2d6;*/
    color: #000;
    /*margin-left: 150px;*/
}

.RbuttontextL2 {
    /*float:left;*/
    text-decoration: none;
    margin-top: 4px;
    padding-top: 6px;
    margin-left: 6px;
    /*background-color: #8cb2d6;*/
    color: #fff;
    /*margin-left: 150px;*/
}

.labeltext {
    /*float: left;*/
    /*padding-top: 16px;*/
    padding-bottom: 25px;
    /*height: 50px;*/
    /*top: 15px;*/
    width: 150px;
    text-align: right;
    padding-left: 6px;
    color: #fff;
    text-decoration: none;
}

.buttontextF {
    float: right;
    margin-top: -8px;
    margin-right: 10px;
    /*-webkit-transform: rotate(25deg);
    -moz-transform: rotate(25deg);
    -ms-transform: rotate(25deg);
    -o-transform: rotate(25deg);
    transform: rotate(25deg);*/
    /*background-color: #8cb2d6;*/
    color: #000;
    /*margin-left: 150px;*/
}

.buttontext {
    float: right;
    margin-top: -8px;
    margin-right: 10px;
    /*-webkit-transform: rotate(25deg);
    -moz-transform: rotate(25deg);
    -ms-transform: rotate(25deg);
    -o-transform: rotate(25deg);
    transform: rotate(25deg);*/
    /*background-color: #8cb2d6;*/
    color: #000;
    /*margin-left: 150px;*/
}

.buttontextLeft {
    float: left;
    margin-top: -8px;
    margin-right: 0px;
    /*-webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);*/
    /*background-color: #8cb2d6;*/
    color: #000;
    /*margin-left: 150px;*/
}

.buttontextGrid {
    
    margin-top: -4px;
    text-align: center;
   
    /*-webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);*/
    /*background-color: #8cb2d6;*/
    color: #000;
    /*margin-left: 150px;*/
}

.buttontextS {
    width:90%;
   
    margin-left: 10px;
    border-left: #8cb2d6 2px solid;
    border: #8cb2d6 2px solid;
    border-top: #c1c1c1 2px solid;
    border-right: #c1c1c1 2px solid;
    /*background-color: #8cb2d6;*/
    color: #000;
    /*margin-left: 150px;*/
}

.buttontextHer {
    float: right;
    margin-top: 0px;
    margin-right: 10px;
    /*background-color: #8cb2d6;*/
    color: #000;
    /*margin-left: 150px;*/
}

.buttontextLogo {
    text-decoration: none;
 
    padding-left: 20px;
    text-align: left;
    padding-top: 4px;
 
    /*background-color: #8cb2d6;*/
    color: #fff;
    /*margin-left: 150px;*/
}

@media (max-width: 350px) {

    .buttontextLogo {
        text-decoration: none;
        padding-left: 20px;
        text-align: left;
        padding-top: 4px;
        /*background-color: #8cb2d6;*/
        color: #fff;
        /*margin-left: 150px;*/
        display: none;
    }


}

    .buttontextL {
        text-decoration: none;
        margin-top: 4px;
        text-align: left;
        padding-top: 6px;
        margin-left: 6px;
        /*background-color: #8cb2d6;*/
        color: #fff;
        /*margin-left: 150px;*/
    }
.buttontextL2 {
    text-decoration: none;
    margin-top: 4px;
    float: right;
    text-align: right;
    padding-top: 6px;
    margin-left: 6px;
    /*background-color: #8cb2d6;*/
    color: #fff;
    /*margin-left: 150px;*/
}
    .buttontext22 {
        float: right;
        margin-top: -7px;
        margin-right: 2px;
        padding: 2px 2px 2px 2px;
        text-align: center;
        border-left: #8cb2d6 2px solid;
        border: #8cb2d6 2px solid;
        border-top: #c1c1c1 2px solid;
        border-right: #c1c1c1 2px solid;
        /*background-color: #8cb2d6;*/
        color: #000;
        /*margin-left: 150px;*/
    }

    .buttontext33 {
        float: right;
        margin-top: -4px;
        margin-right: 4px;
        padding: 2px 2px 2px 2px;
        text-align: center;
        /*background-color: #ceaa63;*/
        border-top: #c1c1c1 2px solid;
        border-right: #c1c1c1 2px solid;
        border-left: #ceaa63 2px solid;
        border-bottom: #ceaa63 2px solid;
        color: #000;
        width: 30px;
        /*margin-left: 150px;*/
    }





    .labeltext1 {
        color: #000;
    }

    .labeltext2 {
        float: left;
        margin-right: 20px;
        color: #393939;
    }
.labeltext3 {
  
    text-align:center;
    color: #393939;
}
.labeltextRr {
    float: left;
    margin-right: 20px;
    color: #c60018;
    font-size: 1em;

}


.labeltext11 {
    text-align: left;
    /*margin-left: 150px;*/
}
.labeltext12 {
    text-align: left;
    font-size: 16px;
    /*margin-left: 150px;*/
}

.labeltextV {
    float: right;
    margin-top: -4px;
    margin-right: 4px;
    padding: 2px 2px 2px 2px;
    text-align: center;

    /*background-color: #ceaa63;*/
    /*border-top: #c1c1c1 2px solid;
    border-right: #c1c1c1 2px solid;
    border-left: #ceaa63 2px solid;
    border-bottom: #ceaa63 2px solid;*/
    color: #000;
    width: 25px;
    /*margin-left: 150px;*/
}

    .labeltext22 {
        float: right;
        margin-top: -4px;
        margin-right: 4px;
        padding: 2px 2px 2px 2px;
        text-align: center;
       
        border-left: #8cb2d6 2px solid;
        border: #8cb2d6 2px solid;
        border-top: #c1c1c1 2px solid;
        border-right: #c1c1c1 2px solid;
        /*background-color: #8cb2d6;*/
        color: #000;
        width: 25px;
        /*margin-left: 150px;*/
    }

    .labeltext33 {
        float: right;
        margin-top: -4px;
        margin-right: 4px;
        padding: 2px 2px 2px 2px;
        text-align: center;
        
        /*background-color: #ceaa63;*/
        border-top: #c1c1c1 2px solid;
        border-right: #c1c1c1 2px solid;
        border-left: #ceaa63 2px solid;
        border-bottom: #ceaa63 2px solid;
        color: #000;
        width: 25px;
        /*margin-left: 150px;*/
    }

    .labeltext44 {
        float: right;
        margin-top: -4px;
        margin-right: 4px;
        padding: 2px 2px 2px 2px;
        text-align: center;
        /*border-radius: 50%;*/
        border-right: #c1c1c1 2px solid;
        border-top: #c1c1c1 2px solid;
        border-left: #63a68c 2px solid;
        border-bottom: #63a68c 2px solid;
        /*background-color: #63a68c;*/
        color: #000;
        width: 25px;
        /*margin-left: 150px;*/
    }


.labeltext55 {
    float: right;
    margin-top: -4px;
    margin-right: 4px;
    padding: 2px 2px 2px 2px;
    text-align: center;
    /*background-color: #ceaa63;*/
    border-top: #c1c1c1 2px solid;
    border-right: #c1c1c1 2px solid;
    border-left: #ceaa63 2px solid;
    border-bottom: #ceaa63 2px solid;
    color: #000;
    width: 50px;
    /*margin-left: 150px;*/
}

.labeltext6 {
    float: right;
    margin-top: -4px;
    margin-right: 4px;
    padding: 2px 2px 2px 2px;
    text-align: center;
    /*background-color: #ceaa63;*/
    border-top: #c1c1c1 2px solid;
    border-right: #c1c1c1 2px solid;
    border-left: #56b273 2px solid;
    border-bottom: #56b273 2px solid;
    color: #000;
    width: 35px;
    /*margin-left: 150px;*/
}   
  
.labeltext6R {
    float: right;
    margin-top: -4px;
    margin-right: 4px;
    padding: 2px 2px 2px 2px;
    text-align: center;
    /*background-color: #ceaa63;*/
    border-top: #c1c1c1 2px solid;
    border-right: #c1c1c1 2px solid;
    border-left: #c60018 2px solid;
    border-bottom: #c60018 2px solid;
    color: #000;
    width: 35px;
    /*margin-left: 150px;*/
}

    .boxit2 {
        background-color: #d9d9d9;
    }

.Panelback {
  
    width: 100%;
  
}
.Panelback1 {
    width: 100%;
   
  
}

.myGridClass3 {
    /* odd row*/
    margin-top: 10px;
    background-color: #fff;
    /*margin: 5px 0 10px 0;*/
    border: solid 1px #d9d9d9;
    /*border-left: solid 1px #d9d9d9;
    border-right: solid 1px #d9d9d9;*/
    border-collapse: collapse;
    /*box-shadow: 0px 0px 1px #d9d9d9;*/
}

    /*data elements*/
    .myGridClass3 td {
       
        border-left: solid 1px #d9d9d9;
        /*border-bottom: solid 1px #d9d9d9;*/
        /*color: #717171;*/
        font-weight: 600;
        font-size: 0.8em;
        height: 26px;
        text-align: center;
    }

    /*header elements*/
    .myGridClass3 th {
        font-weight: 200;
        padding-left: 9px;
        padding-right: 9px;
        color: #000;
        height: 22px;
        background: #f8f8f8;
        border-bottom: solid 1px #d9d9d9;
        font-size: 0.8em;
    }

    /*his will be the color of even row*/
    .myGridClass3 .myAltRowClass {
        background: #fcfcfc repeat-x top;
    }

    /*and finally, we style the pager on the bottom*/
    .myGridClass3 .myPagerClass {
        background: #424242;
    }

        .myGridClass3 .myPagerClass table {
            width: 100%;
            margin: 5px 0;
        }

        .myGridClass3 .myPagerClass td {
            width: 100%;
            border-width: 1px;
            padding: 0 6px;
            border-left: solid 2px #666;
            font-weight: bold;
            color: #fff;
            line-height: 12px;
        }

        .myGridClass3 .myPagerClass a {
            width: 100%;
            color: #fff;
            text-decoration: none;
        }

            .myGridClass3 .myPagerClass a:hover {
                color: #fff;
                text-decoration: none;
            }


    .myGridClass2 {
        /*this will be the color of the odd row*/
        background-color: #fff;
        /*margin: 5px 0 10px 0;*/
        /*border: solid 1px #c1c1c1;*/
        border-collapse: collapse;
        /*box-shadow: 0px 0px 3px #585858;*/
        /*width: 100%;*/
    }

        /*data elements*/
        .myGridClass2 td {
            padding: 8px;
            /*box-shadow: 0px 0px 2px #585858;*/
            /*border-bottom: solid 1px #c1c1c1;*/
            border-right: solid 1px #c1c1c1;
            /*color: #717171;*/
            text-align: center;
            font-size: 0.8em;
            font-weight: bold;
            height: 36px;
        }

        /*header elements*/
        .myGridClass2 th {
            padding: 8px 2px;
            color: #000;
            background: #f8f8f8;
            border-right: solid 1px #c1c1c1;
            font-size: 0.8em;
            /*border-bottom: solid 1px;*/
        }

        /*his will be the color of even row*/
        .myGridClass2 .myAltRowClass {
            background: #fcfcfc repeat-x top;
        }


.visibility {
    visibility: hidden;
    display: none;
}


    .myGridClass {
        width: 100%;
        /*this will be the color of the odd row*/
        background-color: #fff;
        /*margin: 5px 0 10px 0;*/
        border: solid 1px #d9d9d9;
        border-top: solid 0px #fff;
        border-collapse: collapse;
        box-shadow: 0px 0px 1px #d9d9d9;
    }

        /*data elements*/
        .myGridClass td {
            padding: 10px;
            border-bottom: solid 1px #d9d9d9;
            /*color: #717171;*/
            font-size: 0.8em;
            height: 36px;
        }
        .myGridClass td a {
            color: #fff;
            text-decoration: none;
        }
        /*header elements*/
        .myGridClass th {
            padding: 8px 2px;
            color: #000;
            background: #f8f8f8;
            /*border-left: solid 1px #95c990;*/
            font-size: 0.8em;
        }

        /*his will be the color of even row*/
        .myGridClass .myAltRowClass {
            background: #fcfcfc repeat-x top;
        }

        /*and finally, we style the pager on the bottom*/
        .myGridClass .myPagerClass {
            background: #424242;
        }

            .myGridClass .myPagerClass table {
                margin: 5px 0;
            }

            .myGridClass .myPagerClass td {
                border-width: 1px;
                padding: 0 6px;
                border-left: solid 2px #666;
                font-weight: bold;
                color: #fff;
                line-height: 12px;
            }

            .myGridClass .myPagerClass a {
                color: #fff;
                text-decoration: none;
            }

                .myGridClass .myPagerClass a:hover {
                    color: #fff;
                    text-decoration: none;
                }



.labelit {
    font-size: 1.0em;
    line-height: 1.3;
    font-weight: 300;
    font-family: 'Calibri', serif;
    color: #000000;
    width: 160px;
}

    .labelit2 {
        font-size: 1.0em;
        line-height: 1.2;
        font-weight: 300;
        font-family: 'Calibri', serif;
        color: #000000;
        width: 160px;
    
    }

.labelit22 {
    font-size: 1.0em;
    line-height: 1.2;
    font-weight: 300;
    font-family: 'Calibri', serif;
    color: #000000;
    width: 160px;
    text-align: center;
    padding-top:8px;
    vertical-align:middle;
}

.button__badge {
    background-color: #fa3e3e;
    border-radius: 2px;
    color: white;
    padding: 1px 3px;
    font-size: 10px;
    position: absolute; /* Position the badge within the relatively positioned button */
    top: 0;
    right: 0;
}

.labelit222 {
    font-size: 1.0em;
    line-height: 1.2;
    font-weight:600;
    font-family: 'Calibri', serif;
    color: #0066cc;
    width: 160px;
    text-align: center;
}

    .labelit3 {
        font-size: 1.9em;
        line-height: 1.5;
        font-weight: 700;
        font-family: 'Calibri', serif;
        color: #696662;
        width: 160px;
    }

    .padding {
        width: 160px;
        font-size: 0.9em;
        line-height: 1.3;
        font-weight: 900;
        font-family: 'Calibri', serif;
        color: #000000;
        color: #000000;
        text-align: left;
    }

.padding5 {
    margin-top:6px;
    width: 160px;
    font-size: 0.9em;
    line-height: 1.3;
    font-weight: 900;
    font-family: 'Calibri', serif;
    color: #000000;
    color: #000000;
    text-align: left;
}

    .padding1 {
        width: 160px;
        max-height: 100%;
        height: 400px;
        font-size: 1.0em;
        line-height: 1.0;
        font-weight: 300;
        font-family: 'Calibri', serif;
        color: #000000;
        color: #000000;
        text-align: left;
    }

    header {
        height: 50px;
        width: 100%;
        z-index: 99;
        background: #484848;
        box-shadow: 0px 0px 3px #000;
        position: fixed;
        top: 0;
        left: 0;
    }

@media (max-width: 550px) {
    header {
        height: 110px;
        width: 100%;
        z-index: 99;
        background: #484848;
        box-shadow: 0px 0px 3px #000;
        position: fixed;

        top: 0;
        left: 0;
    }
}


    h1, h2 {
        font-family: 'Pacifico', serif;
        color: #fff;
        color: #fff;
        margin-top: 0;
        margin-bottom: 0rem;
        font-weight: 100;
    }

    h3, h4, h5, h6 {
        font-family: 'Pacifico', serif;
        color: #000000;
        color: #fff;
        margin-top: 0;
        margin-bottom: 0rem;
        line-height: 1.9;
        font-weight: 100;
    }

    .headerW {
        color: #000;
        text-shadow: 0px 3px 0px #fff;
        text-shadow: 0px 3px 0px #fff;
    }

.backH {
    width: 100%;
    height: 100%;
    position: Fixed;
    top: 0px;
    left: 0px;
    list-style-type: none;
    text-decoration: none;
    color: transparent;
    background-size: cover;
    background-position: 50% 50%;
    background-repeat: none;
    opacity: 0.7;
    z-index: -1;
    background-image: url(../images/back.jpg);

}
.backch {
    width: 100%;
    height: 100%;
    position: Fixed;
    top: 0px;
    left: 0px;
    list-style-type: none;
    text-decoration: none;
    color: transparent;
    background-color: #b3cdd1;
    opacity: 0.9;
    z-index: -1;
    background-size: cover;
    background-position: 50% 50%;
    background-repeat: none;
    background-image: url(../images/backch.jpg);
}

.back1 {
    width: 100%;
    height: 100%;
    position: Fixed;
    top: 0px;
    left: 0px;
    list-style-type: none;
    text-decoration: none;
    color: transparent;
    /*background-color: #b3cdd1;
    background-image: linear-gradient(315deg, #b3cdd1 0%, #9fa4c4 74%);*/
    background-size: cover;
    background-position: 50% 50%;
    background-repeat: none;
    opacity: 1;
    z-index: -1;
    background-image: url(../images/back2.jpg);
}
  
@-webkit-keyframes imageAnimation {
    0% {
        opacity: 0;
        -webkit-animation-timing-function: ease-in;
    }

    1% {
        opacity: 0.7;
        -webkit-animation-timing-function: ease-out;
    }

    27% {
        opacity: 0.7;
    }

    28% {
        opacity: 0;
    }

    100% {
        opacity: 0;
    }
}

@-moz-keyframes imageAnimation {
    0% {
        opacity: 0;
        -moz-animation-timing-function: ease-in;
    }

    1% {
        opacity: 0.7;
        -moz-animation-timing-function: ease-out;
    }

    17% {
        opacity: 0.7;
    }

    18% {
        opacity: 0;
    }

    100% {
        opacity: 0;
    }
}

@-o-keyframes imageAnimation {
    0% {
        opacity: 0;
        -o-animation-timing-function: ease-in;
    }

    1% {
        opacity: 0.7;
        -o-animation-timing-function: ease-out;
    }

    17% {
        opacity: 0.7;
    }

    18% {
        opacity: 0;
    }

    100% {
        opacity: 0;
    }
}

@-ms-keyframes imageAnimation {
    0% {
        opacity: 0;
        -ms-animation-timing-function: ease-in;
    }

    1% {
        opacity: 0.7;
        -ms-animation-timing-function: ease-out;
    }

    17% {
        opacity: 0.7;
    }

    18% {
        opacity: 0;
    }

    100% {
        opacity: 0;
    }
}

@keyframes imageAnimation {
    0% {
        opacity: 0;
        animation-timing-function: ease-in;
    }

    1% {
        opacity: 0.7;
        animation-timing-function: ease-out;
    }

    34% {
        opacity: 0.7;
    }

    35% {
        opacity: 0;
    }

    100% {
        opacity: 0;
    }
}

.no-cssanimations .slideS li span {
    opacity: 0.7;
}


    .bandback1 {
        width: 100%;
        height: 100%;
        position: inherit;
        top: 0px;
        left: 0px;
        color: transparent;
        background-size: cover;
        background-position: 50% 50%;
        background-repeat: none;
        background-image: url(../images/Backmain/header2.jpg);
    }

    form {
    }

    span {
        color: #000;
    }

        span .white {
            color: #fff;
        }

    p {
        margin-top: 0;
    }

    /* Links
–––––––––––––– */
    a {
        color: #52413c;
    }


        a:hover {
            color: #52413c;
        }


    /* Typography
–––––––––––––– */
    .buttonStyle {
        background-color: #33a4b4;
        border: none;
        color: white;
        padding: 15px 34px;
        text-align: center;
        text-decoration: none;
        display: inline-block;
        font-size: 16px;
    }
        .buttonStyle:hover {
            cursor: pointer;
            background-color: #2d7c87;
        }
    .LaderBox {

        /*display:none;*/

    }

.Lader,
.Lader:before,
.Lader:after {
    background: #56b273;
    -webkit-animation: load1 1s infinite ease-in-out;
    animation: load1 1s infinite ease-in-out;
    width: 1em;
    height: 4em;
}

.Lader {
    color: #56b273;
    text-indent: -9999em;
    margin: 88px auto;
    left: 50%;
    /*top: 30%;*/
    opacity: 1;
    position: absolute;
    font-size: 11px;
    z-index: 0;
    animation: fadeOut 10s forwards;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-animation-delay: -0.16s;
    animation-delay: -0.16s;
}

    .Lader:before,
    .Lader:after {
        position: absolute;
        top: 0;
        content: '';
    }

    .Lader:before {
        left: -1.5em;
        -webkit-animation-delay: -0.32s;
        animation-delay: -0.32s;
    }

    .Lader:after {
        left: 1.5em;
    }

@-webkit-keyframes load1 {
    0%, 80%, 100% {
        box-shadow: 0 0;
        height: 4em;
    }

    40% {
        box-shadow: 0 -2em;
        height: 5em;
    }
}

@keyframes load1 {
    0%, 80%, 100% {
        box-shadow: 0 0;
        height: 4em;
    }

    40% {
        box-shadow: 0 -2em;
        height: 5em;
    }
}


@keyframes fadeOut {
    0% {
        opacity: 1;
        z-index: 0;
    }

    50% {
        opacity: 1;
        z-index: 0;
    }

    100% {
        opacity: 1;
        z-index: 1;
    }
}


.buttonStyleMid {
    background-color: #33a4b4;
    border: none;
    color: white;
    padding: 18px 40px;
    text-align: center;
    text-decoration: none;
    top: 50%;
    left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
    position:absolute;
    font-weight: 600;
    font-size: 16px;
    /*text-align: Right;*/
}
    .buttonStyleMid:hover {
        cursor: pointer;
        background-color: #2d7c87;
    }
    .buttonStyleL {
        background-color: #33a4b4;
        border: none;
        color: white;
        padding: 9px 20px;
        text-align: center;
        text-decoration: none;
        font-size: 16px;
        text-align: Right;
    }

.buttonStyl2e {
    background-color: #33a4b4;
    border: none;
    color: white;
    
    text-align: center;
    text-decoration: none;
    font-size: 16px;
}
.buttonStyl2e:hover {
    cursor: pointer;
    background-color: #2d7c87;
}



   

    .buttonStyle3 {
        background-color: #424242;
        border: none;
        color: white;
        padding: 0px 0px;
        text-align: left;
        text-decoration: none;
        font-size: 1.0em;
        font-family: Calibri, serif;
    }

.boxMid {
    text-align: center;
    text-decoration: none;
    border: 1px solid rgba(0, 0, 0, 0.1);
    width: 100%;
    height: 350px;
    background-color: rgb(0 0 0 / 50%);
    /*-webkit-transition: opacity 0.4s ease-in-out;
  -moz-transition: opacity 0.4s ease-in-out;
  -o-transition: opacity 0.4s ease-in-out;
  transition: opacity 0.4s ease-in-out;*/
    list-style: outside none none;
    text-align: center;
    opacity: 1;
    padding: 0;
    margin: 0;
    /*background: rgba(255, 255, 255, .8);*/
}

    h1 {
        font-size: 4.0rem;
        line-height: 1.2;
        letter-spacing: -.1rem;
        font-weight: 200;
        color: #000;
    }




    h2 {
        font-size: 3.6rem;
        line-height: 1.25;
        letter-spacing: -.1rem;
    }

    h3 {
        font-size: 3.0rem;
        line-height: 1.3;
        letter-spacing: -.1rem;
    }

    h4 {
        font-size: 2.4rem;
        line-height: 1.35;
        letter-spacing: -.08rem;
    }

    h5 {
        font-size: 1.8rem;
        line-height: 1.2;
        letter-spacing: -.05rem;
    }

    h6 {
        font-size: 1.5rem;
        line-height: 1.1;
        letter-spacing: 0;
    }

    /* Larger than phablet */
    @media (min-width: 750px) {

        h1 {
            font-size: 7.0rem;
        }

        h2 {
            font-size: 4.2rem;
        }

        h3 {
            font-size: 3.6rem;
        }

        h4 {
            font-size: 3.0rem;
        }

        h5 {
            font-size: 2.4rem;
        }

        h6 {
            font-size: 1.5rem;
        }
    }

    .GREEN {
        color: #a6ce39;
    }

    .white {
        color: #fff;
        text-shadow: 0px 3px 0px #000;
    }


    .red {
        color: #000;
    }


    .black {
        color: #000;
    }


    .yellow {
        letter-spacing: 0.5pt;
        background: -moz-linear-gradient(330deg, #c60018 0%, #e1a333 25%, #0171e0 50%, #aec96e 75%, #fb5623 100%);
        background: -webkit-linear-gradient(330deg, #c60018 0%, #e1a333 25%, #0171e0 50%, #aec96e 75%, #fb5623 100%);
        background: -o-linear-gradient(330deg, #c60018 0%, #e1a333 25%, #0171e0 50%, #aec96e 75%, #fb5623 100%);
        background: -ms-linear-gradient(330deg, #c60018 0%, #e1a333 25%, #0171e0 50%, #aec96e 75%, #fb5623 100%);
        background: linear-gradient(330deg, #c60018 0%, #e1a333 25%, #0171e0 50%, #aec96e 75%, #fb5623 100%);
        background: -webkit-linear-gradient(330deg, #c60018 0%, #e1a333 25%, #0171e0 50%, #aec96e 75%, #fb5623 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        text-shadow: 0px 0px 1px #fff;
        -webkit-text-stroke-width: 6px;
        -webkit-text-stroke-color: rgba(184, 0, 0, 0.01);
    }

   

    .textboxleftb {
        position: relative;
        z-index: 1;
        text-align: left;
        /*left: 10px;*/
        padding: 20px 30px 20px 30px;
    }

        .textboxleftb:before {
            content: "";
            position: absolute;
            z-index: -1;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            /*background: url(test.jpg) center center;*/
            opacity: .8;
        }


    .bandblok {
        width: 100%;
        height: 100%;
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-transition: .3s ease-in-out;
        transition: .3s ease-in-out;
        list-style: outside none none;
        text-align: center;
        opacity: 1;
        padding: 0;
        margin-bottom: 0;
        background: rgb(255, 255, 255);
        background: rgba(255, 255, 255, 0.5);
    }

    .bandblok2 {
        width: 100%;
        height: 100%;
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-transition: .3s ease-in-out;
        transition: .3s ease-in-out;
        list-style: outside none none;
        text-align: center;
        opacity: 1;
        padding: 0;
        margin-bottom: 0;
        background: rgb(255, 255, 255);
        background: rgba(255, 255, 255, 0.7);
    }
}
.bandblock1 {
    background: url(../images/cst/dot2.png);

    height: 100%;
   
    background-size: 100%;
    width: 100%;
}

.bandblock2 {
    background: url(../images/cst/dot2.png);

    height: 100%;
   
    background-size: 100%;
    width: 100%;
}

.bandblock3 {
    background: url(../images/cst/dot2.png);
    
    height: 100%;

    background-size: 100%;
    width: 100%;
}

.bandblock4 {
    background: url(../images/cst/dot2.png);
    
    height: 80%;

    background-size: 100%;
    width: 100%;
}