*, *:before, *:after {
  box-sizing: border-box;
}

.clearfix:before,
.clearfix:after {
  content: " ";
  display: table;
}

.clearfix:after {
  clear: both;
}

.clearfix {
  *zoom: 1;
}



/* Longform Adds */


body {
padding:0;
  background: none;
  font-size: 18px;
  margin: 0;
}

h1, h2,h3,h4,h5,h6 {margin: 1.4em; text-align: center;}

h1, h2, p {
  line-height: 1.75;
  margin: 0 auto;
  max-width: 980px;
}
h1, h2 {
  font-family: 'Changa One';
  line-height: 1em;
}

h1 {text-align: left;}

h2 {font-size: 3em; color: #db514d;}

h4 {
    font-size: 1.3em;
    text-align: center;
    margin: 3em 0 1.4em 0 !important;
}
p {
  font-family: 'Open Sans';
  margin: 20px 0;
}
a:hover, a:focus {
  color: #db514d;
}



.post-template-longform #page {max-width: none;}
.post-template-longform .post {
	width: 90%;
	max-width: 1000px;
    float: none;
    margin: 0 auto;}

.site-header {
	/* display:none; */
	max-width:none;
    background-color: #504e50;
    position: fixed;
    width: 100%;
    z-index: 4;
    height: 40px;
    top: 0px;}

.title-box-logo {
    width: 40px;
    height: 40px;
    margin: 0;
    display: inline-block;
    line-height: 40px;
}
.header-main {
    min-height: 40px;
    padding: 0;
}
.header-main img{
    display: block;
}
.masthead-fixed .site-main {
    margin-top: 40px;
}

.entry-content p{margin: 1em auto;}

.post-template-longform figure {
    display: block;
    position: relative;
}

p img {
    margin: 0 0 1em;
}

/* .post-template-longform .wp-caption-text {
    font-weight: normal !important;
    margin: 0;
    font-family: 'Changa One', sans-serif;
    color: #fff;
    font-size: 2em !important;
    font-style: normal;
    background: #db514d;
    padding: .5em;
    position: absolute;
    bottom: 10px;
    left: 10px;} */

header.entry-header {
    position: relative;
    top: -7em;
    font-size: 2em;
    background: none!important;
    display: none;

}


p.alt {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    color: #fff;
    font-size: 4em;
    font-family: "Changa One";
    line-height: 1em;
    text-align: center;
    padding: 1em;
}

.site-content .entry-meta {
    padding: 20px 20px 30px 10px;
}

.comments-area {
    margin: 48px auto 0 auto;
    max-width: 1000px;
    padding: 10px;
    width: 90%;
    float: none;
}

.share-above {
    position: absolute;
    top: 7px;
    right: 50px;
}
.share-above .a2a_kit {
	margin:0;
    }

.a2a_kit, .a2a_menu, .a2a_modal, .a2a_overlay {
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    box-sizing: border-box;
    margin: 15px auto 0 auto;
    width: 100%;

}

.a2a_kit a {
    -webkit-transition-duration: 0.9s;
    transition-duration: 0.9s;
    padding: 0 10px;
    text-align: center;
    display: inline-block;

}
.a2a_kit a:hover {
	    opacity: 0.5;
}

.a2a_default_style:not(.a2a_flex_style) a {
    float: left;
    line-height: 16px;
    padding: 0px !important;
    border-radius: 21px !important;
    background: #fac80f;
    width: 26px;
    height: 26px;
    margin: 0 8px 0 0;
}
.a2a_svg svg {
    width: 26px !important;
    height: auto;
    left: -3px !important;
}

.share-below {
    width: 100%;
    max-width: 180px;
    margin: 50px auto;
}

.share-below .a2a_default_style:not(.a2a_flex_style) a {
    float: left;
    line-height: 16px;
    padding: 5px 0 0 0 !important;
    border-radius: 21px !important;
    background: #fac80f;
    width: 34px;
    height: 34px;
    margin: 0 8px 0 0;
}

.title-box {
    float: left;
    width: 223px;
    box-sizing: border-box;
    margin: 20px 0;
}

/* .share-below .a2a_default_style:not(.a2a_flex_style) a span{
  background-color: none !important;
  width: 20px;
  line-height: 20px;
  height: 20px;
  background-size: 20px;
  border-radius: 3px;
} */

.share-below .a2a_svg {
    background-repeat: no-repeat;
    display: block;
    overflow: hidden;
    height: 40px;
    line-height: 32px;
width: 40px;}

.share-below .a2a_kit{box-sizing: border-box;
    margin: 15px auto 0 auto;
    width: 140px;
    }

ul#qtranslate-chooser {
  font-family: 'Changa One', sans-serif;
    padding: 0px;
    margin: 0 0 0 0;
    display: inline-block;
    top: 0;
    right: 0;
    position: absolute;
    left: unset;
    float: none;
    width: 40px;
    height: 40px;
    line-height: 13px;
    background: #fac80f;
    text-align: center;
    color: #504e50;
    font-size: 16px;
    text-transform: uppercase;
}
#qtranslate-chooser li {
  display: inline;
  list-style-type: none;
  padding: 0.3em;
}
#qtranslate-chooser a{
	color: #fff;
    width: 40px;
    height: 40px;
    display: block;
}
#qtranslate-chooser a:hover{
	color: #db514d !important;
}

#qtranslate-chooser li.active {
    display: none;
}

.qtranxs_widget_end {position: absolute;}


.progressbar {
  /* display: none; */
	margin: 0 0 4em;
  max-width: 980px;
}

.progressbar .shim {
  display: none;
  width: 100%;
}
.progressbar .holder {
  position: relative;
  font-size: 85%;
  padding: 1em 0 0 0;
  background-color: #fff;
  padding-top:40px;
  width: 100% !important;
}

.progressbar .holder .bar {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 3px;
  background-color: #7f7f7f;
}
.progressbar .holder .bar .indicator {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  background-color: #db514d;
}
.progressbar .holder .labels {

  margin: 0 auto;
  padding: 1em 0;
  text-align: center;

}
.progressbar .holder .labels i {
  display: block;
  position: relative;
  float: left;
  cursor: pointer;
 	overflow: hidden;
    height: 2em;

}
.progressbar .holder .labels i::before {
  position: absolute;
    bottom: 0px;
    left: 50%;
    display: block;
    content: '';
    width: 14px;
    height: 14px;
    border-radius: 5%;
    /* transform: rotate(90deg); */
    background-color: #dca2a0;
    -webkit-transform: translateX(-50%) translateY(50%) rotate(45deg);
    transform: translateX(-50%) translateY(50%) rotate(45deg);
    transition: border-color 100ms ease-in, background-color 150ms ease-in;
}
.progressbar .holder .labels i.reading::before {
  color: #db514d;
  border: solid 2px #db514d;
}


.progressbar .holder .labels i::after {
  display: block;
  content: attr(data-label);
  position: relative;
  top: 0;
  padding: 0 1em 1em 1em;
  font-family: 'Open Sans';
  font-size: .7em;
  font-style: normal;
  font-weight: 400;
  color: #504e50;
  transition: color 150ms ease-in, top 100ms ease-out;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.progressbar .holder .labels i::hover::after{
  color: #db514d;
}

.progressbar .holder .labels i:hover::before, .progressbar .holder .labels i:focus::before {
  background-color: #db514d;
}
.progressbar .holder .labels i:hover::after, .progressbar .holder .labels i:focus::after {
  top: -.2em;
}
.progressbar .holder .labels i.read::before {
  border-color: #db514d;
  background-color: #db514d;
}
.progressbar .holder .labels i.read:hover::before, .progressbar .holder .labels i.read:focus::before {
  background-color: #db514d;
}
.progressbar .holder .labels i.reading::after {
  color: #db514d;
  font-weight: 700;
}
.progressbar .holder .labels i.reading:hover::after, .progressbar .holder .labels i.reading:focus::after {
  top: 0;
}
.progressbar.fixed .holder {
  position: fixed;
  top: 0px;
  /* left: 0; */
  width: 100%;
  z-index: 3;
  max-width: 980px;

}
.progressbar.fixed .shim {
  display: block;

}



.header-title {
	position: absolute;
	top: 0;
	left: 50px;
	height: 40px;
	box-sizing: border-box;
  color:#fff;
	}
.header-title h1 {
	background: none;
    font-family: 'Open Sans';
    font-weight: bold!important;
    font-size: 16px !important;
    padding: 14px 0 0 14px !important;
    text-transform: uppercase;
	}

  #post_content {
      max-width: 980px;
  }
  #post_content h2 {
    color: #db514d;
    text-transform: uppercase;
    font-size: 36px;
}



  /* ----- Footer ----- */

  #footer {
  	width: 100%;
  	margin: 0 auto;
  	position: relative;
  	background: #504E50;
  	color: #ffffff;
  	box-sizing: border-box;
  }

  #footer a {
  	color: #fff;
  }

  #footer a:hover {
  	color: #fac80f;
  }

  #footer-wrapper {
  	position: relative;
  	max-width: 1140px;
  	margin: 0 auto;
  	padding: 30px 0 0 0;
  	box-sizing: border-box;
  	overflow: hidden;
  }

  .d36-footer-social {
  	font: normal 22px/1 fontawesome;
  	text-align: right;
  }

  .d36-footer-social ul {
  	list-style: none;
  	margin: 0;
  	position: relative;
  	padding: 0;
  }

  .d36-footer-social li {
  	border: 0;
  	display: inline-block;
  	margin: 0 5px;
  }

  .menu-footer-menu-container {
  	text-align: right;
  	position: relative;
  	font-size: 22px;
  	font-family: "Changa One";
  	font-weight: normal;
  	margin: 30px 0 0 0;
  	text-transform: uppercase;
  }

  .menu-footer-menu-container ul {
  	list-style: none;
  	margin: 0;
  	position: relative;
  	padding: 0;
  }

  .menu-footer-menu-container li {
  	display: inline-block;
  }

  .menu-footer-menu-container li:after {
  	content: "•";
  	color: #fff;
  	padding: 0 10px;
  }

  .menu-footer-menu-container li:last-child:after {
  	content: " ";
  	color: #fff;
  	padding: 0;
  }

  .menu-footer-menu-2-container {
  	text-align: right;
  	position: relative;
  	font-size: 13px;
  	font-weight: normal;
  	text-transform: uppercase;
  }

  .menu-footer-menu-2-container ul {
  	list-style: none;
  	margin: 0;
  	position: relative;
  	padding: 0;
  }

  .menu-footer-menu-2-container li {
  	display: inline-block;
  }

  .menu-footer-menu-2-container li:after {
  	content: "•";
  	color: #fff;
  	padding: 0 5px;
  }

  .menu-footer-menu-2-container li:last-child:after {
  	content: " ";
  	color: #fff;
  	padding: 0;
  }

  .siteinfo-mod {
  	text-align: center;
  	clear: both;
  	margin: 20px 0;
  	padding: 10px 0;
  	font-size: 12px;
  	font-family: Open Sans;
  	font-weight: 200;
  	border-top: 1px solid #fff;
  }

  #footer-wrapper .title-box {
  	margin: 0;
  }

.longform-byline {
    margin: 0 0 2em 0;
}
#post_content {
    margin: 1em auto;
}

  .byline-replace {
      display: inline;
      font-size: 14px;
      font-style: italic;
      margin: 0;
  }
  .byline-replace a {
      margin: 0;
      display: inline;
  }








/* - Mobile styles - */



@media screen and (max-width: 767px) {

body {
      font-size: 16px;}

.header-title { display: none;}

.entry-content {
    padding: 0 4% !important;
}

blockquote {
    font-size: 20px;}

.post-template-longform .wp-caption-text {
    font-size: 14px !important;
	bottom: 0;
    left: 0;
}
.post-template-longform .post {
width: 96%;}

p.alt {
    font-size: 2em;
}
h2 {
    font-size: 2em;
}

.NewLongform #post_content{
	    margin: 1em auto;
	    padding: 0 15px;
	}
  #footer-wrapper {
      padding: 30px 10px 0 10px;
  	}
  #footer-wrapper .title-box {
  	    margin: 10px 0 0 0;
  	}
    .menu-footer-menu-container {
    	    font-size: 16px;
    			margin: 30px 0 15px 20px;
    	}

}

@media only screen and (min-width: 650px) {
  .progressbar {
    display: block;
  }
}
@media only screen and (min-width: 750px) {
  .progressbar .holder {
    font-size: 90%;
  }
}
@media only screen and (min-width: 900px) {
  .progressbar .holder {
    font-size: 95%;
  }
}
