﻿@charset "utf-8";
/* CSS Document */


* {       box-sizing: border-box;
		  margin: 0;padding: 0;}

html {font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif; font-size: 1.0em;}
body {}

.outerwrap {margin:0 10px;padding:10px;overflow:hidden;}

.homecontent {clear:both;margin-top:10px;}
.hiddengallery {visibility:hidden; display:none;}

.wrap {clear: both;overflow: hidden;max-width:100%;}

.wrapcontent {clear: both;overflow: hidden;max-width:100%;}
.widecontent {clear: both;overflow: hidden;max-width:100%;}
.box-main-top {max-width: 100%;margin:0;overflow:hidden;}
.box-main-content {max-width: 100%;margin:0;overflow:hidden;}
.box {max-width: 100%;margin:0;overflow:hidden;}
.box-main {max-width: 100%;margin:0;}
.box-left {max-width: 100%;margin:0;overflow:hidden;}
.box-right {width: 100%; padding: 10px;}

.pictureborder {border:#CCC thin solid; border-radius:3%;padding:10px;clear:both;margin:10px 0 10px 0;overflow:hidden;}
.pictureborder2 {border:#CCC thin solid; border-radius:1%;padding:10px;clear:both;margin:10px 0 10px 0;overflow:hidden;}

.contentarea {border:#CCC thin solid;overflow:auto; border-radius:3%;padding:10px;clear:both;margin:10px 0 10px 0;overflow:hidden;}
.contentarea2 {border:#CCC thin solid;overflow:auto; border-radius:1%;padding:10px;clear:both;margin:10px 0 10px 0;overflow:hidden;}

.picturearea {padding:10px; width:100%; text-align:center; overflow:hidden;}
.area-a {padding:10px;clear:right;width:100%;}

.picturearea img {width:100%;max-width:100%; height:auto;}

.footer {width:100%;background-color:#996;padding:10px;margin-top:20px;margin-bottom:35px;color:#FFF;clear:both;}

h1, h2, h3, h4 {line-height: 1.4em;font-size:1em;color:#000;font-weight:lighter;padding:10px;}
h1 {font-size:1.4em;}
h2 {font-size:1.4em; text-align:center;}
h3 {font-size:1.0em;}	
h5 {font-size:1.0em;padding:5px;}
h6 {font-size:1.0em;padding:5px;}

.homecontent h1 {font-size:2em;font-weight:lighter;padding:5px; text-align:center;}
.homecontent h2 {font-size:1.0em;font-weight:lighter;padding:5px; text-align:center;}	

ul {
  border-left: 5px solid red;
  background-color: #f1f1f1;
  list-style-type: none;
  line-height:30px;
  padding: 10px 20px;
  list-style: square inside url("button.png");
}


p {font-size:1.1em; line-height: 1.5em; margin: 0;padding: 8px 0 8px 0; font-weight:normal; color:#000;}

a:link {text-decoration: underline; display:inline-block;color:#000;}
a:visited {text-decoration: underline;color:#000;}
a:hover {text-decoration: none; color:#000;}
a:active {text-decoration: underline;color:#000;}

.homecontent h1 a:link {text-decoration: none; color:#000;display:inline-block;}
.homecontent h1 a:visited {text-decoration: none;color:#000;}
.homecontent h1 a:hover {text-decoration: none;color:#666;}
.homecontent h1 a:active {text-decoration: none;color:#000;}

h2 a:link {text-decoration: underline; color:#000;display:inline-block;}
h2 a:visited {text-decoration: underline;color:#000;}
h2 a:hover {text-decoration: none;color:#666;}
h2 a:active {text-decoration: none;color:#000;}

h3 a {border: #000 thin solid;border-radius:8px;margin:0px;box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);}
h3 a:link {text-decoration: none; display: block; text-align:center; font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif;  font-size:1.0em; padding:5px; background-color:#FFF; color:#000; line-height:1.4em;}
h3 a:visited {text-decoration: none; background-color:#FFF;color:#000;}
h3 a:hover {text-decoration: none;background-color:#EFEFEF;color:#000;}
h3 a:active {text-decoration: none;background-color:#FFF;color:#000;}


h6 a {display:inline-block; padding:20px;border: #000 thin solid;border-radius:8px;margin:5px; background-color:#F66; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);}
h6 a:link {text-decoration: none; display:inline-block;text-align:center; font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif;  font-size:1.0em; padding:5px; background-color:#00F; color:#FFF; line-height:1.4em;}
h6 a:visited {text-decoration: none; background-color:#00F;color:#FFF;}
h6 a:hover {text-decoration: none;background-color:#F66;color:#FFF;}
h6 a:active {text-decoration: none;background-color:#00F;color:#FFF;}


.shop {border:#CCC thin solid; border-radius:2%;padding:10px;float:left;;margin:10px;width:290px;height:460px;}
.shopimage {height:240px;padding:10px;}
.shopimage img {max-width:100%;height:auto;}
.shopimage p {text-align:center;}
.amazon {height:110px;width:100%;}
.shop h5 {text-align:center; font-size:1.0em;}


.shop h6 a {width:100%;display:block; padding:20px;border: #000 thin solid;border-radius:8px;margin:5px; background-color:#F66; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);}
.shop h6 a:link {text-decoration: none; display:inline-block;text-align:center; font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif;  font-size:1.0em; padding:5px; background-color:#00F; color:#FFF; line-height:1.4em;}
.shop h6 a:visited {text-decoration: none; background-color:#00F;color:#FFF;}
.shop h6 a:hover {text-decoration: none;background-color:#F66;color:#FFF;}
.shop h6 a:active {text-decoration: none;background-color:#00F;color:#FFF;}

.box-left h6 a {width:100%;display:block; padding:20px;border: #000 thin solid;border-radius:8px;margin:5px; background-color:#F66; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);}
.box-left h6 a:link {text-decoration: none; display:inline-block;text-align:center; font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif;  font-size:1.0em; padding:5px; background-color:#00F; color:#FFF; line-height:1.4em;}
.box-left h6 a:visited {text-decoration: none; background-color:#00F;color:#FFF;}
.box-left h6 a:hover {text-decoration: none;background-color:#F66;color:#FFF;}
.box-left h6 a:active {text-decoration: none;background-color:#00F;color:#FFF;}


.alignmiddle {text-align:center;}
.largeheading {font-family:Verdana, Geneva, sans-serif; font-size:1.2em; text-align:center;margin:10px 0;}

.advertisement {font-size:0.7em; text-align:center; font-style:italic; font-weight:lighter;}
.advertisement a:link {text-decoration: none; display:inline-block;color:#000;}
.advertisement a:visited {text-decoration: none;}
.advertisement a:hover {text-decoration: underline;}
.advertisement a:active {text-decoration: none;}

.picturecaption {text-align:center; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size:0.85em; display:block;}
.picturecaption a:link {text-decoration: underline; display:inline-block;color:#000;}
.picturecaption a:visited {text-decoration: underline;color:#000;}
.picturecaption a:hover {text-decoration: none;color:#000;}
.picturecaption a:active {text-decoration: underline;color:#000;}


.footer p {font-size:1em; line-height: 1.0em;margin: 0;padding: 5px 0 5px 0; font-weight:lighter;color:#FFF;text-align:left;}
.footer h2 {font-size:1.2em; line-height: 1.5em;margin: 0;padding: 5px 0 5px 0; font-weight:lighter;color:#FFF;text-align:center;}
.footer h3 {font-size:0.95em; line-height: 1.5em;margin: 0;padding: 5px 0 5px 0; font-weight:lighter;color:#FFF;text-align:center;}
.footer a:link {text-decoration: none; color:#FFF;}
.footer a:visited {text-decoration: none;color:#FFF;}
.footer a:hover {text-decoration: underline;color:#FFF;}
.footer a:active {text-decoration: none;color:#FFF;}


img {max-width:100%;height: auto;
  border: #000 thin solid;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  border-radius:8px;
  
  }


img a {
  max-width:100%;
  height: auto;
  border: #000 thin solid;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  border-radius:8px;
  }

.topimage img {max-width:100%;height: auto;
  border: none;
  box-shadow: none;
  border-radius:0;
  
  }
  
  
.topbtn {
  font-size: 18px;
  cursor: pointer;
  background-color: #F00;
  color: white;
  padding: 10px 20px 0 20px;
  border: none;
  position: fixed;
  right: 80px;
  top: 0px;
  z-index: 10;
  border: #000 thin solid;
  border-top:none;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  border-radius:0px 0px 8px 8px;

  
}

.topbtn:hover {
  background-color: #444;
}

.topbtn a:link {text-decoration: none; display:inline-block;color:#FFF;}
.topbtn a:visited {text-decoration: none;color:#FFF;}
.topbtn a:hover {text-decoration: none;color:#FFF;}
.topbtn a:active {text-decoration: none;color:#FFF;}

.topbtn2 {
  cursor: pointer;
  color: white;
  padding: 5px;
  border: none;
  position: fixed;
  right: 20px;
  top: 0px;
  z-index: 10;
  
}

.topbtn2 img {width:auto;border-radius: 0px;padding:0; margin:0;box-shadow: none; border:none;}


#bottomBtn {
  display: none;
  position: fixed;
  bottom: 60px;
  right: 30px;
  z-index: 99;
  font-size: 18px;
  border: none;
  outline: none;
  background-color: #666;
  color: white;
  cursor: pointer;
  padding: 15px;
  border-radius: 4px;
}

#bottomBtn:hover {
  background-color: #555;
}



#bottomBtn {
  display: none;
  position: fixed;
  bottom: 60px;
  right: 30px;
  z-index: 99;
  font-size: 18px;
  border: none;
  outline: none;
  background-color: #666;
  color: white;
  cursor: pointer;
  padding: 15px;
  border-radius: 4px;
}

#bottomBtn:hover {
  background-color: #555;
}

#cookie-law{width:100%;background:#09F;position:fixed;bottom:0;} 
#cookie-law p{padding:10px;font-size:0.85em;font-weight:lighter;text-align:center;color:#FFF;margin:0;}
#cookie-law a:link {text-decoration: none;color:#FF6;}
#cookie-law a:visited {text-decoration: none;color:#FFF;}
#cookie-law a:hover {text-decoration: none;color:#FFF;}
#cookie-law a:active {text-decoration: none;color:#FFF;}

.noradius { box-shadow: none;border-radius: 0px; border:none;}

/* Start of slide-out-side menu */
.sidebar {
  height: 100%;
  width: 0;
  position: fixed;
  z-index: 1;
  top: 0;
  left: 0;
  background-color: #111;
  overflow-x: hidden;
  transition: 0.5s;
  padding-top: 60px;
}

.sidebar a {
  padding: 8px 8px 8px 32px;
  text-decoration: none;
  font-size: 25px;
  color: #818181;
  display: block;
  transition: 0.6s;
}

.sidebar a:hover {
  color: #f1f1f1;
}

.sidebar .closebtn {
  position: absolute;
  top: 0;
  right: 25px;
  font-size: 36px;
  margin-left: 50px;
}

.openbtn {
  font-size: 20px;
  cursor: pointer;
  background-color: #636;
  color: white;
  padding: 10px 15px;
  border: none;
  position: fixed;
  left: 0px;
  top: 0px;
  z-index: 1;
  
}

.openbtn:hover {
  background-color: #444;
}

#main {
  transition: margin-left .5s;
  padding: 16px;
}

/* end of slide-out-side menu end */

.navbar {
  overflow: hidden;
  background-color: #069;  
  position: fixed;
  bottom: 0;
  width: 100%;
}

.navbar a {
  float: left;
  display: block;
  color: #FFF;
  text-align: center;
  padding: 5px 16px;
  text-decoration: none;
  font-size: 15px;
}

.navbar a:hover {
  background-color: #ddd;
  color: black;
}

.navbar a.active {
  background-color: #000;
  color: white;
}

.navbar .icon {
  display: none;
}


.dropdown-content a:hover {
    background-color: #ddd;
    color: black;
}

.dropdown:hover .dropdown-content {
    display: block;
}
/* end of dropdown dropdown */  

/* The Modal (background) */

.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  padding-top: 100px; /* Location of the box */
  padding-left:10px;
  padding-right:10px;
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0.1); /* Fallback color */
  background-color: rgba(0,0,0,0.1); /* Black w/ opacity */
    
}



/* Modal Content */
.modal-content {
  position: relative;
  background-color: #fefefe;
  margin: auto;
  padding: 0;
  border: 1px solid #888;
  max-width: 1000px;
  box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
  border-radius:8px;
  -webkit-animation-name: animatetop;
  -webkit-animation-duration: 0.8s;
  animation-name: animatetop;
  animation-duration: 0.8s
}



.modal-content a:link {text-decoration: none; color:#000;display:inline-block;}
.modal-content a:visited {text-decoration: none;color:#000;}
.modal-content a:hover {text-decoration: none;color:#666;}
.modal-content a:active {text-decoration: none;color:#000;}

/* Add Animation */
@-webkit-keyframes animatetop {
  from {top:-300px; opacity:0} 
  to {top:0; opacity:1}
}

@keyframes animatetop {
  from {top:-300px; opacity:0}
  to {top:0; opacity:1}
}

/* The Close Button */
.close {
  color: white;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

.modal-header {
  text-align:center;
  padding: 2px 16px;
  background-color: #FC0;
  color: white;
  border-radius:8px 8px 0 0;
}

.modal-body {padding: 2px 16px;}

.modal-footer {
  text-align:center;
  padding: 2px 16px;
  background-color: #FC0;
  color: white;
  border-radius:0 0 8px 8px ;
}

.modal-body h6 a {border: #000 thin solid;border-radius:8px;margin:0px;box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);}
.modal-body  h6 a:link {text-decoration: none; display: block; text-align:center; font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif;  font-size:1.0em; padding:5px; background-color:#33F; color:#FFF; line-height:1.4em;}
.modal-body h6 a:visited {text-decoration: none;   background-color:#33F; color:#FFF; }
.modal-body h6 a:hover {text-decoration: underline;background-color:#39F;color:#FFF;}
.modal-body h6 a:active {text-decoration: none;  background-color:#33F; color:#FFF; }


@media screen and (max-height: 450px) {
  .sidebar {padding-top: 15px;}
  .sidebar a {font-size: 18px;}
}

@media screen and (max-width: 600px) {
	

 .navbar a:not(:first-child) {display: none;}
  .navbar a.icon {
    float: right;
    display: block;
  }
  
  .navbar.responsive .icon {
    position: absolute;
    right: 0;
    bottom:0;
  }
  .navbar.responsive a {
    float: none;
    display: block;
    text-align: left;
  }
  }
  
  
@media only screen and (min-width:960px) {

.homecontent h1 {font-size:2.6em; text-align:center;margin:0;}
.homecontent h2 {font-size:1.3em;text-align:center;margin:0;} 

.picturearea {float:left; padding:10px; width:300px; text-align:center;}
.area-a {float:left; padding:10px;width:430px;} 
.box-main {width: 960px; padding: 5px;margin:0 auto;}
.picturearea {float:left; padding:5px; width:300px; height:270px; text-align:center;}
.picturearea2 {float:left; padding:5px; width:300px; height:300px; text-align:center;}

.content {width:310px; margin: 5px;padding:5px;float:left;}
.content75 {width: 600px; max-width:600px; margin:5px;padding: 5px; float:left;}

h6 a {display:inline-block; padding:20px;border: #000 thin solid;border-radius:8px;margin:5px; background-color:#F66; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);}
h6 a:link {text-decoration: none; display:inline-block;text-align:center; font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif;  font-size:1.0em; padding:5px; background-color:#00F; color:#FFF; line-height:1.4em;}
h6 a:visited {text-decoration: none; background-color:#00F;color:#FFF;}
h6 a:hover {text-decoration: none;background-color:#F66;color:#FFF;}
h6 a:active {text-decoration: none;background-color:#00F;color:#FFF;}



}


@media only screen and (min-width:1260px) {


.homecontent {clear:both;margin-top:0px;}

.box-main-top {width: 1060px; padding: 10px;margin:0 auto;}
.box-main-content {width: 1060px; padding: 10px;margin:0 auto;}

.widecontent {width: 1260px; padding: 0px;margin:0 auto;}
.box-main {width: 960px; padding: 10px; margin:0 auto;}
.box-left {width: 820px; padding: 10px;float:left;}
.box {width: 820px; padding: 10px;margin:0 auto;}
.box-right {width: 400px; padding: 10px; float:left;}

.picturearea {float:left; padding:10px; width:300px; text-align:center;}

.homecontent h1 {font-size:3em; text-align: center;margin:0;}
.homecontent h2 {font-size:1.3em;text-align: center;margin:0;} 	


h3 a:link {font-size:1.8em;}
h6 a:link {font-size:1.0em;}
.large {font-size:1.6em;}

#bottomBtn {
  display: none;
  position: fixed;
  bottom: 60px;
  right: 30px;
  z-index: 99;
  font-size: 18px;
  border: none;
  outline: none;
  background-color: #666;
  color: white;
  cursor: pointer;
  padding: 15px;
  border-radius: 4px;
}

#bottomBtn:hover {
  background-color: #555;
}

}

