#contact_area {
    background-repeat: no-repeat;
    position: relative;
    margin: 0 auto;
    width: 630px;
    height: 630px;
    /*overflow: hidden;*/
    /*margin-top: 7%;*/
}

#interact {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -91px;
    margin-left: -91px;
    width: 172px;
    height: 172px;
    border: 5px solid #a7a7a7;
    background: rgba( 255, 255, 255, 1);
    background: -webkit-radial-gradient(ellipse at center, rgba(255,255,255,0.1) 40%,rgba(51,51,51,1) 100%);
    background: -moz-radial-gradient(ellipse at center, rgba(255,255,255,0.1) 40%,rgba(51,51,51,1) 100%);
    background: -ms-radial-gradient(ellipse at center, rgba(255,255,255,0.1) 40%,rgba(51,51,51,1) 100%);
    background: radial-gradient(ellipse at center, rgba(255,255,255,0.1) 40%,rgba(111,111,111,0.5) 100%);
    border-radius: 100%;
    box-shadow: 0 0 0 0.4em rgb(0 0 0), 0 0 0em 0.1em rgb(2 2 2), inset 0 0.1em 0 0 rgb(91 91 91);
    text-align: center;
    z-index: 2;
    -webkit-transition: background-color 750ms linear;
    -moz-transition: background-color 750ms linear;
    -o-transition: background-color 750ms linear;
    -ms-transition: background-color 750ms linear;
    transition: background-color 750ms linear;
}


#interact.drop-target{
    background-color: #B10014;
}


#interact.contact_form{
    background-color: #B10014;
}
#interact.email{
    background-color: #006f83;
}
#interact.location{
    background-color: #5f8213;
}
#interact.quotation {
    background-color: #8a9b0f;
}
#interact.email {
    background-color: #2f5df2;
}
#interact.facebook {
    background-color: #3b5998;
}
#interact.twitter {
    background-color: #00aced;
}
#interact.pinterest {
    background-color: #cb2027;
}
#interact.location {
    background-color: #f8ca00;
}
#interact.info {
    background-color: #FF9900;
}

#interact p {
    position: relative;
    margin: 75px auto 0;
    display: inline-block;
    color: #222;
    font-family: 'Pathway Gothic One',Arial,sans-serif;
    font-size: 28px;
    font-weight: bold;
    line-height: 20px;
    text-transform: uppercase;
}

#interact p.fadeIn {
    color: #000;
}
#interact.contact_form p.fadeIn3, #interact.quotation p.fadeIn3, #interact.email p.fadeIn3,
#interact.facebook p.fadeIn3, #interact.twitter p.fadeIn3, #interact.pinterest p.fadeIn3, #interact.location p.fadeIn3, #interact.info p.fadeIn3
{
    color: #fff;
}

.acts {
    /*transform-origin: center center;*/
    /*transform-style: preserve-3D;*/
    /*position: absolute;*/
    /*width: 600px;*/
    /*height: 600px;*/
    /*z-index: 199;*/
}
.act {
    display: block;
    cursor: pointer;
    position: absolute;
    background-color: #666;
    width: 60px;
    height: 60px;
    border: 2px solid #a7a7a7;
    z-index: 200;
    top: 50%;
    left: 50%;
    margin-left: -36px;
    margin-top: -36px;
    background: rgba( 255, 255, 255, 1);
    background: -webkit-radial-gradient(ellipse at center, rgba(255,255,255,1) 40%,rgba(51,51,51,0.5) 100%);
    background: -moz-radial-gradient(ellipse at center, rgba(255,255,255,1) 40%,rgba(51,51,51,0.5) 100%);
    background: -ms-radial-gradient(ellipse at center, rgba(255,255,255,1) 40%,rgba(51,51,51,0.5) 100%);
    background: radial-gradient(ellipse at center, rgba(255,255,255,1) 40%,rgba(51,51,51,0.5) 100%);
    border-radius: 100%;
    box-shadow: 0 0 0 0.4em rgb(0 0 0), 0 0 0em 0.3em rgb(2 2 2), inset 0 0.2em 0 0 rgb(91 91 91);
}


.act.hover {
    -webkit-transition: background-color 250ms linear;
    -moz-transition: background-color 250ms linear;
    -o-transition: background-color 250ms linear;
    -ms-transition: background-color 250ms linear;
    transition: background-color 250ms linear;	
}
.act.siblinghover {
    -webkit-transform: scale(0.8);
    -moz-transform: scale(0.8);
    -o-transform: scale(0.8);
    transform: scale(0.8);
}
.circulate_on {

}
.act.contact_form {
    top: 15%;
}
.act.contact_form.hover, .act.contact_form.hovere {
    background-color: #B10014;
}
.act.quotation {
    top: 25.5%;
    left: 74%;
}
.act.quotation.hover, .act.quotation.hovere {
    background-color: #8a9b0f;
}
.act.email {
    left: 85%;
}
.act.email.hover, .act.email.hovere {
    background-color: #2f5df2;
}
.act.facebook {
    top: 74%;
    left: 75%;
}
.act.facebook.hover, .act.facebook.hovere {
    background-color: #3b5998;
}
.act.twitter {
    top: 85%;
}
.act.twitter.hover, .act.twitter.hovere {
    background-color: #00aced;
}
.act.pinterest {
    left: 25%;
    top: 74%;
}
.act.pinterest.hover, .act.pinterest.hovere {
    background-color: #cb2027;
}
.act.location {
    top: 50%;
    left: 15%;
}
.act.location.hover, .act.location.hovere {
    background-color: #f8ca00;
}
.act.location.hover {
    background-color: #5f8213;
}
.act.info {
    top: 25%;
    left: 25%;
}
.act.info.hover, .act.info.hovere {
    background-color: #FF9900;
}



@-webkit-keyframes hovere {
    0% { -webkit-transform: scale(1); }	
50% { -webkit-transform: scale(1.1); }
100% { -webkit-transform: scale(1); }
}
@-moz-keyframes hovere {
    0% { -moz-transform: scale(1); }	
50% { -moz-transform: scale(1.1); }
100% { -moz-transform: scale(1); }
}
@-o-keyframes hovere {
    0% { -o-transform: scale(1); }	
50% { -o-transform: scale(1.1); }
100% { -o-transform: scale(1); }
}
@keyframes hovere {
    0% { transform: scale(1); }	
50% { transform: scale(1.1); }
100% { transform: scale(1); }
}




@-webkit-keyframes spinSteady {
    0% { -webkit-transform: rotate(0deg) scale(0); }
    100% { -webkit-transform: rotate(360deg) scale(1); }
}
@-moz-keyframes spinSteady {
    0% { -moz-transform: rotate(0deg) scale(0); }
    100% { -moz-transform: rotate(360deg) scale(1);}
}
@-o-keyframes spinSteady {
    0% { -o-transform: rotate(0deg) scale(0); }
    100% { -o-transform: rotate(360deg) scale(1); }
}
@keyframes spinSteady {
    0% { transform: rotate(0deg) scale(0); }
    100% { transform: rotate(360deg) scale(1); }
}


@-webkit-keyframes fadeIn2 {
	0% {opacity: 0;}
	100% {opacity: 1;}
}

@-moz-keyframes fadeIn2 {
	0% {opacity: 0;}
	100% {opacity: 1;}
}

@-o-keyframes fadeIn2 {
	0% {opacity: 0;}
	100% {opacity: 1;}
}

@keyframes fadeIn2 {
	0% {opacity: 0;}
	100% {opacity: 1;}
}

.animated.fadeIn2 {
	-webkit-animation-name: fadeIn2;
	-moz-animation-name: fadeIn2;
	-o-animation-name: fadeIn2;
	animation-name: fadeIn2;
}

.act {
    -webkit-animation-name: bounceIn;
    -moz-animation-name: bounceIn;
    -o-animation-name: bounceIn;
    animation-name: bounceIn;
}

/*.act:nth-child(1) {*/
    /*-webkit-animation-delay:0.1s;*/
    /*-moz-animation-delay:0.1s;*/
    /*-o-animation-delay:0.1s;*/
    /*animation-delay:0.1s;*/
/*}*/
/*.act:nth-child(2) {*/
    /*-webkit-animation-delay:0.3s;*/
    /*-moz-animation-delay:0.3s;*/
    /*-o-animation-delay:0.3s;*/
    /*animation-delay:0.3s;*/
/*}*/
/*.act:nth-child(3) {*/
    /*-webkit-animation-delay:0.5s;*/
    /*-moz-animation-delay:0.5s;*/
    /*-o-animation-delay:0.5s;*/
    /*animation-delay:0.5s;*/
/*}*/
/*.act:nth-child(4) {*/
    /*-webkit-animation-delay:0.7s;*/
    /*-moz-animation-delay:0.7s;*/
    /*-o-animation-delay:0.7s;*/
    /*animation-delay:0.7s;*/
/*}*/
/*.act:nth-child(5) {*/
    /*-webkit-animation-delay:0.9s;*/
    /*-moz-animation-delay:0.9s;*/
    /*-o-animation-delay:0.9s;*/
    /*animation-delay:0.9s;*/
/*}*/
/*.act:nth-child(6) {*/
    /*-webkit-animation-delay:1.1s;*/
    /*-moz-animation-delay:1.1s;*/
    /*-o-animation-delay:1.1s;*/
    /*animation-delay:1.1s;*/
/*}*/
/*.act:nth-child(7) {*/
    /*-webkit-animation-delay:1.3s;*/
    /*-moz-animation-delay:1.3s;*/
    /*-o-animation-delay:1.3s;*/
    /*animation-delay:1.3s;*/
/*}*/
/*.act:nth-child(8) {*/
    /*-webkit-animation-delay:1.5s;*/
    /*-moz-animation-delay:1.5s;*/
    /*-o-animation-delay:1.5s;*/
    /*animation-delay:1.5s;*/
/*}*/


@-webkit-keyframes fadeIn3 {
    0% {opacity: 0;}
    100% {opacity: 1;}
}

@-moz-keyframes fadeIn3 {
    0% {opacity: 0;}
    100% {opacity: 1;}
}

@-o-keyframes fadeIn3 {
    0% {opacity: 0;}
    100% {opacity: 1;}
}

@keyframes fadeIn3 {
    0% {opacity: 0;}
    100% {opacity: 1;}
}

.animated.fadeIn3 {
    -webkit-animation-name: fadeIn3;
    -moz-animation-name: fadeIn3;
    -o-animation-name: fadeIn3;
    animation-name: fadeIn3;
    -webkit-animation-delay:0.2s;
    -moz-animation-delay:0.2s;
    -o-animation-delay:0.2s;
    animation-delay:0.2s;
}

.hovere {
    -webkit-animation-name: hovere;
    -moz-animation-name: hovere;
    -o-animation-name: hovere;
    animation-name: hovere;
    -webkit-animation-duration: 0.255s;
    -moz-animation-duration: 0.255s;
    -o-animation-duration: 0.255s;
    animation-duration: 0.255s;
    -webkit-animation-iteration-count: infinite;
    -moz-iteration-count: infinite;
    -o-iteration-count: infinite;
    animation-iteration-count: infinite;
    cursor: -webkit-grab;
    cursor: -moz-grab;
    cursor: -o-grab;
    cursor: grab;
}




@-webkit-keyframes paused {
    0% { -webkit-transform: scale(1); }	
50% { -webkit-transform: scale(1); }
100% { -webkit-transform: scale(1); }
}
@-moz-keyframes paused {
    0% { -moz-transform: scale(1); }	
50% { -moz-transform: scale(1); }
100% { -moz-transform: scale(1); }
}
@-o-keyframes paused {
    0% { -o-transform: scale(1); }	
50% { -o-transform: scale(1); }
100% { -o-transform: scale(1); }
}
@keyframes paused {
    0% { transform: scale(1); }	
50% { transform: scale(1); }
100% { transform: scale(1); }
}


.paused {
    -webkit-animation-name: paused;
    -moz-animation-name: paused;
    -o-animation-name: paused;
    animation-name: paused;
   -ms-animation-play-state:paused;
   -o-animation-play-state:paused;
   -moz-animation-play-state:paused;
   -webkit-animation-play-state:paused;
    animation-play-state: paused;
    cursor: -webkit-grabbing;
    cursor: -moz-grabbing;
    cursor: -o-grabbing;
    cursor: grabbing;
}









.dropOver {
    background-color: #ff0000 !important;
}


#map_div {
    height: 100%;
    margin: 0 0 16px;
    padding: 0;
    -webkit-border-radius: 4px 4px 4px 4px;
    -moz-border-radius: 4px 4px 4px 4px;
    -khtml-border-radius: 4px 4px 4px 4px;
    border-radius: 4px 4px 4px 4px;
    background-color: transparent;
}
#map-holder {
    display: block;
    height: 300px;
    margin: 18px auto 0;
    position: relative;
    width: 440px;
}
.closeButt {
    position: absolute;
    width: 4.4rem;
    height: 4.4rem;
    top: -22px;
    right: -22px;
    z-index: 1000;
    color: #333c39;
    background: transparent;
    border: none;
    transition-timing-function: ease-out;
    transition: 0.25s;
    padding: 0;
}
.closeButt:hover {
    transform: rotate(90deg);

}

.sr-only {
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
}
.sr-only, .sr-only-focusable:not(:focus) {
    position: absolute!important;
    width: 1px!important;
    height: 1px!important;
    padding: 0!important;
    margin: -1px!important;
    overflow: hidden!important;
    clip: rect(0,0,0,0)!important;
    white-space: nowrap!important;
    border: 0!important;
}
#astroboarder {
    width: 223px;
    position: absolute;
    right: -17px;
    bottom: 100px;
    z-index: 1;
}
#astroboarder_svg {
    -webkit-animation: characterFloat 6s ease-in-out infinite;
    animation: characterFloat 6s ease-in-out infinite;
    background-repeat: no-repeat;
}
@-webkit-keyframes characterFloat {
    0% {
        -webkit-transform: translatey(0px);
        transform: translatey(0px);
    }
    50% {
        -webkit-transform: translatey(30px);
        transform: translatey(30px);
    }
    100% {
        -webkit-transform: translatey(0px);
        transform: translatey(0px);
    }
}

@keyframes characterFloat {
    0% {
        -webkit-transform: translatey(0px);
        transform: translatey(0px);
    }
    50% {
        -webkit-transform: translatey(30px);
        transform: translatey(30px);
    }
    100% {
        -webkit-transform: translatey(0px);
        transform: translatey(0px);
    }
}

.character_shaddow {
    background: url(../images/umbra.png);
    background-size: 280px 117px;
    background-repeat: no-repeat;
    width: 280px;
    height: 117px;
    margin: 0 auto;
    position: absolute;
    left: -17px;
    bottom: -40px;
    -webkit-transform: translatey(0px) scale(0.7) rotate(
            -15deg);
    transform: translatey(0px) scale(0.7) rotate(
            -15deg);
    -webkit-animation: characterShaddow 6s ease-in-out infinite;
    animation: characterShaddow 6s ease-in-out infinite;
}

@-webkit-keyframes characterShaddow {
    0% {
        -webkit-transform: translatey(0px) scale(0.7) rotate(-15deg);
        transform: translatey(0px) scale(0.7) rotate(-15deg);
    }
    50% {
        -webkit-transform: translatey(-5px) scale(1) rotate(-15deg);
        transform: translatey(-5px) scale(1) rotate(-15deg);
    }
    100% {
        -webkit-transform: translatey(0px) scale(0.7) rotate(-15deg);
        transform: translatey(0px) scale(0.7) rotate(-15deg);
    }
}

@keyframes characterShaddow {
    0% {
        -webkit-transform: translatey(0px) scale(0.7) rotate(-15deg);
        transform: translatey(0px) scale(0.7) rotate(-15deg);
    }
    50% {
        -webkit-transform: translatey(-5px) scale(1) rotate(-15deg);
        transform: translatey(-5px) scale(1) rotate(-15deg);
    }
    100% {
        -webkit-transform: translatey(0px) scale(0.7) rotate(-15deg);
        transform: translatey(0px) scale(0.7) rotate(-15deg);
    }
}






/* Kozakura */
.input--kozakura {
    overflow: hidden;
    padding-bottom: 1em;
}

.input__field--kozakura {
    padding: 0.25em 0.5em;
    margin-top: 1.25em;
    width: 100%;
    background: transparent;
    color: #2F3238;
    font-size: 1.55em;
    opacity: 0;
}

.input__label--kozakura {
    width: 100%;
    text-align: left;
    position: absolute;
    top: 1em;
    pointer-events: none;
    overflow: hidden;
    padding: 0 0.25em;
    -webkit-transform: translate3d(1em, 2.75em, 0);
    transform: translate3d(1em, 2.75em, 0);
    -webkit-transition: -webkit-transform 0.3s;
    transition: transform 0.3s;
}

.input__label-content--kozakura {
    color: #222;
    padding: 0.4em 0 0.25em;
    -webkit-transition: -webkit-transform 0.3s;
    transition: transform 0.3s;
}

.input__label-content--kozakura::after {
    content: attr(data-content);
    position: absolute;
    font-weight: 800;
    top: 90%;
    left: 0;
    height: 100%;
    width: 100%;
    color: #fff;
    padding: 0.25em 0;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 0.95em;
}

.graphic--kozakura {
    fill: #fff;
    pointer-events: none;
    top: 1em;
    bottom: 0px;
    height: 4.5em;
    z-index: -1;
    -webkit-transition: -webkit-transform 0.7s, fill 0.7s;
    transition: transform 0.7s, fill 0.7s;
    -webkit-transition-timing-function: cubic-bezier(0, 0.25, 0.5, 1);
    transition-timing-function: cubic-bezier(0, 0.25, 0.5, 1);
}

.input__field--kozakura:focus,
.input--filled .input__field--kozakura {
    -webkit-transition: opacity 0s 0.35s;
    transition: opacity 0s 0.35s;
    opacity: 1;
}

.input__field--kozakura:focus + .input__label--kozakura,
.input--filled .input__label--kozakura {
    -webkit-transition-delay: 0.15s;
    transition-delay: 0.15s;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

.input__field--kozakura:focus + .input__label--kozakura .input__label-content--kozakura,
.input--filled .input__label-content--kozakura {
    -webkit-transition-delay: 0.15s;
    transition-delay: 0.15s;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
}

.input__field--kozakura:focus ~ .graphic--kozakura,
.input--filled .graphic--kozakura {
    fill: #fff;
    -webkit-transform: translate3d(-66.6%, 0, 0);
    transform: translate3d(-66.6%, 0, 0);
}


/*.act.animated {*/
    /*-webkit-animation-delay: 0s;*/
    /*animation-delay: 0s;*/
    /*-webkit-animation-duration: 1s;*/
    /*animation-duration: 1s;*/
    /*-webkit-animation-fill-mode: both;*/
    /*animation-fill-mode: both;*/
/*}*/

.masthead {
    z-index: 1;
}















