@import url('https://fonts.googleapis.com/css2?family=Noto+Naskh+Arabic&family=Noto+Sans:ital,wght@0,400;0,700;1,400&display=swap');
/* @import url("http://fonts.googleapis.com/css?family=Open+Sans:400,700,400italic&text=āīūĀĪŪḍṛṭḌṚṬ"); */

@media 

/* Fairly small screens including iphones */
only screen and (max-width: 500px) and (-webkit-max-device-pixel-ratio: 1) /* ,*/

/* iPads 
only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (-webkit-max-device-pixel-ratio: 1) */

{
	#top, #bottom, #left, #right { display: none; }
}

/*
@font-face {
    font-family: 'Quattrocento Sans';
    src: url('QuattrocentoSans-Bold.ttf') format('truetype'),
    	 url('QuattrocentoSans-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;

}

@font-face {
    font-family: 'Quattrocento';
    src: url('Quattrocento-Regular.ttf') format('truetype'),
    	 url('Quattrocento-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
*/



/*
@font-face {
    font-family: 'Charter';
    src: url('charter_regular-webfont.eot');
    src: url('charter_regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('charter_regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}


@font-face {
    font-family: 'Charter';
    src: url('charter_bold-webfont.eot');
    src: url('charter_bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('charter_bold-webfont.woff') format('woff');
    font-weight: bold;
    font-style: normal;

}




@font-face {
    font-family: 'Charter';
    src: url('charter_italic-webfont.eot');
    src: url('charter_italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('charter_italic-webfont.woff') format('woff');
    font-weight: normal;
    font-style: italic;

}


@font-face {
    font-family: 'Charter';
    src: url('charter_bold_italic-webfont.eot');
    src: url('charter_bold_italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('charter_bold_italic-webfont.woff') format('woff');
    font-weight: bold;
    font-style: italic;

}
*/


/*
@import url("http://fonts.googleapis.com/css?family=Montserrat:bold");
*/

/*@import url("http://fonts.googleapis.com/css?family=Merriweather:400,700,400italic&subset=latin,latin-ext");*/

#top, #bottom, #left, #right {
	background: #a5ebff;
	position: fixed;
	}
	#left, #right {
		top: 0; bottom: 0;
		width: 15px;
		}
		#left { left: 0; }
		#right { right: 0; }
		
	#top, #bottom {
		left: 0; right: 0;
		height: 15px;
		}
		#top { top: 0; }
		#bottom { bottom: 0; }

body {
   	/*font-family: 'Merriweather', serif; */
   	/*'Quattrocento', serif; */
   	font-family: 'Noto Sans', sans-serif;
   	background-color: #336699;
   	color: #e0f0e0;
} 
a {
    text-decoration: none;
}
a:link {
    color: #ccff99;
}
a:visited {
    color: #ffcc00;
}
a:hover {
    color: #ffffaa;
} 
a:active {
    color: #ff0066;
}
h1 {
/*	font-family: 'Quattrocento Sans'; */
	color: #ff9;
	text-align: center;
	font-size: 3pc;
	font-weight:bold; 
}
h2 {
	color: #0cf;	
	text-align: center;
	font-size: 2pc;
	top: 0.5pc;
	}
.bg {
	background-color: #99ccCC;
	width: 90%;
	margin-right: 4pc;
	margin-left: 4pc;
	padding: 1pc;
	margin-top: 2pc;
}
.main {
   	margin-left: auto;
   	margin-right: auto;
   	width: 727px;
   	padding-top: 10px;
}
.right {
	float: right;
}
.left {
/*	left: 6pc; */
/*	position: absolute; */
	top: 7pc; 
/*	margin-left: auto;*/
	float: left;
	width: 200px;
}
.left .links {
/*	right:0px;*/
/*	position: absolute;*/
	float: right;
	text-align: right;
    font-style: italic;
}
.portrait {
	  width: 200px;
      height: 196px;
      padding-top: 0px;
      padding-bottom: 12px;
  }
.illus {
	width: 500px;
	height: 167px;
    padding-top: 4px;
    padding-bottom: 12px;
}
.content {
/*	left: 30pc;
	right: 6pc;
	position: absolute; */
	float: right;
	width: 500px;
	top: 7pc;
	bottom: 5pc;
}
.contenttitle {
	color: #ee8080;	
/*	font-size: 2pc;*/
	font-size: 25px;
	font-weight: bold;
	line-height: 25px;
    top: 0px;
    padding-bottom: 0px;
}
.sectionhead {
	color:  #f8b4b4;
	font-weight: bold;
}
.subtitle {
/*	font-style: italic; */
	font-weight: bold;
	color: #e56050; /*#cc9090; */
	font-size: 120%;
}
.psep {
	line-height: 15px;
}
.subhed {
	font-weight: bold;
}
.urdu {
    font-family: 'Noto Naskh Arabic';
}
.tab {
    padding-left: 3em;
}