/* Center the image and position the close button */

.cancelbtn {
  width: auto;
  padding: 10px 18px;
  background-color: #f44336;
}

.imgcontainerlogin {
  text-align: center;
  margin: 24px 0 12px 0;
  position: relative;
}

.containerlogin {
  padding: 16px;
}

img.logologin {
  width: 40%;
  border-radius: 10px; // 50%;
}

.myButtonlogin {
  box-shadow:inset 0px 1px 0px 0px #ffffff;
  background:linear-gradient(to bottom, #ededed 5%, #dfdfdf 100%);
  background-color:#ededed;
  border-radius:5px;
  border:1px solid #dcdcdc;
  display:inline-block;
  cursor:pointer;
  color:#777777;
  font-size:14px;
  padding:6px 26px;
  text-decoration:none;
  text-shadow:0px 1px 0px #ffffff;
}

.detailscontainer {
  font-size: 0.8em;
  text-align: center;
}

.imgcontainer {
  text-align: center;
  margin: 24px 0 12px 0;
}

img.logo {
  width: 200px;
  border-radius: 10px; // 10%;
}
table {
  width: 100%;
  border-collapse: collapse;
  margin: 0;
  padding: 0;
  /* table-layout: fixed;*/
  width:100%;
}
/* Zebra striping */
tr:nth-of-type(odd) {
  background: #eee;
}
th {
  background: #333;
  color: white;
  font-weight: bold;
  text-align: center;
}
td, th {
  padding: 6px;
  border: 1px solid #ccc;
}
table caption {
  font-size: 1.5em;
  margin: .5em 0 .75em;
}

#right {
  text-align: right;
  margin-right: .25em;
  padding-right: .25em;
}
#center {
  text-align: center;
}

/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
  padding-top: 60px;
}

/* Modal Content/Box */
.modal-content {
  background-color: #fefefe;
  margin: 5% auto 15% auto; /* 5% from the top, 15% from the bottom and centered */
  border: 1px solid #888;
  width: 80%; /* Could be more or less, depending on screen size */
}

/* The Close Button (x) */
.close {
  position: absolute;
  right: 25px;
  top: 0;
  color: #000;
  font-size: 35px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: red;
  cursor: pointer;
}

.myButton {
  box-shadow:inset 0px 1px 0px 0px #ffffff;
  background:linear-gradient(to bottom, #ededed 5%, #dfdfdf 100%);
  background-color:#ededed;
  border-radius:5px;
  border:1px solid #dcdcdc;
  display:inline-block;
  cursor:pointer;
  color:#777777;
  //font-family:Arial;
  font-size:10px;
  //font-weight:bold;
  padding:4px 22px;
  text-decoration:none;
  text-shadow:0px 1px 0px #ffffff;
}
.myButton:hover {
  background:linear-gradient(to bottom, #dfdfdf 5%, #ededed 100%);
  background-color:#dfdfdf;
}
.myButton:active {
  position:relative;
  top:1px;
}

.spacer {
  margin-left: 15px;
  margin-rigiht: 15px;
}

.clean {
 margin: 0;
 padding: 0;
 border: none;
}

.tohead {
 border: none;
 padding: 0;
 background: #333;
 color: white;
 font-weight: bold;
 text-align: center;
 margin: -1px;margin: -1px;
 font-size: .7em; 
}


input[type=text], input[type=password] {
  width: 100%;
  padding: 12px 20px;
  margin: 8px 0;
  display: inline-block;
  border: 1px solid #ccc;
  box-sizing: border-box;
}


/* Add Zoom Animation */
.animate {
  -webkit-animation: animatezoom 0.6s;
  animation: animatezoom 0.6s
}

@-webkit-keyframes animatezoom {
  from {-webkit-transform: scale(0)}
  to {-webkit-transform: scale(1)}
}

@media screen and (max-width: 600px) {
  table {
    border: 0;
  }

  table caption {
    font-size: 1.3em;
  }

  table thead {
    border: none;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
  }

  table tr {
    border-bottom: 3px solid #ddd;
    display: block;
    margin-bottom: .625em;
  }

  table td {
    border-bottom: 1px solid #ddd;
    display: block;
    font-size: .8em;
    text-align: right;
  }

  table td::before {
    /*
    * aria-label has no advantage, it won't be read inside a table
    content: attr(aria-label);
    */
    content: attr(data-label);
    float: left;
    font-weight: bold;
    text-transform: uppercase;
  }

  table td:last-child {
    border-bottom: 0;
  }

  #center {
    text-align: right;
  }
}

/* general styling */
body {
  font-family: "Open Sans", sans-serif;
  line-height: 1.25;
}