@charset "utf-8";

img, object, embed, video {
	max-width: 100%;
}

.ie6 img {
	width:100%;
}

#hover div {
    display:none
}

#hover a:hover + div {
    display:block;
    opacity:1;
	margin-left:100px;
	margin-top:-34px;
	position:absolute;
	max-width:60%;
	border-radius:5px;
	background-color:#FFC;
	padding:10px;
	border:1px solid #333;
	text-align:left;

}

body{
	background-color:#fff;
	color:#666;
	}

/* Mobile Layout: 480px and below. */

#head {background-color:#39F; height:30px; margin-left: auto; margin-right: auto; width: 98%; padding: 1%;}

#head a{width:37px; height:37px; background-color:#F00; float:right; margin:-1%; background-image:url(../images/home.png); background-size:cover;}

.mkd-iso{width:150px; text-align:center;}

.btn_green{padding:2px 5px; font-weight:bold; float:left; background-color:#0C0; color:#FFF; border-radius:4px; margin:0 2px; text-decoration:none; border:1px solid #030; font-size:9px;}

.btn_vio{padding:2px 5px; font-weight:bold; float:left; background-color:#90F; color:#FFF; border-radius:4px; margin:0 2px; text-decoration:none; border:1px solid #36006C; font-size:9px;}

.btn_red{padding:2px 5px; font-weight:bold; float:left; background-color:#F00; color:#FFF; border-radius:4px; margin:0 2px; text-decoration:none; border:1px solid #970000; font-size:9px; clear:right;}

.welcome{float:left; margin:0 0 0 50px; color:#FFF; width:70%; font-size:10px;}

#home_box a{ float:left; text-transform:uppercase; display:block; padding:0.2%; border:1px solid #CCC; margin:0.5%; font-weight:bold; color:#FFF; text-decoration:none; text-align:center; width:31%;}

#home_box p{position:static; height:30px; clear:both; font-size:9px;}

#home_box img{height:60px;}

#home_box a:hover{opacity:0.8;}

.textfloat_grad{float:left; width:47.1%; margin:0.5%; border:1px solid #999; padding:0.5%; color:#333;}

.textfloat a{float:left; width:47.1%; margin:0.5%; border:1px solid #999; padding:0.5%; color:#333;}

.new{float:right; background-image:url(../images/new.png); width:10px; height:13px; background-size:cover; padding:1%;
 margin-top:-1.1%;}

#form_popup{width:100%;}

#form_popup textarea{padding:1%; margin: 1% 0%; width:97%; height:105px; clear:both;}

#form_popup input[type=submit]{font-weight:bold; padding:2%; margin: 1% 0%;  border:1px solid #000; background-color:#CB0110; color:#FFF; float:right;}

#box_100 {margin:1%; width:98%;	display: block;}

#box_100 h2{padding:1%; font-size:9px; font-weight:bold; background-color:#060; color:#FFF;}

.info{font-size:16px; color:#090; font-weight:bold; text-align:center; width:100%; height:40px;}

#form_100 {display: block;}

#form_100 input[type=text]{ width:95%; margin:1% 0%; padding:2%;}

#form_100 input[type=password]{width:95%; margin: 1% 0%; padding:2%;}

.ui-datepicker { width:90%;}

#form_100 .checkbox{float:left; width:20%; margin: 1% 0%; padding:2%;}

#form_100 .err{float:left; width:20%; margin: 1% 0%; padding:2%;}

#form_100 input[type=submit]{font-weight:bold; padding:2%; margin: 1% 0%;  border:1px solid #000; background-color:#CB0110; color:#FFF;}

#form_100 select{width:98%; margin:1%; padding:1%;}

#form_100 select option{width:95%; margin:1%; padding:1%;}

#form_100 textarea{padding:1%; margin:1%;  width:98%; height:60px; }

.table_100{width:100%; color:#666;}

.table_100 input[type="text"]{width:100%}

.table_100 input[type="submit"]{float:right; padding:2% 5%; border:none; font-weight:bold; background-color:#03F; color:#FFF;}

.table{ width: 100%; margin:1% 0; font-size:11px;}

.table a{color:#F00; font-weight:bold;}

.table_options{width:98%; height:40px; margin:1%;}

#search{float:right; background-color:#3CF; padding:2px;}

#search input[type=text]{border:none; width:250px; padding:3px; color:#39F; font-weight:bold;}

#search input[type=submit]{position:absoulte; margin-left:-16px; background-color:#3CF; background-image:url(../images/search-icon.png); background-size:cover; border:none; width:30px;  padding:3px; }

.table_btn{float:right; padding:10px 20px; border:1px solid #39F; background-color:#DDD; color:#39F; font-weight:bold; text-align:center;}

.missing_info{float:right; padding:10px 20px; border:1px solid #F00; background-color:#DDD; color:#F00; font-weight:bold; text-align:center; max-height:300px; overflow-y:scroll;}

.table th{border:1px solid #333; color:#FFF; background-color:#333; padding:0.5%;}

.table td{border:1px solid #333; text-align:center; padding:0.5%; vertical-align:central;}

#box {float: left;	margin:1%;	border:1px solid #EEE;	padding:1%;	width: 45%;	display: block;}

#box h2{padding:2%; font-size:14px; font-weight:bold; background-color:#333; color:#FFF;}

#form {display: block;}

#form input[type=text]{width:100%; margin: 1% 0%; padding:2%;}

#form input[type=submit]{float:right; padding:2% 5%; border:none; background-color:#03F; color:#FFF;}

.des{width:94%; text-align:justify; height:220px; padding:1%; border:1px solid #EEE; margin:2% 0;}

.modalDialog {position: fixed; top: 0; right: 0; bottom: 0;	left: 0; background: rgba(0,0,0,0.8); z-index: 99999; opacity:0;
-webkit-transition: opacity 400ms ease-in;	-moz-transition: opacity 400ms ease-in;	transition: opacity 400ms ease-in;
pointer-events: none;}

.modalDialog:target {opacity:1;	pointer-events: auto;}

.modalDialog > div {width:90%; position:relative; margin:2% auto; padding:25px 5px 5px 5px; background: #fff; overflow:visible;
border-top:5px solid #C00; border-bottom:2px solid #C00;}

.application > div {width:95%; position:relative; margin:2% auto; padding:25px 5px 5px 5px; background: #fff; overflow:visible;
border-top:5px solid #C00; border-bottom:2px solid #C00;}

.application {position: fixed; top: 0; right: 0; bottom: 0;	left: 0; background: rgba(0,0,0,0.8); z-index: 99999; opacity:0;
-webkit-transition: opacity 400ms ease-in;	-moz-transition: opacity 400ms ease-in;	transition: opacity 400ms ease-in;
pointer-events: none;}

.application:target {opacity:1;	pointer-events: auto;}

.register {position: fixed; top: 0; right: 0; bottom: 0;	left: 0; background: rgba(0,0,0,0.8); z-index: 99999; opacity:0;
-webkit-transition: opacity 400ms ease-in;	-moz-transition: opacity 400ms ease-in;	transition: opacity 400ms ease-in;
pointer-events: none;  overflow-x:scroll;}

.register:target {opacity:1;	pointer-events: auto;}

.register > div {width:95%; position:relative; margin:2% auto; padding:25px 5px 5px 5px; background: #fff; overflow: visible;
border-top:5px solid #C00; border-bottom:2px solid #C00;}

.finalstep {position: fixed; top: 0; right: 0; bottom: 0;	left: 0; background: rgba(0,0,0,0.8); z-index: 99999; opacity:0;
-webkit-transition: opacity 400ms ease-in;	-moz-transition: opacity 400ms ease-in;	transition: opacity 400ms ease-in;
pointer-events: none;  overflow-x:scroll;}

.finalstep:target {opacity:1;	pointer-events: auto;}

.finalstep > div {width:95%; position:relative; margin:2% auto; padding:25px 5px 5px 5px; background: #fff; overflow: visible;
border-top:5px solid #C00; border-bottom:2px solid #C00;}

.newitem {position: fixed; top: 0; right: 0; bottom: 0;	left: 0; background: rgba(0,0,0,0.8); z-index: 99999; opacity:0;
-webkit-transition: opacity 400ms ease-in;	-moz-transition: opacity 400ms ease-in;	transition: opacity 400ms ease-in;
pointer-events: none;  overflow-x:scroll;}

.newitem:target {opacity:1;	pointer-events: auto;}

.newitem > div {width:95%; position:relative; margin:2% auto; padding:25px 5px 5px 5px; background: #fff; overflow: visible;
border-top:5px solid #C00; border-bottom:2px solid #C00;}

.edit > div {width:95%; position:relative; margin:2% auto; padding:25px 5px 5px 5px; background: #fff; overflow: visible;
border-top:5px solid #C00; border-bottom:2px solid #C00;}

.edit {position: fixed; top: 0; right: 0; bottom: 0;	left: 0; background: rgba(0,0,0,0.8); z-index: 99999; opacity:0;
-webkit-transition: opacity 400ms ease-in;	-moz-transition: opacity 400ms ease-in;	transition: opacity 400ms ease-in;
pointer-events: none;  overflow-x:scroll;}

.edit:target {opacity:1;	pointer-events: auto;}

.close {background:#C00; line-height:25px; position:absolute;right:0px; text-align:center; top:0px; width:50px;
text-decoration:none; font-weight:bold;}

.close a{color:#FFF;}

.close:hover { background:#F00; }

.print{ position:absolute; right:50px; text-align:center; top:0px; border:none; width:25px; height:25px; background-image:url(../images/printer.png); background-size:cover; font-weight:bold; color:#fff;}

@keyframes animation {
    0% {}
	50% {background-color:#000; color:#0C0;}
	100% {color:#000;}

}

.notification {background:#FFF; color:#F00; text-decoration:none; position:absolute; text-align:center;
font-weight: bold; padding:0.4%; animation-name:animation; animation-duration:2s;
animation-iteration-count:infinite;}

#a4_landscape{width:80%; max-height:85%; font-size:7px;}

.barcode{float:left; border:1px solid #DDD; padding:2px; width:51mm;}

.barcode img{width:100%;}

.barcode_company{text-align:center; font-size:8px; color:#000;}

.barcode_title{color:#000; font-size:11px; text-align:center;}

.clr{clear:both}

/* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */

@media only screen and (min-width: 481px) {

.head {
	background-color:#F00;
	margin-left: auto;
	margin-right: auto;
	width: 100%;
	padding: 1%;
}

#head a{width:39px; height:39px; background-color:#F00; float:right; margin:-1%; background-image:url(../images/home.png); background-size:cover;}

#home_box a{float:left; text-transform:uppercase; display:block; float:left; padding:1%; border:1px solid #CCC; margin:0.5%; font-weight:bold; color:#FFF; text-decoration:none; text-align:center; width:30%;}

#home_box p{font-size:11px;}

.btn_green a{padding:3px 10px; font-weight:bold; float:left; background-color:#0C0; color:#FFF; border-radius:4px; margin:0 2px; text-decoration:none; border:1px solid #030; font-size:10px;}

.btn_vio a{padding:3px 10px; font-weight:bold; float:left; background-color:#90F; color:#FFF; border-radius:4px; margin:0 2px; text-decoration:none; border:1px solid #36006C; font-size:10px;}

.btn_red a{padding:3px 10px; font-weight:bold; float:left; background-color:#F00; color:#FFF; border-radius:4px; margin:0 2px; text-decoration:none; border:1px solid #970000; font-size:10px; clear:right;}

.welcome{float:left; color:#FFF; margin:0 0 0 40px; font-size:11px;}

#form {
	clear: both;
	float: left;
	margin-left: 0;
	display: block;
}

.modalDialog > div {width:90%;}

.register > div {width:90%;}

.finalstep > div {width:90%;}

.newitem > div {width:93%;}

.application > div {width:80%; max-height:100%;}

.ui-datepicker { width:24.1%;}

#form_100 input[type=text]{width:45%; margin: 1% 0%; padding:2%;}

#form_100 input[type=radio]{width:auto; margin: 2% 1%; padding:4%;}

#form_100 input[type=password]{float:left; width:26.1%; margin: 1% 0%; padding:2%;}

#form_100 .checkbox{float:left; width:20%; margin: 1% 0%; padding:2%;}

#form_100 .err{float:left; width:20%; margin: 1% 0%; padding:2%;}

#form_100 input[type=submit]{font-weight:bold; padding:2%; margin: 1% 0%;  border:1px solid #000; background-color:#CB0110; color:#FFF;}

#form_100 select{width:30%; margin: 1% 0%; padding:1.3%;}

#form_100 select option{width:100%; margin: 1% 0%; padding:2%;}

#form_100 textarea{padding:1%; margin: 1% 0%; width:97.5%; height:105px;}

.new{float:right; background-image:url(../images/new.png); width:15px; height:16px; background-size:cover; padding:1%; margin-top:-1.1%;}

#box_100 {margin:1%; width:98%;	display: block;}

#box_100 h2{padding:1%; font-size:11px; font-weight:bold; background-color:#060; color:#FFF;}

#a4_landscape{width:80%; max-height:85%; font-size:10px;}

}

/* Desktop Layout: 769px to a max of 1232px.  Inherits styles from: Mobile Layout and Tablet Layout. */

@media only screen and (min-width: 769px) {

.head {
	background-color:#F00;
	margin-left: auto;
	margin-right: auto;
	width: 100%;
	padding: 1%;
}

#head a{background-color:#F00; float:right; margin:-1%; background-image:url(../images/home.png); background-size:cover;}

#home_box a{display:block; float:left; width:16.8%; }

#home_box p{font-size:12px;}

.welcome{font-size:14px; margin:0 0 0 130px;}

.textfloat a{float:left; width:47.8%; margin:0.5%; border:1px solid #999; padding:0.5%; color:#333;}

.btn_green{padding:5px 15px; font-weight:bold; float:left; background-color:#0C0; color:#FFF; border-radius:4px; margin:0 2px; text-decoration:none; border:1px solid #030; font-size:11px;}

.btn_vio{padding:5px 15px; font-weight:bold; float:left; background-color:#90F; color:#FFF; border-radius:4px; margin:0 2px; text-decoration:none; border:1px solid #36006C; font-size:11px;}

.btn_red{padding:5px 15px; font-weight:bold; float:left; background-color:#F00; color:#FFF; border-radius:4px; margin:0 2px; text-decoration:none; border:1px solid #970000; font-size:11px; clear:right;}

.welcome{float:left; margin:0 0 0 4%; color:#FFF;}

#form {
	display: block;
}

.modalDialog > div {width:80%; max-height:90%;}

.register > div {width:80%; max-height:100%; overflow-x:scroll;}

.finalstep > div {width:80%;}

.newitem > div {width:80%; max-height:100%;}

.application > div {width:40%; max-height:100%;}

#form_100 input[type=text]{float:left; width:28.9%; margin: 1%; padding:1%;}

#form_100 input[type=password]{float:left; width:28.9%; margin: 1%; padding:1%;}

.ui-datepicker { width:24.1%;}

#form_100 .checkbox{float:left; width:20%; margin: 1% 0%; padding:2%;}

#form_100 .err{float:left; width:20%; margin: 1% 0%; padding:2%;}

#form_100 input[type=submit]{font-weight:bold; padding:1%; margin: 1% 0%;  border:1px solid #000; background-color:#CB0110;
 position:relative; float:right; margin:1%;}

#form_100 select{float:left; width:31.3%; margin:1%; padding:0.6%;}

#form_100 select option{float:left; width:100%; margin:1%; padding:1%;}

#form_100 textarea{float:left; padding:1%; margin: 1%; width:28.9%; height:105px; }

.new{float:right; background-image:url(../images/new.png); width:15px; height:20px; background-size:cover; padding:1%; margin-top:-1.1%;}

#box_100 {margin:1%; width:98%;	display: block;}

#box_100 h2{padding:1%; font-size:14px; font-weight:bold; background-color:#060; color:#FFF;}

#a4_landscape{width:100%; font-size:12px;}

.landscape_table{height:595px;}

.landscape_table td{padding:5px; width:50%;}

.table{ width:100%; margin:1% 0; font-size:12px;}

}