/********************************	

	Developed by AXA Studios

	The Creative Engine

	http://www.axastudios.com

*********************************/



:root {

    --main-color: #FFFFFF;

    /* --sub-color: #1DB954; original design color */ 

	/* --bg-color: #1DB954; ; original design color */

	--sub-color: #6F8271;

	--bg-color: #6F8271;

	

	/* --orange-color: #FFA500; original design color */

	/* --orange-sub-color: #DF9100;	original design color */	

	--orange-color: #F0A023;

	--orange-sub-color: #E88D00;

	

	--light-bg-color: #59A89E;	

	

	/* --hover-color: #169F46; original design color */

	--hover-color: #9CA3A6;

	

	

    --grey-color: #AAAAAA;

    --light-color: #E6E6E6;

    --border-color: #363636;	

    --white-color: #FFFFFF;

	--input-bg: #8CBDB5;

	--input-focus-bg: #B5D4CF;

    --green-color: #129447;

    

	--border-radius: 7px;

	--lg-border-radius: 25px;

	

    --main-pad: 24px;

    --sm-pad: 16px;

    --xs-pad: 8px;

    --lg-pad: 48px;

    --xl-pad: 96px;

    --main-neg: -24px;

    --lg-neg: -48px;

	

    --doc-height: 100%;

}



/* MAIN STYLES *****************************/



html {

/*	overflow-y: scroll;*/

	margin: 0;

	padding: 0;

}

body {

	padding: 0px;

	margin: 0px;

	background:var(--bg-color);

    font-family: 'Poppins', Arial, Helvetica, sans-serif;

	font-weight: 300;

	font-size:14px;

	line-height: 1.6;

    color: var(--main-color);

}

	

/* TEXT & LINK STYLES *****************************/



h1, h2, h3, h4, h5, h6 {

	font-family: 'Poppins', Arial, Helvetica, sans-serif;

	margin-top: 0px;

}

h1{

	font-size:32px;

    font-weight: 600;

    margin-bottom: 8px;

    line-height: 1.2;

}

h2{

	font-size:28px;

	font-weight: 600;

    margin-bottom: 16px;

    line-height: 1.2;

}

h3{

	font-size:20px;

	font-weight: 600;

    margin-bottom: 8px;

    line-height: 1.2;

}

h4{

	font-size:16px;

	font-size:var(--sm-pad);

    font-weight: 600;

    margin-bottom: 4px;

/*    text-transform: uppercase;*/

}



.italic{

	font-style:italic;

}

p{

    margin-bottom: 3rem;

    margin-bottom: 2.4rem;

}

.lead{

    font-weight: 300;

	font-size: 26px;

    margin-bottom: 1.6rem;

    line-height: 1.4;

	color: var(--grey-color);

}

:focus{

	-moz-outline-style:none;

}	

::selection{

	background-color:#333333;

	color:#fff;

}	

::-moz-selection{

	background-color:#333333;

	color:#fff;

}

img{

	max-width: 100%;

}

input:focus, button:focus {

	outline: none; 

}



a{

    color: var(--main-color);

	border: none;

	outline:0;

	-moz-outline-style:none;

}

a:hover, a:focus, a:active, a:visited{

	text-decoration: none;

	color: inherit;

}

a img {

	border: none;

	outline:0;

	-moz-outline-style:none;

}

input.button, .button, .button:visited, .w-btn, .b-btn{

	position: relative;

	cursor: pointer;

	color: var(--sub-color);

	line-height: 28px;

	font-size: 14px;

/*    text-transform: uppercase;*/

    letter-spacing: 0px;

	font-weight: 600;

	border: 1px solid var(--white-color);

	border-radius: var(--border-radius);

	outline: none;

	background: var(--white-color);

	text-align: center;

	transition: all 0.2s;

    text-decoration: none;

}

a.button, .button {

    color: var(--sub-color);

	display: inline-block;

	text-decoration: none!important;

	padding: 9px 32px 9px 32px;

}

.button:hover, .button:active, .button:focus, .button.o-btn:hover, .button.o-btn:active, .button.o-btn:focus {

	color: var(--white-color);

	border-color: var(--hover-color);

    background: var(--hover-color);

    box-shadow: none;

}



.button.disabled{

	opacity: 0.48;

	pointer-events: none;

}



.banner-btn:hover, .banner-btn:active, .banner-btn:focus{

    background: none;

    color: var(--white-color);

	border: 1px solid rgba(255, 255, 255, 1);  

}

.w-btn, .w-btn:visited {

    display: inline-block;

	text-decoration: none;

	padding: 9px 32px 9px 32px;

    background: none;

    color: var(--white-color);

	border: 1px solid rgba(255, 255, 255, 1);  

}

.w-btn:hover, .w-btn:active, .w-btn:focus {

	color: rgba(255, 255, 255, 0.7);

	border: 1px solid rgba(255, 255, 255, 0.7);

    background: none;

}

.b-btn, .b-btn:visited, a.b-btn, a.b-btn:visited {

    display: inline-block;

	text-decoration: none;

	padding: 9px 32px 9px 32px;

	color: var(--white-color);

	border: 1px solid var(--white-color);     

    background: none;

}

.b-btn:hover, .b-btn:active, .b-btn:focus, a.b-btn:hover, a.b-btn:active, a.b-btn:focus {

	color: var(--white-color);

	border: 1px solid var(--white-color);   

/*    background: rgba(238, 238, 238, 0.24);*/

    background: rgba(255, 255, 255, 0.24);

}

.btn-clean{

    display: inline-block;

	border: none;

	background: none;

    line-height: 20px;

	font-size: 14px;

	font-weight: 700;

    padding: 10px 40px;

}

.btn-clean.clean-light{

    color:rgba(14,31,59,0.25);

}



.button.i-btn{

	width: 48px;

	padding: 11px 12px;

	font-size: 24px;

}

.i-btn i{

	display: block;

	width: 24px;

	height: 24px;

	line-height: 24px;

	vertical-align: top;

}





/* WRAPPER STYLES *****************************/



#outer-wrapper{

	position: relative;

	background:var(--orange-color);
	background:var(--bg-color);


}



.main-container{

	position: relative;

	display: flex;

	width: 100%;



	margin: auto;

	flex-direction: row;

	min-height: 100vh;

	overflow: hidden;

	z-index: 2;

}





/* CONTENT STYLES *****************************/



.content-main{

	position: relative;

	display: flex;

	flex-direction: column;

	justify-content: center;

	text-align: center;

	width: 100%;

}



#main-content{

	display: flex;

	height: 100%;

}

#main-content .carousel-item{

	background: var(--bg-color);

}

.item-main{

	position: relative;

	display: flex;

	flex-direction: column;

	justify-content: center;

	align-items: center;

	height: 100%;

	width: 720px;

	max-width: 560px;

	margin: auto;

	padding: 24px;

	opacity: 0;

}

#start-content.active .item-main{

	animation: top-in-animate 0.4s ease-out forwards;

	animation-delay: 0.5s;

}

.carousel-item:not(#start-content) .item-main{

	opacity: 1;

}



.item-header{

	position: relative;

	display: flex;	

	justify-content: center;

}

.game-title{

	position: relative;

    display: flex;

	margin-top: auto;

	justify-content: center;

    padding: var(--main-pad) 0 0 0 ;

	font-size: 12px;

	letter-spacing: 1px;

	text-transform: uppercase;

}

.item-content{

	position: relative;

	display: flex;

	flex-direction: column;

	justify-content: center;

	flex: 1;

	opacity: 0;

}

#start-content.carousel-item .item-content{

	opacity: 1;

}

.carousel-item.active:not(#start-content) .item-content{

	animation: top-in-animate 0.4s ease-out forwards;

}



.item-content p{

	font-weight: 300;

	margin-bottom: var(--lg-pad);

}

.item-content p span{

	font-weight: 700;

}

.item-icon-main{

	position: relative;

	display: flex;

	flex-direction: column;

	justify-content: center;

	align-items: center;

	height: 96px;

	width: 96px;

	margin: 0 auto 48px auto;

	font-size: 52px;

	border-radius: 50%;

	color:var(--white-color);

	background: rgba(255, 255, 255, 0.24);

	opacity: 0;

}

.item-icon-main i{

	position: relative;

}

.active .item-icon-main{

	animation: zoom-pop-animate 0.4s linear forwards;

	animation-delay: 0.3s;

}

.active .item-icon-main i{

	animation: rotate-animate 0.7s linear forwards;

}



.voucher{

	position: relative;

	display: flex;

	width: 100%;

	margin: 0 auto;

/*	overflow: hidden;*/

	cursor: pointer;

	color:var(--sub-color);

	background:var(--white-color);

	border-radius: var(--border-radius);

	box-shadow: 0px 0px 24px rgba(120, 120, 120, 0.16);

}

.voucher:before,

.voucher:after{

	position: absolute;

    content: "";

    display: block;

    width: 20px;

    height: 20px;

    top: calc(50% - 10px);

    background: var(--bg-color);

    border-radius: 50%;

}

.voucher:before{

    left: -10px;

	box-shadow: inset -4px 0px 4px 0px rgba(120, 120, 120, 0.16);

}

.voucher:after{

    right: -10px;

	box-shadow: inset 4px 0px 4px 0px rgba(120, 120, 120, 0.16);

}

.voucher-content{

	position: relative;

	display: flex;

	flex-direction: column;

	justify-content: center;

	align-items: center;

	text-align: center;

	width: 100%;

	padding: var(--main-pad);

}

.voucher-shop{

	font-size: 12px;

	text-transform: uppercase;

}

.voucher-prize{

	font-size: 20px;

	line-height: 1.2;

	font-weight: 700;

	padding: var(--xs-pad) 0;

}

.voucher-content{	

	font-size: 14px;

}

.verify-code{

	position: relative;

	display: flex;

	flex-direction: column;

	margin: var(--lg-pad) 0; 

}

.verify-code-text{

	position: relative;

	display: flex;

	justify-content: center;

	align-items: center;

	margin-bottom: var(--main-pad); 

}

.verify-code-text span{

	padding: 0 4px;

}



.item-buttons{

	position: relative;

	display: flex;

	margin-left: -8px;

	margin-right: -8px;

}

.item-buttons button{

	width: calc(50% - 16px);

	margin: 0 8px;

}



.item-footer{

    position: relative;

    display: flex;

	margin-top: auto;

	justify-content: center;

    padding: var(--xs-pad) 0;

    text-align: center;

	font-size: 12px;

	line-height: 16px;

	color: var(--light-color);

    z-index: 2;

}

.item-footer span{

	display: inline-block;

	line-height: 16px;

}

.item-footer a{

    display: inline-block;

    text-align: center;

	line-height: 16px;

	padding: 0 4px;

}

.item-footer a:hover{

    opacity: 0.48;	

}

.item-footer img {

    height: 16px;

    width: auto;

    display: initial!important;

	vertical-align: bottom;

}



/* SWIPEBAR STYLES *****************************/



.verify-swiper{

	position: relative;

	display: flex;

}



.slide-to-unlock {

	position: relative;

	height: 48px;

	line-height: 48px;

	width: 100%;

	border-radius: var(--border-radius);

	background-color: rgba(255, 255, 255, 0.6);

	box-shadow: 0px 8px 16px rgba(255, 255, 255, 0.16);

	text-align: center;

}



.slide-to-unlock .slide-help-text {

	position: relative;

	font-size: 14px;

	color:var(--sub-color);

}



.slide-to-unlock .slide-handle {

	position: absolute;

	top: 0px;

	left: 0px;

	width: 48px;

	height: 48px;

	line-height: 48px;

	border-radius: var(--border-radius);

	text-align: center;

	cursor: -webkit-grab;

	cursor: -moz-grab;

}



.slide-handle-inside{

	position: relative;

	display: flex;

	flex-direction: column;

	justify-content: center;

	margin: 4px;

	width: 40px;

	height: 40px;

	border-radius: var(--border-radius);

	color:var(--white-color);

	background: var(--sub-color);

	text-align: center;	

}



@keyframes gradient {

	0% {

		background-position: 100% 0%;

	}

	100% {

		background-position: 0% 0%;

	}

}



/* MODAL STYLES *****************************/



#complete-screen {

	display: none;

	opacity: 0;

	position: absolute;

	width: 100%;

	height: 100%;

	top: 0;

	left: 0;

	z-index: 3;

}

#complete-screen .main-container{

	background: var(--orange-color);

}

.content-full{

	position: relative;

	display: block;

	height: 100%;

}

.show-complete #complete-screen {

	display: flex;

	background: var(--orange-color);

	opacity: 1;

/*	animation: opac-in-animate 0.3s ease-out forwards;*/

}



.show-complete .item-main{

	animation: top-in-animate 0.4s ease-out forwards;

}

.show-complete .item-content{

	opacity: 1;

}

.show-complete .item-icon-main{

	animation: zoom-pop-animate 0.4s linear forwards;

	animation-delay: 0.3s;

}

.show-complete .item-icon-main i{

	animation: rotate-animate 0.7s linear forwards;

}



.show-complete .button {

	color: var(--orange-color);

}

.show-complete .button:hover, .show-complete .button:active, .show-complete .button:focus, .show-complete .button.o-btn:hover, .show-complete .button.o-btn:active, .show-complete .button.o-btn:focus {

	color: var(--white-color);

	background-color: var(--orange-sub-color);

	border-color: var(--orange-sub-color);

    box-shadow: none;

}



/* MODAL STYLES *****************************/



body.modal-open  {

	padding: 0px!important;

	overflow-y: hidden!important;

	max-height: 100vh;

	background-color: #02020202;

}

.modal-backdrop {

	background: var(--bg-color);

}

.modal-backdrop.in {

    /* opacity: 0.85; */

	opacity: 0.4;

}

.modal-backdrop.show{

    /* opacity: 0.9;	 */

	opacity: 0.6;

}

.modal{

	z-index: 9999;

}

.modal-dialog {

    width: 640px;

	min-width: 360px;

	max-width: 90%;

	margin: 0 auto;

	display: flex;

	min-height: 100%;

	flex-direction: column;

	justify-content: center;

}

.modal-content {

    position: relative;

    background: var(--bg-color);

	border: 0px;

    border-radius: var(--lg-border-radius);

    border-radius: 0;

    outline: 0px none;

    box-shadow: none;

	padding: 24px;

}

.modal-content .close {

	position: absolute;

	right:24px;

	top:24px;

	right:48px;

	top:48px;

	opacity: 1;

	margin: 0px;

	width:24px;

	height:24px;

	padding: 4px;

	line-height:24px;

	text-align: center;

	border: none;

}

.modal-content .close img{

	vertical-align: top;

}



.modal-logo{

	position: relative;

	padding: 0 20%;

	margin-top: -20%;

	z-index: 3;

}

.modal-header {

	padding: 24px 48px 24px 24px;

	padding: 24px 24px 24px 24px;

	border: 0px;

}

.modal-title{

	font-size: 20px;

	font-weight: 700;

}

.modal-header{

	text-align: center;

	color: var(--text-color);

}

.modal-header h2{

	display: block;

	width: 100%;

	margin-bottom: 0px;

}

.modal-header h2 span{

	display: block;

}

.modal-header-icon{

	position: relative;

	display: flex;

	flex-direction: column;

	justify-content: center;

	align-content: center;

	text-align: center;

	color: var(--white-color);

	font-weight: 300;

	font-size: 40px;

	width: 48px;

	height: 48px;

	margin: 0 auto 32px auto;

}

.modal-header p{

	text-align: center;

    margin: 0;

    margin-bottom: var(--main-pad);

}

.modal-body {

	padding: 0px 24px;

}

.modal-body h3{

	font-size: 16px;

	color: var(--text-color);

}

.modal-body p{

	text-align: center;

    margin: 0;

    margin-bottom: var(--lg-pad);

	color: var(--text-color);

}

.modal-body .form-inline .form-col{

	margin-bottom: var(--sm-pad);

}

.modal-body p span{

	font-weight: 700;

}

.modal-footer{

	padding: 24px;

	padding-top: 12px;

	border: 0px;

	text-align: left;

	

}

.modal-footer .b-btn{

	align-self: flex-start;

	margin-right: auto;

}

#modal-error .modal-dialog {

	width: 512px;

	max-width: 100%;

}

#modal-error .modal-content{

	background: var(--bg-color);

	border-radius: var(--border-radius);

}

#modal-error .modal-content .close {

	right: 24px;

	top: 24px;

}

#modal-error .modal-header{

	flex-direction: column;

	justify-content: center;

	padding-bottom: 16px;

}

#modal-error .modal-title{

	font-size: 30px;

	line-height: 1.2;

	font-weight: 500;

}

#modal-error .modal-body{

	font-size: 16px;

	color: var(--white-color);   

}

#modal-error .modal-footer .button{

	width: 100%;

}

.modal-footer-buttons{

	display: flex;

	justify-content: space-between;

}

.modal-footer-buttons .button{

	width: calc(50% - 24px);

}



/* OTHER STYLES *****************************/



#footer:after, .footer-copyright-content:after, .home-center-banner:after, .content-banner:after, .info-blocks:after, .content-blocks:after, .project-blocks:after, .project-blk-txt:after, .footer-menu ul:after, .form-wrap:after, .form-cols:after, .footer-content:after, .footer-left:after, .footer-right:after{

    content: '';

    display: block;

    clear: both;

}



.clear{

    display: block;

	clear:both;

}	

.no_border{

	border:none!important;

}

.mob-break{

	display: none;

}

.web-break{

	display: inline;

}



.grecaptcha-badge{

	right: -400px!important;

}



/* Loader *****************************************/



.waiting{

	position: absolute;

	display: block;

	width: 100%;

	height: 100%;

	top: 0;

	left: 0;

	background: rgba(0,0,0,0.5);

    border-radius: var(--lg-border-radius);

	z-index: 9;

	text-align: center;

    vertical-align: middle;

}



.loader-wrap{

    position: relative;

    display: flex;

    width: 100%;

    height: 100%;

    justify-content: center;

    opacity: 0;

	animation: opac-in-animate 0.3s ease-out forwards;

}



.lds-ripple {

    display: block;

    position: relative;

    width: 64px;

    height: 64px;

    display: flex;

    justify-content: center;

    align-self: center;  

}

.lds-ripple div {

    position: absolute;

    border: 4px 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 *****************************/



@keyframes  opac-in-animate {

	0% { opacity: 0;}

	100% { opacity: 1;}

}

@keyframes  opac-out-animate {

	0% { opacity: 1;}

	100% { opacity: 0;}

}

@keyframes zoom-in-animate {

	0% { transform:scale(0); opacity: 1;}

	100% { transform:scale(1); opacity: 1;}

}

@keyframes btn-animate {

	0%, 100% { transform:scale(1); }

	50% { transform:scale(1.1); }

}

@keyframes nav-animate {

	0% { transform:translateY(-100%); }

	100% { transform:translateY(0%);}

}

@keyframes highlight-animate {

	0%{ transform:scaleX(0); opacity: 1;}

	100% { transform:scaleX(1); opacity: 1; }

}

@keyframes left-in-animate {

	0% { transform:translateX(-50%) translateY(0%); opacity: 0;}

	50% { opacity: 1;}

	100% { transform:translateX(0%) translateY(0%); opacity: 1;}

}

@keyframes right-in-animate {

	0% { transform:translateX(50%) translateY(0%); opacity: 0;}

    50% { opacity: 1;}

	100% { transform:translateX(0%) translateY(0%); opacity: 1;}

}

@keyframes top-in-animate {

	0% { transform:translateY(-20%); opacity: 0;}

	100% { transform:translateY(0%); opacity: 1;}

}

@keyframes btm-in-animate {

	0% { transform:translateY(20%); opacity: 0;}

	100% { transform:translateY(0%); opacity: 1;}

}

@keyframes zoom-pop-animate {

	0% { transform:scale(0); opacity: 1;}

	90% { transform:scale(1.3); opacity: 1;}

	100% { transform:scale(1); opacity: 1;}

}

@keyframes lights-animate {

	0%, 50%, 100% { opacity: 0;}

	5%, 45% { opacity: 1;}

}

@keyframes rotate-animate {

	0% { transform:rotate(0deg);}

	100% { transform:rotate(360deg); }

}



@keyframes heartBeat {

  0% {

    transform: scale(1) translateZ(0);

  }



  14% {

    transform: scale(1.10) translateZ(0);

  }



  28% {

    transform: scale(1) translateZ(0);

  }



  42% {

    transform: scale(1.10) translateZ(0);

  }



  65% {

    transform: scale(1) translateZ(0);

  }

}



@keyframes rubberBand {

  from {

    transform: scale3d(0, 0, 0);

      opacity: 0;

  }

    

  25% {

/*    transform: scale3d(1, 1, 1);*/

      opacity: 1;

  }



  30% {

    transform: scale3d(1.25, 0.75, 1);

  }



  40% {

    transform: scale3d(0.75, 1.25, 1);

  }



  50% {

    transform: scale3d(1.15, 0.85, 1);

  }



  65% {

    transform: scale3d(0.95, 1.05, 1);

  }



  75% {

    transform: scale3d(1.05, 0.95, 1);

  }



  to {

    transform: scale3d(1, 1, 1);

      opacity: 1;

  }

}



@keyframes wobble-flip {

  from {

    transform: translate3d(0, 0, 0);

  }



  3% {

    transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -5deg);

  }



  6% {

    transform: translate3d(4%, 0, 0) rotate3d(0, 0, 1, 3deg);

  }



  9% {

    transform: translate3d(-3%, 0, 0) rotate3d(0, 0, 1, -3deg);

  }



  12% {

    transform: translate3d(2%, 0, 0) rotate3d(0, 0, 1, 2deg);

  }



  15% {

    transform: translate3d(-1%, 0, 0) rotate3d(0, 0, 1, -1deg);

  }



  to {

    transform: translate3d(0, 0, 0);

  }

}



@keyframes zoomInUp {

  from {

    opacity: 0;

    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);

    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

  }

  60% {

    opacity: 1;

    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);

    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

  }

}



@keyframes zoomOutDown {

  40% {

    opacity: 1;

    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);

    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

  }

  to {

    opacity: 0;

    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);

    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

  }

}



@keyframes roll-animate {

	0% { transform:translateX(100%) rotate(130deg);}

	100% { transform:translateX(0%) rotate(0deg);}

}

@keyframes spin-animate {

	0% { transform:rotate(360deg);}

	100% { transform:rotate(0deg);}

}

@keyframes pulse {

  from {

    transform: scale3d(1, 1, 1);

  }

  50% {

    transform: scale3d(1.10, 1.10, 1.10);

  }

  to {

    transform: scale3d(1, 1, 1);

  }

}





/* RESPONSIVE STYLES *****************************/



.container{

/*    max-width: 1560px;*/

    padding-right: var(--lg-pad);

    padding-left: var(--lg-pad);

}



.row {

    margin-right: var(--main-neg);

    margin-left: var(--main-neg);

}



.col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto {

/*

    position: relative;

    width: 100%;

    min-height: 1px;

*/

    padding-right: var(--lg-pad);

    padding-left: var(--lg-pad);

    padding-right: var(--main-pad);

    padding-left: var(--main-pad);

}



@media (min-width: 1921px) {

	.container {

		max-width: 1600px;

		padding-right: var(--lg-pad);

		padding-left: var(--lg-pad);

	}

	.content-block-main{

		max-width: 512px;

	}    

}



@media (min-width: 1600px) and (max-width: 1920px) {



	.container{

		max-width: 1440px;

        padding-right: var(--lg-pad);

        padding-left: var(--lg-pad);

	}

	

/*

	#modal-code .modal-dialog, #modal-win .modal-dialog{

		margin-top: 48px;

	}

*/

	

}



@media (min-width: 1200px) and (max-width: 1599px) {

    

    body{



    }

    h2 {

        

    }

    a.button, .button {



    }

	.container{

		max-width: 1320px;

		padding-right: var(--main-pad);

		padding-left: var(--main-pad);

	}

	

}

@media (min-width: 1400px) and (max-width: 1599px) and (min-height: 889px) {



}



@media (min-width: 1200px) and (max-width: 1399px) and (min-height: 799px) {



}



@media (min-width: 992px) and (max-width: 1199px) {

    body{



    }

	.container{

		padding-right: 16px;

		padding-left: 16px;

		max-width: 100%;

	}

	.modal-header h2{

		font-size: 26px;

	}

	

}

	

@media (min-width: 768px) and (max-width: 991px) {



	.container{

		padding-right: 16px;

		padding-left: 16px;

		max-width: 100%;

	}

	.main-container{

		width: 100%;

	}

	

	.nav-btns .button{

		display: none;

	}

	.nav-btns .i-btn{

		display: block;

	}

	

	.modal-dialog{

		width: 80%;

	}

	

	.modal-logo {

		padding: 0 30%;

		margin-top: -15%;

	}

    

}



@media (max-width: 767px) {

/*

	h1{

		font-size: 24px;	

	}	

	h2{

		font-size: 16px;	

		margin-bottom: 12px;

	}

	h3{

		font-size: 16px;

	}

	h4{

		font-size: 14px;

	}

*/



	

    body{

        font-size: 14px;

    }

	.no-mob{

		display: none;

	}

	.outer-wrapper{

		overflow: hidden;		

	}

	.container{

		padding-right: 16px;

		padding-left: 16px;

		padding: 0;

		overflow: hidden;

		max-width: 100%;

	}

	.main-container{

		width: 100%;

		max-width: 100%;

		min-height: initial;

		/* height: var(--doc-height); */
		/* overflow: auto; */
	}

	.item-main{

		width: 100%;

		max-width: 100%;

	}

	input.button, .button, .button:visited, .w-btn, .b-btn{

		padding-left: 24px;

		padding-right: 24px;

	}	

	

	

	.modal-backdrop{

		height: 120vh;

	}	

	.modal-logo {

		padding: 0 33%;

		margin-top: -10%;

		margin-top: 0%;

	}

	.modal-header{

		padding-bottom: 16px;

	}

	.modal-header h2{

		font-size: 18px;

	}

	.modal-body h3{

		font-size: 14px;

		margin-bottom: 0;

	}

	.modal-body .form-inline .form-col.form-col-sm{

		margin-bottom: 0;	

	}

	.modal-body p{

		margin-bottom:16px;

	}

	.modal.show{

		background: #00000033;

	}

	.modal-dialog{

		width: 100%;

		min-width: initial;

		max-width: calc(100% - 32px);

		max-width: 100%;

		margin-top: 0px;

		margin-bottom: 0px;

	}

	

	.modal-dialog .modal-content{

		padding-top: 72px;

		padding-bottom: 24px;

	}

	.modal-content{

		padding: 0px;

	}

	.modal-content .close{

		right: 24px;

		top: 24px;

		padding: 6px;

	}

	.modal-footer .button{

		width: 100%;

	}

	.form-complete-img span{

		width: 100px;

		height: 100px;

	}

	.form-complete p{

		font-size: 16px;

	}

	.full-popup .modal-dialog{

		padding-top: 0;

	}

	

	.full-popup .modal-dialog .modal-content{

		padding: 24px 0%;	

	}

	.full-popup .modal-content .close{

		top: 24px;

	}

	

	#modal-error .modal-dialog {

		padding: 0 24px;	

	}

	#modal-error .modal-content{

		padding-top: 24px;

		padding-bottom: 0px;

	}

	#modal-error .modal-header{

		padding-bottom: 8px;

	}

	#modal-error .modal-title{

		font-size: 20px;

	}

	#modal-error .modal-body {

		font-size: 14px;

	}

	#modal-error .modal-content .close {

		right: 16px;

    	top: 16px;

	}

	.modal-footer-buttons{

		display: flex;	

		flex-direction: column;

		justify-content: flex-start;

	}

	.modal-footer-buttons .button{

		width: 100%;

		margin: 0;

	}

	.modal-footer-buttons .button.b-btn{

		order: 2;

		margin-top: 16px;

	}	

	

	.g-recaptcha, .g-recaptcha-contact{

		-webkit-transform-origin:0 0;

		transform-origin:0 0;

		-webkit-transform:scale(0.85);

		transform:scale(0.85);

	}

	

	.footer-main{

		padding: var(--main-pad);

	}

	.footer-nav{

		flex-direction: column;

	}

}

@media (max-width: 375px) {

	.modal-dialog{

		margin-top: 0px;

		margin-bottom: 0px;

		

	}

	input.button, .button, .button:visited, .w-btn, .b-btn{

		padding-left: 24px;

		padding-right: 24px;

	}	

	.input-lg .form-control{

		font-size: 24px;

		letter-spacing: 32px;

	}



}

@media (max-width: 340px) {



}