/* 
    Document   : projectform
    Created on : 8 juil. 2012, 18:06:41
    Author     : chip
    Description:
        Purpose of the stylesheet follows.
*/

/* 
   TODO customize this sample style
   Syntax recommendation http://www.w3.org/TR/REC-CSS2/
*/
                form.project_new {
			width: 97%;
			font-family: Arial,sans-serif; 
                        font-size: 12px;
			margin-left: auto;
                        margin-right: auto;
			padding: 0;
			border: 0;
		}
		form.project_new div.form_wrapper {
			margin: 0 -1%;
			padding: 0;
		}
		form.project_new fieldset {
			clear: both;
			margin: 0 0 20px 0;
			padding: 0;
			border: 0;
		}
                form.project_new div.stitle{
                    width: 100%;
                    margin-top: 20px;
                    margin-bottom: 10px;
                    padding-top: 2px;
                    padding-bottom: 2px;
                    background: #87a42f;
                    color: white;
                    text-align: left;
                    font-size: 14px;
                    font-weight: bold;
                }
                
                form.project_new div.stitle2{
                    width: 100%;
                    margin: 0 auto;
                    background: #fff;
                    color: black;
                    text-align: left;
                    font-size: 14px;
                }
                form.project_new div.int{
                    width: 100%;
                    margin-top: 8px;
                    margin-left: auto;
                    margin-right:auto;
                    background: #fff;
                    color: black;
                    text-align: left;
                    font-size: 12px;
                    border: 1px solid #DDD;
                }

                cnt_cat{
                    font-size: 14px;
                }
		/*
		---------------------------
		labels and wrappers
		--------------------------- */

		form.project_new label {
			margin: 0 1%;
			padding: 0;
			border: 0;
			float: left;
			display: table;
			width: 1%;
		}
		form.project_new span.wrapper {
			margin: 0;
			padding: 0;
			display: table-cell;
			width: 1%; /* firefox */
		}

                form.project_new span.checkbox {
			margin: 0;
			padding-left: 0px;
                        padding-top:  4px;
			display: table-cell;
                        text-align: left;
			width: 1%; /* firefox */
		}
                form.project_new span.cnt {
			margin: 0;
			padding-left: 0px;
                        padding-top:  8px;
			display: table-cell;
                        text-align: left;
			width: 1%; /* firefox */
		}
                
                form.project_new select {
			margin: 0;
			padding-left: 0px;
                        padding-top:  2px;
			display: table-cell;
                        text-align: left;
                        font-size: 14px;
                        font-weight: bold;
		}
		/*
		---------------------------
		width
		--------------------------- */

		form.project_new label.w100 {
			width: 98%;
			display: block;
		}
		form.project_new label.w75 {
			width: 73%;
			display: block;
		}
		form.project_new label.w50 {
			width: 48%;
			display: block;
		}
                form.project_new label.w40 {
			width: 38%;
			display: block;
		}
                form.project_new label.w28 {
			width: 26%;
			display: block;
		}
		form.project_new label.w25 {
			width: 23%;
			display: block;
		}
                form.project_new label.w22 {
			width: 20%;
			display: block;
		}
                form.project_new label.w20 {
			width: 18%;
			display: block;
		}
                form.project_new label.w18 {
			width: 16%;
			display: block;
		}
                form.project_new label.w15 {
			width: 13%;
			display: block;
		}
                form.project_new label.w14 {
			width: 12%;
			display: block;
		}
                form.project_new label.w12 {
			width: 10%;
			display: block;
		}
                form.project_new label.w10 {
			width: 8%;
			display: block;
		}
                form.project_new label.w08 {
			width: 6%;
			display: block;
		}
                form.project_new label.w07 {
			width: 5%;
			display: block;
		}
                 form.project_new label.w06 {
			width: 4%;
			display: block;
		}
                form.project_new label.w05 {
			width: 3%;
			display: block;
		}
                /*
             ---------------------------
             Height
             ---------------------------*/
                form.project_new label.h10 {
			height: 100px;
			display: block;
		}
		/*
		---------------------------
		position
		--------------------------- */

		form.project_new label.p25 {
			margin-left: 26%;
		}
		form.project_new label.p50 {
			margin-left: 51%;
		}
		form.project_new label.p75 {
			margin-left: 76%;
		}


		/*
		---------------------------
		errors
		--------------------------- */

		form.project_new label.error input.field,
		form.project_new label.error select.field,
		form.project_new label.error textarea.field {
			border-color: #dd1100;
		}

		form.project_new label.error span.title {
			color: #dd1100;
		}


		/*
		---------------------------
		title and examples 
		--------------------------- */

		form.project_new label span.title {
                    padding-top:2px;
                    font-weight: bold;
                    font-size: 12px;
		}

		form.project_new label span.example {
			color: #999;
			font-style: italic;	
		}


		/*
		---------------------------
		input/select fields 
		--------------------------- */

		form.project_new label input.field,
		form.project_new label select.field,
		form.project_new label textarea.field {
			width: 100%;
			display: block;
			border: 1px solid #d0d6da;
			border-left: 2px solid #d0d6da;
			background: #eff4e1;
			padding: 2px;
			font-family: sans-serif; font-size: 1em;
			box-sizing: border-box;
			-moz-box-sizing: border-box; /* gecko */
			-webkit-box-sizing: border-box; /* khtml/webkit */
			-ms-box-sizing: border-box; /* IE */
		}


		form.project_new label select.field {
			padding: 4px 1px 1px 1px; /* have to try out */
		}

		form.project_new label input.field:focus,
		form.project_new label select.field:focus,
		form.project_new label textarea.field:focus {
			border: 1px solid #d0d6da;
			border-left: 3px solid #57ab44;
			background: #e0eadd;
		}
                form.project_new label textarea.notice{
                        width: 100%;
                        height: 100px;
			display: block;
			border: 1px solid #d0d6da;
			border-left: 2px solid #d0d6da;
			background: #eff4e1;
			padding: 2px;
			font-family: sans-serif; font-size: 1em;
			box-sizing: border-box;
			-moz-box-sizing: border-box; /* gecko */
			-webkit-box-sizing: border-box; /* khtml/webkit */
			-ms-box-sizing: border-box; /* IE */
                        word-wrap: normal;
                        text-align: justify;
                        resize: none;     
                }
                form.project_new label textarea.notice:focus{
                        border: 1px solid #d0d6da;
			border-left: 3px solid #57ab44;
			background: #e0eadd;
                }
                
                
		/* Pflichtfelder
			mandatory fields */
		form.project_new label.mandatory input.field,
		form.project_new label.mandatory select.field,
		form.project_new label.mandatory textarea.field {
			border: 1px solid #809db5;
			border-left: 8px solid #809db5;
		}

		/* Kalenderfelder
			calendar fields */
		form.project_new label.calendar input.field {
			padding-right: 25px;
		}


		/*
		---------------------------
		checkboxes and radios
		--------------------------- */

		form.project_new input.select {
			display: block;
			float: left;
			margin: 0;
		}
                
                


		/*
		---------------------------
		submit button
		--------------------------- */

		form.project_new input.submit {
			width: 100%;
			background: #809db5;
			color: #fff;
			padding: 2px 0;
			font-size: 1em;
                        text-align : center;
		}
                form.project_new img.button {
                        display: inline-block;
                        margin-left: auto;
                        margin-right: auto;
                        width: auto;
		}
                
                .prj_form_buttons{
                        display: block;
                        text-align: center;
                        margin-left : auto;
                        margin-right : auto;
                        width : auto;
                }

/*		form.project_new input.submit:hover,
		form.project_new input.submit:focus {
			background: #57ab44;
			/* cursor: pointer;  sorry, can't use that one in front of Opera */
/*		}   */


		/*
		---------------------------
		calender icon
		--------------------------- */
		
		form.project_new a.calendar {
			float: right;
			position: relative; top: 3px; left: -20px;
			z-index: 1000;
		}
		form.project_new a.calendar img {
			border: 0;
			position: absolute; top: 0; left: 0;
			z-index: 1001;
		}

		
		/*
		---------------------------
		additional styles for
		input/select fields
		--------------------------- */

		form.project_new label.inputselect span.title {
			margin: 0 0 2px 0;
			display: table; /* act as inline-block */
		}

		form.project_new label span.title:hover,
		form.project_new label span.title:focus {
			color: #57ab44;
			cursor: pointer;
		}

		form.project_new label br {
			margin: 0 0 2px 0;
		}


		/*
		---------------------------
		additional styles for
		checkboxes and radios
		--------------------------- */

		form.project_new label.wauto {
			width: auto;
			margin-right: 15px;
		}
		form.project_new label.radiocheck {
			margin-bottom: 10px;
		}
		form.project_new label.radiocheck span.wrapper {
			padding-right: 0;
		}
		form.project_new label.wauto span.wrapper {
			display: inline;
		}
		form.project_new label.radiocheck span.title {
			display: block;
			margin: 0 0 0 20px;
			padding: 0;
		}


		/*
		---------------------------
		clearing elements
		--------------------------- */

		.clear {
			clear: both;
			display: block;
			padding: 0 0 18px 0;
		}
                
                .newparagraph {
			clear: both;
			display: block;
			padding: 0 0 24px 0;
		}
                
                
                .newline {
                        clear: both;
			display: block;
			padding: 0px 0px 12px 0px;
		}
                
		.mb0 {
			margin-bottom: 0 !important;
		}
		.pb20 {
			padding-bottom: 20px !important;
		}
                
                

		/*
		---------------------------
		form content
		--------------------------- */

		form.project_new p,
		form.project_new h3 {
			margin: 0 1% 10px 1%;
		}
		
		div.errors {
			display: none; /* JS toggle */
			margin: 0 1% 30px 1%;
			padding: 5px 10px;
			background: #dd1100;
		}
		div.errors p {
			color: #fff;
			margin: 0 0 0.5em 0;
		}
		div.errors ul {
			margin: 0 0 0 1.6em;
			padding: 0;
		}
		div.errors ul li {
			margin: 0;
			padding: 0;
			color: #fff;
			list-style-type: square;
		}
                
                
                
                /* ajax project add form css style */
                
                
                form.new_prj_steps{
 			width: 97%;
			font-family: Arial,sans-serif; 
                        font-size: 18px;
                        font-weight: bold;
			margin-left: auto;
                        margin-right: auto;
			padding: 0;
			border: 0;                    
                }
                    
                
                form.new_prj_steps div.form_wrapper {
			margin: 0 -1%;
			padding: 0;
		}
		form.new_prj_steps fieldset {
			clear: both;
			margin: 0 0 20px 0;
			padding: 0;
			border: 0;
		}
                
                form.new_prj_steps label {
			margin: 0 1%;
			padding: 0;
			border: 0;
			float: left;
			display: table;
			width: 1%;
		}
		form.new_prj_steps span.wrapper {
			margin: 0;
			padding: 0;
			display: table-cell;
			width: 1%; /* firefox */
		}
                
                form.new_prj_steps label.w100 {
			width: 98%;
			display: block;
		}
                form.new_prj_steps label.w90 {
			width: 88%;
			display: block;
		}
                form.new_prj_steps label.w80 {
			width: 78%;
			display: block;
		}
                form.new_prj_steps label.w20 {
			width: 18%;
			display: block;
		}
                form.new_prj_steps label.w10 {
			width: 8%;
			display: block;
		}
                form.new_prj_steps span.field {
			width: 100%;
			display: block;
			
			padding: 8px;
			font-family: sans-serif; 
			box-sizing: border-box;
			-moz-box-sizing: border-box; /* gecko */
			-webkit-box-sizing: border-box; /* khtml/webkit */
			-ms-box-sizing: border-box; /* IE */
		}
                form.new_prj_steps span.step_current {
                    color : #57ab44;
                }
                form.new_prj_steps span.step_awaiting {
                    color : #dfdfdf;
                }
                form.new_prj_steps span.step_finished {
                    color : blue;
                }
                form.new_prj_steps span.stk_finished {
                    padding: 4px;
                    color : blue;
                    font-size:14px;
                    font-weight : bold;
                }
                form.new_prj_steps span.stk_current {
                    padding: 4px;
                    color : #57ab44;
                    font-size:14px;
                    font-weight : bold;
                }
                form.new_prj_steps span.stk_awaiting {
                    padding: 4px;
                    color : #dfdfdf;
                    font-size:14px;
                    font-weight : bold;
                }
                
                form.new_prj_steps span.icon {
			width: 100%;
			display: block;	
                        
			font-family: sans-serif; 
			box-sizing: border-box;
			-moz-box-sizing: border-box; /* gecko */
			-webkit-box-sizing: border-box; /* khtml/webkit */
			-ms-box-sizing: border-box; /* IE */
		}