@charset "utf-8";
body {
	font: 90%/1.4 Verdana, Arial, Helvetica, sans-serif;
	margin: 0;
	padding: 0;
	color: #000;
}
/* ~~ Element/tag selectors ~~ */
ul, ol, dl { /* Due to variations between browsers, it's best practices to zero padding and margin on lists. For consistency, you can either specify the amounts you want here, or on the list items (LI, DT, DD) they contain. Remember that what you do here will cascade to the .nav list unless you write a more specific selector. */
	padding: 0;
	margin: 0;
}
h1, h2, h3, h4, h5, h6, p {
	margin-top: 0;	 /* removing the top margin gets around an issue where margins can escape from their containing block. The remaining bottom margin will hold it away from any elements that follow. */
	padding-right: 15px;
	padding-left: 15px; /* adding the padding to the sides of the elements within the blocks, instead of the block elements themselves, gets rid of any box model math. A nested block with side padding can also be used as an alternate method. */
}
h1 {font: bold x-large Arial, Helvetica, sans-serif;
	color:#d21249;}
h2 {font: bold large Verdana, Geneva, sans-serif;
	color:#d21249;
	padding:0;
	margin-bottom:.1em;
	}

a:link, a:visited {
	color: #0a4563;
}
a:hover, a:active, a:focus {color: #d21249;
}

/* ~~ This fixed width container surrounds all other blocks ~~ */
.container {
	width: 99%;
	margin: 0 auto;
	border:0;
	}
/* ~~ The navigation list styles (can be removed if you choose to use a premade flyout menu like Spry) ~~ */
nav {
	background-color:#b9b8b3;
	width:100%;
	height:2.6em;
	margin-bottom:3px;
	border:3px inset #5A5959;
	-webkit-border-radius:15px;
	-moz-border-radius:15px;
	border-radius:15px;
}
nav ul {
	list-style: none;
	 /* this removes the list marker */
	}
nav ul li {
	float:left;
	display:block;
	font:bold 16px/26px Tahoma, Geneva, sans-serif;
	text-align:center;
	width:20%;
}
nav ul a, nav ul a:visited { /* grouping these selectors makes sure that your links retain their button look even after being visited */
	padding: 5px 5px 5px 10px;
	display: block; /* this gives the link block properties causing it to fill the whole LI containing it. This causes the entire area to react to a mouse click. */
	text-decoration: none;
	background: #b9b8b3;
	border-radius: 13px;
	font-weight: bold;
}
nav ul a:hover, nav ul a:active, nav ul a:focus { /* this changes the background and text color for both mouse and keyboard navigators */
	background: #0C587F;
	border-radius: 13px;
	color: #FFF;
}
	

	
/* ~~ The header is not given a width. It will extend the full width of your layout. ~~ */
header {
	background: #e7ddc4;
	-webkit-border-radius:15px;
	-moz-border-radius: 15px;
	border-radius: 15px;
	-webkit-box-shadow: 2px 2px 5px #ee3a43;
	-moz-box-shadow: 2px 2px 5px #ee3a43;
	box-shadow: 2px 2px 5px #ee3a43;
	margin-bottom:5px;
}
header h1 {font: bold xx-large Georgia, "Times New Roman", Times, serif;
	color:#d21249;
	padding-top:.6em;
	padding-bottom:0;
	margin-bottom:0;}
header h2 {font: bold large Georgia, "Times New Roman", Times, serif;
	color:#d21249;
	padding-top:0;}
header p {margin-top:0;
font-weight:bold;}
.CPAlogo {
	float:left;
	width:14%;}
.CPAlogo img {
	padding:.4em 1em;}
.CPAconsult {
	float:left;
	width:63%;}
.CPAsocial {
	float:right;
	width:12%;}
.CPAsocial img {
	padding:.4em 1em;}
.content {
	width: 99%;
	margin: 0 auto;
	float: left;
	background-color:#FFF;
}
h2 {
	padding-top:1em;}
h2.cpa {
	font-size:16px;
	color:#000;}
h1.cpa {
	margin-bottom:.1em;
	padding-left:0;
	margin-left:0;
	margin-top:.3em;
	color:#000;}
h4.webmaster {
	text-align:center;}
.accounting {
	padding-left:10px;}
.webmaster a {
	text-decoration:none;
	color:#373953;}
	
.fbFeed {
    float:right;	
	width:45%;}
.aboutCPA {
    float:left;	
	width:50%;}
	
.NGvideo {
	float:right;
	width:50%;
	}

/* ~~ This grouped selector gives the lists in the .content area space ~~ */
.content ul, .content ol {
	padding: 0 15px 15px 40px; /* this padding mirrors the right padding in the headings and paragraph rule above. Padding was placed on the bottom for space between other elements on the lists and on the left to create the indention. These may be adjusted as you wish. */
}



.logos {
	float:left;
	width:30%;}
.logos img {
	float:right;
	padding:0 1.4em 0 .4em;}
	
.videoIntro {
	float:left;
	min-width:365px;
	width:35%;}
	
.accountant {
	float:left;
	width:60%;}
	
.CPAcontact {
	float:left;
	width:30%;}
	
.contactCPA {
	float:right;
	width:65%;}

.CPApro li a, .CPApro li a:link, .CPApro li a:visited, .CPApro li a:active {
	color:#000000;
	text-decoration:none;
	}	
.CPApro li a:hover, {
	color:maroon;
	text-decoration:none;
	}	
	
form {font:bold 100% Arial, Helvetica, sans-serif;
  min-width: 500px;
  max-width: 750px;
  width: 450px; 
  margin: 0;
  padding: 0;}
form label {display: block;  
	float: left; 
	width: 125px; 
	padding: 0 2px; 
	margin: 5px 0 0; 
	text-align: right;}
form fieldset {
  /* clear: both; */
  border-color: #fbdeb6;
  border-width: 1px;
  border-style: solid;
  padding: 10px;     
  margin: 0;}
form legend {color:#0C587F;
	font:bold 14px Verdana, san-serif;}
form p {display:block;
	margin: 0 0 5px 260px;
	padding: 1px 3px;
	color:#000000;}
form input {display:inline;
width:auto;
color:#000000;
margin:5px 0 0 10px;}
form textarea {display:inline;
width:auto;
margin:5px 0 0 10px;}
.quoteclick {
font-weight:bold;
background-color:#0C587F;
color:#FFFFFF;
border:3px outset #999999;}
.quoteclick:hover {
color:#fbdeb6;
border:3px inset #0C587F;}

/* ~~ The footer ~~ */
footer {
	padding: 10px 0;
	background: #b9b8b3;
	position: relative;
	border-top:#e7ddc4 2px ridge;
	clear: both; 
	border-radius: 0px 0px 15px 15px;
	-webkit-box-shadow: 2px 2px 5px #ee3a43;
	-moz-box-shadow: 2px 2px 5px #ee3a43;
	box-shadow: 2px 2px 5px #ee3a43;
}




/*HTML 5 support - Sets new HTML 5 tags to display:block so browsers know how to render the tags properly. */
header, section, footer, aside, nav, article, figure {
	display: block;
}/* CSS Document */

	
/*phone styles*/
@media only screen and (min-width:0px) and (max-width:720px) {
nav {
	background-color:#fff;
	width:98%;
	height:2.8em;
	margin-bottom:3px;
	border: none; 
	-webkit-border-radius:0px;
	-moz-border-radius:0px;
	border-radius:0px;
}
nav ul {
	list-style: none;
	 /* this removes the list marker */
	 margin-top:7px;
	}
nav ul li {
	background-color:#b9b8b3;
	float:left;
	display:block;
	font:bold 21px/28px Tahoma, Geneva, sans-serif;
	text-align:center;
	border-radius: 15px;
	border:2px solid #0C587F;
	width:100%;
	margin-bottom:7px;
}
nav ul a, nav ul a:visited { /* grouping these selectors makes sure that your links retain their button look even after being visited */
	padding: 5px 5px 5px 10px;
	display: block; /* this gives the link block properties causing it to fill the whole LI containing it. This causes the entire area to react to a mouse click. */
	text-decoration: none;
	background: #b9b8b3;
	border-radius: 15px;
	font-weight: bold;
}
nav ul a:hover, nav ul a:active, nav ul a:focus { /* this changes the background and text color for both mouse and keyboard navigators */
	background: #0C587F;
	border-radius: 15px;
	color: #FFF;
}
.CPAlogo {
	float:left;
	width:100%;}
.CPAlogo img {
	padding:.4em auto;
	margin:0 auto;}
.CPAconsult {
	float:left;
	width:100%;}
.CPAsocial {
	float:right;
	width:100%;}
.CPAsocial img {
	padding:.4em 1em;}
img.anna {
	float:right;
	width:40%;}
	
.CPAcontact {
	float:none;
	width:100%;}
	
.contactCPA {
	float:none;
	width:100%;}
.fbFeed {
    float:none;	
	width:100%;}
.aboutCPA {
     float:none;	
	width:100%;}
.accountant {
	float:none;
	width:100%;}
.videoIntro {
	float:none;
	width:100%;}
.NGvideo {
	float:none;
	width:100%;
	}	
}
	
	
/*tablet styles*/
@media only screen and (min-width:721px) and (max-width:1198px) {
nav ul li {
	float:left;
	display:block;
	height:40px;
	font:bold 12px/16px Tahoma, Geneva, sans-serif;
	text-align:center;
	width:20%;
	}
nav ul a, nav ul a:visited { /* grouping these selectors makes sure that your links retain their button look even after being visited */
	padding: 10px 5px;
	display: block; 
}
nav ul a:hover, nav ul a:active, nav ul a:focus { 
	background: #0C587F;
	border-radius: 15px;
	color: #FFF;
}	
}
	
	
/*desktop styles*/
@media only screen and (min-width:1199px) {
	
}