/*
	
Theme Name: Bigolin + Crivelli
Theme URI: http://ibl.ch
Description: based on the Starkers Theme.
Version: 1.0
Author: Andris Linz @ ibl und partner ag
Author URI: http://ibl.ch


COLORS

schwarz:	#262626;
weiss:		#fff;

*/


/* ------------------------- RESET ------------------------- */


body, html, h1, h2, h3, h4, h5, h6, p, ul, li, ol, img, fieldset { margin:0; padding:0; border:0; }

ul, li, ol { list-style:none; }

:focus { outline:none; }


/* ------------------------- UTILITIES ------------------------- */


.clear { clear:both; height:0;}

.floatLeft { float:left; }

.floatRight { float:right; }


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


body {font-family: 'myriad-pro', Helvetica, Arial, sans-serif; letter-spacing:.08em;  color:#3a3c3d; background:#fff;}


/* BUTTON */


.button {padding:10px 20px !important; background:transparent !important; font-size:14px !important; border:#262626 2px solid !important; font-weight:normal !important; display:inline-block;}

.button span {color:#fff !important;}

.button:hover {cursor:pointer !important; border:#262626 2px solid !important; background:#262626 !important;}

.button:hover span {color:#fff !important;}


/* ------------------------- TYPO ------------------------- */


h1	{font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size:50px; font-weight:700; line-height:60px; margin:0;}

h2 	{font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size:50px; font-weight:400; line-height:60px; margin:0;}

h3 	{font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size:18px; font-weight:700; line-height:26px; margin:0 0 13px 0;}

p 	{font-size:16px; line-height:24px; font-weight:300; margin:0 0 13px 0;}

a 	{text-decoration:none; color:#222; transition: all ease 0.3s;}

a:hover {text-decoration:none; color:#7e7e7e; transition: all ease 0.3s;}

p a {font-weight:bold;}

hr {border:none; border-bottom:#dd3333 1px solid; height:1px; background:transparent; margin:0 0 13px 0; width:33%; min-width:150px;}

ul {margin:0 0 0 15px;}

ul li {list-style:square; padding:0 0 0 5px; margin:0 0 5px 0; font-size:16px; line-height:26px;}


/* ------------------------- HEADER ------------------------- */


header {width:calc(100% - 52px); padding:52px 26px;}

header .inner {width:1024px; margin:0 auto;}


/* LOGO AREA */


#logo-area {float:left; width:311px	; }

#logo-area img {height:80px; width:auto; padding: 5px;}

body.home #logo-area img, body.page-template-page-Portfolio-php #logo-area img {
	margin-left:13px;
}

#logo-area .widget-container {margin:0; padding:0;}


/* MENU AREA */


#mobile-toggle {display:block; float:right; line-height:21px;}

#mobile-close {float:right; line-height:131px;}

#mobile-toggle:hover, #mobile-close:hover {cursor:pointer;}

#overlay-menu {position:fixed; top:0; left:0; bottom:0; right:0; background:rgba(255,255,255,0.95); display:none; z-index:999999; overflow:scroll; padding:0 20px;}

#overlay-menu .inner {width:1024px; margin:0 auto;}

#overlay-menu #menu-area {clear:both; float:none; margin:0 auto; text-align:center; position:relative;}

#menu-main-1 li {list-style:none;}

#menu-main-1 li a {font-size:60px; line-height:120px; font-weight:700;}

/* Sticky Header */

body.sticky header {
	background:#fff;
	height:60px;
	transition: all ease 0.5s;
	box-shadow:rgba(0,0,0,0.16) 0px 3px 5px;
	top:0;
	left:0;
	position:fixed;
	z-index:999;
	padding-top:30px;
	padding-bottom:30px;
}

body.sticky #logo-area .widget-container {
	transition: all ease 0.5s;
}

body.sticky #menu-area .menu li {
	line-height:80px;
	transition: all ease 0.5s;
}

body.sticky #menu-area .menu li a:before {
	bottom:0;
	transition: all ease 0.5s;
}


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


#main {width:1024px; max-width:calc(100% - 40px); padding:0; margin:0 auto; min-height:800px;}

#main.ohneSlider {padding:60px 20px;}

#main ul li {font-size:16px; line-height:24px;}

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

.homefix h1 {margin:0 0 26px 0;}


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

.portfolioHeaderOverview {margin:0 0 26px 0; padding:0 13px;}

.portfolioHeader {margin:0 0 52px 0;}

.portfolioHeader .button {margin:26px 0; border:none !important; padding:0 !important; font-size:16px !important; font-weight:700 !important;}

.portfolioHeader .button:hover {background:transparent !important;}

/* Portfolio Single */

.linkeSpalte {width:calc(40% - 52px); float:left; margin:0 52px 0 0;}

.rechteSpalte {width:60%; float:left;}

.rechteSpalte img {width:100%; height:auto; margin:0 0 26px 0;}

/* Portfolio Übersicht */

.portfolioContainer {width:100%;}

.grid-sizer {width:256px;}

.portfolio {width:230px; margin:0 13px 26px 13px; height:auto; height:230px;}

.portfolio.big {width:486px; height:486px;}

.portfolio.hochformat {height:486px; overflow:hidden;}

.portfolio-bild {z-index:1;}

.portfolio-bild img {width:100%; height:auto;}

.portfolio-overlay {background:rgba(38, 38, 38, 0.85); display:none; z-index:99; position:absolute; top:0; left:0; width:100%; height:100%;}

.portfolio-overlay a {color:#fff; font-size:60px; line-height:70px; text-align:center; display:block; height:100%; vertical-align:center;}

#portfolio-nav {margin:52px 0 0 0;}

#portfolio-nav ul {position:relative; margin:0;}

#portfolio-nav ul li {display:inline-block; padding:0 10px 0 0; height:52px;}

#portfolio-nav ul li a {padding:10px 20px; background:transparent; font-size:14px; border:#262626 1px solid; font-weight:normal;}

#portfolio-nav ul li a:hover, #portfolio-nav ul li a.current {cursor:pointer; background:#262626; color:#fff;}

/* #portfolio-nav ul li:last-child a {border:#262626 1px solid;} */

/* ------------------------- TEAM ------------------------- */

.teamHeader {margin:0 0 52px 0;}

.teamHeader h1 {margin:0 0 26px 0;}

.team {margin:0 0 52px 0;}

.team-bild {width:calc(50% - 26px); margin:0 26px 0 0; float:left;}

.team-bild img {width:100%; height:auto;}

.team-text {width:calc(50% - 26px); margin:0 0 0 26px; float:right;}

.team-text h3 {font-size:30px; line-height:40px; font-weight:700; margin:0;}

.team-text h4 {font-size:30px; line-height:40px; font-weight:400; margin:0 0 26px 0;}

.team-text h5 {font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size:16px; font-weight:700; line-height:24px; margin:0;}

.team-text a {font-weight:400;}

.team-text ul li {font-size:14px; line-height:20px;}

/* ------------------------- FORMULAR ------------------------- */

input[type="text"], input[type="email"] {padding:10px; line-height:18px; border:#222 2px solid; background:#fff; color:#222; margin:0 0 10px 0; width:calc(100% - 20px);}

textarea {border:#222 2px solid; padding:10px; height:100px; font-family:Arial, Helvetica, sans-serif; font-size:12px; line-height:24px; margin:0 0 10px 0; background:#fff; color:#222; width:calc(100% - 20px);}

label {color:#222; padding:0 5px; margin:0 0 10px 0; font-weight:400; display:block;}

input[type="button"] {font-family:"AkkuratRegular", "Helvetica Neue", Helvetica, Arial, sans-serif; color:#222; background:#fff; border:#222 1px solid; padding:10px 20px; font-size:12px; line-height:18px; text-transform:uppercase; letter-spacing:.08em; transition: all ease 0.3s;}

input[type="button"]:hover {background:#222; color:#fff; border:#222 1px solid; transition: all ease 0.3s; cursor:pointer;}

.nf-before-form-content {margin:0 0 20px 0;}

select { color:#329bfd; border:none; overflow: hidden; background: url(images/arrowdown.png) no-repeat right #efefef; width:calc(100% - 15px); padding:10px;}

.nf-error-msg {color:#329bfd !important; background:#efefef; padding:10px;}


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

.so-widget-sow-image h3.widget-title {padding:26px 0 0 0; margin:0; font-size:16px; text-transform:uppercase;}

h3.widget-title, .footer-img h3.widget-title {font-size:28px; font-weight:400; line-height:38px; margin:0 0 30px 0; padding:0; text-transform:none;}

.rev_slider span {letter-spacing:.05em !important;}

/* ------------------------- ACCORDION ------------------------- */

/*
.panel {margin:0 0 5px 0;}

.panel_titel {display:block; background:#efefef; padding:10px; color:#329bfd; font-weight:700; text-transform:uppercase;}

.panel_titel:hover {cursor:pointer; color:#efefef; background:#329bfd;}

.panel_titel.current {color:#efefef; background:#329bfd;}

.panel_inhalt {padding:10px;}

.panel_inhalt img {width:calc(100% - 20px); height:auto;}
*/

.sow-accordion {
	border-top:#222 1px solid;
}


.sow-accordion-panel {
	border-bottom:#222 1px solid;
	padding:15px 0;
}

.sow-accordion-panel-header:focus {
	outline: none !important;
}

.sow-accordion-title {
	font-weight:700 !important;
}

/* ------------------------- AKTUELL ------------------------- */


.aktuell-container {overflow:hidden;}

.aktuell {width:100%; border-bottom:#222 1px solid; margin:0 0 30px 0; padding:0 0 30px 0;}

.aktuell-bild {width:calc(50% - 15px); margin:0 15px 0 0; float:left;}

.aktuell-bild img {width:100%; height:auto;}

.aktuell-titel {width:calc(50% - 15px); margin:0 0 0 15px; float:left;}

h1.tp-caption {font-size:38px !important; font-weight:700 !important; line-height:44px !important; }


/* ------------------------- GALLERY ------------------------- */


.gallery .gallery-caption {display:none;}

.gallery dt {float:left; margin:0 10px 10px 0;}


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



footer {width:calc(100% - 52px); padding:0 26px;
	background:#efefef;}

footer .inner {width:1024px; margin:0 auto; padding:52px 0;}

/* BUTTON-TOP */

#btn_top {
	position:fixed; 
	bottom:30px;
	right:30px;
	display:none;
	padding:15px 15px 10px 15px !important; 
	background:rgba(38, 38, 38, 1) !important; 
	font-size:1em !important; 
	border:0 !important; 
	font-weight:700 !important; 
	line-height:1.5em !important; 
	color:#fff !important;
	hyphens:auto; -webkit-hyphens:auto;
	z-index:1;
	}
	
#btn_top.active {
	display:block;
}

#btn_top.active:before {
	content: url(images/arrow-up_hover.svg);
}


#btn_top:hover {
	color:#2a6a44 !important;
	cursor:pointer !important; 
	background:rgba(38, 38, 38, 0.5) !important; 
	border:0 !important; 
	}

#btn_top.active:hover:before {
	content: url(images/arrow-up.svg);
}


/* ----- RESPONSIVE TABLET STYLES ----- */


@media screen and (max-width: 1023px) { 
	
	header .inner {width:100%; margin:0 auto;}
	
/* 	header .inner {width:768px; margin:0 40px;} */
	
	#main {width:calc(100% - 40px); margin:0 auto; min-height:1000px;}
			
	#ubermenu-main-2 {height:auto;}
	
	#menu-area {width:200px;}
	
	.ubermenu-responsive-toggle {height:50px !important; line-height:50px !important; }

	h1, h2 {font-size:40px; line-height:50px;}

	footer {width:768px; margin:0 auto;}

	footer .inner {width:100%;}
	
	/*.grid-sizer {width:33.3%;}

	.portfolio {width:calc(33.3% - 26px); margin:0 13px 26px 13px; height:auto;}*/
	
	.portfolioContainer {width:768px;}

}


/* ----- RESPONSIVE MOBILE STYLES ----- */


@media screen and (max-width: 687px) { 
	
	#main {
		padding:0 30px;
	}
	
	header {
		padding:30px 26px;
	}
	
/*
	header .inner {width:100%; margin:0 auto;
		padding:0;
	}
*/
	
	#logo-area {width:200px; height:auto;}
	
	#logo-area img {padding:20px 0; height:30px; width:auto;}
	
	#menu-area {width:calc(100% - 100px); margin:0 auto; padding:0;}
	
	/*.ubermenu-responsive-toggle {height:34px !important; line-height:34px !important; font-size:14px; padding:20px !important;}*/
	
	#ubermenu-main-2 {height:auto; margin:16px 0;}
	
	#ubermenu-main-2 li {display:block; line-height:50px;}
	
	#ubermenu-main-2 li a {font-size:12px !important;}
		
/* 	#main {width:512px; margin:0 auto; min-height:1000px;} */
	
	#main {width:calc(100% - 52px); padding:26px; margin:0 auto; min-height:1200px;}
	

	/* BEGIN NEW TEMPLATE */
	
	#overlay-menu .inner {width:100%; margin:0 auto;}
	
	#menu-main-1 li a {font-size:40px; line-height:80px; font-weight:700;}
	
	.linkeSpalte {width:100%; clear:both; margin:0 0 0 0;}

	.rechteSpalte {width:100%; clear:both;}

	h1, h2 {font-size:30px; line-height:40px;}
	
	.team-bild {width:100%; clear:both; margin:0 0 26px 0;}

	.team-text {width:100%; clear:both; margin:0 0 0 0;}
	
	/*.grid-sizer {width:50%;}

	.portfolio {width:calc(50% - 26px); margin:0 13px 26px 13px; height:auto;}*/
	
	.portfolioContainer, footer {width:512px; margin:0 auto;}
	
	.portfolio.platzhalter {display:none;}
	
	body.sticky header {
		background:#fff;
		height:30px;
		transition: all ease 0.5s;
		box-shadow:rgba(0,0,0,0.16) 0px 3px 5px;
		top:0;
		left:0;
		position:fixed;
		z-index:999;
		padding-top:15px;
		padding-bottom:15px;
	}
	
	body.sticky #logo-area .widget-container {
		padding:8px 0;
	}

	body.home #logo-area img, body.page-template-page-Portfolio-php #logo-area img {
		margin-left:0;
	}

	.portfolioHeaderOverview {
		padding:0;
	}
	
	.footer-copyright p {
		text-align:left !important;
	}
			
}

@media screen and (max-width: 512px) {
	
	header .inner {width:100%; margin:0 auto;}
	
	#main.ohneSlider {width:calc(100% - 52px); padding:26px; margin:0 auto;}
	
	.portfolioContainer {width:100%;}
	
	.grid-sizer {width:100%;}
	
	.portfolio {width:100%; margin:0 0 26px 0; overflow:hidden;}
	
	.portfolio.small {}
	
	.portfolio.big {width:100%; height:auto;}
	
	.portfolio.hochformat {height:auto; overflow:hidden;}
	
	footer {width:calc(100% - 52px); padding:26px; margin:0 auto;}
	
}