/* Selector  */

* { margin: 0;  padding: 0;}
body { font-family: Candara, Verdana;century gothic; color: #5D5D5D; background: #F5F5F5 ; font-size: 100%;}
img { border: 3px solid  #adabab; margin: 1.5% 1.5% 1.5% 1.5% ; padding: 2px; width: 100%; }
h1 { font: bold underline normal 165% 'Candara', Verdana; color: #A9A9A9; padding: auto; margin:auto; text-align: center;}
h2 { font: bold 125% 'century gothic', arial, sans-serif; color: #8A8989;}
h3 { font: 125% 'century gothic', arial, sans-serif; color: #2DB8CD;}
p { padding: 0 0 20px 0; line-height: 1.7em; text-align: justify; font-family: Candara, Verdana,century gothic; font-size: 100%; }
a, a:hover { outline: none; text-decoration: underline; font: normal 110% 'Candara', Verdana,century gothic; text-align: center; color: #707070;}

/* ID  */
#wrap {	width:90%; height:auto; max-width: 830px; padding: 25px 20px 25px 20px; margin: 50px auto; margin-bottom: 50px; font-size: 100%; font-family:Candara, Verdana;  background-color: #ECECEC ; border: 2px solid #e7e7e7;}
#header { background: #e5e5e5 ; height: auto; border: 2px solid #bebebe; font-size: 100%; padding: 20px;}
#body { width: 100%; margin: 0 auto 0 auto; padding: 10px 20px 20px 20px; background: #ececec repeat-y; border: 15px solid #FFF; font-size: 100%;} 
#half { width: 50%; margin: 0 auto 0 auto; padding: 10px 20px 20px 20px; background: #F6F6F0 repeat-y; border: 15px solid #FFF; font-size: 100%; float: left;} 
#right { width: 100%; margin: 0 auto 0 auto; background: #F6F6F0; repeat-y; border: 15px solid #gray; font-size: 100%; float: center; text-align: center; padding: 8px; word-spacing: 20px; font-weight: bold;} 

/* Class  */  

.left { float: left; width: auto; margin-right: 0.5%;}
.right { float: right; width: auto; margin-left: 0.5%;}
.center { display: block; text-align: center; margin: 20px auto;}

* {box-sizing: border-box;} body {font-family: Verdana, sans-serif;}
  .mySlides {display: none;}
  img {vertical-align: middle; height: auto;}

.nocopy { -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}
.border {border-style: solid; border-width: 1px; border-color: #000000;}
.slideshow-container { max-width: 400px;  position: relative;  margin: auto;}
.active {  background-color: #717171;}
.separator { width: 100%; height: 0;  border-top: 1px solid #D9D5CF;  border-bottom: 1px solid #FFF; margin: 0 0 20px 0;}
.footer { width:60%; height: 60px;  background-color: #F6F6F0; border: 3px double #6F7378; color: #5D5D5D; padding: 15px 32px; text-align: center; text-decoration: none; display: inline-block; font-size: 16px; border-radius: 8px; margin: 20px;}

/* Navbar container */
.navbar { overflow: hidden;  background-color: #F6F6F0; font-family: inherit; }

/* Links inside the navbar */
.navbar a {  float: left;  font-size: 18px;  color: #707070;  text-align: center;  padding: 14px 16px;  text-decoration: underline; }

/* The dropdown container */
.dropdown {  float: left;  overflow: hidden;}

/* Dropdown button */
.dropdown .dropbtn {  font-size: 18px;  border: none;  outline: none;  color: #707070; text-decoration: underline; padding: 14px 16px;  background-color: inherit;  font-family: inherit; 
/* Important for vertical align on mobile phones */
  margin: 0; /* Important for vertical align on mobile phones */ }

/* Add a red background color to navbar links on hover */
.navbar a:hover, .dropdown:hover .dropbtn {  background-color: #e5e5e5;}

/* Dropdown content (hidden by default) */
.dropdown-content {  display: none;  position: absolute;  background-color: #f9f9f9;  min-width: 160px;  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);  z-index: 1;}

/* Links inside the dropdown */
.dropdown-content a {  float: none;  color: black;  padding: 12px 16px;  text-decoration: none;  display: block;  text-align: left;}

/* Add a grey background color to dropdown links on hover */
.dropdown-content a:hover {  background-color: #ddd;}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {  display: block;}

div.gallery { display: flex; flex-wrap: wrap; justify-content: flex-start; justify-content: center; align-items: center;}
div.gallery-item { margin: 15px; width: 306px; }
div.gallery-item img { width: 100%; height: auto; }
div.gallery-item div.desc { padding: 5px; text-align: center; }

div.gallery-itembig { margin: 15px; width: 656px; }
div.gallery-itembig img { width: 100%; height: auto; }
div.gallery-itembig div.desc { padding: 5px; text-align: center; }