/*replace Federo withsomething else maybe */
/*@import url(http://fonts.googleapis.com/css?family=Federo);*/

@import url("../../../webfonts/Latin-Modern-Roman/stylesheet.css");

/*use for body text*/

@import url("../../../webfonts/SanS_Medium/stylesheet.css");

/* Use for headings and h1, h2*/

@import url("../../../webfonts/AlbertaExtralight/stylesheet.css");

/* use in menus and in some special cases for headings*/

/* Use h1 for main titles, h2 for authors name and chapter or main section names, use h3 for sub headings in chapters and h4 for sub-sub headings. Use h3 if no chapters, and h4 for sub headings 

page numbers and page use h5
copyright use h5 light headline


*/

/*

Put the following below all BBT Images

<br><br>
          <span class="bbt">Image copyright Bhaktivedanta Booktrust, Krishna.com</span>



*/





/* 
  ------------------------------------------------
  PVII Affinity
  Copyright (c) 2013 Project Seven Development
  www.projectseven.com
  02: 2 Col Flex Sidebar Right
  ------------------------------------------------
*/

/* If I change backgrounds this must be adusted */
body {
	/*"Segoe UI", Optima, Helvetica, Arial, sans-serif*/
	color: #000;
	background-color: #2B3B5B;
	margin: 0px;
	padding: 0px;
	font-size: 1.2em;
	padding-bottom: 4em;
	
	font-family: "LatinModernRoman10Regular", Garamond, Cambria, "Lucida Bright", Palatino, "Palatino Linotype", "Bitstream Charter", Georgia, serif;
	
}
img {
	vertical-align: bottom;
}

/*adjusted to take into account image and text added*/

.masthead {
	text-align: left;
	background-color: #252e49;
	position: relative;
	z-index: 10;
	box-shadow: 0px 0px 30px #000;
	color: #928175;
	/*font-family: "Albertus Medium", Federo, "Segoe UI", Optima, Verdana, "Trebuchet MS", sans-serif;*/
	padding-top: 10px;
	padding-right: 10px;
	padding-bottom: 10px;
	padding-left: 10px;
	overflow: hidden;
	font-family: "SanS Medium", Futura, Candara, Calibri, Segoe, "Segoe UI", Optima, Verdana, Arial, sans-serif;
}

/*next item helps in eliminating need of scroll bar in smartphone view for masthead */

.masthead img {float:left; margin-right:10px}




.content-wrapper {
	margin: 4em 1.25em 0em 1.25em;
	overflow: hidden;
}
.columns-wrapper {
	overflow: hidden;
	/*background-color: #FFF;*/
	position: relative;
	
}
.columns-wrapper, .menu-top-wrapper {
	max-width: 1260px;
	margin: auto;
}

.main-content {
	float: left;
	width: 50%;
	margin-right: 1%;
}
.sidebar {
	width: 30%;
	float: left;
	}

/* If I change backgrounds this must be adusted */


.main-content .content{
	font-size: 1em;
	line-height: 1.5em;
	border: 1px solid;
	border-radius: 20px;
	border-color: #666;
	background-image: url(../../images/tilak_background.jpg);
	background-repeat: repeat;
	-moz-box-shadow: 6px 6px 15px -4px #35454c; /* Firefox */
	-webkit-box-shadow: 6px 6px 15px -4px #35454c; /* Safari/Chrome */
	box-shadow: 6px 6px 15px -4px #35454c; /* Opera and other CSS3 supporting browsers */
	margin-bottom: 2em;
	padding-top: 20px;
	padding-right: 30px;
	padding-bottom: 20px;
	padding-left: 30px;
	}
	

/*Heading styles I changed the fonts, size and color*/
h1, h2, h3, h4, h5 {
	margin: 0px 0px 0px 0px;
	font-family: "SanS Medium", Futura, Candara, Calibri, Segoe, "Segoe UI", Optima, Verdana, Arial, sans-serif;
	font-weight: normal;
	text-transform: none;
	color: #1D2B80;
	text-align: center;
	text-shadow: 6px 6px 8px #CCC;
	line-height: 1.5em;
	
}


h1 { font-size: 2.1em;}
h2 { font-size: 1.7em; }
h3 { font-size: 1.55em; }
h4 { font-size: 1.2em; }
h5 { font-size: 0.9em; }

/*A utility rule assigned to the first heading to remove top margins.*/
.content h1:first-child,
.content h2:first-child,
.content h3:first-child,
.content h4:first-child
.content h5:first-child {
	margin-top: 0px;
}

/*Make Image Scalable - Assign this class to any image to make it scale with the browser window size*/
img.scalable {
	height: auto !important;
	width: auto !important;
	max-width: 100%;
	border-radius: 5px;
	display: block;
	margin-right: auto;
	margin-left: auto;	

}

/* For images in sidebar it has different background color*/

.fancy {
	border: 1px solid rgba(255,255,255,.2);
	box-shadow: 0px 0px 30px rgba(0,0,0,.65);
	
}

/*for images on white backgrounds in text area*/

.fancy2 {
	border: 1px solid rgba(225,199,56,.2);
	box-shadow: 0px 0px 30px rgba(0,0,0,.65);
	
}

/* for images where borders are a problem */


.fancy3 {
 box-shadow: 0px 0px 30px rgba(0,0,0,.65);
 
} 

.sidebar ul, .sidebar ol, .sidebar2 ul, .sidebar2 ol {
	margin: 0 0 0 .5em;
	padding: 0 0 0 .5em;
	line-height: normal;
}
.sidebar li, .sidebar2 li { 
	margin-bottom: 4px; 
}

/*Ordinary Link Styles*/

.content a:link { color: #2e78c1; text-decoration: none; border-bottom-width: 1px; border-bottom-style: dotted;}
.content a:visited {color: purple;}
.content a:hover, .content a:focus {
	color: #c00;
	border-bottom-style: solid;
}

/* if I want to do it more conventionally I would use the ones below but note there is some incompatiblity with "fancy quote" link styles that would have to be worked out*/
/*
.content a:link {
	color: blue;
	text-decoration: none;	
}
.content a:visited {
	color: purple;
	text-decoration: none;	
}

.content a:hover {
	color: teal;
	text-decoration: underline;	
}

.content a:focus {
	color: red;
	text-decoration: none;	
}
*/

/* --------Link styles in footer------------*/
.footer a {
	color: #8C8C8C;
}
.footer a:hover, .footer a:focus { color: #FFF; }






/*The DIVs that contains the horizontal menu bar at the top of your page. Original color #7BA4C1  it controls the color of the navigation buttons
*/
.top-navigation {
	background-color: rgba(90,121,178,1);
	background-image: linear-gradient(rgba(90,121,178,1),rgba(199,138,96,.75));
	background-image: -webkit-linear-gradient(rgba(90,121,178,1),rgba(199,138,96,.75));
	border-bottom: 1px solid #ffb54d;
	box-shadow: 0px 0px 30px #999;
	position: relative;
	z-index: 9;
}
.top-navigation:after {
	content: "\0020";
	font-size: 0px;
	display: inline;
	overflow: hidden;
	line-height: 0;
	clear: both;
}
.menu-top-wrapper .p7DMM01 {
	background-color: transparent;
	border: none;
	box-shadow: none;
}

/*The Footer*/
.footer {
	background-color: #252e49;
	box-shadow: inset 0px 16px 2px rgba(255,255,255,.025);
	border-top: 1px solid #000;
	padding: 15px 15px;
	font-size: 0.7em;
	color: #6c5f55;
	text-align: center;
	clear: both;
	position: fixed;
	z-index: 999;
	top: auto;
	bottom: 0px;
	width: 100%;
	font-family: "SanS Medium", Futura, Candara, Calibri, Segoe, "Segoe UI", Optima, Verdana, Arial, sans-serif;
}
.footer p.copyright {
	text-transform: uppercase;
	margin: 0px;
}


/*1 Column for Narrow Browser Windows and Smartphones in both orientations*/
@media only screen and (min-width: 0px) and (max-width: 700px) {
body {
	padding-bottom: 0px;
}

/*for dealing with large spaces between images in sidebar when there are two images (not tried on >3) */

#graphix2, #graphix3, #graphix4, #graphix5, #graphix6, #graphix7, #graphix8, #graphix9 {
margin-top: 20px !important;
}

/*------------------*/

/* this necesssary fix if only ONE (1) image so that there is no large space or empty space after text area place it in the head area of affected page to overide the rule above */

/*1 Column for Narrow Browser Windows and Smartphones in both orientations*/

/*
@media only screen and (min-width: 0px) and (max-width: 700px) {
#graphix2 {top: 0px;}
}



*/
/*------------------*/


.footer {
	position: static;
	width: auto;
}
.content-wrapper, .columns-wrapper {margin: 0px; border: none;}
.sidebar, .main-content {
	width: auto;
	float: none;
	position: static;
}
.main-content .content, .sidebar .content {
	padding: 20px 10px;
	border-radius: 0px ;
	border: none;
	height: auto !important;
	max-height: 888678px;
}

/* Change of border color affects smart phone view */

.p7DMM01 ul a, .p7DMM01 ul a:hover, .p7DMM01 ul a:focus, .p7DMM01 ul a.open {
	border-bottom: 1px solid;
	border-color: #89AEC9;
}
.p7DMM01 ul li:last-child a {
	border-bottom: none;
}
}
/*Medium windows - reduce padding content padding*/
@media only screen and (min-width: 700px) and (max-width: 1280px) {
.main-content .content, .sidebar .content {padding: 20px 15px;}
.top-navigation {padding: 0px 10px;}
.content-wrapper {margin-left: 10px; margin-right: 10px;}
}

/* 

----------------------------------------------


below starts my added styles 

------------------------------------------------

*/

/* link style for ".name" in header */

.name {font-size: 2em;}
/*
a.name:link    {
	color: #6C5F55;
	font-size: 2em;
	font-family: "SanS Medium", Futura, Candara, Calibri, Segoe, "Segoe UI", Optima, Verdana, Arial, sans-serif;
	text-decoration: none
}

a.name:visited     {
	color: #6C5F55;
	font-size: 2em;
	font-family: "SanS Medium", Futura, Candara, Calibri, Segoe, "Segoe UI", Optima, Verdana, Arial, sans-serif;
	text-decoration: none
}

a.name:hover   {
	color: #6082BF;
	font-size: 2em;
	font-family: "SanS Medium", Futura, Candara, Calibri, Segoe, "Segoe UI", Optima, Verdana, Arial, sans-serif;
	text-decoration: none
}

a.name:active   {
	color: #ba692c;
	font-size: 2em;
	font-family: "SanS Medium", Futura, Candara, Calibri, Segoe, "Segoe UI", Optima, Verdana, Arial, sans-serif;
	text-decoration: none
}
*/

#social {
	height: 20px;
	width: 200px;
}


/*To remove border around images*/

a img {
	border: none;
}

/* style for the "Top of Page^" anchor link */



a.to-top:link    {
	color: white;
	font-size: 1.2em;
	font-family: "SanS Medium", Futura, Candara, Calibri, Segoe, "Segoe UI", Optima, Verdana, Arial, sans-serif;
	text-decoration: none;
	padding-right: 10px;
}

a.to-top:visited      {
	color: white;
	font-size: 1.2em;
	font-family: "SanS Medium", Futura, Candara, Calibri, Segoe, "Segoe UI", Optima, Verdana, Arial, sans-serif;
	text-decoration: none
	
}

a.to-top:hover     {
	color: #6082BF;
	font-size: 1.2em;
	font-family: "SanS Medium", Futura, Candara, Calibri, Segoe, "Segoe UI", Optima, Verdana, Arial, sans-serif;
	text-decoration: none;
	
}

a.to-top:active    {
	color: red;
	font-size: 1.2em;
	font-family: "SanS Medium", Futura, Candara, Calibri, Segoe, "Segoe UI", Optima, Verdana, Arial, sans-serif;
	text-decoration: none
	
}

/* applies style to the containers holding the "graphic-holder" graphics */

.graphix-style {
	
	background-color: rgba(25,28,80,0.9);
	background-image: -webkit-linear-gradient(rgba(25,28,80,1) 20%,rgba(199,138,96,0.5));
	background-image: linear-gradient(rgba(25,28,80,1) 20%,rgba(199,138,96,0.5));
	border: 1px solid;
	border-color: #333;
	border-radius: 20px;}

/* For the Main Title of an Article 

previous color  #c00

*/

.maintitle {
	
	color: #1D2B80;
	text-align: center;
	text-shadow: 6px 6px 8px #CCC;
}

/*Various styles for quoting text*/

/* The first two are for genral body text quotes*/
.quote-text {
	color: #000;
	font-size: 1.05em;
	letter-spacing: 0.02em;
	margin-left: 50px;
	margin-right: 50px
}

/* quote text colored */

.quote-text-colored {
	color: #c00;
	font-size: 1.05em;
	letter-spacing: 0.02em;
	margin-left: 50px;
	margin-right: 50px;
	
}

/* Fancy quotes that are used when I really want to highlight something--use sparingly*/

.fancy-quote, .fancy-quote-dark, .fancy-quote-med, .fancy-quote-side, .fancy-quote-side2 {
	letter-spacing: 0.1em;
	margin-bottom: 15px;
	color: #08316f;
	font-size: 1.1em;
	background-color: #A47634;
	padding: 5px 20px;
	border-radius: 7px;
	border: 2px solid #EEE;
	box-shadow: 0px 0px 30px #999;
	margin-top: 15px;
}


.fancy-quote-dark {
	background-color: #191C50;
	color: #A47634;
	padding: 5px 20px;
}
.fancy-quote-med {
	background-color: #89aec9;
	color: #000;
	padding: 5px 20px;
}

/* fancy quote for side bar to contrast background*/
.fancy-quote-side {
	background-color: #191C50;
	color: #A47634;
	font-size: .8em;
	padding: 5px 20px;
	text-align: left;
}
/* fancy quote 2 for side bar to contrast background when I want bigger fonts*/
.fancy-quote-side2 {
	background-color: #252E49;
	color: #ec1a14;
	font-size: .8em;
	padding: 5px 20px;
	text-align: left;
}
/* Descendent selectors for fancy-quout-dark */

.fancy-quote-dark a:link {
	color: #A47634;
	border-bottom-style: dotted;
	border-bottom-width: 1px;
}
.fancy-quote-dark a:visited {
	color: #A47634;
	border-bottom-style: none;
}
.fancy-quote-dark a:hover {
	color: #FFAD36;
	border-bottom-style: solid;
}
.fancy-quote-dark a:active {
	color: #118164;
	border-bottom-style: solid;
}

/* Descendent selectors for fancy-quout-side */

.fancy-quote-side a:link {
	color: #A47634;
	border-bottom-style: dotted;
	border-bottom-width: 1px;
}
.fancy-quote-side a:visited {
	color: #A47634;
	border-bottom-style: none;
}
.fancy-quote-side a:hover {
	color: #FFAD36;
	border-bottom-style: solid;
}
.fancy-quote-side a:active {
	color: #118164;
	border-bottom-style: solid;
}

/* Descendent selectors for fancy-quout-side2 */

.fancy-quote-side2 a:link {
	color: #A47634;
	border-bottom-style: dotted;
	border-bottom-width: 1px;
}
.fancy-quote-side2 a:visited {
	color: #A47634;
	border-bottom-style: none;
}
.fancy-quote-side2 a:hover {
	color: #FFAD36;
	border-bottom-style: solid;
}
.fancy-quote-side2 a:active {
	color: #118164;
	border-bottom-style: solid;
}


/*have some special link classes just for quotes-- use decendant selectors instead*/
/*
a.fancy-quote-dark-links:link    {
	color: white;	
	text-decoration: none;	
}

a.fancy-quote-dark-links:visited      {
	color: white;	
	text-decoration: none	
}

a.fancy-quote-dark-links:hover     {
	color: #6082BF;	
	text-decoration: none;	
}

a.fancy-quote-dark-links:active    {
	color: red;	
	text-decoration: none	
}
*/
/* styles for bold & bold-italic attributes (used as inline styles) */

	/* bold attribute */

.b { font-weight: bold; 
}

	/* italic attribute */
	
.i { font-style: italic;
}

	/* bold-italic attribute */
	
.bi { font-weight: bold;
      font-style: italic;
}


/* style for scrollbar in MS Internet Explorer - M$ extensions :-(  Not sure why it has the name "body"*/			
			
	
body { scrollbar-arrow-color: white; scrollbar-3dlight-color: #9DB6C4; scrollbar-highlight-color: #B4C5CD;
scrollbar-face-color: #5B8196; scrollbar-shadow-color: #808080; scrollbar-darkshadow-color: #405B6A;
scrollbar-track-color: white;
}

/* to justify text in document*/

.justify {
	text-align: justify;
}

/* font-style used for headlines where I don't want to use h tag */
		
.light-headline  {
	font-family: AlbertaExtralight, "Segoe UI", Optima, Futura, Candara, Calibri, Verdana, "Trebuchet MS", Arial, sans-serif;
	text-shadow: 6px 6px 8px #CCC;
	line-height: 1.5em;
	text-align: left;	
}

/* when I want h1, h2, etc. to be alligned left*/

.left-headline  {
	font-family: "SanS Medium", Futura, Candara, Calibri, Segoe, "Segoe UI", Optima, Verdana, Arial, sans-serif;
	text-shadow: 6px 6px 8px #CCC;
	line-height: 1.5em;
	text-align: left;
}

/* smaller font style */
	
.smaller {
	font-size: .8em;
}

	/* style for colored emphasis */
	
.colored_emphasis {color:#c00;
}

/* style for colored emphasis alternate color */

		
.colored_emphasis_alt {
	color: teal;
}

.centered { text-align: center;
}



/* style for tables to reduce space between lines*/
/*
.tables {
	font-size: 1em;
	line-height: 1em;
	
}*/

/* large font style */
		
.larger { font-size: 1.3em; 
}

	/* larger & bold font style */
	
.largerbold { font-size: 1.3em; 
	font-weight:bold;
}

/* smaller & centered style */
	
.smallercentered { font-size:smaller;
	text-align:center;
}
	
	/* smaller, bold & centered style */
	
.smallerboldcentered { font-size:smaller;
	font-weight:bold;
	text-align:center;
}

/* hanging indent*/

.indent { margin-left: 20px; }

/* for BBT copyright notice */

.bbt {font-size: .55em;}


/*For dealing with text field areas that go past the right edge in smart phone view*/


.textarea {width:98%;}

.form-input {width:70%;}

/* add the subres class to the input tags for your submit and reset buttons - based on your dmm */

.subres {
margin:0 auto; /* center it/them */
max-width: 150px; /* it's ok to use px - you know this width wont break the layout */
color: #000; /* font color*/
font-family: AlbertaExtralight, "Segoe UI", Optima, Futura, Candara, Calibri, Verdana, "Trebuchet MS", Arial, sans-serif;
font-size: 1em;
text-decoration: none;
border: 1px solid;
border-radius: 30px 0 30px 0;
border-color: #517186;
display: block;
-webkit-transition: all linear .35s .1s;
transition: all linear .35s .1s;
-webkit-transition-property: background-color, box-shadow, border-color;
transition-property: background-color, box-shadow, border-color;
padding: 12px;
}
.subres:hover {
outline: none;
border-color: #FFF;
border-color: rgba(255,255,255,0.65); /*This changes the color around the link*/
color: #FFFFFF;/*this changes the color of the font*/
box-shadow: inset 0px 12px 8px rgba(255,255,255,.2);
background-color: #5a4555;/* This changes color of the link itself original color 487DEF*/
}