/*
  Max Tax
  Author: Bao Kim Tran
  Version: HTML 5, CSS 3
  Date: 07.15.2015

  Filename: 				midrange.css

    Supporting files:	home.htm, tax.htm, accounting.htm, aboutus.htm, contactus.htm, calendar.htm, gallery.htm, resources.htm 
     		
*/

#leftSpeaker  {
	  background-color: none;
}

#beginProgram  p {
text-align: Left;
}

#canvas {
	display: none;
}

@media only screen and (min-width: 1100px) {
	#leftSpeaker  {height: 380px; background-color: rgb(145, 5, 10);}
	#beginProgram  p {text-align: right;}
}

@media only screen and (min-width: 1280px) {
	#leftSpeaker  {height: 380px;background-color: rgb(145, 5, 10);}
}

@media only screen and (min-width: 1100px) {
	#canvas {	display: block; width: 40%;}
}

#canvas {
	float: left;

	height: auto;
	margin: 50px 0 0 10%;
	padding: 0 0 0 0;
	border: 0px solid white;
  }

#beginProgram  p {
  list-style-type: none;
  margin:  0 0 7px 0;
	padding: 8px 14px 8px 8px;
  background-color: rgb(145, 5, 10);
  color: #ffffff;
	border: 0px solid yellow;
}

#beginProgram  p a{
	text-decoration: none;
	color: white;
}

#beginProgram  p:hover {
  background-color: orange;
}

#beginProgram  a:hover {
	text-decoration: underline;
	color: rgb(145, 5, 10);
}

#centerSpeaker {
	margin: 0 0 0 0;
	z-index: 100;
}

h1 {
	font-size: 1.2em; 
}

h4 {
	font-size: .8em; 
}

address, li, p {
	font-size: .8em; /* set font size for Chrome (16px/16=1em) */
}

@media only screen and (min-width: 600px) {
	h1 {font-size: 1.5em;}
	h4 {font-size: 1.2em;}
	address, li, p {font-size: 1em;} /* set font size for Chrome (16px/16=1em) */
}

@media only screen and (min-width: 768px) {
	h1 {font-size: 1.5em;}
	h4 {font-size: 1.2em;}
	address, li, p {font-size: 1em;} /* set font size for Chrome (16px/16=1em) */
}

h1{
	width: 100%;
	margin: 0 0 0 0;
	padding: 2% 0% 2% 0;
	text-align: center;
	color: white;
	background-color: rgb(145, 5, 10);
}

h4 {

	font-weight: bold;
	padding: 0;
	margin: 0;
	color: rgb(145, 5, 10);
}

ul {
	list-style-type: square;
}

table {
	width: 100%; 
	table-layout: fixed;
	margin: auto auto; 
}



figure {
 margin: 0;
 padding:0;
}

img {
  width: 100%;
  height: auto;
}

article img {

}


.backVocal {

	background-color: rgb(255,255,245);
	padding: 2%;
}





.song figure {
	text-align: center;
	color: rgb(145, 5, 10);
}

.song tr td {
	background-color: rgb(255,255,245);
	padding: 2%;
	border-radius: 6px 6px 6px 6px;
}

.song tr{
	vertical-align: top;
}

.title p {
	font-weight: bold;
	color: rgb(145, 5, 10);
}

#rightSpeaker {
	display: none;
}

#calc {
	display: none;	
}
	
@media only screen and (min-width: 1280px){
	#rightSpeaker  {display: block;}

}

@media only screen and (min-width: 1100px) {
	#calc {display: block;}
}

#rightSpeaker  {
	height: 380px;
	margin: 0 0 0 0;
	padding: 0;
  background-color: rgb(145, 5, 10);
  padding: 15px;
  color: #ffffff;
  text-align: center;
  font-size: 14px;
}

#calendar_table   {
	background-color: rgb(255,255,245);
	font-size: 9pt;
  border-style: outset;
	border-width: 5px;
	border-color: lightgray;
	margin: 0 0 0 0;
}

#calendar_head  {
	color: white;
	background-color: rgb(145, 5, 10);
	letter-spacing: 2px}

.calendar_weekdays {
	color: black;
	font-size: 10pt; 
	border-bottom-style: solid;
}

.calendar_dates   {
	text-align: center;
	color: black;
	background-color: rgb(255,255,245);
}

#calendar_today  {
	font-weight: bold;
	color: rgb(223,29,29);
	background-color: ivory;
	border: 1px solid black;
}
						
#calc {
	width: 54%;
	table-layout: fixed;
	text-align: center;
	font-weight: bold;
	background-color: rgb(255,255,245);
	border-style: outset; 
	border-width: 5px;
	border-color: lightgray;
}

#calc  tr td input {
	width: 100%;
}