/* Style the header with a grey background and some padding */

/* Use a media query to add a breakpoint at 800px: */



header {

    overflow: auto;

    background-color:blacK;

    padding: 20px 10px;

    background-image: url('../image/bergamo.jpg'),url('../image/bergamo.jpg'), url('../image/bergamo.jpg');

    background-position: left, center, right;

    background-size: auto;

    background-repeat: no-repeat,no-repeat, no-repeat;

  }

  

h1 {

    font-family: Tangerine;

    color: white;

    font-size: 46px; 

    font-style: normal; 

 

    font-weight: 700;

    text-align: center;

    }

    

div.choicelang

{ 

  float: right;

  height: 20px;

}

.parent

{

  width:auto;

}

.left

{

	float:left;

	box-sizing:border-box;

	border:#CCC solid 1px;

  overflow: auto;

  background-color: #f1f1f1;

  white-space: nowrap;  

}

.img-holder {

  width: 100%;

  height: 100%;

  overflow: auto;

}

.right

{

	float:left;

  width:60%;

	box-sizing:border-box;

  overflow: auto;

  padding: 0 8px;

	border:#CCC solid 1px;

  	}



.tab {

  overflow: auto;

  border: 1px solid #ccc;

  background-color: #f1f1f1;

  flex-wrap:nowrap;

  min-width: auto;

  white-space: nowrap;

  font-size: small;

}



/* Style the buttons inside the tab */

.tab button {

  background-color: inherit;

  float: left;

  border: none;

  outline: none;

  cursor: pointer;

  padding: 20px 20px;

  transition: 0.3s;

  font-size: 15px;

  flex-wrap:nowrap;

  white-space: nowrap;

}

.tab2 {

  overflow: auto;

  flex-wrap:nowrap;

  min-width: auto;

  white-space: nowrap;

  font-size:smaller;

}

/* Style the buttons inside the tab */

.tab2 button {

 

  float: left;

  border: none;

  outline: none;

  border-radius: 12px;

  cursor: pointer;

  padding: 5px 5px;

  transition: 0.3s;

  font-size: 15px;

  flex-wrap:nowrap;

  white-space: nowrap;

}

.slider {

  width: 500px;

  height: 300px;

  background-color: yellow;

  margin-left: auto;

  margin-right: auto;

  margin-top: 0px;

  text-align: center;

  overflow: hidden;

}

.image-container {

  width: 1500px;

  background-color: pink;

  height: 300px;

  clear: both;

  position: relative;

  -webkit-transition: left 2s;

  -moz-transition: left 2s;

  -o-transition: left 2s;

  transition: left 2s;

}

* {

  box-sizing: border-box

}

body {

  font-family:'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;

  margin: 0

}

.mySlides {

  display: none

}

img {

  vertical-align: middle;

}

.slideshow-container {

  max-width: 1000px;

  position: relative;

  margin: auto;

}

/* Next & previous buttons */

.prev,

.next {

  cursor: pointer;

  position: absolute;

  top: 50%;

  width: auto;

  padding: 16px;

  margin-top: -22px;

  color: white;

  font-weight: bold;

  font-size: 18px;

  transition: 0.6s ease;

  border-radius: 0 3px 3px 0;

}

/* Position the "next button" to the right */

.next {

  right: 0;

  border-radius: 7px 0 0 7px;

}

/* On hover, add a black background color with a little bit see-through */

.prev:hover,

.next:hover {

  background-color: rgba(0, 0, 0, 0.8);

}

/* Caption text */

.text {

  color: #ffffff;

  font-size: 15px;

  padding: 8px 12px;

  position: absolute;

  bottom: 8px;

  width: 100%;

  text-align: center;

}

/* Number text (1/3 etc) */

.numbertext {

  color: #ffffff;

  font-size: 12px;

  padding: 8px 12px;

  position: absolute;

  top: 0;

}

/* The dots/bullets/indicators */

.dot {

  cursor: pointer;

  height: 15px;

  width: 15px;

  margin: 0 2px;

  background-color: #999999;

  border-radius: 50%;

  display: inline-block;

  transition: background-color 0.6s ease;

}

.active,

.dot:hover {

  background-color: #111111;

}

/* Fading animation */

.fade {

  animation-name: fade;

  animation-duration: 1.5s;

}



@-webkit-keyframes fade {

  from {

    opacity: .4

  }

  to {

    opacity: 1

  }

}

@keyframes fade {

  from {

    opacity: .4

  }

  to {

    opacity: 1

  }

}

/* On smaller screens, decrease text size */

@media only screen and (max-width: 300px) {

  .prev,

  .next,

  .text {

    font-size: 11px

  }

}

/* Change background color of buttons on hover */

.tab button:hover {

  background-color:#cccccc3e;

}



/* Create an active/current tablink class */

.tab button.active {

  background-color: #7b6c6c;

  color: #f1f1f1;

}



/* Style the tab content */



.tabcontent {

  display: none;

  padding: 6px 6px;

  border: 1px solid #cccccc22;

  border-top: none;

}

.partab{

  text-align:justify;

  text-indent: 20px;

  border-left: 5px;

  padding-left: -20px; 

  font-size: small;    

}

.divframetab

{

  position: relative;

  top:10px;

  left: 10px;

  height:calc(60vh - 50px);

  width:calc(70vh - 50px);

}

select{

  background: #000;

  color: #fff;

  font-style: normal;

  font-weight: normal;

}



select optgroup{

  background: #000;

  color: #fff;

  font-style: normal;

  font-weight: normal;

}

.mySlides {display:none;}

.descrizione

{

  font-family: Verdana, Geneva, Tahoma, sans-serif;

  font-size: 12px;

  text-align: justify;

}