﻿/*Body*/

	body {
		font-family: Verdana, Helvetica, Arial, sans-serif; 
		background-color: #3F3A40 /*DARK GREY*/;
		color: #3F3A40 /*DARK GREY*/;
		font-size: 12px; 
		line-height: 125%; 
		padding: 5px; 
		margin: 15px; 
		border: 0px;
		}

/*Headings and content layout*/

	h1 {
		font-weight: BOLD;
		color: #330033 /*DARK PURPLE*/;
		padding: 10px;
		margin: 20px 20px 10px 20px; 
		border: 0px;
		font-size: 22px;
		text-align: left;
		}


	h2 {
		font-weight: BOLD; 
		color: #A31525 /*CHERRY RED*/;
		padding: 10px; 
		margin: 20px 20px 10px 20px;
		border: 0px; 
		font-size: 18px; 
		text-align: left;
		}


	h3 {
		font-weight: BOLD; 
		color: #330033 /*DARK PURPLE*/;
		line-height: 100%;
		font-size: 16px; 
		text-align: left;
		margin: 20px 10px 10px 20px;
		}


	h4 {
		font-weight: BOLD;
		color: #330033 /*DARK PURPLE*/;
		margin: 20px 10px 10px 100px;
		line-height: 120%;
		font-size: 12px; 
		text-align: left;
		}


	h5 {
		font-weight: BOLD;
		color: #A31525 /*CHERRY RED*/;
		margin: 10px 10px 10px 30px;
		line-height: 100%;
		font-size: 12px; 
		text-align: left;
		}


	p {
  		margin: 10px 30px;
		border: 20px;
		}


	ul {
  		margin: 0px 15px 5px 15px;
  		padding: 0px 0px 0px 50px;
		}

	
	li {
  		list-style-type: none;
  		margin: 20px 0px 0px 0px;
  		padding: 0px 0px 0px -50px;
		}



/*Masthead*/

	#masthead, #column1 {
		float: left;
		padding: 10px; 
		margin: 10px;
		width: 95%;
		border: 0px;
		background-color: #D4CAD6 /*LAVENDER*/;
		-webkit-border-radius: 25px;
		-moz-border-radius: 25px;
		border-radius: 25px;
		}


	#tagline {
		margin: 10px;
		padding: 0px; 
		border: 0px;
		}

	#astridmini	
		{
		float: right;
		margin: 0px 15px;
		padding: 10px;
		border: 10px;
		}

/*Navigation Bar*/

	#navlist ul {
		margin: 0px;
		list-style-type: none;
		padding: 0px; 
		margin: 30px 5px;
		border: 20px;
		}


	#navlist li {
		margin: 5px 5px 5px 20px;
		padding: 0px;
		border: 15px;
		list-style-type: none;		
		float: left;
		}


	/*each individual element within navlist*/	
	#navlist a {
    		color: #330033 /*DARK PURPLE*/;
		display: block;
    		margin: 0px 10px;
		font-size: 13px;
		text-align: center;
		}

	#navlist a:hover {
		color: #A31525 /*CHERRY RED*/;
		text-decoration: none;
		border: 0px;
		}

/*Links*/

	a:link, a:visited {
    		color: #42A314 /*YELLOW GREEN*/;
		padding: 0;
		margin: 0;
		font-weight: BOLD;
		border: 0px;
		text-decoration: none;
		}

		
	a:hover {
		color: #A31525 /*CHERRY RED*/;
		text-decoration: none;
		font-weight: BOLD;
		border: 0px;
		}

	
/*Contents*/ /*div ID gets '#'; BUT div CLASS gets '.'	*/
	
	#astrid	
		{
		float: left;
		margin: 20px;
		padding: 15px;
		border: 0px;
		}

	#portrait 
		{
		float: left;
		margin: 5px 20px 20px 20px;
		padding: 15px;
		border: 0px;
		}

	.empathy	
		{
		float: left;
		margin: 20px 20px 10px 20px;
		padding: 15px;
		border: 0px;
		}

	.badger	
		{
		float: left;
		margin: 20px 20px 10px 20px;
		padding: 15px;
		border: 0px;
		}
	
	.kpmg	
		{
		float: left;
		margin: 20px 20px 10px 20px;
		padding: 15px;
		border: 0px;
		}

	.books	
		{
		float: left;
		margin: 20px;
		padding: 20px;
		border: 5px;
		}

	.stories	
		{
		float: left;
		margin: 10px 20px 20px 20px;
		padding: 5px;
		border: 0px;
		}

	.tilt	
		{
		float: right;
		margin: 40px;
		padding: 40px 300px 0px 0px;
		transform: rotate(20deg);
		}


/*contact page:  CSS adapted from 3wschools.com*/

	 /* Style inputs with type="text", select elements and textareas */
	input[type=text], select, textarea {
  	width: 100%; /* Full width */
  	padding: 12px; /* Some padding */ 
  	border: 0px 
  	border-radius: 4px; /* Rounded borders */
  	box-sizing: border-box; /* Make sure that padding and width stays in place */
  	margin-top: 6px; /* Add a top margin */
  	margin-bottom: 16px; /* Bottom margin */
  	resize: vertical /* Allow the user to vertically resize the textarea (not horizontally) */
		}

	/* Style the submit button with a specific background color etc */
	input[type=submit] {
  	background-color: #330033 /*DARK PURPLE*/;
  	color: #ff4500 /*RED ORANGE*/;
  	padding: 12px 20px;
  	border: none;
  	border-radius: 4px;
  	cursor: pointer;
	}

	/* When moving the mouse over the submit button*/
	input[type=submit]:hover {
  	background-color: #42A314 /*YELLOW GREEN*/;
	}

	/* Add a background color and some padding around the form */
	.container {
  	border-radius: 5px;
  	background-color: #D4CAD6 /*LAVENDER*/;
 	padding: 20px;
	} 

/*Footer*/
	#footer {clear: both; margin: 0 auto; color: #ff4500 /*RED ORANGE*/; padding 0; text-align: center; font-size: 10px;}
	#validation {margin: 0; padding: 0;}



