/* Layout for desktop version */

@import url(https://fonts.googleapis.com/css?family=Fira+Sans:300,500,700);
@import url(https://fonts.googleapis.com/css?family=Karma:400,600,700);
@font-face { font-family: Socialico; src: url(fonts/socialico-webfont.woff);}

.clear {height:1px; clear:both;}

*::-moz-selection { background: #336392; color: #fff;}

h1, h2, h3, h4 {font-family: 'Fira Sans', sans-serif; font-weight:700; color:#131313;}
p {font-family: 'Karma', serif; font-weight:400; color:#131313;}

/*************
HEADER
**************/

.header { background:rgba(255,255,255,0.95); position:fixed; top:0; width:100%; z-index:999;}

.header-content {margin:30px auto 20px;}
.header-content .logo {font-family:Karma, serif; font-weight:600; color:black; border-bottom:0px; font-size:30px; line-height:60px; letter-spacing:0.01em;}
.header-content .logo span {color:#6b6b6b; padding-right:1px;}
.header-content .logo em {color:#336392; font-style: normal; }

.header-content ul {margin-bottom:0px; margin-top:18px;}
.header-content .menu li {display:inline; padding-right:10px; margin-bottom:0; }
.header-content .menu li a {border-bottom:0px; font-family:Fira Sans; font-weight:300; text-transform:uppercase;  color:rgba(19,19,19, 0.5); letter-spacing:1px; display:inline; padding:10px 8px;}
.header-content .menu li a:hover, .header-content .menu li.current_page_item a {color:white; background:#336392; border-radius: 3px;}

.header-content .menu ul li .sub-menu { display: none; margin-top: 2px; padding-top: 0px; position: relative; }
.header-content .menu ul li:hover a { background: #336392; color:white; border-radius: 3px;}
.header-content .menu ul li .sub-menu li { margin-top: -20px !important; padding-right:0px;}
.header-content .menu ul li:hover > .sub-menu { display: block; position: absolute; }
.header-content .menu ul li .sub-menu li a { background: #336392 none repeat scroll 0 0; color:rgba(255,255,255,0.4);  padding:10px 8px; border-radius: 3px; }
.header-content .menu ul li .sub-menu li a:hover { color:white;}

/************
CONTENT
************/

.social-links-about {width:130px; margin:0 auto;}
.social-links-about li {display:inline; list-style: none;float:left; margin-right:10px;}
.social-links-about li img { width:35px; }

.content {margin-top:180px;}
.article-content {margin-bottom:100px;}
.article-content h2 {font-size:45px; text-transform: uppercase; letter-spacing:0.02em; margin-bottom:10px; line-height:55px;}
.article-content h2 a {color:#0b4da3; border-bottom:0;}
.article-content h2 a:hover {color:rgba(19, 19, 19, 0.5);}
.article-content h4 {font-weight:300; margin-bottom:30px;}
.article-content h4 em {font-size:12px; color:#336392;}
.article-content h3 {font-size:28px; line-height:40px;margin-top:30px;}
.article-content p {font-size:22px; line-height:35px;}

.continue-left, .continue-right {display:inline;}
.continue-left { padding:0 10px 0 20px; font-family:Fira Sans;}
.continue-right {}
.continue-content {border-top:1px solid #131313; border-bottom:1px solid #131313; margin-top:50px;}
.continue-link {margin-right:20px; border-right:1px solid #131313; font-weight:500; border-bottom:none; padding-right:40px; padding-top:20px; float:left; height:40px; color:rgba(19, 19, 19, 0.5); font-size:20px; margin-bottom:-1px;}
.contine-link:hover {color:rgba(19, 19, 19, 1);}
.continue-content ul {display:inline; margin-left:20px; padding-left:20px;}

.social-media li {display:inline; float:left; display:block; padding-top:15px; padding-right:10px;}
.social-media li a img {width:30px;}
.sd-button {display:block; border-bottom:0;}

.about-content {background:rgba(0, 0, 0, 0.1); padding:40px 40px 50px; text-align:center;}
.about-content img {border-radius: 150px; -webkit-border-radius: 150px; -moz-border-radius: 150px; margin-bottom:20px; width:200px;margin:10px auto 30px; display:block;}
.about-content h2 {font-size:25px; line-height:33px;}
.about-content p {margin-bottom:40px;}
.about-content span a {border:1px solid #131313; padding:10px 30px; margin-top:40px; font-family:Fira Sans; color:#131313;}
.about-content span a:hover {background:#131313; color:white;}


.newsletter-content {padding:40px; border:1px solid rgba(0, 0, 0, 0.1);}
.wpcf7-text {margin-bottom:10px;}
.wpcf7-email, .wpcf7-text {width:100%; padding:6px 0; text-indent:10px;}
.wpcf7-submit {border:1px solid #131313; padding:7px 30px; margin-top:10px; font-family:Fira Sans; background:white;}
.wpcf7-submit {background:#131313; color:white;}
textarea {width:100%; padding:6px 2px; text-indent:10px; border:1px solid rgba(0, 0, 0, 0.2); height:80px;}

/*.search {margin-top:12px;}
#search-text {display:inline;width:90px; border-right:1px solid rgba(13, 13, 13, 0.1); border-top:1px solid rgba(13, 13, 13, 0.1); border-left:1px solid rgba(13, 13, 13, 0.1); border-bottom:1px solid rgba(13, 13, 13, 0.1); padding:3px 3px;margin-right:10px;}
#search-submit {text-indent:7000px; background:url(images/magnifier.svg) no-repeat; border:0; display:block; width:20px;  height:20px; background-size:20px 20px; display:inline; text-align:right;}*/

/**** Single Page ****/

.content-single {margin-top:0px;}
.content-single .blog-img {position:absolute; z-index:1; margin-left: auto; margin-right: auto; left: 0; right: 0;}

.article-single-content {background:white; margin-top:50%; position:relative; z-index:2; padding:80px 100px;}
.article-single-content h2 { font-size:45px; text-transform: uppercase; letter-spacing:0.02em; margin-bottom:10px; line-height:55px; text-align:center; }
.article-single-content h4 {font-weight:300; margin-bottom:100px; text-align:center; margin-top:30px; }
.article-single-content h4 em {font-size:12px; color:#336392;}
.article-single-content h3 {font-size:28px; line-height:40px;margin-top:30px; margin-bottom:50px;}
.article-single-content p, .article-single-content ol li {font-size:22px; line-height:35px; font-family:Karma, serif;}

.article-single-content blockquote {border-top:1px solid #131313; width:300px; border-left:0px; border-bottom:1px solid #131313; padding-top:30px;  }
.article-single-content blockquote:before { content: "\201C"; font-size:50px; float:left;}

.article-single-content blockquote:nth-of-type(odd) {left:0;float:left;margin-left:-80px;margin-right:40px;}
.article-single-content blockquote:nth-of-type(even) {right:0;float:right;margin-right:-80px;margin-left:40px;}

.article-single-content .social-single-content {}
.article-single-content .social-single-content li img {width:30px; margin-top:6px;}
.article-single-content .social-single-content li img.first-social {margin-left:27px;}

.single-about img {border-radius: 150px; -webkit-border-radius: 150px; -moz-border-radius: 150px; margin-bottom:20px; width:200px;margin:10px auto 30px; display:block;}
.single-about h2 {font-size:28px; line-height:33px;}
.single-about p {margin-bottom:40px; font-size:22px; line-height:30px;}
.single-about span {border:1px solid #131313; padding:10px 30px; margin-top:40px; font-family:Fira Sans;}
.single-about span:hover {background:#131313; color:white;}
.link-about:hover {color:white !important;}

.social-single-content {border-top:1px solid #131313; line-height:70px; margin-top:80px; margin-bottom:-1px;}
.social-single-content .fourcol:first-child { border-right:1px solid #131313; margin-right:-1px;}
.social-single-content .fourcol:nth-child(3) {border-left:1px solid #131313;}
.social-single-content span { line-height:70px;}
.social-single-content a {font-family:Karma; font-size:18px; border-bottom:0; line-height: 70px; color:rgba(13, 13, 13, 0.3);} 
.social-single-content a:hover {color:rgba(13,13,13,1);}

.next-article span {text-align:right; display:block;padding-top:4px;}

.clear-border {border-bottom:1px solid #131313; margin-top:-3px;}

/**** category ****/

.category-blog {color:rgba(200, 200, 200, 1);}
.category-blog span a { border-bottom:0px; color:#555; background:rgba(200, 200, 200, 0.4); border-radius: 3px; padding:5px 8px; font-weight:normal;}
.category-blog span a:hover { color:#336392; background:rgba(51,99,146,0.3); }


/***** ARCHIV ****/

.cat-item {display:inline;}
.cat-item a {
    background: rgb(51,99,146) none repeat scroll 0 0;
    border-bottom: 0 none;
    border-radius: 3px;
    color: white;
    font-family: Fira Sans;
    font-weight: normal;
    line-height: 40px;
    margin-bottom: 20px;
    margin-right: 20px;
    padding: 5px 8px;
    text-transform: uppercase;
    white-space: nowrap;
    width: 100%;
}

.cat-item a:hover {
    background:rgb(230,230,230);   
    color:rgb(51,99,146);
}

/**** Pagination ****/

.wp-pagenavi {
    clear: both;
    border-top:1px solid #131313;
    border-bottom:1px solid #131313;
    padding:11px;
}
.wp-pagenavi a, .wp-pagenavi span {
    border-right: 1px solid #131313;
    margin: 2px;
    padding: 15px 18px;
    text-decoration: none;    
}
.wp-pagenavi a {color:rgba(200, 200, 200, 1);}
.wp-pagenavi a:hover, .wp-pagenavi span.current {
    text-decoration: none !important;
    border-bottom:none;
    color:#131313;
}
.wp-pagenavi span.current {
    color:#131313;
}


/**************
FOOTER
**************/

.footer {text-align:center;margin-top:100px;}
.footer a {color:rgba(0, 0, 0, 0.4); border:none; font-weight:200;}
.footer a:hover {color:#131313;}


/*** social ***/

.continue-content .sharedaddy { margin-top:-13px;}
.continue-content .social-media li {margin-left:5px !important;}
.social-media {margin-bottom:0 !important;margin-left:25px; margin-top:-5px;}
.social-media li { margin-left:10px; padding-left:10px;}
.social-media li.share-facebook { width:20px !important; text-indent:30000px !important; height:20px !important; background:url("http://www.charlesgoerens.eu/wp-content/themes/charlesgoerens/images/social-01.svg") no-repeat;}
.social-media li.share-twitter { width:20px !important; text-indent:30000px !important; height:20px !important; background:url("http://www.charlesgoerens.eu/wp-content/themes/charlesgoerens/images/social-02.svg") no-repeat;}
.social-media li.share-linkedin { width:20px !important; text-indent:30000px !important; height:20px !important; background:url("http://www.charlesgoerens.eu/wp-content/themes/charlesgoerens/images/social-03.svg") no-repeat;}
.social-media li.share-google-plus-1 { width:20px !important; text-indent:30000px !important; height:20px !important; background:url("http://www.charlesgoerens.eu/wp-content/themes/charlesgoerens/images/social-05.svg") no-repeat;}
.social-media li.share-end {width:0; height:0px !important; display:none;}

.social-single-content a { display:block; }

/*****
Slicknav
*****/

.menu-slick {display:none;}

@media screen and (max-width: 40em) {
	/* #menu is the original menu */
    .hidden {display:none; height:0 !important;}
    .menu-slick {display:block;}
    .js .menu .menu-menu-1-container { display:none; }
    .header-content { margin: 15px auto 10px;}
    .slicknav_btn { z-index:9999; right:20px; top:20px;position:absolute !important; padding:8px;}
    .search {display:none;}
    .content { margin-top: 100px; }
    .slicknav_nav li a {border-bottom:0px !important;}
    .header-content .menu li { display:block; padding:10px; }
}
	.js .slicknav_menu { display:block;	}
}

.slicknav_btn { position: relative; display: block; vertical-align: middle; float: right; padding: 0.438em 0.625em 0.438em 0.625em; line-height: 1.125em; cursor: pointer; }
  .slicknav_btn .slicknav_icon-bar + .slicknav_icon-bar { margin-top: 0.188em; }

.slicknav_menu { *zoom: 1; }
  .slicknav_menu .slicknav_menutxt { display: block; line-height: 1.188em; float: left; }
  .slicknav_menu .slicknav_icon { float: left; margin: 0.188em 0 0 0.438em; }
  .slicknav_menu .slicknav_no-text { margin: 0; }
  .slicknav_menu .slicknav_icon-bar { display: block; width: 1.125em; height: 0.125em; -webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px; -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25); -moz-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25); box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25); }
  .slicknav_menu:before {  content: " "; display: table; }
  .slicknav_menu:after { content: " "; display: table; clear: both; }

.slicknav_nav { clear: both; }
  .slicknav_nav ul { display: block; }
  .slicknav_nav li { display: block; }
  .slicknav_nav .slicknav_arrow { font-size: 0.8em; margin: 0 0 0 0.4em; }
  .slicknav_nav .slicknav_item { cursor: pointer; }
    .slicknav_nav .slicknav_item a { display: inline; }
  .slicknav_nav .slicknav_row { display: block; }
  .slicknav_nav a { display: block; }
  .slicknav_nav .slicknav_parent-link a { display: inline; }

.slicknav_brand { float: left; }

.slicknav_menu { font-size: 16px; box-sizing: border-box;   padding: 5px; }
  .slicknav_menu * { box-sizing: border-box; }
  .slicknav_menu .slicknav_menutxt { color: #fff; font-weight: bold; text-shadow: 0 1px 3px #000; }
  .slicknav_menu .slicknav_icon-bar { background-color: #fff; }

.slicknav_btn { margin: 5px 5px 6px; text-decoration: none; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; background-color: #336392; }

.slicknav_nav { color: #fff; margin: 0; padding: 0; font-size: 0.875em; list-style: none; overflow: hidden; }
  .slicknav_nav ul { list-style: none; overflow: hidden; padding: 0; margin: 0 0 0 20px; }
  .slicknav_nav .slicknav_row { padding: 5px 10px; margin: 2px 5px; }
    .slicknav_nav .slicknav_row:hover { -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; background: #ccc; color: #fff; }
  .slicknav_nav a { padding: 5px 10px; margin: 2px 5px; text-decoration: none; color: #131313; font-family:Fira Sans; font-weight:300; }
    .slicknav_nav a:hover { color: #336392; }
  .slicknav_nav .slicknav_txtnode { margin-left: 15px; }
  .slicknav_nav .slicknav_item a { padding: 0; margin: 0; }
  .slicknav_nav .slicknav_parent-link a { padding: 0; margin: 0; }

.slicknav_brand { color: #fff; font-size: 18px; line-height: 30px; padding: 7px 12px; height: 44px; }






/*******
Form Buttons
*******/


.form-button { vertical-align: top; white-space: nowrap; overflow: hidden; font-size: 0; border-radius: 3px; color: #fff; display: inline-block; cursor: pointer; }

  .form-button.blue { background: #336392; float:right; }
    .form-button.blue:hover { background: #3498DB; }
    .form-button.blue .submit:hover {color: #3498DB;}
    .form-button.blue.active, .form-button.blue .input, .form-button.blue .submit { color: #336392; }
  
  .form-button label, .form-button input, .form-button button { vertical-align: top; font-family: inherit; color: inherit; background: none; border: none; padding: 0; margin: 0; font-size: 16px; height: 50px; line-height: 50px; font-family:Karma;}
    .form-button label:focus, .form-button input:focus, .form-button button:focus { outline: none; }
    .form-button label.cta, .form-button input.cta, .form-button button.cta { cursor: pointer; padding-right: 16px; }
      .form-button label.cta .icon, .form-button input.cta .icon, .form-button button.cta .icon { vertical-align: top; font-size: 20px; height: 50px; line-height: 50px; padding-left: 16px; }
      .form-button label.cta .text, .form-button input.cta .text, .form-button button.cta .text { text-transform: uppercase; margin-left: 12px; }
    .form-button label.input, .form-button label.submit, .form-button input.input, .form-button input.submit, .form-button button.input, .form-button button.submit { display: none; }
    .form-button label.input, .form-button input.input, .form-button button.input { width: 0; height: 16px; line-height: 20px; padding: 17px 5px 17px 15px; }
    .form-button label.submit, .form-button input.submit, .form-button button.submit { cursor: pointer; height: 50px; line-height: 50px; font-size: 20px; padding: 0 10px; }
      .form-button label.submit:hover, .form-button input.submit:hover, .form-button button.submit:hover { color: #fff; }
  .form-button.active { background: #fff !important; }
    .form-button.active .cta { cursor: auto; padding-right: 0; }
      .form-button.active .cta .text { display: none; }
    .form-button.active .submit { display: inline-block; }


/* Layout for mobile version */

@media handheld, only screen and (max-width: 600px) {


div.article-single-content {padding:0px !important;}
    .article-single-content h2 {text-align:left;}
    .article-single-content blockquote {margin-left:0 !important; margin-right:0 !important; width:95%;}
    .social-single-content .fourcol { border:0 !important; text-align:center;}
    .next-article span { text-align:center;}
    .continue-link { border-right:0; display:block;width:100%;text-align:center;}
    .continue-content ul { display:block; width:200px; margin:0 auto; padding-left:0; }
    .social-media li { padding-bottom:15px; padding-top:0;  } 
    
}

@media handheld, only screen and (max-width: 972px) {
    .social-media li.share-facebook {padding-left:0; margin-left:0px; margin-right:0; width:3px; height:3px;}
    .social-media li.share-twitter {padding-left:0; margin-left:0px; margin-right:0; width:3px; height:3px;}
    .social-media li.share-linkedin {padding-left:0; margin-left:0px; margin-right:0; width:3px; height:3px;}
    .social-media li.share-google-plus-1 {padding-left:0; margin-left:0px; margin-right:0; width:3px; height:3px;}
    .content-single .blog-img { top:85px !important;}
    div.article-single-content { margin-top:250px; }
    
}

@media handheld, only screen and (max-width: 1000px) {

    .social-single-content a { font-size:14px; }
    
    .social-media li { margin-top:5px; padding-left:5px; margin-left:5px;}
    .social-media li.share-facebook {width:10px; height:10px !important;}
    .social-media li.share-twitter {width:10px; height:10px !important;}
    .social-media li.share-linkedin {width:10px; height:10px !important;}
    .social-media li.share-google-plus-1 {width:10px; height:10px !important;}
    
}

/* Provide higher res assets for iPhone 4 */

@media only screen and (-webkit-min-device-pixel-ratio: 2) { 

/* An example of how to override an image with one twice the size for iPhone 4. Specify the original pixel size with background-size.
.download {
background: url(../img/downarrow@2x.png) no-repeat;
background-size: 27px 28px;
}
*/

}