/*-----------------------------------------------*/
/*AUTHOR: Feroze Natasha Kistan
WEBSITE: http://www.angelart.co.za
TEMPLATE NAME:Angelart 
VERSION: 3.1
DATE: 06/08/2010 
/*-----------------------------------------------*/
/*------------------------Page Start-----------------------------------------------------------------*/
/*------------------------Body Start----------------------------------------------*/
body          { font-family : Lucida Sans Unicode, Lucida Sans, Lucida Grande, Verdana, Arial, Helvetica, sans-serif; font-size : 11px; background-image : url(../images/1.png); background-attachment : fixed;   background-repeat : repeat; background-color : #000000; }
#wrapper      { margin : 0 auto -30px; width : 786px; height : auto; padding : 0 0 0 0; background-color : #000000; }
#bar          { width : 786px; height : 30px; clear : both; background-image : url(../images/bar.png); background-repeat : no-repeat; }
#logo         { background-image : url(../images/logo.png); background-repeat : no-repeat; padding-bottom:10px; width : 200px; height : 220px; float : left; }
#slider       { width : 586px; height : 220px; float : right; }
#menu         { margin : 0 0 0 0; padding : 0; width : 200px; float : left; }
#pug          { width : 200px; min-height : 200px; background : url(../images/pug.png) no-repeat; background-position : left bottom; float : left; }
#content      { color : #fff; border : 0 solid #ccc; background : #000000; width : 546px; height : auto; float : right; padding : 0 20px 20px 20px; }
.contentleft  { width : 100%; float : left; margin : 0 0 10px 0; }
.contentright { width : 48%; float : right; margin : 0 0 10px 0; }
.clear        { clear : both; margin : 0; padding : 0; }
.linkicon     { border : 0 solid #fff; background-color : transparent; padding : 8px 20px 0 0; }
.slimicon     { border : 5px solid #000; background-color : #fff; padding : 8px; }
.contenticon  { float : left; border : 0 solid #fff; background-color : transparent; margin : 5px 20px 0 0; }
#footer       { color : #fff; text-align : right; clear : both; width : 786px; height : 30px; background : url(../images/footer.png) no-repeat; }
#footer .tag  { float : right; display : inline; padding-top : 8px; padding-right : 17px; }
/*------------------------Body End--------------------------------------------*/
/*------------------------Menu Start------------------------------------------*/
ul.nav, ul.nav ul          { margin : 0;  padding-left: 0px;  width : 200px;  list-style : none; }
ul.nav li                  { list-style-type : none;  height : 40px;  margin : 0;  position : relative;  color : #fff; }
ul.nav li > ul             { display : none;  position : absolute; top : 2px; left : 199px; }
ul.nav                     { display : block; }
ul.nav li a:hover,.current { color: #cc2151; }
ul.nav li:hover > ul       { display : block; }
ul.nav li a                { text-align : left; height : 40px; padding : 0 45px; font : 85% Verdana, Arial, Helvetica, sans-serif; color : #fff; display : block; background-color : #000; text-decoration : none; outline : none;}
ul.nav li a span           { color : #fff; width: 150px; padding-top : 5px; font-size : 140%; font-family : Lucida Sans Unicode, Verdana, Arial, Helvetica, sans-serif; display : block; }

li#home a 		  {	background: #000 url(../images/home.png)no-repeat 10px center;}li#home a:hover 		  			 {background-color:#333;}
li#about a 		  {	background: #000 url(../images/about.png) no-repeat 15px center;} li#about a:hover 				 {background-color:#333;}
li#services a 	  {	background: #000 url(../images/services.png) no-repeat 10px center;} li#services a:hover 		 {background-color:#333;}
li#portfolio a 	  {	background: #000 url(../images/portfolio.png) no-repeat 10px center;} li#portfolio a:hover 		 {background-color:#333;}
li#projects a 	  {	background: #000 url(../images/projects.png) no-repeat 15px center;} li#projects a:hover 		 {background-color:#333;}
li#tutorials a 	  {	background: #000 url(../images/tutorials.png) no-repeat 10px center;} li#tutorials a:hover 		 {background-color:#333;}
li#links a 		  {	background: #000 url(../images/links.png) no-repeat 10px center;} li#links a:hover 				 {background-color:#333;}
li#freebies a 	  {	background: #000 url(../images/freebies.png) no-repeat 12px center;} li#freebies a:hover 		 {background-color:#333;}
li#blog a 		  {	background: #000 url(../images/wordpress-blog.png) no-repeat 10px center;} li#blog a:hover       {background-color:#333;}
li#contact a 	  {	background: #000 url(../images/contact.png) no-repeat 10px center;} li#contact a:hover           {background-color:#333;}
li#camera a 	  {	background: #000 url(../images/camera.png) no-repeat 10px center;} li#camera a:hover 			 {background-color:#333;}
li#website-icon a {	background: #000 url(../images/website-icon.png) no-repeat 10px center;} li#website-icon a:hover {background-color:#333;}
li#graphic-icon a {	background: #000 url(../images/graphic-icon.png) no-repeat 15px center;} li#graphic-icon a:hover {background-color:#333;}
li#none a 		  {	background: #000 url(../images/none.png) no-repeat 5px center;} li#none a:hover 				 {background-color:#333;}
/*------------------------Menu End------------------------------------------*/
/*------------------------Headers Start------------------------------------------*/
p          { padding : 5px 10px; text-align : justify; }
h1         { font-weight : bold; padding : 0 0 5px 0; color : #cc2151; font-size : 180%; border-bottom : 1px dotted #fff; text-indent : 15px; }
h2         { color : #cc2151; font-size : 14px; padding : 6px 11px; }
h3         { color : #cc2151; font-size : 14px; padding : 0 0 5px 0; border-bottom : 1px dotted #fff; padding : 10px 10px; margin : 0 0 10px 0; }
blockquote { margin : 5px; display : block; border-left : 5px solid #cc2151; padding : 5px; background : #666; }
/*------------------------Headers End---------------------------------------------*/
/*------------------------Links Start---------------------------------------*/
a         { text-decoration : none; }
a:link    { color : yellow; background-color : transparent; }
a:visited { color : #fff; background-color : transparent;}
a:hover   { color : #aeaeae; background-color : transparent;}
a:active  { color : #fff; background-color : transparent;}
/*------------------------Links End----------------------------------------------*/
/*------------------------Contact Start---------------------------------------------*/
form          { background : #000000; padding : 1em; border : 0 dotted #fff; margin : 1em; width : 506px; }
#submitbutton { margin : 0 0 10px 0;  padding : 4px 7px;  background : #cc2151; color : #fff; border : 0; position : relative;  top : 10px; left : 382px; width : 100px;
    border-bottom : 1px double #660000; border-top : 1px double #660000; border-left : 1px double #ff0033; border-right : 1px double #ff0033; cursor : pointer !important ; }
form ul       { list-style : none;}
form li       { margin : 0.3em 0; clear : both; }
label         { float : left; width : 10em; text-align : right; margin-right : 1em; }
legend        { color : #cc2151; font-size : 14px; }
legend span   { width : 10em; text-align : right; }
input         { padding : 0.15em; width : 350px; border : 1px solid #000; background : #fafafa; font : 11px Lucida Sans Unicode, Lucida Sans, Lucida Grande, Verdana, Arial, Helvetica, sans-serif;     -moz-border-radius: 0.4em; -khtml-border-radius: 0.4em; }
input:hover, input:focus { border-color : #c5c5c5; background : #c0c0c0; }
fieldset      { border : 1px solid #ddd; padding : 0 0.5em 0.5em; }
fieldset div  { margin : 0.3em 0; clear : both; }
input.default { color : #bbb; }
.radio, .date { position : relative; padding-left : 25px; margin-left : 5px; }
.radio fieldset, .date fieldset { border : none; width : auto; padding : 1px 0 0 11em; }
.radio legend, .date legend { font-size : 1em; color : #000;}
.radio legend span, .date legend span { position : absolute; left : 0; top : 0.3em; width : 10em; display : block; }
.radio label, .radio input { vertical-align : middle; padding-left : 15px; display : inline; float : none; width : auto; background : none; border : none; }
.radio div { float : left; white-space : nowrap; clear : none;}
.filetextbox { float : right; margin-right : 15px; }
.filediv { position : relative; width : 100px; height : 23px; overflow : hidden; }
.filebutton { width : 100px; position : absolute; top : 0; background-color : #cc2151; color : #ffffff; border-style : solid; }
.filehidden { font-size : 45px; position : absolute; width : 100px; right : 0; top : 0;}
/*------------------------Contact End---------------------------------------------------*/
table.colour    { border-collapse : collapse; margin : 10px; }
table.colour th { color : #666; }
table.colour th { background : #fff; height : 9px; padding-left : 12px; padding-right : 12px; text-align : center; border-left : 1px solid #666; border-bottom : 2px solid #666; color : #666; }
table.colour tr { height : 10px; width : 100px; border-right : 1px solid #666; }
table.colour td { padding-left : 11px; padding-right : 11px; border-left : 1px solid #666; border-bottom : 1px solid #666; color : #000000; background : #fff; width : 50px; text-align : center; }
td.first, th.first { border-left : 0; }
tr.row-a { background : #000000; }
tr.row-b { background : #000000; }
/*------------------------GreyBox Start----------------------------------------------------------------------*/
/*------------------------Page End----------------------------------------------------------------------*/
#GB_overlay { background-color: #000; position: absolute; margin: auto; top: 0; left: 0; z-index: 100; }
#GB_window {  left: 0; top: 0; font-size: 1px; position: absolute; overflow: visible; z-index: 150; }
#GB_window .content { width: auto; margin: 0; padding: 0; }
#GB_frame { border: 0; margin: 0; padding: 0; overflow: auto; white-space: nowrap; }
.GB_Gallery { margin: 0 22px 0 22px; }
.GB_Gallery .content { background-color: #fff; border: 3px solid #ddd; }
.GB_header { top: 10px; left: 0; margin: 0; z-index: 500; position: absolute; border-bottom: 2px solid #555; border-top: 2px solid #555; }
.GB_header .inner { background-color: #333; font-family: Arial, Verdana, sans-serif; padding: 2px 20px 2px 20px; }
.GB_header table { margin: 0; width: 100%; border-collapse: collapse; }
.GB_header .caption { text-align: left; color: #eee; white-space: nowrap; font-size: 20px; }
.GB_header .close { text-align: right; }
.GB_header .close img { z-index: 500; cursor: pointer; }
.GB_header .middle { white-space: nowrap; text-align: center; }
#GB_middle { color: #eee; }
#GB_middle img { cursor: pointer; vertical-align: middle; }
#GB_middle .disabled { cursor: default; }
#GB_middle .left { padding-right: 10px; }
#GB_middle .right { padding-left: 10px; }
.GB_Window .content { background-color: #fff; border: 3px solid #ccc; border-top: none; }
.GB_Window .header {  border-bottom: 1px solid #aaa; border-top: 1px solid #999; border-left: 3px solid #ccc; border-right: 3px solid #ccc; margin: 0; height: 22px; font-size: 12px; padding: 3px 0; color: #333; }
.GB_Window .caption { font-size: 12px; text-align: left; font-weight: bold; white-space: nowrap; padding-right: 20px; }
.GB_Window .close { text-align: right; }
.GB_Window .close span { font-size: 12px; cursor: pointer;  }
.GB_Window .close img { cursor: pointer; padding: 0 3px 0 0;}
.GB_Window .on { border-bottom: 1px solid #333; }
.GB_Window .click { border-bottom: 1px solid red; }


/* The Nivo Slider styles */
.nivoSlider {
	position:relative;
	background:url(images/loading.gif) no-repeat 50% 50%; 

}
.nivoSlider img {
	position:absolute;
	top:0px;
	left:0px;
	display:none;

}
/* If an image is wrapped in a link */
.nivoSlider a.nivo-imageLink {
	position:absolute;
	top:0px;
	left:0px;
	width:100%;
	height:100%;
	border:0;
	padding:0;
	margin:0;
	z-index:60;
	display:none;
}
/* The slices in the Slider */
.nivo-slice {
	display:block;
	position:absolute;
	z-index:50;
	height:100%;
}
/* Caption styles */
.nivo-caption {
	position:absolute;
	left:0px;
	bottom:0px;
	background:#000;
	color:#fff;
	opacity:0.8; /* Overridden by captionOpacity setting */
	width:100%;
	z-index:89;
}
.nivo-caption p {
	padding:5px;
	margin:0;
}
/* Direction nav styles (e.g. Next & Prev) */
.nivo-directionNav a {
	position:absolute;
	top:45%;
	z-index:99;
	cursor:pointer;
}
.nivo-prevNav {
	left:0px;
}
.nivo-nextNav {
	right:0px;
}
/* Control nav styles (e.g. 1,2,3...) */
.nivo-controlNav a {
	position:relative;
	z-index:99;
	cursor:pointer;
}
.nivo-controlNav a.active {
	font-weight:bold;
}