a img { /* this selector removes the default blue border displayed in some browsers around an image when it is surrounded by a link */
	border: none;
}
/* ~~ Styling for your site's links must remain in this order - including the group of selectors that create the hover effect. ~~ */
a:link {
	color: #333;
	text-decoration: underline; /* unless you style your links to look extremely unique, it's best to provide underlines for quick visual identification */
}
body {
	font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif;
	background: #42413C;
	margin: 0;
	padding: 0;
	color: #000;
}
a:visited {
	color: #666;
	text-decoration: underline;
}
.shabadrahao {
	color: #F00;
	font-weight: bold;
}
.shabadrahao-Dev {
	color: #F00;
	font-weight: bold;
	font-size: 20px;
}
.Shabad-Table {
	background-image: url(images/floral-pale.jpg);
	padding: 10px;
}
.Arth-Table {
	padding: 10px;
}

/* ~~ This fixed width container surrounds all other divs ~~ */
.container {
	width: 960px;
	margin: 0 auto;
	background-image: url(images/majenta-flw.jpeg);
}
.pad-aartha {
	font-size: 20px;
	color: #009;
	background-color: #E8E8E8;
	padding: 10px;
}

/* ~~ The header is not given a width. It will extend the full width of your layout. It contains an image placeholder that should be replaced with your own linked logo. ~~ */
.header {
	background: #A50000;
}
.header2 {
	background-image: none;
	background-color: #A50F00;
}
.content {
	width: 780px;
	color: #BD000D;
	font-size: 22px;
	background-color: #FFF;
	margin: 0 auto;
}

/* ~~ The footer styles ~~ */
.footer {
	padding: 10px;
	position: relative; /* this clear property forces the .container to understand where the columns end and contain them */
	background-color: #A50000;
	color: #FFF;
	font-size: 20px;
}
.shabad {
	color: #C00;
	font-weight: bold;
}
.shabad-Dev {
	color: #C00;
	font-weight: normal;
}
.aartha {
	background-color: #D9D9D9;
	color: #006;
	font-size: 20px;
	padding: 10px;
}
.tool-bar {
	padding-top: 10px;
	padding-right: 10px;
	padding-bottom: 10px;
	padding-left: 10px;
}