/********************************
	Developed by AXA Studios
	The Creative Engine
	http://www.axastudios.com
*********************************/

@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed:wght@300;400;700&family=Roboto:ital,wght@0,300;0,400;0,500;0,700;0,900;1,400&display=swap');

:root {
    --main-color: #251F3B;
	--light-main-color: #342A58;
	--dark-main-color: #1A152E;
	
    --sub-color: #F3AF0D;
    --light-sub-color: #fbbe2d;
/*    --dark-sub-color: #c3a709;*/
	--text-color: #1A152E;	
	
	--light-color: #E7E4EB;
	--light-bg-color: #f6f6f7;
	--border-color: #C8C7CD;	
	--light-border-color: #f3f3f3;	
	--dark-border-color: #AAAAAA;	
	
    --black-color: #000000;
    --white-color: #FFFFFF;
    --white-alpha-color: rgba(255,255,255,0.48);

	--red-color: #E93A3A;
	
/*
	--main-gradient: linear-gradient(to bottom, rgba(230, 168, 154,1) 0%, rgba(181, 106, 229,1) 100%);
	--green-color: #44AD68;
	--orange-color: #F3AF0D;
*/

    --xs-pad: 8px;
    --sm-pad: 12px;
    --mid-pad: 16px;
    --main-pad: 24px;
    --med-pad: 32px;
    --lg-pad: 48px;
    --xl-pad: 72px;
    --xxl-pad: 96px;
	
    --xs-neg: -8px;
    --sm-neg: -12px;
    --mid-neg: -16px;
    --main-neg: -24px;
    --lg-neg: -48px;
	
	--main-radius: 5px;

    --sm-font: 14px;
    --main-font: 16px;
	--lg-font: 18px;
    --input-font: 14px;
    --button-font: 14px;
	
    --icon-font: 18px;
	--mid-icon-font: 24px;
    --main-icon-font: 32px;
    --lg-icon-font: 48px;
	--xl-icon-font: 56px;
    
    --doc-height: 100%;
    
}


/* MAIN STYLES *****************************/

html {
	overflow-y: scroll;
	margin: 0;
	padding: 0;
}
body {
	margin: 0;
	padding: 0;
	background: #FFFFFF;
	background: var(--white-color);
	font-family: 'Roboto', Arial, Helvetica, sans-serif;
	font-size: 16px;
	font-weight: 300;
	line-height: 1.6;
	color: #1A152E;
	color: var(--text-color);
}

/* TEXT & LINK STYLES *****************************/

h1, h2, h3, h4, h5, h6 {
	font-weight: 700;
	margin: 0px;
	font-family: 'Roboto', Arial, Helvetica, sans-serif;
}
h1{
	font-size: 56px;
	font-weight: 900;
    line-height: 1.2;
    margin-bottom: var(--main-pad);
}
h2{
	font-size: 44px;
	font-weight: 900;
    line-height: 1.2;
    margin-bottom: var(--mid-pad);
}
h3{
	font-size: 32px;
	font-weight: 900;
    line-height: 1.2;
    margin-bottom: var(--sm-pad);
}
h4{
	font-size:20px;
	font-weight: 900;
    line-height: 1.2;
    margin-bottom: var(--xs-pad);
}

h1.h-sm{
	font-size: 32px;	
}

.sub-title{
	font-size: 15px;
	text-transform: uppercase;
	margin-bottom: var(--xs-pad);
	letter-spacing: 1px;
}

p {
    margin: 0px 0px var(--main-pad) 0px;
}
a {
    color: var(--text-color);
    text-decoration: underline;
    text-decoration: none;
	outline: 0!important;
}
a:hover, a:focus {
    color: var(--sub-color);
    text-decoration: none;
}
a img {
	border: none;
	outline:0;
}

:focus{
	-moz-outline-style:none;
	outline: 0;
}
:focus{
	-moz-outline-style:none;
}
::selection{
	background-color:#333333;
	color:#fff;
}
::-moz-selection{
	background-color:#333333;
	color:#fff;
}
img{
	max-width: 100%;
/*
	height: auto;
*/
}
input:focus, button:focus {
	outline: none;
}
.no-mob{
	
}

/* BUTTON STYLES *****************************/


.button, .button:visited,
a.button, a.button:visited{
	position: relative;
	display: inline-block;
	cursor: pointer;
	text-align: center;
	text-decoration: none;
	color: var(--text-color);
	line-height: var(--main-pad);
	font-size: var(--button-font);
	font-weight: 700;
	padding: var(--sm-pad) var(--main-pad);
	box-shadow: none;
	outline: none;
	border-radius: var(--main-radius);
	border: none;
	background: var(--sub-color);
	-webkit-transition: all 0.2s ease;
	transition: all 0.2s ease;
}
.button:hover, .button:active, .button:focus,
a.button:hover, a.l-btn:active, a.button:focus {
	color: var(--white-color);
	background: var(--text-color);
	color: var(--text-color);
	background: var(--light-sub-color);
	box-shadow: none;
    -webkit-transition: all 0.4s ease;
	transition: all 0.4s ease;	
}
.button:before {
	position: absolute;
	content: '';
	display: block;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	border-radius: var(--main-radius);
	z-index: -1;
	background: var(--light-sub-color);
	transform: scale(1.00);
	transition: all 0.3s ease;
}
.button:hover:before {
	transform: scale(1.05);
	transition: all 0.3s ease-out;
}
.button:not(.btn-shine):after {
    content: "";
    position: absolute;
    box-sizing: border-box;
    display: block;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    border: 1px solid transparent;
    border-radius: var(--main-radius);
    background: linear-gradient(
            180deg,
            rgba(255, 255, 255, 0.24) 0%,
            rgba(255, 255, 255, 0) 40%
        )
        border-box;
    -webkit-mask: linear-gradient(#fff 0 0) padding-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: destination-out;
    mask-composite: exclude;
    pointer-events: none;
    z-index: 1;
}


.l-btn:before,
.w-btn:before,
.clear-btn:before{
	display: none;
}

.button:hover, .button:active, .button:focus{
	
}

.l-btn, .l-btn:visited, 
a.l-btn, a.l-btn:visited {
    color: var(--text-color);
	padding: 11px var(--main-pad);
    border: 1px solid var(--border-color);
	min-width: 120px;
    background: none;
    -webkit-transition: all 0.2s ease;
	transition: all 0.2s ease;
}
.l-btn:hover, .l-btn:active, .l-btn:focus,
a.l-btn:hover, a.l-btn:active, a.l-btn:focus {
    background: none;
	color: var(--sub-color);
    border: 1px solid var(--sub-color);
    -webkit-transition: all 0.4s ease;
	transition: all 0.4s ease;
}

.w-btn, .w-btn:visited, 
a.w-btn, a.w-btn:visited {
	background: none;
    color: var(--white-color);
    border: 1px solid var(--border-color);
}
.w-btn:hover, .w-btn:active, .w-btn:focus,
a.w-btn:hover, a.w-btn:active, a.w-btn:focus {
    background: none;
	color: var(--sub-color);
    border: 1px solid var(--sub-color);
    -webkit-transition: all 0.4s ease;
	transition: all 0.4s ease;
}

.clear-btn, .clear-btn:visited, 
a.clear-btn, a.clear-btn:visited {
	background: none;
    color: var(--white-color);
    border: none;
}
.clear-btn:hover, .clear-btn:active, .clear-btn:focus,
a.clear-btn:hover, a.clear-btn:active, a.clear-btn:focus {
    background: none;
	color: var(--sub-color);
    border: none;
    -webkit-transition: all 0.4s ease;
	transition: all 0.4s ease;
}

.button i{
	position: relative;
	display: inline-flex;
	flex-direction: column;
	justify-content: center;
	text-align: center;
	width: var(--main-pad);
	height: var(--main-pad);
	line-height: var(--main-pad);
	font-size: var(--icon-font);
	vertical-align: top;
}
.button > span{
	display: inline-flex;
	line-height: var(--main-pad);
	padding: 0 var(--mid-pad) 0 var(--sm-pad);
}
.button.glass-btn{
    display: inline-flex;
    min-width: 168px;
    background: rgba(255, 255, 255, 0.08);
    color:var(--white-color); 
    padding: 0;
    backdrop-filter: blur(8px);
}
.button.glass-btn:hover{
    color:var(--white-color); 
    background: rgba(255, 255, 255, 0.24);    
}
.button.glass-btn:before{
    background: linear-gradient(94deg, rgba(245, 133, 42, 0.12) 0%, rgba(245, 133, 42, 0.24) 100%);
    background: transparent;
}
.button.glass-btn:hover:before {
	transform: scale(1);
	transition: all 0.3s ease-out;
}
.button.glass-btn img{
    width: 24px;
    height: 24px;
    margin: 12px;
}
.button.glass-btn .btn-txt-wrap{
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: left;
    width: calc(100% - 48px);
    padding: 8px var(--main-pad) 8px 0;
    line-height: 16px;
}
.button.glass-btn .btn-txt-wrap div span{
    font-weight: 300;
}
.button.glass-btn .btn-txt-wrap > span{
    font-weight: 700;
    color: #00C147;
}

.txt-btn{
	position: relative;
	display: inline-flex;
	line-height: var(--main-pad);
	text-decoration: none;
    -webkit-transition: all 0.2s ease;
	transition: all 0.2s ease;
}
.txt-btn i{
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	text-align: center;
	width: var(--main-pad);
	height: var(--main-pad);
	line-height: var(--main-pad);
	font-size: var(--icon-font);
}
.txt-btn span{
	position: relative;
	display: inline-flex;
	padding: 2px var(--mid-pad) 0 var(--mid-pad);
	font-size: var(--sm-font);
	line-height: 22px;
	font-weight: 700;
}

.txt-btn:hover, .txt-btn:active, .txt-btn:focus{
	color: var(--sub-color);
    -webkit-transition: all 0.4s ease;
	transition: all 0.4s ease;
}
.big-button{
	display: inline-flex;
	flex-direction: column;
}
.big-button span{
	font-size: 24px;
	font-weight: 900;
	line-height: 24px;
}
.big-button div{
	font-size: var(--sm-font);
	font-weight: 300;
	line-height: 20px;
}
.btn-shine,
a.btn-shine{
    position: relative;
    overflow: hidden;
/*    background: black;*/
}
.btn-shine:after{
    content: '';
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;  
    background: linear-gradient(to right, rgba(255,255,255,0) 10%, rgba(255,255,255,0.64) 60%, rgba(255,255,255,0) 90%);    
    z-index: 1;
    transform:translateZ(0) skew(40deg);
    animation: btn-shine-animate 4.0s ease infinite;
}

@keyframes btn-shine-animate {
	0%, 100% { opacity: 0;
		transform:translateZ(0) skew(40deg) translateX(-200%);
	}
	9%, 41%{ opacity: 0;}
	10%{ opacity: 1;}
	40% { opacity: 1;
		transform:translateZ(0) skew(40deg) translateX(200%);
	}
}

/* FORM STYLES *****************************/

.form-wrap{
    position: relative;
/*    margin-bottom: 72px;*/
}

.form-row-main{
    margin-left: -24px;
    margin-right: -24px;
}
.form-col-main{
    position: relative;
    display: block;
    width: 50%;
    float: left;
    padding: 0px 24px;
}
.form-wrapper .form-wrap{
    margin-bottom: 0px;
}
.form-col{
    position: relative;
    display: block;
    width: 50%;
    float: left;
    padding: 0px 12px;
}
.form-wrap .row{
    margin-left: -12px;
    margin-right: -12px;
}
.form-wrap .col-sm-4, .form-wrap .col-sm-6, .form-wrap .col-sm-8, .form-wrap .col-sm-12{
    padding-left: 12px;
    padding-right: 12px;
}
.row.form-small-row{
    margin: 0;
    width: 100%;
}
.form-group{
    position: relative;
    display: block;
/*    padding: 0px;*/
    margin-bottom: 24px;
}
.row.form-cols{
    margin-left: -40px;
    margin-right: -40px;
}
.form-col h3{
    padding: 0px 20px;
}
.form-matd{
	position: relative;
}
.form-matd input, .form-matd textarea{
    height:48px;
	padding: 20px 16px 4px 16px;
    line-height: 22px;
	font-size: var(--input-font);
	border: 1px solid var(--border-color);
    font-weight: 400;
    border-radius: var(--main-radius);
    background: var(--white-color);
    box-shadow: none;
    height: initial;
    color: var(--text-color);
	transition: all 0.2s ease;
}
.form-matd input:-internal-autofill-selected, input:-internal-autofill-selected {
	-webkit-appearance: none!important;
	-webkit-box-shadow: 0 0 0px 1000px #FFFFFF inset;
	background: none!important;
}
.form-matd textarea{
    min-height: 80px;
    min-height: 120px;
}
.form-matd input:focus, .form-matd textarea:focus{
    outline: none;
    background: var(--white-color);
}
.form-control{
    font-size: var(--input-font);
    color: var(--text-color);
	background: var(--white-color);
    box-shadow: none;
}
.form-control:focus{
    color: var(--text-color);
    box-shadow: none;
}
.form-matd .form-control:focus{
	border: 1px solid var(--sub-color);
}

.form-control::-webkit-input-placeholder {
    color: var(--text-color);
}
.form-control::-moz-placeholder {
    color: var(--text-color);
}
.form-control:-ms-input-placeholder {
    color: var(--text-color);
}
.form-control::placeholder {
    color: var(--text-color);
}

.form-matd .form-control:focus{
    box-shadow: none;
    outline: none;
    color: var(--text-color);
    font-weight: 400;
}
.form-control:focus::-webkit-input-placeholder {
    font-weight: 400;
}
.form-control:focus::-moz-placeholder {
    font-weight: 400;
}
.form-control:focus:-ms-input-placeholder {
    font-weight: 400;
}
.form-control:focus::placeholder {
    font-weight: 400;
}

input:-internal-autofill-selected,
input:-webkit-autofill, 
input:-webkit-autofill:focus, 
input:-webkit-autofill:hover,
input:-internal-autofill-selected{
    -webkit-appearance: none!important;
	-webkit-box-shadow: 0 0 0px 1000px #FFFFFF inset!important;
    background-color: #FFFFFF !important;
    background-image: none !important;
    color: var(--text-color) !important;
}
.form-matd label,
.form-matd input:invalid ~ label,
.form-matd input.input-empty ~ label{
	position:absolute;
    color: var(--text-color);
	font-weight:normal;
	pointer-events:none;
	background: var(--white-color);
	background: none;
	left: 12px;
	top:14px;
	padding: 0px 16px 0px 16px;
	margin: 0px;
    font-size: 14px;
    font-weight: 300;
	transition:0.15s ease all;
	-webkit-transition:0.15s ease all;
}
/*
.form-col input:focus ~ .form-border, .form-col textarea:focus ~ .form-border {
	left: 12px;
    width:calc(100% - 24px);
}
*/

.form-matd input:focus ~ label,
.form-matd input.input-filled ~ label,
.form-matd input:required:valid ~ label,
.form-matd textarea:focus ~ label,
.form-matd textarea.input-filled ~ label,
.form-matd textarea:required:valid ~ label {
    left: 12px;
	top:6px;
    color: var(--text-color);
	font-size: 12px;
    font-weight: 300;
}
.form-matd input:focus ~ label,
.form-matd textarea:focus ~ label{
    color: var(--sub-color);
}

.form-matd label.error, #reg-check-error{
    position: absolute;
    top: auto!important;
    bottom: -25px;
    font-weight: 400;
    color: var(--red-color)!important;
    font-size: 12px!important;
    text-transform: uppercase;
}
.form-matd label.error, .form-matd .error-text, .select-box .error-text, .checkbox .error-text, .form-captcha .error-text, .form-option-group .error-text, .form-options .error-text{
    position: absolute;
    top: auto!important;
    bottom: -20px;
    font-weight: 400;
    color: var(--red-color)!important;
    font-size: 12px!important;
}
.form-fileinput .error-text{
    font-weight: 400;
    color: var(--red-color)!important;
    font-size: 12px!important;	
}  
.form-option-group .error-text,
.checkbox .error-text{
    bottom: -12px;
}
.form-captcha .error-text{

}
.form-btns{
	display: flex;
	align-items: center;
	text-align: right;
	justify-content: flex-end;
}

.box .inputfile {
/*    width: 0.1px;*/
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
}

.inputfile + label {
    display: flex;
	width: 100%;
/*    max-width: 80%;*/
    font-size: 14px;
    font-weight: 400;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
    overflow: hidden;
    padding: 11px 16px;
    margin-bottom: 0px;
}
.inputfile + label span{
	display: inline-block;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
	line-height: 24px;
}
.no-js .inputfile + label {
    display: none;
}

.inputfile:focus + label,
.inputfile.has-focus + label {
/*
    outline: 1px dotted #000;
    outline: -webkit-focus-ring-color auto 5px;
*/
}
.inputfile + label svg {
	flex-shrink: 0;
    width: 16px;
    height: 16px;
	margin: 4px 12px 4px 0px;
    vertical-align: top;
    fill: currentColor;
	fill: var(--text-color);
}
.inputfile-1 + label {
	border-radius: var(--main-radius);
    color:  var(--text-color);
	border: 1px solid var(--border-color);
/*	border: 1px solid currentColor;*/
}
.inputfile-1:focus + label,
.inputfile-1.has-focus + label,
.inputfile-1 + label:hover {
    color: var(--sub-color);
}
.inputfile + label:hover svg {
	fill: var(--sub-color);
}
.inputfile-1 + label:hover {
	border: 1px solid var(--sub-color);
}

/* WRAPPER STYLES *****************************/

#outer-wrapper{
	position: relative;
}

#main-wrapper{
	
}
#content-wrapper{
	position: relative;
/*	min-height: 60vh;*/
}
.sub-page #content-wrapper{
	padding-top: 80px;
}
.sub-page.clean-header #content-wrapper{
	padding-top: 0px;
}

#bg-wrapper {
    position: fixed;
	content:'';
	display: none;
	opacity: 0;
	width:100%;
	height:110%;
	top: 0;
	z-index: 98;
    background: var(--main-color);
}
#bg-subwrapper {
    position: fixed;
	content:'';
	display: none;
	opacity: 0;
	width:100%;
	height:110%;
	top: 0;
	z-index: 100;
    background: rgba(37, 31, 59, 0.88);
}
.menu-open #bg-wrapper,
.sub-menu-open #bg-subwrapper{
    display: block;
    opacity: 1;
    -webkit-animation: opac-in-animate 0.2s ease forwards;
	animation: opac-in-animate 0.2s ease forwards;
}
.menu-ani #bg-wrapper {
    display: block;
	opacity: 1;
    -webkit-animation: opac-out-animate 0.2s ease-in forwards;
	animation: opac-out-animate 0.2s ease-in forwards;
}

/* HEADER STYLES *****************************/

#header{
	position: fixed;
	display: block;
	width: 100%;
	height: 80px;
	top: 0;
	left: 0;
	z-index: 5;
	background: var(--white-color);	
	box-shadow: 0 1px 0px var(--light-color);
    -webkit-transition: background 0.2s ease, box-shadow 0.2s ease;
	transition: background 0.2s ease, box-shadow 0.2s ease;
}
.header-main{
	position: relative;
	display: flex;
	padding: 0 var(--lg-pad); 
}
.logo-main{
	position: relative;
	display: flex;
	margin: 26px 0px;
}
.logo-main-dark{
	display: block;
}
.logo-main-light{
	display: none;
}

.logo-main a{
	position: relative;
	display: block;
}
.logo-main img{
	height: 24px;
	width: auto;
	vertical-align: top;
}
.nav-wrap{
	position: relative;
	display: flex;
	flex-grow: 1;
}
.nav-main{
	position: relative;
	display: flex;
	margin: var(--sm-pad) var(--main-pad);
}
.nav-main ul{
	position: relative;
	display: flex;
	list-style: none;
	padding: 0;
	margin: 0;
}
.nav-main ul li{
	position: relative;
	display: flex;
}
.nav-main ul li a{
	position: relative;
	display: flex;
	padding: var(--mid-pad) var(--mid-pad);
	line-height: var(--main-pad);
	color: var(--text-color);
	font-size: var(--sm-font);
	height: 56px;
	font-weight: 700;
	text-decoration: none;
	transition: color 0.2s ease;
}
.nav-main ul li a:hover,
.nav-main ul li a:focus,
.nav-main ul li a:active{
	color: var(--sub-color);
	transition: color 0.4s ease-out;
}
.nav-right{
	position: relative;
	display: flex;
	margin-left: auto;
	padding: var(--mid-pad) 0;
}
.nav-mob-lang{
    display: none;
}


.nav-socials{
	position: relative;
	display: flex;
	list-style: none;
	margin: 0 var(--sm-pad);
	padding: 0;
}
.nav-socials li{
	position: relative;
	display: flex;
	padding: var(--sm-pad);
}
.nav-socials li a{
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;
	padding: 0;
	height: var(--main-pad);
	width: var(--main-pad);	
	line-height: var(--main-pad);
	color: var(--text-color);
	font-size: var(--icon-font);
	text-decoration: none;
}
.nav-socials li a:hover{
	color: var(--sub-color);	
}
.nav-buttons{
	display: flex;
	display: none!important;
}
.nav-buttons .button{
	margin-left: var(--main-pad);
}

.nav-app-icons{
	position: relative;
/*	display: none;*/
	display: flex;
	margin-top: var(--mid-pad);
    margin: 20px 0px;
}
.nav-app-icon-block{
	position: relative;
	display: flex;
}
.nav-app-icons .app-icon{
	margin-right: 0;
	margin-left: var(--mid-pad);
}
.nav-app-icon-light{
	display: none;
    border-radius: 5px;
    background: rgba(255, 255, 255, 0.08);
}
.nav-app-icon-dark{
	display: flex;	
}


.nav-dropdown{
	position: relative;
	display: flex;
}
.nav-dropdown-toggle{
	box-shadow: none;
	height: 48px;
	border: none;
	padding: 12px 28px 12px var(--mid-pad);
}
.nav-dropdown-toggle img{
	vertical-align: top;
}
.nav-dropdown-toggle:after{
	content: "\f107";
    position: absolute;
    right: 0;
    top: 12px;
    width: 100%;
    height: 24px;
	width: 24px;
    font-size: var(--icon-font);
    font-family: "Font Awesome 6 Pro";
    font-style: normal;
    font-weight: normal;
    font-size: 18px;
    line-height: 24px;
	font-weight: 300;
    vertical-align: middle;
	color: var(--text-color);
}

.nav-dropdown-toggle:focus{
	box-shadow: none;
}
.nav-dropdown .dropdown-menu{
	padding:4px 0px;
	border: none;
	border-radius: var(--main-radius);
	box-shadow: 0px 8px 24px rgba(0, 0, 0, 0.08);
}

.nav-lang{
	white-space: nowrap;
	line-height: 24px;
	padding: 12px var(--mid-pad);
	margin: 0;
	text-decoration: none;
	overflow: hidden;
}
.nav-lang img{
	height: 24px;
	vertical-align: top;
}
.nav-lang span{
	font-size: 14px;
	font-weight: 700;
	padding-left: 8px;
	color: var(--text-color);
}
.nav-lang:hover span{
	color: var(--sub-color);
}
.nav-main .nav-lang{
	display: none;
}

.half-header #header,
.clean-header #header{
	background: transparent;
	box-shadow:none;
}
.half-header #header .logo-main-dark,
.clean-header #header .logo-main-dark{
	display: none;
}
.half-header #header .logo-main-light,
.clean-header #header .logo-main-light{
	display: block;
}
.half-header #header:not(.sticky-header) .nav-main ul li a,
.clean-header #header:not(.sticky-header) .nav-main ul li a,
.clean-header #header:not(.sticky-header) .nav-socials li a,
.clean-header #header:not(.sticky-header) .nav-dropdown-toggle:after{
	color: var(--white-color);
}
.clean-header #header:not(.sticky-header) .nav-buttons .l-btn{
	color: var(--white-color);
	border: 1px solid var(--white-color);
}

.half-header #header:not(.sticky-header) .nav-main ul li a:hover,
.half-header #header:not(.sticky-header) .nav-main ul li a:focus,
.half-header #header:not(.sticky-header) .nav-main ul li a:active,
.clean-header #header:not(.sticky-header) .nav-main ul li a:hover,
.clean-header #header:not(.sticky-header) .nav-main ul li a:focus,
.clean-header #header:not(.sticky-header) .nav-main ul li a:active,
.clean-header #header:not(.sticky-header) .nav-socials li a:hover,
/*.clean-header #header:not(.sticky-header) .nav-lang:hover,*/
.clean-header #header:not(.sticky-header) .nav-main ul li a:active{
	color: var(--sub-color);
}
.clean-header #header:not(.sticky-header) .nav-buttons .l-btn:hover{
	color: var(--sub-color);
	border: 1px solid var(--sub-color);
}

.half-header #header:not(.sticky-header) .nav-app-icon-light,
.clean-header #header:not(.sticky-header) .nav-app-icon-light,
.clean-header #header:not(.sticky-header) .nav-app-icon-light,
.clean-header #header:not(.sticky-header) .nav-app-icon-light{
	display: flex;
}
.half-header #header:not(.sticky-header) .nav-app-icon-dark,
.clean-header #header:not(.sticky-header) .nav-app-icon-dark,
.clean-header #header:not(.sticky-header) .nav-app-icon-dark,
.clean-header #header:not(.sticky-header) .nav-app-icon-dark{
	display: none;
}


.nav-toggle {
	position: relative;
	float: right;
	cursor: pointer;
    display: none;
    width: 24px;
	height: 24px;
	padding: 0px;
	margin: 16px 0px 16px 16px;
	background: none;
	border: none;
	overflow: hidden;
}

.nav-icon span,
.menu-ani .nav-icon span{
	display: block;
	position: absolute;
	top: 11px;
	left: 5px;
	right: 1px;
	height: 2px;
    background: var(--white-color);
    background: var(--text-color);
/*	transition: background 0s 0.2s;*/
}
.nav-icon span:before,
.nav-icon span:after,
.menu-ani .nav-icon span:before,
.menu-ani .nav-icon span:after {
	content: "";
	position: absolute;
	display: block;
	left: -3px;
	width: 100%;
	height: 2px;
	background-color: var(--text-color);
	transition-duration: 0.2s, 0.2s;
	transition-delay: 0.2s, 0s;
}
.nav-icon span:before,
.menu-ani .nav-icon span:before {
	top: -5px;
	transition-property: top, transform;
}
.nav-icon span:after,
.menu-ani .nav-icon span:after {
	bottom: -5px;
	transition-property: bottom, transform;
}
.menu-open .nav-icon span {
	background: none;
}
.menu-open .nav-icon span:before {
	top: 0;
    width: 100%;
	transform: rotate(45deg);
}
.menu-open .nav-icon span:after {
	bottom: 0;
    width: 100%;
	transform: rotate(-45deg);
}
.menu-open .nav-icon span:before,
.menu-open .nav-icon span:after {
	transition-delay: 0s, 0.2s;
}

/* STICKY HEADER *****************************/

body:not(.menu-open) #header.sticky-header{
	background: var(--white-color);	
	box-shadow: 0 1px 0px var(--light-border-color);
}
body:not(.menu-open) #header.sticky-header .logo-main-dark{
	display: block;
}
body:not(.menu-open) #header.sticky-header .logo-main-light{
	display: none;
}


/* HOME STYLES *****************************/

.home-page #content-top-wrapper{
	position: relative;
	background: url(../images/altinstar-mainbanner-background.webp) center bottom no-repeat #1A152E;
	background-size: cover;
    overflow: hidden;
/*	padding-bottom: 160px;*/
}
.content-top-wrapper-bg{
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    z-index: 1;    
}
#banner-main{
	position: relative;
	background: none;
	overflow: hidden;
	display: flex;
	flex-direction: column;
/*	justify-content: flex-end;*/
	min-height: 100dvh;
    padding-top: 80px;
    z-index: 2;
}
#banner-main > .container{
    display: flex;
    flex-direction: column;
    justify-content: center;
    flex-grow: 1;
}
.banner-main-wrapper{
	position: relative;
	display: flex;
}

.banner-main-text{
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	width: 50%;
	padding-right: 10%;
	color: var(--white-color);	
/*
	opacity: 0;
	animation: btm-in-animate 0.5s ease-out forwards;
*/
}
.banner-main-title{
	position: relative;
    opacity: 0;
/*	animation: btm-in-animate 0.7s ease-out forwards;*/
    animation: text-blur-animate 0.7s ease-out forwards;
    animation-delay: 0.3s;
}

.banner-main-title h1 span{
    display: inline-flex;
    background: linear-gradient(90deg, #FFBE73 0%, #F70 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.banner-main-content{
	position: relative;
	display: flex;
	flex-direction: column;
	font-size: 24px;
	margin-bottom: var(--main-pad); 
    opacity: 0;
/*	animation: btm-in-animate 0.7s ease-out forwards;*/
    animation: text-blur-animate 0.7s ease-out forwards;
    animation-delay: 0.6s;
}
.banner-main-buttons{
	position: relative;
	display: flex;
	width: 66%;
	width: 100%;
/*	flex-direction: column;	*/
    opacity: 0;
    animation: btm-in-animate 0.7s ease-out forwards;
    animation-delay: 0.9s;
}
.hidden-link{
	display: none!important;
}
.banner-main-buttons .button:not(.glass-btn){
/*	width:100%;*/
/*    width: 50%;*/
    min-width: 320px;
    float: left;
	margin-bottom: var(--mid-pad); 
}
.banner-main-buttons .button.glass-btn{
	margin-left: var(--mid-pad);     
}

.banner-btn-desktop{
    width: 100%;
}
.banner-btn-ios,
.banner-btn-desktop{
	display: none;
}

.banner-main-image{
	position: relative;
	display: flex;
	flex-direction: column;
	width: 50%;
}
.banner-main-image img{
	position: relative;
	height: auto;
	z-index: 2;
/*	opacity: 0;*/
}

.banner-blob{
	position: absolute;
	display: block;
	display: none;
	z-index: 0;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0%;
}
.banner-blob svg{
	width: 100%;
	height: 100%;	
}

.banner-main-text-blocks{
	position: relative;
	display: flex;
	flex-direction: column;
	width: 100%;
	padding: var(--main-pad) var(--main-pad) 0 var(--main-pad); 
	padding: 0 var(--main-pad) var(--main-pad) var(--main-pad); 
	margin-top: auto;
}
.banner-main-blocks-wrap{
	position: relative;
	display: flex;	
	width: 100%;
}
.banner-text-block{
	position: relative;
	display: flex;
	padding:  var(--main-pad); 
	width: 25%;
	color: var(--white-color);
	opacity: 0;
}
.animate .banner-text-block{
	animation: btm-in-animate 0.5s ease-out forwards;
}
.banner-main-text-blocks .banner-text-block:nth-child(1){
	animation-delay: 0.2s;	
}
.banner-main-text-blocks .banner-text-block:nth-child(2){
	animation-delay: 0.4s;	
}
.banner-main-text-blocks .banner-text-block:nth-child(3){
	animation-delay: 0.6s;	
}
.banner-main-text-blocks .banner-text-block:nth-child(4){
	animation-delay: 0.8s;	
}
.banner-text-block-icon{
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: var(--lg-pad);
    height: var(--lg-pad);
	line-height: var(--lg-pad);
	border-radius: 50%;
	flex-shrink: 0;
    font-size: var(--icon-font);
	color: var(--white-color);
	background:  var(--sub-color);
    background: linear-gradient(94deg, rgba(255, 255, 255, 0.24) 0%, rgba(255, 255, 255, 0.00) 100%);
    backdrop-filter: blur(2px);
}
.banner-text-block-icon:after {
    content: "";
    position: absolute;
    box-sizing: border-box;
    display: block;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    border: 1px solid transparent;
    border-radius: 50%;
    background: linear-gradient(
            180deg,
            rgba(255, 255, 255, 0.24) 0%,
            rgba(255, 255, 255, 0) 50%
        )
        border-box;
    -webkit-mask: linear-gradient(#fff 0 0) padding-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: destination-out;
    mask-composite: exclude;
    pointer-events: none;
    z-index: 1;
}
.banner-text-block-content{
	position: relative;
	display: flex;
	flex-direction: column;	
	padding-left: var(--main-pad); 
}
.banner-text-block-content h4{
	font-size: 18px;
	line-height: 1;
}
.banner-text-block-content div{
/*	color: var(--white-alpha-color);*/
	line-height: 1.5;	
}
.banner-text-block-content div p{
	margin: 0;
}

.banner-text-line-full{
	position: relative;
	display: flex;
	width: 100%;
	padding: var(--main-pad) var(--main-pad) var(--main-pad) 96px; 
	font-size: 14px;
	color: var(--white-alpha-color);
}

/* BANNER ANIMATION *****************************/

.bg-ani-element{
    position: absolute;
    display: block;
    opacity: 0;
    animation: scale-in-animate 1.0s ease-out forwards;
}
.bg-ani-element span{
    position: relative;
    display: block;
}
.bg-ani-element span img{
    width: 100%;
    height: auto;
}
.bg-main{
    position: absolute;
    display: block;
	background: url(../images/altinstar-mainbanner-background.webp) center bottom no-repeat;
	background-size: cover;
    width: 100%;
    height: 100%;
    z-index: 0;
    animation: banner-bg-animate 30s linear infinite;
}
.bg-1{
    top: 10%;
    left: -7%;
    width: 15%;
}
.bg-2{
    top: 8%;
    left: 33%;
    width: 9%;
    animation-delay: 0.2s;
}
.bg-3{
    top: -8%;
    left: 55%;
    width: 10%;
    animation-delay: 0.1s;
}
.bg-4{
    top: 19%;
    right: 6%;
    width: 7%;
    animation-delay: 0.3s;
}
.bg-5{
    bottom: 15%;
    left: 9%;
    width: 10%;
    animation-delay: 0.1s;
}
.bg-6{
    bottom: 42%;
    left: 42%;
    width: 6%;
    animation-delay: 0.5s;
}
.bg-7{
    bottom: 16%;
    right: 3%;
    width: 8%;
    animation-delay: 0.5s;
}

.bg-1 span{
    animation: bg-element-hover-animate 12s linear infinite;
    animation-delay: 0.5s;
}
.bg-2 span{
    animation: bg-element-hover-animate 11s linear infinite;
    animation-delay: 0.2s;
}
.bg-3 span{
    opacity: 0.64;
    animation: bg-element-hover-animate 12.4s linear infinite;
    animation-delay: 0.1s;
}
.bg-4 span{
    animation: bg-element-hover-animate 11.2s linear infinite;
    animation-delay: 0.3s;
}
.bg-5 span{
    animation: bg-element-hover-animate 12.1s linear infinite;
    animation-delay: 0.7s;
}
.bg-6 span{
    animation: bg-element-hover-animate 10.9s linear infinite;
    animation-delay: 0.5s;
}
.bg-7 span{
    animation: bg-element-hover-animate 11.9s linear infinite;
    animation-delay: 0.6s;
}


@keyframes bg-element-hover-animate {
	0% { transform: translateY(0%) rotate(0deg) scale(1);}
    25% { transform: translateY(7%) rotate(5deg);}
    50% { transform: translateY(0%) rotate(10deg) scale(1.05);}
    75% { transform: translateY(-7%) rotate(5deg);}
	100% { transform: translateY(0%) rotate(0deg) scale(1);}    
}

@keyframes scale-in-animate {
	0% { opacity: 0;
		transform: scale(0.1);
	}
	100% { opacity: 1;
		transform: scale(1);
	}
}

@keyframes banner-bg-animate {
	0% { opacity: 0;
		transform: scale(1);
	}
    2% {
        opacity: 1;
    }
	97% { opacity: 1;
	}
	100% { opacity: 0;
        transform: scale(1.5);
	}
}

.banner-image-animation{
    position: relative;
    display: block;
}
.banner-image-animation > img{
    opacity: 0;
}

.banner-ani-element{
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    opacity: 0;
}
.banner-ani-element span{
    position: relative;
    display: block;
}

.el-1{
    z-index: 2;    
    animation: right-in-animate 0.4s ease-out forwards;
}
.el-2{
    z-index: 3;
    animation: btm-in-more-animate 0.4s ease-out forwards;
    animation-delay: 0.6s;
}
.el-3{
    z-index: 4;
    animation: btm-in-animate 0.3s ease-out forwards;
    animation-delay: 0.3s;
}
.el-4{
    z-index: 5;
    transform-origin: 85% 70%;
	background: url(../images/main-banner/altinstar-mainbanner-eth-shadow.webp) center center no-repeat;
	background-size: cover;
    animation: zoom-in-animate 0.4s ease-out forwards;
    animation-delay: 0.5s;
}
.el-4 span{
    transform-origin: 85% 70%;
    animation: element-hover-animate 7.5s linear infinite;
    animation-delay: 0.6s;
}

.el-5{
    z-index: 5;
    transform-origin: 55% 90%;
    animation: zoom-in-animate 0.4s ease-out forwards;
    animation-delay: 0.5s;
}
.el-5 span{
    transform-origin: 55% 85%;
    animation: element-hover-animate 8.0s linear infinite;
    animation-delay: 0.8s;
}

.el-6{
    z-index: 1;
    animation: right-in-animate 0.4s ease-out forwards;
    animation-delay: 0.4s;
}
.el-6 span{
    transform-origin: 21% 59%;
    animation: cards-animate 5.0s ease-in-out infinite;
    animation-delay: 0.5s;
}
/* .el-6 span:after{
	content: '';
	position: absolute;
	display: block;
	left: 21%;
	top: 59%;
	background: red;
	width: 9px;
	height: 9px;
	z-index: 9;
} */

.el-7{
    z-index: 3;
    animation: top-in-animate 0.4s ease-out forwards;
    animation-delay: 0.4s;
}
.el-7 span{
    transform-origin: 22% 33%;
    animation: element-hover-horizontal-animate 4s linear infinite;    
    animation-delay: 0.4s;
}

.el-8{
    z-index: 1;
    transform-origin: 35% 25%;
    animation: zoom-in-animate 0.7s ease-out forwards;
    animation-delay: 0.3s;
}
.el-8 span{
    transform-origin: 30% 18%;
    animation: element-hover-zoom-animate 8.0s linear infinite;
    animation-delay: 0.8s;
}
.el-9{
    z-index: 4;
    animation: top-in-more-animate 0.4s ease-in-out forwards;
    animation-delay: 0.7s;
}
.el-10{
    z-index: 4;
	background: url(../images/main-banner/altinstar-mainbanner-dice-shadow.webp) center center no-repeat;
	background-size: cover;
    transform-origin: 70% 30%;
    animation: zoom-in-animate 0.4s ease-out forwards;
    animation-delay: 0.6s;
}
/* .el-10 span{
    transform-origin: 75% 26%;
    animation: heartbeat 2.0s ease-in-out infinite both;
    animation-delay: 1.0s;
} */
.el-10 span{
    transform-origin: 75% 26%;
    animation: shake-animate 1.5s linear infinite;
    animation-delay: 1.0s;
}


@keyframes element-hover-zoom-animate {
	0% { transform: translateY(0%) scale(1);}
    25% { transform: translateY(1%);}
    50% { transform: translateY(0%) scale(1.08);}
    75% { transform: translateY(-1%);}
	100% { transform: translateY(0%) scale(1);}    
}
@keyframes element-hover-animate {
	0% { transform: translateY(0%);}
    25% { transform: translateY(1%);}
    50% { transform: translateY(0%);}
    75% { transform: translateY(-1%);}
	100% { transform: translateY(0%);}    
}
@keyframes element-hover-horizontal-animate {
	0% { transform: translateX(0%);}
    25% { transform: translateX(0.3%);}
    50% { transform: translateX(0%);}
    75% { transform: translateX(-0.3%);}
	100% { transform: translateX(0%);}    
}
@keyframes cards-animate {
	0%, 40% { transform: translateX(0%) rotate(0deg);}
    50% { transform: translateX(5%) rotate(60deg);}
	60%, 100% { transform: translateX(0%) rotate(0deg);}    
}

@keyframes flip-vertical {
  0% {
    transform: rotateY(-40deg) perspective(40px);
  }
  100% {
    transform: rotateY(40deg) perspective(40px);
  }
}

/*
@keyframes flip-vertical {
  0% {
    transform: rotateY(0) perspective(40px);
  }
  25% {
    transform: rotateY(-30deg) perspective(40px);
  }
  50% {
    transform: rotateY(0) perspective(40px);
  }
  75% {
    transform: rotateY(70deg) perspective(40px);
  }
  100% {
    transform: rotateY(0) perspective(40px);
  }
}
*/
@keyframes zoom-in-animate {
	0% { opacity: 0;
		transform: scale(0);
	}
	100% { opacity: 1;
		transform: scale(1);
	}
}

@keyframes shake-animate {
    0%, 20%, 80%, 100% { transform: rotate(0deg); }
	30%, 50%, 70% { transform: rotate(5deg);}
	40%, 60% { transform: rotate(-5deg);}
}

@keyframes top-in-more-animate {
	0% { transform:translateY(-40%); opacity: 0;}
	10% { opacity: 1;}
	100% { transform:translateY(0%); opacity: 1;}
}
@keyframes btm-in-more-animate {
	0% { transform:translateY(15%); opacity: 0;}
	30% { opacity: 1;}
	100% { transform:translateY(0%); opacity: 1;}
}

@keyframes heartbeat {
  from {
    transform: scale(1);
    animation-timing-function: ease-out;
  }
  10% {
    transform: scale(0.91);
    animation-timing-function: ease-in;
  }
  17% {
    transform: scale(0.98);
    animation-timing-function: ease-out;
  }
  33% {
    transform: scale(0.87);
    animation-timing-function: ease-in;
  }
  45% {
    transform: scale(1);
    animation-timing-function: ease-out;
  }
}


.banner-img-smoke {
    position: absolute;
    display: block;
    height: 40%;
    width: 20%;
    top: -26%;
    left: 40%;
    z-index: 3;
    transform-origin: 50% 100%;
    opacity: 0;
    animation: opac-in-animate 0.4s ease-out forwards;
    animation-delay: 1s;
/*
    mask-image: linear-gradient(
        to bottom,
        rgba(0, 0, 0, 0) 0%,
        rgba(0, 0, 0, 1) 5%,
        rgba(0, 0, 0, 1) 100%
    );  
*/
    
}

.banner-img-smoke canvas{
    width: 100%;
    height: 100%;
    opacity: 0.5;
}


/* CONTENT BANNER STYLES *****************************/

.content-banner-wrap{
    position: relative;
    display: block;
    padding: 120px 0px;
    z-index: 1;
}

.content-banner{
    position: relative;
    display: flex;
    flex-direction: row;
	margin: 0 var(--main-neg);
}

.banner-blk-txt, .banner-blk-img{
    position: relative;
    display: flex;
    width: 50%;
    padding: 0px var(--main-pad);
    align-content: flex-start;
    align-self: center;
    flex-direction: column;
}
.banner-blk-txt{
	width: 50%;
}
.banner-txt-left .banner-blk-txt{
	padding-right: 144px;
}
.banner-txt-right .banner-blk-txt{
	padding-left: 144px;
/*	margin-left: auto;*/
}
.banner-blk-img{
	width: 50%;
}

.banner-blk-img img{
	height: auto;
	image-rendering: -webkit-optimize-contrast;
}
.content-banner-buttons{
    display: flex;
}
.content-banner-buttons .button{
	margin-right: var(--mid-pad); 
}
.banner-buttons-center{
	justify-content: center;    
}
.content-banner-buttons.banner-buttons-center .button{
    margin: 0 var(--xs-pad);
}

.content-banner-center{
	justify-content: center;
}
.content-banner-center .banner-blk-txt{
	text-align: center;
	width: 60%;
}

.large-quote h2{
	font-weight: 300;
}
.large-quote h2 span{
	font-weight: 900;
}

.download-banner-buttons{
    display: flex;
    justify-content: center;
    margin-bottom: var(--main-pad); 
}
.download-banner-buttons > .button{
    margin: 8px 0px;
}
.download-banner-buttons .banner-app-icons{
    margin: 8px 0px;
    margin-left: 16px;
}

.content-highlight-txt{
    position: relative;
    display: flex;
    background: rgba(223, 119, 0, 0.08);
    padding: 16px 24px;
    text-align: left;
    border-radius: 5px;
}

.content-highlight-txt p{
    margin: 0;
}

.info-banner-blocks{
    position: relative;
    display: flex;
    flex-direction: row;
	flex-wrap: wrap;
	margin: 0 var(--sm-neg);	
}
.info-banner-wrap{
    position: relative;
    display: flex;
	padding: 0 var(--sm-pad); 
	margin-bottom: var(--main-pad); 
}
.info-banner-wrap.info-banner-mid {
	width: 50%;
}
.info-banner-wrap.info-banner-lg {
	width: 100%;
}
.info-banner{
	position: relative;
	display: flex;
	width: 100%;
	padding: var(--lg-pad) var(--main-pad);
	border-radius: var(--main-radius); 
}
.info-banner-wrap .banner-blk-txt{
	font-size: var(--sm-font); 
}
.info-banner-wrap .banner-blk-img{
	height: 100%;
}
.info-banner-wrap .info-img-wrap{
	position: absolute;
	display: block;
	bottom: -48px;
	right: 0;
}
.info-banner-wrap .banner-blk-txt p:last-child{
	margin-bottom: 0;
}
.info-banner-wrap .banner-blk-txt .content-banner-buttons{
	margin-top: var(--lg-pad); 
}
.info-banner-wrap.info-banner-mid .banner-blk-txt{
	width: 64%;
}
.info-banner-wrap.info-banner-mid .banner-blk-img{
	width: 36%;
}
.info-banner-wrap.info-banner-lg .banner-blk-txt{
	width: 50%;
}
.info-banner-wrap.info-banner-lg .banner-blk-img{
	width: 50%;
}
.info-banner-wrap.info-banner-mid .info-img-wrap {
	width: 112%;
}

/* CONTENT STYLES *****************************/

.content-icon-blocks{
	position: relative;
	display: flex;
	margin: 0 var(--main-neg);
}
.icon-block-wrap{
	position: relative;
	display: flex;
	width: 33.3333%;
	padding: 0 var(--main-pad);
}
.icon-block{
	display: flex;
	flex-direction: column;
	background: var(--white-color); 
	overflow: hidden;
	transition: all 0.4s ease-out;
	opacity: 0;
}


.animate .icon-block{
	-webkit-animation: btm-in-animate 0.5s ease-out forwards;
	animation: btm-in-animate 0.5s ease-out forwards;
}

.content-icon-blocks .icon-block-wrap:nth-child(1) .icon-block{
	-webkit-animation-delay: 0.2s;
	animation-delay: 0.2s;
}
.content-icon-blocks .icon-block-wrap:nth-child(2) .icon-block{
	-webkit-animation-delay: 0.4s;
	animation-delay: 0.4s;
}
.content-icon-blocks .icon-block-wrap:nth-child(3) .icon-block{
	-webkit-animation-delay: 0.6s;
	animation-delay: 0.6s;
}


.icon-block:hover{
	border-radius: var(--main-radius); 
	color: var(--white-color); 
/*	background: var(--light-main-color); */
	transition: color 0.4s ease-out;
	
}
.icon-block a{
	transition: color 0.4s ease-out;	
}
.icon-block:hover a{
	color: var(--white-color); 
}
/*
.icon-block:hover a:hover{
	color: var(--sub-color); 
}
*/

.icon-block:after{
	content: '';
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	width: 0%;
	height: 100%;
	z-index: 0;
	border-radius: var(--main-radius); 
	background: url(../images/altinstar-download-card-shape.svg) right bottom no-repeat, linear-gradient(180deg, #29195E 0%, #1D2133 100%) 0% 0% no-repeat;
	background-size: cover;
	transition: all 0.2s ease;
}
.icon-block:hover:after{
	width: 100%;
	transition: all 0.4s ease-in-out;
}

.icon-block-top{
	position: relative;
	display: flex;
	flex-direction: column;	
	padding: var(--lg-pad) var(--lg-pad) 0 var(--lg-pad);
	z-index: 1;
}
.icon-block-btm{
	position: relative;
	display: flex;
	flex-direction: column;	
	padding: var(--sm-pad) var(--lg-pad) var(--lg-pad) var(--lg-pad);
	z-index: 1;
}
.icon-block-top:before,
.icon-block-btm:before{
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	height: 100%;
	width: 4px;
}
.icon-block-top:before{
	background: rgba(26, 21, 46, 0.32);
}
.icon-block-btm:before{
	background: rgba(26, 21, 46, 0.16);
}
.icon-block:hover .icon-block-top:before{
	background: rgba(255, 255, 255, 0.32);
	transition: background 0.4s ease-out;
}
.icon-block:hover .icon-block-btm:before{
	background: rgba(255, 255, 255, 0.16);
	transition: background 0.4s ease-out;
}

.icon-block-icon{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: var(--lg-pad); 
	height: var(--lg-pad); 
	font-size: var(--main-icon-font);
	margin-bottom: var(--main-pad);
}
.icon-block-title{
	padding-right: var(--main-pad);  
}
.icon-block-content{
	margin-bottom: var(--lg-pad);
}
.icon-block-content p{
	margin: 0;
}
.icon-block:hover .l-btn{
	color: var(--text-color); 
	background: var(--sub-color); 
	border: 1px solid var(--sub-color); 
}
.icon-block:hover .l-btn:hover{
	
}
.icon-block-button{
	margin-top: auto;
}

.banner-icon-list{
	position: relative;
	display: flex;
	flex-direction: column;
}
.icon-list-block{
	position: relative;
	display: flex;
	flex-direction: row;
	margin-bottom: var(--lg-pad);
}
.icon-list-icon{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: var(--xl-icon-font); 
	height: var(--xl-icon-font); 
	font-size: var(--mid-icon-font);
	background: var(--light-color); 
	border-radius: 3px;
}

.icon-list-content{
	position: relative;
	display: flex;
	width: calc(100% - var(--xl-icon-font));
	flex-direction: column;
	padding:0 var(--med-pad);  
}

.banner-wave-top,
.banner-wave-btm{
	position: absolute;
	display: block;
	width: 100%;
	height: 20%;
	left: 0;
	z-index: 1;
	pointer-events: none;
}
.banner-wave-top{
	top: -8%;
	background: url(../images/altinstar-top-wave.svg) top center no-repeat;
	background-size: 100% 100%;
}
.banner-wave-btm{
	bottom: -8%;
	background: url(../images/altinstar-botom-wave.svg) bottom center no-repeat;
	background-size: 100% 100%;
}
.banner-shape-left,
.banner-shape-right{
	position: absolute;
	display: block;
	width: 10%;
	height: 80%;
	top: 10%;
	z-index: 1;
	pointer-events: none;	
}
.banner-shape-left{
	left: 0;
	background: url(../images/altinstar-left-shape.svg) left center no-repeat;
	background-size: 100% 100%;
}
.banner-shape-right{
	right: 0;
	background: url(../images/altinstar-right-shape.svg) left center no-repeat;
	background-size: 100% 100%;
}

/* PAGE STYLES *****************************/

.sub-page-menu .container,
.support-page .container{
	max-width: 1296px;
}
#content-wrapper.sub-page-menu {
	margin-top: var(--lg-pad);
}

.page-wrapper{
	padding-top: 48px;
	padding-bottom: 120px;
}
#content-wrapper.support-page-main .page-wrapper{
	padding-top: 96px;
}

.page-back-link{
	position: relative;
	display: flex;
	margin-bottom: var(--lg-pad);
}
.sub-menu-btn,
.page-menu-close-btn{
	display: none;
}

.page-row{
	display: flex;
}

.page-menu-list{
	position: relative;
	display: flex;
	flex-direction: column;
	width: 25%;
	padding-right: var(--lg-pad);
}
.page-body{
	position: relative;
	display: flex;
	flex-direction: column;
	width: 100%;
}
.page-row .page-body{	
	width: 75%;
	padding-left: var(--lg-pad);
}
.page-menu-list:after{
	content: '';
	position: absolute;
	display: block;
	top: 0;
	right: 0;
	width: 1px;
	height: 100%;
	max-height: 400px;
	background: linear-gradient(to bottom, rgba(200,199,205,0) 0%, rgba(200,199,205,1) 24%, rgba(200,199,205,1) 76%, rgba(200,199,205,0) 100%);
}
.page-menu{
	position: relative;
	display: flex;
	flex-direction: column;
	padding: var(--main-pad) 0;
}
.page-menu a{
	position: relative;
	display: block;
	color: var(--text-color);
	font-weight: 400;
	line-height: var(--lg-pad);
	padding: 0 var(--main-pad) 0 calc(var(--main-pad) - 4px);
	border-left: 4px solid var(--white-color);
	background: var(--white-color);
	border-radius: 0 var(--main-radius) var(--main-radius) 0;
    -webkit-transition: all 0.2s ease;
	transition: all 0.2s ease;
}
.page-menu a.active{
	color: var(--text-color);
	border-left: 4px solid var(--sub-color);
	background: var(--light-bg-color);	
    -webkit-transition: all 0.4s ease;
	transition: all 0.4s ease;
}
.page-menu a:hover{
	font-weight: 700;
    -webkit-transition: all 0.4s ease;
	transition: all 0.4s ease;
}

.page-full h2{
	font-size: 26px;
	margin-top: var(--lg-pad);
}
.page-full h3{
	font-size: 20px;
	margin-top: var(--lg-pad);
}
.content-banner-txt a:not(.button),
.help-center-answer a:not(.button),
.page-full a:not(.button){
	font-weight: bold;
  	color: var(--sub-color);
}
.content-banner-txt a:not(.button):hover,
.help-center-answer a:not(.button):hover,
.page-full a:not(.button):hover{
  	color: var(--text-color);
}
.page-full b{
	font-weight: 700;
}
.page-full ul{
	list-style: none;
	padding: 0;
	margin: 0px 0px var(--main-pad) 0px;
}
.page-full ul li{
	position: relative;
	margin: 0px 0px var(--xs-pad) 0px;
	padding: 0px 0px 0px 32px;
}
.page-full ul li:before{
	content: "\f00c";
	position: absolute;
	top: 0px;
	left: 0px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	text-align: center;
	width: var(--main-pad);
	height: var(--main-pad);
	line-height: var(--main-pad);
	color: var(--text-color);
	background: none;
	font-weight: 300;
	font-size: 16px;
	font-family: "Font Awesome 6 Pro";
}


.page-content-banner{
	position: relative;
	display: flex;
	background: url(../images/altinstar-minibanner-v3.jpg) right center no-repeat var(--main-color);
	background-size: cover;
	color: var(--white-color);
	border-radius: var(--main-radius);
	padding: var(--lg-pad);
	margin-bottom: var(--lg-pad);
}
.page-content-banner-text{
	width: 48%;
	font-size: var(--sm-font);
}
.page-content-banner-text h3 {
    font-size: 26px;
}

/* SUPPORT STYLES *****************************/

.support-page{

}
.search-wrapper{
	background: var(--light-color);
}
.support-wrap{
	position: relative;
	display: block;
	padding: 0;
/*	padding: var(--xxl-pad) 0;*/
}
.support-wrap-main{
	position: relative;
	display: block;
	padding: var(--xxl-pad) 0;
}

.search-top{
	position: relative;
	color: var(--white-color); 
	background: var(--light-main-color); 	
	background: url(../images/altinstar-web-support-bg.jpg) center no-repeat var(--light-main-color);
	background-size: cover;
	padding: 96px 0 208px 0;
	text-align: center;
}
.search-blk-center{
	width: 80%;
	margin: 0 auto;
}
.search-blk-center h1{
	font-size: 44px;
	font-weight: 700;
}
.search-blk-center .sub-title{
	color: var(--white-alpha-color); 
}
.banner-main-search{
	padding: 0 20%;
}
.banner-search-bar{
	position: relative;
}
.banner-search-bar .form-control{
	height: var(--lg-pad);
	padding: var(--sm-pad) var(--main-pad) var(--sm-pad) var(--lg-pad);
	border-radius: var(--main-radius); 
	box-shadow: none;
	border: 1px solid var(--white-color);
}
.banner-search-bar .form-control:focus{
	border: 1px solid var(--sub-color);	
}
.banner-search-bar .banner-search-btn{
	position: absolute;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	top: 0;
	left: 0;
	width: var(--lg-pad); 
	height: var(--lg-pad); 
	font-size: var(--icon-font);	
	background: transparent;
	border: none;
}
.support-blocks{
	position: relative;
	display: flex;
	flex-direction: column;
	margin-top: -176px;
}
.support-blocks .container,
.support-wrap .container{
	position: relative;
}
.support-blocks-wrapper{
	position: absolute;
	position: relative;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	width: 80%;
	top: 48px;
	left: 10%;
	margin: 0;
}

.support-block{
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: 33.3333%;
	padding: var(--sm-pad);
}
.support-block a{
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
	padding: var(--lg-pad);
	background: var(--white-color); 
	border-radius: var(--main-radius);
	box-shadow: 0px 8px 24px rgba(0, 0, 0, 0.08);
	text-decoration: none;
}
.support-block a,
.support-category-block a{
	color: var(--text-color);
	transform: translateY(0);
	transition: all 0.2s ease;	
}

.support-block a:hover,
.support-category-block a:hover{
    color: var(--sub-color);
	box-shadow: 0px 8px 32px rgba(0, 0, 0, 0.32);
	transform: translateY(-4%);
	transition: all 0.4s ease-out;
}


.support-block-icon{
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: var(--lg-pad); 
	height: var(--lg-pad); 
	font-size: var(--xl-icon-font);	
	margin-bottom: var(--main-pad);
	transform: translateY(0);
	transition: transform 0.2s ease;
}
.support-block a:hover .support-block-icon{
	transform: translateY(-6%);
	transition: transform 0.4s ease-out;
}

.support-block-title{
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 20px;
	font-weight: 700;
}

.support-categories{
	position: relative;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
}

.support-category-block{
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: 25%;
	padding: var(--sm-pad);	
}
.support-category-title{
	width: 100%;
	padding: 0 12px;
}
.support-categories .support-category-block:first-child{
	width: 50%;
}
.support-category-block a{
	position: relative;
	display: flex;
	flex-direction: column;
	width: 100%;
	height: 100%;
	padding: var(--main-pad);
	background: var(--white-color); 
	border-radius: var(--main-radius);
	box-shadow: 0px 8px 24px rgba(0, 0, 0, 0.08);
	text-decoration: none;
}
.support-category-icon{
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	align-self: flex-start;
	width: var(--lg-pad); 
	height: var(--lg-pad); 
	font-size: var(--main-icon-font);	
	margin-bottom: var(--lg-pad);
	color: var(--sub-color); 
}
.support-category-block-text{
	font-size: var(--sm-font);
}
.support-category-block-text p{
	margin: 0;
}

#banner-search-empty{
	color: rgba(26, 21, 46, 0.48);
}

.help-center-main {
	padding: var(--lg-pad) 20%;
	margin: 0 auto;
}
.support-wrap .help-center-main {
	padding: var(--xl-pad) 20%;
}
.help-center-no-results{
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	padding: 0 var(--lg-pad);
	color: var(--white-color);
	margin-bottom: var(--main-pad);
}
.help-center-no-results-img{
	position: relative;
	display: flex;
	margin: 0 auto var(--main-pad) auto;
}
.help-center-no-results-img img{
	height: 96px;
	width: auto;
}
.help-center-no-results-title{
	font-weight: 700;
	font-size: 18px;
}
.help-center-result-amount{
	position: relative;
	text-align: center;
	margin-bottom: var(--main-pad);
	color: var(--white-color);
}
.help-center-result-amount span{
	font-weight: 700;
}
.help-center-main .help-center-block{
	position: relative;
	display: block;
	padding: var(--main-pad) var(--lg-pad);
	border-radius: 7px;
	background: var(--white-color);
	box-shadow: 0px 8px 24px rgba(0, 0, 0, 0.08);
	margin-bottom: var(--main-pad);
}
.support-wrap .help-center-result-amount,
.support-wrap .help-center-no-results{
	color: var(--text-color);
}
.help-center-main .help-center-title{
}
.help-center-main .help-center-title div{
	font-size: 14px;
	font-weight: 400;
}
.help-center-main .help-center-title span{
	position: relative;
	display: block;
	font-weight: 700;
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 20px;
	margin-bottom: 8px;
}
.help-center-main .help-center-answer{
	position: relative;
	font-size: 14px;
}
.help-center-main .help-center-answer p:last-child{
	margin-bottom: 0px;
}

.content-table{
	position: relative;
	display: flex;
	flex-direction: column;
	margin-bottom: var(--main-pad);
}
.content-table-row{
	position: relative;
	display: flex;
}
.content-table-col{
	position: relative;
	display: flex;
	width: 36%;
}
.content-table-header{
	font-weight: 700;
}

.search-main{

}
.show-search .support-blocks-wrapper{
/*	display: none;*/
	position: absolute;
	opacity: 0;
	pointer-events: none;
	animation: wrapper-out-animate 0.2s ease-out forwards;
}
.show-search .support-wrap-main{
	position: absolute;
	opacity: 0;
	pointer-events: none;
	animation: wrapper-out-animate 0.2s ease-out forwards;
}
.show-search #search-results{
	opacity: 0;
	min-height: 420px;
	animation: wrapper-in-animate 0.3s ease-out forwards;
	animation-delay: 0.2s;
}
.show-search .support-wrap #search-results{
	min-height: 560px;	
}

@keyframes wrapper-out-animate {
	0% {
		opacity: 1;
		transform: translateY(0px);
	}

	100% {
		opacity: 0;
		transform: translateY(120px);
	}
}

@keyframes wrapper-in-animate {
	0% {
		opacity: 0;
		transform: translateY(120px);
	}

	40% {
		opacity: 0;
	}

	100% {
		opacity: 1;
		transform: translateY(0px);
	}
}

.support-menu-bar-wrapper{
	position: relative;
	display: block;
	width: 100%;
	border-bottom: 1px solid var(--light-color);
}

.sub-page-menu .support-menu-bar-wrapper,
.support-page-main .support-menu-bar-wrapper{
	position: fixed;
	top: 80px;
	left: 0;
	background: var(--white-color);
	z-index: 2;
}

.search-top .support-menu-bar-wrapper{
	position: absolute;
	left: 0;
	bottom: 0;
	background: rgba(26, 21, 46, 0.48);
	border-bottom: 0px;
}
.support-menu-bar{
	position: relative;
	display: flex;
}
.support-menu-bar a{
	position: relative;
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	width: 16.6666%;
	line-height: var(--main-pad); 
	padding: var(--mid-pad) var(--mid-pad); 
	color: var(--text-color);
	transition: color 0.2s ease;
}
.support-menu-bar a:after{
	content: '';
	display: block;
	position: absolute;
	right: 0;
	top:var(--mid-pad); 
	height: var(--main-pad); 
	width: 1px;
	background: var(--light-color); 
}
.support-menu-bar a:last-child:after,
.search-top .support-menu-bar a:after{
	display: none;
}
.search-top .support-menu-bar a{
	flex-direction: column;
	padding: var(--main-pad); 
}
.search-top .support-menu-bar a{
	color: var(--white-color);
}
.support-menu-bar a:hover{
	color: var(--sub-color);
	transition: color 0.4s ease-out;
}
.support-menu-bar a div{
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: var(--main-pad); 
	height: var(--main-pad); 
	font-size: var(--main-font); 
	margin-right: var(--sm-pad);
}
.search-top .support-menu-bar a div{
	margin-right: 0;
	margin-bottom: var(--xs-pad);
}
.support-menu-bar a span{
	white-space: nowrap;
	font-weight: 500;
	font-size: var(--sm-font); 
}

/* ACCORDION *****************************/
.accordion-item{
	position: relative;
	border: none;
	border-bottom: 1px solid var(--light-border-color);
	margin-bottom: var(--main-pad);
	margin-bottom: 0;
	border-radius: 0;
}
.accordion-item:first-of-type {
    border-top: 1px solid var(--light-border-color);
	border-radius: 0;
}
.accordion-item:last-of-type {
	border-radius: 0;
}
.accordion-button{
	border: none;
	background: none;
	padding: var(--mid-pad) 0;
	line-height: var(--med-pad);
	outline: none;
	border-radius: 0;
	font-weight: 700;
	color: var(--text-color);
	font-size: var(--lg-font); 
}
.accordion-button:not(.collapsed) {
    color: var(--text-color);
    background-color: var(--white-color);
	outline: 0;
    box-shadow: none;
	border-radius: 0;
}
.accordion-button:hover,
.accordion-button:focus {
    outline: 0;
    box-shadow: none;
	border-radius: 0;
	color: var(--sub-color);
}
.accordion-item:last-of-type .accordion-button.collapsed{
	border-radius: 0;
}
.accordion-button:after{
	content: "\f107";
	position: absolute;
	top: 20px;
	right: 8px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	text-align: center;
	width: var(--main-pad);
	height: var(--main-pad);
	line-height: var(--main-pad);
	color: var(--text-color);
	background: none;
	font-weight: 300;
	font-size: var(--icon-font);
	font-family: "Font Awesome 6 Pro";
    transition: transform .2s ease-in-out;
}
.accordion-button:not(.collapsed):after {
	background: none;
    transform: rotate(-180deg);
}

.dark-support .accordion-item{
	border-bottom: 1px solid var(--white-alpha-color);
	background: none;
}
.dark-support .accordion-item:first-of-type {
    border-top: 1px solid var(--white-alpha-color);
}
.dark-support .accordion-button{
	color: var(--white-color);
}
.dark-support .accordion-button:not(.collapsed) {
    color: var(--white-color);
    background: none;
}
.dark-support .accordion-button:hover,
.dark-support .accordion-button:focus {
	color: var(--sub-color);
}
.dark-support .accordion-button:after{
	color: var(--white-color);
}


/* DOWNLOAD PAGE *****************************/

#download-page-top{
	background: var(--light-bg-color); 
	background: url(../images/altinstar-web-bg-download-bg.jpg) center bottom no-repeat; 
	background-size: cover;
	min-height: 84vh;
	min-height: 880px;
	min-height: 960px;
}
#download-page-top:before,
#download-page-top:after{
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
#download-page-top:before{
	z-index: 0;
	background: linear-gradient(180deg, #FFFFFF 0%, #E7E4EB 100%) 0% 0% no-repeat;
	mix-blend-mode: multiply;
}
#download-page-top:after{
	z-index: 1;
	background: url(../images/altinstar-web-bg-download.png) center bottom no-repeat; 
	background-size: cover;
}

#download-page-top .container{
	position: relative;
	z-index: 2;
}

#download-page-1{
	padding-bottom: 0;
}
#download-page-1 .content-banner{
	justify-content: center;
}

#download-page-3{
	color: var(--white-color); 
	background: var(--light-main-color); 	
	background: url(../images/altinstar-bg-track-transactions.png) right center no-repeat, linear-gradient(113deg, #29195E 0%, #1D2133 100%) 0% 0% no-repeat; 
	background-size: contain;
	padding-top: 240px;
	padding-bottom: 240px;	
}
#download-page-3 .content-banner{
	justify-content: center;
}
#download-page-3 .content-banner-title{
	margin-bottom: var(--main-pad);
}
#download-page-3 .support-center-wrap{
	width: 60%;
}
#download-page-4{
	padding: 192px 0px;
}


/* CRYPTO PAGE *****************************/

#crypto-page-top{
	background: var(--light-bg-color); 
	background: url(../images/altinstar-crypto-main-bg.jpg) center bottom no-repeat var(--light-bg-color); 
	background-size: cover;
/*	min-height: 84vh;*/
	color: var(--white-color); 
	padding: 192px 0px 0px 0px;
}
#crypto-page-top .content-banner-center{
	flex-direction: column;
}
#crypto-page-top .content-banner-center .banner-blk-txt {
    width: 80%;
	margin-bottom: var(--xxl-pad);
}
#crypto-page-top .content-banner-center .banner-blk-txt .content-banner-txt{
    padding: 0 8%;
}
#crypto-page-top .content-banner-center .banner-blk-img {
    width: 72%;
	flex-direction: row;
    justify-content: center;
}
#crypto-page-top h1{
	font-weight: 300;
}
#crypto-page-top h1 span{
	font-weight: 900;
}
#crypto-page-1{
	background: transparent linear-gradient(180deg, #E7E4EB 0%, #FFFFFF 100%) 0% 0% no-repeat padding-box;
	padding: 192px 0px 96px 0px;
}
#crypto-page-3{
	padding: 0;
}


/* CONTACT PAGE *****************************/

#contact-banner-form{
	background: var(--light-bg-color);
	background: url(../images/altinstar-web-bg-download-bg.jpg) center top no-repeat var(--light-bg-color); 
	background-size: cover;
/*	min-height: 80vh;*/
	padding-bottom: 0;
	overflow: hidden;
}
#contact-banner-form:before{
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 0;
	background: linear-gradient(180deg, #FFFFFF 0%, #E7E4EB 100%) 0% 0% no-repeat;
	mix-blend-mode: multiply;
}
/*
#contact-banner-form .content-banner{
	flex-direction: column;
	justify-content: flex-end;
}
*/
.contact-banner-wrap{
	position: relative;
	display: block;
	width: 44%;
/*	background: var(--white-color);*/
}
.content-form{
	position: relative;
	display: block;
	padding: var(--lg-pad); 
	border-radius: 5px 5px 0px 0px;
	background: var(--white-color);
	box-shadow: 0px 12px 32px rgba(29, 24, 49, 0.08);
	z-index: 2;	
}
.contact-shadow{
	content: '';
	display: block;
	position: absolute;
	height: 100%;
	width: 100%;
	left: 0;
	top: 8%;
	border-radius: 5px 5px 0px 0px;
	background: var(--white-color);
	box-shadow: 0px 12px 32px rgba(29, 24, 49, 0.08);
	transform: perspective(1000px) rotateX(-12deg);	
	z-index: 1;
}
.contact-shadow-behind{
	content: '';
	display: block;
	position: absolute;
	height: 100%;
	width: 100%;
	left: 0;
	top: 16%;
	border-radius: 5px 5px 0px 0px;
	background: var(--white-color);
	box-shadow: 0px 12px 32px rgba(29, 24, 49, 0.08);
	transform: perspective(1000px) rotateX(-20deg);	
	z-index: 0;
}

.contact-avatars{
	position: absolute;
	width: 100%;
	bottom: 0;
	left: 0;
	height: 100%;
	z-index: 0;
}
.contact-avatar{
	position: absolute;
	display: block;
	width: 26%;
	bottom: 0;
}
.contact-avatar img{
	image-rendering: -webkit-optimize-contrast;
}
.ca-1{
	left: 1%;
	z-index: 1;
	transform: translateX(180%);
}
.ca-2{
	left: 8%;
	width: 32%;
	z-index: 2;
	transform: translateX(90%);
}
.ca-3{
	right: 8%;
	width: 32%;
	z-index: 2;
	transform: translateX(-90%);
}
.ca-4{
	right: 1%;
	z-index: 1;
	transform: translateX(-180%);
}
.animate .ca-1{
	transform: translateX(0%);
	transition: all 0.8s ease-out;
}
.animate .ca-2{
	transform: translateX(0%);
	transition: all 0.8s ease-out;
}
.animate .ca-3{
	transform: translateX(0%);
	transition: all 0.8s ease-out;
}
.animate .ca-4{
	transform: translateX(0%);
	transition: all 0.8s ease-out;
}

/* SHOP STYLES *****************************/


.language-select button{
	background: none;
	padding: 8px 20px!important;
	margin: 0px!important;
	line-height: 20px!important;
	color: #FFFFFF;
/*	font-family: 'Roboto Condensed', sans-serif;*/
	border:2px solid #FFF;
	border-radius: 20px;
    min-width: 110px;
}
.language-select button .caret{
	margin-left: 5px;
}
.language-select .dropdown-toggle .dt-down{
	margin-left: 5px;
}
.language-select .language-select .dropdown-menu {
	min-width: inherit;
    width: 100%;
    padding:0px;
    margin: 5px 0px;
    font-size: 16px;
    text-align: left;
    list-style: none;
    background: none;
    border:0px;
    border-radius: 20px;
    box-shadow: none!important;
	overflow: hidden;
}
.language-select .dropdown-menu > li{
    margin-bottom: 4px;
}
.language-select .dropdown-menu > li > a {
/*	font-family: 'Roboto Condensed', sans-serif;*/
	font-family: 'Cabin Condensed', sans-serif;
    display: block;
 	padding: 8px 20px;
    clear: both;
    font-weight: 400;
    line-height: 20px;
    color: #FFFFFF;
    border:2px solid #FFF;
	border-radius: 20px;
	background: none;
	text-decoration: none;
    text-align: center;
/*
    -webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175);
    box-shadow: 0 6px 12px rgba(0,0,0,.175);
*/
}
.shop-body .language-select .dropdown-menu > li > a {
	color: #000;
}
.language-select button:hover, .dropdown-menu > li > a:hover{
	color: #000;
	background: #FFF;
	transition: all 0.2s;
}
.language-select .dropdown-toggle:after{
	display: none;
}


.shop-body{
    background: #edf1f2;
    background: url(../images/altinstar-shop-bg.jpg) #edf1f2 top right no-repeat;
    background-size: contain;
}
#shop-wrapper{
/*    background: #edf1f2;*/
    min-height: 100vh;
}

#shop-header{
    position: relative;
    display: block;
    z-index: 2;
}
.shop-body #footer{
	border: none;
	margin: var(--lg-pad) 0;
}

#shop-header .logo-main{
	position: absolute;
    padding: 20px 40px;
	margin: 0;
    background: none;
    left: 0;
}
#shop-header .logo-main img{
    height: 28px;
    width: auto;
}
#shop-header .language-select {
    float: right;
    margin: 20px 40px 20px 40px;
}
.shop-content{
    position: relative;
    display: block;
    text-align: center;
/*    margin-bottom: 180px;*/
    padding-top: 180px;
    font-family: 'Montserrat', Arial, Helvetica, sans-serif;
}
.shop-content h1{
    font-size: 28px;
    font-weight: 300;
    font-family: 'Montserrat', Arial, Helvetica, sans-serif;
    margin-bottom: 40px;
}
.shop-content .content{
	margin-bottom: var(--xl-pad);
}

#altin-status{
    position: relative;    
}
.payment-status {
    position: relative;
    display: block;
    margin: 0px 0px 30px 0px;
    padding: 30px;
    background: #FFFFFF;
    border-radius: 5px;
    box-shadow: 15px 30px 40px 10px rgba(0,0,0,0.1);
/*    font-size: 20px;*/
    border: 1px solid #FFFFFF;
}
.payment-status h2{
    margin-bottom: 20px;
    font-size: 24px;
    font-family: 'Montserrat', Arial, Helvetica, sans-serif;
    font-weight: 400;
    color: #f1ac1e;
}

.api-override{
    display: none;
}
.payment-status.loading{
    
}
.payment-status.status-cancelled, .payment-status.error{

}
.payment-status.status-completed{

}
.payment-status.status-init{
    
}

.payment-status .btn-main{
    display: inline-block;
    width: initial;
}
.payment-status .btn-main:hover{
    background: none;
    color: #f1ac1e;
    background: #FFFFFF;
    border: 1px solid #f1ac1e;
    transition: all ease 0.3s;
}
.payment-status .pay-ok, .payment-status .pay-error{
    display: inline-block;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    border: 1px solid #CCC;
    background: url(../images/checkmark.svg) center center no-repeat;
    background-size: 40px;
    margin-bottom: 20px;
}
.payment-status .pay-error{
    background: url(../images/exclamation.svg) center center no-repeat;
    background-size: 16px;
}

.shop-products{
    display: flex;
	flex-wrap: wrap;
	justify-content: center;
	padding: 0 6%;
}

.altin-product-wrap{
    display: flex;
    width: 33.33%;
    padding: 30px;
    opacity: 0;
    -webkit-animation: btm-in-animate 0.5s ease-out forwards;
	animation: btm-in-animate 0.5s ease-out forwards;
}

.shop-products .altin-product-wrap:nth-child(2){
    -webkit-animation-delay: 0.3s;
    animation-delay: 0.3s;
}
.shop-products .altin-product-wrap:nth-child(3){
    -webkit-animation-delay: 0.6s;
    animation-delay: 0.6s;
}

.altin-product {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    padding: 30px;
    background: #FFFFFF;
    border-radius: 5px;
    box-shadow: 15px 30px 40px 10px rgba(0,0,0,0.1);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transition: color ease-out 0.2s;
    transition: color ease-out 0.2s;
}
.altin-product:before{
    content: '';
    display: block;
    position: absolute;
    z-index: 0;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    border-radius: 5px;
    opacity: 0;
    background: rgba(241,171,30,1);
    background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(241,171,30,1)), color-stop(100%, rgba(224,158,25,1)));
    background: -webkit-linear-gradient(-45deg, rgba(241,171,30,1) 0%, rgba(224,158,25,1) 100%);
    background: linear-gradient(135deg, rgba(241,171,30,1) 0%, rgba(224,158,25,1) 100%);
    transition: opacity ease-out 0.2s;
}
.product-image{
    position: relative;
    display: block;
    text-align: center;
    margin: 20px 50px 20px 50px;
}
.product-image img{
    position: relative;
    display: block;
    max-width: 100%;
    -webkit-transition: all ease-out 0.2s;
    transition: all ease-out 0.2s;
}
.product-text{
    position: relative;
    display: block;
    z-index: 1;
}
.product-title{
    font-size: 24px;
    font-weight: 300;
    text-align: left;
    margin: 0px 0px 20px 0px;
}
.product-title span{
    font-weight: 700;
}
.product-list{
    font-weight: 300;
    margin: 0px 0px 30px 0px;
    padding: 0px;
    list-style: none;
    text-align: left;
}
.product-list li{
    position: relative;
    display: block;
    padding-left: 40px;
    background: url(../images/checkmark.svg) left center no-repeat;
    background-size: 18px;
    line-height: 1.8;
}

.product-bottom{
    display: flex;
    align-self: flex-end;
    margin-top: auto;
    flex-direction: column;
    width: 100%;
}
.product-price{
    position: relative;
    display: block;
    font-size: 28px;
    font-weight: 700;
    color: #f1ac1e;
    margin-bottom: 20px;
}

.product-old-price{
    position: relative;
    display: inline-block;
    font-weight: 300;
    color: #CCC;
    margin-right: 20px;
}
.product-old-price:after{
    position: absolute;
    display: block;
    content: '';
    height: 1px;
    width: 110%;
    left: -5%;
    top: 50%;
    background: #f1ac1e;
    -webkit-transform: rotate(-15deg);
	transform: rotate(-15deg);
}

.product-bottom-bar{
    position: relative;
    display: flex;
    flex-direction: row;
}
.product-input{
    display: flex;
    width: 60px;
}
.product-input input{
    width: 40px;
    height: 40px;
    padding: 10px 5px;
    text-align: center;
    border-radius: 5px;
    box-shadow: none;
    -webkit-transition: all ease-out 0.2s;
    transition: all ease-out 0.2s;
}
.product-input input::-webkit-outer-spin-button,
.product-input input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.product-input input[type=number] {
    -moz-appearance:textfield; /* Firefox */
}
.product-button{
    display: flex;
    width: calc(100% - 60px);
}
.product-button{
	opacity: 0.4;
	cursor: default;
	pointer-events: none;
	user-select: none;
}
.btn-main{
    position: relative;
    display: block;
    background: #f1ac1e;
    color: #000000;
    border: none;
    border: 1px solid #f1ac1e;
    border-radius: 5px;
    height: 40px;
    padding: 0px 20px;
    margin: 0px;
    width: 100%;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    z-index: 2;
    cursor: pointer;
    -webkit-transition: all ease-out 0.2s;
    transition: all ease-out 0.2s;
}
.footer-shop{
    font-family: 'Roboto', Arial, Helvetica, sans-serif;
    text-align: center;
	font-size: 14px;
    color: rgba(0,0,0,0.6);
}

.footer-shop-icons{
    position: relative;
    display: block;
    padding: 0;
    margin: 0px 0px 30px 0px;
    list-style: none;
    text-align: center;
}
.footer-shop-icons li{
    display: inline-block;
    margin: 0;
    padding: 0 8px;
}
.footer-shop-icons li img{
    height: 24px;
    width:auto;
}

.footer-shop a{
    color: rgba(0,0,0,0.6);
}


/* CONTENT OVERRIDES *****************************/

#content-home-3{
	color: var(--white-color); 
	background: var(--light-main-color); 	
/*	background: url(../images/altinstar-dots-bg.png) right center no-repeat var(--light-main-color); */
	background: url(../images/altinstar-bg-track-transactions.png) right center no-repeat, linear-gradient(113deg, #29195E 0%, #1D2133 100%) 0% 0% no-repeat; 
	background-size: cover;
	
	padding-top: 240px;
	padding-bottom: 240px;
}

#content-home-4 .content-banner-center{
	margin-bottom: 120px;
}
#content-home-4 .info-banner h3{
	font-size: 26px;
}
#content-home-4 .info-banner-wrap.info-banner-mid .info-banner{
	background: var(--light-main-color); 
	background: url(../images/altinstar-card-shape-1.svg) right bottom no-repeat, linear-gradient(90deg, #1D2133 0%, #29195E 100%) 0% 0% no-repeat;
	background-size: contain;
	color: var(--white-color); 
}
#content-home-4 .info-banner-blocks .info-banner-wrap.info-banner-mid:nth-child(2) .info-banner{
	background: url(../images/altinstar-card-shape-2.svg) left bottom no-repeat, linear-gradient(90deg, #29195E 0%, #1D2133 100%) 0% 0% no-repeat;
	background-size: contain;
}
#content-home-4 .info-banner-wrap.info-banner-lg .info-banner,
#download-page-4 .info-banner-wrap.info-banner-lg .info-banner{
	background: var(--light-color); 
	background: linear-gradient(70deg, #E7E4EB 30%, #A890C7 100%) 0% 0% no-repeat;
	overflow: hidden;
}
#content-home-4 .info-banner-wrap.info-banner-lg .info-img-wrap,
#download-page-4 .info-banner-wrap.info-banner-lg .info-img-wrap{
/*	right: -40%;*/
	width: 72%;
}

/* CONTENT ANIMATION OVERRIDES *****************************/

#content-home-2 .banner-blk-img,
#content-home-2 .banner-blk-txt,
#content-home-3 .banner-blk-img,
#content-home-3 .banner-blk-txt,
#content-home-4 .banner-blk-txt,
#content-home-4 .info-img-wrap,
#banner-device .banner-blk-txt, 
#banner-tavla .banner-blk-txt, 
#banner-mobile .banner-blk-txt{
	opacity: 0;
}
#content-home-4 .info-banner-blocks .info-banner-wrap:nth-child(2) .banner-blk-txt,
#content-home-4 .info-banner-blocks .info-banner-wrap:nth-child(2) .info-img-wrap{
	-webkit-animation-delay: 0.2s;	
	animation-delay: 0.2s;	
}
#content-home-4 .info-banner-blocks .info-banner-wrap:nth-child(3) .banner-blk-txt,
#content-home-4 .info-banner-blocks .info-banner-wrap:nth-child(3) .info-img-wrap{
	-webkit-animation-delay: 0.4s;	
	animation-delay: 0.4s;	
}

#content-home-2.animate .banner-blk-img,
#content-home-3.animate .banner-blk-img,
#content-home-4.animate .banner-blk-txt{
	-webkit-animation: opac-in-animate 0.5s ease-in forwards;
	animation: opac-in-animate 0.5s ease-in forwards;
}

#content-home-2.animate .banner-blk-txt,
#content-home-3.animate .banner-blk-txt{
	-webkit-animation: btm-in-animate 0.4s ease-out forwards;
	animation: btm-in-animate 0.4s ease-out forwards;
}
#content-home-4.animate .info-img-wrap{
	-webkit-animation: right-in-animate 0.4s ease-out forwards;
	animation: right-in-animate 0.4s ease-out forwards;	
}
#banner-device.animate .banner-blk-txt,
#banner-tavla.animate .banner-blk-txt,
#banner-mobile.animate .banner-blk-txt{
	-webkit-animation: left-in-animate 0.4s ease-out forwards;
	animation: left-in-animate 0.4s ease-out forwards;	
}



/* MODULE STYLES *****************************/

#banner-device{
	color: var(--white-color); 	
	background: url(../images/altinstar-devices-footer-banner-v2.jpg) right center no-repeat; 
	background-size: cover;
	padding-top: 240px;
	padding-bottom: 240px;
}
#banner-device .content-banner-title,
#banner-tavla .content-banner-title,
#banner-mobile .content-banner-title{
	text-shadow: 0px 0px 8px rgba(0, 0, 0, 0.16);
}
#banner-device .banner-blk-txt,
#banner-tavla .banner-blk-txt,
#banner-mobile .banner-blk-txt{
	width: 44%;
}
#banner-tavla{
	color: var(--white-color); 	
	background: url(../images/altinstar-banners-footer-v2.jpg) right center no-repeat; 
	background-size: cover;
	padding-top: 240px;
	padding-bottom: 240px;
}
#banner-mobile{
	color: var(--white-color); 	
	background: url(../images/altinstar-mobile-footer-banner-v3.jpg) right center no-repeat; 
	background-size: cover;
	padding-top: 240px;
	padding-bottom: 240px;
}



/* FOOTER STYLES *****************************/

#footer{
	position: relative;	
	border-top: 1px solid var(--light-color);
}
.footer-content{
	position: relative;
	display: flex;
	padding: var(--xl-pad) 0px;
	margin: 0 var(--lg-neg);
}
.footer-logo-block{
	position: relative;
	display: flex;
	flex-direction: column;
	padding: 0 var(--lg-pad);
	width: 25%;
}
.footer-logo-block p{
	font-size: 14px;
}
.footer-app-icons,
.banner-app-icons{
	position: relative;
	display: flex;
	margin-top: 12px;
}
/*
.banner-app-icons{
	display: none;
}
*/
.footer-app-icon-block,
.banner-app-icon-block{
	position: relative;
	display: flex;
}
.app-icon{
	position: relative;
	display: flex;
	margin-right: var(--mid-pad);
	opacity: 1;
	transition: all 0.2s ease;
}
.app-icon img{
	height: 40px;
	width: auto;
}
.banner-app-icon-block .app-icon img{	
	height: 48px;;
}
.app-icon:hover{
	opacity: 0.64;
	transition: all 0.4s ease;
}
.footer-menu{
	position: relative;
	display: flex;
	flex-direction: column;
	padding: 0 var(--lg-pad);
	width: 25%;
}
.footer-social{
	position: relative;
	display: flex;
	flex-direction: column;
	width: 25%;
}
.footer-logo{
	position: relative;
	display: block;
	margin-bottom: var(--mid-pad);
}
.footer-logo img{
	height: 24px;
	width: auto;
}
.footer-menu-title{
	position: relative;
	display: block;
	margin-bottom: var(--mid-pad);
}
.footer-content h4{
	font-size: 18px;
}

.footer-menu-list{
	position: relative;
	display: flex;
	flex-direction: column;
	padding: 0;
	list-style: none;
}
.footer-menu-list li{
	line-height: 24px;
	margin-bottom: var(--mid-pad);
}
.footer-menu-list a{
	font-size: var(--sm-font);
	font-weight: 400;
	padding-left: 0;
	transition: color ease 0.2s, padding ease 0.2s;
}
.footer-menu-list a:hover{
	padding-left: 8px;
	color: var(--sub-color);
	transition: color ease-out 0.4s, padding ease-out 0.4s;
}

.footer-social-links{
	position: relative;
	display: flex;
	list-style: none;
	margin: 0;
	padding: 0;
}
.footer-social-links li{
	position: relative;
	display: flex;
	padding: 0;
	margin: 0 var(--main-pad) 0 0;
}
.footer-social-links li a{
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;
	padding: 0;
	height: var(--main-pad);
	width: var(--main-pad);	
	line-height: var(--main-pad);
	color: var(--text-color);
	font-size: var(--icon-font);
	text-decoration: none;
	transition: color ease 0.2s;
}
.footer-social-links li a:hover{
	color: var(--sub-color);
	transition: color ease-out 0.4s;
}

.footer-copyright{
	position: relative;
	display: flex;
	flex-direction: column;
	width: 100%;
	font-size: 12px;
	padding: var(--xl-pad) 0px;
	text-align: center;
	justify-content: center;
	border-top: 1px solid var(--light-color);
}

.footer-copyright-logo{
	position: relative;
	margin-bottom: var(--mid-pad);
}
.footer-copyright-logo img{
	height: 16px;
	width: auto;
}

.footer-copyright-links{
	position: relative;
	display: flex;	
	margin: var(--xs-pad) auto var(--main-pad) auto; 	
}
.footer-copyright-links a{
	position: relative;
	padding: 0 var(--mid-pad);
	line-height: var(--main-pad);
}
.footer-copyright-links a:after{
	content: '';
	position: absolute;
	display: block;
	height: 16px;
	width: 1px;
	top: 4px;
	left: 0;
	background: var(--light-color);
}
.footer-copyright-links a:first-child:after{
    display: none;
}

.footer-copyright-extra{
	position: relative;
	width: 50%;
	margin: 0 auto;
}

/* EMPTY/ERROR PAGE STYLES *****************************/

.empty-page{
    display: none;
    height: 70vh;
    flex-direction: column;
    justify-content: center;
    background: var(--white-color);
}
.show-page.empty-page{
    display: flex;
}

.error-page .empty-page{
	display: flex;
	width: 100%;
}

.empty-page-msg{
    width: 40%;
    align-self: center;
    text-align: center;
}
.empty-page-img{
    position: relative;
    margin-bottom: 24px;
    padding: 0 25%;
}
.empty-page-img span img{
	height: 240px;
	width: auto;
}
.empty-page-img div{
	margin-top: -16px;
}
.empty-page-img div img{
	height: 48px;
	width: auto;
}
.empty-page-txt{

}
.empty-page-title{
    font-size:40px;
    font-weight: 900;
    line-height: 1.4;
    margin-bottom: 1.2rem;
    margin-bottom: var(--sm-pad);
}
.empty-page-txt p{
    color: var(--grey-color);
}

/* MODAL STYLES *****************************/

body.modal-open  {
	padding: 0px!important;
	overflow-y: hidden;
}
.modal-backdrop {
    background: #FFFFFF;
    background: #1A152E;
}
.modal-backdrop.in {
    opacity: 0.9;
}
.modal-backdrop.show{
    opacity: 0.9;
}
.modal{
	z-index: 9999;
}
.modal-open .modal{
/*
    text-align: center;
    display: flex;
    flex-direction: row;
    justify-content: center;
    height: 100%;
*/
}
.modal.modal-static .modal-dialog {
    -webkit-transform: none;
    transform: none;
}

.modal-dialog {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
    width: 33%;
	min-width: 520px;
    max-width: 90%;
    align-self: center;
    margin: 0px auto;
}

#contact-modal .modal-dialog {
	width: 30%;
}

.modal-content {
    position: relative;
    background: #FFF;
/*    border: 1px solid rgba(0, 0, 0, 0.2);*/
	border: 0px;
    box-shadow: 0px 0px 25px rgba(0,0,0,0.1);
    border-radius: 5px;
}
.modal-content .close {
	position: absolute;
	right:28px;
	top:30px;
	opacity: 1;
	margin: 0px;
	width:24px;
	height:24px;
/*	border-radius: 50%;*/
	font-size: 12px;
	line-height:10px;
	background: #FFF;
	background: transparent;
	text-align: center;
	font-weight: 400;
	color: #FFF;
	border: 1px solid #FFF;
	border: none;
}
.modal-header {
	padding: 48px 48px 24px 48px;
	border: 0px;
}
.modal-header h2{
	margin-bottom: 16px;
	font-size: 26px;
    color: var(--sub-color);
}
.modal-header h3{
	margin: 0;
}
.modal-header p{
    margin: 0;
    color: var(--grey-color);
/*    margin-bottom: 16px;*/
}
.modal-body {
	padding: 0px 48px;
}
.modal-padding .modal-body {
    padding-bottom: 48px;
}

.modal-body .form-btns{
    text-align: right;
}

.modal-body p{
    margin: 0;
    margin-bottom: 16px;
}
.modal-footer {
	padding: 48px;
	border: 0px;
	text-align: left;
}
.modal-footer > *{
	margin: 0;
}

.modal-body-padding .modal-body {
	padding: 48px 48px;	
}
.modal-body-padding .big-button{
	width: 100%;
}
#mobile-test .modal-body .d-row {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}
#mobile-test .modal-body .d-row p {
	margin-bottom: 0;
	margin-right: 16px;
}

#mobile-test .modal-body .d-row .banner-btn{
	margin-top: 16px;
}

#mobile-test .modal-body .d-row p:last-of-type {
	margin-right: 0;
}

.modal-success{
    position: relative;
    display: none;
    justify-content: center;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    border-radius: 5px;
    flex-direction: column;
    text-align: center;
    background: #FFFFFF;
    z-index: 9;
}

.complete.modal-success{
	position: absolute;
    display: flex;
	padding: 0 48px;
}
.modal-success-block{
    position: relative;
    display: flex;
    flex-direction: column;
	justify-content: center;
    height: 100%;
	text-align: center;
/*    width: 50%;*/
/*    align-self: center;*/
    padding: 48px 0;
    z-index: 9;
}

.modal-success-block h2{
	margin-bottom: 16px;
	font-size: 26px;
    color: var(--sub-color);
}
.modal-success-block p{
    color: var(--grey-color);
    margin-bottom: 48px;
	padding:0 5%; 
}
.modal-success-img{
    position: relative;
    text-align: center;
    margin: 48px 0;
}
.modal-success-img img{
    width: 60%;
    height: auto;
}
.modal-success-button{
}
.modal-success-button .button{
    display: inline-block;
    align-self: flex-end;
}
.modal-success-icon{
    display: flex;
	flex-direction: column;
	justify-content: center;
    text-align: center;
    width: 120px;
    height: 120px;
    line-height: 116px;
    border-radius: 50%;
    border: 2px solid var(--border-color);
    font-size: 60px;
	margin: 0 auto;
}
.modal-success-icon img{
	display: none;
	margin: 0 auto;
}
.complete.modal-success .modal-success-icon img{
	display: flex;
}


/* MOBILE CHECK *****************************************/


#mobile-test.modal.fade .modal-dialog{
	max-width: 100%;
	padding: 0;
	justify-content: flex-end;
	transform: translate(0, 100px);
}
#mobile-test.modal.show .modal-dialog{
	transform: none;
}
#mobile-test .modal-content {
	border-radius: 25px 25px 0px 0px;
	background: #342A58;
	color: #FFFFFF;
}

.modal-popup-avatar{
	position: absolute;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	align-items: center;
	width: 50%;
	left: 25%;
	top: -42%;	
	width: 240px;
	left: calc(50% - 120px);
	top: -228px;
	pointer-events: none;
}
.modal-popup-avatar img{
	width: 100%;
	max-width: 100%;
}
.popup-avatar-back{
	z-index: -1;
}
.popup-avatar-front{
	z-index: 5;
}

#mobile-test .modal-content .close {
	right:16px;
	top:16px;
	width:24px;
	height:24px;
	font-size: 16px;
	line-height:24px;
	background: transparent;
	text-align: center;
	font-weight: 300;
	color: #FFF;
	border: none;
}
#mobile-test .modal-content .modal-body{
	border-radius: 25px 25px 0px 0px;
	padding: 0px;
	background: #342A58;
	background: transparent;
	text-align: center;
	overflow: hidden;
	z-index: 3;
}
#mobile-test .modal-content .modal-body:before{
	content:'';
	position: absolute;
	display: block;
	width: 120%;
	height: 120%;
	top: -50%;
	left: -40%;
	z-index: 0;
	background: radial-gradient(circle, rgba(243, 175, 13, 0.24) 0%, rgba(243, 175, 13, 0) 60%);
	pointer-events: none;
}
.modal-popup-wrap{
	position: relative;
	display: flex;
	flex-direction: column;
	padding: 40px 24px 40px 24px;
}

/* Loader *****************************************/

.waiting{
	position: absolute;
	display: block;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background: rgba(255,255,255,1);
	z-index: 9;
	text-align: center;
    vertical-align: middle;
}
.form-wrap .waiting{
    width: 102%;
	left: -1%;
}

.form-wrapper .waiting{
    background: #FFFFFF;
}

.loader-wrap{
    position: relative;
    display: flex;
    width: 100%;
    height: 100%;
    justify-content: center;
    opacity: 0;
    -webkit-animation: opac-in-animate 0.3s ease-out forwards;
	animation: opac-in-animate 0.3s ease-out forwards;
}

.lds-ripple {
    display: block;
    position: relative;
    width: 64px;
    height: 64px;
    width: 56px;
    height: 56px;
    display: flex;
    justify-content: center;
/*	top: 150px;*/
    align-self: center;
}
.lds-ripple div {
    position: absolute;
    border: 3px solid var(--sub-color);
    opacity: 1;
    border-radius: 50%;
    animation: lds-ripple 1s cubic-bezier(0, 0.2, 0.8, 1) infinite;
}
.lds-ripple div:nth-child(2) {
    animation-delay: -0.5s;
}
@keyframes lds-ripple {
  0% {
    top: 28px;
    left: 28px;
    width: 0;
    height: 0;
    opacity: 1;
  }
  100% {
    top: -1px;
    left: -1px;
    width: 58px;
    height: 58px;
    opacity: 0;
  }
}


/* ANIMATIONS *****************************/

@-webkit-keyframes opac-in-animate {
	0% { opacity: 0;}
	100% { opacity: 1;}
}
@keyframes  opac-in-animate {
	0% { opacity: 0;}
	100% { opacity: 1;}
}
@-webkit-keyframes opac-out-animate {
	0% { opacity: 1;}
	100% { opacity: 0;}
}
@keyframes  opac-out-animate {
	0% { opacity: 1;}
	100% { opacity: 0;}
}

@-webkit-keyframes btn-animate {
	0%, 100% { -webkit-transform:scale(1); }
	50% { -webkit-transform:scale(1.1); }
}
@keyframes btn-animate {
	0%, 100% { transform:scale(1); }
	50% { transform:scale(1.1); }
}


@-webkit-keyframes pop-in-animate {
	0% { opacity: 0;
		-webkit-transform: scale(0);
	}
	90% { opacity: 1;
		-webkit-transform: scale(1.1);
	}
	100% { opacity: 1;
		-webkit-transform: scale(1);
	}
}
@keyframes pop-in-animate {
	0% { opacity: 0;
		transform: scale(0);
	}
	90% { opacity: 1;
		transform: scale(1.1);
	}
	100% { opacity: 1;
		transform: scale(1);
	}
}

@-webkit-keyframes btm-in-animate {
	0% { -webkit-transform: translateY(10%); opacity: 0;}
	100% { -webkit-transform: translateY(0%); opacity: 1;}
}
@keyframes btm-in-animate {
	0% { transform:translateY(10%); opacity: 0;}
	100% { transform:translateY(0%); opacity: 1;}
}

@keyframes top-in-animate {
	0% { transform:translateY(-10%); opacity: 0;}
	100% { transform:translateY(0%); opacity: 1;}
}

@-webkit-keyframes left-in-animate {
	0% { -webkit-transform: translateX(-10%); opacity: 0;}
	100% { -webkit-transform: translateX(0%); opacity: 1;}
}
@keyframes left-in-animate {
	0% { transform:translateX(-10%); opacity: 0;}
	100% { transform:translateX(0%); opacity: 1;}
}
@-webkit-keyframes right-in-animate {
	0% { -webkit-transform: translateX(10%); opacity: 0;}
	100% { -webkit-transform: translateX(0%); opacity: 1;}
}
@keyframes right-in-animate {
	0% { transform:translateX(10%); opacity: 0;}
	100% { transform:translateX(0%); opacity: 1;}
}

@-webkit-keyframes menu-in-animate {
	0% { -webkit-transform: translateY(10%); opacity: 0;}
	100% { -webkit-transform: translateY(0%); opacity: 1;}
}
@keyframes menu-in-animate {
	0% { transform:translateY(10%); opacity: 0;}
	100% { transform:translateY(0%); opacity: 1;}
}

@keyframes text-blur-animate {
	0% {
        transform: scale(1.1);
        filter: blur(8px);
		opacity: 0;
	}
	100% {
        transform: scale(1.0);
        filter: blur(0px);
		opacity: 1;
	}
}

/* RESPONSIVE STYLES *****************************/


@media (min-width: 2561px) {
	.container{
		max-width: 1800px;
        padding-right: 48px;
        padding-left: 48px;
	}	
	#download-page-top{
		min-height: 90vh;
	}
    
    .banner-main-text{
        width: 40%;
        padding-right: 0;
    }    
    .banner-main-image{
        width: 60%;
    }
    
}


@media (min-width: 1921px) and (max-width: 2560px) {

	.container{
		max-width: 1800px;
        padding-right: 48px;
        padding-left: 48px;
	}	
	
/*
	.banner-main-text{
		padding-top: 144px;
	}
*/
    .banner-main-text{
        width: 45%;
        padding-right: 5%;
    }    
    .banner-main-image{
        width: 55%;
    }
    	
	#download-page-top{
		min-height: 90vh;
	}
	
	#content-home-4 .info-banner-wrap.info-banner-lg .info-img-wrap{
		width: 60%;
	}
	
}

@media (min-width: 1600px) and (max-width: 1920px)  {

	.container{
		max-width: 1536px;
        padding-right: 48px;
        padding-left: 48px;
	}
    #download-page-top{
		min-height: 108vh;
	}
	
}
@media (min-width: 1200px) and (max-width: 1599px) {
	
	
	h1{
		font-size: 48px;
	}
	h2{
		font-size: 40px;
	}
	h3{
		font-size: 28px;
	}
	h4{
		font-size: 18px;
	}
	
	.container{
		max-width: 1344px;
        padding-right: 24px;
        padding-left: 24px;
	}
	.header-main{
		padding-right: 24px;
        padding-left: 24px;
	}
	
	.banner-main-wrapper{
		padding-top: 96px;
	}
	
	.banner-main-image img{
		width: 100%;
		margin-right: 0;
	}
	
	.footer-content{
		margin: 0 var(--main-neg);
	}
	
	.footer-logo-block,
	.footer-menu{
		padding: 0 var(--main-pad);
	}
	
	#download-page-top{
		min-height: 92vh;
	}
	
}
@media (min-width: 1400px) and (max-width: 1540px) {
	.nav-main{
		padding-right: 0px;
	}
	.nav-main ul li a{
		padding: var(--mid-pad) 8px;
		white-space: nowrap;
	}
}
	
@media (min-width: 1200px) and (max-width: 1399px) {
	
	body{
		font-size: 14px;	
	}	
	h1{
		font-size: 38px;
	}
	h2{
		font-size: 34px;
	}
	h3{
		font-size: 26px;
	}
	h4{
		font-size: 18px;
	}
	
	.nav-main ul li a{
		padding: var(--mid-pad) var(--sm-pad);
		white-space: nowrap;
	}
	.nav-socials{
		display: none;
	}
	.sub-page #content-wrapper {
		padding-top: 56px;
	}
	
/*
	.banner-main-wrapper{
		padding-top: 48px;
	}
*/
	
	#banner-main {
		background: none;
	}
	
/*
	.banner-main-buttons{
		width: 70%;
	}
*/

	.banner-main-text-blocks{
		padding: 0;
		margin-top: 24px;
        margin-top: auto;
	}
}

@media (min-width: 992px) and (max-width: 1199px) {
	
	.container {
		max-width: 100%;
		max-width: 1140px;
		padding-right: 32px;
        padding-left: 32px;
	}
	
	body{
		font-size: 14px;	
	}	
	h1{
		font-size: 38px;
	}
	h2{
		font-size: 34px;
	}
	h3{
		font-size: 26px;
	}
	h4{
		font-size: 18px;
	}
	.sub-page #content-wrapper{
		padding-top: 56px;
	}
	#banner-main {
		background: none;
        justify-content: flex-start;
	}
	.banner-main-wrapper{
		padding-top: 72px;
	}
	.banner-main-text{
		padding-top: 0px;
        padding-right: 0;
        padding: 0px 0 48px 0;
	}
	.banner-main-text-blocks{
		padding: 0;
		margin-top: 24px;
        margin-top: auto;
	}
	
	#download-page-top{
		min-height: 92vh;
        overflow: hidden;
	}
    #download-page-top .banner-blk-txt{
        width: 80%;
    }
    .footer-content{
        margin: 0;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
	
	.container {
		max-width: 100%;
		padding-right: 48px;
        padding-left: 48px;
	}
	body{
		font-size: 14px;	
	}	
	h1{
		font-size: 36px;
	}
	h2{
		font-size: 34px;
	}
	h3{
		font-size: 26px;
	}
	h4{
		font-size: 18px;
	}
    .no-mob{
		display: none;
	}
    .button.hide-mob{
        display: none!important;
    }
	
	#banner-main {
/*
		background: url(../images/altinstar-website-banner-main.png) center bottom no-repeat var(--white-color);
		background-size: cover;
*/
		background: none;
	}

	.banner-txt-left .banner-blk-txt{
		padding-right: 0;
	}
	
	.banner-main-wrapper{
		flex-direction: column;
		padding-top: 0px;
	}
	.banner-main-text{
		width: 100%;
		padding: 0px 0 48px 0;
        order: 2;
	}
    .banner-main-title h1{
        margin-bottom: 16px;
    }
    .banner-main-title h1 br{
        display: none;
    }
	.banner-main-image{
		width: 100%;
	}
	.banner-main-image img{
		width: 100%;
		margin-right: 0;
	}
	.banner-main-buttons{
		width: 100%;	
	}	
	.banner-main-blocks-wrap{
		flex-wrap: wrap;
	}
	
	.banner-text-block{
		width: 50%;
	}
	
	.sub-page #content-wrapper{
		padding-top: 56px;
	}
	
	.content-banner-wrap{
		padding: 48px 0px;
	}
	.content-banner{
		flex-direction: column;
		margin: 0;
	}	
	.banner-blk-img,
	.banner-blk-txt{
		width: 100%;
		padding: 0;
	}
    .banner-blk-img{
        width: 50%;
    }
	.banner-blk-txt{
		width: 75%;	
		text-align: center;
	}
	.banner-blk-img + .banner-blk-txt{
		margin-top: 48px;
	}
	.banner-blk-txt + .banner-blk-img{
		margin-top: 48px;
	}
	.banner-txt-right .banner-blk-txt{
		padding-left: 0;
	}
	.banner-txt-left .banner-blk-txt{
		padding-right: 0;
	}
	.content-banner-center .banner-blk-txt{
		width: 100%;
	}
	.content-banner-center .banner-blk-txt p{
		font-size: 16px;
	}
    .content-banner-buttons{
        justify-content: center;
    }
    
		
	.content-icon-blocks{
		flex-direction: column;
		margin: 0;
	}
	.icon-block-wrap{
		width: 100%;
		padding: 0;
		margin-bottom: var(--main-pad);
	}
	.icon-block-top{
		padding: var(--main-pad) var(--main-pad) 0 var(--main-pad)
	}
	.icon-block-btm{
		padding: var(--sm-pad) var(--main-pad) var(--main-pad) var(--main-pad)
	}
	.icon-block-content{
		margin-bottom: var(--main-pad);
	}
	.icon-list-content{
		text-align: left;
		padding: 0 var(--main-pad);  
	}
	.icon-list-content p{
		margin-bottom: 0;
	}
	
/*
	.info-banner-blocks{
		flex-direction: column;
		margin: 0;
	}
	.info-banner-wrap{
		padding: 0;
		margin-bottom: var(--main-pad);
	}
	.info-banner-wrap.info-banner-mid{
		width: 100%;
	}
*/
	.info-banner{
		flex-direction: column;
		padding: var(--main-pad); 
	}
	#content-home-4 .info-banner h3{
		font-size: 20px;
	}
	.info-banner-wrap.info-banner-mid .banner-blk-txt,
	.info-banner-wrap.info-banner-lg .banner-blk-txt{
		width: 100%;
	}
	.info-banner-wrap.info-banner-mid .banner-blk-img,
	.info-banner-wrap.info-banner-lg .banner-blk-img{
		display: flex;
		justify-content: flex-end;
		flex-direction: row;
		width: 100%;
		margin-top: -24px;
	}
	.info-banner-wrap .info-img-wrap{
		position: relative;
		text-align: right;
		right: -24px;
		bottom: -24px;
	}
	.info-banner-wrap.info-banner-mid .info-img-wrap{
		width: 50%;
	}
	.info-banner-wrap.info-banner-lg .banner-blk-img{
		justify-content: center;	
	}	
	#content-home-4 .info-banner-wrap.info-banner-lg .info-img-wrap,
    #download-page-4 .info-banner-wrap.info-banner-lg .info-img-wrap{
		right: initial;
		width: 60%;	
	}
    #content-home-4 .info-banner-wrap .content-banner-buttons,
    #download-page-4 .info-banner-wrap .content-banner-buttons{
        justify-content: flex-start;
    }
    .info-banner-wrap.info-banner-mid .banner-blk-txt, 
    .info-banner-wrap.info-banner-lg .banner-blk-txt{
        text-align: left;
    }
	
	.banner-shape-left{
		display: none;
	}
	
	.banner-wave-top, .banner-wave-btm{
		height: 96px;
	}	
	.banner-wave-top{
		top: -24px;
		background-size: 200% 100%;	
		background-position: left top;
	}	
	.banner-wave-btm{
		bottom: -24px;
		background-size: 200% 100%;	
		background-position: left top;
	}	
	
	#content-home-3,
	#download-page-3{
		padding-top: 120px;
		padding-bottom: 120px;
	}
	#content-home-3 .banner-blk-txt{
		order: 2;
		margin-top: 48px;
	}	
	#content-home-4 .content-banner-center{
		margin-bottom: 48px;
	}	
	#banner-device{
		padding-top: 400px;
		padding-bottom: 48px;
		background-position: right center;
	}
	#banner-tavla{
		padding-top: 400px;
		padding-bottom: 48px;
		background-position: right center;
	}
	#banner-mobile{
		padding-top: 400px;
		padding-bottom: 48px;
		background-position: right center;
	}	
	#banner-device .banner-blk-txt, 
	#banner-tavla .banner-blk-txt, 
	#banner-mobile .banner-blk-txt{
		width: 50%;
		align-self: flex-start;
		text-align: left;
	}
    #banner-device .banner-blk-txt .content-banner-buttons, 
	#banner-tavla .banner-blk-txt .content-banner-buttons, 
	#banner-mobile .banner-blk-txt .content-banner-buttons{
        justify-content: flex-start;
    }
	#banner-device:after,
	#banner-tavla:after,
	#banner-mobile:after{
		content: '';
		display: block;
		position: absolute;
		z-index: 0;
		width: 100%;
		height: 100%;
		bottom: 0;
		left: 0;
		z-index: -1;
	}
	#banner-device:after{
		background: linear-gradient(180deg, rgba(95, 104, 109, 0) 0%, rgba(74, 82, 87, 1) 100%) 0% 0% no-repeat padding-box;	
	}
	#banner-tavla:after{
		background: linear-gradient(180deg, rgba(215, 128, 23, 0) 0%, rgba(215, 128, 23, 1) 100%) 0% 0% no-repeat padding-box;	
	}
	#banner-mobile:after{
		background: linear-gradient(180deg, rgba(180, 19, 189, 0) 0%, rgba(79, 1, 96, 1) 100%) 0% 0% no-repeat padding-box;		
	}
	
	.sub-page #download-page-top + #content-wrapper{
		padding-top: 24px;
	}
	#download-page-top{
		background: url(../images/altinstar-web-bg-download-bg.jpg) center bottom no-repeat var(--white-color); 
		background-size: contain;
		background-size: 150% auto;
		padding: 64px 0px;
		min-height: 720px;
	}
	#download-page-top:after{
		z-index: 1;
		background: url(../images/altinstar-web-bg-download.png?v2) center bottom no-repeat; 
		background-size: cover;
		background-size: 120%;
	}
	
	#download-page-3{
		background-size: cover;
	}
	
    .download-banner-buttons{
        display: none;
    }
	
	#download-page-3 .support-center-wrap{
		width: 100%;
	}
	#download-page-4{
		padding: 48px 0px;
	}
	
	#crypto-page-top{
		padding: 120px 0px 0px 0px;
	}
	#crypto-page-top .content-banner-center .banner-blk-txt{
		width: 100%;
		margin-bottom: 48px;
	}
	#crypto-page-top .content-banner-center .banner-blk-img{
		width: 100%;
	}
	#crypto-page-1{
		padding: 96px 0px 48px 0px;
		margin-bottom: 24px;
	}
	#crypto-page-1 .banner-blk-txt{
	}
	#crypto-page-1 .content-banner-center .banner-blk-txt p{
		font-size: 34px;		
	}
	#crypto-page-2, #crypto-page-3{
		margin-bottom: 24px;
	}
	#crypto-page-3 .banner-blk-txt{
		order: 2;
		margin-top: 48px;
	}
	
	.accordion-button{
		font-size: 16px;
		padding-right: 48px;
	}
	.accordion-button:after{
		top: 16px;
	}
	.accordion-button span{
		line-height: 24px;	
	}
	
	.search-top{
		padding: 48px 0px;
	}
	.search-blk-center{
		width: 100%;
		margin: 0;
	}
	.search-blk-center h1{
		font-size: 24px;
	}
	.banner-main-search{
		width: 100%;
		padding: 0;
	}
	.support-wrap-main{
		padding: 48px 0px;
	}
	.support-blocks{
		margin-top: 0px;
	}
	.support-blocks-wrapper{
		margin: 0;
		width: initial;
		padding: var(--xs-pad) 0;
		margin-left: -8px;
		margin-right: -8px;
		left: initial;
	}
	.support-block{
		width: 50%;
		padding: var(--xs-pad);
	}
	.support-block a{
		padding: var(--mid-pad);	
	}
	.help-center-no-results{
		color: var(--text-color); 
	}
	.support-block-icon{
		font-size: 20px;
		width: var(--main-pad);
    	height: var(--main-pad);
		margin-bottom: var(--xs-pad);
	}
	.support-block-icon i{
		font-weight: 300;	
	}
	.support-block-title{
		font-size: 16px;
	}
	.content-banner-center .banner-blk-txt p {
		font-size: 14px;
	}
	.support-wrap{
		padding: 0;
	}
	.support-wrap .support-category-title{
		display: none;
	}
	.support-categories{
		flex-direction: column;
	}
	.help-center-main{
		padding: var(--main-pad) 0 ;
		margin: 0;
	}
	
	.support-menu-bar-wrapper{
		overflow: hidden;
	}
/*
	.support-menu-bar-wrapper:after{
		content: '';
		position: absolute;
		display: block;
		right: 0;
		top: 0;
		width: 48px;
		height: 100%;
		background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 80%);
		z-index: 3;
	}
	.search-top .support-menu-bar-wrapper:after{
		background: linear-gradient(to right, rgba(26, 21, 46, 0) 0%, rgba(26, 21, 46, 1) 80%);
	}
*/
	.search-top .support-menu-bar-wrapper{
		position: relative;
		left: initial;
		bottom: initial;
		width: initial;
		margin-top: 48px;
		margin-bottom: -48px;
	}
	.support-menu-bar-wrapper .container{
		position: relative;
		margin: 0;
		padding: 0;
		overflow: hidden;
/*
		width: initial;
		overflow-x: scroll;
*/
	}
	.support-menu-bar{
		width: 100%;
		justify-content: space-evenly;
	}
	.support-menu-bar a{		
		width: initial;
		padding: var(--xs-pad) var(--mid-pad); 
	}
	.support-menu-bar a:after{
		height: 100%;
		top: 0;
	}
	.search-top .support-menu-bar a{
		width: 20%;
		padding: var(--xs-pad);
	}
	.support-category-block,
	.support-categories .support-category-block:first-child{
		width: 100%;
	}
	.support-categories{
		padding: var(--xs-pad) 0;
		margin-left: -8px;
		margin-right: -8px;
		padding-bottom: var(--main-pad); 
	}
	.support-category-block{
		padding: var(--xs-pad);
	}
	.support-category-icon{
		margin-bottom: var(--main-pad); 
	}
	.support-menu-bar a span{
		font-size: 12px;
	}
	.search-top .support-menu-bar a div{
		margin-bottom: var(--xxs-pad);
	}
	.sub-page-menu .support-menu-bar-wrapper,
	.support-page-main .support-menu-bar-wrapper{
		top: 56px;
		z-index: 3;
	}	
	#content-wrapper.sub-page-menu{
		margin-top: 40px;
	}
	
	.page-wrapper {
		padding-top: 24px;
		padding-bottom: 48px;
	}
	#content-wrapper.sub-page-menu .page-wrapper{
		padding-top: 72px;
	}
	#content-wrapper.support-page-main .page-wrapper {
		padding-top: 112px;
	}
	.page-back-link{
		position: fixed;
		display: flex;
		width: 100%;
		left: 0;
		top: 96px;
		margin-bottom:0;
		border-bottom: 1px solid var(--light-color);
		background: var(--white-color); 
		z-index: 2;
	}
	.page-back-link-btn{
		display: flex;
		justify-content: center;
		width: 50%;	
		padding: var(--xs-pad); 
		border-right: 1px solid var(--light-color);
	}
	.page-back-link-btn.sub-menu-btn{
		display: flex;
		border-right: 0px;
	}	
	.page-menu-list{
		position: fixed;
		display: flex;
		width: 280px;
		height: 100%;
		top: 0;
		opacity: 0;
		left: -280px;
		padding-right: 0px;
		padding-top: 48px;
		background: var(--white-color); 
		z-index: 102;
		transition: opacity ease 0.2s, left ease 0.2s;
	}	
	.sub-menu-open .page-menu-list{
		opacity: 1;
		left: 0px;
		transition: all ease-out 0.4s;
	}
	.page-menu-list:after{
		display: none;
	}
	.page-menu-close-btn{
		position: absolute;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		width: 24px;
		height: 24px;
		line-height: 24px;
		top: 16px;
		right: 16px;
		text-align: center;
		font-size: 18px;
	}
	.page-menu-list h4{
		padding-left: 24px;	
		margin: 0;
	}
	.page-menu a{
		border-radius: 0px;
	}
	
	.page-row .page-body{
		padding: 0;
		width: 100%;
	}
	
	.page-full h3 {
		font-size: 16px;
		margin-top: var(--main-pad);  
	}
	
	.page-content-banner{
		padding: var(--main-pad);
		margin-bottom: var(--main-pad);
	}
	.page-content-banner-text{
		width: 48%;
	}
	.page-content-banner-text h3 {
		font-size: 24px;
	}
	
	.contact-banner-wrap{
		width: 100%;
	}
	.contact-avatars,
	.contact-shadow,
	#contact-banner-form:before,
	.contact-shadow-behind{
		display: none;
	}
	.content-form{
		padding: var(--main-pad);  
	}
	.content-form .col-6{
		width: 100%;
	}
	.form-col{
		float: none;
		width: 100%;
	}
	
	.banner-app-icons{
		display: flex;
		justify-content: center;
		margin-bottom: 16px;
	}
	.banner-app-icons .app-icon{
		margin: 0 8px;
	}
	
	#footer .container{
		padding: 0;
	}	
	.footer-content{
		flex-direction: column;
		margin: 0;
		padding: 0; 
	}
	
	.footer-logo-block{
		text-align: center;
		padding: 48px 0 0 0;
		width: initial;
	}
	.footer-logo-block h4{
		display: none;	
	}
	.footer-logo-block p{
		padding: 0 24px;
		margin-bottom: 48px;	
	}
	.footer-app-icons{
		margin-top: 0px;
		border-top: 1px solid var(--light-color);
		border-bottom: 1px solid var(--light-color);
	}
	.footer-app-icon-block{
		justify-content: center;
		text-align: center;
		width: 50%;
		padding: 12px 24px;
	}
	.footer-app-icon-block:first-child{
		border-right: 1px solid var(--light-color);
	}
	.app-icon{
		margin-right: 0;
	}
	.app-icon img{
		height: auto;
		max-height: 48px;
		width: 100%;
	}
	.footer-menu{
		padding: 0;
		width: 100%;		
		border-bottom: 1px solid var(--light-color);
	}
	.footer-menu-title{
		padding: 16px 16px;	
		margin: 0;
	}
	.footer-menu-title:after{
		position: absolute;
		display: inline-block;
		content: "\f078";
		right: 4px;
		top: 4px;
		height: 48px;
		width: 48px;
		line-height: 48px;
		font-size: 16px;
		color: var(--text-color);
		vertical-align: middle;
		text-align: center;
		font-family: "Font Awesome 6 Pro";
		font-weight: 300;
		transform: rotate(0deg);
		transition: all .3s ease;
	}
	.footer-menu-open .footer-menu-title:after{
		transform: rotate(-180deg);
		transition: all .3s ease;
	}
	.footer-content h4{
		font-size: 16px;
		line-height: 24px;
		margin: 0;
	}
	.footer-menu-list{
		display: none;
		margin: 0;
	}
	.footer-menu-list li{
		padding: 12px 16px;
		margin: 0;
	}
	.footer-menu-list li a{
		font-size: 14px;
		line-height: 24px;
		font-weight: 400;		
	}	
	.footer-social{
		width: 100%;
		padding: 32px 16px;
	}
	.footer-social .footer-menu-title{
		display: none;
	}
	.footer-social-links{
		justify-content: center;
	}	
	.footer-copyright{
		padding: 48px 24px;
	}
	.footer-copyright-logo img{
		height: 12px;
	}
	
	.modal-dialog{
		min-width: initial;
		width: 100%;
	}
	
	
}

@media (max-width: 767px) {	

	body{
		font-size: 14px;
	}	
	h1{
		font-size: 32px;
	}
	h2{
		font-size: 28px;
	}
	h3{
		font-size: 26px;
	}
	h4{
		font-size: 18px;
	}
	h1.h-sm{
		font-size: 24px;
	}
	.button, .button:visited, a.button, a.button:visited{
		display: flex;
		justify-content: center;
	}
	.button span{
		padding-top: 1px;	
		line-height: 23px;
	}
	.page-back-link-btn .txt-btn{
		width: 100%;	
	}
	.txt-btn span{
		font-size: 12px;
		display: block;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
		max-width: calc(100% - 24px);
	}
	.txt-btn i{
		font-size: 16px;
	}
	.sub-title{
		font-size: 12px;
		margin-bottom: var(--xxs-pad);
	}
	.no-mob{
		display: none;
	}
    .container {
        padding-right: 16px;
        padding-left: 16px;
    }
	.header-main{
		padding-right: 16px;
        padding-left: 16px;
	}
	
	.home-page #content-top-wrapper{
        background: var(--main-color);
	}
    .content-top-wrapper-bg{
        background: url(../images/altinstar-mainbanner-background-mob.webp) left top no-repeat var(--white-color);
        height: 100svh;        
        height: var(--doc-height);        
    }
    .bg-main{
        background: url(../images/altinstar-mainbanner-background-mob.webp) center bottom no-repeat;
        background-size: cover;
/*
        width: 100%;
        z-index: 0;
        animation: banner-bg-animate 30s linear infinite;
*/
    }
	#banner-main {
		background: none;
        padding-top: 0px;
        height: 100%;
        min-height: 100%;
        height: initial;
        min-height: initial;
	}
    #banner-main > .container{
        padding: 56px 16px 48px 16px;
        height: initial;
        justify-content: flex-end;
        min-height: var(--doc-height);
    }
	.banner-main-wrapper{
		flex-direction: column;
		padding-top: 0px;
	}
	.banner-main-text{
		width: 100%;
		padding: 48px 0 0 0;
        padding: 0;
        order: 2;
	}
    .banner-main-title h1{
        font-size: 32px;
        margin-bottom: 8px;
    }
	.banner-main-image{
		width: 100%;
        order: 1;
	}
    .banner-main-image > a{
        margin-left: -1%;
        margin-right: -1%;
        margin-top: -8%;
    }
	.banner-main-image img{
		width: 100%;
		margin-right: 0;
	}
    .banner-main-title{

    }
    .banner-main-content{
        font-size: 14px;
        margin-bottom: 8px;
    }
	.banner-main-buttons{
		width: 100%;
        min-height: 48px;
	}
    .banner-main-buttons > div{
		width: 100%;
	}
	.banner-main-buttons .button{
		margin-right: 0px;
        margin: 0;        
		padding: var(--sm-pad) 20px;
	}
    .banner-main-buttons .button:not(.glass-btn){
        width: 100%;
        float: none;
        margin: 0;
    }
    .banner-main-buttons .button.glass-btn{
        padding: 0;
        margin: 0 16px 0px 0px;
    }
	.banner-main-buttons .button:first-child{
		margin-right: 16px;
	}
/*
	.banner-main-text-blocks{
		display: block;
		overflow: hidden;
		overflow-x: scroll;
		width: auto;
		padding: 0;
        padding-bottom: 24px;
	}
	.banner-main-blocks-wrap{
		width: 400%;
	}
*/
    .banner-main-text-blocks{
		display: flex;
        flex-direction: column;
		padding: 0;
        padding: 48px 16px 0 16px;
        background: var(--white-color);
	}
    .banner-main-blocks-wrap{
        flex-direction: column;
    }
    
    .banner-text-block{
        padding: var(--sm-pad) var(--mid-pad);
        padding: var(--mid-pad) var(--mid-pad);
        border-radius: 5px;
        background: var(--light-bg-color); 
        color:  var(--text-color);
		width: 100%;
        margin-bottom: 8px;
    }
    .banner-text-block-icon{
        margin: auto 0;
        background: var(--light-color); 
        color:  var(--text-color);
    }
    .banner-text-block-content h4{
        font-size: 16px;
        margin-bottom: 4px;
    }
    .banner-text-block-content div{
        
    }
    
    
    .bg-1{
        top: 10%;
        left: -7%;
        width: 20%;
    }
    .bg-2{
        top: 5%;
        left: 33%;
        width: 18%;
    }
    .bg-3{
        top: -11%;
        left: 55%;
        width: 20%;
    }
    .bg-4{
        top: 24%;
        right: 4%;
        width: 14%;
    }
    .bg-5{
        bottom: 28%;
        left: 22%;
        width: 20%;
    }
    .bg-6{
        bottom: 46%;
        left: 82%;
        width: 12%;
    }
    .bg-7{
        bottom: 14%;
        right: 7%;
        width: 16%;
    }
	
	.banner-text-line-full{
		padding: var(--main-pad) var(--main-pad); 
		font-size: 12px;
	}
    .banner-text-line-full{
        display: none;
    }
	
	.sub-page #content-wrapper{
		padding-top: 56px;
	}
	
	.content-banner-wrap{
		padding: 48px 0px;
		padding: 24px 0px;
	}
	.content-banner{
		flex-direction: column;
		margin: 0;
	}	
	.banner-blk-img,
	.banner-blk-txt{
		width: 100%;
		padding: 0;
	}
	.banner-blk-img + .banner-blk-txt{
		margin-top: 48px;
	}
	.banner-blk-txt + .banner-blk-img{
		margin-top: 48px;
	}
	.banner-txt-right .banner-blk-txt{
		padding-left: 0;
	}
	.banner-txt-left .banner-blk-txt{
		padding-right: 0;
	}
	.content-banner-center .banner-blk-txt{
		width: 100%;
	}
	.content-banner-center .banner-blk-txt p{
		font-size: 16px;
	}
	.content-banner-buttons{
		flex-direction: column;
        margin-bottom: 8px;
	}
	.content-banner-buttons .button{
		width: 100%;
		margin-bottom: 16px;
	}
		
	.content-icon-blocks{
		flex-direction: column;
		margin: 0;
	}
	.icon-block-wrap{
		width: 100%;
		padding: 0;
		margin-bottom: var(--main-pad);
	}
	.icon-block-top{
		padding: var(--main-pad) var(--main-pad) 0 var(--main-pad)
	}
	.icon-block-btm{
		padding: var(--sm-pad) var(--main-pad) var(--main-pad) var(--main-pad)
	}
	.icon-block-content{
		margin-bottom: var(--main-pad);
	}
	.icon-list-content{
		padding: 0 var(--main-pad);  
	}
	.icon-list-content p{
		margin-bottom: 0;
	}
	
	.info-banner-blocks{
		flex-direction: column;
		margin: 0;
	}
	.info-banner-wrap{
		padding: 0;
		margin-bottom: var(--main-pad);
	}
	.info-banner-wrap.info-banner-mid{
		width: 100%;
	}
	.info-banner{
		flex-direction: column;
		padding: var(--main-pad); 
	}
	#content-home-4 .info-banner h3{
		font-size: 20px;
	}
	.info-banner-wrap.info-banner-mid .banner-blk-txt,
	.info-banner-wrap.info-banner-lg .banner-blk-txt{
		width: 100%;
	}
	.info-banner-wrap.info-banner-mid .banner-blk-img,
	.info-banner-wrap.info-banner-lg .banner-blk-img{
		display: flex;
		justify-content: flex-end;
		flex-direction: row;
		width: 100%;
		margin-top: -24px;
	}
	.info-banner-wrap .info-img-wrap{
		position: relative;
		text-align: right;
		right: -24px;
		bottom: -24px;
	}
	.info-banner-wrap.info-banner-mid .info-img-wrap{
		width: 50%;
	}
	.info-banner-wrap.info-banner-lg .banner-blk-img{
		justify-content: center;	
	}	
	#content-home-4 .info-banner-wrap.info-banner-lg .info-img-wrap{
		right: initial;
		width: 92%;	
	}
	
	.banner-shape-left{
		display: none;
	}
	
	.banner-wave-top, .banner-wave-btm{
		height: 96px;
	}	
	.banner-wave-top{
		top: -24px;
		background-size: 200% 100%;	
		background-position: left top;
	}	
	.banner-wave-btm{
		bottom: -24px;
		background-size: 200% 100%;	
		background-position: left top;
	}
    
    #content-home-1{
        padding-top: 48px;
    }
	
	#content-home-3,
	#download-page-3{
		padding-top: 120px;
		padding-bottom: 120px;
	}
	#content-home-3 .banner-blk-txt{
		order: 2;
		margin-top: 24px;
	}	
	#content-home-4 .content-banner-center{
		margin-bottom: 24px;
	}	
	#banner-device{
		padding-top: 400px;
		padding-bottom: 24px;
		background-position: 60% center;
	}
	#banner-tavla{
		padding-top: 240px;
		padding-bottom: 24px;
		background-position: 70% center;
	}
	#banner-mobile{
		padding-top: 400px;
		padding-bottom: 24px;
		background-position: 70% center;
	}	
	#banner-device .banner-blk-txt, 
	#banner-tavla .banner-blk-txt, 
	#banner-mobile .banner-blk-txt{
		width: 100%;
	}	
	#banner-device:after,
	#banner-tavla:after,
	#banner-mobile:after{
		content: '';
		display: block;
		position: absolute;
		z-index: 0;
		width: 100%;
		height: 100%;
		bottom: 0;
		left: 0;
		z-index: -1;
	}
	#banner-device:after{
		background: linear-gradient(180deg, rgba(95, 104, 109, 0) 0%, rgba(74, 82, 87, 1) 100%) 0% 0% no-repeat padding-box;	
	}
	#banner-tavla:after{
		background: linear-gradient(180deg, rgba(215, 128, 23, 0) 0%, rgba(215, 128, 23, 1) 100%) 0% 0% no-repeat padding-box;
	}
	#banner-mobile:after{
		background: linear-gradient(180deg, rgba(180, 19, 189, 0) 0%, rgba(79, 1, 96, 1) 100%) 0% 0% no-repeat padding-box;		
	}
	
	.sub-page #download-page-top + #content-wrapper{
		padding-top: 24px;
	}
	#download-page-top{
		background: url(../images/altinstar-web-bg-download-bg.jpg) center bottom no-repeat var(--white-color); 
		background-size: contain;
		background-size: 150% auto;
		padding: 64px 0px;
		height: 64vh;
		min-height: 560px;
	}
	#download-page-top:after{
		z-index: 1;
		background: url(../images/altinstar-web-bg-download.png) center bottom no-repeat; 
		background-size: cover;
		background-size: 144%;
	}
	
	#download-page-3{
		background-size: cover;
	}
	
	
	#download-page-3 .support-center-wrap{
		width: 100%;
	}
	#download-page-4{
		padding: 48px 0px;
	}
	
	.banner-app-icons{
		display: flex;
		justify-content: center;
		margin-bottom: 8px;
	}
	.banner-app-icons .app-icon{
		margin: 0 8px;
	}
	#download-page-top .content-banner-buttons .button{
		width: initial;
		margin-right: 0;
	}
    
    .download-banner-buttons,
    .button.hide-mob{
        display: none!important;
    }
    .content-highlight-txt{
        display: none;
    }
    .mobile-download-button{
        margin-bottom: 24px;
    }
	
	#crypto-page-top{
		padding: 120px 0px 0px 0px;
	}
	#crypto-page-top .content-banner-center .banner-blk-txt{
		width: 100%;
		margin-bottom: 48px;
	}
	#crypto-page-top .content-banner-center .banner-blk-img{
		width: 100%;
	}
	#crypto-page-1{
		padding: 96px 0px 48px 0px;
		margin-bottom: 24px;
	}
	#crypto-page-1 .banner-blk-txt{
	}
	#crypto-page-1 .content-banner-center .banner-blk-txt p{
		font-size: 34px;		
	}
	#crypto-page-2, #crypto-page-3{
		margin-bottom: 24px;
	}
	#crypto-page-3 .banner-blk-txt{
		order: 2;
		margin-top: 48px;
	}
	
	.accordion-button{
		font-size: 16px;
		padding-right: 48px;
	}
	.accordion-button:after{
		top: 16px;
	}
	.accordion-button span{
		line-height: 24px;	
	}
	
	.search-top{
		padding: 48px 0px;
	}
	.search-blk-center{
		width: 100%;
		margin: 0;
	}
	.search-blk-center h1{
		font-size: 24px;
	}
	.banner-main-search{
		width: 100%;
		padding: 0;
	}
	.support-blocks{
		margin-top: 0px;
	}
	.support-wrap-main{
		padding: 24px 0px;
	}
	.support-blocks-wrapper{
		margin: 0;
		width: initial;
		left: initial;
		padding: var(--xs-pad) 0;
		margin-left: -8px;
		margin-right: -8px;
		top: 16px;
	}
	.support-wrap .help-center-main{
		padding:24px 0;
	}
	.support-block{
		width: 50%;
		padding: var(--xs-pad);
	}
	.support-block a{
		padding: var(--mid-pad);	
	}
	.support-block-icon{
		font-size: 20px;
		width: var(--main-pad);
    	height: var(--main-pad);
		margin-bottom: var(--xs-pad);
	}
	.support-block-icon i{
		font-weight: 300;	
	}
	.support-block-title{
		font-size: 16px;
	}
	.content-banner-center .banner-blk-txt p {
		font-size: 14px;
	}
	.support-wrap{
		padding: 0;
	}
	.support-wrap .support-category-title{
		display: none;
	}
	.support-categories{
		flex-direction: column;
	}
	.help-center-main{
		padding: var(--main-pad) 0 ;
		margin: 0;
	}
	.help-center-main .help-center-block{
		padding: 16px 24px;
	}
	.help-center-no-results{
		color: var(--text-color);
		padding: 0 16px;;
	}
	.content-table-col{
		width: 40%;
	}
	.content-table-row .content-table-col:first-child{
		width: 60%;
	}
	
	.support-menu-bar-wrapper{
		overflow: hidden;
	}
	.support-menu-bar-wrapper:after{
		content: '';
		position: absolute;
		display: block;
		right: 0;
		top: 0;
		width: 48px;
		height: 100%;
		background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 80%);
		z-index: 3;
	}
	.search-top .support-menu-bar-wrapper:after{
		background: linear-gradient(to right, rgba(26, 21, 46, 0) 0%, rgba(26, 21, 46, 1) 80%);
	}
	.search-top .support-menu-bar-wrapper{
		position: relative;
		left: initial;
		bottom: initial;
		width: initial;
		margin-top: 48px;
		margin-bottom: -48px;
	}
	.support-menu-bar-wrapper .container{
		position: relative;
		margin: 0;
		padding: 0;
		overflow: hidden;
		width: initial;
		overflow-x: scroll;
	}
	.support-menu-bar{
		width: 150%;
	}
	.support-menu-bar a{		
		width: initial;
		padding: var(--xs-pad) var(--mid-pad); 
	}
	.support-menu-bar a:after{
		height: 100%;
		top: 0;
	}
	.search-top .support-menu-bar a{
		width: 20%;
		padding: var(--xs-pad);
	}
	.support-category-block,
	.support-categories .support-category-block:first-child{
		width: 100%;
	}
	.support-categories{
		padding: var(--xs-pad) 0;
		margin-left: -8px;
		margin-right: -8px;
		padding-bottom: var(--main-pad); 
	}
	.support-category-block{
		padding: var(--xs-pad);
	}
	.support-category-icon{
		margin-bottom: var(--main-pad); 
	}
	.support-menu-bar a span{
		font-size: 12px;
	}
	.search-top .support-menu-bar a div{
		margin-bottom: var(--xxs-pad);
	}
	.sub-page-menu .support-menu-bar-wrapper,
	.support-page-main .support-menu-bar-wrapper{
		top: 56px;
		z-index: 3;
	}	
	#content-wrapper.sub-page-menu{
		margin-top: 40px;
	}
	
	.page-wrapper {
		padding-top: 24px;
		padding-bottom: 48px;
	}
	#content-wrapper.sub-page-menu .page-wrapper{
		padding-top: 72px;
	}
	#content-wrapper.support-page-main .page-wrapper {
		padding-top: 112px;
	}
	.page-back-link{
		position: fixed;
		display: flex;
		width: 100%;
		left: 0;
		top: 96px;
		margin-bottom:0;
		border-bottom: 1px solid var(--light-color);
		background: var(--white-color); 
		z-index: 2;
	}
	.page-back-link-btn{
		display: flex;
		justify-content: center;
		width: 50%;	
		padding: var(--xs-pad); 
		border-right: 1px solid var(--light-color);
	}
	.page-back-link-btn.sub-menu-btn{
		display: flex;
		border-right: 0px;
	}	
	.page-menu-list{
		position: fixed;
		display: flex;
		width: 280px;
		height: 100%;
		top: 0;
		opacity: 0;
		left: -280px;
		padding-right: 0px;
		padding-top: 48px;
		background: var(--white-color); 
		z-index: 102;
		transition: opacity ease 0.2s, left ease 0.2s;
	}	
	.sub-menu-open .page-menu-list{
		opacity: 1;
		left: 0px;
		transition: all ease-out 0.4s;
	}
	.page-menu-list:after{
		display: none;
	}
	.page-menu-close-btn{
		position: absolute;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		width: 24px;
		height: 24px;
		line-height: 24px;
		top: 16px;
		right: 16px;
		text-align: center;
		font-size: 18px;
	}
	.page-menu-list h4{
		padding-left: 24px;	
		margin: 0;
	}
	.page-menu a{
		border-radius: 0px;
	}
	
	.page-row .page-body{
		padding: 0;
		width: 100%;
	}
	
	.page-full h3 {
		font-size: 16px;
		margin-top: var(--main-pad);  
	}
	
	.page-content-banner{
		padding: var(--main-pad);
		margin-bottom: var(--main-pad);
		background: url(../images/altinstar-minibanner-mob.jpg) right bottom no-repeat #1e2134;
		background-size: cover;
		padding-bottom: 80%;
	}
	.page-content-banner-text{
		width: 100%;
		font-size: var(--sm-font);
	}
	.page-content-banner-text h3 {
		font-size: 20px;
		margin-bottom: 16px;
	}
	.page-content-banner-text p{
		display: none;
	}
	.page-content-banner-text .button {
		width: 100%;
	}
	
	#contact-banner-form{
		background: var(--white-color);  
	}
	.contact-banner-wrap{
		width: 100%;
	}
	.content-form{
		padding: var(--main-pad); 
		padding: 0;
		box-shadow: none;
	}
	.contact-avatars,
	.contact-shadow,
	#contact-banner-form:before,
	.contact-shadow-behind{
		display: none;
	}
	.content-form .col-6{
		width: 100%;
	}
	.form-col{
		float: none;
		width: 100%;
	}
	
	.error-page .empty-page{
		min-height: 100vh;
	}
	.empty-page-msg{
    	width: 100%;
		padding: 0 24px;
		margin-bottom: 56px;
	}
	.empty-page-img div {
		margin-top: -20px;
	}
	.empty-page-img span img {
    	height: 200px;
	}
	.empty-page-title{
		font-size: 32px;
	}
	
	
	#footer .container{
		padding: 0;
	}	
	.footer-content{
		flex-direction: column;
		margin: 0;
		padding: 0; 
	}
	
	.footer-logo-block{
		text-align: center;
		padding: 48px 0 0 0;
		width: initial;
	}
	.footer-logo-block h4{
		display: none;	
	}
	.footer-logo-block p{
		padding: 0 24px;
		margin-bottom: 48px;	
	}
	.footer-app-icons{
		margin-top: 0;
		border-top: 1px solid var(--light-color);
		border-bottom: 1px solid var(--light-color);
	}
	.footer-app-icon-block{
		width: 50%;
		padding: 12px 24px;
	}
	.footer-app-icon-block:first-child{
		border-right: 1px solid var(--light-color);
	}
	.app-icon{
		margin-right: 0;
	}
	.app-icon img{
		height: 40px;
		width: 100%;
	}
	.footer-menu{
		padding: 0;
		width: 100%;		
		border-bottom: 1px solid var(--light-color);
	}
	.footer-menu-title{
		padding: 16px 16px;	
		margin: 0;
	}
	.footer-menu-title:after{
		position: absolute;
		display: inline-block;
		content: "\f078";
		right: 4px;
		top: 4px;
		height: 48px;
		width: 48px;
		line-height: 48px;
		font-size: 16px;
		color: var(--text-color);
		vertical-align: middle;
		text-align: center;
		font-family: "Font Awesome 6 Pro";
		font-weight: 300;
		transform: rotate(0deg);
		transition: all .3s ease;
	}
	.footer-menu-open .footer-menu-title:after{
		transform: rotate(-180deg);
		transition: all .3s ease;
	}
	.footer-content h4{
		font-size: 16px;
		line-height: 24px;
		margin: 0;
	}
	.footer-menu-list{
		display: none;
		margin: 0;
	}
	.footer-menu-list li{
		padding: 12px 16px;
		margin: 0;
	}
	.footer-menu-list li a{
		font-size: 14px;
		line-height: 24px;
		font-weight: 400;		
	}	
	.footer-social{
		width: 100%;
		padding: 32px 16px;
	}
	.footer-social .footer-menu-title{
		display: none;
	}
	.footer-social-links{
		justify-content: center;
	}
	.footer-social-links li{
		margin: 0 12px;
	}
	.footer-copyright{
		padding: 48px 24px;
	}
	.footer-copyright-logo img{
		height: 12px;
	}
	.footer-copyright-extra{
		width: 100%;
		margin: 0;
	}
	
	.modal-dialog{
		min-width: initial;
		width: 100%;
	}
	#contact-modal .modal-dialog {
		min-width: initial;
		width: 100%;
	}
	
	.modal-header{
		padding: 24px;
	}
	.modal-body {
		padding: 0px 24px;
	}
	.modal-footer {
    	padding: 24px;
	}
	.modal-footer .button{
		width: 100%;	
	}
	
/*
	#mobile-test.modal-body-padding .modal-body{
		padding: 32px;
	}
	#mobile-test .modal-body a{
		margin: 0 auto;
		text-align: center;
		display: block;
	}
*/
	
	#mobile-test .modal-dialog h2{
		font-size: 26px;	
	}
	#mobile-test .sub-title{
		font-size: 11px;
		margin-bottom: 8px;
	}
	
	#mobile-test .modal-body p{
		font-size: 14px;
		margin-bottom: 24px;	
	}
	#mobile-test .modal-body .d-row {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		margin-top: 8px;
	}
	#mobile-test .modal-body .d-row > div{
		width: 100%;
	}
	#mobile-test .modal-body .d-row .button{
		width: 100%;
	}
/*
	#mobile-test .modal-body .d-row .button span{
		padding-top: 2px;	
		line-height: 22px;
	}
	#mobile-test .modal-body .d-row p {
		margin-bottom: 0;
		margin-right: 16px;
	}
*/

	#mobile-test .modal-body .d-row p:last-of-type {
		margin-right: 0;
	}
/*
	#mobile-test .modal-body a img{
		margin: 0 auto;
	}
*/
}

/* NAVIGATION STYLES */
@media (max-width: 1199px)	{
/*@media (max-width: 991px) {	*/
    
    html.open-menu{
        overflow: hidden;
    }

	body.menu-open{

	}
	#header{
		z-index: 99;
		background: transparent;
		box-shadow:none;
		height: 56px;
		-webkit-transition: background 0.1s ease, box-shadow 0.1s ease;
    	transition: background 0.1s ease, box-shadow 0.1s ease;
	}
	body:not(.menu-open) #header{
		background: var(--white-color);	
		box-shadow: 0 1px 0px var(--light-color);
	}
	body:not(.menu-open) .half-header #header:not(.sticky-header),
	body:not(.menu-open) .clean-header #header:not(.sticky-header){
		background: transparent;
		box-shadow:none;
	}
	
/*
	.menu-open.menu-ani #header{
		background: none;
	    -webkit-transition: background 0.01s ease-out;
		transition:background 0.01s ease-out;
		-webkit-transition-delay: 0s;
		transition-delay: 0s;	
	}
*/
    .nav-toggle {
		position: relative;
/*		left: 16px;*/
        display: block;
		opacity: 1;
        margin: 16px 16px 16px 0px;
		z-index: 3;
    }
	body:not(.menu-open) .sticky-header .nav-icon span,
	body:not(.menu-open) .sticky-header .nav-icon span:before, 
	body:not(.menu-open) .sticky-header .nav-icon span:after{
		background: var(--text-color);  
	}
	body .clean-header #header:not(.sticky-header) .nav-icon span,
	body .clean-header #header:not(.sticky-header) .nav-icon span:before, 
	body .clean-header #header:not(.sticky-header) .nav-icon span:after,
	body .half-header #header:not(.sticky-header) .nav-icon span,
	body .half-header #header:not(.sticky-header) .nav-icon span:before, 
	body .half-header #header:not(.sticky-header) .nav-icon span:after{
		background: var(--white-color); 
	}
	body.menu-open .clean-header .nav-icon span,
	body.menu-open .half-header .nav-icon span{
		background: none!important;
	}
	body.menu-open .nav-icon span:before, 
	body.menu-open .nav-icon span:after{
		background: var(--white-color);  
	}
    .nav-trigger-light{
        display: block;
    }
    .nav-trigger-dark{
        display: none;
    }
    .sub-page .nav-toggle .nav-trigger-light{

    }
    #navbar.sticky .nav-toggle .nav-trigger-dark {
        display: block;
    }
    .logo-main {
        margin: 0;
        margin: 18px 0;
        display: block;
		opacity: 1;
		z-index: 3;
    }
	.logo-main span{
		vertical-align: top;
		height: 20px;
	}
    .logo-main img{
        height: 20px;
        width: auto;
        vertical-align: top;
    }
	
	.nav-wrap {
        position: absolute;
/*        position: fixed;*/
        display: block;
        float: none;
        top: 72px;
        top: 0px;
        right: -110%;
        width: 100%;
        height: 100vh;
/*        height: calc(100% - 72px);*/
		margin: 0;
        padding: 72px 8px 24px 8px;
        z-index: 2;
        opacity: 0; 
        overflow-y: auto;
    }
	.menu-ani .nav-wrap {
        opacity: 0!important;
		-webkit-animation: opac-out-animate 0.2s ease-out forwards!important;
		animation: opac-out-animate 0.2s ease-out forwards!important;   
    }
	.menu-open .nav-wrap {
        display: flex;
		flex-direction: column;
		height: 100dvh;
		width: 100%;
        right: 0px;
		-webkit-animation: menu-in-animate 0.5s ease-out forwards;
		animation: menu-in-animate 0.5s ease-out forwards;      
    }
	.menu-open #navbar.sticky, .menu-open.sub-page #navbar{
		box-shadow: none;
	}
	.menu-open #header.sticky-header .logo-main-dark, 
	.menu-open #header .logo-main-dark{
		display: none;
	}
	.menu-open #header.sticky-header .logo-main-light, 
	.menu-open #header .logo-main-light{
		display: block;
	}
	.nav-main{
		position: relative;
		display: flex;
		flex-direction: column;
		margin: 0;
	}
	.nav-main ul{
		display: flex;
		flex-direction: column;
		align-self: center;
		width: 100%;
        margin: 0px 0px 0px 0px;
        padding:8px 8px 0px 8px;
		
    }
    .nav-main ul li{
        display: block;
        float: none;
        text-align: left;
        padding: 0px 0px;
        margin: 4px 0px;
    }
	.nav-main ul li a{
		font-size: 16px;
		font-weight: 300;
		padding: 0px;
		color: var(--white-color);
		height: initial;
	}
	
	.nav-main ul li:nth-child(1) a,
	.nav-main ul li:nth-child(2) a,
	.nav-main ul li:nth-child(3) a{
		font-size: 28px;
		line-height: 40px;
		font-weight: 700;
		text-transform: none;
        padding: 4px 0px;
/*		margin-bottom: 8px;*/
	}
/*
    .nav-main ul li:nth-child(3) a{
        margin-bottom: 4px;
    }
*/
	.nav-main ul li:nth-child(1) a:after,
	.nav-main ul li:nth-child(2) a:after,
	.nav-main ul li:nth-child(3) a:after{
        position: absolute;
        display: flex;
        justify-content: center;
        content: "\f105";
        right: 0;
        top: 12px;
        width: 100%;
        height: 24px;
        width: 24px;
        font-size: var(--icon-font);
        font-family: "Font Awesome 6 Pro";
        font-style: normal;
        font-weight: normal;
        font-size: 18px;
        line-height: 24px;
        font-weight: 300;
        vertical-align: middle;
	}
    
    .nav-main ul li:nth-child(4){
        border-top: 1px solid rgba(255,255,255,0.16);
        padding-top: 24px;
        margin-top: 16px;
    }
    
	.nav-right{
        position: initial;
		margin-left: 0;
		padding: 0;
	}
    .nav-right .lang-dropdown{
        display: none;
    }
	.nav-main .nav-lang{
		display: flex;
		padding: 0 4px;
		font-size: 16px;
		color: var(--white-color);
	}
	.nav-right .nav-socials{
		position: absolute;
        bottom: 96px;
        left: 0;
        width: 100%;
        margin: 0;
        justify-content: center;
	}
    .nav-mob-lang{
        display: flex;
    }
    .nav-mob-lang .lang-dropdown{
        position: absolute;
        top: 4px;
        right: 16px;
    }
	.nav-dropdown-toggle{
		padding-left: 8px;
	}
	.nav-dropdown-toggle:after{
        top: 14px;
	}
	.nav-dropdown .dropdown-menu{
/*		left: 8px!important;*/
	}
	.nav-app-icons{
		position: absolute;
		display: flex;
		bottom:0;
		left: 0px;
		width: 100%;
		margin: 0;
		border-top: 1px solid rgba(255,255,255,0.16);
	}
	.nav-app-icon-block {
		width: 50%;
		padding: 24px 24px;
		justify-content: center;
	}
	.nav-app-icon-block:first-child {
		border-right: 1px solid rgba(255,255,255,0.16);
	}
	
	.nav-app-icon-light{
		display: flex;
	}
	.nav-app-icon-dark{
		display: none;
	}
	.nav-app-icons .app-icon {
		margin: 0;
	}
	
	.half-header #header:not(.sticky-header) .nav-app-icon-light,
	.clean-header #header:not(.sticky-header) .nav-app-icon-light,
	.clean-header #header:not(.sticky-header) .nav-app-icon-light,
	.clean-header #header:not(.sticky-header) .nav-app-icon-light{
		display: flex;
	}
	.half-header #header:not(.sticky-header) .nav-app-icon-dark,
	.clean-header #header:not(.sticky-header) .nav-app-icon-dark,
	.clean-header #header:not(.sticky-header) .nav-app-icon-dark,
	.clean-header #header:not(.sticky-header) .nav-app-icon-dark{
		display: none;
	}
	
}
@media (min-width: 769px) and (max-width: 1199px)	{
/*
	.nav-toggle{
		right: 48px;
	}
*/
	.nav-wrap{
		padding-left: 40px;
	}
}

/*SHOP RESPONSIVE*/

@media (min-width: 1279px) {

	.payment-status {
		margin: 0px 15% 30px 15%;
	}
	.altin-product:hover:before{
		opacity: 1;
		transition:opacity ease 0.3s;
	}
	.altin-product:hover, .altin-product:hover .product-price, .altin-product:hover .product-old-price{
		color: #FFFFFF;
		transition: color ease 0.3s;
	}
	.altin-product:hover .product-old-price:after{
		background: #FFFFFF;
		transition: background ease 0.3s;
	}
	.product-image{
		position: relative;
		display: block;
		text-align: center;
		margin: 20px 50px 20px 50px;
		-webkit-transform: perspective(300px) translateZ(0);
		transform: perspective(300px) translateZ(0);
		-webkit-transform-style: preserve-3d;
		transform-style: preserve-3d;
	}

	.altin-product:hover .product-image img{
		-webkit-transform:scale(1.15);
		transform:scale(1.15);
		-webkit-transform-origin: 50% 80%;
		transform-origin: 50% 80%;
		-webkit-transform-style: flat;
		transform-style: flat;
		backface-visibility: hidden;

	/*    filter: none;*/
		-webkit-filter: blur(0px);
		-webkit-transition: all ease 0.3s;
		transition: all ease 0.3s;
	}
	.altin-product:hover .product-list li{
		background: url(../images/checkmark-white.svg) left center no-repeat;
		background-size: 18px;
	}
	.altin-product:hover .btn-main{
		background: none;
		color: #FFFFFF;
		border: 1px solid #FFFFFF;
		transition: all ease 0.3s;
		-webkit-transform-style: flat;
	}
	.altin-product:hover input{
		background: none;
		color: #FFFFFF;
		border: 1px solid #FFFFFF;
		transition: all ease 0.3s;
	}
	.altin-product:hover input::-webkit-input-placeholder {
		color: #FFFFFF;
	}
	.altin-product:hover input::-moz-placeholder {
		color: #FFFFFF;
		opacity: 1;
	}
	.altin-product:hover input:-ms-input-placeholder {
		color: #FFFFFF;
	}
	.altin-product:hover .btn-main:hover{
		cursor: pointer;
		background: #FFFFFF;
		color: #f1ac1e;
	}
}

@media (min-width: 420px) and (max-width: 1080px) {
	#mobile-test .modal-content .modal-body:before{
		height: 200%;
	}
}
@media (min-width: 1080px) {
	#mobile-test .modal-content .modal-body:before{
		height: 200%;
	}
}

/*FOR iPHONES*/

@media (max-width: 391px) {

/*
    #banner-main > .container{
        background: green;
    }
*/
    #banner-main > .container{
        min-height: 740px;
    }
    .content-top-wrapper-bg{
        height: 740px;       
    }
    
    .banner-main-image > a{
        margin-top: 0;
        margin-left: 2%;
        margin-right: 2%;
    }

}
