.container-index{
        max-width: 1100px !important;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
}

.sky_bg{
    width:100%;
    min-height:387px;
    float:left;
    animation:opacity 2s 1;
}
.logo{
    z-index:1;
    text-align:center;
    float:left;
	padding-left: 2rem;
    animation:logo .8s 1 cubic-bezier(.18,.89,.32,1.28)
}

.loginpannel{
    width:500px;
    height:41px;
    background-color:#fff;
    border-radius:3px;
    float:right;
    margin-top:30px;
    box-shadow:rgba(0,0,0,.05) 0 2px 0 1px
}
.loginerror{
    width: 500px;
    padding: 10px 10px 0px 35px;
    background-color:red;
    background-color:rgba(255,71,71,.9);
    color:#fff;
    border-radius:3px;
    float:right;
    user-select:none;
	background-repeat:no-repeat;
    margin-top:10px;
    box-shadow:rgba(0,0,0,.05) 0 2px 0 1px
}

.login_error{
	background-image:url(../images/icons/error.png);
	background-position:9px 10px;
	background-color:rgba(255,71,71,.9);
}

.loginerror p{
	font-size: 11px;
}

.loginpannel input#user{
    background-color:transparent;
    border:none;
    border-radius:0;
    outline:none;
    max-width:130px;
    min-width:30px;
    height:32px;
    color:#555;
    float:left;
    font-size:12px;
    margin:3px 0 0 10px;
    background:url(../images/index/player.gif) no-repeat scroll 0 0;
    background-position:3px 6px;
    padding-left:30px;
    box-shadow:none
}
.loginpannel input#pass{
    background-color:transparent;
    border:none;
    border-radius:0;
    outline:none;
    max-width:130px;
    min-width:30px;
    height:32px;
    color:#555;
    float:left;
    font-size:12px;
    margin:3px 0 0 10px;
    background:url(../images/index/iconpass.png) no-repeat scroll 0 0;
    background-position:-2px -2px;
    padding-left:30px;
    box-shadow:none
}
.loginpannel #login_complete{
	background-color: #ffc107;
    max-width:90px;
    min-width:90px;
    height:32px;
    font:700 12px Open Sans,Verdana,Arial;
    color:#fff;
    border:2px solid rgba(255,255,255,.2);
    padding-left:5px;
    border-radius:3px;
    float:right;
    cursor:pointer;
    margin-right:5px;
    margin-top:5px
}

.loginpannel #login_complete:hover{
	background-color: #e8b008;
}

.loginpannel #login_complete { 
	outline: none !important;
}

#description {
    width: 361px;
    height: 90px;
    padding: 13px 0 0 13px;
    color: #fff;
    background-position: 9px 9px;
    background-color: rgba(41,41,41,.8);
    box-shadow: 0 0 20px rgba(0,0,0,.3);
    border-radius: 2px;
}
#description h2 {
    font-size: 12px;
}
#description span {
    font-size: 11px;
}
#description h1 {
    margin-top: 11px;
    font-size: 18px;
}
#joinbutton{
    background:url(../images/index/ph_user.png) no-repeat scroll 0 0 transparent;
    background-position:25px 4px;
    background-color:#74bc1b;
    border:solid 2px #8de421;
    width:355px;
	box-sizing: unset;
	text-decoration:none;
    height:41px;
    border-radius:2px;
    box-shadow:rgba(0,0,0,.3) 0 2px 0 1px;
    text-align:center;
    padding-top:12px;
    font:22px open sans,Verdana,Arial;
    color:#fff;
    cursor:pointer;
    user-select:none;
    animation:shake 1.1s cubic-bezier(.6,-.28,.74,.05) infinite;
    animation-delay:1s
}
#joinbutton:hover{
    background-color:#7fce3e
}
#joinbutton:active{
    background-color:#68aa33;
    border:2px solid #91d64d
}

.clearfix{
    clear:both
}


@keyframes opacity{
    0%,50%{
        opacity:0
    }
    100%{
        opacity:1
    }
}
@keyframes logo{
    0%{
        transform:translateY(-200px)
    }
    100%{
        transform:translateY(0px)
    }
}

@keyframes shake{
    10%{
        transform:translateY(0px)
    }
    20%{
        transform:translateY(-4px)
    }
    30%,50%,70%{
        transform:translateY(0px)
    }
    40%,60%{
        transform:translateY(-2px)
    }
}

@media(max-width:768px){
    .sky_bg{
        background:linear-gradient(rgba(255,255,255,0),rgba(255,255,255,0.7))
    }
    .loginpannel{
        margin-right:5%;
        width:90%;
        display:flex;
        justify-content:space-around
    }
    .loginerror{
        margin-right:5%;
        width:87%
    }

    #description{
        display:none
    }
    #hotelopening{
        margin-top:5%;
        width:90%;
        margin-right:5%
    }
    #joinbutton{
        margin-top:30px;
        margin-right:5%;
        width:90%
    }
    #register-button{
        margin-right:5%;
    }
}