html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px; 
  background: rgba(85, 255, 222, 0.41);
  text-align: center;
}

body > .container { padding: 60px 15px 0; }

.footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 60px;
  background: #ADFF2F;
  border-top: solid 1px #f5f5f5;
  overflow: hidden;
  text-align: center;
  font-family: 'Lobster Two', cursive;
  color: white;
}

.footer > .container {
  padding-right: 15px;
  padding-left: 15px;
}

.navbar-default { 
  background: #DC143C; 
}
.container .text-muted {
  margin: 20px 0;
  text-align: center;
  color: white;
  text-shadow: 1px 2px 3px grey;
}

.footer > .text-muted {
  color: white;
  text-shadow: 1px 2px 3px grey;
}

.footer > ul {
  list-style: none;
  padding-left: 0;
  margin-top: 0.25em;
}

.footer > ul li {
  display: inline-block;
}

.footer ul li a {
  color: white;
  text-shadow: 1px 2px 3px grey;
  padding: 0 1em;
}

.footer ul li:not(:last-child) {
  border-right: 1px solid white;
}

/** CARRUSEL **/
.carousel-inner .item img { width: 100%; }

.container .carousel-indicators .active { background-color: lime; }

.container .carousel-indicators li { border: 1px solid orange; }

.carousel .glyphicon-chevron-right,
.carousel .glyphicon-chevron-left {
  color: lime;
  background: orange;
  border-radius: 5px;
}

/**MENU**/


.navbar-header .navbar-brand,
.navbar-header .navbar-brand:hover,
.navbar-default .navbar-nav > li a { 
  color: white; 
  text-shadow: 1px 2px 3px grey; 
}

.navbar-default .navbar-nav > li a:hover { 
  color: white; 
  text-shadow: 1px 2px 3px #BA55D3;; 
  background: rgba(0,0,0, 0.1); 
}

.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:focus,
.navbar-default .navbar-nav > .active > a:hover { 
  background: #BA55D3; 
  color: white; 
  text-shadow: 1px 2px 3px #BA55D3;
}

.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:focus,
.navbar-default .navbar-nav > .open > a:hover { 
  background: #BA55D3;
}

.navbar-nav > li > .dropdown-menu { 
  background: #FF6347;
}

.dropdown-menu > li > a:hover { 
  background: #BA55D3;
}

.page-header { 
  border-bottom-color: #FF6347; 
  color: #FF6347; 
  text-shadow: 1px 2px 3px green; 
}

.navbar-default .navbar-toggle { 
  border-color: white; 
}

.navbar-default .navbar-toggle .icon-bar { 
  background: white;
}

.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open >a:focus,
.navbar-default .navbar-nav > .open >a:hover { 
  color: white; 
}

.navbar-default .navbar-nav .open .dropdown-menu>li>a { 
  color: white; 
}
.navbar-default .navbar-nav .open .dropdown-menu>li>a:hover { 
  color: white; 
  background:#9ACD32;
}



/** PUZEZLE **/
.puzzle {
  user-select: none;          
  -webkit-touch-callout: none; 
  -webkit-tap-highlight-color: rgba(0,0,0,0); 
  -webkit-tap-highlight-color: transparent;   

  margin: 0;
  padding: 0;
}

#sortable { 
  list-style-type: none;
  margin: auto;
  padding-left: 0;
  max-width: 580px;
}

#sortable li { 
  float: left; 
  width: 33.33333%; 
}

#sortable li img {
  vertical-align: bottom;
  width: 100%; 
  height: auto;
}

/* landscape: anchura es máxima altura */
@media ( orientation:landscape ) {
  #sortable { width: 100vh; }

}

/* portrait: se adapta al máximo ancho */
@media ( orientation:portrait ) {
 
  #sortable { width: 100%; }
 
}


@font-face {
  font-family: 'Lobster Two';
  src:
    url('../fonts/LobsterTwo/LobsterTwo-Regular.eot')   format('embedded-opentype'),
    url('../fonts/LobsterTwo/LobsterTwo-Regular.woff2') format('woff2'),
    url('../fonts/LobsterTwo/LobsterTwo-Regular.woff')  format('woff'),
    url('../fonts/LobsterTwo/LobsterTwo-Regular.ttf')   format('truetype'),
    url('../fonts/LobsterTwo/LobsterTwo-Regular.svg')   format('svg');
}

@font-face {
  font-family: 'VT323';
  src:
    url('../fonts/VT323/VT323.eot')   format('embedded-opentype'),
    url('../fonts/VT323/VT323.woff2') format('woff2'),
    url('../fonts/VT323/VT323.woff')  format('woff'),
    url('../fonts/VT323/VT323.ttf')   format('truetype'),
    url('../fonts/VT323/VT323.svg')   format('svg');
}