Please use an inliner tool to convert all CSS to inline as inpage or external CSS is removed by email clients 
 When use in Email please remove all comments as it is removed by Email clients
 important in CSS is used to prevent the styles of currently inline CSS from overriding the ones mentioned in media queries when corresponding screen sizes are encountered 


body {
	margin: 0;
}
body, table, td, p, a, li, blockquote {
	-webkit-text-size-adjust: none!important;
	font-style: normal;
	font-weight: 400;
}
.title	{
font-size: 32px; 
font-weight: 300; 
color:#CC6600; 
font-family: Garamond, Times New Roman, serif;
}

.titleSmaller	{
font-size: 22px; 
font-weight: 300; 
color:#60421A; 
font-family: Garamond, Times New Roman, serif;
}

.pageText	{
font-size: 18px; 
font-weight: 300; 
color:#60421A; 
font-family: Garamond, Times New Roman, serif;
}

button	{
	width:90%;
}
a {	
	color:#CC6600;
	text-decoration: none;
}
a:hover {	
	color:#CC3300;
	text-decoration: none;
}
.nav {
	font-family:"Segoe UI", Verdana, sans-serif;
	background-color:#60421A;
	font-size:14px;
	font-weight:800;
}
.nav a	{
	color: #FFFFFF;
	text-decoration:none;
}
.nav a:hover {
	color:#99FF00;
	text-decoration:none;
}
.footertext {
	font-family:"Segoe UI", Verdana, sans-serif;
	font-size:11px;
	color:#CC6600;
}
@media screen and (max-width:800px) {
/*styling for objects with screen size less than 600px; */
body, table, td, p, a, li, blockquote {
	-webkit-text-size-adjust: none!important;
	font-family:"Segoe UI", Verdana, sans-serif;
}
table {
	/* All tables are 100% width */
	width: 100%;
}
.footer {
	/* Footer has 2 columns each of 48% width */
	height: auto !important;
	max-width: 48% !important;
	width: 48% !important;
}
table.responsiveImage {
	/* Container for images in catalog */
	height: auto !important;
	max-width: 30% !important;
	width: 30% !important;
}
table.responsiveContent {
	/* Content that accompanies the content in the catalog */
	height: auto !important;
	max-width: 66% !important;
	width: 66% !important;
}
.top {
	/* Each Columnar table in the header */
	height: auto !important;
	max-width: 48% !important;
	width: 48% !important;
}
.catalog {
	margin-left: 0%!important;
}
.footertext {
	font-family:"Segoe UI", Verdana, sans-serif;
	font-size:18px;
	color:#CC6600;
}
}
@media screen and (max-width:480px) {
/*styling for objects with screen size less than 480px; */
body, table, td, p, a, li, blockquote {
	-webkit-text-size-adjust: none!important;
	font-family:"Segoe UI", Verdana, sans-serif;
}
table {
	/* All tables are 100% width */
	width: 100% !important;
	border-style: none !important;
}
.footer {
	/* Each footer column in this case should occupy 96% width  and 4% is allowed for email client padding*/
	height: auto !important;
	max-width: 96% !important;
	width: 96% !important;
}
.table.responsiveImage {
	/* Container for each image now specifying full width */
	height: auto !important;
	max-width: 96% !important;
	width: 96% !important;
}
.table.responsiveContent {
	/* Content in catalog  occupying full width of cell */
	height: auto !important;
	max-width: 96% !important;
	width: 96% !important;
}
.top {
	/* Header columns occupying full width */
	height: auto !important;
	max-width: 100% !important;
	width: 100% !important;
}
.catalog {
	margin-left: 0%!important;
}
button{
	width:90%!important;
}
.footertext {
	font-family:"Segoe UI", Verdana, sans-serif;
	font-size:20px;
	color:#CC6600;
}