﻿/* ----- DEFAULTS ----- */
body
{
    font-family:Arial, Helvetica, Sans-Serif;
    margin:0px;
    color:#33221d;
}
@font-face {
	font-family: 'Arial2';
	src: url('../fonts/arial2.eot');
	src: local('☺'), url('../fonts/arial2.woff') format('woff'), url('../fonts/arial2.ttf') format('truetype'), url('../fonts/arial2.svg#webfontJRQydW1n') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Black Rose';
	src: url('../fonts/blackrose.eot');
	src: local('☺'), url('../fonts/blackrose.woff') format('woff'), url('../fonts/blackrose.ttf') format('truetype'), url('../fonts/blackrose.svg#webfontJRQydW1n') format('svg');
	font-weight: normal;
	font-style: normal;
}
a
{
    text-decoration:none;
    font-weight:bold;
    -webkit-transition: color .13s linear;
    -moz-transition: color .13s linear;
    -o-transition: color .13s linear;
    transition: color .13s linear;
    color:#cdaa73;
}
a:hover
{
    color:#33221d;
    -webkit-transition: color .13s linear;
    -moz-transition: color .13s linear;
    -o-transition: color .13s linear;
    transition: color .13s linear;
    /*text-decoration:underline;*/
}
p
{
}
a img
{
    border:none;
}
h1,h2,h3,h4,h5
{
    font-family:Arial2, Arial, Sans-Serif;
    font-weight:normal;
    margin:0;
    text-shadow:-1px 1px 1px #cdaa73;
}
h1
{
    font-size:2.6em;
    margin-bottom:-5px;
}
h2
{
    font-size:1.8em;
}
h3
{
    font-size:1.4em;
}
p
{
    line-height:1.6em;
}
li
{
    margin-left:-10px;
}
/* -------------- NAV --------------- */
#navBar
{
    background-image:url(../images/header.png);
    height:93px;
    margin:0 0 0 0;
    overflow:hidden;
}
#nav li
{
    list-style:none;
    /*float:left;*/
    margin:0 0 0 0;
    font-family:Arial2, Arial, Sans-Serif;
    font-size:1.2em;
    color:#fff6e8;
    /*height:72px;*/
}
#nav li a
{
    font-weight:normal;
    color:#fff6e8;
    text-shadow:-1px 1px 1px #777;
}
#nav li a:hover
{
    text-decoration:none;
    text-shadow:0px -1px 1px #777;
}
.left, .mid, .right
{
    float:left;
    height:72px;
    background-repeat:repeat-x;
    margin-top:-8px;
}
#nav li .left, #nav li .right
{
    width:23px;
}
#nav li .mid
{
    padding:27px 22px 0 22px;
    height:56px;
}
#nav li:hover .mid
{
    background-image:url(../images/nav_hov.png);
}
#nav li:hover .left
{
    background-image:url(../images/nav_hov_left.png);
    cursor:default;
}
#nav li:hover .right
{
    background-image:url(../images/nav_hov_right.png);
    cursor:default;
}
#logo
{
    margin:28px 30px 0 32px;
    float:left;
}

/* ------------ HEADER -------------- */
#theme
{
    background-image:url(../images/theme.png);
    height:89px;
    width:32px;
    margin:6px -40px 0 0;
    float:left;
    cursor:pointer;
    /*font-size:0.7em;*/
    font-family:Black Rose, Arial, Sans-Serif;
}
#theme:hover
{
    background-position:32px 0px;
}
#bg
{
    height:430px;
    width:100%;
    background-image:url(../images/bg.jpg);
    -webkit-transition:background-position .6s .1s ease-in-out;
    -moz-transition:background-position: .6s .1s ease-in-out;
    -o-transition:background-position: .6s .1s ease-in-out;
    transition:background-position: .6s .1s ease-in-out;
    background-position:right 0px;
    background-repeat:repeat-y;
}
#bgSmall
{
    width:100%;
    height:102px;
    background-image:url(../images/bg.jpg);
    -webkit-transition:background-position .6s .1s ease-in-out;
    -moz-transition:background-position: .6s .1s ease-in-out;
    -o-transition:background-position: .6s .1s ease-in-out;
    transition:background-position: .6s .1s ease-in-out;
    background-position:right -185px;
    background-repeat:repeat-y;
}
    
#header
{
    padding:5px 0 0 0;
    width:976px;
    margin:0 auto;
}
#box, #slideshow
{
    width:465px;
    height:331px;
    padding:0 0 0 25px;
    margin:-3px 0 0 0;
    float:left;
    overflow:hidden;
    background-image:url(../images/box.png);
}
#slideshow
{
    margin-left:-4px; 
}

#box h1, #box h2, #box h3, #box h4, #box h5
{
    color:#fff6e8;
    margin:0px;
    font-weight:normal;
    letter-spacing:-1px;
    text-shadow:-1px 1px 1px #585858;
}
#box h1
{
    font-family:Black Rose, Serif;
    font-size:6.6em;
    margin-bottom:-33px;
    margin-top:-6px;
}
#box h2, #box h3, #box h4, #box h5
{
    font-family:Arial2, Serif;
}
#box h2
{
    font-size:3.5em;
    margin-bottom:-5px;
    letter-spacing:-1px;
}
#box h3
{
    font-size:3.1em;
    margin-bottom:-2px;
}
#box h4
{
    font-size:2.4em;
    margin-bottom:5px;
}
#box h5
{
    font-size:1.55em;
    letter-spacing:0px;
}
#box a
{
    letter-spacing:1px;
    color:#fff6e8;
    border-bottom:1px dotted #fff6e8;
}
#box a:hover
{
    color:#fff;
    border-bottom:1px solid #fff6e8;
}

/* ------------ OTHER SLIDESHOW STUFF -------- */
#slideNav
{
    height:139px;
    width:430px;
    margin:30px 0 0 5px;
    position:absolute;
    z-index:10;
}
#prev, #next
{
    height:79px;
    width:56px;
    margin:60px 0 0 0;
}
#prev
{
    float:left;
    background-image:url(../images/left.png);
}
#next
{
    background-image:url(../images/right.png);
    float:right;
}
#prev:hover, #next:hover
{
    background-position:right;
    cursor:pointer;
}
#slides
{
    margin:30px 30px 30px 5px;
    height:271px;
    width:430px;
    overflow:hidden;
}
#slides a
{
    color:#FFF6E8;
    -webkit-transition: margin .12s ease-in-out;
    -moz-transition: margin .12s ease-in-out;
    -o-transition: margin .12s ease-in-out;
    transition: margin .12s ease-in-out;
}
#slides a:hover
{
    color:#fff;
    margin:0 -3px 0 3px;
    -webkit-transition: margin .12s ease-in-out;
    -moz-transition: margin .12s ease-in-out;
    -o-transition: margin .12s ease-in-out;
    transition: margin .12s ease-in-out;
}
#slide1, #slide2, #slide3
{
    background-color:transparent !important;
    height:271px;
    width:430px;
}
#slide1
{
    background-color:transparent;
    background-image:url(../images/logos.png);
}
#slide2
{
    background-image:url(../images/carousel.png);
}
#slide3
{
     background-image:url(../images/aboutSlide.png);
}
.slideContent
{
    color:#fff;
    background-color:#000;
    opacity:0.8;
    filter:alpha(opacity=80);
    height:100px;
    padding:5px 15px 8px 8px;
    width:430px;
    position:absolute;
    top:188px;
}
.slideTitle
{
    font-size:1.7em;
    letter-spacing:-2px;
    font-weight:800;
    text-shadow:0px 0px 5px #000;
}
.slideText
{
    font-size:0.9em;
    line-height:1.4em;
}
/* ------------ MAIN BODY CONTENT ------------ */
#body
{
    min-height:300px;
    width:100%;
    background-image:url(../images/intro_bg.png);
    background-repeat:repeat-x;
    background-position:top;
}
#main
{
    width:922px;
    /*border-left:1px solid #d8d8d8;
    border-right:1px solid #d8d8d8;*/
    border-bottom:1px solid #d9c29d;
    min-height:275px;
    padding:15px 0 5px 25px;
    margin:0 auto;
    background-image:url(../images/col_bg.jpg);
    background-repeat:no-repeat;
    background-color:#fdf3e7;
    overflow:auto;
}
#mainContent
{
    width:900px;
}
#mainContent h1
{
    margin:155px 0 0 0;
}
#mainContent h2
{
    margin:35px 0 -5px 0;
}
#left, #right, #mid
{
    /*border:1px solid red;*/
    float:left;
    width:273px;
    margin-right:50px;
}
#right
{
    width:245px;
    margin:16px 0 0 0;
}
.icons
{
    margin:0 0 -2px 0;
}
.icon
{
    margin:0 7px -2px -9px;
}
#left p, #mid p
{
    font-weight:bold;
    font-size:1.0em;
}
#right p
{
    font-size:0.8em;
}
#titleContent
{
    display:block;
    height:80px;
}
#title
{
    float:left;
    margin:10px 0 10px 10px;
    font-weight:normal;
}
#main h6
{
    float:left;
    font-size:1.3em;
    font-family:Black Rose, Arial2, Arial;
    color:#cdaa73;
    margin:22px 0 0 12px;
    font-weight:normal;
    /*text-shadow:0px 0px 1px #999;*/
}
#summary
{
    width:230px;
    background-color:#fff;
    float:right;
    border:dashed 1px #d9c29d;
    margin:-5px 0 5px 5px;
    padding:10px 15px 5px 15px;
}
/* ------------ DESIGN PORTFOLIO ---------- */
.design
{
    margin-top:10px;
    width:900px;
    overflow:auto;
    border-top:1px solid #d9c29d;
    margin:0 0 20px 0;
    padding:10px 0 0 0;
}
.text
{
    width:450px;
    margin-right:20px;
    min-height:300px;
    float:left;
}
#main .design h2
{
    margin:0px;
    float:left;
}
#main .design h6
{
    float:right;
    margin:2px 0 0 0;
}
.portfolioHeader
{
    height:40px;
}
.services
{
    background-color:#fff;
    float:right;
    border:dashed 1px #d9c29d;
    width:140px;
    margin:0 0 0 15px;
    font-size:0.9em;
    padding:0 5px 0 0;
}
.services h3
{
    margin:10px 0 -10px 15px;
}
.portfolionText
{
}
.portfolioText p
{
    line-height:1.8em;
}
.pics
{
    float:left;
    width:410px;
}
.pic
{
    padding:13px 18px 23px 18px;
    width:394px;
    height:239px;
    background-image:url(../images/picbg.png);
}
#design
{
    width:100%;
    margin:10px auto;
}

/* ------------- PHOTO PORTFOLIO ---------- */
#photos
{
    margin:0 0 0 -13px;
    width:668px;
    float:left;
}
.photo
{
    background-image:url(../images/photobg.png);
    width:138px;
    height:137px;
    padding:10px 13px 16px 13px;
    background-repeat:no-repeat;
    background-position:0px -163px;
    -webkit-transition: margin .2s ease-in-out;
    -moz-transition: margin .2s ease-in-out;
    -o-transition: margin .2s ease-in-out;
    transition: margin .2s ease-in-out;
}
.photo:hover
{
    background-position:0px 0px;
    -webkit-transition: margin .2s ease-in-out;
    -moz-transition: margin .2s ease-in-out;
    -o-transition: margin .2s ease-in-out;
    transition: margin .2s ease-in-out;
    margin:-4px 0 4px 0;
}
#albums
{
    width:245px;
    float:left;
}
.album
{
    margin:0px 0 0px 12px;
    background-image:url(../images/albumbg.png);
    width:219px;
    height:160px;
    padding:10px 13px 16px 13px;
    background-repeat:no-repeat;
    background-position:0px -186px;
    -webkit-transition: margin .2s ease-in-out;
    -moz-transition: margin .2s ease-in-out;
    -o-transition: margin .2s ease-in-out;
    transition: margin .2s ease-in-out;
}
.album:hover
{
    background-position:0px 0px;
    -webkit-transition: margin .2s ease-in-out;
    -moz-transition: margin .2s ease-in-out;
    -o-transition: margin .2s ease-in-out;
    transition: margin .2s ease-in-out;
    margin:-4px 0 4px 12px;
}
#people, #places
{
    width:219px;
    height:160px;
    font-family:Arial2, Arial, Helvetica, Sans-Serif;
    text-align:center;
    font-size:2.0em;
    text-shadow:0px 0px 7px #000;
}
#people
{
    background-image:url(../portfolio/thumbs/jocelyn.jpg);
}
#places
{
    background-image:url(../portfolio/thumbs/places.jpg);
}
.album a
{
    color:#fff6e8;
    display:block;
    width:100%;
    height:40px;
    position:relative;
    padding-top:120px;
    font-weight:normal;
}
.album a:hover
{
    color:#fff6e8;
}

/* ----------- CONTACT FORM --------------- */
#contactForm
{
    float:left;
    width:600px;
}
#contact
{
    float:left;
    margin:-5px 0 10px 30px;
    font-size:1.2em;
}
#contact h3
{
    margin:15px 0 0 0;
}
label
{
    font-size:1.2em;
    font-weight:bold;
    letter-spacing:-1px;
}
input
{
    height:35px;
    width:440px;
    font-size:1.3em;
    padding-left:5px;
    margin:5px 0 5px 15px;
    background-image:url(../images/inputbg.gif);
    border:1px solid #ddd;
    -webkit-box-shadow:0px 0px 3px #ddd;
    -moz-box-shadow:0px 0px 3px #ddd;
    -o-box-shadow:0px 0px 3px #ddd;
    box-shadow:0px 0px 3px #ddd;
}
textarea
{
    width:431px;
    height:230px;
    font-family:Arial, Helvetica, Sans-Serif;
    font-size:1.0em;
    padding:7px;
    margin:5px 0 5px 15px;
    background-image:url(../images/inputbg.gif);
    background-repeat:repeat-x;
    background-position:top;
    border:1px solid #ddd;
    -webkit-box-shadow:0px 0px 4px #ddd;
    -moz-box-shadow:0px 0px 3px #ddd;
    -o-box-shadow:0px 0px 3px #ddd;
    box-shadow:0px 0px 3px #ddd;
}
input:hover, input:active, textarea:hover, textarea:active
{
    -webkit-box-shadow:0px 1px 7px #ccc;
    border:1px solid #bbb;
}
.green
{
    font-size:1.5em;
    font-family:Arial2, Arial, Helvetica, Sans-Serif;
    height:41px;
    width:100px;
    margin:3px 3px 10px 0;
    background-image:url(../images/greenbuttonbg.gif);
    background-position:0px 0px;
    border:1px solid #cddac4;
    -webkit-box-shadow:0px 0px 3px #ddd;
    -moz-box-shadow:0px 0px 3px #ddd;
    -o-box-shadow:0px 0px 3px #ddd;
    box-shadow:0px 0px 3px #ddd;
}
#green:hover
{
    background-position:0px -42px;
}
#green:active
{
    background-position:0px -82px;
}
.error
{
    color:Red;
    display:block;
    margin-top:5px;
}
#hire
{
    float:right;
    font-size:1.5em;
    font-family:Arial2, Arial, Helvetica, Sans-Serif;
    height:33px;
    width:100px;
    padding:8px 0 0 25px;
    background-image:url(../images/greenbuttonbg.gif);
    background-position:0px 0px;
    border:1px solid #cddac4;
    -webkit-box-shadow:0px 0px 3px #ddd;
    -moz-box-shadow:0px 0px 3px #ddd;
    -o-box-shadow:0px 0px 3px #ddd;
    box-shadow:0px 0px 3px #ddd;
}
#hire a
{
    font-weight:normal;
    display:block;
    height:100%;
    width:100%;
}
/* --------------- FOOTER ----------------- */
#footer
{
    /*border-top:1px solid #d4d4d4;*/
    /*padding:7px 0 0 0;*/
    width:946px;
    margin:6px auto 20px auto;
    height:25px;
    font-size:0.6em;
    color:#888;
}
#footerContent
{
    padding-top:5px;
    float:left;
    margin-top:5px;
    margin-bottom:5px;
}
#powered
{
    margin-top:4px;
    float:right;
    background-image:url(../images/powered.png);
    background-repeat:no-repeat;
    height:25px;
    width:205px;
    -webkit-transition: background-position .3s .5s ease-in-out;
    -moz-transition: background-position .3s .5s ease-in-out;
    -o-transition: background-position .3s .5s ease-in-out;
    transition: background-position .3s .5s ease-in-out;
    background-position:60px 0px;
}
#powered:hover
{
    -webkit-transition: background-position .4s .5s ease-in-out;
    -moz-transition: background-position .4s .5s ease-in-out;
    -o-transition: background-position .4s .5s ease-in-out;
    transition: background-position .4s .5s ease-in-out;
    background-position:0px 0px;
}
#twitter, #facebook
{
    float:left;
    margin:0 5px 0 0;
    height:32px;
    width:32px;
}
#twitter
{
    background-image:url(../images/twitter.png);
}
#twitter:hover
{
    background-position:bottom;
}
#twitter a
{
    display:block;
    height:100%;
    width:100%;
}
#facebook
{
    background-image:url(../images/fb.png);
}
#facebook:hover
{
    background-position:bottom;
}
#facebook a
{
    display:block;
    height:100%;
    width:100%;
}
