﻿
/* use inner box model - ALWAYS!*/
* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

body {
	font-family: 'Roboto', helvetica, arial, helve, sans-serif; /*font-weight normal is 400, bold is 700*/;
	text-rendering: optimizeLegibility;
	font-weight : normal;
	color: #333333;
	text-align: left;
	font-size : 1em;
	background-color: #FFFFFF;
}

/* CLEARFIX: use with DIVs that have floats inside to avoid collapsing */
.cf:before,
.cf:after {
  content: ".";    
  display: block;    
  height: 0;    
  overflow: hidden;        
}
.cf:after {clear: both;}
.cf {zoom: 1;} /* IE 5.5/6/7 */

/* .cf:after {
    content: " ";
    display: block;
    visibility: hidden;
    height: 0;
    clear: both;
} */


/* language picker */

.languagepicker {
	background-color: #FFF;
	display: inline-block;
	padding: 0;
	height: 40px;
	overflow: hidden;
	transition: all .5s ease;
	margin: 0 50px 0px 0;
	vertical-align : middle;
	float: right;
}

p.language{
  line-height: 1.5;
  display: inline-block;
  vertical-align: middle;
}

img.languagepicker {
	margin: 0px;
	vertical-align: top;
	float: right;


}

.languagepicker:hover {
	/* don't forget the 1px border */
	height: 120px;
}

.languagepicker a{
	color: #000;
	text-decoration: none;
}

.languagepicker li {
	display: block;
	padding: 0px 20px;
	/*line-height: 40px;*/
	border-top: 1px solid #EEE;
	height: 40px;

}

.languagepicker li:hover  {
	background-color: #EEE;
}

.languagepicker a:first-child li {
	border: none;
	background: #FFF !important;
}

/*
.languagepicker a:first-child li:focus-within {
  background: #ff8;
  color: black;
  height: 40px;
}


.languagepicker li img {
	margin-right: 5px;
}

.roundborders {
	border-radius: 5px;
}
*/


/*--------Accordion-------*/
 */


/*--------Accordion-------*/
.acc-kontainer {
  width: 100%;
  margin: auto;
font-family: 'Roboto', helvetica, arial, helve, sans-serif;

}
.acc-kontainer .acc-body {
        width: 98%;
        width: calc(100% - 20px);
        margin: 0 auto;
        height: 0;
        color: rgba(0, 0, 0, 0);;
        background-color: rgba(255, 255, 255, 0.2);
        line-height: normal;
        padding: 0 20px;
        box-sizing: border-box;
        transition: 0.5s;
}

.acc-kontainer label {
        cursor: pointer;
        background-color: rgb(153, 204, 255);
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
        display: block;
        padding: 15px;
        width: 100%;
        color: #000066;
        font-weight: bold;
        box-sizing: border-box;
        z-index: 100;
        font-size: 1.2rem;
        line-height: 1.2rem;
}

.acc-kontainer input{
  display: none;
}

.acc-kontainer label:before {
        content: '+';
        font-weight: bolder;
        float: right;
}

.acc-kontainer input:checked+label {
  background-color: rgba(153, 204, 255, 0.3);
}

.acc-kontainer input:checked+label:before {
  content: '-';
  font-weight: bolder;
  transition: 0.5s;
}

.acc-kontainer input:checked~.acc-body {
  height: auto;
  color: black;
  font-size: normal;
  padding: 20px;
  transition: 0.5s;
}

.acc-kontainer label:hover {
  background-color: #ccc;
}




/** Privacy box **/


#tc_privacy_container_text {
 width:79%;
 display:inline-block;
}
#tc_privacy_container_button,
#tc_privacy_container_text {
 vertical-align:middle;
}
#tc_privacy_container_button {
 width:19%;
 display:inline-block;
}
#tc_privacy_button {
 float: right;
}
@media(min-width: 768px) and (max-width: 979px) {
 #tc_privacy_container_text {
  width:69%;
 }
 #tc_privacy_container_button {
  width:29%;
 }
}
@media(max-width: 767px)   {
 #tc_privacy_container_text {
  width:100%;
 }
 #tc_privacy_container_button {
  width:100%;
 }
 #tc_privacy_button {
  margin:0 0 0 0;
  float: none;
  width:100%;
 }
}

#tc_privacy_container_button button:checked~#tc_privacy {
	display:none
}

/*social media links */

img.sm {
  display:inline;
  padding: 0px;
  font-size: 30px;
  max-width: 100px;
  min-width: 50px;
  margin: auto;
  text-align: center;
  text-decoration: none;
  
}

div.sm {
	background-color: rgb(38, 87, 154);
}


img.sm:hover {
    opacity: 0.7;
}



#biglogo {
padding: 9% 3% 1% 3%;
}



div.white {
        background-color: white;
}

div.blank {
        background-color: inherit;
}

div.blue {
        border-top: medium #3366FF solid;
        border-right: medium #3366FF solid;
        border-bottom: medium #3366FF solid;
        border-left: medium #3366FF solid;
        margin : 0.1em 0.1em 0.1em 0.1em;
}

.col {
        background-color: #99CCFF;
        /* border-top-left-radius: 12px; */
}

div.cell {
 padding: 0 0.3em 0 0.3em;
}

div img {
        /* border-top-left-radius: 10px; */
}

img.logo {
	float:right
	}
}

.formspecial {
        display: none;
}

p {
	line-height: 1.2;
	font-weight : normal;
	margin-bottom : 0.4rem;
	margin-top : 0.4rem;
	hyphens : auto;
	/* http://www.w3.org/TR/css3-text/#hyphenation */
	-webkit-hyphens : auto;
	-webkit-hyphenate-character : "\2010";
	-webkit-hyphenate-limit-after : 1;
	-webkit-hyphenate-limit-before : 3;
	-moz-hyphens : auto;
}


p.small {
	font-family: sans-serif;
	font-weight: normal;
	font-size: 0.7rem;
	color: black;
}

p.disclaimer {
        font-family: sans-serif;
        font-weight: normal;
        font-size: 0.7rem;
        color: #8D8D8D;
        margin-bottom : 0.1rem;
		margin-top : 5rem;
		text-align: center;
}

p.copyright {
        font-family: sans-serif;
        font-weight: normal;
        font-size: 0.7rem;
        color: black;
}

h1, h2, h3, h4, h5, h6 {
font-family: 'Roboto', helvetica, arial, helve, sans-serif;
/*font-weight normal is 400, bold is 700*/
font-weight : bold;
}

h1.blue,
h2.blue,
h3.blue,
h4.blue,
h5.blue,
h6.blue {
        color: #003399;
        margin-top: 0rem;
}

h1.red,
h2.red,
h3.red,
h4.red { 
color: red;
}

h1.green,
h2.green,
h3.green,
h4.green { 
color: green;
}

h1.white,
h2.white,
h3.white,
h4.white { 
color: white;
}

h1.left,
h2.left,
h3.left,
h4.left {
text-align: left;
}

h1 { 
margin-bottom : 0rem;
margin-top : 1.2rem;
font-size : 3rem;
line-height : 3.0rem;
text-align: center;
letter-spacing: 2px;
text-shadow: 0 3px 3px #333;
}

h2 { 
margin-bottom : 0rem;
margin-top : 0.5rem;
font-size : 2rem;
line-height : 2.0rem;
text-align: center;
letter-spacing: 0px;
text-shadow: 0 2px 2px #333;
}

h3 {
        margin-bottom : 0rem;
        margin-top: 0;
        letter-spacing: 0px;
        font-size: 3rem;
        line-height: 3rem;
        text-align: center;
        text-shadow: 1px 1px 1px #ffffff;
}

h4 {
        margin-bottom : 0rem;
        margin-top : 0rem;
        letter-spacing: 0px;
        font-size: 4rem;
        line-height: 4rem;
        text-shadow: 0 2px 2px #333;
        text-align: center;
}

h5 { 
margin-bottom : 0rem;
margin-top : 0rem;
letter-spacing: 0px;
font-size : 5rem;
line-height : 5rem;
text-shadow: 0 5px 5px #333;
text-align: center;
}

h6 {
        margin-bottom : 0rem;
        margin-top : 0rem;
        letter-spacing: 0px;
        font-size : 6rem;
        line-height : 6rem;
        text-shadow: 4px 4px 4px #ffffff;
        text-align: center;
}


hgroup {
padding: 0.6rem 0 0.6rem 0;
}

/*<a class="buttonFloat" href="tel:917380191">Tel: 917380191</a> */

.buttonFloat {
	z-index: 888888;
	position:fixed;
	bottom:3px;
	right:3px;
	float:right;
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    padding: 6px 12px;
    border: 1px solid #a12727;
    border-radius: 8px;
    background: #ff4a4a;
    background: -webkit-gradient(linear, left top, left bottom, from(#ff4a4a), to(#992727));
    background: -moz-linear-gradient(top, #ff4a4a, #992727);
    background: linear-gradient(to bottom, #ff4a4a, #992727);
    -webkit-box-shadow: #ff5959 0px 0px 40px 0px;
    -moz-box-shadow: #ff5959 0px 0px 40px 0px;
    box-shadow: #ff5959 0px 0px 40px 0px;
    text-shadow: #591717 1px 1px 1px;
    font: normal normal bold 30px arial;
    color: #ffffff;
    text-decoration: none;
}
.buttonFloat:hover,
.buttonFloat:focus {
    background: #ff5959;
    background: -webkit-gradient(linear, left top, left bottom, from(#ff5959), to(#b62f2f));
    background: -moz-linear-gradient(top, #ff5959, #b62f2f);
    background: linear-gradient(to bottom, #ff5959, #b62f2f);
    color: #ffffff;
    text-decoration: none;
}
.buttonFloat:active {
    background: #982727;
    background: -webkit-gradient(linear, left top, left bottom, from(#982727), to(#982727));
    background: -moz-linear-gradient(top, #982727, #982727);
    background: linear-gradient(to bottom, #982727, #982727);
}
.buttonFloat:before{
    content:  "\0000a0";
    display: inline-block;
    height: 24px;
    width: 24px;
    line-height: 24px;
    margin: 0 4px -6px -4px;
    position: relative;
    top: 0px;
    left: 0px;
    background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAACXBIWXMAAA7EAAAOxAGVKw4bAAAEyElEQVRIia2Va2xTZRjHf+fSrbRbYTh3010YY0Ecg8UoIETJ5APRDAYqfFliMqIJIpcgiSFZREOMH4xRol8MJCgYYzSBqENuMcIYlxmGLhtzA9Z1967b2q7t2p6257x+OGdQjSEu8UmenJw37/n/n///fc77KMwx6isoWFvI6ifmkyuniI1rxOaK8dC4tC//uBi7Ioy+MyJw6UOt8/PNV7/bntlYaMf+vxBc2F34vZgZFiI8JER4WIioV4jRy6Lv2JbeT2pZ98/98pwZhAAtaGUAZnxgy6F8yweVr7/73q8nXnE0pm9X567BgEQIdAMQJqHJjHPJBvXl3frRYPiwb895mgGUucI3rBDbyueHl0naFGS6QE+BHgM9DqkotgUlUnFWZEPbjd4vh2aIKtW5ZD1XREW3n4BZ3sNj06LkNqevc1mkqwXJfY7MhY+APQdSUUjFITlDdmGpMz9w1fjmlvaL8tlm9jUdbDi94/lHG1+rkVZvLJ5eoM2IaE8Av+nB32NtKetddparKmo8rpFy/4azsAhsDkjFTDUCpITv8WNnh76QTm7lcMPeXU04S028RIDkpJuhwUHP9NhQq7t/9OLxNtF6pg+PpTAXKFuaS+UbT7HjxSXUFpcX4Fi3E3TdKkmgjXexcc/pFWo0QRK/G2Tn/YJtOaWUL1xURo1RVpMKNtS9OsTw6Mi98KS35fadiYtHr9B6aZBb+8/z82CIQ++4vPsc2iBIDvPQdci021icS4l628c9ERxAyi4GYTxwRRZmE8uCjNxCyvMeq0A2KlbUTjdu3e412tu7Lqx7P/TSp9c5tHE56wsM/0rQTAJDgqk2ZAVZvTpMT8Q/QXZewCSQhNlbae1nPoRpkAx2yS9nTIUqzTdCsmteD7K2El0zwf3doA2AAmq3l2GfPxTK1vwuMB6AK2ngzKoxEKN38d0YJzxjdlzTC1Q9syZ/E8Y06EkI3QPNDzKkkhhqzCA4FdQGFwe6q8jKBRRThSxM/PtKdPQ+D972KKMaoa86+OhoA7X1dTnH5+dlOtD6IDaBeQAQ9cFIiEkVSPijuImPVWF4weEEuwMkG8hSWoPqiDxw1KgY4yLYtFp5u3yRrVJRk5C4a9prs0xLwEA/oevDeFSA8QjdqGxCFUAE9AikAFk2U5FAAtUFOTmw6klKEEkQCVNlpln4bMZuQ4ePlnAcnwrQ4eV3AUgq5u2kYlajGlZaa4qVkpVYf4ZhgRuQ6oTREVInOjgCGCrA5X7uxDRwuCwAmykTAWSlrSkWUfodLCwCDZLXwOeGZg9fn/2TFqztdI0x7AsTKivAhQ3ENPjbTVtzykBZDuSnkchpCjQQ/RBphUAcrvho2f8TB60STYKETnAihKfMRrUYg4luGBFEFZAjHuxON2QVQeZSkAsAO4gU6JMQvQPTg5AQ0Ozh1IEf2WsYeGcFzs6D1PQUbr2Lat8E9KfwHjjHTv8M8bfWsmtNEbX5fhxqG6jzQLE6mRREkhi3/PQcu8mR5k6+BUJpBj4YOCMxusaD1P8RpevN0+wYmOImYOw+RWuWnWV1VdSuKuHpXCcFGSpyWCPUO0HPD51c7vVyDfDxsOu+rppnP67npCODCv59lMqmObisdDDHiSgDGXP54L/EX5ztNQw3UOoSAAAAAElFTkSuQmCC") no-repeat left center transparent;
    background-size: 100% 100%;
}

.content-desktop {display: inline-block;}
.content-mobile {display: none;}

@media screen and (max-width: 480px) {

.content-desktop {display: none;}
.content-mobile {display: inline-block;}
}


/* clique aqui image button */
a.aqui {
 margin-bottom: 10px;
 width: 131px;
 height:40px;
 display:block;
 background:transparent url('../images/aqui_bl.png') center top no-repeat;
}

a.aqui:hover {
   background-image: url('../images/aqui_rd.png');
}

.quotation{
        font-style: italic;
        color: #008000;
        font-size : 1em;
        font-weight: bold;
        }

@media only screen and (max-width: 480px) {
        h1, h2, h3, h4, h5, h6 {
        text-align: left;
        margin-right : 0rem;
        margin-left : 0rem;
        }
}


.asterisk {
color: red;
font-size: 1.1em;
}



div.unibutton {
    float: none;
        text-align: center;
        height: 5.0rem;
        line-height: 2.0rem;
        vertical-align : middle;
}
button.unibutton {
	font-size: 2rem;

}
.w80{
	margin: auto;
	width: 80%;
}
.w60{
	margin: auto;
	width: 60%;
}


a.unibutton {
	-webkit-border-radius: 1px;
	-moz-border-radius: 1px;
	-ms-border-radius: 1px;
	-o-border-radius: 1px;
	/*border-radius: 1px;*/
	padding: 5px 15px 5px 15px;
	/*height: 5.0rem;*/
	vertical-align : middle;
	display: block;
	background-color: rgb(23,119,175);	
	/*border: 1px solid blue;*/
	text-align: center;
	text-decoration: none;
	color: white;
	font-size: 2rem;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
	-webkit-transition-duration: 0.5s; /* Safari */
  	transition-duration: 0.5s;
}

a.unibutton:hover {
        background-color: #ccc;
        color: black;
}

a.unibutton:visited {
        font-style: normal; 
        /*color : #ee3344;*/
        outline : 0;
        text-decoration: underline;
}


#htable1 {
display:table;
}

#htable2 {
display:none;
*display: table;
background-color: #CCFFFF;
}

div.formline {
vertical-align : middle;
}

div.formLineLabel {
text-align: right;
padding: 0 0.9em 0 0;
}

div.formLineField {
text-align: left;
padding: 0 0 0 0.9em;
}

div.bottom {
margin-bottom : 3em;
margin-top : 1em;
}
div.top {
margin-bottom : 1em;
margin-top : 3em;
}
.floatleft {
    float: left;
}

.floatright {
    float: right;
}

.center {
    float: none;
        text-align: center;
}

.footer {
font-size: 0.7rem;
color: #8D8D8D;
}

div.greenborder {
        border-top: 2px green solid;
        padding-right: 1em;
        padding-left: 1em;
        border-right: 2px green solid;
        border-bottom: 2px green solid;
        border-left: 2px green solid;
        margin-top: 0.5rem;
        margin-bottom: 0.5rem;
        background-color: #FFFF99;
        font-family: sans-serif;
        font-weight: normal;
        font-size: 0.9rem;
}

    .warningtextblack
    {
    position: relative;
    background-color: red;
    cursor: help;
    display: inline-block;
    text-decoration: none;
    outline: none;
        font-family: sans-serif;
        font-size: 8pt;
        color: white;
        text-transform: none;
        word-spacing: normal;
        letter-spacing: normal;
    }

    .tooltip
    {
   /* style of question here */
    position: relative;
    background: inherit;
    cursor: help;
    display: inline-block;
    text-decoration: none;
    outline: none;
        font-family: sans-serif;
        font-size: 10pt;
        color: black;
        text-align: left;
        text-transform: none;
        word-spacing: normal;
        letter-spacing: normal;
        margin-bottom: 0px;
    margin-left: 1px;
    margin-right: 10px;
    margin-top: 0px;
    }
    .Qicon
    {
   /* position of question.png here */
    position: relative;
        top: +3px;
    }
    .arrowicon
    {
   /* position of question.png here */
    position: relative;
        top: -6px;
    }

    .tooltip span
    {
   /* style of tooltip here */
    visibility: hidden;
    position: absolute;
    bottom: 30px;
    left: 50%;
    z-index: 999;
    width: 230px;
    margin-left: -127px;
    padding: 10px;
    border: 2px solid #ccc;
    opacity: .9;
    background-color: #ddd;
    /*background-image: -webkit-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
    background-image: -moz-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
    background-image: -ms-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
    background-image: -o-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
    background-image: linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
    -moz-border-radius: 4px; */
    border-radius: 4px;
    /*-moz-box-shadow: 0 1px 2px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,.5) inset;
    -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,.5) inset; */
    box-shadow: 0 1px 2px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,.5) inset;
    text-shadow: 0 1px 0 rgba(255,255,255,.4);
    }

    .tooltip:hover
    {
    border: 0; /* IE6 fix */
    }

    .tooltip:hover span
    {
    visibility: visible;
    }

    .tooltip span:before,
    .tooltip span:after
    {
    content: "";
    position: absolute;
    z-index: 1000;
    bottom: -7px;
    left: 50%;
    margin-left: -8px;
    border-top: 8px solid #ddd;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-bottom: 0;
    }

    .tooltip span:before
    {
    border-top-color: #ccc;
    bottom: -8px;
    }

        
/* CSS for modal overlays */


.panel {
    /* background-color: #0000FF; */
    margin-top: 0em;
    margin-bottom: 0em;
}
/* definitions for menu buttons */
/* float right */
.panel a#popbutton {
    border: 2px solid #0000FF;
    color: #0000FF;
    background-color: white;
        font-weight : bold;
    display: block;
    float: right;
    margin-right: 0px;
    margin-left: 10px;
    margin-top: 0px;
    margin-bottom: 8px;
    padding: 5px 10px;
    text-decoration: none;
 /*   text-shadow: 1px 1px #000; */

    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
    border-radius: 10px;
}
.panel a#popbutton:hover {
    border-color: red;
        color: red;
    background-color: blue;
}
/* center */
.panel a#popbutton2 {
    border: 2px solid #B0CADB;
    color: #B0CADB;
        font-weight : bold;
    display: inline;
    float: none;
    padding: 1px 10px;

    text-decoration: none;
 /*   text-shadow: 1px 1px #000; */

    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
    border-radius: 10px;
}
.panel a#popbutton2:hover {
    border-color: red;
        color: red;
}

.panel a#popbutton3 {
    border: 2px solid #0000FF;
    color: #0000FF;
    background-color: white;
        font-weight : bold;
    display: inline;
        float: none;
    margin-right: 10px;
    margin-left: 10px;
    margin-top: 0px;
    margin-bottom: 8px;
    padding: 1px 10px;
    text-decoration: none;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
    border-radius: 10px;
}
.panel a#popbutton3:hover {
        font-style: normal;
    border-color: red;
        color: red;
    background-color: blue;
}

div#showwide {
        display: block;
}
div#shownarrow {
        display: none;
}

@media only screen and (max-width: 480px) {
        div#showwide {
                display: none !important;
        }
        div#shownarrow {
        display: block !important;
        }
}


.overlay {
    background-color: rgba(0, 0, 0, 0.6);
    bottom: 0;
    cursor: default;
    left: 0;
    opacity: 0;
    position: fixed;
    right: 0;
    top: 0;
    visibility: hidden;
    z-index: 999;

    -webkit-transition: opacity .5s;
    -moz-transition: opacity .5s;
    -ms-transition: opacity .5s;
    -o-transition: opacity .5s;
    transition: opacity .5s;
}
.overlay:target {
    visibility: visible;
    opacity: 1;
}
.popup {
    background-color: #fff;
    border: 3px solid #fff;
    display: inline-block;
    opacity: 0;
    padding: 15px;
    position: absolute;
    text-align: justify;
    top: 15px;
        left: 0px;
        width: auto;
    visibility: hidden;
    z-index: 1000;

    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
    border-radius: 10px;

    -webkit-box-shadow: 0 1px 1px 2px rgba(0, 0, 255, 0.4) inset;
    -moz-box-shadow: 0 1px 1px 2px rgba(0, 0, 255, 0.4) inset;
    -ms-box-shadow: 0 1px 1px 2px rgba(0, 0, 255, 0.4) inset;
    -o-box-shadow: 0 1px 1px 2px rgba(0, 0, 255, 0.4) inset;
    box-shadow: 0 1px 1px 2px rgba(0, 0, 255, 0.4) inset;

    -webkit-transition: opacity .5s, top .5s;
    -moz-transition: opacity .5s, top .5s;
    -ms-transition: opacity .5s, top .5s;
    -o-transition: opacity .5s, top .5s;
    transition: opacity .5s, top .5s;
}
@media only screen and (min-width: 768px) {
        .popup {
    position: fixed;
        width: 50%;
    top: 40%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
        }

}
.overlay:target+.popup {
 /*    top: 50%; */
    opacity: 1;
    visibility: visible;
}
.close {
    background-color: rgba(0, 0, 255, 0.4);
    height: 30px;
    line-height: 30px;
    position: absolute;
    right: 0;
    text-align: center;
    text-decoration: none;
    top: -15px;
    width: 30px;

    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    -ms-border-radius: 15px;
    -o-border-radius: 15px;
    border-radius: 15px;
}
.close:before {
    color: red;
    content: "X";
    font-size: 24px;
        font-weight : bold;
    text-shadow: 0 -1px rgba(0, 0, 0, 0.9);
}
.close:hover {
    background-color: rgba(0, 0, 255, 1);
}
.popup p, .popup div {
    margin-bottom: 10px;
}
.popup label {
    display: inline-block;
    text-align: left;
    width: 120px;
}
.popup input[type=text], .popup input[type=password] {
    border: 1px solid;
    border-color: #999 #ccc #ccc;
    margin: 0;
    padding: 2px;

    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -ms-border-radius: 2px;
    -o-border-radius: 2px;
    border-radius: 2px;
}
.popup input[type=text]:hover, .popup input[type=password]:hover {
    border-color: #555 #888 #888;
}



article {
        border: 2px solid rgba(0, 0, 0, 0.1);
        padding-top: 0px;
        padding-left: 4px;
        padding-right: 4px;
    padding-bottom: 2em;
    position: relative;
    *zoom: 1;
}

article label {
    position: absolute;
    bottom: 0;
    left: 0;
        top: auto;
    width: 100%;
    text-align: center;
    padding: .3rem .65rem;
    box-shadow: inset 1px 1px rgba(0, 0, 0, 0.1), inset -1px -1px rgba(0, 0, 0, 0.1);
    background: rgba(0,0,0,.1);
        -webkit-transition: all .3s linear;
    -moz-transition: all .3s linear;
    -ms-transition: all .3s linear;
    -o-transition: all .3s linear;
    transition: all .3s linear;
}
article label:hover {
    background: rgba(0,0,0,.5);
    color: rgb(255,255,255);
}
/* article:before, article:after {
    content: "";
    display: table;
}

article:after { clear: both } */

/* article section:first-of-type {
    float: right;
    
}

article section:last-of-type {
    display: none;
    visibility: hidden;
} */

article section {
    font-family: Georgia, "Cambria", serif;
    color: #444;
    line-height: 1.8em;

    -webkit-transition: all .5s linear;
    -moz-transition: all .5s linear;
    -ms-transition: all .5s linear;
    -o-transition: all .5s linear;
    transition: all .5s linear;
}
/* make this specific input visually disapear! */ 
article input[type=checkbox] {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    width: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
}
article img {
        margin-top: 0.2rem;
        margin-right: 1rem;
        margin-left: 0.1rem;
        margin-bottom: 0.2rem;
    max-width: 100%;
    height: auto;
    width: auto\9; /* ie8 */        
}

/* [for="read_more"] {
    position: absolute;
    bottom: -0.8rem;
    left: 0;
        top: auto;
    width: 100%;
    text-align: center;
    padding: .65rem;
    box-shadow: inset 1px 1px rgba(0, 0, 0, 0.1), inset -1px -1px rgba(0, 0, 0, 0.1);
} */

/* [for="read_more"]:hover {
    background: rgba(0,0,0,.5);
    color: rgb(255,255,255);
} */

/* [for="read_more"] span:last-of-type {
    display: none;
    visibility: hidden;
}

input[type=checkbox]:checked ~ section {
    display: block;
    visibility: visible;
    width: 100%;
}


input[type=checkbox]:checked ~ [for="read_more"] span:first-of-type {
    display: none;
    visibility: hidden;
}

input[type=checkbox]:checked ~ [for="read_more"] span:last-of-type {
    display: block;
    visibility: visible;
} */

/* CSS for the js function "unhide()" which hides/shows an element*/
.elementhidden {
    /* display: none;
    visibility: hidden; */
        height: 0px;
        overflow: hidden;
        background-color: #FFFFFF;
}
.elementunhidden {
/*         display: block;
        visibility: visible; */
        height: auto;
        overflow: visible;
        background-color: #FFFFDC;
}

/* menu css from http://cssmenumaker.com/builder/2721951 */

@import url(http://fonts.googleapis.com/css?family=Lato:300,400,700);
@charset 'UTF-8';
/* Base Styles */
#cssmenu ul,
#cssmenu li,
#cssmenu a {
  list-style: none;
  margin: 0;
  padding: 0;
  border: 0;
  line-height: 1;
  font-family: 'Lato', sans-serif;
}
#cssmenu {
  *border: 1px solid #133e40;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
  width: auto;
}
#cssmenu ul {
        zoom: 1;
        background: white;
        *background: -moz-linear-gradient(top, #dfeaf5 0%, #b9d1e8 100%);
        *background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #dfeaf5), color-stop(100%, #b9d1e8));
        *background: -webkit-linear-gradient(top, #dfeaf5 0%, #b9d1e8 100%);
        *background: -o-linear-gradient(top, #dfeaf5 0%, #b9d1e8 100%);
        *background: -ms-linear-gradient(top, #dfeaf5 0%, #b9d1e8 100%);
        *background: linear-gradient(top, #dfeaf5 0%, #b9d1e8 100%);
        *filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='@top-color', endColorstr='@bottom-color', GradientType=0);
        padding: 0px 10px;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        -ms-border-radius: 5px;
        -o-border-radius: 5px;
        border-radius: 5px;
}
#cssmenu ul:before {
  content: '';
  display: block;
}
#cssmenu ul:after {
  content: '';
  display: table;
  clear: both;
}
#cssmenu li {
  float: left;
  margin: 0 5px 0 0;
  border: 1px solid transparent;
}
#cssmenu li.right {
  float: right;
  margin: 0 5px 0 0;
  border: 1px solid transparent;
}
#cssmenu li a {
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
  padding: 8px 15px 9px 15px;
  display: block;
  text-decoration: none;
  color: #000000;
  border: 1px solid transparent;
  font-size: 1rem;
}
#cssmenu li.active {
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
  border: 1px solid blue;
}
#cssmenu li.active a {
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
  display: block;
  background: yellow;
  border: 1px solid blue;
  *-moz-box-shadow: inset 0 5px 10px #133e40;
  *-webkit-box-shadow: inset 0 5px 10px #133e40;
  *box-shadow: inset 0 5px 10px #133e40;
}
#cssmenu li:hover {
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
  border: 1px solid blue;
}
#cssmenu li:hover a {
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
  display: block;
  background: yellow;
  border: 1px solid blue;
  *-moz-box-shadow: inset 0 5px 10px #133e40;
  *-webkit-box-shadow: inset 0 5px 10px #133e40;
  *box-shadow: inset 0 5px 10px #133e40;
}

/* buttons */

#cssmenu a.active {
        float: right;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
  padding: 3px 15px 3px 15px;
  display: block;
  background: yellow;
  border: 1px solid blue;
  text-decoration: none;
  color: #000000;
  font-size: 1rem;
}

#cssmenu a.active:hover {
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
  display: block;
  background: white;
  border: 1px solid yellow;
  *-moz-box-shadow: inset 0 5px 10px #133e40;
  *-webkit-box-shadow: inset 0 5px 10px #133e40;
  *box-shadow: inset 0 5px 10px #133e40;
}

#cssmenu a.stretch {
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
  padding: 3px 15px 3px 15px;
  display: block;
  background: yellow;
  border: 1px solid blue;
  text-decoration: none;
  color: #000000;
  font-size: 1rem;
  margin-left: 10%;
  margin-right: 10%;
    margin-top: 2px;
    margin-bottom: 2px;
  text-align: center;
}

#cssmenu a.stretch:hover {
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
  display: block;
  background: white;
  border: 1px solid yellow;
  *-moz-box-shadow: inset 0 5px 10px #133e40;
  *-webkit-box-shadow: inset 0 5px 10px #133e40;
  *box-shadow: inset 0 5px 10px #133e40;
}

p.videotitle {
        font-weight: normal;
        font-size: 0.7rem;
        text-shadow: 0 -1px rgba(0, 0, 0, 0.9);
        color: #8D8D8D;
        text-align: center;
}

.videoWrapper16-9 {
        position: relative;
        padding-bottom: 56.25%; /* 16:9 */
/*        padding-top: 25px; */
        height: 0;
}
.videoWrapper16-9 iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
}
