
.tabcontent {
    -webkit-animation: fadeEffect 1s;
    animation: fadeEffect 1s; /* siirtymäefektin kesto 1 sekunti */
}

@-webkit-keyframes fadeEffect {
    from {opacity: 0;}
    to {opacity: 1;}
}

@keyframes fadeEffect {
    from {opacity: 0;}
    to {opacity: 1;}
}
/* tab-palkin tyyli */
div.tab {
    overflow: hidden;
	
	
	 border-top: 10px solid #fff;
  border-bottom: 10px solid #fff;
  background-color: rgba(255, 255, 255, 0.6);
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
  margin-bottom: 30px;
  line-height: 2;
}

/* tabi-nappuloiden tyylit */
div.tab button {
    background-color: inherit;
    float: left;
    border: none;
    outline: none;
    cursor: pointer;
    padding: 14px 16px;
        color: #b49f79;
        text-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2);
        transition: 0.4s;
    font-size: 16pt;
        font-family: "Playfair Display", serif;
}

/* tabinappulan tyyli kun hiiri on päällä */
div.tab button:hover {
         color: #54bab9;
        text-shadow: 0px 0px 2px rgba(0, 0, 0, 0.3);
        transition: 0.4s;
}

/* aktiivisen tabinappulan tyyli */
div.tab button.active {
       color: #54bab9;
        text-shadow: 0px 0px 2px rgba(0, 0, 0, 0.3);
        transition: 0.4s;
}

/* tabin sisällön tyyli */
.tabcontent {
    display: none;
    padding: 0px 25px 0px 15px;
	min-height:500px;
	overflow:auto;
	
	margin-top:20px; 
	
	 border-top: 10px solid #fff;
  border-bottom: 10px solid #fff;
  background-color: rgba(255, 255, 255, 0.6);
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
  margin-bottom: 30px;
  line-height: 1.5;
	
	
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	
}
