/* Basic Styles */
  
	body {
	margin: 0 auto;
	}
  
/* Header Styles */

	#header {
    max-width: 960px;
    min-width:320px;
	height: auto;
	margin-left: auto;
	margin-right: auto;
	}

    .byline {
    max-width: 960px;
    min-width:320px;
	height: auto;
	border-top-style: solid;
	border-top-width: 1px;
    border-top-color: #3ee560;
	margin-left: auto;
	margin-right: auto;
	}
  
    .byline-image {
	width: 56px;
	height: 55px;
	float:left;
	background-image: url("file:///Users/ecarter/Desktop/happy2015/images/byline_logo.png")
	}
  
    .byline-image:hover {
	background-image: url("file:///Users/ecarter/Desktop/happy2015/images/byline_logo_ro.png")
	}
  
	.byline-text {
	width: 240px;
	float: left;
	padding: 18px;
	border-bottom-style: solid;
	border-bottom-width: 1px;
    border-bottom-color: #3ee560;
    border-right-style: solid;
	border-right-width: 1px;
    border-right-color: #3ee560;
	}
    
    .title {
    max-width: 960px;
    min-width: 320px;
    padding-top: 30px;
  	margin-left: auto;
	margin-right: auto;
	border-bottom-style: solid;
	border-bottom-width: 1px;
    border-bottom-color: #3ee560;
	}
  
    .content {
  	max-width: 960px;
  	min-width: 320px;
  	height: auto;
 	margin-left: auto;
	margin-right: auto;
	}

/* Button Styles */
 	
  	.button {
  	width: 370px;
  	height: 90px;
  	margin: 5%;
	margin-right: 96px;
  	margin-top: 10%;
  	margin-bottom: 10%;
  	text-align: center;
    float: left;
    background-image: url("file:///Users/ecarter/Desktop/happy2015/images/quiz_button.png");
	}
  
	.button-text {
	vertical-align: center;
	}

	.button:hover {
  	background-image: url("file:///Users/ecarter/Desktop/happy2015/images/quiz_button_ro.png");
  	color: #fffff;
	}
  
/* Subpage Styles */

	.header-subpages {
    max-width: 960px;
    min-width:320px;
  	height: 100%;
  	max-height: 140px;
  	margin-bottom: 5px;
  	margin-top: 5px;
  	margin-left: auto;
	margin-right: auto;
	}
  
    .header-subpages:hover {
	opacity: .5;
	transition: opacity .05 ease-in-out;
	-moz-transition: opacity .05s ease-in-out;
	-webkit-transition: opacity .05s ease-in-out;
	}
 	  
	.option-wrapper {
	width: 430px;
	height: 600px;
	float: left;
	}
	
	.or-wrapper {
	width: 96px;
	height: 700 px;
	float: left;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	padding-top: 200px;
	padding-bottom: 200px;
	}		
	
	.image-choice {
	width: 430px;
	height: 430px;
	border-style: solid;
	border-width: 1px;
    }
    
	.image-choice:hover {
	opacity: .75;
	transition: opacity .05s ease-in-out;
	-moz-transition: opacity .05s ease-in-out;
	-webkit-transition: opacity .05s ease-in-out;
    }

    .button-choice {
  	width: 430px;
  	height: 90px;
  	margin-top: 10%;
  	margin-bottom: 10%;
  	text-align: center;
    background-image: url("file:///Users/ecarter/Desktop/happy2015/images/choice_button.png");
    clear: both;
	}

    .button-choice-text {
	padding-top: 1px;
	}

	.button-choice:hover {
  	background-image: url("file:///Users/ecarter/Desktop/happy2015/images/choice_button_ro.png");
	}
  
   	.caption {
   	background-color:#ffffff;
   	text-align: left;
   	width: 355px;
   	height: auto;
    padding: 45px;
    float: left;
	}
	
	
/* Result Page Styles */

	.result-title-wrapper {
	max-width: 960px;
	min-width: 320px;
    height: auto;
    margin-left: auto;
    margin-right: auto;
    margin-top: 5%;
    text-align: left;
    clear: both;
    }
	
    .result-title {
	max-width: 600px;
	min-width: 320px;
    height: 300px;
    margin-left: 60px;
  	float: left;
	}

   	.result-smiley {
   	width: 116px;
   	width: 116px;
   	margin: 60px;
    float: left;
    margin-top: 40px;
    padding: 10px;
    }	
	
	.result-wrapper {
	max-width: 960px;
	min-width: 320px;
    height: auto;
    padding: 5%;
    margin-left: auto;
    margin-right: auto;

    }
    
	.result-caption {
   	background-color:#ffffff;
   	text-align: left;
   	width: 300px;
   	height: auto;
    padding: 15px;
    margin-right: 15px;
    float: left;
    border-style: solid;
	border-width: 1px;
    border-color: #fff000;
	}
	
	.result-text {
	max-width: 960px;
	min-width: 320px;
    height: auto;
    float: left;
    padding: 45px;
    border-style: solid;
	border-width: 1px;
    border-color: #fff000;
    margin-bottom: 10%;
    }
    
   .button-share {
  	width: 430px;
  	height: 90px;
  	float: left;
  	text-align: center;
  	margin-bottom: 10%;
    background-image: url("file:///Users/ecarter/Desktop/happy2015/images/choice_button.png");
	}
	
	.button-share-text {
	padding-top: 1px;
	}
  
/* Footer Styles */  

  	#footer {
    max-width: 960px;
    min-width: 320px;
    height: auto;
    clear: both;
    padding: 20px;
    margin-left: auto;
    margin-right: auto; 
    clear: both;
	}
  
    .buttons-wrapper {
	margin-left: 25%;
	margin-right: 25%;
	min-height: 75px;
	}
  
    .social-buttons {
    width: 30px;
    height: 30px;
    margin: 20px;
    float: left;
    padding: 10px;
	border-style: solid;
	border-width: 1px;
    border-color: #ffffff;
	}
	
	.social-buttons:hover {
	opacity: .5;
	transition: opacity .05s ease-in-out;
	-moz-transition: opacity .05s ease-in-out;
	-webkit-transition: opacity .05s ease-in-out;
	}
  

 
/* Pattern Image Styles */ 
 
	#pattern-image {
  	max-width: 960px;
  	min-width: 320px;
  	height: auto;
 	margin-left: auto;
	margin-right: auto;
	}
  
    /*Text Styles */
    
    h1 { 
    font-family: 'LolitaBlack', sans-serif;
    font-weight: normal;
    color: #3ee560;
    font-size: 7em ;
  	line-height: 125%;	
    }
      
      
    h1:hover { 
    color: #ffffff;
    }
    
    h2 { 
    font-family: 'LolitaBlack', sans-serif;
    font-weight: normal;
    color: #3ee560;
    font-size: 5em ;
  	line-height: 125%;	
  	text-align: left;
    }
      
      
    h2:hover { 
    color: #ffffff;	
    }
    
	h3 {
    font-family: 'LolitaBlack', sans-serif;
    font-size: 2em;
    letter-spacing: .125em;
    text-decoration: none;
    text-transform: uppercase;
    font-weight: normal;
    color: #000000;
    }
    
    h4 {
    font-family: 'LolitaBlack', sans-serif;
    font-size: 1.5em;
    letter-spacing: .0625em;
    text-decoration: none;
    text-transform: uppercase;
    font-weight: normal;
    color: #000000;
    }
    
    byline {
    font-family: 'SkyhookMono', monospace;
    font-size: 1em;
    line-height: 100%;
    vertical-align: center;
    }
    
    or {
    font-family: 'LolitaBlack', sans-serif;
    font-size: 1.5em;
    text-transform: uppercase;
    font-style: oblique;
    line-height: 100%;
    vertical-align: center;
    }
    
    
    p1 {
    font-family: 'SkyhookMono', monospace;
    font-size: 1em;
    line-height: 125%;
    }
    
    p2 {
    font-family: 'LolitaBlack', sans-serif;
    color: #007e49;
    font-size: 2em;
    line-height: 125%;
	font-style: oblique;
    }
    
    p3 {
    font-family: 'SkyhookMono', monospace;
    font-size: 1em;
    letter-spacing: .01em;
    line-height: 125%;	
    }
    
    p4 {
    font-family: 'LolitaBlack', sans-serif;
    font-weight: normal;
    color: #ffffff;
    letter-spacing: .01em;
    font-size: 2em;
    line-height: 150%;
    }
        
    a {
	text-decoration: none;
	font-style: inherit;
    }