﻿@font-face {
    font-family: 'eva';
    src: url('../fonts/eva.eot?#iefix') format('embedded-opentype'), 
         url('../fonts/eva.woff') format('woff'), 
         url('../fonts/eva.ttf')  format('truetype'),
         url('../fonts/eva.svg#svgFontName') format('svg');
    }

@font-face {
    font-family: 'geo';
    src: url('../fonts/geo.eot?#iefix') format('embedded-opentype'), 
         url('../fonts/geo.woff') format('woff'), 
         url('../fonts/geo.ttf')  format('truetype'),
         url('../fonts/geo.svg#svgFontName') format('svg');
    }

@font-face {
    font-family: 'robotolight';
    src: url('../fonts/robotolight.eot?#iefix') format('embedded-opentype'), 
         url('../fonts/robotolight.woff') format('woff'), 
         url('../fonts/robotolight.ttf')  format('truetype'),
         url('../fonts/robotolight.svg#svgFontName') format('svg');
    }

@font-face {
    font-family: 'robotothin';
    src: url('../fonts/robotothin.ttf') format('truetype');
}

/*################################################### Color ###################################################*/
body {
	background-color: #111;
}
.text-white {
  color: #fff;
}
.text-black {
  color: #000;
}
.text-grey {
  color: #999;
  text-align: justify;
}
.text-lightgrey {
  color: #eee;
}
.text-blue {
  color: rgb(92,195,246);
}
.background-dark {
  width: 100%;
  background-color: #111;
}
.background-black {
  width: 100%;
  background-color: #000;
}

.background-grey {
  width: 100%;
  background-color: #484848;
}
.vid-opacity:hover {
	opacity: 0.90;
}
.vid-opacity {
	opacity: 0.65;
}

.logo-opacity:hover {
	opacity: 0.5;
}
.logo-opacity {
	opacity: 0.3;
}

.logo-opacity2:hover {
	opacity: 0.5;
}
.logo-opacity2 {
	opacity: 0.8;
}

.count-opacity:hover {
	opacity: 1.0;
}
.count-opacity {
	opacity: 0.9;
}

.navbar-inverse .navbar-nav > .active > a,
.navbar-inverse .navbar-nav > .active > a:hover,
.navbar-inverse .navbar-nav > .active > a:focus {
    color: #fff;
    background-color: inherit;
}
a {
  color: #777;
  text-decoration: none;
}
a:hover {
  color: #eee;
  text-decoration: none;
}

.carousel-indicators .active {
	background-color: #555;
}

/*################################################### Navigation Bar ###################################################*/
.navbar {
    margin-bottom: 0px;
	opacity: 0.9;
	border: 0px;
}
.navbar-inverse {
  background-color: #000;
  border-bottom: 1px solid #222;
  border-top: 1px solid #222;
}

.navbar-brand {
	font-family: eva;
	color: #eee;
	font-size: 130%;
	float: left;
	padding: 18px;
}
.nav2 {
	background-color: #111;
	/*border-bottom: 1px solid #333;*/
}
.nav3{
	background-color: #222;
	/*border-bottom: 1px solid #333;*/
}
.navbar-inverse .navbar-brand {
  color: #fff;
}

/* Center second Navbar */
.navbar-centered .navbar-nav {
	float: none;
	text-align: center;
}
.navbar-centered .navbar-nav > li {
	float: none;
}
.navbar-centered .nav > li {
	display: inline;
}
.navbar-centered .nav > li > a {
	display: inline-block;
}
.nav > .active > a,
.nav > li > a:hover,
.nav > li > a:hover,
.nav > li > a:focus {
  color: #9d9d9d;
  text-decoration: none;
  background-color: inherit;
}
.navbar-nav {
		margin: 0px;
}

  .navbar-fixed-top .navbar-collapse,
  .navbar-static-top .navbar-collapse,
  .navbar-fixed-bottom .navbar-collapse {
    padding-right: 15px;
    padding-left: 15px;
  }

/*################################################### Footer ###################################################*/
.footer-bottom {
	border-radius: 0;
	opacity: 0.9;
}

blockquote small:before {
  content: '';
}

blockquote footer {
  color: #000;
}

/*################################################### Texts ###################################################*/
.start p,
.start h2,
.start h3,
.start h4,
.start h5 {
    text-align: center;
}

h1,
h2,
h3,
h4,
h5 {
	font-family: 'robotothin';
}

h1 {
font-size: 300%;
}
h3 {
font-size: 120%;
}
h4 {
font-size: 100%;
}
h5 {
font-size: 170%;
}


@media (min-width: 768px) {
	h1 {
		font-size: 400%;
	}
	h3 {
		font-size: 135%;
	}
	h4 {
		font-size: 110%;
	}
	h5 {
		font-size: 235%;
	}
}

@media (min-width: 992px) {
	h1 {
		font-size: 500%;
	}
	h3 {
		font-size: 150%;
	}
	h4 {
		font-size: 120%;
	}
	h5 {
		font-size: 300%;
	}
}



/*################################################### Container ###################################################*/
.container {
  margin-right: auto;
  margin-left: auto;
  max-width: 1200px;
}
.container-nav {
  margin-right: 0%;
  margin-left: 5%;
  width: 95%;
}

.blockquote-reverse {
	text-align: left;
}
.blockquote-reverse .small:after,
blockquote.pull-right .small:after {
  content: '';
}
blockquote small:after {
  content: '';
}

blockquote footer,
blockquote small,
blockquote .small {
  /*font-family: montserratul;*/
  font-family: robotolight;
  display: block;
  font-size: 16px;
  line-height: 1.6;
}

.vertical-center {
        display: inline-block;
        float: none;
        vertical-align: middle;
}

.vertical-top {
        display: inline-block;
        float: none;
        vertical-align: top;
}

.vertical-bottom {
        display: inline-block;
        float: none;
        vertical-align: bottom;
}
.carousel {
  position: relative;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
}

.carousel_op {
  opacity: 0.8;
}

.carousel-inner {
  position: relative;
  overflow: hidden;
}
.costum-quote {
	border-left: 0px;
	color: #fff;
	padding: 20px 0px;
	margin: 0px;
}

.costum-quote2 {
	border-left: 0px;
	color: #fff;
	margin: 0px;
	padding: 0px;
}

.costum-quote3 {
	border-left: 0px;
	color: #fff;
	margin: 0px;
	padding: 0px 0px 5px 0px;
}
/*################################################### Pictures ###################################################*/

/* A4-SFX */
.picture_header {
    background: url(../../img/a4sfx/header.jpg) no-repeat center;
	vertical-align: top;
}
.picture_side_l {
    background: url(../../img/a4sfx_img/a4sfx_1.jpg) no-repeat center;
}
.picture_side_l_temp {
    background: url(../../img/a4sfx_img/a4sfx_6.jpg?124) no-repeat center;
}
.picture_side_r {
    background: url(../../img/a4sfx_img/a4sfx_2.jpg) no-repeat center;
}
.picture_side_r_temp {
    background: url(../../img/a4sfx_img/a4sfx_5.jpg?124) no-repeat center;
}

/* C4-SFX */
.picture_header_c4 {
    background: url(../../img/c4sfx/header2.jpg) no-repeat center;
	vertical-align: top;
}
.picture_side_l_c4 {
    background: url(../../img/c4sfx_img/c4sfx_1.jpg) no-repeat center;
}
.picture_side_l_temp1_c4 {
    background: url(../../img/c4sfx_img/c4sfx_2.jpg) no-repeat center;
}
.picture_side_l_temp2_c4 {
    background: url(../../img/c4sfx_img/c4sfx_3.jpg) no-repeat center;
}
.picture_side_l_temp3_c4 {
    background: url(../../img/c4sfx_img/c4sfx_4.jpg) no-repeat center;
}

.picture_side_r_c4 {
    background: url(../../img/c4sfx_img/c4sfx_5.jpg) no-repeat center;
}
.picture_side_r_temp1_c4 {
    background: url(../../img/c4sfx_img/c4sfx_6.jpg) no-repeat center;
}
.picture_side_r_temp2_c4 {
    background: url(../../img/c4sfx_img/c4sfx_7.jpg) no-repeat center;
}
.picture_side_r_temp3_c4 {
    background: url(../../img/c4sfx_img/c4sfx_8.jpg) no-repeat center;
}

.picture_b,
.picture_header,
.picture_header_c4 {
	width: 100%;
	height: auto;
	min-height:300px;
	height: 50px; /*Firefox workaround*/
	-webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}
	
.picture-index {
	margin-top: 50px;
    width: 100%;
    height: calc(100% - 50px);
    background: url(../../img/index/header3.jpg) no-repeat center;
	background-position: 40%;
	-webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}

.picture_header .intro-body {
	vertical-align: top;
}

.picture_header_c4 .intro-body {
	vertical-align: top;
}

.intro {
    display: table;
    vertical-align: bottom;
    color: #CCC;
    background-color: #000;
}

.intro .intro-body {
    display: table-cell;
    vertical-align: bottom;
}
.picture_header .intro-body {
	vertical-align: top;
}

.picture_header_c4 .intro-body {
	vertical-align: top;
}

/*################################################### Media ###################################################*/
@media(min-width:992px) {
	
	.picture_header,
	.picture_header_c4 {
		width: 100%;
		height: auto;
		min-height:800px;
		height: 50px; /*Firefox workaround*/
	}
	
	.picture_b {
		width: 100%;
		height: auto; /*Firefox workaround*/
		min-height: 650px;
		height: 50px;
	}
	
	.picture-index {
	margin-top: 0px;
    width: 100%;
    height: calc(100% - 50px);
	}
}

@media (max-width: 991px) {
	.hide-xs {
		display: none;
	}
}
@media (min-width: 992px) {
	.hide-sm {
		display: none;
	}
}

@media(min-width:2200px) {
	
	.picture_header,
	.picture_header_c4 {
		width: 100%;
		height: auto;
		min-height:1200px;
		height: 50px; /*Firefox workaround*/
	}
}
/*################################################### Other ###################################################*/
.row {
    margin-right: 0px;
    margin-left: 0px;
}
.row-centered {
    text-align:center;
}
.divider {
		height: 15px;
		margin: 0px 15px 10px 15px;
		border-bottom: 1px solid #777;
}
.col-centered {
    display:inline-block;
    float:none;
    /* reset the text-align */
    text-align:left;
    /* inline-block space fix */
    margin-right: -4px;
}
/*################################################### Buttons and Scrollbars ###################################################*/
.jumbotron {
	text-align: center;
	background-color: rgba(34, 34, 34, 0.5);
	margin: 0;
	padding: 10px;
}

button, input, optgroup, select, textarea {
    margin: 0;
    font: inherit;
    color: #eee;
	background-color: #000;
}

select.input-lg {
  height: 46px;
  line-height: 46px;
  background-color: #000;
  color: #eee;
}

.input-lg {
  height: 46px;
  line-height: 46px;
  background-color: #000;
  color: #eee;
}

::-webkit-scrollbar
{
  width: 12px;  /* for vertical scrollbars */
  height: 12px; /* for horizontal scrollbars */
}

::-webkit-scrollbar-track
{
  background: #111;
}

::-webkit-scrollbar-thumb
{
  background: #444;
}
}
/*################################################### Gallery ###################################################*/

/* Main carousel style */
.carousel {
    width: 100%;
}

.article-slide .carousel-thumbs {
	margin-left: 10px;
}

/* Indicators images style */
.article-slide .carousel-thumbs img {
    border: 2px solid #777;
    width: 100%;
	height: auto;
	margin-bottom: 10px;
}
/* Indicators active image style */
.article-slide  .carousel-thumbs .active img {
    border: 2px solid rgb(92,195,246);
	margin-bottom: 10px;
}	