/* Move down content because we have a fixed navbar that is 3.5rem tall */

* {
    padding: 0;
    margin: 0;
}

body {
	font-family: "Helvetica Neue", Helvetica, sans-serif;
	background-color: #e9e9e9;
	color: #373a3c;
  /*padding-top: 6rem;*/
}


.title{
	padding-top: 6rem;
	padding-bottom: 1rem;
	background-color: #fcc753;
}

h1,h2,h3,h4{
	padding-top: 1rem;
}

h1{
	font-size: 2rem;
}
h2{
	font-size: 1.75rem;
}
h3{
	font-size: 1.5rem;
}
h4{
	font-size: 1.25rem;
}

.nopadding {
	padding-right: 0;
	padding-left: 0;
}

.navbar-brand{
	font-size: 1rem;
	font-weight: 300;
    margin: 0 auto;
    padding-top: 0rem;
}
.form-inline{
	margin: 0 auto;
}

.who{
	padding-bottom: 6rem;
	background-color: #ABC0D3;
}

.btn-action{
	color: #373a3c;
    background-color: #fcc753;
    border-color: #fcc753;
    padding: 0.75rem 1rem;
    width: 15rem;
    display: block;
}
.btn-body{
	color: #373a3c;
    background-color: #fcc753;
    border-color: #fcc753;
    padding: 0.75rem 1rem;
    width: 15rem;
    display: block;
    margin-top: 2rem;
    margin-bottom: 3rem;
}

.smallerfont{
	font-size: 12px !important;
	margin-top: 1rem;
}

.white{
	color: #ffffff;
}

.grey-block{
	background-color: #e9e9e9;
}

.white-block{
	background-color: #ffffff;
}

.headshot {
	max-width: 380px;
	width: 100%;
	height: auto;
	margin-top: -50%;
}

.headshot-b {
	background: #6B90B1;
}

.logo {
	display: block;
	height: 80px;
	width: auto;
}

.infographic {
	width: 100%;
	height: auto;
}

.pushtext{
	margin-bottom: 3rem;
}

.result{
	margin-bottom:3rem;
}


/* Counter */
.counter-wrap{
	background: url("../img/homeless-dark.jpg") top no-repeat;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	height: 25rem;
	display: table;

}
.counter-box{
	display: table-cell;
	vertical-align: middle;
}
.counter-box h2{
	padding-top: 0;
}
.counter-box h4{
	padding-top: 1rem;
}
.counter-box .progress{
	height: 1.5rem;
	background-color: white;
}
.counter-box .progress-bar{
	color: #373A3C;
	background-color: #FCC753;
}

.counterh1 {
	color: white;
}
.counterd{
	width: 5rem;

}
.counterbreak{
	color: white;
	border-top: 0.5rem solid #FCC753;
}
.counterp{
	color: white;
	padding-bottom: 1rem;
}
.counter{

}


/* social media section */

.social{
	text-align: center;
	margin: 0;
	padding-right: 0;
}
.socialicons{
	display: inline-block;
	padding: 1rem 1rem;
}

/*.socialicons, .socialicons {
    display: block;

}
.socialicons .fb {
    background: url(../img/fb-icon.png) no-repeat;
    background-size: 40px;
 }
 .socialicons .tw {
    background: url(../img/tw-icon.png) no-repeat;
    background-size: 40px;
 }
 .socialicons .in {
    background: url(../img/in-icon.png) no-repeat;
    background-size: 40px;
 }
 .socialicons .share {
    background: url(../img/share-icon.png) no-repeat;
    background-size: 40px;
 }

 .socialicons ul {
    margin: 0;
    padding: 0;
    text-align: center;
    height: 100%;
    padding-left: 3rem;
    margin-left: -3rem;
}

.socialicons li {
    display: inline-block;
    padding: 1rem 1rem;
    line-height: 1.5rem;
}

.socialicons li a {
    width: 40px;
    min-height: 40px;
    display: block;
}

.socialicons span {
    display: none;
}*/

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

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


/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {
	.navbar-brand{
	    margin-right: auto;
	    margin-left: 0;
	    padding: 0;
	}
	.title{
		padding-top: 5rem;
	
	}	
	.form-inline{
		margin: 0;
	}
	.title h1{
		padding-top: 0;
	}
	.headshot-b {
		background: url("../img/headbreak-sm.png") no-repeat;
	}
	.btn-action{
		width: 12.5rem;
	}
	.btn-body{
		width: 15rem;
	}
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) { 

	h1,h2,h3,h4{
		padding-top: 2rem;
	}
	h1{
		font-size: 2rem;
	}
	h2{
		font-size: 2rem;
	}
	h3{
		font-size: 1.75rem;
	}
	h4{
		font-size: 1.75rem;
	}
	p{
		font-size: 1.125rem;
	}
	.navbar-brand{
		font-size: 1.125rem;
	}
	.title{
		padding-top: 6rem;
	}
	.who{
		padding-top: 0;
		padding-bottom: 8rem;
	}
	.btn-action{
		font-size: 1.125rem;
		width: 15rem;
	}
	.btn-body{
		font-size: 1.125rem;
		width: 17.5rem;
	}
	.headshot-b {
		background: url("../img/headbreak-md.png") no-repeat;
	}
	.counter-wrap{
		height: 32rem;
	}

}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
	
	h1,h2,h3,h4{
		padding-top: 2.5rem;
	}
	h1{
		font-size: 2.75rem;
	}
	h2{
		font-size: 2.625rem;
	}
	h3{
		font-size: 2.25rem;
	}
	h4{
		font-size: 2.25rem;
	}
	p{
		font-size: 1.25rem;
	}
	.navbar-brand{
		font-size: 1.5rem;
	}
	.who{
		padding-bottom: 10rem;
	}
	.headshot-b {
		background: url("../img/headbreak-lg.png") no-repeat;
	}
	.btn-action{
		width: 17.5rem;
		font-size: 1.25rem;
	}
	.btn-body{
		width: 20rem;
	    font-size: 1.25rem;
	    padding: 1.25rem 1.5rem;
	}
	.logo {
   		height: 100px;
   		margin-bottom: 1rem;
	}
	.counter-wrap{
		height: 42rem;
	}

}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {

	h1,h2,h3,h4{
		padding-top: 3rem;
	}
	h1{
		font-size: 3rem;
	}
	h2{
		font-size: 2.75rem;
	}
	h3{
		font-size: 2.5rem;
	}
	h4{
		font-size: 2.5rem;
	}
	p{
		font-size: 1.5rem;
	}
	.navbar-brand{
		font-size: 1.75rem;
	}

	.who{
		padding-bottom: 14rem;
	}
	.headshot-b {
		background: url("../img/headbreak-xl.png") no-repeat;
	}
	.logo {
   		height: 120px;
   		margin-bottom: 1rem;
	}
	.btn-action{
		width: 22.5rem;
		font-size: 1.5rem;
		padding: 1rem 1.5rem;
	}
	.btn-body{
		width: 22.5rem;
	    font-size: 1.5rem;
	    padding: 1.5rem 1.75rem;
	}
	.counter-wrap{
		height: 45rem;
	}
}