﻿/*
--------------------------------------------------------------------------------------------------
--------------------------------------------------------------------------------------------------
>> LAYOUT
--------------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------------*/



/*--------------------------------
-- MAIN LAYOUT
--------------------------------*/
body { font-family:Arial; margin:0; background-position:center top; background-repeat:no-repeat; }
img  { border:none; }

#godWrapper    { margin-top: 30px;}
.wrapper       { position:absolute; width:960px; min-height:300px; left:50%; margin-left:-480px;}
.wrapperBorder { border-style:solid; border-width:6px; }
.wrapperNoHead { position:relative; width:100%; }

.errorMsg { background-color:#900; color:#FFF; font:bold 11px Arial; padding:18px; margin:5px 0 5px 0; }
.showpointer { cursor: pointer; background-position-y:top; }


/*--------------------------------
-- LOGOS
--------------------------------*/
.nineLogo       { right:0; position:absolute; }     /* #pixLogo.top = #wrapper.top + .topLogoWrapper.height */
.profileTopLogo { width:960px; text-align:center; left:50%; margin-left:-480px; position:relative;} /* .profileTopLogo.left / .height == .wrapper.left / .height */


/*--------------------------------------------------------------------------------------------------
                                        BANNER
--------------------------------------------------------------------------------------------------*/
 #banner
,#banner .logo
,#bannerMultiContent img {height:200px;} /* set the banner's height */

#banner          { padding:0; margin:0; width:100%; }
#banner .image   { height:100%; width:100%; float:left;background-position: center right;background-repeat: no-repeat; }
#banner .logo    { float:left; text-align:center; background-repeat:no-repeat; background-position:center center; position:absolute; }
#banner .tagline {
    position:relative;
    padding:7px 27px;
    margin-top:65px;
    font-weight:bold;
    font-size:2.1em;
    z-index:1;  }
#banner .subtag { font-weight:normal; font-size:0.47em; }

#bannerMultiContent img             { display:none; width:100%; }
#bannerMultiContent img:first-child { display:block; }


/*--------------------------------------------------------------------------------------------------
                                        BANNER POSITIONS
--------------------------------------------------------------------------------------------------*/
.banner-cover-top { background-size:cover; background-position-y: top !important; }
.banner-cover-center { background-size:cover; background-position-y: center !important; }
.banner-cover-bottom { background-size:cover; background-position-y: bottom!important; }
.banner-contain { background-size:contain; background-position-y: center!important; }


/*--------------------------------------------------------------------------------------------------
                                        NAVIGATION // MAIN
--------------------------------------------------------------------------------------------------*/
.nav-wrapper { overflow: hidden; }
.nav-content { margin-top: 2px; }
.nav-logo    { float: left; margin-top: 0; margin-left: 10px; margin-right: 15px; position: relative; }

.nav      { margin:0; padding:0; height:40px; overflow:hidden;}
.nav li   { display:inline; }
.nav li a {
    font-size: 0.8em;
    height:100%;
	float: left;
    font-weight: bold;
    padding: 12px 20px;
    text-decoration: none;
    text-align: center;}


/*--------------------------------------------------------------------------------------------------
                                        NAVIGATION // SUB
--------------------------------------------------------------------------------------------------*/
#subnavWrapper { margin:0; padding: 0; height:30px; overflow: hidden; }
#subnav        { background-color:transparent; list-style: none; display: block; font-size: 0.9em; text-transform:capitalize; }
#subnav ul     { list-style-type:none; margin:0; padding:0; }
#subnav li     { display:inline; }
#subnav li a   { display:block; float:left;font-weight: normal; font-size: 0.75em; padding:8px 20px; text-decoration:none; }


/*--------------------------------------------------------------------------------------------------
                                        PAGE TITLE
--------------------------------------------------------------------------------------------------*/
.titleWrapper        { font-weight:normal; margin: 2px 0; padding:10px 20px; }
.titleWrapper .title { font-size:1.58em; }
.titleWrapper .tag   { font-size:1.35em; font-style:italic; padding-left:12px; }


/*--------------------------------------------------------------------------------------------------
                                        CONTENT
--------------------------------------------------------------------------------------------------*/
.pageWrapper       { margin:0 0 0 0; padding:0 0 15px 0; min-height: 310px;}
.pageContent       { width:100% - 10px; vertical-align:top; padding:0; padding-top:0; }
.pageContent table { width:100%; vertical-align:top; }
.pageContent hr    { border:none; border-top:dotted 0px #999; }

.pageContent table .image-right     { padding:0 10px 0 0; width:21%; text-align:center; } /* .imageRight.padding-right is used to compensate for .textContent.padding-right */
.pageContent table .image-right img { margin-top: 6px; }

.pageContent table .image-left      { padding:0 0 0 10px; width:21%; text-align:center; } /* .imageLeft.padding-right  is used to compensate for .textContent.padding-right */
.pageContent table .image-left img  { margin-top: 6px; }


.pageContent table div.image-circle { width: 270px; height: 270px; border-radius: 190px; -webkit-border-radius: 190px; -moz-border-radius: 190px; }


.pageContent div .imageCenter       { overflow: hidden; text-align:center;  }
.pageContent div .imageCenter img   { max-width: 100%;}

.pageContent table .textWrapper    { width:100%; text-align:justify; font:normal 13px/19px Arial;}
.pageContent table .textContent    { padding:2px 10px 0 10px; }
.pageContent table .textContent a  { text-decoration:none; }
.pageContent table .textContent a:hover  { text-decoration:underline; }

.pageContent table .textContent h1 { font:normal 23px Arial; font-style:normal; padding-bottom:1px;}
.pageContent table .textContent h2 { font:normal 19px Arial; font-style:italic; padding-bottom:1px; margin:0;}

.pageContent table.two-columns .textContent p {
    -moz-column-count: 3;
    -moz-column-gap: 20px;
    -webkit-column-count: 2;
    -webkit-column-gap: 20px; }

/* for downloads */
.pageContent table .textContent ul            { /*font-size: 0.88em; line-height: 1.44em;*/ }
.pageContent table .textContent ul li         { margin: 2px 0 3px 0; }
.pageContent table .textContent ul li a       { text-decoration: none;font-size: 0.9em; }
.pageContent table .textContent ul li a:hover { text-decoration: underline; }
.pageContent table .textContent ul li span    { font-size: 0.8em;font-style: italic;color: #777; }

.page-v2-content { padding: 6px 12px; }

/*--------------------------------------------------------------------------------------------------
                                        CONTENT // GALLERY
--------------------------------------------------------------------------------------------------*/
.album-wrapper { padding-top: 20px; width: 960px; margin: auto auto; }
.albumWrapper { margin-top: 10px; }
.albumImage { width: 200px; height: 150px; background-position: center center; background-repeat: no-repeat; }

#gallery { text-align:left; margin:0px 0; padding:0; }
#gallery li { display: inline-block; margin:4px; padding:2px 2px; vertical-align: top; list-style-type: none; height:100%;}
#gallery li div.galleryImage { width: 100%; height:127px; border-width:3px; border-style: solid;  background-position: center center; background-repeat: no-repeat;}
#gallery li a { font-size: 0.7em;line-height: 15px; text-decoration: none; }
#gallery li div.galleryText { padding: 5px 3px; }

#gallery li { /*Profile.GalleryImageWidth*/ width:170px; }
#gallery li div.galleryImage { /*Profile.GalleryImageHeight*/ height: 127px; }

.autoResizeImage {
    max-width: 100%;
    height: auto;
    width: auto;
}

/*--------------------------------------------------------------------------------------------------
                                        FOOTER & BOTTOM MARGIN
--------------------------------------------------------------------------------------------------*/
#footer   {position:relative; width:100%; height:40px; }
#footer a {font-weight:normal; font-size:11px; text-decoration:none; padding: 0 2px;}
#footer a:hover {text-decoration:underline; cursor:pointer;}
#footer a.clean {text-decoration:none;}
#footer div  {padding:8px 5px 1px 10px;}

.wrapperBorder { margin-bottom: 20px;}


/*--------------------------------------------------------------------------------------------------
                                        POPUP FROM FOOTER
--------------------------------------------------------------------------------------------------*/
.popup-wrapper { position:absolute; top:0; bottom:60px; left:0; right:0; z-index:9999; } /*
[////] .popupWrapper.bottom = (footer.height + footer.padding-bottom) - wrapperBorder.Bottom // loading panel on top of site */

.popup-content {
    position:absolute;
    border-width:5px;
    border-style:solid;
    background-color:#FFF;
    width:600px;
    height:330px;
    left:50%; margin-left:-300px;
    top:45%; margin-top:-150px;
    z-index:10000;
    }
.popup-content h1 { font-weight:normal; font-size:23px; margin:0; padding:8px 20px; }
.popup-content .title { font-weight:bold; font-size:13px; padding-top:3px; padding-bottom:4px; }

 .popup-inner
,.popup-inner-with-command {
    position:relative;
    padding:10px 15px 20px 15px;
    font-weight:normal;
    font-size:12px;
    text-align:justify;
    overflow:auto;
}
.popup-inner              { height:255px; }
.popup-inner-with-command { height:212px; }

.popup-inner-with-command p span  { font-size:13px; font-weight:normal; color:#666; margin-left:20px; }
.popup-inner-with-command p input { font-size:15px; font-weight:normal; color:#222; padding:6px; width:280px; border:1px solid #CCC; margin-left:20px; }

.popup-command-wrapper { height:45px; font-weight:normal; font-size:13px; margin:0 0 0 0; }
.popup-command-content { vertical-align: middle; display: block;padding: 15px 20px 5px 20px; }
.popup-command-content a       { text-decoration: none; cursor:pointer; }
.popup-command-content a:hover { text-decoration:underline; }

.popup-thanks { height:177px; }


/*--------------------------------------------------------------------------------------------------
                                        CONTACT & NEO
--------------------------------------------------------------------------------------------------*/

/*
#pageWrapper h2{
	background-color:transparent;
	color:#333;
	font:normal 22px Arial;
	margin:0;
	padding:0 0 0 14px;
	text-transform:capitalize;}
*/
	
.contact-wrapper {padding:10px 10px; overflow: auto;}

/*--- contact panels    ---*/
 .contact-wrapper .contact-info
,.contact-wrapper .contact-form {border:solid 2px #DDD; float:left; min-height:355px; padding:10px 10px;}

.contact-wrapper .contact-info  {width:320px;}
.contact-wrapper .contact-form  {width:540px; overflow: auto; }
.contact-wrapper .contact-space {width:20px; float:left;}

/*--- contact titles    ---*/
.contact-wrapper h2     {color:#BBB; line-height:30px; margin-top:5px; width:100%;}
.contact-wrapper .title {font-weight:bold; display:block; padding-bottom:10px;}

/*--- spacing for table & paragaph ---*/
 .contact-wrapper .contact-info p
,.contact-wrapper .contact-form table            {padding-left:27px; padding-top:10px; font-size:0.87em; line-height:1.5em;}
 .contact-wrapper .contact-form table .row-button{padding-left:31px; padding-top:8px;}
 .contact-wrapper .message                       {width:100%; text-align:center; font-size:0.87em;line-height: 1.35em; padding-top: 60px;}

/*--- textboxes         ---*/
 .contact-wrapper input[type=text]
,.contact-wrapper textarea          {margin: 1px 0; font-weight:normal; padding:6px; color:#333;}
.contact-wrapper input[type=text]   {width:250px;}
.contact-wrapper textarea           {width:330px;}

/*--- button            ---*/
.contact-wrapper .button      {font-weight: bold;font-size: 0.85em;border-style: solid; border-width:1px; padding:8px 20px; text-decoration:none;}
.contact-wrapper .button:hover{background-color:transparent;}

/*--- map               ---*/
.contact-map    { max-width:100%; height:310px; border: solid 3px #DDD; margin:15px 6px 5px 6px; }

/*--- contact-v2        ---*/
.contact-v2-map     { height:330px; max-width:100%; border: solid 1px #B3D1FF; margin:10px 0 5px 0; }
.contact-v2-title   { font: normal 1.2em Oswald;margin-top: 5px;text-transform: uppercase;}
.contact-v2-text    { font: normal 0.8em Arial;line-height: 20px;margin: 6px 0;color: #666;}
.contact-v2-form    { width: 49%;float: left; }

.contact-v2-form input {margin: 1px 0; font-weight:normal; padding:6px; color:#333;}
.contact-v2-form input[type=text] { width: 90%; }

.contact-v2-form .button      {font-weight: bold; font-size: 0.8em;border-style: solid; border-width:1px; padding:6px 16px; text-decoration:none;margin-top: 10px;}
.contact-v2-form .button:hover{background-color:transparent;}

.contact-v2-info    { width: 47%;float: left;position: relative;padding-left: 30px; margin: 6px 0; }
.contact-v2-info-item { font:normal 0.8em Arial; line-height: 20px; color: #555; margin: 6px 0;  }

.contact-v2-item    { margin-top: 12px; }
.contact-v2-item label { display: block; font: normal 0.9em Tahoma;margin: 2px 0 5px 0;  }
.contact-v2-item input,
.contact-v2-item textarea { margin: 0;width: 90%;font-family: Arial; }

.nth-title { margin-top: 35px;margin-bottom: 6px; }
.highlight-text { color: #E55!important;}


/*--------------------------------------------------------------------------------------------------
                                        OVERLAY
--------------------------------------------------------------------------------------------------*/

#overlay {
    position: absolute;
    z-index: 99;
    top: 0px;
    left: 0px;
    background-color: #FFF;
    width: 100%;
    height: 100%;
    filter: Alpha(Opacity=80);
    opacity: 0.9;
    -moz-opacity: 0.9;
}            
#theprogress {
    position: absolute;
    top: 40%;
    left: 50%;
    margin: -11px 0 0 -150px;
    background-color: #fff;
    border:0px solid #ccc;
    padding:10px;
    width: 300px;
    height: 30px;
    line-height:30px;
    text-align: center;
    filter: Alpha(Opacity=100);
    opacity: 1;
    -moz-opacity: 1;
    color: #333;
    font-weight:normal;
    font-size:14px;
    font-family: Oswald;
}


/*--------------------------------------------------------------------------------------------------
                                        EVENTS
--------------------------------------------------------------------------------------------------*/
.page-event-wrapper {
    background-color: #F8F8F8;
    margin: 10px;
    padding: 0 16px;
}
.page-event-wrapper .read-more {
    background-color: #3457a2;
    border-radius: 5px;
    padding: 10px 5px 12px 5px;
    text-align: center;
    width: 90px;
    color: #FFF;
    font-size: 12px;
    cursor: pointer;
}
.page-event-wrapper .read-more a {
    text-decoration: none;
    color: #FFF;
    font-size: 12px;
}

.page-event-wrapper .read-more a:hover,
.page-event-wrapper .read-more:hover {
    background-color: #FFF;
    color: #3457a2;
}

.event-image {vertical-align: top;}
.event-image img { margin-top: 20px; width:200px; }
.event-date {
    background-color: #369;
    color: #FFF;
    padding: 6px;
}
p.event-info {
    margin: 0 5px 7px 0px;
    color: #000;
}
p.event-info span {
    padding: 5px;
}



/*--------------------------------------------------------------------------------------------------
                                        TRIP ADVISOR
--------------------------------------------------------------------------------------------------*/
.widCOE { margin: 0 auto; }





/*
--------------------------------------------------------------------------------------------------
--------------------------------------------------------------------------------------------------
>> ACCENT
--------------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------------*/



/*--------------------------------------------------------------------------------------------------
                                        MAIN LAYOUT
--------------------------------------------------------------------------------------------------*/
body
{background-color:#333;}

.wrapperBorder
{border-color:#FFF; background-color: #FFF;}


/*--------------------------------------------------------------------------------------------------
                                        BANNER
--------------------------------------------------------------------------------------------------*/
#banner .logo    {/*background-color:#FFF;*/}
#banner .tagline {color:#FFF;}


/*--------------------------------------------------------------------------------------------------
                                        NAVIGATION // NORMAL
--------------------------------------------------------------------------------------------------*/

/*-- MAIN NAVIGATION --*/
 .nav-wrapper
,.nav li a

/*-- SUB NAVIGATION --*/
,#subnavWrapper
,#subnav li a
{color:#369; background-color:#FFF;}


/*-- FOOTER & POPUP // HOVER --*/
 #footer a:hover
,.popupCommand a:hover

/*-- GALLERY LINK // HOVER --*/
,#gallery li a:hover

/*-- DOWNLOADS // HOVER --*/
,.pageContent table .textContent ul a:hover
{color:#369;}


/*--------------------------------------------------------------------------------------------------
                                        NAVIGATION // HOVER 
--------------------------------------------------------------------------------------------------*/

/*-- MAIN NAVIGATION --*/
 .nav li a:hover
,.nav li .current

/*-- SUB NAVIGATION --*/
,#subnav li a:hover
,#subnav li .current

/*-- POPUP HEADER --*/ 
,.popup-content h1
{color:#FFF; background-color:#369;}


/*--------------------------------------------------------------------------------------------------
                                        FOOTER & POPUP
--------------------------------------------------------------------------------------------------*/

/*-- FOOTER // NORMAL --*/
 #footer
,#footer a

/*-- POPUP FOOTER // NORMAL --*/
,.popupCommand a
,.popupCommand

/*-- GALLERY LINK // NORMAL --*/
,#gallery li a

/*-- DOWNLOADS // NORMAL --*/
,.pageContent table .textContent ul a
{color: #333;}


/*--------------------------------------------------------------------------------------------------
                                        PAGE & POPUP TITLE ACCENT
--------------------------------------------------------------------------------------------------*/
 .titleWrapper
,.popup-content h1
{background-color:#ECECEC;}

/*-- PAGE TITLE --*/
.titleWrapper .title
{color:#369;}


/*--------------------------------------------------------------------------------------------------
                                        LIGHT ACCENT
--------------------------------------------------------------------------------------------------*/
.titleWrapper .tag
{color:#ECECEC;}

 #footer
,.popupCommand
{background-color:#ECECEC;}

 #gallery li div
,.contact-map
,.popup-content
{border-color: #ECECEC;}

                            /*--
.titleWrapper   = PAGE TITLE
#gallery li div = GALLERY IMAGE BORDER
#map            = MAP BORDER
.popupCommand   = INNER POPUP FOOTER
.popup-content   = INNER POPUP BORDER
                            --*/

/*--------------------------------------------------------------------------------------------------
                                        TRANSPARENT
--------------------------------------------------------------------------------------------------*/
 .popup-wrapper
,#banner .tagline
{background-image:url("/App/Images/transparent-bg-black.png");}


/*--------------------------------------------------------------------------------------------------
                                        CONTENT // GALLERY
--------------------------------------------------------------------------------------------------*/
#gallery li div:hover
{border-color: #369;}


/*--------------------------------------------------------------------------------------------------
                                        CONTENT
--------------------------------------------------------------------------------------------------*/
.pageContent table .textContent h1
{color: #369;}

/*--------------------------------------------------------------------------------------------------
                                        CONTACT
--------------------------------------------------------------------------------------------------*/
.contact-wrapper .button {background-color:#369; border-color:#369; color:#FFF;}
.contact-wrapper .button:hover {color:#369;}

/*--------------------------------------------------------------------------------------------------
                                        EVENTS
--------------------------------------------------------------------------------------------------*/
.highlight { background-color: #FFBDBD; }