/***** Fonts *****/
@font-face {
    font-family:'raleway';
    src:url('../font/raleway-regular-webfont.eot');
    src:url('../font/raleway-regular-webfont.eot?#iefix') format('embedded-opentype'),
        url('../font/raleway-regular-webfont.woff') format('woff'),
        url('../font/raleway-regular-webfont.ttf') format('truetype'),
        url('../font/raleway-regular-webfont.svg#raleway-regular-webfont') format('svg');
    font-weight:normal;
    font-style:normal;
}

@font-face {
    font-family:'raleway';
    src:url('../font/raleway-thin-webfont.eot');
    src:url('../font/raleway-thin-webfont.eot?#iefix') format('embedded-opentype'),
        url('../font/raleway-thin-webfont.woff') format('woff'),
        url('../font/raleway-thin-webfont.ttf') format('truetype'),
        url('../font/raleway-thin-webfont.svg#raleway-thin-webfont') format('svg');
    font-weight:100;
    font-style:normal;
}

@font-face {
    font-family:'raleway';
    src:url('../font/raleway-bold-webfont.eot');
    src:url('../font/raleway-bold-webfont.eot?#iefix') format('embedded-opentype'),
        url('../font/raleway-bold-webfont.woff') format('woff'),
        url('../font/raleway-bold-webfont.ttf') format('truetype'),
        url('../font/raleway-bold-webfont.svg#raleway-bold-webfont') format('svg');
    font-weight:bold;
    font-style:normal;
}



/***********************************************
Screen 1200px+
***********************************************/
body                                            { padding:0; background-color:#cdc3c3; height:100%; font-family:'raleway', Sans-Serif; font-size:16px; color:#333; overflow-x:hidden; transition:all 0.2s cubic-bezier(0.33, 0, 0.2, 1) 0s; -moz-transition:all 0.2s cubic-bezier(0.33, 0, 0.2, 1) 0s; -webkit-transition:all 0.2s cubic-bezier(0.33, 0, 0.2, 1) 0s; -o-transition:all 0.2s cubic-bezier(0.33, 0, 0.2, 1) 0s; }
h1, h2, h3, h4, h5, h6                          { font-family:'raleway', Sans-Serif; font-weight:bold; color:#333; }
h1                                              { margin:0 0 10px; font-size:60px; line-height:58px; font-weight:100; }
h2                                              { font-size:40px; line-height:32px; }
h3                                              { font-size:30px; line-height:36px; }
p                                               { font-family:'raleway', Sans-Serif; font-size:16px; }
.grid + h4                                      { margin-top:60px; }
small                                           { font-size:14px; }
button                                          { margin:0; padding:0; width:auto; background:transparent; border:none; text-transform:none; letter-spacing:-0.5px; text-align:left; float:none; cursor:pointer; position:relative; top:0; left:0; transition:color 0.33s cubic-bezier(0.33, 0, 0.2, 1) 0s, background 0.33s cubic-bezier(0.33, 0, 0.2, 1) 0s; }

blockquote                                      { padding:20px 0 0 }
blockquote p:first-of-type:before               { color:#9a5b7b; position:relative; top:20px; }
blockquote p                                    { color:#333; }
figcaption span                                 { background-color:#9a5b7b; }

strong                                          { font-weight:bold; }

.txt-highlight                                  { font-weight:bold; background-color:transparent; color:#32bef0; }

.btn                                            { margin:0 5px 10px 0; padding:12px 20px; background:transparent; font-family:'raleway'; font-size:14px; line-height:20px; color:#333; text-align:left; border:1px solid #333; text-decoration:none; min-height:40px; display:inline-block; position:relative; top:0; left:0; cursor:pointer; transition:background .1s linear 0s; -moz-transition:background .1s linear 0s; -webkit-transition:background .1s linear 0s; -o-transition:background .1s linear 0s; }
.btn:hover                                      { background-color:transparent; transition:background .1s linear 0s; -moz-transition:background .1s linear 0s; -webkit-transition:background .1s linear 0s; -o-transition:background .1s linear 0s; }

.btn--size-large                                { font-size:20px; }

/***** Color - Success *****/
.btn--state-success,
.btn--state-success:hover[disabled]             { background-color:#29B765; border-color:#29B765; color:#FFF; width:100%; text-align:center; }
.btn--state-success:hover                       { background-color:#27AE60; border-color:#27AE60; color:#FFF; }


nav                                             { padding:0 50px 0 0; width:100%; position:absolute; top:50px; right:0; z-index:10; letter-spacing:1px; display: flex; justify-content: space-between; }
nav ol                                          { margin:0; list-style:none; display:flex; overflow:hidden; flex-wrap: wrap; justify-content: flex-end; }
nav ol li                                       { margin:0 0 0 10px; font-size:14px; color:#FFF; font-weight:100; }
nav ol li a                                     { padding:8px 16px; display:block; background-color:#a59d90; text-decoration:none; color:#FFF; }
nav ol li.phone-numbers                         { min-width:100%; }
nav ol li.current a                             { background-color:#985c7a; }

.phone-numbers                                  { margin:0; float:none; border:none; }
.phone-numbers ol                               { margin:0 0 20px; }
.phone-numbers li                               { margin:0 0 0 40px; text-align:left; background-color:transparent; color:#985b7a; font-size:24px; line-height:30px; border:none; font-weight:bold; }
.phone-numbers li:first-child                   { margin:0; }
.phone-numbers li a                             { padding:0; color:#EEE; background:none; display:inline-block; }
.phone-numbers li a:hover                       { color:#444; background:none; }

header                                          { padding:260px 0; height:590px; width:100%; font-size:20px; background-image:linear-gradient(#9bb78f, #d0dc9e); position:relative; top:0; left:0; }
header .content                                 { position:relative; z-index:9; }
header p                                        { line-height:24px; }
header .btn:hover                               { background-color:#985c7a; border-color:#985c7a; color:#FFF; }

.logo                                           { width:200px; min-width:200px; height:100px; display:block; margin-left: 50px; }
.logo img                                       { width:100%; height:auto; }

.rocks-01                                       { margin:0 0 0 -800px; position:absolute; bottom:0; left:50%; }
.rocks-02                                       { margin:0 0 0 -800px; position:absolute; top:-30px; left:50%; }
.rocket                                         { margin:0 0 0 -370px; position:absolute; top:-470px; left:50%; }

.container                                      { width:100%; padding:100px 0 100px; position:relative; top:0; left:0; }

.ground                                         { padding:260px 0 100px; background-color:#a08e8e; }
.ground .btn                                    { background-color:transparent; color:#222; border-color:#222; }

.slate                                          { padding:50px 0 30px; background-image:url('../img/slate-bg.png'); background-color:#1a2730; color:#999; }
.slate h2, .slate h3                            { color:#FFF; }
.slate .btn                                     { background-color:transparent; color:#FFF; border-color:#FFF; }

.subpage header                                 { padding:50px 0; height:270px; }
.subpage .ground                                { padding:100px 0; }

.destinations                                   { margin:0; padding:0; list-style:none; }
.destinations li                                { padding:230px 20px 0 20px; float:left; width:33.33%; text-align:center; position:relative; }
.destinations li .btn                           { transition:all 0.2s cubic-bezier(0.33, 0, 0.2, 1) 0s; -moz-transition:all 0.2s cubic-bezier(0.33, 0, 0.2, 1) 0s; -webkit-transition:all 0.2s cubic-bezier(0.33, 0, 0.2, 1) 0s; -o-transition:all 0.2s cubic-bezier(0.33, 0, 0.2, 1) 0s; }
.destinations li:hover .btn                     { background-color:#985c7a; border-color:#985c7a; color:#FFF; transition:all 0.2s cubic-bezier(0.33, 0, 0.2, 1) 0s; -moz-transition:all 0.2s cubic-bezier(0.33, 0, 0.2, 1) 0s; -webkit-transition:all 0.2s cubic-bezier(0.33, 0, 0.2, 1) 0s; -o-transition:all 0.2s cubic-bezier(0.33, 0, 0.2, 1) 0s; }

.destinations-x4                                { margin:0; padding:0; list-style:none; }
.destinations-x4 li                             { padding:230px 0 0; float:left; width:25%; height:300px; font-size:22px; line-height:30px; font-weight:bold; text-align:center; position:relative; }

.planet                                         { margin:0 0 0 -100px; padding:18px 0 0; display:block; width:200px; height:218px; text-align:center; background-image:url('../img/planet-bg.png'); background-position:center; background-repeat:no-repeat; position:absolute; top:0; left:50%; }

.cover-all                                      { width:100%; height:100%; position:absolute; top:0; left:0; z-index:10; }

.gallery                                        { margin:0 0 20px; padding:0; list-style:none; overflow:hidden; }
.gallery li                                     { margin:0; padding:0; float:left; width:33.33%; }
.gallery li img                                 { width:100%; height:auto; }

.grid                                           { margin:30px 0; padding:0; list-style:none; display:flex; align-items:stretch; flex-direction:row; flex-wrap:wrap; flex-flow:row wrap; align-content:flex-end; }
.grid > li                                      { margin:0; padding:30px 30px 10px; float:left; border-right:1px solid #666; border-bottom:1px solid #666; }

/***** 4 columns *****/
.grid.grid--quarter > li                        { padding:20px; width:25%; }
.grid.grid--quarter > li:nth-child(4n+1)        { padding-left:0; }
.grid.grid--quarter > li:nth-child(4n+4)        { padding-right:0; border-right:none; }
.grid.grid--quarter > li:nth-last-child(-n+4)   { border-bottom:none; }

.cta                                            { margin:60px 0; padding:40px 40px; overflow:hidden; }
.cta h3                                         { margin:40px 0 20px; }
.cta img                                        { margin:0 40px 0 0; float:left; }

/***** Magic Labels *****/
.magic-labels fieldset                          { margin:0 0 30px; }
.magic-labels fieldset label                    { padding:0; display:block; position:absolute; left:1px; top:0; height:auto; width:auto; z-index:1; font-family:sans-serif; font-size:12px; line-height:40px; color:#222; transition:all .1s ease-out 0s; -moz-transition:all .1s ease-out 0s; -webkit-transition:all .1s ease-out 0s; -o-transition:all .1s ease-out 0s; }
.magic-labels fieldset.show-all label           { top:-27px; transition:all .1s ease-out 0s; -moz-transition:all .1s ease-out 0s; -webkit-transition:all .1s ease-out 0s; -o-transition:all .1s ease-out 0s; }

.magic-labels input,
.magic-labels .select,
.magic-labels textarea                          { z-index:2; }

.magic-labels textarea                          { min-height:110px; }

.magic-labels input,
.magic-labels textarea,
.magic-labels select,
.magic-labels .select,
.magic-labels fieldset.error input + .error,
.magic-labels fieldset input:not(:focus):invalid + .error,
.magic-labels .error                            { width:100%; }

.magic-labels .radio, .magic-labels .checkbox   { width:100%; float:right; }

.fields-three input                             { margin:0 2% 0 0; width:31.33%; float:left; }
.fields-three input:last-of-type                { margin:0; width:33.33%; }

.dl-qanda dt                                    { margin:0 0 0 25px; padding:0 0 10px 15px; border-left:1px solid #9a5b7b; position:relative; top:0; left:0; }
.dl-qanda dt:before                             { content:'Q'; color:#9a5b7b; position:absolute; top:0; left:-25px; }

.dl-qanda dd                                    { margin:0 0 50px 25px; padding:0 0 0 15px; border-left:1px solid #9a5b7b; position:relative; top:0; left:0; }
.dl-qanda dd:before                             { content:'A'; color:#9a5b7b; position:absolute; top:0; left:-25px; }


/***** Login *****/
.login-wrapper                                  { width:100%; height:100vh; display:flex; align-items:center; justify-content:center; letter-spacing:1px; }

.login                                          { margin:0; padding:0; list-style:none; background-color:#FFF; display:flex; flex-direction:row; flex-wrap:wrap; flex-flow:row wrap; align-content:flex-end; width:800px; border-radius:10px; overflow:hidden; }
.login li                                       { margin:0; padding:50px 50px 0; float:left; display:block; }

/***** Left side of login *****/
.login-img                                      { background-color:#281636; text-align:center; width:40%; }
.login-img span                                 { margin:10px 0; padding:12px 0 0 0; display:inline-block; width:200px; height:200px; background-color:#333; border-radius:50%; border:10px solid rgba(255,255,255,.1); overflow:hidden; }
.login-img span img                             { width:160px; height:auto; }
.login-img h1                                   { font-size:18px; line-height:20px; color:#9a5b7b; text-transform:uppercase; letter-spacing:10px; }

/***** Right side of login *****/
.login-form                                     { background-color:#9a5b7b; width:60%; }
.login-form a                                   { text-decoration:none; color:#FFF; }
.login-form form label                          { color:#FFF; }
.login-form form input                          { padding:0; background-color:#9a5b7b; color:#FFF; font-size:17px; border:none; border-bottom:1px solid #FFF; }

/***** Button styling *****/
.login-form .btn                                { color:#FFF; font-size:17px; }
.login-form .btns .btn                          { margin:0 10px 0 0; width:calc(50% - 14px); text-align:center; }
.login-form .btns .btn + .btn                   { margin:0 0 0 10px; }

.login-form .btn--state-default                 { background-color:#9a5b7b; }
.login-form .btn--state-default:hover           { background-color:#281636; }

.login-form .btn--as-link                       { width:100%; text-align:center; font-size:14px; }
.login-form .btn--as-link:hover                 { background-color:transparent; color:#281636; }

.magic-labels fieldset.show-all label           { top:-30px; opacity:.6; }
.magic-labels fieldset:last-of-type             { margin:0; }

/***** Placeholder overrides *****/
.login-form ::-webkit-input-placeholder         { color:#FFF; opacity:1; }
.login-form :-moz-placeholder                   { color:#FFF; opacity:1; }
.login-form ::-moz-placeholder                  { color:#FFF; opacity:1; }
.login-form :-ms-input-placeholder              { color:#FFF; opacity:1; }

.login-form :focus::-webkit-input-placeholder   { color:#FFF; opacity:1; }
.login-form :focus:-moz-placeholder             { color:#FFF; opacity:1; }
.login-form :focus::-moz-placeholder            { color:#FFF; opacity:1; }
.login-form :focus:-ms-input-placeholder        { color:#FFF; opacity:1; }

.login-form input:focus                         { color:#FFF; border-color:#FFF; outline:none; }
.login-form textarea:focus                      { color:#FFF; border-color:#FFF; outline:none; }
.login-form select:focus                        { color:#FFF; border-color:#FFF; outline:none; }

footer                                          { padding:160px 0px; background-color:#403939; background-image:url('../img/underground-01.png'); background-position:center 10px; background-repeat:no-repeat; border-top:25px solid #9a5b7b; }
footer h4                                       { margin:0 0 10px; color:#BBB; font-size:20px;  text-transform:uppercase; }
footer p                                        { color:#AAA; font-size:14px; line-height:16px; }
footer a                                        { color:#AAA; }
footer ol                                       { margin:30px 0 0; list-style:none; display:block; width:100%; overflow:hidden; }
footer li                                       { margin:0 10px 0 0; float:left; font-size:14px; background-color:#4f4343; color:#AAA; font-weight:100; }
footer li a                                     { padding:5px 10px; display:block; text-decoration:none; color:#AAA; }

footer .contact                                 { margin:0 0 30px; }
footer .contact li                              { margin:10px 0 0; float:none; font-size:14px; background-color:transparent; font-size:16px; font-weight:normal; border-bottom:1px solid #555; }
footer .contact li a                            { margin:0 0 10px; padding:0; display:inline-block; text-decoration:none; color:#FFF; font-weight:100; }

/***********************************************
Screen Smaller than 1199px
***********************************************/
@media only screen and (min-width:960px) and (max-width:1199px) {

}

/***********************************************
Tablet (Smaller than 959px)
***********************************************/
@media only screen and (min-width:768px) and (max-width:959px) {

}

/***********************************************
Mobile (portrait 300px)
***********************************************/
@media only screen and (max-width:767px) {

}
