/* Css Reset */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{ margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent; }
ol,ul{ list-style:none; }
blockquote,q{ quotes:none; }
blockquote:before,blockquote:after,q:before,q:after{ content:''; content:none; }
:focus{ outline:0; }
ins{ text-decoration:none; }
del{ text-decoration:line-through; }
table{ border-collapse:collapse; border-spacing:0; }
input, textarea {
	font-size: 14px;
	font-family: Arial, Helvetica, sans-serif;
	resize: none;
}

/* General Styles */
.skiplink{ display:none; }
label{ cursor:pointer; }
a,a:visited{ color:#000; text-decoration:none;}
a focus,a:hover{ text-decoration:underline; }
body{ background: #fff url(../images/bgr_body.gif) repeat-x; color:#333333; font:14px/24px Arial, Helvetica, sans-serif; }
.wrapper{ margin:0 auto; width: 960px; position:relative; }
.clear {clear: both;}
.imgleft {
	display:block;
	float: left;
	margin: 0 20px 15px 0;
}
.imgright {
	display:block;
	float: right;
	margin: 0 0 15px 15px;
}
p {
	font-size: 14px;
	line-height: 24px;
	margin-bottom: 24px;
}
/* headings */
h1 {
	font-family: 'DistrictThin', Arial, sans-serif;
	font-size: 48px;
	margin-bottom: 20px;
}
h2 {
	font-size: 24px;
	line-height: 26px;
	margin-bottom: 15px;
}
h3 {
	font-size:18px;
	margin-bottom:15px;
	line-height:18px;
}
/* fonts */
@font-face {
    font-family: 'DistrictThin';
    src: url('distth__-webfont.eot');
    src: url('distth__-webfont.eot?#iefix') format('embedded-opentype'),
         url('distth__-webfont.woff') format('woff'),
         url('distth__-webfont.ttf') format('truetype'),
         url('distth__-webfont.svg#DistrictThin') format('svg');
    font-weight: normal;
    font-style: normal;

}
.opensans {
	font-family: 'Open Sans Condensed', Arial, sans-serif;
	font-size: 30px;
	font-style: italic;
	font-weight: 300;
	color: #9F9F9F;
}
.title {
	font-family: 'DistrictThin', Arial, sans-serif;
	font-size: 48px;
	line-height: 54px;
	font-weight: normal;
}
#page-title {
	margin-top: 75px;
	width: 255px;
	float: left;
}
#page-subtitle {
	width: 680px;
	float: right;
	margin-top: 60px;
	line-height: 36px;
}
#homeh2 {
	line-height: 35px;
    margin-bottom: 18px;
}
.separator {
	background: none repeat scroll 0 0 #E5E5E5;
    height: 1px;
    margin: 25px 0 45px;
}
.work .separator {
	background: none repeat scroll 0 0 #E5E5E5;
    height: 1px;
    margin: 15px 0 25px;
}
/* header */
#header {
	width:100%;
	background: url(../images/bgr_header.gif) repeat-x 0 bottom;
	overflow: hidden;
	padding-bottom: 7px;
}
#header-content {
	width: 960px;
	margin: 0 auto;
}
.hometitle {
	text-align: center;
	margin: 0;
}
#logo {
	background: url(../images/logo_home.gif) no-repeat;
	width: 504px;
	height: 129px;
	display: block;
	margin: 44px auto 15px;
	text-indent: -9999px;
}
#logo-inner {
	background: url(../images/logo_inner.gif) no-repeat;
	width: 250px;
	height: 77px;
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	text-indent: -9999px;
}
#top {
	height: 38px;
	background: #0c0b0a;
}
#menu {
	float: right;
	width: 648px;
    height: 38px;
    line-height: 38px;
}
#menu ul {
	float: right;
}
#menu ul li {
	float: left;
}
#menu ul li a {
	display: block;
	font-family: Arial, sans-serif;
	font-size: 17px;
	padding: 0 20px;
}
#menu ul li a:link, #menu ul li a:visited {
	color: #fff;
	text-decoration: none;
}
#menu ul li a:hover {
	color: #C4050E;
}

#menu ul li.home a {
	padding: 0 20px 0 18px;
}
#menu ul li.work a {
	padding: 0 19px 0 18px;
}
#menu ul li.products a {
	padding: 0 20px 0 14px;
}
#menu ul li.about a {
	padding: 0 20px 0 16px;
}
#menu ul li.contact a {
	padding: 0 20px 0 18px;
}

#menu ul li.home a.active, #menu ul li.home a:hover {
	background: url(../images/menu_active_home.gif) no-repeat;
	color: #C4050E;
}
#menu ul li.work a.active, #menu ul li.work a:hover {
	background: url(../images/menu_active_work.gif) no-repeat;
	color: #C4050E;
}
#menu ul li.products a.active, #menu ul li.products a:hover {
	background: url(../images/menu_active_products.gif) no-repeat;
	color: #C4050E;
}
#menu ul li.about a.active, #menu ul li.about a:hover {
	background: url(../images/menu_active_about.gif) no-repeat;
	color: #C4050E;
}
#menu ul li.contact a.active, #menu ul li.contact a:hover {
	background: url(../images/menu_active_contact.gif) no-repeat;
	color: #C4050E;
}
/* body */
#main_content {
	background: url(../images/bgr_maincontent.gif) no-repeat bottom center;
	padding: 45px 0 100px;
}
/* footer */
#footer {
	width:100%;
	background: #0c0b0a;
}
#footer .wrapper {
	background: url(../images/bgr_footer.gif) no-repeat;
	height: 353px;
	position: relative;
}
.footer-box {
	width: 194px;
	float: right;
	font-size: 12px;
	line-height: 18px;
	color: #828282;
	margin-left: 20px;
	padding-top: 30px;
}
.footer-box h5 {
	font-family: 'DistrictThin', Arial, sans-serif;
	font-size: 24px;
	font-weight: normal;
	color: #fff;
	margin-bottom: 30px;
}
.footer-box a:link, .footer-box a:visited, .footer-box a:hover {
	color: #cbcbcb;
}
#footer-nav a {
	border-right: 1px solid #cbcbcb;
	padding: 0 4px;
	line-height: 12px;
	height: 12px;
	display: inline-block;
}
.copy {
    bottom: 103px;
    color: #484848;
    font-size: 12px;
    left: 345px;
    position: absolute;
}
/* #################################
				HOME
#################################### */
.homebox-wrap {
	margin: 0 0 50px -65px;
	overflow: hidden;
}
.homebox {
	width: 190px;
	text-align: center;
	float: left;
	margin-left: 125px;
}
.homebox h3 {
	font-family: 'DistrictThin', Arial, sans-serif;
	font-size: 20px;
	font-weight: normal;
	color: #c4050e;
	text-transform: uppercase;
	margin-top: 10px;
}
h4.hometitle {
    line-height: 37px;
    padding-bottom: 25px;
}
.home-work {
	float: left;
	position: relative;
}
#raf {
	background: url(../images/img_home_raf.jpg) no-repeat 0 100%;
	width: 119px;
	height: 119px;
	margin: 79px 24px 0 0;
}
#party {
	background: url(../images/img_home_party.jpg) no-repeat 0 100%;
	width: 167px;
	height: 167px;
	margin: 53px 24px 0 0;
}
#pj {
	background: url(../images/img_home_pj.jpg) no-repeat 0 100%;
	width: 284px;
	height: 283px;
	margin-right: 24px;
}
#leakey {
	background: url(../images/img_home_leakey.jpg) no-repeat 0 100%;
	width: 167px;
	height: 167px;
	margin: 53px 24px 0 0;
}
#sns {
	background: url(../images/img_home_sns.jpg) no-repeat 0 100%;
	width: 119px;
	height: 119px;
	margin-top: 79px;
}
.open {
	text-indent: -9999px;
	background: url(../images/ico_plus.gif) no-repeat;
	width: 35px;
	height: 35px;
	display: block;
	z-index: 2;
}
#raf .open {
	position: absolute;
	bottom: -22px;
	left: -26px;
}
#party .open {
	position: absolute;
	bottom: -22px;
	left: -14px;
}
#pj .open {
	position: absolute;
	bottom: -56px;
	left: 124px;
}
#leakey .open {
	position: absolute;
	bottom: -22px;
	right: -14px;
}
#sns .open {
	position: absolute;
	bottom: -22px;
	right: -26px;
}
.go-work {
	background: #C4050E;
	-moz-border-radius: 3px 3px 3px 3px;
	-webkit-border-radius: 3px 3px 3px 3px;
	border-radius: 3px 3px 3px 3px;
	color: #fff;
	font-size: 12px;
	display: none;
}
.go-work:link, .go-work:visited, .go-work:hover {
	color: #fff;
	text-decoration: none;
}
#raf .go-work {
	padding: 2px 5px;
	position: absolute;
	left: 15px;
	top: 50px;
}
#party .go-work {
	padding: 4px 7px;
	position: absolute;
	left: 37px;
	top: 71px;
}
#pj .go-work {
	padding: 7px 9px;
	position: absolute;
	left: 92px;
	top: 126px;
}
#leakey .go-work {
	padding: 4px 7px;
	position: absolute;
	left: 37px;
	top: 71px;
}
#sns .go-work {
	padding: 2px 5px;
	position: absolute;
	left: 15px;
	top: 50px;
}
#click-txt {
	position: relative;
	padding-bottom: 75px;
}
#click-txt img {
	position: absolute;
	left: 362px;
	top: 24px;
}
#click-txt span {
	position: absolute;
	left: 350px;
	top: 60px;
	font-size: 20px;
}
/* #################################
				ABOUT
#################################### */
#main_content .about {
	background: url(../images/img_whoweare.jpg) no-repeat right top;
	min-height: 735px;
	height: auto !important;
	height: 735px;
}
.about .right {
	float: left;
	width: 640px;
	padding-bottom: 20px;
}
.about h3 {
	width: 190px;
	font-family: 'DistrictThin', Arial, sans-serif;
	font-size: 24px;
	line-height: 24px;
	font-weight: normal;
	color: #c4050e;	
}

/* ##################################
			PRODUCTS
##################################### */
.products .orosso {
	background: url(../images/logo_orosso.gif) no-repeat;
	width: 189px;
	height: 49px;
	text-indent: -9999px;
	float: none;
}
.products h2 {
	font-family: 'DistrictThin', Arial, sans-serif;
	font-size: 24px;
	font-weight: normal;
	color: #c4050e;
	clear:both;	
	padding-left: 359px;
}
.orosso-link {
	background: url(../images/link_visitorosso.gif) no-repeat;
	display: block;
	width: 120px;
	height: 118px;
	text-indent: -9999px;
	margin-left: 333px;
}
.ticket-link {
	background: url(../images/link_tickettime.gif) no-repeat;
	display: block;
	width: 120px;
	height: 118px;
	text-indent: -9999px;
	margin-left: 823px;
}
/* ######################################
				WORK
######################################### */
.work h3 {
	font-family: 'DistrictThin', Arial, sans-serif;
	font-size: 20px;
	font-weight: normal;
	color: #c4050e;
	margin: 5px 0 1px;
	text-transform: uppercase;
}
.work span {
	display: block;
	margin-bottom: 15px;
}
.work span a:link, .work span a:visited {
	color: #000;
	text-decoration: none;
}
.work span a:hover {
	color: #c4050e;
	text-decoration: underline;
}
.site-box {
	float: left;
	width: 311px;
	margin-right: 18px;
}
.site-box2 {
	float: left;
	width: 300px;
}
/* #######################################
				CONTACT
########################################## */
.contact {
	text-align: center;
}
.contact h2 {
    color: #C4050E;
    font-family: 'DistrictThin',Arial,sans-serif;
    font-size: 24px;
	font-weight: normal;
}
.contact-form {
	overflow: hidden;
	padding-top: 60px;
}
.contact-form label {
	display:block;
	text-align: left;
}
.contact-form select {
	width: 488px;
	height: 32px;
}
.contact-form select option {
   /* line-height: 32px;*/
    /*padding: 10px 0;*/
}
.customStyleSelectBox {
	-moz-border-radius: 5px 5px 5px 5px;
	border-radius: 5px 5px 5px 5px;
	-webkit-border-radius: 5px 5px 5px 5px;
	border: 1px solid #e5e5e5;
	width: 468px;
	height: 32px;
	line-height: 32px;
	padding: 0 10px;
	text-align: left;
}
.customStyleSelectBoxInner {
	background: url(../images/ico_arrow_select.gif) no-repeat center right;
	width: 468px !important;
	cursor: pointer;
}
.contact-form input {
	-moz-border-radius: 5px 5px 5px 5px;
	border-radius: 5px 5px 5px 5px;
	-webkit-border-radius: 5px 5px 5px 5px;
	border: 1px solid #e5e5e5;
	width: 468px;
	height: 32px;
	line-height: 32px;
	text-align: left;
}
.contact-form textarea {
	-moz-border-radius: 5px 5px 5px 5px;
	border-radius: 5px 5px 5px 5px;
	-webkit-border-radius: 5px 5px 5px 5px;
	border: 1px solid #e5e5e5;
	width: 954px;
	text-align: left;
	height: 210px;
	overflow: auto;	
}
.contact-form div {
	width: 470px;
	float: left;
	margin-bottom: 15px;
}
.contact-form div.first {
	margin-right: 18px;
}
.contact-form .project {
	float: none;
	margin: 0 auto 15px;
	width: 488px;
}
.contact-form .button {
	background: url(../images/link_send.gif) no-repeat;
	display: block;
	width: 110px;
	height: 109px;
	float: right;
	text-indent: -9999px;
	font-size: 0;
	line-height: 0;
	border: 0 none;
	-moz-border-radius: 0 0 0 0;
	margin-top: 15px;
	cursor: pointer;
}

