@import url(reset.css);
@import url(pocketgrid.min.css);

/*
@font-face {
    font-family: 'Passion One';
    src: url(../fonts/Passion-One/PassionOne-Regular.ttf);
	font-weight:normal;
}

@font-face {
    font-family: 'Passion One';
    src: url(../fonts/Passion-One/PassionOne-Bold.ttf);
    font-weight:bold;
}
*/

::selection {
  color:#ffed32; background: transparent; /* WebKit/Blink Browsers */
}
::-moz-selection {
  color:#ffed32; background: transparent; /* Gecko Browsers */
}
strong::selection {
  color:black; background: transparent; /* except strong yellow text (Webkit) */
}
strong::-moz-selection {
  color:black; background: transparent; /* except strong yellow text (Gecko) */
}

/* --- Helper--- */

.clear-left { clear: left; }

.noselect {
-webkit-touch-callout: none; /* iOS Safari */
-webkit-user-select: none;   /* Chrome/Safari/Opera */
-khtml-user-select: none;    /* Konqueror */
-moz-user-select: none;      /* Firefox */
-ms-user-select: none;       /* IE/Edge */
user-select: none;           /* non-prefixed version, currently
                                not supported by any browser */
}

/* --- MAIN --- */

html { font-size: 27px; }

body {
	padding: 10px 0px 150px 10px;
	font-family: 'Work Sans', Helvetica, Arial, sans-serif;
	font-weight: 600;
	-webkit-font-smoothing: subpixel-antialiased;
	color: rgb(0, 0, 0);
	/* background: #D3D3D1; */
}

a {
  color: #793f8f;
  text-decoration: none;
  transition: border 250ms;
}
a:hover { color: #F59E14; }

p, .container-content ul {
  font-family: 'Work Sans', sans-serif;
  font-size: 0.84rem;
  line-height: 1.05rem;
  padding: 9px 24px;
  margin-left: -24px;
  letter-spacing: 0px;
}
p a, .container-content ul a {
  /* border-bottom: 2px solid #222; */
}
p a:hover, .container-content ul a:hover {
  color: #F59E14;
}

.container-content ul li {
  text-indent: -30px;
  margin-left: 32px;
  margin-bottom: 5px;
}

i, em { font-style: italic; }

small {font-size: 0.8em; }

strong, b {
  font-weight: 700;
}

blockquote p, p.quote, cite { padding-left: 30px; }

h1, h2, #logo {
  font-weight: 600;
	display: inline-block;
	padding: 20px 0 20px 0;
	line-height: 1.05em;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
h1, h2 {
  font-family: 'Work Sans', sans-serif;
  font-size: 0.95rem;
  padding: 5px;
  padding-top: 10px;
  margin-left: -5px;
  margin-top: 20px;
}

figcaption { font-size: 0.5rem; }

#logo {
  	font-size: 1.5rem;
}

.container-content ul li {
  padding: 0px 20px 10px 0;
}

	/* --- Layout --- */

#background {
  /* position: fixed; width: 100%; height: 100%;  top:0; left:0; z-index: -2;
	background: url('../images/AA-Backwave.svg');
	background-repeat: no-repeat; background-position: 100% 0px;
  background-size: 55%; */
  background: none;
}

.container-content .block {
  padding-bottom: 30px;
}

  /* --- Page Overwrite --- */

  .pg-home .container-content {
    max-width: 1500px;
  }

  /* .pg-home .block-group .block:nth-child(2) {
    background: none;
  } */

  .pg-home figure {
    max-width: 90%;
    margin: 50px 0;
  }

  .pg-gewinner-2016 #background, .pg-gewinner-2017 #background {
    display: none;
  }

  .pg-gewinner-2016 figure, .pg-gewinner-2017 figure {
    margin-bottom: 65px;
  }

  .pg-supporter .container-content ul li {
    float: left;
    margin-right: 20px;
  }

  .pg-supporter figure:not(.image-wide) {
    max-width: 25%;
    display: inline-block;
    vertical-align: middle;
    margin-right: 10px;
  }

  .image-wide { margin-top: 20px; }

	/* --- NAV --- */

nav.nav { margin: 80px 5.5%; }

.navbar {margin-left: -5px; }

.navbar li {
	float: left;
	margin-right: 80px;
  margin-bottom: 10px;
	font-size: 1.05em;
	letter-spacing: 1px;
	text-transform: uppercase;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	padding: 5px;
	/* background-color: rgba(255, 255, 255, 0.98);
	border-radius: 60px; */
  text-shadow: -2px -2px #fff;
}
.navbar li a, #logo a {
  padding:3px 0;
  line-height: 1.05em;
  transition: color 150ms;
  color: rgb(0, 0, 0);
}
.navbar li a.active, #logo a.active {
  text-decoration: none;
  color: #793f8f;
  border-bottom: 2px solid #793f8f;
 }
.navbar li a:hover, #logo a:hover {
  color: #F59E14;
}

#lang { float: right; font-size: 0.95em; padding: 5px; margin-right: 20px;  }
#lang span { padding: 0 4px; display: inline-block; }
#lang ul li { float: left; }
#lang ul li:first-child { margin-right: 10px;}
#lang ul li a { text-decoration: none; }
#lang ul li.active a { padding: 3px 0; border-bottom: 2px solid #F59E14; color: #F59E14; }
#lang ul li.active a:hover { border-bottom: 2px solid #F59E14; }
#lang ul li a:hover { color: #F59E14; }

#logo {
  margin:10px 0 0 5.5%;
  padding:0;
  clear: right;
}
#logo a {
  color: #793f8f;
  text-transform: uppercase;
  letter-spacing: 1px;
}

	/* --- CONTENT --- */

.container-content { margin: 40px 5% 0 5.5%; padding-top: 50px; }
.container-content img { max-width: 100%; }


/* --- Home  --- */

#bildwechsel figure:not(:first-child) { display: none; }


/* --- Supporter  --- */

.container-content figure a {
  border: none !important; /* no link-border for images */
}

.container-content a img {
  opacity: 0.96;
}
/* .container-content a:hover img {
  -webkit-filter: invert(100%);
  filter: invert(100%);
} */

.container-content img {
  padding-top: 10px;
  /* max-width: 290px; */
}

/* --- Default --- */

.default { max-width: 1200px;  }

.default .block {
  margin-bottom: 30px;
  background: #fff;
  border-radius: 50px;
  margin-top: 40px;
 }




/* -- Setup pocketgrid -- */
.b1-3 { width: 33%; max-width: 400px; }
.b1-2 { width: 50%; }
.b2-3 { width: 66%; }
	/* clear blocks */
.b1-2:nth-child(2n+1) {
    clear: left;
}
	/* grid gutter */
.block-group { margin: -5px 0 0 -90px; padding-right: 15px; }
.block {
  padding: 0 0 0 90px;
}



/* R E S P O N S I V E */


/* Laptop */
@media screen and (max-width: 1350px) {

}

/* Small Desktop */
@media screen and (max-width: 1060px) {

}


/* Small devices (phones and tablets up to 900px) */
@media screen and (max-width: 900px) {

    /* NAV */

	.navbar li { margin-right: 20px;}

	/* Layout */

  #background {
    background-size: 70%;
  }

    /* Pocketgrid */

	.b1-2 { width: 95%; }

	.b1-3 { width: 45%; }

}

/* Mobile (phones up to 650px) */
@media screen and (max-width: 650px) {

	html { font-size: 20px; }

    /* NAV */
  nav.nav {
    margin: 20px 5.5%;
  }

	.navbar li { margin-right: 15px;}

	/* Layout */

  #background {
    background-size: 80%;
  }

  .default .block {
    border-radius: 15px;
    margin-top: 20px;
   }

	/* Pocketgrid */

	.b1-3 { width: 95%; }
}

/* Mobile (phones up to 400px) */
@media screen and (max-width: 400px) {

	html { font-size: 16px; }

    /* NAV */


	/* Layout */

	.container-content { margin-right: 3.5%; }

	#sponsoren img { max-width: 100%; }

	/* Pocketgrid */

	.b1-2 { width: 100%; }
}