@import url('https://fonts.googleapis.com/css?family=Bad+Srcipt|Bilbo|Calligraffitti|Give+You+Glory|Great+Vibes|Homemade+Apple|Indie+Flower|La+Belle+Aurore|Parisienne|Reenie+Beanie|The+Girl+Next+Door|Zeyada');


.navbar-light, .navbar-expand{
    background-color: rgba(0,0,0,0);
}

.fb-comments, .comments {
    background-color: rgba(255, 255, 255, 0.4);
    border-radius: 0 0 1.25em 1.25em;
}

.navbar-nav {
    width: 100%;
    font-size: 2em;
}

.nav-link {
    font-size: 1em;
}

.navbar-expand-lg .navbar-nav {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

.navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255,207,64, 0.7)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E") !important;
}

/*scrollbar*/
/* width */
::-webkit-scrollbar {
    width: .8em;
}

/* Track */
::-webkit-scrollbar-track {
    background: rgba(1, 1, 1, 0);
    border-radius: 10px;
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, .3);
    border-radius: 1em;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 255, 255, .5);
}
/*scrollbar end*/

#welcome {
    height: 40em;
}

#welcome > p {
    font-size: 1.5em;
}

#inform > p {
    font-size: 1.5em !important;
}

#big {
	font-size: 1.5em !important;
}

.title-text {
    font-family: 'Great Vibes', cursive;
    font-size: 5em;
    padding-bottom: 0.2em;
    padding-top: 0em;
    text-align: center;
}

h1, p, .nav-link, h4, h5, label, input[placeholder], textarea[placeholder] {
    color: #ffffff !important;
    font-family: 'Indie Flower', cursive;
}

.active {
    color: #ffcf40 !important;
    font-weight: bold;
}

.gold {
    color: #ffcf40 !important;
}

body {
    background-image: url("https://i.imgur.com/RlEkmmM.jpg");
    -moz-background-image: url("https://i.imgur.com/RlEkmmM.jpg");
    -o-background-image: url("https://i.imgur.com/RlEkmmM.jpg");
    -webkit-background-image: url("https://i.imgur.com/RlEkmmM.jpg");
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
}

/*backgrounds*/
.container {
    background-color: rgba(1,1,1,0.45);
}

#img-main {
    width: 100%;
    max-width: 500px;
    min-width: 260px;
    outline: 2px solid white;
    outline-offset: -1.2em;
    border-color: white;
    border-width: thick;
    border-style: outset;
}

.overflow {
    overflow-y: scroll;
}

.page {
    margin-top: 3em;
    margin-bottom: 3em;
    border-radius: 2em;
    padding-top: 2em;
    padding-right: 2em;
    padding-bottom: 2em;
}

/*Register*/

input[type=text], input[type=email], input[type=date], input[type=tel], textarea {
    background-color: rgba(0,0,0,0) !important;
    color: #ffcf40 !important;
}



/*Family Tree*/

#family-tree {
    overflow: scroll;
    width: 100%;
    max-height: 36em;
}

.person {
    font-size: 1.6em;
    font-family: 'Indie Flower', cursive;
    color: #ffcf40 !important;
    text-decoration: none !important;
}

.partner {
    font-size: 1.6em;
    font-family: 'Indie Flower', cursive;
    color: #ffffff !important;
    text-decoration: none !important;
}

ul:not(#tree-start) {
    display: none;
    border-left: 2px solid;
    border-image-source: linear-gradient(transparent, white, white, transparent);
    border-image-slice: 2;
    padding-left: 1em;
}

ul, ul > li, li {
    list-style-type: none;
}

li, ul {
    margin: 1em;
    white-space: nowrap;
}

#tree-success, #personal-success {
    display: none;
}




/*Photo album*/
.album {
    height: 40em;
    border-radius: 2em;
    max-height: 36em;
    overflow-y: scroll;
}

.lazyload {
    width: 100%;
    white-space: nowrap;
    padding: .3em;
    border-radius: 1em;
}

#photo1, #photo2, #photo3 {
    padding-left: 0;
    padding-right: 0;
}


/*Videos*/

iframe {
    border: none;
    padding: 0 !important;
}

/*.vid-item {*/
/*height: 30em;*/
/*width: auto;*/
/*}*/





@media (max-width:575.98px) {
    /*#family-tree {*/
    /*max-width: 20em;*/
    /*}*/

    #img-main {
        margin-top: 2em;
        margin-bottom: 2em;
    }
}

@media (min-width:576px) and (max-width: 767.98px) {
    /*#family-tree {*/
    /*max-width: 30em;*/
    /*}*/

    #img-main {
        margin-top: 2em;
        margin-bottom: 2em;
    }
}

@media (min-width:768px) and (max-width: 991.98px) {
    /*#family-tree {*/
    /*max-width: 40em;*/
    /*}*/

    .intro {
        margin-top: 2em;
        margin-bottom: 2em;
    }
}

@media (min-width:992px) and (max-width: 1199.98px) {
    /*#family-tree {*/
    /*max-width: 40em;*/
    /*}*/

    .intro {
        margin-top: 2em;
        margin-bottom: 2em;
    }
}

@media (min-width:1200px) {
    /*#family-tree {*/
    /*max-width: 50em;*/
    /*}*/

    .intro {
        margin-top: 2em;
        margin-bottom: 2em;
    }
}