/* demo, mvp*/
/* , '#ffffff, #000000, #abce7b, #000000, #BDE5F8, #000000, */
@viewport{
    width: extend-to-zoom;
    zoom: 1.0;
}
@-ms-viewport{
    width: extend-to-zoom;
    zoom: 1.0;
}
html { width:100%; height:99.5% }
body { background:white; color:black; height:100%; width:100%; margin:0; padding:0; font-size:12px; font-family: 'Arial', 'sans-serif'; /*font-family: 'Open Sans', 'sans-serif';*/}
#page { width: 100%; height:100%; padding:0; margin: 0; }
#content { margin: 0; padding: 0; /*background:#ffffff; color:#000000;*/ height:100%; width:100%}
h1 { font-size:18px; font-weight:bold; background:#ffffff; color:#000000; /*font-family: arvo, serif;*/ }
h2 { font-size:16px; font-weight:bold; background:#ffffff; color:#000000; /*font-family: arvo, serif;*/ }
h3 { font-size:14px; font-weight:bold; background:#ffffff; color:#000000; /*font-family: arvo, serif;*/ }

a { color:#000000; }
.mobile_line {
    display:block;
    width:100%;
    height:7%;
    margin:0;
    padding:0;
    text-align:center;
    max-width:936px;
    max-height:47px;
    background: #abce7b!important;
    color:#000000!important;
}
.mobile_line h1 {
    background: #abce7b!important;
    color:#000000!important;
}

.small { font-size:12px; }
.red { color:#ef696b; }

div.form_wrapper { position:relative; vertical-align:top;
    width:100%;
    height:78%;
    margin:0;
    padding:0;
    border: 0;
    max-width:936px;
    max-height:562px;
    background:#ffffff!important;
    color:#000000!important;
}
div.report_left_frame {
    display:inline-block;
    width:75%;
    height:100%; /*78%;*/
    margin:0;
    padding:0;
    border: 0;
    max-width:720px;
    max-height:562px;
    position:absolute;
}

span.check_img { display:inline-block; padding:0 0 0 0; margin:0; width:2px; height:15px; vertical-align:middle; }
div.check_visible p span.check_img, div.check_visible p span.check_img_player { display:inline-block; padding:0 0 0 0; margin:0; width:2px; height:15px; vertical-align:middle; /*background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAPCAYAAADkmO9VAAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAAL2SURBVHjafJTLaxNBHMd/v9/MJpvdGquGWp/VVqteQrSCovhCRdCDD/BxKVSR1kdVLAY8BgRBghcPYvFg8R9QwaJYkVRE8CDqIYgWqejBZ1tNm+xmd2fGWTWlStovDMMOM5+Z73fmt5jJZGp0G4O/ymazdjqdLsIk2pzZzIsNxcSo65uKO1j2uGMCJhmyDUzSOqpAKgumgoUatoejhbFyDHiwSAV8j0n0gBHeRKRDwOhOCKQKpLu725qUlAFKZpN2uRbqiMuU8NVWBDxPilYQ0CAiOyO+uNcosINVrdlWW9uOtLe3O1VhSnuykzERF7Mo0DCA1QR4jgEmSGEJFV6LoOrLZ/Iem72z/tUoK6YjzFh1v//+o9SGFDzPPffHYfuBJd1kbMwXsxhnu4QSywFVFwNuMKCXCOrCaPnn7dedr0vhdLZp+8a+d9HBI28i7+LD0SFzWiS+ct/avc9yuZxs6W4xZi6cnwABTcRwtUJoBPUbFjUk+xhalgn/1sDRgfHcqdarfd/ipN4S4YIRKhx7Yb6q6WnI8fBkvvRnGNJvQj8Yk0w2SyW6uGKmJc1RiXCZyupx/kDem5gOhq3zUuecD9GP+QFzcLqSypGKjgDBE+6zRsHKXBJs0RPTOjMzJu1SBHjrDBHvvXf6Xvn/uMNbVgkn8Xm+N29L3K9x9bdFTF4HP0iEMCS0maIuDmQawvCsIHZxwbe5d6vBKif88ypuZMyvQ1/7+q2n6wQJ0rkVFaqr+gZPIinLAEMtdZcOuNHi2t4TvT9+330VjT9s+7vNpCsPLfEWFzDcB8HW/VndW6AI6vy6ggBrjYaN6CdmTyyGf4CVUgtbfVD/aZ7XEFp3/mwFPOwtMJ3ZIrEr9XNRIRy0bVvp+aUpLVfUdqPNtIasvv4abV0K0vnJje76h87M0u6ewz3u3wOUdFXFOjo6SlUtT1S4SEd4sNltLHDkqtlrKgg/OBCOT6ydarCpRMcvHV+27cqOH6cun1qplML/fyKT6ZcAAwDvoktmAKjSsQAAAABJRU5ErkJggg==);*/ }

div.report_bottom_frame {
    display:block;
    height:25%;
    max-height:140px; /* 25% of 562px */
    width:100%;
    margin:0;
    padding:0;
    border: 0;
    position:absolute;
    bottom:0;
    border-right: 1px solid #abce7b;
    box-sizing:border-box;
}
div.report_right_frame {
    display:inline-block;
    margin:0;
    padding:0;
    border: 0;
    width:25%;
    height:75%; /* 78%;*/
    max-width:235px;
    max-height:421px;
    position:absolute;
    right:0;
    border-bottom: 1px solid #abce7b;
    box-sizing:border-box;
}
div.report_form_panel
{
    position:relative;
    width:100%;
    height:75%;
    max-height:421px; /* 75% of 562px */
    border:0;
    color:#abce7b;
    background:#000000
    border-right:1px solid #abce7b;
    border-bottom:1px solid #abce7b;
    box-sizing:border-box;
}
div.report_players_panel {
    width:100%;
    height:100%;
    overflow:scroll;
    overflow-y:hidden;
    white-space:nowrap;
}
div.report_questions_panel {
    height:100%;
    overflow:scroll;
    overflow-x:hidden;
}
div.report_form_block {
    width:100%;
    height:100%;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    background:#ffffff;
    color: #000000;
    border: 1px solid #000000;
    box-shadow: 0 0 1px 1px #ffffff inset;
    position:relative;
}
div.report_form_block form { position:absolute; top:0px; bottom:0px; left:0; right:0; margin-left:auto; margin-right:auto; margin-top:auto; margin-bottom:auto; height:246px; }
div.report_form_block a { color: #000000; }

div.report_player_block, div.report_player_block_selected {
    text-align:center;
    overflow:hidden;
    display:inline-block;
    width:120px;
    height:100%;
    white-space:normal;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    background:#BDE5F8;
    color:#000000;
    border: 1px solid #000000;
  /*  box-shadow: 0 0 1px 1px #ffffff inset;*/
    cursor:pointer;
}
div.report_player_block_selected { background:#abce7b!important; color:#000000; }
#report_player_block_first, #report_player_block_last {
    line-height:100%;
    text-align:center;
    overflow:hidden;
    /*   display:inline-block; */
    width:19px;
    height:100%;
    white-space:normal;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    background:#ffffff;
    color: #000000;
    border: 1px solid #ffffff;
  /*  box-shadow: 0 0 1px 1px #ffffff inset;*/
}
#report_player_block_first { position:absolute; left:0; top:0; }
#report_player_block_last { position:absolute; right:0; top:0; }
#report_player_block_first p, #report_player_block_last p { height:15px; margin-top:auto; margin-bottom:auto; position:absolute; top:0; bottom:0; left:0; right:0; }

div.report_question_block, div.report_question_block_selected {
    height:60px;
    overflow:hidden;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    background:#BDE5F8;
    color: #000000;
    border: 1px solid #000000;
/*    box-shadow: 0 0 1px 1px #ffffff inset;*/
    cursor:pointer;
}
div.report_question_block_selected { background:#abce7b!important; color:#000000!important;}

#report_question_block_first, #report_question_block_last {
    text-align:center;
    height:17px;
    overflow:hidden;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    background:#ffffff;
    color: #000000;
    border: 1px solid #ffffff;
  /*  box-shadow: 0 0 1px 1px #ffffff inset;*/
}
#report_question_block_first { position:absolute; top:0; left:0; width:100%; margin-bottom:45px; }
#report_question_block_last { position:absolute; bottom:0; left:0; width:100%; }
#report_question_block_first img, #report_player_block_last img { padding:1px; }

#form_title { background:#ffffff; color:#000000; }
#form_description { display:block; overflow:hidden; /*white-space:nowrap;*/ }
#form_image { height:80px; width:auto; border-radius:40px; background-color:#abce7b; /*box-shadow: 0 0 3px 1px #959393;*/ vertical-align: middle; margin:10px 0 5px 0;}
#form_input { min-height:90px; }
.report_player_icon { height:40px; width:auto; border-radius:20px; /*box-shadow: 0 0 2px 1px #959393;*/ vertical-align: middle}
.noselect {
    text-align:center;
    -webkit-user-select:none;
    -khtml-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none;
    -o-user-select: none;
}
.small { font-size:12px; }


.ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br {
    border-bottom-right-radius: 1.2em;
}
.ui-corner-all, .ui-corner-bottom, .ui-corner-left, .ui-corner-bl {
    border-bottom-left-radius: 1.2em;
}
.ui-corner-all, .ui-corner-top, .ui-corner-right, .ui-corner-tr {
    border-top-right-radius: 1.2em;
}
.ui-corner-all, .ui-corner-top, .ui-corner-left, .ui-corner-tl {
    border-top-left-radius: 1.2em;
}
.ui-widget-content {
    /* border: 1px solid #717536; */
    /* background: #fff url(images/ui-bg_flat_75_ffffff_40x100.png) 50% 50% repeat-x; */
    color: #222;
}
.ui-widget {
    font-family: Verdana,Arial,sans-serif;
    font-size: 1.1em;
}
.ui-slider-horizontal {
    height: 2.4em;
}
.ui-slider {
    position: relative;
    text-align: left;
}
element.style {
    left: 0%;
    /* background-color: rgb(255, 0, 0);
    background-position: initial initial;
    background-repeat: initial initial; */
}
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
    /* border: 1px solid #717536; */
    /* background: #e6e6e6 url(images/ui-bg_glass_75_e6e6e6_1x400.png) 50% 50% repeat-x; */
    font-weight: normal;
    /* color: #717536; */
}

.ui-slider-handle {
    position: absolute;
    z-index: 2;
    cursor: default;
    top:0;
    margin:0 0 0 -26px;
    border: 1px solid #959393;
    width:52px;
    height:40px;
    border-radius:20px;
    background: #ffffff url(' /img/slider_button.svg' ) center no-repeat;
    background-size:100% 100%;
    /*background-color: #EF696B;*/
    -webkit-transition: background-color 1000ms linear; -moz-transition: background-color 500ms linear; -o-transition: background-color 500ms linear; -ms-transition: background-color 500ms linear; transition: background-color 500ms linear;
}
.ui-slider-horizontal { border:0; background:initial; width:auto; margin:0 20px; }
.ui-slider-range { display:none!important; }
.ui-datepicker {
    padding:10px;
    border: 1px solid #717536;
    background: #ffffff;
    color: #000000;
    display:none;
}
div.slider-box {
    display:inline-block;
    width:60%;
    margin:10px;
    vertical-align:middle;
    height:42px;
    border-radius:20px;
    /*border:1px solid #959393;*/
    color: #000000;
    background: #ffffff url(' /img/slider.svg' ) center no-repeat;
/*    background-image:url('/img/slider.svg');*/
    background-size:100% 100%;
    /*background-color:#FFFFFF;*/
}
input.input_ScoreTo3, input.input_ScoreTo5, input.input_ScoreTo10, input.input_ScoreTo30, input.input_ScorePercent { width:40px; height:40px; border-radius:20px; border: 1px solid #959393; vertical-align:middle; text-align:center; font-family: 'Open Sans', 'sans-serif'; font-weight:400; font-size:20px;}
input.input_Text { height:40px; border-radius:20px; border: 1px solid #959393; vertical-align:middle; text-align:left; padding-left:20px; font-family: 'Open Sans', 'sans-serif'; font-weight:400; }
input.input_Number, input.input_Date, input.input_Time { height:40px; border-radius:20px; border: 1px solid #959393; vertical-align:middle; text-align:center; font-family: 'Open Sans', 'sans-serif'; font-weight:400; width:6em; }
input.input_Date { width:10em }
textarea.input_Multiline { height:40px; border-radius:20px; border: 1px solid #959393; vertical-align:top; text-align:left; font-family: 'Open Sans', 'sans-serif'; font-weight:400; width:6em; width:80%; height:72px; padding:7px 14px;}
select.input_DropdownTeams, select.input_DropdownPlayers { height:40px; border-radius:20px; border: 1px solid #959393; vertical-align:middle; text-align:left; padding-left:20px; font-family: 'Open Sans', 'sans-serif'; font-weight:400; }
div.dd-select { background-color:#abce7b!important; color:#000000!important; border:0; border-radius:40px; /*border: 1px solid #959393;*/ vertical-align:middle; text-align:left; padding-left:0px; font-family: 'Open Sans', 'sans-serif'; font-weight:400;}
div.dd-container { margin-left:10%; width:80%; }
ul.dd-options { width: 100% }
ul.dd-options { position:fixed; top:0; left:0; width:100%; height:100%; overflow:scroll; margin:0; padding:0;}
img.dd-selected-image { border-radius: 20px 0 0 20px; }
a.dd-selected { color:#000000!important; }

.dd-option {
    background: #BDE5F8!important;
    color: #000000!important;
}
.dd-option-selected {
    background: #abce7b!important;
    color: #000000!important;
}
.check_visible { 
    background: #BDE5F8!important;
    color: #000000!important;
}
.check_visible.report_question_block_selected { 
    background: #abce7b!important;
    color: #000000!important;
}
@media all and (min-width:1020px)
{
    #page  {width:1020px;position:relative;text-align:left;margin-left:auto;margin-right:auto;}
}
@media all and (min-height:600px)
{
    .report_player_icon { height:60px; border-radius:30px; }
}
@media all and (min-height:340px) and (max-height:420px)
{
    .mobile_line { height:5%; margin:0; padding:0; font-size:12px; }
    div.form_wrapper {height:84%;}
    /* div.report_left_frame { height:84%; }*/
    div.report_bottom_frame { height:30%; }
    /* div.report_right_frame { height:84%; } */
    div.report_form_panel { height:70%; }
    div.report_right_frame { height:70%; }
    h1 { font-size:14px; margin:0; padding:0;}
    body, p { font-size:12px; }
    #form_image { height:40px; }
    div.report_form_block form { height:201px; }
    /*   .report_player_icon { height:20px; border-radius:10px; } */
}
@media all and (max-height:340px)
{
    .mobile_line { height:5%; font-size:10px; margin:0; padding:0; overflow:hidden;}
    div.form_wrapper {height:84%;}
    /*  div.report_left_frame { height:84%; } */
    div.report_bottom_frame { height:30%; }
    /*  div.report_right_frame { height:84%; } */
    div.report_form_panel { height:70%; }
    div.report_right_frame { height:70%; }
    h1 { font-size:12px; margin:0; padding:0; display:inline-block; }
    body, p, .small { font-size:10px; }
    #form_image { height:40px; margin:5px; }
    div.report_form_block form { height:147px; }
    input.input_ScoreTo3, input.input_ScoreTo5, input.input_ScoreTo10, input.input_ScoreTo30, input.input_ScorePercent { height:24px; width:24px; border-radius:12px; font-size:12px; }
    input.input_Text { height:24px; border-radius:12px; }
    input.input_Number, input.input_Date, input.input_Time { height:24px; border-radius:12px; }
    input.input_Date { height:24px; border-radius:12px; }
    textarea.input_Multiline { height:43px; border-radius:12px; padding:7px 14px; }
    .ui-slider-horizontal { height: 24px; margin:0 12px }
    .ui-slider-handle {
        margin:0 0 0 -11px;
        width:22px;
        height:22px;
        border-radius:11px;}
    div.slider-box { margin:10px; height:24px; border-radius:12px;}
    /* .report_player_icon { height:20px; border-radius:10px; } */
}
@media all and (max-width:340px)
{
    h1 { font-size:12px; }
    body, p, .small { font-size:10px; }
    input.input_ScoreTo3, input.input_ScoreTo5, input.input_ScoreTo10, input.input_ScoreTo30, input.input_ScorePercent { height:24px; width:24px; border-radius:12px; font-size:12px; }
    input.input_Text { height:24px; border-radius:12px; }
    input.input_Number, input.input_Date, input.input_Time { height:24px; border-radius:12px; }
    input.input_Date { height:24px; border-radius:12px; }
    textarea.input_Multiline { height:43px; border-radius:12px; padding:7px 14px; }
    .ui-slider-horizontal { height: 24px; margin:0 12px }
    .ui-slider-handle {
        margin:0 0 0 -11px;
        width:22px;
        height:22px;
        border-radius:11px;}
    div.slider-box { margin:10px; height:24px; border-radius:12px; }
}
.tabcontent { padding:5px 10px; border:1px solid #777; border-top:none; margin:0; color:#000000; background:#ffffff; }
.tabheader-outer { padding: 0; }
.tabheader { width:100%; border-bottom:0; background-image:url('/img/line.png'); background-repeat:repeat-x; background-position: left bottom; font-size:14px;}
.tabheader a { display:inline-block; padding:5px; margin: 5px 0 0 0; border:1px solid #404040; text-align:center; text-decoration:none; font-weight:bold; background:#ffffff; color:#000000; }
.tabheader a:hover { text-decoration:underline; }
.tabheader a.active { padding: 7px 10px 6px 10px; margin:3px 0 0 0; border-bottom:none; background: #000000; color:#BDE5F8;}
/*------------------------*/
/* tables */
table.sheet {
    font-family:arial;
    background-color: #CDCDCD;
    color:black;
    margin:10px 0pt 15px;
    font-size: 8pt;
    width: 100%;
    text-align: left;
}

table.sheet thead tr th, table.sheet tfoot tr th {
    /*	background-color: #e6EEEE;*/
    background-color:#BDE5F8;
    color: #000000;
    border: 1px solid #000000;
    font-size: 8pt;
    padding: 4px;
}
table.sheet thead tr th {
    padding-right: 18px;
}
table.sheet thead tr .header {
    background-image: url(/img/bg.gif);
    background-repeat: no-repeat;
    background-position: center right;
    cursor: pointer;
}
table.sheet tbody td {
    color: #3D3D3D;
    padding: 4px;
    background-color: #ffffff;
    color: #000000;
    vertical-align: top;
}
table.sheet tbody tr.odd td {
    background-color:#ffffff;
    color:#000000;
}
table.sheet thead tr .headerSortUp {
    background-image: url(/img/asc.gif);
}
table.sheet thead tr .headerSortDown {
    background-image: url(/img/desc.gif);
}
table.sheet thead tr .headerSortDown, table.sheet thead tr .headerSortUp {
    /*background-color: #8dbdd8;*/
    background-color:#FF9B64;
}
.tutorial_button { display:inline-block; padding: 20px; background-color:#abce7a; color:#003463; font-weight:bold; border:2px outset; padding:20px; cursor:pointer; margin-bottom:15px; }
.tutorial_button:hover { background-color:#FF9B64;}
.tutorial { background-color:#ecc2a4; border:1px solid #003463; padding:20px; margin-bottom:15px; }
.hidden { display:none; }
a.active, li.active, ul.active { border:2px inset; background-color:#ecc2a4; }
.tutorial_button span:after { content: " bekijken"; }
.tutorial_button.active span:after { content: " verbergen"; }

.box_info, .box_success, .box_warning, .box_error, .box_validation {
    display: block;
    border: 1px solid;
    margin: 10px 0px;
    padding:15px 10px 15px 50px;
    background-repeat: no-repeat;
    background-position: 10px center;
}
.box_info {
    color: #00529B;
    background-color: #BDE5F8;
    background-image: url('/img/info.png');
}
.box_success {
    color: #4F8A10;
    background-color: #DFF2BF;
    background-image:url('/img/validgreen.png');
}
.box_warning {
    color: #9F6000;
    background-color: #FEEFB3;
    background-image: url('/img/attention.png');
}
.box_error {
    color: #D8000C;
    background-color: #FFBABA;
    background-image: url('/img/cancel.png');
}
 
.checked + span { font-weight:bold; }