/* =================================================

Stylesheet für die Website der Lippischen Landeskirche

unter "http://www.lippische-landeskirche.de"  

Datei: styles.css

Datum: 19. Mai 2016

Autor:  Peter Thimm (ThiWeCo)

================================================== */






@media screen {

/* ========================== Layout (Größe und Positionierung) =========================================*/

* {

	box-sizing: border-box;

}

body {

	width: 90%;

	max-width: 1200px;

	margin: 0 auto;

}

.wrap {

	padding: 0 2em;

}

header {

	padding: 2em 0;

	margin-bottom: 3%;

}

.logo {

	width: 30%;

	float: left;

}

.slider {

	position: relative;

	margin-bottom: 3%;

}

.slider a {

	position: absolute;

	top: 1em;

	left: 1em;

	font-size: 30px;

	color: black;

	text-decoration: none;

	padding: 6px;

	background-color: white;

	opacity: 0.6;

}

.slider a:hover {

	color: white;

	text-decoration: none;

	padding: 6px;

	background-color: black;

	opacity: 0.6;

	transition: background-color 0.3s;

}



.welcome {

    padding: 1em 2em;

	margin-bottom: 3%;

}



/* Gestaltung der Featured Artikel auf Startseite oben */

.featured {

	float: left;

	width: 31.3%; 

	margin-right: 3%;

	margin-bottom: 3%;

	text-align: center;

	height: 625px;

	overflow: hidden;

	background: rgba(255,255,255,0.8);

}

.featured p {

	text-align: left;

}

article.featured:last-child {

	float: left;

	width: 31.3%;

	margin-bottom: 3%;

	margin-right: 0;

	text-align: center;

	height: 625px;

	overflow: hidden;

	background: rgba(255,255,255,0.8);

}

.readon {

	float: right;

	padding: 0.2em;

	border: 1px solid #555555;

}

/* Ende Gestaltung der Featured Artikel auf Startseite oben */



/* Gestaltung Termine */

#termine h3 {

	margin: 2em 2em 1em 2em;

}

#termine h4 {

	margin: 1em 2em;

}

#kalender {

	float: left;

    background-color: #999999;

    color: #ffffff;

    font-size: 1.5em;

    margin: 0 10px 0 0;

    padding: 5px;

}

#sprache a {

	float:right;

    background-color: #730b40;;

    color: #ffffff;

    font-size: 1.5em;

    margin: 0 1em 0 1em;

    padding: 5px 20px 5px 20px;

}


#termine article h3 {

	margin-top: 0;

}

#termine article h3, #termine article h4, #termine article h5, #termine article p {

	margin-left: 0px;

}

/* Ende Gestaltung Termine */


/* Bilder mit Bildunterschriften */

figure {

	display: table;

	padding: 10px

}

figcaption {

	display: table-caption;

	caption-side: bottom ;

	text-align: center;

	font-size: 15px;

	font-size:0.9375rem;

	font-weight:700;

}

/* Ende Bilder mit Bildunterschriften */

section.news {

	float: left;

	width: 65.6%;

	margin: 0 3% 3% 0;

}

article {

	padding: 1em 2em;

}

article.news {

	margin-bottom: 1em;

}

section.sidebar_right {

	float: right;

	width: 31.3%;

	margin-bottom: 3%;

}

.sidebar_right article {

	margin-bottom: 3%;

}

section.sidebar_left {

	float: left;

	width: 31.3%;

	margin-bottom: 3%;

}

section.main {

	float: right;

	width: 65.6%;

	margin: 0 0 3% 3%;

}

.pagefooter {

	clear: both;

	padding: 1% 3% 1% 3%;

	margin-top: 3%;

}

.footer_menu {

    float: right;

}

address {

	float: left;

	width: 31.3%;

	margin-right: 3%;

	border-right: 2px solid white;

}

.fa {

	margin-right: 0.7em;

}

.transparency {

	float: left;

	width: 31.3%;

	margin-right: 3%;

	border-right: 2px solid white;

}

ul.socialmedia {

	padding-top: 1em;

	margin: 0;

}

ul.socialmedia li {

	float: right;

	margin-left: 2em;

}

ul.data {

	margin-top: 4em;

}

ul.data li {

	float: right;

	margin-left: 0.4em;

}

.copyright {

	clear: both;

	padding-top: 1.5em;

}



/* ========================== Inhalt (Gestaltung einzelner Elemente) =========================================*/

html {

	background-color: #fff;

	background: url(../images/bg.jpg) no-repeat center center fixed;

	-webkit-background-size: cover;

	-moz-background-size: cover;

	-o-background-size: cover;

	background-size: cover;

	font-family: 'Source Sans Pro', Arial, sans-serif;

	font-size: 100%;

}

body {

	background: rgba(255,255,255,0.6);

	font-size: 18px;

	font-size: 1.125rem;

	color: #333;

}

.welcome {

	background: rgba(255,255,255,0.8);

}

.welcome h1 {

	font-family: 'Source Sans Pro', Arial, sans-serif;

	font-weight:700;

	font-size: 26px;

	font-size: 1.625rem;

	color: #730b40;

}

.welcome p {

	font-size: 20px;

	font-size: 1.25rem;

	font-weight: 700;

}

section.news {

	overflow: hidden;

	background: rgba(255,255,255,0.8);

}


section.sidebar_right {

	background: rgba(255,255,255,0.8);

}

.sidebar_right h3 {

	color: white;

	padding: 0.4em 0.9em;

	background: #730b40;

}

section.sidebar_left {

	background: rgba(255,255,255,0.8);

	padding-top: 1em;

}

section.main {

	background: rgba(255,255,255,0.8);

}


section.advent2020 {
	text-align:center;
	margin:auto; 
	width:100%;
	height:1000px;
	display:block;
	
	background-image:url(../dsc_1226_hochkant-gross.jpg);
	
	background-repeat:no-repeat;
	background-position:center;
	background-size:cover;
	
	
	
	
}


 

.pagefooter {

	color: white;

	background-color: #555555;

}

.pagefooter a {

	color: white;

	text-decoration: none;

}

address {

	text-align: left;

	font-style: normal;

}

ul.socialmedia li {

	display: inline-block;

}

ul.data li {

	display: inline-block;

}

.copyright {

	text-align: center;	

}

h2 {

	font-family: 'Source Sans Pro', Arial, sans-serif;

	font-weight:700;

	font-size: 22px;

	font-size: 1.375rem;

	color: #730b40;

}

h3 {

	font-family: 'Source Sans Pro', Arial, sans-serif;

	font-weight:700;

	font-size: 20px;

	font-size: 1.25rem;

	color: #730b40;

}

h5 {

	font-size: 16px;

	font-size: 1rem;

	font-weight: 300;

	margin: -0.8em 0 1em 0;

}

.subtitle {

	float: none;

	font-weight: 600;

	margin-top: -0.5em;

}

img {

	max-width: 100%;

	height: auto;

}

.img_right {

	float: right;

	margin-left: 15px;

}

.img_left {
	position:relative;

	float: left;
	max-width: 400px;
	margin-right: 15px;
	z-index:1;

}
#line2 { visibility:hidden; display:none; margin-top:-2em; padding-top:-2em;}
article.advent {float:left; width:23%; height:135px;  margin:0.2em;  padding:0.2em; text-align:center; overflow:hidden; color: #F00;  }
article.advent:last-child {float:none; clear:both;   }
article.advent h4 { position:relative; margin-top:30px; visibility:visible; z-index:10 !important;}
article.advent h5 { position:absolute; margin-top: 20px; margin-left: 50px; padding-top:0.5em; visibility:visible; z-index:10 !important;}
section.advent2020 article.list_counter {visibility:hidden; float:none; clear:both; display:none;}



article h3 a, article h3 a:visited { 

	color: #730b40;

	text-decoration: none;

}

article h3 a:hover, article h3 a:focus {

	color: #730b40;

	text-decoration: underline;

}

.sidebar_right h3 a:hover, .sidebar_right h3 a:focus {

	color: #ffffff;	

	text-decoration: underline;

}

.sidebar_right h3 a, .sidebar_right h3 a:visited {

	color: #ffffff;	

}

a {

	color: #730b40;

	text-decoration: none;

}

a:hover, a:focus {

	color: #730b40;

	text-decoration: underline;

}

article.advent h3 {display:none; visibility:hidden};
section.advent2020 img img_left {z-index:1; margin-right:0px; }
article.advent img.img_left {background-color:#fff; border: #fff thin solid;};
article.advent img img_left {z-index:1; margin-right:0px; }
article.advent a:hover { display:block; color:#06C;};

/* ========================== Navigation =========================================*/



/*Navigation Menü oben*/

nav {

	margin-left: 30%;

	margin-bottom: 2em;

}

nav ul {

	padding: 0;

	margin: 0;

	float: right;

}

nav li {

	display: inline-block;

	position:relative;

	padding: 0.9em 1em;

	margin: 0;

	list-style-type: none;

	font-family: Tahoma, Arial, sans-serif;

	font-size: 0.9em;

	font-weight: 400;

	color: #333;


	transition: background-color 0.3s;

	background: #fff;

}

nav li a {

	color: #333;

	text-decoration: none;

}

nav li.active {

	color: white;
	

	background: #730b40;

}

nav li.active_devider {

	color: white;

	background: #730b40;

}

nav li.active a {

	color: white;

	text-decoration: none;

}

nav li:hover, nav li:focus {

	color: white;

	background: #730b40;

}

nav li:hover a, nav li:focus a {

	color: white;
color: #999;
	text-decoration: none;

}



/* Navigation Menü oben Dropdown*/ 

nav ul.submenu li {

	clear: both;

	padding: 0.5em 1em;

	font-size: 0.9em;

}

nav li:hover ul.submenu {

	display: block;

	background: rgba(56,104,160,0.7);

	z-index: 10;

}

nav ul.submenu {

	position: absolute;

	top: 3em;

	left: 0;

	display:none;

	text-align: center;

}

nav ul.submenu li {

	color: white;

	text-transform: none;

	min-width: 14.2em;

}

nav ul.submenu li:hover, nav ul.submenu li:focus {

	background: #730b40;

}



.slicknav_menu {

	display: none;

}





/*Navigation Menü links*/

ul.menu_left  {

	padding: 0;

	margin: 0;

	float: none;

}

.menu_left li {

	display: block;

	position:relative;

	padding: 0.9em 1em;

	margin-bottom: 0.15em;

	list-style-type: none;

	font-family: Tahoma, Arial, sans-serif;

	font-size: 0.8em;

	font-weight: 400;


	transition: background-color 0.3s;

	background: #aaa;



}

.menu_left li a {

	color: #333;

	text-decoration: none;

}

.menu_left li:hover, nav li:focus {

	color: white;

	background: #730b40;

}

.menu_left li:hover a, nav li:focus a {

	color: white;

	text-decoration: none;

}

.menu_left li.active {

	color: white;

	background: #730b40;

}

.menu_left li.active a {

	color: white;

	text-decoration: none;

}

.menu_left_submenu li {
    
	font-size: 0.7em;
	
	

	text-transform: none;
	text-align: left;
	margin-left: 0em;
	padding-left:1em;

}

.menu_left li.submenu a {
   
	font-size: 0.7em;
	
	

	text-transform: none;
	text-align: left;
	margin-left: 0em;
	padding-left:1em;

}

.menu_left_submenu li.active a {
	

	
	

	text-transform: none;
	text-align: left;
	margin-left: 0em;
	padding-left:0em;

}

/*Navigation Menü Soziale Netzwerke*/

#soziale-netzwerke {

	overflow: hidden;

	background-color: #aaa;

	padding: 0 2% 2% 2%;

	margin: 3em 0 1em 0;

}

#soziales-netz ul {

	float: left;

}

#soziales-netz li {

	list-style-type:none;

	display: inline-block;

	float: right;

	margin-left: 20px;

}

.akzent {color: #730b40;}


}











@media only screen and (min-width: 790px) and (max-width: 1100px){

body {

	width: 95%;

	font-size:15px;

	font-size:0.9375rem;

}

.wrap {

	padding: 0 1em;

}

.welcome {

    padding: 1em 1em;

	margin-bottom: 3%;

}



main {

	line-height: 1.6;

}

article {

	padding: 1em;

}

article.left {

	margin-bottom: 1em;

}

.pageheader {

	padding: 0.25em 0;

}

.slider {

	margin-bottom: 1em;

}

.left {

	width: 65%;

}

.aside {

	width: 30%;

	padding-left: 15px;

	margin-bottom: 15px;

}

h2 {

	font-size: 20px;

	font-size: 1.25rem;

}

h3 {

	font-size: 18px;

	font-size: 1.125rem;

}

nav li {

	font-size: 0.95em;

	padding: 0.75em 0.5em;

	color: white;

}

nav ul.submenu {

	position: absolute;

	top: 2.7em;

	left: 0;

	display:none;

	text-align: center;

}

#nav li:hover ul.level2 {

	margin-left: -0.5em;

}

.footer_menu {

	float: none;

	margin-bottom: 10px;

	text-align: center;

}



}





 @media screen and (min-width: 280px) and (max-width: 789px) {

body {

	width: 96%;

   -moz-hyphens: auto;

   -o-hyphens: auto;

   -webkit-hyphens: auto;

   -ms-hyphens: auto;

   hyphens: auto; 

}

.wrap {

	padding: 0 0.5em;

}

.welcome {

    padding: 0.5em 0.5em;

	margin-bottom: 3%;

}

article {

	padding: 0.5em;

}

/* Featured Artikel */

.featured {

	float: none;

	width: 100%; 

	margin-right: 0;

	margin-bottom: 2%;

}

article.featured:last-child {

	float: none;

	width: 100%; 

	margin-right: 0;

	margin-bottom: 2%;

}

/* Sections untereinander */

section.news {

	float: none;

	width: 100%;

	margin: 0 3% 3% 0;

}

section.sidebar_right {

	float: none;

	width: 100%;

	margin-bottom: 2%;

}

section.sidebar_left {

	float: none;

	width: 100%;

	margin-bottom: 2%;

}

section.main {

	float: none;

	width: 100%;

	margin: 0 0 3% 3%;

}

section.advent2020 {
	background-image:url(../dsc_1226_hochkant-gross.jpg);
	min-height:200px;
	background-repeat:no-repeat;
	background-position:top;
	background-size: contain;
}


article.advent {float:left; width:23%; height:auto;  margin:0.2em;  padding:0.2em; text-align:center; overflow:hidden; color: #F00;  }
article.advent img.img_left { width:75%;}
article.advent h5 { position:absolute; margin-top: 0em; margin-left: 1.5em; padding-top:0.5em; visibility:visible; z-index:10 !important;}





/* Navigation und Kopfbereich */

#nav {

	display:none;

}

	

.slicknav_menu {

	display:block;

}



.logo {

	position: absolute;

	top: 15px;

}

header {

	height: 10px;

	margin-bottom: 0;

	padding: 0;

}

address {

    float: none;

	width: 100%;

	margin-right: 0;

	margin-bottom: 30px;

	border-right: none;

	text-align: center;

}

.transparency {

    float: none;

	width: 100%;

	margin-right: 0;

	border-right: none;

	margin-bottom: 30px;

	text-align: center;

}

.footer_menu {

    float: none;

	width: 100%;

	margin-right: 0;

	margin-bottom: 30px;

	border-right: none;

	text-align: center;

}

ul.socialmedia li {

	float: none;

	margin-left: 2em;

	text-align: center;

}

ul.socialmedia li:first-child {

	margin-left: 0;

}

ul.data {

	margin-top: 2em;

}

ul.data li {

	float: none;

	margin-left: 0.6em;

}}









































 @media print {

* {

	color:#000 !important;

	box-shadow:none !important;

	text-shadow:none !important;

	background:transparent !important;

}

html {

	background-color:#fff;
	padding: 1em 3em 1em 3em;

}

nav {

	display:none;

}

a[href]:after {

	


}

a[href] {

	

}

a[href^="javascript:"]:after, a[href^="#"]:after {

	content:"";

}

abbr[title]:after {

	content: " (" attr(title) ")";

}

figure {

	margin-bottom:1em;

	overflow:hidden;

}

figure img {

	border:1px solid #000;

}

.slider {
	display:none;

}

.sidebar_left {
	display:none;

}

.transparency {
	display:none;

}

.footer_menu {
	display:none;

}

#soziale-netzwerke {
	display:none;

}

soziales-netz {
	display:none;

}

.slicknav_menu {

	display:none;

}