body{

  background: -webkit-linear-gradient(90deg, #f46b45 10%, #eea849 90%); /* Chrome 10+, Saf5.1+ */
  background:    -moz-linear-gradient(90deg, #f46b45 10%, #eea849 90%); /* FF3.6+ */
  background:     -ms-linear-gradient(90deg, #f46b45 10%, #eea849 90%); /* IE10 */
  background:      -o-linear-gradient(90deg, #f46b45 10%, #eea849 90%); /* Opera 11.10+ */
  background:         linear-gradient(90deg, #f46b45 10%, #eea849 90%); /* W3C */

}


/*
  Bootstrap overrides
*/

.navbar-default {
    background-color: #f8f8f8;
    background: transparent;
    border-color: transparent;
}

.navbar-default .navbar-brand,.navbar-default .navbar-brand:focus, .navbar-default .navbar-brand:hover , .navbar-default .navbar-nav>li>a, .navbar-default .navbar-brand, .navbar-default .navbar-nav>li>a, .navbar-default .navbar-nav>li>a:focus, .navbar-default .navbar-nav>li>a:hover {
    color: #fff;
}

/*
  Custom font colors
*/
.text-white{
  color: #ffffff;
}

/*
  Custom button colors
*/

.btn-transparent{
  background-color: transparent;
  border-color: white;
}

.btn-orange{
  background-color: #ff7043;
  border: #ff7043;
  color: #fff;
}

.btn-yellow{
  background-color: #ffff00;
  border: #ffff00;
  color: #000;
}

#homeHeader{
  margin-top: 5em;
}
#homeHeader h1{
  font-size: 6em;
}

#homeHeader img{
  max-height: 160px;
}


#pokemonWrap{
  margin-bottom: 32px;
}

#pokemonWrap img, #pokemonAnswerWrap img{
  max-height: 200px;
}

#controls input{
  margin-bottom: 12px;
}


#background {
    position: fixed;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: -100;
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    /*background: url(polina.jpg) no-repeat;*/
    background-size: cover;
}

.vcenter {
    display: inline-block;
    vertical-align: middle;
    float: none;
}


#imgLose{
  margin-bottom: 32px;
}
/* #####################################################################
   #
   #   Project       : Modal Login with jQuery Effects
   #   Author        : Rodrigo Amarante (rodrigockamarante)
   #   Version       : 1.0
   #   Created       : 07/28/2015
   #   Last Change   : 08/02/2015
   #
   ##################################################################### */

@import url(http://fonts.googleapis.com/css?family=Roboto);

* {
    font-family: 'Roboto', sans-serif;
}

#login-modal .modal-dialog {
    width: 350px;
}

#login-modal input[type=text], input[type=password] {
	margin-top: 10px;
}

#div-login-msg,
#div-lost-msg,
#div-register-msg {
    border: 1px solid #dadfe1;
    height: 30px;
    line-height: 28px;
    transition: all ease-in-out 500ms;
}

#div-login-msg.success,
#div-lost-msg.success,
#div-register-msg.success {
    border: 1px solid #68c3a3;
    background-color: #c8f7c5;
}

#div-login-msg.error,
#div-lost-msg.error,
#div-register-msg.error {
    border: 1px solid #eb575b;
    background-color: #ffcad1;
}

#icon-login-msg,
#icon-lost-msg,
#icon-register-msg {
    width: 30px;
    float: left;
    line-height: 28px;
    text-align: center;
    background-color: none;
    margin-right: 5px;
    transition: all ease-in-out 500ms;
}

#icon-login-msg.success,
#icon-lost-msg.success,
#icon-register-msg.success {
    background-color: #68c3a3 !important;
}

#icon-login-msg.error,
#icon-lost-msg.error,
#icon-register-msg.error {
    background-color: #eb575b !important;
}

#img_logo {
    max-height: 100px;
    max-width: 100px;
}

/* #########################################
   #    override the bootstrap configs     #
   ######################################### */

.modal-backdrop.in {
    filter: alpha(opacity=50);
    opacity: .8;
}

.modal-content {
    background-color: #757575;
    border: 1px solid #616161;
    border-radius: 0px;
    outline: 0;
}

.modal-header {
    min-height: 16.43px;
    padding: 15px 15px 15px 15px;
    border-bottom: 0px;
}

.modal-body {
    position: relative;
    padding: 5px 15px 5px 15px;
}

.modal-footer {
    padding: 15px 15px 15px 15px;
    text-align: left;
    border-top: 0px;
}

.checkbox {
    margin-bottom: 0px;
}

.btn {
    border-radius: 0px;
}

.btn:focus,
.btn:active:focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn.active.focus {
    outline: none;
}

.btn-lg, .btn-group-lg>.btn {
    border-radius: 0px;
}

.btn-link {
    padding: 5px 10px 0px 0px;
    color: #95a5a6;
}

.btn-link:hover, .btn-link:focus {
    color: #2c3e50;
    text-decoration: none;
}

.glyphicon {
    top: 0px;
}

.form-control {
  border-radius: 0px;
}