/*==================================== General styles ====================================*/

#wrap {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  background: url(../img/patternbg/pat-1.png) top center repeat;
}

.inner_wrap {
  margin-top: 30px;
}
#header {
  padding-top: 30px;
  padding-bottom: 30px;
  display: block;
}
#logo h1 {
  margin: 0;
  padding: 0;
}
#logo {
  width: 90px;
  height: 47px;
  float: left;
}
#logo {
  background: transparent url(../img/logo_top.png) no-repeat scroll center left;
}
#logo a {
  display: block;
  height: 100%;
  width: 100%;
}

.divider {
  clear: both;
  height: 2px;
  margin-top: 30px;
  margin-bottom: 30px;
  background: url(../img/divider.png) repeat-x center;
}

/*-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/

/*==================================== top menu navigation ====================================*/

#nav {
  margin-top: 0px;
  float: right;
  position: relative;
  margin-right: 0px;
  font-size: 12px;
}
.jqueryslidemenu {
  background: transparent;
  width: 100%;
}
.jqueryslidemenu ul {
  margin: 0;
  padding: 0;
  list-style-type: none;
  z-index: 9999999;
  float: right;
}

/*Top level list items*/
.jqueryslidemenu ul li {
  position: relative;
  display: inline;
  float: left;
  margin-top: 0 !important;
}
/*Top level menu link items style*/
.jqueryslidemenu ul li a {
  display: block;
  background: transparent; /*background of tabs (default state)*/
  padding: 10px 15px;
  text-decoration: none;
}
* html .jqueryslidemenu ul li a {
  /*IE6 hack to get sub menu links to behave correctly*/
  display: inline-block;
}
.jqueryslidemenu ul li a:hover {
  background: transparent; /*tab link background during hover state*/
}
/*1st sub level menu*/
.jqueryslidemenu ul li ul {
  position: absolute;
  left: 0;
  display: block;
  visibility: hidden;
  -webkit-box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2);
  -ms-box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2);
  -o-box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2);
  box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2);
}
/*Sub level menu list items (undo style from Top level List Items)*/
.jqueryslidemenu ul li ul li {
  display: list-item;
  float: none;
  font-size: 12px;
}
/*All subsequent sub menu levels vertical offset after 1st level sub menu */
.jqueryslidemenu ul li ul li ul {
  top: 0;
}
/* Sub level menu links style */
.jqueryslidemenu ul li ul li a {
  width: 160px; /*width of sub menus*/
  padding: 5px 15px 5px 15px;
  margin: 0;
}

.downarrowclass {
  position: absolute;
  top: 12px;
  right: 7px;
}
.rightarrowclass {
  position: absolute;
  top: 6px;
  right: 5px;
}

/*-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*==================================== Featured area ====================================*/

#featured-area {
  max-width: 100%;
}

.static-bg {
  height: auto;
  background: url(../img/pattern/bg-pat-1.png) no-repeat left top;
}

/*------------------------------ animated background -----------------------------*/

/* Give the header a height and a background image */
#animated-bg {
  height: auto;
  background: url(../img/pattern/1.jpg) repeat-y scroll left top;
}

#animated-bg-inner {
  height: auto;
  background: url(../img/pattern/bg-inner.jpg) repeat-y scroll left center;
}

#animated-bg2 {
  height: auto;
  background: url(../img/pattern/2.jpg) repeat-y scroll left top;
}

#animated-bg2-inner {
  height: auto;
  background: url(../img/pattern/bg-inner.jpg) repeat-y scroll left center;
}

/* Circular Content Carousel Style */
.ca-container {
  position: relative;
  margin: 0 auto;
  width: 940px;
  height: 450px;
}
.ca-container-page {
  position: relative;
  margin: 0 auto;
  width: 940px;
  height: 25px;
}
.ca-wrapper {
  width: 940px;
  height: 100%;
  position: relative;
}
.ca-item {
  position: relative;
  float: left;
  width: 315px;
  height: 100%;

  text-align: center;
}
.ca-button {
  margin-top: 20px;
}
.ta-button {
  margin-top: 0px;
  margin-right: 5px;
  text-align: right;
}

.ca-close {
  position: absolute;
  top: 10px;
  right: 20px;
  background: url(../img/contentcarousel/close-icon.png) no-repeat center right;
  width: 48px;
  height: 48px;
  text-indent: -9000px;
  outline: none;
  opacity: 0.5;
}
.ca-close:hover {
  opacity: 1;
}
.ca-item-main {
  position: absolute;
  top: 5px;
  left: 0px;
  right: 5px;
  bottom: 5px;
  background: url(../img/contentcarousel/item-main-bg.png) top center repeat;
  overflow: hidden;
  -moz-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2);
  box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2);
}
.ca-icon {
  width: 315px;
  height: 250px;
  display: block;
  margin: 0 auto;
  padding: 0;
  margin-bottom: 30px;
  background: transparent url(../img/contentcarousel/top_natura.jpg) no-repeat
    center center;
}
.ca-item-2 .ca-icon {
  background-image: url(../img/contentcarousel/top_confort.jpg);
}
.ca-item-3 .ca-icon {
  background-image: url(../img/contentcarousel/top_rakuten.jpg);
}
.ca-item-4 .ca-icon {
  background-image: url(../img/contentcarousel/top_pra.jpg);
}
.ca-item-5 .ca-icon {
  background-image: url(../img/contentcarousel/top_mado.gif);
}
.ca-item-6 .ca-icon {
  background-image: url(../img/contentcarousel/c-thumb.jpg);
}
.ca-item-7 .ca-icon {
  background-image: url(../img/contentcarousel/c-thumb.jpg);
}
.ca-item-8 .ca-icon {
  background-image: url(../img/contentcarousel/c-thumb.jpg);
}
.ca-item h3 {
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ",
    Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  margin: 0 auto;
  margin-top: 20px;
  margin-bottom: 20px;
  line-height: 1.5em;
  text-align: center;
  color: #333;
  text-shadow: 0px 1px 1px #e4ebe9;
}
.ca-item .desc {
  font-style: normal;
  color: #666;
  font-size: 12px;
  text-align: left;
  padding-left: 20px;
  padding-right: 20px;
  line-height: 1.5em;
  margin-top: 0;
  position: relative;
}
.ca-item .desc span {
  display: block;
}
.ca-item .desc span.ca-quote {
  background: url(../img/quote-1.png) no-repeat 0% 5px;
  color: #666666;
  padding-left: 30px;
  font-size: 12px;
}
.ca-content-wrapper {
  background: url(../img/contentcarousel/item-main-bg.png) repeat;
  position: absolute;
  width: 0px; /* expands to width of the wrapper minus 1 element */
  height: 440px;
  top: 5px;
  text-align: left;
  z-index: 10000;
  overflow: hidden;
}
.ca-content {
  width: 625px;
  overflow: hidden;
}
.ca-content-text {
  margin: 10px 20px;
  padding: 10px 20px;
  line-height: 1.5em;
}
.ca-content-text p {
  padding-bottom: 5px;
}
.ca-content h2 {
  margin: 25px 20px 0px 35px;

  padding-bottom: 5px;

  text-shadow: 0 1px 1px #fff;
}
.ca-content ul {
  margin: 20px 35px;
  height: 30px;
  list-style: none;
}
.ca-content ul li {
  float: left;
  margin: 0px 2px;
}
.ca-content ul li a {
}
.ca-content ul li a:hover {
}
.ca-nav span {
  width: 25px;
  height: 38px;
  background: transparent url(../img/contentcarousel/arrows.png) no-repeat top
    left;
  position: absolute;
  top: 50%;
  margin-top: -19px;
  left: -40px;
  text-indent: -9000px;
  opacity: 0.7;
  cursor: pointer;
  z-index: 100;
}
.ca-nav span.ca-nav-next {
  background-position: top right;
  left: auto;
  right: -40px;
}
.ca-nav span:hover {
  opacity: 1;
}

/*----------------------------------- orbit slider ----------------------------------*/
.orbitslider {
  width: 940px;
  margin-top: 5px;
  margin-bottom: 5px;
}

/*-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/

/*==================================== Content  ====================================*/

/*----------------------- main content id, headline  ----------------------------*/

#top {
}

#top h4 {
  margin-bottom: 15px;
}

#middle {
}
#bottom {
}
#content {
}

.headline {
  margin: 0 auto;
  padding: 0;
}

#headline {
  margin: 0 auto;
  padding: 25px 0 30px 0;
}

#headline p {
  padding-left: 55px;
  line-height: 1.5em;
  color: #909090;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ",
    Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: 18px;
  margin-top: 20px;
  font-style: italic;
}

#headline h2.dropcap-circle,
#headline h3.dropcap-circle,
#headline h4.dropcap-circle,
#headline h5.dropcap-circle {
  width: 65px;
  height: 65px;
  line-height: 65px;
  margin-right: 20px;
  margin-bottom: 0;
}

#headline h2.pagetitle {
  width: 960px;
  hight: 200px;
  margin-bottom: 0;
}

.headline h2.pagetitle {
  width: 960px;
  hight: 200px;
  margin-bottom: 0;
}

#headline a.button {
  margin-top: 18px;
}

/*---------------------------------- client sponsor flip -------------------------------------*/
.sponsor {
  float: left;
  margin-top: 10px;
  margin-bottom: 10px;
  width: 140px;
  height: 84px;
  /* Giving the sponsor div a relative positioning: */
  position: relative;
  cursor: pointer;
}

.sponsorFlip {
  /*  The sponsor div will be positioned absolutely with respect
to its parent .sponsor div and fill it in entirely */

  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: #f9f9f9;
}

.sponsorFlip:hover {
  /* CSS3 inset shadow: */
  -moz-box-shadow: 0 0 20px #999 inset;
  -webkit-box-shadow: 0 0 20px #999 inset;
  box-shadow: 0 0 20px #999 inset;
}

.sponsorFlip img {
  width: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -42px 0 0 -70px;
}

.sponsorData {
  /* Hiding the .sponsorData div */
  display: none;
  background-color: #fff;
}

.sponsorDescription {
  font-size: 11px;
  padding: 10px;
  font-style: italic;
  line-height: 1.5em;
  color: #fdfdfd;
}

.sponsorURL {
  font-size: 10px;
  font-weight: bold;
  text-align: center;
}
.sponsorURL a {
  color: #fff;
}

/*---------------------------------- blockquote and pull quotes -------------------------------*/
blockquote {
  margin-top: 15px;
  padding-left: 46px;
  background: url("../img/icons/quote.png") no-repeat 0% 4px;
}

.pullquote_right,
.pullquote_left {
  float: right;
  font-size: 1.2em;
  letter-spacing: 0px;
  margin-bottom: 0;
  margin-top: 7px;
  margin-left: 20px;
  padding-left: 15px;
  width: 40%;
  font-weight: bold;
  font-style: italic;
  line-height: 1.4em;
  border-left: 2px solid #5b5b5d;
}
.pullquote_left {
  border-right: 2px solid #5b5b5d;
  border-left: none;
  float: left;
  margin-left: 0px;
  margin-right: 10px;
  padding-left: 0;
  padding-right: 15px;
}

/*----------------------- thumbnail, images, frames ----------------------------*/

.thumbs {
  margin: 0;
  padding: 0;
  overflow: hidden;
}
.thumbs li {
  list-style: none;
  float: left;
  margin-right: 5px;
}
.thumbs li img {
  display: block;
  width: 58px;
  padding: 5px;
  background: #ededed;
  border-width: 1px;
  border-style: solid;
  border-color: #000;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
}
.thumbs li img:hover {
  display: block;
}
.thumbs li a img {
  border: none;
}

img.left {
  margin-right: 15px;
}
img.right {
  margin-left: 15px;
}

.tframe5 {
  padding: 4px;
  background: #fff;
  border: 1px solid #e5e5e5;
}

.tframe0 {
  padding: 0px;
  background: #fff;
  border: 1px solid #e5e5e5;
}

.tframe6 {
  padding: 4px;
  background: #fff;
}

.tframe7 {
  background: #fff;
  padding: 4px 4px 4px 0px;
}

.tframe5_trans {
  padding: 4px;
  background: transparent;
  border: 1px solid #f7f7f6;
}

.tframe10 {
  padding: 9px;
  background: #fff;
  border: 1px solid #f7f7f6;
}

.no-padding {
  padding-bottom: 0px !important;
}

/*-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/

/*==================================== Footer ====================================*/

#footer {
  background: url(../img/patternbg/pat_4.png) repeat top center;
  color: #656565;
}

#footer p {
  margin-top: 10 !important;
}

#top_footer {
  float: left;
  width: 100%;
  height: 29px;
  border-top: 4px solid #fcf9f9;
}

#footer ul.sidebar-list li {
  margin-bottom: 0;
  margin-top: 20px;
}
#footer img.left {
  margin-right: 15px;
  margin-bottom: 20px;
}
#footer h5 {
  margin-bottom: 20px;
}
#footer p {
  margin-top: 20px;
}
#footer ul {
  list-style: none;
  margin: 0;
}
#footer ul li {
  margin-bottom: 5px;
  display: block;
}

#footer_o {
  background: url(../img/patternbg/pat_5.png) repeat top center;
  color: #656565;
  text-shadow: 1px 0px 0px #000;
}
#footer_o p {
  margin-top: 10 !important;
}

#footer_o {
  text-shadow: 1px 1px 0px #fffff9;
}

#footer_o {
  text-shadow: 1px 1px 0px #fffff9;
}
#top_footer_o {
  float: left;
  width: 100%;
  height: 29px;
  border-top: 4px solid #fcf9f9;
}

#footer_o ul.sidebar-list li {
  margin-bottom: 0;
  margin-top: 20px;
}
#footer_o img.left {
  margin-right: 15px;
  margin-bottom: 20px;
}
#footer_o h5 {
  margin-bottom: 20px;
}
#footer_o p {
  margin-top: 20px;
}
#footer_o ul {
  list-style: none;
  margin: 0;
}
#footer_o ul li {
  margin-bottom: 5px;
  display: block;
}

#sub_footer {
  padding-top: 30px;
  padding-bottom: 30px;
}

#sub_footer p {
  line-height: 32px;
  font-size: 12px;
}

#sub_footer ul {
  list-style: none;
  margin: 0;
}
#sub_footer ul li {
  margin: 0;
}
#sub_footer p {
  margin: 0;
  text-shadow: none;
}

#sub_footer ul {
  list-style: none;
  margin: 0;
}
#sub_footer ul li {
  margin: 0;
}
#sub_footer p {
  margin: 0;
  text-shadow: none;
}

ul.link_nav {
  float: left;
  margin: 0;
  padding: 0;
}

ul.link_nav li {
  width: 200px;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  background: url(../img/list/b_list-arrow.png) no-repeat 0% 9px;
  padding: 2px 10px 2px 10px;
  border-top-width: 1px;
  border-bottom-width: 1px;
  border-top-style: solid;
  border-bottom-style: solid;
  border-top-color: #d9e9f8;
  border-bottom-color: #60a0e0;
}
ul.link_nav li a {
  color: #fec151;
  display: block;
}
ul.link_nav li.top-li {
  border-top: none;
}
ul.link_nav li.bottom-li {
  border-bottom: none;
  background: none;
}

/*----------- orange ----------------------*/
ul.link_nav_o {
  float: left;
  margin: 0;
  padding: 0;
}

ul.link_nav_o li {
  width: 200px;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  background: url(../img/list/o_list-arrow.png) no-repeat 0% 9px;
  padding: 2px 10px 2px 10px;
  border-top-width: 1px;
  border-bottom-width: 1px;
  border-top-style: solid;
  border-bottom-style: solid;
  border-top-color: #cbd1ad;
  border-bottom-color: #465300;
}
ul.link_nav_o li a {
  color: #fec151;
  display: block;
}
ul.link_nav_o li.top-li {
  border-top: none;
}
ul.link_nav_o li.bottom-li {
  border-bottom: none;
  background: none;
}

ul.footer_contact {
  float: left;
  margin-top: 20px;
  list-style: none;
}
ul.footer_contact li {
  margin: 0px !important;
  padding: 0px !important;
}
ul.flickr {
  float: left;
  margin-top: 10px !important;
}
ul.flickr li {
  margin-top: 0px !important;
  margin-right: 5px !important;
  margin-bottom: 5px !important;
  float: left;
  background: #363636;
  padding: 4px;
  border: 1px solid #434343;
}
ul.flickr li a:hover {
}

/*----------- social ----------------------*/

.social {
  float: right;
}

.social a {
  display: block;
  width: 32px;
  height: 32px;
  opacity: 0.7;
  margin-left: 10px;
  float: left;
}

.social span {
  display: none;
}

#facebook-icon {
  background: url(../img/social/fb.png);
}

#facebook-icon:hover {
  background: url(../img/social/fb_hov.png);
}

#twitter-icon {
  background: url(../img/social/twitter.png);
}

#twitter-icon:hover {
  background: url(../img/social/twitter_hov.png);
}

#linkedin-icon {
  background: url(../img/social/linkedin.png);
}

#linkedin-icon:hover {
  background: url(../img/social/linkedin_hov.png);
}

#flickr-icon {
  background: url(../img/social/flickr.png);
}

#flickr-icon:hover {
  background: url(../img/social/flickr_hov.png);
}

/*-------------------------------------------- list styles ------------------------------------*/

ul li,
ol li {
  margin-top: 10px;
}
ul,
ol {
  display: block;
  margin: 10px 0 0 0px;
  list-style-position: inside;
}

ul.arrow_full,
ul.arrow_dot,
ul.bullet,
ul.diamond {
  display: block;
  list-style: none;
  margin: 10px 0 0 0;
}

ul.blue_arrow,
ul.orange_arrow,
ul.green_arrow {
  display: block;
  list-style: none;
  margin: 10px 0 0 10px;
}

ul.blue_arrow_s,
ul.orange_arrow_s {
  display: block;
  list-style: none;
  margin: 10px 0 0 0px;
}

/* arrow full */
ul.arrow_full li {
  background-attachment: scroll;
  background-image: url("../img/list/arrow-full.png");
  background-repeat: no-repeat;
  background-position: left center;
  padding-left: 26px;
  margin-top: 5px;
}

/* arrow dot */
ul.arrow_dot li {
  background-attachment: scroll;
  background-image: url("../img/list/arrow-dot.png");
  background-repeat: no-repeat;
  background-position: left center;
  padding-left: 26px;
  margin-top: 5px;
}

/* bullet */
ul.bullet li {
  background-attachment: scroll;
  background-image: url("../img/list/bullet.png");
  background-repeat: no-repeat;
  background-position: left center;
  padding-left: 26px;
  margin-top: 5px;
}

/* blue */
ul.blue_arrow li {
  background-attachment: scroll;
  background-image: url("../img/list/blue_arrow.png");
  background-repeat: no-repeat;
  background-position: left center;
  padding-left: 26px;
  margin-top: 5px;
  font-size: 13px;
}

ul.blue_arrow li a {
  color: #666666;
}

ul.blue_arrow li a:hover {
  color: #0095cd;
  text-decoration: underline;
}

/* orange */
ul.orange_arrow li {
  background-attachment: scroll;
  background-image: url("../img/list/orange_arrow.png");
  background-repeat: no-repeat;
  background-position: left center;
  padding-left: 26px;
  margin-top: 5px;
  font-size: 13px;
}

ul.orange_arrow li a {
  color: #666666;
}

ul.orange_arrow li a:hover {
  color: #f78d1d;
  text-decoration: underline;
}

/* greem */
ul.green_arrow li {
  background-attachment: scroll;
  background-image: url("../img/list/green_arrow.png");
  background-repeat: no-repeat;
  background-position: left center;
  padding-left: 26px;
  margin-top: 5px;
  font-size: 13px;
}

ul.green_arrow li a {
  color: #666666;
}

ul.green_arrow li a:hover {
  color: #64991e;
  text-decoration: underline;
}

/* diamond */
ul.diamond li {
  background-attachment: scroll;
  background-image: url("../img/list/diamond.png");
  background-repeat: no-repeat;
  background-position: left center;
  padding-left: 26px;
  margin-top: 5px;
}

/*-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*==================================== Blog and post ====================================*/

.recent_post {
  float: left;
  width: 598px;
  background: url(../img/vertical-line.png) center right repeat-y;
  padding-right: 20px;
}
.small_excerpt {
  float: left;
  padding-bottom: 20px;
  background: url(../img/divider.png) repeat-x bottom;
}

.small_excerpt h5 {
  margin-top: 0;
  padding-top: 0;
}

.lastpost {
  background: none;
  padding-bottom: 0;
}

.post_blog .frame {
  float: left;
  width: 97px;
  height: 65px;
}
.post_blog img {
  float: left;
  width: 88px;
  height: 55px;
  margin-top: 2px;
  padding: 7px;
  background: #fff;
  border-width: 1px;
  border-style: solid;
  border-color: #f9f9f9 #ececec #cdcdcd;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
}

/*----------------------- blog ----------------------------*/
.article-post .excerpt {
}

.post_blog p {
  float: left;
  width: 458px;
  margin-left: 20px;
  margin-top: 0;
}
.post_blog h5 {
  float: left;
  margin-left: 20px;
  margin-bottom: 10px;
}

.blog-pagination span {
  margin-right: 5px;
}

.blog-pagination .navbtn {
  display: inline-block;
  background: #fff;
  border: 1px solid #f3f3f3;
  cursor: pointer;
  text-align: center;
  text-decoration: none;
  font: 12px Arial, Helvetica, sans-serif;
  padding: 5px 20px 5px 20px;
}

/*---------- blog meta -----------*/
.blog-meta {
  font-size: 11px;
}

span.comment-links {
  float: right;
}

/*----------------------- single post ----------------------------*/

.entry-meta {
  margin-bottom: 10px;
  font-size: 11px;
}

ul.list {
  margin-top: 10 !important;
  padding: 0 !important;
}

ul.list li {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none;
}
ul.arrow li {
  background: url(../img/icons/list-arrow.png) no-repeat left 7px;
  list-style: none;
  margin: 0 !important;
  padding-left: 15px !important;
}

.postinfo {
  font-size: 11px;
  color: #7d7d7d;
  border: 1px solid #f7f7f6;
  background: #fff;
  padding: 10px;
  margin: 20px 0 0 0;
}

.postinfo p {
  line-height: 1.5;
  margin: 0;
  padding: 2px 0;
}

.postinfo a,
.contents .postinfo a {
  color: #5d5d5d;
  text-decoration: none;
}

/* ------------- comment ------------------- */
.comment {
  float: left;
  padding: 10px;
  background: #fff;
  border: 1px solid #f7f7f6;
}

.comment_info span {
  font-size: 11px;
  line-height: 1.5em;
}

.comment_info span a {
  font-size: 12px;
  font-weight: bold;
}

.comment_entry {
  margin-top: 5px;
  float: left;
}

.reply {
  float: left;
  background: url(../img/icons/reply.png) no-repeat top left;
}
.reply_post {
  float: left;
  width: 502px;
  margin-left: 95px;
  margin-top: 20px;
  padding: 10px;
  background: #fff;
  border: 1px solid #f7f7f6;
}
.comment_post {
  margin-top: 30px;
}
.comment_post input {
  width: 380px;
  color: #848383;
  background: #fff;
  border: 1px solid #f3f3f3;
  padding-left: 10px;
}
.comment_post textarea {
  width: 618px;
  height: 200px;
  color: #848383;
  background: #fff;
  border: 1px solid #f3f3f3;
  padding: 10px;
}

.comment_post input,
.comment_post textarea {
  font-size: 12px;
}

span.reply {
  float: right;
  font-size: 11px;
  font-style: italic;
}

/*-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/

/*==================================== sidebar ====================================*/

#aside {
  float: left;
  border-left: 1px solid #e5e5e5;
  margin: 0px !important;
  padding-bottom: 10px;
  margin-left: 10px !important;
}

#aside h3,
#aside h4,
#aside h5 {
  background: url(../img/h3-widget.png) no-repeat top left;
  height: 45px;
  padding-left: 20px;
  line-height: 45px;
  margin-bottom: 20px;
}

#aside .list h5 {
  margin-bottom: 20px;
}

ul.sidebar-comment {
  list-style: none;
  margin: 0;
  margin-top: 10px;
}
ul.sidebar-comment li {
  display: block;
}

ul.sidebar-banner {
  list-style: none;
  margin: 0;
  margin-top: 10px;
}
ul.sidebar-banner li {
  display: block;
}

.comments {
  margin-bottom: 5px;
}

ul.sidebar-comment a {
  font-weight: bold;
}

ul.sidebar-list {
  list-style: none;
  margin: 0;
}

ul.sidebar-list li span {
  margin-left: 10px;
}

ul.sidebar-categories {
  list-style: none;
  margin: 0;
}
ul.sidebar-archive {
  list-style: none;
  margin: 0;
}

.sidebar-widget p,
.sidebar-comment,
.sidebar-list {
  padding-left: 20px;
}

.sidebar-bannr {
  padding-left: 10px;
}

.sidebar-bannr li {
  padding-bottom: 5px;
}
.sidebar-comment li {
  border-bottom: 1px solid #f7f7f6;
  padding-bottom: 10px;
}
.sidebar-list {
  margin-top: 0 !important;
}

ul.sidebar-list {
  margin-bottom: 0;
}

.sidebar-list li {
  border-bottom: 1px solid #f7f7f6;
  padding-bottom: 10px;
  margin-top: 0 !important;
  padding-top: 0 !important;
  margin-bottom: 10px !important;
  line-height: 1.5em;
}

.sidebar-list h4 {
  margin-bottom: 5px;
  margin-top: 0px;
}

.ads-widget {
  margin-left: 20px;
}
.ads-widget li {
  list-style: none;
  float: left;
  margin-top: 0 !important;
  margin-bottom: 10px;
}

/*-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*==================================== portfolio ====================================*/
.portfolio {
  display: block;
}
ul.filter_portfolio {
  list-style: none;
  display: block;
  margin-bottom: 30px;
  margin-top: 0 !important;
}
ul.filter_portfolio li {
  margin: 0;
  margin-right: 15px;
  display: inline;
}

ul.filter_portfolio li a {
  text-decoration: none;
  color: #333;
}
ul.filter_portfolio li a:hover {
  text-decoration: underline;
  color: #333;
}
ul.portfolio {
  width: 980px;
  list-style: none;
  margin-top: 0 !important;
}
ul.portfolio:after {
  content: "";
  display: block;
  height: 0;
  overflow: hidden;
  clear: both;
}
ul.portfolio li {
  margin: 0;
  float: left;
  margin-right: 20px;
  margin-bottom: 20px;
}
.folio_description {
  float: left;
  margin-top: 10px;
}

.portfolio_meta {
  margin-top: 20px;
}
.portfolio_meta span {
  display: none;
}

.portfolio_meta a {
  display: block;
  width: 32px;
  height: 32px;
  opacity: 0.5;
  margin-left: 10px;
  float: left;
}

.portfolio_meta a:hover {
  opacity: 1;
}

.zoom {
  float: left;
  margin-left: 10px;
  background: url(../img/icons/zoom.png) no-repeat;
}

.detail {
  float: left;
  margin-right: 10px;
  background: url(../img/icons/detail.png) no-repeat;
}

/*==================================== portfolio 4 columns ====================================*/
.boxgrid_4clum {
  padding: 4px;
  width: 210px;
  height: 127px;
  float: left;
  overflow: hidden;
  position: relative;
  background: #fff;
  border: 1px solid #e5e5e5;
}
.boxgrid_4clum img {
  position: absolute;
  top: 0;
  left: 0;
  border: 0;
  margin: 4px;
  z-index: 1000;
}
.boxgrid_4clum-detail {
  width: 100%;
  height: 127px;
  float: left;
  background: #f3f3f3;
  font-size: 11px;
  text-shadow: 1px 1px 0px #fefcf2;
}
.boxgrid_4clum-detail .btn {
  margin-left: 10px;
}
.boxgrid_4clum-detail p {
  padding: 0 10px;
  color: #999;
  margin-top: 0;
}
.boxgrid_4clum-detail span {
  font-size: 10px;
  margin-left: 10px;
  margin-top: 0;
}

.boxgrid_4clum-detail h5 {
  font-size: 15px;
}

.boxgrid_4clum-detail h5 a,
.boxgrid_4clum-detail h4 a {
  float: left;
  width: 100%;
  margin: 10px 10px 0px 10px;
}
/*==================================== portfolio 3 colum====================================*/
.boxgrid_3clum {
  padding: 9px;
  width: 280px;
  height: 169px;
  float: left;
  overflow: hidden;
  position: relative;
  background: #fff;
  border: 1px solid #e5e5e5;
}
.boxgrid_3clum img {
  position: absolute;
  top: 0;
  left: 0;
  border: 0;
  margin: 9px;
  z-index: 1000;
}
.boxgrid_3clum-detail {
  width: 100%;
  height: 169px;
  float: left;
  background: #f3f3f3;
  text-shadow: 1px 1px 0px #fefcf2;
  font-size: 11px;
}
.boxgrid_3clum-detail .btn {
  margin-left: 10px;
}
.boxgrid_3clum-detail p {
  padding: 0 10px;
  color: #afafb1;
}
.boxgrid_3clum-detail span {
  font-size: 10px;
  margin-left: 10px;
}
.boxgrid_3clum-detail h5 a,
.boxgrid_3clum-detail h4 a {
  float: left;
  width: 100%;
  margin: 10px 10px 0px 10px;
}
/*==================================== portfolio 2 colum====================================*/
.boxgrid_2clum {
  padding: 9px;
  width: 440px;
  height: 266px;
  float: left;
  overflow: hidden;
  position: relative;
  background: #fff;
  border: 1px solid #f7f7f6;
}
.boxgrid_2clum img {
  position: absolute;
  top: 0;
  left: 0;
  border: 0;
  margin: 9px;
  z-index: 1000;
}
.boxgrid_2clum-detail {
  width: 100%;
  height: 266px;
  float: left;
  background: #f3f3f3;
  text-shadow: 1px 1px 0px #fefcf2;
  font-size: 11px;
}
.boxgrid_2clum-detail .btn {
  margin-left: 10px;
}
.boxgrid_2clum-detail p {
  padding: 0 10px;
}
.boxgrid_2clum-detail span {
  font-size: 10px;
  margin-left: 10px;
}
.boxgrid_2clum-detail h5 a,
.boxgrid_2clum-detail h4 a {
  float: left;
  width: 100%;
  margin: 10px 10px 0px 10px;
}
/*==================================== portfolio clasic colum====================================*/
.boxgrid_1clum {
  padding: 9px;
  width: 920px;
  height: 394px;
  float: left;
  overflow: hidden;
  position: relative;
  background: #fff;
  border: 1px solid #f7f7f6;
}
.boxgrid_1clum img {
  position: absolute;
  top: 0;
  left: 0;
  border: 0;
  margin: 9px;
  z-index: 1000;
}
.boxgrid_1clum-detail {
  width: 100%;
  float: left;
  text-shadow: 1px 1px 0px #fefcf2;
  margin-top: 20px;
}
.boxgrid_1clum-detail .btn {
  margin-left: 10px;
}

.folio_description {
  float: left;
  margin-top: 10px;
}
/*==================================== Project Details ====================================*/
.project-details {
  float: left;
  margin-top: 32px;
}
.project-details h4 {
  border-bottom: 1px solid #f3f3f3;
  padding-bottom: 10px;
}
/*-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/

/*==================================== Buttons ====================================*/

/*---------- default buttons -----------*/

.button {
  display: inline-block;
  outline: none;
  cursor: pointer;
  text-align: center;
  text-decoration: none;
  font: 14px Arial, Helvetica, sans-serif;
  padding: 0.5em 2em 0.55em;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
  -webkit-border-radius: 0.5em;
  -moz-border-radius: 0.5em;
  border-radius: 0.5em;
  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}
.button:hover {
  text-decoration: none;
}
.button:active {
  position: relative;
  top: 1px;
}

/* size and radius */

.rounded {
  -webkit-border-radius: 2em;
  -moz-border-radius: 2em;
  border-radius: 2em;
}
.medium {
  font-size: 12px;
  padding: 0.4em 1.5em 0.42em;
}
.small {
  font-size: 11px;
  padding: 0.2em 1em 0.275em;
}

/* color styles 
---------------------------------------------- */

/* black */
.black {
  color: #d7d7d7;
  border: solid 1px #333;
  background: #333;
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(#666),
    to(#000)
  );
  background: -moz-linear-gradient(top, #666, #000);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#666666', endColorstr='#000000');
}
.black:hover {
  background: #000;
  color: #d7d7d7;
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(#444),
    to(#000)
  );
  background: -moz-linear-gradient(top, #444, #000);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#444444', endColorstr='#000000');
}
.black:active {
  color: #666;
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(#000),
    to(#444)
  );
  background: -moz-linear-gradient(top, #000, #444);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#000000', endColorstr='#666666');
}

/* gray */
.gray {
  color: #e9e9e9;
  border: solid 1px #555;
  background: #6e6e6e;
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(#888),
    to(#575757)
  );
  background: -moz-linear-gradient(top, #888, #575757);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#888888', endColorstr='#575757');
}
.gray:hover {
  background: #616161;
  color: #e9e9e9;
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(#757575),
    to(#4b4b4b)
  );
  background: -moz-linear-gradient(top, #757575, #4b4b4b);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#757575', endColorstr='#4b4b4b');
}
.gray:active {
  color: #afafaf;
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(#575757),
    to(#888)
  );
  background: -moz-linear-gradient(top, #575757, #888);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#575757', endColorstr='#888888');
}

/* white */
.white {
  color: #606060;
  border: solid 1px #b7b7b7;
  background: #fff;
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(#fff),
    to(#ededed)
  );
  background: -moz-linear-gradient(top, #fff, #ededed);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ededed');
}
.white:hover {
  background: #ededed;
  color: #606060;
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(#fff),
    to(#dcdcdc)
  );
  background: -moz-linear-gradient(top, #fff, #dcdcdc);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#dcdcdc');
}
.white:active {
  color: #999;
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(#ededed),
    to(#fff)
  );
  background: -moz-linear-gradient(top, #ededed, #fff);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#ffffff');
}

/* orange */

.orange {
  color: #fef4e9;
  border: solid 1px #da7c0c;
  background: #f78d1d;
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(#faa51a),
    to(#f47a20)
  );
  background: -moz-linear-gradient(top, #faa51a, #f47a20);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#faa51a', endColorstr='#f47a20');
}
.orange:hover {
  background: #f47c20;
  color: #fef4e9;
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(#f88e11),
    to(#f06015)
  );
  background: -moz-linear-gradient(top, #f88e11, #f06015);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f88e11', endColorstr='#f06015');
}
.orange:active {
  color: #fcd3a5;
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(#f47a20),
    to(#faa51a)
  );
  background: -moz-linear-gradient(top, #f47a20, #faa51a);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f47a20', endColorstr='#faa51a');
}

/* red */
.red {
  color: #faddde;
  border: solid 1px #980c10;
  background: #d81b21;
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(#ed1c24),
    to(#aa1317)
  );
  background: -moz-linear-gradient(top, #ed1c24, #aa1317);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ed1c24', endColorstr='#aa1317');
}
.red:hover {
  background: #b61318;
  color: #faddde;
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(#c9151b),
    to(#a11115)
  );
  background: -moz-linear-gradient(top, #c9151b, #a11115);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#c9151b', endColorstr='#a11115');
}
.red:active {
  color: #de898c;
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(#aa1317),
    to(#ed1c24)
  );
  background: -moz-linear-gradient(top, #aa1317, #ed1c24);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#aa1317', endColorstr='#ed1c24');
}

/* blue */
.blue {
  color: #d9eef7;
  border: solid 1px #0076a3;
  background: #0095cd;
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(#00adee),
    to(#0078a5)
  );
  background: -moz-linear-gradient(top, #00adee, #0078a5);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00adee', endColorstr='#0078a5');
}
.blue:hover {
  background: #007ead;
  color: #d9eef7;
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(#0095cc),
    to(#00678e)
  );
  background: -moz-linear-gradient(top, #0095cc, #00678e);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0095cc', endColorstr='#00678e');
}
.blue:active {
  color: #80bed6;
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(#0078a5),
    to(#00adee)
  );
  background: -moz-linear-gradient(top, #0078a5, #00adee);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0078a5', endColorstr='#00adee');
}

/* rosy */
.rosy {
  color: #fae7e9;
  border: solid 1px #b73948;
  background: #da5867;
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(#f16c7c),
    to(#bf404f)
  );
  background: -moz-linear-gradient(top, #f16c7c, #bf404f);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f16c7c', endColorstr='#bf404f');
}
.rosy:hover {
  background: #ba4b58;
  color: #fae7e9;
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(#cf5d6a),
    to(#a53845)
  );
  background: -moz-linear-gradient(top, #cf5d6a, #a53845);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#cf5d6a', endColorstr='#a53845');
}
.rosy:active {
  color: #dca4ab;
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(#bf404f),
    to(#f16c7c)
  );
  background: -moz-linear-gradient(top, #bf404f, #f16c7c);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bf404f', endColorstr='#f16c7c');
}

/* green */
.green {
  color: #e8f0de;
  border: solid 1px #538312;
  background: #64991e;
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(#7db72f),
    to(#4e7d0e)
  );
  background: -moz-linear-gradient(top, #7db72f, #4e7d0e);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#7db72f', endColorstr='#4e7d0e');
}
.green:hover {
  background: #538018;
  color: #e8f0de;
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(#6b9d28),
    to(#436b0c)
  );
  background: -moz-linear-gradient(top, #6b9d28, #436b0c);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#6b9d28', endColorstr='#436b0c');
}
.green:active {
  color: #a9c08c;
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(#4e7d0e),
    to(#7db72f)
  );
  background: -moz-linear-gradient(top, #4e7d0e, #7db72f);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#4e7d0e', endColorstr='#7db72f');
}

/* pink */
.pink {
  color: #feeef5;
  border: solid 1px #d2729e;
  background: #f895c2;
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(#feb1d3),
    to(#f171ab)
  );
  background: -moz-linear-gradient(top, #feb1d3, #f171ab);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#feb1d3', endColorstr='#f171ab');
}
.pink:hover {
  background: #d57ea5;
  color: #feeef5;
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(#f4aacb),
    to(#e86ca4)
  );
  background: -moz-linear-gradient(top, #f4aacb, #e86ca4);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f4aacb', endColorstr='#e86ca4');
}
.pink:active {
  color: #f3c3d9;
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(#f171ab),
    to(#feb1d3)
  );
  background: -moz-linear-gradient(top, #f171ab, #feb1d3);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f171ab', endColorstr='#feb1d3');
}

/*---------- animated buttons -----------*/

.animatedbutton {
  /* Overriding the default underline styling of the links */
  text-decoration: none !important;
  white-space: nowrap;

  display: inline-block;
  vertical-align: baseline;
  position: relative;
  cursor: pointer;

  background-repeat: no-repeat;

  /* The following two rules are fallbacks, in case
the browser does not support multiple backgrounds. */

  background-position: bottom left;
  background-image: url("../img/buttons/animated/button_bg.png");

  /* Multiple backgrounds version. The background images
are defined individually in color classes */

  background-position: bottom left, top right, 0 0, 0 0;
  background-clip: border-box;

  /* Animating the background positions with CSS3 */
  /* Currently works only in Safari/Chrome */

  -webkit-transition: background-position 1s;
  -moz-transition: background-position 1s;
  transition: background-position 1s;
}

.animatedbutton:hover {
  /* The first rule is a fallback, in case the browser
does not support multiple backgrounds
*/

  background-position: top left;
  background-position: top left, bottom right, 0 0, 0 0;
}

.animatedbutton:active {
  /* Moving the button 1px to the bottom when clicked */
  bottom: -1px;
}

/* Defining animated button colors */

/* black Button */
.black.animatedbutton {
  background-color: #333;
  background-image: url("../img/buttons/animated/button_bg.png"),
    url("../img/buttons/animated/button_bg.png");
  background-image: url("../img/buttons/animated/button_bg.png"),
    url("../img/buttons/animated/button_bg.png"),
    -webkit-gradient(linear, 0% 0%, 0% 100%, from(#666), to(#000));
}
.black.animatedbutton:hover {
  background-color: #000;
  background-image: url("../img/buttons/animated/button_bg.png"),
    url("../img/buttons/animated/button_bg.png"),
    -moz-linear-gradient(#000, #444);
  background-image: url("../img/buttons/animated/button_bg.png"),
    url("../img/buttons/animated/button_bg.png"),
    -webkit-gradient(linear, 0% 0%, 0% 100%, from(#000), to(#444));
}

/* Orange Button */

.orange.animatedbutton {
  background-color: #faa51a;
  background-image: url("../img/buttons/animated/button_bg.png"),
    url("../img/buttons/animated/button_bg.png");
  background-image: url("../img/buttons/animated/button_bg.png"),
    url("../img/buttons/animated/button_bg.png"),
    -webkit-gradient(linear, 50% 100%, 0, 50% 100%, 100, from(rgba(232, 189, 45, 1)), to(rgba(232, 189, 45, 0))),
    -webkit-gradient(linear, 0% 0%, 0% 100%, from(#f47a20), to(#f47a20));
}
.orange.animatedbutton:hover {
  background-color: #f47a20;
  background-image: url("../img/buttons/animated/button_bg.png"),
    url("../img/buttons/animated/button_bg.png"),
    -moz-linear-gradient(#f9a746, #e18f2b);
  background-image: url("../img/buttons/animated/button_bg.png"),
    url("../img/buttons/animated/button_bg.png"),
    -webkit-gradient(linear, 0% 0%, 0% 100%, from(#f9a746), to(#e18f2b));
}

/* pink Button */
.pink.animatedbutton {
  background-color: #f895c2;
  background-image: url("../img/buttons/animated/button_bg.png"),
    url("../img/buttons/animated/button_bg.png");
  background-image: url("../img/buttons/animated/button_bg.png"),
    url("../img/buttons/animated/button_bg.png"),
    -webkit-gradient(linear, 0% 0%, 0% 100%, from(#feb1d3), to(#f171ab));
}
.pink.animatedbutton:hover {
  background-color: #d57ea5;
  background-image: url("../img/buttons/animated/button_bg.png"),
    url("../img/buttons/animated/button_bg.png"),
    -moz-linear-gradient(#f4aacb, #e86ca4);
  background-image: url("../img/buttons/animated/button_bg.png"),
    url("../img/buttons/animated/button_bg.png"),
    -webkit-gradient(linear, 0% 0%, 0% 100%, from(#f4aacb), to(#e86ca4));
}

/* red Button */
.red.animatedbutton {
  background-color: #d81b21;
  background-image: url("../img/buttons/animated/button_bg.png"),
    url("../img/buttons/animated/button_bg.png");
  background-image: url("../img/buttons/animated/button_bg.png"),
    url("../img/buttons/animated/button_bg.png"),
    -webkit-gradient(linear, 0% 0%, 0% 100%, from(#ed1c24), to(#aa1317));
}
.red.animatedbutton:hover {
  background-color: #d57ea5;
  background-image: url("../img/buttons/animated/button_bg.png"),
    url("../img/buttons/animated/button_bg.png"),
    -moz-linear-gradient(#c9151b, #a11115);
  background-image: url("../img/buttons/animated/button_bg.png"),
    url("../img/buttons/animated/button_bg.png"),
    -webkit-gradient(linear, 0% 0%, 0% 100%, from(#c9151b), to(#a11115));
}

/* blue animated button */
.blue.animatedbutton {
  background-color: #0095cd;
  background-image: url("../img/buttons/animated/button_bg.png"),
    url("../img/buttons/animated/button_bg.png");
  background-image: url("../img/buttons/animated/button_bg.png"),
    url("../img/buttons/animated/button_bg.png"),
    -webkit-gradient(linear, 0% 0%, 0% 100%, from(#00adee), to(#0078a5));
}
.blue.animatedbutton:hover {
  background-color: #007ead;
  background-image: url("../img/buttons/animated/button_bg.png"),
    url("../img/buttons/animated/button_bg.png"),
    -moz-linear-gradient(#0095cc, #00678e);
  background-image: url("../img/buttons/animated/button_bg.png"),
    url("../img/buttons/animated/button_bg.png"),
    -webkit-gradient(linear, 0% 0%, 0% 100%, from(#0095cc), to(#00678e));
}

/* green animated button */
.green.animatedbutton {
  background-color: #64991e;
  background-image: url("../img/buttons/animated/button_bg.png"),
    url("../img/buttons/animated/button_bg.png");
  background-image: url("../img/buttons/animated/button_bg.png"),
    url("../img/buttons/animated/button_bg.png"),
    -webkit-gradient(linear, 0% 0%, 0% 100%, from(#7db72f), to(#4e7d0e));
}
.green.animatedbutton:hover {
  background-color: #538018;
  background-image: url("../img/buttons/animated/button_bg.png"),
    url("../img/buttons/animated/button_bg.png"),
    -moz-linear-gradient(#6b9d28, #436b0c);
  background-image: url("../img/buttons/animated/button_bg.png"),
    url("../img/buttons/animated/button_bg.png"),
    -webkit-gradient(linear, 0% 0%, 0% 100%, from(#6b9d28), to(#436b0c));
}

/* rosy animated button */
.rosy.animatedbutton {
  background-color: #da5867;
  background-image: url("../img/buttons/animated/button_bg.png"),
    url("../img/buttons/animated/button_bg.png");
  background-image: url("../img/buttons/animated/button_bg.png"),
    url("../img/buttons/animated/button_bg.png"),
    -webkit-gradient(linear, 0% 0%, 0% 100%, from(#f16c7c), to(#bf404f));
}
.rosy.animatedbutton:hover {
  background-color: #ba4b58;
  background-image: url("../img/buttons/animated/button_bg.png"),
    url("../img/buttons/animated/button_bg.png"),
    -moz-linear-gradient(#cf5d6a, #a53845);
  background-image: url("../img/buttons/animated/button_bg.png"),
    url("../img/buttons/animated/button_bg.png"),
    -webkit-gradient(linear, 0% 0%, 0% 100%, from(#cf5d6a), to(#a53845));
}

/* gray animated button */
.gray.animatedbutton {
  background-color: #6e6e6e;
  background-image: url("../img/buttons/animated/button_bg.png"),
    url("../img/buttons/animated/button_bg.png");
  background-image: url("../img/buttons/animated/button_bg.png"),
    url("../img/buttons/animated/button_bg.png"),
    -webkit-gradient(linear, 0% 0%, 0% 100%, from(#888), to(#575757));
}
.gray.animatedbutton:hover {
  background-color: #616161;
  background-image: url("../img/buttons/animated/button_bg.png"),
    url("../img/buttons/animated/button_bg.png"),
    -moz-linear-gradient(#757575, #4b4b4b);
  background-image: url("../img/buttons/animated/button_bg.png"),
    url("../img/buttons/animated/button_bg.png"),
    -webkit-gradient(linear, 0% 0%, 0% 100%, from(#757575), to(#4b4b4b));
}

/* white animated button */
.white.animatedbutton {
  background-color: #fff;
  background-image: url("../img/buttons/animated/button_bg.png"),
    url("../img/buttons/animated/button_bg.png");
  background-image: url("../img/buttons/animated/button_bg.png"),
    url("../img/buttons/animated/button_bg.png"),
    -webkit-gradient(linear, 0% 0%, 0% 100%, from(#fff), to(#ededed));
}
.white.animatedbutton:hover {
  background-color: #ededed;
  background-image: url("../img/buttons/animated/button_bg.png"),
    url("../img/buttons/animated/button_bg.png"),
    -moz-linear-gradient(#fff, #dcdcdc);
  background-image: url("../img/buttons/animated/button_bg.png"),
    url("../img/buttons/animated/button_bg.png"),
    -webkit-gradient(linear, 0% 0%, 0% 100%, from(#fff), to(#dcdcdc));
}
/*==================================== GotoTop ====================================*/
#toTop {
  display: none;
  text-decoration: none;
  position: fixed;
  bottom: 10px;
  right: 10px;
  overflow: hidden;
  width: 39px;
  height: 34px;
  border: none;
  text-indent: -999px;
  background: url(../img/b_ui.totop.png) no-repeat left top;
}

#toTopHover {
  background: url(../img/b_ui.totop.png) no-repeat left -35px;
  width: 51px;
  height: 51px;
  display: block;
  overflow: hidden;
  float: left;
  opacity: 0;
  -moz-opacity: 0;
  filter: alpha(opacity=0);
}

#toTop:active,
#toTop:focus {
  outline: none;
}
/*-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/

/*==================================== Elements ====================================*/

/*------------------- highlight --------------------*/
.highlight_blue {
  padding: 2px 6px;
  color: #fff;
  background: #007ead;
}
.highlight_orange {
  padding: 2px 6px;
  background-color: #f47c20;
  color: #fff;
}
.highlight_red {
  padding: 2px 6px;
  background-color: #d81b21;
  color: #fff;
}
.highlight_green {
  padding: 2px 6px;
  background-color: #64991e;
  color: #fff;
}
.highlight_pink {
  padding: 2px 6px;
  background-color: #f895c2;
  color: #fff;
}
.highlight_rosy {
  padding: 2px 6px;
  background-color: #da5867;
  color: #fff;
}

.icon_red {
  padding: 2px 6px;
  background-color: #d81b21;
  color: #fff;
  font-size: 10px;
}
.icon_green {
  padding: 2px 6px;
  background-color: #64991e;
  color: #fff;
  font-size: 10px;
}

.icon_orange {
  padding: 2px 6px;
  background-color: #f47c20;
  color: #fff;
  font-size: 10px;
}
/*------------------- dropcap --------------------*/
.dropcap {
  display: block;
  float: left;
  font-size: 26px;
  line-height: 28px;
  margin: 3px 15px 15px 0;
}
.dropcap-square {
  display: block;
  float: left;
  font-size: 22px;
  line-height: 40px;
  width: 40px;
  height: 40px;
  text-align: center;
  margin: 3px 15px 15px 0;
}

.dropcap-circle {
  float: left;
  display: block;
  margin: 3px 15px 15px 0;
  font-size: 22px;
  line-height: 40px;
  text-shadow: none;
  width: 40px;
  text-align: center;
  border-radius: 40px;
  -moz-border-radius: 40px;
  -webkit-border-radius: 40px;
}

/*------------------- table --------------------*/
table {
  margin: 0 0 20px 0;
  width: 100%;
  border: 1px solid #3f3f3f;
}
table th {
  border: 1px solid #f3f3f3;
  background: #fdfdfd;
  padding: 10px 15px;
}
.price {
  font-size: 11px;
}
sup {
  font-size: 8px;
}
table td {
  border: 1px solid #f3f3f3;
  background: #fff;
  padding: 10px 15px;
  text-align: center;
}
table tfoot {
  text-align: center;
}
table td .btn {
  margin: 0;
}

/*--------------------------- pricing tables -------------------------*/

table.clean_pricing td.price,
table.pricing td.price {
  font-size: 16px;
  font-style: italic;
}

table.clean_pricing th {
  color: #5b5b5d;
}

table.pricing th {
  color: #fff;
}

table.basic th {
  background: #0095cd;
}

table.bronze th {
  background: #da5867;
}

table.silver th {
  background: #e9e9e9;
}

table.gold th {
  background: #f78d1d;
}

table.platinum th {
  background: #64991e;
}

/*------------------- preformated text, code --------------------*/
code,
pre {
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ",
    Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  border-top: 1px solid #d6d5d5;
  border-right: 1px solid #d6d5d5;
  border-bottom: 1px solid #d6d5d5;
  background: #ffffff;
  padding: 7px 10px;
  font-size: 14px;
  display: block;
  margin-bottom: 20px;
  margin-top: 20px;
  overflow: hidden;
}

/*------------------- testimonial --------------------*/

.testimonial {
}

p.testimonial_text {
  font: italic 1.2em/1.6em Georgia, sans-serif;
  background: url(../img/icons/close-quote.png) no-repeat right bottom;
  padding-left: 46px;
  font-weight: normal;
  text-indent: -46px;
}

p.testimonial_text:first-letter {
  background: url(../img/icons/quote.png) no-repeat left top;
  padding-left: 46px;
  font: italic 1.4em Georgia, sans-serif;
}

.testimonial_meta {
  float: right;
}

.testimonial_meta a {
  font-weight: bold;
}

/*------------------- tabs --------------------*/
ul.tabs {
  margin: 0;
  padding: 0;
  float: left;
  list-style: none;
  height: 32px;
  width: 100%;
}
ul.tabs li {
  float: left;
  margin: 0;
  padding: 0;
  height: 31px;
  line-height: 31px;
  border: 1px solid #f3f3f3;
  border-bottom: none;
  border-left: none;
  margin-bottom: -1px;
  overflow: hidden;
}
ul.tabs li a {
  text-decoration: none;
  color: #333;
  display: block;
  padding: 0 15px;
  border: 1px solid #f3f3f3;
  border-top: none;
  border-right: none;
  outline: none;
}
ul.tabs a:active {
  outline: none;
}
ul.tabs a.current,
ul.tabs a.current:hover,
ul.tabs li.current a {
  cursor: default !important;
}
.panes {
  border-top: none;
  overflow: hidden;
  clear: both;
  float: left;
  width: 100%;
}
.panes div {
  padding: 15px;
  border: 1px solid #f3f3f3;
}
.panes h4 {
  font-weight: normal;
  margin: 0 0 10px 0;
  font-size: 16px;
  color: #333;
}
.panes p {
  margin: 10px 0 0 0;
}
.panes img {
  margin-bottom: 10px;
}

/*------------------- accordion --------------------*/
#accordion {
  width: 100%;
  border: 1px solid #e5e5e5;
  display: inline-block;
}
/* accordion header */
#accordion h4 {
  margin: 0;
  padding: 5px 15px;
  border-left: none;
  border-right: none;
  border-top: 1px solid #f3f3f3;
  border-bottom: 1px solid #f3f3f3;
  cursor: pointer;
}

/* currently active header */
#accordion h4.current {
  cursor: default;
}
/* accordion pane */
#accordion .pane {
  border-left: none;
  border-right: none;
  display: none;
  height: auto;
  padding: 15px;
}
/* a title inside pane */
#accordion .pane h5 {
  font-weight: normal;
  margin: 0 0 10px 0;
  color: #333;
}
#accordion .pane p {
  margin: 10 0 0 0;
}
.pane img {
  margin-bottom: 10px;
}

/* toggles */

.toggle {
  display: block;
  margin-bottom: 15px;
}

/* toggle header */
.toggle h5.title {
  margin-bottom: 3px;
  padding: 5px 12px;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  display: block;
  overflow: hidden;
  position: relative;
  cursor: pointer;
}

.toggle span.title:hover {
}

/* currently active header */
.toggle span.active {
  cursor: pointer;
}

.toggle h5.title span.title_content {
  display: block;
  overflow: hidden;
  position: relative;
  background: url(../img/icons/toggle_plus.png) no-repeat center right;
}

/* toggle pane */
.toggle .pane {
  border-radius: 2px;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  margin: 5px 0;
  display: none;
  padding: 15px;
  font-size: 12px;
  line-height: 1.5em;
  border: 1px solid #f3f3f3;
  background: #fff;
}

/* toggle_style1 */

.tstyle1 h5.title {
  background: #f8f8f8;
  color: #777;
  text-shadow: 1px 1px 0 #fff;
}

.tstyle1 h5.title:hover,
.toggle_style1 span.active:hover {
  color: #333;
  background: #f1f1f1;
}

.tstyle1 h5.active span.title_content {
  background: url(../img/icons/toggle_minus.png) no-repeat center right;
}

.tstyle1 span.active {
  color: #333;
  background: #f1f1f1;
}

/* toggle_style2 */

.tstyle2 h5.title {
  background: #0095cd;
  color: #fffffff;
  text-shadow: 1px 1px 0 #fff;
}

.tstyle2 h5.title:hover,
.toggle_style1 span.active:hover {
  color: #ffffff;
  background: #f1f1f1;
}

.tstyle2 h5.active span.title_content {
  background: url(../img/icons/toggle_minus.png) no-repeat center right;
}

.tstyle2 span.active {
  color: #333;
  background: #f1f1f1;
}
/*------------------- info boxes --------------------*/

/*alert message*/
div.boxes {
  font-size: 12px;
  margin: 2px 0 15px;
  padding: 20px 15px 20px 75px;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
}
div.success_box {
  background: url("../img/icons/message/check.png") no-repeat 15px center
    #ebfab6;
  border: 1px solid #bbcc5b;
  color: #599847;
}
div.arrow_box {
  background: url("../img/icons/message/arrow.png") no-repeat 15px center
    #ebfab6;
  border: 1px solid #bbcc5b;
  color: #599847;
}
div.alert_box {
  background: url("../img/icons/message/alert.png") no-repeat 15px center
    #fbdd96;
  border: 1px solid #e5af51;
  color: #ca6b1c;
}
div.error_box {
  background: url("../img/icons/message/error.png") no-repeat 15px center
    #fdd2d1;
  border: 1px solid #f6988f;
  color: #883333;
}
div.notice_box {
  background: url("../img/icons/message/notice.png") no-repeat 15px center
    #f9ebca;
  border: 1px solid #e5b2ac;
  color: #9f6722;
}
div.question_box {
  background: url("../img/icons/message/question.png") no-repeat 15px center
    #e6ebf0;
  border: 1px solid #89becd;
  color: #277dce;
}

/*----------------------------------- flickr gallery -------------------------------------------*/

ul#flickr {
  margin: 0;
  padding: 0;
  display: inline-block;
  width: 220px;
  margin-top: 10px !important;
}
ul#flickr li {
  margin-top: 0 !important;
}
.subscript {
  padding: 0;
  margin: 0;
}
.subscript p {
  margin-bottom: 10px;
  margin-top: 15px !important;
}
.subscript span {
  margin-bottom: 10px;
  margin-left: 5px;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ",
    Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: 18px;
}
.subscript form {
  margin-top: 10px;
}
.subscript input {
  float: left;
  width: 208px;
  height: 23px;
  border: 1px solid #f7f7f7;
  padding-left: 10px;
}
.contact-us {
  padding: 0;
  margin: 0;
}
.contact-us iframe {
  background: #ededed;
  padding: 5px;
  margin-top: 10px !important;
}
.contact p {
  padding: 0;
  margin: 0;
}
.contact ul {
  padding: 0;
  margin: 0;
}
.contact ul li {
  padding: 0;
  margin: 0;
  height: auto;
}
/*F) Misc
-------------------------------------------
1. General
-------------------------------------------
*/
ul.team_contact {
  list-style: none;
  margin: 0;
}
ul.team_contact .phone {
  background-attachment: scroll;
  background-image: url(../img/icons/home.png);
  background-repeat: no-repeat;
  background-position: left center;
  padding-left: 24px;
}
ul.team_contact .email {
  background-attachment: scroll;
  background-image: url(../img/icons/email.png);
  background-repeat: no-repeat;
  background-position: left center;
  padding-left: 24px;
}

ul.team_contact li {
  margin-top: 10px;
}

.error404 {
  padding: 10px;
}
.error404 h1 {
  text-align: center;
  margin: 0;
  line-height: 1.5em;
  font-size: 54px;
}

/*------------------------------------ twitter feed ------------------------------*/

.twitter_feed {
  margin-top: -20px;
}

.tweet {
  overflow: hidden;
}
ul.tweet_list {
  margin: 0px;
  padding: 0px;
  list-style: none;
  background-attachment: scroll;
  background-color: transparent;
  background-image: url("../img/icons/twitter.png");
  background-repeat: no-repeat;
  background-position: left center;
}
li.tweet_first,
li.tweet_odd,
li.tweet_even {
  margin-left: 36px;
  font-style: italic;
}
.loading {
  margin: 0;
  padding: 0;
  background-image: url("../img/icons/loading.gif");
  background-attachment: scroll;
  background-repeat: no-repeat;
  background-position: 105px center;
}
.twitter_box {
  padding: 15px 0 15px 0;
  background: #f0f0f0;
  -webkit-box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2);
  -ms-box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2);
  -o-box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2);
  box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2);
  border-top: 1px solid #fff;
}
span.tweet_time a {
  border-bottom: 1px solid transparent;
}
span.tweet_text a {
  border-bottom: 1px solid transparent;
}

/*==================================== Forms ====================================*/

/*----------------------- search form ----------------------------*/
#searchform {
  float: right;
  width: 300px;
  margin-top: 15px;
  color: #848383;
}

#searchform input.search {
  width: 278px;
  height: 28px;
  outline: 0;
  padding-top: 5px;
  padding-bottom: 5px;
  padding-left: 10px;
  padding-right: 10px;
}

/*----------------------- contact form ----------------------------*/

input {
  height: 30px;
}
ul.cform {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none;
}
ul.cform li {
  margin-top: 0 !important;
  margin-bottom: 20px !important;
}
ul.cform li .btn {
  margin-top: 0 !important;
}

#ocheck {
  margin-bottom: 10px;
}

ul.cform li label {
  display: block;
  margin-bottom: 10px;
  line-height: 36px;
  width: 170px;
  margin: 0px;
  text-indent: 10px;
}
.cform textarea {
  width: 580px;
  border: 1px solid #f3f3f3;
  background: #fff;
}
input#companyname,
input#name,
input#fname,
input#add,
input#tel,
input#fax,
input#email,
input#post {
  width: 580px;
  border: 1px solid #f3f3f3;
  background: #fff;
}
input.button {
  width: auto;
}
input.button {
  cursor: pointer;
  padding-bottom: 3px;
  padding-left: 10px;
  padding-right: 10px;
  padding-top: 3px;
  border-bottom-left-radius: 3px;
  border-bottom-right-radius: 3px;
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  display: inline-block;
  overflow-x: hidden;
  overflow-y: hidden;
  color: #fff;
}
input.button {
  text-decoration: none;
}
input,
textarea {
  background: #fff;
}
.validation {
  display: none;
}
#sendmessage {
  background: url("../img/icons/success_icon.png") no-repeat 20px center #dff2bf;
  border: 1px solid #4f8a10;
  color: #4f8a10;
  display: none;
  padding: 15px 12px 15px 65px;
  margin: 10px 0;
}
input[type="text"]:focus,
textarea:focus,
input[type="password"]:focus {
  outline: 0 none;
}

.reginput {
  width: 242px;
}
.inputstyle {
  font-size: 12px;
}
.fancyinputarea {
  padding: 9px;
  outline: 0;
  font-size: 12px;
}
input[type="submit"] {
  cursor: pointer;
  display: inline-block;
  background-color: #e6e6e6;
  background-repeat: no-repeat;
  background-image: -webkit-gradient(
    linear,
    0 0,
    0 100%,
    from(#ffffff),
    color-stop(25%, #ffffff),
    to(#e6e6e6)
  );
  background-image: -webkit-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
  background-image: -moz-linear-gradient(top, #ffffff, #ffffff 25%, #e6e6e6);
  background-image: -ms-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
  background-image: -o-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
  background-image: linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#e6e6e6', GradientType=0);
  padding: 5px 14px 6px;
  text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
  color: #333;
  font-size: 12px;
  line-height: normal;
  border: 1px solid #ccc;
  border-bottom-color: #bbb;
}

/*----------------------- carousel ----------------------------*/
.timer {
  height: 1px;
  width: 0px;
}

ul#portfolio_home {
}

ul#portfolio_home li {
  margin-top: 10px;
  margin-left: 0;
  margin-right: 20px;
}

#clients {
  margin-top: 30px;
}
#clients ul {
  list-style: none;
  margin: 0;
}
#clients li {
  display: inline;
  margin-top: 0;
}
.caroufredsel_wrapper {
  width: 940px;
}
.no-margin {
  margin: 0;
}

/*----------------------- ticker ----------------------------------*/

ul#fade {
  padding-left: 55px;
  list-style: none;
}

ul#fade li {
  line-height: 1.5em;
  color: #909090;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ",
    Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: 18px;
  margin-top: 19px;
  font-style: italic;
}

/*----------------------- boxgrid sliding box ----------------------------*/
.boxgrid {
  padding: 9px;
  float: left;
  overflow: hidden;
  position: relative;
  background: #fff;
  border-width: 1px;
  border-style: solid;
  border-color: #f7f7f6;
}
.boxgrid:hover {
  background: #fff;
}
.boxgrid img {
  position: absolute;
  top: 0;
  left: 0;
  border: 0;
  margin: 9px;
}
.folio_detail {
  width: 100%;
  height: 138px;
  float: left;
  background: #f3f3f3;
}
.folio_detail .button {
  margin-left: 10px;
}
.boxgrid p {
  padding: 0 10px;
  color: #afafaf;
  font-weight: bold;
  font: 12px "Lucida Grande", Arial, sans-serif;
}
.boxgrid h3 a,
.boxgrid h4 a {
  float: left;
  width: 100%;
  margin: 10px 10px 0px 10px;
}
.folio_detail ul {
  float: left;
  margin-left: 10px;
}
.folio_detail ul li {
  list-style: none;
  padding: 0 !important;
  margin: 0 !important;
}
.boxcaption {
  float: left;
  background: #000;
  height: 100px;
  width: 100%;
  opacity: 0.8;
  /* For IE 5-7 */
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
  /* For IE 8 */
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
}
.captionfull .boxcaption {
  top: 260;
  left: 0;
}
.caption .boxcaption {
  top: 220;
  left: 0;
}

/*==================================== Misc, alignment, spacer ====================================*/

.clear {
  clear: both;
}

.left {
  float: left;
}
.right {
  float: right;
}

.center {
  margin-left: auto;
  margin-rigth: auto;
  text-align: center;
}
.fluid {
  float: left;
  width: 100%;
}

.description {
  overflow: hidden;
  padding-bottom: 5px;
}
.text_align_center {
  text-align: center;
}
.align_left {
  text-align: left;
}
.align_right {
  text-align: right;
}

/*-------------------- spacer --------------------*/

.spacer-10 {
  margin-top: -10px;
}

.botspacer-10 {
  margin-bottom: -10px;
}

.botspacer-20 {
  margin-bottom: -20px;
}

.spacer5 {
  margin-top: 5px;
}

.spacer10 {
  margin-top: 10px;
}

.botspacer10 {
  margin-bottom: 10px;
}

.spacer15 {
  margin-top: 15px;
}

.botspacer15 {
  margin-bottom: 15px;
}

.spacer20 {
  margin-top: 20px;
}

.botspacer20 {
  margin-bottom: 20px;
}

.botspacer30 {
  margin-bottom: 30px;
}

.botspacer40 {
  margin-bottom: 40px;
}

.botspacer100 {
  margin-bottom: 100px;
}

.botspacer200 {
  margin-bottom: 200px;
}

.botspacer280 {
  margin-bottom: 280px;
}

.spacer25 {
  margin-top: 25px;
}

.padding30 {
  padding-top: 30px;
}

.spacer30 {
  margin-top: 30px;
}

.left20 {
  margin-left: 20px;
}

/* =STYLESWITCHER
-----------------------------------------------------------------------------------------------*/

.panel {
  background: #f6f6f6;
  border: 1px solid #b4b3b3;
  display: none;
  height: auto;
  left: 0;
  padding: 45px 15px 20px 10px;
  top: 70px;
  position: fixed;
  _position: absolute;
}

.panel h6 {
  text-align: center;
  font-size: 14px;
  padding-bottom: 15px;
  border-bottom: 1px solid #b4b3b3;
}

.panel h6.bot {
  margin-top: 25px;
}

a.openpanel {
  _background-image: none;
  background: #f6f6f6 url(../img/theme-option.png) no-repeat center center;
  padding: 5px;
  border: 1px solid #b4b3b3;
  color: #fff;
  display: block;
  left: 0;
  width: 31px;
  height: 31px;
  top: 85px;
  text-indent: -9999px;
  position: fixed;
  _position: absolute;
}

a.openpanel:hover {
}

a.active.openpanel {
  border-left: none;
  _position: absolute;
  left: 90px;
}

#stylechanger,
#stylechangerbot {
  float: left;
  list-style: none;
  list-style-type: none;
  list-style-position: outside;
  margin-bottom: 0;
  margin-right: 5px;
}

#stylechanger li a,
#stylechanger-right li a,
#stylechangerbot li a,
#stylechangerbot-right li a {
  display: block;
  margin-bottom: 5px;
  width: 30px;
  height: 25px;
  text-indent: -9999px;
}

#stylechanger-right,
#stylechangerbot-right {
  float: right;
  list-style: none;
  list-style-type: none;
  list-style-position: outside;
  margin-left: 5px;
}

#bg1 {
  background: url(../img/pattern/1.jpg);
}
#bg2 {
  background: url(../img/pattern/2.jpg);
}
#bg3 {
  background: url(../img/pattern/3.jpg);
}
#bg4 {
  background: url(../img/pattern/4.jpg);
}
#bg5 {
  background: url(../img/pattern/5.jpg);
}
#bg6 {
  background: url(../img/pattern/6.jpg);
}
#bg7 {
  background: url(../img/pattern/7.jpg);
}
#bg8 {
  background: url(../img/pattern/8.jpg);
}
#bg9 {
  background: url(../img/pattern/9.jpg);
}
#bg10 {
  background: url(../img/pattern/10.jpg);
}

#default {
  background: #0095cd;
}
#green {
  background: #64991e;
}
#orange {
  background: #f78d1d;
}
#pink {
  background: #f895c2;
}
#red {
  background: #d81b21;
}
#rosy {
  background: #da5867;
}

#over a:hover img {
  opacity: 0.6;
  filter: alpha(opacity=60);
  -ms-filter: "alpha( opacity=60 )";
  background: #fff;
}

/* blue */
ul.blue_arrow_s li {
  background-attachment: scroll;
  background-image: url("../img/list/b_list-arrow.png");
  background-repeat: no-repeat;
  background-position: left center;
  padding-left: 20px;
  margin-top: 5px;
  font-size: 13px;
}

ul.blue_arrow_s li a {
  color: #666666;
}

ul.blue_arrow_s li a:hover {
  color: #0095cd;
  text-decoration: underline;
}

#preview {
  position: absolute;
  border: 3px solid #333;
  background: #444;
  padding: 5px;
  display: none;
  color: #fff;
  text-align: center;
}

ul.jirei li {
  margin-left: 1em;
  text-indent: -1em;
}

p.caption {
  font-size: 12px;
  text-align: center;
  margin-top: 5px;
}

.detail {
  border: dotted 1px #ccc;
  position: relative;
}
.detail p {
  text-align: center;
  line-height: 1.4;
  margin: 0;
  position: absolute;
  right: 0;
  bottom: 0;
}