@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
@import 'tinymce.css';
:root {
    --color-dark:rgba(21, 57, 73, 1);
    --color-medium:rgba(33, 125, 130, 1);
    --color-orange:rgba(241, 99, 50, 1);
    --width-layout:1160px;
    --nav-height:85px;
    --dropshadow:0px 3px 3px rgba(0,0,0,0.2);
    --radius-small:12px;
    --radius-medium:24px;
}
html, body, input, textarea, select, button {
    position:relative;
    margin:0px;
    padding:0px;
    font-family: 'Montserrat', sans-serif;
    font-size:1em;
    background-color:#ECECEC;
}
.navopen { overflow:hidden; }
div, p { position:relative; }
p, ul, ol { line-height:1.6em; }
a { color:var(--color-medium); }
h1 { color:var(--color-dark); }
h2 { color:var(--color-dark); }
button {
    color:#ffffff;
    background-color:var(--color-medium); 
    border:1px solid var(--color-dark);
    outline:none;
    cursor:pointer;
}
input, textarea, select, button {
    padding:5px;
}
input[type="submit"] {
    color:#ffffff;
    background-color:var(--color-medium);
    border:1px solid var(--color-dark);
    cursor:pointer;
}
input::placeholder {
    color:rgba(0, 0, 0, 0.8);
    font-weight:300;
}
/* Quote */
.quote {
    font-size:1.4em;
    font-weight:300;
}
/* Gradient */
.gradient {
    color:#ffffff;
    background:linear-gradient(90deg,rgba(21, 57, 73, 1) 0%, rgba(33, 125, 130, 1) 100%);
}
.gradient a {
    color:#ffffff;
}
.gradient a:hover {
    color:var(--color-orange);
}
.gradient h1 {
    color:#ffffff;
}
/* Reusable */
.rounded { 
    border-radius:var(--radius-medium); 
}
.background {
    position:absolute;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
}
/* Buttons */
.btns {
    position:relative;
    float:left;
    display:flex;
    justify-content:flex-start;
    gap:20px;
}
.btn {
    border-radius:var(--radius-small);
    cursor:pointer;
    padding:10px;
    transition:all linear 0.2s;
    text-decoration:none;;
}
.btn.light {
    background-color:var(--color-orange);
    border:1px solid var(--color-orange);
    color:#ffffff;
}
.btn.light:hover {
    background-color:#ffffff;
    color:var(--color-orange);
}
.btn.dark {
    background-color:var(--color-dark);
    border:1px solid #ffffff;
    color:#ffffff;
}
.btn.dark:hover {
    background-color:#ffffff;
    color:var(--color-dark);
}
/* Shades */
.shade-light {
    background-color:#ECECEC;
}
.shade-dark {
    background-color:#D9D9D9;
}
/* Spread */
.spread {
    position:relative;
    float:left;
    width:100%;
    padding-top:25%;
}
.spread .inside {
    position:absolute;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
}
.spread .inside iframe {
    position:absolute;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
    border:none;
}
.divider {
    position:relative;
    float:left;
    width:100%;
    height:80px;
}
#body {
    position:relative;
    float:left;
    width:100%;
}
#header {
    position:relative;
    float:left;
    width:100%;
}
.big-text {
    font-size:1.4em;
}
/* Page Title */
.page-title {
    margin:60px 0px 30px 0px;
}
/* Intro */
.intro {
    position:relative;
    float:left;
    width:100%;
    display:flex;
    justify-content:space-between;
    gap: 40px;
}
.intro .column {
    position:relative;
    float:left;
    display:flex;
    align-items:center;
    justify-content:center;
}
.intro img {
    max-width:530px;
}
/* Frequently Asked Questions */
#faq .item {
    border-bottom:1px solid black;
}
#faq .item .question { 
    cursor:pointer; 
}
#faq .item .question .line {
    pointer-events:none;
    display:flex;
    justify-content:space-between;
}
#faq .item .question .title {
    pointer-events:none;
}
#faq .item .question .line .icon {
    pointer-events:none;
    display:flex;
    justify-content:center;
    align-items:center;
    font-size:2em;
    color:var(--color-medium);
    transform-origin:center center;
    transition:all linear 0.2s;
}
#faq .item.active .question .line .icon {
    color:var(--color-dark);
    transform:rotate(90deg);
}
#faq .item .answer {
    position:relative;
    display:none;
    justify-content:space-between;
    gap:20px;
}
#faq .item .answer .text {
    position:relative;
    width:100%;
    max-width:100%;
}
#faq .item.active .answer {
    position:relative;
    display:flex;
    width:100%;
    max-width:100%;
    flex-direction:column;
}
#faq .item .answer .image {
    width:100%;
    max-width:100%;
}
#faq .item .answer .image img {
    position:relative;
    display:block;
    width:100%;
    max-width:100%;
    margin:0px 0px 30px 0px;
    border-radius:var(--radius-medium);
}

/* Navigation Bar */
#nav {
    position:fixed;
    top:0px;
    left:0px;
    width:100%;
    height:var(--nav-height);
    background-color:#ffffff;
}
/* Navigation */
.nav-ghost {
    position:relative;
    float:left;
    width:100%;
    height:var(--nav-height);
}
.nav {
    position:relative;
    float:left;
    width:100%;
    height:var(--nav-height);
    display:flex;
    gap:20px;
    justify-content:space-between;
    background-color:#ffffff;
}
.nav .menu {
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:20px;
}
.nav .menu a {
    text-decoration:none;
}
.nav .menu a.active {
    font-weight:bold;;
}
.nav .menu a:last-child {
    background-color:var(--color-medium);
    color:#ffffff;
    padding:5px 20px;
    border-radius:20px;
    font-weight:bold;
    filter:drop-shadow(var(--dropshadow));
}
.nav .logo {
    display:flex;
    align-items:center;
    justify-content:flex-start;
}
.nav .logo img {
    height:60px;
}
.nav .navicon {
    display:none;
    min-width:var(--nav-height);
    cursor:pointer;
    justify-content:center;
    align-items:center;
    font-size:2em;
}
.nav .navicon .fa-bars {
    display:block;
}
.navopen .nav .navicon .fa-bars {
    display:none;
}
.nav .navicon .fa-close {
    display:none;
}
.navopen .nav .navicon .fa-close {
    display:block;
}
/* Navigation Menu */
.navmenu {
    position:fixed;
    top:100vh;
    left:0px;
    width:100%;
    height:calc(100% - var(--nav-height));
    background-color:#ffffff;
    display:flex;
    align-items:center;
    justify-content:center;
    transition:all ease-out 0.3s;
}
.navmenu .list {
    position:relative;
    float:left;
    width:calc(100% - 40px);
    max-width:var(-100% - 40px);
    margin:20px;
    display:flex;
    flex-direction:column;
    gap:20px;
    align-items:center;
    justify-content:center;
}
.navmenu .list a {
    text-decoration:none;
    font-size:1.6em;
    font-weight:400;
    color:var(--color-dark);
    transition: all linear 0.2s;
}
.navmenu .list a:hover {
    color:var(--color-orange);
}
.navopen .navmenu {
    top:var(--nav-height);
}
/* Centered */
.centered {
    position:relative;
    float:left;
    width:100%;
    display:flex;
    justify-content:center;
}
.limited {
    position:relative;
    margin:0px auto;
    width:100%;
    max-width:var(--width-layout);
    margin:0px 40px;
}
.inset {
    position:relative;
    float:right;
    width:530px;
    margin:0px 0px 40px 40px;
}
.inset.small {
    width:265px;
}

/* Contact */
.contact {
    position:relative;
    float:left;
    width:100%;
    display:flex;
    gap:40px;
}
.contact .column img {
    display:block;
    width:300px;
}
/* Points of Interest  */
.pois {
    position:relative;
    float:left;
    width:100%;
    display:flex;
    justify-content:space-between;
    gap:40px;
    margin:0px 0px 40px 0px;
}
.pois .poi {
    position:relative;
    float:left;
    width:100%;
    border-radius:var(--radius-medium);
    padding:0px 20px 0px 20px;
    background-color:#ffffff;
    filter:drop-shadow(0px 5px 5px rgba(0,0,0,0.2));
}
/* Footer */
.footer {
    position:relative;
    float:left;
    width:100%;
}
.footer .columns {
    position:relative;
    float:left;
    width:calc(100% - 40px);
    max-width:var(--content-max-width);
    display:flex;
    flex-flow:row wrap;
    justify-content:space-between;
    gap:60px;
    margin:0px 20px 40px 20px;
    padding:80px 0px 0px 0px;
}
.footer .quote .line {
    position:relative;
    float:left;
    width:100%;
    height:1px;
    background-color:var(--color-text);
}
.footer .columns .column h3 {
    margin:0px;
    padding:0px;
}
.footer .columns .column .quote {
    padding:0px 0px 20px 0px;
    border-bottom:1px solid #ffffff;
}
.footer .columns .column ul {
    list-style-type:none;
    margin:0px;
    padding:0px;
}
.footer .columns .column ul li a {
    text-decoration:none;
}
/* Form */
form {
    display:flex;
    flex-direction:column;
    gap:10px;
}
form .line {
    position:relative;
    float:left;
    width:100%;
    display:block;
}
form .line.flex {
    display:flex;
    justify-content:flex-start;
    gap:10px;
}
form h3 {
    margin:20px 0px 0px 0px;
    padding:0px;
}
form input, form textarea, form select {
    position:relative;
    float:left;
    width:calc(100% - 20px);
    height:30px;
    border-radius:15px;
    border:1.5px solid rgba(0,0,1,1);
    padding:0px 15px 0px 15px;
    background-color:#ffffff;
}
form select {
    width:calc(100% + 10px);
}
form textarea {
    padding:15px 15px 15px 15px;
}
form input[type="checkbox"]{
    position:relative;
    float:left;
    width:20px;
    height:20px;
    margin:0px 0px 0px 0px;
    font-size:1.6em;
}
form p {
    position:relative;
    margin:0px;
    padding:0px;
}
form input[type="submit"]{
    width:auto;
    background-color:var(--color-orange);
    border:1px solid var(--color-orange);
    font-weight:bold;
}
/* Stories */
.stories {
    position:relative;
    float:left;
    width:100%;
    display:flex;
    flex-direction:column;
    gap:40px;
    margin:0px 0px 0px 0px;
}
.stories .story {
    position:relative;
    float:left;
    width:calc(100% - 20px);
    padding:0px 20px 0px 0px;
    display:flex;
    flex-flow:row;
    justify-content:space-between;
    gap:20px;
    background-color:#ffffff;
    border:1px solid rgba(0,0,0,1);
    border-radius:var(--radius-medium);
}
.stories .story .icon {
    display:flex;
    align-items:center;
    justify-content:center;
    border-right:1px solid rgba(0,0,0,1);
}
.stories .story .icon img {
    width:150px;
    margin:20px;
}
.stories .story .data {
    display:flex;
    flex-flow:row wrap;
    width:100%;
}
.stories .story .data .heading {
    display:flex;
    flex-flow:row;
    justify-content:space-between;
    width:100%;
}
.stories .story .data .title {
    position:relative;
    float:left;
    /* width:100%; */
}
.stories .story .data .locations {
    margin:20px 0px 20px 10px;
}
.stories .story .data .desc {
    position:relative;
    float:left;
    width:100%;
    margin:0px 0px 20px 0px;
}
.stories .story .data .date {
    position:relative;
    float:left;
    width:100%;
    margin:10px 0px 0px 0px;
}
.stories .story .data .btns {
    position:relative;
    float:left;
    width:100%;
    justify-content:flex-end;
    margin:0px 0px 20px 0px;
}

/* Media Queries */

@media(max-width:1260px) {
    .nav .menu {display:none;}
    .nav .navicon {display:flex;}
}
@media(max-width:890px) {
    .inset { width:100%; }
    .inset.small { width:100%; }
    .intro { flex-direction:column; }
    .intro .column img { max-width:100%; width:calc(100% - 80px); }
}
@media(max-width:810px) {
    .contact { display:block; }
    .contact .column img { width:100%; }
}
@media(max-width:610px) {
    .intro .column img { display:none; }
    .pois { flex-direction:column; }
    .pois .poi { width:calc(100% - 40px); }
}
@media(max-width:525px) {
    .nav .logo img {
        height:60px;
    }
}
@media(max-width:450px) {
    .nav .logo img {
        height:20px;
    }
}

/* Clown World Stuff */

ul li {
    list-style-image:url('/site/templates/images/ICON-ROUTE67.png');
}
.tags {
    position:relative;
    display:flex;
    flex-flow:row wrap;
    gap:30px;
}
.tags .tag {
    position:relative;
}