/* Basic Example CSS */
/*body {
font-family: Arial,Helvetica,sans-serif;
}
*/
h3 {
color: #999;
}

div.wrapper {
position: relative;
left: 3px;
top: 25px;
width: 736px;
height: 610px;
background: url(img/portfolioBG.jpg) no-repeat 0px 0px;
display: block;
float: left;
clear: both;
}
article > .wrapper {
width: 736px;
margin: 0px auto 0;
padding: 0;
}
/* ===== Tooltip CSS ===== */
div.tooltip {/*display:none;*/ /* initially tooltips are hidden */
padding:10px;
background: #222;
color: #fff;
font-size: 13px;
font-style: italic;
}
/* ===== Scrollable CSS ===== */
/* Primary Container */
div.scrollable {
position: relative;
width: 660px;
height: 575px;
overflow: hidden;/*background-color:#181818;*/
left: 29px;/*border:1px solid #333;*/
padding:0;
margin: 0;
}
/* Items Container */
div.scrollable div.items {
width: 20000em;
position: absolute;
clear: both;
}
/* Individual Item Containers */
div.scrollable div.items div {
float: left;
position: relative;
top: -5px;
left: 0px;
width: 660px;
height: 575px;
padding: 0;/*border:solid 1px #141414;*/
/*background-color:#181818;/*#252525;*/
overflow:hidden;
}
/* Items Pics Container */
article div.scrollable div.items p img {
	position: relative;
	left: -31px;
	top: -30px;
	overflow: hidden;
	}
div#content div.items ul {
position: relative;
width: 650px;
top: 10px;
left: 5px;
float: none;
margin: 0;
margin-bottom: 20px;
padding: 0px;
text-align: center;
display: block;
z-index: 10200;/*background:#191919;*/
list-style:none;
}
div#content div.items ul li h4,div#content div.items ul li h4 a {
font-size: 19px;
font-weight:normal;
letter-spacing:0.1em;
padding: 0 0 1px 0px;
margin: 0;
text-decoration: none;
text-align: left;
z-index: 10200;/*background-color:#181818;*/
color:#d2d2d2;/*#121212;*/
text-shadow: 0px 2px 3px #000/*#2e2e2e*/;
}
div#content div.items ul li h4 a:hover {
color: #3e3e3e;
text-shadow: 1px 2px 3px #000;
}
div#content div.items ul li h5 {
margin: 3px 0 0 0;
padding: 0 0 0 1px;
text-align: left;
letter-spacing: 0.07em;
font-size: 16px;
font-weight: normal;
color: #097f97;
text-shadow: 0px 2px 3px #000;
}
/* Next and Previous buttons */
a.prev {
position: relative;
top: -320px;
left: -30px;
width: 38px;
height: 41px;
background: url(img/LeftArrow-1.jpg) no-repeat 9px 0px;
float: left;
margin: 0px;
cursor: pointer;
clear: left;
}
/* mouseover state */
a.next:hover {/*background-position:10px 0px;*/
background:url(img/RightArrow-2.jpg) no-repeat -10px 0px;
}
a.prev:hover {/*background-position:10px 0px;*/
background:url(img/LeftArrow-2.jpg) no-repeat 8px 0px;
}
/* disabled navigational button */
a.disabled {
visibility: hidden !important;
}
/* next button uses another background image */
a.next {
position: relative;
top: -320px;
left: 14px;
/*_left: 12px;*/
width: 38px;
height: 42px;
background: url(img/RightArrow-1.jpg) no-repeat -12px 0px;
float: right;
margin: 0px;
cursor: pointer;
display: inline;
clear: right;
}
/* position and dimensions of the navigator */
#main_navi img {
float: left;
margin-right: 10px;
}
#main div.navi {
margin-left: 250px;
cursor: pointer;
}
div.navi {
margin-left: 300px;
width: 150px;
height: 20px;/*background-color:#181818;*/
position:relative;
top: 570px;
z-index: 10110;
}
/* items inside navigator */
div.navi a {
width: 8px;
height: 8px;
float: left;
margin: 3px;
background: url(img/navigator.png) 0 0 no-repeat;
display: block;
font-size: 0px;
}
/* mouseover state */
div.navi a:hover {
background-position: 0 -8px;
}
/* active state (current page state) */
div.navi a.active {
background-position: 0 -16px;
}
/* ===== CSS Rounded Corners ===== */
div.tabPanes {
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
}
div.tooltip 
div.scrollable,div.scrollable div.items div {
-moz-border-radius: 18px;
-webkit-border-radius: 18px;
}

