/* DEBUG
****************************************************************/
.themebox.debug * { background-color: rgba(255,0,0,.2); }
.themebox.debug * * { background-color: rgba(0,255,0,.2); }
.themebox.debug * * * { background-color: rgba(0,0,255,.2); }
.themebox.debug * * * * { background-color: rgba(255,0,255,.2); }
.themebox.debug * * * * * { background-color: rgba(0,255,255,.2); }
.themebox.debug * * * * * * { background-color: rgba(255,255,0,.2); }

/* WRAP
****************************************************************/
.themebox {
    position: fixed;
    left: 0;
    top: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    -webkit-transition : -webkit-filter 1s;
}



/* OVERLAY
****************************************************************/
.filter-rain {
    -webkit-transition : -webkit-filter 1s;
}
/* .overlay-dark {
    transition: background-color 1000ms linear;
} */


/* BOX
****************************************************************/
.lock {
    display: block;
    position: absolute;
    left: 0;
    top: 0;   
    /* z-index: 0;   */
    width: 100%;
    height: 100%;
    opacity: 1;
    overflow: hidden;
    transition: filter 1s, opacity 1s;
}



/* SKY
****************************************************************/
/* .skybox.dawn {background-image: url(/images/themes/island/sky-dawn.png);}
.skybox.day {background-image: url(/images/themes/island/sky-day.png);}
.skybox.dusk {background-image: url(/images/themes/island/sky-dusk.png);}
.skybox.night {background-image: url(/images/themes/island/sky-night.png);} */

.skybox {
    height: 128px;
}

.space {
    background-color: #031940;
}

/* .stars {
    transition: left 0.5s;
} */

.atmosphere {
    /* background-image: url(/images/themes/island/atmosphere.png); */
    background-position: 0 0;
    height: 512px;
    /* transition: top 1s; */
    background: -moz-linear-gradient(top,  rgba(16,37,73,0) 0%, rgba(18,41,76,0) 1%, rgba(118,214,247,1) 50%, rgba(118,214,247,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgba(16,37,73,0) 0%,rgba(18,41,76,0) 1%,rgba(118,214,247,1) 50%,rgba(118,214,247,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  rgba(16,37,73,0) 0%,rgba(18,41,76,0) 1%,rgba(118,214,247,1) 50%,rgba(118,214,247,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00102549', endColorstr='#76d6f7',GradientType=0 ); /* IE6-9 */
}

.horizon {
    opacity:0;
    height:64px;
    top: 64px;
    transition: opacity 1s;
}
.horizon-white {
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#102549+0,ffffff+100&0+1,1+100 */
background: -moz-linear-gradient(top,  rgba(16,37,73,0) 0%, rgba(18,39,75,0) 1%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(16,37,73,0) 0%,rgba(18,39,75,0) 1%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(16,37,73,0) 0%,rgba(18,39,75,0) 1%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00102549', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */

}
.horizon-orange {
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#102549+0,f06b0e+100&0+1,1+100 */
background: -moz-linear-gradient(top,  rgba(16,37,73,0) 0%, rgba(18,38,72,0) 1%, rgba(240,107,14,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(16,37,73,0) 0%,rgba(18,38,72,0) 1%,rgba(240,107,14,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(16,37,73,0) 0%,rgba(18,38,72,0) 1%,rgba(240,107,14,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00102549', endColorstr='#f06b0e',GradientType=0 ); /* IE6-9 */

}
.horizon-purple {
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#102549+0,98647b+100&0+1,1+100 */
background: -moz-linear-gradient(top,  rgba(16,37,73,0) 0%, rgba(17,38,74,0) 1%, rgba(152,100,123,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(16,37,73,0) 0%,rgba(17,38,74,0) 1%,rgba(152,100,123,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(16,37,73,0) 0%,rgba(17,38,74,0) 1%,rgba(152,100,123,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00102549', endColorstr='#98647b',GradientType=0 ); /* IE6-9 */

}

.sun,
.moon  {
    width: 256px;
    height: 256px;
    background: url(/images/themes/island/sun.png) repeat scroll 0 0 rgba(0, 0, 0, 0);
    transition: top 0.5s;
}
.moon {
    background-image: url(/images/themes/island/moon.png);
}


.cloud {
	transform-origin: bottom center;
}


/* 	WATER
****************************************************************/
.ocean {
    top: 128px;
    background: url(/images/themes/island/water-day.png) repeat-x scroll 0 0 #006599;
}

.wave {
    position: absolute;
    transform-origin: bottom center;
}




/* 	ISLAND3
****************************************************************/
.island3 {
    left: 78%;
    top: 103px;
    z-index: 3;
    width: 399px;
    height: 38px;
    margin-left: -200px;
    background: url(/images/themes/island/bgisland2-day.png) repeat scroll 0 0 rgba(0, 0, 0, 0);
}

/* 	ISLAND2
****************************************************************/
.island2 {
    left: 18%;
    top: 103px;
    z-index: 3;
    width: 556px;
    height: 38px;
    margin-left: -260px;
    background: url(/images/themes/island/bgisland1-day.png) repeat scroll 0 0 rgba(0, 0, 0, 0);
}


/* 	ISLAND1
****************************************************************/
/* .island1 {
    left: 50%;
    top: 71px;
    width: 520px;
    height: 190px;
    margin-left: -260px;
    background: url(/images/themes/island/island2.png) repeat scroll 0 0 rgba(0, 0, 0, 0);
} */
.island {
    /* left: 50%;
    top: 71px; */
    /* width: 520px; */
    /* height: 190px; */
    /* margin-left: -260px; */
}




/* 	BOAT
****************************************************************/
.boatbox {
    left: 42%;
    top: 160px;
    width: 97px;
    height: 79px;
	z-index: 11;
}

.boatproper,
.boatwater {
    background-size: 60%;  
    background-repeat: no-repeat;
    left: 0px;    
}

.boatproper {
    top: 20px;
    width: 100px;
    height: 96px;
    background-image: url(/images/themes/island/vikingship.png);
}
/* .night #boatproper { */
    /*background-image: url(/images/themes/island/boat-night.png);*/
    /* filter: brightness(.3); */
/* } */
.boatwater {
    top: auto;
    bottom: 0px;
    width: 90px;
    height: 9px;
    background-image: url(/images/themes/island/boat-water.png);
}
/* .night #boatwater { */
    /*display: none;*/
    /* filter: brightness(0); */
/* } */


/* TREE
****************************************************************/
.tree {
    z-index: 12;
    width: 60px;
    height: 60px;
    background-image: url(/images/themes/island/tree-sprite.png);
    background-position: 60px 60px;
}

.treemini {
    z-index: 11;
    width: 30px;
    height: 30px;
    background-image: url(/images/themes/island/tree-sprite-small.png);
    background-position: 30px 30px;
}
