*{padding:0;margin:0;box-sizing:border-box}
body{
font-family: Arial, Helvetica, sans-serif;
background-color:#FFF;    
}

nav{
width:100%;
background-color: #000;
box-shadow: 0 10px 5px #CCC;
-webkit-box-shadow: 0 10px 5px #CCC;
-moz-box-shadow: 0 10px 5px #CCC;
}

nav ul{
list-style-type: none;
overflow:hidden;
text-align:center;
background-color:#000;
}

nav li{
display:inline-block;
}

nav li a{
display: block;
color: white;
text-align: center;
padding: 6px 8px;
text-decoration: none;
}

nav .si{
float:right;
margin-right:10px;
}

nav .d{
color:#000;
float:left;
margin-left:10px;
}

nav li a:hover:not(.active){
background-color: #111;
}

nav .active{
background-color: #4CAF50;
}

nav .title{
color: white;
display:inline-block;
}

.settings{
width:60%;
margin:20px auto;
border-radius:10px;
background-color:#555;
}

.settings li{
padding:5px;
}

.mid{
font-weight:bold;
color:black;
width:50%;
margin-left:10%;
margin-top:5%;
}

.big{
font-size:36px;
margin-bottom:5%;
}

.med{
font-size:24px;
}

.main{
text-align:center;
margin-top:50px;
}

.main article{
margin:20px 25px;
text-align:left;
display:inline-block;
width:20%;
background-color:white;
border-radius:10px;
vertical-align:top;
height:270px;
padding:5px;
}

.main p{
height:60px;
}

.main ul{
height:90px;
list-style-type: none;
margin-left:15px;
}


.subheading{
display:inline-block;
margin:0 auto;
width:100%;
text-align:center;
font-size:28px;
height:60px;
margin-top:30px;
}

.main article footer{
text-align:center;
height:30px;
}

.long {
width:40%;
margin:80px auto;
height:300px;
background-color:white;
text-align:center;
border-radius:15px;
}

.long input[type="email"], input[type="password"]{
font-size:14px;
display:block;
margin:10px auto;
width:60%;
}

.xlong input[type="text"], input[type="number"], select {
font-size:14px;
display:block;
margin:10px auto;
width:60%;
}

.xxlong input[type="text"], input[type="number"], input[type="tel"], input[type="email"], select {
font-size:14px;
display:block;
margin:10px auto;
width:60%;
}

.long footer{
margin-top:20px;
}

.long, .xlong p{
text-align:left;
font-size:14px;
padding:15px;
}

.long, .xlong .title{
margin-top:30px;
margin-bottom:30px;
text-align:center;
font-size:24px;
}

.xxlong .title{
margin-top:30px;
text-align:center;
font-size:24px;
}

.info .title{
text-align:center;
display:block;
width:100%;
font-size:20px;
}

.seclong .title{
margin-top:30px;
margin-bottom:10px;
text-align:left;
font-size:30px;
}

.xlong {
width:40%;
margin:80px auto;
background-color:white;
text-align:center;
border-radius:15px;
}

.xxlong{
width:60%;
margin:80px auto;
height:auto;
border:1px solid #000;
background-color:#FFF;
border-radius:15px;
text-align:center;
}

.xxlong form{
text-align:left;
}

.short{
padding-top:20px;
text-align:center;
font-size:24px;
margin:0 auto;
background-color: #FFF;
border-bottom:1px solid #000;
}

.seclong{
text-align:left;
padding-left:30%;
display:block;
font-size:24px;
background-color:#FFF;
border-bottom:1px solid #000;
height:400px;
font-size:14px;
}

.seclong input[type="text"]{
font-size:20px;
padding:2px 5px;
width:40%;
}

.mini {
display:inline-block;
padding:0;
margin:0;
}

input[type="number"].short_sel, select.short_sel{
width:80px;
display:inline-block;
}

.xxlong input[type="text"], .shortxt{
width:20%;
display:inline-block;
}

input[type="tel"].shortxt, input[type="email"].shortxt{
width:30%;
display:inline-block;
}

.med_sel{
width:160px;
}

.medtxt{
display:inline-block;
margin-right:10px;
margin-left:15%;
}

.sl{
display:inline;
font-size:18px;
}

.p_inline{
display:inline-block;
margin-right:15px;
margin-left:15%;
}

.a_inline{
display:block;
margin:10px;
width:300px;
float:left;
text-decoration:none;
color:#000;
}

.xxlong textarea{
resize:none;
width:60%;
font-size:14px;
height:6em;
margin-left:15%;
}

.lower{
overflow:hidden;
margin-bottom:-1px;
}

.xxlong input[type="checkbox"]{
margin-left:15%;
}

#d0, #d1, #d2, #d3, #d4{
margin:0;
padding:10px;
border-top:1px solid black;
border-left:1px solid black;
border-bottom:1px solid black;
z-index:10;
border-radius:10px 10px 0 0;
background:#DDD;
}

#d3{
border-right:1px solid black;
}

input[type="submit"]{
padding:10px;
margin-left:15%;
}

.smallimg{
height:150px;
min-height:150px;
max-height:150px;
}

.imagebox{
height:250px;
width:267px;
max-width:267px;
overflow:hidden;
box-shadow: 3px 5px 5px #CCC;
-webkit-box-shadow: 3px 5px 5px #CCC;
-moz-box-shadow: 3px 5px 5px #CCC;
}

.midbox{
margin-right:10px;
margin-bottom:150px;
-ms-transform: scale(2);
-moz-transform: scale(2);
-webkit-transform: scale(2);
-o-transform: scale(2);
transform: scale(2);
}

.small_search{
text-align:right;
margin-top:20px;
width:100%;
}

.small_search input[type="text"]{
width:30%;
padding-left:5px;
margin-right:50px;
font-size:16px;
}
.mySlides {display:none;
overflow:hidden;
max-height:600px;}
.mySlides img {vertical-align: middle;}

.slides {
  max-width:800px;
  max-height:600px;
  overflow:hidden;
  position: relative;
  margin: auto;
  text-align:center;
  background-color:#ccc;
}

/* Next & previous buttons */
.prev, .next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  margin-top: -22px;
  padding: 16px;
  color: white;
  font-weight: bold;
  font-size: 18px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;
}

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

.prev{
    left:0;
}

/* 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);
}

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* Fading animation */
.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1.5s;
  animation-name: fade;
  animation-duration: 1.5s;
}

@-webkit-keyframes fade {
  from {opacity: .4}
  to {opacity: 1}
}

@keyframes fade {
  from {opacity: .4}
  to {opacity: 1}
}

.cb{
width:600px;
margin:0 auto;
padding:30px 15px;
}