body {

  font-family: Lato, Arial, sans-serif;

}



/* LOGIN */



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

  #logo-reclamos {

    height: 275px;

  }

  #footer-reclamos {

    height: 100px;

  }

}



.login-banner {

  background: #33a6dd;

  color: white;

  text-align: center;


}



#login-container {

  margin: 0 auto;

  text-align: center;

  width: 30%;

  margin-top: 45px;

  margin-bottom: 45px;

  background: #eee;

  border: 2px solid #33a6dd;

  border-radius: 6px;

}



#login-header {

  background: #33a6dd;

  color: white;

  padding: 5px;

}



#login-img-mobile {

  display: none;

}



#login-content {

  padding: 10px;

}



.login-field {

  text-align: left;

}



.login-field input {

  width: 100%;

  height: 25px;

  border: 1px solid #aaa;

  border-radius: 6px;

  font-size: 14px;

  margin-top: 5px;

}



#login_btn:hover {

  background: #33a6dd;

}



#login-img {

  width: 100%;

  height: 200px;

}



@media screen and (max-width: 768px) {

  #login-container {

    width: 90%;

  }

  #login-img {

    display: none;

  }

  #login-img-mobile {

    display: block;

    width: 100%;

  }

}



/* NAVBAR */

.navbar-default {

  font-size: 1.15em;

  font-weight: 400;

  background-color: #111;

  background-image: none;

  border: 0px;

  border-radius: 0px;

  margin-bottom: 0;

}



.navbar-default .navbar-nav > li > a {

  color: white;

}



.navbar-default .navbar-nav > li > a:hover {

  color: white;

  background-color: #333;

}



.navbar-default .navbar-nav > li > a > span,

.navbar-default .navbar-nav .open .dropdown-menu > li > a > span {

  padding-left: 5px;

}



.navbar-default .navbar-brand {

  padding: 0 15px;

}



.navbar-default .navbar-brand img {

  width: 150px;

}



.navbar-default .navbar-brand:hover {

  color: #ffffff;

  text-shadow: 1px -1px 8px #b3e9ff;

}



.navbar-default .navbar-nav > .open > a,

.navbar-default .navbar-nav > .open > a:hover,

.navbar-default .navbar-nav > .open > a:focus {

  background-color: #333;

  color: white;

  background-image: none;

}



.navbar-default .navbar-toggle {

  border: none;

}



.navbar-default .navbar-collapse,

.navbar-default .navbar-form {

  border: none;

}



.navbar-default .navbar-toggle:hover,

.navbar-default .navbar-toggle:focus {

  background-color: #333;

}



.navbar-default .navbar-toggle .icon-bar {

  background-color: #ffffff;

}



.dropdown-menu {

  background-color: #ddd;

  color: #111;

  border: 0px;

  border-radius: 2px;

}



.dropdown-menu > li > a {

  background-color: #ddd;

  color: #111;

  padding-top: 10px;

  padding-bottom: 10px;

}



.dropdown-menu > li > a:hover,

.dropdown-menu > li > a:focus {

  background-color: #000000;

  color: white;

}



.dropdown-menu .divider {

  height: 1px;

  margin: 9px 0;

  overflow: hidden;

  background-color: #003246;

}



.navbar-default .navbar-nav .open .dropdown-menu > li > a {

  color: #111;

  font-size: 1.1em;

}



@media (max-width: 767px) {

  .dropdown-menu > li > a {

    background-color: #111;

    color: #ffffff;

  }

  .dropdown-menu > li > a:hover {

    color: #ffffff;

  }



  .navbar-default .navbar-nav .open .dropdown-menu > li > a {

    color: #fff;

  }



  .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus,

  .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover {

    color: #ffffff;

    background-color: #222;

  }



  .dropdown-menu .divider {

    height: 1px;

    margin: 9px 0;

    overflow: hidden;

    background-color: #005577;

  }

}



/* TABLAS */



.container {

  width: 100%;

  padding-left: 5px;

  padding-right: 5px;

}



#combustibles_reg,

#tipos-reclamos {

  margin-top: 10px;

  font-size: 13px;

}



th,

td {

  padding: 10px;

}



#combustibles_reg th,

#tipos-reclamos th {

  background-color: #33a6dd;

  color: white;

}



.table > thead:first-child > tr:first-child > th {

  background-color: #33a6dd;

  color: white;

}



.table > tbody > tr > td,

.table > tbody > tr > th,

.table > thead > tr > td,

.table > thead > tr > th {

  padding: 4px;

  vertical-align: middle;

}



.td_center {

  text-align: center;

}



/* FORMULARIOS */

#login_btn {

  background: black;

  color: white;

  border: none;

  padding: 10px;

  cursor: pointer;

}



.form-control {

  text-transform: uppercase;

}



.password-form {

  width: 50%;

  margin: 0 auto;

  margin-top: 40px;

}



.form_header{

  border-bottom: 1px solid #33a6dd;

  margin-bottom: 1.5rem;

}



@media (max-width: 860px) {

  .password-form {

    width: 100% !important;

  }

}



/* FILTROS */

#filter_container {

  padding-top: 5px;

  margin-top: 5px;

  background: #f5f5f5;

  border: 1px solid #ccc;

  border-radius: 8px;

}



.filter_field {

  display: inline-block;

  width: 235px;

  padding-bottom: 5px;

}



.filter_field label {

  padding-right: 4px;

  width: 80px;

  text-align: right;

}



.filter_field select,

.filter_field input {

  width: 150px;

}



#add,

#excel,

#print,

#pdf {

  font-size: 14px;

}



.detail {

  border: 1px solid #aaa;

}



#filtro_desde,

#filtro_hasta {

  width: 150px;

}



.filter-control {

  height: 26px;

  padding: 4px 6px;

  font-size: 13px;

  line-height: 1.42857143;

  color: #555;

  background-color: #fff;

  background-image: none;

  border: 1px solid #ccc;

  border-radius: 4px;

  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);

  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);

  -webkit-transition: border-color ease-in-out 0.15s,

    -webkit-box-shadow ease-in-out 0.15s;

  -o-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;

  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;

}



/* FOOTER */

.footer {

  color: #ddd;

  margin-top: 30px;

}



.footer-top {

  padding: 25px 10px;

  background: #222;

}



.footer-bottom {

  padding: 10px;

  background: #1a1a1a;

  color: #888;

}



.footer-row {

  display: flex;

  justify-content: center;

  align-items: center;

  text-align: center;

}



@media screen and (max-width: 768px) {

  .footer-row {

    display: inherit;

  }

  .footer-row .col-md-6 {

    padding: 10px 0;

  }

}



/* SOBRESCRIBIR CSS BOOTSTRAP */

.select2-container {

  width: 100% !important;

}



.modal-header,

.modal-body,

.modal-footer {

  padding: 8px;

}



.form-group {

  margin-bottom: 8px;

}



@media (min-width: 768px) {

  .modal-dialog {

    width: 768px;

  }

}

