/** Load Google Fonts **/
/*@import url(https://fonts.googleapis.com/css?family=PT Serif:400,400italic,700|Lato:400,300);*/

/** styling header titles **/
#content.reflection-stories h1, #content.reflection-stories h2, #content.reflection-stories h3, #content.reflection-stories h4, #content.reflection-stories h5, #content.reflection-stories h6 {
    font-family: "Montserrat", Georgia, serif;
    font-weight: 900;
}
#content.reflection-stories h1 {
    color: #E43326;
    font-size: 3.125rem;
    line-height: 2.8125rem;
	/* font-size: 72px;
    line-height: 140%; */
}
#content.reflection-stories.story h1, #content.reflection-stories.story h2, #content.reflection-stories.story h3 { color: #232627; }
#content.reflection-stories.story h2.story-subtitle {  font-weight: 400; font-size: 36px; }
.rs-overview {
    padding: 20px;
    background: #EBEBEB;
}
.rs-overview.link {
    font-family: "PT Serif", Georgia, serif;
    font-weight: 700;
    color: #E43326;
    font-size: 36px;
    padding: 0px;
    line-height: 110%;
    background: transparent;
}

.reflection-stories h1 ~ p.intro {
    border-left: 15px solid black;
    padding-left: 15px;
}

.reflection-story-panel {
    background: #EBEBEB;
    padding: 35px;
    position: relative;
    transition: all 0.6s ease 0s;

}
.reflection-story-panel .rs-taxonomy {
    font-family: "PT Serif", Georgia, serif;
    font-size: 14px;
    text-transform: uppercase;
    margin: -5px auto 25px;
    font-weight: 700;
}
.reflection-story-panel .links {
    position: absolute;
    bottom: 0;
    right: 35px;
    width: 100%;
    height: 55px;
}
.reflection-story-panel .links img { display: none; width: 0px; height: 0px; }
.reflection-story-panel .links a {
    font-family: "PT Serif", Georgia, serif;
    font-size: 14px;
    text-transform: uppercase;
    color: white;
    float: right;
    display: inline-block;
    padding: 0px 15px;
}
.reflection-story-panel .sub-content {
    display: none;
}

.reflection-story-panel:hover {
    background: #E43326;
}
.reflection-story-panel:hover header {
    display: none;
}
.reflection-story-panel:hover .sub-content, .reflection-story-panel:hover .sub-content p a {
    display: block;
    font-family: "PT Serif", Georgia, serif;
    color: white;
    font-weight: 700;
    font-size: 22px;
    line-height: 120%;
    text-decoration: none;
}
.reflection-story-panel:hover .rs-taxonomy {
  color: white;
}

.reflection-story-panel .rs-number{
    content-box: border-box;
    position: absolute;
    background: white;
    color: black;
    top: 0px;
    right: 0px;
    width: 25px;
    height: 25px;
    padding: 25px;
    text-align: center;
    font-size: 18px;
    line-height: 0;
    font-family: "PT Serif", Georgia, serif;
    font-weight: 700;
}

/** Reflection story page **/
.bttn {
    display: inline-block; clear: both; padding: 15px 25px; margin: 30px 0px; border: #E43326 3px solid; color: #E43326; font-family: "PT Serif", Georgia, serif;
}
.bttn-sm img {
    display: none; font-size: 85%; padding: 10px 15px;
}
.bttn-sm:hover a,  .bttn-sm a:hover { /* text-decoration: none; */ }
#content.reflection-stories p.intro .button { margin-bottom: 0px; }
.subtitle-taxonomy {
    font-family: 'Montserrat', Arial, sans-serif;
        text-transform: uppercase;
      font-size: 14px;
}
.rs-nav, .bttn-sm {
  font-family: 'Montserrat', Arial, sans-serif;
  text-transform: uppercase;
  font-size: 14px;
  font-weight: 700;
  margin-bottom: 20px;
}
.subtitle-taxonomy .rs-red {
    font-variant: small-caps;
}
.subtitle-taxonomy .taxonomy { font-weight: bold;  text-transform: uppercase; }

#content.reflection-stories h2 {
    font-size: 24px;
}
#content.reflection-stories .container#sub-title {
    padding-top: 0px;
    padding-bottom: 0px;
}
#content.reflection-stories .container#sub-title h2 {
    margin-bottom: 0px;
}
.reflection-stories h3.context {
    font-variant: small-caps;
    color: #E43326;
    font-size: 24px;
}
.reflection-stories .box {
    margin-top: 1.5em;
    font-family: "PT Serif", Georgia, serif;
    font-style: italic;
    position: relative;
    border: none;
    border-top: 5px solid black;
    border-bottom: 5px solid black;
    padding: 1em 2em;
    background: none;
}
.reflection-stories .box:before {
  content: " ";
  position: absolute;
  z-index: -1;
  top: 2px;
  left: 0px;
  right: 0px;
  bottom: 2px;
  border-top: 2px solid black;
  border-bottom: 2px solid black;
}
#content.reflection-stories blockquote:before { display: none; }
#content.reflection-stories blockquote {
    padding-left: 20%;
    background: transparent;
    font-family: "PT Serif", Georgia, serif;
    font-style: italic;
    text-align: left;
    font-size: 115%;
}

.reflection-stories  table  {
    position: relative;
    border: none;
    border-bottom: 5px solid #E43326;
    border-top: 5px solid black;
    margin: 1em 0em;
    padding: 1em;
    background: none;
}
.reflection-stories  table:before  {
    content: " ";
    display: block;
    position: absolute;
    z-index: -1;
    top: 2px;
    left: 0px;
    right: 0px;
    bottom: 2px;

    border-bottom: 1px solid #E43326;
    border-top: 1px solid black;
}
.reflection-stories  table thead th {
    margin: 5px 0px;
    border: none;
    font-family: "PT Serif", Georgia, serif;
    text-transform: capitalize;
    font-weight: normal;
    font-variant: small-caps;
    background: #E43326;
    color: white;
}
.reflection-stories  table tbody td {
    margin: 5px 0px;
    border: none;
    font-family: "PT Serif", Georgia, serif;
    text-transform: capitalize;
    font-weight: normal;
    font-variant: small-caps;
    background: none;
    color: black;
}

.reflection-stories .related-reflection-stories.box {
    margin-top: 1.5em;
    font-family: "PT Serif", Georgia, serif;
    position: relative;
    padding: 1em 2em;
    font-style: normal;
    /* border: 1px solid #E43326; */
    /* background: #EBEBEB;*/
}

#content .related-reflection-stories.box h2 {
    font-size: 24px;
    font-weight: 400;
  /*  border-bottom: 3px solid #E43326;*/
}
#content .related-reflection-stories.box h2 span {
    font-weight: 700;
    color: #E43326;
}

.reflection-stories .box strong {
    color: #E43326; font-weight: 700; font-style: normal; font-variant: small-caps;
}
.reflection-stories p ~ h3  {
    margin: 1.5em auto;
    color: #E43326;
    font-size: 24px;
    font-weight: normal;
    font-variant: small-caps;
}
.reflection-stories.story .col.grid2.omega {
    font-family: "PT Serif", Georgia, serif;
    font-variant: small-caps;
    font-size: 105%;
    font-weight: 700;
}
/** Basic styles and some helpers **/
body #content.reflection-stories {
    font-family: "Lato", Arial, sans-serif;
    font-weight: 300;
}
.rs-gray    { color: #232627; }
.rs-red     { color: #E43326; }
.not-real   { color: red; }
body #content.reflection-stories strong {
    font-family: "PT Serif", Georgia, serif;
    font-weight: 700;
}

/** bubbles! **/
.rs-bubble-wrap {
    position: relative;
    display: inline-block;
    transition: all 0.6s ease 0s;
}
.rs-bubble-indicator {
    font-weight: bold; color: #E43326; cursor: pointer;
}
.rs-bubble {
    font-family: "PT Serif", Georgia, serif;
    /* display: none; */
    width: 320px;
    min-height: 80px;
    position: absolute;
    top: -10000px;
    left: -10000px;
    background: #ebebeb;
    padding: 15px;
}
.rs-bubble .rs-bubble-close {
    color: red; text-align: center; font-weight: bold; width: 10%; float: right; clear: both; cursor: pointer;
}
.rs-bubble .rs-bubble-close:hover {
    background: #E43326;
    color: white;
}
.rs-bubble hr {
    margin: 10px 0px;
}

 /*.rs-bubble-wrap:hover .rs-bubble { display: block;   } */


/** Some media queries **/
/** MOBILE FIRST **/
.reflection-stories-archive .rs-box .reflection-story-panel {
    height: 280px;
    width: 280px;
    box-sizing: border-box;
    display: inline-block;
    margin: 20px auto;
}

@media (min-width: 768px) {
    .reflection-stories-archive .rs-box,  .reflection-stories-archive .rs-box  .reflection-story-panel {
        height: 340px;
        width: 340px;
        box-sizing: border-box;
        display: block;
        float: left;
        margin: 20px 0px;
    }
    .reflection-stories-archive .rs-box:nth-child(2n + 1)  {
        margin-right: 40px;
    }

}

@media (min-width: 1024px) {
    .reflection-stories-archive .rs-box,  .reflection-stories-archive .rs-box .reflection-story-panel {
        height: 300px;
        width: 300px;
        box-sizing: border-box;
        display: block;
        float: left;
    }
    .reflection-stories-archive .rs-box {
        margin: 20px 15px;
    }
    .reflection-stories-archive .rs-box:nth-child(3n)  {
        margin-right: 0px !important;
        margin-left: 15px !important;
    }
    .reflection-stories-archive .rs-box:nth-child(2n + 1)  {
        margin-right: 15px;
    }
    .reflection-stories-archive .rs-box:nth-child(3n + 1)  {
        margin-left: 0px !important;
        margin-right: 15px;
    }

}