/* CSS de la Página - Diablitas */

/*
    1. FUENTES
    2. MENÚ
    3. GENERAL
    4. ESPECÍFICOS
    4. RESPONSIVO
    5. INDEX
*/

/* ---- FUENTES ---- */
.roboto-font {
  font-family: 'Roboto Condensed', sans-serif;
}

.dosis-font {
  font-family: 'Dosis', sans-serif;
}


/* ---- MENÚ ---- */
.navbar-brand img {
  height: 40px;
}

.navbar-toggle .icon-bar:nth-of-type(3) {
  top: 1px;
}

.navbar-toggle .icon-bar:nth-of-type(4) {
  top: 2px;
}

.navbar-toggle .icon-bar {
      position: relative;
      transition: all 200ms ease-in-out;
}

.navbar-toggle.active .icon-bar:nth-of-type(2) {
      top: 6px;
      transform: rotate(45deg);
}

.navbar-toggle.active .icon-bar:nth-of-type(3) {
      background-color: transparent;
}

.navbar-toggle.active .icon-bar:nth-of-type(4) {
      top: -6px;
      transform: rotate(-45deg);
}


/* ---- GENERAL ---- */

body {
  background-color: #000;
  padding-top: 60px;
  padding-bottom: 20px;
  font-size: 17px;
  font-family: 'Roboto Condensed', sans-serif;
}

section {
    padding-top:25px;
    padding-bottom:50px;
    overflow: hidden;
}

p {
  font-family: 'Dosis', sans-serif;
}

h1 {
  font-size: 40px;
  line-height: 1.3;
}

footer {
    color: #888;
    font-size: 14px;
} 

footer a {
  color: #888;
  text-decoration: underline;
  margin: 50px 0px;
}

footer p {
  font-size: 11px;
}

footer img {
  margin: 15px 0px;
  height: 40px;
}

footer .footer-above {
  padding: 30px 0px 15px 0px;
  border-top: 7px #f93f55 solid;
}

footer .footer-below {
  padding: 0px 0px 5px 0px;
}

.bg-white {
  background-color: #fff;
}

.bg-gray {
  background-color: #f6f6f6;
}

.bg-pink {
  background-color: #f93f55;
}

.btn-rosa {
  background-color: #f93f55;
  margin: 10px 15px;
  color: #fff;
  border-radius: 0px;
}

.btn-rosa:hover,
.btn-rosa:focus,
.btn-rosa:active {
  background-color: #6e353b;
  color: #fff;
}

.btn-blanco {
  display: inline-block;
  background-color: #fff;
  margin: 10px 15px;
  color: #111;
  border: 1px solid #ddd;
  border-radius: 0px;
}

.btn-blanco:hover,
.btn-blanco:focus,
.btn-blanco:active {
  background-color: #eee;
}

/* ---- ESPECÍFICOS ---- */
.tarjetas {
  padding: 10px 10px;
  margin: 0px 0px 10px 0px;
  text-decoration: underline;
}

.index-tarjetas {
  margin: 20px 0px;
  padding: 0px 35px;
}

.index-tarjetas i {
  font-size: 30px;
}

.diablitas-pattern {
  background-image: url('../img/diablitas-pattern.png');
  background-repeat: repeat;
}

.diablitas-pattern-pink {
  background-image: url('../img/diablitas-pattern-pink.png');
  background-repeat: repeat;
}

.construction {
  position: absolute;
  color: #fff;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%,-50%);
  -moz-transform: translate(-50%,-50%);
  -ms-transform: translate(-50%,-50%);
  -o-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
}

.construction img {
  max-height: 150px;
}

.construction a {
  color: #fff;
  font-size: 30px;
}

.avisos a {
  text-decoration: underline;
}
/* ---- INDEX ---- */


.block-border {
  border-right: 2px #ddd solid;
}

.banner {
  width: 100%;
  height: 100%;
  height: calc(100%-1px);
  background-image: url('../img/Skate_Park.jpg');
  color:#fff;
  background-size:cover;
  font-size: 60px;
}


.center-block img {
  display: block;
  margin-left: auto;
  margin-right: auto;
}







.contact {
  background-color: #FFF;
  color: #666;
  font-size: 14px;
  line-height: 2.2;
}

.contact a, .contact a:hover, .contact a:focus {
  color: #555;
}



.box {
  display: inline-block;
  background-color: rgba(0,0,0,.8);
  padding-bottom: 10px;
  margin-bottom: 30px;
}

.instagram {
  background-color: #111;
}




.img-responsive {
  margin: 0 auto;
}

.res img {
  max-width: 100%;
}

li.social-icon a {
  float: left;
}



header .list-inline .btn-social {
    border:2px solid #202020;
    color: #202020;
}

.btn-social {
    padding-bottom: 8px;
    text-align: center;
    font-size: 17px;
}