@charset "utf-8";
/* CSS Document */

.cb-static,
.cb-static:after { 
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    z-index: 0; 
}
.cb-static:after { 
    content: '';
	background: transparent url(../images/pattern.png) repeat top left;
	 background-size: cover; background-position: 50% 50%; background-repeat: none;
}
figcaption {
    text-align: center;
}

.content { 
 	overflow:auto;
/*border:1px solid blue; */
	z-index: 1000;
    position: absolute;
    top: 230px;
	height:520px; 
    left: 0px;
    width: 100%;
	background-color:#FFF ;
    opacity: .9;
    color: #000;
text-align:left; 
	-webkit-animation: titleAnimation 12s linear 1 0s;
    -moz-animation: titleAnimation 12s linear 1 0s;
    -o-animation: titleAnimation 12s linear 1 0s;
    -ms-animation: titleAnimation 12s linear 1 0s;
    animation: titleAnimation 12s linear 1 0s;
}

/*IE8only */
.content {height:400px\9; top:170px\9;}
.container h1{ font-size:24px\9;}

/*-----*/


.content hr {width:300px;  }
.content img{width:85%; margin:10px 100px 0px 100px ;}
.content img.mainpages, .content figure.mainpages{ float:left;  margin:10px 10px 0px 80px;  width:300px;}
.content ul li figure.mainpages{margin: 10px 10px 15px 0px;}
.content figure img{width:100%; margin: 0px ;}
.content div p.breadcrumbs { text-align:right;}
.content div p.breadcrumbs a {color:black; text-decoration: none; }
.content h3 { 
    font-family: 'BebasNeueRegular', 'Arial Narrow', Arial, sans-serif;
    font-size: 50px;
    margin:30px 100px 10px 95px;
   
}
.content h4 { 
    font-family: Constantia, Palatino, "Palatino Linotype", "Palatino LT STD", Georgia, serif;
    font-size: 30px;
    margin:0px 100px 0px 100px;
	max-width:1000px;
  
}
.content h5 { 
    font-family: Constantia, Palatino, "Palatino Linotype", "Palatino LT STD", Georgia, serif;
    font-size: 20px;
    margin:0px 100px 0px 100px;
  
}
.content p { 
    font-family: 'BebasNeueRegular', 'Arial Narrow', Arial, sans-serif;
    font-size: 16px;
	letterspacing:1px; 
	margin:0px 100px 10px 100px;
    padding: 0;
	line-height:24px;
	max-width:1000px;

}

.content a { color:#0099CC; text-decoration:underline;}

.content p.intro { 
    font-family: 'BebasNeueRegular', 'Arial Narrow', Arial, sans-serif;
    font-size: 18px;
    padding: 0;
    line-height:24px; 
}
.content ul {
	margin: 0px 100px 0px 100px;
}
.content ul.style1 { 
    font-family: Constantia, Palatino, "Palatino Linotype", "Palatino LT STD", Georgia, serif;
    font-size: 17px;
	padding:20px 0px 0px 0px;
	color: #0099CC;
	clear:both; 
	max-width:1000px;
} 
.content ul.style1 li {
	text-align:left;  
	border:3px dotted #0099CC;
	float:left; 
	width:20%; 
	margin:10px 5px 0px 0px; 
	padding:10px 20px 30px 20px;  
	background-color:#FFF;
}
	
.content ul.style1 li.narrow { 
	text-align:center;
	width:100px; 
	height:60px; 
}
.content ul.style1 li.wide {
	width:60%; 
}

.content ul li em {  }
.content ul li img {margin:0px 0px 0px 0px; padding:0px; width:100%;  }

.content div.tiny {margin-bottom:5px; font-size:70%; line-height:90% !important;}

.clearfix:after{
	content: '';
	display: table;
	clear: both;
}
.content .alignleft{float:left; margin: 0px 10px 10px 100px;}
.content .alignright{float:right; margin: 0px 100px 10px 10px;}
.content .wid_350{width: 350px;}

/* Animation for the slideshow images */
@-webkit-keyframes imageAnimation { 
    0% { opacity: 0;
    -webkit-animation-timing-function: ease-in; }
    8% { opacity: 1;
         -webkit-animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 1 }
    100% { opacity: 1 }
}
@-moz-keyframes imageAnimation { 
    0% { opacity: 0; -moz-animation-timing-function: ease-in; }
    8% { opacity: 1;  -moz-animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 1}
    100% { opacity: 1 }
}
@-o-keyframes imageAnimation { 
    0% { opacity: 0; -o-animation-timing-function: ease-in; }
    8% { opacity: 1; -o-animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 1 }
    100% { opacity: 1 }
}
@-ms-keyframes imageAnimation { 
    0% { opacity: 0;  -ms-animation-timing-function: ease-in; }
    8% { opacity: 1;  -ms-animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 1 }
    100% { opacity: 1 }
}
@keyframes imageAnimation { 
    0% { opacity: 0;  animation-timing-function: ease-in; }
    8% { opacity: 1;   animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 0 }
    100% { opacity: 0 }
}
/* Animation for the title */
@-webkit-keyframes titleAnimation { 
    0% { opacity: 0 }
    8% { opacity: 1 }
    17% { opacity: 1 }
    19% { opacity: 1 }
    100% { opacity: 1 }
}
/**/
@-moz-keyframes titleAnimation { 
    0% { opacity: 0 }
    8% { opacity: 1 }
    17% { opacity: 1 }
    19% { opacity: 1 }
    100% { opacity: 1 }
}
/**/
@-o-keyframes titleAnimation { 
    0% { opacity: 0 }
    8% { opacity: 1 }
    17% { opacity: 1 }
    19% { opacity: 1 }
    100% { opacity: 1 }
}
/**/
@-ms-keyframes titleAnimation { 
    0% { opacity: 0 }
    8% { opacity: 1 }
    17% { opacity: 1 }
    19% { opacity: 1 }
    100% { opacity: 1 }
}
@keyframes titleAnimation { 
    0% { opacity: 0 }
    8% { opacity: 1 }
    17% { opacity: 1 }
    19% { opacity: 1 }
    100% { opacity:1 }
}
/* Show at least something when animations not supported */
 .cb-static, .content li span{
	background-image: url(../images/backgrounds/city.jpg) ;
	opacity: 1;
height:10px;
}