﻿/*Home*/

#home-banner { background-color:#f5f9fb;}
#home-banner .carousel-inner .banner-img { width:100%; height:390px; background-position: 50% 50%; }
#home-banner .carousel-inner > .item > a > img, .carousel-inner > .item > img { margin: 0 auto; }
#home-banner .carousel-inner > .item .carousel-caption { width:32%; left:auto; right:10%; top:20px; bottom:auto; text-align:left; text-shadow:none; color:#646464; }
#home-banner .carousel-inner > .item .carousel-caption h1 { max-height:178px; font-size:45px; line-height:43px; text-transform:uppercase; text-overflow:ellipsis; word-wrap:break-word; word-break:keep-all; overflow:hidden; }
#home-banner .carousel-inner > .item .carousel-caption p { color:#646464; margin-bottom:25px; font-size:16px;}
#home-banner .carousel-indicators li { width: 12px; height: 12px; background: #646464; border: 1px solid #8d8d8d; word-wrap:break-word; word-break:keep-all; overflow:hidden;}
.ie #home-banner .carousel-inner > .item .carousel-caption {top:0; right:12%;}
#home-banner .carousel-indicators li:hover, .carousel-indicators .active { margin: 1px; background: #fec135 !important; border: 1px solid #fec135 !important; }

#home-banner .carousel-control { color:#646464; font-size:50px; text-shadow:none; text-align:center; }
#home-banner .carousel-control:hover{ color:#1379c0; }
#home-banner .carousel-control > i { position:absolute; top:45%; color:#646464; font-size:60px; margin:0 auto; -webkit-transition: 0.4s; -moz-transition: 0.4s; transition: 0.4s;}
#home-banner .carousel-control:hover > i { position:absolute; top:45%; color:#1379c0; }
/* #home-banner .carousel-control.right { background-image: linear-gradient(to right,rgba(255,255,255,.0001) 0,rgba(255,255,255,.3) 100%); */
/* } */
/* #home-banner .carousel-control.left { background-repeat: repeat-x; */
	/* background-image: linear-gradient(to right,rgba(255,255,255,.3) 0,rgba(255,255,255,.0001) 100%); */
/* } */
	#home-banner .carousel-control.right { background-image: -webkit-linear-gradient(left,rgba(255,255,255,.0001) 0,rgba(255,255,255,.3) 100%); background-image: -o-linear-gradient(left,rgba(255,255,255,.0001) 0,rgba(255,255,255,.3) 100%); background-image: -webkit-gradient(linear,left top,right top,from(rgba(255,255,255,.0001)),to(rgba(0,0,0,.3))); background-image: linear-gradient(to right,rgba(255,255,255,.0001) 0,rgba(255,255,255,.3) 100%);  filter:progid:DXImag‌​eTransform.Microsoft.‌​gradient(enabled='fal‌​se') ; }
#home-banner .carousel-control.left { background-image: -webkit-linear-gradient(left,rgba(255,255,255,.3) 0,rgba(255,255,255,.0001) 100%); background-image: -o-linear-gradient(left,rgba(255,255,255,.3) 0,rgba(255,255,255,.0001) 100%); background-image: -webkit-gradient(linear,left top,right top,from(rgba(255,255,255,.3)),to(rgba(255,255,255,.0001))); background-image: linear-gradient(to right,rgba(255,255,255,.3) 0,rgba(255,255,255,.0001) 100%);  filter:progid:DXImag‌​eTransform.Microsoft.‌​gradient(enabled='fal‌​se') ; background-repeat: repeat-x; }
.ie #home-banner .carousel-control .fa-angle-left { right:80px; }
.ie #home-banner .carousel-control .fa-angle-right { left:80px; }


@media only screen and (max-width : 992px){
    #home-banner .carousel-inner > .item .carousel-caption { width:36%;} 
    #home-banner .carousel-inner > .item .carousel-caption { top:0;}
    #home-banner .carousel-inner > .item .carousel-caption h1 { height:168px; font-size:43px; line-height:41px;}
    #home-banner .carousel-inner > .item .carousel-caption p { color:#646464; margin-bottom:20px; font-size:15px;}
}

@media only screen and (max-width : 767px){
    #home-banner .carousel-indicators li { display:none; }
    #home-banner .carousel-inner .banner-img { height:300px; background-position: 25% 50%; }
    #home-banner .carousel-inner > .item .carousel-caption { width:100%; left:0; right:0; bottom:0; top:auto !important; height:35px; padding:5px; background:rgba(19,121,192,.95)}
    #home-banner .carousel-inner > .item .carousel-caption h1 { display:block; height:10px; font-size:10px; line-height:10px; margin:0; color:#fff; overflow:hidden;  }
    #home-banner .carousel-inner > .item .carousel-caption p { display:none; }
    #home-banner .carousel-control { bottom:90px; }
    #home-banner .carousel-control > i, #home-banner .carousel-control:hover > i{ top:40%; font-size:50px; }
    #home-banner a.yellowbtn { background:none; padding:0; color:#fec135; font-weight:bold; letter-spacing:0; text-decoration:underline; }
    #home-banner a.yellowbtn:hover { color:#eca90e; }
    background-size: 250%;
    background-repeat: no-repeat;
}

#action-menu { background: #1379c0;}
#action-menu .container{ width:970px; }
#action-menu ul { padding:0; list-style:none; margin-bottom:0; }
#action-menu ul li { text-align:center; padding-right:0}
#action-menu a { width:100%; }
#action-menu ul li:before { content:' '; position:absolute; left:7px; width:1px; top:10px; bottom:10px; float:left; opacity:0.2; border-left:1px dashed white;}
#action-menu ul li:first-child:before { display:none}
#action-menu ul li:first-child a{ height:85px; margin-top:-10px; color:black; background-color:#fec135;}
#action-menu ul li:first-child a:hover { margin-top:-25px; height:100px; background:#eca90e; }
#action-menu ul li a { display:inline-block; padding:0 25px; margin:0 auto; float:left; color: white; height: 75px; font-size: 18px; font-weight:bold; line-height:20px; letter-spacing:2px; text-align: left; text-transform: uppercase; text-decoration:none; -webkit-transition: 0.4s; -moz-transition: 0.4s; transition: 0.4s; }
#action-menu ul li a:hover { background:#0c5fad;  }
#action-menu ul li a .innertxt { display:table; width:75%; height:100%; float:left; padding:0;}

#action-menu ul li a .innertxt span:before { content:' '; position:absolute; top:10px; left:37px; width:40px; height:4px; background:#fec135;  }
#action-menu ul li a .innertxt span { display:table-cell; vertical-align:middle; padding-top:10px;}
#action-menu ul li:first-child a .innertxt { padding-top:0;}
#action-menu ul li:first-child a .innertxt span:before { background:none;  }
#action-menu ul li:first-child a .innertxt span { display:inline-block; padding-top:38px;}

#action-menu ul li a .innericon { display:block; max-width:25%; margin-top:10px; float:right;}
#action-menu ul li:first-child .innericon { margin-top:20px; }
#action-menu ul li a .twolines { padding-top:5px }

@media only screen and (max-width : 992px) {
    #action-menu .container{ width:auto; }
    #action-menu a{ padding:0}
    #action-menu ul li a { padding:0 20px; font-size:18px; line-height:18px; letter-spacing:1px;  }
    #action-menu ul li a .innericon { margin-right:0;  }
}

@media only screen and (max-width : 767px) {
    #action-menu { background:none;}
    #action-menu ul li{ padding-left:0;}
    #action-menu ul li:first-child a{ margin-top:0; color:white; background-color:transparent;}
    #action-menu ul li:first-child a:hover { margin-top:0; background:#0c5fad; height:50px; }
    #action-menu ul li a, #action-menu ul li:first-child a {height:50px; border-bottom:1px solid #cdcdcd;}
    #action-menu ul li a:hover, #action-menu ul li:first-child a:hover { background:#f0f0f0;}
    #action-menu ul li a .innertxt span, #action-menu ul li:first-child a .innertxt span { display:table-cell; padding-top:0; font-size:14px; color:#333;}
    #action-menu ul li a .innertxt span:before { content:'\f138'; width:22px; color:#fec135; font-size:20px; font-family: FontAwesome; top:auto; left:auto; right:15px; opacity:1; background:none;  }
    #action-menu ul li:first-child .innericon, #action-menu ul li a .innericon { width:40px; margin-top:12px ; float:left; }
}

#hightlight-section { padding-top: 50px; }
#hightlight-section .hlt-inner p{ width: 100%; height:160px; padding:15px; margin-bottom:0px; border-top:4px solid #cdcdcd; background: #f2f2f2; }
#hightlight-section .hlt-inner p:after{ content:'...' }
#hightlight-section .hlt-inner a{ display:block; padding:5px 15px; margin-bottom:20px; color:#1d1d1d; text-decoration:none; background: #cdcdcd;}
#hightlight-section .hlt-inner a:hover{ color:#fff; background: #1379c0;}
#event-section ul li > a:after { content:' \00bb '; color:#fff;  font-size:18px; font-weight:bold; line-height:0; -webkit-transition: 0.4s; -moz-transition: 0.4s; transition: 0.4s;}
#event-section ul li > a:hover:after { content:' \00bb '; color:#337ab7; }
#hightlight-section .hlt-inner img{ width:100%}

#side-banners { padding-top:80px; text-align:center}
#side-banners .banner { display:table; position:relative; width:100%; max-width:260px; height:180px; padding:30px 10px 10px; }
#side-banners .banner-1 { border:3px solid #d2efff; color:#fff; background:url(../img/tn-bg_1.jpg) no-repeat 50%;}
#side-banners .banner-2 { border:3px solid #cdcdcd; color:#445a69; background:url(../img/tn-bg_2.jpg) no-repeat 50%;}
#side-banners .banner-3 { padding-bottom:40px; }
#side-banners .banner-3 p{ font-size:13px !important; line-height:16px !important;  }
#side-banners .banner-3 img { position:relative;}
#side-banners .banner-3 img#caringmag{ margin-bottom:20px}
#side-banners .banner-3 .blue-rectangle { position:absolute; top:20%; bottom:10px; left:0; right:0; /*width:100%;*/ border:5px solid #1379c0; z-index:-1}
#side-banners .banner p { font-size:21px; font-weight:bold; line-height:23px; letter-spacing:2px; }

@media only screen and (max-width : 992px ){
    #hightlight-section .hlt-inner p { height:210px; padding:5px; overflow:hidden; }
}

@media only screen and (max-width : 767px) {
    #hightlight-section .hlt-inner p { height:170px; padding:5px; overflow:hidden; }
    #side-banners .banner { width:auto; max-width:260px; }
    #side-banners .banner-1, #side-banners .banner-2 {float:left; width:50%;}
    #side-banners .banner-3 { width:100%; max-width:none; padding-bottom:30px; }
    #side-banners .banner-3 img#caringmag{ float:left; margin-bottom:0px}
    #side-banners .banner-3 img#caringlogo{ margin-top:40px}
}

@media only screen and (max-width : 478px) {
    #side-banners .banner-3 img#caringmag{ float:none; margin:0 auto;}
    #side-banners .banner-3 img#caringlogo{ display:block; margin:20px auto 0;}
}

#event-section { padding-top: 20px; }
#event-section ul { list-style:none; padding-left:0; }
#event-section ul li { display:inline-block; width:100%; border-bottom: 1px dotted gray; padding: 8px 5px 8px 30px; background: url(../img/icons/double_slash.png) 0px 11px no-repeat; }
#event-section ul li > b { display:inline-block; float:left; width:13%; padding-right: 20px; }
#event-section ul li > a { display:inline-block; width:85%; cursor:pointer; text-decoration:none; -webkit-transition: 0.4s; -moz-transition: 0.4s; transition: 0.4s; }
#event-section ul li > a:after { content:' \00bb '; color:#fff;  font-size:18px; font-weight:bold; line-height:0; -webkit-transition: 0.4s; -moz-transition: 0.4s; transition: 0.4s;}
#event-section ul li > a:hover:after { content:' \00bb '; color:#337ab7; }

@media only screen and (max-width : 991px) {
    #event-section ul li > b { display:inline-block; float:left; width:25%; padding-right: 20px; }
    #event-section ul li > a { display:inline-block; width:75%; }
}
@media only screen and (max-width : 767px) {
    #event-section ul li > b { display:block; width:auto; }
    #event-section ul li > a { width:100%; }
}

@media only screen and (max-width: 480px) {
 .ms-webpart-zone, .ms-webpart-cell-vertical, .ms-webpart-chrome-vertical {
     display: block !important;
     max-width: 100% !important;
     background-size: 325%;
     background-repeat: no-repeat;
 }
 }
