/* Creating mobile firts mq
//========================================================================== *//* Styling placeholders in every browser
========================================================================== *//* apply a natural box layout model to all elements, but allowing components to change *//**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS text size adjust after orientation change, without disabling
 *    user zoom.
 */html {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-family: "ubuntu", sans-serif;
 /* 1 */
  font-size: 14px;
  -ms-text-size-adjust: 100%;
 /* 2 */
  -webkit-text-size-adjust: 100%;
 /* 2 */;
}

html,body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

*,*:before,*:after {
  border: none;
  -webkit-box-sizing: inherit;
  box-sizing: inherit;
  list-style: none;
  margin: 0;
  padding: 0;
}/* HTML5 display definitions
   ========================================================================== *//**
 * Correct `block` display not defined for any HTML5 element in IE 8/9.
 * Correct `block` display not defined for `details` or `summary` in IE 10/11
 * and Firefox.
 * Correct `block` display not defined for `main` in IE 11.
 */article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary {
  display: block;
}/**
 * 1. Correct `inline-block` display not defined in IE 8/9.
 * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
 */audio,canvas,progress,video {
  display: inline-block;
 /* 1 */
  vertical-align: baseline;
 /* 2 */;
}/* Links
   ========================================================================== *//**
 * Remove the gray background color from active links in IE 10.
 */a {
  background-color: transparent;
}/**
 * Improve readability when focused and also mouse hovered in all browsers.
 */a:active,a:hover,a:focus {
  -webkit-box-shadow: none;
  box-shadow: none;
  outline: 0;
}

button:focus {
  outline: 0;
}/* Text-level semantics
   ========================================================================== */b,strong {
  font-weight: bold;
}/* Embedded content
   ========================================================================== *//**
 * Remove border when inside `a` element in IE 8/9/10.
 */img {
  border: 0;
}/**
 * Correct overflow not hidden in IE 9/10/11.
 */svg:not(:root) {
  overflow: hidden;
}/* Forms
   ========================================================================== *//**
 * Known limitation: by default, Chrome and Safari on OS X allow very limited
 * styling of `select`, unless a `border` property is set.
 *//**
 * 1. Correct color not being inherited.
 *    Known issue: affects color of disabled elements.
 * 2. Correct font properties not being inherited.
 * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
 */button,input,optgroup,select,textarea {
  color: inherit;
 /* 1 */
  font: inherit;
 /* 2 */
  margin: 0;
 /* 3 */;
}/* Login app content
======================================= */.app-content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  height: 100vh;
}

.app-content::after,.grid-login::after {
  content: '';
  position: absolute;
  z-index: -2;
  width: 100%;
  height: 100vh;
  top: 0;
  left: 0;
  background: url("../../media/img/Artboard.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  z-index: -2;
  background-attachment: fixed;
}

.grid-login {
  -ms-flex-item-align: center;
  align-self: center;
  border: 0.05rem solid rgba(255, 255, 255, 0.2);
  padding: 2.25rem 3.75rem 3rem 3.75rem;
  width: 90%;
  -webkit-box-shadow: 0 0 5rem 0.25rem #131A48;
  box-shadow: 0 0 5rem 0.25rem #131A48;
  overflow: hidden;
  position: relative;
}

.grid-login::after {
  z-index: -1;
  -webkit-filter: blur(10px);
  filter: blur(10px);
  width: 120%;
  left: -10%;
  height: 120%;
  top: -10%;
}

.grid__head {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.grid__logo {
  margin-bottom: 0.5rem;
}

.grid__logo--name {
  margin-bottom: 2.25rem;
}

.login {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.login__group {
  text-align: center;
}

.login__group--button {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.login__label {
  clip: rect(0 0 0 0);
  clip: rect(0, 0, 0, 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}

.login__input,.login__button {
  border-radius: 1.5rem;
  margin-bottom: 1.5rem;
}

.login__input,.login__button,.login__link {
  color: #ffffff;
}

.login__input {
  border: 0.05rem solid rgba(255, 255, 255, 0.2);
  width: 100%;
  background-color: rgba(73, 93, 161, 0.7);
  padding: 0.75rem 1.5rem;
}

.login__input::-webkit-input-placeholder {
 /* Chrome/Opera/Safari */
  color: #ffffff;
}

.login__input:-ms-input-placeholder {
  color: #ffffff;
}

.login__input::-ms-input-placeholder {
  color: #ffffff;
}

.login__input::placeholder {
  color: #ffffff;
}

.login__input:-ms-input-placeholder {
 /* IE 10+ */
  color: #ffffff;
}

.login__input:-moz-placeholder {
 /* Firefox 18- */
  color: #ffffff;
}

.login__input--validation {
  border-color: #FF9363;
}

.login__input--validation::-webkit-input-placeholder {
 /* Chrome/Opera/Safari */
  color: #FF9363;
}

.login__input--validation:-ms-input-placeholder {
  color: #FF9363;
}

.login__input--validation::-ms-input-placeholder {
  color: #FF9363;
}

.login__input--validation::placeholder {
  color: #FF9363;
}

.login__input--validation:-ms-input-placeholder {
 /* IE 10+ */
  color: #FF9363;
}

.login__input--validation:-moz-placeholder {
 /* Firefox 18- */
  color: #FF9363;
}

.login__input--forgot {
  /*@include mq($bp_4kdish){
		  padding-right: 30%;
	  }

	  @include mq($bp_4kdish){
		  padding-right: 25%;
	  }*/;
}

.login__button {
  width: 60%;
  background: linear-gradient(170deg, #69fde8, #3FC3FF 65%);
  font-weight: 500;
  font-size: 1.14286rem;
  text-shadow: 0 0.1rem #279ACE;
  padding: 0.75rem;
}

.login__button--forgot {
 /*position: absolute;
			top: 0;
			right: 0;*/
  margin: auto;
  display: block;
 /*@include mq($bp_4kdish){
				width: 25%;
			}*/;
}

.login__link {
  text-decoration: none;
}

.login__link:hover {
  text-decoration: underline;
}

.login__validation-info {
  color: #FF9363;
  margin-bottom: 1.5rem;
  text-align: center;
}

.forgot {
  margin-top: 0.75rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  max-height: 0;
  opacity: 0;
  -webkit-transition: all 0.4s ease-out;
  transition: all 0.4s ease-out;
  overflow: hidden;
}

.forgot__information {
  color: rgba(255, 255, 255, 0.67);
  text-align: center;
  margin-bottom: 1.5rem;
}

.forgot__group {
  position: relative;
}

.forgot__show {
  max-height: 20rem;
  opacity: 1;
}

@font-face {
  font-family:'Ubuntu';font-weight:400;font-style:normal;src:url(/fonts/ubuntu-regular-webfont.woff2) format(woff2), url(/fonts/ubuntu-regular-webfont.woff) format(woff);
}

@font-face {
  font-family:'Ubuntu';font-weight:300;font-style:normal;src:url(/fonts/ubuntu-light-webfont.woff2) format(woff2), url(/fonts/ubuntu-light-webfont.woff) format(woff);
}

@font-face {
  font-family:'geodesic';src:url("/fonts/geodesic-icons-regular.woff2") format("woff2"), url("/fonts/geodesic-icons-regular.woff") format("woff");font-weight:normal;font-style:normal;
}

@media screen and (min-width: 37.5rem) {
  .grid-login {
        width: 70%;
  }

  .login__input--forgot {
    padding-right: 6.75rem;
  }

  .login__button--forgot {
    position: absolute;
    top: 0;
    right: 0;
    padding-right: 1.5rem;
    padding-left: 1.5rem;
    width: auto;
  }
}

@media screen and (min-width: 48rem) {
  .grid-login {
    width: 55%;
  }
}

@media screen and (min-width: 61.5625rem) {
  .grid-login {
    width: 45%;
  }
}

@media screen and (min-width: 64rem) {
  .grid-login {
    width: 40%;
  }
}

@media screen and (min-width: 80rem) {
  .grid-login {
    width: 35%;
  }
}

@media screen and (min-width: 90rem) {
  .grid-login {
    width: 30%;
  }
}

@media screen and (min-width: 100rem) {
  .grid-login {
    width: 25%;
  }
}