﻿/*
Theme Name: 	www.unterkircher.at
Description: 	Template für Homepage www.unterkircher.at - Ferienhaus Unterkircher und Pension Ambrosi
Version: 		0.02
Author: 		Gernot Feichtler
Author URI: 	http://www.feichtler.at
Tags: 			starkers, cms, 2 sidebars depending on pages, startpage, 
*/

/*
===========================
CONTENTS:

01 Sensible defaults
02 Typography
03 Media queries 
===========================
*/

/* ---------------------------------------------------------------------------------------------------------- 
01 Sensible defaults ----------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------- */

@import "reset.css";

div,
article,
section,
header,
footer,
nav,
li					{ position:relative; /* For absolutely positioning elements within containers (add more to the list if need be) */ }
.group:after 		{ display:block; height:0; clear:both; content:"."; visibility:hidden; /* For clearing */ }
body 				{ background:#fff; /* Don't forget to style your body to avoid user overrides */ }
::-moz-selection 	{ background:#ff0; color:#333; }
::selection 		{ background:#ff0; color:#333; }

/* ---------------------------------------------------------------------------------------------------------- 
02 Typography -----------------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------- */
/*

14 / 16	= 		0.875em 		(14px equivalent)
16 / 16	= 		1em 			(16px equivalent)
18 / 16 = 		1.125em 		(18px equivalent)
21 / 16 = 		1.3125em 		(21px equivalent)
24 / 16 = 		1.5em 			(24px equivalent)
30 / 16 = 		1.875em 		(30px equivalent)

*/

/* Google Fonts - Header, Navigation*/
@import url(http://fonts.googleapis.com/css?family=Boogaloo);

/* Google Fonts - Contentbereich, Texte*/
@import url(http://fonts.googleapis.com/css?family=Oxygen);

body,
input,
textarea 			{ /* We strongly recommend you declare font-weight using numerical values, but check to see which weights you're exporting first */ }

h1, 
h2, 
h3, 
h4, 
h5, 
h6 					{ font-weight:bold; /* This helps to identify headings at the initial build stage, but you should write something more precise later on */ }

/* ---------------------------------------------------------------------------------------------------------- 
03 Media queries (using a mobile-first approach) ------------------------------------------------------------
---------------------------------------------------------------------------------------------------------- */

/* 400 and up */
@media screen and (min-width:400px) {

					{ /* Place your styles here for all widths greater than 400px */ }

}

/* --------------  Haupt Struktur -------------*/
body {
	text-align: center;
	color: #000000;
	background-color: #ffffff;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	line-height: 130%;
	padding: 0px;
	margin-top: 10px;
	margin-right: 0px;
	margin-bottom: 10px;
	margin-left: 0px;
	background-attachment: fixed;
	background-image: url(../images/background.jpg);
	background-repeat: no-repeat;
	background-position: center top;
	}

#wrapper {
	width: 980px;
	text-align: left;
	color: #000000;
	/*background-color: #ffffff;*/
	z-index: 1;
	padding: 0px;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
	border: 1px solid #FFF;
	}

	#header {
	width: 100%;
	height: 260px;
	float: left;
	color: #000000;
	background-color: #FAFAFA;
	z-index: 2;
	}

	#navigation {
	position:relative;
	height: auto;
	width: 100%;
	background-image: url(../images/bg-white_t90.png);
	/*background-color: #ffffff;*/
	float: left;
	font-family: 'Boogaloo', cursive;
	z-index: 2;	
	}

	#contentbereich {
	position: relative;
	width: 100%;
	margin: 0px;
	height: auto;
	background-color: #ffffff;
	float: left;
	font-family: 'Oxygen', sans-serif;
	z-index: 2;
	margin-top: 1px;
	padding-top: 10px;
	padding-bottom: 10px;
	}

	#content-breit,	
	#content-start {
	float: left;
	text-align:left;
	z-index: 3;
	}
	#content-breit {
	width: 90%;
	}
	
	#content-start {
	width: 100%;
	margin-top: 100px;
	background-color: transparent;
	background-image: url(../images/bg-white_t50.png);
	z-index: 3;
	}
	
	#content {
	width: 690px;
	height: auto;
	float: left;
	text-align: left;
	z-index: 3;
	}
	
	#sidebar {
	width: 280px;
	height: auto;
	float: right;
	padding-top: 20px;
	padding-right: 5px;
	padding-left: 5px;
	padding-bottom: 20px;
	color: #000000;
	z-index: 3;
	background-color: #FAFAFA;
	}

	#footer {
	width: 100%;
	height: auto;
	color: #000000;
	font-size: 12px;
	background-image: url(../images/bg-white_t80.png);
	/*background-color: #FAFAFA;*/
	z-index: 2;
	margin-top: 1px;
	padding-top: 30px;
	background-repeat: repeat;
	}


/** --------------  BEGIN Header --------------------  **/

#header .logo {

}


/** --------------  BEGIN Navigation --------------------  **/

#navigation ul {
	margin-left: 0px;
	margin-right: 0px;
	padding-top: 2px;
	padding-right: 2px;
	padding-bottom: 2px;
	padding-left: 2px;
	float: right;
}
#navigation li {	

	list-style-type: none;
	float:left;
	text-align: right;
	font-size: 18px;
	font-weight: bold;
	margin-left: 2px;
	padding-top: 5px;
	padding-right: 0px;
	padding-bottom: 5px;
	padding-left: 1px;
}

#navigation a {
	text-decoration: none;
	background-color: #ffffff;
	color: #452325;
	padding-top: 5px;
	padding-right: 5px;
	padding-bottom: 5px;
	padding-left: 5px;
}
#navigation a:hover,
#navigation .current_page_item,
#navigation .current_menu_item,
#navigation .current-page-ancestor,
#navigation a:active {
	padding-bottom: 5px;
	text-decoration: underline;
	background-color: #;
	color: #766133;
}

/** ---------------  BEGIN Sidebar  ----------------- **/
	
	#sidebar h2 {
	margin-bottom: 20px;
	font-size: 22px;
	}
	
	#sidebar ul {
	margin: 0;
	padding-top: 0px;
	padding-right: 5px;
	padding-bottom: 0px;
	padding-left: 5px;
	}
	
	#sidebar li {
	margin: 0;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 5px;
	padding-left: 0px;
	}
	
		
	

/** ---------------  BEGIN Startseite  ----------------- **/


	#box-start {
	width: 100%;
	width-min: 980px;
	text-align: center;
	background-image: url(../images/bg-white_t60.png);
	z-index: 2;
	margin-top: 1px;
	padding-top: 30px;
	background-repeat: repeat;
	float: none;
	}

	#box2 {
	width: 990px;
	margin: 0 auto;
	text-align: center;
	}

	#box-ambrosi {
	width: 480px;
	float: left;
	padding-top: 10px;
	padding-bottom: 10px;
	}

	#box-unterkircher {
	width: 480px;
	float: left;
	padding-top: 10px;
	padding-bottom: 10px;
	}

	#content-start .recentpost {
	height: auto;
	margin-bottom: 0px;
	text-align: center;
	font-family: 'Boogaloo', cursive;
	padding-top: 20px;
	padding-bottom: 20px;
	font-size: 24px;
	font-weight: bold;
	}

/** ---------------  BEGIN content  ----------------- **/
	
	#content-breit .recentpost {
	height: auto;
	width: 100%;
	margin-bottom: 10px;
	float: left;
	padding-top: 20px;
	padding-right: 65px;
	padding-bottom: 20px;
	padding-left: 65px;
	}

	#kontakt-bar1,
	#kontakt-bar2 {
	float: left;
	width: 400px;
	}
	
	
	#content .recentpost,
	#content .posts {
	height: auto;
	margin-bottom: 10px;
	float: left;
	padding: 20px;
	background-color: #;
	}
		
	#content h2,
	#content-breit h2 {
	margin-bottom: 20px;
	font-size: 22px;
	}
	
	#content .title,
	#content-breit .title {
	margin-bottom: 10px;
	font-size: 18px;
	padding-left: 20px;
	font-style: italic;
	font-weight: normal;
	}
	
	#content .postnav {
	
	}
	
	#contentbereich p {
	margin-top: 5px;
	margin-bottom: 15px;
	}
	#contentbereich ul {
	width: 100%;
	margin-bottom: 15px;
	}

	#contentbereich li {
	margin-bottom: 5px;
	list-style-type: circle;
	margin-left: 15px;
	padding-left: 10px;
	}	

	
	

/** Kontaktformular **/

	#kontaktformular .wpcf7 {
	background-color: #dddddd;
	width: 650px;
	padding: 5px;
	}
	
	#kontaktformular .textfeld {
	width: 110px;	
	float: left;
	}

	#kontaktformular p {
	margin-top: 2px;
	margin-bottom: 2px;
	}


/** BEGIN footer **/
	
	#footer-ambrosi {
	width: 32%;
	float: left;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 5px;
	}

	#footer-unterkircher {
	width: 32%;
	float: left;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 5px;
	}

	#footer-ambrosi-start .header,
	#footer-unterkircher-start .header {
	font-size: 22px;
	font-weight: bold;
	padding-top: 10px;
	}
	
	#footer-ambrosi .header,
	#footer-unterkircher .header {
	font-size: 15px;
	font-weight: bold;
	}
	
	#footer-menu-right	{
	width: 34%;
	float: right;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-right: 5px;
	text-align: right;
	}
	
	#footer-menu-right	ul {
	margin-right: 0px;
	}
	
	#footer-menu-right	li {
	list-style-type: none;
	float:right;
	font-size: 15px;
	font-weight: bold;
	padding-right: 2px;
	padding-left: 2px;
	}
	
	#footer-menu-right	a {
	text-decoration: none;
	color: #452325;
	padding-top: 4px;
	padding-right: 4px;
	padding-bottom: 4px;
	padding-left: 4px;
	}
	#footer-menu-right	a:hover,
	#footer-menu-right	.current_page_item,
	#footer-menu-right	a:active {
	text-decoration: underline;
	color: #766133;
	}
	
	#footer-unten-left {
	width: 55%;
	float: left;
	font-size:12px;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 5px;
	text-align: left;
	}
	
	#footer-unten-right	{
	width: 43%;
	float: right;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-right: 5px;
	text-align: right;
	}

	#footer a {
	color: #;
	}

/** END footer **/


.hidden {
	display: none;
}
.break {
	font-size: 0;
	width: 0; height: 0;
	clear: both;
}

.edit {
	text-align: right;
	float: right;
	background-color: #;
	border: 1px dotted #CCCCCC;
	padding: 3px;
	margin: 0px;
	clear: right;
	font-size: 10px;
}

img {
	border: 0;
}

a {
	text-decoration: none;
	color: #766133;
}
a:hover {
	text-decoration: underline;
	background-color: #;
	color: #000000;
}

td, tr, table {
	border: 1px solid #CCC;
	padding: 3px;
}



/* Retina Display */
@media screen and (-webkit-min-device-pixel-ratio:2) {

					{ /* Place your styles here for all 'Retina' screens */ }

}
#box-start {
	text-align: center;
}
