@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,700);

/* CSS Document */
/* responsive-images */

@-webkit-keyframes blinker { from {opacity: 1.0;}
  to {opacity: 0.0;}
}
.blink{	text-decoration: blink;	-webkit-animation-name: blinker; -webkit-animation-duration: 0.6s;	-webkit-animation-iteration-count:infinite;
	-webkit-animation-timing-function:ease-in-out; -webkit-animation-direction: alternate;}
img.inner { max-width: 400px; display: block; margin-left: 2px; margin-right: auto;}
img.news { max-width: 120px; padding: 1px; border: 1px solid #DEDEDE; margin-right: 24px;}
img.news-in { max-width: 100%; min-width: 120px; padding: 1px; border: 1px solid #DEDEDE; margin: 0;}
.hr-news { display: block; height: 1px; border: 0; border-top: dotted 1px #579F29; margin: 8px 0 4px 8px; width: 100%;}


.bottom-mblock { padding: 6px 8px; text-align:center; font-size:.85em; margin: 0; color: #fff;}

#bottom {float:left; width:100%; display: block; margin: 0 auto;    background-color: #000000;}
#bottom-inner {  width:92%; display: table; margin: 0 auto;  padding: 18px 0  4px 0;}


#bottom-middle1 {float:left; width:25%; padding: 4px 0 0 24px;  }
#bottom-middle2 {float:left; width:25%; padding: 4px 0 0 24px;  }
#bottom-middle3 {float:left; width:25%; padding: 4px 0 0 24px;}
#bottom-right {float:right;width:25%; padding: 4px 0 0 24px;  text-align:center; color: white;}

ul.foot { padding: 2px; list-style-position: outside; list-style-image: url('../images/foot-bullet.gif'); text-align: left; font-size:.9em;}
ul.foot li { padding: 0; margin: 4px;}
ul.foot li a{ color: #fff; text-decoration: none; }
ul.foot li a:hover{ text-decoration: none; color:silver; }
ul.foot li:last-child { border-bottom: 0;}
.hr-foot { display: block; height: 1px; border: 0; border-top: groove 2px #424242; margin: 4px 4px 4px 12px; width: 98%;}
div.gallery {
  margin: 9px;
  border: 1px solid #fff;
  float: left;
  text-align: center;
  padding: 24px 0 0 0;
  width: 218px; height: 160px;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

div.gallery:hover {
  border: 1px solid #ccc;
}

div.gallery img {
  height: auto;
}

div.desc {
  padding: 12px;
  text-align: center;
}
div.gallery-side {
  margin: 9px 9px 9px 24px;
  border: 1px solid #fff;
  text-align: center;
  padding: 4px 0;
  width: 228px; height: 90px;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

div.gallery-side:hover {
  border: 1px solid #ccc;
}

div.gallery-side img {
  height: auto;
}
.gap{width:1068px; overflow:auto; padding: 12px 0; }

.metro {
  display: inline-block;
  padding: 6px 8px;
  margin: 0;
  background: #fff;
  text-decoration: none; border-radius: 4px; width: 140px; border: 1px solid #ccc;
}
.metro:hover { background: #92AAC1; text-decoration:none; color:#FFFFFF;}
#col-container{max-width:100%; margin: 12px 0px 0px auto; border: 0px solid #AEADAD;}
img.google
{
	display:inline-block;
	max-width: 100%;
	padding: 4px;
	border: 1px solid #AAA9A9;
	margin: 24px 4px 4px 0;
}
.col-xl{max-width:100%; margin: auto; border: 0px solid #AEADAD;}
.col-ml{float:left; width:98%; overflow:auto; padding: 0 14px 18px 14px; height:auto; overflow-x:hidden; margin: 12px 0 0 0; border: 0px solid #F7E5FD; overflow-y:hidden; overflow-x:hidden;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);  min-height:484px;}
#col-left{float:left; width:65%; overflow:auto; padding: 0 14px 18px 14px; height:auto; overflow-x:hidden; margin: 12px 0 0 0; border: 0px solid #F7E5FD; overflow-y:hidden; overflow-x:hidden;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);  min-height:400px;}
#col-right{float:right; width:28%; overflow:auto;  overflow-y:hidden; overflow-x:hidden; margin: 12px 0 12px 12px; padding: 0 20px; min-height:417px;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);}

#gallery{width:96%; background-color: #F2F2F2; overflow:auto; overflow-y:hidden; overflow-x:hidden; margin: 24px 0 0 0;  border: 1px solid #B6B7B8; padding: 1px 4px 1px 5px; height: 277px; }


hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px dotted #AEADAD;
    margin: .2em 0 .6em 0;
    padding: 0; 
}


b#socialicons img{ /* 1st set of icons. Rotate them 360deg onmouseover and out */
-moz-transition: all 0.8s ease-in-out;
-webkit-transition: all 0.8s ease-in-out;
-o-transition: all 0.8s ease-in-out;
-ms-transition: all 0.8s ease-in-out;
	transition: all 0.8s ease-in-out;
	padding: 0 2px;
}

b#socialicons img:hover{
-moz-transform: rotate(360deg);
-webkit-transform: rotate(360deg);
-o-transform: rotate(360deg);
-ms-transform: rotate(360deg);
transform: rotate(360deg);
	padding: 0 2px;

}


img {
    max-width: 100%;
    height: auto;
}

html { margin: 0 0 0 0; padding: 0 0 0 0;}

body {
	font-family: 'Open Sans', Helvetica, sans-serif;
	font-size: 15px;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	line-height: auto;
	background-color: #fff;
}

h1, h2, h3, h4, h5, h6 { font-family: Arial, Helvetica, sans-serif;	margin-top: 0px;}
h1 { font-size: 1.2em; color: #003366; padding: 15px 0 0 0;}
h2 { font-size: 1.1em; color: #003366; padding: 10px 0 0 0;}
h3 { font-size: 1.1em; color: #003366; padding: 0;}
h4 { font-size: 0.8em; }
h5 { font-size: 0.8em; }
h6 { font-size: 0.8em; }
.ex {  font-size: 13px;   TEXT-DECORATION: none;}
.ex:hover {  BACKGROUND: #F3F5F6;  TEXT-DECORATION: none;}


/* Containers */
#wrap-page {width:100%; margin: 0px auto 0px auto; }
#wrap {	max-width:1200px; 	margin: 0px auto 0px auto; }


#top{max-width:1100px; padding: 0 0; margin: 0px auto 0px auto; border-bottom: 0px solid #000; background-color:#fff;
}
#top-right{ float:right; width:260px; height:82px; overflow:auto; font-size: 13px; padding: 0 18px 0 0;}

#nav{width:100%; margin: 0px auto 0px auto; border-top: 1px solid #ccc; }

#gap{width:1068px; overflow:auto; padding: 2px 0; }




#footnote{float:left; width:100%; overflow:auto; padding: 8px 0; font: 9pt Tahoma;  color: #fff; text-align: center;}

#hr-lines { border-top:solid #FEDAA5 1px; border-bottom:solid #FEDAA5 0px; padding-bottom: 8px;}
#latest-lines { border-top:solid #ccc 1px; border-bottom:solid #ccc 0px; margin-top: 1px; padding-bottom: 8px; margin-left: 10px;}
hr.style2 {
	border-top: 1px solid #AEADAD;
}


/* Links */

a:link { color: #003366; text-decoration: none;}
a:visited { color: #003366;}
a:hover { color: #000; text-decoration: underline;}
a:active { color: #003366;}
A.whitelink { COLOR: #FFFFFF; TEXT-DECORATION: none; font-size: 13px;}
A.whitelink:hover { COLOR: #FFFFFF; TEXT-DECORATION: underline;}

A.blacklink {COLOR: #003366; TEXT-DECORATION: none; font-size: 13px;}
A.blacklink:hover { COLOR: #000; TEXT-DECORATION: noe; BORDER-BOTTOM: #000 1px dotted;}


.white { color: #FFFFFF;}



/* pictures images */
.main img{
max-width:100% !important;
    height:auto;
    display:block;	-moz-border-radius:2px;
	-webkit-border-radius:2px;
	border-radius:2px;
}
img.left
{
	float: left;
	max-width: 100%;
	padding: 1px;
	border: 1px solid #FEDAA5;
	margin: 0px 10px 8px 0px;
}
img.gal
{
	max-width: 100%;
	padding: 2px;
	border: 1px solid #ccc;
	margin: 2px 10px 2px 0px;
}

img.thumb
{
	float: left;
	max-width: 100%;
	padding: 1px;
	border: 0px solid rgba(0, 0, 0, 0.1);
	margin: 2px 10px 2px 0px;
}
img.right
{
	float: right;
	max-width: 100%;
	padding: 1px;
	border: 1px solid rgba(0, 0, 0, 0.1);
	margin: 2px 4px 2px 10px;
}
img.centre
{
	display:inline-block;
	max-width: 100%;
	padding: 2px;
	border: 1px solid #ccc;
	margin: 0 4px 4px 0;
}



/* Footer Menus */
#footer{float:left; width:96%; overflow:auto;  border-bottom: 1px solid #D3A7AF; padding: 8px 0 8px 48px; margin-top: 12px; -moz-border-radius:2px; -webkit-border-radius:2px; border-radius:2px; background-color:#003366;}
#footer-left{float:left; width:22%; overflow:auto;  padding: 0 24px; }
#footer-middle1{float:left; width:22%; overflow:auto;  padding: 0 24px; }
#footer-middle2{float:left; width:22%; overflow:auto;  padding: 0 24px; }
#footer-right{float:left; padding: 0px 12px; height:170px; text-align:center; margin-top: 0;}




/* Extra */
.picture-main { border: 1px solid #D6EDFE; margin: 0;}
.picture-event { border: 1px solid #28A2FD; margin: 12px;}
.picture-left { border: 1px solid #F4F8FB; margin: 0 12px 0 0;}
.picture-right { border: 1px solid #F4F8FB; margin: 0 0 0 12px;}


/************* DD Navigation *************/

 /* -- */

.footnote {

	font-family: Arial;
	font-size: 11px;
	line-height: normal;
}
.text-white {
	WORD-SPACING: normal;
	COLOR: #FFFFFF;
	LETTER-SPACING: normal;
	font: Arial;
	font-size: 12px;
}
/******* Image Hover Text *********/

a.hovertext {
	position: relative;
	width: 300px;
	text-decoration: none !important;
	text-align: center;
	font-size: 11px;
  }
  a.hovertext:after {
    content: attr(title);
    position: absolute;
    left: 0;
    bottom: 2px;
    padding: 0.2em 10px;
    width: 280px;
    background: rgba(0,0,0,0.8);
    text-decoration: none !important;
    color: #fff;
    opacity: 0;
    -webkit-transition: 0.5s;
    -moz-transition: 0.5s;
    -o-transition: 0.5s;
    -ms-transition: 0.5s;
  }
  a.hovertext:hover:after, a.hovertext:focus:after {
    opacity: 0.8;
  }

.pa-link {
	BORDER-BOTTOM: black 1px dotted;   TEXT-DECORATION: none ; font-size: 14px;
}
A.pa-link:hover {
	BORDER-BOTTOM: black 1px dotted; BACKGROUND: #F5F4F4;  TEXT-DECORATION: none;
}

@media screen and (orientation: portrait) {
  img.ri {
      max-width: 90%;
  }
}

@media screen and (orientation: landscape) {
  img.ri {
      max-height: 90%;
  }
}
@media screen and (min-width: 780px) {
#mobile-footer{display: none;}

}

/* mobile only */
@media only screen
and (min-width : 999px) {
.mobile {display:none;}
}
/* mobile only */
@media only screen
and (max-width : 999px) {
.desktop {display:none;}
}
@media screen and (max-width: 779px) {


/* Side Block of Navigation */
#bottom-inner {  display: none;}
.hr-foot { margin: 0; width: 100%;}

#bottom-right {float:right;width:100%; padding: 4px 0 0 24px;  text-align:center; color: white;}
#col-left{float:left; width:100%; padding: 1px; margin: 4px 0 0 0; box-shadow: none; min-height:none;}
#col-right{float:left; width:100%; padding: 1px; margin: 4px 0 32px 0; box-shadow: none; max-height:812px;}
img.google{	max-width: 96%; margin: 4px 8px 4px 0; padding: 2px;}

img.gal
{
	max-width: 98%;
	padding: 2px;
	border: 1px solid #000;
	margin: 2px 0px;
}

#wrap {	width:100%; 	margin: 0px auto 0px auto; }

#top{width:100%;
}
#top-left{float:left; width:79%; height:82px; overflow:auto; padding: 0 0 4px 0;}
#top-right{display: none;}

#nav{width:100%;}

#gap{width:99%; overflow:auto; padding: 1px 0; }


.gap{width:99%;  }


#footer{display: none; }

#footnote{width:100%; overflow:auto; padding: 4px; font: 9pt Tahoma; border-top: 0px solid #fff; height: auto; color: #fff; text-align: center;}


}

/* Menu */


#cssmenu{
 margin: 0;
  padding: 0;
  border: 0;
  list-style: none;
		-moz-border-radius:1px;
		-webkit-border-radius:1px;
		border-radius:1px;
		-moz-box-shadow:0 1px 1px rgba(0,0,0,0.3);
		-webkit-box-shadow:0 1px 1px rgba(0,0,0,0.3);
		box-shadow:0 1px 1px rgba(0,0,0,0.3);

}
#cssmenu ul,
#cssmenu ul li,
#cssmenu ul li a,
#cssmenu #menu-button {
  margin: 0;
  padding: 0;
  border: 0;
  list-style: none;
  line-height: 1;
  display: block;
  position: relative;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  z-index:10;/* keeps menu in front */
}
#cssmenu:after,
#cssmenu > ul:after {
  content: ".";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
}
#cssmenu #menu-button {
  display: none;
}
#cssmenu {
  width: auto;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  background: #000000; 
}
#cssmenu > ul {
  box-shadow: inset 0 -3px 0 rgba(0, 0, 0, 0.05);
}
#cssmenu.align-right > ul > li {
  float: right;
}
#cssmenu > ul > li {
  float: left;
  display: inline-block;
}
#cssmenu.align-center > ul {
  float: none;
  text-align: center;
}
#cssmenu.align-center > ul > li {
  float: none;
}
#cssmenu.align-center ul ul {
  text-align: left;
}
#cssmenu > ul > li > a {
	padding: 13px 55px;
	border-left: 0px solid #1A6011;
	border-right: 0px solid #2B931C;
	text-decoration: none;
	font-size: 13px; 
	font-weight: bold;
	color: #ffffff;
	letter-spacing: 1px;
	background-color: #000000;
}
#cssmenu ul li:first-child > a {
    border-left: none; /* no border on menu left */
}
#cssmenu ul li:last-child > a {
    border-right: none; /* no border on menu right */
}

#cssmenu > ul > li:hover > a,
#cssmenu > ul > li > a:hover,
#cssmenu > ul > li.active > a {
  color: #ffffff;
  background: #003366;
}
#cssmenu > ul > li.has-sub > a {
  padding-right: 42px;
}
#cssmenu > ul > li.has-sub > a::after {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border: 6px solid transparent;
  border-top-color: #fff;
  right: 17px;
  top: 17px;
}
#cssmenu > ul > li.has-sub.active > a::after,
#cssmenu > ul > li.has-sub:hover > a {
  border-top-color: #ffffff;
}
#cssmenu ul ul {
  position: absolute;
  left: -9999px;
  top: 60px;
  padding-top: 1px;
  font-size: 13px;
  opacity: 0;
  -webkit-transition: top 0.2s ease, opacity 0.2s ease-in;
  -moz-transition: top 0.2s ease, opacity 0.2s ease-in;
  -ms-transition: top 0.2s ease, opacity 0.2s ease-in;
  -o-transition: top 0.2s ease, opacity 0.2s ease-in;
  transition: top 0.2s ease, opacity 0.2s ease-in;
}
#cssmenu.align-right ul ul {
  text-align: right;
}
#cssmenu > ul > li > ul::after {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border: 5px solid transparent;
  border-bottom-color: #ffffff;
  top: -1px;
  left: 20px;
}
#cssmenu.align-right > ul > li > ul::after {
  left: auto;
  right: 20px;
}
#cssmenu ul ul ul::after {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border: 5px solid transparent;
  border-right-color: #ffffff;
  top: 11px;
  left: -4px;
}
#cssmenu.align-right ul ul ul::after {
  border-right-color: transparent;
  border-left-color: #ffffff;
  left: auto;
  right: -4px;
}
#cssmenu > ul > li > ul {
  top: 120px;
}
#cssmenu > ul > li:hover > ul {
  top: 39px;
  left: 0;
  opacity: 1;
}
#cssmenu.align-right > ul > li:hover > ul {
  left: auto;
  right: 0;
}
#cssmenu ul ul ul {
  padding-top: 0;
  padding-left: 6px;
}
#cssmenu.align-right ul ul ul {
  padding-right: 6px;
}
#cssmenu ul ul > li:hover > ul {
  left: 234px;
  top: 0;
  opacity: 1;
}
#cssmenu.align-right ul ul > li:hover > ul {
  left: auto;
  right: 100%;
  opacity: 1;
}
#cssmenu ul ul li a {
  text-decoration: none;
  font-weight: 400;
  padding: 14px 25px;
  width: 240px;
  color: #777777;
  background: #ffffff;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 2px rgba(0, 0, 0, 0.1), 1px 1px 1px rgba(0, 0, 0, 0.1), -1px 1px 1px rgba(0, 0, 0, 0.1);
}
#cssmenu ul ul li:hover > a,
#cssmenu ul ul li.active > a {
  color: #333333;
}
#cssmenu ul ul li:first-child > a {
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
}
#cssmenu ul ul li:last-child > a {
  border-bottom-left-radius: 3px;
  border-bottom-right-radius: 3px;
}
#cssmenu > ul > li > ul::after {
  position: absolute;
  display: block;
}
#cssmenu ul ul li.has-sub > a::after {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border: 4px solid transparent;
  border-left-color: #777777;
  right: 17px;
  top: 14px;
}
#cssmenu.align-right ul ul li.has-sub > a::after {
  border-left-color: transparent;
  border-right-color: #777777;
  right: auto;
  left: 17px;
}
#cssmenu ul ul li.has-sub.active > a::after,
#cssmenu ul ul li.has-sub:hover > a::after {
  border-left-color: #333333;
}
#cssmenu.align-right ul ul li.has-sub.active > a::after,
#cssmenu.align-right ul ul li.has-sub:hover > a::after {
  border-right-color: #333333;
  border-left-color: transparent;
}
@media all and (max-width: 800px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 999px), only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 999px), only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width: 999px), only screen and (min-device-pixel-ratio: 2) and (max-width: 999px), only screen and (min-resolution: 192dpi) and (max-width: 999px), only screen and (min-resolution: 2dppx) and (max-width: 999px) {
  #cssmenu {
    background: #000000;
  }
  #cssmenu > ul {
    display: none;
  }
  #cssmenu > ul.open {
    display: block;
    border-top: 1px solid #ccc;
  }
  #cssmenu.align-right > ul {
    float: none;
  }
  #cssmenu.align-center > ul {
    text-align: left;
  }
  #cssmenu > ul > li,
  #cssmenu.align-right > ul > li {
    float: none;
    display: block;
  }
  #cssmenu > ul > li > a {
    padding: 18px 25px 18px 25px;
    border-right: 0;
	border-bottom: 1px solid #ccc;
  }
  #cssmenu > ul > li:hover > a,
  #cssmenu > ul > li.active > a {
    background: rgba(0, 0, 0, 0.1);
  }
  #cssmenu #menu-button {
    display: block;
    text-decoration: none;
    font-size: 13px;
    font-weight: 700;
    color: #fff;
    padding: 18px 25px 18px 25px;
    text-transform: uppercase;
    letter-spacing: 1px;
    background: url('../images/bg.png');
    cursor: pointer;
  }
  #cssmenu ul ul,
  #cssmenu ul li:hover > ul,
  #cssmenu > ul > li > ul,
  #cssmenu ul ul ul,
  #cssmenu ul ul li:hover > ul,
  #cssmenu.align-right ul ul,
  #cssmenu.align-right ul li:hover > ul,
  #cssmenu.align-right > ul > li > ul,
  #cssmenu.align-right ul ul ul,
  #cssmenu.align-right ul ul li:hover > ul {
    left: 0;
    right: auto;
    top: auto;
    opacity: 1;
    width: 100%;
    padding: 0;
    position: relative;
    text-align: left;
  }
  #cssmenu ul ul li {
    width: 100%;
  }
  #cssmenu ul ul li a {
    width: 100%;
    box-shadow: none;
    padding-left: 35px;
  }
  #cssmenu ul ul ul li a {
    padding-left: 45px;
  }
  #cssmenu ul ul li:first-child > a,
  #cssmenu ul ul li:last-child > a {
    border-radius: 0;
  }
  #cssmenu #menu-button::after {
    display: block;
    content: '';
    position: absolute;
    height: 3px;
    width: 22px;
    border-top: 2px solid #fff;
    border-bottom: 2px solid #fff;
    right: 25px;
    top: 18px;
  }
  #cssmenu #menu-button::before {
    display: block;
    content: '';
    position: absolute;
    height: 3px;
    width: 22px;
    border-top: 2px solid #fff;
    right: 25px;
    top: 28px;
  }
  #cssmenu > ul > li.has-sub > a::after,
  #cssmenu ul ul li.has-sub > a::after {
    display: none;
  }
}