@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:200,300);
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  font-weight: 300;
}
body {
  font-family: 'Roboto', serif;
  font-optical-sizing: auto;
  color: #1a1a1a;
  font-weight: 300;
  background-color: rgb(0,255,204);
  background: -moz-linear-gradient(148deg, rgba(0,255,204,1) 0%, rgba(45,58,226,1) 85%, rgba(0,102,255,1) 100%);
  background: -webkit-linear-gradient(148deg, rgba(0,255,204,1) 0%, rgba(45,58,226,1) 85%, rgba(0,102,255,1) 100%);
  background: linear-gradient(148deg, rgba(0,255,204,1) 0%, rgba(45,58,226,1) 85%, rgba(0,102,255,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#00ffcc",endColorstr="#0066ff",GradientType=1); 
  font-size: 20px;
  height: 100vh;
}
body ::-webkit-input-placeholder {
  /* WebKit browsers */
  font-family: 'Source Sans Pro', sans-serif;
  color: #717171;
  font-weight: 300;
}
body :-moz-placeholder {
  /* Mozilla Firefox 4 to 18 */
  font-family: 'Source Sans Pro', sans-serif;
  color: #717171;
  opacity: 1;
  font-weight: 300;
}
body ::-moz-placeholder {
  /* Mozilla Firefox 19+ */
  font-family: 'Source Sans Pro', sans-serif;
  color: #717171;
  opacity: 1;
  font-weight: 300;
}
body :-ms-input-placeholder {
  /* Internet Explorer 10+ */
  font-family: 'Source Sans Pro', sans-serif;
  color: #717171;
  font-weight: 300;
}

.login-container{
	position: absolute;
	width: 100%;
	height: 600px;
}
.login-logo{
	background-image: url("../img/LYA.svg");
	background-size: auto 108px;
	background-repeat: no-repeat;
	background-position: center center;
	height: 210px;
	margin-top: 30px;
}
.wrapper {
  position: absolute;
  /*! overflow: hidden; */
  width: 828px;
  margin-left: 50%;
  left: -414px;
}
.wrapper.form-success .container h1 {
  -webkit-transform: translateY(85px);
      -ms-transform: translateY(85px);
          transform: translateY(85px);
}
.container {
  padding: 20px 40px;
  background-color: rgba(255, 255, 255, .3);
  text-align: center;
  margin: 100px 0 0px 0;
  min-width: 445px;
  /*! border-radius: 20px; */
}

.login-form{
	border-left: 1px solid rgba(224, 224, 224, .3);
	padding-right: 30px;
	text-align: left;
}

.login-foot{
	margin-top: 0px;
  background: rgba(255, 255, 255,.1); 
	box-shadow: rgba(0, 0, 0, 0.2) 0px 2px 3px;
}

.container h1 {
  font-size: 30px;
  font-weight: 200;
/*   margin-top: 40px; */
  text-align: center;
  font-variant: all-petite-caps;
}
form {
  /*! padding: 20px 0; */
  position: relative;
  z-index: 2;
}
form input {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  outline: 0;
  border: 1px solid #06f;
  background-color: rgba(255, 255, 255, 1);
  width: 250px;
  border-radius: 3px;
  padding: 10px 15px;
  margin: 0 auto 10px auto;
  display: block;
/*   text-align: center; */
  font-size: 18px;
  color: #8a8a8a;
  font-weight: 300;
}

form input::placeholder{
  font-variant: all-petite-caps;
}

form input:focus {
  background-color: white;
/*   width: 300px; */
  color: #337bb7;
  border-color: #337bb7;
}
form button {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  outline: 0;
  background-color: #f5f7f9;
  border: 0;
  padding: 10px 15px;
  color: #53e3a6;
  border-radius: 3px;
  width: 250px;
  cursor: pointer;
  font-size: 18px;
}
form button:hover {
  background-color: #f5f7f9;
}
.alert {
	margin: 0 10px;
	border-top: 1px dashed !important;
	padding: 2px;
	border-bottom: 1px dashed !important;
}
.alert h4 {
  margin-top: 0;
  color: inherit;
}
.alert .alert-link {
  font-weight: bold;
}
.alert > p,
.alert > ul {
  margin-bottom: 0;
}
.alert > p + p {
  margin-top: 5px;
}
.alert-danger {
    color: #ED493F;
}
.alert-danger hr {
  border-top-color: #e4b9c0;
}
.alert-danger .alert-link {
  color: #843534;
}

#social{
	/*! margin: 10px 30px; */
	/*! border-top: 1px solid rgb(224, 224, 224, .3); */
	/*! padding-top: 5px; */
	padding: 10px 10px;
  text-align: center;
}
#social div:last-child{
  text-align: right;
}
#social div:first-child{
  text-align: left;
}

#social a, #social span{
	font-size: 14px;
	color: white; 
}
#social span{
   line-height: 35px;
}
#social a:hover{
	color: rgb(41, 93, 137);
}
#social i{
  margin-top: 2px;
  font-size: 30px;
}
#powered-by-lybra{
	background-image: url("../img/LYA.svg");
    background-size: auto 18px;
    background-repeat: no-repeat;
    background-position: center center;
    width: 100%;
    height: 18px;
}


@media only screen and (max-width: 1200px) {
  
	  .container h1{
	    font-size: 50px;
	  }
	  
	  .login-container{
	    padding:0px;
	    margin:0px;
	  }
	  
		.wrapper {
		 margin: 0px;
		 width: 100vw;
		 left: 0;
    	 padding:0px;
		 min-width: 100%;
     
		}
	  .container{
	    margin:auto;
	    padding: 0px;
	    text-align: center;
	    box-shadow: none;
	    min-width: 0px;
	  }
	  .login-logo, .login-form{
	    padding: 0;
	    text-align: center;
	    border: none;
	  }
	  
	  #social > div{
	    text-align: center !important;
	  }
}