/*CSS document - Soyjoy */ body {font: 12px Verdana, Arial, Helvetica, sans-serif; color: #333; line-height: 1.4em; padding: 0; margin: 10px 0 0 0;} /*global wrapper*/ #wrapper { width: 950px; margin: 0 auto;} /* font styles */ .font { display:block; color: #CC0000; margin: 0 0 20px 0 } .font01 { color: #333;} .font02 { color: #8d8c8c;} /* clear styles */ .clear { clear: both; margin: 0; } .clear-height{ clear: both; height: 20px;} /* logo */ #logo { float: left; margin: 0; } #logo h1{ background:url(images/logo.gif) no-repeat; margin: 20px 0 0 0; padding: 0; height: 100px; width: 245px; } #logo h1 a { display: block; color: #CC0000; margin:0; padding: 0; text-indent: -9000px; text-decoration: none; height: 105px; width: 245px;} #logo h1 a:hover { display: block; color: #990000; margin:0; padding: 0; text-indent: -9000px; text-decoration: none; } #otsuka{ float: left; margin: 0; } #otsuka h2{ background:url(images/otsuka.gif) no-repeat; margin: 20px 0 0 0; padding: 0; height: 100px; width: 62px; } #otsuka h2 a { display: block; color: #CC0000; margin:0; padding: 0; text-indent: -9000px; text-decoration: none; height: 105px; width: 62px;} #otsuka h2 a:hover { display: block; color: #990000; margin:0; padding: 0; text-indent: -9000px; text-decoration: none; } /* styles menu */ #menu { float: right; background:url(images/bg-menu.gif) no-repeat; width: 621px; height: 120px; } /*line - top */ #line-topmn { float: left; width: 340px; height:24px; } #line-topmn p { font-size: 10px; margin: 0; padding: 8px 0 0 14px;} /*line - contact */ #line-contact { float: right; width: 155px; height:24px; } #line-contact a { color:#333; margin: 0; padding:0; text-decoration:none;} #line-contact a:hover { color: #DC0130; margin: 0; padding:0; text-decoration:none;} #line-contact p { font-size: 10px; margin: 0; padding: 8px 0 0 78px;} /*globalmenu*/ #globalmenu { clear: both; margin: 0 15px 0 15px; padding: 0; } *html #globalmenu { clear: both; margin: 0 15px 0 0px; padding: 0; } /* content */ #content { clear: both; margin: 0 } /* left content */ #left-content { float: left; width:627px; } /*header*/ #header { clear:both; margin: 0; } #header p{ margin-bottom:0px; } #first-column { float: left; width: 186px; margin-left:-36px;} /*#first-column { float: left; width: 186px; margin:0;}*/ #second-column { float: left; width: 445px; height: 140px; margin:15px 0 0 30px;} #second-column h2 { font: 18px Arial, Helvetica, sans-serif; color: #515151; margin: 0; padding:0;} #second-column .text {margin-top:-10px;} *html #second-column h2 { font: 18px Arial, Helvetica, sans-serif; color: #515151; margin: 0; padding:0;} #second-column p{ margin: 0; padding: 0; font-size:14px} #third-column { float: left; width: 441px; margin-left:25px; margin-top:-72px;} *html #first-column { float: left; width: 186px; margin-left:-46px} /*#first-column { float: left; width: 186px; margin:0;}*/ *html #second-column { float: left; width: 445px; height: 140px; margin:15px 0 0 30px;} *html #second-column h2 { font: 18px Arial, Helvetica, sans-serif; color: #515151; margin-bottom:-10px; padding:0;} *html #second-column p{ margin: 0; padding: 0; font-size:14px} *html #third-column { float: left; width: 441px; margin-left:25px; margin-top:-72px;} /* TVC */ #title-tvc { clear: both;background:url(images/title-tvc.gif) no-repeat; height: 33px; margin: 0; } #title-tvc h3 { float: left; font: 20px Arial, Helvetica, sans-serif; color:#fff; margin: 0; padding: 5px 0 0 15px; color:#A93864} #title-tvc h5 { float: left; font: bold 14px Arial, Helvetica, sans-serif; color:#fff; margin: 10px 0 0 0; padding:0 0 0 240px;color:#A93864} #title-tvc .gallery { clear: both; width:627px; margin: 0; padding: 10px 0 0 0; } #title-tvc .gallery img { margin: 0; padding: 0; } /* right content */ #right-content { float: left; margin:0 0 0 20px; width: 301px; } /*space banner */ .space-banner1{ clear: both; margin: 0; padding: 0; } .space-banner1 img { margin: 0; padding: 0; } .space-banner2{ clear: both; padding: 30px 0 0 0; margin: 0; } /* social link */ #connected { clear: both; border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; padding: 10px 0; margin: 15px 0; } #connected p { float: left; margin:6px 0 0 0; padding: 0; } #connected a { font:bold 12px Arial, Helvetica, sans-serif; color:#FE4DB9; margin: 0 0 0 40px; text-decoration: none; } #connected a:hover { margin: 0; color: #EF96B8;margin: 0 0 0 40px; text-decoration: none; } #connected img { float: left; margin: 0 0 0 30px; padding:0; } /*#connected a { font:bold 12px Arial, Helvetica, sans-serif; color:#4273af; text-decoration: none; } #connected a:hover { color: #5d90cf; text-decoration: none; } #connected img { margin-left:190px; margin-top:-20px;} #connected .text { margin-left:50px; margin-top:5px;} */ /* red title */ .red-box {clear: both; margin: 0; } .red-box img { float: left; margin: 0 10px 10px 10px ; padding: 0; width: 66px; height:63px} /*#third-column img { float: left; display: block; width: 95px; border: 1px solid #ff391f; margin: 6px 20px 0 0; padding: 0 ; }*/ .red-box p {margin: 0; padding: 15px 0 5px 0; } .red-box p a { font:bold 12px Arial, Helvetica, sans-serif; color: #333; margin: 0; padding:0; text-decoration: none; } .red-box p a:hover { color: #CC0000;text-decoration: none; } .red-box .date { font: 11px Arial, Helvetica, sans-serif; color: #333; margin: 0; padding: 0 10px;} .red-box .border { clear: both; border-top: 1px solid #ccc; padding: 0 0 10px 0;} .red-box h3 {clear:both; font: 20px Arial, Helvetica, sans-serif; background:url(images/pink-title.gif) no-repeat; color:#fff; margin: 0 0 10px 0; padding: 5px 0 0 15px; height:36px; width: 287px; color:#A93864; } .red-box h5 { font:bold 14px Arial, Helvetica, sans-serif;color:#fff; margin: 0; padding: -30px 10px 40px 10px; float: right; width:210px;} .red-box h5 a { color: #333; margin: 0; padding: 0; text-decoration: none; float: right; width:210px;} .red-box h5 a:hover { color: #CC0000; margin: 0; padding: 0; text-decoration: none; float: right; width:210px;} .red-box .link-more a { font: 11px Arial, Helvetica, sans-serif; float: right; color:#CC0000; margin: 0; padding:0; text-decoration: none;} .red-box .link-more a:hover{ float: right; color:#333 ; margin: 0; padding:0; text-decoration: none;} /* breadcrumb */ #breadcrumb { float: left; display: block; font-weight: bold; width: 408px; margin: 0 0 10px 0 ; padding: 30px 0 5px 20px; font-size: 16px; color: #A93864; } #breadcrumb a { font-size: 16px; font-weight: bold; color: #8d8c8c; text-decoration: none; } #breadcrumb a:hover { font-size: 16px;font-weight: bold;color: #A93864; text-decoration: none; } #minibanner { float: right; padding: 15px 0 0 0; } /* deep left content */ #deep-leftcontent { float: left; width: 596px; padding: 20px 0 0 10px; } #deep-2ndleftcontent { float: left; width: 940px; padding: 20px 0 0 10px; } #deep-leftcontent h4 { font:bold 20px Arial, Helvetica, sans-serif; color:#b90100; margin: 0; padding: 20px 10px 10px 10px; } #deep-leftcontent p { margin: 0; padding: 0 10px 5px 10px; } #deep-leftcontent h3 {clear:both; font:bold 14px Arial, Helvetica, sans-serif;color:#fff; margin: 0; padding: 0 10px 10px 10px;} #deep-leftcontent h3 a { color: #333; margin: 0; padding: 0; text-decoration: none;} #deep-leftcontent h3 a:hover { color: #CC0000; margin: 0; padding: 0; text-decoration: none;} #deep-leftcontent .date { font: 11px Arial, Helvetica, sans-serif; color: #333; margin: 0; padding: 0 10px;} #deep-leftcontent .link-more a { font: 12px Arial, Helvetica, sans-serif; color:#CC0000; margin: 0; padding:0; text-decoration: none;} #deep-leftcontent .link-more a:hover{ color:#333 ; margin: 0; padding:0; text-decoration: none;} #deep-leftcontent .commentlist .comment-meta a {font: 10px Arial, Helvetica, sans-serif; color:#CC0000; text-decoration: none;} #deep-leftcontent .commentlist .comment-meta a:hover{ color:#333 ;text-decoration: none;} #deep-leftcontent .fn a{color: #b90100; font: 14px Arial, Helvetica, sans-serif;text-decoration: none; font-weight:bold} #deep-leftcontent .fn a:hover{color: #CC0000; font: 14px Arial, Helvetica, sans-serif;text-decoration: none;font-weight:bold} #deep-leftcontent .post img{ margin-bottom:20px; } /* deep right content */ #deep-rightcontent { float: right; width: 301px; padding: 20px 0 0 0; } /* left menu */ #leftmenu { clear: both; margin: 0 0 20px 0; } #leftmenu ul { text-align: right; margin: 0; padding: 0; } #leftmenu ul li { list-style-type: none; display: block; margin: 0; padding: 0; } #leftmenu ul li a { font-size: 14px; color: #818181; display: block; margin: 0; height: 20px; padding: 5px 5px; text-decoration: none; } #leftmenu ul li a:hover{ background-color: #F5BBD1; color:#cb0825; display: block;height: 20px; margin: 0; padding: 5px 5px; text-decoration: none; } /*bg box */ .bg-box { background:url(images/bg-box.gif) no-repeat; width: 575px; height: 58px; margin: 15px 0 0 10px; padding: 10px 0 0 0; } .bg-box p { color:#b90100; margin: 0; padding: 0; } /* box faq */ #box-faq { float: left; width:135px; margin: 0; } #box-faq a {color: #fff; background-color: #E5487B; padding: 4px 4px; margin: 0; text-decoration:none } #box-faq a:hover {color: #fff; background-color: #E5487B; padding: 4px 4px; margin: 0; text-decoration:none } #box-faq p { color: #fff; background-color: #E5487B; padding: 4px 4px; margin: 0;} #box-faq img { margin: 0 0 10px 8px; padding: 0; } /* form consult float: right; margin: 0; padding: 0; width: 440px;*/ #form-consult { margin-left:150px; } *html #form-consult { margin-left:180px; } #form-consult h5 { text-align: center; font:bold 18px Arial, Helvetica, sans-serif; margin: 0 0 10px 0; padding: 0; } #form-consult form { margin: 0; padding: 10px 10px; border: 1px solid #ccc;background-color:#E5487B } /*#form-consult fieldset { color: #fff; border: none; background-color: #ba0100; margin: 10px 0 0 0; padding: 20px 10px; } #form-consult form p { clear: both; margin:10px 0 24px 0; padding: ; } #form-consult input { float: left; width: 230px; font-size: 12px; margin: 0 ; padding: 4px 0; border:1px solid #fff;} #form-consult textarea{ float: left; width: 230px; height: 80px; margin: 0 ; font-size: 12px; padding: 0; border:1px solid #fff;} #form-consult label { float: left; width: 130px; font:bold 12px Arial, Helvetica, sans-serif; margin: 0 0 0 10px ; padding: 0;} #form-consult select { float: left; margin: 0; padding: 0; border:1px solid #fff; } #form-consult .form-name { margin: 1px 0 0 0 ; padding: 2px 0; width: 179px; border:1px solid #fff; } #form-consult .form-select { float: left; margin: 0 5px 0 0 ; padding: 0; border:1px solid #fff; } #form-consult .btn-send {float: right; width: 60px; height: 30px; margin:10px 0 0 0;}*/ /* form contact */ #form-contact {float:left; background-color:#E5487B; padding: 15px 15px; } #left-contact { float: left; width: 190px; margin: 0 ; padding: 0 30px 0 0 } #left-contact p {font-weight: bold; color: #fff; margin: 80px 0 0 0; padding: 0; } #right-contact { float: left; width: 430px; border-left: 1px solid #fff; margin: 0 ; padding: 0 0 0 10px } #right-contact form { margin: 0; padding: 0; } *html #right-contact { float: left; border-left: 1px solid #fff; margin: 0 ; padding: 0 0 0 10px } *html #right-contact form { margin: 0; padding: 0; } /*#right-contact fieldset { color: #fff; border: none; margin: 0; padding: 0; } #right-contact form p { clear: both; margin:10px 0 20px 0; padding: 0 0 10px 0; } #right-contact input { float: left; width: 270px; font-size: 12px; margin: 0 ; padding: 4px 0; border:1px solid #fff;} #right-contact textarea{ float: left; width: 270px; height: 80px; margin: 0 0 10px 0 ; padding: 0; font-size: 12px; padding: 0; border:1px solid #fff;} #right-contact label { float: left; width: 140px; font:bold 12px Arial, Helvetica, sans-serif; margin: 0 0 0 10px ; padding: 0;} #right-contact select { float: left; margin: 0; padding: 0; border:1px solid #fff; } #right-contact input.input-code{ float: left; width: 80px; margin: 0 5px 0 5px ; padding: 3px 0; border:1px solid #fff; } #right-contact img { float: left; margin: 0; padding: 0; } #right-contact .btn-code { float: left; width: 45px; height: 25px; border: none; margin: 0 0 0 5px; padding: 0; }*/ /* headoffice */ #headoffice { float: right; background:url(images/bg-office.gif) no-repeat; padding: 30px 00 0; margin-top:40px; width: 214px; height: 300px; } #headoffice h5 { text-align: right; font: 20px Arial, Helvetica, sans-serif; margin: 0 30px 10px 0; padding: 0; } #headoffice p { text-align: right; margin: 0 30px 10px 0; padding: 0; } /* footer */ #footer { display: block; background:url(images/bg-footer.gif) repeat-x; padding: 20px 0 0 120px; height: 80px; margin:50px 0 0 0; } #footer img { float: left; margin: 0; padding: 0; } #footer ul { display:block; float: left; margin: 10px 0 0 10px; padding: 0; width: 700px; } #footer ul li { list-style-type: none; display: inline; border-right: 1px solid #ccc; padding: 0 5px;} #footer li a {font-weight: bold; font-size:11px; color: #999; text-decoration: none; } #footer li a:hover { color: #CC0000; text-decoration: none; } #footer .bdr-footer { border: none; } #powered { margin-top:15px; margin-left:270px; border: none; } #powered a { font-size:9px; color: #999; text-decoration: none; } #powered a:hover { color: #CC0000; text-decoration: none; } /* start addthis*/ .addthis_toolbox .custom_images a { width: 60px; height: 60px; margin: 0; padding: 0; } .addthis_toolbox .custom_images a:hover img { opacity: 1; } .addthis_toolbox .custom_images a img { opacity: 0.75; } /* end addthis*/ /* Using 'class="alignright"' on an image will (who would've thought?!) align the image to the right. And using 'class="centered', will of course center the image. This is much better than using align="center", being much more futureproof (and valid) */ .post img.centered { display: block; margin-left: auto; margin-right: auto; } .post img.alignright { padding: 4px; margin: 0 0 2px 7px; display: inline; } .post img.alignleft { padding: 4px; margin: 0 7px 2px 0; display: inline; } .post .alignright { float: right; } .post .alignleft { float: left } .post .thumbnail { float: left; margin: 0 5px 2px 2px; } /* End Images */