@font-face {
	font-family: Lato-Regular;
	src: url(fonts/Lato-Regular.ttf);
}
			
@font-face {
	font-family: Lato-Black;
	src: url(fonts/Lato-Black.ttf);
}
			
			
@font-face {
	font-family: Lato-Light;
	src: url(fonts/Lato-Light.ttf);
}
			
textarea:focus, input:focus{
	outline: none;
}
			
.dropbtn {
  color: white;
  padding: 16px;
  font-size: 18px;
  border: none;
  cursor: pointer;
  margin-top:20px;
}


#hamburger {
	position: relative;
    display: inline-block;
    width: 100px;
	height: 24px;
	cursor: pointer;
}
#hamburger_inner, #hamburger_inner:after, #hamburger_inner:before {
    position: absolute;
    width: 100px;
    height: 10px;
    transition-timing-function: ease;
    transition-duration: .15s;
    transition-property: transform;
    border-radius: 4px;
    background-color: #fff;
}
#hamburger_inner:after, #hamburger_inner:before {
    display: block;
    content: "";
}
#hamburger_inner {
	top: 0px;
    display: block;
    margin-top: -2px;
}
#hamburger #hamburger_inner:before {
    top: 20px;
    transition-timing-function: ease;
    transition-duration: .15s;
    transition-property: transform,opacity;
}
#hamburger #hamburger_inner:after {
    top: 40px;
}
#hamburger.open {
	opacity: .7;
	left: 10px;
}
#hamburger.open #hamburger_inner {
	transform: translate3d(0,10px,0) rotate(45deg);
	height: 0px;
}
#hamburger.open #hamburger_inner:before {
}
#hamburger.open #hamburger_inner:after {
    transform: translate3d(0,-20px,0) rotate(-90deg);
}

.dropbtn:hover, .dropbtn:focus {
}

.dropdown {
  position: relative;
  display: inline-block;
}

#myDropdown_desktop{
	margin-top:25px;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: rgb(0, 0, 0,0.8);
  min-width: 160px;
  overflow: auto;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

.dropdown-content a {
  color: #fff;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  font-size: 18px;
}

.dropdown a:hover {background-color: #ddd;}

.show {display: block;
margin-top: 25px;}


.dropbtn_bottom {
  color: white;
  padding: 16px;
  font-size: 18px;
  border: none;
  cursor: pointer;
  margin-top:20px;
}

.dropbtn_bottom:hover, .dropbtn_bottom:focus {
}

.dropdown_bottom {
  position: relative;
  display: inline-block;
}



  @keyframes cf3FadeInOut {
  0% {
  opacity:1;
}
45% {
opacity:1;
}
55% {
opacity:0;
}
100% {
opacity:0;
}
}

.placeholder_fade {
-webkit-transition: opacity 3s ease-in-out;
-moz-transition: opacity 3s ease-in-out;
-o-transition: opacity 3s ease-in-out;
transition: opacity 3s ease-in-out;
}

.top{
animation-name: cf3FadeInOut;
animation-timing-function: ease-in-out;
animation-iteration-count: infinite;
animation-duration: 3s;
animation-direction: alternate;
}

.dropdown-content_bottom {
  display: none;
  position: absolute;
  background-color: #f1f1f1;
  min-width: 160px;
  overflow: auto;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

.dropdown-content_bottom a {
  color: #121417;
  padding: 6px 16px;
  text-decoration: none;
  display: block;
  font-size: 16px;
  text-align:left;
}

.dropdown_bottom a:hover {background-color: #ddd;}

.show {display: block;
margin-top:10px;
}

			
			#back_on_top{
				position:fixed;
				right:0px;
				bottom:10px;
				transform:scale(0.4);
			}
			
			.fa.fa-facebook{
				color:white;
				font-size:40px;
			}
			
			.download .fa{
				margin-right:9px !important;
			}
			
			.slider ::-webkit-scrollbar {
				width: 0px;
				background: transparent; /* make scrollbar transparent */
			}
			
			.fa.fa-facebook:hover{
			color:#ffd500;
			}
			
			.fa.fa-twitter{
				color:white;
				font-size:40px;
				margin-left:50px;
			}
			
			.fa.fa-twitter:hover{
			color:#ffd500;
			}
			html {
			  scroll-behavior: smooth;
			}
			
			body{
				margin:0px auto;
				font-family:Lato-Light;
				}
				
			/*HIDE CLASSE*/
			.hide_on_desktop{display:none;}
			/*HIDE CLASSE END*/
			
			
			/*HEADER START*/
			header{
			position:fixed;
			top:0px;
			width:100%;
			padding:15px 0px;
			background-color:rgb(0, 0, 0,0.8);
			z-index:1000;
			}
				
			nav{
			position:relative;
			float:right;
			padding:10px 10px;
			margin-right:10px;
			}
			
			nav a{
			color:white;
			margin-right:20px;
			font-size: 18px;}
			
			nav a:hover{
				color:#e6c106;
			}
			
			.button_nav{
			float:right;
			padding:10px 20px;
			background-color:#ffd500;
			border-radius:6px;
			margin-right:50px;
			box-shadow:0px 5px #bb9c00;
			font-family:Lato-Black;
			color:#121417;
			}
			
			.button_nav:hover {
  			transform: scale(1.1) !important;
   			transition: all 0.5s !important;
}
			
			a{text-decoration:none;
			}
			
			.logo{
			position:absolute;
			top:0px;}
			
			/*HEADER END*/
			
			/*BANNER START*/
			.banner
			{position:relative;
			background-image: url("images/banner.jpg");
			width:100%;
			height:auto;
			background-size:cover;
			background-repeat:no-repeat;
			background-position:center;
			background-attachment: fixed;
			}
			.banner_button{
				margin-top:15px;
				width: 400px !important;
				font-family:Lato-Black;
			    padding: 35px 30px !important;
			}
			
			.banner_button:hover{
				transform:scale(1.1);
				transition: all 0.5s;
			}
			
			#banner_icons{position:relative;
			}
			
			.banner-container{
			position:relative;
			margin:0px auto;
			max-width:540px;
			left:300px;
			padding:250px 0px;
			}
			
			.banner-container div{
			margin-bottom:30px;
			color:white;
			width:auto;
			position:relative;
			right:0px;}
			
			.banner-container h2, .banner-container p{
			background-color:rgb(0,0,0, 0.5);
			padding: 20px 35px;
			font-size: 47px;
			line-height: 1.2;
			}
			
			.banner-container p{
			    max-width: 650px;
				font-size: 24px;
				line-height: 30px;
				position: relative;
			}
			
			.button{
			padding: 23px 30px;
			background-color:#ffd500;
			border-radius:6px;
			margin-right:50px;
			box-shadow:0px 5px #bb9c00;
			font-weight:bold;
			display: block;
			text-align: center;
			font-size: 30px;
			color:#121417;
			width: 250px;
			font-family: Lato-Black;
			}


			.join_text {
			font-size: 50px !important;
	
}

			/*BANNER END*/
			
			/*DOWNLOAD START*/
			.download{position:relative;
			heigh:auto;
			width:100%;}
			
			.download_h2{margin-bottom:-20px;}
			
			.download-container{
			position:relative;
			margin:0px auto;
			max-width:540px;
			left:300px;
			padding:60px 0px;
			}
					
			.download-container p{
				font-size: 38px;
				line-height: 55px;
			}
			
			.button.red{
			background-color:#d1010c;
			color:white;
			box-shadow:0px 5px #950700;}
					
			.download-container div{
			margin-bottom:50px;}
			
			.download-container a{
				font-family:Lato-Black;
				font-size: 33px;
			}
			
			h2{
			font-size:60px;
			font-family:Lato-Black;
			}

			
			p{
			font-size:25px;
			}
			
			/*DOWNLOAD END*/
			
			/*AMAZING FEATURES START*/
			.amazing-features{
			width:100%;
			background-color:#121417;
			padding:100px 0px 80px 0px; 
			}
			.feature_div{display:inline-block;}
			
			.amazing-features div{
			position:relative;
			margin:0px auto;
			max-width: 1300px;
			text-align:center;
			}
			
			.amazing-features h2{
			color:white;
			font-size: 39px;}
			
			.placeholder {position:absolute;
			bottom: -120px;
			right:750px;
			}
			
			.feature{
			margin-right:40px;
			margin-left:40px;}
			/*AMAZING FEATURE END*/
			
			/*WHY DOWNLOAD START*/
			.why-download{
			position:relative;
			height:auto;
			width:100%;
			background:red;
			overflow: hidden;
			background-color: #102029;
			background-image: -webkit-linear-gradient(-25deg, #f2f2f2 43%, #102029 43%);
			min-height: 500px;
			padding:50px 0px;
			}
			
			.left{float:left;
			width:50%;
			}
			
			.right{float:right;
			width:50%;
			color:white;
			}
			
			.why-download-button{
				padding: 20px 30px;
				margin-top:50px;
			}
			
			.why-downlaod-container{
				margin:0px auto;
				position:relative;
				max-width:1500px;
			}
			
			.why-downlaod-container p{
			 font-size: 18px;}
			 
			 ul{
			padding-inline-start: 15px;
			font-size:18px !important;
			 }
			
			.placeholder_streight{}
			
			.arrow-container{position:relative;
			 top:0px;
			 left:400px;
			 }
			 
			 .arrow-container-2{position:absolute;
			 top: 4vh;
			 background-image: -webkit-linear-gradient(-25deg, #102029 50%, #ffd500 50%);
			 padding: 10px 5px;
			 font-weight: bold;
			 }

		
			.button-arrow-left{display:inline; color:#ffd500; padding:10px;}
			.button-arrow-right{display:inline; color:#102029; padding:10px;}
			.button-arrow-right:hover{display:inline; color:#fff; padding:10px;}
			.button-arrow-left:hover{display:inline; color:#fff; padding:10px;}
			/*WHY DOWNLOAD END*/
			
			/*ABOUT START*/
			.about{position:relative;
			width:100%;
			padding:30px 0px;
    		background-image: url(images/about_bg.jpg);
   			overflow: auto;
			background-size: 100% 100%;
				}
			
				
			
			.about-container{
				max-width:1400px;
				position:relative;
				margin:0px auto;
				padding:0px 200px;
				overflow:hidden;
			}
			.arrows-terms{
				
			}
			.man{
				margin-top: 60px;
			}
			
			.about p{
			font-size:18px;
			color: #121417;
			}
			/*ABOUT END*/
			
			/*TERMS START*/
			
			.terms{position:relative;
			background-image: url("images/smart_filed.jpg");
			width:100%;
			padding: 100px 0px;
			overflow:auto;
			}
			
			.arrows-terms{
				width: 60px;
				display:inline;
				float:right;
				margin: 250px 40px 0px 40px;
			}
			
			.terms-container{
			margin:0px auto;
			position:relative;
			max-width:1400px;}
			
			.terms p{
			font-size:18px;
			}
			
			#ball{
				position:relative;
				top:80px;
			}
			.terms-container .left{
				text-align:center;
				width:20% !important;
			}
			
			.terms-container .right{
				width: 55% !important;
			}
			
			#right:hover, #left:hover{
				transform:scale(1.4);
			}
			
			/*TERMS END*/
			
			
			
			
			/*CALL TO ACTION START*/
				.call_to_action{position:relative;
				width:100%;
				background:#ffd500;
				overflow: auto;
}
				
				.call_to_action_container{
					position:relative;
					margin:0px auto;
					max-width:1600px;
					overflow: auto;
				}
				
				.call_to_action_container .right{
					text-align:right;
					padding: 33px 0px;
				}
				
				.button.black{
					background-color: #121417;
					color:white;
					box-shadow:none;
					margin-top: 30px;
				}
				.call_to_action_right {
					float: right;
					margin-top: 0px;
				}
				
				.call_to_action_left{
					padding-left:5%;
				}
				
			/*CALL TO ACTION END*/
			
			/*CONTACT US START*/
			.contact-us{position:relative;
			width:100%;
			padding:100px 0px;
			}
			
			.contact-us-container{
				position:relative;
				margin:0px auto;
				width:570px;
			}
			
			form{
				overflow: auto;
			}
			
			form input{
			margin-bottom:25px;
			border:none;
			border-bottom:1px solid black;
			width:80%;
			margin-left:20px;
			font-size:25px;
			text-align:left;
			}
			
			form label{display:inline-block;
			width:60px;
			font-family:Lato-Regular;
			position: relative;
			top: 5px;
			font-size: 20px;
			}
			
			.submit{
				width:100px;
				color:white;
				background-color: #121417;
				padding: 15px 90px 15px 40px;
				border-radius: 5px;
				float: right;
				font-family:Lato-Black;
				margin-top: 10px;
				margin-right: 30px;
				text-align:center;
				font-size:20px;
			}

			.submit:hover {
			background-color: #121417;
			}


			/*CONTACTH US END*/
			
			footer {position:relative;
			background-image: url("images/mask_bg.png");
			padding:20px 0px;}
			
			.footer-container{position:relative;
			max-width:1000px;
			margin:0px auto;
			text-align:center;
			padding:50px 0px;}
			
			.footer-icons{
				border-bottom:1px solid gray;
				padding-bottom:20px;
			}	
			
			footer img{text-align:center;
			margin-right:30px;
			margin-left:30px;}
			
			footer nav{
			position:relative;
			float:left;
			padding:10px 10px;
			margin-right:10px;
			margin-top:20px;
			}
			
			#copyright {
				font-size:16px;
				padding:15px 0px;
				color:rgb(120, 120, 120);
			}
			
			
			/*SLIDER TERMS BEGIN*/
			.slider div {
				font-size: 30px;
				line-height: 1.5em;
				font-weight: bold;
				padding:0px;
				color:white;
				overflow: auto !important;
			}
			
			div.a {

			}
			div.b {

			}
			div.c {

			}
			div.d {

			}
			div.e {

			}
			.slider {
			}
			
			.slider p{font-size:18px;
			line-height:1.2;
			}
			

			/*SLIDER TERMS END*/
			
			/*SLIDER WHY DOWNLOAD*/
			.mySlides {display:none;}
			/*SLIDER WHY DOWNLOAD*/
			
			@media only screen and (max-width: 1025px){
				.header_mobile{
					position:fixed;
					top:0px;
					padding:20px 0px;
				}
			.header_mobile img{
				margin-left: 24%;
				transform: scale(0.7);
			}
			
			.dropbtn_bottom {
				font-size:38px !important;
			}
			
			.banner_button {
			padding: 7px 30px !important;
				}
			
			#myLinks{
				width:100%;
				background: rgb(0, 0, 0,0.9);
				position:absolute;
				display:none;
				top: 200px;
				transition: all 2s linear;
				padding: 50px 0px;
			}
			
			#myLinks a {
				display:block;
				font-size:50px;
				color:white;
				text-align:center;
				margin-bottom: 40px;
			}
			
			#myLinks a:last-child{
				margin-bottom:0px;
			}
					
				.icon{
					font-size:129px;
					margin-left: 40px;
					position: absolute;
					top: 80px;
					color:white;
				}
				#hamburger_container {
					height: 50px;
				}
				.hide_on_mobile{
					display:none !important;
				}
				
				.dropbtn{margin-bottom:20px !important;}
				
				.hide_on_desktop{
					display:block;
				}
				
				.banner-container{left:0px;
				float: right;
				overflow:auto;}
				
				.banner-container p{
				
				}
				
				.download-container{
					left:0px;
					text-align:center;
				}
				
				.download-container .button{
					position:relative;
					margin:0px auto;
					font-size: 45px;
				}
				
				.button {
			    width: 500 !important; 
				}
				
				.download .fa {
    			margin-right: 30px !important;
				}
				
				.banner-container p{
					line-height:36px;
					font-size:35px;
					font-family:Lato-Regular;
				}
				
				.banner_button{
					font-size:45px;
					line-height:2.4 !important;
				}
				
				.placeholder {
					position: relative;
					top: 0px;
					left: 0px;
					float:left;
					clear: both;
					overflow: auto;
				}
				
				.mobile_features{
				}
				
				.amazing-features{
					overflow:auto;
					padding:50px 0px 50px 0px;
				}
				
				.download-container{
					padding:50px 0px 50px 0px;
				}
				
				.banner-container{
					padding: 0px 40px 0px 0px;
				}
				
				.banner{
					overflow: hidden;
					padding-top: 350px;
					padding-bottom: 150px;
					background-image: url(images/banner_mobile.jpg);
				}

				#banner_icons {
					width: 100%;
					margin: 0px auto;
					top:250px;
					right: -300px !important;
				}
					
						.feature_div {
				display: inline-block;
				width: 200px;
				margin-left: 20px !important;
				margin-right: 20px !important;
				margin-top: 20px !important;
				transform: scale(1.1);
					}
					
				.feature {
					margin-left:0px;
					margin-right:0px;

			}
			
			.why-downlaod-container {
				flex-direction: column;
				display: flex;}
				
			.why-downlaod-container.left.right{
				float:none;
			}
			
			.why-downlaod-container .left{
				order:2;
			}
			
			.why-downlaod-container .right{
				margin:0px auto;
				order:1;
				width: 80%;
			}
			
			.why-downlaod-container h2{
				text-align:center;
			}
			.why-download{
			    background-image: -webkit-linear-gradient(66deg, #f2f2f2 25%, #102029 25%);
				padding:50px 0px 300px 0px;
			}
				
				
			.button.black {
    		width: 200 !important;
			}
				
				
			.button.black a {
			font-size: 40px !important;
			}
				
			.button {
			font-size: 40px !important;
			}
				
			.button.red {
			padding: 40px 30px !important;
			}
				
				
			.button.yellow_download {
			padding: 40px 30px !important;
			}
				
				
			.why-download-button {
			margin: 0px auto;
			font-size: 45px;
			line-height: 2.4;
			padding: 15px 30px;}
			
			.mySlides{
				transform: scale(1.4);
				position: relative;
				top: 110px;
				left: 100px;
			}
			
			.why-downlaod-container p {
			font-size: 17px;}
			
			ul {
			font-size: 17px !important;}
			
			.about{
				background: none;
				padding: 30px 0px 0px 0px;
			}
			
			.arrow-container-2 {
				position: absolute;
				top: 61vw;
				left: 50px;
				transform: scale(2);
			}
			.arrow-container{
				top: 234px;
				left: 550px;
			}
			
			.about-container{
				padding: 0px 0px;
			}
			
			.about-container .left{
				float:none;
				width: 80%;
				padding: 0px 100px;
			}
			
			.about-container .right{
				float:none;
				width: 100%;
			}
			
			.about-container h2{
				text-align:center;
			}
			
			.about-container p{
				font-size:17px;
			}
			
			.terms-container{
				flex-direction: column;
				display: flex;
			}
			.terms{
				padding: 40px 0px !important;
				overflow: hidden  !important;
			}
			
			.terms h2{text-align:center;}
			.terms-container .left{
				float:none;
				order:2;
				width: 100% !IMPORTANT;
				margin-bottom: -100px;
				text-align: center;
			}
			
			.terms-container .right{
				float:none;
				order:1;
				width: 70% !important;
				margin:0px auto;
			}
			
			.arrows-terms{
			float: none !important;
			margin: 0px !important;
			}
			
			.slider div{
				padding:5px;
				overflow: scroll !important;
				height:1350px !important;
			}
			
			.call_to_action .button{
				padding: 31px 20px;
				margin-top:50px;
			}

			nav a{
				    font-size: 38px;
					margin-right: 30px;
					margin-left: 30px;
					line-height: 1.6;
			}
			
			#copyright{
				font-size:10px;
				position: relative;
				top: 30px;
			}
			
			.contact-us{padding: 50px 0px;}
			
			.footer-icons{
				padding-bottom: 50px;
			}

			.contact-us-container{
			width: 578px !important;}
			
			form{overflow: hidden;}
			
			form input{
				width: 65%;
			}
			
			form label{
					font-size:35px;
					margin-right: 90px;
				}
				
			.amazing-features h2{
				font-size: 2.3vh;
				margin-bottom: 0px;
				padding-right: 10px;
				}
				
			.slider{width:750px !important;
			height:1400px !important;}
			
			.slider p{
				font-size:35px;
			}
			#ball{
				top: -20px;
			}
			
			.man{
				width: 100%;
			}
			
			#left{
				position:relative !important;
				top: 755px !important;
				left:900px;
			}
			
			#right{
				position:relative !important;
				bottom:1000px !important;
				left:20px;
			}
			
			.button_nav {
				float: right;
				padding: 26px 45px;
				background-color: #ffd500;
				border-radius: 6px;
				margin-right: 25px;
				box-shadow: 0px 5px #bb9c00;
				font-family: Lato-Black;
				color: #121417;
				font-size: 32px;
				margin-top: 27px ;
			}
			
			#banner_icons img{
				filter: invert(100%);
			}
			
			.download-container p {
			font-size: 17px;
			line-height: 55px;
			font-family: Lato-Regular;
			}
			
			.download-container{
				max-width:570px !important;
			}
			
			.submit{
			margin-top: 25px;
			margin-right: 75px;
			transform: scale(2);
			}
			
			#back_on_top{
				transform:scale(0.6) !important;
				}
			
			.why_download_cta{
			margin:50px 0px !important;
			}
			
			.show{
			position: relative;
			background: rgb(0, 0, 0,0.8);
			margin-bottom: 50px;
			}
			
			.dropdown-content a {
			  padding: 5px 16px;
			  text-decoration: none;
			  display: block;
			  font-size: 18px;
			  margin:20px 0px 20px 0px;
			}
			
			.dropdown-content a:last-child{
				margin-bottom:20px !important;
			}
			
			}
			
	@media only screen and (min-device-width : 768px) and (max-device-width : 1024px){
		.download-container p{
			font-size:40px !important;
		}
		
		#left {
			top: 567px !important;
		}
		
		.amazing-features h2{
			font-size:50px;
		}
		
		.amazing-features div{
			margin-bottom: 32px;
		}
		
		.feature{
			transform: scale(1.1);
		}
		
		.why-downlaod-container p{
			font-size:30px;
		}
		
		ul {
		font-size: 30px !important;}
		
		.why-downlaod-container h2{
			font-size:60px;
		}
		
		.why-downlaod-container h4{
			font-size:30px;
		}
		.about-container p{
			font-size:30px;
		}
		.slider {
		height: 1200px !important;}
		
		#copyright{
			font-size:20px;
		}
		
		.contact-us-container p {
			font-size:35px !important;
		}
		
		.contact-us{
			padding: 30px 0px 60px 0px;
		}
		
		.fa{transform: scale(1.5);
			} 
			
		.why_download_cta{
			margin:50px 0px !important;
		}
		
		
		
		
	}


@media only screen 
  and (min-device-width: 1220px) 
  and (max-device-width: 1600px)  {

body {
    zoom: 80% !important;
}
}



.button:hover {
    transform: scale(1.1) !important;
    transition: all 0.5s !important;
}


@media only screen and (max-width: 600px) {
.download-container .button {
    font-size: 45px !important;
}
}