body { position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 0; margin: 0; border: none; overflow: hidden; cursor: default; font-family: Arial, Helvetica, Verdana, sans-serif; font-size: 10px; text-decoration: none; background-color: #ffffff; color: #000000; }
* { box-sizing: border-box; padding: 0; margin: 0; border: none; }

/****************************************/
/***************** PAGE *****************/
/****************************************/

.page { position: absolute; left: 0; top: 0; bottom: 0; right: 0; background-repeat: no-repeat; background-position: center; background-size: cover; background-image: url(../../cdn/common/login/img/background.png); }

.master { position: absolute; left: 50%; top: 50%; width: 20%; min-width: 290px; height: auto; min-height: 250px; text-align: center; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); }
.master-logo { margin: 20px 0 20px 0; }
.master-logo img { max-width: 80%; }

.master-form { padding: 18px 0 18px 0; border-radius: 3px; background-color: #fdfdfd; }

.master-form-title { margin-top: 6px; }
.master-form-title-image {}
.master-form-title-image img { width: 15%; }
.master-form-title-text { margin-top: 18px; font-family: 'Roboto'; font-size: 24px; color: #000000; }

.master-form .text-row { margin-top: 18px; padding: 0 5% 0 5%; }
.master-form .text-row span { font-family: 'Roboto'; font-size: 16px; color: #000000; }

.master-form .input-row { margin-top: 18px; }
.master-form .input-row input { display: inline-block; height: 29px; width: 90%; padding: 4px 6px 4px 6px; border: 1px solid #000000; border-radius: 3px; font-family: 'Roboto'; font-size: 16px; font-weight: normal; }
.master-form .input-row span { display: inline-block; height: 27px; width: 90%; padding: 5px 7px 3px 7px; text-align: left; line-height: 19px; font-family: 'Roboto'; font-size: 16px; font-weight: normal; color: #000000; overflow: hidden; }

.master-form .button-row { margin-top: 18px; }
.master-form .button-row button { height: 24px; padding: 4px 11px 4px 11px; margin-bottom: 2px; text-align: center; border-radius: 2px; font-family: 'Roboto'; font-size: 14px; font-weight: 700; background-color: transparent; color: #0056b6; cursor: pointer; }
.master-form .button-row button:hover { background-color: rgba(0, 0, 0, 0.08); }

.master-connecting { padding-top: 25px; }
.master-connecting div { margin-bottom: 25px; font-family: 'Roboto'; font-size: 16px; font-weight: normal; color: #ffffff; }
.master-connecting img {}

.master-message { position: absolute; left: calc((100vw - max(290px, 20%)) / -2); right: calc((100vw - max(290px, 20%)) / -2); padding-top: 18px; font-family: 'Roboto'; font-size: 16px; font-weight: normal; color: #ffffff; }

.info { position: absolute; left: 0; bottom: 0; width: auto; height: auto; min-height: 40px; padding: 0 0 0 10px; }
.info-about { font-family: 'Roboto'; font-size: 10px; font-weight: normal; color: #ffffff; }
.info-customer { font-family: 'Roboto'; font-size: 10px; font-weight: normal; color: #ffffff; }

.logo { position: absolute; right: 15px; bottom: 17px; }
.logo a { display:block; }
.logo img { display: block; }
