@import "import/reset.css";
html {
    height: 100vh;
}

body {
    /* background: rgba(35,60,82,1);
	background: -moz-linear-gradient(top, rgba(35,60,82,1) 0%, rgba(12,140,195,1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(35,60,82,1)), color-stop(100%, rgba(12,140,195,1)));
	background: -webkit-linear-gradient(top, rgba(35,60,82,1) 0%, rgba(12,140,195,1) 100%);
	background: -o-linear-gradient(top, rgba(35,60,82,1) 0%, rgba(12,140,195,1) 100%);
	background: -ms-linear-gradient(top, rgba(35,60,82,1) 0%, rgba(12,140,195,1) 100%);
	background: linear-gradient(to bottom, rgba(35,60,82,1) 0%, rgba(12,140,195,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#233c52', endColorstr='#0c8cc3', GradientType=0); */
    background-image: url(https://bctip.ru/wp-content/uploads/2019/01/cropped-LTKN8200-1.jpg);
    background-color: #000;
    background-size: cover;
}

.authContainer {
    height: 800px;
    width: 100%;
    overflow: hidden;
    position: relative;
    color: #fff;
}

.authForm {
    width: 420px;
    /* background: url(../../images/authBrain.png) no-repeat top center; */
    position: absolute;
    top: 30px;
    left: 50%;
    margin-left: -200px;
    padding-top: 322px;
    text-align: center;
}

.authForm h1 {
    font-size: 19pt;
    margin: 20px 0 30px 0;
}

.authInputWrap {
    margin: 20px 0 20px 0;
}

.authInput {
    border: 1px solid #fff;
    /* background: none; */
    width: 90%;
    padding: 18px;
    font-size: 13.7pt;
    color: #fff;
    background: #000;
    opacity: 0.7;
}

.authPlacholder {
    color: #fff;
}

.authBtn {
    text-transform: uppercase;
    border: 0;
    background: #ea5b21;
    font-size: 12pt;
    padding: 11px;
    color: #fff;
    cursor: pointer;
    width: 130px;
}

.authBtn:hover {
    background: #fff;
    transition: all 0.7s ease 0s;
    color: #ea5b21;
}

.pAuthError {
    color: #fff;
    font-size: 9pt;
}

.devices {
    position: relative;
}

.left,
.right {
    position: absolute;
    top: 33px;
    display: none;
}

.left {
    width: 0;
    height: 0;
    border-top: 7px solid transparent;
    border-left: 8px solid #fff;
    border-bottom: 7px solid transparent;
}

.right {
    width: 0;
    height: 0;
    border-top: 7px solid transparent;
    border-right: 8px solid #fff;
    border-bottom: 7px solid transparent;
}

.devIcon {
    opacity: 0.3;
    margin: 10px;
    background: url(../../images/devices.png) no-repeat 0 0;
    width: 60px;
    display: inline-block;
    color: #fff;
    padding-top: 65px;
    font-size: 10pt;
    text-align: center;
    text-decoration: none;
}

.devIcon:hover {
    transition: all 0.7s ease 0s;
    opacity: 1;
    color: #fff;
    text-decoration: none;
}

.active {
    opacity: 1;
}

#pc {
    background-position: 0 0;
}

#tablet {
    background-position: -60px 0;
}

#phone {
    background-position: -123px 0;
}

@media only screen and (max-width: 1280px) {
    .authForm {
        padding-top: 202px;
    }
    .authForm h1 {
        font-size: 16pt;
        margin: 10px 0px 20px;
    }
    .authInputWrap {
        margin: 10px 0px;
    }
    .authInput {
        padding: 10px;
        font-size: 12pt;
        background: rgba(24, 97, 135, 0.6);
    }
}