@charset "utf-8";
* {font-family: "\5FAE\8EDF\6B63\9ED1\9AD4", "Microsoft JhengHei", "微軟正黑體"; font-size: 14px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
a:focus, button:focus, buttom.active {outline: none; text-decoration: none;}
ul, li {list-style: none; margin: 0; padding: 0;}
a, a:hover, button, button:hover {outline: none; text-decoration: none;}


/* 回頂點 */
.actGotop{position:fixed;_position:absolute;bottom:100px;right:100px;width:60px;height:60px;display:none;z-index: 999;}
.actGotop a, .actGotop a:link{width:60px;height:60px;display:inline-block; border-radius: 30px; outline:none; background:#666; line-height: 80px; text-align: center; color: #FFF; font-weight: bold;}
.actGotop a:hover{background:#333; outline:none;}  
.actGotop a i {position: absolute; width: 60px; left: 0; top: 5px; font-size: 30px;}

/** HEADER **/
header {width: 100%; display: table; position: fixed; z-index: 100; top: 0;}
header .header {width: 100%; height: 87px; background: #202020;}
header .header a {display: table; margin: 0 auto; padding: 25px 0 0 0;}
header .header.b2 a {display: table; margin: 0 auto; padding: 25px 0 0 0; text-align: center;}
header .header.b2 a img {width: 50%;}


/** SLIDER **/
.slider {margin-top: 84px; background: url(../images/banner.jpg); background-size: cover; background-repeat: no-repeat;}
.slider2 {margin-top: 84px; background: url(../images/banner-2.jpg);}
.slider3 {margin-top: 84px; background: url(../images/banner-3.jpg);}
.slider4 {margin-top: 84px; background: url(../images/banner-4.jpg);}
.slider1 {margin-top: 84px; background: url(../images/banner-1.jpg);}
.slider > img {width: 100%; position: absolute; z-index: 1; top: 0px; display: none;}
.slider .slogan {position: relative; z-index: 2; background: url(../images/content_bg.png); height: 925px; padding-top: 170px;}
.slider .slogan h1, .slider .slogan h2 {color: #FFF !important; font-weight: 100 !important;} 
.slider .slogan h1 {font-size: 55px; text-align: center; font-family: Times New Roman; text-transform: uppercase; font-weight: 400;}
.slider .slogan h1 span {font-size: 20px;}
.slider .slogan h1 span:nth-last-child(1) {font-size: 55px;
    text-align: center;
    font-family: Times New Roman;
    text-transform: uppercase;}
.slider .slogan h1 img:nth-child(1) {position: initial; width: 25%; margin-right: 4px; margin-bottom: 12px;}
.slider .slogan h1 img:nth-child(3) {position: initial; width: 65%; margin-right: 4px; margin-bottom: 12px;}
.slider .slogan h2:nth-child(2) {text-align: center; font-size: 50px; font-family: 新細明體; letter-spacing: 10px;font-style: italic; text-shadow: 2px 3px 3px #CCC; margin: 20px auto 30px;}
.slider .slogan h2:nth-child(3) {font-size: 24px; padding-left: 80px;}
.slider .slogan h2:nth-child(4) {font-size: 24px; padding-left: 180px;}
.slider .slogan .btn_group {text-align: center; margin-top: 20px;}
.slider .slogan .btn_group button {font-size: 25px; border: 2px solid #FFF; color: #FFF; padding: 10px 40px; font-weight: 100; border-radius: 0; outline: none;}   
.slider .slogan .btn_group button:hover {color: #323232;}
.slider .slogan .btn_group button.btn-red {border: 2px solid #8f1e1f; color: #FFF;}
.slider .slogan .btn_group button.btn-red:hover {color: #FFF;}
.slider .slogan .btn_group button.btn-red.btn-1e:hover:after {background: #8f1e1f;}


.AllSaints_modal .modal {}
.AllSaints_modal .modal-backdrop.in {filter: alpha(opacity=75); opacity: .75;}
.AllSaints_modal .modal-dialog {width: 1026px;}
.AllSaints_modal .modal-header {border: none;}
.AllSaints_modal .modal-header h4 {color: #FFF; font-size: 22px;letter-spacing: 2px;}
.AllSaints_modal .modal-header h5 {color: #FFF; font-size: 22px;}
.AllSaints_modal .modal-content {background-color: transparent; box-shadow: none; border: none}
.AllSaints_modal .modal-body {display: table; border: 3px dashed  #FFF; padding: 0px; color: #FFF;}
.AllSaints_modal .modal-body > ul {display: table;}
.AllSaints_modal .modal-body > ul li {float: left; margin: 4px;}
.AllSaints_modal .close {color: #FFF; filter: alpha(opacity=100); opacity: 1.0; margin-top: 50px;}
.AllSaints_modal .close span:nth-child(1) {background: #FFF; width: 10px; height: 10px; border-radius: 30px; -webkit-border-radius: 30px; -moz-border-radius: 30px;}
.AllSaints_modal .sr-only {position: inherit}

                                                  
.modal-backdrop.in {filter: alpha(opacity=80); opacity: .8;}

.AllSaints_modal #myModal100 .modal-dialog {width: 1170px;}
.AllSaints_modal #myModal100 .modal-dialog .modal-body {width: 100%; padding: 20px 30px; font-size: 20px;text-align: justify; background: rgba(0, 0, 0, 0.8);}
.AllSaints_modal #myModal100 .modal-dialog .modal-footer {border-top: none;}
.AllSaints_modal #myModal100 .close {margin-top: 5px;}   

.page ul.step_01 {width: 100%; display: table;}
.page ul.step_01 li {width: 100%; position: relative; float: left; font-size: 18px; line-height: 34px; margin-bottom: 25px;}
.page ul.step_01 li input, .page ul.step_01 li textarea {font-size: 18px;}
.page ul.step_01 li.forget_password {text-align: right; margin-bottom: 0;}
.page ul.step_01 li.forget_password a {font-size: 14px; color: #BC1125;}
.page ul.step_01 li.forget_password a i {margin-left: 5px;}
.page ul.step_01 li.login_box input.form-control {padding: 6px 12px 6px 50px; height: 40px; font-size: 16px;}
.page ul.step_01 li.login_box i {color: #999; font-size: 20px; position: absolute; top: 10px; left: 12px; border-right: 1px solid #ccc; padding-right: 5px; height: 36px; margin-top: -8px; padding-top: 8px; width: 27px;}
.page ul.step_01 li.member_sign_in_btn {background: #d9534f; text-align: center; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; margin-bottom: 15px;}
.page ul.step_01 li.member_sign_in_btn button {font-size: 16px; line-height: 40px; color: #FFF; width: 100%; text-decoration: none; padding: 0 36px;}
.page ul.step_01 li.member_sign_in_btn button i {margin-right: 5px; font-size: 20px; vertical-align: text-bottom;}
.page ul.step_01 li.member_sign_in_btn a {font-size: 16px; line-height: 40px; color: #FFF; width: 100%; text-decoration: none; padding: 0 36px;}
.page ul.step_01 li.member_sign_in_btn a i {margin-right: 5px; font-size: 20px; vertical-align: text-bottom;}
.page ul.step_01 li.facebook_sign_in_btn {background: #5274bb; text-align: center; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px;}
.page ul.step_01 li.facebook_sign_in_btn:hover {background: #3F5C99;}
.page ul.step_01 li.facebook_sign_in_btn a {font-size: 16px; line-height: 40px; color: #FFF; display: block; text-decoration: none; padding: 0 20px;}
.page ul.step_01 li.facebook_sign_in_btn a i {margin-right: 5px; font-size: 20px; vertical-align: text-bottom;}
.page ul.step_01 li.registered a {width: 100%; line-height: 40px; font-size: 16px; line-height: 25px;}
.page ul.step_01 li.registered a i {margin-right: 5px; font-size: 20px;}

.page ul.step_01 li.or_box {position: relative; border-bottom: 1px solid #DDD; height: 20px;}
.page ul.step_01 li.or_box span {text-align: center; width: 50px; position: absolute; left: 45%; height: 20px; background: rgba(0, 0, 0, 1.0);}


.AllSaints_modal #myModal200 .modal-dialog {width: 1170px;}
.AllSaints_modal #myModal200 .modal-dialog .modal-body {width: 100%; padding: 20px 30px; font-size: 20px;text-align: justify; background: rgba(0, 0, 0, 0.8);} 
.AllSaints_modal #myModal200 .modal-dialog .modal-body ol {padding: 20px; margin-left: 15px;} 
.AllSaints_modal #myModal200 .modal-dialog .modal-body ol li {list-style: decimal; line-height: 40px;}
.AllSaints_modal #myModal200 .modal-dialog .modal-footer {border-top: none;}
.AllSaints_modal #myModal200 .close {margin-top: 5px;}



.AllSaints_modal #myModal300 .modal-dialog {width: 1170px;}
.AllSaints_modal #myModal300 .modal-dialog .modal-body {width: 100%; padding: 20px 30px; font-size: 20px;text-align: justify; background: rgba(0, 0, 0, 0.8);} 
.AllSaints_modal #myModal300 .modal-dialog .modal-body h2 {text-align: center; margin: 0 auto; display: table; border-bottom: 1px solid #FFF; padding: 0 15px 10px;}
.AllSaints_modal #myModal300 .modal-dialog .modal-body h3 {text-align: center;}
.AllSaints_modal #myModal300 .modal-dialog .modal-body h3 span {color: #F00;}
.AllSaints_modal #myModal300 .modal-dialog .modal-body h4 {padding-left: 230px; margin: 30px 20px 10px;}
.AllSaints_modal #myModal300 .modal-dialog .modal-body ul {padding: 20px 175px;margin: 0 auto;} 
.AllSaints_modal #myModal300 .modal-dialog .modal-body ul li {list-style: circle;line-height: 40px;margin: 0 20px 0 30px;width: 100px;}
.AllSaints_modal #myModal300 .modal-dialog .modal-body dl.dl-horizontal {font-size: 16px;margin-top: 20px; padding: 0 85px;}
.AllSaints_modal #myModal300 .modal-dialog .modal-body dl.dl-horizontal dt {line-height:30px;}
.AllSaints_modal #myModal300 .modal-dialog .modal-body dl.dl-horizontal dd {line-height:30px;}
.AllSaints_modal #myModal300 .modal-dialog .modal-body dl.dl-horizontal dd span {color: #F00;}
.AllSaints_modal #myModal300 .modal-dialog .modal-footer {border-top: none;}
.AllSaints_modal #myModal300 .close {margin-top: 5px;}




#wizard {display: table;margin:0px auto 20px;width:100%;overflow:hidden;position:relative;}
#wizard .items{width:75%; clear:both; position:absolute; left: 30%;}
#wizard .right{float:right;}
#wizard #status {float: left; width: 25%; padding: 10px 30px 10px 0; display: table; border: none;}
#status li{color:#fff;padding:10px 30px;font-size: 16px; border-right: 3px dashed #FFF;}
#status li strong {width: 100%;font-size: 35px;padding-right: 160px;}
#status li strong p {margin: 0;}
#status li a {color: #FFF; padding: 0px 15px;}
#status li a:hover ,#status li a:focus {color: #CCC; background-color: transparent; border: 1px solid transparent;}
#status li.active {border-right: none;}
#status li.active a {border-right: none; color: #5dccba; background-color: transparent; border: 1px solid transparent;}
.input{width:240px; height:18px; margin:10px auto; line-height:20px; border:1px solid #d3d3d3; padding:2px}
.page{padding:50px 100px 20px;width:100%;float:left;}
.page h3{height:42px; font-size:16px; border-bottom:1px dotted #ccc; margin-bottom:20px; padding-bottom:5px}
.page h3 em{font-size:12px; font-weight:500; font-style:normal}
.page h2 {line-height: 50px;}
.page p{line-height:24px;}
.page p label{font-size:14px; display:block;}
.btn_nav{height:36px; line-height:36px; margin:20px auto;}
.prev,.next{width:100px; height:32px; line-height:32px; background:url(btn_bg.gif) repeat-x bottom; border:1px solid #d3d3d3; cursor:pointer}
.wizard_btn {width: 100%; display: table; text-align: center;}
.wizard_btn .btn {padding: 6px 12px; margin: 0 auto; width: 100px; font-size: 16px;}





/** MESSAGE LIST **/
.message_list {width: 100%; display: table; margin-top: -220px; position: relative;}
.message_list_title {width: 100%; height: 658px; background: url(../images/bg_02.png); position: relative; z-index: 11;}
.message_list_title h3 {font-size: 30px; text-align: center; margin: 0 auto; padding-top: 180px; position: relative; font-weight: 500;letter-spacing: 10px;}
.message_list_title h3:before {content: ''; border-top:2px solid #959595;display: block;width: 15%;margin-left: 15%;position: absolute;top: 195px;left:0;}
.message_list_title h3:after {content: ''; border-top:2px solid #959595;display: block;width: 15%;margin-right: 15%;position: absolute;top: 195px;right: 0;}
.message_list_title .dl-horizontal {font-size: 18px; margin: 30px auto 0; padding: 0 5%; line-height: 30px; letter-spacing: 3px;}
.message_list_title .dl-horizontal dt {width: 100px;}
.message_list_title .dl-horizontal dd {margin-left: 100px;}           
.message_list_title .dl-horizontal dt:nth-child(3) {margin-top: 10px;}
.message_list_title .dl-horizontal dd:nth-child(4) {margin-top: 10px;}
.message_list_title h4 {font-size: 20px; margin: 30px auto 0; padding: 0 5%; font-weight: 600; line-height: 30px; letter-spacing: 3px;}
.message_list_content {width: 100%; display: table; margin-top: -240px; background-color: #323232; height: 1000px; position: relative;}
.message_list_content .content{padding:0 0 100px 0; width:1200px; height:1500px; margin: 0 auto;} 
.message_list_content .masonry-container {/*width: 1170px;*/ margin: 0 auto; padding: 0; /*overflow: scroll;height: 1500px !important;*/ }
.message_list_content .masonry-container .item {position: relative; z-index: 12;}
.message_list_content .masonry-container .item .item_content {border: 1px solid #e5e5e5; background: #FFF;}
.message_list_content .masonry-container .item .item_content img {width: 100%; position: relative; z-index: 13;}     
.message_list_content .masonry-container .item .item_content h4 {color: #365899; font-size: 16px; font-weight: 600; display: table; background: #FFF; padding: 6px 12px; margin: -20px auto 0; position: relative; z-index: 14;}        
.message_list_content .masonry-container .item .item_content > p {font-size: 15px; color: #333; line-height: 30px; padding: 0 20px; margin: 20px auto;}
.message_list_content .masonry-container .item .item_content .interactive {background: #901f20; padding: 10px;}
.message_list_content .masonry-container .item .item_content .interactive .fb-share-button {width: 48%; display: inline-block;}
.message_list_content .masonry-container .item .item_content .interactive .fb-share-button a {color: #CCC; font-size: 15px; font-weight: 600;} 
.message_list_content .masonry-container .item .item_content .interactive .fb-share-button a i {margin-right: 5px;} 
.message_list_content .masonry-container .item .item_content .interactive .fb-share {width: 48%; display: inline-block;}
.message_list_content .masonry-container .item .item_content .interactive .fb-share a {color: #CCC; font-size: 15px; font-weight: 600;} 
.message_list_content .masonry-container .item .item_content .interactive .fb-share a i {margin-right: 5px;}
.message_list_content .masonry-container .item .item_content .interactive .want-to-know {width: 48%; display: inline-block;}  
.message_list_content .masonry-container .item .item_content .interactive .want-to-know a {color: #CCC; font-size: 15px; font-weight: 600;} 
.message_list_content .masonry-container .item .item_content .interactive .want-to-know a i {margin-right: 5px;}
.message_list_content .masonry-container .item .item_content .interactive p {margin: 0; padding: 10px 0 0; color: #AAA;}      
.message_list_content .masonry-container .item .item_content .interactive p span {font-weight: 600; color: #EEE;}
.message_list_content .masonry-container .more_icon.item {z-index: 99; width: 100%; height: 100px;text-align: center;margin-top: 0px;}
.message_list_content .masonry-container .more_icon a {position: relative; width: 60px; height: 60px; display: inline-block; border-radius: 30px; outline: none; line-height: 50px; text-align: center; color: #FFF; font-weight: bold; border: 1px solid #FFF;}
.message_list_content .masonry-container .more_icon a i {position: absolute; width: 60px; left: 0; bottom: 7px; font-size: 20px;}
.message_list_content .masonry-container .more_icon a:hover {background: #FFF; color: #666;}
.message_list_content .masonry-container .more_icon a:hover i {color: #666;}


/** ABOUT SLIDERS **/  
.about_sliders {width: 100%; display: table; margin-top: -200px; position: relative;}  
.about_sliders a {display: block;}
.about_sliders_title {width: 100%; height: 881px; background: url(../images/bg_03.png); position: relative; z-index: 14;}
.about_sliders_title h3 {font-size: 25px; color: #e3e3e3; text-align: center; margin: 0 auto 60px; padding-top: 190px; position: relative; font-weight: 600;}
.about_sliders_title h3 a {color: #e3e3e3;}
.about_sliders_title h3:before {content: ''; border-top:2px solid #e3e3e3;display: block;width: 15%;margin-left: 15%;position: absolute;top: 205px;left:0;}
.about_sliders_title h3:after {content: ''; border-top:2px solid #e3e3e3;display: block;width: 15%;margin-right: 15%;position: absolute;top: 205px;right: 0;}

.carousel-inner ul {display: table; margin: 0 auto;}
.carousel-inner ul li {display:inline-block; padding: 0 10px; width: 33%;}
.carousel-inner ul li img {width: 100%;}
.carousel-control.left {background: none; left: -100px} 
.carousel-control.right {background: none; right: -100px}

.about_sliders_bg {width: 100%; display: table; margin-top: -200px; height: 200px; position: relative; background: #292929;}

.carousel-inner .item {border: none !important;}    
.tab-pane #next_to_3 {width: 100% !important;font-size: 16px;}    
.tab-pane p {font-size: 15px !important; color: #8ac6ea !important;}
.tab-pane .fb-share a.fb_icon {width: 100%; font-size: 18px !important;}
#messages a#send {font-size: 16px;}

/** ACTIVITIES **/
.activities {width: 100%; display: table; margin-top: -200px; position: relative;}  
.activities a {display: block;}
.activities_title {width: 100%; height: 800px; background: url(../images/bg_04.png); position: relative; z-index: 14;}
.activities_title h3 {font-size: 25px; color: #e3e3e3; text-align: center; margin: 0 auto 60px; padding-top: 190px; position: relative; font-weight: 600;}
.activities_title h3:before {content: ''; border-top:2px solid #e3e3e3;display: block;width: 15%;margin-left: 15%;position: absolute;top: 205px;left:0;}
.activities_title h3:after {content: ''; border-top:2px solid #e3e3e3;display: block;width: 15%;margin-right: 15%;position: absolute;top: 205px;right: 0;}

.activities .movie_box {margin-bottom: 20px;}
.activities .img_box {margin-bottom: 20px; height: 315px; overflow:hidden;}
.activities .img_box img {width: 100%;    height: 315px;}
.activities .img_box .gallery .gallery_more {background: rgba(0, 0, 0, 0.8);line-height: 40px;height: 34px;display: table;position: absolute;top: 40%;left: 47%;padding: 2px 12px 4px;border-radius: 10px;color: #CCC;/* font-size: 14px; */}
.activities .img_box .gallery .gallery_more:hover {color: #FFF;}



/** FOOTER **/
footer {width: 100%; display: table; background: #202020;}
.footer {position: relative; line-height: 56px; padding: 5px 20px; text-align: left; clear: both; font-size: 13px; color: #707070;}
.inline-list {display: inline-block;}
.inline-list>li {float: left;}
.footer-newsletter, #footer-social {position: relative; display: inline-block; vertical-align: middle;}
#footer-social {float: left; margin-left: -9px; font-size: 17px;}  
.inline-list>li:nth-child(1) a {border-left: 1px solid #676767;}  
.inline-list>li:nth-child(1) a img {width: 27px; height: 27px; vertical-align: sub;}
#footer-social a {padding: 0 15px; color: #d2d2d2; border-right: 1px solid #676767; font-size: 20px;}
.copyright {float: right; color: #d2d2d2;}  
.copyright i {margin-right: 5px;margin-left: 5px;}

.serach_box { margin: 30px auto 0; padding: 0 15px;}

@media(min-width:1200px){
	
}

@media(min-width:992px) and (max-width:1199px){
	
}

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

}

@media(max-width:1680px) {
.slider .slogan {height: 1050px; padding-top:250px;}
.message_list_title h3 {padding-top: 220px;}
.message_list_title h3:before {top: 235px;}
.message_list_title h3:after {top: 235px;}
.message_list_content {margin-top: -205px;}
}

@media(max-width:1600px) {
.slider .slogan {height: 900px; padding-top:170px;}
.message_list_title h3 {padding-top: 200px;}
.message_list_title h3:before {top: 215px;}
.message_list_title h3:after {top: 215px;}
.actGotop {right: 20px;}  
}   

@media(max-width:1440px) {
.slider .slogan {height: 900px; padding-top:160px;}
}   

@media(max-width:1400px) {
.slider .slogan {height: 1000px; padding-top:215px;}
}   

@media(max-width:1366px) {
.slider .slogan {height: 760px; padding-top:150px;}   
.message_list_title h3 {padding-top: 220px;}
.message_list_title h3:before {top: 235px;}
.message_list_title h3:after {top: 235px;}    
.carousel-control.left {left: -90px;}
.carousel-control.right {right: -90px;} 
}     

@media(max-width:1280px) {
.slider .slogan {height:740px; padding-top:130px;}   
.carousel-control.left {left: -50px;}
.carousel-control.right {right: -50px;}   
.about_sliders_title h3 {padding-top: 210px;}
.about_sliders_title h3:before {top: 225px;}
.about_sliders_title h3:after {top: 225px;}
}   

@media(max-width:1152px) {
.slider .slogan {height: 860px; padding-top:140px;}
.slider .slogan h1 img:nth-child(1) {width: 40%;} 
.slider .slogan h1 img:nth-child(3) {width: 85%;}  
.slider .slogan h1 span:nth-last-child(1) {width: 100%; float: left;}                
.slider .slogan h2:nth-child(3) {padding-left: 60px;}
.slider .slogan h2:nth-child(4) {padding-left: 120px;}
h1, .h1 {font-size: 30px;}
h2, .h2 {font-size: 26px;}
.slider .slogan .btn_group button {margin: 10px;}   
.carousel-control.left {left: -90px;}
.carousel-control.right {right: -90px;}

.about_sliders_title h3 {padding-top: 250px;}
.about_sliders_title h3:before {top: 265px;}
.about_sliders_title h3:after {top: 265px;} 
.message_list_content .content {width: 100%;}
.AllSaints_modal #myModal300 .modal-dialog {width: inherit; margin: 30px;}
.AllSaints_modal #myModal300 .modal-dialog .modal-body ul {padding: 20px 120px;}
}    

@media(max-width:1024px) {          
.slider .slogan {height: 760px; padding-top:80px;}
.message_list_content .masonry-container {width: 1024px;}  
.message_list_content .masonry-container .item {padding: 0 10px;}
.carousel-control.left {left: 0;}
.carousel-control.right {right: 0;}  
.slider .slogan .btn_group button {font-size: 20px; border: 2px solid #FFF;} 
.AllSaints_modal #myModal100 .modal-dialog {width: inherit; margin: 30px;}  
.AllSaints_modal #myModal200 .modal-dialog {width: inherit; margin: 30px;}
.AllSaints_modal #myModal300 .modal-dialog {width: inherit; margin: 30px;}
.page {width: 680px;}
.message_list {display: block;}
.message_list_content .content {width: 100%;}
.mCSB_inside > .mCSB_container {margin: 0;}
.AllSaints_modal #myModal300 .modal-dialog .modal-body h4 {padding-left: 175px;}
.AllSaints_modal #myModal300 .modal-dialog .modal-body ul {padding: 20px 70px;}
}

@media(min-width:768px) and (max-width:991px) {
header .header {height: 50px;}
header .header a {padding: 5px 0 0 0;text-align: center;}
header .header.b2 a {padding: 10px 0 0 0;}
header .header.b2 a img {width: 40%;}
.slider {margin-top: 49px;}
.slider .slogan { width: 100%; height: 720px; padding-top: 360px; background-repeat: no-repeat;}
.slider .slogan h1 img:nth-child(1) {width: 25%; margin-bottom: 14px;}
.slider .slogan h1 img:nth-child(3) {width: 65%;}
.slider .slogan h1 span:nth-last-child(1) {width: initial; float: initial;font-size: 60px;}
.slider .slogan h2:nth-child(2) {font-size: 45px; margin: 0; text-align: right; padding-right: 100px;}
.slider .slogan h2:nth-child(3) {padding-left: 80px; margin-top: -40px;}
.slider .slogan h2:nth-child(4) {padding-left: 160px;}
.message_list {margin-top: 0;} 
.message_list_title {background-position: center -180px; height: initial; padding-bottom: 20px}
.message_list_title h3 {padding-top: 40px;}
.message_list_title h3:before {top: 55px; margin-left: 10%;}
.message_list_title h3:after {top: 55px; margin-right: 10%;}
.actGotop {right: 20px;}
.message_list_content {height:initial; margin-top: 0; padding-top: 30px;}
.message_list_content .content {height:initial; padding: 0 0 20px 0;}
.message_list_content .masonry-container {width: 100%;}
.message_list_content .masonry-container .item {width: 33.33%;}
.message_list_content .masonry-container .more_icon.item {z-index: 99; width: 100%; height: 100px;text-align: center;margin-top: 0px;}
.mCSB_inside > .mCSB_container {margin: 0;}
.about_sliders_title {height: initial;}
.about_sliders {z-index: -2; margin-top: -200px;}
.about_sliders_bg {margin-top: 0; height: 50px;}

#myModal100 #wizard {margin: 20px auto;}
#myModal100 #wizard #status {width: 100%; padding: 0;}
#myModal100 #wizard #status li {border-right: none; border-bottom: 3px dashed #FFF; padding: 0; width: 25%; height: 131px;}
#myModal100 #wizard #status li.active {border-bottom: none;} 
#myModal100 #wizard .items {width: 100%; position: initial; display: table;}
.AllSaints_modal #myModal300 .modal-dialog .modal-body h4 {padding-left: 0;}
.AllSaints_modal #myModal300 .modal-dialog .modal-body ul {padding: 20px 0px;}
.AllSaints_modal #myModal300 .modal-dialog .modal-body ul li {margin: 0 21px 0 35px;}
.AllSaints_modal #myModal300 .modal-dialog .modal-body dl.dl-horizontal {padding: 0;}
.page {width: 100%; border-bottom: 3px dashed #FFF; padding: 50px 0 20px;}
}

@media(max-width:767px) { 
header .header {height: 50px;} 
header .header a {text-align: center; padding: 15px 0 0 0;}
header .header.b2 a {text-align: center; padding: 13px 0 0 0;}
header .header a img {width: 50%;}
header .header.b2 a img {width: 35%;}  
.slider {margin-top: 50px; height: 686px; background: url(../images/banner.jpg); background-size: cover; padding-top: 0px; background-repeat: no-repeat;}   
.slider img {position: inherit; display: none;}  
.slider .container {padding: 0;} 
.slider .slogan { width: 100%; height: 720px; padding-top: 250px; background-repeat: no-repeat;}
.slider .slogan .btn_group {margin-top: 20px;}
.slider .slogan h2:nth-child(2) {font-size: 35px; margin: 20px auto;}
.slider .slogan h2:nth-child(3) {padding-left: 20px}
.slider .slogan h1 img:nth-child(1) {width: 45%;display: block; margin: 0 auto -10px;}
.slider .slogan h1 img:nth-child(3) {width: 85%;display: block; margin: 0 auto -10px;}
.message_list_title .dl-horizontal dt {float: left;}
.message_list_title .dl-horizontal dd {text-align: justify;}
.message_list_title .dl-horizontal dt:nth-child(3), .message_list_title .dl-horizontal dd:nth-child(4) {padding-top: 20px;}
h1, .h1 {font-size: 26px;}
h2, .h2 {font-size: 20px;}  
.message_list {margin-top: 0;} 
.message_list_title {background-position: center -180px; height: initial; padding-bottom: 30px;}
.message_list_title h3 {padding-top: 30px;}    
.message_list_title h3:before {border: none;}
.message_list_title h3:after {border: none;}
.message_list_title h4 {text-align: justify;}
.message_list_content .masonry-container {width: 100%;} 
.message_list_content {margin-top: 0; padding-top: 40px;}
.message_list_content .content {height: initial; padding: 0 0 40px 0;}
.about_sliders {margin-top: 0;}
.about_sliders_title {height: initial; background-position: left -200px; padding-bottom: 30px;}
.about_sliders_title h3 {padding: 30px 0; margin: 0;}
.about_sliders_title h3:before {border: none;}
.about_sliders_title h3:after {border: none;}
.about_sliders_bg {margin-top:0; height: 40px;}

.activities {margin-top: 0;}
.activities_title {height: initial; background-position: left -200px; padding-bottom: 30px;}
.activities_title h3 {padding: 30px 0; margin: 0;}
.activities_title h3:before {border: none;}
.activities_title h3:after {border: none;}
.activities .img_box {height: initial;}
.activities .img_box img {height: initial;}

.actGotop {right: 0px;}
#footer-social {float: initial; margin: 0 auto; display: table;}

.AllSaints_modal #myModal100 .modal-dialog {margin: 30px 10px;}
.AllSaints_modal #myModal100 .close {margin-top: 0;}
.AllSaints_modal .modal-header h4 {width: 100%; float: left; margin: 20px 0 0;}
.AllSaints_modal #myModal100 .modal-dialog .modal-body {padding: 20px;font-size: 18px;}
                                                                                         
.AllSaints_modal #myModal200 .modal-dialog .modal-body {padding: 10px; display: block;}
.AllSaints_modal #myModal300 .modal-dialog .modal-body {padding: 10px; display: block;}
.AllSaints_modal #myModal300 .modal-dialog .modal-body h4 {padding: 0; line-height: 30px;}
.AllSaints_modal #myModal300 .modal-dialog .modal-body ul {padding: 0;}
.AllSaints_modal #myModal300 .modal-dialog .modal-body ul li {margin: 0 14px 0 35px;}
.AllSaints_modal #myModal300 .modal-dialog .modal-body dl.dl-horizontal {font-size: 18px; padding: 0 10px;}
.AllSaints_modal #myModal300 .modal-dialog .modal-body dl.dl-horizontal dt {margin-top: 15px;}
#myModal100 #wizard {margin: 20px auto;}
#myModal100 #wizard #status {width: 100%; padding: 0; border-bottom: 3px dashed #FFF;}
#myModal100 #wizard #status li {border: none; padding: 10px 0; width: 100%; height: initial;}
#myModal100 #wizard #status li strong {width: initial; font-size: 16px; float: left; padding: 0 10px 0 0;}     
#myModal100 #wizard #status li p {float: left; font-size: 16px; margin: 0 10px 0 0; padding: 0px;}
#myModal100 #wizard #status li.active {border-bottom: none;} 
#myModal100 #wizard .items {width: 100%; position: initial; display: table;}
.page {width: 100%; border-bottom: 3px dashed #FFF; padding: 20px 0 20px;}
.fb_iframe_widget_fluid span, .fb_iframe_widget iframe {width: 100% !important;}
.message_list_content .masonry-container .item {width: 50%;}
.message_list_content .masonry-container .item .item_content .interactive .want-to-know,
.message_list_content .masonry-container .item .item_content .interactive .fb-share {width: 100%;} 
.tab-pane #next_to_3 {width: 100% !important;}    
.tab-pane p {font-size: 15px !important; color: #8ac6ea !important;}
.tab-pane .fb-share a.fb_icon {width: 100%; font-size: 18px !important;}
}

@media(max-width:480px) {
.serach_box .form-group #search_bar {margin-bottom: 20px;}

}

@media(max-width:375px) {
h1, .h1 {font-size: 23px;}
.slider .slogan {padding-top: 210px;}
.slider .slogan h1 span:nth-last-child(1) {font-size: 42px; margin-bottom: 10px;}

.slider .slogan h2:nth-child(4) {padding-left:60px;}
.slider .slogan .btn_group button {padding: 10px 20px;}
.AllSaints_modal #myModal200 .modal-dialog {margin: 15px;}
.AllSaints_modal #myModal200 .modal-dialog .modal-body {padding: 10px; display: block;}
.AllSaints_modal #myModal300 .modal-dialog {margin: 15px;}
.AllSaints_modal #myModal300 .modal-dialog .modal-body {padding: 10px; display: block;}
.AllSaints_modal #myModal300 .modal-dialog .modal-body ul li {margin: 0 14px 0 32px;}
.AllSaints_modal .modal-header h4 {font-size:20px} 
.tab-pane #next_to_3 {width: 100% !important;}    
.tab-pane p {font-size: 15px !important; color: #8ac6ea !important;}  
.tab-pane .fb-share a.fb_icon {width: 100%; font-size: 18px !important;}
}
@media(max-width:360px) {
.AllSaints_modal #myModal300 .modal-dialog .modal-body ul li {margin: 0 25px 0 27px;font-size: 20px;width: 100px;}
.AllSaints_modal #myModal300 .modal-dialog .modal-body h3 {font-size: 22px;}
.AllSaints_modal #myModal300 .modal-dialog .modal-body dl.dl-horizontal {font-size: 16px;}
}

@media(max-width:320px) {  
.slider {height: 540px;}
.message_list_title h3 {font-size: 20px;}  
.slider .slogan {padding-top: 140px;}         
.slider .slogan h2:nth-child(3) {font-size: 20px;}  
.slider .slogan h2:nth-child(4) {font-size: 20px;}
.slider .slogan .btn_group {margin-top: 15px;}
.slider .slogan .btn_group button {padding: 10px; font-size: 16px;}
.AllSaints_modal .modal-header h4 {font-size:18px}
.footer {padding: 5px 15px;}
.tab-pane #next_to_3 {width: 100% !important;}    
.tab-pane p {font-size: 15px !important; color: #8ac6ea !important;}
.tab-pane .fb-share a.fb_icon {width: 100%; font-size: 18px !important;}
.AllSaints_modal #myModal300 .modal-dialog .modal-body ul li {margin: 0px 20px 0 32px;font-size: 16px;width: 80px;}
.AllSaints_modal #myModal300 .modal-dialog .modal-body h3 {text-align: center; font-size: 20px;}
.AllSaints_modal #myModal300 .modal-dialog .modal-body dl.dl-horizontal {font-size: 16px;}
}
.more_icon {z-index: 99; width: 100%; height: 100px;text-align: center;margin-top: 0px;}
.more_icon a {position: relative; top: -80px; width: 60px; height: 60px; display: inline-block; border-radius: 30px; outline: none; line-height: 50px; text-align: center; color: #FFF; font-weight: bold; border: 1px solid #FFF;}
.more_icon a i {position: absolute; width: 60px; left: 0; bottom: 7px; font-size: 20px;}
.more_icon a:hover {background: #FFF; color: #666;}
.more_icon a:hover i {color: #666;}
.mCSB_inside > .mCSB_container {padding-bottom: 260px;}