/*Hoja de estilo para modificaciones del MIRAGE 2 de la UTP Panamá
* Modificado por Luis Mendoza, Universidad Tecnológica de Panama, 2017
    ___     -._
            `-. """--._ `-.
               `.      "-. `.
 _____           `.       `. \       C H I B I - G O K U
`-.   """---.._    \        `.\
   `-.         "-.  \         `\
      `.          `-.\          \_.-""""""""--._
        `.           `                          "-.
          `.                                       `.    __....-------...
--..._      \                                       `--"""""""""""---..._
__...._"_-.. \                       _,                             _..-""
`-.      """--`           /       ,-'/|     ,                   _.-"
   `-.                 , /|     ,'  / |   ,'|    ,|        _..-"
      `.              /|| |    /   / |  ,'  |  ,' /        ----"""""""""_`-
        `.            ( \  \      |  | /   | ,'  //                 _.-"
          `.        .'-\/'""\ |  '  | /  .-/'"`\' //            _.-"
    /'`.____`-.  ,'"\  ''''?-.V`.   |/ .'..-P''''  /"`.     _.-"
   '(   `.-._""  ||(?|    /'   >.\  ' /.<   `\    |P)||_..-"___.....---
     `.   `. "-._ \ ('   |     `8      8'     |   `) /"""""    _".""
       `.   `.   `.`.b|   `.__            __.'   |d.'  __...--""
         `.   `.   ".`-  .---      ,-.     ---.  -'.-""
           `.   `.   ""|      -._      _.-      |""
             `.  .-"`.  `.       `""""'       ,'
               `/     `.. ""--..__    __..--""
                `.      /7.--|    """"    |--.__
                  ..--"| (  /'            `\  ` ""--..
               .-"      \\  |""--.    .--""|          "-.
              <.         \\  `.    -.    ,'       ,'     >
             (P'`.        `%,  `.      ,'        /,' .-"'?)
             P    `. \      `%,  `.  ,'         /' .'     \
            | --"  _\||       `%,  `'          /.-'   .    )
            |       `-.""--..   `%..--"""\\"--.'       "-  |
            \          `.  .--"""  "\.\.\ \\.'       )     |
*/

*::-moz-selection{ /*subrayado para mozilla*/
    color: #FFF;
    background: none repeat scroll 0% 0% #B2D5E1;
}
::selection { /*subrayado para los demás. No se por qué no me dejó poner la istrcción junto a la de moz*/
    color: #FFF;
    background: none repeat scroll 0% 0% #B2D5E1;
}
.word-break {
    word-break: normal;
    -moz-hyphens: auto;
}
/*Color de los 3 diferentes titulos*/
h1, .h1, h2, .h2, h3, .h3 {color: #0E577B }

/* Colores para el hipervinculo y el efecto hover del mismo*/
a {color: #4790AD;}
a:hover {color: #4790AD;}
/*Marca el mismo azul que los h1, h2, h3 cuando el enlace es visitado en la pág. inicial*/
.main-content a:visited {color: #0E577B;}

/* Fondo nav enlaces */
#ridda2{
    background-color: #013968;    
    height: 50px;
    margin-right: auto;
    margin-left: auto;
    padding-left: 15px;
    padding-right: 15px;
}

/*Alto para el navbar, esta clase se repite en varios div del encabezado*/
.navbar-header{
  height: 70px;
}
/*Color de fondo de la navegación*/
header .navbar-default,
.navbar-inverse {
    background-color: #144E7E;
}

/* Desacta los colores a los enlaces estaticos */
header .navbar-default .navbar-nav:hover, 
header .navbar-default .navbar-nav:focus{
  color: transparent;
  background: transparent;
}

/* Da transparencia a los enlaces del nav */
header .navbar-default .navbar-nav>li>a:hover {
    background-color: #073F6D;  
}

/* CSS para logo del ridda en el nav */
header .navbar-brand img{
  height: 40px;
}

/* Media Query para el nav*/
@media (max-width: 767px){
  .navbar-header{
    height: 100%;
  }
  header .navbar-brand img{
    height: 30px;
  }
}

header .navbar-default .navbar-toggle:hover, 
header .navbar-default .navbar-toggle:focus{
  background-color: rgba(0, 56, 102, 0.27);  
}

/* Fondo de los breadcumbs */
.trail-wrapper {
    background-color: #4791ae;
    border-bottom: 1px solid #8BBBCB;
}
.trail-wrapper a{
  color: #585857;
}
/* Cambio a botones y list group*/
.btn-primary{
  background-color: #144E7E;
  border-color: #0E577B; /* Variante más oscura del color superior */
}

.btn-primary:hover, 
.btn-primary:focus, 
.btn-primary.focus, 
.btn-primary:active, 
.btn-primary.active, 
.open>.btn-primary.dropdown-toggle{
  background-color: #144E7E;
  border-color: #116691;
}

.list-group-item.active, 
.list-group-item.active:hover, 
.list-group-item.active:focus{
  background-color: #144E7E;
  border-color: #0E577B;
}

/* Css para paginacion */
.pagination>li>a, .pagination>li>span {
    color: #144E7E;
}

/* CSS para la paginación cuando esté activo */
.pagination>.active>a, 
.pagination>.active>a:hover, 
.pagination>.active>a:focus, 
.pagination>.active>span, 
.pagination>.active>span:hover, 
.pagination>.active>span:focus{
    background-color: #144E7E;
    border-color: #116691;
    color: #fff;
}

/* Clases para footer*/
.creditos > div {
    padding-top: 0 !important;
    margin-bottom: 10px;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

.creditos > div > a {
    margin: 5px 3%;
}

.creditos > div > a > img {
  max-height: 50px;
}

footer .footer-links{
  padding-top: 0px !important;
  border-top: 1px solid #eee;
  z-index: 120;
  position: relative;
}

footer ul{
  display: table-cell;
  width: 50%;
  position: relative;
  text-align: left;
  padding-bottom: 20px;
}

@media (max-width: 667px){
  footer ul {
    width: 100%;
    position: relative;
    text-align: left;
    float: left;
    padding-bottom: 10px;
    padding-right: 8px;
  }
}

footer ul li:first-of-type{
  list-style: none;
  margin-left: -1em;
}

.fb, .twitter{
  list-style: none;
}

.fb span, .twitter span{
  display: none;
}

.fb a{
  background: transparent url("/static/utp/facebook.png") no-repeat scroll left top;
  height: 32px;
  width: 32px;
  float: left;
  margin-right: 5px;
}

.twitter a{
  background: transparent url("/static/utp/twitter.png") no-repeat scroll left top;
  height: 32px;
  width: 32px;
  float: left;
  margin-right: 5px;
}


/* nuevos css  añadidos 29-01-2020  */

.nombre {
    display: inline-block;
    color: #bcd9f3;
    font-size: 1.9rem;
    font-family: arial;
    font-weight: normal;
    padding-left: 20px;
    margin: 0px;
    margin-left: 13px;
    margin-top: 5px;
    border-left: 1px solid #6094c3;
}

/*  (min-width: 768px)   */
.container>.navbar-header, .container>.navbar-collapse, .container-fluid>.navbar-header, .container-fluid>.navbar-collapse {
    margin-right: 0;
    margin-left: 0;
    margin-top: 38px;
    margin-bottom: 38px;
}

#ridda2 .navbar-nav>li>a {
    padding-top: 8px;
    padding-bottom: 8px;
}

#ridda2 {
   /* background-color: #013968;*/
  background-color: rgba(5,42,75,0.85);
    height: 35px;
    margin-right: auto;
    margin-left: auto;
    padding-left: 15px;
    padding-right: 15px;
}

header .navbar-default .navbar-nav>li>a {
    color: #bcd9f3;
}

.trail-wrapper {
    background-color: #c1eaf9;
    border-bottom: 1px solid #d1f1fd;
    color: #585857;
}


header .navbar-default, .navbar-inverse {
    background-color: #144E7E;
    background-image: url(/static/utp/banner.jpg);
    background-repeat: no-repeat;
    background-position: center 0px;
}

.navbar-header.pull-right.hidden-xs {
    margin-top: -2px;
    background-color: rgba(5,42,75,0.85);
    padding: 0px;
    height: 56px;
    border-radius: 0px 0px 15px 15px;
}



/* media queries */
@media (max-width: 650px){
   .nombre {
    display: inline-block;
    color: #bcd9f3;
    font-size: 1.5rem;
    font-family: arial;
    font-weight: normal;
    padding-left: 0px;
    margin: 0px;
    margin-left: 15px;
    margin-top: 5px;
    border-left: 0px solid #6094c3;
  }
}


.community-browser-wrapper {
    max-width: 96%;
}