
/* ###### Slideshow container ###### */
.slideshow-container {
  position: relative;
  background: #f1f1f1f1;
}

/* Slides */
.mySlides {
  display: none;
  padding: 80px;
  text-align: center;
}

/* Next & previous buttons */
.prev, .next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  margin-top: -30px;
  padding: 16px;
  color: #888;
  font-weight: bold;
  font-size: 20px;
  border-radius: 0 3px 3px 0;
  user-select: none;
}

/* Position the "next button" to the right */
.next {
  position: absolute;
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* 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);
  color: white;
}

/* The dot/bullet/indicator container */
.dot-container {
    text-align: center;
    padding: 20px;
    background: #ddd;
    background-color: #eae0c7;
}

/* The dots/bullets/indicators */
.dot {
  cursor: pointer;
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

/* Add a background color to the active dot/circle */
.active, .dot:hover {
  background-color: #817162;
}

/* Add an italic font style to all quotes */
q {font-style: candara;
   font-size: 18px;
}

/* Add a blue color to the author */
.author {color: #919199;}

/* ###### Body innehåll ###### */
body {
  background-color: light-grey;
font-family: candara;
}
h1 {
  color: #1b120b;
margin: 0;

 }
p {
  color: brown;
  font-size: 18px;
}
table { 
}

/* ###### Body innehåll-BILDER ###### */
img.socialicons { 
width: 23px;
border-radius: 5px;
}
img.Junoframsida { 
height: 300px;
border-radius: 3px;
}
img.Junobaksida { 
height: 300px;
border-radius: 3px;
}
img.tabellbild { 
height: 370px;
border-radius: 3px;
}

img.gulklanning { 
height: 200px;
border-radius: 3px;
}
img.writersportrait2 { 
width: 250px;
border-radius: 125px;
}

/* ###### Body innehåll-KNAPPAR ###### */
a.button:link, a.button:visited {
  background-color: orange;
  color: white;
  padding: 14px 25px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  border-radius: 3px;
}

a.button:hover, a.button:active {
  background-color: orange;
}

a.buybutton:link, a.buybutton:visited {
width: 276px;
height: 100%;
  background-color: #1b120b;
  color: orange;
  text-align:  center;
 display: inline-block;
  vertical-align: middle;
  text-decoration: underline;  
  font-size: 30px;
  font-weight: bold;
border-radius: 5px;

}

a.buybutton:hover, a.buybutton:active {
  background-color: #f38a0a;
  color: white;
 }



div.header a:link, div.header a:visited {
  background-color: #1b120b;
  color: white;
  padding: 6px 25px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  border-radius: 3px;
}

div.header a:hover, div.header a:active {
  backgroun-color: #f38a0a;
}

/* ###### Body FOOTER ###### */
footer {
  background-color: #1b120b;
  padding: 10px;
  text-align: center;
  color: white;
  font-size: 12px;
}
p.footertexter { 
color: white;
}
footer a { 
color: white;
}

footer a:hover, footer a:active, footer a:visited, footer a:link { 
color: white;
}


/* ###### Body - HEADER ###### */
div.header { 
	background-color: white;
opacity:0.75;
margin: 0;
border-radius: 5px;

}

div.header table { 
	padding-left: 3px;
}

div.header td { 
	padding-right: 20px;
}
div.header h1 { 
	padding-left:10px;
	font-size: 60px;
	color: dark-brown;
}
div.header p { 
margin: 0;
padding-top:3px;

	padding-left:6px;
padding-bottom:2px;
	}

/* ###### Body - MENYVAL - MENY ###### */

.menyval {
    list-style-type: none;
  margin: 0;
  padding: 0;
}

.menyval li {
  display: inline-block;
  font-size: 18px;
  padding: 15px;
}

/* ###### Galleri startsida. Bör endast användas på startsidan. ###### */

.startgallery {
    list-style-type: none;
  margin: 0;
  padding: 0;
}

.startgallery li {
height: 250px;

display: inline-block;
  font-size: 18px;
  padding-right: 15px;
	padding-top: 15px;
vertical-align: text-top;

}

.startgallery img { 
height: 100%;
border-radius: 5px;

}



/* ###### Galleri liggande bilder med text. Kan användas på alla web-sidor ###### */

.gallery {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

.gallery li {
  width: 260px;
color: brown;

  display: inline-block;
  font-size: 18px;
  padding-right: 15px;
	padding-top: 15px;
vertical-align: text-top;
}
.gallery img {
   width: 100%;
   border-radius: 5px;
}



/* ###### Body CONTENT TABLE Författare Juno Handla ###### */

table.contenttable { 
	width: 100%;
}
.contenttable td { 
	width: 33%;
	padding: 15px;
	text-align: center;
	vertical-align: text-top;
	font-size: 18px;
}

.contenttable a:link, .contenttable a:visited {
   color: black;
font-size: 24px;
font-weight: bold;

  padding: 6px 25px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  border-radius: 3px;
}

.contenttable img { 
	padding: 0px;
}




