@charset "UTF-8";

/**
 *   by Georg Ording
 *   2012-04-10
 */

@media all
{

    /* ################ Dummy        ################ */
    /* **************** Dummy  END   **************** */

    /* ################ help        ################ */

    .displayHelp{
        background: url(../images/icons/helpOnOff.png) no-repeat center top transparent;
        background-size: cover;
        width: 30px;
        height: 30px;
        position: absolute;
        right: 0;
        top: -3px;
        z-index: 5000;
    }
    .displayHelp.close{background-position: center bottom;}
    .displayHelp.secondLevel{z-index: 4900;}
    .helpContent{
        background-color: #333333;
        border: 1px inset #DDDDDD;
        box-shadow: 1px 1px 2px #333333;
        color: #cccccc;
        font-size: 0.85em;
        padding: 5px;
        position: absolute;
        right: 12px;
        text-shadow: none;
        top: 12px;
        width: 320px;
        z-index: 4950;

    }
    .helpContent.oneEm{font-size: 1em;}
    .helpContent.secondLevel{z-index: 4850;}
    /* **************** help  END   **************** */

    /* ################ verticalMenu        ################ */


    /* **************** verticalMenu  END   **************** */

	/* ################ Header        ################ */
	#header{
        background-color: rgb(255, 255, 255);
		border: 1px solid rgba(210,210,210,1);
		padding: 10px 20px;
		margin-bottom: 10px;
		box-shadow: 3px 5px 7px #CCC;
	}
    #header #headerLogo{margin: 0 auto; width: 228px;}
    #header h1{text-align: center;}
    #header h1 a{color: #000099; text-shadow: 2px 2px 8px #000066;}
    #header h4{color: #999999; text-shadow: 1px 1px 4px #666666;}

	#header #languages{float: right; clear: both; margin-top:10px;}
    
	/* **************** Header  END   **************** */

	/* ################ Nav_main        ################ */
	#nav_main{
		background-color: rgba(227, 214, 171, 1);
        height: 12px;
		padding: 10px 20px;
		margin: 5px 0;
		box-shadow: 3px 5px 7px #CCC;
	}
	#nav_main a{color: #000000; font-size: 14px;}
	#nav_main a:hover{color: #C77C52;}

	/* **************** Nav_main  END   **************** */

	/* ################ nav_sub        ################ */

	#nav_sub{float: right;}
	.nav li a{border-color: #FFFFFF; color: #FFFFFF; text-decoration: none; font-size: 11px; line-height: 1em;}

	/* **************** nav_sub  END   **************** */


	/* ################ Nav_admin        ################ */
	#nav_admin{background-color: rgba(0,0,0,0.75); color: rgba(255,255,255,1);}
	#headerWundManager #nav_admin{background-color: rgba(125, 125, 125, 0.75); color: rgba(50,55,55,1);}
	#nav_admin ul{list-style: none outside none; margin: 0;}
	#nav_admin li{border: 0 solid #FFFFFF; float: left; padding: 3px 10px; }
	#nav_admin li a{border: 0 solid #FFFFFF; float: left; padding: 3px 10px; }
	#nav_admin li:last-child {border-width: 0;}

	#nav_admin ul.firstLevel li{position:relative;}
	#nav_admin ul.firstLevel li ul{display: none;}
    #nav_admin ul.firstLevel li:hover ul,
	#nav_admin ul.firstLevel li:active ul{display: block; -webkit-user-select: none; -webkit-touch-callout: none;}

	#nav_admin ul.secondLevel{
        background-color: #000000;
        border: 0 solid #FFFFFF;
        box-shadow: 3px 5px 12px 4px rgba(200, 128, 200, 0.1);
        left: 0;
        position:absolute;
        top: 24px;
        z-index: 15000 !important;
    }
	#nav_admin ul.secondLevel li{border-width: 0 0 1px 0; float: none; height: 17px; line-height: 1.2em; white-space: nowrap;}
	#nav_admin ul.secondLevel li.separator{background-color: #555555; border-width: 0 0 1px 0; float: none; height: 5px;}
	#nav_admin ul.secondLevel li.search{height: 22px;}
	#nav_admin ul.secondLevel li a{border-width: 0; color: #FFFFFF;  font-size: 14px; line-height: 1.2em; text-decoration: none;}
	#nav_admin ul.secondLevel li:last-child {border-width: 0;}

	#nav_admin ul.secondLevel li:hover{background-color: #FFFFFF; border: 1px solid #000000;}
	#nav_admin ul.secondLevel li:hover a{color: #000000;}

    #nav_admin input{background-color: #CCCCCC; font-size: 10px; padding: 0 1px; width: 90%; }

    #nav_admin.fixed{border-width: 0 1px 1px 0; border-style: solid; border-color: #FFFFFF; position: fixed; top: 0; width: 1024px; z-index: 5000;}

	/* **************** Nav_admin  END   **************** */

    /* ################ Nav_loggedInUser        ################ */

    #userMenu{background-color: rgb(240, 240, 240); border-radius: 8px; border: 2px solid rgb(250, 55, 55); box-shadow: 3px 3px 2px rgb(220,180,180);}
    #userMenu li{color: #333333; font-weight: bold; opacity: 1; padding: 5px 40px; text-align: center;}
    #loginMenu li a,
    #userMenu li a{color: inherit !important;}
    #userMenu li:hover{background-color: #FE4E4E; color: #FFFFFF; text-shadow: 1px 1px 1px #FEA5A5;}
    #loginMenu li:hover{background-color: #333333; color: #CCCCCC; text-shadow: 1px 1px 1px #444444;}
    #userNameWrapper #userMenu{display: none; position: absolute; z-index: 1000;}
    #userNameWrapper:hover #userMenu{display: block;}

    /* **************** Nav_loggedInUser  END   **************** */

	/* ################ Info        ################ */
	#info{background-color: rgba(196,196,196,0.5);	color: rgba(54,54,226,1); padding: 10px;}
	#info #cont{padding: 10px 20px;}

    #toolTip{background-color: rgba(255, 255, 255, 1); border: 1px solid #FF0000; box-shadow: 2px 1px 1px #CF2222; color: rgb(170, 0, 0); font-size: 14px; height: 20px; padding: 5px 10px; position: fixed; text-align: center; width: 100px; z-index: 2000;}
/* **************** Info  END   **************** */

	/* ################ Languages        ################ */

    #languages li{float: left; margin-right: 5px;}
    #languages .selected{opacity: 1;}
    #languages .available{opacity: .5;}
    #languages  img:hover{opacity: 1;}

	/* **************** Languages  END   **************** */


	/* ################ Main        ################ */

    .row{display: flex; justify-content: space-around; align-items: center;}

    .flexLine{display: flex; flex: 1; align-items: flex-end;}
    .flexLine.folded{margin: 0;}
    #userPermissionSection .permissionSubGroups .flexLine div:last-of-type{margin: 0 70px 0 auto;}
    .flexLine div:last-of-type{margin: 0 10px 0 auto;}
    .spaceBetween{
        display: flex;
        justify-content: space-between;

    }
    .spaceAround{
        display: flex;
        justify-content: space-around;
    }
    .flexLine.center{
        justify-content: center;
    }
    .flexLine.start{
        justify-content: start;
    }
    .flexLine.end{
        justify-content: end;
    }


	/* **************** Main  END   **************** */

    /* ################ Button        ################ */
    .button{
        background-color: rgba(128, 128, 200, 0.4);
        border-radius: 5px; border-style: solid;
        border-width: 1px;
        border-color: #999 #333 #333 #999;
        cursor: pointer;
        margin: 0 0 0 10px; padding: 2px 5px;
        font-size: 90%;
    }
    .button:hover{background-color: rgba(255, 255, 255, 0.6); color: #990000;}
    .delete.button:hover{color: rgba(255, 0, 0, 0.8)}
    /* **************** Button END   **************** */

    /* ################ Arrow Icon        ################ */

    .moveIcon{
        background: url(../images/icons/arrowsAll.png) no-repeat;
        display: inline-block;
        height: 34px;
        overflow: hidden;
        width: 34px;
    }

    .stateField{
        background: url(../images/icons/state.png) no-repeat 0 0;
        height: 16px;
        width: 16px;
    }
    .stateField.state2{background-position: -15px 0;}
    .stateField.state5{background-position: -30px 0;}
    #userName .stateField{right: -14px; top: 0;}

    /* **************** Arrow Icon  END   **************** */

	/* ################ Content        ################ */

    #invalid{padding: 4% 1%;}
    .backgroundFrame{
        background-color: #EEEEEE;
        border: 2px solid #C40000;
        border-radius: 12px;
        padding: 0 4%;
        margin: 0 auto 5px;
        width: 92%;
    }

    #newPatient.backgroundFrame{padding: 2vh 2%;}
    .sectionWrapper{
        background-color: #FFFFFF;
        position: relative;
        margin-bottom: 3vh;
        padding: 2vh 2%;
    }
    #content .sectionWrapper .label,
    #content .sectionWrapper label{font-size: 90%; padding: 0;}
    #content .sectionWrapper input,
    #content .sectionWrapper select{font-size: 110%; font-weight: 800;}
    .creatorFrame{font-size: 12px; margin: 1vh 1%;}
    #content .creatorFrame .created{margin: 0 10px;}


	#content #login,
	#content #add_edit,
	#content #invalid{	text-align: center;	}

	#data_table,
	#login_table{margin: 10px auto 0;}

    #gotoTestAccountWrapper{margin-top: 12vh; }
    #gotoTestAccount{
        background-image: radial-gradient(ellipse at 50%, rgba(180, 180, 255, 0.75), #FEFEFE);
        padding: 2vh 10%;
        box-shadow: -3px 3px 3px 3px #666;
    }

	#content h1{font-size: 24px; margin: 3px 0;}
	#content h4{font-size: 12px; margin: 3px 0 20px;}
	#content .author{font-size: 12px; margin: 3px 0 3px 5px;}
	#content .created{font-size: 10px; margin: 3px 0 3px 5px;}

    #content #welcome{color: rgba(100,100,100,1); font-size: 88px; margin: 50px 0; text-align: center; text-shadow: 5px 6px 12px rgba(50,50,200,0.52);}

    .content img{
        background-color: #DDDDDD;
        border-radius: 5px;
        border-width: 2px;
        border-style: solid;
        border-color: #AAAAAA #AAAAAA #888888 #888888;
        margin: 0 10px 10px 0;
        padding: 5px;
    }

    .content img.right{float: right; margin: 0 0 10px 10px;}
    .content img.big{float: left; margin: 0 20px 20px 0; width: 462px;}

    .ui-autocomplete{overflow-y: scroll; max-height: 190px;}
    .ui-widget.ui-autocomplete{font-family: sfns_displaythin, sans-serif; font-size: 14px; line-height: 1.5em; position: relative; z-index: 15000;}
    #ui-id-1{width: 68%;}
    #ui-id-1 .ui-state-active{background: #AACCAA !important; border: solid #669966 !important; border-width: 1px 0 1px 0 !important; display: block; font-size: 16px; font-weight: 800; width: 95%;}

    .entityWrapperHeadline{
        background-color: #DEDEDE;
        border: solid #669966;
        border-width: 1px 1px 2px 1px;
        box-shadow: 1px 1px 2px #336633, -1px 1px 2px #336633 ;
        color: #000099; padding: 5px 10px;
        margin-bottom: 2%;
        text-align: center;
        text-shadow: 1px 1px 1px #666666;
    }

    .toggleCameraEnvironment{
        background: url(../images/icons/capture.png) no-repeat 0 0 transparent;
        display: inline-block;
        height: 50px;
        margin: 0 5px;
        width: 50px;

    }
    .toggleCameraEnvironment.environment{background-position-x: -48px;}
    .toggleCameraEnvironment.inActive{opacity: 0.3;}

    #dataSecurityDisplay .toggleCameraEnvironment{background-size: 60px 30px; height: 30px; width: 30px;}
    #dataSecurityDisplay .toggleCameraEnvironment.environment{background-position-x:  -30px;}

    .searchButton{
        background: url(../images/icons/lupeBig.png) no-repeat center center transparent;
        background-size: cover;
        border: none;
        height: 40px;
        margin: 12px 0 0 22px;
        width: 40px;
    }


    #newDoctor .outset{margin-bottom: 1vh;}
    #popupAddDoctor{background-color: rgba(250,250,250,1);}
    #popupAddDoctor .addEntityForm{border: none; border-radius: 0; box-shadow: none; padding: 0; margin: 0;}
    #popupAddDoctor .formFieldWrapper{margin: 1vh 0 0 0;}
    #popupAddDoctor label{padding: 0;}

    .indexField,
    .entityViewHeadline,
    .woundPositionHeadline{color: #000099; text-shadow: 1px 1px 1px #666666;}

    .entityViewHeadline,
    .woundPositionHeadline{background-color: #DEDEDE; border: solid #669966; border-width: 1px 1px 2px 1px; box-shadow: 1px 1px 2px #336633, -1px 1px 2px #336633; padding: 5px 10px; text-align: center;}
    .entityViewHeadline{margin-bottom: 15px;}
    .entityEditFrame{position: absolute; right: 1%; top: 3px; width: 98%;}
    .copyInfo{position: absolute; right: 1%; top: 3%; text-align: left; width: 300px;}

    .displayUserInfo{background: url('../images/icons/infoIcon32.png') no-repeat left top transparent; cursor: pointer; width: 32px; height: 32px; margin-top: -3px;}

    .searchEditUpdate{background: url('../images/icons/searchEditSave.png') no-repeat left top transparent; cursor: pointer; width: 30px; height: 30px; margin-top: -3px;}

    .addDoctorToWoundResponsibleList{background-position-y: -30px;}
    .searchDoctor{background-position-x: -30px;}
    .editDoctor{background-position-x: -60px;}
    .addDoctor{background-position: 0 -30px;}
    .searchEstablishment{background-position-x: -90px;}
    .editEstablishment{background-position-x: -150px;}
    .removeEstablishment{background-position-x: -120px;}
    .searchHealthInsurance{background-position-x: -180px;}
    .removeHealthInsurance{background-position-x: -210px;}
    .add{background-position-x: -270px;}
    .toggleInsertMode{background-position-x: -150px;}

    .entityView{margin-top: 3vh;}
    .healthInsuranceView.entityView{margin: 0 0 4vh 0;}

    .patientList .id_healthInsuranceState,
    .patientList .patient,
    .establishmentList .establishment,
    .userList .user,
    .userList .surname{
        font-weight: 800;
        font-size: 14px !important;
        text-shadow: 1px 1px 2px #999999;
    }
    .userList .town{
        font-weight: 700;
        text-shadow: 1px 1px 1px #CCCCCC;
    }
    .userList #listBody .listField.town{
        color: #333333 !important;
    }

    .patientList .listField.id_healthInsuranceState{float: right; width: 20%; text-align: center;}
    .patientList #listBody .listField.state1{color: #008800;}
    .patientList #listBody .listField.state2{color: #CC0000;}
    .patientList #listBody .listField.state3{color: #0000EE;}

    .patientList .id_salutation{width: 8%;}
    .patientList .id_title{width: 13%;}
    .patientList .patient  {width: 38%;}
    .patientList .town  {width: 8%;}
    .patientList .phone  {width: 8%;}



    #personalOrderBody{width: 99%;}
    #personalOrderBody .listLine{margin: 0 1% 2px; padding: 0 1% 2px 0; width: 96%;}
    #personalOrderBody .listField{height: 14px; line-height: 14px; vertical-align: middle;}
    #personalOrderBody .subListBody .product{max-width: 49%; overflow: hidden;}
    #personalOrderBody .subListBody .product.rows2{height: 25px;}
    #personalOrderBody .subListBody .product.rows3{height: 37px;}
    #personalOrderBody .subListBody .product.rows4{height: 49px;}
    #personalOrderBody .subListBody .product.rows5{height: 61px;}

    #selectProductSubstituteWrapper .listField{font-size: 16px;}
    #selectProductSubstituteWrapper #productSubstituteProduct{margin-bottom: 10px;}

    .shippingDetailsWrapper .label{font-size: 12px; display: inline-block; min-width: 75px; width: 10%;}
    .shippingDetailsWrapper .currentState{color: rgb(0, 150, 0); font-size: 14px; font-weight: 700;}
    .shippingDetailsWrapper .shippingProgress{border: 1px outset #666; border-radius: 8px; padding: 2%;}
    .shippingDetailsWrapper .shippingProgressList{padding: 0 2% 0.5%;}
    .shippingDetailsWrapper .progressStateDate{font-size: 13px; font-weight: 700; padding-left: 4%;}
    .shippingDetailsWrapper .progressState{font-size: 12px;}


    .orderShippingInformation{position: relative;}
    .shippingCarrierImg{
        display: inline-block;
        height: 20px;
        padding: 0;
        position: absolute;
        top: -12px;
        width: 20px;
    }
    #personalOrderBody .shippingCarrierImg{top: -4px; left: 8px;}
    #userOrdersWrapper .shippingCarrierImg {top: -4px; left: 8px;}

    .dhlShippingImage{
        background: url(../images/icons/dhl.png) no-repeat left top transparent;
        background-size: cover;
    }

    .glsShippingImage{
        background: url(../images/icons/gls-w24.png) no-repeat left top transparent;
        background-size: cover;
    }

    .dpdShippingImage{
        background: url(../images/icons/dpd-w24.png) no-repeat left top transparent;
        background-size: cover;
    }

    .w24ShippingImage{
        background: url(../images/icons/w24Icon.png) no-repeat left top transparent;
        background-size: cover;
    }

    .otherShippingImage{
        background: url(../images/icons/paket.png) no-repeat left top transparent;
        background-size: cover;
    }

    .cancelShippingImage{
        background: url(../images/icons/delete.png) no-repeat left top transparent;
        background-size: cover;
    }

    .deleteOrder{
        background: url(../images/icons/muell.png) no-repeat left top transparent;
        display: inline-block;
        height: 20px;
        width: 20px;
    }

    .deleteOrderPosition{
        background: url(../images/icons/muell.png) no-repeat left top transparent;
        background-size: cover;
        margin-left: 5px;
    }

    .editOrderPosition{
        background: url(../images/icons/pencil.png) no-repeat left top transparent;
        background-size: cover;
    }

    .deleteOrderPosition,
    .editOrderPosition
    {
        display: inline-block;
        height: 15px;
        width: 15px;
        padding: 0;
    }


    .popupSearchForm h2{font-size: 100%; margin: 0;}
    .popupSearchForm .formFieldWrapper{margin: 0 0 5px 0;}
    .popupSearchForm label{font-size: 80%;}
    .popupSearchForm .listField{display: inline;}
    .popupSearchForm .listField.id_salutation,
    .popupSearchForm .listField.id_title{display: inline-block;}

    .searchWrapper .formFieldWrapper.leftLabel label{width: 20%;}

    #searchHealthInsuranceFormWrapper .headline{padding-right: 12%}
    #searchHealthInsuranceForm{margin: 20px 0;}

    .entityView .sectionWrapper{margin: 2%; padding: 2%;}
    .entityView .entityWrapperHeadline{margin-bottom: 2%;}
    .entityView label,
    .entityView .label{font-size: 80%;}

    #setLandingPage{cursor: pointer;}

    #databaseReloadForDeveloper{padding: 2% 4%;}
    #databaseReloadForDeveloper .message{margin-bottom: 2%;}
    #stripRealPatientsFieldWrapper.rightLabel.formFieldWrapper label{width: 80%;}

    #displayRecipientSignature{ margin: 4px 10%; width: 80%;}
    #shippingSignature{position: relative; text-align: center;}
    #shippingSignature img{ background-color: #EEEEEE; color: #FF0000; left: 13%; position: absolute; top: 0; width: 74%}

    #newHealthInsurance{width: 80%;}

    .xdebug-error,
    .xe-notice{
        color: #333333;
        margin-top: 40px;
        font-family: Times, serif;
        font-size: 12px
    }
    .xdebug-error tr:first-child,
    .xe-notice tr:first-child,
    .xdebug-error tr:nth-child(2),
    .xe-notice tr:nth-child(2){
        color: #ff0000;
        font-size: 14px;


    }

    .xdebug-error tr:first-child th,
    .xdebug-error tr:nth-child(2) th{background-color: #FFFFFF;}
    .WoundProductMapping #content{padding: 0 1.5%;}


    .addRecord{
        height: 80vh;
        overflow: auto;
        width: 95%;
    }
    .mobile .addRecord{ height: 90vh;}
    .mobile #main{margin-top: 60px;}

        /* **************** Content  END   **************** */

	/* ################ sb        ################ */
	#sb1,
	#sb2{
		background-color: rgba(200,200,244,0.0);
		padding: 1.5% 0.75%;
	}


    .folded{margin: 0 0 10px 0;}
    .folded.patientFileHead{margin: 0; position: relative;}
    .searchWrapper,
    .foldHead{
        background-color: #EEDDDD;
        border: 2px solid #C40000;
        cursor: pointer;
        padding: 5px 10px;
        position: relative;
    }
    .foldHead.open{border-bottom: none;}
    .foldHeadHeadline{text-align: center; font-size: 20px; font-weight: 800; text-shadow: 1px 1px 2px #888888, -1px 1px 2px #888888}
    .foldedHeadline{float: left; margin-left: 5%; text-align: center; width: 90%;}

    .foldBody{
        background-color: #EEEEEE;
        border: solid #C40000;
        border-width: 0 2px 2px 2px;
        padding: 5px 10px;
    }
    .foldHead .description{margin: 0 10px;}
    .foldHead .noMargin.description{margin: 0 1px;}

    .dataTabLeftSide{
        min-width: 300px;
        width: 49.5%
    }
    .dataTabRightSide{
        min-width: 300px;
        width: 49.5%;
    }

    .folderImage {
        background: url("../images/icons/arrowCircleTransparent.png") no-repeat 0 0 transparent;
        display: inline-block;
        height: 18px;
        position: absolute;
        right: 1%;
        top: 8px;
        width: 18px;
    }
    .folderImage.close{background-position: -41px -24px;}
    .folderImage.open{background-position: 0 -1px;}

    /* **************** Sb  END   **************** */

	/* ################ Footer        ################ */

	#footer{
		padding: 10px 20px;
	}

	.block{background-color: rgba(128, 128, 200, 0.4); width: 242px;}
	.bottomMenuItem{float: right; font-size: 11px; margin: 10px 0; padding: 0 5px;}
    .bottomMenuItem.separator{border-left: 1px solid #333333;}
	/* **************** Footer  END   **************** */

    /* ################ Page        ################ */

    select.selected{
        color: black;
    }

    select{
        color: gray;
    }
    .select{background-color: #333333; border-radius: 4px; color: #EFEFEF; font-size: 13px; font-weight: 700; padding: 2px 4px;}

    /* **************** Page  END   **************** */


	/* ################ Category        ################ */

		#category #message{font-size: 12px; margin-top: 20px;}
		#category #message .update{font-size: 14px;}

		#category_menu.nav h3{margin: 10px 0 5px 0;}
		#category_menu.nav li{float: none;}
		#category_menu.nav li a{border-width: 0; float: none; font-size: 16px; padding: 0 0 0 10px;}

		#category_list{width: 347px;}
		#category_list .f0{width: 100px;}
		#category_list .f1{width: 145px;}

	/* **************** Category  END   **************** */

    /* ################ padding        ################ */

    .addPadding.small{padding: 2%;}
    .addPadding.medium{padding: 5%;}
    .addPadding.wide{padding: 10%;}

    .outset{border: 1px outset #FF6666; border-radius: 4px; box-shadow: 2px 2px 2px #666666;}

    /* **************** padding  END   **************** */

    /* ################ Form        ################ */

    .formLine{margin: 0 0 10px;}

    .formFieldWrapper.bottomLabel .label,
    .formFieldWrapper.bottomLabel label,
    .formFieldWrapper.bottomLabel input,
    .formFieldWrapper.topLabel .label,
    .formFieldWrapper.topLabel label,
    .formFieldWrapper.topLabel input,
    .formLine.bottomLabel .label,
    .formLine.bottomLabel label,
    .formLine.bottomLabel input,
    .formLine.topLabel .label,
    .formLine.topLabel label,
    .formLine.topLabel input
    {
        display: block;
        width: 97%;
    }

    .formFieldWrapper.bottomLabel input,
    .formFieldWrapper.topLabel input,
    .formLine.bottomLabel input,
    .formLine.topLabel input{
        padding: 3px 1.5%;
    }
    .formFieldWrapper.bottomLabel .label,
    .formFieldWrapper.bottomLabel label,
    .formFieldWrapper.topLabel .label,
    .formFieldWrapper.topLabel label,
    .formLine.bottomLabel .label,
    .formLine.bottomLabel label,
    .formLine.topLabel .label,
    .formLine.topLabel label{
        padding: 0 1.5%;
    }

    .formFieldWrapper.bottomLabel .checkboxWrapper,
    .formFieldWrapper.bottomLabel select,
    .formFieldWrapper.topLabel select,
    .formLine.bottomLabel select,
    .formLine.topLabel select
    {
        display: block;
        padding: 3px 1.5%;
        width: 100%;
    }

    .formFieldWrapper.bottomLabel .label,
    .formFieldWrapper.bottomLabel label,
    .formFieldWrapper.topLabel label,
    .formLine.topLabel label,
    .formLine.bottomLabel label{font-size: 12px; text-align: center; margin: 0 0 3px 0;}

    .formFieldWrapper.leftLabel .label,
    .formFieldWrapper.leftLabel label,
    .formFieldWrapper.rightLabel .label,
    .formFieldWrapper.rightLabel label,
    .formLine.leftLabel label,
    .formLine.rightLabel label{display: inline-block; overflow: hidden; vertical-align: bottom;}

    .formFieldWrapper.rightLabel .label,
    .formFieldWrapper.rightLabel label,
    .formLine.rightLabel label{margin-left: 1%; text-align: left;}
    .formLine.leftLabel .label,
    .formLine.leftLabel label,
    .formFieldWrapper.leftLabel label{text-align: right; margin-right: 1%;}

    .formFieldWrapper.viewField,
    .formFieldWrapper .viewField{
        color: #0000AA;
        display: inline-block;
        font-size: 1.13em;
        font-weight: 800;
        padding: 2px 3px 0;
        text-shadow: 2px 2px 4px #929292;
        width: 100%;
    }
    #nurseView .formFieldWrapper .viewField{text-align: center;}
    .viewField.smallView{font-size: 0.8em;}
    .viewField.description{color: #333333; font-size: 0.75em;}

    .tinyWrapper{width: 18.5%; min-width: 70px; margin-right: 1%;}
    .smallWrapper{width: 23.5%; margin-right: 1%;}
    .mediumWrapper{width: 32.3%; margin-right: 1%;}
    .bigWrapper{width: 42.5%; margin-right: 2%;}
    .maxWrapper{width: 70%; margin-right: 2%}

    .thirdWrapper{width: 30%; padding: 0 1.5% !important;}
    .twoThirdWrapper{width: 63%; padding: 0 1.5% !important;}
    .quarterWrapper{width: 22% ; padding: 0 1.4% !important;}
    .twoQuarterWrapper{width: 47%; padding: 0 1.4% !important;}
    .threeQuarterWrapper{width: 72%; padding: 0 1.4% !important;}
    .eightsWrapper{width: 10.5%; padding: 0 1% !important;}
    .sevenEightsWrapper{width: 87.5%; padding: 0 1.4% !important;}
    .fullWrapper{width: 97% !important; padding: 0 1.4% !important;}

    .thirdField,
    .third{width: 33% !important; margin: 0 auto;}
    .twoThirdField,
    .twoThird{width: 66% !important; margin: 0 auto;}
    .quarterField,
    .quarter{width: 25% !important; margin: 0 auto;}
    .twoQuarterField,
    .twoQuarter{width: 50% !important; margin: 0 auto;}
    .threeQuarterField,
    .threeQuarter{width: 74% !important; margin: 0 auto;}
    .threeEightsField,
    .threeEights{width: 62% !important; margin: 0 auto;}
    .fiveEightsField,
    .fiveEights{width: 62% !important; margin: 0 auto;}
    .sevenEightsField,
    .sevenEights{width: 87.5% !important; margin: 0 auto;}
    .eightsField,
    .eights{width: 12.5% !important; margin: 0 auto;}

    .fullWrapper .threeQuarterField,
    .fullWrapper .threeQuarter{float: right;}


    .tinyField{width: 20%; margin: 0 auto;}
    .smallField{width: 36%; margin: 0 auto;}
    .mediumField{width: 50%; margin: 0 auto;}
    .bigField{width: 60%; margin: 0 auto;}
    .maxField{width: 70.5%; margin: 0 auto;}
    .fullField{width: 96%; margin: 0 auto;}

    .smallLabel label{font-size: 10px;}

    .fromFieldWrapper #content,
    .formLine #content{float: left; margin: 0; width: 80%;}

    #addEntityForm{
        background-color: #FFFFFF;
        border-radius: 15px;
        box-shadow: 3px 3px 5px #666666;
        padding: 2%;
        margin: 0 2%;
    }
    .addEntityForm .formField{text-align: center;}
    .addEntityForm .outset{padding: 1.5vh 4%; margin-bottom: 2vh;}


    /* **************** Form  END   **************** */

    /* ################ Menu        ################ */
        #Menu_list{width: 347px;}
        #Menu_list .f0{width: 100px;}
        #Menu_list .f1{width: 145px;}

    /* **************** Menu  END   **************** */


	/* ################ Alias        ################ */

		#alias_list{width: 720px;}
		#alias_list .f0{width: 50px; text-align: center;}
		#alias_list .f1{width: 44px; text-align: center;}
		#alias_list .f2{width: 120px; }
		#alias_list .f3{width: 105px;}
		#alias_list .f4{width: 70px;}
		#alias_list .f5{width: 110px; }
		#alias_list .f6{width: 44px; text-align: center;}
	/* **************** Alias  END   **************** */


	/* ################ User        ################ */

    #userInfo{margin: 10px 10% 30px;}
	p.user_info{ margin: 0;}
	.user_info .label{ display: inline-block; font-size: 80%; width: 80px;}

    #users .line{margin-bottom: 5px;}
    #users label{display: inline-block; margin-right: 10px; text-align: right; width: 80px;}

	#user_list{width: 487px;}
	#user_list .f0{width: 120px;}
	#user_list .f1{width: 150px;}
	#user_list .f2{width: 100px; text-align: center;}

	#password_form_wrapper{text-align: center;}

    #users #add_edit{float: left; width: 49%;}
    #users #usersPermissions{float: right; width: 49%;}
    #users #usersPermissions label{display: inline-block; font-size: 80%; margin: 0; text-align: left;}
    #users #usersPermissions #checkGroups{float: left; margin: 10px 0 0 10%; width: 25%;}
    #users #usersPermissions #checkRoles{float: right; margin: 10px 10% 0 0 ; width: 35%;}
    #users #usersPermissions input,
    #users #usersPermissions .line{margin: 0;}
    #users #usersPermissions #submitPermissions{margin: 10px 10%; width: 80%;}

    #usersPermissionsLabel {float: left; }
    #usersPermissionsString {float: left; }
    #usersPermissionsString span{display: inline-block; width: 80px;}

    .userChangePasswordWrapper  .woundPositionHeadline{margin: 2vh 0;}
    .userChangePasswordWrapper  .formFieldWrapper.leftLabel label,
    .userChangePasswordWrapper  label{display: inline-block; font-size: 80%; min-width: 120px; margin-right: 3%; text-align: right; width: 17%;}
    .userChangePasswordWrapper  input{ min-width: 80px; text-align: center; width: 59%;}
    .userChangePasswordWrapper  input.submitButton{ margin: 2% 20%;}
    .userChangePasswordWrapper  .description{ margin: 0 20%;}

    #headerLogoWrapper,
    #headerTimeRecordingWrapper{min-width: 165px;}
    #headerTimeRecordingWrapper .submitButton{margin: 0;}

    #userTimeTargetForm .quarterField{width: 23% !important;}
    #currentTargetList #listBody{height: 200px; overflow-y: auto;}
    #currentTargetList #listBody .listLine{width: 99%;}
    #currentTargetList  .listField input{width: 100%;}
    #currentTargetList .startTime,
    #currentTargetList .targetTime{min-width: 50px; width: 8%; text-align: center;}
    #currentTargetList .startLocation,
    #currentTargetList .targetLocation{min-width: 120px; width: 33%;}
    #currentTargetList .distance{min-width: 45px; width: 7%; text-align: right;}
    #currentTargetList .remark{width: 90%; margin-left: 4.5%;}
    #currentTargetList #remark{background-color: #CCCCCC;}

    .timeTargetSelectButton{margin: 1vh 5% 0; font-size: 75%;}

    .switchUserWrapper{
        float: right;
        margin: 1px 40px 2px 10px;
        position: relative;
    }

    button.switchUser{
        background: url('../images/icons/arrows.png') no-repeat -16px -68px transparent;
        background-size: 45px;

        width: 36px;
        height: 24px;
        margin: auto 0;
        border-radius: 6px;
        position: absolute;
        top: 0;
        left: 0;
    }

	/* **************** User  END   **************** */

    /* ################ Info        ################ */

    #sb1 #personalOrder .patient{width: 53%;}
    #sb1 #personalOrder .orderDate{width: 17%;}
    #sb1 #personalOrder .orderSendDate{width: 17%;}
    #sb1 #personalOrder #listBody .orderDate{color: #666666;}
    #sb1 #personalOrder #listBody .orderSendDate{color: #666699;}
    #sb1 #personalOrder .orderDetails {border: 1px solid #AAAAAA; border-radius: 2px; margin: 0 0.5% 0 1.5%;}
    #sb1 #personalOrder .orderDetails .subListHead .listLine{background-color: #AAAAAA; color: #FFFFFF;}
    #sb1 #personalOrder .orderDetails .listLine{font-size: 10px; margin: 0; width: 99%;}
    #sb1 #personalOrder .orderDetails .pzn{width: 15%; text-align: right; margin-right: 1%;}
    #sb1 #personalOrder .orderDetails .product{width: 63%; text-align: left; }
    #sb1 #personalOrder .orderDetails .amount{width: 5%; text-align: right;}

    .orderDate{width: 90%;}
    .orderSendAt{color: #008800; margin-left: 4%; text-shadow: 1px 1px 1px #AAAAAA; }

    /* **************** Info  END   **************** */


    /* ################ Client        ################ */

    p.client_info{ margin: 0;}
    .client_info .label{ display: inline-block; font-size: 80%; width: 80px;}

    #client .line{margin-bottom: 5px;}
    #client label{display: inline-block; margin-right: 10px; text-align: right; width: 100px;}

    #user_list{width: 487px;}
    #user_list .f0{width: 120px;}
    #user_list .f1{width: 150px;}
    #user_list .f2{width: 100px; text-align: center;}



    /* **************** Client  END   **************** */


    /* ################ Popup        ################ */

    .popup{
        background-color: rgba(250,250,250, 0.9);
        border: 2px ridge red;
        border-radius: 8px;
        display: none;
        /*visibility: hidden;*/
        height: 450px;
        opacity: 1;
        padding:12px;
        position: fixed;
        width: 800px;
    }
    .popupContent{
        scrollbar-width: thin;
    }

    .popup.topPosition{top: 5vh !important;}
    .popup.message{
        background-color: #FFFFFF;
        box-shadow: 3px 3px 4px #333, -1px -1px 1px #888;
        top: 15vh !important;
    }

    .popup.overflow-y .popupContent{height: 100%; overflow-y: auto; overflow-x: hidden;}

    #searchDoctorResult .userList{ border: none; margin: 0; width: 100%;}
    #searchDoctorResult .userList #listHead{ display: none;}
    #searchDoctorForm .description{margin: 5px 0 10px 0;}

    #popupWrapper{position: relative;}
    #contentHeightFrame{background-color: #F9F3B6; position: fixed; left: 10px; top: 10px; visibility: hidden; z-index: 12000;}

    .popup .backgroundFrame{background-color: transparent; border: none; padding: 0; margin: 0; width: auto;}


    /* **************** Popup  END   **************** */

    /* ################ Confirm        ################ */

    #confirmBox{
        border: 2px outset #FF9999;
        background-color: #FFFFFF;
        left: 40%;
        position: absolute;
        top: 10vh;
        z-index: 20000;
    }
    .confirmBoxTitle{
        background-color: #777;
        color: #FFF;
        font-weight: 700;
        padding: 1% 0;
        text-align: center;
    }
    .confirmBoxMessage{
        font-size: 80%;
        padding: 0.5vh 10%;
    }
    #confirmBox .confirm { margin: 5% 0 5% 10%;}
    #confirmBox .reject { margin: 5% 10% 5% 0;}


    /* **************** Confirm  END   **************** */

    /* ################ Tab        ################ */

    .subWrapper .tabWrapper {left: 1%;}
    .subWrapper .tabDataWrapper { border-width: 3px 0 0 0;}

    .tabWrapper{position: relative; height: 39px;}
    .tabWrapperFrame{display: inline-block; height: 35px; overflow: hidden; position: relative;}
    .progressTabs{height: 42px;}
    .tabWrapperFrame.move{}

    .tabDataWrapper{
        background-color: #EEEEEE;
        border: 3px solid #C40000;
        margin-top: -6px;
        /*min-height: 200px;*/
        padding: 15px 0;
        position: relative;
        z-index: 150;
    }

    .tabData{position: relative;}


    .subWrapper .tabWrapper  {left: 1%;}
    .subWrapper .tabDataWrapper { border-width: 2px 0 0 0;}
    .subWrapper .tabDataWrapper.noDataAgreement { border-width: 0;}

    .formSubTab{
        background-color: #AAAAAA;
        color: #666666;
        cursor: pointer;
        float: left;
        padding: 6px 20px 3px 10px;
        border: 3px solid #545558;
        position: relative;
        z-index: 100;
    }

    .tab{
        background-color: #AAAAAA;
        color: #666666;
        cursor: pointer;
        float: left;
        flex-shrink: 0;
        height: 27px;
        padding: 6px 12px 3px 10px;
        border: 2px solid #545558;
        position: relative;
        z-index: 100;
    }

    .tab.active{
        background-color: #EEEEEE;
        border: 2px solid #c40000;
        border-bottom-width: 0;
        color: #000000;
        z-index: 200;
    }

    .tab.open{background-color: rgba(200, 255, 200, 0.5)}
    .tab.active.open{background-color: rgba(200, 255, 200, 1)}
    .tab.active.open{background-image: linear-gradient(to bottom, rgba(200, 255, 200, 0.5), #EEEEEE 95%);}
    .tab.locked{background-color: rgba(200, 200, 255, 0.5)}
    .tab.active.locked{background-image: linear-gradient(to bottom, rgba(200, 200, 255, 0.5), #EEEEEE 95%);}
    .tab.closed{background-color: rgba(255, 200, 200, 0.5)}
    .tab.active.closed{background-image: linear-gradient(to bottom, rgba(255, 200, 200, 1), #EEEEEE 95%);}
    .tap:not(:first-child){color:red; margin-left: -5px;}

    .patientDataTab,
    .popupTab{
        background-color: #CFCFCF;
        border: 3px inset #545558;
        box-shadow: -1px -1px 1px #888, 1px 1px 1px #AAAAAA ;
        color: #666666;
        cursor: pointer;
        float: left;
        font-size: 12px;
        font-weight: bold;
        margin: 2px 1%;
        padding: 3px 6px 3px 5px;
        position: relative;
        text-align: center;
        text-shadow: -1px 1px 2px #AAAAFF;
        z-index: 100;
    }


    .popupTab.active{
        background-color: #FFFFFF;
        border: 3px inset rgba(244, 1, 6, 0.4);
        box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6);
        color: #666666;
    }

    #mobileTab{
        background-color: #FFFFFF;
        border: 3px outset #0000c4;
        border-bottom-width: 2px;
        display: none;
        padding: 8px 2% 8px 2%;
        position: relative;
        width: 95%;
        z-index: 500;
    }

    #mobileTab #tabButton{
        background: url('../images/icons/wunde24-menu-button.png') no-repeat -21px -55px transparent;
        display: inline-block;
        float: left;
        height: 30px;
        width: 30px; }
    #mobileTab #tabButton.close{background-position: -21px -55px;}
    #mobileTab #tabButton.open{background-position: 8px -55px;}
    #mobileTab #currentMenuName{text-align: center; width: 100%;}


    .tabLineScrollButton{
        background: url("../images/icons/tabLineArrows.png") no-repeat 1px 1px transparent;
        display: inline-block;
        height: 35px;
        width: 14px;
    }
    .tabLineScrollButton.right{background-position-x: right; }
    .tabLineCover{display: inline-block; height: 37px; overflow: hidden; position: relative;}

    .tabLineScrollIcon{
        background: url("../images/icons/tabLineArrows.png") no-repeat 1px 1px transparent;
        display: inline-block;
        height: 35px;
        width: 14px;
    }
    .tabLineScrollIcon.right{background-position-x: right; }

    .horizontalScrollWrapper{
        width: auto;
        margin-right: 1%;
    }
    .horizontalScroll{
        display: flex;
        height: 42px;
        overflow-x: auto;
        overflow-y: hidden;
        margin-right: 1%;
        scrollbar-width: none;
    }
    .horizontalScroll::-webkit-scrollbar{
        display: none;
    }
    /* **************** Tab  END   **************** */

    /* ################ Page        ################ */

    #contentMenu {
        margin: 0 0 10px;
        padding: 9px 10px;
        border: 1px solid #444;
        border-radius: 6px;
        background-color: #aaa;
        box-shadow: 2px 2px 1px #666
    }

    #contentMenu .button{padding: 5px;}
    #contentMenu form {display: inline-block}

    #pageInfo{display: inline-block; margin-bottom: 20px;}
    #pageInfo .highlight{margin-right: 50px;}
    #pageInfo .description{margin-right: 20px;}

    #pageForm input{width: 66%}
    #pageForm .floatLeft{margin-right: 20px}


    /* **************** Page  END   **************** */


    /* ################ Pagination       ################ */

    .pagination{margin: 10px auto; width: 96%;}
    .paginationButton{
        background-color: #EEDDDD;
        border-style: solid;
        border-width: 1px;
        border-color: #FF0000 #ff3333 #ff3333 #FF0000;
        cursor: pointer;
        display: inline-block;
        font-size: 12px;
        text-align: center;
        width: 50px;}
    .paginationButton:hover{background-color: #FF0000; color: #EEDDDD;}
    .paginationButton.next{border-radius: 0 10px 10px 0; box-shadow: 1px 1px 1px #666; margin-left: 15px;}
    .paginationButton.next:hover{box-shadow: 2px 2px 1px #333;}
    .paginationButton.previews{border-radius: 10px 0 0 10px; box-shadow: -1px 1px 1px #666; margin-right: 15px;}
    .paginationButton.previews:hover{ box-shadow: -2px 2px 1px #333;}
    .paginationButton.inActive{visibility: hidden;}

    .paginationInfo{font-size: 11px; padding: 5px 20px 0;}
    .paginationMoveTo{font-size: 11px; margin-right: 40px;}
    #paginationMoveTo{background-color: #EEDDDD;  border-radius: 12px; box-shadow: 1px 1px 1px #666; font-size: 11px; text-align: center; width: 26px;}

    /* **************** Pagination  END   **************** */


    /* ################ patientIcons       ################ */

    .patientIconMenu{ float: right; margin-right: 1%;}

    .patientIconMenu .patientName{color: #0445CC; display: inline-block; height: 36px; margin-right: 10px; text-shadow: 1px 1px 1px #666; vertical-align: middle;}
    .patientIconMenu .patientIcon{
        background: url("../images/icons/patientActionIcons.png") no-repeat 0 0 transparent;
        display: inline-block;
        height: 25px;
        width: 33px;
    }
    .patientIconMenu #actionWoundDocumentation{background-position: 0 0;}
    .patientIconMenu #actionOrder{background-position: -33px 0;}
    .patientIconMenu #actionListAll{background-position: -66px 0;}
    .patientIconMenu #actionEdit{background-position: -99px 0;}
    .patientIconMenu #actionView{background-position: 0 -26px;}
    .patientIconMenu #actionSearch{background-position: 0 -26px;}

    #patientList .patientIconMenu .patientName{display: none;}

    /*.entityReplacementWrapper .bottomLabel .viewField{background-color: #DEDEDE; border: 2px inset #666666;  font-weight: bold; min-height: 23px; text-align: center; }*/
    .entityReplacementDataWrapper {background-color: #DFDFDF; border: 2px outset #666666; border-radius: 6px; margin: 5px 10px 20px; padding: 10px;}
    .entityReplacementWrapper .formFieldWrapper{margin-bottom: 5px;  margin-top: 5px;}
    .entityReplacementWrapper .viewField{display: inline-table; font-weight: 500; line-height: 1.5; text-align: left; }
    .entityReplacementWrapper .bottomLabel .label{font-size: 12px;}

    #birthdayFieldWrapper.bigWrapper{margin: 5px 0 5px 28.5%;}

    /* **************** patientIcons  END   **************** */

    /* ################ Login       ################ */
    #loginForm{margin: 0 auto; width: 100%; max-width: 260px;}
    #login .line{margin-bottom: 10px;}
    #login .descr{font-weight: bold;}
    #login .formLine {display: block; float: none; font-size: 10px; margin-right: 0; text-align: center;}

    #login input{background-color: #CCCCCC; padding: 2px 0; text-align: center; width: 100%;}
    #login #submitLogin{color: #333333; font-weight: bold; padding: 4px; width: 100%; }
    #login #submitLogin:hover{background-color: #333333; color: #CCCCCC; }

    /* **************** Login END   **************** */

	/* ################ List       ################ */

    h2.list{margin: 0 0 10px; text-align: center; }
    .data_list{margin: 0 auto;}
    #listHead,
    #listBody,
    #listFooter,
    #list_head,
    #list_body,
    #list_footer,
    .listLine,
    .list_line{border: 0 solid #FFFFFF; cursor: pointer; display: inline-block; width: 100%;}
    .listField,
    .edit_field,
    .list_field{border: 0 solid #FFFFFF; display: inline-block; padding: 3px 1%;}

    .listField{font-size: 12px;}

    .listLine,
    .list_line{border-width:  1px 1px 2px 1px ; font-size: 0; margin: 3px auto;}
    .edit_field,
    .editField{text-align: right; float: right; min-width: 50px; width: auto;}

    .listHead .listLine,
    .subListHead .subListLine,
    #listHead .listLine,
    #list_head .list_line{background-color: #0000FF; }

    .listHead .listField,
    #listBody .subListHead .listField,
    #listHead .listField,
    #list_head .list_field{color: rgb(255,255,255); text-align: center; font-size: 11px; vertical-align: bottom;}
    #listHead .listField.editField,
    #list_head .list_field.edit_field{text-align: right;}

    #listFooter .listLine,
    #list_footer .list_line{background-color: #333333;}
    #listFooter .listLine .listField,
    #list_footer .list_line .list_field{color: #FFFFFF;}

    #listBody a:nth-child(odd) .listLine,
    #listBody .listLine:nth-child(odd),
    #list_body .list_line:nth-child(odd){background-color:#EFEFEF;}

    #listBody a:nth-child(even) .listLine,
    #listBody .listLine:nth-child(even),
    #list_body .list_line:nth-child(even){background-color: #ffe8e8;}
    #listBody .listField,
    #list_body .list_field{color: #000000; font-size: 12px;}

    .info{margin-bottom: 15px; position: relative;}
    .info:hover .info_display{display: block;}
    .info_display{background-color: #EEEEEE; box-shadow: 3px 5px 7px #EEEEEE;	border: 1px solid #AAAAAA; color: #000000; display: none; left: 30px; padding: 5px; position: absolute; top: 20px; width: 300px; z-index: 100;}

	#content .list .shortDate{font-size: 75%; margin: 0; text-align: center;}


    #attributeList{width: 650px; margin: 0 auto;}
    #attributeList h2{text-align: center;}
    #attributeList #listHead .listLine{background-color: #FFDDDD;}
    #attributeList #listHead .listField{color: #CC6666;}
    #attributeList #listBody .listField{}
    #attributeList .listLine{display: flex;}
    #attributeList #listBody .listLine:nth-child(odd){background-color: #FFDDDD;}
    #attributeList #listBody .listLine:nth-child(even){background-color: #EECCCC;}
    #attributeList #listBody .listLine.add{background-color: #AECFB6;}
    #attributeList .id{width: 30px; text-align: center;}
    #attributeList .attribute{width: 350px; text-align: left;}
    #attributeList .attribute.productBodyPart{width: 200px; text-align: left;}
    #attributeList .sort{width: 35px; margin-left: 10px;}
    #attributeList .sort input{text-align: center;}
    #attributeList .selectBodyParts   {width: 320px;}
    #attributeList .numAttributes{width: 60px; text-align: center;}
    #attributeList input{width: 100%;}
    #attributeList img{vertical-align: bottom;}

    #establishmentSearchList #listHead,
    #establishmentSearchList #listBody,
    #establishmentSearchList #listLine{width: 98%;}
    #establishmentSearchList .establishment{width: 30%; min-width: 220px;}
    #establishmentSearchList .contact{width: 24%; min-width: 170px;}
    #establishmentSearchList .phone{width: 10%; min-width: 85px;}
    #establishmentSearchList .zip{width: 5%; min-width: 34px;}
    #establishmentSearchList .town{width: 15%; min-width: 140px;}
    #establishmentSearchList .edit_field{width: 5%; min-width: 60px;}
    #establishmentSearchList .comment{color: #333333; font-size: 12px;}

    #searchNursingHomeResult #establishmentList .establishment{width: 97%;}

	/* **************** List  END   **************** */

    /* ################ add_edit        ################ */
    #add_edit td{text-align: left;}
    #add_edit input,
    #add_edit textarea{width: 300px;}
    #add_edit select{width: 300px;}
    #add_edit input.da{width: 120px; text-align: center;}
    #add_edit input.ch{width: 20px; text-align: left;}
    #add_edit #function{margin: 20px 0 15px;}

    /* **************** add_edit  END   **************** */

    /* ################ Message        ################ */
    #message{
        font-size: 90%;
        padding: 10px 0 0;
        text-align: center;
    }

    /* **************** Message  END   **************** */

	/* #################   Defaults    ################# */

    input,
	select{background-color: #B1BCE9;}
	.tx{background-color: #E3D6AB;}

	.clearfix:after {
		clear: both;
		content: ".";
		display: block;
		height: 0;
        width: 0;
		visibility: hidden;
	}
    .clearfix:before {
        clear: both;
        content: ".";
        display: block;
        height: 0;
        width: 0;
        visibility: hidden;
    }
    .submitButton{
        background-color: #DDDDDD;
        color: #c40000;
        border-radius: 6px;
        box-shadow: 1px 1px 1px #666;
        font-size: 14px;
        margin: 15px 0 0 0 ;
        padding: 4px 10px;
        text-align: center;
    }
    .submitButton:hover{background-color: #E36A66; color:  #DDDDDD;}
    .submitButton.wide{width: 100%;}
    .submitButton.marginBottom{margin: 0 0 0.75vh 0;}
    .submitButton.noMargin{margin: 0;}


    .bdlClickButton{
        background-color: #e36a66;
        border-radius: 4px;
        box-shadow: 1px 1px 1px #a27e73;
        font-size: 12px;
        padding: 2px 5px;
        text-align: center;
    }

    p{margin: 0;}
    .floatLeft,
	.f_left{float: left;}
    .floatRight,
	.f_right{float: right;}
	.clear{clear: both;}
    .relative{position: relative;}
    .absolute{position: absolute;}
    .spaceVertical{margin: 0 5px;}
    .spaceVertical-10{margin: 0 10px;}
    .spaceVertical-20{margin: 0 20px;}
    .spaceHorizontal{margin: 5px 0;}
    .spaceHorizontal-10{margin: 10px 0;}
    .viewLineSpace{margin-left: 2%;}

    .updated{background-color: #AAFFAA !important;}
	.block{display: inline-block;}
    .box{border-width: 2px; border-style: solid; border-color: #666 #333 #333 #666; border-radius: 6px ; box-shadow: 2px 2px 4px #666; margin: 10px 0 0; padding: 5px 15px;}
    .boxBottomMargin{border-width: 2px; border-style: solid; border-color: #666 #333 #333 #666; border-radius: 6px ; box-shadow: 2px 2px 4px #666; margin: 0 5% 10px 0; padding: 5px 15px;}
	.required{background-color: #FFAAAA !important;}
    .hidden{display: none;}
    .hiddenImportant{display: none !important;}
    .unVisible{visibility: hidden;}
    .disabled{opacity: 0.3;}
    .importantField{font-weight: 800; font-size: 14px !important; text-shadow: 1px 1px 1px #999999}
    .plainText{font-weight: 500 !important;}
	.highlight{color: #224FFF; font-weight: bold; font-size: 115%; text-shadow: 3px 3px 3px #98ADFD;}
	.highlightInline{color: #224FFF; font-weight: bold; font-size: 105%;}
	.headLine,
    .headline{color: #224FFF; font-weight: bold; font-size: 110%; text-align: center; text-shadow: 3px 3px 3px #999, -3px 3px 3px #aaa;}
	.bold{font-weight: bold; padding-right: 3px; text-shadow: 1px 1px 1px #999999;}
	.center{text-align: center; text-align-last: center;}
    .left{text-align: left !important; text-align-last: left;}
    .right{text-align: right !important; text-align-last: right;}
    .tableCell{display: table-cell; vertical-align: middle;}
    .edited{background-color: #AAFFAA !important;}
    .lightBackground{background-color: #CCCCCC;}
    .success{color: #008800; font-size: 110%; font-weight: 800; text-shadow: 1px 1px 2px #CCCCCC;}
    .successSmall{color: #008800; font-size: 80%; font-weight: 800; text-shadow: 1px 1px 1px #CCCCCC;}
	.error{color: #CC0000;}
	.description{color: #666666; font-size: 12px; text-align: center;}
    .important{color: #FF0000; font-size: 150%;}
    .small{font-size: 11px;}
    .medium{font-size: 20px;}
    .big{font-size: 40px;}
    .red{color: #AA3939;}
    .selectBlack{color: #000000 !important;}
    .selectRed{color: #CC0000 !important; font-weight: 300 !important;}
    .selectBlue{color: #000088 !important; font-weight: 300 !important;}
    .selectGreen{color: #008800 !important; font-weight: 800;}
    .fail{color: #DD3333; font-size: 110%; text-shadow: 1px 1px 2px #CCCCCC;}
    .failGrayShadow{color: #DD3333; font-size: 110%; text-shadow: 1px 1px 2px #666666;}
    .failSmall{color: #DD3333; font-size: 80%; text-shadow: 2px 2px 2px #CCCCCC;}

    .cleverSolution{color: #407F7F;}
    .pointer{cursor: pointer;}

    .i{color: #FF3300; font-size: 110%; font-weight: bold;}
    .booleanImage{cursor: pointer;}
    a{text-decoration: none;}
	ul{list-style: none outside none; padding: 0; margin: 0;}
	li{list-style: none outside none; margin: 0;}

	/* ****************   Defaults  END   **************** */


}



@media screen and (min-width: 1201px){
    #mobileTab{display: none;}
    #tab {display: block;}
}

@media screen and (max-width: 1200px)
{
    #header.rc_m_top{border-radius: 0;}
    body#page #content,
    body #page-wrapper{min-width: 305px; max-width: 100%;}
    body#page #content{background-color: transparent; box-shadow: none; float: none; margin-top: 25%; position: relative; z-index: 500;}
    #page #content #start{margin-top: 1%;}

    div#sb1{display: none;}
    .sb1 #content{width: 97%;}

}

@media screen and (max-width: 720px){
    #patientFileWoundResponsibleTransferData .dataTabLeftSide,
    #patientFileWoundResponsibleTransferData .dataTabRightSide,
    #patientFileWoundResponsibleData #woundResponsibleList .dataTabLeftSide,
    #patientFileWoundResponsibleData #woundResponsibleList .dataTabRightSide {
        padding: 0 10%;
        width: 80%;
    }
}

@media screen and (max-width: 500px){
    .ui-widget.ui-autocomplete{height: 190px !important;}
    .ui-widget.ui-autocomplete,
    #ui-id-1 .ui-state-active{font-size: 12px;}
}

@media print{
    #userNameWrapper,
    #header,
    #footer,
    #nav_main,
    #nav_admin{display: none;}
    body{background: none;}
    #content{background-color: transparent; box-shadow: none;}

}