/* Main */
@import url('https://fonts.googleapis.com/css?family=Raleway:400,100,200,300,500,600,700,800,900');
@import url('https://fonts.googleapis.com/css?family=Kalam:300,400');
@import url('http://netdna.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.css');
html {
    font-family: sans-serif;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
}
body {
    margin: 0;
}
article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {
    display: block;
}
audio, canvas, progress, video {
    display: inline-block;
    vertical-align: baseline;
}
audio:not([controls]) {
    display: none;
    height: 0;
}
[hidden], template {
    display: none;
}
a:active, a:hover {
    outline: 0;
}
abbr[title] {
    border-bottom: 1px dotted;
}
b, strong {
    font-weight: bold;
}
dfn {
    font-style: italic;
}
h1 {
    font-size: 2em;
}
mark {
    background: #ff0;
    color: #000;
}
small {
    font-size: 80%;
}
sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}
sup {
    top: -0.5em;
}
sub {
    bottom: -0.25em;
}
img {
    border: 0;
}
svg:not(:root) {
    overflow: hidden;
}
figure {
    margin: 1em 40px;
}
hr {
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    height: 0;
}
pre {
    overflow: auto;
}
code, kbd, pre, samp {
    font-family: monospace, monospace;
    font-size: 1em;
}
button, input, optgroup, select, textarea {
    color: inherit;
    font: inherit;
    margin: 0;
}
button {
    overflow: visible;
}
button, select {
    text-transform: none;
}
button, html input[type="button"], input[type="reset"], input[type="submit"] {
    -webkit-appearance: button;
    cursor: pointer;
}
button[disabled], html input[disabled] {
    cursor: default;
}
button::-moz-focus-inner, input::-moz-focus-inner {
    border: 0;
    padding: 0;
}
input {
    line-height: normal;
}
input[type="checkbox"], input[type="radio"] {
    box-sizing: border-box;
    padding: 0;
}
input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button {
    height: auto;
}
input[type="search"] {
    -webkit-appearance: textfield;
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
}
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
}
fieldset {
    border: 1px solid #c0c0c0;
    margin: 0 2px;
    padding: 0.35em 0.625em 0.75em;
}
legend {
    border: 0;
    padding: 0;
}
textarea {
    overflow: auto;
}
optgroup {
    font-weight: bold;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
td, th {
    padding: 0;
}
ul {
    -webkit-margin-before: 0;
    -webkit-margin-after: 0;
    -webkit-margin-start: 0;
    -webkit-margin-end: 0;
    -webkit-padding-start: 0;
}
html {
    font-size: 62.5%;
    box-sizing: border-box;
}
*, *:before, *:after {
    box-sizing: inherit;
}
body {
    margin: 0;
    padding: 0;
    font-size: 1.3rem;
    font-family: Raleway,Helvetica,Arial,sans-serif;
    line-height: 160%;
    font-weight: 300;
    color: #303030;
    background-color: white;
}
.container {
    margin: 0 auto;
}
h1, h2, h3, h4, h5, h6 {
    margin: 0;
    padding: 0;
}
img {
    display: block;
    max-width: 100%;
}
a {
    text-decoration: none;
    font-weight: 700;
    color: white;
}
/*a:hover {
  border-bottom: 2px solid white;
}*/
em {
    font-weight: 500;
    font-size: 110%;
    color: #73030C;
    font-style: normal;
}

/* Modules */
.header {
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-bottom: 3vh;
}
#home {
    background: linear-gradient( to bottom,
    rgba(0,0,0,.2),
    rgba(0,0,0,.5)),
    url('../images/main-graphic.jpg');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    height: 30vh;
    max-height: 500px;
    transition: all 0.5s ease;
}
#hotspot {
    background: linear-gradient( to bottom,
    rgba(0,0,0,.2),
    rgba(0,0,0,.5)),
    url('../images/hotspot-banner.jpg');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    height: 30vh;
    max-height: 500px;
    transition: all 0.5s ease;
}
#camping {
    background: url('../images/camp.jpg');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    height: 30vh;
    max-height: 500px;
    transition: all 0.5s ease;
    background-position: 10% 60%;
}
#restaurant {
    background: linear-gradient( to bottom,
    rgba(0,0,0,.2),
    rgba(0,0,0,.5)),
    url('../images/restaurant.jpg');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    height: 30vh;
    max-height: 500px;
    transition: all 0.5s ease;
    background-position: 0 70%;
}
#hotel {
    background: linear-gradient( to bottom,
    rgba(0,0,0,.1),
    rgba(0,0,0,.3)),
    url('../images/hotel.jpg');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    height: 30vh;
    max-height: 500px;
    transition: all 0.5s ease;
    background-position: 45% 50%;
}
#about {
    background: linear-gradient( to bottom,
    rgba(0,0,0,.2),
    rgba(0,0,0,.5)),
    url('../images/about.jpg');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    height: 30vh;
    max-height: 500px;
    transition: all 0.5s ease;
}
#retail {
    background: url('../images/retail.jpg');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    height: 30vh;
    max-height: 500px;
    transition: all 0.5s ease;
}
.tagline {
    display: none;
    position: relative;
    color: white;
    font-weight: 300;
    padding-left: 15vw;
    padding-top: 10vh;
    font-size: 2.5rem;
    z-index: 1;
}
@media screen and (min-width: 600px) {
    .tagline {
        display: block;/*max-width: 40em;
    line-height: 140%;
    font-size: 3rem;

    em {
      font-size: 140%;
      font-style: normal;
    }*/
    }
}
.nav {/*flex-direction: column;*/
    width: 100%;
    margin: 0 auto;
    font-size: 1em;
    background: #303030;/* nav-elements */
}
.nav .nav-elements .hamburger-wrapper {
    align-self: center;
    padding: 0 10px 0 10px;
}
.nav .nav-elements .branding {
    display: flex;
    position: relative;
    align-items: flex-start;
    padding: 3px;
}
.nav .nav-elements .logo {
    flex-grow: 1;
}
.nav .nav-elements .logo img {
    max-width: 60px;
    position: relative;
}
/* class applied when hamburger menu is clicked */
.nav .nav-elements div.is-open {
    display: block;
    background-color: #303030;
    border-top: 1px solid #B9B9B9;
}
.nav .nav-elements div.is-open >ul>li {
    background-color: #303030;
}
/* firefox weirdness */
.nav .nav-elements div.is-open ul {
    margin-bottom: 0;
}
/*transition: height 200ms ease-in;*/
.nav .nav-elements div.is-open >ul>li, .nav .nav-elements div.is-open .main-menu-item>li {/*constrain to top menu so drop down can be styled differently *//*background-color: #777;*/
    line-height: 150%;
    border-bottom: 1px solid #B9B9B9;
}
.nav .nav-elements div.is-open a:hover {
    color: #73030C;
}
.nav .nav-elements div.is-open .main-menu-item>a:hover {/* don't indicate item is clickable if it has a
                                   drop down list */
    color: white;
}
.nav .nav-elements div.is-open a:hover:after {
    width: 0;
}
/* end of div.is-open styling */
.nav .nav-elements .menu-elements {
    display: none;
    margin: 0;
    line-height: 100%;
}
/* firefox added margin to these  */
.nav .nav-elements .menu-elements #dd-icon {
    vertical-align: top;
}
.nav .nav-elements .menu-elements >ul {/* main menu only - don't want dropdown to be flex */
    list-style-type: none;
}
.nav .nav-elements .menu-elements #main-nav {}
.nav .nav-elements .menu-elements a {
    font-weight: 300;
    color: white;
    text-decoration: none;
    display: block;
    padding: 10px 10px 0 10px;
    transition: 1s ease-out;
}
.nav .nav-elements .menu-elements a:after {
    content: '';
    display: block;
    height: 3px;
    margin-top: 2px;
    width: 0;
    transition: width .3s ease-out, background-color .3s ease-out;
}
.nav .nav-elements .menu-elements a:hover {
    border-bottom: none;
}
.nav .nav-elements .menu-elements a:hover:after {
    width: 100%;
    background: white;
}
/*drop down list styling */
.nav .nav-elements .menu-elements .main-menu-item {
    position: relative;
}
.nav .nav-elements .menu-elements .main-menu-item>a:hover:after {/* don't indicate it's selectable */
    width: 0;
}
.nav .nav-elements .menu-elements .drop-down {
    display: none;
    position: relative;
    padding-left: 5vw;
    list-style: none;
    z-index: 99;/*z-index set because if there is an element beneath the drop down,
         it may cause the drop down to disappear when the cursor is over both */
}
.nav .nav-elements .menu-elements .main-menu-item:hover .drop-down, .nav .nav-elements .menu-elements .drop-down:hover {
    display: block;/*z-index: 100;*/
}
/* menu-elements */
.nav .nav-elements .menu-elements #main-nav, .nav .nav-elements .menu-elements #guest-nav {
    margin-top: 0;
    padding-left: 0;
}
@media screen and (min-width: 600px) {
    .nav {
        height: 45px;
        line-height: 45px;
    }
}
@media screen and (min-width: 600px) {
    .nav {
        padding: 1em 0 0 0;
        padding: .5em 0 0 .5em;
    }
}
@media screen and (min-width: 600px) {
    .nav .nav-elements {
        display: flex;/*align-items: flex-start;*//*justify-content: space-between;
      align-items:flex-start;*/
    }
}
@media screen and (min-width: 1200px) {
    .nav .nav-elements {
        width: 80%;
        max-width: 1200px;
    }
}
@media screen and (min-width: 600px) {
    .nav .nav-elements .hamburger-wrapper {
        display: none;
    }
}
@media screen and (min-width: 600px) {
    .nav .nav-elements .branding {
        padding: 5px;
    }
}
@media screen and (min-width: 600px) {
    .nav .nav-elements .logo img {
        max-width: 80px;
        margin-left: 10px;
        margin-top: -10px;
    }
}
@media screen and (min-width: 600px) {
    .nav .nav-elements div.is-open {/* only necessary if user expands from small
                         to larger screen like I do when testing if responsive*/
        display: flex;
        border: none;
        background-color: transparent;
    }
    .nav .nav-elements div.is-open a:hover:after {
        width: 100%;
    }
    .nav .nav-elements div.is-open a {
        background-color: #303030;
    }
    .nav .nav-elements div.is-open a:hover {
        color: white;
    }
    .nav .nav-elements div.is-open >ul>li, .nav .nav-elements div.is-open .main-menu-item>li {/*constrain to top menu so drop down can be styled differently */
        line-height: 100%;
        border-bottom: none;
        background-color: transparent;
    }
}
@media screen and (min-width: 600px) {
    .nav .nav-elements .menu-elements {
        width: 100%;
        padding: 0 1em;
        display: flex;/*flex-wrap: wrap;
        justify-content: flex-end;*/
    }
}
@media screen and (min-width: 600px) {
    .nav .nav-elements .menu-elements >ul {
        display: flex;
    }
}
@media screen and (min-width: 600px) {
    .nav .nav-elements .menu-elements #main-nav {
        flex-grow: 1;
    }
}
@media screen and (min-width: 600px) {
    .nav .nav-elements .menu-elements .drop-down {
        margin-top: 0;
        background: #303030;
        position: absolute;
        padding-left: 0;
        min-width: 160px;
        padding-bottom: 10px;
    }
}
.section {/*min-height: 40vh;*//*padding: 2% 0;*/
    display: flex;
    flex-direction: column;
    justify-content: center;
    line-height: 130%;
    font-size: 2rem;
}
.section .container {
    width: 90%;
    max-width: 1000px;
}
.section .headline {
    text-transform: uppercase;
    font-weight: 400;
    font-size: 3rem;/*margin-top: 3rem;*/
    line-height: 110%;
}
.section em, .section a {
    color: #73030C;
    font-size: 2.5rem;
    vertical-align: -6%;
}
@media screen and (min-width: 900px) {
    .section {
        justify-content: space-between;
    }
}
@media screen and (min-width: 600px) {
    .section .container {
        width: 80%;
    }
}
.footer {
    background: rgb(10, 10, 10);
    color: white;
    padding: 5px 0 5px 0;
    line-height: 100%;
}
.footer .branding {
    display: flex;
}
.footer .branding p {
    padding: 2px;
    margin: 0;
}
.footer .branding a {
    font-weight: 100;
}
.footer .branding .footer-logo {
    margin-left: 5px;
}
.footer .branding .footer-logo img {
    width: 70px;
}
.footer .branding .address {
    padding-top: 10px;
    font-size: .9em;
    letter-spacing: 1px;/*font-size: .9em;*/
}
.footer .branding .v-separator {
    content: "";
    border-right: 1px solid white;
    margin: 10px;
}
.footer .branding .fa-phone {
    padding-right: 3px;
}
.footer .branding .fa-envelope-o {
    padding-left: 7px;
    padding-right: 3px;
}
.footer .branding .street {
    display: inline-block;
}
.footer .branding .area {
    display: inline-block;
}
.footer .branding .phone {
    display: inline-block;
}
.footer .branding .email {
    display: inline-block;
}
.footer .legal {
    max-width: 700px;
    text-align: center;
    margin: 0 auto;
    font-size: .8em;
    margin-top: -10px;
}
@media screen and (min-width: 600px) {
    .footer .branding .address {
        font-size: 1em;
    }
}
@media screen and (min-width: 600px) {
    .footer .branding .v-separator {
        display: block;
    }
    .footer .branding .footer-logo {
        margin-left: 15px;
    }
    .footer .branding .address {
        padding-top: 15px;
    }
    .footer .branding .street, .footer .branding .area, .footer .branding .phone, .footer .branding .email {
        display: inline;
    }
}
.flex-form {
    max-width: 600px;
    margin: 30px auto 20px 10px;
}
.flex-form ul li {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin-bottom: 20px;
}
.flex-form input {
    flex: 1 0 220px;
}
.flex-form textarea {
    flex: 1 0 220px;
}
.flex-form #subject-list {
    flex: 1 0 220px;
    font-size: .6em;
}
.flex-form ul {
    list-style-type: none;
    padding: 0;
}
.flex-form label {
    flex: 1 0 120px;
    max-width: 180px;
}
.flex-form .message {
    align-self: flex-start;
}
@media screen and (min-width: 480px) {
    .flex-form #subject-list {
        font-size: .8em;
    }
}
@media screen and (min-width: 600px) {
    .flex-form #subject-list {
        font-size: 1em;
    }
}

/* Content */
#clients {
    margin-top: 0;
}
#clients #customers {
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
}
#clients .customer {
    width: 150px;
    height: auto;
    padding: 2%;
}
#clients #travelodge {
    padding-top: 20px;
    padding-bottom: 20px;
}
#clients h2 {
    font-size: 1.4em;
}
#clients .headline {
    padding-bottom: 0;
}
@media screen and (min-width: 600px) {
    #clients .customer {
        width: 200px;
    }
}
/* end feature card */
#feature {/*background: color($lightgray tint(20%));*/
    margin-top: 20px;/* end of .feature-cards */
}
#feature .headline {
    color: #73030C;
    padding-bottom: 2rem;
}
#feature a {
    color: rgb(104, 3, 11);
}
#feature .features-cards {
    margin: 0 auto;
    border-radius: 20px;/* end of .single-feature-card */
}
#feature .features-cards ul {
    list-style-type: none;/*list-style-position: inside;*/
}
/* firefox fix */
#feature .features-cards .card-text ul {
    padding-left: 0;
}
#feature .features-cards .feature-card {
    margin: 0 auto;
    max-width: 400px;
    border: 1px solid #B9B9B9;
    transition: all .2s ease-in;
    transform: scale(.9);
    box-shadow: 5px 5px 3px rgba(185, 185, 185, 0.2);
    border-radius: 20px 20px;
}
#feature .features-cards .feature-card:hover {
    transform: scale(1);
}
#feature .features-cards .card-info {
    border-radius: 20px 20px 0 0;
    padding: 20px 0 7px 0;
}
#feature .features-cards .card-info .card-name {
    font-size: 3rem;
    font-family: 'Kalam',Helvetica,Arial,sans-serif;
    line-height: 110%;
    color: #73030C;
    font-weight: 400;
    text-align: center;
}
#feature .features-cards .card-text {
    font-size: 1.8rem;
    font-weight: 400;
    line-height: 140%;
    background-color: white;
    margin: 0;
    padding-left: 5%;
    padding-right: 5%;
    padding-bottom: 20px;
    border-radius: 0 0 20px 20px;
    text-align: center;
}
#feature .features-cards .card-text em {
    color: rgb(176, 176, 176);
    font-size: 2.2rem;
}
#feature .features-cards .single-feature-card {/*width: 80%;*/
    width: 100%;
    padding: 0 1rem 1rem 1rem;
    border: 1px solid #B9B9B9;
    transition: all .2s ease-in;
    transform: scale(.9);
    box-shadow: 5px 5px 3px rgba(185, 185, 185, 0.2);/*background-color: white;*/
    border-radius: 20px 20px;
    line-height: 1.5em;
}
/*background-color: white;*/
#feature .features-cards .single-feature-card .card-text {
    text-align: left;
}
#feature .features-cards .single-feature-card .fa-check {
    color: #888;
    padding-right: 2%;
}
#feature .features-cards .single-feature-card:hover {
    transform: scale(1);
}
/* about page map */
#feature #map {
    margin: 0 auto;
    background: url('../images/small-map.png');
    background-repeat: no-repeat;
    transition: all 0.5s ease;
    border: 1px solid #73030C;
    margin-bottom: 40px;
}
@media screen and (min-width: 600px) {
    #feature .features-cards {
        display: flex;
        justify-content: center;
    }
}
@media screen and (min-width: 600px) {
    #feature .features-cards .feature-card {
        width: 50%;
    }
}
@media screen and (min-width: 1200px) {
    #feature .features-cards .feature-card {
        width: 45%;
    }
}
@media screen and (min-width: 600px) {
    #feature #map {
        background: url('../images/big-map.png');
        background-repeat: no-repeat;
        transition: all 0.5s ease;
        border: 1px solid #73030C;
    }
}
/* end of #feature */
#intro {
    font-size: 2rem;
}
/* overrides general setting of max-width */
#intro img {
    max-width: none;
}
#intro #intro-display {}
#intro #intro-graphic {
    margin: 0 auto;
}
#intro #intro-graphic img {
    margin: 0 auto;
    border-radius: 50%;
    border: 3px solid gray;
}
#intro #intro-graphic #image-caption {
    font-size: .8em;
    font-family: 'Kalam',Helvetica,Arial,sans-serif;
    text-align: center;
    line-height: 1.2em;
    padding: 0 10px;
}
#intro #intro-graphic #doctors-office {
    width: 300px;
}
#intro #intro-graphic #resort-camp {
    border-radius: 0;
    width: 270px;
    border: 2px solid #B9B9B9;
}
#intro #intro-graphic #restaurant-patron {
    margin: 0 auto;
    border-radius: 0;
    width: 200px;
}
#intro #intro-graphic #coffee-shop {
    margin: 0 auto 0 auto;
    border-radius: 5%;
    border: 3px solid #B9B9B9;
    width: 300px;
}
#intro #intro-content {
    line-height: 130%;
}
#intro #intro-charts {
    display: flex;
    justify-content: space-around;
    align-items: flex-start;
}
#intro #intro-charts em {
    font-size: 1.2em;
}
#intro #intro-charts .loader {
    padding: 20px;
    text-align: center;
}
#intro #intro-charts .loader-1-bg {
    background-image: url(/images/hotel-loader1-small.png);
    background-repeat: no-repeat;
    background-position: center;
    width: 150px;
    height: 150px;
    margin-left: 10px;
}
#intro #intro-charts .loader-2-bg {
    background-image: url(/images/hotel-loader2-small.png);
    background-repeat: no-repeat;
    background-position: center;
    width: 150px;
    height: 150px;
}
#intro #intro-charts #circularLoader-1, #intro #intro-charts #circularLoader-2 {/*   border: 10px solid gray; */
    border-radius: 50%;
    box-shadow: inset 0px 0px 0px 8px darkgray;
    box-sizing: border-box;
    background-color: lightgray;
    width: 100px;
    height: 100px;
}
#intro #intro-charts .percentage-caption {
    text-align: center;
    font-size: .7em;
}
@media screen and (min-width: 900px) {
    #intro #intro-display {
        display: flex;
        justify-content: space-between;
    }
}
@media screen and (min-width: 1390px) {
    #intro #intro-display {
        align-items: center;
    }
}
@media screen and (min-width: 600px) {
    #intro #intro-graphic {
        margin: 20px;
    }
}
@media screen and (min-width: 600px) {
    #intro #intro-graphic #resort-camp {
        width: 300px;
    }
}
@media screen and (min-width: 900px) {
    #intro #intro-graphic #resort-camp {
        width: 300px;
        margin-top: 70px;
        margin-left: 20px;
    }
}
@media screen and (min-width: 1200px) {
    #intro #intro-graphic #resort-camp {
        width: 400px;
        margin-top: 70px;
        margin-left: 20px;
    }
}
@media screen and (min-width: 600px) {
    #intro #intro-graphic #restaurant-patron {
        width: 300px;
    }
}
@media screen and (min-width: 900px) {
    #intro #intro-graphic #restaurant-patron {
        margin-top: 40px;
        margin-left: 30px;
    }
}
@media screen and (min-width: 900px) {
    #intro #intro-graphic #coffee-shop {
        margin-left: 40px;
        margin-top: 40px;
    }
}
@media screen and (min-width: 900px) {
    #intro #intro-graphic {/*padding-left: 5%;
      padding-top: 5%;*/
    }
}
@media screen and (min-width: 1390px) {
    #intro #intro-graphic {
        padding-top: 0;
    }
}
@media screen and (min-width: 900px) {
    #intro #intro-content {
        flex-grow: 1;
    }
}
@media screen and (min-width: 600px) {
    #intro #intro-charts .loader-1-bg {
        background-image: url(/images/hotel-loader1.png);
    }
}
@media screen and (min-width: 600px) {
    #intro #intro-charts .loader-2-bg {
        background-image: url(/images/hotel-loader2.png);
    }
}
@media screen and (min-width: 600px) {
    #intro #intro-charts #circularLoader-1, #intro #intro-charts #circularLoader-2 {
        width: 150px;
        height: 150px;
        box-shadow: inset 0px 0px 0px 12px darkgray;
    }
}
#contact-graphic {
    text-align: center;
    margin: 20px auto;
}
#contact-graphic img {
    width: 200px;
    border: 2px solid #303030;
    display: inline-block;
    border-radius: 50%;
}
@media screen and (min-width: 600px) {
    #contact-graphic img {
        width: 300px;
    }
}
#intro #intro-display #intro-content {
    align-self: flex-start;
}
#intro #intro-display #intro-graphic {
    align-self: flex-start;
}
#access {
    margin-top: 1em;
}
#access .access-type-content {
    display: flex;
}
#access .container>h2 {
    margin-bottom: 1em;
}
#access .access-heading {
    padding: 1em 1em 0 1em;
    display: flex;
    align-items: flex-end;
    line-height: 150%;/*.access-heading-image {
      font-size: .2em;
      color: white;
      width: 70px;
      height: 70px;
      background-color: $darkgray;
      background-image: linear-gradient($lightgray, white);
      margin-right: 1em;
      @media $medium {
        display: none;
      }*/
}
#access .access-type {
    margin: 0 auto 1em auto;
    max-width: 800px;
    border: 1px solid #B9B9B9;
    transition: all .2s ease-in;
    box-shadow: 5px 5px 3px rgba(185, 185, 185, 0.2);
    border-radius: 20px 20px;
}
#access .access-type-content {
    padding: 0 1em 1em 1em;
    line-height: 130%;
}
#access .access-type-graphic {
    display: none;
    min-width: 200px;
    height: 200px;
    background-color: #B9B9B9;
    background-image: linear-gradient(#B9B9B9, white);
    margin: 1em;
}
#access .access-type-graphic img {/*border-radius: 10px 10px 10px 10px;*/
    border: 2px solid #B9B9B9;
}
#access #fun-fact {
    font-size: .8em;
    color: #73030C;
    line-height: 110%;
}
#access #all-access-header {
    font-family: 'Kalam',Helvetica,Arial,sans-serif;
    font-size: 1.2em;
    margin: 30px 0 20px 0;
    line-height: 110%;
}
#access #access-features {
    padding-bottom: 20px;
}
#access #access-features p {
    font-size: .8em;
}
#access #access-features p:before {
    content: '\2713';
    color: #73030C;
    font-size: 1.3em;
    padding-right: .3em;
}
@media screen and (min-width: 900px) {
    #access .access-type-graphic {
        display: block;
    }
}
@media screen and (min-width: 600px) {
    #access #all-access-header {
        font-size: 1.6em;
        text-align: center;
    }
}
@media screen and (min-width: 600px) {
    #access #access-features {
        text-align: center;
    }
}
#contact-us a {
    text-decoration: underline;
}
#venue ul li:before {
    content: '\2713';
    color: #73030C;
    font-size: 1.3em;
    padding-right: .3em;
}
#cta-band {
    margin: 10px 5px;
}
@media screen and (min-width: 480px) {
    #cta-band {
        margin: 10px 0;
    }
}
#call-to-action {
    position: relative;
    margin: 0 auto;
    width: 300px;
    padding: 45px 0;
}
#call-to-action p {
    margin-left: 95px;
    font-family: 'Kalam',Helvetica,Arial,sans-serif;
    font-size: 14px;
    color: #73030C;
    margin-top: -8px;
}
@media screen and (min-width: 480px) {
    #call-to-action {
        width: 470px;
    }
}
@media screen and (min-width: 480px) {
    #call-to-action p {
        font-size: 18px;
        margin-top: 1em;
    }
}
#wifi-symbol {
    cursor: pointer;
    position: absolute;
    top: -35px;
    left: 100px;/*top: 20%;*/
    display: inline-block;
    width: 40px;
    height: 40px;/*margin-top: 0 - $size - $size*0.25;*/
    -ms-transform: rotate(-45deg) translate(-100px);
    -moz-transform: rotate(-45deg) translate(-100px);
    -o-transform: rotate(-45deg) translate(-100px);
    -webkit-transform: rotate(-45deg) translate(-100px);
    transform: rotate(-45deg) translate(-100px);
}
#wifi-symbol .wifi-circle {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    display: block;
    width: 100%;
    height: 100%;/*font-size:8.6px;*/
    position: absolute;
    bottom: 0;
    left: 0;/*font size set to size divided by 7 - circle border set to ems*/
    font-size: 5.7px;
    border-color: black;
    border-style: solid;
    border-width: 1em 1em 0 0 ;
    -webkit-border-radius: 0 100% 0 0;
    border-radius: 0 100% 0 0;
    opacity: 0;
    -o-animation: wifianimation 3s infinite;
    -moz-animation: wifianimation 3s infinite;
    -webkit-animation: wifianimation 3s infinite;
    animation: wifianimation 3s infinite;
}
#wifi-symbol .wifi-circle.first {
    -o-animation-delay: 800ms;
    -moz-animation-delay: 800ms;
    -webkit-animation-delay: 800ms;
    animation-delay: 800ms;
}
#wifi-symbol .wifi-circle.second {
    width: 5em;
    height: 5em;
    -o-animation-delay: 400ms;
    -moz-animation-delay: 400ms;
    -webkit-animation-delay: 400ms;
    animation-delay: 400ms;
}
#wifi-symbol .wifi-circle.third {
    width: 3em;
    height: 3em;
}
#wifi-symbol .wifi-circle.fourth {
    width: 1em;
    height: 1em;
    opacity: .4;
    -o-animation: none;
    -moz-animation: none;
    -webkit-animation: none;
    animation: none;
}
@media screen and (min-width: 480px) {
    #wifi-symbol {
        width: 50px;
        height: 50px;
    }
}
@media screen and (min-width: 480px) {
    #wifi-symbol .wifi-circle {
        font-size: 7.1px;
    }
}
#cta-band.no-top-margin {
    margin-top: 0;
}
@-o-keyframes wifianimation {
    0% {
        opacity: 0.4;
    }
    5% {
        opactiy: 1;
    }
    6% {
        opactiy: 0.4;
    }
    100% {
        opactiy: 0.1;
    }
}
@-moz-keyframes wifianimation {
    0% {
        opacity: 0.4;
    }
    5% {
        opactiy: 1;
    }
    6% {
        opactiy: 0.4;
    }
    100% {
        opactiy: 0.1;
    }
}
@-webkit-keyframes wifianimation {
    0% {
        opacity: 0.4;
    }
    5% {
        opactiy: 1;
    }
    6% {
        opactiy: 0.4;
    }
    100% {
        opactiy: 0.1;
    }
}

/*# sourceMappingURL=style.css.map */