html, body {
	height: 100%;
	background-image: url("../images/tmbk2.jpg");
	background-attachment: fixed;
}

body {
	
}

.wrapper {
	max-width: 1000px;
	width:90%;
	background-color:#FFF;
	margin: 0 auto -20px;
	-webkit-box-shadow: 0px 0px 114px -2px rgba(0,0,0,1.5);
	-moz-box-shadow: 0px 0px 114px -2px rgba(0,0,0,1.5);
	box-shadow: 0px 0px 114px -2px rgba(0,0,0,1.5);
}

#content {
	min-height: 500px;
}

img {
  max-width:100%;
 }
 
/* ------------------ Textual Styling --------------- */
h1 {
	font-family: 'EB Garamond';
	font-weight: bold;
	color:#233503;
	font-size:3em;
	line-height: 2em;
	float: left;
	margin-left:10%;
	text-shadow: 2px 2px 3px #999;
}


h2 {
	font-family: "EB Garamond", Sans-Serif;
	font-size: 1.8em;
	font-weight: bold;
  	text-align: left;
	color: #000000;
	text-shadow: 1px 1px 2px #999;
	margin-top: 1em;
	margin-bottom: 1em;
}
	
	
h3 {
	font-size:1.2em;
	font-family: "EB Garamond", sans-serif;
	font-weight: bold;
	text-align:left;
	color: #000000;
	text-shadow: 1px 1px 2px #999;
	margin-bottom: .5em;
}

h4 {
	font-family: Helvetica, Verdana, Arial, Sans-Serif;
	font-size: 1em;
	font-weight: bold;
	margin-bottom: 0;
}
	

hr {
	margin-top: 1em;
	margin-bottom: 1em;
}
  
p {
	font-size:1em; 
	font-family: Helvetica, Verdana, Arial, Sans-Serif; 
	text-align:justify; 
	line-height:1.1em;
	margin-bottom: 1em;
}

.imgCaptionHeader {
	margin-left: 1em;
	margin-top: 1em;
}

.colImgCaption {
	font-family: Helvetica, Verdana, Arial, Sans-Serif;
	font-size: .8em;
	text-align: left;
	color: #000000;
	margin-top:.5em;
	margin-left: 1.2em;
	margin-bottom:.5em;
}

.imgCaption {
	font-family: Helvetica, Verdana, Arial, Sans-Serif;
	font-size: 8pt;
  	text-align: left;
	color: #000000;
	margin-top:0;
	margin: .2em;
	margin-bottom:.5em;
}

a {
	color:#1D43DA;
}

a:visited {
	color: purple;
}

ul.slicknav_nav a:visited {
	color:white;
}

i {
	font-style: italic;
}

b {
	font-weight: bold;
}

.missionstatement {
	width: 75%;
	margin: 0 auto;
	font-family: Helvetica, Verdana, Arial, Sans-Serif;
}

.missionstatement li {
	list-style-image: url(http://tworedroses.com/images/bullet_go.png);
	padding-left: 1em;
	margin-bottom: 1em;
}


/* ------------------ header ------------------- */
#header {
	width:100%;
	background-color: #BBC4AC;
	height: 6em;
	margin:0;
}


.logo {
	float: left;
	max-height: 100%;
	
}


@media screen and (min-width:950px) {
	#header {
		height: 6em;
	}
	
	h1 {
	  font-size: 2.8em;
	  line-height: 2em;
	  float: left;
	  margin-left: 10%;
	}
}



@media screen and (max-width: 950px) {
	h1 {
		font-size:2.4em;
		line-height: 2em;
	}
}


@media screen and (max-width: 855px) {
	h1 {
		font-size: 2.2em;
	}
}


@media screen and (max-width: 800px) {
	h1 {
		font-size: 2em;
		line-height: 3em;
	}
}

@media screen and (max-width: 768px) {
	.wrapper {
		width: 95%;
	}
	
	#header {
		margin: 0 auto;
		height:12em;
	}
	
	.logo {
		clear: both;
		float: none;
		display: table;
		margin: 0 auto;
		padding-top: 1em;
	}
	
	h1 {
		display:table;
		text-align: center;
		font-size: 2em;
		line-height: 1em;
		margin: 0 auto;
		float: none;
	}
	
	h2 {
		display:table;
		text-align: center;
		margin: 0 auto;
		margin-top: 1em;
		margin-bottom: 1em;
	}
	
	.subtitle {
		text-align: center;
	}
}
	
@media screen and (orientation: landscape) and (max-width: 768px) {
	#header {
		height: 10em;
	}
}
		

  
/* ------------------ content ------------------- */


#content .wrap-content{ background: #ffffff;}
 
  
div.line {
	border-top-width:1px;
	border-top-style:dotted;
	border-top-color:#D7D7D7;
}

.btn {
	border-top: 1px solid #A5AE99;
	background: #A5AE99;
	padding: 5px 10px;
	-webkit-border-radius: 19px;
	-moz-border-radius: 19px;
	border-radius: 19px;
	-webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
	-moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
	box-shadow: rgba(0,0,0,1) 0 1px 0;
	text-shadow: rgba(0,0,0,.4) 0 1px 0;
	color: white;
	font-size: 1em;
	font-family: Georgia, serif;
	text-decoration: none;
	vertical-align: middle;
	width: 30%;
	margin-bottom:1em;
	
}

.btn:hover {
   	border-top-color: #8F9784;
   	background: #8F9784;
  	color: #ccc;
}

.btn:active {
   	border-top-color: #1b435e;
   	background: #1b435e;
}

.mortbtn {
	display: table;
	margin: 0 auto;
	width: initial;
}



/* -------------------- column and row -------------------  */ 
 
.wraptext {
	margin:2em;
}

/* -------------------- Just some typeface positioning ----------- */

.welcome {
	width:100%;
	
}

.welcome:after {
	content: "Welcome to the Two Red Roses Foundation";
}


/* ------------------ footer -------------------- */
.trrffooter {
	clear:both;
	background:#4c4c4c;
	color:#fff;
	margin:0;
	padding:1em;
	font-size:.8em;
	margin-top: 7em;
}

.trrffooter a {
	color: #afaeae;
}

.trrffooter a:hover {
	color: #fff;
}

@media screen and (max-width: 736px) {
	.wraptext {
		margin: 1em;
	}
	
	.welcome {
		text-align: center;
	}
	
	.welcome:after {
		content: "Welcome to the \A Two Red Roses \A Foundation";
		white-space: pre;
	}
	
	.btn {
		width: 95%;
		margin: 0 auto;
		margin-top: 1em;
	}
}