@charset "utf-8";
/* CSS Document */
*{
	margin: 0;
	padding: 0;
}
html {
	height: 100%;
	width: 100%;

}

@font-face {
		font-family: 'aces07_regularregular';
		src: url('font/aces07_regular-webfont.woff2') format('woff2'),
				 url('font/aces07_regular-webfont.woff') format('woff');
		font-weight: normal;
		font-style: normal;
}

body {

	/*font-family: 'aces07_regularregular';*/
	font-family: 'aces07_regularregular';
	src: url('font/aces07_regular-webfont.woff2') format('woff2'),
			 url('font/aces07_regular-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
	margin:0;

}



/*NAVIGACIJA*/


label {
	font-size: 26px;
	line-height: 40px;
	display: none;
	width: 26px;
	float: right;
	color: #fff;
}
#prekidac {
	display: none;
}

nav {
  height: 50px;
  width: 100%;
  margin: 0 auto;
  background: #030D1C;

  z-index: 999;
}


nav ul {
  list-style: none;
  text-align: center;
}
nav ul li {
  display: inline-block;
}
nav ul li a {
  display: block;
  padding: 15px;
  text-decoration: none;
  color: #aaa;
  font-weight: 800;
  text-transform: uppercase;
  margin: 0 10px;
}
nav ul li a,
nav ul li a:after,
nav ul li a:before {
  transition: all .5s;
}
nav ul li a:hover {
  color: #ffffff;
}



nav.shift ul li a {
  position:relative;
  z-index: 1;
}
nav.shift ul li a:hover {
  color: black;
}
nav.shift ul li a:after {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  margin: auto;
  width: 100%;
  height: 1px;
  content: '.';
  color: transparent;
  background:  #ffffff/*#CEE3F4*/;
  visibility: none;
  opacity: 0;
  z-index: -1;
}
nav.shift ul li a:hover:after {
  opacity: 1;
  visibility: visible;
  height: 100%;
}

.sticky {
	position: fixed;
	top: 0;
}
h1 {
	text-align: center;
	margin-top: 60px;
	padding: 7px;
	font-size: 70px;
  text-shadow: 3px 3px 3px  black;
  color: whitesmoke;
	/*text-shadow: 3px 3px 3px  #74f0ce ;*/

}

h2 {
  color: whitesmoke;
	text-align: center;
	margin-top: 60px;
	font-size: 70px;
	text-shadow: 3px 3px 3px  black;
  margin-bottom: 20px;
}

h3 {
	margin-top: 60px;

	margin-bottom: 20px;
	color: whitesmoke;
	font-size: 25px;

}



p {
	color: whitesmoke;
	/*text-shadow: 0 0 3px white;*/
	 line-height: 1.8em;
	  width:auto;

	 font-size: 24px;


}

.textfaction {
	color: whitesmoke;
text-shadow: 0 0 3px white;
	 line-height: 1.8em;
	  width:auto;

	 font-size: 24px;
	 text-align:left !important;
	 text-align: center;
}


.container {
	display: block;
  width: auto;
  margin:  auto;

  padding: 25px;
	width: 960px;

}


.text-center {
    margin: 0 auto;
	text-align: center;
}


.parallax {
  height: 900px;
  width: 100%;
	margin: auto;
	display: block;
	z-index: 0;

  /*background: transparent;*/
}




section {

  /*background-color: #CEE3F4;*/
	background-color:#0c2f64; /*#d7e8f4;*/
	height: 100%;
	width: 100%;
	margin:auto;
	display: inline-block;
}

#strA {
  background-color: #051937;
}

#strB {
  background-color: #051937;


}

#strBdva {

      background-color: #051937;

}

#strS{

      background-color: #141723;

}

#strBalt {
  /*background-image: url("slike/briefing.jpg");*/
	background-repeat: no-repeat;


}

.zoom {
  transition: transform .3s;
	   display: inline-block;
	overflow: hidden;

	width:auto;
     padding:30px;
     text-align:left !important;
		 text-align: center;
}

.zoomlik {
	transition: transform .3s;
	padding: 50px;
	width: 450px;
	height:300px;
	display: inline-block;
	clear: both;
}

.zoomlikdva {
	transition: transform .3s;
	padding: 50px;
	width: 360px;
	height:450px;
	display: inline-block;
	clear: both;
}

.zoomlik:hover {
  -ms-transform: scale(1.5); /* IE 9 */
  -webkit-transform: scale(1.5); /* Safari 3-8 */
  transform: scale(1.2);
}

.zoomlikdva:hover {
  -ms-transform: scale(1.5); /* IE 9 */
  -webkit-transform: scale(1.5); /* Safari 3-8 */
  transform: scale(1.2);
}

.zoom:hover {
  -ms-transform: scale(1.5); /* IE 9 */
  -webkit-transform: scale(1.5); /* Safari 3-8 */
  transform: scale(1.2);
}

.strangereal {
	display: block;
  margin-left: auto;
  margin-right: auto;
}

.list {
	padding: 10px;
	color: whitesmoke;
	font-size: 24px;

}

.sublist {
	margin-left: 70px;
	margin-top: 10px;
	margin-bottom: 10px;
	color: whitesmoke;
	font-size: 20px;
}

.banner {
	display:block;
	margin: auto;
	text-align: center;
	padding-top:60px;
		padding-bottom:60px;

  margin-left: auto;
  margin-right: auto;
}

footer {
	background-color: #030D1C;
	color: white;
	height:600px;
  font-size: 60px;
	padding: 15px;
	text-align: center;
}


.fixed-header {
position: fixed;
	 top: 0;


}

.footp {
	padding: 7px;
	text-align: center;
	font-size: 20px;
}

/* IKONE */

.fa {
  padding: 20px;
  font-size: 30px;
  width: 30px;
  text-align: center;
  text-decoration: none;
  margin: 5px 2px;
  border-radius: 50%;

}

.fa:hover {
    opacity: 0.3;
}

.fa-steam {
  background-image:url("icons/steam.png");
  color: white;

}

.fa-twitter {
  background-image:url("icons/twitter.png");
  color: white;
}

.fa-google {

  color: white;
}


.fa-youtube {

  color: white;
}

.logo {
    background: url('/onScroll/logo.png') center no-repeat;
}
.blank {
    background: url('/onScroll/blank.png');
}


.cloud {
        visibility: hidden;
			float:left;


    }

		.cloudtwo {
		        visibility: hidden;
					float:right;
		    }

				.plane {
				        visibility: hidden;
							display:block;
							margin: auto;



				    }

						.cloudmid {
										visibility: hidden;
									display:block;
									margin: auto;



								}

    .fadeIn {
        -webkit-animation: animat_show 4.0s;
        animation: animat_show 4.0s;
        visibility: visible !important;
    }

    @-webkit-keyframes animat_show{
        0%{opacity:0}
        100%{opacity:1}
    }


		#contain{
		    clear: both;

		}


		.fake-image{
    float: left;
    margin-right: 14px;

}

#contain:hover div.text{
    display: inline-block
}

.text{
    background-color: #030D1C ;
		display:inline-block;
    float: left;
    display: none;
		color: white;
		margin-left: 30px;
		width: 650px;
		height:285px;
		position: absolute;
		animation: animat_show 2.0s;
		padding: 7px;
}

.textdva{
    background-color: #030D1C ;
		display:inline-block;
    float: left;
    display: none;
		color: white;
		margin-left: 30px;
		width: 650px;
		height:285px;
		position: absolute;
		animation: animat_show 2.0s;
		padding: 7px;
}

.emblem {
	width: 70px;
	height: 50px;
	float: right;
}

.emblemcy {
	width: 70px;
	height: 70px;
	float: right;
}

iframe {

	text-align: center;
}

.videoal{
	text-align: center;
}


/* OPTIMIZACIJA ZA MOBILNE UREĐAJE */



 /* iPhone 6/7/8 | 375px */
@media only screen and (max-width: 480px) {

	a.fa {
		padding: 10px;
		font-size: 30px;
		width: 10px;
		height: 20%;
		text-align: center;
		text-decoration: none;
		margin: 5px 2px;
		border-radius: 50%;

	}


		.paragrafmob {

			color: whitesmoke;
			 line-height: 1.8em;
			  width:auto;

			 font-size: 15px;
			 text-align:left !important;
			 text-align: center;

		}

		.zoom {
			transition: transform .3s;

			overflow: hidden;



				 text-align:left !important;
				 text-align: center;
		}


		.zoomlik {
			transition: transform .3s;

			clear: both;
		}

		.zoomlik:hover {
			-ms-transform: scale(1.5); /* IE 9 */
			-webkit-transform: scale(1.5); /* Safari 3-8 */
			transform: scale(1.1);
		}

		.zoom:hover {
			-ms-transform: scale(0.5); /* IE 9 */
			-webkit-transform: scale(0.5); /* Safari 3-8 */
			transform: scale(1.1);
		}

		.textfaction {
			color: whitesmoke;
		text-shadow: 0 0 3px white;
			  width:auto;
				 padding:7px;
			 font-size: 15px;
			 text-align:left !important;
			 text-align: center;
		}
		.container {
			display: block;
		  width: auto;
		  margin:  auto;
			text-align: center;
		  padding: 10px;

		}

		iframe.responsivevid {
			height:250px;
			width: 300px;
		}

		.footp {
			padding: 7px;
			text-align: center;
			font-size: 15px;
		}
		iframe {
			width: 200px;
			height: 125px;
		}

		div.text {

			visibility:  hidden;

		}

}

 /* iPad | 768px */
@media only screen and (max-width: 768px) {


.list {
	text-align: left;

}


	.banner {
		width: 100%;
		height: 100%;
	}

	p {
		color: whitesmoke;
		 line-height: 1.8em;
		  width:auto;
			 padding:5px;
		 font-size: 15px;
		 text-align:left !important;
		 text-align: center;
	}

	h2 {
	  color: whitesmoke;
		text-align: center;
		margin-top: 60px;
		font-size: 40px;
		text-shadow: 3px 3px 3px  black;
	  margin-bottom: 20px;
	}

	h1 {
		text-align: center;

		padding: 7px;
		font-size: 55px;
	  text-shadow: 3px 3px 3px  black;
	  color: whitesmoke;
		/*text-shadow: 3px 3px 3px  #74f0ce ;*/

	}

	.zoom {
		transition: transform .3s;

		overflow: hidden;



			 text-align:left !important;
			 text-align: center;
	}


	.zoomlik {
		transition: transform .3s;

		clear: both;
	}

	.zoomlik:hover {
		-ms-transform: scale(1.5); /* IE 9 */
		-webkit-transform: scale(1.5); /* Safari 3-8 */
		transform: scale(1.0);
	}

	.zoom:hover {
		-ms-transform: scale(0.5); /* IE 9 */
		-webkit-transform: scale(0.5); /* Safari 3-8 */
		transform: scale(1.0);
	}
	.textfaction {
		color: whitesmoke;
	text-shadow: 0 0 3px white;
		  width:auto;
			 padding:10px;
		 font-size: 15px;
		 text-align:left !important;
		 text-align: center;
	}
		.container {
			display: block;
			width: auto;
			margin:  auto;
			text-align: center;
			padding: 10px;

		}

		iframe.responsivevid {
			height:250px;
			width: 350px;
		}


		.footp {
			padding: 7px;
			text-align: center;
			font-size: 15px;
		}

		.list {
				margin-left: 10px;
			padding: 7px;
			color: whitesmoke;
			font-size: 12px;

		}

		.sublist {
			text-align: left;
			margin-left: 70px;
			margin-top: 10px;
			margin-bottom: 10px;
			color: whitesmoke;
			font-size: 10px;
		}

		.strangereal {

			width: 95%;
			height: auto;

		}

		.image {
			width: 270px;
			height: 150px;
		}



		image {
			text-align: left;
			float: left;

		}

		iframe.spotify {
			width: 400px;
			height:400px;
		}

		a.fa {
			padding: 10px;
			font-size: 30px;
			width: 10px;
			height: 20%;
			text-align: center;
			text-decoration: none;
			margin: 5px 2px;
			border-radius: 50%;

		}


		label {
			display: block;
			cursor: pointer;
			float:right;
			margin: 10px 10px 0px 0px;

		}
		nav ul{

			padding: 45px 0px 0px 0px;
			width: 100%;


		}
		nav ul li{
			display: block;
			margin: 0px;
			padding: 0px;
		}
		nav ul li a{
			width: 100%;
			padding: 0px;
			margin: 0px;
			height: 40px;
			border-radius: 0px 0px 0px 0px;
			padding-top:20px;
		}
			.meni{
			margin-top: 0px;
			text-align: center;
			display: none;
		}

		.meni a {
			display: block;
			border-bottom: 1px solid #5A5756;
			margin: 0;
			background-color: #030D1C;
		}
		#prekidac:checked+.meni{
			display: block;

		}

		img.imagekeiki {

			width: 300px;
			height: 200px;

		}

		div.text {

			visibility:  hidden;

		}

		}


 /* iPhone 6/7/8 Plus | 414px */
		@media only screen and (max-width: 414px) {

			p {
				color: whitesmoke;
				 line-height: 1.8em;
				  width:auto;
					 padding:5px;
				 font-size: 15px;
				 text-align:left !important;
				 text-align: center;
			}

			h2 {
			  color: whitesmoke;
				text-align: center;
				margin-top: 60px;
				font-size: 40px;
				text-shadow: 3px 3px 3px  black;
			  margin-bottom: 20px;
			}

			h1 {
				text-align: center;

				padding: 7px;
				font-size: 55px;
			  text-shadow: 3px 3px 3px  black;
			  color: whitesmoke;
				/*text-shadow: 3px 3px 3px  #74f0ce ;*/

			}

			.zoom {
				transition: transform .3s;

				overflow: hidden;



					 text-align:left !important;
					 text-align: center;
			}


			.zoomlik {
				transition: transform .3s;

				clear: both;
			}

			.zoom {
				transition: transform .3s;

				overflow: hidden;



					 text-align:left !important;
					 text-align: center;
			}


			.zoomlik {
				transition: transform .3s;

				clear: both;
			}

			.zoomlik:hover {
				-ms-transform: scale(1.5); /* IE 9 */
				-webkit-transform: scale(1.5); /* Safari 3-8 */
				transform: scale(1.0);
			}

			.zoom:hover {
				-ms-transform: scale(0.5); /* IE 9 */
				-webkit-transform: scale(0.5); /* Safari 3-8 */
				transform: scale(1.0);
			}
			.textfaction {
				color: whitesmoke;
			text-shadow: 0 0 3px white;
					width:auto;
					 padding:7px;
				 font-size: 15px;
				 text-align:left !important;
				 text-align: center;
			}

				.container {
					display: block;
					width: auto;
					margin:  auto;
					text-align: center;
					padding: 10px;

				}

				a.fa {
					padding: 10px;
					font-size: 30px;
					width: 10px;
					height: 20%;
					text-align: center;
					text-decoration: none;
					margin: 5px 2px;
					border-radius: 50%;

				}

				iframe.responsivevid {
					height:250px;
					width: 300px;
				}

				.footp {
					padding: 7px;
					text-align: center;
					font-size: 15px;
				}

				.image {
					width: 270px;
					height: 150px;
				}



				image {
					text-align: left;
					float: left;

				}

				iframe.spotify {
					width: 300px;
					height:300px;
				}

}


/* iPhone 5 | 320px */

@media only screen and (max-width: 320px) {
	p {
		color: whitesmoke;
		 line-height: 1.8em;
			width:auto;
			 padding:5px;
		 font-size: 15px;
		 text-align:left !important;
		 text-align: center;
	}

	h2 {
		color: whitesmoke;
		text-align: center;
		margin-top: 60px;
		font-size: 40px;
		text-shadow: 3px 3px 3px  black;
		margin-bottom: 20px;
	}

	h1 {
		text-align: center;

		padding: 7px;
		font-size: 55px;
		text-shadow: 3px 3px 3px  black;
		color: whitesmoke;
		/*text-shadow: 3px 3px 3px  #74f0ce ;*/

	}

	.zoom {
		transition: transform .3s;

		overflow: hidden;



			 text-align:left !important;
			 text-align: center;
	}


	.zoomlik {
		transition: transform .3s;

		clear: both;
	}

	.zoom {
		transition: transform .3s;

		overflow: hidden;



			 text-align:left !important;
			 text-align: center;
	}


	.zoomlik {
		transition: transform .3s;

		clear: both;
	}

	.zoomlik:hover {
		-ms-transform: scale(1.5); /* IE 9 */
		-webkit-transform: scale(1.5); /* Safari 3-8 */
		transform: scale(1.0);
	}

	.zoom:hover {
		-ms-transform: scale(0.5); /* IE 9 */
		-webkit-transform: scale(0.5); /* Safari 3-8 */
		transform: scale(1.0);
	}
	p.textfaction {
		color: whitesmoke;
	text-shadow: 0 0 3px white;
			width:auto;
			 padding:5px;
		 font-size: 15px;
		 text-align:left !important;
		 text-align: center;
	}

		.container {
			display: block;
			width: auto;
			margin:  auto;
			text-align: center;
			padding: 10px;

		}

		iframe.responsivevid {
			height:200px;
			width: 280px;
		}

		.footp {
			padding: 7px;
			text-align: center;
			font-size: 15px;
		}






		iframe.spotify {
			width: 200px;
			height:200px;
		}

		a.fa {
			padding: 10px;
			font-size: 30px;
			width: 10px;
			height: 20%;
			text-align: center;
			text-decoration: none;
			margin: 5px 2px;
			border-radius: 50%;

		}

		div.text {

			visibility:  hidden;

		}

}


/* XIAOMI A2 | 1080px */

@media only screen and (max-width: 1080px) {
	p {
		color: whitesmoke;
		 line-height: 1.8em;
			width:auto;
			 padding:5px;
		 font-size: 15px;
		 text-align:left !important;
		 text-align: center;
	}

	h2 {
		color: whitesmoke;
		text-align: center;
		margin-top: 60px;
		font-size: 40px;
		text-shadow: 3px 3px 3px  black;
		margin-bottom: 20px;
	}

	h1 {
		text-align: center;

		padding: 7px;
		font-size: 55px;
		text-shadow: 3px 3px 3px  black;
		color: whitesmoke;
		/*text-shadow: 3px 3px 3px  #74f0ce ;*/

	}

		.zoom {
			transition: transform .3s;

			overflow: hidden;



				 text-align:left !important;
				 text-align: center;
		}



		.zoomlik {
			transition: transform .3s;

			clear: both;
		}

		.zoomlik:hover {
			-ms-transform: scale(1.5); /* IE 9 */
			-webkit-transform: scale(1.5); /* Safari 3-8 */
			transform: scale(1.0);
		}

		.zoom:hover {
			-ms-transform: scale(0.5); /* IE 9 */
			-webkit-transform: scale(0.5); /* Safari 3-8 */
			transform: scale(1.0);
		}
		.textfaction {
			color: whitesmoke;
		text-shadow: 0 0 3px white;
				width:auto;
				 padding:10px;
			 font-size: 15px;
			 text-align:left !important;
			 text-align: center;
		}
		.container {
			display: block;
			width: auto;
			margin:  auto;
			text-align: center;
			padding: 10px;

		}

		.responsivevid {
			height:500px;
			width: 700px;
		}

		.footp {
			padding: 7px;
			text-align: center;
			font-size: 15px;
		}

		.list {
			margin-left: 10px;
			padding: 7px;
			color: whitesmoke;
			font-size: 12px;
			text-align: left;
		}

		.sublist {
			text-align: left;
			margin-left: 70px;
			margin-top: 10px;
			margin-bottom: 10px;
			color: whitesmoke;
			font-size: 10px;
		}

		img.imagekeiki {

			width: 300px;
			height: 200px;

		}

		iframe {
			width: 930px;
			height: 560px;
		}

		a.fa {
		  padding: 10px;
		  font-size: 30px;
		  width: 10px;
			height: 20%;
		  text-align: center;
		  text-decoration: none;
		  margin: 5px 2px;
		  border-radius: 50%;

		}

		label {
			display: block;
			cursor: pointer;
			float:right;
			margin: 10px 10px 0px 0px;


		}
		nav ul{

			padding: 45px 0px 0px 0px;
			width: 100%;


		}
		nav ul li{
			display: block;
			margin: 0px;
			padding: 0px;
		}
		nav ul li a{
			width: 100%;
			padding: 0px;
			margin: 0px;
			height: 40px;
			border-radius: 0px 0px 0px 0px;
			padding-top:20px;
		}
			.meni{
			margin-top: 0px;
			text-align: center;
			display: none;
		}

		.meni a {
			display: block;
			border-bottom: 1px solid #5A5756;
			margin: 0;
			background-color: #030D1C;
		}
		#prekidac:checked+.meni{
			display: block;

		}

		div.text {

 		 visibility:  hidden;

 	 }



}
