/* CSS for ImagineBoris.com */
/* Author: Boris Savitskiy */
/* Contact: boris@imagineboris.com */

body{/*style for a overal body*/
	margin: 0; /*top,right,bottom,left*/
	background: #000 url(../images/bg.gif) fixed repeat-x;
	font-family: Arial, Helvetica, sans-serif;
}

/*STYLE FOR THE DESIGN*/
#main{/*style for whole design holder*/
	z-index: 0;
	position: relative;
	top: 0; left: 0;
	margin: 0;
	width: 100%;
	background: #000;
}
	
#topsection{/*style for the top section of the design*/
	z-index: 1;
	position: relative;
	top: 0; left: 0;
	width: 100%; height: 310px;
	background: #fff;
}

#boristree_top{/*style for top images*/
	z-index: 2;
	position: absolute;
	top: 0; left: 10px;
	width: 856px; height: 310px;
	background: url(../images/boristree_top.gif) no-repeat;
}

#bottomsection{/*style for the bottom section of the design*/
	z-index: 1;
	position: relative;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	background: #000;
}

#boristree_bottom{/*style for bottom image*/
	z-index: 2;
	position: absolute;
	top: 0px;
	left: 10px;
	width: 342px;
	height: 335px;
	background: url(../images/boristree_bottom.gif) no-repeat;
}

#boristree_right{/*expension of the grass*/
	z-index: 2;
	position: absolute;
	bottom: 0px;
	left: 564px;
	width: 284px;
	height: 73px;
	background: #fff url(../images/boristree_right.gif) repeat-x;
}

p#copyrightNote a:link, p#copyrightNote a:visited{
	color: #535151 !important;
}

p#copyrightNote a:hover{
	color: #ccc !important;
}

#contentbox{/*style for content holder*/
	z-index: 2;
	position: relative;
	left: 325px;
	top: 30px;
	padding: 15px 0 10px 0;
	height: auto;
	width: 520px;
	background: #000;
	clear: both;
}

#quote{/*style for quote of the moment section under contentbox*/
	z-index: 2;
	position: relative;
	left: 325px;
	top: 30px;
	height: auto;
	width: 520px;
	border-top: 1px solid #999;
	margin: 0 0 50px 0;
	padding: 10px 0 5px 0;
}

html>body #quote{ border-top: 1px dotted #999; }

#quote2{/*style for quote of the moment section under contentbox*/
	z-index: 2;
	position: relative;
	left: 325px;
	top: 10px;
	height: auto;
	width: 520px;
}

#quote3{/*style for quote of the moment section under contentbox*/
	z-index: 2;
	position: relative;
	left: 325px;
	top: 30px;
	height: auto;
	width: 520px;
	margin-bottom: 50px;
	padding-top: 5px;
}

#quoteLeft{/*style for quote information on the left*/
	float: left;
	top: 0px;
	left: 0px;
	height: auto;
	width: 340px;
	margin-bottom: 10px
}

#quoteRight{/*style for quote information on the right*/
	float: right;
	top: 0px;
	right: 0px;
	height: auto;
	width: 180px;
	text-align: right;
	padding-top: 15px;
}

#quoteLeft p, #quoteRight p{ margin: 0 !important; }

#bottomNote{/*style for the lowest section of the content*/
	z-index: 2;
	position: relative;
	left: 325px;
	top: 30px;
	height: 50px;
	width: 520px;
	background: #000;
	border-top: 1px solid #535151;
	text-align: right;
	margin-bottom: 100px;
}
	
html>body #bottomNote{ border-top: 1px dotted #535151 !important; }

#borisNews{
	margin-top: -15px;
}

/*STYLES FOR SUBMENU*/
#submenu{/*style for local sub naviagation*/
	border-bottom: 1px dotted #666;
	background: #111;
	padding: 3px 0 3px 0;
	height: auto;
	text-align: center;
	margin: 0 0 15px 0 !important;
	font-size: 12px;
	color: #fff;
}

html>body #submenu{ 
	border-bottom: 1px dotted #666;
	margin-top: 10px;
}

#submenu a:link, #submenu a:visited{
	margin-left: 15px;
}

#submenu a:hover{
	margin-left: 15px;
}
	
#submenu br{
	display: none;
	visibility: collapse;
}

/*STYLE FOR TEXT*/
p{/*style for defualt text*/
	font-size: 12px;
	color: #fff;
	margin: 0px 0 20px 0 !important;
}

#quote p, #quote2 p{/*style for quote of the moment at the bottom*/
	margin-top: 0px;
	font-size: 12px;
	color: #999;
}

#quoteLeft p, #quoteRight p{
	margin-top: 5px;
}

.webcaption{/*style for web site descriptions*/
	font-size: 12px;
	color: #fff;
	width: 375px;
	text-align: justify;
}

#bottomNote p{ 
	margin: 0 !important;
	font-size: 10px; 
	color: #535151; 
	padding-top: 2px;
	}

h1{
	font-size: 18px;
	margin: 150px 0 0 240px;
}

h1 a:link, h1 a:visited{
	text-indent: -999px;
	display: block;
	width: 420px;
	height: 85px;
}

h2{/*style for page subtitles*/
	font-size: 13px;
	font-weight: normal;
	font-style: normal;
	text-decoration: none;
	color: #666;
	border-bottom: 1px solid #535151;
	text-align: left;
	margin: 20px 0px 5px 0px;/*top,right,bottom,left*/
	padding: 0 0 3px 0;
	}

h3{/*style for section titles*/
	font-size: 13px;
	font-weight: normal;
	font-style: normal;
	text-decoration: none;
	color: #666;
	border-bottom: 1px solid #535151;
	text-align: left;
	margin: 20px 0px 10px 0px;/*top,right,bottom,left*/
	padding: 0 0 3px 0;
	}

h4{/*style for large text*/
	font-size: 19px;
	font-weight: bold;
	color: #fff;
	margin: 0;/*top,right,bottom,left*/
}

html>body h2, html>body h3{ border-bottom: 1px dotted #666; }
	
h2.news{
	font-size: 13px;
	font-weight: normal;
	font-weight: normal;
	font-style: normal;
	text-decoration: none;
	color: #666;
	border-bottom: 1px dotted #666;
	text-align: center;
	margin-top: 20px;
	margin-bottom: 0px;
	margin-left: 0px;
	margin-right: 0px;
}

small{/*srtle for important red content*/
	color: #FF0000;
	margin: 0px;
	font-size: 12px;
}

b, strong{ color: #666; }/*styles for bold tags*/

#linkstable0 a:link span, #linkstable0 a:visited span{
	color: #fff !important;
	height: 120px;
}

#linkstable0 a:link, #linkstable0 a:visited{	
	padding: 5px 5px 0px 8px;
	padding-bottom: 20px;
	display: block;
	width: 155px;
	height: 120px;
}

#linkstable0 a:hover{
	background: #222;
	height: 120px;
}

#linkstable0 a:hover span{
	height: 120px;
}

#linkstable0 td, #linkstable1 td, #linkstable2 td, #linkstable3 td, #linkstable4 td, #linkstable5 td, #linkstable6 td{ 
/*style for a specific links table cell*/
	padding: 0 !important;
	width: 155px;
	border: 3px solid #000;
	}

table#linkstable0 th{ 
	text-align: left; 
	padding: 0 0 0 10px;
	background: #000 !important;
	}

table#linkstable0 .even{
	border: 3px solid #000;
}

table#linkstable0, table#linkstable1, table#linkstable2, table#linkstable3, table#linkstable4, table#linkstable5, table#linkstable6{
/*style for links tables*/
	width: 500px;
	border: 0px;
	margin-bottom: 20px;	
	}

tr.odd{ /*style for links table to separet some rows in lighter grey*/
	background: #111; 
	}

.job{ 
	margin: 0 0 10px 0 !important;
}

.job span{ 
	color: #666;
}

.borisfeed{/*style for news text on the home page*/
	color: #999; 
	font-size: 15px; 
	margin-bottom: 5px !important;
	font-weight: bold;
	}

/*STYLE FOR THE MAIN MENU*/
ul#mainmenu{/*style for the main menu holder*/
	z-index: 10;
	position: absolute;
	left: 325px;
	width: 522px;
	height: 30px;
	padding: 0 !important;
	margin: 0 !important;
	border-right: 1px solid #ffffff;
	}

html>body ul#mainmenu{ 
	width: 520px; 
	border-right: 1px dotted #ffffff;
}

ul#mainmenu li{
	height: auto;
	float: left;
	margin: 0;
	list-style: none !important;
	width: 65px;
	}

/*style for main menu button visual design*/
ul#mainmenu a:link, ul#mainmenu a:visited{/*style for main menu links*/
	font-size: 13px;
	font-weight: normal;
	font-style: normal;
	text-decoration: none;
	background-color: #000;
	color: #33CCCC;
	border-left: 1px solid #fff;
	border-bottom: 1px solid #000;
	display: block;
	height: 25px;
	text-align: center;
	padding-top: 5px;
}

html>body ul#mainmenu a:link, html>body ul#mainmenu a:visited{
	border-left: 1px dotted #ffffff;
}

ul#mainmenu a:hover{/*style for main menu links*/
	font-size: 13px;
	font-weight: normal;
	font-style: normal;
	text-decoration: none;
	background-color: #95E5F0;
	color: #000;
	border-left: 1px solid #fff;
	border-bottom: 1px solid #000;
	display: block;
	height: 25px;
	text-align: center;
	padding-top: 5px;
}

html>body ul#mainmenu a:hover{
	border-left: 1px dotted #fff;
}

ul#mainmenu a.title:link, ul#mainmenu a.title:visited{/*style for main menu links*/
	font-size: 13px;
	font-weight: normal;
	font-style: normal;
	text-decoration: none;
	background-color: #95E5F0;
	color: #000;
	border-left: 1px dotted #000;
	border-right: 1px dotted #000;
	border-bottom: 1px solid #000;
	display: block;
	height: 25px;
	width: 65px;
	text-align: center;
	padding-top: 5px;
	}

/*STYLES FOR LINKS*/
a:link,  a:visited{ 
	color: #33CCCC;
	font-style: normal;
	text-decoration: none;
	}

a:hover{
	color: #666;
	font-style: normal;
	text-decoration: none;
	}

#leftNote{/*style for the left bottom note*/
	z-index: 9;
	position: absolute;
	left: 0px;
	top: 0px;
	width: 400px;
	border: 0px solid #ffffff;
	text-align: left;
	}

#leftNote p{ margin: 0 !important; }

#leftNote a:link, #leftNote a:visited{
	font-size: 10px;
	color: #535151;
	font-style: normal;
	text-decoration: none;
	margin-right: 45px;
	}

#leftNote a:hover{
	font-size: 10px;
	color: #cccccc;
	font-style: normal;
	text-decoration: none;
	margin-right: 45px;
	}

.secondMenu{/*style for the second subnavigation*/
	height: auto;
	width: 520px;
	background-color: #000000;
	border-top: 1px dotted #333333;
	margin-bottom: 10px;
	text-align: center;
	}

a.addlink:link, a.addlink:visited{/*style for special link box*/
	width: 512px;
	background: #111/*0e0e0e*/;
	text-align: center;
	display: block;
	border: 1px dotted #fff;
	padding: 3px 0 3px 0;
}

a.addlink:hover{
	background: #222;
	color: #33CCCC !important;
}

a.addlink img{/*style for an image inside addlink box*/
	border: 0 !important;
	margin: 0 0 -2px 2px !important;
}

/*STYLES FOR IMAGES*/
.photogallery #graphicsbutton{
	margin-bottom: 10px !important;
}

#graphicsbutton{/*style for graphics portfolio button*/
	margin-right: 5px;
	border: 1px dotted #ffffff;
	}

#graphicsbuttonNew{/*style for new graphics portfolio button*/
	margin-right: 5px;
	border: 1px dotted #FF0000;
	}


#imgright{/*style for right aligned image*/
	float: right;
	margin-left: 5px;
	margin-bottom: 5px;
	}

#imgleft{/*style for left aligned image*/
	float: left;
	margin-right: 5px;
	margin-bottom: 5px;
	}

#imgnews{
	border: 1px dotted #ffffff;
	}

#imgcaption{
	z-index: 0;
	position: relative;
	width: 500px;
	height: auto;
	text-align: center;
	padding-bottom: 10px;
	padding-top: 10px;
	}

#imgcaption p{
	color: #cccccc;
	font-size: 11px;
	}

p a:hover img#graphicsbutton{
	border: 1px dotted #666 !important;
}

/*STYLES FOR CONTACT FORM*/
form{/*style for default form*/
	margin-top: 10px;
	margin-left: 140px;
}

input, textarea{/*style for form input and text fields*/
	width: 245px;
	background-color: #FFFFFF !important;
	border: 1px dotted #000000;
	font-size: 12px;
	margin-left: 0px;
	padding: 2px;
}

#verif_box{/*style for image varification input field*/
	width: 180px;
}

#contacttable{
	border: 0px;
	width: 100%;
	margin: 0 0 20px 0;
}

#submit{/*style for form submit button*/
	width: 248px;
	background-color: #000000 !important;
	border: 1px solid #33CCCC;
	color: #33CCCC;
	margin-bottom: 5px;
	padding: 0px !important;
}

#reset{/*style for form reset button*/
	width: 248px;
	background-color: #000000 !important;
	border: 1px dotted #ffffff;
	color: #ffffff;
	padding: 0px !important;
}

#varerror{/*style for image varification error*/}

#varerror p{/*style for varification error text*/
	color: #fff;
	border: 1px dotted #fff;
	background: #ff0000;
	width: 245px;
	text-align: center;
}


#varimagine{/*style for images in form varification*/
	border: 1px dotted #fff;
	width: 50px;
	margin: 0 10px 0 0;
	padding: 0;
	float: left;
}

/*form hover and focus*/
input:hover, textarea:hover{/*style for input and text area fields hover*/
	background: #ff0000;
}

input:focus, textarea:focus{/*style for input and text area selected state*/
	border: 1px solid #ff0000;
}

#submit:hover{/*style for submit button hover*/
	border: 1px solid #1e7373;
	color: #1e7373;
}

#reset:hover{/*style for reset button hover*/
	border: 1px dotted #666;
	color: #666;
}

/*STYLES FOR SNAPSHOT*/
ul#snapshot2{
	display: block;
	float: none;
	margin-bottom: 25px !important;
}

ul#spanshot2 li a:link #info, ul#spanshot2 li a:visited #info{
	visibility: hidden !important;
	display: none !important;
}

/*--------------------------------------------------*/
ul#snapshot{
	display: block;
	float: none;
	margin-bottom: 25px !important;
}

ul#snapshot, ul#snapshot li{/*style for general ul and li*/
	padding: 0;
	margin: 0;
	list-style: none;
	font-size: 12px;
	color: #FFFFFF;
}

ul#snapshot li{
	position: relative;
	width: 515px;
}

ul#snapshot li:hover ul, ul#snapshot li.over ul{/*style that makes hover work incide menu div id*/
	display: block;
	z-index: 5000;
}

ul#snapshot li ul{/*style for the drop down for IE*/
	z-index: 9;
	display: none;
	position: absolute; 
	top: 0px;	
	left: -2px;
	height: 60px;
	text-align: left;
}

ul#snapshot li > ul {/*style for the drop down for Firefox*/
	bottom: 20px;
	left: -1px;
	height: 60px;
	text-align: left;
	padding-top: 2px;
	padding-left: 2px;
	margin: 0 !important;
}

ul#snapshot li:hover ul, ul#snapshot li.over ul{/*style for visuale representation of hover box*/
	z-index: 10;
	display: block;
	background-color: #ffffff;
	border: 1px dotted #000000;
	text-align: left;
}

ul#snapshot li#info{/*style for font in roll over*/
	color: #000000;
	font-size: 12px;
	text-align: left;
	margin: 0 !important;
}

ul#snapshot li#info a:link, ul#snapshot li#info a:visited{/*style for links inside web portfolio snapshot*/
	color: #000 !important;
	font-size: 12px;
	display: block;
	margin: 0 !important;
	height: 60px;
	width: 515px;
}

ul#snapshot li#info a:hover{/*style for links inside web portfolio snapshot hover*/
	color: #000 !important;
	font-size: 12px;
	display: block;
	margin: 0 !important;
}

#portfoliobutton{/*style for portfolio images that are buttons*/
	margin-top: 2px;
	border: 1px solid #ffffff;
	display: block;
	width: 515px !important;
	height: 60px !important;
}

html>body #portfoliobutton{ border: 1px dotted #ffffff; }

a.snapshotButton:link, a.snapshotButton:visited{
	font-size: 19px;
}

/*STYLES FOR LISTS*/
#bar li{
	list-style: none;
	margin: 0 0 10px 20px;
	padding-left: 10px;
	border-left: 3px solid #ccc;
	color: #999;
}

ul#bar{
	margin: 10px 0 0 0;
}

/*VALIDATION LINKS*/
#w3cHTML, #w3cCSS, #sec508{/*style for Validations*/
	z-index: 5;
	position: absolute;
	bottom: -30px;
	height: auto;
	padding-top: 2px;
	padding-bottom: 2px;
	padding-left: 3px;
	padding-right: 3px;
	}

#w3cHTML{ right: 80px; }
#w3cCSS{ right: 45px; }
#sec508{ right: 0px; }

#w3cHTML a:link, #w3cCSS a:link, #sec508 a:link, #w3cHTML a:visited, #w3cCSS a:visited, #sec508  a:visited{/*style for valid links*/
	color: #666666;
	border-bottom: 1px dotted #666666;
	font-size: 9px;
	font-style: normal;
	text-decoration: none;
	display: block;
	background-color: #000000;
	}

#w3cHTML a:hover, #w3cCSS a:hover, #sec508 a:hover{/*style for hover of valid links*/
	color: #95E5F0;
	border-bottom: 1px dotted #95E5F0;
	display: block;
	}
	
/*STZYLE FOR MOOTOOLS OBJECTS*/
#test{ }

a.h2link:link, a.h2link:visited{/*style for close and open links for links*/
	display: block;
	width: 100%;
	color: #666666;
	padding: 2px 0 2px 0;
}

a.h2link:hover{
	background: #222;
	color: #95E5F0;
}

a.h2link:link span, a.h2link:visited span{
	border: 1px dotted #666666;
	padding: 2px 5px;
	color: #95E5F0 !important;
}

a.h2link:hover span{
	color: #95E5F0 !important;
}

/*STYLES TABLES*/
table{
	font-size: 12px;
	color: #ffffff;
	width: 520px;
	border: 0px;
}

table p{ margin: 0px; }
	
td{/*default cell style*/
	padding-right: 8px;
	vertical-align: top;
}

#resumeTbl td{ padding: 0 0 1px 0 !important; }

.btnDirection{
	position: absolute;
	border-right: 1px dotted #fff;
	border-left: 1px dotted #fff;
	border-top: 1px dotted #fff;
	padding: 10px 5px 0 5px;
	height: 50px;
	background: #000;
	color: #fff;
	font-size: 30px;
	font-weight: bold;
}

#newItemBox{/*style for small top box on image as new addition*/
	position: absolute;
	width: 120px;
	border: 1px solid #990000;
	background: #990000;
	color: #fff;
	font-size: 9px;
	text-align: center;
}

.slideBox{
	display: block;
}

/*--------------------------STYLES FOR IMAGE HOVER--------------------------*/
.hover_block{
	position: relative;
	margin: 0 0 30px 0;
}

.hover_block a:link h5, .hover_block a:visited h5{
	font-size: 19px; color: #33CCCC !important;
	margin: 0 0 2px 0 !important;
}


.hover_block a:hover h5{ font-size: 19px; color: #666 !important; }

.hover_block a:link img, .hover_block a:visited img{ 
	border: 2px solid #33CCCC;
	margin: 0 0 0 0; 
}

.hover_block a:hover img{
	border: 2px solid #666;
}

.hover_block a:hover span{
	font-size: 13px; color: #000 !important;
	background: #fff; border: 2px solid #666;
	display: block; visibility: visible;
	padding: 5px 10px;
	margin: 0 0 0 0;
	width: 495px; height: 90px;
}

ul#gallery{ list-style: none; clear: both; }
ul#gallery li{ float: left; }
