/*
 * Responsive Menu
 * (c) 2013 CSSplay - Stu Nicholls
 *
 * http://www.cssplay.co.uk
 *
 * Minor modifications by Christiane Koch, 2014
 */
 html, body {padding:0; margin:0; background:#fff; width:100%;
-webkit-font-smoothing: subpixel-antialiased;
font-smooth: always;
text-rendering: optimizeLegibility;
-webkit-text-stroke: 1px;
-webkit-text-size-adjust:none;
-moz-text-size-adjust:none;
-ms-text-size-adjust:none;
-moz-osx-font-smoothing: grayscale;
}
A:link { text-decoration: none; color:#2e6faf;} 
.radioMenu {position:absolute; left:-9999px; display:none;}
#wrapper {background:#fff; padding-bottom:10px;}
.container {max-width:1200px; margin:0 auto; min-width:320px; background:#fff; position:relative; z-index:100;
-webkit-transition:0.5s;
-moz-transition:0.5s;
-o-transition:0.5s;
transition:0.5s;
}
.mainNavControl {display:none; position:absolute; left:10px; top:100px; width:50px; height:50px;}
.mainNavControl label {display:block; width:40px; height:15px; border-top:5px solid #000; border-bottom:5px solid #000; position:absolute; left:10px; top:15px; cursor:pointer;}
.mainNavControl label:after {display:block; content:""; width:40px; height:5px; position:absolute; left:0; top:5px; background:#000;}
.mainNavControl span {display:none;}
.subNavControl {display:none; position:absolute; right:10px; top:100px; width:50px; height:50px;}
.subNavControl label {display:block; width:40px; height:15px; border-top:5px solid #000; border-bottom:5px solid #000; position:absolute; left:10px; top:15px; cursor:pointer;}
.subNavControl label:after {display:block; content:""; width:40px; height:5px; position:absolute; left:0; top:5px; background:#000;}
.subNavControl span {display:none;}

header {display:block; width:100%; height:80px; padding-top:20px; background:#fff;}
h1#logo {padding:0 0 0 100px; margin:0; background:url(logo.png) no-repeat 10px center;}
h1#logo a {font:400 40px/80px 'Lato', arial, sans-serif; color:#333; text-decoration:none;}
#mainnavigation {width:100%; height:40px; background:#333; border-top:2px solid #888; border-bottom:2px solid #000;}
#mainnavigation ul {padding:0 10px; margin:0; list-style:none;}
#mainnavigation ul li {float:left;}
#mainnavigation ul li a {display:block; padding:0 10px; font:400 20px/40px 'Lato', arial, sans-serif; color:#ddd; text-decoration:none;}
#mainnavigation ul li a:hover {color:#fff;}
#subnavigation {width:100%; height:30px; background:#666; border-top:2px solid #888; border-bottom:2px solid #000;}
#subnavigation ul {padding:0 10px; margin:0; list-style:none; float:right;}
#subnavigation ul li {float:left;}
#subnavigation ul li a {display:block; padding:0 10px; font:400 12px/30px 'Lato', arial, sans-serif; color:#ddd; text-decoration:none;}
#subnavigation ul li a:hover {color:#fff;}
.banner {width:100%; height:10%; max-height:400px; min-height:200px; overflow:hidden; position:relative;}
.banner img {width:100%;}
.banner h1 {font:300 25px/30px 'Lato', arial, sans-serif; color:#690; position:absolute; right:20px; bottom:40px; white-space:nowrap;}
.main {padding:0 10px 30px 10px;}
.links {width:100%; text-align:center;}
.links .col {width:25%; margin:10px 4%; display:inline-block; min-width:250px; text-align:left; vertical-align:top;}
.links .col img {display:block; width:100%;}
h2 {padding:0; margin:0; font:400 20px/40px 'Lato', arial, sans-serif; color:#2e6faf;}
h3 {padding:0; margin:0; font:400 15px/20px 'Lato', arial, sans-serif; color:#2e6faf;}
p {padding:0; margin:0; font:400 14px/20px 'Lato', arial, sans-serif; color:#666;}
ul {padding:0 40px; margin:0; font:400 14px/20px 'Lato', arial, sans-serif; color:#666;}
.links .col a {padding:0; margin:0; font:400 14px/20px 'Lato', arial, sans-serif; color:#690; float:right; white-space:nowrap;}

.info {clear:left; padding:10px 0px; text-align:left;}
.info .video {display:inline-block; padding:0px 20px; text-align:left; width:20%; min-width:50px; vertical-align:top;}
.info .video img {width:100%; max-width:435px; margin:0 auto; text-align:left;}

.info .videoinfo {display:inline-block; padding:0px 20px; width:45%; min-width:300px; text-align:left; vertical-align:top;}
.info .videoinfo links { text-decoration: none; color:#2e6faf;} 
/*.info .videoinfo a {padding:0; margin:0; font:400 14px/20px 'Lato', arial, sans-serif; color:#690; float:right; white-space:nowrap;}*/

.information {clear:left; padding:10px;}
.social {background:#ddd; padding:20px 10px; text-align:center;}
.socialLinks {width:100%;}
.socialLinks h3 {padding:0 20px 0 0; margin:0; display:inline-block; white-space:nowrap;}
.socialLinks ul {padding:0; margin:0; list-style:none; display:inline-block; vertical-align:middle}
.socialLinks ul li {float:left;}
.socialLinks ul li a {display:block; float:left; font:400 12px/20px 'Lato', arial, sans-serif; color:#444; padding:0 25px; text-decoration:none;}
.socialLinks ul li a.fb {background:url(facebook.png) no-repeat left center;}
.socialLinks ul li a.twitter {background:url(twitter.png) no-repeat left center;}
.socialLinks ul li a.rss {background:url(rss.png) no-repeat left center;}

.adsense {width:320px; margin:20px auto;}

#footer {clear:left; width:100%;}
.footerLinks {text-align:center; background:#142020; padding:20px;}
.footerLinks h2 {color:#fff;}
.footerLinks .col {width:18%; margin:10px 1%; display:inline-block; min-width:250px; text-align:left;} 
.footerLinks .col ul {padding:0; margin:0; list-style:none;}
.footerLinks .col ul li {display:block;}
.footerLinks .col ul li a {display:block; color:#ccc; text-decoration:none; font:400 14px/20px 'Lato', arial, sans-serif;}
.footerLinks .col ul li a:hover {color:#fff; text-decoration:underline;}
.footerBottom {clear:left; background:#0e1616; padding:20px;}
.footernavigation {float:right;}
.footernavigation ul {padding:0; margin:0; list-style:none;}
.footernavigation ul li {float:left;}
.footernavigation ul li a {display:block; padding:0 10px; color:#888; text-decoration:none; font:400 14px/20px 'Lato', arial, sans-serif;}
.footernavigation ul li a:hover {color:#fff; text-decoration:underline;}
p.copy {padding:0; margin:0; float:left;}
.clear {clear:left;}

@media only screen and (max-width : 1024px) {


.container {position:absolute; margin:0; left:0; right:0;}
html,body {overflow-x:hidden; background:#222;}
.mainNavControl {display:block;}
.subNavControl {display:block;}

header {height:140px;}
#mainnavigation {position:absolute; left:0; top:0; z-index:-1; width:250px;
-webkit-transition: left 0.5s;
-moz-transition: left 0.5s;
-o-transition: left 0.5s;
transition: left 0.5s;
}
#mainnavigation ul {width:250px; background:none; padding:0;}
#mainnavigation ul li {width:250px;}
#mainnavigation ul li a {width:230px; background:#222; border-top:1px solid #444; border-bottom:1px solid #000;}

#subnavigation {position:absolute; right:0; top:0; z-index:-1; width:250px;
-webkit-transition: right 0.5s;
-moz-transition: right 0.5s;
-o-transition: right 0.5s;
transition: right 0.5s;
}
#subnavigation ul {width:250px; background:none; padding:0;}
#subnavigation ul li {width:250px;}
#subnavigation ul li a {width:230px; background:#444; border-top:1px solid #666; border-bottom:1px solid #222; padding:0 10px;}

#leftNav:checked ~ #wrapper {background:#222;} 
#leftNav:checked ~ #wrapper .container {left:250px; right:-250px;} 
#leftNav:checked ~ #wrapper .container #mainnavigation {left:-250px;} 
#leftNav:checked ~ #wrapper .container .mainNavControl .openNav {display:none;} 

#rightNav:checked ~ #wrapper {background:#222;} 
#rightNav:checked ~ #wrapper .container {right:250px; left:-250px;}
#rightNav:checked ~ #wrapper .container #subnavigation {right:-250px;} 
#rightNav:checked ~ #wrapper .container .subNavControl .openNav {display:none;} 

#closeNav:checked ~ #wrapper {background:#222;} 
#closeNav:checked ~ #wrapper .container {right:0px; left:0px;}
#closeNav:checked ~ #wrapper .container #mainnavigation {left:0px;} 
#closeNav:checked ~ #wrapper .container #subnavigation {right:0px;} 

}