* {-webkit-box-sizing: border-box; box-sizing: border-box; margin: 0; padding: 0;}
        body {
            background: #fff;
            color: #58595b;
            font-family: "proxima-nova", Helvetica, Arial, Sans-Serif;
            font-weight: 300;
            font-size: 80%;
            margin: 0;
            padding: 0;
        }
        p {line-height: 150%;}
        img {
            height: auto;
            max-width: 100%;
            -ms-interpolation-mode: bicubic;
        }
        a {color: #58595b; text-decoration: none;}
       
       h1, h2, h3 {font-weight: 400; margin: 1em 2em; clear: both;}
       .noleftgap {margin: 1em 2em 1em 0;}
       h3.noleftgap {padding: 1em 0; line-height: 140%;}
       
       h1 {font-size: 2.2em; color: #6d6e71; letter-spacing: 1px;}
       h1.head {font-weight: 300; margin: 2.5em 0 2em 3em; clear: none; float: left; width: 60%; letter-spacing: 3px;}
       
       h2 {font-size: 1.6em; color: #58595b; text-align: center;}
       
       .clearfix:before, .clearfix:after {
	       content: '';
	       clear: both;
	       display: table;
       }
       
       .vidwrapper {width: 100%; height: 550px; background-color: #000;}
       .container-black {
	       background: #f5f5f5;
	       width: 100%;
	        margin-bottom: 20px;
       }
	   .vidwrap { max-width:70%; margin: 0 auto;}       
       .embed-container { 
       		position: relative; 
  /*
     		padding-bottom: 56.25%; 
       		height: 0; 
*/
       		overflow: hidden;
       		margin: 0 auto;
       		max-width: 800px; 
       		width: 100%; 
   		} 
       /* .embed-container > iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } */
       
       .light {font-weight: 300;}
       
       .blue {color: #78b2b5;}
       
       .heavy {font-weight: 600;}
       
       .contact {font-size: 2.1em; font-weight: 400;  margin: 2.5em 0;}
       .details {width: 90px; float: left;}
       img.facebook {max-width: 19px; margin-right: 20px;}
       .phone {width: 25%; float: left;}
       .contact {letter-spacing: 2px;}
       img.email {max-width: 30px;}
       .facebook img {max-width: 18px;}
       
       .quote {width: 60%; margin: 1em auto; line-height: 170%; letter-spacing: 1px;}
       
       
       .spaced {letter-spacing: 2px;}
       .ratherspaced {letter-spacing: 3px;}
       
       .bigger {font-size: 1.7em;}
       
       .blueslab {width: 100%; background: #78b2b5; }
       .blueslab p {
	       font-size: 2em;
		   font-weight: 500;
		   color: #fff;
		   padding: 2.4em 0;
		   text-align: center;
		   letter-spacing: 5px;
       }
       
       .text {margin: 2em 1em 0 1em; font-size: 1.4em;}
       .col {width: 28%; margin: 0 25px 1em 0; float: left;}
       .fourcol {width: 22%; margin: 0 25px 1em 0; float: left;}
       
       .boxwrap {margin: 0 -1em 0 1em; }
       .boxwrap:after {clear: both; content: ""; display: block; }
       .box {width: 23%; float: left; margin: 0 15px 15px 0; background: #e5e5e2; font-size: 1.5em; padding: 30px; min-height: 200px; line-height: 150%;}
       
       .spaceabove {margin-top: 3em;clear:both; padding-top: 1.5em;}
       .extraabove {padding: 15px 0 7px 0;}
       .extrabelow {padding: 7px 0 15px 0;}
       
        .main {
            position: relative;
            max-width: 1400px;
            min-height: 800px;
            margin: 0 auto;
            overflow: hidden;
            padding: 0;
        }
        
        .logo {
            display: block;
            margin: 0 auto 64px;
            max-width: 66%;
        }
        .button {
          
        }
        
        .clear {clear:both;}
        
        .imgquote {display: block; margin-bottom: 30px;}
        .imgnoquote {display: none;}
        .disappearing {display: none;}
        .appearing {display: block; margin: 0;}
        .lineappearing {display: inline-block; margin: 0 5px 0 5px;}
        .mobilebreak {display:none;}
        .donportrait {position: relative; float: left; margin: 0 2.5em 1.5em 0;}
        .donpic {position: relative;}
        
        .babyblue {background: #cee2e4; width: 100%; }
        
        
        .footer {background: #cee2e4; width: 100%; height: 228px; position: relative;}
        
        .footer .contact {position: absolute;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    width: 340px;}
    
    .footer .mail {margin-right: 20px; float: left;}
    
    .footer .phone {width: auto;}
    
    
        
        .returntotop {position: absolute; right: 20px; top: 100px; width: 40px; }
        .returntotop img {max-width: 25px;}
        
        @media screen and (max-width: 1090px) {
        .box {width: 30%;}
        }
        
        @media screen and (max-width: 1060px) {
        h1.head {clear:both; width: 80%; margin: 1em auto; text-align: center; float: none;}
        .contact {clear:both; float:none; width: 80%; margin: 1em auto;text-align: center;}
        img.email {max-width: 45px;}
        img.facebook {max-width: 28px;}
        
        .fourcol {width: 66%;}
        }
        
        @media screen and (max-width: 888px) {
        
        
        .box {width: 45%;}
        .donpic {
            text-align: center;
        }
        .donportrait {
            display: inline-block;
            float: none;
            margin: 0;
        }
        .fourcol {width: 90%; margin: 0 2em 1em 2em; }
        
        .footer .phone {clear:both; float: none;}
        .footer .mail {float:none; margin: 0 auto 10px auto;}
	      
        }
        
        @media screen and (max-width: 680px) {
        
        .imgquote {display: none;}
        .imgnoquote {display: block;}
        .disappearing {display: block;}
        img.disappearing {
            width: 100%;
        }
        .appearing, .lineappearing {display: none;}
        .mobilebreak {display:block; margin-bottom: 10px;}
        .mobilebreak:after {content: ''; clear:both;}
        .box {padding: 20px;}
        .col {
            width: 83%; 
            margin: 0 1em 1em 20px; 
            float: none;
        }
		.noleftgap {margin: 1em 2em 1em 20px;}
		
		.babyblue {background: #fff;}
         
	      
        }
        
        @media screen and (max-width: 540px) {

        .fourcol {width: 83%; margin: 0 1em 1em 1em; }
        .donportrait {float: none; width: 70%; margin: 0 0 1.5em 0;}
        
        .blueslab p {font-size: 1.7em; padding: 1em 0;}
        
        h2.quote {font-size: 1.4em; font-weight: 600; width: 75%;}
}

	@media screen and (max-width: 520px) {
	.box {width: 95%; float: none; margin: 0 0 15px 0; font-size: 1.4em; padding: 25px; min-height: 0;}
	}
        
        
        @media screen and (max-width: 450px) {
        		        
		        .donportrait {float: none; width: 100%; margin: 0 0 1.5em 0;}
		        .returntotop {top: auto; right: 43%; bottom: 5px;}
		        
        }