body {
    padding-top: 60px;
    padding-bottom: 40px;
    font-family: 'Roboto', sans-serif;
}

.ui-autocomplete { position: absolute; cursor: default; z-index:100 !important;}  

.container-add{

 margin: 1em 0; 
}

.zf-green {
    color: #68b604;
}


a span{

  display:none;
  padding-left:0.5em;
}

.btn-default{
background-color:#eee;

}

.btn-default:hover{
background-color:#ccc;

}


.btn-fail {
  background-color: #A00813;
  background-image: -moz-linear-gradient(top, #ED1C24, #A00813);
  background-image: -ms-linear-gradient(top, #ED1C24, #A00813);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ED1C24), to(#A00813));
  background-image: -webkit-linear-gradient(top, #ED1C24, #A00813);
  background-image: -o-linear-gradient(top, #ED1C24, #A00813);
  background-image: linear-gradient(top, #ED1C24, #A00813);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ED1C24', endColorstr='#A00813', GradientType=0);
}

.btn-fail:hover,
.btn-fail:active,
.btn-fail.active,
.btn-fail.disabled,
.btn-fail[disabled] {
  background-color: #A00813;
}

.btn-fail:active, .btn-fail.active {
  background-color: #A00813;
}

nav {margin:0; }
nav ul {text-align:center;}
nav ul li {float:left;display:inline; color:#fff;}
nav ul li:hover {background:#666;}
nav ul li a {display:block;padding:0;text-decoration: none;}
nav ul li ul {position:absolute;background:#666; margin:0; padding:0; width:180px;}
nav ul li ul li { text-align: left;padding:0.5em 1em; color:#fff;}
nav ul li ul li a {display:block;padding:0px;color:#BBB;}
nav ul li ul li:hover a {background:#666; color:#fff; text-decoration: none;}
nav ul li ul.fallback {display:none;}
nav ul li:hover ul.fallback {display:block;}


div.container{
width:100%;

}

div.container a.navbar-brand{

 margin-right:30px;
}

div.container a.navbar-brand > img {
    display: inline;
    position:absolute;
top:10px;
}


h1{
border-bottom:1px solid #ddd;
padding-bottom:0.2em;
padding-top:1em;

}
h2{
/*border-bottom:1px solid #ddd;*/
padding-bottom:0.2em;
padding-top:0em;

}


h4{
margin-top:1em;
padding:0.5em;


}

h3{
margin-top:1em;
color: #0556a5;
font-weight: bold;
/*border-bottom:1px solid #eee;*/

}

#worksheet-fields{

  list-style: none;
  margin:0;
  padding:0;
}

#worksheet-fields li{
margin:0;

display:inline-block;
padding:0.5em;
}


.worksheet-result{
  list-style: none;
  margin:0;
  padding:0;
}

.worksheet-result li{
margin:0;
display:inline-block;
padding:0em;
min-width:20em;
}

table.input{
background: #eee;
border:1px solid #ddd;
border-top:none;

}

#contact-fields{

  list-style: none;
  margin:3px 0;
  padding:0;
  background: #eee;
border:1px solid #ddd;
}

#contact-fields li{
margin:0;

display:inline-block;
padding:0.5em;

}

#action-fields{

  list-style: none;
  margin:1em 0;
  padding:0;

}

#action-fields li{
margin:0;

display:inline-block;
padding-right:0.5em;


}

.btn-small{

width:20px;
height:20px;
padding:0 5px;

}

div.table{



}

div.table ul{
width:100%;
list-style: none;
padding:0em 0;
color:#666;
margin:0;
border-top:1px solid #fff;
background:#eee;
position: relative;
min-height: 3em
}

div.table .head{
margin:0;
color:#fff;
background:#aaa;
display:inline-block;
padding:0;

}

div.table li{
margin:0;
padding:0 1em;
display:inline-block;
line-height: 3em;
vertical-align: top;


}

div.table li input,select{
margin:0.2em 0 0.2em 0;



}


div.loading{
margin:5% auto;
width:216px;
background-image: url('../img/loading.gif');
background-repeat: no-repeat;
display:block;
min-height:216px;
}




div#content{
min-height:100em;


}

div#content ul{
transition: background-color 0.5s, color 0.5s;


}

div#content ul:hover{
background-color:#b8ccde;
color:#337ab7;


}




div#journal-container{

margin:0;
padding:0;
display:none;
position:fixed;
top:3.6em;
width:100%;
background-color: #ccc;
border-bottom:#ccc 1px solid;
box-shadow: 0px 2px 10px rgba(0,0,0,0.4);
z-index: 3000

}

div#journal-list{
background-color: #fff;
border-bottom:#ccc 1px solid;
height:216px;
}

div#journal-list div{

margin:0 auto;
height:216px;
}


div#journal-list ul{
margin:0;
padding:0em;
width:100%;
background-color:#eee;
list-style: none;
}

div#journal-list li{
margin:0 ;
padding:0  1em;
background-color:#eee;
display:inline-block;
line-height: 3em;
border-bottom:1px #fff solid;
}

div#journal-form{


}

div#journal-form div{

margin:0 auto;
max-width:1140px;
border-bottom:#ccc;
padding:0.5em 0;
}

div#journal-form ul{
margin:0; 
padding:0;
list-style: none;

}

div#journal-form li{

display:inline-block;
}


div#journal-form label{
font-weight: normal;
color:#fff;
margin-left:1em;
}

div.reveal{

display:none;

}

.form-group ul.driver{
 margin:0;
 padding:0; 
 list-style:none;
 width:100%;
}


.form-group ul.driver li{
 display:inline-block;
 padding-right:1em;
 width:100%;
}

.actions{

position: absolute;
right:0;
}


.actions a{

margin-left:0.5em;
}

.eighth{max-width:10em;}
.quarter{max-width:25em;}
.half{max-width:50em;}
.threquarter{max-width:75em;}


ul.help-block{
  list-style: none;
  margin:0;
  padding:0;
}

ul.help-block li{
  margin:0;
  list-style: none;
  color:red;
}


input.ac{

  border:3px solid #9eb8d3;

}

.required{

  color:#b42a0b;
  content:"*";
}


ul.image-library{
max-width:33%;
display:inline-block;
position:relative;
overflow:hidden;
border-right:2px solid #fff;
}


ul.image-library li{

padding:1em;
position:relative;
}


ul.image-library li img{
height:10em;
position:relative;

}

ul.image-library .check{
 display: block;
  width: 20px;
  height: 20px;
  border-style: solid;
  border-width: 0 50px 50px 0;
  border-color: transparent #ccc transparent transparent;
  position: absolute;
  top: -27px;
  right: 0;
  z-index: 99999;
  color: #fff;
 transition: border-color 0.5s;

}

ul.image-library .check:hover{
 cursor:pointer;
 border-color: transparent #4988bd transparent transparent;
}

ul.image-library .check i{

  position: absolute;
  top: 36px;
  right: -42px;

}

ul.image-library .warning{
 border-color: transparent #f0ad4e transparent transparent;
  
}

ul.image-library .checked {

border-color: transparent #4988bd transparent transparent;
}


ul .check{
 display: block;
  width: 0px;
  height: 0px;
  border-style: solid;
  border-width: 0 40px 40px 0;
  border-color: transparent #ccc transparent transparent;
  position: absolute;
  top: 0px;
  right: 0;
  z-index: 99999;
  color: #fff;
 transition: border-color 0.5s;

}

ul .check:hover{
 cursor:pointer;
 border-color: transparent #4988bd transparent transparent;
}

ul .check i{

  position: absolute;
  top: 5px;
  right: -34px;

}

ul .warning{
 border-color: transparent #f0ad4e transparent transparent;
  
}

ul .checked {

border-color: transparent #4988bd transparent transparent;
}


ul.image-library .warning{
 border-color: transparent #f0ad4e transparent transparent;
  
}

ul.image-library .checked {

border-color: transparent #4988bd transparent transparent;
}



ul.report-images{

  list-style: none;
  margin:0;
  padding:0;



}

ul.report-images li{

width:33%;
max-height:18em;
display:inline-block;
position:relative;
overflow:hidden;
background-color:#ccc;
padding:1em;

}

ul.report-images li img{


max-height: 13em;

 width: auto;
    max-width: 100%;
    margin-bottom:1em;


}

ul.report-images li:hover{
cursor: pointer;

}

ul.report-images li div{
transition: color 0.5s;
}

ul.report-images li:hover div{
color:#4988bd;

}





@media 
(-webkit-min-device-pixel-ratio: 1.25), 
(min-resolution: 120dpi){ 
    /* Retina-specific stuff here */


div.table li{
margin:0;
padding:0.5em;
display:inline-block;
min-width:20em;

}

div.table ul.head{

display:none;


}

}