/* Sticky footer styles
-------------------------------------------------- */

html {
    position: relative;
    min-height: 100%;
}

body {
    /* Margin bottom by footer height */
    margin-bottom: 0px;
    overflow-y: scroll;
    text-shadow: 0 1px 0 #eee;
    /* font-family: 'Open Sans', Arial, sans-serif; */

    /*font-family: sans-serif; */
    /*font-family: 'Times new roman'; */
    /*font-family: Arial;*/
    /*font-family: 'Ubuntu'; */
    /*font-family: 'Merriweather'; */
    font-family: 'Open Sans';
    /*font-family: 'Roboto'; */
    /*font-family: 'Exo 2'; */
    /*font-family: 'Fira Sans'; */
    /*font-family: 'Cousine'; */
    /*font-family: 'Roboto Mono'; */
    /*font-family: 'Rubik'; */
    /*font-family: 'Arimo'; */
    /*font-family: 'Lora'; */

    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f9d2b3+0,ffffff+23,ffffff+77,f9d2b3+100 */
    background: rgb(249,210,179); /* Old browsers */
    background: -moz-linear-gradient(left, rgba(249,210,179,1) 0%, rgba(255,255,255,1) 23%, rgba(255,255,255,1) 77%, rgba(249,210,179,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left, rgba(249,210,179,1) 0%,rgba(255,255,255,1) 23%,rgba(255,255,255,1) 77%,rgba(249,210,179,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, rgba(249,210,179,1) 0%,rgba(255,255,255,1) 23%,rgba(255,255,255,1) 77%,rgba(249,210,179,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f9d2b3', endColorstr='#f9d2b3',GradientType=1 ); /* IE6-9 */

}

/* Not required for template or sticky footer method. */
body > .container, body > .container-fluid {
    padding: 80px 15px;
}


/* Nav bar custom CSS
-------------------------------------------------- */
.navbar {
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffdbc9+0,ff9172+99,473128+100 */
    background: #ffdbc9; /* Old browsers */
    background: -moz-linear-gradient(top, #ffdbc9 0%, #ff9172 99%, #473128 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #ffdbc9 0%,#ff9172 99%,#473128 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #ffdbc9 0%,#ff9172 99%,#473128 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffdbc9', endColorstr='#473128',GradientType=0 ); /* IE6-9 */

    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#fff1ea+0,ffb8a3+99,473128+100 */
    background: #fff1ea; /* Old browsers */
    background: -moz-linear-gradient(top, #fff1ea 0%, #ffb8a3 99%, #473128 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #fff1ea 0%,#ffb8a3 99%,#473128 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #fff1ea 0%,#ffb8a3 99%,#473128 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fff1ea', endColorstr='#473128',GradientType=0 ); /* IE6-9 */

}
.nav-item {
    margin: 5px 5px;
    /*border: 1px solid red;*/
}
.nav .nav-item .nav-link {
    color: #005FA3;
    transition: all .3s;
    font-size: 1.05rem;
}
.nav .nav-item .nav-link:hover {
    color: #01375E;
    text-shadow: 0 1px 0 #eee;
}
.nav .nav-item.active .nav-link {
    color: #013577;
}
.nav .nav-item.active .nav-link:hover {
    color: #011C3F;
}


/* Footer settings
-------------------------------------------------- */
.footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    /* Set the fixed height of the footer here */
    height: 60px;
    line-height: 58px;
    /* Vertically center the text there */
    font-weight: lighter;

    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#473128+0,f4e7e3+1,ffffff+100 */
    background: #473128; /* Old browsers */
    background: -moz-linear-gradient(top, #473128 0%, #f4e7e3 1%, #ffffff 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #473128 0%,#f4e7e3 1%,#ffffff 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #473128 0%,#f4e7e3 1%,#ffffff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#473128', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
}

/* Social buttons at footer
-------------------------------------------------- */
.social-buttons {
    margin-top: 18px;
}



/* Custom page CSS
-------------------------------------------------- */
#translateDirection {
    cursor: pointer;
}

.site-name {
    margin: 10px 0px 30px 0px;
}


/* Alphabet buttons
-------------------------------------------------- */

.letterButton {
    margin: 0px 8px 20px 8px;
    padding: 0px;
    /*border: 1px solid red;*/
    width: 68px;
}

.letter,
.transcription {
    width: 40px;
    line-height: 1.1;
    margin: 2px 0px 0px 10px;
    text-align: left;
    font-size: large;
    /*font-size: x-large;*/
    /*border: 1px solid orange;*/
}


.totalwords, .transcription, .voice {
    width: 36px;
    line-height: 1;
    font-size: x-small;
    margin: 0px 5px 4px 24px;
    text-align: right;
    color: #818a91;
    /*border: 1px solid green;*/
}

.transcription {
    display: none;
    /*color: #4F8AB8;*/
}

.voice {
    /*text-align: right;*/
    display: none;
    color: #FF4D4D;
}


/* Books page
-------------------------------------------------- */
.showdetails {
    color: #757A88;
    cursor: pointer;
}


/* Run Duration
-------------------------------------------------- */
.run_duration {
    font-size: small;
    color: #FF6550;
    margin: 10px 40px;
}


/* Alphabet
-------------------------------------------------- */
.card {
    box-shadow: 0px 1px 3px rgba(0,0,0,.3);
}

.abaza-alphabet {
    background-color: #E8023F;

    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffe3db+0,fffbf9+50,ffe3db+100 */
    background: #ffe3db; /* Old browsers */
    background: -moz-linear-gradient(top, #ffe3db 0%, #fffbf9 50%, #ffe3db 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #ffe3db 0%,#fffbf9 50%,#ffe3db 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #ffe3db 0%,#fffbf9 50%,#ffe3db 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffe3db', endColorstr='#ffe3db',GradientType=0 ); /* IE6-9 */

    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffcebf+0,fffbf9+50,ffcebf+100 */
    background: rgb(255,206,191); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(255,206,191,1) 0%, rgba(255,251,249,1) 50%, rgba(255,206,191,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(255,206,191,1) 0%,rgba(255,251,249,1) 50%,rgba(255,206,191,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(255,206,191,1) 0%,rgba(255,251,249,1) 50%,rgba(255,206,191,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffcebf', endColorstr='#ffcebf',GradientType=0 ); /* IE6-9 */
}

.ui-autocomplete {
    max-height: 300px;
    overflow: auto;
    overflow-y: auto;
    overflow-x:hidden;
}

/*DL, DT, DD TAGS LIST DATA*/

dl dt {
    /*font-weight: normal;*/
}

dl dt, dl dd {
    margin: 13px 0;
}