/*
 *  Document   : main.css
 *  Author     : Jim
 *  Description: The main stylesheet of the template
 *
 *  Structure (with shortcodes):
 *      (#m01mls) MAIN LAYOUT
 *      (#m02-1hds) HEADER
 *		(#m02-2fts) FOOTER
 *      (#m03mcs) MAIN CONTENT
 *      (#m04bos) BOOTSTRAP OVERWRITE/EXTEND STYLES
 *      (#m05ths) THEME
 *      (#m06hes) HELPERS
 *      (#m07res) RESPONSIVE
 *      (#m08rts) RETINA
 *      (#m09rprl) PRELOAD
 */

/*
=================================================================
(#m01mls) MAIN
=================================================================
*/
span.alert-text { color: #E1645F; }
span.date-text { color: #f36a40;}

/*
=================================================================
(#m02-1hds) HEADER
=================================================================
*/
header div.xs-title-line {
	background: url(../img/happiness/md-main/top.png);
	background-size: auto 7px;
}
header div.md-title-line {
	background: url(../img/happiness/md-main/top.png);
}

header div.xs-title {
	background:0 50% url(../img/happiness/md-main/bg_happiness.png) no-repeat;
	background-size:auto 210px;
}
header div.is-sticky div.xs-title {
	border-bottom: 1px solid rgba(0,0,0,0.1);
}

header div.xs-title div.mobile-logo{padding-right: 100px !important;}
header div.xs-title img.xs-logo { width: 256px; height: auto;}
header div.xs-title img.xs-logo.en { width: 256px; margin-top: 2px;}
/*@media screen and (max-width: 340px){
	header div.xs-title img.xs-logo { width: 105%; height: auto; margin-top: 5px;}
}*/

header div.md-title {
	background: url(../img/happiness/md-main/bg_happiness.png);
}
div.md-title div.share-box a {color: #955e4d;}
header div.md-title img.md-title-logo {
	margin-top: 0px;
	margin-left: -33px;
}

div.md-title div.zh-box a.zh-en {
	background: url(../img/happiness/md-main/en-tag_happiness.png);
}
div.md-title div.zh-box a.zh-tw {
	background: url(../img/happiness/md-main/ch-tag_happiness.png);
}

div.nav-box{margin-top: 20px;}
ul.header-nav>li>img {margin: 0px 22px;}
ul.header-nav.en>li>img {margin: 0px 45px;}

#sidebar-alt{background-color: #ffefe6;}
.sidebar-nav>li{background: #ffefe6;}
.sidebar-nav li.nav-title { background: #f98966; }
.sidebar-nav li.nav-title a{ border-bottom: 1px solid #f98966; }
.sidebar-nav li.nav-title a:hover { background: #f98966;  }
.sidebar-nav a { border-bottom: 1px solid #ffb59f; color:#4e4744}
.sidebar-nav a > .sidebar-nav-icon,.sidebar-nav a > .sidebar-nav-indicator {color: #955e4d; opacity: 1;}
.sidebar-nav a:hover,.sidebar-nav a.open,.sidebar-nav li.active > a {background: #ffe4d5;}
.sidebar-nav ul{background: #fff9ea;}
.sidebar-nav ul a i {color: #eea009;}
.sidebar-nav ul a {margin: 0; font-size: 15px; padding-left: 25px; min-height: 32px; line-height: 32px; border-bottom:1px solid #ffb59f;}
.sidebar-nav ul a:hover,.sidebar-nav a:active{background-color:#ffe4d5;}


ul.header-nav>li:hover>a { border-bottom: 5px solid #eea009;}
ul.header-nav>li:hover ul.header-nav2{background: #fff9ea}
ul.header-nav2{box-shadow: 1px 1px 2px rgba(65,50,46,0.08);}
ul.header-nav2>li a i { color: #eea009;}
ul.header-nav2>li a:hover,ul.header-nav2>li a.selected { color: #e59803; }
ul.header-nav>li>a{display:inline-block; height: 32px;color:#000000;}
ul.header-nav2>li a { padding: 7px 15px; display: inline-block; color: #3b3b3b;  width: 100%; font-size: 16px;}
/*
=================================================================
(#m02-2fts) FOOTER
=================================================================
*/

footer div.copy-right { background: #ffc7bd; color:#955e4d;}
footer div.copy-right img.copy-right-icon { width:34px; height: 32px; }
footer div.copy-right div.powerby-area a { color:#955e4d; }
footer img.footer-img-xs {top: 3px; height:140px;}

/*
=================================================================
(#m03mcs) MAIN CONTENT
=================================================================
*/

/*=========title-banner=========*/
div.title-banner-box { border: 2px solid #ffac92; border-radius: 5px;}
div.title-banner-box .banner-title { color: #955e4d; text-shadow: 0 0 3px rgba(255,255,255,0.75),0 0 3px rgba(255,255,255,0.75),0 0 3px rgba(255,255,255,0.75),0 0 20px rgba(255,255,255,0.75);}


/*div.title-banner-box.about { background: linear-gradient(#ffddc8, #fad2ca) url(../img/happiness/about/banner_about_happiness.png) 100% no-repeat; background-size: auto 66px; position:relative;}
div.title-banner-box.news { background: url(../img/happiness/news/banner_news_happiness.png) 100% no-repeat; background-size: auto 66px; position:relative;}*/
/*div.title-banner-box.help { background: url(../img/happiness/help/banner_help_happiness.png) 100% no-repeat ; background-size: auto 66px; position:relative;}*/
/*div.title-banner-box.service { background: url(../img/happiness/service/banner_service_happiness.png) 100% no-repeat; background-size: auto 66px; position:relative;}*/
/*div.title-banner-box.shop { background: url(../img/happiness/shop/banner_shop_happiness.png) 100% no-repeat; background-size: auto 66px; position:relative;}*/
/*div.title-banner-box.media { background: url(../img/happiness/media/banner_media_happiness.png) 100% no-repeat; background-size: auto 66px; position:relative;}*/
/*div.title-banner-box.contact { background: url(../img/happiness/contact/banner_contactus_happiness.png) 100% no-repeat; background-size: auto 66px; position:relative;}*/
/*div.title-banner-box.sitemap { background: url(../img/happiness/sitemap/banner_about_happiness.png) 100% no-repeat; background-size: auto 66px; position:relative;}*/
div.title-banner-box .inner-box {width: 100%; height: 100%; position: absolute;top:0; left:0; border:3px solid #fff; border-radius:3px;}
/*about*/
div.title-banner-box.about:before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: url(../img/happiness/about/banner_about_happiness.png) 100% no-repeat ; background-size: auto 66px;
}
div.title-banner-box.about { 
	position: relative;
	background: linear-gradient(#ffe3c9, #fad2ca);
}
/*news*/
div.title-banner-box.news:before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: url(../img/happiness/news/banner_news_happiness.png) 100% no-repeat ; background-size: auto 66px;
}
div.title-banner-box.news { 
	position: relative;
	background: linear-gradient(#ffe3c9, #fad2ca);
}
/*help*/
div.title-banner-box.help:before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: url(../img/happiness/help/banner_help_happiness.png) 100% no-repeat ; background-size: auto 66px;
}
div.title-banner-box.help { 
	position: relative;
	background: linear-gradient(#ffe3c9, #fad2ca);
}
/*service*/
div.title-banner-box.service:before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: url(../img/happiness/service/banner_service_happiness.png) 100% no-repeat ; background-size: auto 66px;
}
div.title-banner-box.service { 
	position: relative;
	background: linear-gradient(#ffe3c9, #fad2ca);
}
/*shop*/
div.title-banner-box.shop:before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: url(../img/happiness/shop/banner_shop_happiness.png) 100% no-repeat ; background-size: auto 66px;
}
div.title-banner-box.shop { 
	position: relative;
	background: linear-gradient(#ffe3c9, #fad2ca);
}
/*media*/
div.title-banner-box.media:before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: url(../img/happiness/media/banner_media_happiness.png) 100% no-repeat ; background-size: auto 66px;
}
div.title-banner-box.media { 
	position: relative;
	background: linear-gradient(#ffe3c9, #fad2ca);
}
/*contact*/
div.title-banner-box.contact:before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: url(../img/happiness/contact/banner_contactus_happiness.png) 100% no-repeat ; background-size: auto 66px;
}
div.title-banner-box.contact { 
	position: relative;
	background: linear-gradient(#ffe3c9, #fad2ca);
}
/*sitemap*/
div.title-banner-box.sitemap:before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: url(../img/happiness/about/banner_about_happiness.png) 100% no-repeat ; background-size: auto 66px;
}
div.title-banner-box.sitemap { 
	position: relative;
	background: linear-gradient(#ffe3c9, #fad2ca);
}
ul.sitemap-menu li.menu-title a { color: #955e4d; }

/*=========breadcrumbs=========*/
div.breadcrumbs a:hover { color: #957cca; }
div.breadcrumbs span.path_alert { color: #eea009; }

/*=========banner-title-line=========*/
div.banner-title-line { background: url(../img/happiness/content-title/line-point2_happiness.png) repeat-x 50%; background-size: auto 2px; }

/*=========left menu=========*/

ul.left-menu li+li {
	border-top: 1px dashed #ffb190;
}

ul.left-menu li a {color:#3e3e3e;}
ul.left-menu li.selected a { color: #94b304; }
ul.left-menu li a:hover { color: #94b304; }

/*=========news list=========*/
h2.news-header { color: #955e4d; }
div.news-title { background: #ffefe6;border-left: 5px solid #f98966; }
div.news-date span.news-day {color:#f36a40;}
div.news-spec{background: url(../img/happiness/index/line-point2_happiness.png) 100% 100% repeat-x;}

/*========= periodical ==========*/
div.periodical-main h3 a.periodical-download { background: #955e4d; }
div.periodical-main h3 i.title-icon { color: #955e4d; margin-top: -5px; }

/*========= event-list ==========*/
div.event-list { background: url(../img//happiness/index/line-point2_happiness.png) 100% 100% repeat-x; padding: 15px 0px; }
div.event-list span.event-date { color: #f77e52; }

/*========= contact us ==========*/
div.form-title { background: #f98966; }
div.ori-form { border: 1px dashed #f98966; background-color: #ffefe6;}
div.ori-form div.button-area { border-top: 1px dashed #f98966; }
div.ori-form div.form-line { border-top: 1px dashed #f98966; }
div.ori-form div.row.form-table-title>div { border-top: 1px dashed #D59935; border-bottom: 1px dashed #D59935; }
div.ori-form div.row.form-table-content>div+div { border-left: 1px dashed #D59935; }
div.ori-form div.row.form-table-content-last>div { border-top: 1px dashed #D59935; border-bottom: 1px dashed #D59935; }
div#refresh_img i { background: #D59935; }
a#auth_code_audio {
    border: 2px solid #f98966;
}
a#auth_code_audio:hover {
    border: 2px solid #f98966;
    background: #f98966;
}
a#auth_code_audio i {
    color: #f98966;
} 

/*========= donate form ==========*/
button.submit-button.donate-btn-color{ background-color: #77d1e6; }

/*========= board ==========*/
a.leave-button { background: #955e4d; }
div.board-box { background: url(../img/happiness/contact/bird_happiness.png) 10px 10px no-repeat #ffefe6; background-size: 31px 35px; }
div.board-box div.board-ask span.ask-date {color: #f36a40;}
div.brown-line { background: url(../img/happiness/index/line-point2_happiness.png) 50% repeat-x; height: 8px; margin-top: 20px; }
/*========= detec ==========*/
div.pc-tab-box { border-bottom: 2px solid #f98966; }
div.pc-tab-box a.selected { background: #f98966; color: #fff; border-color: #f36a40; }
div.pc-tab-box a:hover { background: #f98966; color: #fff; border-color: #f36a40; }
div.pc-tab-box a { background:#ffe4d5; border-top: 3px solid #ffe4d5; color: #796762;}
div.purple-line { background: url(../img/happiness/content-title/line-point2_happiness.png) 50% repeat-x; height: 8px; margin-bottom: 5px; }
div.detec-search { background: #ffefe6; }
div.mb-tab-box select { border-color: #D59935; }
span.detec-detail { background: #D59935; }
button.search-button { background: #f98966; }

/*========= index =========*/
div#index-banner { border: 2px solid #ffac92; padding: 1px; margin-bottom: 60px; background-color:#fff; }
div#index-banner div.owl-controls { position: absolute; right: 5px; }
div#index-banner div.owl-dot span { background: #f36a40; width: 14px; height: 14px; }
div#index-banner div.owl-dot.active span { background: #fbe4e0; }
div.index-row-title{background: url(../img/happiness/index/line-point2_happiness.png) repeat-x 0% 100%;}
div.index-row-title label.title { margin-top: 15px; padding-top: 5px; color: #328c59;}
div.index-row-title h2.title { margin-top: 15px; padding-top: 5px; color: #955e4d;}
div.index-row-title a.more { color: #eea009; position: absolute; top: 27px; right: 50px;}
div.index-line-bottom { background: url(../img/happiness/index/line-point2_happiness.png) repeat-x 50%; background-size: 9px 2px; }
div.index-airticle-area { position: relative;border: 3px solid #ffac92; background-color: #ffefe6;background-image: none;background: url(../img/happiness/index/pic_happiness.png) no-repeat 98% 92% #ffe8e2; background-size: 164px 207px; padding: 50px 50px 230px 50px;}
div#ad-banner div.owl { border: 5px solid #f6f4ef; }
div#ad-banner div.owl-nav>div.owl-prev { background: url(../img/happiness/index/pre_happiness.png); background-size: 40px 40px; }
div#ad-banner div.owl-nav>div.owl-next { background: url(../img/happiness/index/next_happiness.png); background-size: 40px 40px; }
div.ad-box{ background: #ffceca;}

div.index-row-title img.icon.news {width: 50px; height: 50px;}
div.index-row-title img.icon.publication { width: 50px; height: 50px;}
div.index-row-title img.icon.clipping { width: 50px; height: 50px; }
div.index-row-title img.icon.love { width: 50px; height: 50px;}

div.index-airticle-area img.index-airticle-icon { width: 98px; height: 110px; top: -45px; left: -50px;}
div.index-row-title label.publication-period-mb {color: #ffffff;}
div.index-row-title label.publication-period{color: #DA251C;}
div.index-row-title div.area-right{margin-bottom: 7px; position: relative;}
div.index-line-top>img{width: auto; height: auto;}

div.xs-title>div>div.mobile-donate>a>img{margin-top: 13px !important;}


/*========== pagination ==========*/
ul.pagination li a { color: #f98966;}
ul.pagination li a:hover,ul.pagination li a:active,ul.pagination li a:focus { background: #f98966; color: #fff; }
ul.pagination li.hover a { background: #f98966; color: #fff; }

/*========== button ===========*/
button.submit-button { background: #f98966; }
button.reset-button { background: #a5a5a5; }


/*
=================================================================
(#m04bos) BOOTSTRAP OVERWRITE/EXTEND STYLES
=================================================================
*/


/*
=================================================================
(#m05ths) THEME
=================================================================
*/


/*
=================================================================
(#m06hes) HELPERS
=================================================================
*/


/*
=================================================================
(#m07res) RESPONSIVE
=================================================================
*/




@media screen and (max-width: 550px) {
	
}

@media screen and (max-width: 450px) {
	
}

@media screen and (min-width: 400px) {
	
}

@media screen and (min-width: 550px) {
	
}


@media screen and (min-width: 768px) {

	div.title-banner-box.about { background: url(../img/happiness/about/banner_about_happiness.png) 100% no-repeat #fff; position:relative;}
	div.title-banner-box.news { background: url(../img/happiness/news/banner_news_happiness.png) 100% no-repeat #fff; position:relative;}
	div.title-banner-box.help { background: url(../img/happiness/help/banner_help_happiness.png) 100% no-repeat #fff; position:relative;}
	div.title-banner-box.service { background: url(../img/happiness/service/banner_service_happiness.png) 100% no-repeat #fff; position:relative;}
	div.title-banner-box.media { background: url(../img/happiness/media/banner_media_happiness.png) 100% no-repeat #fff; position:relative;}
	div.title-banner-box.shop { background: url(../img/happiness/shop/banner_shop_happiness.png) 100% no-repeat #fff; position:relative;}
	div.title-banner-box.contact { background: url(../img/happiness/contact/banner_contactus_happiness.png) 100% no-repeat #fff; position:relative;}
	div.title-banner-box.sitemap { background: url(../img/happiness/about/banner_about_happiness.png) 100% no-repeat #fff; position:relative;}
	div.title-banner-box .inner-box {width: 100%; height: 100%; position: absolute;top:0; left:0; border:3px solid #fff;}
	div.title-banner-box.about:before{ display:none; }
	div.title-banner-box.news:before{display:none; }
	div.title-banner-box.help:before{ display:none; }
	div.title-banner-box.service:before{ display:none; }
	div.title-banner-box.media:before{ display:none; }
	div.title-banner-box.shop:before{ display:none; }
	div.title-banner-box.contact:before{ display:none; }
	div.title-banner-box.sitemap:before{ display:none; }


	div.index-airticle-area{padding: 50px 170px 50px 50px;}
	div.index-airticle-area img.index-airticle-icon {top: -27px; left: -55px;}
	
	footer div.footer-imf { 
		background: url(../img/happiness/footer/footer-pic_happiness.png) bottom 0px right 5px no-repeat; 
	}
	footer div.footer-imf>div { 
		margin-bottom: 50px;
	}
}

@media screen and (min-width: 768px)  and (max-width: 992px){

	
}

@media screen and (min-width: 992px) {
	div#index-banner { width: 100%; }
	footer div.footer-imf { 
		background: url(../img/happiness/footer/footer-pic_happiness.png) 50% no-repeat; 
		background-position-y: 0px;
		height: 270px;
	}
	footer div.footer-imf div.container { padding: 90px 70px; }
}

@media screen and (min-width: 992px) and (max-width: 1200px) {
	header div.md-title img.md-title-logo.en {
		margin-top: 0px;
		margin-left: -12px;
		width:42%;
		height: auto;
	}
	ul.header-nav>li>img {margin: 0px 16px;}

	/*footer div.footer-img{
		height: 245px;
		background-position-y: 10px;
	

	footer div.footer-imf>div { 
		margin-bottom: 50px;
	}
}

@media screen and (min-width: 1200px) {
	header div.md-title img.md-title-logo {
	margin-left: -30px;}
	ul.header-nav>li>img { margin: 0px 19px; }

	footer div.footer-imf { background: url(../img/thankful/footer/footer-pic_thankful.png) 50% no-repeat;  margin-bottom: 0px; height: 270px;}
	
}


/*
=================================================================
(#m08rts) RETINA
=================================================================
*/

/*
=================================================================
(#m09rprl) PRELOAD
=================================================================
*/