/*
Theme Name: MEDIU (Red)
Description: MEDIU English Website Theme (Red)
Version: 4.0
Author: Shajiuddin Ahmed
*/

/**
 * CSS Reset
 * Copyright (c) Eric Meyers
 * @http://meyerweb.com/eric/thoughts/2008/01/15/resetting-again/
 */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, 
blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, 
font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var,
b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0;border: 0; outline: 0; font-size: 100%; vertical-align: baseline; 
background: transparent; }
body { line-height: 1; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
:focus { outline: 0; }
ins { text-decoration: none; }
del { text-decoration: line-through; }
table { border-collapse: collapse; border-spacing: 0; }


/**
 * 3 column layout, Px widths
 */

.wrap { width: 960px; margin: 0 auto; padding: 0 30px; float:center;}
.clear { display: inline-block; overflow: hidden;}
.clear { display: block; clear: both; }

.main { background: url(img/bg.png) right repeat-y; padding-top: 10px; padding-bottom: 10px; }

#content { width: 520px; padding: 5px 10px 0 10px; float: left; }
#left { float:left; width: 190px; padding-top: 10px; }
#right { float: left; width: 230px; }

/* Body */
body { background: #963c1e url(img/bg.jpg) center top repeat-x; font: 8pt/1.25 Tahoma, Arial, Helvetica, sans-serif; }

/* Header */
.header { position:relative; height:100px; }
.header h1 { position: absolute; left: 20px; top: 0; }
.header h1 a { width: 280px; height: 100px; display: block; text-indent: -999em; background: url(img/logo.png) 0 0 no-repeat; }
.header a.applynow { position: absolute; right: 20px; bottom: 0; }

/* Links */
#links { overflow: hidden; float: right; width: 600px; background: url(img/search-bg.png) right bottom no-repeat; list-style: none; color: #fff; padding: 5px; margin-right: -10px;}
#links li { float: right; margin-left: 20px; }
#links li a { text-decoration: none; color: #fff; }
#links li a:hover { text-decoration: underline; }
#links li.lang { padding: 3px; }

/* Search Form */
#search-form * { color: #000; font: 10px Tahoma; }
#search-form legend { display: none; }
#search-form input { width: 150px; }



/* Primary Navigation */
.menu { height: 30px; background: url(img/bg.png) left top no-repeat; list-style: none; }
.menu > li { float:left; position: relative; z-index: 999; }
.menu li a { display: block; font-weight: normal; color: #000; text-decoration: none;  }
.menu ul { display: none; position: absolute; left: 0; top: 30px; padding: 0 2px 2px 2px; background: #000; list-style: none; }
.menu li li { float: none; }
.menu > li > a { float: left; padding: 8px 15px 9px 15px; text-align: center; font-weight: bold; color: #fff; }
.menu > li:hover { background: #000; }
.menu > li:hover a { color: #fff; }
.menu li li a { padding: 7px 10px 7px 22px; width: 190px; background: #000 url(img/bullet_green.png) 3px 5px no-repeat; }
.menu li li a:hover { background: #fff url(img/bullet_green.png) 3px 5px no-repeat; color: #000;}
.menu > li.current_page_item, .menu > li.current_page_parent, .menu > li.current_page_ancestor { background: #fff; }
.menu > li.current_page_item > a, .menu > li.current_page_parent > a, .menu > li.current_page_ancestor > a { color: #000; }
.menu > li.current_page_item:hover, .menu > li.current_page_parent:hover, .menu > li.current_page_ancestor:hover { background: #fff; }
.menu > li.current_page_item > a:hover, .menu > li.current_page_parent > a:hover, .menu > li.current_page_ancestor > a:hover { background: #fff; }
.menu > li:hover ul { display: block; }



/* Showcase */
.showcase { height: 265px; background: url(img/header.jpg) center bottom no-repeat;  }

/* Banner */
#banner { width: 500px; height: 265px; float: left; background: url(img/highlight-bg.png) right center no-repeat; }
#banner h3 { margin: 5px 10px 5px 10px; font: normal 16pt Arial; }
#banner p, #banner ul { margin: 0 20px 10px 20px; }
#banner li { margin: 10px 0 10px 20px; }
#banner a { text-decoration: underline; display: inline; background:url(img/bullet_go.png) right center no-repeat; padding-right: 20px; }
#banner a:hover { text-decoration: none; }
#banner img { float: left; margin: 5px 20px 0 15px; }
#banner .rotate { display: none; }
#banner .rotate.active { display: block; }

/* Highlights */
#highlights { width: 230px; height: 265px; float: left; }
#highlights li.link3 a { background: none; }
#highlights a { padding: 15px 20px; background: url(img/separator.png) center bottom no-repeat;}
#highlights img { display: block; float: left; margin-right: 10px; }
#highlights strong {  font: bold 11px Arial;  }
#highlights a { color: #000; display: block; text-decoration: none; font: 8pt Tahoma; }
#highlights a:hover { text-decoration: underline; }
#highlights span { display: block; }
#highlights strong { text-transform: uppercase; color: #900; }

/* Notice Board */

#notices { float: left; height: 240px; width: 230px; background: url(img/postit.jpg) left bottom no-repeat; padding-bottom: 10px; overflow: hidden; }
#notices h3 { font: bold 12pt Arial; color: #000; background: url(img/postit.jpg) left top no-repeat; padding: 15px 20px 5px 20px; }
#notices p { margin: 5px 0; }
#notices ul { padding: 0 20px; }
#notices li { display: none; margin-bottom: 10px; }
#notices li.active, #notices li.more { display: block; }
#notices a { text-decoration: underline; color: #036; background: url(img/bullet_go.png) right center no-repeat; padding-right: 20px; }
#notices strong { font: bold 8pt Arial; color: #900; }

/* Widgets */
div.widgets { height: 350px; }
ul.widget { width: 192px; height: 350px; float: left; position: relative; overflow: hidden; background: url(img/vseparator.png) right top no-repeat; list-style: none; margin: 0; }
ul.widget.last { background: none; }
ul.widget h3 { background: #fff; width: 182px; padding: 10px 10px 0 10px; position: absolute; top: 0; z-index: 101; font: bold 12pt Arial, Helvetica, sans-serif; color: #d60; }
ul.widget ul { list-style: none; padding: 0; margin: 0; }

ul.quicklinks li { position: absolute; padding: 0 1px; }
ul.quicklinks li.item0 { top: 31px; z-index: 100; }
ul.quicklinks li.item1 { top: 111px; z-index: 99; }
ul.quicklinks li.item2 { top: 191px; z-index: 98; }
ul.quicklinks img { display:block; margin: 0 0 10px 0; width: 170px; height: 57px; }
ul.quicklinks a { height: 12em; padding: 10px; display: block; text-decoration: none; color: #000; background: #fff url(img/hseparator.png) center bottom no-repeat; overflow: hidden; }
ul.quicklinks strong { display: block; font: bold 8pt Arial; text-transform: uppercase; color: #036; }
ul.quicklinks a:hover { background: #f8f4f0 url(img/hseparator.png) center bottom no-repeat; }

/* Sidelinks */
ul.sidelinks { margin-bottom: 20px; }
h3.sidelinks { font: bold 12pt Arial, Helvetica, sans-serif; color: #c00; margin: 0 10px; border-bottom: 1px solid #808080; }
ul.sidelinks a { display: inline-block; overflow: hidden; padding: 10px 5px;}
ul.sidelinks a { display: block; text-decoration: none; color: #000; }
ul.sidelinks a:hover { text-decoration: underline; }
ul.sidelinks li { background: url(img/hseparator.png) center bottom no-repeat; }

ul.related a { padding: 10px 10px 10px 20px; background: url(img/bullet_green.png) left 10px no-repeat; }
ul.related li.current_page_item a { font-weight: bold; }

ul.quickies img { display: block; float: left; margin: 0 10px 0 0; }
ul.quickies strong { display: block; font: bold 8pt Arial; text-transform: uppercase; color: #036; }
ul.quickies span { display: block; color: #444; }
ul.quickies a:hover, ul.quickies a:hover span, ul.quickies a:hover strong { text-decoration: underline; }

/* Announcements */
h3.announcements { font: bold 12pt Arial; background: url(img/postit.jpg) left top no-repeat; padding: 15px 20px 0 20px; }
#announcements { background: url(img/postit.jpg) left bottom no-repeat; padding-bottom: 20px; margin: 0 0 10px 0; }
#announcements li { display: none; padding: 10px 20px; }
#announcements li.active, #announcements li.more { display: block; }
#announcements strong { font: bold 8pt Arial, Helvetica, sans-serif; color: #900; text-transform: uppercase; }
#announcements p { margin: 5px 0; }
#announcements a { text-decoration: underline; color: #036; background: url(img/bullet_go.png) right center no-repeat; padding-right: 20px; }
#announcements a:hover { text-decoration: none; }

/* Newsbox */
#newsbox { background: url(img/paper.jpg) left bottom no-repeat; padding-bottom:30px; }
h3.newsbox { font: bold 12pt Arial, Helvetica, sans-serif; background: url(img/paper.jpg) left top no-repeat; padding: 40px 20px 10px 20px; }
#newsbox li { padding: 5px 20px; }
#newsbox a { display:inline; color: #900; background: url(img/bullet_go.png) right center no-repeat; padding: 0 20px 0 0; text-decoration: underline; }
#newsbox strong { display: block; color: #900; }
#newsbox a:hover { text-decoration: none; }
#newsbox a.more-link { padding: 0 20px; }

/* Footer */
#footer { width: 960px; margin: 0 auto; background: url(img/bg.png) bottom left no-repeat; padding: 20px 30px 40px 30px; text-align: center; }
#footer ul { margin-bottom: 10px; }
#footer li { display: inline; margin: 5px; }
#footer a:hover { text-decoration: none; }

/* Page Navigation */
.wp-pagenavi { text-align: center; background: #fff; border: 1px solid #ccc; padding: 10px; }
.wp-pagenavi .pages { margin-right: 10px; }
.wp-pagenavi span.current, .wp-pagenavi a { padding: 2px 5px; background: #eee; border: 1px solid #ccc; margin-right: 5px; }
.wp-pagenavi a { text-decoration: none; color: #000; }
.wp-pagenavi a:hover { background-color: #4d4d49; color: #fff; }
.wp-pagenavi span.current { background: #4d4d49; color: #fff; border-color: #4d4d49; }

/* FAQS */
#faqs h3 { font: bold 18px "Traditional Arabic"; line-height:1; color: #900; padding: 0 0 5px 10px; background: url(img/icon-plus.png) right center no-repeat; }
#faqs h3:hover { cursor: pointer; }
#faqs p { display:none; }
#faqs {}

/* Image map */
#lcmap { margin-bottom: 20px; }
div.popup { display: none; position: absolute; background-color: #ffffe1; padding: 10px 10px 0 10px; border:1px solid #000; z-index: 1000; }

/* Col1 (Content) Styles */
#content h2 { font: normal 16pt Arial, Helvetica, sans-serif; border-bottom: 1px solid #808080; margin-bottom: 10px; }
#content h3 { margin-top: 20px; font: bold 10pt Arial, Helvetica, sans-serif; color: #900; }
#content h3 a { text-decoration: none; color: #900; text-decoration: none; }
#content h3 a:hover { text-decoration: underline; }
#content h4 { font: bold 10pt Arial, Helvetica, sans-serif; }
#content p { margin-bottom: 10px; }
#content p.post-date { color: #c60; }
#content ul, #content ol { margin: 10px 20px; }
#content ul { list-style: disc; }
#content ol { list-style: decimal; }
#content blockquote { margin: 0 0 10px 20px; }
#content blockquote p { margin: 0; }
#content a { color: #036; }
#content a:hover { color: #c33; }

table { width: 500; border-collapse: separate; border-spacing: 2px; border: 1px solid #808080; margin-left: 250px; margin-bottom: 10px; float:center;}
th { background: #666; color: #fff; text-align: center; font-weight: bold; vertical-align: middle; }
td { background: #eee; }
th, td { padding: 3px 5px; }


.hijri { background: url(img/calendar.jpg) left top no-repeat; padding: 40px 10px 20px 10px; height: 170px; }
.hijri span { display: block; text-align: center; font-family: "Traditional Arabic"; }
.hijri span.month { font-size: 30pt; }
.hijri span.year { font-size: 30pt; line-height: 0.75em; }
.hijri span.day { font-size: 50pt; line-height: 0.75em;  }

.slideshow { margin-bottom: 10px; }
.alignleft { float: left; margin: 0 15px 10px 0; }
#centerposition {float:center; padding:5px 20px; } /* # use for id*/
#spanrow {float:center; padding: 30px 30px 200px 200px; } /* # use for id*/

/*------------------------------------------------------------------
  3. Buttons
-------------------------------------------------------------------*/
.buttons a, button{
	float:center;
	margin:0 7px 0 0;
	text-decoration:none;
	background-color:#f5f5f5;
	border:1px solid #dedede;
	border-top:1px solid #eee;
	border-left:1px solid #eee;
	padding:5px 10px 6px 7px;
	display:block;
	cursor:pointer;
	font-size:100%;
	line-height:130%;
	color:#333;
	font-weight:bold;
}
button{ 
	font-family:"Lucida Grande", Tahoma, Arial, Verdana, sans-serif;
	width:auto;
	overflow:visible;
	font-weight:bold;
	padding:4px 10px 3px 7px; 
}
button[type]{
	width:auto;
	padding:5px 10px 5px 7px; 
	line-height:17px; 
}
*:first-child+html button[type]{
	padding:4px 10px 3px 7px; 
}
button img, .buttons a img{
	margin:0 3px -3px 0 !important;
	width:16px;
	height:16px;
	padding:0 !important;
	border:none !important;
}
button:hover, .buttons a:hover{
	background-color:#dff4ff;
	border:1px solid #c2e1ef;
	color:#336699;
}
.buttons a:active{
	background-color:#6299c5;
	border:1px solid #6299c5;
	color:#fff;
}
button.positive, .buttons a.positive{ color:#529214; }
.buttons a.positive:hover, button.positive:hover{
	background-color:#E6EFC2;
	border:1px solid #C6D880;
	color:#529214;
}
.buttons a.positive:active, td.positive{
	background-color:#529214;
	border:1px solid #529214;
	color:#fff;
}
.buttons a.negative, button.negative{color:#d12f19;}
.buttons a.negative:hover, button.negative:hover{background:#fbe3e4;border:1px solid #fbc2c4;color:#d12f19;}
.buttons a.negative:active, td.negative{background-color:#d12f19;border:1px solid #d12f19;color:#fff;}

