/* SWBV v1 - VRVistas - RS - July 2014 */

/* Core */
html,body  {margin:0; padding:0; height:100%; font-family: Arial, sans-serif }
h3 {font-size:large;}
h4 {margin:0; padding:0;}
p {margin:0 0 15px 0; padding:0; color: #666;}
ul {margin:0 0 15px 25px; padding:0;}
li {padding:0 0 2px 0;}
#container {position: relative; height:auto !important; min-height: 100%; min-width:320px; margin:0; padding:0;  z-index:1; }
#header{position: relative; width:100%; height:50px; margin:0; padding:0; color: white; background-color: #357dc1 !important;
	box-shadow: /* Shadow beneath the bar and edge highlights. */
		/* Layered single pixel shadows to create a one sided shadow effect. */
		0 5px 0 0 rgba(0, 0, 0, 0.01),
		0 4px 0 0 rgba(0, 0, 0, 0.02),
		0 3px 0 0 rgba(0, 0, 0, 0.04),
		0 2px 0 0 rgba(0, 0, 0, 0.06),
		0 1px 0 0 rgba(0, 0, 0, 0.08),
		/* Top highlight */
		0 1px 0 0 rgba(255, 255, 255, 0.1) inset,
		/* Left highlight */
		1px 0 0 0 rgba(255, 255, 255, 0.1) inset,
		/* Right highlight */
		-1px 0 0 0 rgba(255, 255, 255, 0.1) inset,
		/* Bottom lowlight */
		0 -1px 0 0 rgba(0, 0, 0, 0.1) inset;
	background-image: -webkit-linear-gradient(top, rgba(255,255,255, 0.05) 50%, rgba(0,0,0, 0.02) 51%);
	background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.05) 50%, rgba(0, 0, 0, 0.02) 51%);
	background-size: 100%;	background-repeat: no-repeat; z-index: 100; opacity:1;}
#logo {float:left; display:none; width:48px; height:48px; margin:1px 0 2px 10px; }
#title {float:left; display:none; height:35px; margin:5px 0 0 10px; font-size:xx-large; text-shadow:1px 1px #666;}
#content{position: relative; background-color:transparent; width: 100%; margin:0; padding:0; z-index:2}
#strapline{margin:10px 0 10px 10px; padding:0; }
#subtitle{display:block; padding:5px 0 10px 10px; font-size:large; font-weight:bold;}  
#copy{padding:0 20px 15px 10px;}
.photo { margin:10px; }
.smaller {width:450px;}
.smallest {width:300px;}
#footer{position: relative; width: 100%; min-height:100px; margin:0; padding: 8px 0px 5px 0; background-color: #333; color:#FFFFFF; border:1px gray solid; z-index:2}
#footer ul {list-style-type: none;	list-style: none; margin:0; padding:0;}
#footer ul li {display:inline;}
.footer a {color: white; text-decoration:none; }
.footer a:hover {color: #F33; text-decoration:none; }
#footer_main{margin:0 0 0 10px;}
#footer_title {float:left; margin: 0 15px 0px 0; text-align:left; font-size:xx-large; }
#footer_sub {float:left; }
#footer_mission {float:left; margin: 15px 15px 0px 0; text-align:left; font-size:medium; font-style:italic;}
#footer_strapline {float:left; margin: 13px 0px 0px 0; text-align:left; font-size:large;}
#footer_links{clear:both; padding:0 0 0 10px; font-size:small;}
.footer-link{font-size:large;color:#ddd; font-size:medium; }
#footer_services {float:left; margin: 10px 20px 0 0; text-align:left;}
#footer_info {float:left; margin: 10px 20px 0 0; text-align:left; }

/* Menu */
#menu{font-size:medium; text-shadow:1px 1px #666; } 
.top-menu {float:right; display:none; position:relative; top:0px; right:10px; z-index:200;}
ul.top-menu, ul.top-menu ul.submenu {padding:0; margin:0;}
ul.top-menu li, ul.top-menu ul.submenu li {list-style-type:none; display:inline-block; }
ul.top-menu li {height:40px; padding-top:10px;}
ul.top-menu ul.submenu li {width:100%; 	border-top: 1px solid rgba(255, 255, 255, 0.1); border-bottom: 1px solid rgba(0, 0, 0, 0.1); }
ul.top-menu li:hover, ul.top-menu ul.submenu li:hover {background-color: rgba(255,255,255,0.2); border-bottom:medium #000066 solid;}
ul.top-menu li a {text-decoration:none; color:#fff; padding:5px 10px 5px 10px; display:inline-block; white-space:nowrap}
ul.top-menu li ul.submenu li a {text-decoration:none; color:#fff; padding: 0.5em 1em 0.5em 1em; display:inline-block; white-space:nowrap}
ul.top-menu li a:hover, ul.top-menu li ul.submenu li a:hover {color:#000066; text-shadow:1px 1px #ccc; }
ul.top-menu li {position: relative;}
ul.top-menu li ul.submenu {position:absolute; display:none; top:50px; left:0; min-width:120px; background-color:#89cd2e; }
.side-menu {position:absolute; display:none; top:50px; right:0px; width:150px; background-color:#357dc1; z-index:200; }
ul.side-menu, ul.side-menu ul.submenu {padding:0; margin:0;}
ul.side-menu li, ul.side-menu ul.submenu li {list-style-type:none; display:block; width:100%; background-color: #357dc1; border-top: 1px solid rgba(255, 255, 255, 0.1); border-bottom: 1px solid rgba(0, 0, 0, 0.1); }
ul.side-menu li:hover, ul.side-menu ul.submenu li:hover {background-color: rgba(255,255,255,0.2); border-left:medium #000066 solid;}
ul.side-menu li a {display:block; text-decoration:none; color:#fff; padding:0.5em; }
ul.side-menu li ul.submenu li a {text-decoration:none; color:#fff; padding:1em 1em 1em 1.5em; }
ul.side-menu li a:hover, ul.side-menu li ul.submenu li a:hover {color:#000066; text-shadow:1px 1px #ccc;}
ul.side-menu li {position: relative;}
ul.side-menu li ul.submenu {display:none; position:relative; top:0; width:100%; background-color:#357dc1; }
#tab {float:right; display:none; height:50px; width:50px; margin:0; padding:0; vertical-align:middle; text-align:center; background-color: rgba(255,255,255,0);}
#tab:hover{background-color: rgba(255,255,255,0.2);}
.tab {padding:15px 10px 15px 10px;}
.tabline {width:24px; height:4px; border-radius:1px; margin-bottom: 4px; background-color:#fff;}

/* Modal */
#modal {position:absolute; display:none; top:60px; left:5%; width:90%; border-radius:8px; border:thin #ddd solid; 
	box-shadow:0 3px 8px rgba(0,0,0,.3); -moz-box-shadow:0 3px 8px rgba(0,0,0,.3); -webkit-box-shadow:0 3px 8px rgba(0,0,0,.3);
	box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; z-index: 15;}
#modal-content {position: relative;	margin:0; padding:0; background-color:#fff; border-radius:8px; z-index: 20;}
#modal-header {position:relative; height:40px; background-color: #fff; padding:8px 15px 0 15px; border-bottom:thin #ddd solid; border-radius: 8px 8px 0 0;}
#modal-title {float: left;padding: 10px 0 0 0; color:#555; font-size: x-large;font-weight: bold;border-radius: 8px 0 0 0;}
#modal-close {float:right; border-radius: 0 8px 0 0; }
#modal .btn {margin:0 0 5px 0; width:24px; height:24px; padding:3px;}
#modal-copy {clear:both; background-color:#fff; padding:10px 15px 15px 15px; font-size:medium; border-radius:0 0 8px 8px;}
#modal-overlay {position: fixed; top:0;	left:0; width: 100%; height: 100%;	background: rgba(0,0,0,.1); z-index: 10;}