/* Import other css */
@import url('reset.css');
@import url('social.css');
@import url('comments.css');
@import url('widgets.css');


/* GENERAL ------------------------------------------------------------*/

article, aside, canvas, figure, figure img, figcaption, hgroup,
footer, header, nav, section, audio, video {
	display: block;
}

.clearfix{ clear:both; }

.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}


.wrapper{
	margin: 0 auto; 
	position: relative;
}

body{
	font-family: Helvetica, Arial, sans-serif;
	font-size: 13px;
}



body p{
	margin-bottom: 21px;
}

body a{
	text-decoration: none;
	
	-webkit-transition: color 0.3s ease;
	-moz-transition: color 0.3s ease;
	-o-transition: color 0.3s ease;
	transition: color 0.3s ease;
}



#logo{
	display: inline-block;
	padding-top: 10px;
	padding-bottom: 20px;
}

#logo:hover{ opacity: 0.8;}

h1,h2,h3,h4,h5,h6{
	font-family: 'Yanone Kaffeesatz', Arial, sans-serif;
	font-weight: 400;
}

h1{ font-size: 48px;}

h2{ font-size: 36px; }

h3{ font-size: 24px; }

h4{ font-size: 21px; }

h5{ font-size: 18px; }

h6{ font-size: 14px; }

#main,
footer,
aside{ line-height: 1.5em; }


.wrapper {
	width: 940px;
}

.right{
	float: right;
}

.left{
	float: left;
}


.right:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}

#top-widget-holder,
footer,
aside{
    font-size: 12px;
    line-height: 1.5em;
}

.page-heading{
	text-align: left;
	margin-bottom: 15px;
	background: url(../img/div-line.png) repeat-x center center;
}

.page-heading span{
	padding: 0px 20px;
	margin-left: 20px;
}


/* WIDGETS------------------------------------------------*/

#top-widget-holder{
    z-index: 1000;
    position: relative;
    
    -webkit-box-shadow: 0px 1px 2px rgba(0,0,0,.5); 
    -moz-box-shadow: 0px 1px 2px rgba(0,0,0,.5);
    -o-box-shadow: 0px 1px 2px rgba(0,0,0,.5);
    box-shadow: 0px 1px 2px rgba(0,0,0,.5);
}

#top-widget{
	display: none;
}

#top-widget .padding{
	padding-top: 20px;
    padding-bottom: 30px;
}

#top-open{
	position: absolute;
	bottom: -42px;
	right: 0px;
	display: block;
	width: 42px;
	height: 42px;
	background: url(../img/top-open.png) no-repeat 0px 0px ;
	
	text-indent: -9000px;
}

#top-open.tab-closed{
	background-position: -44px 0px;	
}

/* WIDGET COLS ------------------------------------------------------------*/

.widget-cols h4{
	margin-bottom: 21px;
}

.widget-cols>li{
	width: 220px;
	float: left;
	margin-right: 20px;
}

.widget-cols>li.fourth-col{
	margin-right: 0px;
}


/* COMBO NAVIGATION ------------------------------------------------------------*/
#comboNav {
  width: 100%;
  margin-top: 40px;
  margin-bottom: 30px;
  float: left;
}

/* NAVIGATION ------------------------------------------------------------*/


nav{
	margin-top: 0px;
	height: 30px;
}


nav a{
	text-decoration: none;
}

#nav li{
	margin-right: 20px;
}

#nav>li>a{
	font-family: 'Yanone Kaffeesatz', Arial, sans-serif;
	font-size: 18px;
	font-weight: 300;
	display: block;
	overflow: hidden;
	padding: 0px 0px 7px 0px;
	text-shadow: 2px 2px 0px rgba(0, 0, 0, .6);
}


#nav>li.current-menu-item>a,
#nav>li.current_page_item>a{
	border-bottom: solid #ebebe8 5px;
}



/* sub navigation -----------------------------------------------------*/

#nav>li ul{
	display: block;
	margin-top: -10px;
	
	-webkit-box-shadow: 2px 2px 0px rgba(0,0,0,.2);
	-moz-box-shadow: 2px 2px 0px rgba(0,0,0,.2);
	-o-box-shadow: 2px 2px 0px rgba(0,0,0,.2);
	box-shadow: 2px 2px 0px rgba(0,0,0,.2);
	
}

#nav>li ul li a{
	display: block;
	padding: 15px 20px;
	display: block;
	font-size: 11px;
	text-decoration: none;
}

#nav>li ul li a span{
	display: block;
}



/* BREADCRUMBS ------------------------------------------------------------*/

.breadcrumbs{
	position: absolute;
	overflow: hidden;
	top: -18px;
	left: 0px;
	height: auto;
	font-size: 11px;
}

.breadcrumbs a{
	text-decoration: none;
	
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

.breadcrumbs li{
	display: inline;
}


.breadcrumbs li strong{
	font-weight: bold;
	font-size: 21px;
}

/* CONTACT CONTENT ------------------------------------------------------------*/

#contactForm{
	position: relative;
	width: 700px;
	float: left;
	margin-right: 20px;
}

#contact-sidebar{
	position: relative;
	width: 200px; /* 220 - 20 padding */
	float: left;
	padding: 20px 10px 20px 10px;
	-webkit-box-shadow: 2px 2px 0px rgba(0,0,0,.2);
	-moz-box-shadow: 2px 2px 0px rgba(0,0,0,.2);
	-o-box-shadow: 2px 2px 0px rgba(0,0,0,.2);
	box-shadow: 2px 2px 0px rgba(0,0,0,.2);
}

/* SIDEBAR ------------------------------------------------------------*/

#sidebar{
	position: relative;
	width: 200px; /* 220 - 20 padding */
height: 910px;
	float: left;
	padding: 45px 10px 20px 10px;
	margin-top: -58px;
	margin-bottom: 40px;
	-webkit-box-shadow: 2px 2px 0px rgba(0,0,0,.2);
	-moz-box-shadow: 2px 2px 0px rgba(0,0,0,.2);
	-o-box-shadow: 2px 2px 0px rgba(0,0,0,.2);
	box-shadow: 2px 2px 0px rgba(0,0,0,.2);
}

#sidebar .block{
	margin-bottom: 18px;
	padding-bottom: 5px;
}

#sidebar .block:last-child{
	border-bottom: none;
}

#sidebar h4,
#contact-sidebar h4{
	margin-bottom: 20px;
}

#sidebar li{
	margin-bottom: 7px;
}

/* HOME ------------------------------------------------------------*/

.home-block{
	margin-bottom: 20px;
}

.home-block-heading{
	text-align: center;
	margin-bottom: 40px;
	background: url(../img/div-line.png) repeat-x center center;
}

.home-block-heading span{
	padding: 0px 20px;
}

.home-block figure{
	float: left;
	margin-right: 20px;
	margin-bottom: 20px;
	position: relative;
	overflow: hidden;
	line-height: 1.2em;
	
	-webkit-box-shadow: 0px 0px 2px rgba(0,0,0,.2); 
    -moz-box-shadow: 0px 0px 2px rgba(0,0,0,.2);
    -o-box-shadow: 0px 0px 2px rgba(0,0,0,.2);
    box-shadow: 0px 0px 2px rgba(0,0,0,.2);
}

.home-block figure .thumb{
	display: block;
	
}


.home-block figure img{
	max-width: 100%;
	opacity: .999;
		
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

.home-block figure a:hover img{
	opacity: 0.1;
	line-height: 0em;

}


.home-block figure.last{
	margin-right: 0px;
}

.home-block figcaption{
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
}

/* modernizr fix for ie 8 and earlier */

.no-opacity .home-block figcaption{
	display: none;
}

.no-opacity .home-block figure:hover figcaption{
	display: block;
}

.home-block figure .opener{
	display: block;
	position: absolute;
	top: 0px;
	left: 0px;
	height: 100%x;
	width: 180%;
	z-index: 999;
}

.opacity .home-block figure .opener{ display: none; }

.home-block figcaption strong,
.home-block figcaption span,
.home-block figcaption em{
	display: block;
	margin-left: 17px;
	margin-right: 17px;
}

.home-block figcaption strong{ 
	font-weight: bold;
	line-height: 1.3em;
	margin-bottom: 7px;
	margin-top: 17px;
}

.home-block figcaption span{ 
	font-size: 11px;
	margin-bottom: 7px;
}

.home-block figcaption em{ 
	font-size: 11px;
	font-weight: bold;
	font-style: normal;
	position: absolute;
	bottom: 10px;
}

.home-block figcaption em{ font-weight: bold; }

.one-third-thumbs figure{ width: 300px; }

.one-fourth-thumbs figure{ width: 220px; height:180px; }

.more-link{
	margin-bottom: 0px;
}

/* MAIN ------------------------------------------------------------*/

#main{
	padding-top: 40px;
	margin-bottom: 60px;
}

/* PORTFOLIO ------------------------------------------------------------*/

.portfolio-thumbs{
	width: 960px;
	padding-top: 20px;
}

.portfolio-thumbs figure{ width: 300px; }

.portfolio-thumbs figure{
	float: left;
	margin-right: 20px;
	margin-bottom: 20px;
	position: relative;
	overflow: hidden;
	line-height: 1.2em;
}

.portfolio-thumbs figure .thumb{
	display: block;
}

.portfolio-thumbs figure img{
	max-width: 100%;
	opacity: .999;
width: 220px;
	height: 220px;
		
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

.portfolio-thumbs figure a:hover img{
	opacity: 0.1;
	line-height: 0em;
}

.portfolio-thumbs figcaption{
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
}

.portfolio-thumbs figcaption strong,
.portfolio-thumbs figcaption span,
.portfolio-thumbs figcaption em{
	display: block;
	margin-left: 17px;
	margin-right: 17px;
}

.portfolio-thumbs figcaption strong{ 
	font-weight: bold;
	line-height: 1.3em;
	margin-bottom: 7px;
	margin-top: 17px;
}

.portfolio-thumbs figcaption span{ 
	font-size: 14px;
	margin-bottom: 7px;
}

.portfolio-thumbs figcaption em{ 
	font-size: 14px;
	font-weight: bold;
	font-style: normal;
	position: center;
	bottom: 5px;
        align: center;
}


/* modernizr fix for ie 8 and earlier */

.no-opacity .portfolio-thumbs figcaption{
	display: none;
}

.no-opacity .portfolio-thumbs figure:hover figcaption{
	display: block;
}

.portfolio-thumbs figure .opener{
	display: block;
	position: absolute;
	top: 0px;
	left: 0px;
	height: 100%;
	width: 100%;
	z-index: 999;
}

.opacity .portfolio-thumbs figure .opener{ display: none; }

/* PROJECT ------------------------------------------------------------*/


.project-heading{
	margin: 44px 24px 44px 0px;
}


.project-heading h2{
	float: left;
	margin-right: 20px;
}

.project-heading .launch{
	display: block;
	float: left;
	text-decoration: none;
	padding-top: 5px;
	
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}


.project-description{
	float: left;
	width: 700px;
	margin-bottom: 70px;
	margin-right: 20px;
}

.project-info{
	float: left;
	width: 220px;
	margin-bottom: 70px;
}

.project-info strong{ font-weight: bold; }

.project-pager{
	overflow: hidden;
	margin: 0px;
	padding-bottom: 24px;
	border-top: 1px solid rgba(0, 0, 0, 0.1);
	padding-top: 24px;
}

.project-pager a{
	text-decoration: none;
	
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

.project-pager a:hover{
	text-decoration: none;
}

.project-pager .prev-project{
	float: left;
}

.project-pager .next-project{
	float: right;
}

/* RELATED PROJECTS ---------------------------------------------------*/

.related-projects{
	display: block;
	width: 940px;
	border-top: 1px solid rgba(0, 0, 0, 0.1);
	padding: 24px 0px 50px 0px;
}

.related-heading{
	font-weight: bold;
	margin: 0px 0px 24px 0px;
}

.related-projects .related-list{
	display: block;
}

.related-projects  figure{
	display: block;
	float: left;
	width: 220px;
	margin-right: 15px;
}

.related-projects  figure .last{
	margin-right: 0px;
}

.related-projects .thumb{
	display: block;
	margin-bottom: 12px;
	
	-webkit-box-shadow: 2px 2px 0px rgba(0,0,0,.2); 
	-moz-box-shadow: 2px 2px 0px rgba(0,0,0,.2);
	box-shadow: 2px 2px 0px rgba(0,0,0,.2); 
}

.related-projects .thumb:hover img{
	opacity: 0.15;
}

.related-projects figure img{
	max-width: 100%;
	
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}


/* CONTACT ------------------------------------------------------------*/


#map_canvas{
	display: block;
	height: 300px;
	width: 100%;
	margin-bottom: 24px;
	margin-top: 40px;	
	-webkit-box-shadow: 2px 2px 0px rgba(0,0,0,.2);
	-moz-box-shadow: 2px 2px 0px rgba(0,0,0,.2);
	-o-box-shadow: 2px 2px 0px rgba(0,0,0,.2);
	box-shadow: 2px 2px 0px rgba(0,0,0,.2);
}

.map-content{
	margin-bottom: 60px;
	padding-bottom: 40px;
	border-bottom: 1px solid #ccc;
}

.address-block li{
	padding-left: 20px;
}

.address-block .address{ background: url(../img/icon-address.png) no-repeat top left  }

.address-block .phone{ background: url(../img/icon-phone.png) no-repeat top left}

.address-block .mobile{ background: url(../img/icon-mobile.png) no-repeat top left }

.address-block .email{ background: url(../img/icon-email.png) no-repeat top left }

/* PAGE ------------------------------------------------------------*/

.floated-content,
.fullwidth-content{
	
}

/* BLOG ------------------------------------------------------------*/

.floated-content,
#posts-list,
#post-content{
	position: relative;
	width: 700px;
	float: left;
	margin-right: 20px;
}


.daftar,
#posts-daftar,
#post-daftar{
	position: relative;
	width: 940px;
	float: left;
	margin-right: 20px;
}

#posts-list .page-heading,
.fullwidth-content .page-heading,
.floated-content .page-heading{
	margin-bottom: 35px;
}

#posts-list .share{
	position: absolute;
	top: 100px;
	left: 23px;
	width: 100px;
	height: 100px;
	}

#posts-list .entry-date{
	position: absolute;
	top: 0px;
	left: 23px;
	width: 97px;
	height: 97px;
	background: url(../img/date.png) no-repeat;
	font-family: 'Yanone Kaffeesatz', Arial, sans-serif;
}

#posts-list .entry-date .number{
	font-size: 50px;
	padding-top: 25px;
	text-align: center;
}

#posts-list .entry-date .year{
	text-align: center;
	padding-top: 10px;
}


#posts-list article{
	position: relative;
	padding-left: 160px;
	margin-bottom: 40px;
}

#posts-list .feature-image,
#post-content .feature-image{
	width: 540px;
	margin-bottom: 21px;
	line-height: 0em;
	
	-webkit-box-shadow: 2px 2px 0px rgba(0,0,0,.2);
	-moz-box-shadow: 2px 2px 0px rgba(0,0,0,.2);
	-o-box-shadow: 2px 2px 0px rgba(0,0,0,.2);
	box-shadow: 2px 2px 0px rgba(0,0,0,.2);
}

#posts-list .feature-image img,
#post-content .feature-image img{
	max-width: 100%;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

#posts-list .feature-image:hover img,
#posts-content .feature-image:hover img{
	opacity: 0.2;
}

#posts-list .post-heading{
	margin-bottom: 20px;
	line-height: 1.0em;
}

#posts-list .excerpt,
#posts-list .read-more{
	display: block;
	margin-bottom: 20px;
}

article .meta div{
	padding: 15px 10px 15px 30px;
	float: left;
	 
}

article .meta .comments{
	border-left: 1px solid #cecece;	
	border-right: 1px solid #cecece;
	background: url(../img/icon-comments.png) no-repeat;
}

article .meta .user{
	background: url(../img/icon-user.png) no-repeat;
}

article .meta .categories{
	background: url(../img/icon-tags.png) no-repeat;
}

article .meta .categories,
article .meta .comments,
article .meta .user{
	background-position: 5px 12px;	
}

/* SINGLE ------------------------------------------------------------*/

.post-content{
	margin-bottom: 20px;
color: #000000;	
}

.single-post .meta{
	margin-bottom: 50px;	
}

/* PAGE NAVIGATION ------------------------------------------------------------*/

.page-navigation{
	display: block;
	margin-left: 160px;
	margin-bottom: 0px;
}

.page-navigation a{
	display: block;
	padding: 14px 18px;
	
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
	
	-webkit-box-shadow: 2px 2px 0px rgba(0,0,0,.2);
	-moz-box-shadow: 2px 2px 0px rgba(0,0,0,.2);
	-o-box-shadow: 2px 2px 0px rgba(0,0,0,.2);
	box-shadow: 2px 2px 0px rgba(0,0,0,.2);
	
	text-shadow: 0 -1px 0px rgba(0, 0, 0, 0.8);
}

.page-navigation .nav-next{
	float: left;
}

.page-navigation .nav-previous{
	float: right;
}

/* PAGER ------------------------------------------------------------*/

.pager{
	overflow: hidden;
	display: block;
	font-size: 11px;
	margin: 0px 0px 0px 0px;
	padding-bottom: 70px;
}

.pager li{
	display: block;
	margin-right: 5px;
	float: left;
}

.pager li a{
	display: block;
	width: 100%;
	height: 100%;
	text-align: center;
	text-decoration: none;
	width: 20px;
	border: 1px solid #ccc;
	line-height: 20px;
	
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

.pager .paged{
	float:right;
	font-style:italic;
}


/* SLIDER-HOLDER ------------------------------------------------------------*/

#slider-holder{
	padding-bottom: 50px;
}

.home-slider{
	float: left;
}

#slider-holder #headline{
	position: relative;
	float: right;
	width: 260px; /* 300 - 40 padding */
	min-height: 275px;
	margin-top: -58px;
	padding: 70px 20px 20px 20px;;
	
	-webkit-box-shadow: 2px 2px 0px rgba(0,0,0,.2);
	-moz-box-shadow: 2px 2px 0px rgba(0,0,0,.2);
	-o-box-shadow: 2px 2px 0px rgba(0,0,0,.2);
	box-shadow: 2px 2px 0px rgba(0,0,0,.2);
	
	text-shadow: 0 1px 0px rgba(255, 255, 255, 0.8);
}

#headline h1{ 
	margin-bottom: 30px;
	line-height: 1.0em;
}


#headline em#corner,
#sidebar em#corner{
	display: block;
	position: absolute;
	top:0px;
	left: -14px;
	width: 14px;
	height: 18px;	
	background: url(../img/sidebar-corner.png) no-repeat;
}


/* FOOTER ------------------------------------------------------------*/


.footer-bottom{
	margin-top: 30px;
}

footer .wrapper,
.footer-bottom{
	padding-top: 40px;
}



/* FOOTER BOTTOM ------------------------------------------------------------*/

.footer-bottom{
	margin-bottom: 60px;
	overflow: hidden;
}

.footer-bottom .left{
	width: 50%;
	padding-top: 10px;
	float: left;
}

.footer-bottom .right{
	width: 50%;
	float: right;
}

.brosur {
	position: absolute;
	
	height: 56px;
	width: 124px;
}



/* INBAR-----------------------------*/



.holder {
	width: 250px;
	margin: 20px;
	float: left;
	overflow: hidden;
}
.topbar {
	border: 1px solid rgba(0,0,0,0.2);
	box-shadow: inset 0px 0px 1px 1px rgba(255,255,255,0.5), 
				inset 0px -3px 15px -1px rgba(0,0,0,0.2);
	-webkit-border-top-left-radius: 5px;
	-webkit-border-top-right-radius: 5px;
	-moz-border-radius-topleft: 5px;
	-moz-border-radius-topright: 5px;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
	-webkit-background-clip: padding-box;
height: 40px;
}
.topbar h1 {
	background: url(http://noisepng.com/100-90-4-monochrome.png);
	text-align: center;
	margin: 7px 0px 0px 0px;
	color: #fff;
	font-size: 26px;
	text-shadow: 1px 1px 0px rgba(0,0,0,0.3);
	letter-spacing: -1px;
}
.inbar {
	border: 1px solid rgba(0,0,0,0.2);
	box-shadow: inset 0px 0px 10px -2px rgba(0,0,0,0.2);
}
.inbar ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
}
.inbar ul li { 
	margin: 0;
	padding: 0;
	clear: both;
	background: rgb(255,255,255);
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmN2Y3ZjciIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
	background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(247,247,247,1) 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(100%,rgba(247,247,247,1)));
	background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(247,247,247,1) 100%);
	background: -o-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(247,247,247,1) 100%);
	background: -ms-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(247,247,247,1) 100%);
	background: linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(247,247,247,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f7f7f7',GradientType=0 );
}
.inbar ul li span {
	float: left;
	padding: 5px 20px 5px 20px;
	border-right: 1px solid #eee;
	border-bottom: 1px solid #eee;
	font-weight: 800;
	font-size: 30px;
	color: #888;
	background: #fff;
}
.inbar ul li p {
	padding: 10px 0px 10px 10px;
	border-right: 1px solid #eee;
	border-bottom: 1px solid #eee;
	margin: 0;
	color: #666;
	font-size: 16px;
	text-shadow: 1px 1px 0 #fff;
	box-shadow: inset 0 0 1px 1px #fff;
}
.inbar ul li:hover p {
	background: rgba(0,0,0,0.02); 
}
.inbar ul li:hover span {
	color: rgba(0,0,0,0.3);
}
/* Colors */

.orange {
background: rgb(255,175,75);
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmYWY0YiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZjkyMGEiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top,  rgba(255,175,75,1) 0%, rgba(255,146,10,1) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,175,75,1)), color-stop(100%,rgba(255,146,10,1)));
background: -webkit-linear-gradient(top,  rgba(255,175,75,1) 0%,rgba(255,146,10,1) 100%);
background: -o-linear-gradient(top,  rgba(255,175,75,1) 0%,rgba(255,146,10,1) 100%);
background: -ms-linear-gradient(top,  rgba(255,175,75,1) 0%,rgba(255,146,10,1) 100%);
background: linear-gradient(top,  rgba(255,175,75,1) 0%,rgba(255,146,10,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffaf4b', endColorstr='#ff920a',GradientType=0 );
}
.red {
background: rgb(234,0,0);
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2VhMDAwMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNiNTAwMDAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top,  rgba(234,0,0,1) 0%, rgba(181,0,0,1) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(234,0,0,1)), color-stop(100%,rgba(181,0,0,1)));
background: -webkit-linear-gradient(top,  rgba(234,0,0,1) 0%,rgba(181,0,0,1) 100%);
background: -o-linear-gradient(top,  rgba(234,0,0,1) 0%,rgba(181,0,0,1) 100%);
background: -ms-linear-gradient(top,  rgba(234,0,0,1) 0%,rgba(181,0,0,1) 100%);
background: linear-gradient(top,  rgba(234,0,0,1) 0%,rgba(181,0,0,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ea0000', endColorstr='#b50000',GradientType=0 );
}
.green {
background: rgb(138,182,107);
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIxJSIgc3RvcC1jb2xvcj0iIzhhYjY2YiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMzOTgyMzUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top,  rgba(138,182,107,1) 1%, rgba(57,130,53,1) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,rgba(138,182,107,1)), color-stop(100%,rgba(57,130,53,1)));
background: -webkit-linear-gradient(top,  rgba(138,182,107,1) 1%,rgba(57,130,53,1) 100%);
background: -o-linear-gradient(top,  rgba(138,182,107,1) 1%,rgba(57,130,53,1) 100%);
background: -ms-linear-gradient(top,  rgba(138,182,107,1) 1%,rgba(57,130,53,1) 100%);
background: linear-gradient(top,  rgba(138,182,107,1) 1%,rgba(57,130,53,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8ab66b', endColorstr='#398235',GradientType=0 );

}
.blue {
background: rgb(64,150,238);
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzQwOTZlZSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMyMzcwYmMiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top,  rgba(64,150,238,1) 0%, rgba(35,112,188,1) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(64,150,238,1)), color-stop(100%,rgba(35,112,188,1)));
background: -webkit-linear-gradient(top,  rgba(64,150,238,1) 0%,rgba(35,112,188,1) 100%);
background: -o-linear-gradient(top,  rgba(64,150,238,1) 0%,rgba(35,112,188,1) 100%);
background: -ms-linear-gradient(top,  rgba(64,150,238,1) 0%,rgba(35,112,188,1) 100%);
background: linear-gradient(top,  rgba(64,150,238,1) 0%,rgba(35,112,188,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4096ee', endColorstr='#2370bc',GradientType=0 );
}


.ribbon-green {
  font: bold 15px Sans-Serif;
  color: #333;
  text-align: center;
  text-shadow: rgba(255,255,255,0.5) 0px 1px 0px;
    position: relative;
  padding: 5px 0;
  left: 0px;
  top: 0px;
  
  
  background-color: #fdb921;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#eca506), to(#fec64a));
  background-image: -webkit-linear-gradient(top, #eca506, #fec64a);
  background-image:    -moz-linear-gradient(top, #eca506, #fec64a);
  background-image:     -ms-linear-gradient(top, #eca506, #fec64a);
  background-image:      -o-linear-gradient(top, #eca506, #fec64a);
  color: #fff;
  -webkit-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
  -moz-box-shadow:    0px 0px 3px rgba(0,0,0,0.3);
  box-shadow:         0px 0px 3px rgba(0,0,0,0.3);
}


ribbon-wrapper-green {
  width: 230px;
  height: 60px;
  overflow: hidden;
  position: absolute;
  top: -1px;
  right: 0px;

}

/* --------- Tabs ---------- */


#tabs{
  overflow: hidden;
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
}

#tabs li{
  float: left;
  margin: 0 .5em 0 0;
}

#tabs a{
  position: relative;
  background: #ddd;
  background-image: linear-gradient(to bottom, #fff, #ddd);  
  padding: 6px 6px 6px 6px;
  float: left;
  text-decoration: none;
  color: #444;
  text-shadow: 0 1px 0 rgba(255,255,255,.8);
  border-radius: 5px 0 0 0;
  box-shadow: 0 2px 2px rgba(0,0,0,.4);
}

#tabs a:hover,
#tabs a:hover::after,
#tabs a:focus,
#tabs a:focus::after{
  background: #fff;
}

#tabs a:focus{
  outline: 0;
}

#tabs a::after{
  content:'';
  position:absolute;
  z-index: 1;
  top: 0;
  right: -.5em;  
  bottom: 0;
  width: 1em;
  background: #ddd;
  background-image: linear-gradient(to bottom, #fff, #ddd);  
  box-shadow: 2px 2px 2px rgba(0,0,0,.4);
  transform: skew(10deg);
  border-radius: 0 5px 0 0;  
}

#tabs #current a,
#tabs #current a::after{
  background: #fff;
  z-index: 3;
}

#content
{
    background: #ebebe8;
    padding: 3px 2px 0px 4px;
    height: 220px;
    position: relative;
    z-index: 2;	
    border-radius: 0 5px 5px 5px;
    box-shadow: 0 -2px 3px -2px rgba(0, 0, 0, .5);
}



.button {
    font-family: 'Segoe UI', 'Open Sans', Arial, sans-serif;
    display: block;
    color: rgb(255, 255, 255);
    text-decoration: none;
    text-align: center;
    padding: 5px;
    margin: 15px 0px 0px 15px;
    font-size: 14px;
    text-transform: uppercase;
    background: #ff8a0d;
    color: #FFF;
    border: 0px none;
    outline: 0px none;
}

.button:hover {
    background: #74A599;
}

.button:active {
    background: #F6A953;
}

.page{
  max-width: 60em;
  margin: 0 auto;
}
table th,
table td{
  text-align: left;
}
table.layout{
  width: 100%;
  border-collapse: collapse;
}
table.display{
  margin: 1em 0;
}
table.display th,
table.display td{
  border: 1px solid #B3BFAA;
  padding: .5em 1em;
}

table.display th{ background: steelblue; color: white; }
table.display td{ background: #fff; }

table.responsive-table{
  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.2);
}

@media (max-width: 30em){
    table.responsive-table{
      box-shadow: none;  
    }
    table.responsive-table thead{
      display: none; 
    }
  table.display th,
  table.display td{
    padding: .5em;
  }
    
  table.responsive-table td:nth-child(1):before{
    content: 'Number';
  }
  table.responsive-table td:nth-child(2):before{
    content: 'Name';
  }
  table.responsive-table td:nth-child(1),
  table.responsive-table td:nth-child(2){
    padding-left: 25%;
  }
  table.responsive-table td:nth-child(1):before,
  table.responsive-table td:nth-child(2):before{
    position: absolute;
    left: .5em;
    font-weight: bold;
  }
  
    table.responsive-table tr,
    table.responsive-table td{
        display: block;
    }
    table.responsive-table tr{
        position: relative;
        margin-bottom: 1em;
    box-shadow: 0 1px 10px rgba(0, 0, 0, 0.2);
    }
    table.responsive-table td{
        border-top: none;
    }
    table.responsive-table td.organisationnumber{
        background: #D5E0CC;
        border-top: 1px solid #B3BFAA;
    }
    table.responsive-table td.actions{
        position: absolute;
        top: 0;
        right: 0;
        border: none;
        background: none;
    }
}

/* --------- Chat ---------- */
 
#sidebox {
	top: 600px;
	position: fixed;
	color: #333;
	padding: 5px 5px;
	background: #2ECCFA;
	display: block;
	border: 1px #D9C7EC solid;
	-moz-box-shadow: 0 0 5px #656565;
	-webkit-box-shadow: 0 0 5px #656565;
	box-shadow: 0 0 5px #656565;
	text-align: center;
	left: 1153px;

border-radius: 3px;
}
.phonenumber {
	font-size: 42px;
	text-align: center;
	line-height: 30px;
}
#phonenumber {
	margin-top: 5px;
}
#callus {
	height: 0px;
	
}
#sideboxbutton {

	border: 1px #61487b solid;
	font-size: 11px;
	font-weight: bold;
	height: 20px;
	padding-top: 7px;
	background-color: #61487b;
	margin-bottom: 3px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	color: #fff!important;
}
#sideboxbutton a {
	color: #fff !important;
}
.sideboxbutton a:link {
	color: #fff;
}