
/* FOOTER */

.bg-footer{
    background-color: #000000;
    padding-top: 70px;
    padding-bottom: 70px;
}



/* PANTALLA GAMEOVER */

.game-over-content{
    padding: 20px;
    margin: 20px;
    height: 640px;
}
.game-over-bg{
    background-image: url("../img/web/prota-gameover.png");
    background-size: cover;
    background-position: center;
    text-align: center;
    height: 640px;

}
.results{
    font-family: 'Rock Salt';
    font-size: 40px;
    color: #ffffff;
    padding-bottom: 10px;
}

.label {
    color: white;
    font-size: 20px;
    font-family: 'Rock Salt';
    margin: 5px 5px;
}

#info {
    color: white;
}





/* PANTALLA LEVEL SELECTOR */
.level-hell-container{
    background-color: #000000;
    background-image: url("../img/web/fondo-infierno.png");
    background-size: cover;
    background-position: center;
    text-align: center;
    padding-top: 50px;
    margin-bottom: 10px; 
    height: 320px;
}
.level-purgatory-container{
    background-color: #000000;
    background-image: url("../img/web/fondo-purgatorio.png");
    background-size: cover;
    background-position: center;
    text-align: center;
    padding-top: 50px;
    margin-bottom: 10px; 
    height: 320px;
}
.level-paradiso-container{
    background-color: #000000;
    background-image: url("../img/web/fondo-paradiso.png");
    background-size: cover;
    background-position: center;
    text-align: center;
    padding-top: 50px;
    margin-bottom: 10px; 
    height: 320px;
}






/* PANTALLA CREDITOS */ 

.content-follower-block {
    background-color: #ffffff;
    border-radius: 15px;
    padding: 15px 20px;
    margin: 20px 0px 30px 10px;
	word-wrap: break-word;
}
.profile-follower-avatar {
    position: relative;
    left: calc(50% - 75px);
    width: 150px;
    height: 150px;
    border: solid 10px #ffffff;
    border-radius: 15px;
}

.profile-follower-username {
    word-wrap: break-word;
    text-align: center;
    font-size: 20px;
    font-weight: bold;
}

.profile-follower-bio {
    color: #303030;
}

.bck-color-follower-profile {
    background: #9c9e9f;
    /* Old browsers */
    background: -moz-linear-gradient(top, #9c9e9f 0%, #9c9e9f 40%, #f6f6f6 40%, #f6f6f6 100%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, right top, color-stop(0%, #9c9e9f), color-stop(40%, #9c9e9f), color-stop(50%, #f6f6f6), color-stop(100%, #f6f6f6));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #9c9e9f 0%, #9c9e9f 40%, #f6f6f6 40%, #f6f6f6 100%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #9c9e9f 0%, #9c9e9f 40%, #f6f6f6 40%, #f6f6f6 100%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #9c9e9f 0%, #9c9e9f 40%, #f6f6f6 40%, #f6f6f6 100%);
    /* IE10+ */
    background: linear-gradient(to bottom, #9c9e9f 0%, #9c9e9f 40%, #f6f6f6 40%, #f6f6f6 100%);
    /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9c9e9f', endColorstr='#f6f6f6', GradientType=1);
    /* IE6-9 */
  }









  
/* PAGINA PRINCIPAL */


.points-num {
    font-size: 40px;
    font-weight: bolder;
    float: right;
    padding: 0px 20px;
    color: #ff00bf;
    text-shadow:2px 2px 0 #303030;
}











/* PAGINA PRINCIPAL */

.navbar {
    border-radius: 0px;
    margin-bottom: 0px;
    font-size: 18px;
}

.navbar .btn-outline {
    margin-top: 8px;
    margin-left: 10px;
}

.navbar-brand {
    font-size: 20px;
}

.btn-outline {
    background-color: transparent;
    border: 1px solid #000000;
    color: #afafaf;
}

.btn-outline:hover {
    background-color: #ffffff25;
    color: #ffffff;
}

.glyphicon {
    font-size: 90%;
    /* Los iconos quedan feos si son del mismo tamaño que la letra asi que los reducimos un poco */
}

.glyphicon-tags {
    font-size: 80%;
    /* Este icono es mas grande por alguna razon y queda mal solo al 90% */
}

.jumbotron {
    background-color: #000000;
    background-image: url("../img/web/header.png");
    background-size: cover;
    background-position-y: 45%;
    text-align: center;
    height: 350px;
    padding-top: 200px;
    margin-bottom: 10px;
}

@media screen and (max-width: 490px) {
    .jumbotron {
        padding-top:50px;
    }
  }


.btn-main {
    font-family: 'Rock Salt';
    font-weight: bolder;
    color: #ffffff;
    background-color: #ff00bf;
    box-shadow: 0px 0px 20px black;
    font-size: 30px;
    padding: 15px 35px;
    margin: 20px;
}

.btn-main:hover {
    color: #ffffff;
    background-color: #303030;
    animation: btn-text 0.75s linear 0s infinite normal;
}

@keyframes btn-text {
    0% {
        text-shadow: -3px -3px 0 #ffffff, 4px -2px 0 #ff00bf;
    }
    25% {
        text-shadow: -3px 3px 0 #ffffff, 0px 0px 0 #ff00bf;
    }
    50% {
        text-shadow: 3px -1px 0 #ffffff, -4px -4px 0 #ff00bf;
    }
    75% {
        text-shadow: 0px 0px 0 #ffffff, -2px 4px 0 #ff00bf;
    }
    100% {
        text-shadow: -3px -3px 0 #ffffff, 4px -2px 0 #ff00bf;
    }
}

.main-container {
    padding: 0px 40px;
}

.content-block {
    background-color: #ffffff;
    border-radius: 15px;
    padding: 15px 40px;
    margin: 20px 10px 30px 10px;
	word-wrap: break-word;
}

.profile-avatar {
    position: relative;
    left: calc(50% - 100px);
    margin-top: -100px;
    width: 200px;
    height: 200px;
    border: solid 10px #ffffff;
    border-radius: 15px;
}

@media screen and (max-width: 1200px) {
    .profile-avatar {
    margin-top: -80px;
    }
  }


.profile-username {
    font-size: 26px;
    font-weight: bold;
}

.profile-bio {
    color: #303030;
}

.tweet-author {
    margin-bottom: 8px;
}

.tweet-author img {
    height: 50px;
    width: 50px;
    margin: 0px 10px 0px -15px;
    border-radius: 100%;
    vertical-align: bottom;
}

.tweet-author span {
    font-weight: bold;
}

.tweet-content {
    background-color: #dfe8f3;
    border-radius: 10px;
    padding: 15px 20px;
}

.tweet-multimedia {
    margin: 10px;
}

.tweet-multimedia img {
    max-height: 500px;
    width: 100%;
}

.tweet-multimedia .tags {
    margin: 10px 0px 0px 10px;
    padding: 3px 10px;
    display: inline-block;
    background-color: #303030;
    border-radius: 15px;
    color: #afafaf;
}

.tweet-feedback {
    padding: 10px;
    color: #91a1b6;
}

.rts {
    color: #05e2b2;
}

.likes {
    color: #ff9100;
}

.feedback-num {
    font-weight: bold;
}

.follower {
    margin-bottom: 10px;
}

.follower img {
    height: 100px;
    width: 100px;
    vertical-align: bottom;
    display: inline-block;
    border-radius: 100%;
}

.follower-bio {
    display: inline-block;
    width: calc(100% - 120px);
    margin-left: 10px;
}

.follower-bio span {
    font-weight: bold;
}

body {
    background-color: #303030;
    font-size: 18px;
}