/** used for installation: see heaven of Peter Borgers */

/** new per 2017-04 */

.wait-box {
  position: absolute;
  left: 100px;
  top: 90px;
  z-index: 100;
}


/** new per 2017-03-27 */
/*
.artist-count {
  display: inline-block ;
  float: right;
}

.artist-biography {
  display: inline-block ;
}
*/
/*
	.documentation {
	  width: 30%;
	  display: inline-block;
	}
	.documentation img {
	  width: 100%;
	}
*/

/** end of instalation */

/** playlist */
.share textarea {
  width: 100%;
}
.confirm-box {
  width: 100%;
}
.confirm-box .button {
  width: 45%;
  border: 1px solid darkgray;
  display: inline-block;
  padding: 4px;
  text-align: center;
}



/** end */
/* user manager */
.half {
  width: 49%;
  display: inline-block;
  vertical-align: top;
  padding-right: 6px;
}
.dialog-user-manager .user {
  padding-bottom: 5px;
  border-bottom: 1px solid lightgray;
}
.dialog-user-manager .button {
  border: 1px solid darkgray;
  display: inline-block;
  padding: 4px;
  text-align: center;
}


/** */
[ng\:cloak], [ng-cloak], .ng-cloak {
  display: none !important;
}

#id-logo {
  margin-top: 100px;
  text-align: center;
  font-family: arial, sans-serif;
  width: 100%;;
}
/* copy from /vendor/ng-sortable/dist/ng-sortable.css */
/* ************************************** */
/* Mandatory CSS required for ng-sortable */
/* ************************************** */

.as-sortable-item, .as-sortable-placeholder {
  display: block;
}

.as-sortable-item {
  -ms-touch-action: none;
  touch-action: none;
}

.as-sortable-item-handle {
  cursor: move;
}

.as-sortable-placeholder {
}

.as-sortable-drag {
  position: absolute;
  pointer-events: none;
  z-index: 9999;
}

.as-sortable-hidden {
  display: none !important;
}

.as-sortable-un-selectable {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
/** end copy */


/*
  de overflow van de question moet hidden zijn

.header-element .body {
  width: 185px;
}

*/

/*
  used to show an element in the dropdown thats clickable
  question left button, dropdown
*/

/* obsolete
	.dropdown-content h2 {
	  padding-top: 10px;
	  padding-bottom: 20px;
	}
*/

/*
	.dropdown-content .dropdown-link {
		color: grey;
	}

	.dropdown-content .dropdown-link.active {
		color: red;
	}
*/

/**
  the filters on fields in the dropdown

.search-fields .filter-item {
  padding-left: 20px;
}
.search-fields .filter-item.active {
  color: red;
}

*/

/* for the modal dialog
.ng-modal-overlay {
  position: absolute;
  z-index: 9999;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #000000;
  opacity: 0.8;
}
*/
/*
.ng-modal-dialog {
  z-index: 10000;
  position: absolute;
  width: 50%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  background-color: #fff;
  box-shadow: 4px 4px 80px #000;
}
*/
/*.ng-modal-dialog-content {
  padding: 10px;
  text-align: left;
}*/
/*.ng-modal-close {
  position: absolute;
  top: 3px;
  right: 5px;
  padding: 5px;
  cursor: pointer;
  font-size: 120%;
  display: inline-block;
  font-weight: bold;
  font-family: 'arial', 'sans-serif';
}*/

/** handeling dialog forms
.form .button {
  -moz-box-shadow: inset 0px 1px 0px 0px #ffffff;
  -webkit-box-shadow: inset 0px 1px 0px 0px #ffffff;
  box-shadow: inset 0px 1px 0px 0px #ffffff;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ffffff), color-stop(1, #f6f6f6));
  background: -moz-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
  background: -webkit-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
  background: -o-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
  background: -ms-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
  background: linear-gradient(to bottom, #ffffff 5%, #f6f6f6 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f6f6f6', GradientType=0);
  background-color: #ffffff;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  border: 1px solid #dcdcdc;
  display: inline-block;
  cursor: pointer;
  color: #666666;
  font-family: Arial;
  font-size: 15px;
  font-weight: bold;
  padding: 6px 24px;
  text-decoration: none;
  text-shadow: 0px 1px 0px #ffffff;
}
.form .button:hover {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f6f6f6), color-stop(1, #ffffff));
  background: -moz-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
  background: -webkit-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
  background: -o-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
  background: -ms-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
  background: linear-gradient(to bottom, #f6f6f6 5%, #ffffff 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f6f6f6', endColorstr='#ffffff', GradientType=0);
  background-color: #f6f6f6;
}
.form .button:active {
  position: relative;
  top: 1px;
}
*/


/** handling drag drop
.column-drag-handle {
  display: inline-block;
  text-align: center;
  width: 100%;
}
*/

.form-search .selectable {
  border: 1px solid black;
  width: 200px;
}
.form-search .selectable .right {
  float: right;
}

/** when the api returns an error */
.board-error {
  color: red;
  white-space: normal ;
  padding-top: 12px;
  padding-bottom: 12px;
}


/*********************************
Should be moved to the Less files
*/

/* to make a button like a button on the login screen (directive.loginOverlay) */
#login-overlay #login-caroussel .screens.horizontal .scroller #login-start .content .form form .control input[type="button"] {
  color: white;
  border: 1px solid white;
  background-color: transparent;
  width: 100%;
  text-align: center;
  padding: 5px;
  font-size: 12px;
  line-height: 1.2;
  letter-spacing: .016em;
  line-height: 1.4;
  border-radius: 1em;
}

/** 2016.12 should be in the less files */
.column.header-element .left  {
  float: left;
}
.query-form {
  width: 100%;
}
.query-button {
  display: inline-block;
}