@charset "utf-8";
/* CSS Document for Pakistan Film Magazine modified on 4.1.2021 */


	@font-face {
		font-family: 'Nastaleeq';
		src:url(/web/jameel-noori-nastaleeq.ttf);
		font-style:normal;}
		
/* Mobile version */	
	html, body, div, h1, h2, h3, h4, h5, h6, img, p {
		margin:0px; padding:0px; border:0px; font-size:100%; background:transparent;}
	
	html {overflow-x: hidden;}
	body {padding:3px; margin:5px; 
		font-family:Verdana, Geneva, sans-serif, Helvetica, sans-serif; font-size:10px; font-style:normal; color:#000;}
	
	a {color:#990099; text-decoration:none; font-weight:bold;}
	a:hover, a:active {color:#F00;}
	a:visited {font-weight:none;}
	
	ul {list-style-type:square; padding-left:15px; text-align:justify;}
	ol {padding-right:5px; text-align:justify;}
	li {padding-left:0px; text-align:justify;}


	caption, h6, #menuFilmHistory, #imgPostersArea, #artIntro, #imgArtistsArea {font-family:Arial, Helvetica, sans-serif;}
	
	h1, h3, #mainHeading, #headline {font-family:"Times New Roman", Times, serif; font-weight:bolder; padding:1px; margin-top:1px; text-shadow: 2px 2px 4px #ccc;}
	h1 {font-size:22px; font-weight:bolder; color:#000; padding:1px; margin-top:1px; text-shadow: 2px 2px 2px #ccc;}
	h2 {font-size:125%; font-weight:bolder;}
	h3 {font-size:20px; font-weight:bolder; font-style:italic; color:#000;padding:1px; margin-top:1px; text-shadow: 2px 2px 2px #ccc;}
	h4 {font-weight:bold; padding-top:10px;}
	h5 {font-weight:bold; color:#F00;}
	h6 {font-size:9px; color:#666;}

	table, th, tr, td {vertical-align:top;}
	img {max-width:100%; text-align:center;}
	imgRight {float:right; border:1px solid #fff;}
	imgLeft {float:left; border:1px solid #fff;}
	.imgArt {margin-left:5px; padding:1px; border:5px solid hotpink; border-radius:2em/9em; box-shadow:0px 5px 10px #ccc;}

	caption {caption-side:bottom; font-size:9px; color:#999;}
	article {font-size:12px; color:#000;}
	article p {padding:5px;}
	article a:link {font-weight:normal;}

	::placeholder {color:#E9E9E9;}
	.inline {display:inline;}
	.no_top {margin:0px;}

	.hiddenMobile {display:none;}
	.mobileSite {display:none; margin-top:-20px; padding-top:-20px;}
	.hiddenDesktop {display:block;}
	.NotOnMobile {display:block;}
	.NotOnDesktop {display:none;}
	

	#borderDouble {border-top:1px solid #ccc; border-bottom:1px solid #ccc; width:620px; padding:2px; font-weight:bold;}
	.borders {width:auto; height:auto; margin-left:5px; padding:5px; border:1px solid #ccc; border-radius:3px; box-shadow:0px 0px 3px #ccc;}
	.shades {padding:5px; border:1px solid #fff; box-shadow:0px 5px 10px #ccc;}
	.border {width:35px; height:44px; margin:2px; padding:2px; border:1px solid #ccc; border-radius:3px; box-shadow:0px 0px 3px #ccc; text-align:center;}



/* ---------- H E A D E R ----------- */

	#topPage {width:100%; height:100px; background-color:#000; margin:0px; padding:0px; top:0px; left:0px; display:block; position:fixed; z-index:1000;    
	box-shadow:5px #ccc; clear:both; text-align:justify;}
	
	#topPageHeader {width:100%;}
	#topPageLogo {float:left;}
	#topPageRight {display:none;}
	.topPageMenu {width:auto; height:90px; font-size:14px;}
	#topMenu {font-size:14px;}
	#topMenu a {color:#0F0;}
	#topMenu a:link {color:#0F0;}
	#topMenu a:hover {color:red;}	
	#menuDB {float:left; width:auto; margin:1px; padding:3px; border:1px solid #ccc; border-radius:3px;}	
	
	
	



/* ---------- Main page ----------- */
	
	#mainContentPage {width:auto; margin:130px auto; display:block;overflow-x:hidden;}
	#mainPageColumnLeft {float:none; width:100%; display:block;}
	#mainPageContent {width:auto; margin:3px; padding:3px;}
	#mainPageColumnMenu {width:96%; margin:3px; padding:3px;}
	#mainPageColumnMenuOne {float:left; width:160px; padding:3px;}
	#columnHalf {float:none; width:100%; padding:3px; margin:3px;}
	#mainHeading {font-size:300%; font-weight:bolder; color:red; padding:3; text-shadow: 2px 2px 2px #ccc;}
	#headline {font-size:250%; font-weight:bolder; color:#000; padding:3; text-shadow: 2px 2px 2px #ccc;}






/* ---------- Film page ----------- */

	#menuFilmHistory {float:left; width:atuo; padding:2px; margin:2px; background-color:#990099; border:1px solid #fff; border-radius:10%; box-shadow:0px 0px 5px #ccc; text-align:center;}

	#menuFilmHistory a {color:#fff;}
	#menuFilmHistory a:hover, a:active {color:#F2BCFE;}
	#menuFilmHistory a:visited {font-weight:none;}




	
	.poster {width:50px; height:65px; padding:2px; text-align:center;}
	#posters {width:100px; height:auto; margin:2px;padding:5px;border:1px solid #ccc;clear:both;
	border-radius:3px; box-shadow:3px 3px 5px #ccc;}
	#posterIcons {float:left; width:85px; height:auto; padding:5px; text-align:center;}

	#eid {font-size:100%;color:green;font-weight:bold;}
	#film_review {width:auto; margin:10px 0 10px 0; padding:5px;}
	#imgFilmPage {max-width:450px; text-align:center;}
	
	/* Cast info */
	#cast {width:auto;width:100%;padding:3px;}
	#cast tr {background-color:#F4F4F4; vertical-align:top; padding-left:5px;font-size:10px;}
	#cast td.cat {width:70px;text-align:left;}
	#film_cat {float:left; width:70px; padding:1px; margin:1px;}

	#filmList {padding:5px; margin:3px;	background-color:#D3FEDB; border:1px solid #61F86C; border-radius:5px; box-shadow:0px 0px 5px #ccc; clear:both;}
	
	#filmOne {float:center; width:auto; padding:5px;}
	#filmTwo {float:none; width:auto; margin:3px; padding:3px; border-left:1px solid #ccc;border-right:1px solid #ccc;}
	
	#boxoffice {width:auto; font-size:10px; background-color:#FFFEEE; margin:3px; padding:5px;
	border:1px solid #ccc; border-radius:5px; box-shadow:2px 2px 1px #ccc;}
	#circuit {font-size:95%;text-transform:uppercase;color:#666;font-stretch:wider;margin-top:5px;text-decoration:underline;}
	
	#imgFilmposterSettings {padding-left:5px;}
	#imgPostersArea {float:left; width:50px; height:70px; margin:2px; padding:2px; font-style:normal; font-size:9px; text-align:center;}	
	#posterIcons {float:left; width:80px; height:auto; padding:5px; text-align:center;}







/* ---------- Artist page ----------- */

	#pageArtists {width:auto; padding:5px; margin:5px;}
	#pageArtists p {padding-top:10px;}
	#pageArtists img {float:left;}

	#art {float:left; width:30%; background-color:#fff; padding:1px; margin:2px; font-weight:bold; border:1px solid #FEDEFD;}
	#artName {float:left; padding-top:40px;}


	#artTb {float:left; width:48%; margin:3px; border:1px solid #fff; border-radius:20px; box-shadow:0px 5px 10px #ccc;}
	#artNo {width:20px; padding-top:7px; text-align:center;}
	#artTd {padding-top:7px; text-align:left;}
	#artPic {float:right; width:25px; height:25px; border-radius:50%; text-align:right;}
	.artPic {float:left; width:30px; height:38px; margin-right:5px; border:3px solid #fff; border-radius:5px; box-shadow:0px 5px 10px #ccc;}


	#artText {padding:30px 20px 3px 5px; display:block;}
	#artIntro {float:right; width:160px; margin:0px -30px 0 0px; padding:2px -20px 0 5px; border:1px solid #ccc; border-radius:5px; box-shadow:0px 5px 10px #F2F2F2;}
	#artIntro tr {width:auto; background-color:#F2F2F2; padding-left:3px;}
	#artIntro td {padding-left:3px; vertical-align:top;}
	#artIntro td.first {width:auto;}
	#artIntro ul {list-style-type:none;}
	#artIntro li {list-style-type: circle; margin:0px;}

	#artFoto {width:100%; padding:3px; text-align:center; }

	#artImage {float:left; width:60px; height:85px; margin:5px; padding:5px; margin-right:10px; border:1px solid #ccc; border-radius:5px; box-shadow:0px 02px 10px #ccc;}
	#artsImagesStyle {width:100%; text-align:center; margin:7px;}	
	#imgArtists {width:40px; height:50px; padding:2px; margin:2px;}
	#imgArtistsArea {float:left; width:55px; height:135px; margin:1px; padding:2px;  font-style:normal; font-size:9px; text-align:center;}



/* ---------- Film music ----------- */

	#songlist {float:none; width:100%; background-color:#F0F0F0; padding:1px; margin:1px; clear:both;}
	#no {width:20px; vertical-align:top; text-align:right;}
	#film_genre {font-family:Tahoma, Geneva, sans-serif;font-size:90%;text-transform:uppercase;color:#666;margin-bottom:10px;letter-spacing:1px;}

	#dbTable {width:100%; border-bottom:1px solid #ccc; padding:0px; margin:0px;}
	#dbTr {width:100%; padding:0px; margin:0px;}
	#dbTd {width:20px; font-size:80%; padding-top:2px; text-align:right;}

	.list {float:left; width:100%; padding:2px; margin:0px; text-align:left;}
	.list th {width:auto; background-color:#666; padding-left:3px; text-align:left; color:#fff;}
	.list tr {width:auto;background-color:#f2f2f2;padding-left:3px;color:#000;text-align:left;}
	.list td {padding-left:3px;vertical-align:top;}
	.list td.first {width:100px;}	






/* --------- Cinema ------------ */
	.cinema {float:left; width:auto; height:auto; margin:2px; padding:2px; display:block; border-radius:3px; box-shadow:0 0 10px #ccc inset;}
	#cinemaImage {float:left; margin:3px;}
	#cinemaImageIcon {float:left; width:70px; height:50px; padding:2px;}
	#cinemaDetails {float:left; width:100%;}
	






/* ---------- Film news ----------- */

	#filmnews {width:100%; padding:3px; margin:3px;}
	#filmnews p {width:100%; margin-right:10px;}
	#filmnews img {float:left; padding:3px;}





/* ---------- Video ----------- */

	#filmVideo {width:auto; height:auto; text-align:center;
	background:#000; border-radius:5px; z-index:-1; clear:both;}
	.yt {width:auto; height:300px; padding:3px; margin:3px;}



/*
Copyright (c) 2009, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 2.7.0
*/

.yui-navset .yui-content .yui-hidden {
	position: absolute;
	left: -999999px;
	visibility: hidden;
}
.yui-navset .yui-nav li, .yui-navset .yui-navset-top .yui-nav li, .yui-navset .yui-navset-bottom .yui-nav li {
	display: inline-block;
	display: -moz-inline-stack;
	vertical-align: bottom;
	cursor: pointer;
	zoom: 1;
}
.yui-navset .yui-nav li a, .yui-navset-top .yui-nav li a, .yui-navset-bottom .yui-nav li a {
	margin:0;
	padding:0;	
	display: block;
	display: inline-block;
}

.yui-skin-sam .yui-navset .yui-nav a, .yui-skin-sam .yui-navset .yui-navset-top .yui-nav a {
	padding:3px;
	margin:1px;
border:1px solid #ccc;
border-radius:3px;	
-moz-border-radius:3px;
-webkit-border-radius:3px;
-moz-box-shadow:0px 0px 3px #ccc; 
-ms-box-shadow:0px 0px 3px #ccc; 
-webkit-box-shadow:0px 0px 3px #ccc;
box-shadow:0px 0px 3px #ccc;}

.yui-skin-sam .yui-navset .yui-nav .selected a, .yui-skin-sam .yui-navset .yui-nav .selected a:focus, .yui-skin-sam .yui-navset .yui-nav .selected a:hover {

	font-weight: bolder;
	font-size:11px;
}
.yui-skin-sam .yui-navset .yui-nav .selected a, .yui-skin-sam .yui-navset .yui-nav .selected a:focus, .yui-skin-sam .yui-navset .yui-nav .selected a:visited {
	background: #9CF5B0;
	font-weight: bolder;
	font-size:11px;
}





	
	
	
	
	
	
/* --------- Dynamic Search box --------------- */

	#mainSearch {width:100%; margin-top:0px; text-align:center; overflow-x: scroll;}
	.formFormat {width:100%;}
	.formFormat input {width:100%; border-radius:5px;}
	.formFormat textarea {border-radius:5px;}
	/* input */
	#search input {width:300px; height:20px; padding-left:5px; margin:20px; border-radius:5px; font-weight:bolder;}
	/* fold out menu */
	#livesearch {width:auto; z-index:999; background-color:#fff; border-radius:5px;
	}
	/* Search page */
	#SearchPage {width:auto; overflow-y: scroll;}
	#SearchDobbleColumn {width:350px;}
	#SearchSingleColumn {width:350px;}
	

/* ---------- Tabber ------------ */

	.tabber {width:auto; background-color:#fff;}
	.tabber ul {background:#fff; padding:3px;}
	.tabs {display:block;}
	.tabs li {float:left; display:inline; color:#69F; margin:0px 5px 4px 0px; -webkit-box-shadow:0 0 10px #ccc inset; box-shadow:0 0 10px #ccc inset;}
	.tabs li a {display:block; margin:0px -1px 0px 0px; padding:1px 5px; font-size:11px;font-weight:bold; border:1px solid #ccc; border-radius:3px; text-decoration:none;}
	.tabs li a:hover {background:#D5FDD7; color:#F00;text-decoration:none;}
	.tabs li a.selected, .tabs li a.selected:hover {background:#F8F8F8; color:#666;}
	.tabscontent {display:none; width:auto; margin:-1px 0px 0px 0px; padding:0px 10px 5px 10px; border:1px solid #ccc; box-shadow:0 0 10px #ccc inset; border-radius:3px;}
	
	
/* ---------- Menu tab ----------- */
	.basictab ul{margin:0px 0px 0px -2px; padding:3px; list-style-type:none;
	text-align: left;}
	.basictab li{display:inline;}
	.tabcontainer{clear: left; width:auto;}
	.tabcontent{display:none;}
	.tabMenues {float:left; width:auto; padding:3px; margin:0px; font-size:11px; background-color:#000; border:2px solid #fff; border-radius:20px; z-index:1; box-shadow:0px 5px 5px #ccc;}

	
/* ---------- Masood Rana menu ----------- */
	.dropbtn {background-color:#aa4436; padding:3px; border:2px solid #fff; border-radius:50%; box-shadow:0px 5px 5px #ccc; cursor:pointer; text-align:right;}
	.dropdown {float:none;}
	.dropdown-content {display:none; position:absolute; left:0px; width:auto; margin:5px; padding:5px; background-color:#fff; z-index:1; box-shadow:0px 8px 16px 0px rgba(0,0,0,0.2);}
	.dropdown-content a {display:block;}
	.dropdown-content a:hover {background-color:#FAFE50;}
	.dropdown:hover .dropdown-content {display:block;}
	.dropdown:hover .dropbtn {background-color:#3e8e41;}



/* ---------- U R D U ----------- */
	
	#urduFont, .urduFont, #urduFont h1, #urduFont h2, #urduFont h3, #urduFont h4, #urduFont h5, #urduFont h6, #urduArticle, .urduArtists, #urduSingers, .urduText, urduIcons, #frontPageMenu {font-family:'Nastaleeq'; font-weight:bolder; color:#000; direction:rtl;}
	
	#urduFont h1 {font-size:300%; color:red; text-shadow: 2px 2px 5px #ccc; word-spacing:-10px;}
		#urduFont h3 {font-size:18px; font-style:normal; color:#F00;}
	#urduFont h4 {font-size:15px;}
	#urduFont h5 {font-size:12px; color:#000;}
	#urduFont h6 {font-size:12px; color:#777;}
	
	#urduArticle {width:auto; margin:3px 20px; padding:3px; font-size:22px; word-spacing:0px;}
	#urduArticle p {margin-top:5px;}
	#urduArticle h2 {margin-right:3px; color:red;}
	#urduArticle h5 {font-size:12px; color:#000;}
	#urduArticle ul {margin:3px; padding-right:20px;}
	#urduArticle li {text-align:right; text-align:justify;}
	#urduArticle caption {font-size:12px;}
	
	#urduRightColumn {float:right;width:30%;}
	#urduMainColumn {width:100%;}
	#urduMenuColumn {float:right; width:30%;}
	#urduMenuTwo {float:right; width:43%; margin:2%; padding:1%; color:red; background-color:#FDFFBB; border:2px solid #fff; text-align:center;}
	#urduMenuThree {float:right; width:80px; margin:2px; padding:5px; color:red; text-align:center;}
		
	.urduText {font-size:12px;}
	.urduFilmText {font-size:12px; color:#777;}
	.urduHeadings {font-size:18px;}
	.urduHeading {font-size:15px;}
	.urduIcons {float:right; width:60px; height:90px; margin:1px; padding:1px; text-align:center;}

	.urduArtists {float:right; width:50px; height:85px; margin:3px; padding:3px;}
	#urduSingers {width:auto; margin:5px; padding:5px; font-size:16px;}


	#sajjay, #dayen, #khabbay, #bayen, #uttay {font-size:18px; padding:5px; margin:5px; max-width:250px; color:blue; text-shadow: 2px 2px 6px #ccc; text-align:center;}

	#leftside {float:none; width:100%; margin:0px; padding:5px;}
	#sajjay {float:right; width:auto; margin:0px -20px 0px 10px;}
	#dayen {float:right; width:auto; margin:10px; padding:5px;}
	#khabbay, #uttay {float:left; width:auto; margin:0px 10px 5px -15px; color: blue; font-size:20px;  text-shadow: 2px 2px 6px #ccc; text-align:center;}
	#bayen {float:left; width:auto; margin:0px 10px 5px -15px;}
	#thallay {width:100%; font-size:14px; color:#000;}

	#venster {float:left; width:200px; padding:5px; border:1px solid #ccc; border-radius:5px; margin:10px 10px 5px -20px; font-size:14px; text-align:justify;}

	#firstWord {float:right; padding:0px 0px 0px 10px; margin:0px; font-size:200%; vertical-align:top;}


	.timeline {padding:10px; color:#fff; background-image:linear-gradient(green, white); border:1px solid #fff; border-radius:5px; font-size:20px; align:right; valign:top; text-align:center;}

	#frontPageMenu {width:auto; height:auto; padding:10px; margin:10px; border-radius:10px; font-size:16px;}

	#ranaTag a {float:right; margin:1px; padding:3px; font-size:12px; border:2px solid #fff; border-radius:50%; box-shadow:0px 5px 5px #ccc; display:inline-block;}
	#ranaTag a:hover {color:red;}