﻿/*------------------------------------------------------------------
[Master Stylesheet]
-------------------------------------------------------------------*/

@import "reset.css";

/*--------------------------------------------------------------------------------------------------
Body and text
--------------------------------------------------------------------------------------------------*/
body									{font: normal 11px/1.6em Arial, Helvetica, Sans-serif; color: #000; background: #c4c4c4; text-align: center;}

h1										{font: bold 2.4545em/1.6em Arial, Helvetica, Sans-serif; color: #343c93;}
h2										{font: bold 1.6em/1.6em Arial, Helvetica, Sans-Serif; color: #343c93; margin: 0.6em 0 0.4em;}
h3										{font: bold 1.2727em/1.6em Arial, Helvetica, Sans-Serif; color: #343c93; border-bottom: solid 1px #e6e6e6; margin: 0.5em 0; padding: 0 0 4px;}
h3.group								{padding-top: 15px; font: bold 14px/18px sans-serif; border-top: solid 0px #ccc; clear: both;}

a										{}

.clearer								{height: 0; font-size: 0; line-height: 0; clear: both;}

/*--------------------------------------------------------------------------------------------------
Generics
--------------------------------------------------------------------------------------------------*/

img										{border: 0;}
img.left								{float: left; margin: 0 10px 5px 0;}
img.right								{float: right; margin: 0 0 5px 10px;}

div.company					            {width: 100%; margin-bottom: 20px; padding-bottom: 20px; border-bottom: solid 1px #ccc;}

/*--------------------------------------------------------------------------------------------------
Structure
--------------------------------------------------------------------------------------------------*/

div#page								{width: 960px; margin: 0 auto; text-align: left;}
div#page, div#masthead, div#navigation	{position: relative;}

/* Masthead */
div#masthead							{height: 98px; display: block;}
div#masthead a#logo						{position: absolute; left: 0; top: 0;}
div#masthead a.lang-1                     {position: absolute; right: 90px; top: 40px; text-decoration: none; color: #333b92; font-size: 14px;}
div#masthead a.lang-1:hover               {text-decoration: underline !important;}

div#masthead a.lang-2                     {position: absolute; right: 10px; top: 40px; text-decoration: none; color: #333b92; font-size: 14px;}
div#masthead a.lang-2:hover               {text-decoration: underline !important;}

div#masthead ul#toolbox					{position: absolute; right: 10px; top: 60px;}
div#masthead ul#toolbox li				{display: inline; padding: 0 0 0 10px;}
div#masthead ul#toolbox li a			{text-decoration: none; color: #333b92;}
div#masthead ul#toolbox li a:hover		{text-decoration: underline !important;}

/* Navigation */
div#navigation							{background: transparent url(../gfx/navigation-bg.png) repeat-x top; height: 33px; overflow: hidden; padding: 0 10px; position: relative;}
div#subnavigation						{background-color: #393939 !important; padding: 0 10px;}

div#navigation ul#sfMenu li					{display: block; float: left; background: transparent url(../gfx/navigation-item-separator-bg.png) no-repeat top right; margin: 0 !important;}
div#navigation ul#sfMenu li a					{display: block; float: left; padding: 8px 10px 8px; margin: 0 2px 0 0; color: #fff; text-decoration: none;}
div#navigation ul#sfMenu li a:hover			{color: #dcdcdc;}
div#navigation ul#sfMenu li.on a				{background: transparent url(../gfx/navigation-bg.png) repeat-x left -33px;}

div#subnavigation ul li					{display: inline;}
div#subnavigation ul li a				{display: inline-block; padding: 8px 10px 7px; margin: 0 2px 0 0; color: #fff; text-decoration: none;}
div#subnavigation ul li a:hover			{color: #dcdcdc;}
div#subnavigation ul li.on a			{font-weight: bold;}

div#navigation #searcharea				{float: right; margin-top: 5px;}
div#navigation #searcharea .txt			{border: solid 1px #6a6a6a; width: 150px; float: left; margin: 1px 4px 0 0; font-size: 1em; padding: 3px 5px;}
div#navigation #searcharea .btn			{font: 0.9091em Arial, Helvetica, Sans-serif; color: #fff; background: transparent url(../gfx/searchbutton-bg.png) no-repeat center top; border: none; padding: 4px 8px; text-transform: uppercase; cursor: pointer;}

/* Container */
div#container							{margin: 20px 0 0; background-color: #fff;}

div#container div#header				{display: block; width: 960px; overflow: hidden;}

div#container div#wrapper				{clear: both; padding: 10px;}
div#container div#wrapper div#content	{width: 470px; float: left; padding: 0 0 10px; font-size: 1.091em;}
div#container div#wrapper div#secondarycontent {width: 400px; float: right; font-size: 1.091em;}
div#container div#wrapper div#secondarycontent h3 {color: #000; }
div#container div#wrapper div#content p {margin: 0 0 1em;}

div#container div#wrapper div#content ul, div#container div#wrapper div#content ol, div#container div#wrapper div#secondarycontent ul, div#container div#wrapper div#secondarycontent ol {margin: 10px 10px 10px 25px; padding: 0;}
div#container div#wrapper div#content ul li, div#container div#wrapper div#secondarycontent ul li {list-style-type: disc;}
div#container div#wrapper div#content ol li, div#container div#wrapper div#secondarycontent ol li {list-style-type: decimal;}

/* Content */
div#container div#content a, div#container div#secondarycontent a {color: #343c93; text-decoration: underline;}
div#container div#content a:hover, div#container div#secondarycontent a:hover {text-decoration: none;}
div#container div#content, div#container div#secondarycontent p {margin: 0 0 1em;}

/* Footer */
div#footer								{margin: 10px 0; padding: 0 10px;}

div#footer div#address					{width: 570px; float: left;}
div#footer div#address address			{color: #13285c; display: block; clear: both; font-style: normal !important;}
div#footer div#address address a		{color: #13285c; margin: 0 0 0 5px;}
div#footer div#address address a:hover	{text-decoration: none;}
div#footer div#address address strong	{display: none;}
div#footer div#address address span.fn	{font-weight: bold;}
div#footer div#address address span.tel strong	{display: inline; margin: 0 0 0 5px;}
div#footer div#address address span.fax strong	{display: inline; margin: 0 0 0 5px;}

div#footer div#cred						{width: 300px; float: right; text-align: right;}
div#footer div#cred a					{color: #000; text-decoration: none;}
div#footer div#cred a:hover				{color: #393939;}

/*--------------------------------------------------------------------------------------------------
AddOns etc
--------------------------------------------------------------------------------------------------*/

span.smark								{background-color: #ccc; padding: 0 2px;}

ol.searchresult li						{margin-bottom: 20px;}
ol.searchresult h3						{margin: 0 0 5px 0;}
ol.searchresult h3 a					{text-decoration: none;}
ol.searchresult p						{margin: 3px 0;}

address.staff							{margin: 20px 0; display: block; clear: both;}
address.staff span						{margin: 0 0 3px 0; font: normal 12px sans-serif; display: block;}
address.staff span.wrapper				{width: 300px; float: left;}
address.staff span.photo				{width: 120px; margin-right: 5px; float: left;}
address.staff span.n					{margin-bottom: 5px; font-size: 14px; font-weight: bold;}
address.staff span.title				{margin: 10px 0; font-size: 14px;}
address.staff span.value				{display: inline;}

div.gallery								{width: 100%; margin: 10px 0; clear: both; float: left;}
p.gallerybreadcrumb						{margin: 10px 0 5px 0; padding: 0 0 5px; border-bottom: solid 1px #dcdcdc;}
a.gallerydir							{width: 149px; height: 130px; margin: 0 5px 5px 0; background: #fff url(../gfx/bg_gallery.gif) no-repeat 100% 100%; color: #000; text-decoration: none; text-decoration: none; text-align: center; display: block; float: left; position: relative; overflow: hidden;}
a.galleryimg							{width: 149px; height: 130px; margin: 0 5px 5px 0; background: #fff; color: #000; text-decoration: none; text-decoration: none; text-align: center; display: block; float: left; position: relative; overflow: hidden;}
a.gallerydir:hover						{color: #000; background-color: #f5f5f5;}
a.galleryimg:hover						{color: #000; background-color: #f5f5f5;}
a.gallerydir img, a.galleryimg img	    {display: block; clear: both;}
a.gallerydir span, a.galleryimg span    {width: 149px; font: normal 11px sans-serif; text-align: center; display: block; clear: both; position: absolute; bottom: 10px; left: 5px;}

body#viewphoto							{height: auto; margin: 10px; padding: 0; font: normal 12px sans-serif; color: #fff; background: #000;}
body#viewphoto h1						{font: bold 18px sans-serif; color: #fff;}
body#viewphoto p						{margin: 5px 0; color: #fff;}

fieldset.contact						{border: 0; margin: 10px 0; padding: 0;}
fieldset.contact legend					{margin: 0 0 5px -7px; padding: 0; font: bold 12px sans-serif; color: #000; display: none;}
fieldset.contact p						{margin: 5px 0;}
fieldset.contact label					{display: block;}
fieldset.contact label .rfv				{font-size: 11px; color: #f00;}
fieldset.contact input					{width: 98%; padding: 0.5% 1%; font: normal 12px sans-serif; color: #000; box-sizing:content-box; -ms-box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;}
fieldset.contact input.captcha-input	{width: 100%;}
fieldset.contact textarea				{width: 98%; height: 100px; padding: 1%; font: normal 12px sans-serif; color: #000; overflow: auto; box-sizing:content-box; -ms-box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;}
fieldset.contact .btn					{width: auto;}

fieldset.loginprotectedpage				{border: 0; margin: 10px 0; padding: 0;}
fieldset.loginprotectedpage legend		{margin: 0 0 5px -7px; padding: 0; font: bold 12px sans-serif; color: #000;}
fieldset.loginprotectedpage p			{margin: 5px 0;}
fieldset.loginprotectedpage label		{display: block;}
fieldset.loginprotectedpage label .rfv	{font-size: 11px; color: #f00;}
fieldset.loginprotectedpage input		{width: 250px; padding: 0 2px; font: normal 12px sans-serif; color: #000;}
fieldset.loginprotectedpage .btn		{width: auto;}

dl#pageproperties						{width: 100%; margin: 20px 0; display: block; clear: both;}
dl#pageproperties dt					{width: 110px; font: bold 11px sans-serif; float: left;}
dl#pageproperties dd					{font: normal 11px sans-serif;}
dl#pageproperties dd a					{}

ul.sitemap								{margin: 5px 0 5px 20px; list-style-type: square;}
ul.sitemap ul							{margin: 5px 0 5px 20px; list-style-type: square;}

ul.breadcrumb							{margin: 0; padding: 0; list-style: none;}
ul.breadcrumb li						{margin-right: 5px; padding: 0; line-height: 25px; display: inline;}
ul.breadcrumb li.delimiter				{font-weight: bold;}

ul.documentlibrary, ul.documentlibrary li {list-style: none !important;}
ul.documentlibrary						{margin-left: 0 !important; padding: 0 !important;}
ul.documentlibrary li					{line-height: 20px; border-bottom: solid 1px #f0f0f0; padding: 5px 0;}
ul.documentlibrary li img				{vertical-align: top;}
ul.documentlibrary li a					{margin: 0 0 0 6px;}



/*--------------------------------------------------------------------------------------------------
Responsive stuff
--------------------------------------------------------------------------------------------------*/

a.handle                                {display: none; width: 42px; height: 36px; position: absolute; left: 0px; top: 0; z-index: 100; text-indent: -99999px; background-image: url(../gfx/menu_icon.png); background-repeat: no-repeat; background-position: 50% 45%;}

div.full-navigation                     {transition: .5s all linear;}

a.handle                                {transition: .5s all linear;}

div.full-navigation					    {visibility: hidden; position: fixed; top: 0; left: -230px; width: 230px; height: 100%; background-color: #efefef; z-index: 1000;}
div.full-navigation.open				{left: 0;}
div.full-navigation.open + a.handle     {left: 230px !important;}

div.full-navigation ul li               {border-bottom: 1px solid #222972; background-color: #343c93;}
div.full-navigation ul li a             {padding: 5px 20px 5px; display: block; color: #fff !important; font-weight: bold; text-decoration: none; font-size: 1.167em;}

div.full-navigation ul                  {background: #efefef;}
div.full-navigation ul.submenu          {background: none;  }

div.full-navigation ul li.hc.on         {}
div.full-navigation ul li.hc.on a       {color: #333;}

div.full-navigation ul.submenu li                                 {border: none; padding-left: 15px; background: none!important; background-color: #efefef !important;}
div.full-navigation ul.submenu li a                               {text-transform: none; font-weight: normal; font-size: 1em; color: #333 !important;}

div.full-navigation ul li.on ul.submenu li ul.submenu li.hc       {padding: 0; }

div.full-navigation ul li.on ul.submenu li.hc.on                  {background: none; }
div.full-navigation ul li.on ul.submenu li.hc.on a                {background: none; color: #4f9daf; font-weight: bold; }
    
div.full-navigation ul li.on ul.submenu li.hc.on ul.submenu li a  {background: none; color: #fff; font-weight: normal; }
div.full-navigation ul li.on ul.submenu li.hc.on ul.submenu li.on a {background: none; color: #4f9daf; font-style: italic; }

div.full-navigation ul li.on ul.submenu li a                      {color: #000; }
div.full-navigation ul li.on ul.submenu li.on a                   {font-weight: bold; color: #4f9daf; background: none; }

div#navigation #responsivesearch		        {margin: 20px 0 20px 10px;}
div#navigation #responsivesearch .txt			{box-sizing:content-box; -ms-box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box; border: solid 1px #6a6a6a; width: 150px; float: left; margin: 0 4px 0 0 !important; font-size: 1em; padding: 3px 5px;}
div#navigation #responsivesearch .btn			{box-sizing:content-box; -ms-box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box; font: 0.9091em Arial, Helvetica, Sans-serif; color: #fff; background: transparent url(../gfx/searchbutton-bg.png) no-repeat center top; border: none; padding: 5px 8px; text-transform: uppercase; cursor: pointer;}


@media screen and (max-width: 1000px) {
    div#page                                                {width: 100%;}

    div#container div#wrapper div#content	                {width: 49%;}
    div#container div#wrapper div#secondarycontent          {width: 41%;}

    img                                                     {max-width: 100%; height: auto;	width: auto\9; /* ie8 */}
}

@media screen and (max-width: 700px)
{
    div#container div#wrapper div#content	                {width: 100%; float: none;}
    div#container div#wrapper div#secondarycontent          {width: 100%; float: none;}
    div#footer div#address                                  {width: 100%;}

    ul#sfMenu, ul#sfSubmenu, div#navigation #searcharea     {display: none;}

    div#masthead                                            {margin-top: 20px;}
    div#navigation                                          {position: absolute; top: -20px; left: 0; width: 100%; padding: 0 !important;}
    a.handle                                                {display: inline-block;}
    div.full-navigation.open				                {visibility: visible; overflow-y: auto; }
}

@media screen and (max-width: 500px)
{
    div#masthead a#logo						{left: 50%; margin-left: -115px;}
    div#masthead a.lang-1                     {position: absolute; right: 10px; bottom: 0; top: initial; font-size: 11px;}
    div#masthead a.lang-2                     {position: absolute; right: 10px; bottom: -15px; top: initial; font-size: 11px;}
    div#masthead ul#toolbox					{right: 68px; top: inherit; bottom: -15px;}

}