@charset "utf-8";
/* CSS Document */

#slideshow {
  margin: 40px auto;
  position: relative;
  width: 660px;
  height: 500px;
  padding: 10px;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.4);
}

#slideshow > div {
  position: absolute;
  top: 10px;
  left: 10px;
  right: 10px;
  bottom: 10px;
}

#slideshow img {
  width: 640px;
  height: 480px;
}

#play-pause {
    position: absolute;
    bottom: 1em;
    left: 2em;
}

#play-pause .glyphicon {
    font-size: 5em;
	color:#1C3738;
}


/*section 2 */
table, th, td { margin: auto auto auto auto;border: 1px solid #333332;}


.users {
  table-layout: fixed;
  table-height: auto;
  height: auto;
  width: 100%;
  /*white-space: nowrap;*/

}
/* Column widths are based on these cells */
.row-ID {
  width: 50%;

}

.cell.rowspanned {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 100px;
}

.row-name {
  width: 50%;
  
}

h2{
	text-align:center;
	max-width:100%;
	font-size: 1.6em;
}


.users td {
 /*white-space: nowrap;*/
  overflow: hidden;
  text-overflow: ellipsis;
}
.users th {
  background: #333332;
  color: white;
  
}
.users td,
.users th {
  text-align: left;
  padding: 5px 10px;
    top: 0px;  
  vertical-align: text-top;


}
.users tr:nth-child(odd) {
  background: #D8DBDA;
}

.users tr:nth-child(even) {
  background: #737C78;
	color:white;
}

.wrapper {
  overflow: hidden;
}

.glyphicon{font-size: 1.5em;  color: #333332;     margin-right: 0.2em;}


.eye {    
	color: #333332;
    float: left;
    margin-right: 1.2em;
}

.eye:before {
  content:"";
  display: inline-block;
  position: relative;
  color: #620100;
  left: 3px;

  /*border: 6px solid transparent;
  border-left-color: #000;*/
}

.eye.active:before {
    color: #620100 ;
  left: 0;
  top: 0px;
  border-color: #620100 transparent transparent;
}

.eye:hover {
  cursor: pointer;  color: #000;
  
}

.inner-icon {
    position: relative;
}
/* style glyph */
.inner-icon .glyphicon {
  position: absolute;
  padding: 10px;
  pointer-events: none;
}

/* align glyph */
.left-icon .glyphicon {
  left: 0;
}

/* add padding  */
.left-icon textarea {
  padding-left: 40px;
}


textarea {
  resize: vertical;
}
.content {

  -webkit-transition: -webkit-transform .5s;
  transition: -webkit-transform .5s;
  transition: transform .5s;
  transition: transform .5s, -webkit-transform .5s;
  -webkit-transform: translateY(-100%);
          transform: translateY(-100%);
}

.content.show {
  -webkit-transform: translateY(0);
          transform: translateY(0);
}

.overview{
 margin-right: 0.5em;
  padding: 1em;
}

.textInput{

    padding: 3px;
    /* min-height: 80px; */
    -moz-box-shadow: inset 0 0 3px rgba(57,57,58,.5);
    -webkit-box-shadow: inset 0 0 3px rgba(57,57,58,.5);
    box-shadow: inset 0 0 3px rgba(57,57,58,.5);
}

/* Small Devices, Tablets */
@media only screen and (max-width : 790px) {
#slideshow {
  margin: 5px auto;
  position: relative;
  width: 100%;
  height: 480px;
  padding: 5px;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.4);
}

#slideshow > div {
  position: absolute;
  top: 3px;
  left: 3px;
  right: 3px;
  bottom: 3px;
}

#slideshow img {
  width: 100%;
  height: auto;
}
	
	#play-pause .glyphicon {
    font-size: 3em;
    color: #1C3738;
}
}

@media print {
	.btn-container{
		display: none;
	}

}