@charset "utf-8";
body { background: #464646 url(../images/background.png); font-family: "Helvetica Neue", Arial, Verdana, sans-serif;;
 }
html {/*overflow: -moz-scrollbars-vertical; Always show scrollbar */ height: 100%; margin-bottom: 1px;}

#wrap { background: url(../images/top_nav.png) repeat-x 0px 90px; padding-top:90px; }
#container { width: 990px; margin-right: auto; margin-left: auto; padding-bottom: 20px; }
#logo { margin-top: -70px; }
#logo a{ background: url(../images/calin_reimer.png); height: 51px; width: 215px; display: block; }


/*--------------------------------------------------Navigation--------------------------------------------------*/
#nav { margin-top: 23px; }
#nav li {float:left;}
#nav .portfolio a { background: url(../images/nav.png) 0px 0px; height: 74px; width: 126px; display: block;}
#nav .portfolio a:hover { background: url(../images/nav.png) 0px -74px;}
#nav .portfolio a:active { background: url(../images/nav.png) 0px -148px;}
#nav .resume a { background: url(../images/nav.png) -126px 0px; height: 74px; width: 129px; display: block;}
#nav .resume a:hover {background: url(../images/nav.png) -126px -74px;}
#nav .resume a:active {background: url(../images/nav.png) -126px -148px;}
#nav .contact a { background: url(../images/nav.png) -255px 0px; height: 74px; width: 126px; display: block;}
#nav .contact a:hover {background: url(../images/nav.png) -255px -74px;}
#nav .contact a:active {background: url(../images/nav.png) -255px -148px;}
#nav .portfolio_selected a{background: url(../images/nav.png) 0px -148px; height: 74px; width: 126px; display: block;}
#nav .resume_selected a{background: url(../images/nav.png) -126px -148px; height: 74px; width: 129px; display: block;}
#nav .contact_selected a{background: url(../images/nav.png) -255px -148px; height: 74px; width: 126px; display: block;}
/*----------------------------------------------End of Navigation-----------------------------------------------*/


/*------------------------------------------------Middle Portion------------------------------------------------*/
#middle_portion { margin-top: 98px; background: url(../images/middle_portion_bkg.png) repeat-x 0px 0px; height: 290px; }
#middle_portion #border { background: url(../images/middle_portion.png); height: 312px; width: 940px; margin-left: 25px; margin-top:-18px; position:absolute; z-index:0;}
#middle_portion .border_left { background: url(../images/middle_portion_left.png); height: 312px; width: 28px; position: absolute; z-index: 100; margin-top:-294px; margin-left: -3px;}
#middle_portion .border_right { background: url(../images/middle_portion_right.png); height: 312px; width: 28px; position: absolute; z-index: 100; margin-top:-294px; margin-left: 965px;}
/*--------------------------------------------End of Middle Portion---------------------------------------------*/


/*-------------------------------------------------Easy Slider--------------------------------------------------*/
#slider {  padding-left:14px;  position:relative;}
#slider ul, #slider li{ list-style:none; }
#slider, #slider li{ width:962px;  height: 276px; overflow:hidden; }
#prevBtn a { background: url(../images/left_buttons.png) 0px 0px; height: 62px; width: 62px; position:absolute; z-index:101; margin-left: -25px; margin-top: -168px; }
#prevBtn a:hover { background: url(../images/left_buttons.png) 0px -62px; }	
#prevBtn a:active { background: url(../images/left_buttons.png) 0px -124px;}
#nextBtn a { background: url(../images/right_buttons.png) 0px 0px; height: 62px; width: 62px; position:absolute; z-index:101; margin-left:954px; margin-top: -168px;}	
#nextBtn a:hover { background: url(../images/right_buttons.png) 0px -62px; }	
#nextBtn a:active { background: url(../images/right_buttons.png) 0px -124px;}

#controls {margin-top:-100px; margin-left: 25px; background-image: url(../images/middle_nav.png); height: 92px; width: 142px; background-repeat: no-repeat; background-position: -5px; }
#controls {position:absolute;}
#controls li{margin-left:-20px;}
#controls li span{ color: #2482be; font-size: 1em; }
#controls li span:hover{ color: #464646; }
#controls1 {margin-top:9px;}
/*----------------------------------------------End of Easy Slider----------------------------------------------*/


/*-----------------------------------------------------Page-----------------------------------------------------*/
#page { background: #FFFFFF; margin-top: -11px; padding-top: 11px; padding-bottom: 3px;}
.padding { margin: 10px 50px 0;}
/*-------------------------------------------------End of Page--------------------------------------------------*/


/*-----------------------------------------------------Font-----------------------------------------------------*/
h1 { font-weight:bold; font-size:1.5em; margin:1em 0 0.5em; color: #2280bc; }
h2 { font-weight:bold; font-size:1.2em; color: #2280bc; margin-top: 1em; margin-right: 0; margin-left: 0; }
h3 { font-weight:bold; font-size:1em; color: #2280bc; margin-top: .5em; margin-right: 0; margin-left: 0; }
.footer_center p { font: .9em; color: #FFFFFF; padding: 9px 0 0 32px;}
.footer_center a { font: .9em; color: #FFFFFF; padding: 0 3px 0 3px;}
.footer_center a:hover { color: #a3d7fb;}
#page p{ color: #464646; font: normal 1.1em; margin-top: .1em;}
#page a{ font-size:1.3em; color: #2280bc;}
#page a:hover{color: #464646;}
.padding-top { padding-top: .5em; }
/*--------------------------------------------------End of Font-------------------------------------------------*/


/*------------------------------------------------Portfolio Page------------------------------------------------*/
#left_content {float: left; width:600px; margin-bottom:30px;}
#right_content { float: right; background: url(../images/programs_used.png); height: 162px; width: 262px; margin-top:30px; text-align: center; }
#right_content .right_type { font-size: 1.5em; color: #FFFFFF; margin-top:15px;}
#program_holder { margin: 15px 0 0 23px; }
.flash a{float:left; background: url(../images/flash.png); height: 65px; width: 50px; margin: 0 5px 0 0;}
.photoshop a { float:left; background: url(../images/photoshop.png); height: 65px; width: 50px; margin: 0 5px 0 0;}
.illustrator a{ float:left; background: url(../images/illustrator.png); height: 64px; width: 50px; margin: 0 5px 0 0;}
.indesign a{ float:left; background: url(../images/indesign.png); height: 64px; width: 50px; margin: 0 5px 0 0;}
.dreamweaver a{ float:left; background: url(../images/dreamweaver.png); height: 64px; width: 50px; margin: 0 5px 0 0;}
.view { position: absolute; text-align: center; margin:199px 0 0 27px; height: 62px; overflow: hidden; }
.view a{ background: url(../images/view_website.png) no-repeat 0px 0px; display: block; height: 62px; width: 212px; }
.view a:hover{ background: url(../images/view_website.png) no-repeat 0px -62px; display: block; height: 62px; width: 212px; }
.view a:active{ background: url(../images/view_website.png) no-repeat 0px -124px; display: block; height: 62px; width: 212px; }
.view a{ font-size: 1.4em; color: #FFFFFF; padding-top: 14px;}
.view a:hover{ color: #a3d7fb;}
.view a:active{ color: #464646;}

.back {padding-top:10px; }
/*---------------------------------------------End of Portfolio Page--------------------------------------------*/


.clear {clear:both;}


/*-------------------------------------------------Contact Page-------------------------------------------------*/
.phone a { float:left; background: url(../contact/images/phone.png); height: 65px; width: 52px; margin: 0 5px 0 0; }
.email a { float:left; background: url(../contact/images/email.png); height: 65px; width: 52px; margin: 0 5px 0 0; }
/*---------------------------------------------End of Contact Page----------------------------------------------*/


/*-------------------------------------------------Resume Page--------------------------------------------------*/
#resume_left {width:280px; float:left; margin: -10px 0 40px 0;}
#resume_right {width:280px; float:left; margin: -10px 0 40px 40px;}
/*----------------------------------------------End of Resume Page----------------------------------------------*/


/*----------------------------------------------------Footer----------------------------------------------------*/
#footer {height:42px;}
#footer .footer_left { background: url(../images/left_footer.png) no-repeat; display: block; float: left; width: 15px; height:42px; }
#footer .footer_center{ height:42px; width: 960px; background: url(../images/footer.png) repeat-x; float:left;}
#footer .footer_right { background: url(../images/right_footer.png) no-repeat; display: block; float: left; width: 15px; height:42px; }
/*-------------------------------------------------End of Footer------------------------------------------------*/



/*--------------------------------------------------Shadow Box--------------------------------------------------*/
#sb-container,#sb-wrapper{
text-align:left; 
}
#sb-container,#sb-overlay{
position:absolute;
top:0;
left:0;
width:100%;
margin:0;
padding:0;
}
#sb-container{
height:100%;
display:none;
visibility:hidden;
z-index:999;
}
body > #sb-container{
position:fixed;
}
#sb-overlay{
height:expression(document.documentElement.clientHeight + 'px');
}
#sb-container > #sb-overlay{
height:100%;
}
#sb-wrapper{
position:relative;
}
#sb-wrapper img{
border:none;
}
#sb-body{
position:relative;
margin:0;
padding:0;
overflow:hidden;
border:1px solid #303030;
}
#sb-body-inner{
position:relative;
height:100%;
}
#sb-loading{
position:absolute;
top:0;
width:100%;
height:100%;
text-align:center;
padding-top:10px;
}
#sb-body,#sb-loading{
background-color:#060606; 
}

#sb-info,#sb-info-inner{
height:20px;
}
#sb-info-inner{
font-size:12px;
color:#fff;
}
#sb-nav a{
display:block;
float:right;
height:16px;
width:16px;
margin-left:3px;
cursor:pointer;
}
#sb-nav-close{
background-image:url(../images/close.png);
background-repeat:no-repeat;
}
/*----------------------------------------------End of Shadow Box-----------------------------------------------*/



#tooltip{
	position:absolute;
	border:1px solid #464646;
	background:#e7e7e7;
	padding:2px 5px;
	color:#464646;
	display:none;
}