
/* GLOBAL */

body, html { color:#000; }

h1 { font-size:26px; line-height:1.1em; color:#003333; margin:0 0 25px 0; font-family: 'Amatic SC', cursive; }
h2 { font-size:22px; line-height:1.1em; color:#003333; margin:0 0 15px 0; font-family: 'Amatic SC', cursive; }
h3 { font-size:16px; line-height:1.3em; color:#000; }

.uk-button { padding:5px 25px 3px 25px; color:#fff; font-size:20px; background-color:#4DA6C4; font-family: 'Roboto Slab', serif; border-bottom:4px solid #004568; text-decoration:none !important;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px; }
.uk-button:focus, .uk-button:hover { color:#fff; background-color:#004568; border-bottom:4px solid #4DA6C4; text-decoration:none; }

em { color:#000; font-weight:normal; }

hr { margin:2rem 0; width:100%; height:1px; border:none; background-color:#fff; border-top:1px solid #007e9b; }

a { color:#003333; text-decoration:none; }
a:focus { text-decoration:none; outline:none; }
a:hover { color:#003b6b; outline:none; text-decoration:none; }

img.align_right { float:right; margin:0 0 10px 20px; border:6px solid #fff; box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px; }
img.align_left { float:left; margin:0 20px 10px 0; border:6px solid #fff; box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px; }

.map {
    position: relative;
    padding-bottom: 30%;
    height: 0;
    overflow: hidden;
    margin:2px 0;
}
.map iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
}

.uk-lightbox { background:rgba(0,0,0,.85); }

#editpage { position: fixed; top: 4px; left: 49%;  z-index:9999; }
#editpage a { float:left; padding: 3px 6px 5px 6px; background: #db1174; color: #FFB8DB; display: block; font-weight: normal; font-size:14px; z-index:9999; margin:0 1px; text-decoration:none; line-height:1em; stroke-width:2px; 
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px; }
#editpage a:hover { background: #ffffcc; color: #000; text-decoration:none; }



/* HEADER & NAV */

.header { padding:15px 30px; background-color:#007e9b;
-webkit-box-shadow: 0px 4px 14px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 4px 14px 0px rgba(0,0,0,0.75);
box-shadow: 0px 4px 20px 0px rgba(0,0,0,0.6); }
.header .logo img { width:100%; max-width:200px; }
.header i { position:relative; top:-1px; margin-right:1px; }
.header a { color:#fff; text-transform:uppercase; font-size:22px; font-family: 'Amatic SC', cursive; }
.header a:hover { color:#fff; }

.uk-offcanvas-bar { background-color:#313131; }
.uk-offcanvas-bar .uk-nav-default > li > a { padding:8px 0; color:#fff; font-size:30px; line-height:1.2em; font-family: 'Amatic SC', cursive; };


/* HERO */

.hero { width:100%; max-width:100%; background-color:#000; }
.hero img { width:100%; max-width:100%; }


/* CONTENT */

.content { min-height:300px; padding:50px 30px 40px 30px; background-color:#dff0df; }
.layout { width:100%; max-width:1100px; margin:0 auto; }
.content a:hover { text-decoration:underline; }


/* CARD */

.boxes { margin:40px 0 40px 0; }
.boxes { padding-right:20px; }
.uk-card-default { padding:0; }
.uk-card-media-top img { width:100%; max-width:100%; }
.uk-card-body { padding:15px 20px; text-align:center; }
.uk-card-body h2 { margin-bottom:0; }
.uk-card-body p { margin:10px 0; }


/* FOOTER */
.footer { border-top:8px solid #007e9b; background-color:#000; }
.footer img { width:100%; max-width:100%; }


/* COPYRIGHT */

p.copyright { margin:0; padding:15px; font-size:13px; color:#fff; text-align:center; background-color:#007e9b; }
p.copyright span { padding:0 10px; }
p.copyright a { color:#fff; border-bottom:1px dotted #CDE3A5; }
p.copyright a:hover { color:#CDE3A5; text-decoration:none; border-color:#fff; }



/* MEDIA QUERIES */

/* min-width 480px, ultra small */
@media only screen and (min-width: 480px) {

}

/* min-width 640px, small screens */
@media only screen and (min-width: 640px) { 
  
    h1 { font-size:30px; }
    h2 { font-size:24px; }
    h3 { font-size:18px; }
  
}

/* min-width 960px, medium screens */
@media only screen and (min-width: 960px) { 

  h1 { font-size:36px; }
  h2 { font-size:30px; }
  h3 { font-size:20px; }
 
}


/* min-width 1024px, ipad */
@media only screen and (min-width: 1024px) { 

}


/* min-width 1200px, large screens */
@media only screen and (min-width: 1200px) { 

  h1 { font-size:40px; }
  h2 { font-size:32px; }
  
}

/* min-width 1400px */
@media only screen and (min-width: 1400px) { 

  h1 { font-size:44px; }
  h2 { font-size:34px; }

}

/* min-width 1600px, x-large screens */
@media only screen and (min-width: 1600px) { 

  
}


