/* index.html */

#imageBox {
    position: relative;
    /*border-top: 3px solid rgba(242,187,44,0.5);*/
    width: 100%;
    height: auto;
}

.image-slideshow img {
    /* width: 100%;
    height: 450px; */
    width: 100%;
    margin: 0 auto;
}

.image-slideshow {
	position: relative;
}

#imgList a.active {
    background: #58FAAC;
}

#imgList {
    position: relative;
    z-index: 1000;
    margin: 0;
    text-align: right;
    /*margin-top: -25px; enabled if caption align left*/
    margin-right: 5px;
}

#imgList a {
    display: inline;
    text-align: right;
    border-radius: 50%;
    padding: 0 5.5px;
    margin: 3px;
    font-size: 10px;
    background: rgba(0, 128, 128, 0.6);
    cursor: pointer;
}

#imgCaption {
    width: 100%;
    /* remove if align left caption 8*/
    position: static;
    /* bottom: 0px; */
    z-index: auto;
    /*margin: 0 10px; if caption align left*/
}

#home #imgCaption {
    /*border-bottom: 3px solid #DADADA;*/
}

#imgCaption p {
    margin: 0;
    padding: 8px;
    font: bold 18px Arial;
    text-align: center;
    /* left to align captionl left */
    text-shadow: none;
    color: rgb(1, 75, 66);
    background: rgba(253, 248, 230, 0.9);
}

#imageBox .cycle-next {
    right: 0px;
    background: url(images/right.png) 50% 50% no-repeat;
}

#imageBox .cycle-prev {
    left: 0px;
    background: url(images/left.png) 50% 50% no-repeat;
}

#imageBox .cycle-prev,
#imageBox .cycle-next {
    position: absolute;
    top: 0px;
    width: 30%;
    opacity: 0;
    z-index: 1500;
    height: 100%;
    cursor: pointer;
}

#imageBox .cycle-prev:hover,
#imageBox .cycle-next:hover {
    opacity: 0.7;
}


/* packages.html */

.functionArea-slideshow img {
    max-width: 100%;
    margin: 0 auto;
}

#functionAreaCaption {
    width: 100%;
    /* remove if align left caption 8*/
    position: absolute;
    bottom: 0;
    z-index: 1000;
    /*margin: 0 10px; if caption align left*/
}

#functionAreaCaption p {
    margin: 0;
    padding: 8px;
    font: bold 18px Arial;
    text-align: center;
    /* left to align captionl left */
    text-shadow: none;
    color: rgb(1, 75, 66);
    background: rgba(253, 248, 230, 0.8);
}

#pkgFunctionArea .functionArea-next {
    margin-left: 20px;
}


/* IMAGES.HTML */


/* photo gallery */

#photoGalleryBox {
    max-width: 700px;
}

.photoGallery-slideshow img {
    max-width: 100%;
    margin: 0 auto;
    text-align: center;
}

#photoGalleryBox .cycle-next {
    right: 0px;
    /* background: url(images/right.png) 50% 50% no-repeat;*/
    */
}

#photoGalleryBox .cycle-prev {
    left: 0px;
    /* background: url(images/left.png) 50% 50% no-repeat;*/
    */
}

#photoGalleryBox .cycle-prev,
#photoGalleryBox .cycle-next {
    position: absolute;
    top: 0px;
    width: 30%;
    opacity: 0;
    z-index: 1500;
    height: 100%;
    cursor: pointer;
}

#photoGalleryBox .cycle-prev:hover,
#photoGalleryBox .cycle-next:hover {
    opacity: 0.7;
}

#photoGalleryCaption {
    width: 100%;
    /* remove if align left caption 8*/
    position: relative;
    bottom: 0;
    z-index: 1000;
    /*margin: 0 10px; if caption align left*/
}

#photoGalleryCaption p {
    margin: 0;
    padding: 8px;
    font: bold 18px Arial;
    text-align: center;
    /* left to align captionl left */
    text-shadow: none;
    color: rgb(1, 75, 66);
    background: rgba(253, 248, 230, 0.8);
}

#photoGalleryBox .photoGallery-next {
    margin-left: 20px;
}

#photoGalleryList {
    margin: 0 auto;
    max-width: 100%;
    overflow-x: scroll;
    overflow-y: hidden;
    white-space: nowrap;
    margin-top: 5px;
}

#photoGalleryList img {
    margin: 0 auto;
    max-width: 100%;
    text-align: center;
    cursor: pointer;
}

#photoGalleryList a {
    display: inline-block;
    margin: 0 auto;
    max-width: 20%;
    margin-top: 3px;
}


/* calendar 2017 */

#calendar2017Box,
#calendar2018Box,
#calendar2019Box,
#calendar2020Box,
#calendar2023Box,
#calendar2024Box {
    /*max-width: 700px;*/
}

.calendar2017-slideshow img,
.calendar2018-slideshow img,
.calendar2019-slideshow img,
.calendar2020-slideshow img,
.calendar2023-slideshow img,
.calendar2024-slideshow img {
    max-width: 100%;
    margin: 0 auto;
    text-align: center;
}

#calendar2017Box .cycle-next,
#calendar2018Box .cycle-next,
#calendar2019Box .cycle-next,
#calendar2020Box .cycle-next,
#calendar2023Box .cycle-next,
#calendar2024Box .cycle-next {
    right: 0px;
    background: url(images/right.png) 50% 50% no-repeat;
}

#calendar2017Box .cycle-prev,
#calendar2018Box .cycle-prev,
#calendar2019Box .cycle-prev,
#calendar2020Box .cycle-prev,
#calendar2023Box .cycle-prev,
#calendar2024Box .cycle-prev {
    left: 0px;
    background: url(images/left.png) 50% 50% no-repeat;
}

#calendar2017Box .cycle-prev,
#calendar2017Box .cycle-next,
#calendar2018Box .cycle-prev,
#calendar2018Box .cycle-next,
#calendar2019Box .cycle-prev,
#calendar2019Box .cycle-next,
#calendar2020Box .cycle-prev,
#calendar2020Box .cycle-next,
#calendar2023Box .cycle-prev,
#calendar2023Box .cycle-next,
#calendar2024Box .cycle-prev,
#calendar2024Box .cycle-next {
    position: absolute;
    top: 0px;
    width: 30%;
    opacity: 0;
    z-index: 1500;
    height: 100%;
    cursor: pointer;
}

#calendar2017Box .cycle-prev:hover,
#calendar2017Box .cycle-next:hover,
#calendar2018Box .cycle-prev:hover,
#calendar2018Box .cycle-next:hover,
#calendar2019Box .cycle-prev:hover,
#calendar2019Box .cycle-next:hover,
#calendar2020Box .cycle-prev:hover,
#calendar2020Box .cycle-next:hover,
#calendar2023Box .cycle-prev:hover,
#calendar2023Box .cycle-next:hover,
#calendar2024Box .cycle-prev:hover,
#calendar2024Box .cycle-next:hover {
    opacity: 0.7;
}

#calendar2017Caption,
#calendar2018Caption,
#calendar2019Caption,
#calendar2020Caption,
#calendar2023Caption,
#calendar2024Caption {
    width: 100%;
    /* remove if align left caption 8*/
    position: relative;
    bottom: 0;
    z-index: 1000;
    /*margin: 0 10px; if caption align left*/
}

#calendar2017Caption p,
#calendar2018Caption p,
#calendar2019Caption p,
#calendar2020Caption p,
#calendar2023Caption p,
#calendar2024Caption p {
    margin: 0;
    padding: 8px;
    font: bold 18px Arial;
    text-align: center;
    /* left to align captionl left */
    text-shadow: none;
    color: rgb(1, 75, 66);
    background: rgba(253, 248, 230, 0.8);
}

#calendar2017Box .calendar2017-next,
#calendar2018Box .calendar2018-next,
#calendar2019Box .calendar2019-next,
#calendar2020Box .calendar2020-next,
#calendar2023Box .calendar2023-next,
#calendar2024Box .calendar2024-next {
    margin-left: 20px;
}

#calendar2017List,
#calendar2018List,
#calendar2019List,
#calendar2020List,
#calendar2023List,
#calendar2024List {
    margin: 0 auto;
    max-width: 100%;
    overflow-x: scroll;
    overflow-y: hidden;
    white-space: nowrap;
    margin-top: 5px;
}

#calendar2017List img,
#calendar2018List img,
#calendar2019List img,
#calendar2020List img,
#calendar2023List img,
#calendar2024List img{
    margin: 0 auto;
    max-width: 100%;
    text-align: center;
    cursor: pointer;
}

#calendar2017List a,
#calendar2018List a,
#calendar2019List a,
#calendar2020List a,
#calendar2023List a,
#calendar2024List a {
    display: inline-block;
    margin: 0 auto;
    max-width: 20%;
    margin-top: 3px;
}


/* calendar 2016 */

#calendar2016Box {
    /*max-width: 700px;*/
}

.calendar2016-slideshow img {
    max-width: 100%;
    margin: 0 auto;
    text-align: center;
}

#calendar2016Box .cycle-next {
    right: 0px;
    background: url(images/right.png) 50% 50% no-repeat;
}

#calendar2016Box .cycle-prev {
    left: 0px;
    background: url(images/left.png) 50% 50% no-repeat;
}

#calendar2016Box .cycle-prev,
#calendar2016Box .cycle-next {
    position: absolute;
    top: 0px;
    width: 30%;
    opacity: 0;
    z-index: 1500;
    height: 100%;
    cursor: pointer;
}

#calendar2016Box .cycle-prev:hover,
#calendar2016Box .cycle-next:hover {
    opacity: 0.7;
}

#calendar2016Caption {
    width: 100%;
    /* remove if align left caption 8*/
    position: relative;
    bottom: 0;
    z-index: 1000;
    /*margin: 0 10px; if caption align left*/
}

#calendar2016Caption p {
    margin: 0;
    padding: 8px;
    font: bold 18px Arial;
    text-align: center;
    /* left to align captionl left */
    text-shadow: none;
    color: rgb(1, 75, 66);
    background: rgba(253, 248, 230, 0.8);
}

#calendar2016Box .calendar2016-next {
    margin-left: 20px;
}

#calendar2016List {
    margin: 0 auto;
    max-width: 100%;
    overflow-x: scroll;
    overflow-y: hidden;
    white-space: nowrap;
    margin-top: 5px;
}

#calendar2016List img {
    margin: 0 auto;
    max-width: 100%;
    text-align: center;
    cursor: pointer;
}

#calendar2016List a {
    display: inline-block;
    margin: 0 auto;
    max-width: 20%;
    margin-top: 3px;
}


/* calendar 2015 */

#calendar2015Box {
    /*max-width: 700px;*/
}

.calendar2015-slideshow img {
    max-width: 100%;
    margin: 0 auto;
    text-align: center;
}

#calendar2015Box .cycle-next {
    right: 0px;
    background: url(images/right.png) 50% 50% no-repeat;
}

#calendar2015Box .cycle-prev {
    left: 0px;
    background: url(images/left.png) 50% 50% no-repeat;
}

#calendar2015Box .cycle-prev,
#calendar2015Box .cycle-next {
    position: absolute;
    top: 0px;
    width: 30%;
    opacity: 0;
    z-index: 1500;
    height: 100%;
    cursor: pointer;
}

#calendar2015Box .cycle-prev:hover,
#calendar2015Box .cycle-next:hover {
    opacity: 0.7;
}

#calendar2015Caption {
    width: 100%;
    /* remove if align left caption 8*/
    position: relative;
    bottom: 0;
    z-index: 1000;
    /*margin: 0 10px; if caption align left*/
}

#calendar2015Caption p {
    margin: 0;
    padding: 8px;
    font: bold 18px Arial;
    text-align: center;
    /* left to align captionl left */
    text-shadow: none;
    color: rgb(1, 75, 66);
    background: rgba(253, 248, 230, 0.8);
}

#calendar2015Box .calendar2015-next {
    margin-left: 20px;
}

#calendar2015List {
    margin: 0 auto;
    max-width: 100%;
    overflow-x: scroll;
    overflow-y: hidden;
    white-space: nowrap;
    margin-top: 5px;
}

#calendar2015List img {
    margin: 0 auto;
    max-width: 100%;
    text-align: center;
    cursor: pointer;
}

#calendar2015List a {
    display: inline-block;
    margin: 0 auto;
    max-width: 20%;
    margin-top: 3px;
}


/* calendar 2014 */

#calendar2014Box {
    /*max-width: 700px;*/
}

.calendar2014-slideshow img {
    max-width: 100%;
    margin: 0 auto;
    text-align: center;
}

#calendar2014Box .cycle-next {
    right: 0px;
    background: url(images/right.png) 50% 50% no-repeat;
}

#calendar2014Box .cycle-prev {
    left: 0px;
    background: url(images/left.png) 50% 50% no-repeat;
}

#calendar2014Box .cycle-prev,
#calendar2014Box .cycle-next {
    position: absolute;
    top: 0px;
    width: 30%;
    opacity: 0;
    z-index: 1500;
    height: 100%;
    cursor: pointer;
}

#calendar2014Box .cycle-prev:hover,
#calendar2014Box .cycle-next:hover {
    opacity: 0.7;
}

#calendar2014Caption {
    width: 100%;
    /* remove if align left caption 8*/
    position: relative;
    bottom: 0;
    z-index: 1000;
    /*margin: 0 10px; if caption align left*/
}

#calendar2014Caption p {
    margin: 0;
    padding: 8px;
    font: bold 18px Arial;
    text-align: center;
    /* left to align captionl left */
    text-shadow: none;
    color: rgb(1, 75, 66);
    background: rgba(253, 248, 230, 0.8);
}

#calendar2014Box .calendar2014-next {
    margin-left: 20px;
}

#calendar2014List {
    margin: 0 auto;
    max-width: 100%;
    overflow-x: scroll;
    overflow-y: hidden;
    white-space: nowrap;
    margin-top: 5px;
}

#calendar2014List img {
    margin: 0 auto;
    max-width: 100%;
    text-align: center;
    cursor: pointer;
}

#calendar2014List a {
    display: inline-block;
    margin: 0 auto;
    max-width: 20%;
    margin-top: 3px;
}


/* fun-in-the-sun */

#imageBirdsBox {
    /*max-width: 700px;*/
}

.imageBirds-slideshow img {
    max-width: 100%;
    margin: 0 auto;
    text-align: center;
}

#imageBirdsBox .cycle-next {
    right: 0px;
    background: url(images/right.png) 50% 50% no-repeat;
    */
}

#imageBirdsBox .cycle-prev {
    left: 0px;
    background: url(images/left.png) 50% 50% no-repeat;
    */
}

#imageBirdsBox .cycle-prev,
#imageBirdsBox .cycle-next {
    position: absolute;
    top: 0px;
    width: 30%;
    /*opacity: 0;*/
    z-index: 1500;
    height: 100%;
    cursor: pointer;
}

#imageBirdsBox .cycle-prev:hover,
#imageBirdsBox .cycle-next:hover {
    opacity: 0.7;
}

#imgBirdsCaption {
    width: 100%;
    /* remove if align left caption 8*/
    position: relative;
    bottom: 0;
    z-index: 1000;
    /*margin: 0 10px; if caption align left*/
}

#imgBirdsCaption p {
    margin: 0;
    padding: 8px;
    font: bold 18px Arial;
    text-align: center;
    /* left to align captionl left */
    text-shadow: none;
    color: rgb(1, 75, 66);
    background: rgba(253, 248, 230, 0.8);
}

#imageBirdsBox .imgBirdsCaption-next {
    margin-left: 20px;
}

#birdsList {
    margin: 0 auto;
    max-width: 100%;
    overflow-x: scroll;
    overflow-y: hidden;
    white-space: nowrap;
    margin-top: 5px;
}

#birdsList img {
    margin: 0 auto;
    max-width: 100%;
    text-align: center;
    cursor: pointer;
}

#birdsList a {
    display: inline-block;
    margin: 0 auto;
    max-width: 20%;
    margin-top: 3px;
}