/* For IE */
@font-face{
	font-family:'ChunkFive';
	src:url('/themes/mb/fonts/Chunkfive.eot');
}
/* For Other Browsers */
@font-face{
	font-family:'ChunkFive';
	src:local('ChunkFive Regular'),
	    local('ChunkFive-Regular'),
	    url('/themes/mb/fonts/Chunkfive.otf') format('opentype');
}
.ampersand{
    font-family:'cooper black', Palatino, "Franklin Gothic Medium", impact, Baskerville, "Book Antiqua", serif;
    font-style:italic;
}

html{
    background:url(/themes/mb/images/pattern.gif);;
}
body{
    text-align:center;
    padding:20px 0 50px 0;
    color:#363636;
    font:14px/140% arial, sans-serif;
}

#wrapper{
    position:relative;
    margin:0 auto;
    padding:0 45px;
    width:870px;
    background:url(/themes/mb/images/kraftpaper.jpg);
    text-align:left;
    box-shadow:-3px 3px 20px #666;
    -moz-box-shadow:-3px 3px 20px #666;
    -webkit-box-shadow:-3px 3px 20px #666;
}
#body{
    float:left;
    width:600px;
    margin-bottom:30px;
}
#sidebar{
    float:right;
    width:229px;
    margin-bottom:30px;
}
#sidebar h2{
    font:24px/120% ChunkFive, "rockwell extra bold", "arial black", serif;
    text-transform:lowercase;
    color:#3f3f38;
    padding:15px 0;
    margin:0 0 20px;
    border-top:1px solid #e3d9cd;
    border-bottom:1px solid #e3d9cd;
}
#sidebar h2 em{
    font-style:normal;
    font-weight:bold;
    font-size:120%;
    text-transform:uppercase;
    color:#fff;
}
#sidebar ul{
    margin:5px 0 15px;
}
#sidebar li{
    list-style:none;
}


a{color:#2D5569;text-decoration:underline;}
a:hover{text-decoration:underline;}
a:visited{color:#3A6F8B;}

h1,h2,h3,h4,h5,h6{
    line-height:140%;
    margin-bottom:0.5em;
    font-weight:bold;
}
h1{
    font:40px/120% ChunkFive, "rockwell extra bold", "arial black", serif;
    text-transform:lowercase;
    color:#fff;
}
h2{
    font-size:20px;
}
h3{
    font-size:14px;
}

.blurb{
    font-size:20px;
    line-height:130%;
}



/* 
    =NAV */

#header ul.nav{
    float:right;
    list-style:none;
    margin:-9px 0 0 0;
    padding:0;
}
#header .nav li{
    float:left;
    list-style:none;
    padding:76px 0px 40px 4px;
    margin:0 0 0 4px;
    min-width:102px;
    text-align:center;
}
#header .nav a{
    font:bold 12px/100% futura, "lucida sans", sans-serif;
    text-transform:uppercase;
    text-decoration:none;
    color:#3f3f38;
    padding:30px 20px;
}

/* debugging */
/*#header .nav li{border:1px solid green;}
#header .nav a{border:1px solid red;}
*/

#header .nav a:hover,
#header .nav .selected a{
    color:#fff;
}
#header .nav .selected{
    background:url(/themes/mb/images/ribbon.gif) no-repeat center top;
}

/* 
    =HEADER */

#header{
    position:relative;
    height:147px;
}
#header #logo{
    position:relative;
    float:left;
    padding:0;
    top:36px;
}

/* 
    =FOOTER */

#footer{
    clear:both;
    position:relative;
    overflow:auto;
    margin-top:30px;
    border-top:1px solid #e0d7c9;
    padding:30px 0;
    color:#fff;
    font:12px/150% arial, sans-serif;
}
#footer a{
    color:#fff;
    text-decoration:none;
    border-bottom:1px solid #fff;
}
#footer .contact{
    float:left;
    width:310px;
    padding:0 120px 0 0;
}
#footer .nav{
    float:left;
    width:120px;
    list-style:none;
    margin:0;
    padding:0;
}
#footer .nav li{
    list-style:none;
    padding:0;
    margin-left:5px;
}
#footer .nav a{
    border:none;
}
#footer .nav a:hover{
    text-decoration:underline;
}
#footer .nav #btn_p_client_login{
    margin:10px 0;
}
#footer .nav #btn_p_client_login a{
    border:1px solid #e0d7c9;
    padding:5px;
    font-weight:bold;
}



/* 
    =HOME */

#intro_feature{
    position:relative;
    overflow:hidden;
    margin:0 0 40px 0;
    -moz-box-shadow:-3px 3px 20px #666;
    -webkit-box-shadow:-3px 3px 20px #666;
    box-shadow:-3px 3px 20px #666;
    background-color:#fff;
}
#p_home #intro{
    float:left;
    width:376px;
    padding:20px 30px;
    min-height:385px;
    background:#fff url(/themes/mb/images/notepaper.png);
}
#p_home #intro .big_blurb{
    font:bold 28px/110% arial, sans-serif;
    margin:0;
}
#p_home #intro em{
    display:block;
    font:60px/140% ChunkFive, "rockwell extra bold", "arial black", serif;
    color:#aba000;
}
#feature{
    background-color:#fff;
    position:absolute;
    top:0;
    right:0;
    width:434px;
    height:426px;
    padding:0;
    font:bold 12px/100% futura, sans-serif;
    text-transform:uppercase;
    color:#969688;
}
#feature div ul{
	margin:0;
	padding:0;
	list-style:none;
}
#feature div li{
	/* 
		define width and height of list item (slide)
		entire slider area will adjust according to the parameters provided here
	*/ 
	width:430px;
	height:460px;
	overflow:hidden; 
	margin:0;
	padding:0;
	list-style:none;
}
#feature img{
    margin:15px 15px 20px 15px;
}
#feature .project_title{
    margin:15px 0 0 15px;
}
#feature .title{
    color:#3f3f38;
}
/*
boo-hoo!

a.big_button{
    border-radius:12px;
    -moz-border-radius:12px;
    -webkit-border-radius:12px;
    padding:8px 15px 5px 15px;
    color:#F6F6F6;
    background:#e0d972 url(/themes/mb/images/big_button_bg.gif) repeat-x top;
    border:1px solid #b1a936;
    font:24px/100% ChunkFive, "rockwell extra bold", "arial black", serif;
    text-decoration:none;    
}
a.big_button:hover{
    color:#fff;
}
*/
#intro .big_button{
    display:block;
    width:269px;
    height:42px;
    text-indent:-9999px;
    background:url(/themes/mb/images/mainbutton.gif) no-repeat top left;
    outline:none;
}
#intro .big_button:hover{
    background-position:bottom left;
}
.testimonial{
    float:left;
    width:50%;
    margin:0 0 30px 0;
}
.testimonial blockquote{
    font:18px/130% georgia, serif;
    font-style: italic;
    margin:0 0 20px 0;
    padding:0 40px 0 0;
}


/* 
    =SERVICES */

#p_services #body{
    width:510px;
}
#p_services .blurb{
    margin-bottom:40px;
}
#p_services #sidebar{
    width:320px;
}
#service_descriptions{
    margin:0 0 40px 0;
    -moz-box-shadow:-3px 3px 20px #666;
    -webkit-box-shadow:-3px 3px 20px #666;
    box-shadow:-3px 3px 20px #666;
    background-color:#fff;
    padding:30px;
}
#service_descriptions h2{
    color:#549cb8;
    font:20px/120% ChunkFive, "rockwell extra bold", "arial black", serif;
    text-transform:uppercase;
}
ol#process li.one,
ol#process li.three,
ol#process li.five,
ol#process li.back{
    padding:0 5px 0 80px;
}
ol#process li.two,
ol#process li.four,
ol#process li.six,
ol#process li.eight{
    padding:0 80px 0 5px;
}
ol#process li.one{
    background:url(/themes/mb/images/num_one.gif) no-repeat center left;
}
ol#process li.two{
    background:url(/themes/mb/images/num_two.gif) no-repeat center right;
}
ol#process li.three{
    background:url(/themes/mb/images/num_three.gif) no-repeat center left;
}
ol#process li.four{
    background:url(/themes/mb/images/num_four.gif) no-repeat center right;
}
ol#process li.back{
    background:url(/themes/mb/images/back-arrow.gif) no-repeat top left;
    padding:28px 5px 0 60px;
}


/* 
    =PORTFOLIO */

.project{
    width:600px;
    margin:20px 0;
    background:#fff url(/themes/mb/images/notepaper.png);
}
.project .thumb{
    padding:10px;
}
.project a{
    color:#3f3f38;
}
.project .description{
    position:relative;
    padding:10px;
    background-color:#fff;
}
.project h2{
    width:400px;
}
.project .view_online{
    position:absolute;
    top:15px;
    right:15px;
}
.project .launch_date{
    color:#0076a3;
    margin:1em 0 0.5em 0;
    text-transform:uppercase;
    font-size:12px;
}
.project .role{
    font-style:italic;
}
#client_list, #agency_list{
    margin-bottom:40px;
}
#client_list li, #agency_list li{
    margin-bottom:5px;
}



/* 
    =ABOUT */
    
#p_about .blurb{
    margin-bottom:40px;
}
#p_about #body{
    overflow:hidden;
    width:610px;
}
#p_about #sidebar{
    overflow:auto;
}
.bio1{
    float:left;
}
.bio2{
    float:right;
}
.bio{
    width:275px;
    margin:0 25px 0 0;
}
.bio img{
    padding:14px;
    background-color:#fff;
    -moz-box-shadow:-3px 3px 18px #666;
    -webkit-box-shadow:-3px 3px 18px #666;
    box-shadow:-3px 3px 18px #666;
}
.bio h2{
    font-size:14px;
    padding:8px 0;
    margin:20px 0 20px;
    border-top:1px solid #e3d9cd;
    border-bottom:1px solid #e3d9cd;
}
.bio h2 span{
    font-weight:normal;
    font-style:italic;
    text-transform:none;
}


/* 
    =CONTACT */
    
#p_contact #body{
    float:right;
    width:560px;
    margin-top:14px;
}
#p_contact #sidebar{
    float:left;
    width:270px;
    margin-top:14px;
}
#contact_form{
    width:500px;
    -moz-box-shadow:-3px 3px 20px #666;
    -webkit-box-shadow:-3px 3px 20px #666;
    box-shadow:-3px 3px 20px #666;
    padding:20px 30px;
    background-color:#fff;    
}
#contact_form .big_button{
    display:block;
    width:87px;
    height:39px;
    text-indent:-9999px;
    background:url(/themes/mb/images/sendbutton.gif) no-repeat top left;
    outline:none;
}
#contact_form .big_button:hover{
    background-position:bottom left;
}
#contact_form .req{
    color:#f00;
}
#contact_form label{
    font-weight:bold;
}
#contact_form input,
#contact_form textarea{
    background-color:#e1dcd6;
    border:none;
    font:16px/110% arial, sans-serif;
    padding:3px;
    width:490px;
}
label.error{
    display:block;
    color:#f00;
}


/* 
    =CONTACT/THANKS */
#thanks{
    position:relative;
    width:65%;
    margin:0 auto;
}
#thanks p{
    position:absolute;
    top:200px;
    left:280px;
}



/* 
    =404 */

#p_404 #message{
    text-align:center;
    width:70%;
    margin:0 auto;
}
#p_404 #message img{
    display:inline;
    margin:0 0 10px 0;
}
#p_404 #message p{
    font:34px/120% ChunkFive, "rockwell extra bold", "arial black", serif;
    color:#fff;
}
#p_404 #message .cocktail_404 p,
#p_404 #message .cocktail_404 h3{
    font:20px/100% ChunkFive, "rockwell extra bold", "arial black", serif;
    color:#3f3f38;
    margin:0;
}
#p_404 #message .cocktail_404 p{
    font-size:16px;
}
#p_404 #message .cocktail_404{
    margin:20px 0;
}
