/*******************************************
 General
 *******************************************/


/* Remove links decoration i.e. underlines */
a {
	text-decoration: none;
}


/*******************************************
 NAVIGATION BAR
 *******************************************/

#nav-icon {
	/*font-family: 'Cinzel Decorative', cursive;*/
	font-family: 'Metal Mania', cursive;
	font-size: 30px;
	color: #DC7633;

}

#myNavbar {
	font-family: 'Cinzel Decorative', cursive;
	font-size: 15px;
	color: #FE9A2E;

}

/*******************************************
 HEADING
 *******************************************/ 


#KHANDA {
	font-size: 80px;
	color: #000066;
}
#IKONKAR {	
	color: #cc3300;
	font-size: 60px;
}

/*******************************************
 NAVIGATION
 *******************************************/
/*Added from Sample html/css page from w3 schools*/

/* Remove the navbar's default margin-bottom and rounded borders */
.navbar {
  margin-bottom: 0;
  border-radius: 0;
}

/* Set height of the grid so .sidenav can be 100% (adjust as needed) */
.row.content {height: 450px}



.sidenav {
  padding-top: 20px;
  /*background-color: #fff9e6;*/
  /*background-color: FLORALWHITE;*/
  height: 100%;
}

/* Set black background color, white text and some padding */
footer {
  /*background-color: #555;*/
  /*color: white;*/
  padding: 10px;
}

/* On small screens, set height to 'auto' for sidenav and grid */
@media screen and (max-width: 767px) {
  .sidenav {
    height: auto;
    padding: 15px;
  }
  .row.content {height:auto;}
}



/*******************************************
 FOOTER
 *******************************************/

footer {
	padding: 10px;
	font-size: 0.10em;
	text-align: center;
	clear: both; /* make the footer separate than section */
	padding-top: 10px;
	/*color: ROSYBROWN;*/
	
	/*background-color: #fff9e6;*/
	
}

@media screen and (max-width: 700px) {
	.foot {
		font-size: 16px;

	}
}

.main-footer {
	color: SALMON;
	/*background-color: FLORALWHITE;*/

}

/*******************************************
 Page: Japji Sahib
 *******************************************/




/*******************************************
 Page: Jaap Sahib
 *******************************************/




/*******************************************
 COLORS
 *******************************************/

/* change header background color */


/* Links color */

/* Images */
img {
	max-width: 100%;
}

@media screen and (min-width: 250px) {
	.icons {
		display: block;
		max-width: 130px;
		margin: 0 auto 40px;
	}
}

@media screen and (min-width: 350px) {
	.icons {
		display: block;
		max-width: 150px;
		margin: 0 auto 40px;
	}
}

@media screen and (min-width: 1200px) {
		.icons {
		display: block;
		max-width: 180px;
		margin: 0 auto 30px;
		/*border-radius: 100%;*/ /* Used to make picture round. */
	}
}

/* Heading Color */

#head-icon {
	max-width: 300px;
	/*max-height: 10px;*/
	margin: 0 auto 30px;

}

#side-icons {
	max-width: 100px;
	/*max-height: 10px;*/
	margin: 0 auto 10px;

}

#nav-khanda {
	max-width: 30px;
	/*max-height: 10px;*/
	margin: 0 auto 10px;
}

@media screen and (min-width: 400px) {

	#side-icons {
		max-width: 10px;
		/*max-height: 10px;*/
		margin: 0 auto 10px;
	}
}

/* Paragraph Color */
p {
	/*color: #428bca;*/
	color: #2d5986;
	font-size: 26px;
}

/* Site Body color */
body {
	/*background-color: #fff9e6;*/
	background-color: FLORALWHITE;
	/*color: #999;*/
}


body {
    background-repeat: no-repeat;
    background: FLORALWHITE; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(FLORALWHITE, WHITESMOKE, FLORALWHITE); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(FLORALWHITE, WHITESMOKE, FLORALWHITE); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(FLORALWHITE, WHITESMOKE, FLORALWHITE); /* For Firefox 3.6 to 15 */
    background: linear-gradient(FLORALWHITE, WHITESMOKE, FLORALWHITE); /* Standard syntax */
}