/**************************************/
/**************************************/
/*                                    */
/*           STANDAARD CSS            */
/*          SWING HUISSTIJL           */
/*             VOOR JIVE              */
/*                                    */
/*            VERSIE 1.00             */
/*                                    */
/*        DONKER GRIJS = #424745         */
/*        DONKER BLAUW = #273a7c      */
/*                                    */
/**************************************/
/**************************************/

/* custom header */
header.custom.topheader {	
	padding: 0;
	height: 100px;	
	background: #FFF;
} 
 #header-image {
	 width: 420px;
	 height: 100px;
	 margin-left: 10px;
	 background: #FFF url("logo-Oostende.png") no-repeat top left;
	 background-size: auto 100%;
 }
/* standard button color, background and text color */
.button-color {
    border: 0 solid #FFF;
    background-color: #273a7c;
    color: #FFF;
}
 
/* disable button color, background and text color */
.button-color:disabled {
    background-color: #999;
    color: #CCC;
}
 
/* highlighted button color */
button.highlight {
    background-color: #273a7c;
}
 
/* error message color */
.error {
    color: DARKRED;
}
 
/* semi selected icon color, for example in the period control when some months from one year are selected */
.icon-color-low {
    color: #999;
}
 
/* default icon color */
.icon-color-reg {
    color: #273a7c;
}
 
/* selected icon color */
.icon-color-high {
    color: #273a7c;
}
 
/* delete icon color */
.icon-color-delete {
    color: RED;
}
 
/* unselected viewtype icon color */
.viewtype-color-back {
    color: #273a7c;
}
 
/* selected viewtype icon color */
.viewtype-color-front {
    color: #273a7c;
}
 
/* left panel header color */
.header-color {
	background: #424745;
	color: #FFF;
}
 
/* left panel icons li first elements */
.icon-color.high {
 color: #273a7c;
}
 
/* left panel icons li sub elements */
.icon-color{
	color: #000;
}
 
/* left panel icons new element */
.button-color.high {
	background-color: #273a7c;
	color: #FFF;
}
 
/* j-list icons active element */
.viewtype-color.high {
	color: #273a7c;
}
 
/* j-list icons in-active element */
.viewtype-color {
	color: #000;
}
 
/* spinner during loading */
.jive-spinner-holder .jive-spinner .side .fill {
	background: #273a7c;
}

/* border underline tabs */
.j-workspace-bar .j-list li.current .item {
    border-bottom-color: #273a7c;
}



/* menu */

	.logo img{	
		height: 80px;
		margin: 10px 30px 10px 10px;
		display: inline;
		float: left;
	}

	.menu {
		float: left;
		width: 100%;
	}
	.menu ul{
		display: inline;
		padding: 0;
		margin: 0;
		line-height: 100px;
	}
	.menu ul li{
		list-style-type: none;
		display: inline;
		margin: 0 .5em;
		position: relative;
		padding-bottom: 7px;
		font-size: 17px;
		color: #606060;
	}
	
	.menu ul li a {
		text-decoration: none;
		color: #606060;
		font-weight: bold;
		padding-bottom: .3em;
	}
	
	.menu ul li a:hover:before, .menu ul li a:focus:before, .menu ul li a:active:before {
		right: 0;
		left: 0;
	}
	
	.active:before{
		right: 0 !important;
		left: 0 !important;
	}
	.menu ul li a:before {
		content: "";
		position: absolute;
		right: 50%;
		bottom: 0;
		left: 50%;
		height: 3px;
		-webkit-transition-duration: 0.3s;
		transition-duration: 0.3s;
		background: #ababab;
	}
	
	.menu ul li a.active:before {
		content: "";
		position: absolute;
		right: 50%;
		bottom: 0;
		left: 50%;
		height: 3px;
		-webkit-transition-duration: 0.3s;
		transition-duration: 0.3s;
		background: #ababab;
	}



.logo-title {
    float: right;
    line-height: 100px;
    margin-right: 10px;
    font-size: 26px;
    color: #273a7c;
    text-transform: uppercase;
}

@media (max-width: 825px){
	.menu ul {
		display: none;
	}
}

@media (max-width: 620px){
	.logo-title {
		font-size: 18px;
	}
} 

@media (max-width: 435px){
	div#header-right{
		font-size: 1.5em;
		top: 38px;
	}
}

@media (max-width: 385px){
	div#header-right{
		font-size: 1.3em;
		top: 40px;
	}
}

@media (max-width: 343px){
	div#header-right{
		display: none;
	}
}