@import "variables.less";

/* ------------------------------------------------------------------------------------------------------------ */
/* ----- HTML, Body ----- */
/* ------------------------------------------------------------------------------------------------------------ */

html, body {
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
	.roboto-regular();
	font-variant-ligatures: none;
	padding-top: 60px;
}

div.interface-block {
    margin-top: 16px;
    display: none;
}

div.interface-block#error {
    color: #fdd000;
    background-color: #f9704b;
    padding: 16px;
    font-weight: bold;
}

div.interface-block#message {
  color: #f9704b;
  background-color: #fdd000;
  padding: 16px;
  font-weight: bold;
}

@media (max-width: 767px) {
	html, body{
		padding-top: 0px;
	}

	.navbar-shadow{
		display: none !important;
	}
}

.img-responsive{
	width: 100%;
}

/* ------------------------------------------------------------------------------------------------------------ */
/* ----- Typografie ----- */
/* ------------------------------------------------------------------------------------------------------------ */

a, a:hover, a:focus{
	.transition();
	text-decoration: none;
    color: @main_orange;
}

h1{
	.roboto-bold();
	.hyphens();
	color: @main_yellow;
	letter-spacing: 2px;
	font-size: 53px;
	margin-top: 0px;
	margin-bottom: 20px;
}

h2{
	.roboto-bold();
	font-weight: 600;
	.hyphens();
	color: @main_orange;
	margin-top: 45px;
	font-size: 32px;
}

h3{
	.roboto-medium();
	.hyphens();
	color: @main_orange;
	font-size: 25px;
	margin-top: 45px;
	font-weight: bolder;
}

h4{
	color: @main_yellow;
	.hyphens();
	.roboto-bold();
	font-size: 21px;
}

p{
	margin: 5px 0px 15px 0px;
	font-size: 20px;
	line-height: 31px;
}

blockquote{
	border-color: @main_yellow;
	font-style: italic;
	margin: 25px 0px;
}

ul li,
ol li{
	font-size: 20px;
	padding: 5px 0px;
}

a{
	color: @main_orange;
	.transition();
	&:visited{
		color: @main_orange;
	}
	&:hover{
		color: @main_yellow;
	}
}

.table-responsive{
	padding-left: 10px;
	padding-right: 10px;
	margin: 35px 0px;
}

.table{
	margin: 10px 0px 20px 0px;
	font-size: 19px;
	//border-top: 5px solid @main_yellow;

	thead{
		tr th{
			.roboto-bold();
			letter-spacing: 1px;
			padding: 12px 8px;
			border-bottom: 5px solid @main_yellow;
		}
	}

	tbody{
		tr td{
			.roboto-regular();
			padding: 12px 8px;
			border-top: 2px solid @main_gray;
		}
	}
}

@media (max-width: 991px) {
	h1{
		padding-bottom: 20px;
	}
}

@media (max-width: 767px) {
	h1{
		font-size: 43px;
	}

	h2{
		font-size: 35px;
	}

	p{
		font-size: 20px;
	}
}

@media (max-width: 319px) {
	h1{
		font-size: 35px;
	}
}

/* ------------------------------------------------------------------------------------------------------------ */
/* ----- Button ----- */
/* ------------------------------------------------------------------------------------------------------------ */

.btn-primary{
	background: none;
	border-radius: 0px;
	border: 5px solid #f9704b;
	color: #f9704b;
	.roboto-black();
	letter-spacing: 1px;
	font-size: 18px;
	padding: 9px 20px;
	.transition();

	&:hover,
	&:focus{
        background: @main_orange !important;
		border-color: @main_orange !important;
		color: white !important;
    }
	&:active:focus,
    &:active{
        background: @main_yellow !important;
        border-color: @main_orange !important;
        color: @main_orange !important;
		-webkit-box-shadow: none !important;
		box-shadow: none !important;
	}
}

/* ------------------------------------------------------------------------------------------------------------ */
/* ----- Navbar ----- */
/* ------------------------------------------------------------------------------------------------------------ */

.navbar{
	border-radius: 0px;
	min-height: 100px;
	z-index: 2;
}

.navbar-shadow {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 108px;
    z-index: 1;
    -webkit-box-shadow: 0px 0px 17px 0px rgba(0,0,0,0.15);
	-moz-box-shadow: 0px 0px 17px 0px rgba(0,0,0,0.15);
	box-shadow: 0px 0px 17px 0px rgba(0,0,0,0.15);
    display: none;
}

@media (max-width: 767px) {
	.navbar-shadow{
		height: 60px;
	}
}

.navbar-default{
	background-color: @main_yellow;
	border: none;

	.logo{
		width: 200px;
		margin-top: 12px;
		margin-left: 25px;
	}

	.search-text{
		display: none;
	}

	.navbar-nav>li>a{
		color: white;
		.roboto-black;
		font-size: 15px;
		letter-spacing: 2px;
		text-transform: uppercase;
		padding: 39px 30px;
		&:visited{
			color: white;
		}
		&:focus{
			color: white;
			outline: none !important;
		}
		&:hover{
			color: @main_orange;
		}
	}

	.navbar-nav > .open > a,
	.navbar-nav > .open > a:focus,
	.navbar-nav > .open > a:hover {
		color: @main_orange;
	}

	.navbar-nav li:last-child a{
		padding-right: 55px;
	}

	.navbar-nav>.active>a,
	.navbar-nav>.active>a:focus,
	.navbar-nav>.active>a:hover{
		background: none;
		color: @main_orange !important;
	}

	.navbar-nav>.open>a,
	.navbar-nav>.open>a:focus,
	.navbar-nav>.open>a:hover,
	.dropdown-menu>li>a:focus,
	.dropdown-menu>li>a:hover{
		background: none;
	}

	.navbar-nav>.open>a,
	.navbar-nav>.open>a:hover{
		color: @main_orange;
	}

	.navbar-nav>li>.dropdown-menu{
		border-radius: 0px;
		border: none;
		background-color: @main_orange;
		margin-top: -10px;
		-webkit-box-shadow: 0px 4px 17px 0px rgba(0,0,0,0.25);
		-moz-box-shadow: 0px 4px 17px 0px rgba(0,0,0,0.25);
		box-shadow: 0px 4px 17px 0px rgba(0,0,0,0.25);

		a{
			color: white;
			.roboto-black;
			text-transform: uppercase;
			letter-spacing: 1px;
			font-size: 16px;
			padding: 12px 25px 5px 25px;

			&:hover{
				color: @main_yellow;
			}
		}

		li:last-child a{
			padding-bottom: 12px;
		}
	}

	.dropdown-menu.bullet:before{
		display: none;
	}

	.dropdown-menu.bullet:after{
		border-bottom-color: @main_orange;
		top: -10px;
		border-width: 0 10px 10px;
	}
}

@media (max-width: 1140px) {
	.navbar-default{
		.navbar-nav>li>a{
			padding: 39px 17px;
		}

		.navbar-nav li:last-child a{
			padding-right: 20px;
		}
	}
}

@media (max-width: 950px) {
	.navbar-default{
		.logo{
			width: 130px;
			margin-top: 21px;
			margin-left: 10px;
		}

		.navbar-nav>li>a{
			font-size: 13px;
			padding: 39px 17px 39px 17px;
		}
	}
}

@media (max-width: 840px) {
	.navbar-default{
		.logo{
			width: 130px;
			margin-top: 21px;
			margin-left: 7px;
		}

		.navbar-nav>li>a{
			font-size: 13px;
			padding: 39px 13px 39px 13px;
		}
	}
}

@media (max-width: 767px) {

	.navbar-header{
		min-height: 60px;
	}

	.navbar{
		min-height: 60px;

		.logo{
			width: 150px;
			margin-top: -6px;
			margin-left: 5px;
		}
	}


	.dropdown-menu.bullet:before,
	.dropdown-menu.bullet:after{
		display: none;
	}

	ul.dropdown-menu.bullet.pull-center{
		margin-right: 0px !important;
	}

	.navbar-default{

		.search-text{
			display: inline;
		}

		.navbar-toggle{
			border: none;
			margin-top: 12px;
			&:hover{
				background: none;
			}

			.icon-bar{
				background-color: @main_orange;
			}

			.top-bar {
			    transform: rotate(45deg);
			    height: 3px;
			    transform-origin: 3px 3px;
			    .transition();
			}

			.middle-bar {
			    height: 3px;
			    opacity: 0;
			    .transition();
			}

			.bottom-bar {
			    transform: rotate(-45deg);
			    transform-origin: 1px -1px;
			    height: 3px;
			    .transition();
			}
		}

		.navbar-toggle.collapsed .top-bar {
		    transform: rotate(0deg);
		}

		.navbar-toggle.collapsed .middle-bar {
		    opacity: 1;
		}

		.navbar-toggle.collapsed .bottom-bar {
		    -webkit-transform: translate(0px, 0px);
		    transform: translate(0px, 0px);
		}

		.navbar-collapse{
			border: none;
			-webkit-box-shadow: none;
			box-shadow: none;
		}

		.navbar-nav>li>a{
			font-size: 15px;
			text-align: right;
			padding: 20px 30px;
		}

		.navbar-nav li:last-child a{
			padding-right: 30px;
		}

		.navbar-nav>li>.dropdown-menu{
			-webkit-box-shadow: none;
			-moz-box-shadow: none;
			box-shadow: none;
		}

		.navbar-nav .open .dropdown-menu>li>a{
			color: white;
			text-align: right;
			padding: 20px 30px 5px 25px;

			&:hover{
				color: @main_yellow;
			}
		}
	}
}



/* ------------------------------------------------------------------------------------------------------------ */
/* ----- Homepage ----- */
/* ------------------------------------------------------------------------------------------------------------ */

.home{
	.hero{
		margin: 0 auto;
		padding: 0px 20px;
	}

	.img{
		.box-shadow();
		margin-top: 12px;
	}

	.news-img{
		margin-top: 12px;
	}

	h2{
		.roboto-bold();
		color: @main_yellow;
		letter-spacing: 2px;
		font-size: 55px;
		margin-top: 0px;
	}

	.col-md-6,
	.col-sm-6{
		padding-left: 0px;
		padding-right: 30px;
	}

    .news-slider .slick-slide{
    	visibility: hidden;
	}

	.news-slider .slick-slide:first-child{
	    visibility: visible;
	}

	.slick-initialized.news-slider .slick-slide,
	.slick-initialized.news-slider .slick-slide:first-child{
	    visibility: visible;
	}

    .slick-dots{
	    bottom: -55px;
    }

    .slick-dots li button:before{
	    font-size: 10px;
	    color: @main_yellow;
	    opacity: 1;
	    .transition();
    }

    .slick-dots li.slick-active button:before{
	    color: @main_orange;
	    opacity: 1;
	    .transition();
    }


	.slick-prev,
	.slick-next
    .slick-prev:before,
    .slick-next:before{
	    display: none;
	    //color: @main_yellow;
		//opacity: 1;
		//font-family: 'Glyphicons Halflings';
    }

    /*.slick-prev{
	    left: -35px;
    }

    .slick-next{
	    right: -35px;
    }

    .slick-next:before{
	    content: "\e080";
    }

    .slick-prev:before{
	    content: "\e079";
    }*/
}

@media (max-width: 991px) {
	.home{

		.col-md-6{
			padding-right: 0px;
		}
	}
}

@media (max-width: 991px) {
	h2{
		padding-bottom: 20px;
	}
}

@media (max-width: 767px) {
	h2{
		font-size: 40px !important;
		.hyphens();
	}
}

@media (max-width: 319px) {
	h2{
		font-size: 35px !important;
	}
}

/* ------------------------------------------------------------------------------------------------------------ */
/* ----- Content ----- */
/* ------------------------------------------------------------------------------------------------------------ */

.header-img{
	margin-bottom: 30px;
	.box-shadow();
}

.gallery{
	margin-top: 30px;
}

.gallery-img{
	.box-shadow();
	.transition();
	margin: 0 auto;

	&:hover{
		-webkit-box-shadow: 0px 0px 25px 0px rgba(0,0,0,0.25);
		-moz-box-shadow: 0px 0px 25px 0px rgba(0,0,0,0.25);
		box-shadow: 0px 0px 25px 0px rgba(0,0,0,0.25);
	}
}

.popover{
    max-width: 100%;
}

/* ------------------------------------------------------------------------------------------------------------ */
/* ----- Bildbeschriftung ----- */
/* ------------------------------------------------------------------------------------------------------------ */

.figcaption-1{
	figure {
    	position: relative;
	}

	figure img {
	    display: block;
	}

	figcaption {
	    background: rgba(0, 0, 0, 0.55);
	    color: #FFF;
	    font-size: 15px;
	    position: absolute;
	    padding: 9px 0px 9px 12px;
	    bottom: 0;
	    left: 0;
	    right: 0;
	    .roboto-regular();
	    letter-spacing: .02em;
	}
}

.figcaption-2{
	figure {
    	position: relative;
	}

	figure img {
	    display: block;
	}

	figcaption {
	    //background: rgba(0, 0, 0, 0.5);
	    background-image: url(../img/figcaption-gradient.png);
	    background-repeat: repeat-x;
	    color: #FFF;
	    position: absolute;
		padding-top: 40px;
		padding-left: 15px;
		height: 71px;
	    bottom: 0;
	    left: 0;
	    right: 0;
	    .roboto-regular();
	    letter-spacing: .02em;
	    font-size: 15px;
	}
}



/* ------------------------------------------------------------------------------------------------------------ */
/* ----- News ----- */
/* ------------------------------------------------------------------------------------------------------------ */

.news{

	h1{
		margin-bottom: 50px;
	}

	.post{
		padding: 35px 15px;
	}

	.img{
		.box-shadow();
	}

	h2{
		margin-top: 0px;
	}
}

@media (max-width: 767px) {
	.news{
		h2{
			font-size: 27px !important;
			padding-bottom: 0px;
		}
	}
}

.pagination{

	margin-top: 35px;

	li{
		a{
			color: @main_orange;
			padding: 6px 18px;
			border: 2px solid @main_yellow;
			margin-left: -2px;
			&:hover{
				border: 2px solid @main_yellow;
				background-color: @main_yellow;
				color: white;
			}
		}
		&:first-child,
		&:last-child{
			a{
				border-top-left-radius: 0px;
				border-bottom-left-radius: 0px;
				border-top-right-radius: 0px;
				border-bottom-right-radius: 0px;
			}
		}
	}

	.active{
		a{
			background-color: @main_yellow;
			color: white;
			border-color: @main_yellow;
		}
	}
}

/* ------------------------------------------------------------------------------------------------------------ */
/* ----- Footer ----- */
/* ------------------------------------------------------------------------------------------------------------ */

html {
    position: relative;
    min-height: 100%;
}

body {
    /* Margin bottom by footer height */
    margin-bottom: 80px;
}

footer{
	background-color: @main_gray;
	position: absolute;
    bottom: 0;
    width: 100%;
    height: 80px;
    .roboto-black;

    .logo{
	 	width: 120px;
	 	margin-left: 25px;
	 	margin-top: 23px;
	 	display: inline;
    }

    ul li{
	    list-style: none;
	    text-transform: uppercase;
	    padding: 30px 20px 0px 0px;
	    font-size: 14px;
		a{
			color: @main_gray_darken;
			letter-spacing: 1px;
			&:visited{
				color: @main_gray_darken;
			}
			&:hover{
				color: @main_orange;
			}
		}
    }
}

@media (max-width: 345px) {
	footer{
		.logo{
			display: none;
		}
	}
}

/* ------------------------------------------------------------------------------------------------------------ */
/* ----- Suchergebnisse ----- */
/* ------------------------------------------------------------------------------------------------------------ */

#tipue_search_results_count{
	font-family: 'Roboto', Helvetica, Arial, sans-serif;
	font-weight: 700 !important;
	-moz-hyphens: auto;
	-o-hyphens: auto;
	-webkit-hyphens: auto;
	-ms-hyphens: auto;
	hyphens: auto;
	-webkit-hyphenate-limit-before: 4;
	hyphenate-limit-chars: 4;
	hyphenate-limit-lines: 2;
	color: @main_yellow;
	letter-spacing: 2px;
	font-size: 53px !important;
	margin-top: 0px !important;
	margin-bottom: 20px !important;
}

.tipue_search_content_title{
	.roboto-bold();
	.hyphens();
	color: @main_orange;
	font-size: 25px !important;
	margin-top: 25px !important;
	padding-top: 25px !important;
	border-top: 2px solid #eeeeee !important;
	font-weight: 700 !important;
}

.tipue_search_content_url{
	.hyphens();
	.roboto-bold();
	font-size: 21px;
	margin-top: 6px;

	a{
		color: @main_yellow;
		&:hover{
			color: @main_orange;
		}
	}
}

.tipue_search_content_text{
	margin: 5px 0px 15px 0px;
	font-size: 20px;
	line-height: 31px;
}

.h01{
	background-color: @main_yellow;
	padding: 2px 5px;
}

#tipue_search_foot{
	text-align: center;
	margin: 91px 0 21px 0 !important;
}

#tipue_search_foot_boxes li a,
#tipue_search_foot_boxes li.current{
	margin-right: -2px !important;
	border: 2px solid @main_yellow !important;
	color: @main_orange !important;
	.transition();
	&:hover{
		background-color: @main_yellow !important;
		color: white !important;
		cursor: pointer !important;
	}
}

#tipue_search_foot_boxes li.current{
	background-color: @main_yellow !important;
	color: white !important;
}

/* ------------------------------------------------------------------------------------------------------------ */
/* ----- Suche ----- */
/* ------------------------------------------------------------------------------------------------------------ */

.searchmodal{

	.modal-content{
		border-radius: 0px;
	}

	.modal-header{
		border: none;
		background: @main_yellow;
		border-top-left-radius: 0px;
		border-top-right-radius: 0px;

		.modal-title{
			color: white;
			text-transform: uppercase;
			letter-spacing: 1px;
			font-size: 14px;
			font-weight: 700;
			padding-top: 2px;
		}
	}

	.modal-footer{
		border: none;
	}

	.close{
		color: white;
		opacity: 1;
		.transition();
		&:hover{
			opacity: .5;
			.transition();
		}
	}

	.form-control{
		height: 60px;
		border: none;
		border-bottom: 2px solid @main_yellow;
		border-radius: 0px;
		-webkit-box-shadow: none;
		box-shadow: none;
		font-size: 18px;
	}

	::-webkit-input-placeholder {
	   font-size: 18px;
	}

	:-moz-placeholder { /* Firefox 18- */
	   font-size: 18px;
	}

	::-moz-placeholder {  /* Firefox 19+ */
	   font-size: 18px;
	}

	:-ms-input-placeholder {
	   font-size: 18px;
	}

	.btn-search{
		background-color: @main_orange;
		color: white;
		&:hover{
			background-color: @main_yellow !important;
		}
	}
}

@media only screen and (max-width: 992px) {
	.searchmodal{
		.modal-header{
			.modal-title{
				color: white;
				text-transform: uppercase;
				letter-spacing: 1px;
				font-size: 14px !important;
				font-weight: 700;
				padding-bottom: 0px;
			}
		}

		.btn-primary{
			font-size: 15px;
			padding: 7px 15px;
		}
	}
}

@media only screen and (min-width: 768px) {
	.modal {
		text-align: center;
	}
	.modal:before {
		display: inline-block;
		vertical-align: middle;
		content: " ";
		height: 100%;
	}

	.modal-dialog {
		display: inline-block;
		text-align: left;
		vertical-align: middle;
	}

	.modal.fade .modal-dialog {
		-webkit-transform: translate3d(0, 0, 0);
		-webkit-backface-visibility: hidden;
		-webkit-perspective: 1000;
		will-change: transform;

		-webkit-transform: scale(0.85);
		-moz-transform: scale(0.85);
		-ms-transform: scale(0.85);
		transform: scale(0.85);
		opacity: 0;
		-webkit-transition: all 0.3s ease;
		-moz-transition: all 0.3s ease;
		transition: all 0.3s ease;
	}

	.modal.fade.in .modal-dialog {
		-webkit-transform: translate3d(0, 0, 0);
		-webkit-backface-visibility: hidden;
		-webkit-perspective: 1000;
		will-change: transform;

		-webkit-transform: scale(1);
		-moz-transform: scale(1);
		-ms-transform: scale(1);
		transform: scale(1);
		opacity: 1;
	}
}


/* ------------------------------------------------------------------------------------------------------------ */
/* ----- Helper ----- */
/* ------------------------------------------------------------------------------------------------------------ */

.big-buffer{
	margin: 80px 0px;
}

.small-buffer{
	margin: 25px 0px;
}

.top-buffer{
	margin-top: 40px;
}

.bottom-buffer{
	margin-bottom: 40px;
}

@media (max-width: 767px) {
	.big-buffer{
		margin: 40px 0px;
	}

	.top-buffer{
		margin-top: 20px;
	}

	.bottom-buffer{
		margin-bottom: 20px;
	}
}

/* ------------------------------------------------------------------------------------------------------------ */
/* ----- Selection ----- */
/* ------------------------------------------------------------------------------------------------------------ */

::selection {
    background: @main_orange;
    color: white;
}
::-moz-selection {
    background: @main_orange;
    color: white;
}

/* ------------------------------------------------------------------------------------------------------------ */
/* ----- LÖSCHEN !!! ----- */
/* ------------------------------------------------------------------------------------------------------------ */

#tipue_search_content
{
	padding-top: 15px;
	margin: 0;
}

#tipue_search_warning a
{
     color: #396;
     text-decoration: none;
}
#tipue_search_warning a:hover
{
     color: #555;
}
#tipue_search_warning,
#tipue_search_results_count
{
    font-size: 55px;
    line-height: 1.7;
	color: #fdd000;
    letter-spacing: 2px;
    font-family: RobotoBold, Helvetica, Arial, sans-serif;
    font-weight: 600;
}
.tipue_search_content_title
{
     font-weight: 300;
     font-size: 21px;
     line-height: 1.7;
	margin-top: 23px;
}
/*
.tipue_search_content_title a
{
     color: #333;
     text-decoration: none;
}
.tipue_search_content_title a:hover
{
     color: #555;
}
.tipue_search_content_url
{
     word-wrap: break-word;
     hyphens: auto;
}

.tipue_search_content_url a:hover
{
     color: #555;
}
.tipue_search_content_text
{
    font-weight: 300;
    font-size: 15px;
    line-height: 1.6
	color: #555;
    word-wrap: break-word;
    hyphens: auto;
    margin-top: 3px;
}

*/
.tipue_search_content_debug
{
    font-weight: 300;
    font-size: 13px;
    line-height: 1.6;
	color: #555;
    margin: 5px 0;
}
.h01
{
     color: #333;
     font-weight: 400;
}

#tipue_search_foot
{
    margin: 51px 0 21px 0;
    text-align: center;
}
#tipue_search_foot_boxes
{
	padding: 0;
	margin: 0;
    font-size: 12px;
}
#tipue_search_foot_boxes li
{
	list-style: none;
	margin: 0;
	padding: 0;
	display: inline;
}
#tipue_search_foot_boxes li a
{
	padding: 10px 17px 11px 17px;
     background-color: #fff;
     border: 1px solid #e2e2e2;
     border-radius: 1px;
	color: #333;
	margin-right: 7px;
	text-decoration: none;
	text-align: center;
}
#tipue_search_foot_boxes li.current
{
	padding: 10px 17px 11px 17px;
     background: #f6f6f6;
     border: 1px solid #e2e2e2;
     border-radius: 1px;
	color: #333;
	margin-right: 7px;
	text-align: center;
}
#tipue_search_foot_boxes li a:hover
{
     background: #f6f6f6;
}


/* spinner */


.tipue_search_spinner
{
     padding: 31px 0;
     width: 50px;
     height: 28px;
}
.tipue_search_spinner > div
{
     background-color: #777;
     height: 100%;
     width: 3px;
     display: inline-block;
     margin-right: 2px;
     -webkit-animation: stretchdelay 1.2s infinite ease-in-out;
     animation: stretchdelay 1.2s infinite ease-in-out;
}
.tipue_search_spinner .tipue_search_rect2
{
     -webkit-animation-delay: -1.1s;
     animation-delay: -1.1s;
}
.tipue_search_spinner .tipue_search_rect3
{
     -webkit-animation-delay: -1.0s;
     animation-delay: -1.0s;
}
@-webkit-keyframes stretchdelay
{
     0%, 40%, 100%
     {
          -webkit-transform: scaleY(0.4)
     }
     20%
     {
          -webkit-transform: scaleY(1.0)
     }
}
@keyframes stretchdelay
{
     0%, 40%, 100%
     {
          transform: scaleY(0.4);
          -webkit-transform: scaleY(0.4);
     }
     20%
     {
          transform: scaleY(1.0);
          -webkit-transform: scaleY(1.0);
     }
}


/* ------------------------------------------------------------------------------------------------------------ */
/* ----- Projekte ----- */
/* ------------------------------------------------------------------------------------------------------------ */

.projekte{
	.navbar-default{
		background-color: @main_orange;

		.navbar-nav>li>a{
			&:hover{
				color: @main_yellow;
			}
		}

		.navbar-nav > .open > a,
		.navbar-nav > .open > a:focus,
		.navbar-nav > .open > a:hover {
			color: @main_orange;
		}

		.navbar-nav > .open > a,
		.navbar-nav > .open > a:focus,
		.navbar-nav > .open > a:hover {
			color: @main_yellow;
		}

		.navbar-nav>.active>a,
		.navbar-nav>.active>a:focus,
		.navbar-nav>.active>a:hover{
			background: none;
			color: @main_yellow !important;
		}

		.navbar-nav>.open>a,
		.navbar-nav>.open>a:hover{
			color: @main_yellow;
		}

		.navbar-toggle{
			.icon-bar{
				background-color: @main_yellow;
			}
		}

		.navbar-nav>li>.dropdown-menu{
			background-color: @main_yellow;

			a{
				&:hover{
					color: @main_orange;
				}
			}
		}

		.dropdown-menu.bullet:after{
			border-bottom-color: @main_yellow;
		}
	}

	h1{
		color: @main_orange;
	}

	h2{
		color: @main_yellow;
	}

	p{
		margin-bottom: 30px;
	}

	br {
       line-height: 150%;
    }

	.project-img-left{
		width: 600px;
		float: left;
		margin: 15px 20px 15px 0px;
	}

	.project-img-right{
		width: 600px;
		float: right;
		margin: 15px 0px 15px 20px;
	}

	.project-img-full{
		width: 100%;
		margin: 15px 0px;
	}

	.project-img-left-small{
		width: 300px;
		float: left;
		margin: 15px 20px 15px 0px;
	}

	.project-img-right-small{
		width: 300px;
		float: right;
		margin: 15px 0px 15px 20px;
	}

	@media only screen and (max-width : 992px) {
		.project-img-left{
			width: 100%;
			float: none;
			margin: 15px 0px;
		}

		.project-img-right{
			width: 100%;
			float: none;
			margin: 15px 0px;
		}
	}

	/* ------------------------------------------------------------------------------------------------------------ */
	/* ----- Projekt-Kachel ----- */
	/* ------------------------------------------------------------------------------------------------------------ */

	.project-tile{
		.project {
	    	position: relative;
	    	&:hover{
		    	.projectname{
			    	padding: 40px 25px 40px 25px;
					.transition();
		    	}
	    	}
		}

		.project img {
		    display: block;
		    width: 100%;
		}

		.projectname {
		    background: @main_orange;
		    color: white;
		    font-size: 25px;
		    position: absolute;
		    padding: 30px 25px 30px 25px;
		    bottom: 0;
		    left: 0;
		    //right: 0;
		    .roboto-bold();
		    letter-spacing: .02em;
		    opacity: .9;
		    .transition();
		}
	}

	@media only screen and (max-width : 500px) {
		.project-tile{
			.project {
		    	&:hover{
			    	.projectname{
				    	padding: 30px 25px;
			    	}
		    	}
			}

			.projectname{
				font-size: 20px;
				padding: 20px 25px;
			}
		}
	}
}