/*Reset*/
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, cite, code,del, dfn, em, font, ins, kbd, q, s, samp, sub, sup, tt, var,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td {margin:0;padding:0;outline:0;}

/*Box-sizing*/
*, *:before, *:after {-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}


/*Common*/
/*body{font-size: 13px; background: url(imgs/gradient-bg.jpg) center/cover no-repeat;}*/
.clear{clear: both;}
table{border-collapse: collapse; width: 100%;}
html, body{font-family: Arial, sans-serif; height:100%; width:100%;}


.login-w{width:100%; height:100%; border: 0;/* background: url('imgs/gradient.png') no-repeat center center;*/}


/*Страница*/


h1{font-weight: 300; font-family: "Roboto Condensed"; color: #414848; width: 100%;}
input[type="text"],input[type="password"]{display: block; padding: 6px; background: #fff; border: none; width: 100%; color: rgba(255, 255, 255, 0.8) !important;}
input[type="text"]:focus,input[type="password"]:focus{border: none; box-shadow: 0 0 5px #b0cfe0; outline: none; color:#fff;}


/*_______________________________________________________________________________________________________________________________*/
/*login_panel*/
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
	transition: background-color 5000s ease-in-out 0s;
	border: none;
	outline: none;
}

input:-moz-placeholder,
input::-webkit-input-placeholder,
input::placeholder{color: #fff}

input[type="text"]:focus, input[type="password"]:focus{border: none}

.login__panel{display: flex;justify-content: center;align-items: center;height: 100%;
/*	background:  rgb(162, 211, 233); !* Old browsers *!
	background: -moz-radial-gradient(center, ellipse cover, rgb(162, 211, 233) 0%, rgb(0, 175, 255) 100%); !* FF3.6-15 *!
	background: -webkit-radial-gradient(center, ellipse cover, rgb(162, 211, 233) 0%,rgb(0, 175, 255) 100%); !* Chrome10-25,Safari5.1-6 *!
	background: radial-gradient(ellipse at center, rgb(162, 211, 233) 0%,rgb(0, 175, 255) 100%);*/
}
/*.login__form{background: #ffffff;width: 350px;padding: 30px; box-shadow: 0px 0px 0 1px #272727;border-radius: 2px;}
.login__form img{display:block;max-width: 35px; width: 100%}
.login__entry{display: flex;justify-content: center;margin-bottom: 20px;align-items: center}
.login__entry img{margin-left: 5px;width: 25px;}
.login__input{display: flex;    height: 35px;	margin-bottom: 15px;border: 1px solid rgb(48,157,207);transition: 0.3s}
.login__input input{ border: none;    background: #50acd687;color: #0c0c0d;}
.login__input img{padding: 5px;      background: #50acd687; }
.login__input:hover {border: 1px solid rgb(43, 72, 207);}
.login__button{cursor: pointer;font-size:18px;border: 1px solid rgb(48,157,207); background: #50acd687;display:inline-block;padding: 10px 25px;color: #0c0c0d;transition: 0.3s;border-radius: 3px;box-shadow: 0 1px 0 0 #0c0c0d}
.login__button:hover{border: 1px solid rgb(43, 72, 207);padding: 10px 30px;background: rgba(90, 208, 252, 0.53);}*/
/*_______________________________________________________________________________________________________________________________*/

::-moz-selection {background: #2D2F36;}
::selection {background: #2D2F36;}
::-webkit-selection {background: #2D2F36;}
::-moz-selection {background: #2D2F36;}
body {background: white;font-family: 'Inter UI', sans-serif;margin: 0;padding: 20px;}
.page {background: #e2e2e5;display: -ms-flexbox;display: flex;-ms-flex-direction: column;flex-direction: column;height: calc(100% - 40px);position: absolute;place-content: center;width: calc(100% - 40px);}
.container {display: -ms-flexbox;display: flex;height: 320px;margin: 0 auto;width: 640px;}
.left {background: white;height: calc(100% - 40px);top: 20px;position: relative;width: 50%;}
.login {font-size: 50px;font-weight: 900;margin: 50px 40px 40px;}
.eula {color: #999;font-size: 14px;line-height: 1.5;margin: 40px;}
.right {background: #474A59;box-shadow: 0px 0px 40px 16px rgba(0, 0, 0, 0.22);color: #F1F1F2;position: relative;width: 50%;}
h1, h6 {font-family: 'Open Sans';font-weight: 300;text-align: center;position: absolute;top: 45%;right: 0;left: 0;}
.login--img{width: 50px; position: absolute; top: 5px; left: 5px}
svg {position: absolute;width: 320px; left: 0}
path {fill: none;stroke: url(#linearGradient);stroke-width: 4;stroke-dasharray: 240 1386;}
.form {margin: 40px;position: absolute; width: 240px;}
label.pass {color: #c2c2c5;display: block;font-size: 14px;height: 16px;margin-top: 20px;margin-bottom: 5px; text-align: left;font-weight: bold;}
input {background: transparent;border: 0;color: #f2f2f2;font-size: 20px;height: 30px;line-height: 30px;outline: none !important;width: 100%;}
input::-moz-focus-inner {border: 0;}
#submit {color: #707075;margin-top: 43px;transition: color 300ms;}
#submit:hover {color: #ececec}
#submit:focus {color: #f2f2f2;}
#submit:active {color: #d0d0d2;}
.login__form-wrapper input[type="text"], .login__form-wrapper input[type="password"]{background: rgba(255, 255, 255, 0.1);}
body {width: 100wh;height: 90vh;color: #fff;background: linear-gradient(-45deg, #EE7752, #E73C7E, #23A6D5, #23D5AB);background-size: 400% 400%;-webkit-animation: Gradient 15s ease infinite;-moz-animation: Gradient 15s ease infinite;animation: Gradient 15s ease infinite;}

@-webkit-keyframes Gradient {
    0% {
            background-position: 0% 50%
    }
    50% {
            background-position: 100% 50%
    }
    100% {
            background-position: 0% 50%
    }
}

@-moz-keyframes Gradient {
    0% {
            background-position: 0% 50%
    }
    50% {
            background-position: 100% 50%
    }
    100% {
            background-position: 0% 50%
    }
}

@keyframes Gradient {
    0% {
            background-position: 0% 50%
    }
    50% {
            background-position: 100% 50%
    }
    100% {
            background-position: 0% 50%
    }
}


@media (max-width: 767px) {
    .page {height: auto;margin-bottom: 20px;padding-bottom: 20px; } 
    .container {-ms-flex-direction: column;flex-direction: column;height: 630px;width: 320px; } 
    .left {height: 100%;left: 20px;width: calc(100% - 40px);max-height: 270px;}
    .right {-ms-flex-negative: 0;flex-shrink: 0;height: 100%;width: 100%;max-height: 350px; }
}