/* CSS Document */
/* Main Divs */
html,body {
margin:0;
padding:0;
font-size:11px;
}
body {
font-family:Arial, Helvetica, sans-serif;
text-align:center;
behavior:url("csshover.htc");
}
div#container {
text-align:center;
/*height:507px;*/
background:url(../img/backtop.gif) center top no-repeat;
position:relative;
}
div#container2 {
background:url(../img/back-bottom.gif) center bottom no-repeat;
}
div#header {
height:128px;
background:url(../img/sketch_02.jpg) repeat-x;
text-align:center;
}
div#header div#h2 {
width:729px;
height:100%;
margin:0 auto;
text-align:right;
background:url(../img/sketch-design-logo.jpg) left center no-repeat;
background-position:25px;
}
div#girltop, div#gflowtop, div#gskytop {
height:100%;
margin-left:405px;
width:320px;
background:url(../img/girltop.jpg) no-repeat;
position:relative;
right:-2px;
}
div#gflowtop {
background:url(../img/gflowtop.jpg) no-repeat;
}
div#gskytop {
background:url(../img/gskytop.jpg) no-repeat;
}
* html div#girltop, * html div#gflowtop, * html div#gskytop {
right:2px;
}
div#girlbot, div#gflowbot, div#gskybot {
width:331px;
height:68px;
background:url(../img/girlbot.jpg) top left no-repeat;
float:right;
position:relative;
right:2px;
}
div#gflowbot {
background:url(../img/gflowbot.jpg) top left no-repeat;
}
div#gskybot {
background:url(../img/gskybot.jpg) top left no-repeat;
}
div#wrapper {
width:729px;
/*height:507px;*/
margin:0 auto;
text-align:left;
overflow:hidden;
}
div#footer {
clear:both;
height:133px;
background:url(../img/sketch_09.jpg) repeat-x;
}
div#footer div#f2 {
width:729px;
height:100%;
margin:0 auto;
text-align:left;
background:url(../img/fback.jpg) top left no-repeat;
background-position:23px 0;
overflow:hidden;
}
div.fleft {
position:relative;
left:44px;
top:10px;
width:250px;
color:#ffffff;
}
/* content */
div#topmenu {
position:relative;
left:10px;
height:42px;
}
div#topmenu a {
color:rgb(148,149,150);
text-decoration:none;
padding:7px 10px 20px 16px;
float:left;
}
div#topmenu a.current {
background:url(../img/menucurrent.jpg) top left no-repeat;
background-position:8px 0;
color:#ffffff;
text-align:center;
width:64px;
}
div#topmenu a:hover {
color:rgb(58,162,235);
}
div#topmenu a.current:hover {
cursor:default;
color:#ffffff;
}
/* div#textcont div {
border:1px solid #000;
} */
div#left {
width:455px;
float:left;
position:relative;
top:-25px;
}
div#right {
width:265px;
float:right;
}
div#ul {
/*height:267px;*/
min-height:398px;
}
* html div#ul {
height:398px;
}
div#bl {
height:192px;
position:relative;
top:34px;
}
* html div#bl {
margin-top:6px;
}
div#bl div.left a, div#bl div.right a {
color:rgb(148,149,150);
text-decoration:none;
display:block;
padding:3px 0;
}
div.left a:hover, div.right a:hover {
color:rgb(58,162,235) !important;
}
div#bl p.norm {
line-height:1.2;
}
div.centrat {
padding-left:50px;
padding-top:30px;
}
div.centrat a {
display:inline;
font-family:Georgia, "Times New Roman", Times, serif;
font-size:medium;
color:rgb(148,149,150);
text-decoration:none;
padding:0 10px;
}
div.gallery {
}
div.gallery img {
padding:2px;
border:1px solid rgb(210,234,242);
margin-right:10px;
}
div.gallery img:hover {
border:1px solid rgb(58,162,235);
}
div#br a {
color:rgb(148,149,150);
text-decoration:none;
display:block;
padding:1px 0;
}
div#bl a:hover, div#br a:hover {
color:rgb(58,162,235);
}
.left {
width:222px;
float:left;
}
.right {
width:222px;
float:right;
}
div#bl p {
line-height:2;
color:rgb(148,149,150);
}
div#bl p a:hover {
color:rgb(92,121,152);
}
div#ur {
/*height:324px;*/
padding-left:20px;
margin-bottom:120px;
behavior:url("csshover.htc");
}
div#container div#wrapper div#textcont div#right div#ur a.port {
border:1px solid rgb(204,232,240);
display:block;
width:195px;
height:44px;
padding:2px;
text-decoration:none;
margin:19px 0 19px 0;
overflow:hidden;
}
div#ur a.port img {
border:0;
}
div#ur p {
color:#666666;
margin:5px 0;
}
div#container div#wrapper div#textcont div#right div#ur a.port:hover {
border:1px solid rgb(58,162,235);
}
a#charles, a#alex, a#elvis, a#mehigh {
display:block;
width:195px;
height:21px;
padding:25px 2px 3px 3px;
margin:19px 0;
border:1px solid rgb(204,232,240);
color:#ffffff;
font-family:Georgia, "Times New Roman", Times, serif;
font-size:large;
text-decoration:none;
}
a#charles:hover, a#alex:hover, a#elvis:hover, a#mehigh:hover {
border:1px solid rgb(58,162,235);
}
a#charles {
background:url(../img/charles.jpg) 2px no-repeat;
}
a#alex {
background:url(../img/alex.jpg) 2px no-repeat;
}
a#elvis {
background:url(../img/elvis.jpg) 2px no-repeat;
}
a#mehigh {
background:url(../img/mehigh.jpg) 2px no-repeat;
}
/*
#rightcol a.portfolio img {
border:3px solid rgb(112,112,112);
margin:7px 7px;
text-decoration:none;
color:rgb(112,112,112);
}
#rightcol a.portfolio img:hover {
border:3px solid rgb(70,176,42);
}*/
div#br {
height:110px;
position:absolute;
bottom:-10px;
padding-left:25px;
padding-top:10px;
}
* html div#br {
position:absolute;
bottom:246px;
}
div#textcont h1 {
color:rgb(58,162,235);
font-size:large;
font-family:Georgia, "Times New Roman", Times, serif;
font-weight:normal;
margin:6px 0 15px 0;
padding:0 0 0 20px;
background:url(../img/h1.jpg) left no-repeat;
}
div#textcont a {
color:#7e7e7e;
}
div#textcont a:hover {
color:#3AA2EB;
}
div#textcont div#ul p {
text-indent:4em;
color:rgb(148,149,150);
text-align: justify;
padding-right:5px;
margin:5px 0;
}
p {
margin:0;
padding:0;
}
/* footer */
div#bmenu {
width:380px;
padding-right:80px;
float:right;
}
div#bmenu a {
float:left;
color:rgb(59,175,255);
text-decoration:none;
width:75px;
padding-top:18px;
padding-bottom:10px;
text-align:center;
}
div#bmenu a:hover {
color:#ffffff;
}
div#bmenu a.current {
background:url(../img/fbut.gif) top center no-repeat;
cursor:default;
}
/* Portofolio */
img.pleft, img.pright {
padding:2px;
border:1px solid rgb(204,232,240);
}
img.pleft {
float:left;
margin-right:10px;
}
img.pright {
margin:0 0 3px 0;
}
img.pleft:hover, img.pright:hover {
border:1px solid rgb(58,162,235);
}
table {
color:#9B9C9D;
}
.span1 {
color:#9B9C9D;
}
.input {
border: 1px solid;
border-color: #BBE0EB;
height: 12px;
font-size: 9px;
color: #9B9C9D;
}
.input_select {
height: 14px;
border: 1px solid;
border-color: #BBE0EB;
font-size: 10px;
color: #9B9C9D;
}
textarea {
height: 35px;
font-size: 12px;
color: #9B9C9D;
}
.textarea_about{
height: 50px;
border: 1px solid;
border-color: #BBE0EB;
font-size: 12px;
color: #9B9C9D;
width: 200px;
}
.input_about {
border: 1px solid;
border-color: #BBE0EB;
height: 12px;
font-size: 9px;
color: #9B9C9D;
width: 200px;
}
.large {
height: 100px;
width: 250px;
}
div#featured_pics{
float: right;
margin-top:-100px;
margin-left: 250px;
}
div#scroll {
overflow: auto;
height: 220px;
scrollbar-face-color:#ffffff;
scrollbar-highlight-color:#ffffff;
scrollbar-3dlight-color:#9b9c9d;
scrollbar-darkshadow-color:#9b9c9d;
scrollbar-shadow-color:#ffffff;
scrollbar-arrow-color:#9b9c9d;
scrollbar-track-color:#ffffff;
}
div#text_scroll{
width: 430px;
text-align: justify;
}
div#scroll_right{
overflow: auto;
height: 275px;
scrollbar-face-color:#ffffff;
scrollbar-highlight-color:#ffffff;
scrollbar-3dlight-color:#9b9c9d;
scrollbar-darkshadow-color:#9b9c9d;
scrollbar-shadow-color:#ffffff;
scrollbar-arrow-color:#9b9c9d;
scrollbar-track-color:#ffffff;
}
div#scroll_right img{
margin-top: 13px;
}
div#scroll a{
color: #3aa2eb;
}
.submit {
color: #3aa2eb;
background-color: white;
height: 17px;
font-size: 12px;
border: none;
}
.login_text
{
font-size: 9px;
color: #9B9C9D;
}
.login_input {
border: 1px solid;
border-color: #BBE0EB;
height: 12px;
font-size: 9px;
color: #9B9C9D;
margin-left: 20px;
margin-top: 7px;
margin-bottom: 7px;
width: 160px;
}
.login_help {
text-align: right;
}
#lightbox{
position: absolute;
top: 40px;
left: 0;
width: 100%;
z-index: 100;
text-align: center;
line-height: 0;
}
#lightbox a img{ border: none; }
#outerImageContainer{
position: relative;
background-color: #fff;
width: 250px;
height: 250px;
margin: 0 auto;
}
#imageContainer{
padding: 10px;
}
#loading{
position: absolute;
top: 40%;
left: 0%;
height: 25%;
width: 100%;
text-align: center;
line-height: 0;
}
#hoverNav{
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
z-index: 10;
}
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}
#prevLink, #nextLink{
width: 49%;
height: 100%;
background: transparent url(../images/blank.gif) no-repeat; /* Trick IE into showing hover */
display: block;
}
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(../images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../images/nextlabel.gif) right 15% no-repeat; }
#imageDataContainer{
font: 10px Verdana, Helvetica, sans-serif;
background-color: #fff;
margin: 0 auto;
line-height: 1.4em;
}
#imageData{
padding:0 10px;
}
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }
#imageData #caption{ font-weight: bold; }
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em; }
#imageData #bottomNavClose{ width: 66px; float: right; padding-bottom: 0.7em; }
#overlay{
position: absolute;
top: 0;
left: 0;
z-index: 90;
width: 100%;
height: 500px;
background-color: #000;
filter:alpha(opacity=60);
-moz-opacity: 0.6;
opacity: 0.6;
}
.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
* html>body .clearfix {
display: inline-block;
width: 100%;
}
* html .clearfix {
/* Hides from IE-mac \*/
height: 1%;
/* End hide from IE-mac */
}