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

@font-face {
	src: url('../fonts/bobbaRp.otf');
	font-family: 'BobbaRP';
}

body {
	background: url(../images/hotel_views.png) no-repeat right bottom, linear-gradient(to bottom, #ffffff, #ffffff);
	background-attachment: fixed;
	margin: 0;
	padding: 0;
	min-height: 100vh;
}

.clearfix {
	clear: both;
}

#alertJs {
	width: calc(100% - 30px);
	color: #FFF;
	padding: 15px;
	text-align: center;
	border-bottom: 2px solid #FFF;
	font-family: 'Oswald';
    text-transform: uppercase;
	display: none;
}

#alertJs.error {
	background: linear-gradient(to bottom, #a7130f, #490907);
}

#alertJs.success {
	   background: linear-gradient(to bottom, #427130, #2d4d21);
}

#global {
	width: 500px;
	padding: 20px;
	padding-top: 40px;
	padding-bottom: 40px;
	margin-left: 10%;
}

hr {
	height: 0; 
	border: 0; 
	border-top: 3px solid rgba(0, 0, 0, 0.8); 
}

#global .header {
	width: auto;
	margin-bottom: 20px;
}

#global .header .logo {
	width: 300px;
	float: left;
}

#global .header .online {
	color: #FFF;
	background-color: rgba(0, 0, 0, 0.6);
	padding: 15px 25px;
	font-family: 'Oswald';
	float: right;
	font-size: 18px;
	margin-top: 15px;
	margin-left: 20px;
	position: relative;
}

#global .header .online:after {
	right: 100%;
	top: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(136, 183, 213, 0);
	border-right-color: rgba(0, 0, 0, 0.6);
	border-width: 10px;
	margin-top: -10px;
}

#global h1 {
    font-family: 'Oswald';
	text-transform: uppercase;
    line-height: 1.5em;
    color: #d0d0d0;
    font-size: 26px;
	font-weight: normal;
	margin-bottom: 25px;
}

#global .login {
	background-color: rgba(0, 0, 0, .5);
	padding: 10px;
	position: relative;
}

#global .login:after {
	bottom: 100%;
	left: 20%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(136, 183, 213, 0);
	border-bottom-color: rgba(0, 0, 0, .5);
	border-width: 20px;
	margin-left: -20px;
}

#global .login img {
	position: absolute;
	margin-top: -40px;
	margin-left: 400px;
-webkit-filter: drop-shadow(2px 2px 0 white)
		drop-shadow(-2px 2px 0 white)
		drop-shadow(2px -2px 0 white)
      		drop-shadow(-2px -2px 0 white);

	filter: drop-shadow(2px 2px 0 white) 
		drop-shadow(-2px 2px 0 white)
		drop-shadow(2px -2px 0 white)
       		drop-shadow(-2px -2px 0 white);
}


#global input, #global select {
	width: calc(100% - 50px);
	padding: 15px 10px;
	padding-left: 40px;
	margin-bottom: 5px;
	margin-top: 5px;
	font-family: 'Roboto', sans-serif;
	font-size: 15px;
	border: none;
}

#global select {
	width: 100%;
}

#global input.password {
	background:#FFF url(../images/password.png) no-repeat 10px 10px;
    background-repeat: no-repeat;
}

#global input.password_confirm {
	background:#FFF url(../images/password_confirm.png) no-repeat 10px 10px;
    background-repeat: no-repeat;
}

#global input.user    {
	background:#FFF url(../images/user.png) no-repeat 5px 5px;
    background-repeat: no-repeat;
}

#global input.user1    {
	background:#FFF url(../images/user1.png) no-repeat 5px 5px;
    background-repeat: no-repeat;
}

#global input.email    {
	background:#FFF url(../images/email.png) no-repeat 15px 20px;
    background-repeat: no-repeat;
}

#global select.sexe    {
	background:#FFF url(../images/gender.png) no-repeat 10px 10px;
    background-repeat: no-repeat;
}

#global input[type="submit"] {
	width: 100%;
	float: left;
	color: #FFF;
	font-family: 'Oswald';
	text-transform: uppercase;
	padding-left: 10px;
}

#global a.btn {
	display: block;
	width: calc(100% - 25px);
	float: left;
	margin-top: 0px;
	color: #FFF;
	font-family: 'Oswald';
	font-size: 15px;
	text-transform: uppercase;
	padding: 15px 10px;
	text-decoration: none;
	text-align: center;
}

#global .btn_pink {
	background-color: #00a7ad;
	border: 2px solid #ffffff;
}

#global .btn_blue {
	background-color: #28a745;
	border: 2px solid #ffffff;
}

#global .btn_pink:hover, #global .btn_blue:hover  {
	border: 2px solid #FFF;
	cursor: pointer;
}

.last_action {
	width: 400px;
	position: absolute;
	height: 500px;
	top: 50px;
	right: 10%;
}

@media screen and (max-width: 1300px) {
  .last_action {
    display: none;
  }
  
  #global {
	margin-left: auto !important;
	margin-right: auto !important;
  }
}

.last_action .row {
	height: 150px;
	overflow: hidden;
	border-bottom: 4px solid #FFF;
}

.last_action .row img {
-webkit-filter: drop-shadow(2px 2px 0 white)
		drop-shadow(-2px 2px 0 white)
		drop-shadow(2px -2px 0 white)
      		drop-shadow(-2px -2px 0 white);

	filter: drop-shadow(2px 2px 0 white) 
		drop-shadow(-2px 2px 0 white)
		drop-shadow(2px -2px 0 white)
       		drop-shadow(-2px -2px 0 white);
	float: left;
}

.last_action .row .username {
	position: absolute;
	background-color: rgba(0, 0, 0, 0.7);
	right: 0;
	padding: 10px 20px;
	color: #FFF;
	font-family: 'Oswald';
	font-size: 15px;
	text-transform: uppercase;
	margin-top: 108px;
}

.last_action .row .message {
	background-color: #FFF;
	padding: 10px 20px;
	color: #FFF;
	font-family: 'Oswald';
	font-size: 12px;
	text-transform: uppercase;
	color: #333;
	margin-top: 50px;
	margin-left: 80px;
	width: 280px;
	text-align: left;
}