@font-face {
  font-family: "DINOTBold";
  src: url("../fonts/dinot-bold-webfont.eot");
  src: url("../fonts/dinot-bold-webfont.eot?#iefix") format("embedded-opentype"),
    url("../fonts/dinot-bold-webfont.woff") format("woff"),
    url("../fonts/dinot-bold-webfont.ttf") format("truetype"),
    url("../fonts/dinot-bold-webfont.svg#") format("svg");
  font-weight: normal;
  font-style: normal;
}

body,
html,
form,
img,
h1 {
  margin: 0;
  padding: 0;
  border: none;
}

html {
  font-size: 75%;
}

body {
  font-family: "Trebuchet MS", Helvetica, Sans-Serif;
  color: #323030;
  font-size: 1em;
  /*background: #0098DB url(../images/bg_login.png) top center no-repeat;*/
}

.HeadLogo {
  width: 500px;
  margin: 0 auto;
  text-align: left;
  margin-bottom: 16px;
}

.Header {
  margin-top: 0;
  margin-bottom: 24px;
}

.Panel {
  width: 500px;
  margin: 0 auto;
  text-align: left;
  background: #fff;
  border: 1px solid #2daae0;
}

.Narrow .HeadLogo {
  width: 380px;
}

.Narrow .Panel {
  width: 380px;
}

.Narrow .Panel .Content {
  padding: 30px 34px;
}

.Wide .Panel {
  width: 960px;
}

.Panel .Content {
  padding: 20px 30px;
}

h1 {
  text-transform: uppercase;
  font-weight: normal;
  font-size: 2em;
  margin-bottom: 30px;
  background: url(../images/icons/custom/logo.gif) left top no-repeat;
  padding-left: 60px;
  color: #1a1a1a;
  height: 48px;
  font-family: "DINOTBold", "Trebuchet MS", Helvetica, Sans-Serif;
  letter-spacing: 4px;
}

.Element {
  overflow: visible;
  margin-bottom: 15px;
}

.Flat .Element {
  margin-bottom: 7px;
}

.Label {
  font-size: 16px;
  white-space: nowrap;
  margin-bottom: 2px;
  padding-left: 1px;
  color: #666;
}

.Value {
  font-size: 16px;
}

input[type="text"],
input[type="password"] {
  border: 1px solid #bbbbbb;
  font-size: 14px;
  line-height: 18px;
  padding: 4px 5px;
  color: #1a1a1a;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
}

input[type="text"]:focus,
input[type="password"]:focus {
  border-color: rgba(82, 168, 236, 0.8);
  outline: none;
}

input[type="button"] {
  outline: none;
}

.Hidden {
  display: none;
}

.Error {
  color: #e10000;
  padding-left: 1px;
}

a.Error,
.Panel a.Error {
  color: #e10000;
  text-decoration: underline;
  padding-left: 0;
}

.Reg {
  font-size: 0.8em;
  line-height: 2.8em;
  vertical-align: top;
}

.Cloud {
  width: 100%;
  /*background: url(../images/bg_clouds.png) top center no-repeat;*/
  padding-top: 80px;
  margin-top: 20px;
}

.Cloud.Wide {
  background-image: url(../images/bg_clouds_wide.png);
  min-height: 440px;
}

.Wide .Content {
  overflow: visible;
  padding: 0;
}

.Panel .Left,
.Panel .Right {
  padding: 15px;
  min-height: 270px;
}

.Panel .Left {
  float: left;
  width: 475px;
}

.Panel .Right {
  float: right;
  width: 380px;
  background: #bce4f5 url(../images/bg_arrow.png) left center no-repeat;
  padding-left: 55px;
}

.Panel .Right .Label {
  font-size: 14px;
}

.Panel .Right input[type="text"],
.Panel .Right input[type="password"] {
  border-color: #a7c6d4;
}

.Panel .Right input[type="text"]:focus,
.Panel .Right input[type="password"]:focus {
  border-color: #007cb3;
}

a {
  color: #0098db;
}

.Panel a {
  text-decoration: none;
}

.SubLogo {
  display: block;
  font-size: 12px;
  text-transform: none;
  letter-spacing: 2px;
}

.SubTitle {
  margin-bottom: 30px;
  height: 40px;
  font-size: 18px;
  font-family: "DINOTBold", "Trebuchet MS", Helvetica, Sans-Serif;
  line-height: 20px;
}

.SubTitle.mb20 {
  margin-bottom: 20px;
}

.SubTitle.mb0 {
  margin-bottom: 0;
}

.Commented {
  padding-left: 20px;
  background: url(../images/icons/16/quote_open_16.png) left top no-repeat;
}

.QuoteClose {
  background: url(../images/icons/16/quote_close_16.png) left top no-repeat;
  padding-right: 16px;
  margin-left: 5px;
}

.Italic {
  font-style: italic;
}

.Comments {
  color: #999;
}

.CommentsDark {
  color: #666;
}

.RightText {
  text-align: right;
}

.LeftFloated {
  float: left;
}

.RightFloated {
  float: right;
}

.NoFloat {
  overflow: visible;
}

.watermark,
input[type="text"].watermark,
input[type="password"].watermark {
  color: #bbb;
}

.fw120 {
  width: 120px;
}

.fw300 {
  width: 300px;
}

.fw400 {
  width: 400px;
}

.fw900 {
  width: 900px;
}

.mt5 {
  margin-top: 5px;
}

.mt8 {
  margin-top: 8px;
}

.mt20 {
  margin-top: 20px;
}

.mt30 {
  margin-top: 30px;
}

.mt40 {
  margin-top: 40px;
}

.ml20 {
  margin-left: 20px;
}

.mb8 {
  margin-bottom: 8px;
}

.mb10 {
  margin-bottom: 10px;
}

.mb16 {
  margin-bottom: 16px;
}

.mb20 {
  margin-bottom: 20px;
}

.mb24 {
  margin-bottom: 24px;
}

.mb30 {
  margin-bottom: 30px;
}

.mb40 {
  margin-bottom: 40px;
}

.fs08 {
  font-size: 0.8em;
}

.fs12 {
  font-size: 12px;
}

.fs13 {
  font-size: 13px;
}

.fs14 {
  font-size: 14px;
}

.fs24 {
  font-size: 24px;
}

.h30 {
  height: 30px;
}

.h110 {
  height: 110px;
}

.mh110 {
  min-height: 110px;
}

.btn {
  display: inline-block;
  padding: 4px 12px;
  font-size: 14px;
  line-height: 20px;
  color: #fff;
  text-align: center;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  background-color: #0098db;
  border: 1px solid #007cb3;
  cursor: pointer;
}

.btn:hover {
  background-color: #007cb3;
}

.btn:active {
  background-color: #007cb3;
}

.btn-large {
  font-size: 16px;
  padding: 7px 16px;
}

.Logo,
.Graphics {
  background-repeat: no-repeat;
  background-position: left top;
  padding-left: 170px;
}

.Logo {
  background-image: url(../images/logo-157-32.png);
}

.Graphics {
  background-image: url(../images/promo/folder-shared-cloud.png);
}

.NotificationAreaOverlay {
  position: fixed;
  top: 5px;
  left: 50%;
  width: 600px;
  margin-left: -300px;
  z-index: 3050;
}

.NotificationAreaOverlay .NotificationArea {
  margin: 0 auto;
  background: #0098db;
  border: solid 1px #0098db;
  font-size: 12px;
  padding: 5px 5px 5px 10px;
  position: relative;
  color: #fff;
  overflow: visible;
  width: 300px;
  padding-left: 10px;
}

.NotificationAreaOverlay .NotificationArea.ErrorArea {
  background: #c33;
  border: solid 1px #c33;
}

.NotificationAreaOverlay .NotificationArea .SysButtons .Close {
  background-image: url(../images/icons/16/delete_semitransp_16.png);
}

.NotificationAreaOverlay .NotificationArea .SysButtons .Close:hover {
  background-image: url(../images/icons/16/delete_thin_white_16.png);
}

.NotificationAreaOverlay .NotificationArea .Messages {
  width: 100%;
}

.NotificationAreaOverlay .NotificationArea .Messages .Message {
  padding-right: 30px;
}

.NotificationArea .SysButtons {
  float: right;
}

.NotificationAreaOverlay .SysButtons {
  position: absolute;
  right: 5px;
  top: 4px;
}

.NotificationArea .SysButtons .Button {
  margin: 0;
  padding: 0;
  display: block;
  float: right;
  width: 16px;
  height: 16px;
  background-repeat: no-repeat;
  background-position: center center;
  text-indent: -9000px;
}

.ml120 {
  margin-left: 120px;
}

.tooltip-container {
  position: relative;
  display: inline-block;
  width: 300px;
}

.tooltip-container .tooltiptext {
  visibility: hidden;
  width: auto;
  background-color: #333;
  color: #fff;
  text-align: center;
  padding: 8px 12px;
  border-radius: 4px;
  font-size: 12px;

  position: absolute;
  z-index: 1;
  left: 0;
  top: 100%;
  margin-top: 5px;

  opacity: 0;
  transition: opacity 0.3s;
}

.tooltip-container .tooltiptext::after {
  content: "";
  position: absolute;
  bottom: 100%;
  left: 20px;
  border-width: 5px;
  border-style: solid;
  border-color: transparent transparent #333 transparent;
}

.tooltip-container:hover .tooltiptext {
  visibility: visible;
  opacity: 1;
}

.tooltip-container input {
  width: 100%;
  box-sizing: border-box;
}