/* Reset CSS */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* Standard CSS */
body {background-color: #393c40;margin: 0; padding: 0;font-size: 1.5em;font-family: Arial, Helvetica, sans-serif;}
h1 {color: #393c40}
input[type=submit] {border: none;background-color: #c6c3bf; color: #ffffff;padding: 15px;cursor: pointer;font-weight: bold;text-shadow: 1px 1px 1px #000000;}
select {-webkit-appearance: none;-moz-appearance: none;appearance: none;border:none;border-radius: 0;font-size: 1em;width: 100%;text-indent: -2px;} 
button {min-width: 100px;border: none;background-color: #393c40; color: #ffffff;padding: 15px;cursor: pointer;font-weight: bold;text-shadow: 1px 1px 1px #000000;}

/* Container */
#main {width: 80%;margin: auto;padding-top: 50px;}
#header {margin-top: 0;box-shadow: 0 5px 8px #c0c0c0;width: 80%;padding-left: 10%;padding-right: 10%;background-color: #fff;padding-top:20px;padding-bottom: 20px;}
#content {padding: 20px;}
.logo {width: 250px;}
.footer {padding: 10px 0;clear: both: float: none;border-top: 1px solid #c6c3bf;background-color: #393c40;text-align: center;position: fixed;bottom: 0;width: 100%;margin-left: 0;}
.footer A {color: #c6c3bf;font-size: 0.8em;text-decoration: none;}
.footer A:hover {color: #fff;}
.dataAjax {display: none;position: fixed;width: 500px;height:500px;background-color: #ffff99;border: 1px solid #333333;border-radius: 15px;left: 50%;margin-left: -250px;padding: 20px;}
#ajaxTest {display: none;}
.greets {text-align: center;color: #fff;}
.clearer {clear: both;float: none;}
#about {display: none;position: absolute;width: 100%;height: 100%;top: 0;left: 0;background: rgba(0, 0, 0, 0.8);}
#about DIV {z-index: 999;width: 600px;margin-left: -330px;left: 50%;position: absolute;top:4%;box-shadow: 5px 5px 5px #ccc;border: 1px solid #393c40;border-radius: 15px;background-color: #ffffff;padding: 30px;}
#about P {line-height: 1.5em;color: #393c40;}
#about .aboutClose {position: absolute;right: -10px;top: -10px;color: #c6c3bf;cursor: pointer;background-color: #393c40;border-radius: 15px;}

/* Login */
.login {background-color: #fff;width: 400px;margin: auto;border: 1px solid #fff;border-radius: 15px;padding: 50px 20px 75px 20px;position: relative;margin-top: 10vh;}
.login form {margin-top: 20px;}
.login form input[type=submit] {transition: background-color 0.5s ease;width: 100%;position: absolute;bottom: 0;left: 0;border-radius: 0 0 15px 15px;font-size: 1.5em;}
.login form input[type=submit]:hover {background-color: #393c40;}
.login form label {display: block;color: #393c40;}
.login form input[type=text], .login form input[type=password] {outline: none;width: 90%;font-size:1.2em;margin: 10px 0 30px 0;border: 1px solid #c6c3bf;border-radius: 15px;padding: 2px 10px;}
.login h1 {text-align: center; background-color: #393c40;color: #ffffff;position: absolute;top:0;left:0;width:100%;border-radius: 15px 15px 0 0;padding-top:10px;padding-bottom: 10px;}
.login .missing {color: red;text-align: center;padding: 20px 0 20px 0;border-top: 1px solid red;border-bottom: 1px solid red;}

/* Navigation */
.navigation {float: right;}
.navigation .mainMenu li {float: left;margin-left: 20px;margin-top: 50px;}
.navigation .mainMenu li A {text-decoration: none;color: #393c40;}
.navigation .btnAbout {color: #c6c3bf;cursor: pointer;}

/* Search */
#ajaxSearch {width: 98%;outline: none;font-size:1.2em;border: 1px solid #c6c3bf;border-radius: 15px;padding: 2px 1% 2px 40px;}
#ajaxResult {max-height: 646px;overflow-y: auto;transition: max-height 2s ease;position: absolute;width: 101%;background-color: white;}
#results, .resultHeader {background-color: white;}
#results {padding-bottom: 100px;}
#ajaxResult P, #results P, .resultHeader P {padding: 15px;border-bottom: 1px solid #c6c3bf;font-size: 0.8em;cursor: pointer;}
#ajaxResult P:nth-child(even), #results P:nth-child(even) {background: #CCC}
#ajaxResult::-webkit-scrollbar-track, #results::-webkit-scrollbar-track {-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);background-color: #F5F5F5;}
#ajaxResult::-webkit-scrollbar, #results::-webkit-scrollbar {width: 10px;background-color: #F5F5F5;}
#ajaxResult::-webkit-scrollbar-thumb, #results::-webkit-scrollbar-thumb {background-color: #F90;background-image: -webkit-linear-gradient(90deg,rgba(255, 255, 255, .2) 25%,transparent 25%,transparent 50%,rgba(255, 255, 255, .2) 50%,rgba(255, 255, 255, .2) 75%,transparent 75%,transparent)}
.ipsearch {position: absolute;margin-left: 10px;margin-top: 10px;color: #767676;}
#main #content .ipcancel {display: none;float: right;position: relative;right: -18px;top: -31px;color: #767676;transition: color 0.5s ease;cursor: pointer;}
#main #content .ipcancel:hover {color: #c6c3bf;}
.arContainer {position: relative;}
#ajaxResult .lastname,#ajaxResult .insurance, #ajaxResult .birthday,#ajaxResult .street,#ajaxResult .city {width: 290px;display: inline-block;}
#results .lastname,#results .insurance, #results .birthday,#results .street,#results .city {width: 290px;display: inline-block;}
.resultHeader .lastname,.resultHeader .insurance, .resultHeader .birthday,.resultHeader .street,.resultHeader .city {width: 290px;display: inline-block;}
.resultHeader .lastname.smaller,#results .lastname.smaller {width: 210px;}
.orange {color: #c6c3bf;}
.red {color: red;}

/* User Data */
#ajaxPatient, #ajaxUser, #ajaxBereich {display: none;position: absolute;width: 100%;height: 100%;top: 0;left: 0;background: rgba(0, 0, 0, 0.8);}
.patientData {z-index: 999;width: 900px;margin-left: -475px;left: 50%;position: absolute;top:5%;box-shadow: 5px 5px 5px #ccc;border: 1px solid #393c40;border-radius: 15px;background-color: #ffffff;padding: 30px;}
.patientData h3 {background-color: #393c40;color: #ffffff;text-align: center;margin-bottom: 20px;padding:10px;}
.patientData .left {width: 420px;float: left;position: relative;}
.patientData .right {width: 420px;float: right;}
.userData {z-index: 999;width: 900px;margin-left: -475px;left: 50%;position: absolute;top:5%;box-shadow: 5px 5px 5px #ccc;border: 1px solid #393c40;border-radius: 15px;background-color: #ffffff;padding: 30px;}
.userData h3,.changePWinner h3 {background-color: #393c40;color: #ffffff;text-align: center;margin-bottom: 20px;padding:10px;}
.userData .left {width: 420px;float: left;position: relative;}
.userData .right {width: 420px;float: right;}
.sdFirstname, .sdLastname, .sdBirthday, .sdStreet, .sdStreetNo, .sdZip, .sdCity, .sdTitle, .sdGender, .sdPhone, .sdPhone2, .sdMobil, .sdFax, .sdMail, .sdInsurance, .sdInsuranceNo, .sdCrdate, .sdModify, .sdMuser, .sdLastlogin {border-bottom: 1px solid #f29e2e;height: 30px;}
.lblFirstname, .lblLastname, .lblBirthday, .lblStreet, .lblStreetNo, .lblZip, .lblCity, .lblGender, .lblTitle, .lblPhone, .lblPhone2, .lblMobil, .lblFax, .lblMail, .lblInsurance, .lblInsuranceNo, .lblNotice, .lblCrdate, .lblModify, .lblMuser, .lblLogin, .lblPasswd, .lblempno, .lblLastlogin {font-size: 0.5em;}
.sdFirstname,.lblFirstname,.sdPhone,.lblPhone,.sdMobil,.lblMobil,.sdCrdate, .lblCrdate, .sdLogin, .lblLogin, .sdempno, .lblempno, .lblLastlogin, .sdLastlogin {width: 48%;float: left;}
.sdLastname, .lblLastname,.sdPhone2, .lblPhone2,.sdFax, .lblFax, .sdModify, .lblModify, .sdPasswd, .lblPasswd, .userChecks,#saveUser {width: 48%;float: right;}

.sdCrdate, .sdModify, .sdMuser, .sdLastlogin, .sdPosition, .sdBereich {border-bottom: 1px solid #c6c3bf;height: 30px;}
.lblNotice, .lblCrdate, .lblModify, .lblMuser, .lblLogin, .lblPasswd, .lblempno, .lblLastlogin {font-size: 0.5em;}
.sdCrdate, .lblCrdate, .sdLogin, .lblLogin, .sdempno, .lblempno, .lblLastlogin, .sdLastlogin {width: 48%;float: left;}

.sdLastname, .lblLastname,.sdPhone2, .lblPhone2,.sdFax, .lblFax, .sdModify, .lblModify, .sdPasswd, .lblPasswd, .userChecks,#saveUser {width: 48%;float: right;}
.sdBirthday, .lblBirthday {width: 48%;float: right;}
#isActive {margin-left: 50px;}
.sdStreet, .lblStreet {width: 300px;float: left;}
.sdStreetNo, .lblStreetNo {width: 100px;float: right;}
.sdZip, .lblZip {width: 100px;float: left;}
.sdCity, .lblCity {width: 300px;float: right;}
.sdGender, .lblGender {width: 48%;float: left;}
.sdTitle, .lblTitle {width: 48%;float: right;}
.sdPosition, .sdBereich {display: block;width: 98%;padding-left: 1%;padding-right: 1%;}
.sdNotice, .sdGender, .sdTitle {font-size: 1.5em;font-family: Arial, Helvetica, sans-serif;border: none;font-size: 1em;border-bottom: 1px solid #c6c3bf;background-color: #ddd;}
.sdNotice {border-bottom: none;width: 100%;height: 93px;overflow:hidden;background-attachment: local;background-image:linear-gradient(to right, #ddd 0, transparent 0),linear-gradient(to left, #ddd 0, transparent 0),repeating-linear-gradient(#ddd, #ddd 30px, #c6c3bf 30px, #c6c3bf 31px, #ddd 31px);line-height: 31px;}
.sdGender:disabled, .sdTitle:disabled {background-color: #ffffff;color: #000000;}
.sdNotice:disabled {color: #000000;background-image:linear-gradient(to right, white 0, transparent 0),linear-gradient(to left, white 0, transparent 0),repeating-linear-gradient(white, white 30px, #c6c3bf 30px, #c6c3bf 31px, white 31px);}
.sdMuser {padding-top: 12px;}
.patientDataCancel {position: absolute;right: -25px;top: -25px;color: #c6c3bf;cursor: pointer;background-color: #ffffff;border-radius: 25px;}
.patientData input[type=text] {border: none;font-size: 1em;border-bottom: 1px solid #c6c3bf;background-color: #ddd;}
.patientData input[type=text]:disabled {background-color: #ffffff;color: #000000;}
.userData input[type=text], .changePWinner input[type=text], .changePWinner input[type=password] {border: none;font-size: 1em;border-bottom: 1px solid #c6c3bf;background-color: #ddd;}
.userData input[type=text]:disabled {background-color: #ffffff;color: #000000;}
.patMailTo {position: absolute;right: 0;margin-top: 5px;color: #c6c3bf;}
.sidebar {position: absolute; top: 70px;left: 945px;}
.sidebar span {display: block;color: #cccccc;transition: all 0.8s ease;background-color: #ffffff;border-radius: 15px;padding:20px;margin-top: 5px;width: 40px;cursor: pointer;overflow: hidden;white-space: nowrap;}
.sidebar span:hover {color: #c6c3bf;width: 165px;}
.sidebar i {width: 70px;}
.sidebar .patientDataSave {display: none;color: #c6c3bf;width: 165px;}
.sidebar .patientDataNew {display: none;color: #c6c3bf;width: 165px;}
.sidebar .patientDataInfo {height: 40px;}
.sidebar .patientDataInfo:hover {height: 250px;}
.sidebar .patientDataInfo P {color: #000000;}
.patientData .btnTitleAdd {display: none;color: #c6c3bf;margin-top: 3px;position: absolute;cursor: pointer;right: 2px;}
.patientData .dontTake {background-color: red; color: white;text-align: center; padding: 10px;}
.patientData input[type=checkbox], .administration input[type=checkbox] {
	/* Double-sized Checkboxes */
  -ms-transform: scale(2); /* IE */
  -moz-transform: scale(2); /* FF */
  -webkit-transform: scale(2,2); /* Safari and Chrome */
  -o-transform: scale(2); /* Opera */
  padding: 10px;
}
.patientData.disabled {background-color: #ccc;}

.userData .btnTitleAdd {display: none;color: #c6c3bf;margin-top: 3px;position: absolute;cursor: pointer;right: 2px;}
.userData .dontTake {background-color: red; color: white;text-align: center; padding: 10px;}
.userData input[type=checkbox], .administration input[type=checkbox] {
	/* Double-sized Checkboxes */
  -ms-transform: scale(2); /* IE */
  -moz-transform: scale(2); /* FF */
  -webkit-transform: scale(2,2); /* Safari and Chrome */
  -o-transform: scale(2); /* Opera */
  padding: 10px;
}
.userData.disabled {background-color: #ccc;}

/* Change Password */
#changepasswd {display: none;position: absolute;width: 100%;height: 100%;top: 0;left: 0;background: rgba(0, 0, 0, 0.8);}
.changePWinner {z-index: 999;width: 400px;margin-left: -225px;left: 50%;position: absolute;top: 10%;box-shadow: 5px 5px 5px #ccc;border: 1px solid #393c40;border-radius: 15px;background-color: #ffffff;padding: 30px;}
#viewPass, #viewVerify {color: #d4d4d4;margin-left:10px;cursor: pointer;}
#viewPass:hover, #viewVerify:hover {color: #111111;}

/* User Administration */
.userEdit {margin-left: 6px;color: #c6c3bf;border-radius: 5px;border: 1px solid #c6c3bf;padding: 3px;position:relative;top: 2px;background-color: #ffffff;}
.userDisable {margin-left: 6px;color: #c6c3bf;border-radius: 5px;border: 1px solid #c6c3bf;padding: 3px 6px;position:relative;top: 2px;background-color: #ffffff;}
.userDisable.disabled {color: #ccc;}
.userDelete {margin-left: 6px;color: red;border-radius: 5px;border: 1px solid #c6c3bf;padding: 3px 5px;position:relative;top: 2px;background-color: #ffffff;}
.userEdit:hover {background-color: #c6c3bf;color: #ffffff;}
.userDisable:hover {background-color: #c6c3bf;color: #ffffff;}
.userDelete:hover {background-color: #c6c3bf;color: #ffffff;}

.dataWait {text-align: center;display: none;z-index: 1000;width: 900px;margin-left: -475px;left: 50%;position: absolute;top:25%;box-shadow: 5px 5px 5px #ccc;border: 1px solid #393c40;border-radius: 15px;background-color: #ffffff;padding: 30px;}
.dataWait h3 {background-color: #393c40;color: #ffffff;text-align: center;margin-bottom: 20px;padding:10px;}
.dataWait img {margin-top: 30px;}
#cities,#insurances {display: none;position: absolute;background-color: white;margin-top: 35px;padding: 15px;border: 1px solid #393c40;border-radius: 15px;box-shadow: 5px 5px 5px #333;width: 93%;}
#insurances {width: 40%;}
.cityLine {cursor: pointer;}
.cityLine:hover {color: white; background-color: #393c40;}
.insuranceLine {cursor: pointer;}
.insuranceLine:hover {color: white; background-color: #393c40;}
#saveOK {display: none;position: absolute;top: 220px;color: #5ac641;width: 100%;text-align: center;font-size: 2em;}
#errorMsg {display:none;position: absolute;top: 220px;color: #c6c3bf;width: 100%;text-align: center;background-color: #ffffff;border: 1px solid #393c40;padding: 20px;border-radius: 15px;box-shadow: 5px 5px 5px #ccc;left: -20px;}
#errorMsg P {line-height: 1.5em;color: #393c40;}
#confirmDelete {display:none;position: absolute;top: 220px;color: #c6c3bf;width: 100%;text-align: center;background-color: #ffffff;border: 1px solid #393c40;padding: 20px;border-radius: 15px;box-shadow: 5px 5px 5px #ccc;left: -20px;}
#confirmDelete P {line-height: 1.5em;color: #393c40;}
#frmNewTitle {display:none;position: absolute;top: 220px;color: #c6c3bf;width: 100%;text-align: center;background-color: #ffffff;border: 1px solid #393c40;padding: 20px;border-radius: 15px;box-shadow: 5px 5px 5px #ccc;left: -20px;}
#frmNewTitle P {line-height: 1.5em;color: #393c40;}


/* Listen */
.filter {height: 70px;float: left;width: 250px;border: 1px solid #c6c3bf; border-radius: 15px;background-color: #ffffff;padding: 30px;transition: background-color 0.5s ease;margin-top: 20px;margin-right: 20px;}
.filter select {cursor: pointer;}
.filter P {margin-bottom: 14px;}

#printCsv, #printPdf, #printPrinter {display: inline-block;float: left;cursor:pointer;margin-right: 20px;color: #d4d4d4;transition: all 0.5s;text-align: center;width:25%;font-size: 17px;}
#printCsv A, #printPdf A, #printPrinter A {color: #d4d4d4;transition: all 0.5s;text-decoration: none;}
#printCsv:hover, #printCsv A:hover  {color: #217346;}
#printPdf:hover, #printPdf A:hover {color: #a8202d;}
#printPrinter:hover, #printPrinter A:hover {color: #888;}

/* Main Buttons */
#newPatient, #newUser, #readCard {width: 250px;height: 100px;border: 1px solid #c6c3bf;;border-radius: 15px;background-color: #ffffff;padding: 30px;float: left;text-align: center;transition: background-color 0.5s ease;cursor: pointer;margin-top:20px;margin-right:20px;}
#newPatient:hover, #newUser:hover, #readCard:hover {background-color: #393c40;color: #c6c3bf;}
.countdown {position: absolute;right: 10%;top: 20px;}
.test input {
outline: none;
  width: 90%;
  font-size: 1.2em;
  margin: 10px 0 30px 0;
  border: 1px solid #c6c3bf;
  border-radius: 15px;
  padding: 2px 10px;
}

@media only screen and (max-width: 1000px) {
  .login {width: auto;margin-top: initial;}
}