@font-face {
    font-family: 'PinkLipGloss';
    src: url('../font/PinkLipGloss.woff2') format('woff2'),
         url('../font/PinkLipGloss.woff') format('woff'),
         url('../font/PinkLipGloss.ttf') format('truetype');
    font-weight: bold;
}	

@font-face {
    font-family: 'Crayon';
    src: url('../font/Crayon.woff2') format('woff2'),
         url('../font/Crayon.woff') format('woff'),
         url('../font/Crayon.ttf') format('truetype');
    font-weight: bold;
}	

@font-face {
    font-family: 'Princess';
    src: url('../font/Princesses.woff2') format('woff2'),
         url('../font/Princesses.woff') format('woff'),
         url('../font/Princesses.ttf') format('truetype');
}	
@font-face {
    font-family: 'Toys';
    src: url('../font/Toys.woff2') format('woff2'),
         url('../font/Toys.woff') format('woff'),
         url('../font/Toys.ttf') format('truetype');
}	

@font-face {
    font-family: 'Pangolin';
    src: url('../font/Pangolin.woff2') format('woff2'),
         url('../font/Pangolin-Regular.woff') format('woff'),
         url('../font/Pangolin-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
  }

@font-face {
    font-family: 'ShePersisted';
    src: url('../font/KGShePersisted.woff2') format('woff2'),
         url('../font/KGShePersisted.woff') format('woff'),
         url('../font/KGShePersisted.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'FunnyCute';
    src: url('../font/FunnyCute.woff2') format('woff2'),
         url('../font/Funny&Cute.woff') format('woff'),
         url('../font/Funny&Cute.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}


html {
    height:100%;
    background: url(../img/page_bg.jpg) repeat-x top;
}
body {
    margin: 0px;
    padding: 0px;
    color: #666666;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    line-height: 20px;
    background-color: rgb(228, 248, 255);

    background: -moz-linear-gradient( top ,
        rgb(154, 235, 192) 100%,
        rgb(228, 248, 255) 100%);
    background: -webkit-gradient(linear,  left top,  right top, 
        color-stop(0%, rgb(154, 235, 192)), 
        color-stop(100%, rgb(228, 248, 255)));




    /*background: url(../img/bg_pattern.jpg) repeat-x top;*/
    background-image: url(../img/bg_pattern.jpg);
    background-repeat: no-repeat;
    background-position:  center top;
}

h2 {
    color: #21C1F5;
    font-family: 'ShePersisted';
}

h4 {

}

#contentContainer {
    height: 100%;
}

#footer {

}

.subfooter1 {
    min-height: 426px;
    width: 100%;
    background: url(../img/bg_footer.png) no-repeat center bottom;
    float:left;
}

.subfooter2 {
    min-height: 426px;
    width: 100%;
    background: url(../img/footer_tile.jpg) repeat-x center bottom;
    
}

.content_inner {
    margin-top: 5px;
}

.content_outer {
    border: rgb(129, 129, 129) solid thin;
    border-radius: 10px;
    background: #fbfceb;
    padding: 15px;
    margin:5px;
    width: 100%;
    box-shadow: 10px 10px 5px #888888;
}

#logo {
    width: 376px;
    height: 110px;
    margin-top: 8px;
    display: flex;
    justify-content: center;
    align-content: center;
    flex-direction: column;
    text-align: center;
    font-family: ShePersisted;
    font-size: 50px;
    font-weight: bolder;
    text-shadow: 0 2px 4px grey;
}

#logo a {
    text-decoration: none;	
    color: rgb(238, 55, 64);
    -webkit-text-stroke: 2px #6C348D;
}

#logo a:hover {
    color:pink;
    -webkit-text-stroke: 2px purple; 
}

@media all and (min-width: 1000px){
    #logo_left {
        width: 178px;
        height: 110px;
        background: url(../img/birdleft.png) repeat-x top;
        background-position: left;
    }
    
    #logo_center {
        margin-top: 0px;
        float: left;
        background: url(../img/birdcenter.png) repeat-x top;
    }
    
    #logo_right {
        width: 197px;
        height: 110px;
        background: url(../img/birdright.png) repeat-x top;
        background-position: right;
    }
}



.menu {
    margin: 5px;
    background-color: lemonchiffon;
    box-shadow: 10px 10px 5px #888888;
    border-radius: 15px 15px 15px 15px;
    background: red; /* not working, let's see some red */
    background: -moz-linear-gradient( top ,
        #ED1B24 0%,
        #F7941D 20%,
        #FEF200 40%,
        #20A35D 60%,
        #76C0EF 80%
        #6C348D 100%);
    background: -webkit-gradient(linear,  left top,  right top, 
        color-stop(0%, #ED1B24), 
        color-stop(20%, #F7941D),
        color-stop(40%, #FEF200),
        color-stop(60%, #20A35D),
        color-stop(80%, #76C0EF),
        color-stop(100%, #6C348D));
    border: solid thin white;
}

.menu-item {
    /*border-right: white thin solid;*/
    font-family: Crayon;
    color: white;
    font-size: 1.75em;
    text-shadow: 0 3px 0 #414141;
    vertical-align: middle;
}

.menu-item a {
    color: white;
}

.menu-item a:hover {
    color: rgb(82, 82, 82);
    text-shadow: 0 3px 0 white;
}

.newsDate { 
    background-color:#ff6100; 
    float: right;
    position: relative;
    padding: 45px 5px 0px;
    margin-left: 10px;
    color: white;
    font-family: arial;
} 
.newsDate .newsMonth {
    text-transform: uppercase;
    font-size:25px;
}
.newsDate .newsDay {
    font-size:35px;
    line-height:45px;
    position:absolute; 
    left:5px; 
    top:0px;
}
.newsDate .newsYear { 
    display:block; 
    position:absolute; 
    right:-5px; 
    top:15px;
    transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg); 
    -moz-transform: rotate(-90deg);			
}

.newsContainer {
    margin-top: 1.5em;
    margin-bottom: 1.5em;
}

.newsTitle {
    color:#ff6100; 
    font-family: 'ShePersisted';
    font-size: 1.5em;
}


.newsArticle {
    font-family: Arial, Helvetica, sans-serif;
}

.socialMedia {
    margin-top:.1em;
    margin-right:1em;
    height:1.4em;
    width: 1.5em;
}

.facebook a {
    height:100%; 
    width: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position-x: center;
    background-position-y: center;
    background-image: url('/img/facebookwhite.png')
}

.facebook a:hover {
    background-image: url('/img/facebookgrey.png')
}

.instagram a {
    height:100%; 
    width: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position-x: center;
    background-position-y: center;
    background-image: url('/img/instagramwhite.png')
}

.instagram a:hover {
    background-image: url('/img/instagramgrey.png')
}

.twitter a {
    height:100%; 
    width: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position-x: center;
    background-position-y: center;
    background-image: url('/img/twitterwhite.png')
}

.twitter a:hover {
    background-image: url('/img/twittergrey.png')
}

.pinterest a {
    height:100%; 
    width: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position-x: center;
    background-position-y: center;
    background-image: url('/img/pinterestwhite.png')
}

.pinterest a:hover {
    background-image: url('/img/pinterestgrey.png')
}

.polaroid {
    position: relative;
    width: 220px;
  }
   
.polaroid img {
    border: 10px solid #fff;
    border-bottom: 45px solid #fff;
    webkit-box-shadow: 3px 3px 3px #777;
    -moz-box-shadow: 3px 3px 3px #777;
    box-shadow: 3px 3px 3px #777;
}

.polaroid p {
    position: absolute;
    text-align: center;
    width: 100%;
    bottom: 0px;
    font: 400 18px/1 'Kaushan Script', cursive;
    color: #888;
}

.treePhotoGalleryContainer {
    background-color: #888888;
    padding:10px;
    background-color: #ff0000;
    background-image: linear-gradient(315deg, #ff0000 0%, #03a516 74%);
    border-radius: 10px;
    box-shadow: 10px 10px 5px #bbbbbb;
}