html {
  box-sizing: border-box;
}
*, *:before, *:after {
  box-sizing: inherit;
}

body {
	font-size: 17px;
	font-size: 1.1rem;
	text-align: left;
}

@media all and (min-width: 30em) {
	body {
		font-size: 1.5rem; 
	}
}

img, object, video {
	max-width: 100%;
	height: auto;
}

iframe {
	max-width: 100% !important;
	width: 100% !important;
}

.tumblr_video_container {
	width: auto !important;
	max-width: 100% !important;
}

blockquote {
	font-style: italic;
	margin: 0 16px 16px;
	margin: 0 1rem 1rem;
}

blockquote cite {
	display: block;
}

blockquote cite:before {
	content: "–";
}

.bullshit-switch.right {
	float: right;
}

/* Page Structure */

/* Container */
.container {
	max-width: 720px;
	max-width: 45rem;
	margin: 0 auto;
	padding: 0 16px;
	padding: 0 1rem;
}

[role=banner] {
	overflow: hidden;
}

footer[role=contentinfo] {
	padding: 2rem 0;
	overflow: hidden;
	text-align: center;
}

.left {
	float: left;
	font-size: 15px;
	font-size: 0.95rem;
}

footer[role=contentinfo] .left {
	float: none;
}

@media all and (min-width: 500px) {
	footer[role=contentinfo] .left {	
		float: left;
	}
}

.right {
	float: right;
	font-size: 15px;
	font-size: 0.95rem;
}

footer[role=contentinfo] .right {
	float: none;
	list-style: none;
	margin: 0;
	padding: 0;
}

footer[role=contentinfo] .right li {
	display: inline-block;
	padding: 0;
}

@media all and (min-width: 500px) {
	footer[role=contentinfo] .right {
		float: right;
		margin: 15px 0 0 10px;
	}
}

/* Posts */
.posts {
	position: relative;
}

.post {
	padding: 3rem 0 3rem;
	position: relative;
}

.ad {
	margin: 1em 0;
}

.ad img {
	display: block;
	margin: 0 auto;
}

@media all and (min-width: 1200px) {
	
	.ad {
		position: absolute;
		width: 300px;
		height: 250px;
		left: -325px;
	}
	.ad img {
		max-width: 100%;
		width: 100%;
	}

	.ad-2 {
		right: -325px;
		left: auto;
	}

}

.ad-grid-container {
	display: none;
	max-width: 62em;
	margin: 0 auto;
}

.post-meta {
	overflow: hidden;
}

.qr{
	display: none;
}

.bullshit .qr .qrimg {
	padding: 1em;
}

.socialshare {
	display: none;
}

.tags {
	float: left;
}

.timestamp {
	float: right;
}

/* Title Slides */
.title-slide {
	text-align: center;
	display: table;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}

.title-content {
	display: table-cell; 
	vertical-align: middle;
}

#tumblr_controls {
	display:none;
}

.feedback-btn {
	visibility: hidden;
}

.floater {
	display: none;
}

.popup, .popup.hidden {
  	visibility:hidden;
  	opacity:0;
  	filter: alpha(opacity=0);
  	-webkit-transition:visibility 0s linear 0.5s,opacity 0.5s linear;
  	transition:visibility 0s linear 0.5s,opacity 0.5s linear;
}

.carousel {
	max-width: 728px;
	margin: -0.25em -0.25em 0;
	position: relative;
}

@media all and (min-width: 728px) {
	.carousel {
		margin: 0 auto;
	}
}

.carousel-list-container {
	overflow: hidden;
	position: relative;
}

.carousel-list {
	list-style: none;
	margin: 0;
	padding: 0;
	width: 20000px;
	display: -webkit-box;   
  	display: -webkit-flex;   
  	display: -ms-flexbox;  
	display: flex;
	position: relative;
	left: 0;
	transition: left 1s ease-in-out;
}

.carousel-dots {
	margin: 0;
	padding: 0;
	display: -webkit-box;   
  	display: -webkit-flex;   
  	display: -ms-flexbox;  
	display: flex;
	-webkit-justify-content: center;
	justify-content: center;
	height: 12px;
	margin: 0.25em auto 0;
	list-style: none;
}

.carousel-dots li {
	width: 6px;
	height: 6px;
	border-radius: 3px;
	background: #fff;
	opacity: 0.5;
	margin: 0 2px;
	transition: opacity 1s ease-in-out;
}

.carousel-dots li.active {
	opacity: 1;
}

.carousel img {
	display: block;
	max-width: 100vw;
}

.bullshit {
	font-family: Helvetica, Arial, sans-serif;
	background: url("images/amazonwrapper.jpg") no-repeat 50% 88px #000;
	color: white;
	margin-top: 145px;
	background-position-y: 145px;
	background-attachment: fixed;
}

.bullshit.car {
	background-image: url("images/carad.jpg");
	background-attachment: fixed;
}

.bullshit a {
	color: white;
}

.bullshit a:hover {
	color: yellow;
	-webkit-transition: 0.5s ease-out;
	        transition: 0.5s ease-out;
}

.bullshit [role=main] {
	background: #000;
	margin-top: 4em;
}

.bullshit .ad-grid-heading {
	font-size: 22px;
	text-align: center;
}

.bullshit .ad-grid-container {
	display: block;
	background: white;
	color: black;
	padding: 1rem 0.5rem;
	margin-left: -0.5rem;
	margin-right: -0.5rem;
}

.bullshit .g {
	background: white;
	box-sizing: border-box;  
  	display: -webkit-box;  
  	display: -webkit-flex;  
  	display: -ms-flexbox;  
  	display: flex;
  	-webkit-flex-wrap: wrap;
  	-ms-flex-wrap: wrap;
  	flex-wrap: wrap;
}

.bullshit .gi img {
	box-sizing: border-box;
  	display: block;
  	width: 100%;  
}

.bullshit .gi {
	box-sizing: border-box;
  	padding: 0.5em;
}

@media all and (min-width: 30em) {
  	.bullshit .gi {
    	width: 50%;
  	}
}

@media all and (min-width: 56em) {
  	.bullshit .gi {
    	width: 33.33333333%;
  	}
}

.bullshit header {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 99;
	width: 100%;
	padding: 0.25em 0.25em 0.5em;
	text-align: center;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#1e5799), color-stop(100%,#7db9e8));
	background: -webkit-linear-gradient(top, #1e5799 0%,#7db9e8 100%); 
	background: -webkit-linear-gradient(top, #1e5799 0%, #7db9e8 100%); 
	background: linear-gradient(to bottom, #1e5799 0%,#7db9e8 100%);
	box-shadow: 13px 15px 23px -6px rgba(0,0,0,0.75);
	
}

.bullshit h1 {
	font-family: 'Lobster', sans-serif;
	font-size: 1.2em;
	margin: 0;
	display: inline;
}

.bullshit header .left {
	font-family: 'Lobster', sans-serif;
	margin: 0.45em 0 0 0.25em;
	display: inline;
	float: none;
}

@media all and (min-width: 522px) {
	.bullshit h1, .bullshit header .left {
		display: block;
		float: left;
	}
}

.bullshit h2 {
	font-family: 'Lobster', sans-serif;
}

.bullshit h2 a {
	text-decoration: none; 
}

.bullshit .bullshit-switch {
	background-color: red;
	text-decoration: none;
	color: #fff;
	padding: 0.5em;
	border-radius: 100px;
	box-shadow: 0px 0px 16px 0px rgba(0,0,0,0.75);
	-webkit-animation: fader 2s infinite;
	        animation: fader 2s infinite;
	-webkit-animation-direction: alternate;
	        animation-direction: alternate;
	display: block;
	margin: 0.5em auto 0;
	float: none;
	clear: left;
}

@media all and (min-width: 522px) {
	.bullshit .bullshit-switch {
		float: right;
		clear: none;
		position: relative;
		top: 2px;
	}
}


@-webkit-keyframes fader {
0% { 
	-webkit-transform: scale(1, 1); 
	        transform: scale(1, 1);
 	}
100% { 
	-webkit-transform: scale(1.07, 1.07); 
	        transform: scale(1.07, 1.07);
	}
}


@keyframes fader {
0% { 
	-webkit-transform: scale(1, 1); 
	        transform: scale(1, 1);
 	}
100% { 
	-webkit-transform: scale(1.07, 1.07); 
	        transform: scale(1.07, 1.07);
	}
}

.bullshit .container {
	max-width: 640px;
	max-width: 40rem;
}

@media all and (min-width: 740px) {
	.bullshit .feedback-btn {
		visibility: visible;
		position: fixed;
		right: -105px;
		top: 40%;
		z-index: 999999;
		-webkit-transform: rotate(90deg);
		    -ms-transform: rotate(90deg);
		        transform: rotate(90deg);
		-webkit-transform-origin: 50%;
		    -ms-transform-origin: 50%;
		        transform-origin: 50%;
	}
}

.bullshit .feedback-btn a {
	font-size: 16px;
	text-decoration: none;
	color: #fff;
	display: block;
	padding: 0.7em;
	border-radius: 0px 0px 10px 10px;
	background-color: #666666;
	box-shadow: 0px 6px 21px 14px rgba(0,0,0,0.75);
	-webkit-transition: padding-top 0.2s ease-out;
	        transition: padding-top 0.2s ease-out;
}



.bullshit .feedback-btn a:hover {
	padding-top:1em;
}


.bullshit .floater {
	display: block;
	position: fixed;
	bottom: -180px;
	right: 0%;
	width: 100%;
	background: rgba(255, 255, 255, 0.9);
	color: #000;
	padding: 0.7em;
	border-radius: 10px 10px 0px 0px;
	-webkit-transition: bottom 2s ease-out;
	        transition: bottom 2s ease-out;
	visibility: hidden;
	text-align: center;
}

@media all and (min-width: 410px) {
	.bullshit .floater {
		visibility: visible;
	}
}

@media all and (min-width: 490px) {
	.bullshit .floater {
		right: 20%;
		width: auto;
	}
}

.bullshit .floater.active {
	bottom: 0;
}

.bullshit .floater p {
	margin: 0 0 0.7em;
}

.bullshit .floater ul { 
	display: -webkit-box; 
	display: -webkit-flex; 
	display: -ms-flexbox; 
	display: flex; 
	list-style: none;
	margin: 0;
	padding: 0;
	-webkit-box-pack: center;
	-webkit-justify-content: center;
	    -ms-flex-pack: center;
	        justify-content: center;	
}



.bullshit .floater a {
	display: block;
	color: #000;
	width: 61px;
	height: 65px;
	background: url("http://deathtobullshit.com/images/socialfloater.png") no-repeat;
	overflow: hidden;
	text-indent: -999px;
	margin-right: 5px;
	position: relative;
	top: 0;
	-webkit-transition: top 0.3s ease-out;
	        transition: top 0.3s ease-out;
	border-radius: 15px;
}

.bullshit .floater a:hover {
	top: -3px;
}



.bullshit .floater a.icon-twitter {
	background-position: 0 0;
}

.bullshit .floater a.icon-facebook {
	background-position: -146px 0;
}

.bullshit .floater a.icon-linkedin{
	background-position: -219px 0;
}

.bullshit .floater a.icon-instagram {
	background-position: 0 -82px;
}

.bullshit .floater a.icon-rss {
	background-position: -219px -82px;
}

.bullshit .footerimg {
	z-index: 9999999;
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;
}

@media all and (min-width: 410px){
	.bullshit .footerimg {
		position: static;
		width: auto;
	}
}

.bullshit h3 {
	padding: 0;
	margin: 0;
}

.bullshit .like-btn {
	text-decoration: none;
	color: #fff;
	background: #3B5998;
	border-radius: 10px;
	box-shadow: 13px 15px 23px -6px rgba(0,0,0,0.75);
	padding: 1em 5em;
	font-weight: bold;
	position: relative;
	top: 0;
	-webkit-transition: all 0.5s ease-out;
	        transition: all 0.5s ease-out;
}

.bullshit .like-btn:hover {
	background: #23355b;
	top: -3px;
	color: #fff;
}

.bullshit .popup {
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background: rgba(0,0,0,0.6);
	color: black;
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	-webkit-justify-content: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	-webkit-box-align: center;
	-webkit-align-items: center;
	    -ms-flex-align: center;
	        align-items: center;
	z-index: 9999;
	visibility:visible;
	opacity:1;
	filter: alpha(opacity=100);
	-webkit-transition-delay: 5s;
	        transition-delay: 5s;
}

.bullshit .popup-window {
	position: relative;
	background: #fff;	
	color: #000;
  	width: 90%;
  	height: 400px;
  	border-radius: 10px;
  	font-family: Helvetica, serif;
  	box-shadow: 13px 15px 23px 8px rgba(0,0,0,0.98);
  	text-align: center;
  	padding: 1em;;  	
  	display: -webkit-box;;  	
  	display: -webkit-flex;;  	
  	display: -ms-flexbox;;  	
  	display: flex;
	-webkit-box-pack: center;
	-webkit-justify-content: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	-webkit-box-align: center;
	-webkit-align-items: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-webkit-flex-direction: column;
	    -ms-flex-direction: column;
	        flex-direction: column;
	max-width: 600px;
}


.bullshit .popup.hidden {
	display: none;
}

.bullshit .popup-close-btn {
	color: #000;
	position: absolute;
	top: 1em;
	right: 1em;
	font-size: 14px;
	color: #a1a1a1;
}

.bullshit .popup-close-btn:hover {
	color: #333;
	}
	
.bullshit .popup p {
	max-width: 16em;
	font-size: 32px;
	font-weight: bold;
}

.bullshit .qr {
	padding: 0.5em;
	display: -webkit-box;   
  	display: -webkit-flex;   
  	display: -ms-flexbox;   
  	display: flex;
  	-webkit-box-pack: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	justify-content: center;
}
	
.bullshit .socialshare {
	display: block;
}

.bullshit .socialshare h3 {
	font-size: 14px;
	font-weight: normal;
}

.bullshit .socialshare-list {   
  	display: -webkit-box;   
  	display: -webkit-flex;   
  	display: -ms-flexbox;   
  	display: flex;
	list-style: none;
	width: 100%;
	background:#000;
	padding: 0;
	margin: 0;
}

.bullshit .socialshare-list a{
	display: block;
	list-style-type: none;
	color: #000;
	width: 44px;
	height: 65px;
	background: url("http://deathtobullshit.com/images/socialmedia.png") no-repeat;
	overflow: hidden;
	text-indent: -999px;
	margin-right: 5px;
	-webkit-transform: rotate(0deg);
	    -ms-transform: rotate(0deg);
	        transform: rotate(0deg);
	-webkit-transition: all 0.5s ease-out;
	        transition: all 0.5s ease-out;
}

.bullshit .socialshare-list a:hover{
	  -webkit-transform: rotate(360deg);
	      -ms-transform: rotate(360deg);
	          transform: rotate(360deg);
}

.bullshit .socialshare-list a.sharetwitter {
	background-position: -3px, 0px;
}

.bullshit .socialshare-list a.shareface {
	background-position: -43px, 0px;
}

.bullshit .socialshare-list a.sharegplus{
	background-position: -83px, 0px;
}

.bullshit .socialshare-list a.sharelinkedin {
	background-position: -123px, 0px;
}
.bullshit .socialshare-list a.sharereddit{
	background-position: -163px, 0px;
}

.bullshit .socialshare-list a.sharegmail {
	background-position: -203px, 0px;
}
