@import url('https://fonts.googleapis.com/css?family=Work+Sans:300,400,500,600');
/* Default
–––––––––––––––––––––––––––––––––––––––––––––––––– */
:host{
  --primary-color:#6dc7be;
}
html,
body{
  height:100%;
  width:100%;
  font-family: "Work Sans", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
  background-color: #eceef2;

}
.fixed{
	position:fixed;
}
#pages{
  height:100%;
}
hr{
	margin:20px 0;
}
.rounder-20{
	border-radius:20px;
}
span{
	display:block;
}
.border-bottom{
	border-bottom:1px solid rgba(0,0,0,0.57);
	margin-bottom:10px;
	margin-top:10px;
}
a{
	cursor:pointer;
}
.hidden{
	display:none;
}
/* Buttons & Controllers
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.button iron-icon{
	margin-right:5px;
}
#buttonsWrapper #continueButton{
	color:#FFFFFF;
	background-color: #6dc7be;
}

.paper-checkbox-default{
	width:18px;
    margin: auto;
    display: block;
 }
#checkboxContainer #checkbox.paper-checkbox{
	border-radius:50%;
	height:18px;
	width:18px;
}
#checkboxContainer #checkbox.checked.paper-checkbox{
	background-color: #6dc7be;
	border-color:#6dc7be;
}
.dt-buttons .dt-button{
	float:left;
	display:block;
	margin-right:10px;
	padding:10px;
	background-color: #6dc7be;
}
/* Font & Text
–––––––––––––––––––––––––––––––––––––––––––––––––– */
h1,
h2,
h3{
	font-size:28px;
	text-transform:uppercase;
	margin:0;
	font-weight:600;
	letter-spacing:0;
}
h3{
	font-size:20px;
}
.t-center{
	text-align:center;
}
/* Header
–––––––––––––––––––––––––––––––––––––––––––––––––– */
#logo{
	padding:5px 0;
	height:52px;
}
header.main-header{
	width:100%;
	position:fixed;
	height:62px;
	z-index:999;
	-webkit-box-shadow: 1px 1px 2px 0px rgba(0,0,0,0.28);
	-moz-box-shadow: 1px 1px 2px 0px rgba(0,0,0,0.28);
	box-shadow: 1px 1px 2px 0px rgba(0,0,0,0.28);
}
.header-inner{
	margin:0 20px;
}
/* Navigation
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.navigation-left{
	left:0;
	top:0;
}
#main-navigation{
	margin-top:62px;
	background-color:transparent;
	color: #b0bec5;
}

#main-navigation a{
	color: #b0bec5;
}
paper-item.main-navigation{
	border-left:3px solid transparent;
}
.iron-selected paper-item,
paper-item.main-navigation:focus,
paper-item.main-navigation:active,
paper-item.main-navigation.iron-selected{
	border-left:3px solid #00bfe8;
	background-color: #2a3344;

}
.page-submenu{
	padding-left:30px;
}
.iron-selected paper-item:before{
	position:absolute;
	top:0;
	bottom:0;
	right:0;
	left:0;
	content:'';
	opacity:0.17;
}
iron-icon.main-navigation{
	margin-right:10px;
}
/* Padding & Margin
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.padding-2-5{
	padding:2px 5px;
}
.padding-0-12{
	padding:0 12px;
}
.padding-20-20-0-20{
	padding:20px 20px 0 20px;
}
.padding-0-20-20-20{
	padding:0 20px 20px 20px;
}
.padding-20{
	padding:20px;
}
.margin-bottom-10{
	margin-bottom:10px;
}
.margin-20-left{
	margin-left:20px;
}
.margin-20{
	margin:20px;
}
.margin-20-0{
	margin:20px 0;
}
.no-margin{
	margin:0;
}
/* Pages
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.page-content{
	margin:82px 20px 20px 20px;
}
.page-content-inner{
	padding:20px;

	-webkit-box-shadow: 1px 1px 2px 0px rgba(0,0,0,0.28);
	-moz-box-shadow: 1px 1px 2px 0px rgba(0,0,0,0.28);
	box-shadow: 1px 1px 2px 0px rgba(0,0,0,0.28);
}
.page-default{
	height:100%;
}
.page-default-sub{
	height:100%;
}
/* Overlay & Dialog & Modal
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.dialog_full {
    position: fixed;
    top: 80px;
    width: 95%;
    height: 80%;
    overflow: auto;
}
.overlay_black{
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background-color:rgba(0,0,0,0.37);
}
.dialog_halve {
    position: fixed;
    top: 80px;
    width: 85%;
    height: 70%;
    overflow: auto;
}
#dialog_course{
}
.dialog_full > *:first-child{
	margin:0;
}
.dialog_full > *{
	margin:0;
	padding:0;
}

 paper-tabs {
        --paper-tabs-selection-bar-color: #6dc7be;
        color:black;
        background-color: rgba(255,255,255,1);
        height:54px;

	-webkit-box-shadow: 1px 1px 2px 0px rgba(0,0,0,0.28);
	-moz-box-shadow: 1px 1px 2px 0px rgba(0,0,0,0.28);
	box-shadow: 1px 1px 2px 0px rgba(0,0,0,0.28);
}

.mailing-table  .table-row{
    border-top: 1px solid #ddd;
 }
.mailing-table  .table-row:nth-child(even){
	background-color: #f2f2f2;
}
.mailing-table .table-row:nth-child(odd){
}
#tabsContent paper-tab{
	width:20%;
}
#tabsContent #selectionBar{
  border-color: #6dc7be;
}
#tabsContent paper-ripple #background{
   background-color: #6dc7be;
 }
.dialog_header{
	z-index:999;
}
.dialog_full .button paper-button,
.dialog_full input{
	width:100%;
	margin:0;
}
.dialog_full select{
	display:block;
	width:100%;
	margin:0;
	height:50px;
}
#dialog_course_persons_conflict input{
    border-width:0px;
}
input[readonly],
input[readonly="readonly"]{
    background-color: #f9f9f9;
    border-width:0px;
}
input:-moz-read-only{
    background-color: #f9f9f9;
    border-width:0px;

}
input:read-only {
    background-color: #f9f9f9;
    border-width:0px;
}
input.input_text_only{
	padding:0;
	margin:0;
	background-color:transparent;
	border:0;
	font-weight:600;
}
/* Stepper
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.paper-stepper #horizontalStepLabel #label paper-ripple{
	display:none
}
.paper-stepper #horizontalStepLabel #label{
	height:50px;
}
.paper-stepper #horizontalStepLabel #badge{
	background-color:#6dc7be;
}
.paper-stepper #content-wrapper{
	margin-top:68px;
}
.paper-stepper #content-wrapper #contentWrapper{
	padding-top:128px;
}

 #paper-stepper-course{
    position: absolute;
    top: 0;
    width: 100%;
}
#paper-stepper-course[opened]{
	max-height: 100%;
    height: 100%;
}
.circle{
    margin: auto;
  -webkit-border-radius: 16px;
  -moz-border-radius: 16px;
  border-radius: 16px;

	width:16px;
	height:16px;
	border:2px solid #909090;
}
.circle.filled{
	background-color:#6dc7be;
	border-color:#6dc7be;
}
/* Align
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.right{
	float:right;
}
.left{
	float:left;
}
.vertical-align-wrap {
  width: 100%;
  height: 100%;
  display: table;
}
.vertical-align {
  display: table-cell;
}
.vertical-align--middle {
  vertical-align: middle;
}
.align-middle{
  display:block;
  margin-left: auto;
  margin-right: auto;
}

/* Grid
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.panel{
	position:relative;
	float:right;
}
.left_panel{
	z-index:99;
	position: fixed;
	width:20%;
	left: 0;

   -webkit-transition: left 0.25s;
    -moz-transition: left 0.25s;
    -o-transition: left 0.25s;
    transition: left 0.25s;
}
.right_panel{
	width:100%;
}
.panel_close{
	left:-20%;
}
.page-default .columns:first-of-type{
	margin-left:0;
}
.container{
  max-width: none;
  width:100%;
}
.height-100{
  height:100%;
}
/* Images
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.background-image-default{
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
/* Colours
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.t-white{
	color:#FFFFFF;
}
.t-black{
	color: rgba(0,0,0,0.87);
}
.bg-white{
	background-color:#FFFFFF;
}
.bg-mint{
	background-color: #6dc7be;
}
.bg-grey{
	background-color: #eceef2;
}
.bg-blue{
	background-color: #56bdde;
}
.bg-navyblue{
	background-color: #2f3b4c;
}
.bg-yellow{
	background-color: #fec400;
}
.bg-orange{
	background-color: #ff8762;
}
.bg-red{
	background-color: #ff6160;
}

/* Hiding
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.course-type-onderwijsbank .m6-hide,
.course-type-m6-online .m6-hide,
.course-type-m6 .m6-hide{
	display:none;
}


.onderwijsbank-show{
	display:none;
}
.onderwijsbank-hide{
  display:block;
}
.course-type-onderwijsbank .onderwijsbank-hide{
	display:none;
}
.course-type-onderwijsbank .onderwijsbank-show{
	display:block;
}
#dialog_main_personen .person-hide{
	display:none;
}
#dialog_main_cursisten .student-hide{
	display:none;
}
/* Tables
–––––––––––––––––––––––––––––––––––––––––––––––––– */
table.table-data-default {
	display: table;
    width: 100%;
    position: relative;
    margin: 0 auto;
    background: #fff;
    font-size:13px;
    font-weight:100;
}
table.table-data-default tfoot{
	display:table-header-group;
}

.table-icon{
	color:#6dc7be;
}
table.table-data-default th{
	color:#FFFFFF;
    border:none;
    padding: 2px 5px;
}
table.table-data-default tbody tr td {
    border:none;
    vertical-align: middle;
}
table.table-data-default tbody tr.line-through td{
text-decoration: line-through;
}
table.table-data-default tbody tr.bold td{
	font-weight:bold;
}

table.table-data-default input{
	color:#222;
	padding-right:0;
	padding-left:10%;
	width:90%;
}
table.table-data-default input.number-min,
table.table-data-default input.number-max,
table.table-data-default .date-label,
table.table-data-default input.hasDatepicker{
	width:45%;
}
table.table-data-default input.number-min,
table.table-data-default input.datepicker-min{
	margin-left:0;
	margin-right:5%;
}
table.table-data-default input[type="checkbox"]{
    max-width: 20px;
}
.yadcf-filter-wrapper-inner{
	display:block;
	border:none;
}
.yadcf-filter-reset-button{
	padding: 0px;
    margin-top: 20px;
    display:none;
}
table.table-data-default .yadcf-filter-range-date{
	width:40%;
	float:left;
}
.yadcf-number-slider-filter-wrapper-inner{
	width:auto;
}
.yadcf-filter{
	padding:16px 0;
}
table.table-data-default tbody tr td:first-child,
table.table-data-default thead tr th:first-child {height: 0px; width: 0px; padding:0;cursor: auto;}
table.table-data-default tbody tr td:first-child input,
table.table-data-default thead tr th:first-child input{display:none;}
table.table-data-default tbody tr td:nth-child(2),
table.table-data-default thead tr th:nth-child(2){
	width:70px;
}
table.table-data-default th:nth-child(7),
table.table-data-default td:nth-child(7){
	width:40px;
}
table.table-data-default th:last-child,
table.table-data-default td:last-child{
	width:110px;
}
#table-students.table-data-default th:nth-child(7),
#table-students.table-data-default td:nth-child(7){
	width:auto;
}
#table-students.table-data-default th:last-child,
#table-students.table-data-default td:last-child{
	width:auto;
}
table.table-data-default .table-icon paper-icon-button{
	padding:0;
	width:25px;
	height:25px;
}
table.dataTable.display tbody>tr.selected>.sorting_1,
table.dataTable tbody>tr.selected, table.dataTable tbody>tr>.selected{
	background-color: #D9FFA9!important;
}
/* Media Queries
–––––––––––––––––––––––––––––––––––––––––––––––––– */
@media screen and (max-width: 680px) {
	.left_panel{
		width:auto;
	}
	.panel_close{
		left:-100%;
	}
	.dataTables_wrapper{
   		overflow-x: scroll;
	}
}
