body{
	background-color: lightgrey;
}
.header, footer{
	background-color: black;
}
.header h2{
	padding: 10px;
	color: white;
	font-weight: bold;
	font-size: 30px;
	font-family: 'Annie Use Your Telescope';
	display: inline-block;
	float: left;
	margin: 0px;
	margin-right: 100px;
}
.active{
	background-color: white;
}
.active a{
	color: black;
	font-weight: bold;
}
.header li{
	padding-right: 10px;
}
.header .navbar .in li{
	position: unset !important;
	border-bottom:1px solid white;
}
.header a{
	color: lightcyan;
}
.header a:hover{
	color: black;
}
.header .fa-bars{
	color: white;
}
#logout{
	position: absolute;
	right: 0;
}
.body{
	text-align: center
}
.body div.layoutbody {
	background-color: white;
	padding: 5px;
	margin: 5px;
	box-shadow: 1px 1px 5px;
	opacity: 0.7;
	font-weight: bold;
	cursor: pointer;
	width:100px;
	height:70px;
	font-size: 11px;
	display: inline-block;
	vertical-align: middle;
	border-radius: 10px;
}
.body div.layoutbody img {
	width: 100px;
}
.body div.layoutbody i{
	font-size: 25px;
	display: block;
	margin-bottom: 5px;
}
.body div.layoutbody:hover{
	box-shadow: -1px -1px 5px;
}
footer{
	position: fixed;
	width: 100%;
	bottom: 0px;
	color: black;
	text-align: center;
	padding: 10px;
	background-color: darkgray;
	z-index: 100;
}

.ace-file-input { display:block; font-size:inherit; position:relative; height:30px }
.ace-file-input input[type=file] { position:absolute; z-index:-999; width:1px; height:1px; overflow:hidden; opacity:0; filter:alpha(opacity=0) }
.ace-file-input input[type=file]:focus { outline:0 }
.ace-file-input .ace-file-container { display:block; position:absolute; top:0; left:0; right:0; height:30px; background-color:#FFF; border:1px solid #D5D5D5; cursor:pointer; -webkit-box-shadow:none; box-shadow:none; -webkit-transition:all .15s; -o-transition:all .15s; transition:all .15s }
.ace-file-input .ace-file-container:hover { -webkit-box-shadow:none; box-shadow:none; border-color:#F59942 }
.ace-file-input .ace-file-container:before { display:inline-block; content:attr(data-title); position:absolute; right:0; top:0; bottom:0; line-height:24px; text-align:center; padding:0 8px; background-color:#6FB3E0; color:#FFF; font-size:11px; font-weight:700; border:2px solid #FFF; border-left-width:4px; -webkit-transition:all .3s; -o-transition:all .3s; transition:all .3s }
.ace-file-input .ace-file-container .ace-file-name {display:inline-block;height:28px;max-width:80%;white-space:nowrap; overflow:hidden; line-height:28px; color:#888; font-size:13px; vertical-align:top; position:static; padding-left:30px }
.ace-file-input .ace-file-container .ace-file-name:after { display:inline-block; content:attr(data-title) }
.ace-file-input .ace-file-container.selected { right:16px }
.ace-file-input .ace-file-container.selected .ace-file-name { color:#666 }
.ace-file-input .ace-file-container .ace-icon {display:inline-block;position:absolute;left:0;top:0;bottom:0;line-height:24px;width:26px;text-align:center;font-family:FontAwesome;font-size:13px;border:2px solid #FFF;color:#FFF;-webkit-transition:all .1s;-o-transition:all .1s;transition:all .1s;background-color:#D1D1D1 }
.ace-file-input .ace-file-container.selected .ace-file-name .ace-icon { background-color:#EFAD62 }
.ace-file-input .ace-file-container.selected .ace-file-name .file-image { background-color:#BD7A9D }
.ace-file-input .ace-file-container.selected .ace-file-name .file-video { background-color:#87B87F }
.ace-file-input .ace-file-container.selected .ace-file-name .file-audio { background-color:#8B7AC9 }
.ace-file-input .ace-file-container.selected .ace-file-name .file-archive { background-color:#EFAD62 }
.ace-file-input .ace-file-container.hide-placeholder:before { display:none }
.ace-file-input a:hover { text-decoration:none }
.ace-file-input .remove { position:absolute;right:-8px;top:6px;display:none;width:17px;text-align:center;height:17px;line-height:15px;font-size:11px; font-weight:400;background-color:#FB7142;border-radius:100%;color:#FFF;text-decoration:none }
.ace-file-input .ace-file-container.selected+.remove { display:inline-block }
@media screen and (-webkit-min-device-pixel-ratio:0) { .ace-file-input input[type=file] { position:absolute; width:0; height:0 } }
.ace-file-input input[type=file].disabled+.ace-file-container,.ace-file-input input[type=file][disabled]+.ace-file-container,.ace-file-input input[type=file][readonly]+.ace-file-container { cursor:not-allowed; background-color:#EEE }
.ace-file-input input[type=file].disabled+.ace-file-container:hover,.ace-file-input input[type=file][disabled]+.ace-file-container:hover,.ace-file-input input[type=file][readonly]+.ace-file-container:hover { -webkit-box-shadow:none; box-shadow:none; border-color:#E3E3E3 }
.ace-file-input input[type=file].disabled+.ace-file-container:before,.ace-file-input input[type=file][disabled]+.ace-file-container:before,.ace-file-input input[type=file][readonly]+.ace-file-container:before { border-color:#EEE; background-color:#A1AAAF }
.ace-file-input input[type=file][readonly]+.ace-file-container { cursor:default }
.fc-event.ui-draggable-dragging,.item-list>li.ui-sortable-helper { cursor:move }
.ace-file-input .ace-file-overlay { position:absolute; top:-2px; bottom:-2px; left:-2px; right:-10px; z-index:99; background-color:rgba(0,0,0,.5) }
.ace-file-input .ace-file-overlay>.overlay-content { display:inline-block; position:relative; top:10%; left:0; right:0; text-align:center }
.ace-file-multiple { height:auto }
.ace-file-multiple .ace-file-container { position:relative; height:auto; border:1px dashed #AAA; border-radius:4px; text-align:center }
.ace-file-multiple .ace-file-container:before { display:inline-block; content:attr(data-title); position:relative; right:0; left:0; margin:12px; line-height:22px; background-color:#FFF; color:#CCC; font-size:18px; font-weight:700; border-width:0 }
.ace-file-multiple .ace-file-container.selected .ace-file-name .ace-icon { display:inline-block; left:0; top:0; bottom:0; width:26px; text-align:center; font-family:FontAwesome; font-size:13px; border:2px solid #FFF; color:#FFF; -webkit-transition:all .1s; -o-transition:all .1s; transition:all .1s }
.ace-file-multiple .ace-file-container .ace-file-name { position:relative; display:block; padding:0; height:auto; width:auto; max-width:100%; margin:0 4px; border-bottom:1px solid #DDD; text-align:left }
.ace-file-multiple .ace-file-container .ace-file-name:first-child { margin-top:1px }
.ace-file-multiple .ace-file-container .ace-file-name:last-child { border-bottom-width:0; margin-bottom:1px }
.ace-file-multiple .ace-file-container .ace-file-name img { padding:2px; border:1px solid #D7D7D7; background-color:#FFF; background-repeat:no-repeat; background-position:center; margin:4px 8px 4px 1px }
.ace-file-multiple .ace-file-container .ace-file-name:after { display:none }
.ace-file-multiple .ace-file-container.selected .ace-file-name:after { display:inline-block; white-space:pre }
.ace-file-multiple .ace-file-container .ace-file-name img+.ace-icon,.ace-file-multiple .ace-file-container.selected .ace-file-name img+.ace-icon { display:none }
.ace-file-multiple .remove { right:-11px; top:-11px; border:3px solid #BBB; border-radius:32px; background-color:#FFF; color:red; width:23px; height:23px; line-height:16px }
.input-group .input-group-addon,.input-group>.btn { border-radius:0!important }
.ace-file-multiple .ace-file-container.selected+.remove:hover { border-color:#F4C0B1 }
.ace-file-multiple .ace-file-overlay { position:absolute; top:-12px; bottom:-6px; left:-12px; right:-12px }
.ace-file-multiple .ace-file-overlay>.overlay-content { top:20% }
.ace-file-multiple .ace-file-container .ace-file-name .ace-icon { position:relative; display:block; text-align:center; height:auto; line-height:64px; width:auto; font-size:64px; color:#D5D5D5; margin:4px 0; background-color:transparent }
.ace-file-multiple .ace-file-container.selected:after { display:none }
.ace-file-multiple .ace-file-container.selected .ace-file-name .ace-icon { position:relative; margin-right:4px; margin-left:2px; line-height:24px }
.ace-file-multiple .ace-file-container .ace-file-name.large { text-align:center; border-bottom:1px solid #222; margin:0 1px 3px }
.ace-file-multiple .ace-file-container .ace-file-name.large:last-child { margin:0 1px }
.ace-file-multiple .ace-file-container .ace-file-name.large:after { position:absolute; top:auto; bottom:0; left:0; right:0; padding:0 4px; background-color:#555; color:#FFF; opacity:.8; filter:alpha(opacity=80) }
.ace-file-multiple .ace-file-container .ace-file-name.large img { border-width:0; margin:0!important; padding:0 }
.ace-file-multiple input[type=file].disabled+.ace-file-container:hover,.ace-file-multiple input[type=file][disabled]+.ace-file-container:hover,.ace-file-multiple input[type=file][readonly]+.ace-file-container:hover { border-color:#AAA }
.ace-file-multiple input[type=file].disabled+.ace-file-container:before,.ace-file-multiple input[type=file][disabled]+.ace-file-container:before,.ace-file-multiple input[type=file][readonly]+.ace-file-container:before { background-color:transparent }
.ace-file-multiple input[type=file].disabled+.ace-file-container .ace-icon,.ace-file-multiple input[type=file][disabled]+.ace-file-container .ace-icon,.ace-file-multiple input[type=file][readonly]+.ace-file-container .ace-icon { border-color:#EEE }

.imageform div.col-sm-12{
	text-align: left;
}
.extrafields{
	display: none;
}
.imageform div.col-sm-12 label{
	width: 150px;
}
.imageform div.col-sm-12 input, .imageform div.col-sm-12 select, .imageform div.col-sm-12 textarea{
	width: 300px;
	display: inline-block;
	padding: 5px 10px;
	margin-bottom: 5px;
	border: unset;
	box-shadow: 0px 0px 3px;
	vertical-align: middle;
}
.imageform form{
	text-align: left;
}
.imageform div.col-sm-12 label{
	width: 150px;
}
.imageform div.col-sm-12 input, .imageform div.col-sm-12 select, .imageform div.col-sm-12 textarea{
	width: 300px;
	display: inline-block;
	padding: 5px 10px;
	margin-bottom: 5px;
	border: unset;
	border-radius: 5px;
	box-shadow: 0px 0px 3px;
	vertical-align: middle;
}
.form-horizontal .form-group {
    margin-right: 0px;
    margin-left: 0px;
}
.ace-file-input .ace-file-container{ 
	height: 30px;
	width: 100%;
  display: inline-block;
  padding: 5px 10px;
  margin-bottom: 0px;
  border: unset;
  box-shadow: 0px 0px 3px;
}
.subheading{
	font-weight: bold;
	text-decoration: underline;
	padding: 5px 10px;
	background-color: brown;
	clear: both;
	color: white;
	margin-bottom: 10px;
}
.clear{
	clear: both;
	height: 5px;
}
.button{
	padding: 5px;
	margin-left: 5px;
	font-weight: bold;
	cursor: pointer !important;
}
.alertmsg{
	height: 50px;
}
.msgAlertBox{
	width: 300px;
	font-weight: bold;
	padding: 5px;
	margin: auto;
}
.msgAlertBox {
	
}
.filters label{
	margin-bottom: 0px;
}
.filters select{
	display: block;
	width: 100%;
	margin-bottom: 20px;
	height: 130px;
	border: unset;
}

.imageSlot{
	margin-bottom: 10px;
	height:250px;
	overflow:hidden;
}
.imageHeader{
	border: 1px solid gray;
	border-bottom: none;
	background-color: black;
	color: white;
	text-align: left;
	font-weight: bold;
	padding: 2px 5px;
	overflow: hidden;
	white-space: nowrap;
}
.Thumbnail{
	border: 1px solid gray;
	border-bottom: none;
	border-top: none;
	background-color: white;
	height: 200px;
}
.Thumbnail img{
	max-height: 100%;
	max-width: 100%;
}
.imageFooter{
	border: 1px solid gray;
	border-top: none;
	background-color: maroon;
	padding:0px;
	margin:0px;
}
.imageFooter button, .imageFooter a{
	width: 15%;
	margin:0px;
	background-color: unset;
	border: unset;
	color: white;
	display: inline-block;
	font-size: 17px;
}
.imageFooter button:hover{
	text-decoration: underline;
}
#imageLoad .modal-dialog{
	margin:10px auto;
	width: 100%;
}
#imageLoad .imageLoadBody{
	padding:0px; 
	height:100%;
}
#imageLoad .imageLoadBody img{
	height:550px;
}
#imageLoad .modal-footer{
	padding:5px;
}
#imageLoad .imageform div.col-sm-12 input, #imageLoad .imageform div.col-sm-12 select, #imageLoad .imageform div.col-sm-12 textarea{
	width: 100%;
	display: inline-block;
	padding: 2px 5px;
}
#imageLoad .imageform .col-sm-12{
	padding: 0px;
}


/* grouping */
#imageGroup{
	width: 300px;
	position: fixed;
	right: 10px;
	top: 10px;
}
#imageGroup .modal-body{
	min-height: 200px;
}
#imageGroup .modal-footer{

}


/* submenu */
.submenu{
	position: absolute;
	list-style: none;
	background-color: white;
	z-index: 1000;
	width: 200px;
	margin: 0px;
	padding:0px;
	border: 2px solid black;
	display:none;
}
.submenu li{
	padding:0px;
	margin: 0px;
	text-align: center;
	border-top: 2px solid black;
}
.submenu li a{
	padding: 10px;
	display: block;
	text-decoration: none;
	color: black;
}
.submenu li a:hover{
	color: white;
	background-color: black;
}
.active a{
	color: black;
	background: white;
}
.active ul.submenu li.active a{
	color: white;
	background: black;
}
.bulk_imageset {
	clear: both;
}
.bulk_imageset label{
	width: 90% !important;
}
.bulk_imageset i{
	float: right
}
.addGraphicForm #multiset div, .addGraphicForm form{
	padding: 0 2px;
}
.addGraphicForm #type_id, .addGraphicForm #tabid{
	width: 100%;
  display: inline-block;
  padding: 5px 10px;
  margin-bottom: 0px;
  border: unset;
  border-radius: 0px;
  box-shadow: 0px 0px 3px;
}
.addGraphicForm .newMore{
	text-shadow: 0px 1px 2px black;
	font-size: 25px;
	color:red;
	margin: 2px;
	cursor: pointer;
}
.rowGroupAdd{
	float: right;
	text-shadow: unset !important;
	color:green !important;
	cursor: pointer;
	margin-top: 20px !important;
	margin-bottom: -10px !important;
}
.addGraphicForm div.col-sm-10 input{
	height: 30px
}
.addGraphicForm #imageset{
	box-shadow: 0px 0px 3px;
	padding: 10px 5px !important;
	margin-bottom:15px;
}
.imageviewer img {
    width: 90%;
    max-height: 90%;
    margin: 10px;
}
.imageviewer .postImageHold{
	width: 300px;
  height: 300px;
	float: left;
	padding: 10px;
	margin: 10px;
	box-shadow: 0px 0px 5px blue;
	border-radius: 5px;
}
.addGraphicForm, .imageviewer {
	overflow-y: scroll;
	height: 550px;
}


/* Submenu header */
.navbar {
    margin-bottom: 0px;
}
div.submenuHead{
	overflow: hidden;
	width: 100%;
	text-align: center;
	background-color:#5f5f5f;
	margin-bottom: 5px;
}
div.submenuHead ul {
	list-style: none;
	margin: 0px;
	padding: 0px;
}
div.submenuHead ul li a{
	cursor: pointer;
}
div.submenuHead ul li a, div.submenuHead ul li {
	color: white;
	font-weight: bold;
	text-decoration: unset;
}
div.submenuHead ul li{
	display: inline-block;
	padding: 10px 15px;
	
	margin: 0px;
}
div.submenuHead ul li:hover{
	background-color: darkblue;
}
div.submenuHead ul li.active, div.submenuHead ul li.active a{
	background-color: darkblue;
}
.menuicons{
	font-size: 20px;
}
button.form-control[type=button]{
	box-shadow: 1px 1px 1px 1px black;
}
button.form-control[type=button]:hover{
	box-shadow: 0px 0px 2px 2px black;
}

/* Ticket report CSS */
.tickettable th { text-align:center; }

/* comment section */
div.hidediv { 
  display:none;
  position: absolute;
  width: 90%;
  left: 5%;
  height: 90%;
  overflow-x: hidden;
  background-color: gray;
  padding: 10px;
  text-align: left;
  padding-top: 10px;
  border: 5px solid black;
}
i.closebtndetails{
	font-size: 20px;
	color: red;
	text-shadow: unset;
	background-color: black;
	padding: 3px 5px;
	position: absolute;
	right: 10px;
	border-radius: 0;
	cursor: pointer;
}
div.imbuttons, 
div.ticketreportStaff {
	display: inline-block;
	vertical-align: top;
}
div.imbuttons { 
	width: 14%;
	background-color: gray;
	margin-top: -5px;
	margin-left: -5px;
	padding-top: 20px;
	min-height: 560px;
}
div.ticketreportStaff { width: 85%; }

.pendingTicket, 
.correctionTicket, 
.completedTicket {
	font-weight: bold;
	color: black;
	width: 80px;
	display: inline-block;
	border: 1px solid;
	border-radius: 50px 0 0 50px;
	text-align:center;
}  
.pendingTicket { background-color: #ec8989; }
.correctionTicket { background-color: yellow; }
.completedTicket { background-color: #3dee3d; }
.tickettable { font-size:12px; }
.filters {
	padding-right:0;
	padding-left: 5px;
	padding-top: 5px;
	margin-right:5px;
	margin-top: -5px;
	background-color: gray;
	min-height: 560px;
	font-size:12px;
}
.filters input { font-size: 12px; }
table.tickettable tbody tr th {
	background-color: maroon;
	color:white;
}