/*
*/
/* 
    Created on : 2016-09-05, 00:27:37
    Author     : Ilustri
*/
.homepagetekst {
	width: 20vw;
	float: left;
	height:65vh;
	position:relative;
	padding-left:5vw;
}

.homepagetitle {
	font-size: 3vh;
	font-family: 'PT Serif', serif;
	font-weight: bold;
	color: #CD161B;
	height: 10vh;
	position:absolute;
	top:0;
}
.homepageempty{
}
.homepageinfo {
	height: 8vh;
	font-size: 1.5vh;
	font-family: 'PT Serif', serif;
	font-weight: bold;
	position:absolute;
	bottom:5vh;
}
.homepagebutton{
	height: 5vh;
	font-size: 1.2vh;
	position:absolute;
	bottom:0;
	text-transform: uppercase;
	
}
.homepagebutton>a{	
	width: 11vw;
	border: 1px solid;
	margin: 0 auto;
	padding: 5px 10px;	
}

.homepagegallery{
	float: left;
	padding: 0 0 0 10vw;
	margin-top: -10vw;
	overflow: visible;
	height: 900px;
}
.item.carousel-item a {
	color: black;
}
.item.carousel-item a:hover {
	text-decoration:none;
}
.ngg-galleryoverview{
	overflow:visible;
	width: 20vw;
}
.carousel-inner {
    overflow: visible;
}

.number {
	position: relative;
	font-size: 6vw;
	left: -6vw;
	top: -15vw;
	font-family: 'PT Serif', serif !important;
}
 
.up {
     left:initial;
     right:0;
     top: 40%;
 }   
        
.down {
    left:initial;
    right: 0;
    top: 50%;
 }
 
 .carousel-control {
    color: #777777;
    text-align: center;
    text-shadow: 0 1px 2px rgb(0, 0, 0);
	}
	
.item.carousel-item.active>a:nth-child(1)>div{

	width: 100px;
	height: auto;
	opacity: 0.5;
	-webkit-transition: width 1s, opacity 1s; /* Safari */
    transition: width 1s, opacity 1s;
	transition-timing-function: linear;
}

.item.carousel-item.active>a:nth-child(2){

}
.item.carousel-item.active>a:nth-child(3)>div{

	width: 100px;
	height: auto;
	opacity: 0.5;
	-webkit-transition: width 1s, opacity 1s; /* Safari */
    transition: width 1s, opacity 1s;
	transition-timing-function: linear;
}


.content-area>.site-main>article {
    padding-bottom: 0;
}


/***
 * Bootstrap relies on CSS transitions for animation, which makes it
 * easy to override.  Just add the vertical class to your carousel:
 * <div class='carousel vertical'>...</div>
 ***/

.carousel.vertical .carousel-inner {
  height: 100%;
}
.carousel.vertical .item {
  -webkit-transition: 0.6s ease-in-out top;
  -moz-transition:    0.6s ease-in-out top;
  -ms-transition:     0.6s ease-in-out top;
  -o-transition:      0.6s ease-in-out top;
      -webkit-transition: 0.6s ease-in-out visible;
  -moz-transition:    0.6s ease-in-out visible;
  -ms-transition:     0.6s ease-in-out visible;
  -o-transition:      0.6s ease-in-out visible;
          -webkit-transition: 0.6s ease-in-out opacity;
  -moz-transition:    0.6s ease-in-out opacity;
  -ms-transition:     0.6s ease-in-out opacity;
  -o-transition:      0.6s ease-in-out opacity;
    left:0;
}

.carousel.vertical .active,
.carousel.vertical .next.left,
.carousel.vertical .prev.right    { top:     0; }
        
.carousel.vertical .next,
.carousel.vertical .active.right  { top:  100%; }
        
.carousel.vertical .prev,
.carousel.vertical .active.left   { top: -100%; }