/* import the base */
/*
 * Contains all the colors that are used in the new design.
 * This file should only contain sass definitions, no actual css rules
 */
/* First we define some colors */
/* Now we define which color we use for different elements */
/* toolbars */
/* tabs */
/* menus */
/* grids */
/* fonts */
/* Tooltip */
/* different padding sizes (and margins) used in the WebApp */
/* sizes of the buttons */
/* triggers of comboboxes and up-down inputs */
/* settings */
/* The animation for the spinner */
@keyframes rotate {
  to {
    transform: rotate(360deg);
  }
}
/* line 13, ../../scss/external/login.scss */
html, body {
  height: 100%;
  font-family: arial, tahoma, helvetica, sans-serif;
  font-size: 13px;
}

/* line 18, ../../scss/external/login.scss */
body.login,
#loading-mask,
#bg,
body.zarafa-welcome {
  margin: 0;
  padding: 0;
  background: url(../../images/loginbg_daybreak.jpg) no-repeat center center;
  background-size: cover;
}

/* line 28, ../../scss/external/login.scss */
body.login.theme-basic:after,
body.theme-basic #loading-mask:after,
body.theme-basic #bg:after,
body.theme-basic.zarafa-welcome:after,
body.login.theme-highcontrast:after,
body.theme-highcontrast #loading-mask:after,
body.theme-highcontrast #bg:after,
body.theme-highcontrast.zarafa-welcome:after,
body.login.theme-dark:after,
body.theme-dark #loading-mask:after,
body.theme-dark #bg:after,
body.theme-dark.zarafa-welcome:after {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: 0;
  padding: 0;
  background: url(../../images/background.svg);
  background-size: cover;
  z-index: -1;
}

/* line 53, ../../scss/external/login.scss */
#loading-mask {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  /** ExtJS uses 20001 as z-index for its loading mask, so we need to use values higher then this **/
  z-index: 20002;
}

/* line 65, ../../scss/external/login.scss */
body.login #form-container,
#loading-mask #form-container {
  display: inline-block;
  visibility: hidden;
  top: 0;
  position: relative;
  overflow: hidden;
  z-index: 20010;
  color: #222222;
  /* clearfix */
}
/* line 74, ../../scss/external/login.scss */
body.login #form-container #bg,
#loading-mask #form-container #bg {
  position: absolute;
  left: 0;
  top: 0;
  -webkit-filter: blur(10px);
  filter: blur(10px);
}
/* line 82, ../../scss/external/login.scss */
body.login #form-container #content,
#loading-mask #form-container #content {
  width: 560px;
  padding: 50px 60px 60px;
  background: rgba(255, 255, 255, 0.5);
  position: relative;
}
/* line 89, ../../scss/external/login.scss */
body.login #form-container #content:after,
#loading-mask #form-container #content:after {
  content: " ";
  display: block;
  clear: both;
}
/* line 95, ../../scss/external/login.scss */
body.login #form-container .left,
#loading-mask #form-container .left {
  float: left;
  width: 220px;
  height: 220px;
  padding-right: 60px;
}
/* line 101, ../../scss/external/login.scss */
body.login #form-container .right,
#loading-mask #form-container .right {
  float: left;
  width: 245px;
  padding-left: 35px;
  min-height: 220px;
  position: relative;
}
/* line 109, ../../scss/external/login.scss */
body.login #form-container h1,
#loading-mask #form-container h1 {
  font-size: 36px !important;
  line-height: 36px;
  font-weight: normal;
  margin: 0 0 30px;
}
/* line 115, ../../scss/external/login.scss */
body.login #form-container h2,
#loading-mask #form-container h2 {
  font-size: 13px;
  font-weight: normal;
  text-align: right;
}
/* line 121, ../../scss/external/login.scss */
body.login #form-container #logo,
#loading-mask #form-container #logo {
  background: url(../../images/kopano-logo_220x52.png) no-repeat right center;
  width: 100%;
  height: 61px;
  margin: 71px 0 15px;
}
/* line 129, ../../scss/external/login.scss */
body.login #form-container.loading,
#loading-mask #form-container.loading {
  visibility: visible;
}
/* line 131, ../../scss/external/login.scss */
body.login #form-container.loading .right,
#loading-mask #form-container.loading .right {
  background: url(../../images/loading_m.png) no-repeat center center;
  animation: rotate 1.3s 0s infinite ease;
}
/* line 132, ../../scss/external/login.scss */
body.login #form-container.loading .right h1, body.login #form-container.loading .right form,
#loading-mask #form-container.loading .right h1,
#loading-mask #form-container.loading .right form {
  display: none;
}

/* line 144, ../../scss/external/login.scss */
body.login > #form-container label {
  display: block;
  margin-bottom: 0.5em;
}
/* line 148, ../../scss/external/login.scss */
body.login > #form-container input[type="text"],
body.login > #form-container input[type="password"] {
  display: block;
  width: 231px;
  background: white !important;
  border: 1px solid #e6e6e6;
  padding: 0 6px;
  margin-bottom: 15px;
  height: 24px;
}
/* line 159, ../../scss/external/login.scss */
body.login > #form-container input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0px 1000px white inset;
}
/* line 163, ../../scss/external/login.scss */
body.login > #form-container input:focus {
  outline: 0;
  border-color: #3094e3;
}
/* line 168, ../../scss/external/login.scss */
body.login > #form-container #password {
  margin-bottom: 8px;
}
/* line 172, ../../scss/external/login.scss */
body.login > #form-container #error {
  color: #e40023;
}
/* line 176, ../../scss/external/login.scss */
body.login > #form-container #submitbutton {
  background: #0f70bd;
  color: white;
  height: 24px;
  line-height: 24px;
  border: 1px solid transparent;
  padding: 0 9px;
  min-width: 84px;
  margin: 12px 0 0;
  box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.35);
}
/* line 187, ../../scss/external/login.scss */
body.login > #form-container #submitbutton:hover {
  background-color: #065fa5;
}
/* line 190, ../../scss/external/login.scss */
body.login > #form-container #submitbutton:click {
  background-color: #065fa5;
}
/* line 193, ../../scss/external/login.scss */
body.login > #form-container #submitbutton:focus {
  box-shadow: 0 0 0 1px #ffffff inset;
}

/* IE10 and IE11 don't support filters, so we load a blurred copy of the background image
 * and use that  */
/* line 200, ../../scss/external/login.scss */
body.login.MSIE10 #bg,
body.login.MSIE11 #bg {
  background-image: url(../../images/loginbg_daybreak_blurred.jpg);
}