* {
	margin: 0;
	outline: 0;
	padding: 0;
	box-sizing: border-box;
}

/* PT-Root-UI Regular */
@font-face {
    font-family: 'PT';
    src: url('/assets/fonts/PT-Root-UI_Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

/* PT-Root-UI Light */
@font-face {
    font-family: 'PT';
    src: url('/assets/fonts/PT-Root-UI_Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

/* PT-Root-UI Bold */
@font-face {
    font-family: 'PT';
    src: url('/assets/fonts/PT-Root-UI_Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

body {
	background:#000;
	color:#fff;
	font-family: 'PT', sans-serif;
    font-weight: normal;
}

.btn {
	padding:10px 20px;
	border-radius:50px;
	display:block;
	width:fit-content;
	text-decoration:none;
	transition: .2s;
}

.btn img {
	width: 20px;
    margin-right: 10px;
}

.btn_grey {
	background: #1B263B;
	color: #778DA9;
	display: flex;
    flex-direction: row;
	align-items: center;
}

.btn_grey:hover {
	background: #31415e;
}

.btn_green {
	background: #52B69A;
	color:#040409;
	padding:18px 30px;
}

.btn_green:hover {
	background:#72f7d2;
}

.btn_green_grey {
	background: #52B69A;
	color: #030407;
	display: flex;
    flex-direction: row;
	align-items: center;
}

.btn_green_grey img {
    filter: brightness(0);
}

.btn_green_grey:hover {
    background:#72f7d2;
}

.btn_dark {
	background:#040409;
	color:#778DA9;
	padding:18px 30px;
}

.btn_dark:hover {
	background:#17172c;
}

.btn_lightgrey {
	background: #415A77;
	color:#fff;
	padding:20px 45px;
}

.btn_lightgrey:hover {
	background:#617c9b;
}

.btn_darkcube {
	background: #1B263B;
	border-radius:10px;
	padding:20px 0;
	color:#fff;
}

.btn_darkcube:hover {
	background: #31415e;
}

.btn_small {
	padding:6px 10px;
	background: #1B263B;
	color:#fff;
}

.btn_small:hover {
	background: #31415e;
}

h1 {
	font-size:46px;
	font-weight:400;
}

.container {
	width:95%;
	margin:0 auto;
	max-width:1200px;
}

.first_block {
	padding:60px 0;
	position: relative;
}

.first_block .back_sphere {
	background-image:url('/assets/media/back_sphere_top.svg');
	background-repeat: no-repeat;
	background-position: center bottom;
	background-size: 100% 100%;
	position:absolute;
	z-index: -1;
    width: 100%;
    height: 100%;
    bottom: 0;
    left: 0;
}

.first_block .header {
	display:flex;
	flex-direction:row;
	justify-content:space-between;
}

.first_block .header .logo {
	max-width: 130px;
    width: 9vw;
}

.first_block .header .logo a {
	display:block;
}

.first_block .header .logo img {
	width:100%;
	height:auto;
}

.first_block .header .menu_block {
	display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.first_block .header .menu_block .menu_inside {
    display: flex;
    align-items: flex-start;
}

.first_block .header .menu {
	margin-bottom:20px;	
}

.first_block .header .menu ul {
	display: flex;
	flex-direction:row;
	justify-content:space-between;
	list-style-type:none;
}

.first_block .header .menu ul li {
	margin-right:24px;	
}

.first_block .header .menu ul a {
	color: #778DA9;
	font-size:18px;
	font-weight: 300;
	text-decoration:none;
	transition: .2s;
	position:relative;
}

.first_block .header .menu ul a::before,
.lang-switcher .a-switcher::before {
    content: "";
    position: absolute;
    bottom: -3px;
    left: 50%;
    width: 0;
    height: 1px;
    background: #778DA9;
    transform: translateX(-50%);
    transition: width .2s ease;
}

.first_block .header .menu ul li:hover a::before,
.lang-switcher .a-switcher:hover::before {
    width: 100%;
}

.first_block .header .auth_block {
	display:flex;
	flex-direction:row;
}

.first_block .header .auth_block .btn {
	font-size:15px;
}

.first_block .header .auth_block .btn:not(:last-child) {
	margin-right:15px;
}

.lang-switcher {
    position: relative;
    display: inline-block;
	width: fit-content;
}

.lang-switcher .a-switcher {
    display: flex;
    align-items: center;
    color:#778DA9;
    text-decoration: none;
}

.lang-switcher .a-switcher img,
.choose_lang a img {
    margin-right: 10px;
}

.choose_lang {
    display: none;
    position: absolute;
    margin-top: 5px;
    top: 100%;
    left: 0;
    background: white;
    border: 1px solid #ccc;
    border-radius: 4px;
    z-index: 1000;
    min-width: 150px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.2);
}

.choose_lang a {
    display: flex;
    padding: 8px 12px;
    text-decoration: none;
    color: #333;
    white-space: nowrap;
    align-items: center;
}

.choose_lang a:hover {
    background-color: #f0f0f0;
}

.choose_lang.show {
    display: block;
}

footer {
	padding:70px 0;
}

footer .footer_flex {
	display:flex;
	flex-direction:row;
	justify-content:space-between;
	padding-bottom:45px;
	border-bottom: 1px solid #172D44;
}

footer .footer_flex .side {
	width:48%;
}

footer .footer_flex .logo {
	max-width:80px;
}

footer .footer_flex .logo img {
	width:100%;
}

footer .footer_flex .text {
	font-weight: 400;
	font-size: 18px;
	margin-top:10px;
}

footer .footer_flex .footer_menus {
	display:flex;
	flex-direction:row;
}

footer .footer_flex .footer_menus .menu h4 {
	font-weight: 300;
	font-size: 18px;
	color: #778DA9;
	margin-bottom:20px;
}

footer .footer_flex .footer_menus .menu:not(:last-child) {
	margin-right:44px;	
}

footer .footer_flex .footer_menus .menu ul {
	list-style-type:none;
}

footer .footer_flex .footer_menus .menu ul li a {
	font-weight: 400;
	font-size: 18px;
	color: #C7D2E1;
	text-decoration:none;
	display:block;
	padding:5px;
	border-bottom: 1px solid #172D44;
	width:fit-content;
	min-width:120px;
	transition:.2s;
}

footer .footer_flex .footer_menus .menu ul li a:hover {
	border-bottom: 1px solid #fff;
}

footer .footer_links {
	padding-top:20px;	
	padding-bottom:50px;
	display:flex;
	flex-direction:row;
	justify-content:space-between;
}

footer .footer_links .side {
	width:48%;
}

footer .footer_links .side:last-child {
	display: flex;
	justify-content: space-between;
}

footer .footer_links .copyright {
	font-weight: 300;
	font-size: 18px;
	color: #778DA9;
}

footer .footer_links .link:not(:last-child) {
	margin-right:20px;
}

footer .footer_links .link {
	font-weight: 300;
	font-size: 18px;
	color: #778DA9;
	text-decoration:none;
	display:inline-block;
	position:relative;
}
footer .footer_links .link::before {
    content: "";
    position: absolute;
    bottom: -3px;
    left: 50%;
    width: 0;
    height: 1px;
    background: #778DA9;
    transform: translateX(-50%);
    transition: width .2s ease;
}

footer .footer_links .link:hover::before {
    width: 100%;
}

.main {
	padding:60px 0;
	position: relative;
}

.sides {
	display:flex;
	flex-direction: row;
	margin-top:40px;
}

.sides .side {
	width: 48%;
}
.sides .side:first-child {
	width:30%;
	margin-right: 66px;
}

.sides .side .block {
	padding: 17px 20px;
	border-top:1px solid #172D44;
}

.sides .side .block.block_devices {
	border-top: none;
}

.sides .side .block .name {
	font-weight: 400;
	font-size: 16px;
	color: #778DA9;
}

.sides .side .block .value {
	margin-top:10px;
	font-weight: 500;
	font-size: 16px;
	color: #FFFFFF;
}

.sides .side .block.block_devices .value .device,
.sides .side .block .value.value_change,
.sides .side .block.block_trafik .value {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 15px;
}

.sides .side .block.block_devices .value .device {
	margin-bottom: 10px;
}

.sides .side .block .value .link,
.form_auth .links a {
	text-decoration: none;
	color: #02C8F0;
	position: relative;
}

.sides .side .block .value .link::before,
.form_auth .links a::before {
    content: "";
    position: absolute;
    bottom: -3px;
    left: 50%;
    width: 0;
    height: 1px;
    background: #02C8F0;
    transform: translateX(-50%);
    transition: width .2s ease;
}

.sides .side .block .value .link:hover::before,
.form_auth .links a:hover::before {
    width: 100%;
}

.nums {
    flex-shrink: 0;
    white-space: nowrap;
    font-weight: 500;
}

.graffics {
    flex: 1;
    min-width: 100px;
    height: 20px;
    background-color: #1B263B;
    border-radius: 4px;
    overflow: hidden;
    position: relative;
}

.graffics .fill {
    height: 100%;
    width: 0;
    background-color: #34A0A4;
    border-radius: 4px;
    transition: width 1.5s ease-out;
}

.form_auth {
	padding:30px 0 200px 0;
}

.flex_input {
	display: flex;
}

.flex_input:not(:last-child) {
	margin-bottom: 40px;
}

label {
	font-weight: 500;
	font-size: 19px;
	padding: 20px;
	display: block;
	border-bottom: 1px solid #415A77;
	width: 100%;
	max-width:360px;
	margin-right: 60px;
}

input {
	display: block;
	margin-top:10px;
	width:100%;
	border:none;
	background: none;
	font-weight: 500;
	font-size: 19px;
	color:#fff;
}

.form_auth .btns {
	margin-top:45px;
	display: flex;
}

.form_auth .btns .btn:not(:last-child) {
	margin-right: 24px;
}

.form_auth .links {
	margin-top:45px;
}

.form_auth .links a:not(:last-child) {
	margin-right: 40px;
}

.auth_disable {
	pointer-events: none;
}

.reg_approved {
	padding:30px 0 50px 0;
	display: flex;
	align-items: center
}

.reg_approved img {
	width:60px;
	display: block;
	margin-right: 20px;
}

.reg_approved p {
	font-weight: 300;
	font-size: 24px;
	color:#F9FFFD;
}

.thanks p {
	font-weight: 300;
	font-size: 24px;
	color:#F9FFFD;
	max-width: 600px;
	padding:50px 0 200px 0;
}

.pop_up {
	display: none;
}

.recover p {
	margin-top:30px;
	font-size: 18px;
    max-width: 450px;
}

.first_block .header .menu_block_mobile,
.first_block .header .flex_mobile_logo,
.first_block .header .mobile_menu {
	display: none;
}

@media(max-width:1024px) {
	.download .links .link .icon,
	.pay_block .pay_cards .card .icon {
		width: 8vw;
	}
	.servers .features .feature .icon,
	.business .services .service .icon {
		width: 5vw;
	}
	.tars .prices .price .num {
		font-size: 4.5vw;
	}
	h1 {
		font-size: 4vw;
	}
	.business .business_flex .to_form h3,
	.referal .ref_flex .side:last-child .code {
		font-size: 3.5vw;
	}
	.faq .faq_flex .form h3 {
		font-size: 3vw;
	}
	.first_block .text_block .points .point .num,
	.download .links .link .system,
	.about .points .point .num {
		font-size: 2.5vw;
	}
	.tars .prices .price .points .point img,
	.free .features .feature img{
		font-size:2.3vw;
	}
	.first_block .text_block .subtitle {
		font-size: 2.2vw;
	}
	footer .footer_flex .footer_menus .menu ul li a,
	footer .footer_flex .footer_menus .menu h4,
	footer .footer_links .link,
	footer .footer_links .copyright,
	footer .footer_flex .text,
	.first_block .text_block .btns .btn,
	footer .footer_links .side:last-child .lang-switcher a {
		font-size: 1.7vw;
	}
	.first_block .header .auth_block .btn {
		font-size: 1.4vw;
	}
	.btn {
		text-align: center;
	}
	.btn_lightgrey {
		padding: 2vw 0;
		display: block;
		width: 50%;
	}
	footer .footer_flex .footer_menus .menu:not(:last-child) {
		margin-right: 20px;
	}
	footer .footer_flex .side,
	footer .footer_links .side {
		width: 43%;
	}
	footer .footer_flex .side:last-child,
	footer .footer_links .side:last-child {
		width: 55%;
	}
	footer .footer_links .link:not(:first-child) {
		margin-top:20px;
	}
}
@media(max-width:800px) {
	h1, .tars h2, .servers h2, .download h2, .business h2, .free h2, .let_me_auth .form h3, .let_me_auth .side .services .service img, .faq h2, .about h2, .referal h2, .pay_block h2, .tars .prices .price .num {
        font-size: 3.5vw;
    }
	    .first_block .text_block .subtitle, .tars .subtitle, .check p, .tars .prices .price h3, .tars .texts p, .servers .subtitle, .servers .features .feature .name, .download .subtitle, .business .subtitle, .business .services .service .name, .free .subtitle, .free .features .feature, .let_me_auth .side p, .let_me_auth .side .services .service, .faq .subtitle, .about .text p, .referal .ref_flex .side p, .referal .ref_flex .side .services .service, .referal .ref_flex .side:last-child p, .pay_block .subtitle, .pay_block .pay_cards .card .subtitle, .pay_block .features .feature {
        font-size: 2vw;
    }
	.let_me_auth .form .btns a, .about .points .point .text, .first_block .header .auth_block .btn {
        font-size: 1.7vw;
    }
	.first_block,
	footer {
		padding: 40px 0;
	}
	footer .footer_flex .side:first-child,
	footer .footer_flex .side:last-child {
		width: 100%;
	}
	footer .footer_flex .side:first-child,
	footer .footer_links .side:first-child {
		margin-bottom:20px;
	}
	footer .footer_flex,
	footer .footer_links {
		flex-direction:column;
	}
	.btn_lightgrey {
        width: 50%;
    }
	footer .footer_flex .logo {
		max-width: 18vw;
	}
	.first_block .header .logo {
		max-width: none;
		width: 15vw;
	}
	.flex_input,
	.sides  {
		flex-direction: column;
	}
	.flex_input label:not(:last-child) {
		margin-bottom: 40px;
	}
	.sides .side,
	.sides .side:first-child {
		width:100%;
		margin-right: 0;
	}
	footer .footer_links .side:last-child {
		flex-direction: column;
	}
	footer .footer_links .side:last-child .lang-switcher {
		margin-top:20px;
	}
	.first_block .header .menu_block {
		display:none;
        position: fixed;
        background: #0b111d;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        padding: 40px 2.5%;
        z-index: 999;
		overflow-y: auto;
	}
	.first_block .header .mobile_menu {
		display: block;
        filter: invert(1);
        width: 40px;
	}
	.first_block .header .flex_mobile_logo {
		display: flex;
		flex-direction: row;
		justify-content: space-between;
        margin-bottom: 20px;
		width: 100%;
        align-items: flex-start;
	}
	.first_block .header .flex_mobile_logo .mobile_menu_esc {
		width: 40px;
    	filter: invert(1);
	}
	.first_block .header {
		align-items: flex-start;
	}
	.first_block .header .menu_block .menu_inside {
		flex-direction: column;
    	width: 100%;
		margin-bottom: 50px;
	}
	.first_block .header .menu_inside ul {
		flex-direction: column;
	}
	.first_block .header .menu_inside ul li {
		margin-right: 0;
		margin-bottom: 15px;
	}
	.first_block .header .auth_block {
		flex-direction: column;
		align-items: flex-start;
		width: 100%;
	}
	.first_block .header .auth_block .btn:not(:last-child) {
		margin-right: 0;
		margin-bottom: 20px;
	}
	.first_block .header .menu_block_desktop {
		display: none;
	}
}
@media(max-width:550px) {
	.btn_lightgrey {
		width: 100%;
	}
	.btn {
		padding: 10px 15px;
	}
	.btn img {
		width: 15px;
		margin-right: 8px;
	}
	.first_block {
        padding: 40px 0;
    }
	.btn,
	.let_me_auth .form .btns a, .about .points .point .text, .first_block .header .auth_block .btn {
        font-size: 3.5vw;
    }
	h1, .tars h2, .servers h2, .download h2, .business h2, .free h2, .let_me_auth .form h3, .let_me_auth .side .services .service img, .faq h2, .about h2, .referal h2, .pay_block h2, .tars .prices .price .num {
        font-size: 6vw;
    }
	.reg_approved p {
        font-size: 3.5vw;
    }
	.first_block .text_block .points .point .num, .download .links .link .system, .about .points .point .num {
        font-size: 6.5vw;
    }
	.tars .prices .price .num span, .tars .prices .price .points .point, .download .links .link .subtitle, .business .business_flex .to_form .btn, .business .services .service .subtitle, .first_block .text_block .points .point .text, .check span, .popular_block, .servers .features .feature .subtitle, .free .side a, .faq .faq_flex .quas .qua .question, .faq .faq_flex .quas .qua .answer, .faq .faq_flex .form input:not([type="submit"]), .faq .faq_flex .form select, .faq .faq_flex .form textarea, .faq .faq_flex .form .btn, footer .footer_flex .footer_menus .menu ul li a, footer .footer_flex .footer_menus .menu h4, footer .footer_links .link, footer .footer_links .copyright, footer .footer_flex .text, .first_block .text_block .btns .btn, footer .footer_links .side:last-child .lang-switcher a {
        font-size: 3vw;
    }
	.btn_green {
		border: 1px solid #090e16;
	}
	footer .footer_flex .footer_menus {
		flex-wrap:wrap;
	}
	footer .footer_flex .footer_menus .menu:not(:last-child) {
		margin-bottom:20px;
	}
	footer .footer_flex .footer_menus .menu h4 {
		margin-bottom: 10px;
	}
	footer .footer_links .side {
        width: 100%;
    }
	footer .footer_flex .footer_menus .menu ul li a {
		padding-left:0;
	}
	footer .footer_flex .logo {
        max-width: 150px;
    }
	.first_block .header .logo {
        width: 120px;
    }
	.first_block .header {
		padding: 0 20px;
	}
	.container {
		width:90%;
	}
	.first_block .header .logo {
        width: 120px;
    }
	.first_block .header {
		padding: 0 20px;
	}
	.first_block .header .menu_block {
		padding: 40px calc(5% + 20px);
	}
}

/* API Messages Styles */
@keyframes slideIn {
	from {
		transform: translateX(100%);
		opacity: 0;
	}
	to {
		transform: translateX(0);
		opacity: 1;
	}
}

@keyframes slideOut {
	from {
		transform: translateX(0);
		opacity: 1;
	}
	to {
		transform: translateX(100%);
		opacity: 0;
	}
}

.api-message {
	animation: slideIn 0.3s ease;
}

.api-message-error {
	background: #f44336 !important;
}

.api-message-success {
	background: #4caf50 !important;
}

.api-message-info {
	background: #2196f3 !important;
}

.no-devices {
    padding: 10px 0;
}

.device-info {
    color: #4caf50;
    padding: 10px 0;
}

.username-value, .tariff-value, .expire-value {
    transition: opacity 0.3s ease;
}

@media(max-width: 600px) {
    .sides .side .block.block_trafik .value {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }
    
    .graffics {
        width: 100%;
        min-width: auto;
    }
    
    .nums {
        align-self: center;
    }
}