/* CSS Document */

/*
-----------------------------------------------
MASTER STYLE SHEET (universal.css)

Site: AuthorsOnTheWeb.com
Company:  AuthorsOnTheWeb.com
Author:   Sunil Kumar (sunil@bookreporter.com)
Version:  September 11, 2008
File Path: ../css/universal.css
----------------------------------------------- */




/* = GLOBAL DETAILS
-------------------------------------------------------------------------------------
-------------------------------------------------------------------------------------
-------------------------------------------------------------------------------------*/

body { 
	margin: 0;
	padding: 0;
	background-color: #000;
	font-family: Verdana,sans-serif;
	font-size: 13px;
	line-height: 18px;
	color: #000;
	
	background: #230b0e url(../images/page/bg.jpg) repeat-x top center;
	}

img {
	display: block;
	border: none;
	}	

.clearleft {
	clear: left;
	}

.clearright {
	clear: right;
	}

.clear {
	clear: both;
	}		


/* =Text
------------------------------------------*/

.title {
	position: relative;
	margin-top: 0px;
	margin-bottom: 8px;
	left: -13px;
	padding-left: 13px;
	background: url(../images/page/arrow_down.jpg) no-repeat center left;
	
	font-family: Verdana,sans-serif;
	font-size: 18px;
	font-weight: bold;
	color: #6D2C35;
	}

.title span {
	font-weight: normal;
	}	


.title2 {
	position: relative;
	margin-top: 0px;
	margin-bottom: 10px;
	padding-left: 10px;
	background: url(../images/page/arrow_right.jpg) no-repeat center left;
	
	font-family: Verdana,sans-serif;
	font-size: 15px;
	font-weight: bold;
	color: #6D2C35;
	}

.grey {
	font-weight: normal;
	font-size: 11px;
	color: #777878;
	}


/* =Text Block
------------------------------------------*/

.block {
	position: relative;
	margin: 0;
	padding: 25px 25px 25px 25px;
	border-bottom: 3px double #777878;
	}
/* IE6 fix for .block */
* html .block { width: 675px; }
/* end IE6 fix */
/* IE7 fix for .block */
*:first-child+html .block { width: 661px; }
/* end IE7 fix */
	
.more {
	position: absolute;
	right: 0;
	bottom: 0;
	}

.more a:link { color: #742A34; text-decoration: none; font-size: 12px; font-weight: bold; font-family: arial,sans-serif; }

.more a:visited { color: #742A34; text-decoration: none; font-size: 12px; font-weight: bold; font-family: arial,sans-serif; }

.more a:hover { color: #742A34; text-decoration: underline; font-size: 12px; font-weight: bold; font-family: arial,sans-serif; }


.more2 {
	position: absolute;
	right: 0;
	top: 28px;
	}

.more2 a:link { color: #742A34; text-decoration: none; font-size: 12px; font-weight: bold; font-family: arial,sans-serif; }

.more2 a:visited { color: #742A34; text-decoration: none; font-size: 12px; font-weight: bold; font-family: arial,sans-serif; }

.more2 a:hover { color: #742A34; text-decoration: underline; font-size: 12px; font-weight: bold; font-family: arial,sans-serif; }
	
	
	


/* =Links (global) 
------------------------------------------*/

a:link { color: #742A34; text-decoration: underline; font-family: Verdana,sans-serif; }

a:visited { color: #742A34; text-decoration: underline; font-family: Verdana,sans-serif;}

a:hover { color: #742A34; text-decoration: none; font-family: Verdana,sans-serif; }



.title a:link { color: #61012F; font-size: 16px; font-weight: normal; text-decoration: underline; font-family: Palatino, Palatino Linotype, Georgia, Serif; }

.title a:visited { color: #61012F; font-size: 16px; font-weight: normal; text-decoration: underline; font-family: Palatino, Palatino Linotype, Georgia, Serif;}

.title a:hover { color: #1B2958; font-size: 16px; font-weight: normal; text-decoration: none; font-family: Palatino, Palatino Linotype, Georgia, Serif; }



.subnav a:link { color: #61012F; font-size: 13px; font-weight: normal; text-decoration: underline; font-family: Tahoma, Arial, Helvetica, sans-serif; }

.subnav a:visited { color: #61012F; font-size: 13px; font-weight: normal; text-decoration: underline; font-family: Tahoma, Arial, Helvetica, sans-serif;}

.subnav a:hover { color: #1B2958; font-size: 13px; font-weight: normal; text-decoration: none; font-family: Tahoma, Arial, Helvetica, sans-serif; }


/* = GLOBAL STRUCTURE
-------------------------------------------------------------------------------------
-------------------------------------------------------------------------------------
-------------------------------------------------------------------------------------*/


.content {
	width: 1050px;
	min-height: 800px;
	margin: 0 auto;
	padding: 0;
	background: url(../images/page/bg_text.jpg) repeat-y top center;
	}
/* IE fix for .content */
* html .content { height: 800px; }
/* end IE fix */


.top {
	position: relative;
	width: 1050px;
	min-height: 800px;
	margin: 0 auto;
	padding: 0;
	background: url(../images/page/bg_top2.jpg) no-repeat top center;
	}
/* IE fix for .top */
* html .top { height: 800px; }
/* end IE fix */


.bottom {
	width: 1050px;
	height: 25px;
	margin: 0 auto;
	padding: 0;
	background: url(../images/page/text_bottom.jpg) no-repeat top center;
	}



/* =Header
------------------------------------------*/


h1 {
	display: none;
	}
	
.headquote {
	position: absolute;
	top: 20px;
	right: 38px;
	width: 490px;
	height: 45px;
	border: none;
	
	font-family: verdana,sans-serif;
	color: #FCFCFA;
	font-size: 13px;
	line-height: 14px;
	}

.headquote span {
	color: #E3DCD7;
	}	

.headquote .more {
	position: absolute;
	right: 0;
	bottom: 0;
	}

.headquote .more a:link { color: #ffffff; text-decoration: none; font-size: 11px; font-weight: bold; }

.headquote .more a:visited { color: #ffffff; text-decoration: none; font-size: 11px; font-weight: bold; }

.headquote .more a:hover { color: #ffffff; text-decoration: underline; font-size: 11px; font-weight: bold; }	



/* =Footer
------------------------------------------*/

.footer {
	margin: 0;
	padding: 25px 25px 25px 25px;
	text-align: center;
	border-bottom: none;
	
	font-size: 11px;
	line-height: 14px;
	color: #757575;
	}
	
.footer a:link { color: #742A34; text-decoration: none; font-family: Verdana,sans-serif; }

.footer a:visited { color: #742A34; text-decoration: none; font-family: Verdana,sans-serif;}

.footer a:hover { color: #742A34; text-decoration: underline; font-family: Verdana,sans-serif; }
	

	


/* = Nav
----------------------------------------*/

.nav {
	margin: 15px 0px 0px 0px;
	padding: 0px 15px 15px 15px;
	border-bottom: 3px double #777878;
	line-height: 14px;
	}

.last {
	border: none;
	}

.nav b {
	font-weight: bold;
	color: #331D21;
	}
	

.nav ul {
	list-style: none;
	margin-top: 3px;
	width: 100%;
	margin-left: 0;
	padding-left: 0;
	}	
/* IE fix for .nav ul */
*:first-child+html .nav ul { padding-bottom: 2px; } 
* html .nav ul { padding-bottom: 2px; }
/* end IE fix */	

.nav ul li {
	list-style: none;
	padding-left: 15px;
	}


.nav a:link { color: #605758; text-decoration: none; font-weight: normal; }

.nav a:visited { color: #605758; text-decoration: none; font-weight: normal; }

.nav a:hover { color: #742A34; text-decoration: none; font-weight: normal; }


a.bold:link { color: #331D21; text-decoration: none; font-weight: bold; }

a.bold:visited { color: #331D21; text-decoration: none; font-weight: bold; }

a.bold:hover { color: #742A34; text-decoration: none; font-weight: bold; }



.nav .twitter_link a:link, .nav .connect_link a:link { color: #742A34; text-decoration: none; font-size: 12px; font-weight: bold; font-family: arial,sans-serif; }
.nav .twitter_link a:visited, .nav .connect_link a:visited { color: #742A34; text-decoration: none; font-size: 12px; font-weight: bold; font-family: arial,sans-serif; }
.nav .twitter_link a:hover, .nav .connect_link a:hover { color: #742A34; text-decoration: underline; font-size: 12px; font-weight: bold; font-family: arial,sans-serif; }



/* = Featured Nav
----------------------------------------*/


.featurednav {
	width: 100%;
	margin: 20px 0px 30px 0px;
	font-family: arial,sans-serif;
	color: #706B6B;
	font-size: 11px; 
	font-weight: bold;
	}
/* IE6 fix for .featurednav */
* html .featurednav { margin-bottom: 0px; }
/* end IE6 fix */
/* IE7 fix for .featurednav */
*:first-child+html .featurednav { margin-bottom: 0px }
/* end IE7 fix */
	

.featurednav .left {
	float: left;
	clear: left;
	text-align: left;
	}
	
.featurednav .right {
	float: right;
	clear: right;
	text-align: right;
	}
	
.featurednav a:link { color: #742A34; text-decoration: none; font-size: 11px; font-weight: bold; font-family: arial,sans-serif; }

.featurednav a:visited { color: #742A34; text-decoration: none; font-size: 11px; font-weight: bold; font-family: arial,sans-serif; }

.featurednav a:hover { color: #742A34; text-decoration: underline; font-size: 11px; font-weight: bold; font-family: arial,sans-serif; }




/* = Featured
----------------------------------------*/

#websites .featured {
	width: 25%;
	}
	
#campaigns .featured {
	width: 20%;
	}
	
	
.featured {
	float: left;
	font-size: 11px;
	line-height: 12px;
	color: #757575;
	text-align: center;
	margin-top: 20px;
	}		

.featured b {
	font-size: 13px;
	font-weight: bold;
	color: #000;
	}	

.featured img {
	margin: 0 auto;
	padding: 5px;
	border: 1px solid #000;
	margin-bottom: 3px;
	}	
	
.featured  a:link { color: #605758; text-decoration: none; font-weight: normal; }

.featured  a:visited { color: #605758; text-decoration: none; font-weight: normal; }

.featured  a:hover { color: #742A34; text-decoration: none; font-weight: normal; }
	
	


	


/* = 2 Column layout
----------------------------------------*/

		

.leftcolumn {
	float: left;
	width: 221px;
	margin: 112px 12px 0px 39px;
	padding-top: 12px;
	}
/* IE fix for .leftcolumn */
* html .leftcolumn { margin-left: 20px; }
/* end IE fix */
	

.rightcolumn {
	float: left;
	width: 725px;
	min-height: 688px;
	margin: 112px 0px 0px 0px;
	padding: 0;
	padding-left: 12px;
	border-left: 1px solid #777878;
	}		
/* IE6 fix for .rightcolumn */
* html .rightcolumn { height: 688px; }
/* end IE6 fix */






/* = INDIVIDUAL PAGES
-------------------------------------------------------------------------------------
-------------------------------------------------------------------------------------
-------------------------------------------------------------------------------------*/



/* = Home
----------------------------------------*/
	

#home .featured { /* index page change for 'Featured' style listed above */
	margin-top: 5px;
	height: 150px;
	/*height: 230px;*/
	}	
	
#home #campaigns .featured {
	margin-top: 5px;
	height: 230px;
	}

#home .justlaunched {
	width: 317px;
	padding: 0px 15px 0px 0px;
	float: left;
	border-right: 1px solid #777878;
	}
/* IE6 fix for .justlaunched */
* html .justlaunched { width: 310px; padding-right: 10px; }
/* end IE6 fix */

#home .currentcampaigns { 
	position: relative;
	left: -1px;
	width: 316px;
	padding: 0px 0px 0px 25px;
	float: left;
	border-left: 1px solid #777878;
	}	
/* IE6 fix for .currentcampaigns */
* html .currentcampaigns { width: 310px; padding-left: 20px; }
/* end IE6 fix */
	


/* = Clients (WD+D)
----------------------------------------*/


.alpha {
	font-size: 16px;
	color: #AEAEAE;
	font-weight: bold;
	margin-top: 10px;
	margin-bottom: 10px;
	}

#wddclients .block p {
	padding-bottom: 0;
	margin-bottom: 0;
	}
	
#wddclients .block ul {
	list-style: none;
	margin: 0px 0px 15px 10px;
	padding-left: 0;
	}
			
#wddclients .block ul li {
	list-style: none;
	margin-left: 0;
	margin-right: 0;
	margin-bottom: 3px;
	}		

#wddclients .block ul.connect {
	list-style: none;
	margin: 0 0 15px 8px;
	}
			
#wddclients .block ul.connect li {
	list-style: none;
	margin: 0;
	padding: 0 5px 0 0px;
	color: #605758;
	display: inline;
	}	

#wddclients .block ul.connect li a:link, #wddclients .block ul.connect li a:visited {
	color: #605758;
	text-decoration: underline;	
	}	

#wddclients .block ul.connect li a:hover {
	color: #742a34;
	text-decoration: underline;	
	}	
	
#wddclients .subnav {
	padding: 3px 0px;
	text-align: center;
	white-space: nowrap;
	background-color: #aeaeae;
	}

#wddclients .subnav a:link {
	padding: 3px 3px;
	color: #fff;
	text-decoration: none;
	}
#wddclients .subnav a:visited {
	padding: 4px;
	color: #fff;
	text-decoration: none;
	}
#wddclients .subnav a:hover {
	padding: 4px;
	color: #fff;
	text-decoration: none;
	background-color: #787878;
	}

#wddclients .subnav .first {
	text-decoration: none;
	border-left: 1px solid #fff;
	margin-left: 8px;
	}
		

#wddclients .subnav .last {
	text-decoration: none;
	border-right: 1px solid #fff;
	margin-right: 8px;
	}

	
/* = Portfolio - Featured Websites (WD+D)
----------------------------------------*/
#wddclients #subnav-genre {
	background-color: #aeaeae;
	padding-top: 10px;
	border-top: #ffffff 1px solid;
	font-size: 11.5px;	
	}
	
#wddclients #subnav-genre ul {
	list-style: none;
	margin: 0 0 0 23px;
	padding-bottom: 15px;
	}

#wddclients #subnav-genre div strong {
	display: block
	font-weignt: bold;
	margin: 0 0 0 15px;
	}
			
#wddclients #subnav-genre ul li {
	list-style: none;
	margin: 0;
	padding: 0;
	line-height: 1.1em;
	}	

#wddclients  #subnav-genre a:link, #wddclients #subnav-genre a:visited {
	color: #ffffff;
	text-decoration: none;	
	}	

#wddclients  #subnav-genre a:hover {
	color: #787878;
	text-decoration: underline;	
	}		

#wddclients .subnav-genre-footer {
	clear: left;
	border-top: #ffffff 1px solid;
	text-align: right;
	padding: 5px 15px;
	display: block;
	}
	 		
		
/* = Portfolio - Featured Websites (WD+D)
----------------------------------------*/


.site {
	float: left;
	clear: left;
	margin: 0px 15px 15px 0px;
	padding: 5px;
	border: 1px solid #000;
	}

.sitetext {
	margin: 0px 0px 0px 427px;
	}

		


/* = Campaigns - Featured Campaigns (IM)
----------------------------------------*/

.cover {
	float: left;
	clear: left;
	margin: 0px 15px 15px 0px;
	padding: 5px;
	border: 1px solid #000;
	}

.covertext {
	margin: 0px 0px 0px 238px;
	}



/* = Who We Are
----------------------------------------*/


.photo {
	float: left;
	clear: left;
	margin: 0px 15px 15px 0px;
	}



/* = Contact Us
----------------------------------------*/

	
/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */

.cssform fieldset{
width: 400px;
margin: 0;
padding: 5px 20px 8px 0;
padding-left: 255px; /*width of left column containing the label elements*/
border: none;
border-top: 1px dashed #777878;
height: 1%;
}


.cssform div {
margin-top: 15px;
margin-bottom: 5px;
display: block;
}

.cssform label{
font-weight: bold;
float: left;
clear: left;
margin-left: -255px; /*width of left column*/
width: 250px; /*width of labels. Should be smaller than left column (155px) to create some right margin*/
}

.cssform label span{
font-weight: normal;
font-size: 11px;
color: #777878;
}


.cssform input[type="text"]{ /*width of text boxes. IE6 does not understand this attribute*/
width: 250px;
border: 1px solid #777878;
}

.cssform textarea{
width: 300px;
height: 200px;
/*float: right;
clear: right;*/
border: 1px solid #777878;
}



.cssform .submit {
width: 400px;
clear: left;
margin: 0;
padding: 0 0 8px 0;
padding-left: 255px; /*width of left column containing the label elements*/
border: none;
height: 1%;
}

.submit input {
margin-top: 20px;
}


/*.threepxfix class below:
Targets IE6- ONLY. Adds 3 pixel indent for multi-line form contents.
to account for 3 pixel bug: http://www.positioniseverything.net/explorer/threepxtest.html
*/

* html .threepxfix{
margin-left: 3px;
}		



#yes {
	display: none;
	}
	
#no {
	display: none;
	}	
	
#im {
	display: none;
	}	
	
#wddyes {
	display: none;
	}	
	
#wddno {
	display: none;
	}	

.clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden;}
.clearfix{display:inline-block;}/* ie5mac backslash hack \*/ 
* html .clearfix{height:1%;}
.clearfix{display:block;}/* end ie5mac backslash hack */
.fbpromo {margin-bottom:7px;border-bottom:1px solid #CCC;padding-bottom:7px;}
.fbpromo img {
border-top-width: medium;
border-right-width-value: medium;
border-right-width-ltr-source: physical;
border-right-width-rtl-source: physical;
border-bottom-width: medium;
border-left-width-value: medium;
border-left-width-ltr-source: physical;
border-left-width-rtl-source: physical;
border-top-style: none;
border-right-style-value: none;
border-right-style-ltr-source: physical;
border-right-style-rtl-source: physical;
border-bottom-style: none;
border-left-style-value: none;
border-left-style-ltr-source: physical;
border-left-style-rtl-source: physical;
border-top-color: -moz-use-text-color;
border-right-color-value: -moz-use-text-color;
border-right-color-ltr-source: physical;
border-right-color-rtl-source: physical;
border-bottom-color: -moz-use-text-color;
border-left-color-value: -moz-use-text-color;
border-left-color-ltr-source: physical;
border-left-color-rtl-source: physical;
}
.fbpromo span {float:left;width:225px; text-align:center; margin-top:0px;font-size:85%;color:#666; line-height: 1em; display:block; }
.fbpromo span img { margin-bottom:0; display: block; margin-left:auto; margin-right:auto; }
.fbpromo span img.withtext { float: left; margin-right: 0; padding-right: 0;}
.fbpromo div{ float:right;width:425px; }
.fbpromo textarea { width:420px;height:65px;font-size:12px; }


/* = flickr
------------------------------------------*/

#flickr {
	padding:0;
	margin:0;
}

#flickr a img {
	float:left;
	margin:0 8px 8px 0px;
	background:#ffffff;
	padding:3px;
	width:76px;
	height:76px;
	border: 1px #000 solid;
}

#flickr a img:hover {
	background:#662028;
	padding:4px;
	border: none;
}