﻿
/* --- Slideshow Containers --- */
#fpss-outer-container {/*margin:5px auto;*/overflow:hidden;width:640px;height:320px;z-Index:1;}
/* This element controls the slideshow spacing and border */
#fpss-container {position:relative;margin:0;padding:0;clear:both;width:640px;z-Index:2;}
#fpss-slider {float:left;background:none;overflow:hidden;width:440px;height:320px;z-Index:3;}
#slide-loading {background:#000 url(http://www.cityzens.fr/style/home/loading_black.gif) no-repeat center center;width:450px;height:320px;}
#slide-wrapper {display:none;width:460px;height:320px;z-Index:4;}
#slide-wrapper #slide-outer {height:320px;}
#slide-wrapper #slide-outer .slide {right:180px;width:460px;height:320px;}

/* --- Slideshow Block --- */
#slide-wrapper #slide-outer .slide {position:absolute;overflow:hidden;}
#slide-wrapper #slide-outer .slide .slide-inner {position:relative;margin:0;color:#fff;overflow:hidden;background:#3a3a3a;text-align:left;z-index:5;height:320px;}
#slide-wrapper #slide-outer .slide .slide-inner a.fpss_img span span span {background:none;z-Index:6;}

/* --- Content --- */
.fpss-introtext {width: 92%;height:auto !important;height:100%;font-size: 12px;margin:0;padding:0;position:absolute;top: 180px;bottom: 0px;z-Index:8;left:0px;} /* "left" property set in the php file, FF bug when using percentages */
.fpss-introtext .slidetext {margin:0;padding:0;}
.bgslidetext{background:#000000 none repeat scroll 0 0;
left:0;
position:absolute;
top: 180px;
-moz-opacity:0.5;
opacity: 0.5;
filter:alpha(opacity=50);
width: 100%;
height: 140px;
_width:45%;
_height:100%;
z-index:7;}

/* --- Navigation Buttons --- */
#pseudobox {display:none;}
.ul_container{margin-left:20px}
#navi-outer {float:left;margin:0 0 0 -20px;padding:0;/*background:#3a3a3a;*/overflow:hidden;position:relative;z-Index:9;height:320px;width:220px;}
#navi-outer ul {margin:0 0 -1px 0;padding:0;list-style:none;background:none;text-align:left;}
#navi-outer li {display:inline;padding:0;margin:0;border:none;height:80px;list-style:none;background:none;}
#navi-outer li.noimages {display:none;}
#navi-outer li a {display:block;padding:6px 6px;margin:0;text-decoration:none;font-size:11px;color:#fff;background: -webkit-linear-gradient(top, #FBFBFB, #E5E5E5);
border-radius: 8px;border:1px solid #bbb;height:66px;overflow:hidden;}
#navi-outer li a:hover,
#navi-outer li a.navi-active {display:block;padding:6px 6px;margin:0;text-decoration:none;font-size:11px;color:#000;background: -webkit-linear-gradient(top, #EB7B97, #DF2957);
border-radius: 8px;border:1px solid #DF2957;height:66px;overflow:hidden;margin-left:-20px;padding-left:26px;}
#navi-outer li a span.navbar-img,
#navi-outer li a:hover span.navbar-img,
#navi-outer li a.navi-active span.navbar-img {display:block;width:65px;height:40px;overflow:hidden;border:1px solid #232323;margin:4px 4px 0 0;padding:0;float:left;}
#navi-outer li a span.navbar-img img {opacity:0.6;-moz-opacity:0.6;filter:alpha(opacity=60);width:65px;height:auto;}
#navi-outer li a:hover span.navbar-img img,
#navi-outer li a.navi-active span.navbar-img img {opacity:1.0;-moz-opacity:1.0;filter:alpha(opacity=100);width:65px;height:auto;}
#navi-outer li a span.navbar-key {display:none;}
#navi-outer li a span.navbar-title {width: 114px;font-size: 12px;display:block;margin:0;padding:0;color:#1E1D1E;line-height:13px;}
#navi-outer li a:hover span.navbar-title, 
#navi-outer li a.navi-active span.navbar-title{font-size: 12px;display:block;margin:0;padding:0;color:white;line-height:13px;}

#navi-outer li a span.navbar-tagline {display:block;width:170px;font-size:11px;font-weight:normal;line-height:11px;color:#5f5f5f;margin:0;padding:0;}
#navi-outer li a:hover span.navbar-tagline,
#navi-outer li a.navi-active span.navbar-tagline {font-weight:bold;color:white;}
span.navbar-clr {display:block;clear:both;}

/* --- Notice: Add custom text styling here to overwrite your template's CSS styles! --- */
.fpss-introtext .slidetext h2 {font-size:24px;line-height:24px;margin:0;padding:10px 8px 2px 8px;color:#fff;}
.fpss-introtext .slidetext h2 a {font-size:24px;margin:0;padding:0;color:#fff;text-decoration:none}
.fpss-introtext .slidetext h2 a:hover {font-family: 'itc-franklin-gothic-demi',Arial,sans-serif;font-size:24px;margin:0;padding:0;color:#E23A63;text-decoration:none}
.fpss-introtext .slidetext h3 {font-size:11px;margin:0 8px;padding:0;color:#bbb;font-weight:normal;}
.fpss-introtext .slidetext h4 {font-size:11px;margin:0 0 4px 0;padding:0;display:none;}
.fpss-introtext .slidetext p {margin: 0 8px 0 8px;padding: 3px 0;background:url(/style/home/dotted.gif) repeat-x bottom;color:#fff;}
.fpss-introtext .slidetext a.readon {font-weight:bold;position:absolute;left: 2px;line-height:24px;bottom: 2px;width:100px;margin:0;padding:0px 0 0px 30px;background:url(/style/home/readmoreout.png) no-repeat;_background:url(/style/home/readmoreout.gif) no-repeat;color:#fff;border:none;text-decoration:none}
.fpss-introtext .slidetext a.readon:hover {font-weight:bold;position:absolute;left:2px;line-height:24px;bottom:2px;width:100px;margin:0;padding:0px 0 0px 30px;background:url(/style/home/readmoreon.png) no-repeat;_background:url(/style/home/readmoreon.gif) no-repeat;color:#fff;border:none;text-decoration:none}

/* --- Generic Styling (highly recommended) --- */
a:active,
a:focus {outline:expression(hideFocus='true');outline:0;}
#fpss-container img {border:none;}
.fpss-introtext .slidetext img,
.fpss-introtext .slidetext p img {display:none;} /* this will hide images inside the introtext */
.fpss-clr {clear:both;height:0;line-height:0;}

/* --- End of stylesheet --- */