/* Article Detail Page
	* --------------------------------------- */

	.scrolled {
	  min-height: 10px;
	  background: white;
	  opacity: 0.9;
	  transition: 0.35s all ease;
	
	  .logo {
	    width: 30px;
	    transition: 0.35s all ease;
	  }
	
	  #menu {
		height: 40px;
		width: 50px;
		transition: 0.2s all ease-in-out;
	  }
	}

	.backbutton{
		position: fixed;
        cursor: pointer;
	    top: 28px;
	    right: 0;
	    font-size: 1.3em;
	    height: 40px;
	    z-index: 10;
	    width: 75px;
	    padding: 0 5% 0 0;
	    margin: 0;
	    opacity: 1;
	    -webkit-transition: .4s ease-in-out;
		-moz-transition: .4s ease-in-out;
		-o-transition: .4s ease-in-out;
		transition: .4s ease-in-out;
	}
	
	.backbutton:hover{
		opacity: 0.8;
		/*transition: all .3s;*/
	}

@media (max-width: 1090px) {
	.backbutton {
	    top: 70px;
	    width: 25px;
		}
	}


	/*---HAMBURGER---*/
	
	#artnav-icon3 {
	  width: 24px;
	  height: 24px;
	  position: relative;
	  margin: 30px 5% 0 0;
	  float: right;
	  -webkit-transform: rotate(0deg);
	  -moz-transform: rotate(0deg);
	  -o-transform: rotate(0deg);
	  transform: rotate(0deg);
	  -webkit-transition: .1s ease-in-out;
	  -moz-transition: .1s ease-in-out;
	  -o-transition: .1s ease-in-out;
	  transition: .1s ease-in-out;
	  cursor: pointer;
	}
	
	#artnav-icon3 span {
	  display: block;
	  position: absolute;
	  height: 3px;
	  width: 100%;
	  background: #e82446;
	  opacity: 1;
	  left: 0;
	  -webkit-transform: rotate(0deg);
	  -moz-transform: rotate(0deg);
	  -o-transform: rotate(0deg);
	  transform: rotate(0deg);
	  -webkit-transition: .1s ease-in-out;
	  -moz-transition: .1s ease-in-out;
	  -o-transition: .1s ease-in-out;
	  transition: .1s ease-in-out;
	}
	
	#artnav-icon3 span:nth-child(1) {
	  top: 0px;
	}
	
	#artnav-icon3 span:nth-child(2),#artnav-icon3 span:nth-child(3) {
	  top: 8px;
	}
	
	#artnav-icon3 span:nth-child(4) {
	  top: 16px;
	}
	
	#artnav-icon3.open span:nth-child(1) {
	  top: 18px;
	  width: 0%;
	  left: 50%;
	}
	
	#artnav-icon3.open span:nth-child(2) {
	  -webkit-transform: rotate(45deg);
	  -moz-transform: rotate(45deg);
	  -o-transform: rotate(45deg);
	  transform: rotate(45deg);
	}
	
	#artnav-icon3.open span:nth-child(3) {
	  -webkit-transform: rotate(-45deg);
	  -moz-transform: rotate(-45deg);
	  -o-transform: rotate(-45deg);
	  transform: rotate(-45deg);
	}
	
	#artnav-icon3.open span:nth-child(4) {
	  top: 18px;
	  width: 0%;
	  left: 50%;
	}
	
	/*---------------------*/

	.article-container{
		/* display: none; */
	    /*position: fixed; /* Stay in place */
        position: relative;
	    z-index: 10; /* Sit on top */
	    left: 0;
	    top: 0;
	    width: 100%; /* Full width */
	    height: 100%; /* Full height */
	    overflow: auto; /* Enable scroll if needed */
	    background-color: rgb(0,0,0); /* Fallback color */
	    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
	    /*-webkit-animation-name: fadeIn;
	    -webkit-animation-duration: 0.4s;
	    animation-name: fadeIn;
	    animation-duration: 0.4s */
	}

	.article-fill{
	    background-color: #ffffff;
	    width: 100%;
	    /* -webkit-animation-name: slideIn;
	    -webkit-animation-duration: 0.4s;
	    animation-name: slideIn;
	    animation-duration: 0.4s */
	}
	
	.article-head {
		position: absolute;
		width: 100%;
		height: 250px;
		/*background: url(/i/article/article-head-test.jpg) no-repeat center center fixed;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
		background-color: #000;*/
	}	
	
	.article-headback {
		position: absolute;
		width: 100%;
		height: 250px;
		overflow: hidden;
		background-color: #000;
	}
	
	.article-headback img {
		position: absolute;
	    left: 0;
	    top: 0;
	    width: 100%;
	    height: auto;
	    opacity: 0.4;
	}
	
	.article-taglist {
	    width: 70%;
	    margin-left: auto;
	    margin-right: auto;
	    margin-top: 210px;
	}
	
	@media only screen and (min-width: 1000px) {
		.article-taglist {
		    width: 700px;
		}
	}
	
	.articletag-sub{
	 	font-size: .6em !important;
	 	font-weight: bolder;
		letter-spacing: .12em;
	    text-transform: uppercase !important;
	    padding: 4px;
	    border-color: rgba(255, 255, 255, 0.20);
	    border-style: solid;
	    border-width: 1px;
	    color: rgba(255, 255, 255, 1);
		}
	
	.article-content{
        padding-top: 300px;
	    width: 70%;
	    margin-left: auto;
	    margin-right: auto;
        padding-bottom: 50px;
	}
	
	@media only screen and (min-width: 1000px) {
		.article-content{
		    width: 700px;
			}
	}

	
	.article-body{
	    text-align: left;
        color: #000;
	}
	
	.article-body h1 {
		font-family: "neuzeit-grotesk", Helvetica, Arial, sans-serif;
	    font-weight: bold;
	    letter-spacing: -.03em;
	    line-height: .95em;
	    font-size: 1.75em !important;
	    font-size: 100%;
	    margin:0;
	    padding:0;
	    color:#000;
		}

	@media only screen and (min-width: 450px) {
		.article-body h1 {
			font-size: 2em !important;
		}
	}

	@media only screen and (min-width: 600px) {
		.article-body h1 {
			font-size: 3em !important;
		}
	}
	

	.article-body h2 {
		font-family: "neuzeit-grotesk", Helvetica, Arial, sans-serif;
	    font-weight: bold;
	    letter-spacing: -.03em;
	    line-height: .95em;
	    font-size: 1.5em !important;
	    font-size: 100%;
	    margin: 50px 0 24px 0;
	    padding:0;
	    color:#000;
	}
	
	@media only screen and (min-width: 1000px) {
		.article-body h2 {
		    font-size: 2em !important
			}
	}
	
	.article-body, .article-body p {
	    font-family: "freight-text-pro-n3", "freight-text-pro", serif;
	    font-weight: 300;
	    color: #424242;
	    font-size: 1em;
	    letter-spacing: .05em;
	    line-height: 1.6em;
	}
	
	@media only screen and (min-width: 1000px) {
		.article-body, article-body p {
			font-size: 1.15em;
		}
	}
	
	.article-body a {
		text-decoration: none;
		color: #5d5d5d !important; 
		border-bottom: 1px solid #e82446 !important;
	}
	
	.article-body a:hover {
		color: #e82446 !important;
		border-bottom: 1px solid #e82446 !important;
	}
	
	.article-body em {
		font-style: italic;
	}
	
	.article-body strong {
		font-weight: bold;
	}
	
	.article-body img {
		display: block;
		margin: 50px auto 50px auto;
		width: 100%;
		height: auto !important;
	}
	
	@media only screen and (min-width: 1000px) {
		.article-body img {
			width: auto;
			}
	}
	
	.video-container {
		position: relative;
		padding-bottom: 56.25%;
		padding-top: 30px; height: 0; overflow: hidden;
		}
 
	.video-container iframe,
	.video-container object,
	.video-container embed {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		}
	
	.article-body ul {
		list-style-type: square;
		font-family: "freight-text-pro-n3", "freight-text-pro", serif;
	    font-weight: 300;
	    color: #424242;
	    font-size: 1em;
	    letter-spacing: .05em;
	    line-height: 1.6em;
	    margin: 30px 0 30px 50px;
	}
	
	@media only screen and (min-width: 1000px) {
		.article-body ul {
		    /*font-size: 1.15em;*/
		}
	}
	
	.article-body li {
		margin: 20px 0 20px 0;
	}

	.pullout {
		font-family: "neuzeit-grotesk", Helvetica, Arial, sans-serif;
	    font-weight: bold;
	    text-align: center;
	    letter-spacing: -.03em;
	    line-height: 1em;
	    font-size: 1.45em !important;
	    padding:0;
	    color:#e82446;
	    display: block;
	    margin: 30px 0;
	    width: 120%;
	    margin-left: 50%;
	    -webkit-transform: translateX(-50%);
	    -moz-transform: translateX(-50%);
	    -ms-transform: translateX(-50%);
	    -o-transform: translateX(-50%);
	    transform: translateX(-50%);
	}
	
	@media only screen and (max-width: 1000px) {
		.pullout {
		    width: 105%;		
		    font-size: 1.75em !important;
		    }
	}
	
	@media only screen and (min-width: 1000px) {
		.pullout {
		    width: 800px;		
		    font-size: 1.75em !important;
		    }
	}
	
	.article-meta {
		 font-family: "neuzeit-grotesk", Helvetica, Arial, sans-serif;
		 margin: 50px 0 50px 0;
	}
	
	.article-meta hr {
		border: 0; 
		height: 0; 
		width: 100%;
		border-bottom: 1px solid rgba(150, 150, 150, 0.3); 
		padding: 10px 0 0 0 !important;
	}
	
	.article-body hr {
		border: 0; 
		height: 0; 
		width: 100%;
		border-bottom: 1px solid rgba(150, 150, 150, 0.3); 
		margin: 40px 0 40px 0;
	}
	
	.article-date{
	 	font-size: .6em !important;
	 	font-weight: bolder;
		letter-spacing: .12em;
	    text-transform: uppercase !important;
	    float: left;
	    color:#909090;
		}
		
	.article-author{
	 	font-size: .6em !important;
	 	font-weight: bolder;
		letter-spacing: .12em;
	    text-transform: uppercase !important;
	    float: right;
	    color:#909090;
		}
	
	.article-author a{
	 	text-decoration: none;
	    color:#909090;
	    border-bottom: none;
		}
	
	.article-author a:hover{
	 	text-decoration: none;
	    color:#424242;
	    border-bottom: none;
		}
	
	.byline p{
	    font-family: "freight-text-pro-n3", "freight-text-pro", serif;
	    font-weight: 300;
	    color: #5d5d5d;
	    font-size: 0.85em;
	    letter-spacing: .05em;
	    line-height: 1.6em;
	}
	
	@media only screen and (min-width: 1000px) {
		.byline p{
			font-size: 1em;
		}
	}
	
	.byline strong {
		font-weight: bold;
		font-style: italic;
	}
	
	.go-top {
		position: fixed;
		fill: #e82446 !important;
		border-bottom: 0px !important;
		bottom: 1em;
		right: 5%;
		z-index: 1;
		display: none;
	}