html{
  position: relative;
  min-height: 100%;

}



body {
  margin: 0 0 100px;
  overflow: scroll;
  font-family: "Trebuchet MS", Verdana, sans-serif;
  font-size: 13px;
  line-height: 150%;
  min-width: 320px;
  -webkit-font-smoothing: antialiased;

}

input:focus,
select:focus,
textarea:focus,
button:focus {
    outline: none;
}

.side-bar-image{
  width: 100%;
  border: 1px solid lightgrey;
  border-radius: 2px;
}

.book-image-container{
  position: relative;

}


.lp-side-bar-image{
  width: 100%;  
}

.lp-top-book{
  pointer-events: none;  
}

.lp-side-bar-image-behind{
  z-index: -2;
  position: absolute;
  left: -28px;
  transform: rotate(-6deg);
  pointer-events:all;
}

/*.lp-side-bar-image-behind:hover{
  transform: rotate(0deg);
  left:  0px;
}*/

.lp-blurb{
  padding-top: 0px;
  text-align: center;
  line-height: 2.1em;
  margin-top: 0;
}

.lp-announcement{
  text-align: right;
  color: #313131;
  line-height: 20px;
  letter-spacing: 2px;  
}

.meditation-app-img{
  width: 61%;
  margin: auto;
}

.meditation-app-box{
  text-align: center;
  border: 1.5px solid rgb(200, 200, 200);
  border-radius: 15px;
  background-color: white;
  padding-top: 53px;
  cursor: pointer;
  box-shadow: 6px 6px rgba(136, 136, 136, 0.7);
  /*padding-bottom: 92px;*/
}

.spinchess-app-img{
  width: 74%;
  margin: auto; 
  opacity:  .85;
}

.spinchess-app-img:active{
  opacity: .5;
}

.ios-mobile-cansuckmywelldesigneddick {
-webkit-appearance: none;
border-radius: 0;
}

.subscribe-page-prompt-portal-link{
  cursor: pointer;
}

.prompt-portal-img-link-front-pg{
  width: 82%;
}

.front-pg-tool-message{
    width: 82%;
    margin: auto;
}


.epigraph{
  width: 65%;
  margin: 0 auto;
}

.indent-one{
  width: 84%;
  margin-left: 8%;
}

.indent-two{
  width: 84%;
    margin-left: 8%;
}

a{
  text-decoration: none;
  
}

.principles-container{
  font-size: 1.5em;
  font-family: 'Alegreya Sans SC';
  width: 80%;
  padding-top: 2em;
 /* display: block;*/
}

.principles-container h2{
  font-family: 'Alegreya Sans SC';
}

.principles-disclaimer{
  width: 80%;
  font-size: .75em;
  margin: auto;
  text-align: center;
}

.center{
  text-align: center;
}

#pagination_controls a{
  color: #4F007C !important;
}

.external-link {
  text-decoration: none;
  color: #4F007C;
}

.site-links {
  text-decoration: none;
  color: darkgrey;
}

.internal-link {
  text-decoration: none;
  color: #4F007C;
  font-style: italic;
}

.disclaimer {
  color: maroon;
}

.mobile-top-page-links{
  display: flex;
  justify-content: space-between;
  padding-bottom: 3.5px;
  border-bottom: .5px solid black;
}

.reverse-order {
  text-align: right;
}

.itunes-link{
  text-align: left;
}

.permalink {
  text-decoration: none;
  color:  #a8a8a8;
  text-align: center;
}

.permalink:hover {
  color: grey;
}

.permalink-title{
  color: rgb(77,77,77);

}

/*.archive-title{
  font-size: 4em;
}*/

.archive-link {
  color: grey;
}

.archive-link:hover {
  color: #a8a8a8;
}

.archive-permalink-formater .archive-link {
  font-size: 1.5em;
  color: grey;
}

.archive-date{
  text-indent: 2.5em;
  margin: 0;
}

.raw-post {
  margin: 1px;
}


a.twitter-follow-button {
  display: block;
  text-align: center;
  padding: .5rem;
  color: white;
  border-radius: 5px 5px 2px 2px; 
  background-color: #9c9c9c;
  font-size: 1.25em;
  letter-spacing: .1rem;
}

a.twitter-follow-button:hover {
  background-color: #00aced;
}

 .twitter-btn-icon{
    margin-right: 0.4em;
    vertical-align: top;
 }

 .twitter-btn-icon svg {
    margin-top: -.1em;
    width: 1.5em !important;
    height: 1.5em !important;
 }


.center-amazon-link{
    text-align: center;
    width: 100%;
    display: flex;
    justify-content: space-evenly;
}

.center-amazon-link-single{
     text-align: center;
    width: 100%;
    justify-content: space-evenly; 
}

.center-amazon-link-single{
    text-align: center;
    width: 100%;
}


@-webkit-keyframes malfunction
{
0% {opacity:1;}
10% {opacity:1;}
12% {opacity:1;}
17% {opacity:0;}
21% {opacity:1;}
23% {opacity:0;}
25% {opacity:1;}
39% {opacity:0;}
42% {opacity:1;}
46% {opacity:0;}
49% {opacity:.5;}
52% {opacity:1;}
55% {opacity:1;}
56% {opacity:1;}
57% {opacity:0;}
58% {opacity:1;}
70% {opacity:1;}
73% {opacity:0;}
78% {opacity:1;}
80% {opacity:0;}
81% {opacity:1;}
83% {opacity:0;}
87% {opacity:1;}
89% {opacity:1;}
91% {opacity:1;}
94% {opacity:0;}
96% {opacity:1;}
97% {opacity:1;}
99% {opacity:0;}
}


.notice{
   
  text-align: center;
  color: grey;
  font-family: /*"Lucida Grande"*/ 'Alegreya Sans SC';
  padding-top: 2em;
  /*padding-bottom: 2em;*/
  

}



.enthusiastic-notice {
  text-align: left;
    color: #6d6d6d;
    font-size: 1.1em;
    font-family: /*"Lucida Grande"*/ 'Alegreya Sans SC';
}

.social-media-link{
    padding-top: 8px;
    display: inline;
    align-items: center;
}

.left-column-twitter-link{
  padding-bottom: 2px;
}

.left-column-social-links{
  display: flex;
  justify-content: space-around;  
}

.left-column-social-link-cage{
  width: 100%;
  text-align: center;  
  opacity: .4;
  -webkit-transition: opacity 700ms ;
  -moz-transition: opacity 700ms ;
  -ms-transition: opacity 700ms ;
  -o-transition: opacity 700ms ;
  transition: opacity 700ms ;  
}

.left-column-social-link{
  -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
  filter: grayscale(100%);
  -webkit-transition: filter 700ms ;
  -moz-transition: filter 700ms ;
  -ms-transition: filter 700ms ;
  -o-transition: filter 700ms ;
  transition: filter 700ms ;  
}

.left-column-social-link:hover{
  -webkit-filter: grayscale(0); /* Safari 6.0 - 9.0 */
  filter: none; 
}

.left-column-social-link-cage:hover {
  opacity: 1;
}


.social-media-notice{
  max-width: 25px;
}

.sub-notice{
  -webkit-animation: malfunction 5s infinite;
  /*border: 1px solid grey;*/
}

.sub-notice-2{
  -webkit-animation: malfunction 4.7s infinite;
}

.sub-notice-3{
  -webkit-animation: malfunction 4.9s infinite;
}

.beback{
  
  padding-top: 2em;
  margin-top: 1em;
}

.reading-list-notice{

}

.dive-in{
  padding-top: .75em;
}

.archives-link{
  color: darkslategrey;
}

.reading-list-link{
  text-decoration: none;
  color: #C39E7F;
  font-style: bold;
 
}

.end-post-message{
  text-align: center;
  color: grey;
  font-family: /*"Lucida Grande"*/ 'Alegreya Sans SC';
  font-size: .75em;
  line-height: .75em;  
}

.post-cubes-img{
    max-width: 49%;
    margin: auto;
}


/**************Reading List*****************/

.recommend-container{
  padding-top: 13em;
  text-align: center;
  /*width:94%;*/
  margin: auto;
}

 @media only screen and (max-width: 620px) {
  .recommend-container{
    padding-top: 9em;
  }
}

.recommended-heading{
    color: rgb(77,77,77);
    font-family: /*"Lucida Grande"*/ 'Alegreya Sans SC';
    text-align: center;
    padding-bottom: 3em;
}

.recommended-reading{
  width: 94%;
}

.recommended-item{
  vertical-align: top;
  display: inline-block;
  text-align: left;
  max-width: 140px;
  padding-left: 7%;
  padding-right: 7%;
  padding-bottom: 2em;
}

.img-link img{

}

.item-blurb{
  display: block;
  font-style: italic;

}








/****************end Reading List************/


/*======================== sharing is a gift bar ==========================*/

.sharing-is-a-gift-bar {
  display: inline-flex;
  justify-content: space-between;
  align-items: center;
  background-color: #dcdcdc;
 /* border-radius: 0px 0px 20px 5px;*/
  margin-top: 0;
  margin-bottom: .25rem;
  width: 100%;

}

.sharing-buttons{
  display: inline-block;
}

.sharing-message {
  font-size: 1.2rem;
  font-style: italic;
  opacity: .7;
  text-align: center;
  margin: 0 auto;
}

@media only screen and (max-width: 1206px) {
  .sharing-message{
    display: none;
  }
}


.resp-sharing-button__link,
.resp-sharing-button__icon {
  display: inline-block
}

.resp-sharing-button__link {
  text-decoration: none;
  color: #fff;
  margin: 0.5em
}

.resp-sharing-button {
  border-radius: 5px;
  transition: 25ms ease-out;
  padding: 0.5em 0.75em;
  font-family: Helvetica Neue,Helvetica,Arial,sans-serif
}

@media only screen and (max-device-width: 480px), only screen and (min-device-width: 560px) and (max-device-width: 1136px) and (-webkit-min-device-pixel-ratio: 2){
  .resp-sharing-button {
    padding: 0.4em 0.5em;
  }
}


.resp-sharing-button__icon svg {
  width: 1em;
  height: 1em;
  margin-right: 0.4em;
  vertical-align: top
}

.resp-sharing-button--small svg {
  margin: 0;
  vertical-align: middle
}

/* Non solid icons get a stroke */
.resp-sharing-button__icon {
  stroke: #fff;
  fill: none
}

/* Solid icons get a fill */
.resp-sharing-button__icon--solid,
.resp-sharing-button__icon--solidcircle {
  fill: #fff;
  stroke: none
}

.resp-sharing-button--twitter {
  background-color: #55acee
}

.resp-sharing-button--twitter:hover {
  background-color: #2795e9
}

.resp-sharing-button--pinterest {
  background-color: #bd081c
}

.resp-sharing-button--pinterest:hover {
  background-color: #8c0615
}

.resp-sharing-button--facebook {
  background-color: #3b5998
}

.resp-sharing-button--facebook:hover {
  background-color: #2d4373
}

.resp-sharing-button--tumblr {
  background-color: #35465C
}

.resp-sharing-button--tumblr:hover {
  background-color: #222d3c
}

.resp-sharing-button--reddit {
  background-color: #5f99cf
}

.resp-sharing-button--reddit:hover {
  background-color: #3a80c1
}

.resp-sharing-button--google {
  background-color: #dd4b39
}

.resp-sharing-button--google:hover {
  background-color: #c23321
}

.resp-sharing-button--linkedin {
  background-color: #0077b5
}

.resp-sharing-button--linkedin:hover {
  background-color: #046293
}

.resp-sharing-button--email {
  background-color: #777
}

.resp-sharing-button--email:hover {
  background-color: #5e5e5e
}

.resp-sharing-button--xing {
  background-color: #1a7576
}

.resp-sharing-button--xing:hover {
  background-color: #114c4c
}

.resp-sharing-button--whatsapp {
  background-color: #25D366
}

.resp-sharing-button--whatsapp:hover {
  background-color: #1da851
}

.resp-sharing-button--hackernews {
background-color: #FF6600
}
.resp-sharing-button--hackernews:hover, .resp-sharing-button--hackernews:focus {   background-color: #FB6200 }

.resp-sharing-button--vk {
  background-color: #507299
}

.resp-sharing-button--vk:hover {
  background-color: #a8a8a8;
}

.resp-sharing-button--facebook {
  background-color: grey;
  border-color: grey;
}



@media only screen and (max-device-width: 320px), only screen and (orientation:portrait) and (-webkit-min-device-pixel-ratio: 2){
  .resp-sharing-button--facebook{
   /* border-bottom-left-radius: 15px;*/
  }
}

@media only screen and (max-device-width: 480px), only screen and (min-device-width: 560px) and (max-device-width: 1136px) and (-webkit-min-device-pixel-ratio: 2){
  .podcast-page-fb-btn{
    border-bottom-left-radius: 5px !important;
  }

}



.resp-sharing-button--facebook:hover,
.resp-sharing-button--facebook:active {
  background-color: #a8a8a8;
  border-color: #a8a8a8;
}

.resp-sharing-button--twitter {
  background-color: grey;
  border-color: grey;
}

.resp-sharing-button--twitter:hover,
.resp-sharing-button--twitter:active {
  background-color: #a8a8a8;
  border-color: #a8a8a8;
}

.resp-sharing-button--google {
  background-color: grey;
  border-color: grey;
}

.resp-sharing-button--google:hover,
.resp-sharing-button--google:active {
  background-color: #a8a8a8;
  border-color: #a8a8a8;
}

.resp-sharing-button--email {
  background-color: grey;
  border-color: grey;
}

.resp-sharing-button--email:hover,
.resp-sharing-button--email:active {
  background-color: #a8a8a8;
  border-color: #a8a8a8;
}

.resp-sharing-button--linkedin {
  background-color: grey;
  border-color: grey;
}

.resp-sharing-button--linkedin:hover,
.resp-sharing-button--linkedin:active {
  background-color: #a8a8a8;
  border-color: #a8a8a8;
}

.resp-sharing-button--reddit {
  background-color: grey;
  border-color: grey;
}

.resp-sharing-button--reddit:hover,
.resp-sharing-button--reddit:active {
  background-color: #a8a8a8;
  border-color: #a8a8a8;
}

.resp-sharing-button--whatsapp {
  background-color: #25D366;
  border-color: #25D366;
}

.resp-sharing-button--whatsapp:hover,
.resp-sharing-button--whatsapp:active {
  background-color: #a8a8a8;
  border-color: #a8a8a8;
}

.resp-sharing-button--vk {
  background-color: #507299;
  border-color: #507299;
}

.resp-sharing-button--vk:hover
.resp-sharing-button--vk:active {
  background-color: #a8a8a8;
  border-color: #a8a8a8;
}

.count-holder {
  display: inline-block;
 border-radius: 5px;

  font-family: Helvetica Neue,Helvetica,Arial,sans-serif;
  color: #525050;
  background-color: none;
  margin: 0.5em;
  margin-left: 1em;
}

@keyframes bounce{
  0%{transform:none}
  50%{transform:scale(1.5)}
  100%{transform:none}
}

.star{
  position: relative;
} 

.starcount{
  display: inline-flex;
}

.tinker-star {
    position: relative;
    top: 6px;
    z-index: 2;


    /*display: inline-flex;
    vertical-align: middle;
    padding-bottom: .6em;*/
}

.tinker-star img{
    max-width: 100%;
    max-height: 31px;
    z-index: 2;
}

.tinker-star img:hover{
  opacity: .7;
}

.star-pop{
  z-index: 99;
  animation-name: bounce;
  animation-duration: .5s;
  animation-iteration-count: 1;
}

@keyframes linkblink{
  0%{background-color: grey}
  15%{background-color: grey}
  20%{background-color: #af69f0}
  80%{background-color: #af69f0}

}

.staroverlap{
  position: relative;
}


.tinker-star-background{
    position: absolute;
    top: -3px;
    left: -10px;
    z-index: 1;

   /* position: absolute;*/
    /*z-index: 1;
    left: -15px;
    top: -13px;
    right: -1px;*/
}

.whitestar{
  max-width: 139%;
  max-height: 47px;
}


.blink-purple{
  animation-name: linkblink;
  animation-duration: 4s;
  animation-iteration-count: 1;
  animation-timing-function: ease-out;

}

@media only screen and (max-width: 420px) {
  .count-holder {
    display: inline-flex;
  }
}

.bit-btn img{
  max-width: 33px;
  height: auto;
  padding-top: 4px;
  padding-right: 5px;
}

@media only screen and (max-device-width: 480px), only screen and (min-device-width: 560px) and (max-device-width: 1136px) and (-webkit-min-device-pixel-ratio: 2){
  .bit-btn img{
  max-width: 30px;

  }

}

.bit-btn img:hover {
  opacity: .7;
}

.bit-btn-support img {
  max-width: 15%;
  padding: 1.25rem 0 1.25rem 0;
}

.bit-btn-support img:hover {
  opacity: .7;
}




/** LIGHTBOX MARKUP **/

.lightbox {
  /** Default lightbox to hidden */
  display: none;

  /** Position and style */
  position: fixed;
  z-index: 999;
  width: 100%;
  height: 100%;
  text-align: center;
  top: 0;
  left: 0;
  background: rgba(0,0,0,0.8);
}

.lightbox img {
  /** Pad the lightbox image */
  max-width: 90%;
  max-height: 80%;
  margin-top: 2%;
}

.lightbox:target {
  /** Remove default browser outline */
  outline: none;

  /** Unhide lightbox **/
  display: block;
}

.lightbox2 {
  height: 100%;
  width: 100%;
  display: absolute;
}

.lightbox2 img{
  max-height: 90% !important;
  width: auto !important;
}

.drawing:hover {
  opacity: .7;
}

/*********************Easter Egg 1 - I puzzle *************************/

.indie-letters{
  text-decoration: none;
  color: black;

}


.roguie{
  cursor: pointer;
  display: inline-block;
}

.spin-me{
  letter-spacing: 0px;
  margin-right: 9px;
  transform: rotate(90deg);
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
}

.yoke-box{
  display: none;
}


.yoke-box-img {
  height: 71vh;    
  max-width: 90%;
  margin: auto;
}


.easter-announcement{
      color: #717171;
    font-size: 2em;
    margin: auto;
    font-style: italic;
    margin-bottom: 1em;
    margin-top: 1em;
}


/**************** New Moiribbon ******************/


.moiribbon-text-env-class{
  display: none;
    background: #232323de;
    max-width: 100%;
    min-width: 100%;
    height: 100%;
    z-index: 999;
    position: fixed;
    margin: auto;
    text-align: center;
    padding-top: 5vh;
}

.large-moiribbon-box{
  display: none;
}


.showribbon{
  display: block;
}

.moiribbon-text-image{
border: 12px solid #c5c5c5;
    border-radius: 5px;
    max-height: 86vh;
    width: auto;
    max-width: 91%;
}




/*=================== end of sharing is caring bar ===================*/

.shrink {
  top: -75px;

  -webkit-transition: top 400ms ;
  -moz-transition: top 400ms ;
  -ms-transition: top 400ms ;
  -o-transition: top 400ms ;
  transition: top 400ms ;
}



/**  fix for landscape orientation for small phones.  change mobile menu queries back to 470px
@media only screen and (max-width: 600px) {
  header{

  }
}
**/


.mobile-menu-container {
  display: inline-flex;
  justify-content: space-between;
  position: fixed;
  margin: 0 auto;
  z-index: 3;
  padding: .5em;
  padding-right: 10em;
  width: 95%;
  background-color: white;
  border-bottom: 1px solid black;

}


@media only screen and (max-width: 620px) {
  header{
    display: none;
  }
}

.mobile-menu-header {
  display: none;
}

@media only screen and (max-width: 620px) {
  .mobile-menu-header * {
  margin: 0;
  /*padding: 0;*/
}

.mobile-menu-header {
  display: flex;
  margin: 0;
  padding: 0;
  min-width: 100%;
  width: 100%;
  max-width: 100%;
  min-height: 100%;
  height: 100%;
  max-height: 100%;
  background-color: solid grey;
  font-family: 'Raleway', sans-serif;
  justify-content: space-between;
}

a{
  text-decoration: none;
}
ul{
  padding: none;
}


/*============================== Hamburger Menu ============================*/


.mobile-menu-container h1 {
  opacity: .7;
}

.container {
  display: flex-block;

}


/*============== Hamburger Menu===============*/
/*
* {
  -webkit-tap-highlight-color: transparent;
  -moz-tap-highlight-color: transparent;
}

.hamburger {
  width: 40px;
  height: 45px;
  display: block;
  position: absolute;
  cursor: pointer;
  right: 20%;
  margin-left: -25px;
  top: 60%;
  margin-top: -22.5px;
}
.hamburger span {
  z-index: 100;
  display: block;
  position: absolute;
  height: 5px;
  width: 100%;
  background: #4d4d4d none repeat scroll 0% 0%;
  opacity: 1;
  left: 0px;
  transition: all 0.25s ease-in-out 0s;
  transform: rotate(0deg);
}
.hamburger span:nth-child(1) {
  margin-top: 0px;
}
.hamburger span:nth-child(2) {
  margin-top: 12px;
  margin-left: 0px;
}
.hamburger span:nth-child(3) {
  margin-top: 24px;
}
.hamburger.opened span:nth-child(1) {
  transform: rotate(135deg);
  margin-top: 16px;
}
.hamburger.opened span:nth-child(2) {
  opacity: 0;
  left: -75px;
}
.hamburger.opened span:nth-child(3) {
  transform: rotate(-135deg);
  margin-top: 16px;
}

*/


/*===========Hamburger====================*/

.hamburger {
  cursor: pointer;
}

/* Style Hamburger*/
.bar1, .bar2, .bar3 {
  display: block;
  opacity: .7;
  width: 35px;
  height: 5px;
  background-color: #333;
  margin: 6px 0;
  transition: 0.4s;
  cursor: pointer;
}

.bar2{
  cursor: pointer;
  vertical-align: middle;
  height: 5px;
  font-size: 1.2em;
  /*margin-top: -14px;
  margin-bottom: 10px;*/
  transition: 0.4s;
}

/* Rotate first bar */
.change .bar1 {
  /*-webkit-transform: rotate(-45deg) translate(-9px, 6px) ;
  transform: rotate(-45deg) translate(-9px, 6px) ;*/
  transform: rotate(135deg) translate(8px, -8px);
  -webkit-transform: rotate(135deg) translate(8px, -8px);
  cursor: pointer;

}

/* Fade out the second bar */
.change .bar2 {
  opacity: 0;
  transform: translateX(-100%);
  cursor: pointer;
}

/* Rotate last bar */
.change .bar3 {
  /*-webkit-transform: rotate(45deg) translate(-8px, -8px) ;
  transform: rotate(45deg) translate(-8px, -8px) ;*/
  transform: rotate(-135deg) translate(7px, 8px);
  -webkit-transform: rotate(-135deg) translate(7px, 8px);
  cursor: pointer;

}

/*========= Mobile Menu ==================*/
#mobile-menu{
  position: fixed;
  text-align: center;
  list-style: none;
  background: grey;
  width: 100%;
  color: white;
  padding-top: 4.9em;
  padding-left: 0;
  box-shadow: 0 10px 20px rgba(0, 0, 0, .0), 0 6px 6px rgba(0, 0, 0, 0.1);
  opacity: .9;
  z-index: 2;
}
#mobile-menu ul{
  margin: none !important;
  background-color: solid;

}
#mobile-menu li{
  margin: none !important;
}
#mobile-menu li a{
  border-style: solid;
  border-top:  solid grey;
  border-left-style: none;
  border-bottom: none;
  display:inline-block;
  padding-top: 1em;
  padding-bottom: 1em;
  width: 100%;
  color: white;
  transition: background-color 0.6s ease;
}

#mobile-menu li a:hover{
  transition: background-color 0.6s ease;
  background: solid grey;
}

.menu-hidden{
  margin-top: -40em;
}

}


.tinkered-thinking{
  /*padding-left: 10px;*/
  color: black;
}

.logo-container {
  height: auto;
}

/**.tinkered-logo {
  max-width: 22%;
  height:auto;
}**/

.header-link {
  max-height: 3rem;
  width: 85%;
}

@media only screen and (max-width: 400px){
  .tinkered-logo {
    max-width: 30%;
  }
}

@media only screen and (max-width: 300px){
  .tinkered-logo {
    max-width: 40%;
  }
}
/*
.tinkered-logo {
  width: 25%;
  height: 25%;
}
*/

@media only screen and (max-width: 736px) {
  .tinkered-logo {
    height: 100%;
  }
}


@media only screen and (max-device-width: 480px), only screen and (min-device-width: 560px) and (max-device-width: 1136px) and (-webkit-min-device-pixel-ratio: 2){
  .tinkered-logo {
    max-width: 100%;
  }
}

@media not all and (min-resolution:.001dpcm) { @media {

    .tinkered-logo { 

        max-width: 40%;

    }
}}


.logo {
  color: black;
  font-size: 20px;
  letter-spacing: 9px;
  word-spacing: 15px;
  font-family: /*"Lucida Grande"*/ 'Alegreya Sans SC';
  display: block;
  align-items: center;
  padding-top: 35px;
  padding-bottom: 20px;
}

nav {
  display: block;
}

.navlink {
  display: inline-block;
  color: #171717;
  text-decoration: none;
  padding: 10px;
  padding-left: 20px;
  padding-right: 20px;
}

.mobile-navlink:hover {
  opacity: .5;
}

.footer-link{
  color: #969696;
}

.copywrite{
  color: #969696;
}

.quill-footer{
  width: 100%;
}

.promptPortal{
  padding-top: 2em;
  cursor: pointer;
  width: 6%;
  margin: auto;
}

@media only screen and (max-width: 700px) {
  .promptPortal{
    width: 9%;
  }
}

@media only screen and (max-width: 500px) {
  .promptPortal{
    width: 15%;
  }
}


.prompt-header{
  display: inline;
  font-family: Verdana;
  font-size: 8px;
  font-weight: bold;
  height: 115px;
  width: 100%;
  text-align: center;
  align-items: center;
  justify-content: space-between;
  background-color: white;
  z-index: 3;
  top: 0;
  /*border-bottom: 2px solid black;*/
  -webkit-transition: top 200ms ;
  -moz-transition: top 200ms ;
  -ms-transition: top 200ms ;
  -o-transition: top 200ms ;
  transition: top 200ms ;
}

.quill-container{
    position: absolute;
    width: 165px;
    margin: auto;
    left: 0;
    right: 0;
    padding-top: 2em;
}

.prompt-logo{
  padding-top: 4em;
}

.prompt-title{
    text-align: center;
    padding-bottom: 2em;
    font-family: 'Liu Jian Mao Cao', cursive;
    font-size: 2em;
    font-weight: 100;
    letter-spacing: .5px;   
    color: #80724a;
}

.prompt-container{
  width: 100%;
  padding-top: 5em;
  max-width: 1000px;
  margin: auto;
}

.main-prompt-bucket{
    width: 72%;
    display: flex;
    margin: auto;
    text-align: center;
    padding-bottom: 7.5em;    
}



.quote-portal{
    width: 100%;
    font-family: 'Didact Gothic', sans-serif;
    font-weight: 100;
    padding-top: 1.25em;
    padding-bottom: 1.25em;
    font-size: 1.75em;
    letter-spacing: .5px;
    word-spacing: 1px;
    line-height: 2em;
    text-align: left;
}


@media only screen and (max-width: 850px) {
  .quote-portal{
    font-size: 1.5em;
  }
}


@media only screen and (max-width: 700px) {
  .quote-portal{
    font-size: 1.25em;
  }
}

.prompt-author{
  font-family: 'Poiret One', cursive;
}

.rating-container{
  width: 100%;
  text-align: center;
}

.prompt-rating-box{
  display: inline-flex;
  justify-content: space-around;
  width: 69%;
  padding-bottom: 2.5em;
}

.response-to-prompt{  
  margin: auto;
  display: flex;
    height: 60px;
    width: 60px;
    border: 1.5px solid #bdbdbd;
    border-radius: 33px;
    cursor: pointer;
  -webkit-transition: /*color 750ms ease-in-out,*/ background-color 1s ;
  -moz-transition:/* color 750ms ease-in-out, */background-color 1s ;
  -o-transition:/* color 750ms ease-in-out,*/ background-color 1s ;
  transition:/* color 750ms ease-in-out,*/ background-color 1s ;    
}

.response-to-prompt:hover {
  background-color: #e2e2e2;
  -webkit-transition: /*color 750ms ease-in-out,*/ background-color 20ms ;
  -moz-transition:/* color 750ms ease-in-out, */background-color 20ms ;
  -o-transition:/* color 750ms ease-in-out,*/ background-color 20ms ;
  transition:/* color 750ms ease-in-out,*/ background-color 20ms ;  
}

.prompt-spiel-explaination{
    line-height: 2.25em;
    font-size: 1.25em;
}

.rating-title{
  color: grey;
  padding-bottom: 1em;
  font-size: 1.7em;
  font-family: 'Caveat', cursive;
}

.response-title{
  padding-top: .5em;
  color: grey;
}

.response-container{
  padding-top: 2em;
  width: 30%;
}

.prompt-response-img{
    width: 60%;
    vertical-align: middle;
    margin: auto;
}

.quote-division{
  width: 0%;
  height: 5px;
  margin: auto;
  border-top: 1px solid grey;
  margin-top: 5px;
}

.prompt-spiel{
  width: 64%;
  margin: auto;
  color: #a2a2a2;
}

@media only screen and (max-width: 800px) {
  .main-prompt-bucket{
    width: 83%;
  }
}


@media only screen and (max-width: 700px) {
  .main-prompt-bucket{
    width: 88%;
  }
}


@media only screen and (max-width: 650px) {
  .main-prompt-bucket{
    width: 94%;    
  }

  .quote-portal{
    width: 83%;
    margin: auto;
    padding-top: 0em;
    padding-bottom: .5em;    
  }

  .prompt-spiel{
    width: 75%;
  }

  .prompt-rating-box{
    width: 74%;
  }
}

@media only screen and (max-width: 500px) {
  .quote-portal{
    width: 100%;

  }
}

@media only screen and (max-width: 480px){
  .prompt-rating-box{
    width: 86%;
  }

  .prompt-spiel{
    width: 85%;
  }
}


.writing-episodes-title{
  font-size: 1.7em;
}


.prompt-thankyou{
  display: none;
}

.prompt-thankyou-show{
  display: block;
  color: grey;
  padding-bottom: 1em;
  font-size: 1.7em;
  font-family: 'Caveat', cursive; 
  text-align: center;
  height: 180px; 
}

.hide-rating-container{
  display: none;
}



.left-bracket{
  border-left: 2px solid grey;
  border-top: 2px solid grey;
  border-bottom: 2px solid grey;
  width: 6%;
  min-height: 20px;
  border-top-left-radius: 9px;
  border-bottom-left-radius: 9px;   
}



.right-bracket{
  border-right: 2px solid grey;
  border-top: 2px solid grey;
  border-bottom: 2px solid grey;
  width: 6%;
  min-height: 20px; 
  border-top-right-radius: 9px;
  border-bottom-right-radius: 9px;      
}

.writing-episode-section{
  text-align: center;
}

.prompt-author{
  text-align: right;
}

.writing-prompt-link{
  text-decoration: none;
  color: #6b6a6a;  
}

.tt-title{
  font-family: /*"Lucida Grande"*/ 'Alegreya Sans SC';
}

.faded-cubes{
  opacity: .8;
}

.main-container {
  width: 100%;
  display: flex;
  justify-content: center;
  /*justify-content: space-around;*/
  margin: 0 auto 78px auto;
  padding-top: 117px;
}

@media only screen and (max-width: 600px) {
  .main-container{
    padding-top: 105px;
  }
}

@media only screen and (max-width: 620px) {
  .main-container {
    padding-top: 45px;
  }
}

@media only screen and (max-width: 815px) {
  .main-container {
    max-width: 95% !important; 
  }
}




.column.left {
  display: block;
  color: black;
  font-family: "Trebuchet MS", Verdana, sans-serif;
  width: 15%;
  padding-left: 5%;
  padding-right: 5px;
}

@media only screen and (max-width: 1120px) {
  .column.left{
    width: 20%;
  }
}

@media only screen and (max-width: 900px) {
  .column.left{
    width: 25%;
  }
}

@media only screen and (max-width: 800px) {
  .column.left{
    padding-right: 1rem;
    padding-left: .5rem;
    margin-left: .5rem;
    margin-right: .5rem !important;
  }
}

@media only screen and (max-width: 700px) {
  .column.left{
    display: none;
  }
}



/*

.support-column {
  width: 80%;
}
*/



@media only screen and (max-width: 1120px) {
  .column.middle{
    width: 50%;
  }

}

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

  .sharing-is-a-gift-bar {
    width: 100%;
    /*justify-content: center; */
  /*  border-radius: 0px 0px 20px 20px;*/
  }

  .sharing-message {
    display: none;

  }

  .podcast-page-sharing-bar {
    border-radius: 0px 0px 2px 2px;
  }
}

@media only screen and (max-width: 900px) {
  .column.middle{
    width: 60%;
    padding-left: 1rem;
    padding-right: .25rem;
  }
}

@media only screen and (max-width: 700px) {
  .column.middle{
    width: 100%;
  }
}

@media only screen and (max-width: 470px) {
  .column.middle{
    border-left: none;

  }
}


/*Galaxy Phone*/
@media screen and (device-width: 360px) and (device-height: 640px) and (-webkit-device-pixel-ratio: 3) {
  .column.middle{
    min-width: 85%;
    padding-left: 1rem;
    padding-right: 1rem;
  }
}

/*iPhone 5/se*/
@media only screen and (max-device-width: 480px), only screen and (orientation: portrait) and (min-device-width: 560px) and (max-device-width: 1136px) and (-webkit-min-device-pixel-ratio: 2) {
    body {
      min-width: 95%;
    }

    .column.middle{
      min-width: 130%;
      padding-left: 1rem;
      padding-right: 1rem;
    }



}

@media only screen and (max-device-width: 480px), only screen and (orientation: landscape) and (min-device-width: 560px) and (max-device-width: 1136px) and (-webkit-min-device-pixel-ratio: 2) {
      .column.middle{
        min-width: 100%;   
        padding-left: 1rem;
        padding-right: 1rem;
    }

}

@media only screen and (device-width : 375px) and (device-height : 812px) and (-webkit-device-pixel-ratio : 3) {
  .main-container{
    max-width: 95%;
  }

  .column.middle {
    min-width: 354px;
  }
}


/*Ipad*/
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 1){
    .main-container{
    max-width: 58% !important;
  }

  .sharing-is-a-gift-bar {
    width: 100%;
    justify-content: space-between;
    border-radius: 0px 0px 20px 20px;
  }

  .sharing-message {
      display: block;
  }
}

@media only screen 
  and (min-device-width: 1024px) 
  and (max-device-width: 1366px) 
  and (-webkit-min-device-pixel-ratio: 1.5) {
    .sharing-message {
      padding-right: 19rem;
    }
}

.column.right {
  width: 15%;
  flex-direction: column;
  padding-right: 5%;
}

.date{
  font-style: italic;
  margin-top: 10px;
  text-align: left;
  font-size: .7rem;
}

.podcast-date {
  font-style: italic;
  text-align: left;
  font-size: .5rem;
  margin: 0;
}



.column.left{
  margin-right: 2rem;
}

@media only screen and (max-width: 1120px){
  .article {
    font-size: .7rem;
  }

  .article h3 {
    font-size: .7rem;
  }
}


.image-box {
  display: block;
  font-family: Georgia;
  font-weight: bold;
  font-size: 15px;
  color: black;
  text-align: center;
}

.podcast-logo {
    padding-top: 1.3rem;
    opacity: .81;
    max-width: 95%;
    text-align: right;
    padding-left: 2.9rem;
}

.podcast-logo:hover {
  opacity: .5;
}

.image-box.main{
  display: flex;
  font-size: 15px;
  text-align: left;
  width: 100%;
  margin: 0;
  background-size: 100% 100%;
  margin-right: 2px;
  margin-top: 25px;
}

.image-box.main .image-scale img {
  width: 100%;
}


.article h3 {
  font-family: "Trebuchet MS", Verdana, sans-serif;
  letter-spacing: 2px;
  word-spacing: 5px;
  font-size: 20px;
  text-align: right;
  margin-bottom: 25px;
  padding-top: 2rem;
  opacity: .3;
}

@media only screen and (max-width: 815px){
  .article h3{
    font-size: .7rem !important;
  }
}

.article p {
  line-height: 20px;
  letter-spacing: 2px;
}

.justify {
  text-align: right;
  font-size: .7rem;
}

.article-box {
  display: inline-block;
  padding-bottom: .25rem;

}

.article-box.pursuit-essay {
  margin-top: 5rem;
  margin-left: 20%;
  margin-right: 20%;
}

.article-box.pursuit-essay h2, h4, {
  text-align: center;
}

.article-box.pursuit-essay.date{
  text-align: center;
}

.column.left .article-box {
  border-bottom: none;
}

.article-box h2 {
  margin-bottom: 0;
  color: rgb(77,77,77);
}

.grouped-articles {
  display: flex;
  justify-content: space-between;
}

.article-box.grouped{
  width: 300px;
}

.article-partition{
  text-align: center;
}

.subscribe-container-border{
  padding-bottom: 2em;
}

.subscribe-container {
  width: 100%;
  margin: 0;
  font-size: .5rem;
  /*margin-right: 20px;*/
}

.subscribe{
  font-size: 2rem;
  color: white;
  margin-top: 0px;
  padding: 2px 5px;
  font-family: 'Quicksand', sans-serif;
}

/**
.subscribe button:focus {outline:0;}
**/
.subscribe-container {
  text-align: center;
  cursor: pointer;
  width: 100%;
  font-size: .6rem;
  border-radius: 30px;
  border: 1px solid lightgray;
  display: table;
  vertical-align: middle;
  background-color: #ffffff;  
  -webkit-transition: /*color 750ms ease-in-out,*/ background-color 1s ;
  -moz-transition:/* color 750ms ease-in-out, */background-color 1s ;
  -o-transition:/* color 750ms ease-in-out,*/ background-color 1s ;
  transition:/* color 750ms ease-in-out,*/ background-color 1s ;

}



.subscribe-container h2 {
  letter-spacing: 3px;
  color: #c3c3c3;
  margin-top: 0px;
  padding: 2px 5px;
  font-family: 'Quicksand', sans-serif;
  -webkit-transition: /*color 750ms ease-in-out,*/ color 1s ;
  -moz-transition:/* color 750ms ease-in-out, */color 1s ;
  -o-transition:/* color 750ms ease-in-out,*/ color 1s ;
  transition:/* color 750ms ease-in-out,*/ color 1s ;   

}

.subscribe-container:hover{
  background-color: #d0d0d0;

}

.subscribe-container:hover {
  /*background-color: #c44646;
  -webkit-transition:  background-color 1ms ;
  -moz-transition:background-color 1ms ;
  -o-transition: background-color 1ms ;
  transition: background-color 1ms ;*/

}

.subscribe-container h2:hover{
  color: white; 
}

.subscribe-container .subscribe-content {
  display:none;
}

.subscriber-message {
  text-align: center;
  margin: 0 auto;
  width: 80%;
  padding-top: 1rem;
  padding-bottom: 1rem;
  font-style: italic;
}

.subscribe-submit-btn{
  color: #a2a2a2;
}

::-webkit-input-placeholder { /* Edge */
  color: #a2a2a2;
}

:-ms-input-placeholder { /* Internet Explorer */
  color: #a2a2a2;
}

::placeholder {
  color: #a2a2a2;
}

.subscribe-page{
  border: none;
}

/**** Radio Buttons *****/



.radio-buttons {
  font-family: 'Open Sans', sans-serif;
  text-align: left;
  font-size: .75rem;
}
.radio-buttons ul {
  list-style-type: none;
  li {
    display:block;
    width: 100%;
    height: 30px;
  }
}

/*checkbox*/
.checkbox {
    display: none;
}
.label:before {
  content: "";
  margin: 0 .5em 0 0;
  float: left;
  width: 1em;
  height: 1em;
  background: #fff;
  color: #fff;
  border: 3px solid #e5e5e5;
  border-radius: 3px;
  transition: all .3s ease;
}

.checkbox:checked + .label:before {
  font-family: "FontAwesome";
  content: "\f00c";
  color: #fff;
  background-color: lighten(#2295ff, 20%);
  border: 3px solid #2295ff;
}

/* Radio Button Styles */
.radio { margin-bottom:15px;
  position:relative;
  width:auto;
}

.radio label {
  background:#e5e5e5;
  border: 3px solid #e5e5e5;
  top: -4px;
  border-radius:100%;
  cursor:pointer;
  height:20px;
  left:0;
  position:absolute;
  width:20px;
}

.radio label:after {
background-color: lighten(#2295ff, 20%);


  border: 3px solid #2295ff;
  border-radius:100%;
  content:'';
  height:14px;
  left:0px;
  opacity:0;
  position:absolute;
  top:0px;
  transition:opacity .1s ease-in;
  width:14px;
}

.radio label:hover::after {
  opacity:0.2;
}
.radio input[type="radio"]:checked + label:after {
  opacity:1;
}

span.radio-label {
  margin-left: 10px;
  font-family: 'Quicksand', sans-serif;
  font-weight: bold;
}@import url(https://fonts.googleapis.com/css?family=Open+Sans:400italic,400,300,600,700);
$font-family: 'Quicksand', sans-serif !default;

.radio-buttons {
  font-family: $font-family;
}
.radio-buttons ul {
  padding-left: 20px;
  list-style-type: none;
  li {
    display:block;
    width: 100%;
    height: 30px;
  }
}

/*checkbox*/
.checkbox {
    display: none;
}
.label:before {
  content: "";
  margin: 0 .5em 0 0;
  float: left;
  width: 1em;
  height: 1em;
  background: #fff;
  color: #fff;
  border: 3px solid #e5e5e5;
  border-radius: 3px;
  transition: all .3s ease;
}

.checkbox:checked + .label:before {
  font-family: "FontAwesome";
  content: "\f00c";
  color: #fff;
  background-color: lighten(#2295ff, 20%);
  border: 3px solid #2295ff;
}

/* Radio Button Styles */
.radio { margin-bottom:15px;
  position:relative;
  width:auto;
}

.radio label {
  background:#e5e5e5;
  border: 3px solid #e5e5e5;
  top: -4px;
  border-radius:100%;
  cursor:pointer;
  height:20px;
  left:0;
  position:absolute;
  width:20px;
}

.radio label:after {
background-color: lighten(#e37a3f, 20%);


  border: 3px solid #e37a3f;
  border-radius:100%;
  content:'';
  height:14px;
  left:0px;
  opacity:0;
  position:absolute;
  top:0px;
  transition:opacity .1s ease-in;
  width:14px;
}

.radio label:hover::after {
  opacity:0.2;
}
.radio input[type="radio"]:checked + label:after {
  opacity:1;
}

span.radio-label {
  margin-left: 10px;
}  
/**** Radio Buttons End *****/

input.subscribe-button {
  margin-top: 1rem;
  margin-left: auto;
  margin-right: auto;
  padding-left: 23%;
  padding-right: 23%;
}

.lp-archive-spacer{
  height: 27px;
}

@keyframes blinker {
  50% {
    opacity: 0.2;
  }
}

.num-stories{
  color: rgba(100, 25, 120, 0.67);
  animation: blinker 2s linear infinite;
}

.what-blurb {
  margin-bottom: 1.5rem;
  color: #313131;
}

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
    .what-blurb{
    font-size: .5rem;
  }
}



#email{
  width: 75%;
  border-radius: 5px;
  border: 1px solid #cccccc;    
}

#name {
  width: 75%;
  margin-bottom: .5rem;
  border-radius: 5px;
  border: 1px solid #cccccc;  
}

#signupform {
    padding-bottom: 1rem;
}

.most-popular {
  flex-direction: column;
  text-align: center;
  padding-top: 2em;
  /*margin-right: 20px;*/
}

.most_pop_page {
  text-align: left;
}

.most-popular h3, .table-leg-title {
  font-family: "Lucida Console";
  font-family: 'Alegreya Sans SC';
  width: 100%;
  letter-spacing: 7px;
  word-spacing: 5px;
  font-size: 16px;
  text-align: center;
  margin-bottom: 20px;
  opacity: .5;
  text-decoration: none;
}

.table-leg-title{
  color:#585759;
  text-align: center;
}


.most-popular p {
  margin: 0;
  padding: 11px;
  text-align: right;
  /*background-color: WhiteSmoke;*/
  font-family: Verdana;
  font-size: 12px;
  color: DimGray;
}

.table-leg {
  margin: 0;
  border: 2px solid dimgrey;
  border-radius: 0px;
  padding: 11px;
  text-align: left;
  background-color: WhiteSmoke;
  font-family: Verdana;
  font-size: 1rem;
  color: DimGray;
  /*margin-right: 20px;*/
  text-align: center;
  -webkit-appearance: button;
  -moz-appearance: button;
  appearance: button;
  text-decoration: none;
  margin-top: 3.5rem;
  margin-bottom: 3.5rem;
}

.tableleg_resize {
  width: 50%;
  opacity: .7;
}

.table-leg-subtitle{
  color: DimGray;
  font-size: .7rem;
  text-align: center;
  margin: 0 auto;
  text-decoration: none;
}

footer {
  position: absolute;
  width: 100%;
  height: 325px;
  align-items: center;
  justify-content: center;
  text-align: center;
  display: flex;
  flex-direction: column;

  background-color: white;
  margin: 0 auto;
  font-family: Verdana;
  font-size: 12px;
  z-index: 1;
  bottom: -300px;
}


.footer-bar{
    height: 1%;
    width: 70%;
    border-top: 2px solid #b3b3b3;
    /* margin: auto; */
    margin-left: auto;
    margin-right: auto;
    padding-bottom: 6em;
}


.title-and-nav {
  display: block;
}

.z-footer {
  display: inline-block;
  padding-right: 15px;
  align-items: center;
  font-family: Georgia;
  font-size:16px;
  font-weight: bold;
  color: white;
  border-right: 1px solid #6d6d6d;
}

.z-footer a {
  color: #676767;
}


footer nav {
  margin-left: 8px;
  display: inline-block;
  padding: 0;
}

/***************************Contact Page*****************************/

.contact-form {
  width: 100%;
}

/***************************Support Page*****************************/


#support-message-box{
    position: relative;
    text-align: center;
    height: 10em;
}




.animation-item{
  position: absolute;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  left: 0;
  right: 0; 
}

.support-1{
  font-size: 1.7em;


}


.support-2{
  font-size: 1.3em;
  font-style: italic;
}


.support-3{
  font-style: none;

}


.support-4{
  font-size: 1em;


}

.support-5{

}



.support-eye{
  text-align: center;
  margin-top: 5em;
}

.support-eye-img{
  width: 31%;
  opacity: .8;
}

.support-image {
  opacity: .7;
  padding-top: 1.25rem;
}

.support-header{
  font-style: bold;
  margin-bottom: 1.25rem!important;
}

.may-not{
    height: 21em;
    padding-top: 2em;
    padding-bottom: .5em;
    line-height: 2em;
    font-family: /*"Lucida Grande"*/ 'Alegreya Sans SC';
    text-align: center;
}


@media only screen and (max-width: 700px){
  .may-not{
    height: 27em;
  }
}


@media only screen and (max-width: 500px){
  .may-not{
    height: 31em;
  }
}


.radio-support-options{
  display: grid;
  /*border-left: 1px solid lightgrey;
  border-right: 1px solid lightgrey;*/
  margin-bottom: .5em;  
}

.landing-support{
  text-align: center;
  font-size: 1em;
}

.support-btn-landing{
  max-width: 55%;
  text-align: center;
  margin: auto;
}

.center-support-landing-btn{
  text-align: center;
}

label {
  box-sizing: border-box;
  cursor: pointer;
  opacity: .5;
}

input[type="radio"]{
  visibility: hidden;
  width: 0%;
  height: 0%;
}

input[type="radio"]:active ~ label{
  opacity: 1
}

input[type="radio"]:checked ~ label {
  opacity: 1;
  color: #4F007C;

}

label:hover {
  color: #4F007C;
}

.support-option-container{
  margin-bottom: 1.2em;
}

.heart{
  font-family: 'Apple SD Gothic Neo';
  color: rgb(73, 76, 76) !important;
  -webkit-text-fill-color: black !important;
  -webkit-appearance: none;
}

.heart {
    font-family: Georgia;
}



.support-option{
  padding-top: .2em;
  padding-bottom: .2em;
  font-size: 1.4em;
  border-radius: 22px;
  width: 59%;
  /*background-color: lightgrey;*/
  margin: auto;
  margin-bottom: .4em;
}

.support-option-landing{
  font-size: 1em;
}

.subscribe-field {
  display: block;
  text-align: center;
  margin: auto;
  margin-top: 3rem;
}

.support-table {
  text-align: center;
  margin: auto;
  width: 100%;
}

.support-spacer-down{
  margin-bottom: 2rem !important;
}

.support-spacer-up-2 {
  margin-top: .45rem !important;
}

.Support-headline {
  margin-bottom: 1.25rem !important;
}

.support-spacer-up {
  margin-top: 1.9rem !important;
}

.support-spacer {
  margin-bottom: .5rem;
}

.custom-support-button {

  /*border: 1px solid lightgrey;
  border-radius: 15px;*/
  width: 60%;
  background-color: lightgrey;
}

.custom-support-button h4 {
  margin: 0 0;
  opacity: .7
}

.custom-support-button:hover {
  opacity: .7;
}

.support-btn-resize {
  max-width: 75%;
}

.support-box {
  border: 1px lightgrey solid;
}

.support-box-landing{
    padding-bottom: 3em;
}

.support-box-landing-mobile{
  display: none;
}



.support-box-landing-title{
  /*font-family: 'Alegreya Sans SC';*/
  width: 100%;
  letter-spacing: 5px;
  word-spacing: -5px;
  font-size: 16px;
  text-align: center;
  text-decoration: none;  
  color: #b1b1b1;
}

.support-box-title {
  text-align: left;
  opacity: .7;
}

.support-box-title h5 {
  padding-left: 2rem;
}

.one-time-support-box {
  width: 80%;
  display: inline-flex;
  justify-content: space-between;
  /*padding-left: 3rem;
  padding-right: 1rem;*/
  margin-bottom: 2rem;
}

.paypal-btn {
  color: white;
  background-color: lightgrey;
  border-radius: 25px;
  width: 25%;
}

.paypal-btn h3 {
  padding: 15px 0px 15px 0px;
}

.paypal-btn-support input{
 max-height: 60px;
 width: auto; 
}

.paypal-btn-support input:hover{
  opacity: .7;
}

.paypal-btn-support {
  display: block;
  vertical-align: center;
 /* min-width: 50%;*/
}



.one-time-support-box {
  display: inline-flex;
  justify-content: space-around;
 /* width: 60%; */
}




.bit-btn-one-time-support img{
  height: auto;
  padding-top: 4px;
  padding-right: 5px;
}

.bit-btn-one-time-support img:hover {
  opacity: .7;
}


.bit-btn-one-time-support img {
  /*max-width: 15%;*/
  max-height: 54px;
  padding: .25rem 0 .25rem 0;
}
 

.free-bit-recieve img{
  max-height: 100% !important;
}


.bit-btn-one-time-support img:hover {
  opacity: .7;
}


.support-select-bar {
  width: 61%;
  margin-right: 1rem;
}

.bit-btn-one-time-support {

}

.theeye{
    text-align: center;
    padding-right: 1.2em;
    padding-bottom: 2em;
}

.eye{
    max-width: 70%;
    margin: 0;
    text-align: center;
    opacity: .64;
}

.cycle{
  text-align: center;
  opacity: .6;
  font-size: .3em;
}

.feed-title{
  color: grey;
  font-size: 1.3em;
}

.feed{
  color: darkgrey;
  font-size: .75em;
}


.feed-container{
  text-align: center;
}


@media only screen and (max-width: 700px){
  .support-box-landing-mobile {
    display: block;
    color: #737373;
    background-color: #e6e6e6;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
    padding-left: 1em;
    padding-right: 1em;
    padding-bottom: 1em;
  }

  .call-for-donation-mobile{

  }

  .support-box-landing-mobile h5{
    font-weight: 100;
  }

  .radio-support-options-mobile{
    display: inline-block;

  }

  .support-mobile-montly{

  }

  .landing-support{
    text-align: left;
  }

  .support-option-container{
    margin-bottom: .1em;
  }



  .support-inner-container-mobile{
    display: inline-flex;
    justify-content: space-between;
  }


  .support-box-title{
    font-weight: 100;
  }

  .support-box-landing-title{
    width: 100%;
    padding-top: 1em;
    margin-top: 13px;
    border-bottom: 1px solid #696969;
    margin-left: auto;
    margin-right: auto;
    padding-bottom: 2em;
    color: #a0a0a0;
  }

  .support-mobile-monthly{
    width: 45%;
    float: left;
  }

  .support-mobile-one-time{
    width: 45%;
    float: right;
  }

  .donation-options-mobile{
    text-align: left;
    width: 100%;
    border-bottom: 1px solid #696969;
    margin-bottom: 1em;    
  }
  .monthly-mobile-title{

  }

  .tip-jar-title{

  }

  label{
    opacity: 1;
  }
 /**
  .support-btn-landing-mobile {
    max-width: 45%;
    text-align: center;
    margin: auto;
    -webkit-appearance: textfield;
    border-radius: 3px;
    border-color: #bfbfbf;
    color: #424242;
    background-color: #bfbfbf;
  }


  .support-btn-landing-mobile:hover {
    border-color: #af69f0;
    background-color: #af69f0;
  }



   .support-btn-landing-mobile{
    max-width: 22%;
    text-align: center;
    margin: auto;
  }**/

  .support-btn-landing-mobile{
  display: block;
  vertical-align: center;
  max-width: 32%;
  }

  .support-btn-landing-mobile:hover{
    opacity: .7;
  }

  .tip-jar-btn{
    max-width: 32%;
  }

  .heart-mobile{
    font-family: Georgia;
  }

  .center-support-landing-btn{
    text-align: left;
    width: 100%;
    padding-left: .5em;
    padding-top: 1em;
  }
}

@media only screen and (max-width: 350px){
  .support-btn-landing-mobile {
    max-width: 60%;
  }
}

/***********/


.container {
    width:100%;
    border:1px solid #d3d3d3;
}
.container div {
    width:100%;
}
.container .header {
    background-color:#d3d3d3;
    padding: 2px;
    cursor: pointer;
    font-weight: bold;
}
.container .content {
    display: none;
    padding : 5px;
}



/****************** CONTACT PAGE *******************/

#n, #e, #m {
  width: 100%;
  margin-bottom: .5rem;
}

@media only screen and (max-width: 600px){
  #n, #e, #m {
    width: 70%;
    margin: auto;
  }
}

@media only screen and (max-width: 600px){
  #my_form {
    text-align: center;
  }
}

#n:focus,
#e:focus,
#m:focus {
  outline:none;
}

#m{
  border: 1px solid lightgrey;
}

#contact_mybtn {
  text-align: center;
  width: 35%;
  height: 1.5rem;
  margin: auto;
  float: right;
  border-radius: 10px;
  border: 1px solid lightgrey;
  color: white;
  background-color: #9E9E9E;
  margin-top: 1.5rem;
}



@media only screen and (max-width: 600px){
  #contact_mybtn {
  width: 50%;
  margin-right: 15%;
  }
}

#contact_mybtn:focus {
  outline: none;
}

#contact_mybtn:active {
  background-color: lightgrey;
}


.contact {
  text-align: center;
  font-style: italic;
  color: grey;
}




/***********/

/** logo color: #4d4d4d  **/


/*******************  Podcaster ******************/

/*background-image: url('../images/podcast_symbol.png');*/
.audio-player {
  border: 2px solid #dfdfdf;
  border-radius: 2px 2px 0px 0px;
  text-align: center;
  display: flex;
  flex-flow: row;
  margin: 0.2rem 0 0 0;
}


.audio-player .album-image {
  min-height: 40px;
  width: 110px;
  background-size: cover;
}
.audio-player .player-controls {
  align-items: center;
  justify-content: center;
  margin-top: 1.25rem;
  flex: 3;
}
.audio-player .player-controls progress {
  width: 80%;
}
.audio-player .player-controls progress[value] {
  -webkit-appearance: none;
  appearance: none;
  background-color: white;
  color: blue;
  height: 5px;
}
.audio-player .player-controls progress[value]::-webkit-progress-bar {
  background-color: white;
  border-radius: 2px;
  border: 1px solid grey;
  color: blue;
}
.audio-player .player-controls progress::-webkit-progress-value {
  background-color: grey;
}
/*.audio-player .player-controls p {
 font-size: .6rem;
 }*/
.audio-player .play-btn {
  background-image: url('../images/play-button2.png');
  background-size: cover;
  width: 50px;
  height: 50px;
  margin: 1rem 0 1rem 1rem;
}

@media screen and (device-width: 360px) and (device-height: 640px) and (-webkit-device-pixel-ratio: 3) {
  .play-btn {
    width: 35px !important;
    height: 35px !important;   
    margin-top: 2rem !important; 
  }
}
.audio-player .play-btn:hover {
  opacity: 0.7;
}
.audio-player .play-btn.pause {
  background-image: url('../images/pause-button.png');
}
.audio-player .podcast_title {
  font-size: 0.2rem;
}
.podcast_symbol {
  display: block;
  max-height: 40px;
  width: auto;
  margin-top: 1.25rem;
  margin-right: 1rem;
  opacity: 0.85;
}

.podcast_symbol_link:hover{
  opacity: .7;
}

@media screen and (device-width: 360px) and (device-height: 640px) and (-webkit-device-pixel-ratio: 3){
  .podcast_symbol{
    max-height: 30px;
    width: auto;
    margin-top: 2rem;
  }
}

/*iphone 5/se*/
@media only screen and (max-device-width: 480px), only screen and (min-device-width: 560px) and (max-device-width: 1136px) and (-webkit-min-device-pixel-ratio: 2){
    .podcast_symbol{
      max-height: 30px;
      width: auto;
      margin-top: 2rem;
  }

  .play-btn {
    width: 35px !important;
    height: 35px !important;   
    margin-top: 2rem !important; 
  }  
}



.small-paragraph, .podcast-title, .episode-title {
  margin-top: 0;
  margin-bottom: 0rem;
  margin-left: .1rem;
  margin-right: .1rem;
  line-height: .8rem;
  font-size: 0.6rem;
}
.episode-title {
  font-size: 0.85rem;
}




/*****************Article Specific Modifications for Images******************/

img#rubix-cube.article-image{
  display: block;
  text-align: center;
  width: 25%;
  height: 25%;
  margin-left: 39%;
  height: auto;
  opacity: .7;
}


@media only screen and (max-width: 600px) {
  img#rubix-cube.article-image {
    margin-left: 35%;
    width:30%;
    width: 30%;
  }
}


.article-image{
  display: block;
  width: 100%;
  text-align: center;
  margin: auto;
}

/*************************End of Article Specific Modifcations for Images ****/


.comment-and-itunes-link {
  display: flex;
  justify-content: space-between;
  padding-top: .3em;
  padding-bottom: .15em;
}


.comment{
  opacity: .8;
  font-style: italic;
  color: grey;
}




/*************************Newsletter*****************************************/

.newsletter{
  line-height: 1.5;
}


/*********************Bookstore Stuff ********************/

.book-banner{
  font-size: 1.2 em;
  position: relative;
  margin-top: 3em;
padding: 5px;
background-color: rgba(11, 11, 11, 0.72);
border-radius: 3px;
text-align: center;
border: 3px solid rgb(223, 223, 223);
font-family: 'Alegreya Sans SC';
color: white;

}

.book-banner span{
  color: #87def5;
}

.book-banner a {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}
