body{
    font-family:'Roboto', sans-serif;
    font-style: normal;
    font-weight: 300;
    color:#333;
    background: #fff;
}
i{
  font-family:'Roboto', sans-serif; 
  font-weight: 300;
  font-style: italic;
}
:focus {
  outline: none;
}
h1, h2, h3, h3, h4{
  font-family:'Roboto', sans-serif;
}
h1{
  font-weight:800;
  font-size:2.25rem;
  line-height:2.5rem;
  margin-bottom:1rem;
}
h2{
  font-size: 2rem;
  line-height: 2.25rem;
  font-weight:800;
}
.recent-articles h2 {
    text-transform: uppercase;
    font-size: 1.5rem;
}
h3{
  text-transform:uppercase;
  font-weight:600;
  margin:1.75rem 0 .25rem 0;
  line-height: 1.5rem;
  font-size: 1.5rem;
}
.inner-page h3 {
    line-height: 2rem;
}
h4{
  font-weight:600;
}
.intro{
  padding-top:2rem;
  padding-bottom:2rem;
}
.intro p {
    color: #989898;
    font-size: 1rem;
    font-weight: 400;
}
.quote {
    margin-top: 2rem;
    margin-bottom: 5rem;
}
.quote p {
    font-size: 1.25rem;
    font-style: italic;
    line-height: 1.75rem;
    color: #000;
    padding: 1rem;
}
a, a:focus, a:hover {
  color: #107070;
  border-bottom: 1px dotted #107070;
}
li {
    font-size: 1rem;
}
.gallery{
  margin-top: 1rem;
}
.thumbnail {
    border: none;
    box-shadow: none;
}
.button.hollow {
    border: 1px solid #107070;
    color: #107070;
    font-weight: 500;
    text-transform: uppercase;
}
.button.hollow:focus, .button.hollow:hover {
    border-color: #107070;
    color: #fff;
    background: #107070;
}
.inner-page {
    margin-bottom: 6rem;
} 
span.subtext {
    font-size: 1.15rem;
}
hr{
    border-bottom: 1px solid #e7e7e7;
}
.inner-page hr {
    margin: 3rem auto;
}
.inner-page .intro {
    padding-top: 2rem;
    padding-bottom: 0;
}
.contact h4{
    font-size: 1rem;
    line-height: 1.2rem;
    margin-bottom: .25rem;
}
p.contact {
    margin-bottom: .5rem;
}
.caption {
    color: #767676;
    font-size: .8rem;
    padding-top: 1rem;
}
.focus-areas {
  margin-top: 1rem;
  margin-bottom: 2rem;
}
.fa-rss {
    content: 'f09e';
    font: normal normal normal 15px/1 FontAwesome;
    padding-right: .2rem;
    color: #107070;
    position: relative;
    font-size: 1.2rem;
    left: -.3rem;
}
.no-js .top-bar {
    display: none;
}
[data-sticky] {
  width: 100%;
}
.grid-container{
  max-width:98rem;
}
.sticky-container {
  z-index: 5;
}
.title-bar .menu-icon {
    right: 1rem;
    position: absolute;
}
.title-bar-title{
	width: 10rem;
}
.title-bar-title a, .title-bar-title a:hover, .title-bar-title a:focus{
  border-bottom: none;
}
.title-bar, .top-bar{
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.2);
    background:#fff;
    padding: 1rem;
}
.menu-icon::after, .menu-icon:hover::after{
	box-shadow: 0 7px 0 #125e5d, 0 14px 0 #125e5d;
	background:#125e5d;
}
.top-bar{
	padding:0;
}
.top-bar ul {
    background-color: #fff;
}
.top-bar ul li{
	padding: .2rem;
  font-weight: 500;
  text-transform: uppercase;
  border-bottom: 1px solid rgba(10, 10, 10, 0.05);
}
.top-bar ul li.is-submenu-item{
    border-bottom:none;
}
.accordion-menu .is-accordion-submenu a {
    text-transform: none;
    font-weight: 600;
    border-top: 1px dotted rgba(204, 204, 204, 0.5);
}
.accordion-menu .nested.is-accordion-submenu {
    margin-right: 1rem;
}
.top-bar ul a, .top-bar ul a:hover, .top-bar ul a:focus{
  color:#000;
  border-bottom:none;
}
.accordion-menu .is-accordion-submenu-parent:not(.has-submenu-toggle)>a::after{
    border-color: #000 transparent transparent;
}
/*view all button style*/
.top-bar ul a.view-all {
    color: #107070;
    border-bottom: none;
    text-align: left;
    text-transform: uppercase;
    font-size: .8rem;
}
.main-home-article, .main-home-article.alternate, .sub-home-article, .top-image, .regions{
    position: relative;
    background-size: cover;
    background-position: center;
}
.top-image{
    height: 9rem;
}
.main-home-article{
    height: 20rem;
}
.main-home-article a, .main-home-article a:hover, .main-home-article a:focus{
    border-bottom: none;
}
.sub-home-article{
  height: 18rem;
}
.regions .main-title{
  text-align: center;
}
.regions{
  margin-bottom: 1rem;
  height: 10rem;
}
.overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10;
    background: -moz-linear-gradient(top,rgba(0,0,0,0) 19%,rgba(0,0,0,0) 34%,rgba(0,0,0,0.65) 100%);
    background: -webkit-linear-gradient(top,rgba(0,0,0,0) 19%,rgba(0,0,0,0) 34%,rgba(0,0,0,0.65) 100%);
    background: linear-gradient(to bottom,rgba(0,0,0,0) 19%,rgba(0,0,0,0) 34%,rgba(0,0,0,0.65) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000',endColorstr='#a6000000',GradientType=0 );
}
.main-title {
    position: absolute;
    bottom: 1rem;
    font-weight: 700;
    color: #fff;
    text-shadow: 0px 1px 3px rgba(0, 0, 0, 0.59);
    font-size: 2rem;
    width: 100%;
    z-index: 11;
    padding: 0 1rem;
    line-height:2rem;
}
.article-image{
    position: relative;
    height: 10rem;
    background-size: cover;
    background-position: center;
}
.date{
  font-size:.8rem;
  text-transform:uppercase;
  font-weight:700;
}
.flag{
  color:#fff;
  font-weight:700;
  text-transform:uppercase;
  font-size:.8rem;
  text-shadow:none;
  float:left;
  width:auto;
}
.article-image .flag{
  position: absolute;
  bottom: 1rem;
  z-index: 11;
  margin-left:1rem;
}
.flag span{  
  padding:.2rem .5rem;
  letter-spacing: 1px;
}
.human-development{
  background:#03a9f4;
  transition: background 0.3s ease;
}
.main-category.human-development:hover {
  background: #0087c3;
}
.church-development{
  background:#00796B;
  transition: background 0.3s ease;
}
.main-category.church-development:hover {
  background: #004c43;
}
.education{
  background:#303f9f;
  transition: background 0.3s ease;
}
.main-category.education:hover {
  background: #18246f;
}
.leadership{
  background:#e29d00;
  transition: background 0.3s ease;
}
.main-category.leadership:hover {
  background: #bd8300;
}
.technology{
  background:#f26722;
  transition: background 0.3s ease;
}
.main-category.technology:hover {
  background: #ca4807;
}
.business{
  background:#26A69A;
  transition: background 0.3s ease;
}
.main-category.business:hover {
  background: #0b796f;
}


.main-title .flag{
  margin-right:.8rem;
}
section.main{
  padding-top:1.75rem;
}
.main-category{
  padding:.5rem;
  font-weight:700;
  text-transform:uppercase;
}
.main-category span{
  font-weight:300;
  text-transform:none;
}
.main-category a, .main-category a:hover, .main-category a:focus{
  color:#fff;
  border-bottom: none;
}
.top-stories-item{
    background: #f9f9f9;
    padding: .78rem 1rem;
    border-bottom: 1px solid #e4e4e4;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: background 0.3s ease;
}
.top-stories-item:hover {
  background: #fff;
}
.top-stories-item.title-top:hover{
  background: #f9f9f9;
}
.title-top{
  text-transform:uppercase;
  font-weight:700;
  font-size:1.3rem;
}
.top-stories-item a{
  font-weight:600;
  color:#000;
  font-size:1rem;
  border-bottom: none;
}
.top-stories-item a:hover, .top-stories-item a:focus{
  border-bottom: none;
}
#back-top {
  position: fixed;
  bottom: 20px;
  right: 2%;
  z-index: 100;
}
.button.totop, .button.totop:focus {
  background-color: #ccc;
  transition: background-color .25s ease-out,color .25s ease-out;
  width: 56px;
  height: 56px;
  padding: 19px 0 10px 3px;
  border-radius: 50%;
  color:#fff;
}
.button.totop:hover{
  background-color:#107070;
  color:#fff;
}
a.button.totop::after{
  border-bottom:none;
}
#back-top .fa{
  font-size: 1rem;
}
/*These are the styles for the footer with the standard congress sub-footer*/
.footer{
    clear:both;
    background:#4d4d4d;
    padding: 2rem 0 0;
    font-size:1rem;
}
.tagline{
    font-size: .8rem;
    color: #929292;
    margin-top: .5rem;
    padding-right: 0;
    font-weight: 500;
    margin-bottom: 2rem;
    margin-left:1rem;
}
.privacy{
    clear: both;
    margin-left: .7rem;
    margin-top: 2rem;
    font-size: .8rem;
    margin-bottom: 2rem;
}
.privacy .title{
    padding:.2rem 0;
    margin-bottom:.5rem;
}
.privacy .title span{
    border-bottom: 1px solid #828282;
    padding-bottom: .5rem;
}
.privacy a, .privacy a:hover{
    color:#eee;
    border-bottom:none;
}
.sub-footer {
    background-color: #3D3D3D;
    padding: 30px 0 20px 0;
    color: #ccc;
    margin-top:4rem;
}
.sub-footer a{
    text-decoration:none;
    border-bottom: 0;
    font-weight:400;
}
.sub-footer a:hover, .sub-footer a:focus, .sub-footer a:active{
    text-decoration:none;
    border-bottom: none;
}
.sub-footer i {
    font-size: 30px;
    margin-top: 15px;
    margin-bottom: 10px;
    margin-left: 8px;
}
.sub-footer a i{
    color: #ccc;
}
hr{
  max-width:100%;
}
.masonry-css {
  -webkit-column-count: 1;
     -moz-column-count: 1;
          column-count: 1;
  -webkit-column-gap: 1rem;
     -moz-column-gap: 1rem;
          column-gap: 1rem;
}
.masonry-css h4{
  font-size: 1.5rem;
  line-height: 1.75rem;
}
.small-line{
  width:2rem;
  height:.35rem;
  background:#107070;
  margin:1.3rem auto 2rem auto;
}
.callout{
  padding:0;
  border:1px solid #efefef;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.07);
  transition: box-shadow 0.2s ease-in-out 0s; 
}
.callout:hover, .regions:hover {
    box-shadow: 0px 6px 6px 0px rgba(0, 0, 0, 0.1);
}
.article-details{
  padding:1rem;
}
.article-details .date{
  color:#8e8e8e;
  margin-bottom:.3rem;
}
/*MASONRY GRID*/
.masonry-css-item a, .masonry-css-item a:hover, .masonry-css-item a:focus {
  border-bottom: none;
}
.top-main-content{
  margin-bottom:1rem;
}
.article-view .flag{
  margin-right:.5rem;
}
.article-view h1{
  margin-top:1rem;
  margin-bottom:1rem;
}
.article-view .author{
  font-weight:500;
  color:#8e8e8e;
  font-size:.8rem;
  text-transform:uppercase;
}
.article-view p{
  margin:.5rem 0;
}
.article-view img{
  width:100%;
}
/*DETAIL PAGE STYLES*/
.detail-page .intro {
    padding-top: 1rem;
    padding-bottom: 0;
}
.small-line.human-development {
    background: #03a9f4;
}
.small-line.church-development {
    background: #00796b;
}
.small-line.education {
    background: #303f9f;
}
.small-line.leadership {
    background: #e29d00;
}
.small-line.technology {
    background: #f26722;
}
.small-line.business {
    background: #26a69a;
}
.play{
    position: relative;
    z-index: 12;
    color: #fffffff2;
    font-size: 3rem;
    text-align: center;
    top: 38%;  
}
a.button.tiny.tag {
    font-weight: 800;
    font-size: .7rem;
    margin: 1rem .5rem .2rem 0;
    padding: .4rem;
    border-color:#107070;
    color:#107070;
}
a.button.tiny.tag:hover {
    background:#107070;
    color:#fff;
}
@media print
{    
    .no-print, .no-print *
    {
        display: none !important;
    }
}
/*=========================================== Medium and up ======================================================*/
@media screen and (min-width: 40em) {
h1 {
    font-size: 3rem;
    line-height: 3rem;
}
h2 {
    font-size: 2.25rem;
}
.recent-articles h2 {
  font-size: 1.75rem;
}
h3 {
    font-size: 1.25rem;
    line-height: 1.5rem;
}
h4, .masonry-css h4 {
    font-size: 2rem;
    line-height: 2.2rem;
    transition: color .25s ease-out,color .25s ease-out;
}
h4:hover{
   color:#107070;
}
span.subtext {
    font-size: 1.25rem;
}
.regions {
    height: 12rem;
}
.regions .main-title {
    font-size: 1.75rem;
    line-height: 1.75rem;
}
.top-image {
    height: 18rem;
}
.intro{
  padding-top:3.5rem;
  padding-bottom:3.5rem;
}
.no-js .title-bar {
    display: none;
}
.top-bar{
	padding:2rem 1.5rem;
	border-top: .8rem solid #107070;
}
.top-bar ul {
    background-color: #fff;
}
.top-bar ul li {
    padding: .2rem;
    font-size: 1.1rem;
    border-bottom: none;
}
.top-bar ul li:hover {
    background: transparent;
}
.top-bar ul a {
    color: #000;
}
.top-bar ul.menu a:hover, .top-bar ul.menu a:focus {
    color: #107070;
    border-bottom: none;
}
.dropdown.menu a {
    padding: 0 1rem .7rem 1rem;
    border-bottom: none;
}
.dropdown.menu.medium-horizontal>li.is-dropdown-submenu-parent>a::after{
    border-color: #000 transparent transparent;
    margin-top: -8px;
}
.desktop-logo{
	width:13rem;
}
.desktop-logo a, .desktop-logo a:hover, .desktop-logo a:focus{
    border-bottom: none;
}
.dropdown .is-dropdown-submenu-parent .is-active:hover{
  color: #107070;
}
.dropdown .is-dropdown-submenu a {
    padding: .7rem .5rem;
    text-transform: none;
    color: #333;
    font-weight: 600;
    font-size: .9rem;
}
.dropdown.menu.medium-horizontal>li.opens-left>.is-dropdown-submenu {
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.2);
    z-index: 1000;
}
.top-bar ul li.is-submenu-item {
    border-bottom: 1px dotted #ccc;
}
/*view all button style*/
.dropdown .is-dropdown-submenu a.view-all {
    text-align: center;
    text-transform: uppercase;
    font-size: .8rem;
    color: #107070;
}
section.main{
  margin-top: 2rem;
}
.main-home-article{
  height:31rem;
}
.top-stories-item{
  padding:1rem;
}
.main-category{
  padding: .71rem 1rem;
}
.main-title{
  padding:0 2rem;
  bottom:2rem;
  font-size:3rem;
  line-height:3.3rem;
}
.privacy {
    margin-left: 1.7rem;
}
.tagline{
    margin-top:1.6rem;
}
.article-image{
  height:17rem;
}
.recent-articles{
  margin-top:3rem;
}
.button.totop, .button.totop:focus {
  padding: 16px 0 10px 1px;
}
#back-top .fa{
  font-size: 1.2rem;
}
}


/*===========STYLES AND MEDIA QUERIES FOR MASONRY GRID=================*/
.masonry-css-item {
  -webkit-column-break-inside: avoid;
     page-break-inside: avoid;
          break-inside: avoid;
  margin-bottom: 1.6rem;
}
@media screen and (min-width: 25em) {
  .masonry-css {
    -webkit-column-count: 1;
       -moz-column-count: 1;
            column-count: 1;
  }
  .masonry-css-item {
    margin-right: .1rem;
    margin-left: .1rem;
}
}

@media screen and (min-width: 37.5em) {
  .masonry-css {
    -webkit-column-count: 2;
       -moz-column-count: 2;
            column-count: 2;
  }
    .masonry-css-item {
    margin-right: .1rem;
    margin-left: .1rem;
}
}

@media screen and (min-width: 50em) {
  .masonry-css {
    -webkit-column-count: 2;
       -moz-column-count: 2;
            column-count: 2;
  }
    .masonry-css-item {
    margin-right: .3rem;
    margin-left: .3rem;
}
}

@media screen and (min-width: 68.75em) {
  .masonry-css {
    -webkit-column-count: 3;
       -moz-column-count: 3;
            column-count: 3;
  }
}




/*===========
============================= STYLES BELOW HERE ARE FOR SPECIFIC SCREEN SIZES ONLY and include a MIN and MAX
=============================
============*/

/*============Medium Only SCREENS==========*/

@media only screen and (min-width: 40.063em) and (max-width: 63.9em)
{
.top-bar {
    padding: 0rem 1.5rem;
    border-top: none;
}
.top-bar ul li {
    font-size: .8rem;
}
.dropdown.menu a {
    padding: 1rem 1rem;
}
}

/*============X-LARGE SCREENS AND BIGGER========== min-width 1441px and max-width 1920px*/

@media only screen and (min-width: 90.063em) and (max-width: 120em)
{
.main-category {
    padding: 1.21rem 1rem;
}

}


/*============XXLarge screens ========== min-width 1921px, xxlarge screens */
@media only screen and (min-width: 120.063em) { 
.main-category{
  padding:1.21rem 1rem;
}
} 



/*============Phone ONLY ==========*/

@media only screen and (max-width: 50.000em)
{

}

/*==========================================IPAD Queries========================================*/
/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 1024px) 
  and (max-device-width: 1366px) 
  and (-webkit-min-device-pixel-ratio: 1.5) {
}

/* Portrait */
@media only screen 
  and (min-device-width: 1024px) 
  and (max-device-width: 1366px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 1.5) {

}

/* Landscape */
@media only screen 
  and (min-device-width: 1024px) 
  and (max-device-width: 1366px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 1.5) {

}

/*iPad 1 & 2 in landscape*/
@media only screen 
and (min-device-width: 768px) 
and (max-device-width: 1024px) 
and (orientation: landscape)
and (-webkit-min-device-pixel-ratio: 1)  {
.main-home-article {
    height: 34rem;
}
.top-bar ul li {
    padding: .2rem .25rem;
    font-size: 1rem;
}
.dropdown.menu a {
    padding: 0 0.5rem .7rem 0.5rem;
    font-size: .9rem;
}
.fa-rss {
    font-size: 1rem;
    left: -.1rem;
}
}

/*iPad 1 & 2 in portrait*/
@media only screen 
and (min-device-width: 768px) 
and (max-device-width: 1024px) 
and (orientation: portrait) 
and (-webkit-min-device-pixel-ratio: 1) {

footer {
    line-height: 32px;
}

.title-bar .menu-icon {
    top: 1.75rem;
}
.fa-rss {
    font-size: .9rem;
    left: -.1rem;
}
.dropdown.menu.medium-horizontal>li.is-dropdown-submenu-parent>a::after {
    margin-top: -4px;
}
}



/*iPad mini in portrait & landscape*/
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px)
and (-webkit-min-device-pixel-ratio: 1)  {
}

/*iPad mini in landscape*/
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape)
and (-webkit-min-device-pixel-ratio: 1)  {

}

/*iPad mini in portrait*/
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait)
and (-webkit-min-device-pixel-ratio: 1)  {

}

/* ----------- iPad 3, 4 and Pro 9.7" ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (-webkit-min-device-pixel-ratio: 2) {

}

/* Portrait */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 2) {

}

/* Landscape */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 2) {
.top-bar ul li {
    padding: .2rem .25rem;
    font-size: 1rem;
}
}