/************************************
 * 
 * 	AUFTRAG
 * 	  
 */


h1{
	font-size: 20px;
	color: var(--main-bg-color);
}


/*********************************
 * Seitengliederung
 ********************************/
	.seite_h{
		border: 0px solid red;
		width: 100%;
		padding-left: 20px;

		font-size: 25px;
		font-weight: bold;
		color: rgb(0,53,78);

		display: flex;
		align-items: center;
		position: relative;
	}
	.seite_b{
		border: 0px solid red;
		width: 100%;
		padding: 0 10px;
	}
	.seite_f{
		
	}

	/* Distanzhalter */
	.seite_b .dist_s{
		height: 5px;
	}
	.seite_b .dist_m{
		height: 12px;
	}

/*********************************
 * seite_h
 ********************************/
	.seite_h .titel{
		border: 0px solid red;
		height: 100%;

		cursor: pointer;
		font-size: var(--fontSize_Seitentitel);
		font-weight: bolder;
		color: var(--main-bg-color);

		display: flex;
		align-items: center;
		justify-content: center;
	}
	.seite_h .neu{
		border: 0px solid red;
		height: 100%;

		cursor: pointer;
		font-size: var(--fontSize_New);
		font-weight: bolder;
		color: green;

		display: flex;
		align-items: center;
		justify-content: center;
	}
	.seite_h .neu:hover{
		color: #64FE2E;
	}
	.seite_h .reload{
		cursor: pointer;
		font-size: var(--fontSize_New);
		position: absolute;
		right: 30px;

	}

/*********************************
 * seite_b
 ********************************/


	.details_auftrag_chek {
		width: var(--fontSize_S);
		height: var(--fontSize_S);
		border: 1px	solid black;
		border-radius: 50%;
		background-color: #FF0000;
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		left: 5px;
	}
	.seite_b .details_body{
		border: 0px	solid darkred;
	}
	.seite_b .details_body_zeile{
		border: 1px	solid #A4A4A4;
		border-radius: 5px;
		margin: 5px;
		padding:	10px;
		background-color: #e0e0e0; 
		box-shadow: 0px -5px 10px 0px rgba(0, 0, 0, 0.5);
	}
	.seite_b .zeile {

		border: 0px	solid darkred;
		display: flex;
		justify-content: space-around;

		flex-direction: ;
	}
	.seite_b .zeile > div {
		border: 0px	solid darkred;
		width: 100%;
	}
	#w90{
		width: 90%;
	}
	#w80{
		width: 80%;
	}
	#w70{
		width: 70%;
	}
	#w60{
		width: 60%;
	}
	#w40{
		width: 40%;
	}
	#w30{
		width: 30%;
	}
	#w20{
		width: 20%;
	}
	#w10{
		width: 10%;
	}
	.details_line {
		border: 0px	solid darkred;
		padding: 2px 15px;
		display: flex;
		align-items: center;
		justify-content: space-around;

	}
	.details_line > .first{
		border: 0px	solid darkred;
		width: auto;
		white-space:nowrap;
		color: black;
		color: rgb(0,53,78);
	}
	.details_line > .line {
		margin: 0 10px;
		width: 100%;
		height: 80%;
		border-bottom: 1px dashed #2E2E2E;
			
	}
	.details_line > .last {
		border: 0px	solid darkred;
		display: flex;
	}

/*********************************
 * BUTTON'S
 ********************************/
	.seite_b button{

		background: none repeat scroll 0 0 transparent;
		border: medium none;
		border-spacing: 0;
		font-family: 'PT Sans Narrow',sans-serif;
		font-size: 16px;
		font-weight: normal;
		line-height: 1.42rem;
		list-style: none outside none;
		margin: 0;
		padding: 0;
		text-align: left;
		text-decoration: none;
		text-indent: 0;

		margin: 3px 10px;
		padding: 5px 10px;

		display: flex;
		align-items: center;
		justify-content: center;

		background: linear-gradient(-45deg, rgba(0,0,0,0.22), rgba(255,255,255,0.25));
		box-shadow: 
	    8px 8px 15px 0 rgba(0, 0, 0, 0.25),
	    -5px -5px 25px 0 rgba(0, 0, 0, 0.1);
	    

		color: rgb(0,53,78);
		font-size: var(--fontSize_S);

		
		border-radius: 10px;

	}
	.seite_b button:hover {  
		transform: translate(0px, -2px);
	}

	/* Grün = Neu*/
	.seite_b .btn_green{
		border: 1px solid rgba(0, 139, 0, 0.8);
	}
	/* Rot = Status schalten*/
	.seite_b .btn_red{
		border: 1px solid rgba(139, 0, 0, 0.8);
	}
	/* Orange = Suchen */
	.seite_b .btn_orange{
		border: 1px solid rgba(255, 118, 0, 0.8);
	}
	/* Blau = Bearbeiten*/
	.seite_b .btn_blue{
		border: 1px solid rgba(0, 0, 139, 0.8);
	}
	/* Beaun = zurück*/
	.seite_b .btn_brown{
		border: 1px solid rgba(139, 90, 43, 0.8);
	}
	/* Beaun = löschen*/
	.seite_b .btn_x{
		border: 1px solid rgba(255, 0, 0, 0.8);
	}

/*********************************
 * INPUTS'S
 ********************************/
	.details_line input{
		font-size: var(--fontSize_S);
		text-align: right;
		padding-right: 5px;
		border: 0px solid black;
		border-radius: 5px;
		margin: 0 5px;
		background: #EBEBEB;
	}
	.details_line select{
		font-size: var(--fontSize_S);
		text-align: right;
		padding-right: 5px;
		border: 0px solid black;
		border-radius: 5px;
		margin: 0 5px;
		background: #EBEBEB;
	}
	.details_line textarea{
		font-size: var(--fontSize_S);
		border: 0px solid black;
		border-radius: 5px;
		margin: 0 5px;
		background: #EBEBEB;
	}
	.details_line span{
		font-size: var(--fontSize_S);
		border: 0px solid black;
		border-radius: 5px;
		margin: 0 5px;
		background: #EBEBEB;
	}
	.details_line input[type="date"]{
		font-size: var(--fontSize_S);
		border: 0px solid black;
		border-radius: 5px;
		margin: 0 5px;
		background: #EBEBEB;
		background-color: #EBEBEB;
	}


	.details_line .nosave{
		border: 1px solid #A4A4A4;
		border: 1px solid rgb(245,169,169, 0.75);
	}
	.details_line .nosearch{
		background-color: rgb(246,227,206, 0.5);
	}
	.details_line input:focus {
	  border-color: green;
	}

/*********************************
 * INPUTS'S - FELDLÄNGE
 ********************************/
	.inp_s, .slc_s {
		width: 50px;
	}
	.inp_m, .slc_m {
		width: 150px;
	}
	.inp_l, .slc_l {
		width: 150px;
	}
	.inp_xl, .slc_xl {
		width: 200px;
	}
	.inp_xxl, .slc_xxl {
		width: 400px;
	}
	.inp_xxxl, .slc_xxxl {
		width: 450px;
	}

/*********************************
 * MOBILE-GERÄTE
 ********************************/

	/* Handy hoch */
	@media only screen and (max-width: 820px) {

		.seite_b .zeile {
			flex-direction: column;
		}

		.inp_s, .slc_s {
			width: 50px;
		}
		.inp_m, .slc_m {
			width: 50px;
		}
		.inp_l, .slc_l {
			width: 100px;
		}
		.inp_xl, .slc_xl {
			width: 150px;
		}
		.inp_xxl, .slc_xxl {
			width: 200px;
		}
		.inp_xxxl, .slc_xxxl {
			width: 250px;
		}

		#w90, #w80, #w70, #w60, #w50, #w40, #w30, #w20, #w10{
			width: 100%;
		}


	}
	/* Handy quer */
	@media only screen and (max-width: 1180px) {


		.inp_s, .slc_s {
			width: 50px;
		}
		.inp_m, .slc_m {
			width: 75px;
		}
		.inp_l, .slc_l {
			width: 150px;
		}
		.inp_xl, .slc_xl {
			width: 200px;
		}
		.inp_xxl, .slc_xxl {
			width: 400px;
		}
		.inp_xxxl, .slc_xxxl {
			width: 600px;
		}

		#w90, #w80, #w70, #w60, #w50, #w40, #w30, #w20, #w10{
			width: 100%;
		}

	}

/*********************************
 * SUCHFELD
 ********************************/






/*********************************
 * CLON PLANUNG
 ********************************/
	.clone_planung {
		display: flex;
		border: 1px solid black;
		border-radius: 5px;
		margin: 3px 0;
	}

	.clone_planung_container_1 {
		border: 0px solid red;
		width: 100px;
		
		padding: 5px;
	}
	.clone_planung_container_2 {
		border: 0px solid red;
		width: 50%;
		
		padding: 5px;
	}
	.clone_planung_container_2 textarea {
		width: 100%;
		height: 80px;
	}

	.clone_planung_container_3 {
		border: 0px solid red;
		width: 100px;
		display: flex;
		padding: 5px;
	}


	.clone_planung_btn_goto {
		border: 0px solid red;
		font-size: var(--fontSize_S);
		
		display: flex;
		align-items: center;
		margin-right: 10px;
	}
	.clone_planung_jahr{
		border: 0px solid red;
		font-size: var(--fontSize_S);
		display: flex;
		align-items: center;
		padding: 0 10px;
	}
	.clone_planung_techniker{
		border: 0px solid red;
		font-size: var(--fontSize_S);
		display: flex;
		align-items: center;
		padding: 0 10px;
	}