/*
<?php the_content(); ?>
Theme Name: Anagram Custom Indie Philanthropy Theme
Theme URI: http://anagr.am
Author: Anagram
Author URI: http://anagr.am
Description: A custom theme for Indie Philanthropy created by anagram.
Version: 1.0
License: GNU General Public License



/* My Minimal WordPress Styling comes here */

/* This is a small security for too long strings titles */
body {
    word-wrap: break-word;
	font-family: 'Open Sans', sans-serif;
	font-size: 16px;
	line-height: 1.6;
	background-color: #F8C738;
	color: #000;
	/*background:#231F20 url(img/temp.png) left top no-repeat;*/
	font-weight: 300;
}

body.page-template-page-fullwidth-blue,
body.page-about{
	background-color: #748DA7;
	color: #FFF;
}

.page-template-page-fullwidth-blue .the-content h3 {
	color: #f8c738;
    margin-bottom: 0;
}


body.page-stories,
body.single-story{
	background-color: #F8C738;
	color: #000;
}

body.page-template-page-interactive-php,
body.page-resources,
body.single-method,
body.page-template-page-fullwidth-php{
	background-color: #231F20;
	background-color: #2D2E2D;
	color: #FFF;
}

body.home{
	background-color: #C7CB82;
	color: #FFF;
}

.large-black{
	font-size: 2em;
  color: #000;
}
.right-align{
	text-align: right;
}

.padding-bottom{
	 padding-bottom: 20px;
}

/* Alignment */
.alignleft {
	display: inline;
	float: left;
	margin-right: 1.5em;
}
.alignright {
	display: inline;
	float: right;
	margin-left: 1.5em;
}
.aligncenter {
	clear: both;
	display: block;
	margin: 0 auto;
}

.clear {
	clear: both;
}

.white{
	color:#FFF;
}
.black{
	color:#000;
}

b, strong {
font-weight: 600;
}

a {
color: #872230;
font-weight: 600;
}


body.single-method a {
color: #F8C736;
}


.uppercase{text-transform: uppercase;}
a:hover, a:focus {
color: #FFF;
text-decoration: none;
}


.list-unstyled  ul  li,
.list-unstyled  ol  li {
padding-bottom: 20px;

}


.logo-header{
	margin: 0 auto;
	padding: 0 0px 0 15px;
}
@media (max-width: 992px) {
.logo-header{
	max-width: 380px;
}
}



.text-logo{
	color: #595956;
	text-transform: uppercase;
	font-weight: 400;
	font-size: 1.7em;
	line-height: 1.4;
	white-space: nowrap;
}

.tagline{
font-size: 1.2em;
text-transform: uppercase;
margin-top: 15px;
width: 53%;
line-height: 1.4em;
color: #872230;
float: right;
border-top: 1px solid #BCBDC0;
padding-top: 12px;
}
@media (max-width: 1500px) {
	.tagline{

	width: 100%;

	}
}

@media (max-width: 1200px) {
	.tagline{
font-size: 1em;
	width: 100%;

	}
}


    	    h1,h3{
						font-family: 'EB Garamond', serif;
	    		    }

h1.larger{ font-size: 64px;}

    	    h1, h2, h3, h4, h5, h6{
						letter-spacing: 1px;
	    		    }

h3.brought-to{ font-size: 40px;}


h4{
	line-height: 1.3;
}
.caption{
	font-size: .9em;
color: #000;
font-style: italic;
}

/* Images and wp-captions should always fit and be responsive */
img {
	display: inline-block;
	height: auto;
	max-width: 100%;
}
@media \0screen {img { width: auto }} /* Prevent height distortion in IE8. */
img[class*="wp-image-"] {
	margin-top: 4px;
	margin-bottom: 10px;
}
.featured-image{
	text-align: center;
	margin-bottom: 20px;

}
.featured-image img{
	margin: 0 auto;

}
.wp-caption {
	border: 1px solid #ccc;
	margin-bottom: 10px;
	max-width: 100%;
	border: 1px solid #ccc;
	border-radius: 4px;
	padding: 0 10px;
}
.wp-caption.aligncenter {
	margin-bottom: 10px;
}
.wp-caption img[class*="wp-image-"] {
	display: block;
}
.wp-caption .wp-caption-text {
	text-align: center;
	margin-top: 10px;
}


/* Make sure embeds and iframes fit their containers */
embed,
iframe,
object {
	max-width: 100%;
}
  video {
            max-width: 100%;
            height: auto;
          }


/* Equal hieght*/

.equalheight {
    overflow: hidden;
}


/* =Nav
--------------------------------------------------------------------------------------------------------*/

.navbar-default {
background-color: transparent;
border-color: transparent;
}


.navbar-default .navbar-collapse, .navbar-default .navbar-form {
padding-bottom: 10px;
}
.navbar {
	border-radius: 0;
	border: none;
	display: block;
	float: none;
	text-align: center;

}
.navbar-nav > li {
	display: block;
	text-align: left;
	float: none;
}

.navbar-default .navbar-nav > li > a {
	color: #000;
	font-size: 1.8em;
	padding: 10px 0px 0px;
	font-weight: 300;
	line-height: 1;
	text-transform: lowercase;
	letter-spacing: 2px;
	text-align: center;
}

@media (min-width: 992px) {

.navbar-default .navbar-nav > li > a {

font-size: 1.8em;
padding: 0px 10px 25px;
text-align: left;
}
}

@media (max-width: 400px) {

.navbar-default .navbar-nav > li > a {

font-size: 1.1em;
}
}




.navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus {
color: #872230;
background-color: transparent;
}
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus {
color: #872230;
background-color: transparent;
}

.navbar-default .navbar-nav > li.current-menu-item > a {
color: #872230;
background-color: transparent;
}



/* =Social
--------------------------------------------------------------------------------------------------------*/

.social { margin-right: 0px;float: right; }
.social div { display:inline-block; padding: 0; }
.social div a {display: block;  text-decoration:none; height:24px; width:24px;}
/* End Social
--------------------------------------------------------------------------------------------------------*/

/* =Backtotop
--------------------------------------------------------------------------------------------------------*/
#backtotop { position:absolute; right: 30px;top: 10px;display:none; z-index:30; }
#backtotop a { display:block;float:right;color:#FFF;}
#backtotop a:hover {  }





/* =Site Styles
--------------------------------------------------------------------------------------------------------*/
.highlight {
	color: #F24f08;
	font-size: 20px;
	line-height: 32px;
	font-weight: 700;
	display: inline-block;
}
.blackbold {
	color: #000;
	font-size: 20px;
	line-height: 32px;
	font-weight: 700;
	padding-bottom: 10px;
	display: inline-block;
}

.story-question {
	color: #000;
	line-height: 1.6em;
	font-size: 1.4em;
	font-family: 'EB Garamond', serif;
}

.small-text{
	font-size: .8em;
}
a.button {
	background: #74CCE5;
	border-radius: 3px;
	color: #FFF;
	display: inline-block;
	padding: 7px 14px 5px;
	text-decoration: none;
}


a.button:hover {
	text-decoration: none;
}

.the-icon-lg {
padding:6px;
}
.the-icon-lg [class^="icon-"], .the-icon-lg [class*=" icon-"]{
	text-align: center;
font-size: 8em;
}

.panel-methods .the-icon{
	text-align: center;
	padding: 5px;
}
.panel-methods .the-icon [class^="icon-"], .panel-methods .the-icon [class*=" icon-"]{
	text-align: center;
font-size: 4em;
}


.fa-other:before {
content: "\f0c1";
}

.the-icon-sm {
/*border: 1px dashed #FFF;*/
height: 25px;
width: 25px;
float: left;
margin-right: 10px;
color: #FFF;
}

.the-icon-lg{
	border: 1px dashed #FFF;
	height: 140px;
	width: 140px;
	margin-right: 10px;
	margin-bottom: 6px;

}


.the-icon-sm{
		text-align: center;
}
.the-icon-sm [class^="icon-"],.the-icon-sm [class*=" icon-"]{
		text-align: center;
}

.resource-filter .the-icon-sm {
text-align: center;
padding: 3px;
}

.resource-header .the-icon {
		padding-top: 10px;
}
.resource-header .the-icon [class^="icon-"],.resource-header .the-icon [class*=" icon-"]{
		text-align: center;
		font-size: 4em;
}



.panel-clear .the-icon {
border: 1px dashed #FFF;
height: 77px;
width: 77px;
	padding: 5px;
}
.panel-clear .the-icon [class^="icon-"],.panel-clear .the-icon [class*=" icon-"]{
		text-align: center;
		font-size: 4em;
}

.section-3 .the-icon {
	text-align: center;
}


/* Text meant only for screen readers */
.screen-reader-text {
	clip: rect(1px, 1px, 1px, 1px);
	position: absolute !important;
}
.screen-reader-text:hover,
.screen-reader-text:active,
.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	color: #21759b;
	display: block;
	font-size: 14px;
	font-weight: bold;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000; /* Above WP toolbar */
}


/* Nested comments? They are threaded and nested already, you just need to add your own styling to finalize!
 * For example with some margin, like the line below ;) Delete, modify, change classes in HTML if you desire another style */
 .comment .children { margin-left: 1.5em; }



/* Some modified padding for the bootstrap container.
 * Now you can make many styles of design easily.
 * Try with giving the .container class just a background colour and have a look. ;)
 */
.container { padding: 0 15px 15px 15px; }

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

html, body, .container-height/*, .row*/ {
	/*height: 100%;*/
}

/* =Results page
--------------------------------------------------------------------------------------------------------*/
body.page-template-page-results-php{
	background-color: #FFF;
	color: #000;
}

.page-template-page-results-php .border-dotted{
	border-color: #000;
	border-left: 1px solid;
}

.page-template-page-results-php .colored-bg{
	background: #F8C738;
	padding: 20px;
	font-size: .9em;
	color: #FFF;
}

.page-template-page-results-php .border-yellow{
	border-top: 2px dashed #F8C738;
	padding-top: 30px;
	margin-top: 30px;
}


.page-template-page-results-php .border-blue{
	border-top: 2px dashed #748DA7;
	padding-top: 30px;
	margin-top: 30px;
}

.page-template-page-results-php .border-gray{
	border-top: 2px dashed #2D2E2D;
	padding-top: 30px;
	margin-top: 30px;
}
.the-icon-lg-black{
	border: 1px dashed #000;
height: 140px;
width: 140px;

float: right;
}


/* =Sidebar
--------------------------------------------------------------------------------------------------------*/



.site-header {
	margin-left: -15px;
	margin-right: -15px;
	padding: 20px;
}




@media (max-width: 720px) {

.site-header {
float: left;
width: 60%;
padding: 20px 10px;
}
}




.social-info{
display: none;
color: #000;
}

.social-links i,
body.single-method .get-touch  a,
.get-touch .icon-contact-us.footer {
color: #872230;
}

.social-links a:hover i,
body.single-method .get-touch  a:hover,
.get-touch a:hover .icon-contact-us.footer,
.get-touch a:hover {
color: #595956;
}

.copyright{
font-size: .6em;
left: 2px;
bottom: 4px;
position: absolute;
color: #000;
}
.site-navigation-inner .social-links{
	display: block;
		padding-top: 10px;
	clear: both;
}
.sidebar {
	background-color: #86AE9E;
	background-color: #FFF;
	overflow: auto;
}

.site-navigation{float:right}
.site-header{float:left}




@media (min-width: 992px) {
  .sidebar {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    z-index: 1000;
    display: block;
        background-color: #595856;
        background-color: #E6E7EC;
        	background-color: #FFF;
  }
.site-navigation{float:none}
.site-header{float:none}

  .site-navigation-inner{
	padding: 6em 0 1em;
}

 .social-info {
    /* position: absolute; */
    width: 96%;
    /* left: 0; */
    /* bottom: 0; */
    margin-left: 2%;
    display: block;
    padding-top: 9px;
    padding-bottom: 10px;
    position: relative;
    overflow: auto;
    margin-top: 70px;
}

 .social-info .icon-contact-us.footer {
display: block;
float: left;
	font-size: 3em;
	margin-right: 16px;
}

.col-md-2 .social-info .icon-contact-us.footer {
	font-size: 3em;
}

.get-touch{
	float: left;
	font-weight: 600;
	font-size: 16px;
		line-height: 23px;
	padding-top: 4px;
}
.social-links{
	padding-top: 0;
	float: right;
}
.social-links a{
display: block;
}
.site-navigation-inner .social-links{
	display: none;
}

}


@media (min-width: 1140px) {


.get-touch{
	font-size: 18px;
		line-height: 26px;
	padding-top: 0px;
}


}


/* =Sidebar about + partners
--------------------------------------------------------------------------------------------------------*/

.icon-contact-us.about{
	color: #FFF;
	font-size: 3em;

}
.partners{
overflow: auto;
margin-bottom: 20px;
color: #000;
}
.partners .logo{
	width:150px;
}

.partner-header{
	color: #000;
margin-top: -10px;
}
.partners.main{
	border-bottom: 1px dashed #FFF;
padding-bottom: 20px;

}

.partners.main a {
font-weight: 400;
letter-spacing: 1px;
}
/*
.partners.main .logo{
	float: right;
	width: 130px;
	margin-right: 20px;
}*/

.partners h3,
.partners a{
white-space: nowrap;
}
.partners h3{
margin-top: 10px;
}



.partners h3,.partners h4{
	color: #FFF;
	text-transform: uppercase;
		font-family: 'Open Sans', sans-serif;
		margin-bottom: 0;
}
.partners h4{
	color: #FFF;
	text-transform: uppercase;
		font-family: 'Open Sans', sans-serif;
		margin-bottom: 0;
}

.partners .org-website a {
font-size: .9em;
}

/* =Stories and Pages
--------------------------------------------------------------------------------------------------------*/


/*Sidebar content*/

.side-content{
padding: 46px 57px 0px 40px;
}
.side-content.less{
padding: 46px 30px 0px 15px;
}


.the-content{
	padding: 20px 40px;
}



@media (max-width: 1500px) {

.side-content.less{
padding: 46px 10px 0px 0px;
}

.side-content {
padding: 46px 20px 0px 8px;
}

.the-content {
padding: 10px 10px;
}

}


@media (max-width: 600px) {

.return {
display: none;
}

.side-content.less{
padding: 10px 0px 0px 0px;
}

.side-content {
padding: 10px 0 0px 0px;
}

.the-content {
padding: 10px 0;
}

}


.side-content a{
 /*color: #FFF;
 font-weight: 400;*/
 letter-spacing: 1px;
/* text-transform: uppercase;*/
}

.side-content a:hover{
 color: #000;
}

.side-content  .sub-text{
 color: #000;
 font-size: .8em;

}

.single-method .side-content .sub-text {
color: #FFF;
}

.side-content .med-text{
 color: #000;
 font-size: .9em;
 margin-bottom: 5px;
 line-height: 1.3;

}
.the-content  .med-text{
 font-size: .9em;

}
.the-content  .sub-text{
 font-size: .8em;

}



.side-content div.bottom{
margin-bottom: 30px;
overflow: auto;
}
.border-dotted{
	border-right:2px dashed #FFF;
}

@media (max-width: 992px) {
.col-md-4.border-dotted{
	border-right:none;
}
}

.org-name {
background: #FFF;
color: #F8C738;
padding: 1px 30px 10px;
letter-spacing: 1px;
margin: 0 -20px 15px -30px!important;
	font-family: 'EB Garamond', serif;

}
.org-logo{
	margin-bottom: 20px;
}
.org-social a {
	margin-right: 15px;
}
.page-about .org-social {
	float: right;
	margin-top: 4px;
}
.org-description{
font-weight: 300;

}

h2.org-loc {
margin-top: 20px;
margin-bottom: 10px;
}

.accent-arrow.black{
	position: absolute;
	left: 15px;top:50px;
	height: 200px;
}

.accent-arrow{
	position: absolute;
	left: 15px;top:50px;
	height: 200px;
}
.accent-arrow.white{
	position: absolute;
width: 25px;
top: 80px;
height: 250px;
margin-left: auto;
margin-right: auto;
left: 0;
right: 0;
}

.accent-arrow i.fa-circle{
	color: #872230;
	margin-top: -5px;
	margin-left: 1px;
}

.accent-arrow i.fa-angle-down{
	position: absolute;
	left: 0px;
	bottom: -20px;
}
.accent-arrow:after {
    content:"";
    position: absolute;
    z-index: -1;
    top: 0;
    bottom: 0;
    left: 50%;
    border-left: 3px solid transparent;
}

.accent-arrow.black:after{
	border-color:  #000000;

}
.accent-arrow.black i.fa-angle-down{
	color: #000;
}
.accent-arrow i.fa-circle-thin{

}

.accent-arrow.white:before {
	content: "";
	position: absolute;
	z-index: -1;
	top: 0;
	bottom: 0;
	left: -43px;
	width: 110px;
	border-top: 1px dashed #FFF;
}

.accent-arrow.white:after{
		border-left: 1px dashed #FFF;
	top: 0px;

}

.accent-arrow.white i.fa-angle-down{
	left: -2px;
}

.accent-arrow.white  i.fa-circle {
color: #C4232D;
margin-top: -2px;
margin-left: 1px;
}




.accent-arrow{
	position: absolute;
	left: 15px;top:50px;
	height: 200px;
}
.accent-arrow.white{
	position: absolute;
width: 25px;
top: 98px;
height: 230px;
margin-left: auto;
margin-right: auto;
left: 0;
right: 0;
}


.return{
	width: 200px;
	text-align: center;
	margin-bottom: 30px;
}
.return a{
	color:#FFF;
}
.return a:hover{
	color:#000;
}
.hora-arrow{
	/*position: absolute;
	left: 15px;top:50px;*/
	width: 200px;
	margin-bottom: 0!important;
	height: 30px;
	position: relative;
	margin-top: -10px;
}
.hora-arrow:after {
	content: "";
	position: absolute;
	z-index: -1;
	top: 50%;
	bottom: 0;
	left: 0;
	border-top: 3px solid #FFF;
	width: 100%;
}
.hora-arrow i.fa-circle-thin{
	color: #FFF;
	margin-top: 1px;
	margin-right: -25px;
	float: right;
}

.hora-arrow i.fa-angle-left{
	float: left;
		color: #FFF;
		margin-left: -6px;
margin-top: -8px;
}


.side-content.less li {
margin-bottom: 15px;
line-height: 1.2;
}

.side-content .white li{
border-bottom: 1px dashed #FFF;
margin-bottom: 15px;
padding-bottom: 15px;
line-height: 1.2;
}
.side-content .white li a{
font-weight: 600;
color: #FFF;
}



.side-content .white li a:hover{
color: #000;
}

.single-method  .side-content .white li{
border-bottom: 1px dashed #FFF;
margin-bottom: 10px;
padding-bottom: 10px;
line-height: 1.6em;
font-size: .9em;
}
.single-method .side-content .white li a {
color: #F8C738;

}
.single-method .side-content .white li a:hover {
color: #000;
}
.resource-list li a {
	color: #F8C738;
}
/*Resource*/
.resource-header {
clear: both;
overflow: auto;
margin-bottom: 20px;
}

.ideas-filter li,
.resource-filter li {
border-bottom: 1px dashed #FFF;
margin-bottom: 15px;
padding-bottom: 15px;
line-height: 1.2;
cursor: pointer;
}
.ideas-filter li:hover,
.ideas-filter li.active,
.resource-filter  li:hover,
.resource-filter  li.active {
color:#748DA7;

}
ul.resource-list{
	margin-bottom: 30px;
	}
.list-unstyled.resource-list  li {
padding-bottom: 10px;


}

.resource-list li a {
	color: #F8C738;
}
.resource-list li a:hover {
color: #000;
}

.resource-header .the-icon {

height: 77px;
width: 77px;
float: left;

}
.resource-header  h1 {
margin-top: 43px;
}

.resource-tags{
	color: #F8C738;
	color:#748DA7;

}
.resource-type .resource-type{
		color: #F8C738;
}
.resource-tag-filter li{
	font-size: .8em;
	padding-left: 0;
	cursor: pointer;

}

.resource-tag-filter  li:hover,
.resource-tag-filter  li.active {
color:#748DA7;

}
.resource-tags .sub-text span {

	cursor: pointer;

}
.resource-tags .sub-text span:hover,
.resource-tags .sub-text span:active{
color:#FFF;

}

.resource-filter,
.resource-tag-filter{
	margin-bottom: 30px;
}

@media (max-width: 800px) {

	.resource-tag-filter{
		display: none;
	}

}

/*Stories*/
.dashed-bottom {
border-bottom: 1px dashed #FFF;
margin-bottom: 15px;
padding-bottom: 15px;
line-height: 1.2;
}

.bottom-padding{
	height:40px
}

/*Content*/


.the-content h2 {
line-height: 1.3;
margin-bottom: 30px;
}
.the-content h4 {
line-height: 1.3;
margin-bottom: 10px;
}
.the-content h3 {
line-height: 1.3;
margin-bottom: 10px;
color: #FFF;
}

.single-method .the-content h3 {
color: #748DA7;
}

.page-about .the-content h3 {
color: #000;
}

.single-method .side-content .med-text {
color: #748DA7;
}

.org-details{
	color: #748DA7;
}




/* Method panels */

.panel-methods{
margin-bottom: 30px;
background: rgba(0, 0, 0, 0);
border-radius: 0;
border-bottom: 1px dashed #FFF;
}
.panel-methods .panel-body {
padding: 20px;
letter-spacing: 1px;
line-height: 1.5;
font-weight: 300;
}

.panel-methods .panel-body h3{
margin-top: 0;
font-weight: 300;
line-height: 1.2;
color: #F8C738;
}
.panel-methods a{
color: #fff;
font-weight: 400;
}
.panel-methods a:hover h3{
color: #FFF;
}
.panel-methods .the-icon {
/*border: 1px dashed #FFF;*/
height: 77px;
width: 77px;
float: left;
margin-right: 20px;
}

.quote{
	color:#748DA7;
	font-weight: 300;
	padding: 36px;
	position: relative;
}
.site-footer .quote{
	color:#FFF;
	padding: 20px 50px 0;
}
.quote .fa-quote-left{
	position: absolute;
	left:0;
}
.quote .fa-quote-right{
	position: absolute;
	right:0;
}
.quote .source{
	color: #FFF;
	font-weight: 300;
	text-align: right;
	font-size: .8em;
}
.middle{
	overflow: auto;
	/*height: 77px;
display: table-cell;
vertical-align: middle;*/
}

.panel-methods .sub-text{
 font-size: .8em;
overflow: auto;
}

/* Toolkit panels */

.intro-text {
	overflow: auto;
}


.panel-clear{
margin-bottom: 50px;
background: transparent;
border-radius: 0;
box-shadow: 0 0px 0px rgba(0, 0, 0, 0);
}
.panel-clear .panel-body {
padding: 40px;
letter-spacing: 1px;
line-height: 1.5;
font-weight: 300;
}

.panel-clear .panel-body h1{
font-size: 4em;
font-weight: 300;
letter-spacing: 2px;

}
.panel-clear a{
color: #fff;
font-weight: 400;
}
.panel-clear a:hover h1{
color: #872230;
color: #F8C738;


}
.section-1{
text-align: right;

}





.section-3 .panel-body{
  padding: 40px 60px;
  border: 1px dashed #FFF;
margin: 0 50px;
}

.panel-clear .the-icon {
border: 1px dashed #FFF;
height: 77px;
width: 77px;
}
.section-1 .the-icon {
float: right;
margin-left: 20px;
}
.section-2 .the-icon {
float: left;
margin-right: 20px;
}
.section-3 .the-icon {
float: left;
margin-right: 20px;
height: 150px;
width: 280px;
border-color: transparent;
margin-top: 10px;
}
.section-3 h1 {
	margin-top: 0;
}

.section-3 .the-icon span {
display: none;
}

@media (max-width: 1380px) {
.section-1 h1,
.section-2 h1 {
	clear: both;
}

}

@media (max-width: 1200px) {
.section-1 {
text-align: left;
}
.page-toolkit .accent-arrow.white{
	display: none;
}

.panel-clear {
margin-bottom: 20px;
}

.section-3 .panel-body {
padding: 20px;
border: none;
margin: 0;
}

.panel-clear .panel-body {
padding: 20px;
}

.intro-text {
margin-left: 10px;
}

.section-3  {
clear: both;
}


.section-1 .the-icon,
.section-2 .the-icon,
.section-3 .the-icon {
float: left;
margin: 0px;
border: none;
height: 77px;
width: 77px;

}

.section-3 .the-icon span {
display: block;
}
.section-3 .the-icon img {
display: none;
}

.section-1 h1, .section-2 h1 {
clear:none;
}


}

/* =Home Page
--------------------------------------------------------------------------------------------------------*/


	.homedark{
			background-color: #2D2E2D;

	}
#text-intro{
	margin-top: 10%;
		margin-bottom: 5%;
	padding: 1px 0 30px;
	font-weight: 300;
	line-height: 1.8em;
	min-height: 190px;

}
#text-intro h1{
	 font-size: 34px;
	 letter-spacing: 2px;

}
#text-intro h1,
#text-intro div.sub {
    display:none;
}

#text-intro div.sub{
    color:#fff;
    font-size: 20px;
	letter-spacing: 1px;
    position:absolute;
    left:0px;
    /*left:2000px;*/
  /*  top: 66px;*/
}




.page-home .the-icon{
	padding-top: 10px;
}

.page-home .the-icon span{
	font-size: 4em;
color: #000;
}
	.snapshot{
		height: 100%;
		padding-top: 70px;
			padding-bottom: 40px;
	}
.snapshot .welcome{
margin-bottom: 40px;
background-color: #C7CB82;
border-bottom: 1px solid #000;
padding-bottom: 10px;
text-align: center;
border-top: 1px solid #000;
padding-top: 10px;
font-size: 22px;
	}
	.snapshot h1{
	margin: 0;
	font-size: 34px;
	}

		.snippit{
		color: #000;
		padding-top: 12px;
	}
	.snapshot{
		position: relative;
	}

	.snapshot-line{
	position: absolute;
	left: 43%;
	top: 0;
	height:100%;
	}


.snapshot-line:after {
	content: "";
	position: absolute;
	z-index: -1;
	top: 0;
	bottom: 0;
	left: 50%;
	border-left: 1px solid #000;
}
.snapshot-line i.fa-circle {
	color: #872230;
	margin-top: 30px;
	margin-left: 1px;
}

.snapshot-line i.fa-angle-down {
	color:  #000;
position: absolute;
left: 0px;
bottom: -20px;
}

.get-started{

}

.get-started a{
	color: #C7CB82;
	float: right;
	background: #FFF;
	padding: 3px;
	text-transform: uppercase;
	border-radius: 5px;
	letter-spacing: 1px;
	margin-right: 70px;
font-weight: 600;
}
.page-home  .icon-arrow-left{
	float: right;
	font-size: 20px;
	color:#000;
}




@media (min-width: 1300px) {
	#text-intro h1{
	 font-size: 44px;

	}




	#text-intro div.sub1,
#text-intro div.sub2,
#text-intro div.sub3{
    top: 90px;
}

}


@media (min-width: 1500px) {
	#text-intro h1{
	 font-size: 47px;

	}
			#text-intro div.sub1,
#text-intro div.sub2,
#text-intro div.sub3{
    top: 90px;
}

}

@media (min-width: 1600px) {
	#text-intro h1{
	 font-size: 68px;

	}
	#text-intro div.sub1,
	#text-intro div.sub2,
	#text-intro div.sub3{
	    top: 110px;
	}
}


@media (max-width: 700px) {
		.right-align {
		text-align: left;
		}
		.snapshot-line {
		left: 3%;
		}
		.snapshot .right-align,
		.snapshot .snippit{
			padding-left: 14%;
		}

		.snapshot .welcome {
		text-align: left;
		font-size: 18px;
		}


		.page-home .the-icon {

float: left;
padding-right: 10px;
}

}


@media (max-width: 340px) {
	#text-intro{
		min-height: 160px;
		margin: 20px;

	}

	#text-intro h1 {
	font-size: 26px;
	}

	#text-intro div.sub{
		font-size: 16px;
	}

}








/* =Footer
--------------------------------------------------------------------------------------------------------*/



@media (min-width: 992px) {
	footer {
    position: absolute;
    left: 0;
    bottom: 0;
    min-height: 116px;
    height: auto;
    width: 100%;
	}
	body.page-toolkit,body.home {
    margin: 0 0 116px; /* bottom = footer height */
	}
}
.footer-left{
	    /*background-color: #FFF;
	    height: 116px;*/

}
.home .site-footer,.page-toolkit .site-footer{
	    background: #000;

}
.social-info{
		    border-top: 1px solid #872230;
}
.site-footer{

	color: #FFF;
}

.site-info {
padding: 0 60px;

}

@media (max-width: 768px) {
.site-info {
padding: 0 20px;
}
}

@media (max-width: 400px) {
.site-info {
padding: 0 10px;
}
.site-footer .quote {
padding: 10px 10px 0;
}

.quote {
padding: 10px 20px 0;
}

.quote i {
font-size: 1em;
}

.site-footer .quote .fa-quote-left {
left: -16px;
}
.site-footer .quote .fa-quote-right {
right: -16px;
}


.quote .source {
margin-right: -16px;
}

}

/* =Bootstrap addon stlyes
--------------------------------------------------------------------------------------------------------*/



.video-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; }
.video-container iframe, .video-container object, .video-container embed, .video-container video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }



/* =fluidBox
--------------------------------------------------------------------------------------------------------*/

.fluidbox {
	outline: none;
}

.fluidbox img {
	cursor: -webkit-zoom-in;
cursor: -moz-zoom-in;
}
.fluidbox-overlay {
	cursor: pointer;
	cursor: -webkit-zoom-out;
	cursor: -moz-zoom-out;
	opacity: 0;
	position: fixed;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	transition: .25s ease-in-out;
}
.fluidbox-wrap {
	background-position: center center;
	background-size: cover;
	margin: 0 auto;
	position: relative;
	transition: .25s ease-in-out;
}
.fluidbox-ghost {
	background-size: cover;
	background-position: center center;
	position: absolute;
	transition: .25s ease-in-out;
}


/* =Home Sldier
--------------------------------------------------------------------------------------------------------*/
#slidr-div{
margin: 100px auto 0;
padding: 1px 0 30px;
font-weight: 300;
line-height: 1.8em;
white-space: nowrap;
min-height: 190px;
}

#slidr-div strong{
color:#872230;
}

#slidr-div h1{
 font-size: 28px;
 letter-spacing: 2px;

}
#slidr-div li{
font-size: 20px;
 letter-spacing: 1px;

}

aside[id="slidr-div-breadcrumbs"] {
  left: -17px !important;
 bottom: -26px !important;
}

aside[id="slidr-div-breadcrumbs"] .slidr-breadcrumbs li {
  width: 20px !important;
  height: 20px !important;
  margin: 8px !important;
}

aside[id="slidr-div-breadcrumbs"] .slidr-breadcrumbs li.normal {
  border-color: transparent !important;
    background-color: #FFF !important;
}

aside[id="slidr-div-breadcrumbs"] .slidr-breadcrumbs li.active {
  background-color: #C4232D !important;
}


@media (min-width: 1300px) {
	#slidr-div h1{
	 font-size: 34px;

	}
	#slidr-div {
	margin: 200px auto 0;
	}
}


@media (min-width: 1500px) {
	#slidr-div h1{
	 font-size: 42px;

	}
}

@media (min-width: 1600px) {
	#slidr-div h1{
	 font-size: 68px;

	}
}



@media (max-width: 768px) {
h1{
	font-size: 30px;
}
h1.larger {
font-size: 40px;
}
.panel-clear .panel-body h1 {
font-size: 40px;
}

.panel-clear .panel-body {
padding: 0px;
}

.intro-text {
clear: both;
}

}


@media (max-width: 480px) {

	h3.brought-to { font-size: 34px; }

	.the-logo{
		display: none;
	}

	.panel-methods .panel-body {
	padding: 0;
	}
	.panel-methods .the-icon {
	height: 50px;
	width: 50px;
	margin-right: 10px;
	}
	.panel-methods .the-icon [class^="icon-"], .panel-methods .the-icon [class*=" icon-"] {
	font-size: 3em;
	}
	.panel-methods {
	margin-bottom: 20px;
	padding-bottom: 20px;
	}

	ul, ol {
	padding-left: 20px;
	}
	.resource-header h1{
		margin-top: 50px;
		font-size: 24px;
	}


}

/* centered columns styles
	http://www.minimit.com/articles/solutions-tutorials/bootstrap-3-responsive-centered-columns
*/
.row-centered {
    text-align:center;
}
.col-centered {
    display:inline-block;
    float:none;
    /* reset the text-align */
    text-align:left;
    /* inline-block space fix */
    margin-right:-4px;
}





/* =columns of same height styles
--------------------------------------------------------------------------------------------------------*/
.container-sm-height {
    display:table;
    padding-left:0px;
    padding-right:0px;
}
.row-sm-height {
    display:table-row;
}
.col-sm-height {
    display:table-cell;
    float:none;
}
@media (min-width: 768px) {
    .container-sm-height {
        display:table;
        padding-left:0px;
        padding-right:0px;
    }
    .row-sm-height {
        display:table-row;
    }
    .col-sm-height {
        display:table-cell;
        float:none;
    }
}
@media (min-width: 992px) {
    .container-md-height {
        display:table;
        padding-left:0px;
        padding-right:0px;
    }
    .row-md-height {
        display:table-row;
    }
    .col-md-height {
        display:table-cell;
        float:none;
    }
}
@media (min-width: 1200px) {
    .container-lg-height {
        display:table;
        padding-left:0px;
        padding-right:0px;
    }
    .row-lg-height {
        display:table-row;
    }
    .col-lg-height {
        display:table-cell;
        float:none;
    }
}

/* vertical alignment styles */
.col-top {
    vertical-align:top;
}
.col-middle {
    vertical-align:middle;
}
.col-bottom {
    vertical-align:bottom;
}