﻿/*
                                                 ,  ,
                                               / \/ \
                                              (/ //_ \_
     .-._                                      \||  .  \
      \  '-._                            _,:__.-"/---\_ \
 ______/___  '.    .--------------------'~-'--.)__( , )\ \
`'--.___  _\  /    |             Here        ,'    \)|\ `\|
     /_.-' _\ \ _:,_          Be Dragons           " ||   (
   .'__ _.' \'-/,`-~`                                |/
       '. ___.> /=,|  Abandon hope all ye who enter  |
        / .-'/_ )  '---------------------------------'
        )'  ( /(/
             \\ "
              '=='


    // If you're reading this, then this CSS file is still completely fucking embarassing.
    // It's hard to say what I was thinking when we first built this, but I was clearly not in my right mind.
    // This file has multiple media query breakpoints. Each breakpoint has ALL of the mobile first classes
    // copy/pasted into them with values changed. The final result is this overly-bloated mess. 
    // Correcting the mistakes made here will take a long time. I know this as I have tried 3 times now to
    // sit down and do it, only to get exhausted.

    // It is my recommendation that this stylesheet be left alone until a redesign of this site. Only then
    // can my sins be atoned for.
*/

.soft-launch {
    margin: 15px 15px -15px 15px;
    padding: 10px 20px;
    background: #fffb9b;
    border: solid 3px #ffc148;
    border-radius: 20px;
    position:relative;
    z-index: 999;
}

.desktop {
    display: none;
}

.soft-disclaimer {
    color: #a08551;
}

.no-padding { 
    padding:0;
}

@font-face {
    font-family: 'Gotham';
    src: url('../fonts/Gotham/Gotham-ExtraLightItalic.eot');
    src: url('../fonts/Gotham/Gotham-ExtraLightItalic.eot?#iefix') format('embedded-opentype'), url('../fonts/Gotham/Gotham-ExtraLightItalic.woff2') format('woff2'), url('../fonts/Gotham/Gotham-ExtraLightItalic.woff') format('woff'), url('../fonts/Gotham/Gotham-ExtraLightItalic.ttf') format('truetype'), url('../fonts/Gotham/Gotham-ExtraLightItalic.svg#Gotham-ExtraLightItalic') format('svg');
    font-weight: 200;
    font-style: italic;
}

@font-face {
    font-family: 'Gotham';
    src: url('../fonts/Gotham/Gotham-BookItalic.eot');
    src: url('../fonts/Gotham/Gotham-BookItalic.eot?#iefix') format('embedded-opentype'), url('../fonts/Gotham/Gotham-BookItalic.woff2') format('woff2'), url('../fonts/Gotham/Gotham-BookItalic.woff') format('woff'), url('../fonts/Gotham/Gotham-BookItalic.ttf') format('truetype'), url('../fonts/Gotham/Gotham-BookItalic.svg#Gotham-BookItalic') format('svg');
    font-weight: 400;
    font-style: italic;
}

@font-face {
    font-family: 'Gotham';
    src: url('../fonts/Gotham/Gotham-Medium.eot');
    src: url('../fonts/Gotham/Gotham-Medium.eot?#iefix') format('embedded-opentype'), url('../fonts/Gotham/Gotham-Medium.woff2') format('woff2'), url('../fonts/Gotham/Gotham-Medium.woff') format('woff'), url('../fonts/Gotham/Gotham-Medium.ttf') format('truetype'), url('../fonts/Gotham/Gotham-Medium.svg#Gotham-Medium') format('svg');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Gotham';
    src: url('../fonts/Gotham/Gotham-ExtraLight.eot');
    src: url('../fonts/Gotham/Gotham-ExtraLight.eot?#iefix') format('embedded-opentype'), url('../fonts/Gotham/Gotham-ExtraLight.woff2') format('woff2'), url('../fonts/Gotham/Gotham-ExtraLight.woff') format('woff'), url('../fonts/Gotham/Gotham-ExtraLight.ttf') format('truetype'), url('../fonts/Gotham/Gotham-ExtraLight.svg#Gotham-ExtraLight') format('svg');
    font-weight: 200;
    font-style: normal;
}

@font-face {
    font-family: 'Gotham';
    src: url('../fonts/Gotham/Gotham-Thin.eot');
    src: url('../fonts/Gotham/Gotham-Thin.eot?#iefix') format('embedded-opentype'), url('../fonts/Gotham/Gotham-Thin.woff2') format('woff2'), url('../fonts/Gotham/Gotham-Thin.woff') format('woff'), url('../fonts/Gotham/Gotham-Thin.ttf') format('truetype'), url('../fonts/Gotham/Gotham-Thin.svg#Gotham-Thin') format('svg');
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: 'Gotham';
    src: url('../fonts/Gotham/Gotham-LightItalic.eot');
    src: url('../fonts/Gotham/Gotham-LightItalic.eot?#iefix') format('embedded-opentype'), url('../fonts/Gotham/Gotham-LightItalic.woff2') format('woff2'), url('../fonts/Gotham/Gotham-LightItalic.woff') format('woff'), url('../fonts/Gotham/Gotham-LightItalic.ttf') format('truetype'), url('../fonts/Gotham/Gotham-LightItalic.svg#Gotham-LightItalic') format('svg');
    font-weight: 300;
    font-style: italic;
}

@font-face {
    font-family: 'Gotham';
    src: url('../fonts/Gotham/Gotham-Light.eot');
    src: url('../fonts/Gotham/Gotham-Light.eot?#iefix') format('embedded-opentype'), url('../fonts/Gotham/Gotham-Light.woff2') format('woff2'), url('../fonts/Gotham/Gotham-Light.woff') format('woff'), url('../fonts/Gotham/Gotham-Light.ttf') format('truetype'), url('../fonts/Gotham/Gotham-Light.svg#Gotham-Light') format('svg');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Gotham';
    src: url('../fonts/Gotham/Gotham-Book.eot');
    src: url('../fonts/Gotham/Gotham-Book.eot?#iefix') format('embedded-opentype'), url('../fonts/Gotham/Gotham-Book.woff2') format('woff2'), url('../fonts/Gotham/Gotham-Book.woff') format('woff'), url('../fonts/Gotham/Gotham-Book.ttf') format('truetype'), url('../fonts/Gotham/Gotham-Book.svg#Gotham-Book') format('svg');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Gotham';
    src: url('../fonts/Gotham/Gotham-Bold.eot');
    src: url('../fonts/Gotham/Gotham-Bold.eot?#iefix') format('embedded-opentype'), url('../fonts/Gotham/Gotham-Bold.woff2') format('woff2'), url('../fonts/Gotham/Gotham-Bold.woff') format('woff'), url('../fonts/Gotham/Gotham-Bold.ttf') format('truetype'), url('../fonts/Gotham/Gotham-Bold.svg#Gotham-Bold') format('svg');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'Gotham';
    src: url('../fonts/Gotham/Gotham-Black.eot');
    src: url('../fonts/Gotham/Gotham-Black.eot?#iefix') format('embedded-opentype'), url('../fonts/Gotham/Gotham-Black.woff2') format('woff2'), url('../fonts/Gotham/Gotham-Black.woff') format('woff'), url('../fonts/Gotham/Gotham-Black.ttf') format('truetype'), url('../fonts/Gotham/Gotham-Black.svg#Gotham-Black') format('svg');
    font-weight: 800;
    font-style: normal;
}

@font-face {
    font-family: 'Gotham';
    src: url('../fonts/Gotham/Gotham-UltraItalic.eot');
    src: url('../fonts/Gotham/Gotham-UltraItalic.eot?#iefix') format('embedded-opentype'), url('../fonts/Gotham/Gotham-UltraItalic.woff2') format('woff2'), url('../fonts/Gotham/Gotham-UltraItalic.woff') format('woff'), url('../fonts/Gotham/Gotham-UltraItalic.ttf') format('truetype'), url('../fonts/Gotham/Gotham-UltraItalic.svg#Gotham-UltraItalic') format('svg');
    font-weight: 900;
    font-style: italic;
}

@font-face {
    font-family: 'Gotham';
    src: url('../fonts/Gotham/Gotham-BlackItalic.eot');
    src: url('../fonts/Gotham/Gotham-BlackItalic.eot?#iefix') format('embedded-opentype'), url('../fonts/Gotham/Gotham-BlackItalic.woff2') format('woff2'), url('../fonts/Gotham/Gotham-BlackItalic.woff') format('woff'), url('../fonts/Gotham/Gotham-BlackItalic.ttf') format('truetype'), url('../fonts/Gotham/Gotham-BlackItalic.svg#Gotham-BlackItalic') format('svg');
    font-weight: 800;
    font-style: italic;
}

@font-face {
    font-family: 'Gotham';
    src: url('../fonts/Gotham/Gotham-MediumItalic.eot');
    src: url('../fonts/Gotham/Gotham-MediumItalic.eot?#iefix') format('embedded-opentype'), url('../fonts/Gotham/Gotham-MediumItalic.woff2') format('woff2'), url('../fonts/Gotham/Gotham-MediumItalic.woff') format('woff'), url('../fonts/Gotham/Gotham-MediumItalic.ttf') format('truetype'), url('../fonts/Gotham/Gotham-MediumItalic.svg#Gotham-MediumItalic') format('svg');
    font-weight: 500;
    font-style: italic;
}

@font-face {
    font-family: 'Gotham';
    src: url('../fonts/Gotham/Gotham-BoldItalic.eot');
    src: url('../fonts/Gotham/Gotham-BoldItalic.eot?#iefix') format('embedded-opentype'), url('../fonts/Gotham/Gotham-BoldItalic.woff2') format('woff2'), url('../fonts/Gotham/Gotham-BoldItalic.woff') format('woff'), url('../fonts/Gotham/Gotham-BoldItalic.ttf') format('truetype'), url('../fonts/Gotham/Gotham-BoldItalic.svg#Gotham-BoldItalic') format('svg');
    font-weight: 600;
    font-style: italic;
}

@font-face {
    font-family: 'Gotham';
    src: url('../fonts/Gotham/Gotham-ThinItalic.eot');
    src: url('../fonts/Gotham/Gotham-ThinItalic.eot?#iefix') format('embedded-opentype'), url('../fonts/Gotham/Gotham-ThinItalic.woff2') format('woff2'), url('../fonts/Gotham/Gotham-ThinItalic.woff') format('woff'), url('../fonts/Gotham/Gotham-ThinItalic.ttf') format('truetype'), url('../fonts/Gotham/Gotham-ThinItalic.svg#Gotham-ThinItalic') format('svg');
    font-weight: 200;
    font-style: italic;
}

@font-face {
    font-family: 'Gotham';
    src: url('../fonts/Gotham/Gotham-Ultra.eot');
    src: url('../fonts/Gotham/Gotham-Ultra.eot?#iefix') format('embedded-opentype'), url('../fonts/Gotham/Gotham-Ultra.woff2') format('woff2'), url('../fonts/Gotham/Gotham-Ultra.woff') format('woff'), url('../fonts/Gotham/Gotham-Ultra.ttf') format('truetype'), url('../fonts/Gotham/Gotham-Ultra.svg#Gotham-Ultra') format('svg');
    font-weight: 900;
    font-style: normal;
}

.search-entry {
    position: absolute;
    top: 50%;
    left: 10%;
    width: 80%;
    color: rgb(255, 255, 255);
    background: rgba(0, 0, 0, 0);
    font-size: 40px;
    font-weight: 500;
    text-align: center;
    border: 0px;
    margin: 0px auto;
    margin-top: -51px;
    padding-left: 30px;
    padding-right: 30px;
    outline: none;
    border: 2px rgba(207, 80, 80, 0.6) solid;
    max-width: 100%;
    padding-bottom: 0;
}

.builder-sentence {
    position: absolute;
    top: 50%;
    left: 10%;
    width: 80%;
    color: rgb(255, 255, 255);
    background: rgba(0, 0, 0, 0);
    font-size: 40px;
    font-weight: 500;
    text-align: center;
    border: 0px;
    margin: 0px auto;
    margin-top: -51px;
    padding-left: 30px;
    padding-right: 30px;
    outline: none;
    border-bottom: 2px rgba(207, 80, 80, 0.6) solid;
    max-width: 100%;
    padding-bottom: 0;
}

    .search-entry::after {
        content: " "; 
        display: block; 
        width: 0;
        height: 0;
        border-left: 10px solid transparent; 
        border-right: 10px solid transparent;
        border-top: 10px rgba(207, 80, 80, 0.6) solid;
        margin-left: auto;
        margin-right: auto; 
    }

.search-entry option{
    background-color:#000;
}

.search-label {
    position: absolute;
    top: 50%;
    left: 10%;
    width: 80%;
    color: rgb(255, 255, 255);
    background: rgba(0, 0, 0, 0);
    font-size: 30px;
    font-weight: 500;
    text-align: left;
    border: 0px;
    margin: 0px auto;
    margin-top: -95px;
    padding-left: 30px;
    padding-right: 30px;
    outline: none;
    max-width: 100%;
}

@media only screen and (max-width: 40em) {
    @media only screen {
        body {
            padding-top: 50px;
            padding-bottom: 20px;
            font-family: "Gotham", Helvetica, Arial, sans-serif;
            background-color: transparent;
            width: 100%;
        }

        .concrete {
            background-image: url('images/concrete.png');
            background-repeat: repeat;
            background-position: center center;
        }


        .word-count {
            position: absolute;
            top: -20px;
            right: 60px;
        }

        .potawatomi-count {
            color: #fdcd34;
            text-align: center;
            font-size: 24px;
            letter-spacing: 4px;
            text-transform: uppercase;
            margin-top: -5px;
        }

        .potawatomi-number {
            font-size: 72px;
            color: #fff;
            text-align: center;
        }

        .video-title-block {
            width: 100%;
        }

        .video-block {
            padding-top: 25px;
        }

        .video-button {
            font-size: 14px;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 5px;
            border: 2px #333 solid;
            padding: 10px 20px;
            margin-bottom: 8px;
            border-radius: 0px;
            width: 100%;
            transition: all ease-in-out 0.5s;
        }

            .video-button:hover {
                color: #fff;
                background-color: #333;
                transition: all ease-in-out 0.5s;
            }

        .video-title {
            font-weight: 700;
            font-size: 16px;
            letter-spacing: 4px;
            color: #ababab;
        }

        .hasaudio {
            position: relative;
            top:-1px;
            font-size:24px;
            padding-right:8px;
        }

        .english-e {
            font-size: 19px;
            font-weight: 600;
            color: #cf5050;
            padding-left: 28px;
        }

        .english-example {
            font-weight: 400;
            font-size: 20px;
            font-style: italic;
        }

        .english-block {
            padding-left: 28px;
        }


        /* Set padding to keep content from hitting the edges */
        .body-content {
            padding-left: 15px;
            padding-right: 15px;
        }

        .row {
            margin-left: 0px;
            margin-right: 0px;
        }

        #wrapper {
            padding-left: 40px;
            transition: all .4s ease 0s;
            height: 100%
        }

        #sidebar-wrapper {
            margin-left: -150px;
            height: 10%;
            bottom: 0px;
            background: #222;
            position: fixed;
            z-index: 10000;
        }

        .sidebar-nav {
            display: block;
            float: left;
            width: 100%;
            list-style: none;
            margin: 0;
            padding: 0;
        }

        .learn {
            display: none;
        }

        .help-mobile {
            position: relative;
            left: 0px;
        }

        .tags-mobile {
            position: relative;
            left: 2px;
        }

        .banner {
            padding-right: 0px;
        }

        .home-mobile {
            position: relative;
            left: -4px;
        }

        .search-mobile {
            position: relative;
            left: -5px;
        }

        #page-content-wrapper {
            padding-left: 0;
            margin-left: 0;
            width: 100%;
            height: auto;
        }

        .nav-word {
            display: none;
        }

        #wrapper.active {
            padding-left: 180px;
        }

            #wrapper.active #sidebar-wrapper {
                left: 150px;
            }

        #page-content-wrapper {
            width: 100%;
        }

        #sidebar_menu li a, .sidebar-nav li a {
            color: #e2e2e2;
            display: block;
            float: left;
            text-decoration: none;
            width: 20%;
            background: #191919;
            -webkit-transition: background .5s;
            -moz-transition: background .5s;
            -o-transition: background .5s;
            -ms-transition: background .5s;
            transition: background .5s;
            padding: 0 0 env(safe-area-inset-bottom) 0;
        }

        .sidebar_name {
            padding-top: 25px;
            color: #fff;
            opacity: .7;
        }

        input[type='text'], [type='email'], select, textarea {
            background: none;
            border: none;
            border-bottom: solid 2px #474544;
            color: #474544;
            font-size: 1.000em;
            font-weight: 500;
            letter-spacing: 1px;
            margin: 0em 0 1.875em 0;
            padding: 0 0 0.875em 0;
            text-transform: uppercase;
            width: 100%;
            -webkit-box-sizing: border-box;
            -moz-box-sizing: border-box;
            -ms-box-sizing: border-box;
            -o-box-sizing: border-box;
            box-sizing: border-box;
            -webkit-transition: all 0.3s;
            -moz-transition: all 0.3s;
            -ms-transition: all 0.3s;
            -o-transition: all 0.3s;
            transition: all 0.3s;
        }

            input[type='text']:focus, [type='email']:focus, textarea:focus {
                outline: none;
                padding: 0 0 0.875em 0;
            }

        .message {
            float: none;
        }

        .name {
            float: left;
            width: 100%;
        }

        select {
            background: url('https://cdn4.iconfinder.com/data/icons/ionicons/512/icon-ios7-arrow-down-32.png') no-repeat right;
            outline: none;
            -moz-appearance: none;
            -webkit-appearance: none;
        }

            select::-ms-expand {
                display: none;
            }

        .subject {
            width: 100%;
        }

        .telephone {
            width: 100%;
        }

        textarea {
            line-height: 150%;
            height: 150px;
            resize: none;
            width: 100%;
        }

        ::-webkit-input-placeholder {
            color: #474544;
        }

        :-moz-placeholder {
            color: #474544;
            opacity: 1;
        }

        ::-moz-placeholder {
            color: #474544;
            opacity: 1;
        }

        :-ms-input-placeholder {
            color: #474544;
        }

        #form_button {
            background: none;
            border: solid 2px #474544;
            color: #474544;
            cursor: pointer;
            display: inline-block;
            font-size: 1.8em;
            font-weight: bold;
            outline: none;
            padding: 20px 35px;
            letter-spacing: 5px;
            text-transform: uppercase;
            -webkit-transition: all 0.3s;
            -moz-transition: all 0.3s;
            -ms-transition: all 0.3s;
            -o-transition: all 0.3s;
            transition: all 0.3s;
        }

       .thanks {
            text-align:center;
            position:relative;
            top:0px;
            left:0%;
            padding: 25px;
            background: #cdf2d0;
            border-radius: 20px;
            border: 2px solid #8db584;
        }

        .failure {
            text-align: center;
            position: relative;
            top: 135px;
            left: 0%;
            padding: 25px;
            background: #f2cdcd;
            border-radius: 20px;
            border: 2px solid #d58484;
        }

        .thanks-text {
            font-size: 26px;
            text-transform: uppercase;
        }

        .failure-text {
            font-size: 26px;
            text-transform: uppercase;
        }

        .visible {
            visibility: visible;
            opacity: 1;
            -webkit-animation: fadein 1s; /* Safari, Chrome and Opera > 12.1 */
            -moz-animation: fadein 1s; /* Firefox < 16 */
            -ms-animation: fadein 1s; /* Internet Explorer */
            -o-animation: fadein 1s; /* Opera < 12.1 */
            animation: fadein 1s;
        }

        .hidden {
            visibility: hidden;
            opacity: 0;
            -webkit-animation: fadein 1s; /* Safari, Chrome and Opera > 12.1 */
            -moz-animation: fadein 1s; /* Firefox < 16 */
            -ms-animation: fadein 1s; /* Internet Explorer */
            -o-animation: fadein 1s; /* Opera < 12.1 */
            animation: fadein 1s;
        }
          

        .contact-text-title {
            text-transform: uppercase;
            font-weight: 600;
            font-size: 41px;
            letter-spacing: 3px;
        }

        .contact-text-content {
            font-size: 21px;
            font-weight: 400;
        }

        .contact-image {
            display:none;
            padding-bottom: 20px;
        }

        #form_button:hover {
            background: #474544;
            color: #F2F3EB;
        }

        .sidebar-nav li {
            line-height: 53px;
            text-indent: 20px;
        }

            .sidebar-nav li a {
                color: #e2e2e2;
                display: block;
                text-decoration: none;
            }

                .sidebar-nav li a:hover {
                    color: #fff;
                    background: rgba(255,255,255,0.2);
                    text-decoration: none;
                }

                .sidebar-nav li a:active,
                .sidebar-nav li a:focus {
                    text-decoration: none;
                }

        .sidebar-nav > .sidebar-brand {
            height: 65px;
            line-height: 60px;
            font-size: 18px;
            display: none;
        }

            .sidebar-nav > .sidebar-brand a {
                color: #999999;
            }

                .sidebar-nav > .sidebar-brand a:hover {
                    color: #fff;
                    background: none;
                }

        #main_icon {
            float: right;
            padding-right: 25px;
            padding-top: 20px;
            font-size: 30px;
            color: #cf5050;
        }

        .sub_icon {
            float: right;
            font-size: 43px;
            padding: 20px;
        }

        .nav-text {
            font-size: 12px;
            letter-spacing: 5px;
            font-weight: 500;
        }

        .content-header {
            height: 65px;
            line-height: 65px;
        }

            .content-header h1 {
                margin: 0;
                margin-left: 20px;
                line-height: 65px;
                display: inline-block;
            }

        @media (max-width:767px) {
            #wrapper {
                padding-left: 0px;
                transition: all .4s ease 0s;
            }

            #sidebar-wrapper {
                left: 0px;
            }

            #wrapper.active {
                padding-left: 0px;
            }

                #wrapper.active #sidebar-wrapper {
                    left: 150px;
                    width: 100%;
                    transition: all .4s ease 0s;
                }
        }
        /* Set width on the form input elements since they're 100% wide by default */
        input,
        select,
        textarea {
            max-width: 920px;
        }

        .navbar {
            background-color: #CF5050;
            padding: env(safe-area-inset-top) 0 0 0;
        }



        .home-icon {
            margin-top: 0px;
            margin-left: -15px;
            width: 37em;
        }

        .sub-nav {
            display: none;
        }

        .navbar-brand {
            height: 50px;
            padding-left: 0px;
            padding-right: 0px;
        }

        .home-load {
            -webkit-animation: fadein 1s; /* Safari, Chrome and Opera > 12.1 */
            -moz-animation: fadein 1s; /* Firefox < 16 */
            -ms-animation: fadein 1s; /* Internet Explorer */
            -o-animation: fadein 1s; /* Opera < 12.1 */
            animation: fadein 1s;
            padding: 0px 0px 90px 0px;
        }


        /***********************SEARCH *******************/
        #search {
            position: fixed;
            top: 0px;
            left: 0px;
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 0, 0.9);
            -webkit-transition: all 0.5s ease-in-out;
            -moz-transition: all 0.5s ease-in-out;
            -o-transition: all 0.5s ease-in-out;
            -ms-transition: all 0.5s ease-in-out;
            transition: all 0.5s ease-in-out;
            opacity: 0;
        }

            #search.open {
                transition: all .5s ease-in-out;
                opacity: 1;
                z-index: 999999;
            }

            #search input[type="search"] {
                position: absolute;
                top: 50%;
                left: 10%;
                width: 80%;
                color: rgb(255, 255, 255);
                background: rgba(0, 0, 0, 0);
                font-size: 60px;
                font-weight: 500;
                text-align: center;
                border: 0px;
                margin: 0px auto;
                margin-top: -51px;
                padding-left: 30px;
                padding-right: 30px;
                outline: none;
                border-bottom: 2px rgba(207, 80, 80, 0.6) solid;
                max-width:100%;
            }

        .search-entry {
            position: absolute;
            top: 50%;
            left: 10%;
            width: 80%;
            color: rgb(255, 255, 255);
            background: rgba(0, 0, 0, 0);
            font-size: 60px;
            font-weight: 500;
            text-align: center;
            border: 0px;
            margin: 0px auto;
            margin-top: -51px;
            padding-left: 30px;
            padding-right: 30px;
            outline: none;
            border-bottom: 2px rgba(207, 80, 80, 0.6) solid;
            max-width: 100%;
        }

        .close {
            position: fixed;
            top: 0px;
            right: 15px;
            font-weight: 100;
            color: #b3b3b3;
            opacity: 1;
            padding: 10px 17px;
            font-size: 100px;
            transition: all .5s ease-in-out;
            text-shadow: none;
        }

            .close:hover {
                transform: rotate(-90deg);
                -moz-transform: rotate(-90deg);
                -webkit-transform: rotate(-90deg);
                transform-origin: center;
                -moz-transform-origin: center;
                -webkit-transform-origin: center;
                transition: transform 1.0s ease all;
                -moz-transition: -moz-transform 1.0s ease all;
                -webkit-transition: -webkit-transform 1.0s ease all;
                color: #fff;
            }


        /*search buttons**/

        .btn-selected {
            border-color: #fff !important;
            color: #CF5050 !important;
        }

        .search-potawatomi {
            font-size: 32px;
            font-weight: 300;
            letter-spacing: 3px;
            color: #e4d6d6;
            background-color: transparent;
            border: 2px #CF5050 solid;
            margin-top: 61px;
            position: absolute;
            border-radius: 0px;
            transition: all .5s ease-in-out;
            padding: 10px 33px;
            top: 10%;
            margin-left: 0;
            left: 10%;
            right: 10%;
            width: 80%;
        }

            .search-potawatomi:hover {
                border: #fff 2px solid;
                border-radius: 10px;
                color: #fff;
            }



        /****************************************************/

        /***********word of the week************/

        .word-of-week-block {
            background-color: #fff;
            padding-bottom: 20px;
            box-shadow: #c1c1c1 4px 3px 16px;
        }

        .word-of-week {
            font-size: 3em;
            margin-top: 0px;
            margin-bottom: -30px;
            font-weight: 600;
        }

        .word-week-link {
            color: #333;
            transition: all .5s ease-in-out;
        }

            .word-week-link:hover {
                text-decoration: none;
                color: #fccd35;
                transition: all .5s ease-in-out;
            }

        .word-of-week-phonetic {
            margin-top: 15px;
            font-weight: 300;
            font-size: 22px;
        }

        .word-of-week-title {
            padding-left: 15px;
            padding-top: 15px;
            font-size: 19px;
            font-weight:700;
            letter-spacing: 3px;
        }

        .word-of-week-definition-title {
            font-size: 16px;
            font-weight: 800;
            color: #cf5050;
            margin-bottom: -10px;
        }

        .word-of-week-translation {
            font-size: 25px;
        }

        .word-of-week-sentence-title {
            font-size: 16px;
            font-weight: 800;
            color: #cf5050;
            margin-bottom: -10px;
        }

        .word-of-week-sentence {
            font-size: 24px;
        }

        .word-of-week-img {
            max-width: 100%;
        }

        .mobile-img-box {
            padding-bottom: 25px;
        }

        .playsentence {
            font-size: 23px;
            position: relative;
            top: 3px;
            cursor: pointer;
            padding-right: 2px;
        }

        .cant-play {
            font-size: 20px;
            position: relative;
            top: 3px;
            color: #d0d0d0;
            cursor: not-allowed;
            padding-right: 2px;
            padding-bottom: 3px;
        }

        /**************audio************/

        #audioplayer {
            width: 100%;
            height: 60px;
            margin: 43px auto auto auto;
            border: solid #333 3px;
        }

        #pButton {
            height: 55px;
            width: 45px;
            border: none;
            background-size: 50% 50%;
            background-repeat: no-repeat;
            background-position: center;
            float: left;
            outline: none;
        }

        .play {
            background: url('images/play.png');
        }

        .pause {
            background: url('images/pause.png');
        }

        #timeline {
            width: 85%;
            height: 5px;
            margin-top: 25px;
            float: left;
            border-radius: 0px;
            background: rgb(207, 80, 80);
        }

        #playhead {
            width: 7px;
            height: 20px;
            border-radius: 0;
            margin-top: -8px;
            background: rgba(0, 0, 0,1);
        }

        /********************************************/

        /******* imag ads ****************************/
        .image-ads-block {
            background-color: #fff;
            padding-bottom: 0px;
            padding-right: 0px;
            box-shadow: #c1c1c1 4px 3px 16px;
            background-image: url('images/mobile-learn.jpg');
            background-repeat: no-repeat;
            background-size: cover;
            margin-left: 0px;
            padding-bottom: 15px;
        }

        .image-ads-img {
            float: right;
            width: 108.4%;
            margin-right: -15px;
        }

        .class-header {
            font-weight: 800;
            letter-spacing: 4px;
            padding-top: 15px;
            padding-right: 160px;
        }

        .class-text {
            text-align: left;
            padding-right: 200px;
            font-size: 18px;
        }

        .img-class-mobile {
            display: none;
        }

        .class-button {
            border: #cf5050 solid 3px;
            color: #fff;
            background-color: #cf5050;
            padding: 14px 23px;
            font-size: 1em;
            font-weight: 600;
            letter-spacing: 3px;
            border-radius: 0px;
            margin-top: 10px;
            transition: all .5s ease-in-out;
        }

            .class-button:hover {
                border: #333 solid 3px;
                color: #333;
                background-color: transparent;
                transition: all .5s ease-in-out;
            }

        /*******************************************/


        /*****************welcome block****************/

        .welcome-block {
            padding-bottom: 0px;
            background-image: url('images/language-banner.jpg');
            background-repeat: no-repeat;
            background-size: cover;
            background-position: center center;
            box-shadow: #c1c1c1 4px 3px 16px;
            margin-top: 20px;
            margin-bottom: 25px;
            height: 200px;
        }

        .welcome-image {
            padding-left: 0px;
        }

        .welcome-image-size {
            margin-left: -15px;
            width: 101.86%;
        }

        .welcome-text {
            display: none;
        }

        .welcome-title {
            color: #fff;
            font-size: 50px;
            letter-spacing: 3px;
            font-weight: 600;
            position: relative;
            top: -110px;
            left: -8px;
        }

        .welcome-text-all {
            position: absolute;
            top: 42%;
            left: 0%;
            width: 100%;
            background: -webkit-linear-gradient(bottom, rgba(0,0,0,0.4) 0%,rgba(255,255,255,0) 100%);
            padding: 15px;
            padding-left: 25px;
        }

        hr {
            border-top: 2px solid #d6d6d6;
        }


        /******************************* WORD PAGE ******************************************************/

        .word-page-block {
            background-color: #fff;
            padding-bottom: 20px;
            box-shadow: #c1c1c1 4px 3px 16px;
            margin-top: 20px;
            padding-top: 50px;
            padding-left: 40px;
            -webkit-animation: fadein 1s; /* Safari, Chrome and Opera > 12.1 */
            -moz-animation: fadein 1s; /* Firefox < 16 */
            -ms-animation: fadein 1s; /* Internet Explorer */
            -o-animation: fadein 1s; /* Opera < 12.1 */
            animation: fadein 1s;
        }

        @keyframes fadein {
            from {
                opacity: 0;
            }

            to {
                opacity: 1;
            }
        }

        /* Firefox < 16 */
        @-moz-keyframes fadein {
            from {
                opacity: 0;
            }

            to {
                opacity: 1;
            }
        }

        /* Safari, Chrome and Opera > 12.1 */
        @-webkit-keyframes fadein {
            from {
                opacity: 0;
            }

            to {
                opacity: 1;
            }
        }

        /* Internet Explorer */
        @-ms-keyframes fadein {
            from {
                opacity: 0;
            }

            to {
                opacity: 1;
            }
        }



        /* Opera < 12.1 */
        @-o-keyframes fadein {
            from {
                opacity: 0;
            }

            to {
                opacity: 1;
            }
        }

        .potawatomi-word {
            font-size: 4em;
            font-weight: 600;
        }

        .potawatomi-phonetic {
            font-size: 33px;
            font-weight: 300;
            margin-top: -20px;
            float: left;
        }

        .add-bottom-mobile {
            padding-bottom: 90px;
        }

        .potawatomi-part-of-speech {
            font-size: 33px;
            font-weight: 300;
            margin-top: -20px;
        }

        .tool-tip-button {
            display: none;
        }

        .historic-audio-block {
            padding-top: 0px;
        }

        .historic-audio {
            font-size: 14px;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 2px;
            border: 2px #333 solid;
            padding: 10px 20px;
            margin-bottom: 8px;
        }

        .audio-title {
            font-weight: 700;
            font-size: 16px;
            letter-spacing: 4px;
            color: #ababab;
        }

        .tag-title {
            font-weight: 700;
            font-size: 16px;
            letter-spacing: 4px;
            color: #ababab;
        }

        .tag-title-block {
            margin-top: 20px;
            margin-bottom: 15px;
        }

        .tags button {
            text-transform: uppercase;
            font-weight: 700;
            color: #fff;
            padding: 10px;
            background-color: #3b498a;
            margin-left: 2px;
            margin-right: 2px;
            word-wrap: break-word;
            border-radius: 0px;
            margin-bottom: 5px;
            border: #3b498a 3px solid;
            transition: all .3s ease-in-out;
        }

            .tags button:hover {
                color: #3b498a;
                transition: all .3s ease-in-out;
                background-color: #fff;
            }

        .related-words-block {
            margin-top: 65px;
            border: 3px #333 solid;
            padding: 15px 25px 25px 25px;
            margin-left: -15px;
        }

        .cultural-text {
            font-size: 24px;
        }

        .related-words-title {
            background-color: #fff;
            padding: 10px;
            position: relative;
            top: -35px;
            font-size: 25px;
        }

        .related {
            font-size: 30px;
            margin: 5px;
            border-radius: 0px;
            background-color: #f5f5f5;
            border: #f5f5f5 solid 3px;
            transition: all .3s ease-in-out;
        }


            .related:hover {
                border: #cf5050 solid 3px;
                transition: all .3s ease-in-out;
                background-color: #fff;
            }

        .related-words {
            margin-top: -25px;
        }

        .play-button {
            font-size: 15px;
            padding-right: 5px;
        }

        .plural {
            font-size: 30px;
            font-weight: 500;
            color: #333;
            margin-left: 5px;
        }

        .plural-title {
            font-weight: 700;
            font-size: 13px;
            letter-spacing: 3px;
            color: #ababab;
            margin-top: 30px;
            margin-bottom: -5px;
        }

        .alternate-title {
            font-weight: 700;
            font-size: 13px;
            letter-spacing: 3px;
            color: #ababab;
            margin-top: 20px;
            margin-bottom: -5px;
        }

        .pluralized {
            padding-left: 17px;
        }

        .word-audio {
            font-size: 35px;
            position: relative;
            top: -5px;
            left: 10px;
        }

        .word-image {
            box-shadow: #5f5f5f 4px 3px 16px;
        }

        .image {
            width: 100%;
        }

        .content-block {
            padding-left: 0px;
            padding-top: 0px;
            margin-top: -25px;
        }

        .dictionary-block {
            padding-left: 0px;
            padding-top: 20px;
        }

        .breadcrumbs {
            position: relative;
            top: -30px;
            left: -10px;
        }


        .culture-text {
            display: none;
        }

        .sourdough {
            font-size: 12px;
            letter-spacing: 4px;
            font-weight: 600;
        }

            .sourdough a {
                color: #333;
                transition: all .3s ease-in-out;
            }

                .sourdough a:hover {
                    color: #cf5050;
                    transition: all .3s ease-in-out;
                    text-decoration: none;
                }

        .bread-select {
            color: #cf5050;
            text-transform: uppercase;
        }

        .image-block {
            padding-right: 60px;
            margin-top: 35px;
        }

        .modal-content {
            padding: 15px;
            border-radius: 0px;
        }

        .modal-header {
            border-bottom: 1px solid #efefef;
        }

        .modal-title {
            font-weight: 700;
            letter-spacing: 4px;
        }

        .example-sentence {
            margin-top: 20px;
        }

        .example-title {
            font-weight: 700;
            font-size: 13px;
            letter-spacing: 3px;
            color: #ababab;
        }

        .example {
            text-indent: 2px;
            font-size: 21px;
        }

        .translation {
            text-indent: 32px;
            font-size: 25px;
            font-weight: 500;
        }

        .cultural-teaching {
            float: right;
            position: relative;
            top: -65px;
            right: 5px;
        }

        .culture-link {
            color: #fff;
            background-color: #cf5050;
            transition: ease-in-out .5s all;
            border-radius: 0px;
            font-size: 30px;
            border: none;
            font-weight: 600;
            padding: 5px 10px;
        }

            .culture-link:hover {
                color: #cf5050;
                background-color: #fff;
                box-shadow: #9e9e9e 2px 2px 5px 1px;
                transition: ease-in-out .5s all;
            }

            .culture-link:active {
                color: #cf5050;
                background-color: #fff;
                box-shadow: #9e9e9e 2px 2px 5px 1px;
                transition: ease-in-out .5s all;
            }

        .flash {
            -webkit-animation: flash linear 1.7s infinite;
            animation: flash linear 1.7s infinite;
            padding-left: 3px;
        }

        @-webkit-keyframes flash {
            0% {
                opacity: 1;
            }

            50% {
                opacity: .1;
            }

            100% {
                opacity: 1;
            }
        }

        @keyframes flash {
            0% {
                opacity: 1;
            }

            50% {
                opacity: .1;
            }

            100% {
                opacity: 1;
            }
        }

        .winter-story {
            color: #7c8dde;
            font-weight: 600;
            letter-spacing: 3px;
            border-bottom: 1px solid #d2d2d2;
            padding-bottom: 4px;
            font-size: 25px;
        }

        .modal-close {
            float: right;
            font-size: 21px;
            font-weight: bold;
            line-height: 1;
            color: #000;
            text-shadow: 0 1px 0 #fff;
            filter: alpha(opacity=20);
            opacity: .2;
        }

            .modal-close:hover {
                color: #000;
                text-decoration: none;
                cursor: pointer;
                filter: alpha(opacity=50);
                opacity: .5;
            }

        button.modal-close {
            -webkit-appearance: none;
            padding: 0;
            cursor: pointer;
            background: transparent;
            border: 0;
        }

        .translation-block {
            margin-top: 15px;
        }

        /*********************************************/

        /*********************DICTIONARY PAGE***************/

        .potawatomi-word-list {
            font-size: 2.4em;
            cursor: pointer;
            transition: ease-in-out .5s all;
            font-weight: 600;
        }

        .english-word-list {
            font-size: 16px;
            cursor: pointer;
            width: 100%;
            transition: ease-in-out .5s all;
            padding-left: 25px;
            padding-bottom: 10px;
            text-transform: uppercase;
            color: #cf5050;
            font-weight: 500;
        }

        .potawatomi-word-list:hover {
            color: #cf5050;
            transition: ease-in-out .5s all;
        }

        .english-word-list:hover {
            transition: ease-in-out .5s all;
            color: #cf5050;
        }


        ul li#list {
            border-bottom: none;
            line-height: 25px;
        }

        span.defined {
            float: right;
        }

        .unstyled {
            padding: 0px;
            list-style-type: none;
        }

        .letter-nav {
            overflow-x: scroll;
            overflow-y: hidden;
            padding-bottom: 25px;
        }

        .border-gradient {
            -webkit-border-image: -webkit-gradient(linear, left top, left bottom, from(#00abeb), to(#fff), color-stop(0.5, #fff), color-stop(0.5, #66cc00)) 21 30 30 21 repeat repeat;
        }


        .letter-pagination {
            display: inline-block;
            padding-left: 0;
            margin: 20px 0;
            font-weight: 600;
            padding: 0px 0px;
            font-size: 35px;
            letter-spacing: 23px;
            width: 1920px;
            height: 60px;
            padding-left: 20px;
            border-left: 3px #333 solid;
            border-right: 3px #333 solid;
        }

            .letter-pagination > li {
                display: inline;
            }

                .letter-pagination > li > a,
                .letter-pagination > li > span {
                    position: relative;
                    float: left;
                    padding: 6px 12px;
                    text-align: center;
                    line-height: 1.43;
                    color: #333;
                    text-decoration: none;
                    border: none;
                    transition: ease-in-out .5s all;
                }

                .letter-pagination > li:first-child > a,
                .letter-pagination > li:first-child > span {
                    margin-left: 0;
                    border-top-left-radius: 0px;
                    border-bottom-left-radius: 0px;
                    border: none;
                }

                .letter-pagination > li:last-child > a,
                .letter-pagination > li:last-child > span {
                    border-top-right-radius: 0px;
                    border-bottom-right-radius: 0px;
                    border: none;
                }

                .letter-pagination > li > a:hover,
                .letter-pagination > li > span:hover,
                .letter-pagination > li > a:focus,
                .letter-pagination > li > span:focus {
                    z-index: 2;
                    color: #cf5050;
                    background-color: transparent;
                    border: none;
                    transition: ease-in-out .5s all;
                }

            .letter-pagination > .active > a,
            .letter-pagination > .active > span,
            .letter-pagination > .active > a:hover,
            .letter-pagination > .active > span:hover,
            .letter-pagination > .active > a:focus,
            .letter-pagination > .active > span:focus {
                z-index: 3;
                color: #cf5050;
                cursor: default;
                background-color: transparent;
                border: none;
                transition: ease-in-out .5s all;
            }

            .letter-pagination > .disabled > span,
            .letter-pagination > .disabled > span:hover,
            .letter-pagination > .disabled > span:focus,
            .letter-pagination > .disabled > a,
            .letter-pagination > .disabled > a:hover,
            .letter-pagination > .disabled > a:focus {
                color: #777;
                cursor: not-allowed;
                background-color: #fff;
                border-color: #ddd;
            }

        .letter-pagination-lg > li > a,
        .letter-pagination-lg > li > span {
            padding: 10px 16px;
            font-size: 18px;
            line-height: 1.3333333;
        }

        .letter-pagination-lg > li:first-child > a,
        .letter-pagination-lg > li:first-child > span {
            border-top-left-radius: 0px;
            border-bottom-left-radius: 0px;
            border: none;
        }

        .letter-pagination-lg > li:last-child > a,
        .letter-pagination-lg > li:last-child > span {
            border-top-right-radius: 0px;
            border-bottom-right-radius: 0px;
        }

        .letter-pagination-sm > li > a,
        .letter-pagination-sm > li > span {
            padding: 5px 10px;
            font-size: 12px;
            line-height: 1.5;
        }

        .letter-pagination-sm > li:first-child > a,
        .letter-pagination-sm > li:first-child > span {
            border-top-left-radius: 0px;
            border-bottom-left-radius: 0px;
        }

        .letter-pagination-sm > li:last-child > a,
        .letter-pagination-sm > li:last-child > span {
            border-top-right-radius: 0px;
            border-bottom-right-radius: 0px;
        }



        .pagination {
            display: inline-block;
            padding-left: 0;
            margin: 20px 0;
            font-weight: 400;
            padding: 0px 0px;
            font-size: 29px;
            letter-spacing: 0px;
        }

            .pagination > li {
                display: inline;
            }

                .pagination > li > a,
                .pagination > li > span {
                    position: relative;
                    float: left;
                    padding: 6px 12px;
                    text-align: center;
                    line-height: 1.43;
                    color: #333;
                    text-decoration: none;
                    border: none;
                    transition: ease-in-out .5s all;
                }

                .pagination > li:first-child > a,
                .pagination > li:first-child > span {
                    margin-left: 0;
                    border-top-left-radius: 0px;
                    border-bottom-left-radius: 0px;
                    border: none;
                }

                .pagination > li:last-child > a,
                .pagination > li:last-child > span {
                    border-top-right-radius: 0px;
                    border-bottom-right-radius: 0px;
                    border: none;
                }

                .pagination > li > a:hover,
                .pagination > li > span:hover,
                .pagination > li > a:focus,
                .pagination > li > span:focus {
                    z-index: 2;
                    color: #cf5050;
                    background-color: transparent;
                    border: none;
                    transition: ease-in-out .5s all;
                }

            .pagination > .active > a,
            .pagination > .active > span,
            .pagination > .active > a:hover,
            .pagination > .active > span:hover,
            .pagination > .active > a:focus,
            .pagination > .active > span:focus {
                z-index: 3;
                color: #cf5050;
                cursor: default;
                background-color: transparent;
                border: none;
                transition: ease-in-out .5s all;
            }

            .pagination > .disabled > span,
            .pagination > .disabled > span:hover,
            .pagination > .disabled > span:focus,
            .pagination > .disabled > a,
            .pagination > .disabled > a:hover,
            .pagination > .disabled > a:focus {
                color: #777;
                cursor: not-allowed;
                background-color: #fff;
                border-color: #ddd;
            }

        .pagination-lg > li > a,
        .pagination-lg > li > span {
            padding: 10px 16px;
            font-size: 18px;
            line-height: 1.3333333;
        }

        .pagination-lg > li:first-child > a,
        .pagination-lg > li:first-child > span {
            border-top-left-radius: 0px;
            border-bottom-left-radius: 0px;
            border: none;
        }

        .pagination-lg > li:last-child > a,
        .pagination-lg > li:last-child > span {
            border-top-right-radius: 0px;
            border-bottom-right-radius: 0px;
        }

        .pagination-sm > li > a,
        .pagination-sm > li > span {
            padding: 5px 10px;
            font-size: 12px;
            line-height: 1.5;
        }

        .pagination-sm > li:first-child > a,
        .pagination-sm > li:first-child > span {
            border-top-left-radius: 0px;
            border-bottom-left-radius: 0px;
        }

        .pagination-sm > li:last-child > a,
        .pagination-sm > li:last-child > span {
            border-top-right-radius: 0px;
            border-bottom-right-radius: 0px;
        }


        #dictionary-search input[type="search"] {
            width: 100%;
            color: #333;
            background: rgba(0, 0, 0, 0);
            font-size: 60px;
            font-weight: 600;
            text-align: left;
            border: 0px;
            margin: 0px auto;
            margin-top: -20px;
            margin-bottom: 20px;
            padding-left: 85px;
            padding-right: 15px;
            outline: none;
            border-bottom: 2px #333 solid;
            max-width: 1540px;
        }



        .inner-addon {
            position: relative;
        }

            .inner-addon .fal {
                position: absolute;
                padding: 10px;
                pointer-events: none;
                font-size: 60px
            }

        .left-addon .fal {
            left: 0px;
            top: -17px;
        }

        ::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
            color: #dedede;
            opacity: 1; /* Firefox */
        }

        :-ms-input-placeholder { /* Internet Explorer 10-11 */
            color: #dedede;
        }

        ::-ms-input-placeholder { /* Microsoft Edge */
            color: #dedede;
        }

        .tags-block {
            padding-left: 15px;
        }

        .tag-item-block {
            padding: 20px 20px;
            background-color: #f7f7f7;
            vertical-align: middle;
            white-space: nowrap;
            text-transform: lowercase;
            text-align: center;
            overflow: hidden;
            border: #fff 5px solid;
            transition: ease-in-out .5s all;
            cursor: pointer;
        }

            .tag-item-block:hover {
                background-color: #cf5050;
                color: #fff;
                transition: ease-in-out .5s all;
            }

        .tag-item {
            font-size: 38px;
            font-weight:500;
        }

        .add-padding-left {
            position: relative;
            left: 10px;
        }
    }
}
/* max-width 640px, mobile-only styles, use when QAing mobile issues */

/* Medium screens - TABLET */
@media only screen and (min-width: 40.063em) {
}
/* min-width 641px, medium screens */

@media only screen and (min-width: 40.063em) and (max-width: 64em) {


    body {
        padding-top: 50px;
        padding-bottom: 20px;
        font-family: "Gotham", Helvetica, Arial, sans-serif;
        background-color: transparent;
        width: 100%;
    }

    .hasaudio {
        font-size: 20px;
        position: relative;
        padding-right: 8px;
        top: 0px;
    }

    .concrete {
        background-image: url('images/concrete.png');
        background-repeat: repeat;
        background-position: center center;
    }


    .word-count {
        position: absolute;
        top: 3px;
        right: 10px;
    }

    .potawatomi-count {
        color: #fdcd34;
        text-align: center;
        font-size: 19px;
        letter-spacing: 4px;
        text-transform: uppercase;
        margin-top: -5px;
    }

    .potawatomi-number {
        font-size: 62px;
        color: #fff;
        text-align: center;
    }

    .video-title-block {
        width: 100%;
    }

    .contact-image {
        width: 100%;
        padding-bottom: 20px;
    }

    .video-block {
        padding-top: 25px;
    }

    .video-button {
        font-size: 14px;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 5px;
        border: 2px #333 solid;
        padding: 10px 20px;
        margin-bottom: 8px;
        border-radius: 0px;
        width: 100%;
        transition: all ease-in-out 0.5s;
    }

        .video-button:hover {
            color: #fff;
            background-color: #333;
            transition: all ease-in-out 0.5s;
        }

    .video-title {
        font-weight: 700;
        font-size: 16px;
        letter-spacing: 4px;
        color: #ababab;
    }

    .english-e {
        font-size: 19px;
        font-weight: 600;
        color: #cf5050;
        padding-left: 28px;
    }

    .english-example {
        font-weight: 400;
        font-size: 20px;
        font-style: italic;
    }

    .contact-text-title {
        text-transform: uppercase;
        font-weight: 600;
        font-size: 26px;
        letter-spacing: 3px;
    }

    .english-block {
        padding-left: 28px;
    }

    .thanks {
        text-align: center;
        position: relative;
        top: 0px;
        left: 0%;
        padding: 25px;
        background: #cdf2d0;
        border-radius: 20px;
        border: 2px solid #8db584;
    }

    .failure {
        text-align: center;
        position: relative;
        top: 135px;
        left: 0%;
        padding: 25px;
        background: #f2cdcd;
        border-radius: 20px;
        border: 2px solid #d58484;
    }

    .thanks-text {
        font-size: 26px;
        text-transform: uppercase;
    }

    .failure-text {
        font-size: 26px;
        text-transform: uppercase;
    }

    .visible {
        visibility: visible;
        opacity: 1;
        -webkit-animation: fadein 1s; /* Safari, Chrome and Opera > 12.1 */
        -moz-animation: fadein 1s; /* Firefox < 16 */
        -ms-animation: fadein 1s; /* Internet Explorer */
        -o-animation: fadein 1s; /* Opera < 12.1 */
        animation: fadein 1s;
    }

    .hidden {
        visibility: hidden;
        opacity: 0;
        -webkit-animation: fadein 1s; /* Safari, Chrome and Opera > 12.1 */
        -moz-animation: fadein 1s; /* Firefox < 16 */
        -ms-animation: fadein 1s; /* Internet Explorer */
        -o-animation: fadein 1s; /* Opera < 12.1 */
        animation: fadein 1s;
    }

    input[type='text'], [type='email'], select, textarea {
        background: none;
        border: none;
        border-bottom: solid 2px #474544;
        color: #474544;
        font-size: 1.000em;
        font-weight: 500;
        letter-spacing: 1px;
        margin: 0em 0 1.875em 0;
        padding: 0 0 0.875em 0;
        text-transform: uppercase;
        width: 100%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        -ms-box-sizing: border-box;
        -o-box-sizing: border-box;
        box-sizing: border-box;
        -webkit-transition: all 0.3s;
        -moz-transition: all 0.3s;
        -ms-transition: all 0.3s;
        -o-transition: all 0.3s;
        transition: all 0.3s;
    }

        input[type='text']:focus, [type='email']:focus, textarea:focus {
            outline: none;
            padding: 0 0 0.875em 0;
        }

    .message {
        float: none;
    }

    .name {
        float: left;
        width: 45%;
    }

    select {
        background: url('https://cdn4.iconfinder.com/data/icons/ionicons/512/icon-ios7-arrow-down-32.png') no-repeat right;
        outline: none;
        -moz-appearance: none;
        -webkit-appearance: none;
    }

        select::-ms-expand {
            display: none;
        }

    .subject {
        width: 100%;
    }

    .telephone {
        width: 100%;
    }

    textarea {
        line-height: 150%;
        height: 150px;
        resize: none;
        width: 100%;
    }

    ::-webkit-input-placeholder {
        color: #474544;
    }

    :-moz-placeholder {
        color: #474544;
        opacity: 1;
    }

    ::-moz-placeholder {
        color: #474544;
        opacity: 1;
    }

    :-ms-input-placeholder {
        color: #474544;
    }

    #form_button {
        background: none;
        border: solid 2px #474544;
        color: #474544;
        cursor: pointer;
        display: inline-block;
        font-size: 0.875em;
        font-weight: bold;
        outline: none;
        padding: 20px 35px;
        letter-spacing: 5px;
        text-transform: uppercase;
        -webkit-transition: all 0.3s;
        -moz-transition: all 0.3s;
        -ms-transition: all 0.3s;
        -o-transition: all 0.3s;
        transition: all 0.3s;
    }

    /* Set padding to keep content from hitting the edges */
    .body-content {
        padding-left: 15px;
        padding-right: 15px;
    }

    .row {
        margin-left: 0px;
        margin-right: 0px;
    }

    #wrapper {
        padding-left: 150px;
        transition: all .4s ease 0s;
        height: 100%;
    }

    #wrapper2 {
        padding-left: 80px;
        transition: all .4s ease 0s;
        height: 100%;
    }

    #sidebar-wrapper {
        margin-left: 0px;
        left: 0px;
        width: 230px;
        background: #222;
        position: fixed;
        height: 100%;
        z-index: 10000;
        transition: all .4s ease 0s;
    }

    .sidebar-nav {
        display: block;
        float: left;
        width: 230px;
        list-style: none;
        margin: 0;
        padding: 0;
    }

    #page-content-wrapper {
        padding-left: 0;
        margin-left: 0;
        width: 100%;
        height: auto;
    }

    #wrapper.active {
        padding-left: 0px;
    }

        #wrapper.active #sidebar-wrapper {
            left: -150px;
        }

    #page-content-wrapper {
        width: 100%;
    }

    #sidebar_menu li a, .sidebar-nav li a {
        color: #e2e2e2;
        display: block;
        float: left;
        text-decoration: none;
        width: 230px;
        background: #252525;
        border-top: 1px solid #373737;
        border-bottom: 1px solid #1A1A1A;
        -webkit-transition: background .5s;
        -moz-transition: background .5s;
        -o-transition: background .5s;
        -ms-transition: background .5s;
        transition: background .5s;
    }

    .sidebar_name {
        padding-top: 25px;
        color: #fff;
        opacity: .7;
    }

    .sidebar-nav li {
        line-height: 53px;
        text-indent: 20px;
    }

        .sidebar-nav li a {
            color: #e2e2e2;
            display: block;
            text-decoration: none;
        }

            .sidebar-nav li a:hover {
                color: #fff;
                background: rgba(255,255,255,0.2);
                text-decoration: none;
            }

            .sidebar-nav li a:active,
            .sidebar-nav li a:focus {
                text-decoration: none;
            }

    .sidebar-nav > .sidebar-brand {
        height: 65px;
        line-height: 60px;
        font-size: 18px;
    }

        .sidebar-nav > .sidebar-brand a {
            color: #999999;
        }

            .sidebar-nav > .sidebar-brand a:hover {
                color: #fff;
                background: none;
            }

    #main_icon {
        float: right;
        padding-right: 25px;
        padding-top: 20px;
        font-size: 30px;
        color: #cf5050;
    }

    .sub_icon {
        float: right;
        font-size: 30px;
        padding-right: 20px;
        padding-top: 10px;
    }

    .nav-text {
        font-size: 12px;
        letter-spacing: 5px;
        font-weight: 500;
    }

    .content-header {
        height: 65px;
        line-height: 65px;
    }

        .content-header h1 {
            margin: 0;
            margin-left: 20px;
            line-height: 65px;
            display: inline-block;
        }

    @media (max-width:767px) {
        #wrapper {
            padding-left: 70px;
            transition: all .4s ease 0s;
        }

        #sidebar-wrapper {
            left: 70px;
        }

        #wrapper.active {
            padding-left: 150px;
        }

            #wrapper.active #sidebar-wrapper {
                left: 150px;
                width: 150px;
                transition: all .4s ease 0s;
            }
    }
    /* Set width on the form input elements since they're 100% wide by default */
    input,
    select,
    textarea {
        max-width: 920px;
    }

    .navbar {
        background-color: #CF5050;
    }

    .home-icon {
        margin-top: -6px;
        margin-left: -15px;
        width: 29em;
    }

    .sub-nav {
        position: absolute;
        right: 5px;
    }

    .navbar-brand {
        height: 50px;
        padding-left: 0px;
        padding-right: 0px;
    }

    .sub-nav-item {
        color: #fff;
        font-size: 14px;
        letter-spacing: 2px;
        border-right: 1px solid #a94747;
        padding: 12px 15px;
        line-height: 50px;
        font-weight: 300;
        background-color: #cf5050;
        text-transform: lowercase;
        transition: all 0.5s ease-in-out;
    }

        .sub-nav-item:hover {
            color: #fff;
            text-decoration: none;
            background-color: #a94747;
            transition: all 0.5s ease-in-out;
        }

    .home-load {
        -webkit-animation: fadein 1s; /* Safari, Chrome and Opera > 12.1 */
        -moz-animation: fadein 1s; /* Firefox < 16 */
        -ms-animation: fadein 1s; /* Internet Explorer */
        -o-animation: fadein 1s; /* Opera < 12.1 */
        animation: fadein 1s;
        padding: 0px 0px 90px 0px;
    }


    /***********************SEARCH *******************/
    #search {
        position: fixed;
        top: 0px;
        left: 0px;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.9);
        -webkit-transition: all 0.5s ease-in-out;
        -moz-transition: all 0.5s ease-in-out;
        -o-transition: all 0.5s ease-in-out;
        -ms-transition: all 0.5s ease-in-out;
        transition: all 0.5s ease-in-out;
        opacity: 0;
    }

        #search.open {
            transition: all .5s ease-in-out;
            opacity: 1;
            z-index: 999999;
        }

        #search input[type="search"] {
            position: absolute;
            top: 50%;
            left: 10%;
            width: 80%;
            color: rgb(255, 255, 255);
            background: rgba(0, 0, 0, 0);
            font-size: 60px;
            font-weight: 500;
            text-align: center;
            border: 0px;
            margin: 0px auto;
            margin-top: -51px;
            padding-left: 30px;
            padding-right: 30px;
            outline: none;
            border-bottom: 2px rgba(207, 80, 80, 0.6) solid;
            max-width: 100%;
        }

    .close {
        position: fixed;
        top: 0px;
        right: 15px;
        font-weight: 100;
        color: #b3b3b3;
        opacity: 1;
        padding: 10px 17px;
        font-size: 100px;
        transition: all .5s ease-in-out;
        text-shadow: none;
    }

        .close:hover {
            transform: rotate(-90deg);
            -moz-transform: rotate(-90deg);
            -webkit-transform: rotate(-90deg);
            transform-origin: center;
            -moz-transform-origin: center;
            -webkit-transform-origin: center;
            transition: transform 1.0s ease all;
            -moz-transition: -moz-transform 1.0s ease all;
            -webkit-transition: -webkit-transform 1.0s ease all;
            color: #fff;
        }


    /*search buttons**/
    .btn-selected {
        border-color: #fff !important;
        color: #CF5050 !important;
    }

    .search-potawatomi {
        font-size: 32px;
        font-weight: 300;
        letter-spacing: 3px;
        color: #e4d6d6;
        background-color: transparent;
        border: 2px #CF5050 solid;
        left: 20%;
        right: 20%;
        position: absolute;
        top: 57%;
        border-radius: 0px;
        transition: all .5s ease-in-out;
        padding: 10px 33px;
        width: 60%;
    }

        .search-potawatomi:hover {
            border: #fff 2px solid;
            border-radius: 10px;
            color: #fff;
        }

    .search-english {
        top: 67%;
    }



    /****************************************************/

    /***********word of the week************/

    .word-of-week-block {
        background-color: #fff;
        padding-bottom: 20px;
        box-shadow: #c1c1c1 4px 3px 16px;
    }

    .word-of-week {
        font-size: 3em;
        margin-top: 0px;
        margin-bottom: -30px;
        font-weight: 600;
    }

    .word-week-link {
        color: #333;
        transition: all .5s ease-in-out;
    }

        .word-week-link:hover {
            text-decoration: none;
            color: #fccd35;
            transition: all .5s ease-in-out;
        }

    .word-of-week-phonetic {
        margin-top: 15px;
        font-weight: 300;
        font-size: 22px;
        font-weight: 300;
    }

    .word-of-week-title {
        padding-left: 15px;
        padding-top: 15px;
        font-size: 19px;
        font-weight: 700;
        letter-spacing: 3px;
    }

    .word-of-week-definition-title {
        font-size: 16px;
        font-weight: 800;
        color: #cf5050;
        margin-bottom: -10px;
    }

    .word-of-week-translation {
        font-size: 25px;
    }

    .word-of-week-sentence-title {
        font-size: 16px;
        font-weight: 800;
        color: #cf5050;
        margin-bottom: -10px;
    }

    .word-of-week-sentence {
        font-size: 24px;
    }

    .word-of-week-img {
        max-width: 100%;
        min-width: 100%;
        margin: 0 auto;
    }

    .mobile-img-box {
        padding-bottom: 25px;
    }

    .video-box {
        width: 540px;
        height: 310px;
    }

    .modal-dialog {
        margin: 30px 20px 30px 115px;
    }

    .playsentence {
        font-size: 23px;
        position: relative;
        top: 3px;
        cursor: pointer;
        padding-right: 2px;
    }

    .cant-play {
        font-size: 20px;
        position: relative;
        top: 3px;
        color: #d0d0d0;
        cursor: not-allowed;
        padding-right: 2px;
        padding-bottom: 3px;
    }

    /**************audio************/

    #audioplayer {
        width: 100%;
        height: 60px;
        margin: 43px auto auto auto;
        border: solid #333 3px;
    }

    #pButton {
        height: 55px;
        width: 45px;
        border: none;
        background-size: 50% 50%;
        background-repeat: no-repeat;
        background-position: center;
        float: left;
        outline: none;
    }

    .play {
        background: url('images/play.png');
    }

    .pause {
        background: url('images/pause.png');
    }

    #timeline {
        width: 85%;
        height: 5px;
        margin-top: 25px;
        float: left;
        border-radius: 0px;
        background: rgb(207, 80, 80);
    }

    #playhead {
        width: 7px;
        height: 20px;
        border-radius: 0;
        margin-top: -8px;
        background: rgba(0, 0, 0,1);
    }

    /********************************************/

    /******* imag ads ****************************/
    .image-ads-block {
        background-color: #fff;
        padding-bottom: 0px;
        padding-right: 0px;
        box-shadow: #c1c1c1 4px 3px 16px;
        background-image: url('images/mobile-learn.jpg');
        background-repeat: no-repeat;
        background-size: cover;
        margin-left: 0px;
        padding-bottom: 15px;
    }

    .image-ads-img {
        float: right;
        width: 108.4%;
        margin-right: -15px;
    }

    .class-header {
        font-weight: 800;
        letter-spacing: 4px;
        padding-top: 15px;
        padding-right: 160px;
    }

    .class-text {
        text-align: left;
        padding-right: 200px;
        font-size: 18px;
    }

    .img-class-mobile {
        display: none;
    }

    .class-button {
        border: #cf5050 solid 3px;
        color: #fff;
        background-color: #cf5050;
        padding: 14px 23px;
        font-size: 1em;
        font-weight: 600;
        letter-spacing: 3px;
        border-radius: 0px;
        margin-top: 10px;
        transition: all .5s ease-in-out;
    }

        .class-button:hover {
            border: #333 solid 3px;
            color: #333;
            background-color: transparent;
            transition: all .5s ease-in-out;
        }

    /*******************************************/


    /*****************welcome block****************/

    .welcome-block {
        padding-bottom: 0px;
        background-image: url('images/language-banner.jpg');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
        box-shadow: #c1c1c1 4px 3px 16px;
        margin-top: 20px;
        margin-bottom: 25px;
        height: 200px;
    }

    .welcome-image {
        padding-left: 0px;
    }

    .welcome-image-size {
        margin-left: -15px;
        width: 101.86%;
    }

    .welcome-text {
        display: none;
    }

    .welcome-title {
        color: #fff;
        font-size: 50px;
        letter-spacing: 3px;
        font-weight: 600;
        position: relative;
        top: -110px;
        left: -8px;
    }

    .welcome-text-all {
        position: absolute;
        top: 42%;
        left: 0%;
        width: 100%;
        background: -webkit-linear-gradient(bottom, rgba(0,0,0,0.4) 0%,rgba(255,255,255,0) 100%);
        padding: 15px;
        padding-left: 25px;
    }

    hr {
        border-top: 2px solid #d6d6d6;
    }


    /******************************* WORD PAGE ******************************************************/

    .word-page-block {
        background-color: #fff;
        padding-bottom: 20px;
        box-shadow: #c1c1c1 4px 3px 16px;
        margin-top: 20px;
        padding-top: 50px;
        padding-left: 40px;
        -webkit-animation: fadein 1s; /* Safari, Chrome and Opera > 12.1 */
        -moz-animation: fadein 1s; /* Firefox < 16 */
        -ms-animation: fadein 1s; /* Internet Explorer */
        -o-animation: fadein 1s; /* Opera < 12.1 */
        animation: fadein 1s;
    }

    @keyframes fadein {
        from {
            opacity: 0;
        }

        to {
            opacity: 1;
        }
    }

    /* Firefox < 16 */
    @-moz-keyframes fadein {
        from {
            opacity: 0;
        }

        to {
            opacity: 1;
        }
    }

    /* Safari, Chrome and Opera > 12.1 */
    @-webkit-keyframes fadein {
        from {
            opacity: 0;
        }

        to {
            opacity: 1;
        }
    }

    /* Internet Explorer */
    @-ms-keyframes fadein {
        from {
            opacity: 0;
        }

        to {
            opacity: 1;
        }
    }



    /* Opera < 12.1 */
    @-o-keyframes fadein {
        from {
            opacity: 0;
        }

        to {
            opacity: 1;
        }
    }

    .potawatomi-word {
        font-size: 4em;
        font-weight: 600;
    }

    .potawatomi-phonetic {
        font-size: 33px;
        font-weight: 300;
        margin-top: -20px;
        float: left;
    }

    .add-bottom-mobile {
        padding-bottom: 90px;
    }

    .potawatomi-part-of-speech {
        font-size: 33px;
        font-weight: 300;
        margin-top: -20px;
    }

    .tool-tip-button {
        display: none;
    }

    .historic-audio-block {
        padding-top: 0px;
    }

    .historic-audio {
        font-size: 14px;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 2px;
        border: 2px #333 solid;
        padding: 10px 20px;
        margin-bottom: 8px;
        transition: all ease-in-out 0.5s;
        cursor: pointer;
    }

        .historic-audio:hover {
            color: #fff;
            background-color: #6D8842;
            transition: all ease-in-out 0.5s;
            border: 2px #6d8842 solid;
        }

    .audio-title {
        font-weight: 700;
        font-size: 16px;
        letter-spacing: 4px;
        color: #ababab;
    }

    .tag-title {
        font-weight: 700;
        font-size: 16px;
        letter-spacing: 4px;
        color: #ababab;
    }

    .tag-title-block {
        margin-top: 20px;
        margin-bottom: 15px;
    }

    .tags button {
        text-transform: uppercase;
        font-weight: 700;
        color: #fff;
        padding: 10px;
        background-color: #3b498a;
        margin-left: 2px;
        margin-right: 2px;
        word-wrap: break-word;
        border-radius: 0px;
        margin-bottom: 5px;
        border: #3b498a 3px solid;
        transition: all .3s ease-in-out;
    }

        .tags button:hover {
            color: #3b498a;
            transition: all .3s ease-in-out;
            background-color: #fff;
        }

    .related-words-block {
        margin-top: 65px;
        border: 3px #333 solid;
        padding: 15px 25px 25px 25px;
        margin-left: -10px;
    }

    .related-words-title {
        background-color: #fff;
        padding: 10px;
        position: relative;
        top: -35px;
        font-size: 25px;
    }

    .related {
        font-size: 30px;
        margin: 5px;
        border-radius: 0px;
        background-color: #f5f5f5;
        border: #f5f5f5 solid 3px;
        transition: all .3s ease-in-out;
    }


        .related:hover {
            border: #cf5050 solid 3px;
            transition: all .3s ease-in-out;
            background-color: #fff;
        }

    .related-words {
        margin-top: -25px;
    }

    .play-button {
        font-size: 15px;
        padding-right: 5px;
    }

    .plural {
        font-size: 30px;
        font-weight: 500;
        color: #333;
        margin-left: 5px;
    }

    .plural-title {
        font-weight: 700;
        font-size: 13px;
        letter-spacing: 3px;
        color: #ababab;
        margin-top: 30px;
        margin-bottom: -5px;
    }

    .modal-body {
        font-size: 20px;
        font-weight: 300;
    }

    .alternate-title {
        font-weight: 700;
        font-size: 13px;
        letter-spacing: 3px;
        color: #ababab;
        margin-top: 20px;
        margin-bottom: -5px;
    }

    .pluralized {
        padding-left: 17px;
    }

    .word-audio {
        font-size: 35px;
        position: relative;
        top: -5px;
        left: 10px;
    }

    .word-image {
        box-shadow: #5f5f5f 4px 3px 16px;
    }

    .image {
        width: 100%;
    }

    .content-block {
        padding-left: 0px;
        padding-top: 0px;
        margin-top: -25px;
    }

    .dictionary-block {
        padding-left: 0px;
        padding-top: 20px;
    }

    .breadcrumbs {
        position: relative;
        top: -30px;
        left: -10px;
    }


    .culture-text {
        display: none;
    }

    .sourdough {
        font-size: 12px;
        letter-spacing: 4px;
        font-weight: 600;
    }

        .sourdough a {
            color: #333;
            transition: all .3s ease-in-out;
        }

            .sourdough a:hover {
                color: #cf5050;
                transition: all .3s ease-in-out;
                text-decoration: none;
            }

    .bread-select {
        color: #cf5050;
        text-transform: uppercase;
    }

    .image-block {
        padding-right: 60px;
        margin-top: 35px;
    }

    .modal-content {
        padding: 15px;
        border-radius: 0px;
    }

    .modal-header {
        border-bottom: 1px solid #efefef;
    }

    .modal-title {
        font-weight: 700;
        letter-spacing: 4px;
    }

    .example-sentence {
        margin-top: 20px;
    }

    .example-title {
        font-weight: 700;
        font-size: 13px;
        letter-spacing: 3px;
        color: #ababab;
    }

    .example {
        text-indent: 2px;
        font-size: 21px;
    }

    .translation {
        text-indent: 32px;
        font-size: 25px;
        font-weight: 500;
    }

    .cultural-teaching {
        float: right;
        position: relative;
        top: -65px;
        right: 5px;
    }

    .culture-link {
        color: #fff;
        background-color: #cf5050;
        transition: ease-in-out .5s all;
        border-radius: 0px;
        font-size: 30px;
        border: none;
        font-weight: 600;
        padding: 5px 10px;
    }

        .culture-link:hover {
            color: #cf5050;
            background-color: #fff;
            box-shadow: #9e9e9e 2px 2px 5px 1px;
            transition: ease-in-out .5s all;
        }

        .culture-link:active {
            color: #cf5050;
            background-color: #fff;
            box-shadow: #9e9e9e 2px 2px 5px 1px;
            transition: ease-in-out .5s all;
        }

    .flash {
        -webkit-animation: flash linear 1.7s infinite;
        animation: flash linear 1.7s infinite;
        padding-left: 3px;
    }

    @-webkit-keyframes flash {
        0% {
            opacity: 1;
        }

        50% {
            opacity: .1;
        }

        100% {
            opacity: 1;
        }
    }

    @keyframes flash {
        0% {
            opacity: 1;
        }

        50% {
            opacity: .1;
        }

        100% {
            opacity: 1;
        }
    }

    .winter-story {
        color: #7c8dde;
        font-weight: 600;
        letter-spacing: 3px;
        border-bottom: 1px solid #d2d2d2;
        padding-bottom: 4px;
        font-size: 25px;
    }

    .modal-close {
        float: right;
        font-size: 21px;
        font-weight: bold;
        line-height: 1;
        color: #000;
        text-shadow: 0 1px 0 #fff;
        filter: alpha(opacity=20);
        opacity: .2;
    }

        .modal-close:hover {
            color: #000;
            text-decoration: none;
            cursor: pointer;
            filter: alpha(opacity=50);
            opacity: .5;
        }

    button.modal-close {
        -webkit-appearance: none;
        padding: 0;
        cursor: pointer;
        background: transparent;
        border: 0;
    }

    .translation-block {
        margin-top: 15px;
    }

    /*********************************************/

    /*********************DICTIONARY PAGE***************/

    .potawatomi-word-list {
        font-size: 2.4em;
        cursor: pointer;
        transition: ease-in-out .5s all;
        font-weight: 600;
    }

    .english-word-list {
        font-size: 16px;
        cursor: pointer;
        width: 100%;
        transition: ease-in-out .5s all;
        padding-left: 25px;
        padding-bottom: 10px;
        text-transform: uppercase;
        color: #cf5050;
        font-weight: 600;
    }

    .potawatomi-word-list:hover {
        color: #cf5050;
        transition: ease-in-out .5s all;
    }

    .english-word-list:hover {
        transition: ease-in-out .5s all;
        color: #cf5050;
    }


    ul li#list {
        border-bottom: none;
        line-height: 25px;
    }

    span.defined {
        float: right;
    }

    .unstyled {
        padding: 0px;
        list-style-type: none;
    }

    .letter-nav {
        overflow-x: scroll;
        overflow-y: hidden;
        padding-bottom: 25px;
    }

    .border-gradient {
        -webkit-border-image: -webkit-gradient(linear, left top, left bottom, from(#00abeb), to(#fff), color-stop(0.5, #fff), color-stop(0.5, #66cc00)) 21 30 30 21 repeat repeat;
    }


    .letter-pagination {
        display: inline-block;
        padding-left: 0;
        margin: 20px 0;
        font-weight: 600;
        padding: 0px 0px;
        font-size: 35px;
        letter-spacing: 23px;
        width: 1920px;
        height: 60px;
        padding-left: 20px;
        border-left: 3px #333 solid;
        border-right: 3px #333 solid;
    }

        .letter-pagination > li {
            display: inline;
        }

            .letter-pagination > li > a,
            .letter-pagination > li > span {
                position: relative;
                float: left;
                padding: 6px 12px;
                text-align: center;
                line-height: 1.43;
                color: #333;
                text-decoration: none;
                border: none;
                transition: ease-in-out .5s all;
            }

            .letter-pagination > li:first-child > a,
            .letter-pagination > li:first-child > span {
                margin-left: 0;
                border-top-left-radius: 0px;
                border-bottom-left-radius: 0px;
                border: none;
            }

            .letter-pagination > li:last-child > a,
            .letter-pagination > li:last-child > span {
                border-top-right-radius: 0px;
                border-bottom-right-radius: 0px;
                border: none;
            }

            .letter-pagination > li > a:hover,
            .letter-pagination > li > span:hover,
            .letter-pagination > li > a:focus,
            .letter-pagination > li > span:focus {
                z-index: 2;
                color: #cf5050;
                background-color: transparent;
                border: none;
                transition: ease-in-out .5s all;
            }

        .letter-pagination > .active > a,
        .letter-pagination > .active > span,
        .letter-pagination > .active > a:hover,
        .letter-pagination > .active > span:hover,
        .letter-pagination > .active > a:focus,
        .letter-pagination > .active > span:focus {
            z-index: 3;
            color: #cf5050;
            cursor: default;
            background-color: transparent;
            border: none;
            transition: ease-in-out .5s all;
        }

        .letter-pagination > .disabled > span,
        .letter-pagination > .disabled > span:hover,
        .letter-pagination > .disabled > span:focus,
        .letter-pagination > .disabled > a,
        .letter-pagination > .disabled > a:hover,
        .letter-pagination > .disabled > a:focus {
            color: #777;
            cursor: not-allowed;
            background-color: #fff;
            border-color: #ddd;
        }

    .letter-pagination-lg > li > a,
    .letter-pagination-lg > li > span {
        padding: 10px 16px;
        font-size: 18px;
        line-height: 1.3333333;
    }

    .letter-pagination-lg > li:first-child > a,
    .letter-pagination-lg > li:first-child > span {
        border-top-left-radius: 0px;
        border-bottom-left-radius: 0px;
        border: none;
    }

    .letter-pagination-lg > li:last-child > a,
    .letter-pagination-lg > li:last-child > span {
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
    }

    .letter-pagination-sm > li > a,
    .letter-pagination-sm > li > span {
        padding: 5px 10px;
        font-size: 12px;
        line-height: 1.5;
    }

    .letter-pagination-sm > li:first-child > a,
    .letter-pagination-sm > li:first-child > span {
        border-top-left-radius: 0px;
        border-bottom-left-radius: 0px;
    }

    .letter-pagination-sm > li:last-child > a,
    .letter-pagination-sm > li:last-child > span {
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
    }



    .pagination {
        display: inline-block;
        padding-left: 0;
        margin: 20px 0;
        font-weight: 400;
        padding: 0px 0px;
        font-size: 29px;
        letter-spacing: 0px;
    }

        .pagination > li {
            display: inline;
        }

            .pagination > li > a,
            .pagination > li > span {
                position: relative;
                float: left;
                padding: 6px 12px;
                text-align: center;
                line-height: 1.43;
                color: #333;
                text-decoration: none;
                border: none;
                transition: ease-in-out .5s all;
            }

            .pagination > li:first-child > a,
            .pagination > li:first-child > span {
                margin-left: 0;
                border-top-left-radius: 0px;
                border-bottom-left-radius: 0px;
                border: none;
            }

            .pagination > li:last-child > a,
            .pagination > li:last-child > span {
                border-top-right-radius: 0px;
                border-bottom-right-radius: 0px;
                border: none;
            }

            .pagination > li > a:hover,
            .pagination > li > span:hover,
            .pagination > li > a:focus,
            .pagination > li > span:focus {
                z-index: 2;
                color: #cf5050;
                background-color: transparent;
                border: none;
                transition: ease-in-out .5s all;
            }

        .pagination > .active > a,
        .pagination > .active > span,
        .pagination > .active > a:hover,
        .pagination > .active > span:hover,
        .pagination > .active > a:focus,
        .pagination > .active > span:focus {
            z-index: 3;
            color: #cf5050;
            cursor: default;
            background-color: transparent;
            border: none;
            transition: ease-in-out .5s all;
        }

        .pagination > .disabled > span,
        .pagination > .disabled > span:hover,
        .pagination > .disabled > span:focus,
        .pagination > .disabled > a,
        .pagination > .disabled > a:hover,
        .pagination > .disabled > a:focus {
            color: #777;
            cursor: not-allowed;
            background-color: #fff;
            border-color: #ddd;
        }

    .pagination-lg > li > a,
    .pagination-lg > li > span {
        padding: 10px 16px;
        font-size: 18px;
        line-height: 1.3333333;
    }

    .pagination-lg > li:first-child > a,
    .pagination-lg > li:first-child > span {
        border-top-left-radius: 0px;
        border-bottom-left-radius: 0px;
        border: none;
    }

    .pagination-lg > li:last-child > a,
    .pagination-lg > li:last-child > span {
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
    }

    .pagination-sm > li > a,
    .pagination-sm > li > span {
        padding: 5px 10px;
        font-size: 12px;
        line-height: 1.5;
    }

    .pagination-sm > li:first-child > a,
    .pagination-sm > li:first-child > span {
        border-top-left-radius: 0px;
        border-bottom-left-radius: 0px;
    }

    .pagination-sm > li:last-child > a,
    .pagination-sm > li:last-child > span {
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
    }


    #dictionary-search input[type="search"] {
        width: 100%;
        color: #333;
        background: rgba(0, 0, 0, 0);
        font-size: 60px;
        font-weight: 600;
        text-align: left;
        border: 0px;
        margin: 0px auto;
        margin-top: -20px;
        margin-bottom: 20px;
        padding-left: 85px;
        padding-right: 15px;
        outline: none;
        border-bottom: 2px #333 solid;
        max-width: 1540px;
    }

    .inner-addon {
        position: relative;
    }

        .inner-addon .fal {
            position: absolute;
            padding: 10px;
            pointer-events: none;
            font-size: 60px
        }

    .left-addon .fal {
        left: 0px;
        top: -17px;
    }

    ::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
        color: #dedede;
        opacity: 1; /* Firefox */
    }

    :-ms-input-placeholder { /* Internet Explorer 10-11 */
        color: #dedede;
    }

    ::-ms-input-placeholder { /* Microsoft Edge */
        color: #dedede;
    }

    .tags-block {
        padding-left: 0px;
    }

    .tag-item-block {
        padding: 20px 20px;
        background-color: #f7f7f7;
        vertical-align: middle;
        white-space: nowrap;
        text-transform: lowercase;
        text-align: center;
        overflow: hidden;
        border: #fff 5px solid;
        transition: ease-in-out .5s all;
        cursor: pointer;
    }

        .tag-item-block:hover {
            background-color: #cf5050;
            color: #fff;
            transition: ease-in-out .5s all;
        }

    .tag-item {
        font-size: 38px;
        font-weight: 500;
    }

    .add-padding-left {
        position: relative;
        left: 10px;
    }
}

/* min-width 641px and max-width 1024px, use when QAing tablet-only issues */

@media only screen and (min-width: 40.063em) and (max-width: 64em) and (orientation:landscape) {


    body {
        padding-top: 50px;
        padding-bottom: 20px;
        font-family: "Gotham", Helvetica, Arial, sans-serif;
        background-color: transparent;
        width: 100%;
    }


    .concrete {
        background-image: url('images/concrete.png');
        background-repeat: repeat;
        background-position: center center;
    }


    .word-count {
        position: absolute;
        top: 3px;
        right: 10px;
    }

    .potawatomi-count {
        color: #fdcd34;
        text-align: center;
        font-size: 19px;
        letter-spacing: 4px;
        text-transform: uppercase;
        margin-top: -5px;
    }

    .potawatomi-number {
        font-size: 62px;
        color: #fff;
        text-align: center;
    }

    .video-title-block {
        width: 100%;
    }

    .video-block {
        padding-top: 25px;
    }

    .video-button {
        font-size: 14px;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 5px;
        border: 2px #333 solid;
        padding: 10px 20px;
        margin-bottom: 8px;
        border-radius: 0px;
        width: 100%;
        transition: all ease-in-out 0.5s;
    }

        .video-button:hover {
            color: #fff;
            background-color: #333;
            transition: all ease-in-out 0.5s;
        }

    .video-title {
        font-weight: 700;
        font-size: 16px;
        letter-spacing: 4px;
        color: #ababab;
    }

    .english-e {
        font-size: 19px;
        font-weight: 600;
        color: #cf5050;
        padding-left: 28px;
    }

    .english-example {
        font-weight: 400;
        font-size: 20px;
        font-style: italic;
    }

    .english-block {
        padding-left: 28px;
    }



    /* Set padding to keep content from hitting the edges */
    .body-content {
        padding-left: 15px;
        padding-right: 15px;
    }

    .row {
        margin-left: 0px;
        margin-right: 0px;
    }

    #wrapper {
        padding-left: 80px;
        transition: all .4s ease 0s;
        height: 100%;
    }

    #sidebar-wrapper {
        margin-left: 0px;
        left: 0px;
        width: 230px;
        background: #222;
        position: fixed;
        height: 100%;
        z-index: 10000;
        transition: all .4s ease 0s;
    }

    .sidebar-nav {
        display: block;
        float: left;
        width: 230px;
        list-style: none;
        margin: 0;
        padding: 0;
    }

    #page-content-wrapper {
        padding-left: 0;
        margin-left: 0;
        width: 100%;
        height: auto;
    }

    #wrapper.active {
        padding-left: 0px;
    }

        #wrapper.active #sidebar-wrapper {
            left: -150px;
        }

    #page-content-wrapper {
        width: 100%;
    }

    #sidebar_menu li a, .sidebar-nav li a {
        color: #e2e2e2;
        display: block;
        float: left;
        text-decoration: none;
        width: 230px;
        background: #252525;
        border-top: 1px solid #373737;
        border-bottom: 1px solid #1A1A1A;
        -webkit-transition: background .5s;
        -moz-transition: background .5s;
        -o-transition: background .5s;
        -ms-transition: background .5s;
        transition: background .5s;
    }

    .sidebar_name {
        padding-top: 25px;
        color: #fff;
        opacity: .7;
    }

    .sidebar-nav li {
        line-height: 53px;
        text-indent: 20px;
    }

        .sidebar-nav li a {
            color: #e2e2e2;
            display: block;
            text-decoration: none;
        }

            .sidebar-nav li a:hover {
                color: #fff;
                background: rgba(255,255,255,0.2);
                text-decoration: none;
            }

            .sidebar-nav li a:active,
            .sidebar-nav li a:focus {
                text-decoration: none;
            }

    .sidebar-nav > .sidebar-brand {
        height: 65px;
        line-height: 60px;
        font-size: 18px;
    }

        .sidebar-nav > .sidebar-brand a {
            color: #999999;
        }

            .sidebar-nav > .sidebar-brand a:hover {
                color: #fff;
                background: none;
            }

    #main_icon {
        float: right;
        padding-right: 25px;
        padding-top: 20px;
        font-size: 30px;
        color: #cf5050;
    }

    .sub_icon {
        float: right;
        font-size: 30px;
        padding-right: 20px;
        padding-top: 10px;
    }

    .nav-text {
        font-size: 12px;
        letter-spacing: 5px;
        font-weight: 500;
    }

    .content-header {
        height: 65px;
        line-height: 65px;
    }

        .content-header h1 {
            margin: 0;
            margin-left: 20px;
            line-height: 65px;
            display: inline-block;
        }

    @media (max-width:767px) {
        #wrapper {
            padding-left: 70px;
            transition: all .4s ease 0s;
        }

        #sidebar-wrapper {
            left: 70px;
        }

        #wrapper.active {
            padding-left: 150px;
        }

            #wrapper.active #sidebar-wrapper {
                left: 150px;
                width: 150px;
                transition: all .4s ease 0s;
            }
    }
    /* Set width on the form input elements since they're 100% wide by default */
    input,
    select,
    textarea {
        max-width: 920px;
    }

    .navbar {
        background-color: #CF5050;
    }

    .home-icon {
        margin-top: -6px;
        margin-left: -15px;
        width: 29em;
    }

    .sub-nav {
        position: absolute;
        right: 5px;
    }

    .navbar-brand {
        height: 50px;
        padding-left: 0px;
        padding-right: 0px;
    }

    .sub-nav-item {
        color: #fff;
        font-size: 14px;
        letter-spacing: 2px;
        border-right: 1px solid #a94747;
        padding: 12px 15px;
        line-height: 50px;
        font-weight: 300;
        background-color: #cf5050;
        text-transform: lowercase;
        transition: all 0.5s ease-in-out;
    }

        .sub-nav-item:hover {
            color: #fff;
            text-decoration: none;
            background-color: #a94747;
            transition: all 0.5s ease-in-out;
        }

    .home-load {
        -webkit-animation: fadein 1s; /* Safari, Chrome and Opera > 12.1 */
        -moz-animation: fadein 1s; /* Firefox < 16 */
        -ms-animation: fadein 1s; /* Internet Explorer */
        -o-animation: fadein 1s; /* Opera < 12.1 */
        animation: fadein 1s;
        padding: 0px 0px 90px 0px;
    }


    /***********************SEARCH *******************/
    #search {
        position: fixed;
        top: 0px;
        left: 0px;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.9);
        -webkit-transition: all 0.5s ease-in-out;
        -moz-transition: all 0.5s ease-in-out;
        -o-transition: all 0.5s ease-in-out;
        -ms-transition: all 0.5s ease-in-out;
        transition: all 0.5s ease-in-out;
        opacity: 0;
    }

        #search.open {
            transition: all .5s ease-in-out;
            opacity: 1;
            z-index: 999999;
        }

        #search input[type="search"] {
            position: absolute;
            top: 50%;
            left: 10%;
            width: 80%;
            color: rgb(255, 255, 255);
            background: rgba(0, 0, 0, 0);
            font-size: 60px;
            font-weight: 500;
            text-align: center;
            border: 0px;
            margin: 0px auto;
            margin-top: -51px;
            padding-left: 30px;
            padding-right: 30px;
            outline: none;
            border-bottom: 2px rgba(207, 80, 80, 0.6) solid;
            max-width: 100%;
        }

    .search-entry {
        position: absolute;
        top: 50%;
        left: 10%;
        width: 80%;
        color: rgb(255, 255, 255);
        background: rgba(0, 0, 0, 0);
        font-size: 60px;
        font-weight: 500;
        text-align: center;
        border: 0px;
        margin: 0px auto;
        margin-top: -51px;
        padding-left: 30px;
        padding-right: 30px;
        outline: none;
        border-bottom: 2px rgba(207, 80, 80, 0.6) solid;
        max-width: 100%;
    }

    .close {
        position: fixed;
        top: 0px;
        right: 15px;
        font-weight: 100;
        color: #b3b3b3;
        opacity: 1;
        padding: 10px 17px;
        font-size: 100px;
        transition: all .5s ease-in-out;
        text-shadow: none;
    }

        .close:hover {
            transform: rotate(-90deg);
            -moz-transform: rotate(-90deg);
            -webkit-transform: rotate(-90deg);
            transform-origin: center;
            -moz-transform-origin: center;
            -webkit-transform-origin: center;
            transition: transform 1.0s ease all;
            -moz-transition: -moz-transform 1.0s ease all;
            -webkit-transition: -webkit-transform 1.0s ease all;
            color: #fff;
        }


    /*search buttons**/
    .btn-selected {
        border-color: #fff !important;
        color: #CF5050 !important;
    }

    .search-potawatomi {
        font-size: 32px;
        font-weight: 300;
        letter-spacing: 3px;
        color: #e4d6d6;
        background-color: transparent;
        border: 2px #CF5050 solid;
        left: 40%;
        margin-top: 61px;
        margin-left: -45px;
        position: absolute;
        top: 55%;
        border-radius: 0px;
        transition: all .5s ease-in-out;
        padding: 10px 33px;
    }

        .search-potawatomi:hover {
            border: #fff 2px solid;
            border-radius: 10px;
            color: #fff;
        }



    /****************************************************/

    /***********word of the week************/

    .word-of-week-block {
        background-color: #fff;
        padding-bottom: 20px;
        box-shadow: #c1c1c1 4px 3px 16px;
        width: 48%;
    }

    .word-of-week {
        font-size: 3em;
        margin-top: 0px;
        margin-bottom: -30px;
        font-weight: 600;
    }

    .word-week-link {
        color: #333;
        transition: all .5s ease-in-out;
    }

        .word-week-link:hover {
            text-decoration: none;
            color: #fccd35;
            transition: all .5s ease-in-out;
        }

    .word-of-week-phonetic {
        margin-top: 15px;
        font-weight: 300;
        font-size: 22px;
        font-weight: 300;
    }

    .word-of-week-title {
        padding-left: 15px;
        padding-top: 15px;
        font-size: 19px;
        font-weight: 700;
        letter-spacing: 3px;
    }

    .word-of-week-definition-title {
        font-size: 16px;
        font-weight: 800;
        color: #cf5050;
        margin-bottom: -10px;
    }

    .word-of-week-translation {
        font-size: 25px;
    }

    .word-of-week-sentence-title {
        font-size: 16px;
        font-weight: 800;
        color: #cf5050;
        margin-bottom: -10px;
    }

    .word-of-week-sentence {
        font-size: 24px;
    }

    .word-of-week-img {
        margin-left: -20px;
        max-width: 100%;
        min-width: 100%;
    }

    .mobile-img-box {
        padding-bottom: 25px;
    }

    .video-box {
        width: 540px;
        height: 310px;
    }

    .modal-dialog {
        margin: 30px 20px 30px 115px;
    }

    .playsentence {
        font-size: 23px;
        position: relative;
        top: 3px;
        cursor: pointer;
        padding-right: 2px;
    }

    .cant-play {
        font-size: 20px;
        position: relative;
        top: 3px;
        color: #d0d0d0;
        cursor: not-allowed;
        padding-right: 2px;
        padding-bottom: 3px;
    }

    /**************audio************/

    #audioplayer {
        width: 100%;
        height: 60px;
        margin: 43px auto auto auto;
        border: solid #333 3px;
    }

    #pButton {
        height: 55px;
        width: 45px;
        border: none;
        background-size: 50% 50%;
        background-repeat: no-repeat;
        background-position: center;
        float: left;
        outline: none;
    }

    .play {
        background: url('images/play.png');
    }

    .pause {
        background: url('images/pause.png');
    }

    #timeline {
        width: 85%;
        height: 5px;
        margin-top: 25px;
        float: left;
        border-radius: 0px;
        background: rgb(207, 80, 80);
    }

    #playhead {
        width: 7px;
        height: 20px;
        border-radius: 0;
        margin-top: -8px;
        background: rgba(0, 0, 0,1);
    }

    /********************************************/

    /******* imag ads ****************************/
    .image-ads-block {
        background-color: #fff;
        padding-bottom: 0px;
        padding-right: 0px;
        box-shadow: #c1c1c1 4px 3px 16px;
        background-image: url('images/mobile-learn.jpg');
        background-repeat: no-repeat;
        background-size: cover;
        margin-left: 0px;
        padding-bottom: 15px;
        position: absolute;
        top: 225px;
        right: 0px;
        width: 50%;
    }

    .image-ads-img {
        float: right;
        width: 108.4%;
        margin-right: -15px;
    }

    .class-header {
        font-weight: 800;
        letter-spacing: 4px;
        padding-top: 15px;
        padding-right: 160px;
    }

    .class-text {
        text-align: left;
        padding-right: 200px;
        font-size: 18px;
    }

    .img-class-mobile {
        display: none;
    }

    .class-button {
        border: #cf5050 solid 3px;
        color: #fff;
        background-color: #cf5050;
        padding: 14px 23px;
        font-size:1em;
        font-weight: 600;
        letter-spacing: 3px;
        border-radius: 0px;
        margin-top: 10px;
        transition: all .5s ease-in-out;
    }

        .class-button:hover {
            border: #333 solid 3px;
            color: #333;
            background-color: transparent;
            transition: all .5s ease-in-out;
        }

    /*******************************************/


    /*****************welcome block****************/

    .welcome-block {
        padding-bottom: 0px;
        background-image: url('images/language-banner.jpg');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
        box-shadow: #c1c1c1 4px 3px 16px;
        margin-top: 20px;
        margin-bottom: 25px;
        height: 200px;
    }

    .welcome-image {
        padding-left: 0px;
    }

    .welcome-image-size {
        margin-left: -15px;
        width: 101.86%;
    }

    .welcome-text {
        display: none;
    }

    .welcome-title {
        color: #fff;
        font-size: 50px;
        letter-spacing: 3px;
        font-weight: 600;
        position: relative;
        top: -110px;
        left: -8px;
    }

    .welcome-text-all {
        position: absolute;
        top: 42%;
        left: 0%;
        width: 100%;
        background: -webkit-linear-gradient(bottom, rgba(0,0,0,0.4) 0%,rgba(255,255,255,0) 100%);
        padding: 15px;
        padding-left: 25px;
    }

    hr {
        border-top: 2px solid #d6d6d6;
    }


    /******************************* WORD PAGE ******************************************************/

    .word-page-block {
        background-color: #fff;
        padding-bottom: 20px;
        box-shadow: #c1c1c1 4px 3px 16px;
        margin-top: 20px;
        padding-top: 50px;
        padding-left: 40px;
        -webkit-animation: fadein 1s; /* Safari, Chrome and Opera > 12.1 */
        -moz-animation: fadein 1s; /* Firefox < 16 */
        -ms-animation: fadein 1s; /* Internet Explorer */
        -o-animation: fadein 1s; /* Opera < 12.1 */
        animation: fadein 1s;
    }

    @keyframes fadein {
        from {
            opacity: 0;
        }

        to {
            opacity: 1;
        }
    }

    /* Firefox < 16 */
    @-moz-keyframes fadein {
        from {
            opacity: 0;
        }

        to {
            opacity: 1;
        }
    }

    /* Safari, Chrome and Opera > 12.1 */
    @-webkit-keyframes fadein {
        from {
            opacity: 0;
        }

        to {
            opacity: 1;
        }
    }

    /* Internet Explorer */
    @-ms-keyframes fadein {
        from {
            opacity: 0;
        }

        to {
            opacity: 1;
        }
    }



    /* Opera < 12.1 */
    @-o-keyframes fadein {
        from {
            opacity: 0;
        }

        to {
            opacity: 1;
        }
    }

    .potawatomi-word {
        font-size: 4em;
        font-weight: 600;
    }

    .potawatomi-phonetic {
        font-size: 33px;
        font-weight: 300;
        margin-top: -20px;
        float: left;
    }

    .add-bottom-mobile {
        padding-bottom: 90px;
    }

    .potawatomi-part-of-speech {
        font-size: 33px;
        font-weight: 300;
        margin-top: -20px;
    }

    .tool-tip-button {
        display: none;
    }

    .historic-audio-block {
        padding-top: 0px;
    }

    .historic-audio {
        font-size: 14px;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 2px;
        border: 2px #333 solid;
        padding: 10px 20px;
        margin-bottom: 8px;
        transition: all ease-in-out 0.5s;
        cursor: pointer;
    }

        .historic-audio:hover {
            color: #fff;
            background-color: #6D8842;
            transition: all ease-in-out 0.5s;
            border: 2px #6d8842 solid;
        }

    .audio-title {
        font-weight: 700;
        font-size: 16px;
        letter-spacing: 4px;
        color: #ababab;
    }

    .tag-title {
        font-weight: 700;
        font-size: 16px;
        letter-spacing: 4px;
        color: #ababab;
    }

    .tag-title-block {
        margin-top: 20px;
        margin-bottom: 15px;
    }

    .tags button {
        text-transform: uppercase;
        font-weight: 700;
        color: #fff;
        padding: 10px;
        background-color: #3b498a;
        margin-left: 2px;
        margin-right: 2px;
        word-wrap: break-word;
        border-radius: 0px;
        margin-bottom: 5px;
        border: #3b498a 3px solid;
        transition: all .3s ease-in-out;
    }

        .tags button:hover {
            color: #3b498a;
            transition: all .3s ease-in-out;
            background-color: #fff;
        }

    .related-words-block {
        margin-top: 65px;
        border: 3px #333 solid;
        padding: 15px 25px 25px 25px;
        margin-left: -10px;
    }

    .related-words-title {
        background-color: #fff;
        padding: 10px;
        position: relative;
        top: -35px;
        font-size: 25px;
    }

    .related {
        font-size: 30px;
        margin: 5px;
        border-radius: 0px;
        background-color: #f5f5f5;
        border: #f5f5f5 solid 3px;
        transition: all .3s ease-in-out;
    }


        .related:hover {
            border: #cf5050 solid 3px;
            transition: all .3s ease-in-out;
            background-color: #fff;
        }

    .related-words {
        margin-top: -25px;
    }

    .play-button {
        font-size: 15px;
        padding-right: 5px;
    }

    .plural {
        font-size: 30px;
        font-weight: 500;
        color: #333;
        margin-left: 5px;
    }

    .plural-title {
        font-weight: 700;
        font-size: 13px;
        letter-spacing: 3px;
        color: #ababab;
        margin-top: 30px;
        margin-bottom: -5px;
    }

    .modal-body {
        font-size: 20px;
        font-weight: 300;
    }

    .alternate-title {
        font-weight: 700;
        font-size: 13px;
        letter-spacing: 3px;
        color: #ababab;
        margin-top: 20px;
        margin-bottom: -5px;
    }

    .pluralized {
        padding-left: 17px;
    }

    .word-audio {
        font-size: 35px;
        position: relative;
        top: -5px;
        left: 10px;
    }

    .word-image {
        box-shadow: #5f5f5f 4px 3px 16px;
    }

    .image {
        width: 100%;
    }

    .content-block {
        padding-left: 0px;
        padding-top: 0px;
        margin-top: -25px;
    }

    .dictionary-block {
        padding-left: 0px;
        padding-top: 20px;
    }

    .breadcrumbs {
        position: relative;
        top: -30px;
        left: -10px;
    }


    .culture-text {
        display: none;
    }

    .sourdough {
        font-size: 12px;
        letter-spacing: 4px;
        font-weight: 600;
    }

        .sourdough a {
            color: #333;
            transition: all .3s ease-in-out;
        }

            .sourdough a:hover {
                color: #cf5050;
                transition: all .3s ease-in-out;
                text-decoration: none;
            }

    .bread-select {
        color: #cf5050;
        text-transform: uppercase;
    }

    .image-block {
        padding-right: 60px;
        margin-top: 35px;
    }

    .modal-content {
        padding: 15px;
        border-radius: 0px;
    }

    .modal-header {
        border-bottom: 1px solid #efefef;
    }

    .modal-title {
        font-weight: 700;
        letter-spacing: 4px;
    }

    .example-sentence {
        margin-top: 20px;
    }

    .example-title {
        font-weight: 700;
        font-size: 13px;
        letter-spacing: 3px;
        color: #ababab;
    }

    .example {
        text-indent: 2px;
        font-size: 21px;
    }

    .translation {
        text-indent: 32px;
        font-size: 25px;
        font-weight: 500;
    }

    .cultural-teaching {
        float: right;
        position: relative;
        top: -65px;
        right: 5px;
    }

    .culture-link {
        color: #fff;
        background-color: #cf5050;
        transition: ease-in-out .5s all;
        border-radius: 0px;
        font-size: 30px;
        border: none;
        font-weight: 600;
        padding: 5px 10px;
    }

        .culture-link:hover {
            color: #cf5050;
            background-color: #fff;
            box-shadow: #9e9e9e 2px 2px 5px 1px;
            transition: ease-in-out .5s all;
        }

        .culture-link:active {
            color: #cf5050;
            background-color: #fff;
            box-shadow: #9e9e9e 2px 2px 5px 1px;
            transition: ease-in-out .5s all;
        }

    .flash {
        -webkit-animation: flash linear 1.7s infinite;
        animation: flash linear 1.7s infinite;
        padding-left: 3px;
    }

    @-webkit-keyframes flash {
        0% {
            opacity: 1;
        }

        50% {
            opacity: .1;
        }

        100% {
            opacity: 1;
        }
    }

    @keyframes flash {
        0% {
            opacity: 1;
        }

        50% {
            opacity: .1;
        }

        100% {
            opacity: 1;
        }
    }

    .winter-story {
        color: #7c8dde;
        font-weight: 600;
        letter-spacing: 3px;
        border-bottom: 1px solid #d2d2d2;
        padding-bottom: 4px;
        font-size: 25px;
    }

    .modal-close {
        float: right;
        font-size: 21px;
        font-weight: bold;
        line-height: 1;
        color: #000;
        text-shadow: 0 1px 0 #fff;
        filter: alpha(opacity=20);
        opacity: .2;
    }

        .modal-close:hover {
            color: #000;
            text-decoration: none;
            cursor: pointer;
            filter: alpha(opacity=50);
            opacity: .5;
        }

    button.modal-close {
        -webkit-appearance: none;
        padding: 0;
        cursor: pointer;
        background: transparent;
        border: 0;
    }

    .translation-block {
        margin-top: 15px;
    }

    /*********************************************/

    /*********************DICTIONARY PAGE***************/

    .potawatomi-word-list {
        font-size: 2.4em;
        cursor: pointer;
        transition: ease-in-out .5s all;
        font-weight: 600;
    }

    .english-word-list {
        font-size: 16px;
        cursor: pointer;
        width: 100%;
        transition: ease-in-out .5s all;
        padding-left: 25px;
        padding-bottom: 10px;
        text-transform: uppercase;
        color: #cf5050;
        font-weight: 600;
    }

    .potawatomi-word-list:hover {
        color: #cf5050;
        transition: ease-in-out .5s all;
    }

    .english-word-list:hover {
        transition: ease-in-out .5s all;
        color: #cf5050;
    }


    ul li#list {
        border-bottom: none;
        line-height: 25px;
    }

    span.defined {
        float: right;
    }

    .unstyled {
        padding: 0px;
        list-style-type: none;
    }

    .letter-nav {
        overflow-x: scroll;
        overflow-y: hidden;
        padding-bottom: 25px;
    }

    .border-gradient {
        -webkit-border-image: -webkit-gradient(linear, left top, left bottom, from(#00abeb), to(#fff), color-stop(0.5, #fff), color-stop(0.5, #66cc00)) 21 30 30 21 repeat repeat;
    }


    .letter-pagination {
        display: inline-block;
        padding-left: 0;
        margin: 20px 0;
        font-weight: 600;
        padding: 0px 0px;
        font-size: 35px;
        letter-spacing: 23px;
        width: 1920px;
        height: 60px;
        padding-left: 20px;
        border-left: 3px #333 solid;
        border-right: 3px #333 solid;
    }

        .letter-pagination > li {
            display: inline;
        }

            .letter-pagination > li > a,
            .letter-pagination > li > span {
                position: relative;
                float: left;
                padding: 6px 12px;
                text-align: center;
                line-height: 1.43;
                color: #333;
                text-decoration: none;
                border: none;
                transition: ease-in-out .5s all;
            }

            .letter-pagination > li:first-child > a,
            .letter-pagination > li:first-child > span {
                margin-left: 0;
                border-top-left-radius: 0px;
                border-bottom-left-radius: 0px;
                border: none;
            }

            .letter-pagination > li:last-child > a,
            .letter-pagination > li:last-child > span {
                border-top-right-radius: 0px;
                border-bottom-right-radius: 0px;
                border: none;
            }

            .letter-pagination > li > a:hover,
            .letter-pagination > li > span:hover,
            .letter-pagination > li > a:focus,
            .letter-pagination > li > span:focus {
                z-index: 2;
                color: #cf5050;
                background-color: transparent;
                border: none;
                transition: ease-in-out .5s all;
            }

        .letter-pagination > .active > a,
        .letter-pagination > .active > span,
        .letter-pagination > .active > a:hover,
        .letter-pagination > .active > span:hover,
        .letter-pagination > .active > a:focus,
        .letter-pagination > .active > span:focus {
            z-index: 3;
            color: #cf5050;
            cursor: default;
            background-color: transparent;
            border: none;
            transition: ease-in-out .5s all;
        }

        .letter-pagination > .disabled > span,
        .letter-pagination > .disabled > span:hover,
        .letter-pagination > .disabled > span:focus,
        .letter-pagination > .disabled > a,
        .letter-pagination > .disabled > a:hover,
        .letter-pagination > .disabled > a:focus {
            color: #777;
            cursor: not-allowed;
            background-color: #fff;
            border-color: #ddd;
        }

    .letter-pagination-lg > li > a,
    .letter-pagination-lg > li > span {
        padding: 10px 16px;
        font-size: 18px;
        line-height: 1.3333333;
    }

    .letter-pagination-lg > li:first-child > a,
    .letter-pagination-lg > li:first-child > span {
        border-top-left-radius: 0px;
        border-bottom-left-radius: 0px;
        border: none;
    }

    .letter-pagination-lg > li:last-child > a,
    .letter-pagination-lg > li:last-child > span {
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
    }

    .letter-pagination-sm > li > a,
    .letter-pagination-sm > li > span {
        padding: 5px 10px;
        font-size: 12px;
        line-height: 1.5;
    }

    .letter-pagination-sm > li:first-child > a,
    .letter-pagination-sm > li:first-child > span {
        border-top-left-radius: 0px;
        border-bottom-left-radius: 0px;
    }

    .letter-pagination-sm > li:last-child > a,
    .letter-pagination-sm > li:last-child > span {
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
    }



    .pagination {
        display: inline-block;
        padding-left: 0;
        margin: 20px 0;
        font-weight: 400;
        padding: 0px 0px;
        font-size: 29px;
        letter-spacing: 0px;
    }

        .pagination > li {
            display: inline;
        }

            .pagination > li > a,
            .pagination > li > span {
                position: relative;
                float: left;
                padding: 6px 12px;
                text-align: center;
                line-height: 1.43;
                color: #333;
                text-decoration: none;
                border: none;
                transition: ease-in-out .5s all;
            }

            .pagination > li:first-child > a,
            .pagination > li:first-child > span {
                margin-left: 0;
                border-top-left-radius: 0px;
                border-bottom-left-radius: 0px;
                border: none;
            }

            .pagination > li:last-child > a,
            .pagination > li:last-child > span {
                border-top-right-radius: 0px;
                border-bottom-right-radius: 0px;
                border: none;
            }

            .pagination > li > a:hover,
            .pagination > li > span:hover,
            .pagination > li > a:focus,
            .pagination > li > span:focus {
                z-index: 2;
                color: #cf5050;
                background-color: transparent;
                border: none;
                transition: ease-in-out .5s all;
            }

        .pagination > .active > a,
        .pagination > .active > span,
        .pagination > .active > a:hover,
        .pagination > .active > span:hover,
        .pagination > .active > a:focus,
        .pagination > .active > span:focus {
            z-index: 3;
            color: #cf5050;
            cursor: default;
            background-color: transparent;
            border: none;
            transition: ease-in-out .5s all;
        }

        .pagination > .disabled > span,
        .pagination > .disabled > span:hover,
        .pagination > .disabled > span:focus,
        .pagination > .disabled > a,
        .pagination > .disabled > a:hover,
        .pagination > .disabled > a:focus {
            color: #777;
            cursor: not-allowed;
            background-color: #fff;
            border-color: #ddd;
        }

    .pagination-lg > li > a,
    .pagination-lg > li > span {
        padding: 10px 16px;
        font-size: 18px;
        line-height: 1.3333333;
    }

    .pagination-lg > li:first-child > a,
    .pagination-lg > li:first-child > span {
        border-top-left-radius: 0px;
        border-bottom-left-radius: 0px;
        border: none;
    }

    .pagination-lg > li:last-child > a,
    .pagination-lg > li:last-child > span {
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
    }

    .pagination-sm > li > a,
    .pagination-sm > li > span {
        padding: 5px 10px;
        font-size: 12px;
        line-height: 1.5;
    }

    .pagination-sm > li:first-child > a,
    .pagination-sm > li:first-child > span {
        border-top-left-radius: 0px;
        border-bottom-left-radius: 0px;
    }

    .pagination-sm > li:last-child > a,
    .pagination-sm > li:last-child > span {
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
    }


    #dictionary-search input[type="search"] {
        width: 100%;
        color: #333;
        background: rgba(0, 0, 0, 0);
        font-size: 60px;
        font-weight: 600;
        text-align: left;
        border: 0px;
        margin: 0px auto;
        margin-top: -20px;
        margin-bottom: 20px;
        padding-left: 85px;
        padding-right: 15px;
        outline: none;
        border-bottom: 2px #333 solid;
        max-width: 1540px;
    }

    .inner-addon {
        position: relative;
    }

        .inner-addon .fal {
            position: absolute;
            padding: 10px;
            pointer-events: none;
            font-size: 60px
        }

    .left-addon .fal {
        left: 0px;
        top: -17px;
    }

    ::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
        color: #dedede;
        opacity: 1; /* Firefox */
    }

    :-ms-input-placeholder { /* Internet Explorer 10-11 */
        color: #dedede;
    }

    ::-ms-input-placeholder { /* Microsoft Edge */
        color: #dedede;
    }

    .tags-block {
        padding-left: 0px;
    }

    .tag-item-block {
        padding: 20px 20px;
        background-color: #f7f7f7;
        vertical-align: middle;
        white-space: nowrap;
        text-transform: lowercase;
        text-align: center;
        overflow: hidden;
        border: #fff 5px solid;
        transition: ease-in-out .5s all;
        cursor: pointer;
    }

        .tag-item-block:hover {
            background-color: #cf5050;
            color: #fff;
            transition: ease-in-out .5s all;
        }

    .tag-item {
        font-size: 38px;
        font-weight: 500;
    }

    .add-padding-left {
        position: relative;
        left: 10px;
    }
}

/* min-width 641px and max-width 1024px, use when QAing tablet-only issues */

/* Large screens - DESKTOP */
@media only screen and (min-width: 65em) {

    .word-of-the-week-img {
        margin-left: -20px;
        max-width: 450px;
        min-width: 450px;
    }

    .desktop {display: block;}

    body {
        padding-top: 50px;
        padding-bottom: 20px;
        font-family: "Gotham", Helvetica, Arial, sans-serif;
        background-color: transparent;
    }

    .hasaudio {
        position: relative;
        top: -1px;
        padding-right: 5px;
        color: #333;
    }

    .concrete {
        background-image: url('images/concrete.png');
        background-repeat: repeat;
        background-position: center center;
    }


    /* Set padding to keep content from hitting the edges */
    .body-content {
        padding-left: 15px;
        padding-right: 15px;
    }

    .row {
        margin-left: 0px;
        margin-right: 0px;
    }

    #wrapper {
        padding-left: 40px;
        transition: all .4s ease 0s;
        height: 100%
    }

    #sidebar-wrapper {
        margin-left: -150px;
        left: 0px;
        width: 230px;
        background: #222;
        position: fixed;
        height: 100%;
        z-index: 10000;
        transition: all .4s ease 0s;
    }

    .sidebar-nav {
        display: block;
        float: left;
        width: 230px;
        list-style: none;
        margin: 0;
        padding: 0;
    }

    .thanks {
        text-align: center;
        position: relative;
        top: 135px;
        left: 0%;
        padding: 25px;
        background: #cdf2d0;
        border-radius: 20px;
        border: 2px solid #8db584;
    }

    .failure {
        text-align: center;
        position: relative;
        top: 135px;
        left: 0%;
        padding: 25px;
        background: #f2cdcd;
        border-radius: 20px;
        border: 2px solid #d58484;
    }

    .thanks-text {
        font-size: 26px;
        text-transform: uppercase;
        color: #68a36d;
    }

    .failure-text {
        font-size: 26px;
        text-transform: uppercase;
    }

    .visible {
        visibility: visible;
        opacity: 1;
        -webkit-animation: fadein 1s; /* Safari, Chrome and Opera > 12.1 */
        -moz-animation: fadein 1s; /* Firefox < 16 */
        -ms-animation: fadein 1s; /* Internet Explorer */
        -o-animation: fadein 1s; /* Opera < 12.1 */
        animation: fadein 1s;
    }

    .hidden {
        visibility: hidden;
        opacity: 0;
        -webkit-animation: fadein 1s; /* Safari, Chrome and Opera > 12.1 */
        -moz-animation: fadein 1s; /* Firefox < 16 */
        -ms-animation: fadein 1s; /* Internet Explorer */
        -o-animation: fadein 1s; /* Opera < 12.1 */
        animation: fadein 1s;
    }

    #page-content-wrapper {
        padding-left: 0;
        margin-left: 0;
        width: 100%;
        height: auto;
    }

    #wrapper.active {
        padding-left: 180px;
    }

        #wrapper.active #sidebar-wrapper {
            left: 150px;
        }

    #page-content-wrapper {
        width: 100%;
    }

    #sidebar_menu li a, .sidebar-nav li a {
        color: #e2e2e2;
        display: block;
        float: left;
        text-decoration: none;
        width: 230px;
        background: #252525;
        border-top: 1px solid #373737;
        border-bottom: 1px solid #1A1A1A;
        -webkit-transition: background .5s;
        -moz-transition: background .5s;
        -o-transition: background .5s;
        -ms-transition: background .5s;
        transition: background .5s;
    }

    .sidebar_name {
        padding-top: 25px;
        color: #fff;
        opacity: .7;
    }

    .sidebar-nav li {
        line-height: 53px;
        text-indent: 20px;
    }

        .sidebar-nav li a {
            color: #e2e2e2;
            display: block;
            text-decoration: none;
        }

            .sidebar-nav li a:hover {
                color: #fff;
                background: rgba(255,255,255,0.2);
                text-decoration: none;
            }

            .sidebar-nav li a:active,
            .sidebar-nav li a:focus {
                text-decoration: none;
            }

    .sidebar-nav > .sidebar-brand {
        height: 65px;
        line-height: 60px;
        font-size: 18px;
    }

        .sidebar-nav > .sidebar-brand a {
            color: #999999;
        }

            .sidebar-nav > .sidebar-brand a:hover {
                color: #fff;
                background: none;
            }

    #main_icon {
        float: right;
        padding-right: 25px;
        padding-top: 20px;
        font-size: 30px;
        color: #cf5050;
    }

    .sub_icon {
        float: right;
        font-size: 30px;
        padding-right: 20px;
        padding-top: 10px;
    }

    .nav-text {
        font-size: 12px;
        letter-spacing: 5px;
        font-weight:500;
    }

    .content-header {
        height: 65px;
        line-height: 65px;
    }

        .content-header h1 {
            margin: 0;
            margin-left: 20px;
            line-height: 65px;
            display: inline-block;
        }

    @media (max-width:767px) {
        #wrapper {
            padding-left: 70px;
            transition: all .4s ease 0s;
        }

        #sidebar-wrapper {
            left: 70px;
        }

        #wrapper.active {
            padding-left: 150px;
        }

            #wrapper.active #sidebar-wrapper {
                left: 150px;
                width: 150px;
                transition: all .4s ease 0s;
            }
    }
    /* Set width on the form input elements since they're 100% wide by default */
    input,
    select,
    textarea {
        max-width: 920px;
    }

    .navbar {
        background-color: #CF5050;
    }

    .home-icon {
        margin-top: -9px;
        margin-left: -15px;
        width: 72em;
    }

    .sub-nav {
        position: absolute;
        right: 5px;
    }

    .sub-nav-item {
        color: #fff;
        font-size: 14px;
        letter-spacing: 2px;
        border-right: 1px solid #a94747;
        padding: 12px 15px;
        line-height: 50px;
        font-weight: 300;
        background-color: #cf5050;
        text-transform: lowercase;
        transition: all 0.5s ease-in-out;
    }

        .sub-nav-item:hover {
            color: #fff;
            text-decoration: none;
            background-color: #a94747;
            transition: all 0.5s ease-in-out;
        }

    .home-load {
        -webkit-animation: fadein 1s; /* Safari, Chrome and Opera > 12.1 */
        -moz-animation: fadein 1s; /* Firefox < 16 */
        -ms-animation: fadein 1s; /* Internet Explorer */
        -o-animation: fadein 1s; /* Opera < 12.1 */
        animation: fadein 1s;
    }


    /***********************SEARCH *******************/
    #search {
        position: fixed;
        top: 0px;
        left: 0px;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.9);
        -webkit-transition: all 0.5s ease-in-out;
        -moz-transition: all 0.5s ease-in-out;
        -o-transition: all 0.5s ease-in-out;
        -ms-transition: all 0.5s ease-in-out;
        transition: all 0.5s ease-in-out;
        opacity: 0;
    }

        #search.open {
            transition: all .5s ease-in-out;
            opacity: 1;
            z-index: 999999;
        }

        #search input[type="search"] {
            position: absolute;
            top: 50%;
            left: 20%;
            right: 20%;
            width: 60%;
            color: rgb(255, 255, 255);
            background: rgba(0, 0, 0, 0);
            font-size: 60px;
            font-weight: 500;
            text-align: center;
            border: 0px;
            margin: 0px;
            margin-top: -51px;
            outline: none;
            border-bottom: 2px rgba(207, 80, 80, 0.6) solid;
            max-width: 100%;
        }

    .close {
        position: fixed;
        top: 0px;
        right: 15px;
        font-weight: 100;
        color: #b3b3b3;
        opacity: 1;
        padding: 10px 17px;
        font-size: 100px;
        transition: all .5s ease-in-out;
        text-shadow: none;
    }

        .close:hover {
            transform: rotate(-90deg);
            -moz-transform: rotate(-90deg);
            -webkit-transform: rotate(-90deg);
            transform-origin: center;
            -moz-transform-origin: center;
            -webkit-transform-origin: center;
            transition: transform 1.0s ease all;
            -moz-transition: -moz-transform 1.0s ease all;
            -webkit-transition: -webkit-transform 1.0s ease all;
            color: #fff;
        }


    /*search buttons**/
    .btn-selected {
        border-color: #fff !important;
        color: #CF5050 !important;
    }

    .search-potawatomi {
        font-size: 32px;
        font-weight: 300;
        letter-spacing: 3px;
        color: #e4d6d6;
        background-color: transparent;
        border: 2px #CF5050 solid;
        left: 20%;
        right:20%;
        position: absolute;
        top: 57%;
        border-radius: 0px;
        transition: all .5s ease-in-out;
        padding: 10px 33px;
        width:60%;
    }

        .search-potawatomi:hover {
            border: #fff 2px solid;
            border-radius: 10px;
            color: #fff;
        }

    .search-english{
        top:67%;
    }


    /****************************************************/

    /***********word of the week************/

    .word-of-week-block {
        background-color: #fff;
        padding-bottom: 20px;
        box-shadow: #c1c1c1 4px 3px 16px;
    }

    .word-of-week {
        font-size: 3em;
        margin-top: 0px;
        font-weight:600;
    }

    .word-week-link {
        color: #333;
        transition: all .5s ease-in-out;
    }

        .word-week-link:hover {
            text-decoration: none;
            color: #fccd35;
            transition: all .5s ease-in-out;
        }

    .word-of-week-phonetic {
        margin-top: -25px;
        font-weight: 300;
        font-size: 22px;
    }

    .word-of-week-title {
        padding-left:15px;
        font-size: 19px;
        font-weight: 700;
        letter-spacing: 3px;
    }

    .word-of-week-definition-title {
        font-size: 12px;
        font-weight: 800;
        color: #cf5050;
        margin-bottom: -10px;
    }

    .word-of-week-translation {
        font-size: 21px;
    }

    .word-of-week-sentence-title {
        font-size: 12px;
        font-weight: 800;
        color: #cf5050;
        margin-bottom: -10px;
    }

    .word-of-week-english {
        font-weight: 300;
        font-style: italic;
        margin-top: -10px;
    }

    .word-of-week-img {
        /*margin-left: -15px;*/
        /*max-width: 450px;*/
        /*min-width: 450px;*/
    }

    .playsentence {
        font-size: 20px;
        position: relative;
        top: 3px;
        cursor: pointer;
        padding-right: 2px;
    }

    .cant-play {
        font-size: 16px;
        position: relative;
        top: 0px;
        color: #d0d0d0;
        cursor: not-allowed;
        padding-right: 0px;
        padding-bottom: 3px;
    }


    /**************audio************/

    #audioplayer {
        width: 100%;
        height: 60px;
        margin: 10px auto auto auto;
        border: solid #333 3px;
    }

    #pButton {
        height: 55px;
        width: 45px;
        border: none;
        background-size: 50% 50%;
        background-repeat: no-repeat;
        background-position: center;
        float: left;
        outline: none;
    }

    .play {
        background: url('images/play.png');
    }

    .pause {
        background: url('images/pause.png');
    }

    #timeline {
        width: 85%;
        height: 5px;
        margin-top: 25px;
        float: left;
        border-radius: 0px;
        background: rgb(207, 80, 80);
    }

    #playhead {
        width: 7px;
        height: 20px;
        border-radius: 0;
        margin-top: -8px;
        background: rgba(0, 0, 0,1);
    }

    /********************************************/

    /******* imag ads ****************************/
    .image-ads-block {
        background-color: #fff;
        padding-bottom: 0px;
        padding-right: 0px;
        box-shadow: #c1c1c1 4px 3px 16px;
        /*width: 40.4%;*/
        margin-left: 20px;
    }

    .image-ads-img {
        float: right;
        width: 108.4%;
        margin-right: -15px;
    }

    .class-header {
        font-weight: 800;
        letter-spacing: 4px;
    }

    .class-text {
        text-align: left;
        padding-right: 80px;
    }

    .class-button {
        border: #444 solid 3px;
        color: #444;
        background-color: transparent;
        padding: 14px 23px;
        font-size: 1em;
        font-weight: 600;
        letter-spacing: 3px;
        border-radius: 0px;
        margin-top: 10px;
        transition: all .5s ease-in-out;
    }

        .class-button:hover {
            border: #cf5050 solid 3px;
            color: #fff;
            background-color: #cf5050;
            transition: all .5s ease-in-out;
        }

    /*******************************************/


    /*****************welcome block****************/

    .welcome-block {
        padding-bottom: 0px;
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
        box-shadow: #c1c1c1 4px 3px 16px;
        margin-top: 25px;
        margin-bottom: 25px;
        height: 445px;
    }

    .welcome-image {
        padding-left: 0px;
    }


    .backgroundimg {
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
    }

    #back1 {
        background: url("images/language-banner5.png") no-repeat center center;
    }

    #back2 {
        background: url("images/language-banner4.jpg") no-repeat center center;
    }

    #back3 {
        background: url("images/language-banner3.jpg") no-repeat center center;
    }

    #back4 {
        background: url("images/language-banner2.jpg") no-repeat center center;
    }

    #back5 {
        background: url("images/language-banner.jpg") no-repeat center center;
    }

    @keyframes backgroundchangeFadeInOut {
        0% {
            opacity: 1;
        }

        30% {
            opacity: 1;
        }

        33% {
            opacity: 0;
        }

        92% {
            opacity: 0;
        }

        100% {
            opacity: 1;
        }
    }

    @-webkit-keyframes backgroundchangeFadeInOut {
        0% {
            opacity: 1;
        }

        30% {
            opacity: 1;
        }

        33% {
            opacity: 0;
        }

        92% {
            opacity: 0;
        }

        100% {
            opacity: 1;
        }
    }

    #backgroundchange div:nth-of-type(1) {
        animation-delay: 30s;
        -webkit-animation-delay: 30s;
    }

    #backgroundchange div:nth-of-type(2) {
        animation-delay: 25s;
        -webkit-animation-delay: 25s;
    }

    #backgroundchange div:nth-of-type(3) {
        animation-delay: 20s;
        -webkit-animation-delay: 20s;
    }

    #backgroundchange div:nth-of-type(4) {
        animation-delay: 15s;
        -webkit-animation-delay: 15s;
    }

    #backgroundchange div:nth-of-type(5) {
        animation-delay: 10s;
        -webkit-animation-delay: 10s;
    }

    #backgroundchange div {
        animation-name: backgroundchangeFadeInOut;
        animation-timing-function: ease-in-out;
        animation-iteration-count: infinite;
        animation-duration: 30s;
        -webkit-animation-name: backgroundchangeFadeInOut;
        -webkit-animation-timing-function: ease-in-out;
        -webkit-animation-iteration-count: infinite;
        -webkit-animation-duration: 30s;
    }

    .welcome-image-size {
        margin-left: -15px;
        width: 101.86%;
    }

    .welcome-text {
        width: 68%;
        color: #fff;
    }

    .welcome-title {
        color: #fff;
        font-size: 50px;
        letter-spacing: 3px;
        font-weight: 600;
    }

    .welcome-text-all {
        position: absolute;
        bottom: 0%;
        left: 0%;
        background: -webkit-linear-gradient(bottom, rgba(0,0,0,0.8) 0%,rgba(255,255,255,0) 100%);
        padding: 15px;
        padding-left: 25px;
    }

    hr {
        border-top: 2px solid #d6d6d6;
    }

    .word-count {
        position: absolute;
        top: 90px;
        right: 35px;
    }

    .potawatomi-count {
        color: #fdcd34;
        text-align: center;
        font-size: 14px;
        letter-spacing: 4px;
        text-transform: uppercase;
        margin-top: -5px;
    }

    .potawatomi-number {
        font-size: 50px;
        color: #fff;
        text-align: center;
    }

    /******************************* WORD PAGE ******************************************************/

    .word-page-block {
        background-color: #fff;
        padding-bottom: 20px;
        box-shadow: #c1c1c1 4px 3px 16px;
        margin-top: 20px;
        padding-top: 50px;
        padding-left: 40px;
        -webkit-animation: fadein 1s; /* Safari, Chrome and Opera > 12.1 */
        -moz-animation: fadein 1s; /* Firefox < 16 */
        -ms-animation: fadein 1s; /* Internet Explorer */
        -o-animation: fadein 1s; /* Opera < 12.1 */
        animation: fadein 1s;
    }

    @keyframes fadein {
        from {
            opacity: 0;
        }

        to {
            opacity: 1;
        }
    }

    /* Firefox < 16 */
    @-moz-keyframes fadein {
        from {
            opacity: 0;
        }

        to {
            opacity: 1;
        }
    }

    /* Safari, Chrome and Opera > 12.1 */
    @-webkit-keyframes fadein {
        from {
            opacity: 0;
        }

        to {
            opacity: 1;
        }
    }

    /* Internet Explorer */
    @-ms-keyframes fadein {
        from {
            opacity: 0;
        }

        to {
            opacity: 1;
        }
    }

    /* Opera < 12.1 */
    @-o-keyframes fadein {
        from {
            opacity: 0;
        }

        to {
            opacity: 1;
        }
    }

    .potawatomi-word {
        font-size: 72px;
        font-weight: 600;
    }

    .potawatomi-phonetic {
        font-size: 45px;
        font-weight: 300;
        margin-top: -20px;
        float: left;
    }

    .potawatomi-part-of-speech {
        font-size: 45px;
        font-weight: 300;
        margin-top: -20px;
    }

    .tool-tip-button {
        font-size: 15px;
        background-color: #cf5050;
        color: #fff;
        font-weight: 500;
        padding: 1px 2px 0px 2px;
        border-radius: 20px;
        text-align: center;
        position: relative;
        top: -25px;
        left: 0px;
    }

    .historic-audio-block {
        padding-top: 0px;
    }

    .historic-audio {
        font-size: 14px;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 2px;
        border: 2px #333 solid;
        padding: 10px 20px;
        margin-bottom: 8px;
        transition: all ease-in-out 0.5s;
        cursor: pointer;
    }

        .historic-audio:hover {
            color: #fff;
            background-color: #6D8842;
            transition: all ease-in-out 0.5s;
            border: 2px #6d8842 solid;
        }

    .audio-title {
        font-weight: 700;
        font-size: 16px;
        letter-spacing: 4px;
        color: #ababab;
    }

    .video-title-block {
        width: 100%;
    }

    .video-block {
        padding-top: 25px;
    }

    .video-button {
        font-size: 14px;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 5px;
        border: 2px #333 solid;
        padding: 10px 20px;
        margin-bottom: 8px;
        border-radius: 0px;
        width: 100%;
        transition: all ease-in-out 0.5s;
    }

        .video-button:hover {
            color: #fff;
            background-color: #333;
            transition: all ease-in-out 0.5s;
        }

    .video-title {
        font-weight: 700;
        font-size: 16px;
        letter-spacing: 4px;
        color: #ababab;
    }

    .english-e {
        font-size: 13px;
        font-weight: 600;
        color: #cf5050;
        padding-left: 28px;
    }

    .english-example {
        font-weight: 400;
        font-size: 16px;
        font-style: italic;
    }

    .english-block {
        padding-left: 28px;
    }

    .tag-title {
        font-weight: 700;
        font-size: 16px;
        letter-spacing: 4px;
        color: #ababab;
    }

    .tag-title-block {
        margin-top: 20px;
        margin-bottom: 15px;
    }

    .tags button {
        text-transform: uppercase;
        font-weight: 700;
        color: #fff;
        padding: 10px;
        background-color: #3b498a;
        margin-left: 2px;
        margin-right: 2px;
        word-wrap: break-word;
        border-radius: 0px;
        margin-bottom: 5px;
        border: #3b498a 3px solid;
        transition: all .3s ease-in-out;
    }

        .tags button:hover {
            color: #3b498a;
            transition: all .3s ease-in-out;
            background-color: #fff;
        }

    .related-words-block {
        margin-top: 65px;
        border: 3px #333 solid;
        padding: 15px 25px 25px 25px;
        margin-left: -35px;
    }

    .related-words-title {
        background-color: #fff;
        padding: 10px;
        position: relative;
        top: -35px;
        font-size: 25px;
    }

    .related {
        font-size: 30px;
        margin: 5px;
        border-radius: 0px;
        background-color: #f5f5f5;
        font-weight: 500;
        border: #f5f5f5 solid 3px;
        transition: all .3s ease-in-out;
    }


        .related:hover {
            border: #cf5050 solid 3px;
            transition: all .3s ease-in-out;
            background-color: #fff;
        }

    .related-words {
        margin-top: -25px;
    }



    .play-button {
        font-size: 15px;
        padding-right: 5px;
    }

    .plural {
        font-size: 30px;
        font-weight: 500;
        color: #333;
        margin-left: 5px;
    }

    .plural-title {
        font-weight: 700;
        font-size: 13px;
        letter-spacing: 3px;
        color: #ababab;
        margin-top: 60px;
        margin-bottom: -5px;
    }

    .alternate-title {
        font-weight: 700;
        font-size: 13px;
        letter-spacing: 3px;
        color: #ababab;
        margin-top: 60px;
        margin-bottom: -5px;
    }

    .pluralized {
        padding-left: 17px;
    }

    .word-audio {
        font-size: 35px;
        position: relative;
        top: -5px;
        left: 10px;
    }

    .word-image {
        box-shadow: #5f5f5f 4px 3px 16px;
    }

    .image {
        width: 100%;
    }

    .video-box {
        width: 1100px;
        height: 625px;
    }

    .modal-dialog {
        width: 61%;
    }

    .content-block {
        padding-left: 70px;
        padding-top: 20px;
    }

    .dictionary-block {
        padding-left: 0px;
        padding-top: 20px;
    }

    .breadcrumbs {
        position: relative;
        top: -30px;
        left: -10px;
    }

    .sourdough {
        font-size: 12px;
        letter-spacing: 4px;
        font-weight: 600;
    }

        .sourdough a {
            color: #333;
            transition: all .3s ease-in-out;
        }

            .sourdough a:hover {
                color: #cf5050;
                transition: all .3s ease-in-out;
                text-decoration: none;
            }

    .bread-select {
        color: #cf5050;
        text-transform: uppercase;
    }

    .image-block {
        padding-right: 60px;
        margin-top: -15px;
    }

    .modal-content {
        padding: 15px;
        border-radius: 0px;
    }

    .modal-header {
        border-bottom: 1px solid #efefef;
    }

    .modal-title {
        font-weight: 700;
        letter-spacing: 4px;
    }

    .example-sentence {
        margin-top: 50px;
    }

    .example-title {
        font-weight: 700;
        font-size: 13px;
        letter-spacing: 3px;
        color: #ababab;
    }

    .example {
        text-indent: 2px;
        font-size: 16px;
    }

    .translation {
        text-indent: 70px;
        font-size: 30px;
        font-weight: 500;
    }

    .cultural-teaching {
        float: right;
        position: relative;
        top: -65px;
        right: 20px;
    }

    .culture-link {
        color: #fff;
        background-color: #cf5050;
        transition: ease-in-out .5s all;
        border-radius: 0px;
        font-size: 12px;
        border: none;
        font-weight: 600;
        padding: 2px 10px;
    }

        .culture-link:hover {
            color: #cf5050;
            background-color: #fff;
            box-shadow: #9e9e9e 2px 2px 5px 1px;
            transition: ease-in-out .5s all;
        }

        .culture-link:active {
            color: #cf5050;
            background-color: #fff;
            box-shadow: #9e9e9e 2px 2px 5px 1px;
            transition: ease-in-out .5s all;
        }

    .flash {
        -webkit-animation: flash linear 1.7s infinite;
        animation: flash linear 1.7s infinite;
        padding-left: 3px;
    }

    @-webkit-keyframes flash {
        0% {
            opacity: 1;
        }

        50% {
            opacity: .1;
        }

        100% {
            opacity: 1;
        }
    }

    @keyframes flash {
        0% {
            opacity: 1;
        }

        50% {
            opacity: .1;
        }

        100% {
            opacity: 1;
        }
    }

    .winter-story {
        color: #7c8dde;
        font-weight: 600;
        letter-spacing: 3px;
        border-bottom: 1px solid #d2d2d2;
        padding-bottom: 4px;
        font-size: 25px;
    }

    .modal-close {
        float: right;
        font-size: 21px;
        font-weight: bold;
        line-height: 1;
        color: #000;
        text-shadow: 0 1px 0 #fff;
        filter: alpha(opacity=20);
        opacity: .2;
    }

        .modal-close:hover {
            color: #000;
            text-decoration: none;
            cursor: pointer;
            filter: alpha(opacity=50);
            opacity: .5;
        }

    button.modal-close {
        -webkit-appearance: none;
        padding: 0;
        cursor: pointer;
        background: transparent;
        border: 0;
    }

    input[type='text'], [type='email'], select, textarea {
        background: none;
        border: none;
        border-bottom: solid 2px #474544;
        color: #474544;
        font-size: 1.000em;
        font-weight: 500;
        letter-spacing: 1px;
        margin: 0em 0 1.875em 0;
        padding: 0 0 0.875em 0;
        text-transform: uppercase;
        width: 100%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        -ms-box-sizing: border-box;
        -o-box-sizing: border-box;
        box-sizing: border-box;
        -webkit-transition: all 0.3s;
        -moz-transition: all 0.3s;
        -ms-transition: all 0.3s;
        -o-transition: all 0.3s;
        transition: all 0.3s;
    }

        input[type='text']:focus, [type='email']:focus, textarea:focus {
            outline: none;
            padding: 0 0 0.875em 0;
        }

    .message {
        float: none;
    }

    .name {
        float: left;
        width: 45%;
    }

    select {
        background: url('https://cdn4.iconfinder.com/data/icons/ionicons/512/icon-ios7-arrow-down-32.png') no-repeat right;
        outline: none;
        -moz-appearance: none;
        -webkit-appearance: none;
    }

        select::-ms-expand {
            display: none;
        }

    .subject {
        width: 100%;
    }

    .telephone {
        width: 100%;
    }

    textarea {
        line-height: 150%;
        height: 150px;
        resize: none;
        width: 100%;
    }

    ::-webkit-input-placeholder {
        color: #474544;
    }

    :-moz-placeholder {
        color: #474544;
        opacity: 1;
    }

    ::-moz-placeholder {
        color: #474544;
        opacity: 1;
    }

    :-ms-input-placeholder {
        color: #474544;
    }

    #form_button {
        background: none;
        border: solid 2px #474544;
        color: #474544;
        cursor: pointer;
        display: inline-block;
        font-size: 0.875em;
        font-weight: bold;
        outline: none;
        padding: 20px 35px;
        letter-spacing: 5px;
        text-transform: uppercase;
        -webkit-transition: all 0.3s;
        -moz-transition: all 0.3s;
        -ms-transition: all 0.3s;
        -o-transition: all 0.3s;
        transition: all 0.3s;
    }

    .contact-text-title {
        text-transform: uppercase;
        font-weight: 600;
        font-size:31px;
        letter-spacing: 3px;
    }

    .contact-text-content {
        font-size: 18px;
        font-weight: 400;
    }

    .contact-image {
        width: 100%;
        padding-bottom: 20px;
    }

        #form_button:hover {
            background: #474544;
            color: #F2F3EB;
        }

    .translation-block {
        margin-top: 15px;
    }

    /*********************************************/

    /*********************DICTIONARY PAGE***************/

    .potawatomi-word-list {
        font-size: 23px;
        cursor: pointer;
        transition: ease-in-out .5s all;
        font-weight: 600;
    }

    .english-word-list {
        font-size: 23px;
        cursor: pointer;
        transition: ease-in-out .5s all;
        font-weight: 500;
    }

    .potawatomi-word-list:hover {
        color: #cf5050;
        transition: ease-in-out .5s all;
    }

    .english-word-list:hover {
        transition: ease-in-out .5s all;
        color: #cf5050;
    }


    ul li#list {
        border-bottom: 1px solid #ececec;
        line-height: 25px;
    }

    span.defined {
        float: right;
    }

    .unstyled {
        padding: 0px;
        list-style-type: none;
    }

    .letter-pagination {
        display: inline-block;
        padding-left: 0;
        margin: 20px 0;
        font-weight: 600;
        padding: 0px 0px;
        font-size: 15px;
        letter-spacing: 23px;
    }

        .letter-pagination > li {
            display: inline;
        }

            .letter-pagination > li > a,
            .letter-pagination > li > span {
                position: relative;
                float: left;
                padding: 6px 12px;
                text-align: center;
                line-height: 1.43;
                color: #333;
                text-decoration: none;
                border: none;
                transition: ease-in-out .5s all;
            }

            .letter-pagination > li:first-child > a,
            .letter-pagination > li:first-child > span {
                margin-left: 0;
                border-top-left-radius: 0px;
                border-bottom-left-radius: 0px;
                border: none;
            }

            .letter-pagination > li:last-child > a,
            .letter-pagination > li:last-child > span {
                border-top-right-radius: 0px;
                border-bottom-right-radius: 0px;
                border: none;
            }

            .letter-pagination > li > a:hover,
            .letter-pagination > li > span:hover,
            .letter-pagination > li > a:focus,
            .letter-pagination > li > span:focus {
                z-index: 2;
                color: #cf5050;
                background-color: transparent;
                border: none;
                transition: ease-in-out .5s all;
            }

        .letter-pagination > .active > a,
        .letter-pagination > .active > span,
        .letter-pagination > .active > a:hover,
        .letter-pagination > .active > span:hover,
        .letter-pagination > .active > a:focus,
        .letter-pagination > .active > span:focus {
            z-index: 3;
            color: #cf5050;
            cursor: default;
            background-color: transparent;
            border: none;
            transition: ease-in-out .5s all;
        }

        .letter-pagination > .disabled > span,
        .letter-pagination > .disabled > span:hover,
        .letter-pagination > .disabled > span:focus,
        .letter-pagination > .disabled > a,
        .letter-pagination > .disabled > a:hover,
        .letter-pagination > .disabled > a:focus {
            color: #777;
            cursor: not-allowed;
            background-color: #fff;
            border-color: #ddd;
        }

    .letter-pagination-lg > li > a,
    .letter-pagination-lg > li > span {
        padding: 10px 16px;
        font-size: 18px;
        line-height: 1.3333333;
    }

    .letter-pagination-lg > li:first-child > a,
    .letter-pagination-lg > li:first-child > span {
        border-top-left-radius: 0px;
        border-bottom-left-radius: 0px;
        border: none;
    }

    .letter-pagination-lg > li:last-child > a,
    .letter-pagination-lg > li:last-child > span {
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
    }

    .letter-pagination-sm > li > a,
    .letter-pagination-sm > li > span {
        padding: 5px 10px;
        font-size: 12px;
        line-height: 1.5;
    }

    .letter-pagination-sm > li:first-child > a,
    .letter-pagination-sm > li:first-child > span {
        border-top-left-radius: 0px;
        border-bottom-left-radius: 0px;
    }

    .letter-pagination-sm > li:last-child > a,
    .letter-pagination-sm > li:last-child > span {
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
    }



    .pagination {
        display: inline-block;
        padding-left: 0;
        margin: 20px 0;
        font-weight: 400;
        padding: 0px 0px;
        font-size: 15px;
        letter-spacing: 0px;
    }

        .pagination > li {
            display: inline;
        }

            .pagination > li > a,
            .pagination > li > span {
                position: relative;
                float: left;
                padding: 6px 12px;
                font-weight:500;
                text-align: center;
                line-height: 1.43;
                color: #333;
                text-decoration: none;
                border: none;
                transition: ease-in-out .5s all;
            }

            .pagination > li:first-child > a,
            .pagination > li:first-child > span {
                margin-left: 0;
                border-top-left-radius: 0px;
                border-bottom-left-radius: 0px;
                border: none;
            }

            .pagination > li:last-child > a,
            .pagination > li:last-child > span {
                border-top-right-radius: 0px;
                border-bottom-right-radius: 0px;
                border: none;
            }

            .pagination > li > a:hover,
            .pagination > li > span:hover,
            .pagination > li > a:focus,
            .pagination > li > span:focus {
                z-index: 2;
                color: #cf5050;
                background-color: transparent;
                border: none;
                transition: ease-in-out .5s all;
            }

        .pagination > .active > a,
        .pagination > .active > span,
        .pagination > .active > a:hover,
        .pagination > .active > span:hover,
        .pagination > .active > a:focus,
        .pagination > .active > span:focus {
            z-index: 3;
            color: #cf5050;
            cursor: default;
            background-color: transparent;
            border: none;
            transition: ease-in-out .5s all;
        }

        .pagination > .disabled > span,
        .pagination > .disabled > span:hover,
        .pagination > .disabled > span:focus,
        .pagination > .disabled > a,
        .pagination > .disabled > a:hover,
        .pagination > .disabled > a:focus {
            color: #777;
            cursor: not-allowed;
            background-color: #fff;
            border-color: #ddd;
        }

    .pagination-lg > li > a,
    .pagination-lg > li > span {
        padding: 10px 16px;
        font-size: 18px;
        line-height: 1.3333333;
    }

    .pagination-lg > li:first-child > a,
    .pagination-lg > li:first-child > span {
        border-top-left-radius: 0px;
        border-bottom-left-radius: 0px;
        border: none;
    }

    .pagination-lg > li:last-child > a,
    .pagination-lg > li:last-child > span {
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
    }

    .pagination-sm > li > a,
    .pagination-sm > li > span {
        padding: 5px 10px;
        font-size: 12px;
        line-height: 1.5;
    }

    .pagination-sm > li:first-child > a,
    .pagination-sm > li:first-child > span {
        border-top-left-radius: 0px;
        border-bottom-left-radius: 0px;
    }

    .pagination-sm > li:last-child > a,
    .pagination-sm > li:last-child > span {
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
    }


    #dictionary-search input[type="search"] {
        width: 100%;
        color: #333;
        background: rgba(0, 0, 0, 0);
        font-size: 60px;
        font-weight: 600;
        text-align: left;
        border: 0px;
        margin: 0px auto;
        margin-top: -20px;
        margin-bottom: 20px;
        padding-left: 85px;
        padding-right: 15px;
        outline: none;
        border-bottom: 2px #333 solid;
        max-width: 1540px;
    }

    #dictionary-search-potawatomi {
        width: 45%;
        margin-right:5%;
        border: 2px #CF5050 solid;
        font-size: 32px;
        font-weight: 300;
        letter-spacing: 3px;
        float:left;
    }

    #dictionary-search-english {
        width: 45%;
        margin-left: 5%;
        border: 2px #CF5050 solid;
        font-size: 32px;
        font-weight: 300;
        letter-spacing: 3px;
        float: left;
        clear: right;
    }

    .search-active {
        background-color: #FFFB98;
    }



    .inner-addon {
        position: relative;
    }

        .inner-addon .fal {
            position: absolute;
            padding: 10px;
            pointer-events: none;
            font-size: 60px
        }

    .left-addon .fal {
        left: 0px;
        top: -17px;
    }

    ::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
        color: #dedede;
        opacity: 1; /* Firefox */
    }

    :-ms-input-placeholder { /* Internet Explorer 10-11 */
        color: #dedede;
    }

    ::-ms-input-placeholder { /* Microsoft Edge */
        color: #dedede;
    }

    .tags-block {
        padding-left: 0px;
    }

    .tag-item-block {
        padding: 20px 20px;
        background-color: #f7f7f7;
        vertical-align: middle;
        white-space: nowrap;
        text-transform: lowercase;
        text-align: center;
        overflow: hidden;
        border: #fff 5px solid;
        transition: ease-in-out .5s all;
        cursor: pointer;
    }

        .tag-item-block:hover {
            background-color: #cf5050;
            color: #fff;
            transition: ease-in-out .5s all;
        }

    .tag-item {
        font-size: 35px;
        font-weight: 500;
    }

    .add-padding-left {
        position: relative;
        left: 10px;
    }
}
/* min-width 1025px, large screens */



/* iPhone Landscape */
@media screen and (max-device-width: 480px) and (orientation:landscape) {
    body {
        -webkit-transform: rotate(-90deg);
        -moz-transform: rotate(-90deg);
        -o-transform: rotate(-90deg);
        -ms-transform: rotate(-90deg);
        transform: rotate(-90deg);
    }
}
}

/*iPad Pro*/
/* Portrait */
@media only screen and (min-width: 1024px) and (max-height: 1366px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 1.5) {
    body {
        padding-top: 50px;
        padding-bottom: 20px;
        font-family: "Gotham", Helvetica, Arial, sans-serif;
        background-color: transparent;
        width: 100%;
    }

    .concrete {
        background-image: url('images/concrete.png');
        background-repeat: repeat;
        background-position: center center;
    }



    .word-count {
        position: absolute;
        top: 3px;
        right: 10px;
    }

    .potawatomi-count {
        color: #fdcd34;
        text-align: center;
        font-size: 19px;
        letter-spacing: 4px;
        text-transform: uppercase;
        margin-top: -5px;
    }

    .potawatomi-number {
        font-size: 62px;
        color: #fff;
        text-align: center;
    }

    .video-title-block {
        width: 100%;
    }

    .video-block {
        padding-top: 25px;
    }

    .video-button {
        font-size: 14px;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 5px;
        border: 2px #333 solid;
        padding: 10px 20px;
        margin-bottom: 8px;
        border-radius: 0px;
        width: 100%;
        transition: all ease-in-out 0.5s;
    }

        .video-button:hover {
            color: #fff;
            background-color: #333;
            transition: all ease-in-out 0.5s;
        }

    .video-title {
        font-weight: 700;
        font-size: 16px;
        letter-spacing: 4px;
        color: #ababab;
    }

    .english-e {
        font-size: 19px;
        font-weight: 600;
        color: #cf5050;
        padding-left: 28px;
    }

    .english-example {
        font-weight: 400;
        font-size: 20px;
        font-style: italic;
    }

    .english-block {
        padding-left: 28px;
    }



    /* Set padding to keep content from hitting the edges */
    .body-content {
        padding-left: 15px;
        padding-right: 15px;
    }

    .row {
        margin-left: 0px;
        margin-right: 0px;
    }

    #wrapper {
        padding-left: 80px;
        transition: all .4s ease 0s;
        height: 100%;
    }

    #sidebar-wrapper {
        margin-left: 0px;
        left: 0px;
        width: 230px;
        background: #222;
        position: fixed;
        height: 100%;
        z-index: 10000;
        transition: all .4s ease 0s;
    }

    .sidebar-nav {
        display: block;
        float: left;
        width: 230px;
        list-style: none;
        margin: 0;
        padding: 0;
    }

    #page-content-wrapper {
        padding-left: 0;
        margin-left: 0;
        width: 100%;
        height: auto;
    }

    #wrapper.active {
        padding-left: 0px;
    }

        #wrapper.active #sidebar-wrapper {
            left: -150px;
        }

    #page-content-wrapper {
        width: 100%;
    }

    #sidebar_menu li a, .sidebar-nav li a {
        color: #e2e2e2;
        display: block;
        float: left;
        text-decoration: none;
        width: 230px;
        background: #252525;
        border-top: 1px solid #373737;
        border-bottom: 1px solid #1A1A1A;
        -webkit-transition: background .5s;
        -moz-transition: background .5s;
        -o-transition: background .5s;
        -ms-transition: background .5s;
        transition: background .5s;
    }

    .sidebar_name {
        padding-top: 25px;
        color: #fff;
        opacity: .7;
    }

    .sidebar-nav li {
        line-height: 53px;
        text-indent: 20px;
    }

        .sidebar-nav li a {
            color: #e2e2e2;
            display: block;
            text-decoration: none;
        }

            .sidebar-nav li a:hover {
                color: #fff;
                background: rgba(255,255,255,0.2);
                text-decoration: none;
            }

            .sidebar-nav li a:active,
            .sidebar-nav li a:focus {
                text-decoration: none;
            }

    .sidebar-nav > .sidebar-brand {
        height: 65px;
        line-height: 60px;
        font-size: 18px;
    }

        .sidebar-nav > .sidebar-brand a {
            color: #999999;
        }

            .sidebar-nav > .sidebar-brand a:hover {
                color: #fff;
                background: none;
            }

    #main_icon {
        float: right;
        padding-right: 25px;
        padding-top: 20px;
        font-size: 30px;
        color: #cf5050;
    }

    .sub_icon {
        float: right;
        font-size: 30px;
        padding-right: 20px;
        padding-top: 10px;
    }

    .nav-text {
        font-size: 12px;
        letter-spacing: 5px;
        font-weight: 500;
    }

    .content-header {
        height: 65px;
        line-height: 65px;
    }

        .content-header h1 {
            margin: 0;
            margin-left: 20px;
            line-height: 65px;
            display: inline-block;
        }

    @media (max-width:767px) {
        #wrapper {
            padding-left: 70px;
            transition: all .4s ease 0s;
        }

        #sidebar-wrapper {
            left: 70px;
        }

        #wrapper.active {
            padding-left: 150px;
        }

            #wrapper.active #sidebar-wrapper {
                left: 150px;
                width: 150px;
                transition: all .4s ease 0s;
            }
    }
    /* Set width on the form input elements since they're 100% wide by default */
    input,
    select,
    textarea {
        max-width: 920px;
    }

    .navbar {
        background-color: #CF5050;
    }

    .home-icon {
        margin-top: -6px;
        margin-left: -15px;
        width: 29em;
    }

    .sub-nav {
        position: absolute;
        right: 5px;
    }

    .navbar-brand {
        height: 50px;
        padding-left: 0px;
        padding-right: 0px;
    }

    .sub-nav-item {
        color: #fff;
        font-size: 14px;
        letter-spacing: 2px;
        border-right: 1px solid #a94747;
        padding: 12px 15px;
        line-height: 50px;
        font-weight: 300;
        background-color: #cf5050;
        text-transform: lowercase;
        transition: all 0.5s ease-in-out;
    }

        .sub-nav-item:hover {
            color: #fff;
            text-decoration: none;
            background-color: #a94747;
            transition: all 0.5s ease-in-out;
        }

    .home-load {
        -webkit-animation: fadein 1s; /* Safari, Chrome and Opera > 12.1 */
        -moz-animation: fadein 1s; /* Firefox < 16 */
        -ms-animation: fadein 1s; /* Internet Explorer */
        -o-animation: fadein 1s; /* Opera < 12.1 */
        animation: fadein 1s;
        padding: 0px 0px 90px 0px;
    }


    /***********************SEARCH *******************/
    #search {
        position: fixed;
        top: 0px;
        left: 0px;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.9);
        -webkit-transition: all 0.5s ease-in-out;
        -moz-transition: all 0.5s ease-in-out;
        -o-transition: all 0.5s ease-in-out;
        -ms-transition: all 0.5s ease-in-out;
        transition: all 0.5s ease-in-out;
        opacity: 0;
    }

        #search.open {
            transition: all .5s ease-in-out;
            opacity: 1;
            z-index: 999999;
        }

        #search input[type="search"] {
            position: absolute;
            top: 50%;
            left: 20%;
            right: 20%;
            width: 60%;
            color: rgb(255, 255, 255);
            background: rgba(0, 0, 0, 0);
            font-size: 60px;
            font-weight: 500;
            text-align: center;
            border: 0px;
            margin: 0px;
            margin-top: -51px;
            outline: none;
            border-bottom: 2px rgba(207, 80, 80, 0.6) solid;
            max-width: 100%;
        }

    .close {
        position: fixed;
        top: 0px;
        right: 15px;
        font-weight: 100;
        color: #b3b3b3;
        opacity: 1;
        padding: 10px 17px;
        font-size: 100px;
        transition: all .5s ease-in-out;
        text-shadow: none;
    }

        .close:hover {
            transform: rotate(-90deg);
            -moz-transform: rotate(-90deg);
            -webkit-transform: rotate(-90deg);
            transform-origin: center;
            -moz-transform-origin: center;
            -webkit-transform-origin: center;
            transition: transform 1.0s ease all;
            -moz-transition: -moz-transform 1.0s ease all;
            -webkit-transition: -webkit-transform 1.0s ease all;
            color: #fff;
        }


    /*search buttons**/
    .btn-selected {
        border-color: #fff !important;
        color: #CF5050 !important;
    }

    .search-potawatomi {
        font-size: 32px;
        font-weight: 300;
        letter-spacing: 3px;
        color: #e4d6d6;
        background-color: transparent;
        border: 2px #CF5050 solid;
        left: 20%;
        right: 20%;
        position: absolute;
        top: 57%;
        border-radius: 0px;
        transition: all .5s ease-in-out;
        padding: 10px 33px;
        width: 60%;
    }

        .search-potawatomi:hover {
            border: #fff 2px solid;
            border-radius: 10px;
            color: #fff;
        }

    .search-english {
        top: 67%;
    }


    /****************************************************/

    /***********word of the week************/

    .word-of-week-block {
        background-color: #fff;
        padding-bottom: 20px;
        box-shadow: #c1c1c1 4px 3px 16px;
    }

    .word-of-week {
        font-size: 3em;
        margin-top: 0px;
        margin-bottom: -30px;
        font-weight: 600;
    }

    .word-week-link {
        color: #333;
        transition: all .5s ease-in-out;
    }

        .word-week-link:hover {
            text-decoration: none;
            color: #fccd35;
            transition: all .5s ease-in-out;
        }

    .word-of-week-phonetic {
        margin-top: 15px;
        font-weight: 300;
        font-size: 22px;
        font-weight: 300;
    }

    .word-of-week-title {
        padding-left: 15px;
        padding-top: 15px;
        font-size: 19px;
        font-weight: 700;
        letter-spacing: 3px;
    }

    .word-of-week-definition-title {
        font-size: 16px;
        font-weight: 800;
        color: #cf5050;
        margin-bottom: -10px;
    }

    .word-of-week-translation {
        font-size: 25px;
    }

    .word-of-week-sentence-title {
        font-size: 16px;
        font-weight: 800;
        color: #cf5050;
        margin-bottom: -10px;
    }

    .word-of-week-sentence {
        font-size: 24px;
    }

    .word-of-week-img {
        margin-left: -20px;
        max-width: 100%;
        min-width: 100%;
    }

    .mobile-img-box {
        padding-bottom: 25px;
    }

    .video-box {
        width: 540px;
        height: 310px;
    }

    .modal-dialog {
        margin: 30px 20px 30px 115px;
    }

    .playsentence {
        font-size: 23px;
        position: relative;
        top: 3px;
        cursor: pointer;
        padding-right: 2px;
    }

    .cant-play {
        font-size: 20px;
        position: relative;
        top: 3px;
        color: #d0d0d0;
        cursor: not-allowed;
        padding-right: 2px;
        padding-bottom: 3px;
    }

    /**************audio************/

    #audioplayer {
        width: 100%;
        height: 60px;
        margin: 43px auto auto auto;
        border: solid #333 3px;
    }

    #pButton {
        height: 55px;
        width: 45px;
        border: none;
        background-size: 50% 50%;
        background-repeat: no-repeat;
        background-position: center;
        float: left;
        outline: none;
    }

    .play {
        background: url('images/play.png');
    }

    .pause {
        background: url('images/pause.png');
    }

    #timeline {
        width: 85%;
        height: 5px;
        margin-top: 25px;
        float: left;
        border-radius: 0px;
        background: rgb(207, 80, 80);
    }

    #playhead {
        width: 7px;
        height: 20px;
        border-radius: 0;
        margin-top: -8px;
        background: rgba(0, 0, 0,1);
    }

    /********************************************/

    /******* imag ads ****************************/
    .image-ads-block {
        background-color: #fff;
        padding-bottom: 0px;
        padding-right: 0px;
        box-shadow: #c1c1c1 4px 3px 16px;
        background-image: url('images/mobile-learn.jpg');
        background-repeat: no-repeat;
        background-size: cover;
        margin-left: 0px;
        padding-bottom: 15px;
    }

    .image-ads-img {
        float: right;
        width: 108.4%;
        margin-right: -15px;
    }

    .class-header {
        font-weight: 800;
        letter-spacing: 4px;
        padding-top: 15px;
        padding-right: 160px;
    }

    .class-text {
        text-align: left;
        padding-right: 200px;
        font-size: 18px;
    }

    .img-class-mobile {
        display: none;
    }

    .class-button {
        border: #cf5050 solid 3px;
        color: #fff;
        background-color: #cf5050;
        padding: 14px 23px;
        font-size: 1em;
        font-weight: 600;
        letter-spacing: 3px;
        border-radius: 0px;
        margin-top: 10px;
        transition: all .5s ease-in-out;
    }

        .class-button:hover {
            border: #333 solid 3px;
            color: #333;
            background-color: transparent;
            transition: all .5s ease-in-out;
        }

    /*******************************************/


    /*****************welcome block****************/

    .welcome-block {
        padding-bottom: 0px;
        background-image: url('images/language-banner.jpg');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
        box-shadow: #c1c1c1 4px 3px 16px;
        margin-top: 20px;
        margin-bottom: 25px;
        height: 200px;
    }

    .welcome-image {
        padding-left: 0px;
    }

    .welcome-image-size {
        margin-left: -15px;
        width: 101.86%;
    }

    .welcome-text {
        display: none;
    }

    .welcome-title {
        color: #fff;
        font-size: 50px;
        letter-spacing: 3px;
        font-weight: 600;
        position: relative;
        top: -110px;
        left: -8px;
    }

    .welcome-text-all {
        position: absolute;
        top: 42%;
        left: 0%;
        width: 100%;
        background: -webkit-linear-gradient(bottom, rgba(0,0,0,0.4) 0%,rgba(255,255,255,0) 100%);
        padding: 15px;
        padding-left: 25px;
    }

    hr {
        border-top: 2px solid #d6d6d6;
    }


    /******************************* WORD PAGE ******************************************************/

    .word-page-block {
        background-color: #fff;
        padding-bottom: 20px;
        box-shadow: #c1c1c1 4px 3px 16px;
        margin-top: 20px;
        padding-top: 50px;
        padding-left: 40px;
        -webkit-animation: fadein 1s; /* Safari, Chrome and Opera > 12.1 */
        -moz-animation: fadein 1s; /* Firefox < 16 */
        -ms-animation: fadein 1s; /* Internet Explorer */
        -o-animation: fadein 1s; /* Opera < 12.1 */
        animation: fadein 1s;
    }

    @keyframes fadein {
        from {
            opacity: 0;
        }

        to {
            opacity: 1;
        }
    }

    /* Firefox < 16 */
    @-moz-keyframes fadein {
        from {
            opacity: 0;
        }

        to {
            opacity: 1;
        }
    }

    /* Safari, Chrome and Opera > 12.1 */
    @-webkit-keyframes fadein {
        from {
            opacity: 0;
        }

        to {
            opacity: 1;
        }
    }

    /* Internet Explorer */
    @-ms-keyframes fadein {
        from {
            opacity: 0;
        }

        to {
            opacity: 1;
        }
    }



    /* Opera < 12.1 */
    @-o-keyframes fadein {
        from {
            opacity: 0;
        }

        to {
            opacity: 1;
        }
    }

    .potawatomi-word {
        font-size: 4em;
        font-weight: 600;
    }

    .potawatomi-phonetic {
        font-size: 33px;
        font-weight: 300;
        margin-top: -20px;
        float: left;
    }

    .add-bottom-mobile {
        padding-bottom: 90px;
    }

    .potawatomi-part-of-speech {
        font-size: 33px;
        font-weight: 300;
        margin-top: -20px;
    }

    .tool-tip-button {
        display: none;
    }

    .historic-audio-block {
        padding-top: 0px;
    }

    .historic-audio {
        font-size: 14px;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 2px;
        border: 2px #333 solid;
        padding: 10px 20px;
        margin-bottom: 8px;
        transition: all ease-in-out 0.5s;
        cursor: pointer;
    }

        .historic-audio:hover {
            color: #fff;
            background-color: #6D8842;
            transition: all ease-in-out 0.5s;
            border: 2px #6d8842 solid;
        }

    .audio-title {
        font-weight: 700;
        font-size: 16px;
        letter-spacing: 4px;
        color: #ababab;
    }

    .tag-title {
        font-weight: 700;
        font-size: 16px;
        letter-spacing: 4px;
        color: #ababab;
    }

    .tag-title-block {
        margin-top: 20px;
        margin-bottom: 15px;
    }

    .tags button {
        text-transform: uppercase;
        font-weight: 700;
        color: #fff;
        padding: 10px;
        background-color: #3b498a;
        margin-left: 2px;
        margin-right: 2px;
        word-wrap: break-word;
        border-radius: 0px;
        margin-bottom: 5px;
        border: #3b498a 3px solid;
        transition: all .3s ease-in-out;
    }

        .tags button:hover {
            color: #3b498a;
            transition: all .3s ease-in-out;
            background-color: #fff;
        }

    .related-words-block {
        margin-top: 65px;
        border: 3px #333 solid;
        padding: 15px 25px 25px 25px;
        margin-left: -10px;
    }

    .related-words-title {
        background-color: #fff;
        padding: 10px;
        position: relative;
        top: -35px;
        font-size: 25px;
    }

    .related {
        font-size: 30px;
        margin: 5px;
        border-radius: 0px;
        background-color: #f5f5f5;
        border: #f5f5f5 solid 3px;
        transition: all .3s ease-in-out;
    }


        .related:hover {
            border: #cf5050 solid 3px;
            transition: all .3s ease-in-out;
            background-color: #fff;
        }

    .related-words {
        margin-top: -25px;
    }

    .play-button {
        font-size: 15px;
        padding-right: 5px;
    }

    .plural {
        font-size: 30px;
        font-weight: 500;
        color: #333;
        margin-left: 5px;
    }

    .plural-title {
        font-weight: 700;
        font-size: 13px;
        letter-spacing: 3px;
        color: #ababab;
        margin-top: 30px;
        margin-bottom: -5px;
    }

    .modal-body {
        font-size: 20px;
        font-weight: 300;
    }

    .alternate-title {
        font-weight: 700;
        font-size: 13px;
        letter-spacing: 3px;
        color: #ababab;
        margin-top: 20px;
        margin-bottom: -5px;
    }

    .pluralized {
        padding-left: 17px;
    }

    .word-audio {
        font-size: 35px;
        position: relative;
        top: -5px;
        left: 10px;
    }

    .word-image {
        box-shadow: #5f5f5f 4px 3px 16px;
    }

    .image {
        width: 100%;
    }

    .content-block {
        padding-left: 0px;
        padding-top: 0px;
        margin-top: -25px;
    }

    .dictionary-block {
        padding-left: 0px;
        padding-top: 20px;
    }

    .breadcrumbs {
        position: relative;
        top: -30px;
        left: -10px;
    }


    .culture-text {
        display: none;
    }

    .sourdough {
        font-size: 12px;
        letter-spacing: 4px;
        font-weight: 600;
    }

        .sourdough a {
            color: #333;
            transition: all .3s ease-in-out;
        }

            .sourdough a:hover {
                color: #cf5050;
                transition: all .3s ease-in-out;
                text-decoration: none;
            }

    .bread-select {
        color: #cf5050;
        text-transform: uppercase;
    }

    .image-block {
        padding-right: 60px;
        margin-top: 35px;
    }

    .modal-content {
        padding: 15px;
        border-radius: 0px;
    }

    .modal-header {
        border-bottom: 1px solid #efefef;
    }

    .modal-title {
        font-weight: 700;
        letter-spacing: 4px;
    }

    .example-sentence {
        margin-top: 20px;
    }

    .example-title {
        font-weight: 700;
        font-size: 13px;
        letter-spacing: 3px;
        color: #ababab;
    }

    .example {
        text-indent: 2px;
        font-size: 21px;
    }

    .translation {
        text-indent: 32px;
        font-size: 25px;
        font-weight: 500;
    }

    .cultural-teaching {
        float: right;
        position: relative;
        top: -65px;
        right: 5px;
    }

    .culture-link {
        color: #fff;
        background-color: #cf5050;
        transition: ease-in-out .5s all;
        border-radius: 0px;
        font-size: 30px;
        border: none;
        font-weight: 600;
        padding: 5px 10px;
    }

        .culture-link:hover {
            color: #cf5050;
            background-color: #fff;
            box-shadow: #9e9e9e 2px 2px 5px 1px;
            transition: ease-in-out .5s all;
        }

        .culture-link:active {
            color: #cf5050;
            background-color: #fff;
            box-shadow: #9e9e9e 2px 2px 5px 1px;
            transition: ease-in-out .5s all;
        }

    .flash {
        -webkit-animation: flash linear 1.7s infinite;
        animation: flash linear 1.7s infinite;
        padding-left: 3px;
    }

    @-webkit-keyframes flash {
        0% {
            opacity: 1;
        }

        50% {
            opacity: .1;
        }

        100% {
            opacity: 1;
        }
    }

    @keyframes flash {
        0% {
            opacity: 1;
        }

        50% {
            opacity: .1;
        }

        100% {
            opacity: 1;
        }
    }

    .winter-story {
        color: #7c8dde;
        font-weight: 600;
        letter-spacing: 3px;
        border-bottom: 1px solid #d2d2d2;
        padding-bottom: 4px;
        font-size: 25px;
    }

    .modal-close {
        float: right;
        font-size: 21px;
        font-weight: bold;
        line-height: 1;
        color: #000;
        text-shadow: 0 1px 0 #fff;
        filter: alpha(opacity=20);
        opacity: .2;
    }

        .modal-close:hover {
            color: #000;
            text-decoration: none;
            cursor: pointer;
            filter: alpha(opacity=50);
            opacity: .5;
        }

    button.modal-close {
        -webkit-appearance: none;
        padding: 0;
        cursor: pointer;
        background: transparent;
        border: 0;
    }

    .translation-block {
        margin-top: 15px;
    }

    /*********************************************/

    /*********************DICTIONARY PAGE***************/

    .potawatomi-word-list {
        font-size: 2.4em;
        cursor: pointer;
        transition: ease-in-out .5s all;
        font-weight: 600;
    }

    .english-word-list {
        font-size: 16px;
        cursor: pointer;
        width: 100%;
        transition: ease-in-out .5s all;
        padding-left: 25px;
        padding-bottom: 10px;
        text-transform: uppercase;
        color: #cf5050;
        font-weight: 600;
    }

    .potawatomi-word-list:hover {
        color: #cf5050;
        transition: ease-in-out .5s all;
    }

    .english-word-list:hover {
        transition: ease-in-out .5s all;
        color: #cf5050;
    }


    ul li#list {
        border-bottom: none;
        line-height: 25px;
    }

    span.defined {
        float: right;
    }

    .unstyled {
        padding: 0px;
        list-style-type: none;
    }

    .letter-nav {
        overflow-x: scroll;
        overflow-y: hidden;
        padding-bottom: 25px;
    }

    .border-gradient {
        -webkit-border-image: -webkit-gradient(linear, left top, left bottom, from(#00abeb), to(#fff), color-stop(0.5, #fff), color-stop(0.5, #66cc00)) 21 30 30 21 repeat repeat;
    }


    .letter-pagination {
        display: inline-block;
        padding-left: 0;
        margin: 20px 0;
        font-weight: 600;
        padding: 0px 0px;
        font-size: 35px;
        letter-spacing: 23px;
        width: 1920px;
        height: 60px;
        padding-left: 20px;
        border-left: 3px #333 solid;
        border-right: 3px #333 solid;
    }

        .letter-pagination > li {
            display: inline;
        }

            .letter-pagination > li > a,
            .letter-pagination > li > span {
                position: relative;
                float: left;
                padding: 6px 12px;
                text-align: center;
                line-height: 1.43;
                color: #333;
                text-decoration: none;
                border: none;
                transition: ease-in-out .5s all;
            }

            .letter-pagination > li:first-child > a,
            .letter-pagination > li:first-child > span {
                margin-left: 0;
                border-top-left-radius: 0px;
                border-bottom-left-radius: 0px;
                border: none;
            }

            .letter-pagination > li:last-child > a,
            .letter-pagination > li:last-child > span {
                border-top-right-radius: 0px;
                border-bottom-right-radius: 0px;
                border: none;
            }

            .letter-pagination > li > a:hover,
            .letter-pagination > li > span:hover,
            .letter-pagination > li > a:focus,
            .letter-pagination > li > span:focus {
                z-index: 2;
                color: #cf5050;
                background-color: transparent;
                border: none;
                transition: ease-in-out .5s all;
            }

        .letter-pagination > .active > a,
        .letter-pagination > .active > span,
        .letter-pagination > .active > a:hover,
        .letter-pagination > .active > span:hover,
        .letter-pagination > .active > a:focus,
        .letter-pagination > .active > span:focus {
            z-index: 3;
            color: #cf5050;
            cursor: default;
            background-color: transparent;
            border: none;
            transition: ease-in-out .5s all;
        }

        .letter-pagination > .disabled > span,
        .letter-pagination > .disabled > span:hover,
        .letter-pagination > .disabled > span:focus,
        .letter-pagination > .disabled > a,
        .letter-pagination > .disabled > a:hover,
        .letter-pagination > .disabled > a:focus {
            color: #777;
            cursor: not-allowed;
            background-color: #fff;
            border-color: #ddd;
        }

    .letter-pagination-lg > li > a,
    .letter-pagination-lg > li > span {
        padding: 10px 16px;
        font-size: 18px;
        line-height: 1.3333333;
    }

    .letter-pagination-lg > li:first-child > a,
    .letter-pagination-lg > li:first-child > span {
        border-top-left-radius: 0px;
        border-bottom-left-radius: 0px;
        border: none;
    }

    .letter-pagination-lg > li:last-child > a,
    .letter-pagination-lg > li:last-child > span {
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
    }

    .letter-pagination-sm > li > a,
    .letter-pagination-sm > li > span {
        padding: 5px 10px;
        font-size: 12px;
        line-height: 1.5;
    }

    .letter-pagination-sm > li:first-child > a,
    .letter-pagination-sm > li:first-child > span {
        border-top-left-radius: 0px;
        border-bottom-left-radius: 0px;
    }

    .letter-pagination-sm > li:last-child > a,
    .letter-pagination-sm > li:last-child > span {
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
    }



    .pagination {
        display: inline-block;
        padding-left: 0;
        margin: 20px 0;
        font-weight: 400;
        padding: 0px 0px;
        font-size: 29px;
        letter-spacing: 0px;
    }

        .pagination > li {
            display: inline;
        }

            .pagination > li > a,
            .pagination > li > span {
                position: relative;
                float: left;
                padding: 6px 12px;
                text-align: center;
                line-height: 1.43;
                color: #333;
                text-decoration: none;
                border: none;
                transition: ease-in-out .5s all;
            }

            .pagination > li:first-child > a,
            .pagination > li:first-child > span {
                margin-left: 0;
                border-top-left-radius: 0px;
                border-bottom-left-radius: 0px;
                border: none;
            }

            .pagination > li:last-child > a,
            .pagination > li:last-child > span {
                border-top-right-radius: 0px;
                border-bottom-right-radius: 0px;
                border: none;
            }

            .pagination > li > a:hover,
            .pagination > li > span:hover,
            .pagination > li > a:focus,
            .pagination > li > span:focus {
                z-index: 2;
                color: #cf5050;
                background-color: transparent;
                border: none;
                transition: ease-in-out .5s all;
            }

        .pagination > .active > a,
        .pagination > .active > span,
        .pagination > .active > a:hover,
        .pagination > .active > span:hover,
        .pagination > .active > a:focus,
        .pagination > .active > span:focus {
            z-index: 3;
            color: #cf5050;
            cursor: default;
            background-color: transparent;
            border: none;
            transition: ease-in-out .5s all;
        }

        .pagination > .disabled > span,
        .pagination > .disabled > span:hover,
        .pagination > .disabled > span:focus,
        .pagination > .disabled > a,
        .pagination > .disabled > a:hover,
        .pagination > .disabled > a:focus {
            color: #777;
            cursor: not-allowed;
            background-color: #fff;
            border-color: #ddd;
        }

    .pagination-lg > li > a,
    .pagination-lg > li > span {
        padding: 10px 16px;
        font-size: 18px;
        line-height: 1.3333333;
    }

    .pagination-lg > li:first-child > a,
    .pagination-lg > li:first-child > span {
        border-top-left-radius: 0px;
        border-bottom-left-radius: 0px;
        border: none;
    }

    .pagination-lg > li:last-child > a,
    .pagination-lg > li:last-child > span {
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
    }

    .pagination-sm > li > a,
    .pagination-sm > li > span {
        padding: 5px 10px;
        font-size: 12px;
        line-height: 1.5;
    }

    .pagination-sm > li:first-child > a,
    .pagination-sm > li:first-child > span {
        border-top-left-radius: 0px;
        border-bottom-left-radius: 0px;
    }

    .pagination-sm > li:last-child > a,
    .pagination-sm > li:last-child > span {
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
    }


    #dictionary-search input[type="search"] {
        width: 100%;
        color: #333;
        background: rgba(0, 0, 0, 0);
        font-size: 60px;
        font-weight: 600;
        text-align: left;
        border: 0px;
        margin: 0px auto;
        margin-top: -20px;
        margin-bottom: 20px;
        padding-left: 85px;
        padding-right: 15px;
        outline: none;
        border-bottom: 2px #333 solid;
        max-width: 1540px;
    }

    .inner-addon {
        position: relative;
    }

        .inner-addon .fal {
            position: absolute;
            padding: 10px;
            pointer-events: none;
            font-size: 60px
        }

    .left-addon .fal {
        left: 0px;
        top: -17px;
    }

    ::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
        color: #dedede;
        opacity: 1; /* Firefox */
    }

    :-ms-input-placeholder { /* Internet Explorer 10-11 */
        color: #dedede;
    }

    ::-ms-input-placeholder { /* Microsoft Edge */
        color: #dedede;
    }

    .tags-block {
        padding-left: 0px;
    }

    .tag-item-block {
        padding: 20px 20px;
        background-color: #f7f7f7;
        vertical-align: middle;
        white-space: nowrap;
        text-transform: lowercase;
        text-align: center;
        overflow: hidden;
        border: #fff 5px solid;
        transition: ease-in-out .5s all;
        cursor: pointer;
    }

        .tag-item-block:hover {
            background-color: #cf5050;
            color: #fff;
            transition: ease-in-out .5s all;
        }

    .tag-item {
        font-size: 38px;
        font-weight: 500;
    }

    .add-padding-left {
        position: relative;
        left: 10px;
    }
}

/* Landscape */
@media only screen and (min-width: 1366px) and (max-height: 1024px) {
    body {
        padding-top: 50px;
        padding-bottom: 20px;
        font-family: "Gotham", Helvetica, Arial, sans-serif;
        background-color: transparent;
    }


    .concrete {
        background-image: url('images/concrete.png');
        background-repeat: repeat;
        background-position: center center;
    }


    /* Set padding to keep content from hitting the edges */
    .body-content {
        padding-left: 15px;
        padding-right: 15px;
    }

    .row {
        margin-left: 0px;
        margin-right: 0px;
    }

    #wrapper {
        padding-left: 0px;
        transition: all .4s ease 0s;
        height: 100%
    }

    #wrapper2 {
        padding-left: 65px;
        transition: all .4s ease 0s;
        height: 100%
    }

    #sidebar-wrapper {
        margin-left: -150px;
        left: 0px;
        width: 230px;
        background: #222;
        position: fixed;
        height: 100%;
        z-index: 10000;
        transition: all .4s ease 0s;
    }

    .sidebar-nav {
        display: block;
        float: left;
        width: 230px;
        list-style: none;
        margin: 0;
        padding: 0;
    }

    #page-content-wrapper {
        padding-left: 0;
        margin-left: 0;
        width: 100%;
        height: auto;
    }

    #wrapper.active {
        padding-left: 155px;
    }

        #wrapper.active #sidebar-wrapper {
            left: 150px;
        }

    #page-content-wrapper {
        width: 100%;
    }

    #sidebar_menu li a, .sidebar-nav li a {
        color: #e2e2e2;
        display: block;
        float: left;
        text-decoration: none;
        width: 230px;
        background: #252525;
        border-top: 1px solid #373737;
        border-bottom: 1px solid #1A1A1A;
        -webkit-transition: background .5s;
        -moz-transition: background .5s;
        -o-transition: background .5s;
        -ms-transition: background .5s;
        transition: background .5s;
    }

    .sidebar_name {
        padding-top: 25px;
        color: #fff;
        opacity: .7;
    }

    .sidebar-nav li {
        line-height: 53px;
        text-indent: 20px;
    }

        .sidebar-nav li a {
            color: #e2e2e2;
            display: block;
            text-decoration: none;
        }

            .sidebar-nav li a:hover {
                color: #fff;
                background: rgba(255,255,255,0.2);
                text-decoration: none;
            }

            .sidebar-nav li a:active,
            .sidebar-nav li a:focus {
                text-decoration: none;
            }

    .sidebar-nav > .sidebar-brand {
        height: 65px;
        line-height: 60px;
        font-size: 18px;
    }

        .sidebar-nav > .sidebar-brand a {
            color: #999999;
        }

            .sidebar-nav > .sidebar-brand a:hover {
                color: #fff;
                background: none;
            }

    #main_icon {
        float: right;
        padding-right: 25px;
        padding-top: 20px;
        font-size: 30px;
        color: #cf5050;
    }

    .sub_icon {
        float: right;
        font-size: 30px;
        padding-right: 20px;
        padding-top: 10px;
    }

    .nav-text {
        font-size: 12px;
        letter-spacing: 5px;
        font-weight: 500;
    }

    .content-header {
        height: 65px;
        line-height: 65px;
    }

        .content-header h1 {
            margin: 0;
            margin-left: 20px;
            line-height: 65px;
            display: inline-block;
        }

    @media (max-width:767px) {
        #wrapper {
            padding-left: 70px;
            transition: all .4s ease 0s;
        }

        #sidebar-wrapper {
            left: 70px;
        }

        #wrapper.active {
            padding-left: 150px;
        }

            #wrapper.active #sidebar-wrapper {
                left: 150px;
                width: 150px;
                transition: all .4s ease 0s;
            }
    }
    /* Set width on the form input elements since they're 100% wide by default */
    input,
    select,
    textarea {
        max-width: 920px;
    }

    .navbar {
        background-color: #CF5050;
    }

    .home-icon {
        margin-top: -7px;
        margin-left: -15px;
        width: 62em !important;
    }



    .hasaudio {
        font-size: 19px;
        position: relative;
        padding-right: 8px;
        top: 0px;
    }

    .sub-nav {
        position: absolute;
        right: 5px;
    }

    .sub-nav-item {
        color: #fff;
        font-size: 14px;
        letter-spacing: 2px;
        border-right: 1px solid #a94747;
        padding: 12px 15px;
        line-height: 50px;
        font-weight: 300;
        background-color: #cf5050;
        text-transform: lowercase;
        transition: all 0.5s ease-in-out;
    }

        .sub-nav-item:hover {
            color: #fff;
            text-decoration: none;
            background-color: #a94747;
            transition: all 0.5s ease-in-out;
        }

    .home-load {
        -webkit-animation: fadein 1s; /* Safari, Chrome and Opera > 12.1 */
        -moz-animation: fadein 1s; /* Firefox < 16 */
        -ms-animation: fadein 1s; /* Internet Explorer */
        -o-animation: fadein 1s; /* Opera < 12.1 */
        animation: fadein 1s;
        padding-left: 10px;
    }


    /***********************SEARCH *******************/
    #search {
        position: fixed;
        top: 0px;
        left: 0px;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.9);
        -webkit-transition: all 0.5s ease-in-out;
        -moz-transition: all 0.5s ease-in-out;
        -o-transition: all 0.5s ease-in-out;
        -ms-transition: all 0.5s ease-in-out;
        transition: all 0.5s ease-in-out;
        opacity: 0;
    }

        #search.open {
            transition: all .5s ease-in-out;
            opacity: 1;
            z-index: 999999;
        }

        #search input[type="search"] {
            position: absolute;
            top: 50%;
            left: 20%;
            right: 20%;
            width: 60%;
            color: rgb(255, 255, 255);
            background: rgba(0, 0, 0, 0);
            font-size: 60px;
            font-weight: 500;
            text-align: center;
            border: 0px;
            margin: 0px;
            margin-top: -51px;
            outline: none;
            border-bottom: 2px rgba(207, 80, 80, 0.6) solid;
            max-width: 100%;
        }

    .close {
        position: fixed;
        top: 0px;
        right: 15px;
        font-weight: 100;
        color: #b3b3b3;
        opacity: 1;
        padding: 10px 17px;
        font-size: 100px;
        transition: all .5s ease-in-out;
        text-shadow: none;
    }

        .close:hover {
            transform: rotate(-90deg);
            -moz-transform: rotate(-90deg);
            -webkit-transform: rotate(-90deg);
            transform-origin: center;
            -moz-transform-origin: center;
            -webkit-transform-origin: center;
            transition: transform 1.0s ease all;
            -moz-transition: -moz-transform 1.0s ease all;
            -webkit-transition: -webkit-transform 1.0s ease all;
            color: #fff;
        }


    /*search buttons**/
    .btn-selected {
        border-color: #fff !important;
        color: #CF5050 !important;
    }

    .search-potawatomi {
        font-size: 32px;
        font-weight: 300;
        letter-spacing: 3px;
        color: #e4d6d6;
        background-color: transparent;
        border: 2px #CF5050 solid;
        left: 20%;
        right: 20%;
        position: absolute;
        top: 57%;
        border-radius: 0px;
        transition: all .5s ease-in-out;
        padding: 10px 33px;
        width: 60%;
    }

        .search-potawatomi:hover {
            border: #fff 2px solid;
            border-radius: 10px;
            color: #fff;
        }

    .search-english {
        top: 67%;
    }



    /****************************************************/

    /***********word of the week************/

    .word-of-week-block {
        background-color: #fff;
        padding-bottom: 20px;
        box-shadow: #c1c1c1 4px 3px 16px;
        width:50%;
        display: inline-block;
    }

    .lefters {
        float: left;
    }

    .word-of-week {
        font-size: 3em;
        margin-top: 0px;
        font-weight: 600;
    }

    .word-week-link {
        color: #333;
        transition: all .5s ease-in-out;
    }

        .word-week-link:hover {
            text-decoration: none;
            color: #fccd35;
            transition: all .5s ease-in-out;
        }

    .word-of-week-phonetic {
        margin-top: -25px;
        font-weight: 300;
        font-size: 22px;
    }

    .word-of-week-title {
        padding-left: 15px;
        font-size: 19px;
        font-weight: 700;
        letter-spacing: 3px;
    }

    .word-of-week-definition-title {
        font-size: 12px;
        font-weight: 800;
        color: #cf5050;
        margin-bottom: -10px;
    }

    .word-of-week-translation {
        font-size: 21px;
    }

    .word-of-week-sentence-title {
        font-size: 12px;
        font-weight: 800;
        color: #cf5050;
        margin-bottom: -10px;
    }

    .word-of-week-english {
        font-weight: 300;
        font-style: italic;
        margin-top: -10px;
    }

    .word-of-week-img {
        margin:0 auto;
        max-width: 350px;
        min-width: 350px;
    }

    .playsentence {
        font-size: 20px;
        position: relative;
        top: 3px;
        cursor: pointer;
        padding-right: 2px;
    }

    .cant-play {
        font-size: 16px;
        position: relative;
        top: 0px;
        color: #d0d0d0;
        cursor: not-allowed;
        padding-right: 0px;
        padding-bottom: 3px;
    }


    /**************audio************/

    #audioplayer {
        width: 100%;
        height: 60px;
        margin: 43px auto auto auto;
        border: solid #333 3px;
    }

    #pButton {
        height: 55px;
        width: 45px;
        border: none;
        background-size: 50% 50%;
        background-repeat: no-repeat;
        background-position: center;
        float: left;
        outline: none;
    }

    .play {
        background: url('images/play.png');
    }

    .pause {
        background: url('images/pause.png');
    }

    #timeline {
        width: 85%;
        height: 5px;
        margin-top: 25px;
        float: left;
        border-radius: 0px;
        background: rgb(207, 80, 80);
    }

    #playhead {
        width: 7px;
        height: 20px;
        border-radius: 0;
        margin-top: -8px;
        background: rgba(0, 0, 0,1);
    }

    /********************************************/

    /******* imag ads ****************************/
    .image-ads-block {
        background-color: #fff;
        padding-bottom: 0px;
        padding-right: 0px;
        box-shadow: #c1c1c1 4px 3px 16px;
        width: 47.4%;
        margin-left: 20px;
        margin-top: -25px;
        background-position-x: 65%;
        position: absolute;

    }

    .image-ads-img {
        float: right;
        width: 108.4%;
        margin-right: -15px;
    }

    .class-header {
        font-weight: 800;
        letter-spacing: 4px;
        padding-right: 110px;
    }

    .class-text {
        text-align: left;
        padding-right: 135px;
    }

    .word-of-week-sentence {
        font-size: 20px;
    }

    .class-button {
        border: #444 solid 3px;
        color: #444;
        background-color: transparent;
        padding: 14px 23px;
        font-size: 1em;
        font-weight: 600;
        letter-spacing: 3px;
        border-radius: 0px;
        margin-top: 10px;
        transition: all .5s ease-in-out;
        margin-bottom: 30px;
    }

        .class-button:hover {
            border: #cf5050 solid 3px;
            color: #fff;
            background-color: #cf5050;
            transition: all .5s ease-in-out;
        }

    /*******************************************/


    /*****************welcome block****************/

    .welcome-block {
        padding-bottom: 0px;
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
        box-shadow: #c1c1c1 4px 3px 16px;
        margin-top: 25px;
        margin-bottom: 25px;
        height: 175px;
    }

    .welcome-image {
        padding-left: 0px;
    }


    .backgroundimg {
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
    }

    #back1 {
        background: url("images/language-banner3.jpg") no-repeat center center;
    }

    #back2 {
        background: url("images/language-banner2.jpg") no-repeat center center;
    }

    #back3 {
        background: url("images/language-banner.jpg") no-repeat center center;
    }


    @keyframes backgroundchangeFadeInOut {
        0% {
            opacity: 1;
        }

        30% {
            opacity: 1;
        }

        33% {
            opacity: 0;
        }

        92% {
            opacity: 0;
        }

        100% {
            opacity: 1;
        }
    }

    @-webkit-keyframes backgroundchangeFadeInOut {
        0% {
            opacity: 1;
        }

        30% {
            opacity: 1;
        }

        33% {
            opacity: 0;
        }

        92% {
            opacity: 0;
        }

        100% {
            opacity: 1;
        }
    }

    #backgroundchange div:nth-of-type(1) {
        animation-delay: 30s;
        -webkit-animation-delay: 30s;
    }

    #backgroundchange div:nth-of-type(2) {
        animation-delay: 20s;
        -webkit-animation-delay: 20s;
    }

    #backgroundchange div:nth-of-type(3) {
        animation-delay: 10s;
        -webkit-animation-delay: 10s;
    }

    #backgroundchange div {
        animation-name: backgroundchangeFadeInOut;
        animation-timing-function: ease-in-out;
        animation-iteration-count: infinite;
        animation-duration: 30s;
        -webkit-animation-name: backgroundchangeFadeInOut;
        -webkit-animation-timing-function: ease-in-out;
        -webkit-animation-iteration-count: infinite;
        -webkit-animation-duration: 30s;
    }

    .welcome-image-size {
        margin-left: -15px;
        width: 101.86%;
    }

    .welcome-text {
        width: 68%;
        color: #fff;
    }

    .welcome-title {
        color: #fff;
        font-size: 50px;
        letter-spacing: 3px;
        font-weight: 600;
        top:-88px;
    }

    .welcome-text-all {
        position: absolute;
        top: 22%;
        left: 0%;
        background: -webkit-linear-gradient(bottom, rgba(0,0,0,0.8) 0%,rgba(255,255,255,0) 100%);
        padding: 15px;
        padding-left: 25px;
    }

    hr {
        border-top: 2px solid #d6d6d6;
    }

    .word-count {
        position: absolute;
        top: 10px;
        right: 17px;
    }

    .potawatomi-count {
        color: #fdcd34;
        text-align: center;
        font-size: 14px;
        letter-spacing: 4px;
        text-transform: uppercase;
        margin-top: -5px;
    }

    .potawatomi-number {
        font-size: 50px;
        color: #fff;
        text-align: center;
    }

    /******************************* WORD PAGE ******************************************************/

    .word-page-block {
        background-color: #fff;
        padding-bottom: 20px;
        box-shadow: #c1c1c1 4px 3px 16px;
        margin-top: 20px;
        padding-top: 50px;
        padding-left: 40px;
        -webkit-animation: fadein 1s; /* Safari, Chrome and Opera > 12.1 */
        -moz-animation: fadein 1s; /* Firefox < 16 */
        -ms-animation: fadein 1s; /* Internet Explorer */
        -o-animation: fadein 1s; /* Opera < 12.1 */
        animation: fadein 1s;
    }

    @keyframes fadein {
        from {
            opacity: 0;
        }

        to {
            opacity: 1;
        }
    }

    /* Firefox < 16 */
    @-moz-keyframes fadein {
        from {
            opacity: 0;
        }

        to {
            opacity: 1;
        }
    }

    /* Safari, Chrome and Opera > 12.1 */
    @-webkit-keyframes fadein {
        from {
            opacity: 0;
        }

        to {
            opacity: 1;
        }
    }

    /* Internet Explorer */
    @-ms-keyframes fadein {
        from {
            opacity: 0;
        }

        to {
            opacity: 1;
        }
    }

    /* Opera < 12.1 */
    @-o-keyframes fadein {
        from {
            opacity: 0;
        }

        to {
            opacity: 1;
        }
    }

    .potawatomi-word {
        font-size: 72px;
        font-weight: 600;
    }

    .potawatomi-phonetic {
        font-size: 45px;
        font-weight: 300;
        margin-top: -20px;
        float: left;
    }

    .potawatomi-part-of-speech {
        font-size: 45px;
        font-weight: 300;
        margin-top: -20px;
    }

    .tool-tip-button {
        font-size: 15px;
        background-color: #cf5050;
        color: #fff;
        font-weight: 500;
        padding: 1px 2px 0px 2px;
        border-radius: 20px;
        text-align: center;
        position: relative;
        top: -25px;
        left: 0px;
    }

    .historic-audio-block {
        padding-top: 0px;
    }

    .historic-audio {
        font-size: 14px;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 2px;
        border: 2px #333 solid;
        padding: 10px 20px;
        margin-bottom: 8px;
        transition: all ease-in-out 0.5s;
        cursor: pointer;
    }

        .historic-audio:hover {
            color: #fff;
            background-color: #6D8842;
            transition: all ease-in-out 0.5s;
            border: 2px #6d8842 solid;
        }

    .audio-title {
        font-weight: 700;
        font-size: 16px;
        letter-spacing: 4px;
        color: #ababab;
    }

    .video-title-block {
        width: 100%;
    }

    .video-block {
        padding-top: 25px;
    }

    .video-button {
        font-size: 14px;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 5px;
        border: 2px #333 solid;
        padding: 10px 20px;
        margin-bottom: 8px;
        border-radius: 0px;
        width: 100%;
        transition: all ease-in-out 0.5s;
    }

        .video-button:hover {
            color: #fff;
            background-color: #333;
            transition: all ease-in-out 0.5s;
        }

    .video-title {
        font-weight: 700;
        font-size: 16px;
        letter-spacing: 4px;
        color: #ababab;
    }

    .english-e {
        font-size: 13px;
        font-weight: 600;
        color: #cf5050;
        padding-left: 28px;
    }

    .english-example {
        font-weight: 400;
        font-size: 16px;
        font-style: italic;
    }

    .english-block {
        padding-left: 28px;
    }

    .tag-title {
        font-weight: 700;
        font-size: 16px;
        letter-spacing: 4px;
        color: #ababab;
    }

    .tag-title-block {
        margin-top: 20px;
        margin-bottom: 15px;
    }

    .tags button {
        text-transform: uppercase;
        font-weight: 700;
        color: #fff;
        padding: 10px;
        background-color: #3b498a;
        margin-left: 2px;
        margin-right: 2px;
        word-wrap: break-word;
        border-radius: 0px;
        margin-bottom: 5px;
        border: #3b498a 3px solid;
        transition: all .3s ease-in-out;
    }

        .tags button:hover {
            color: #3b498a;
            transition: all .3s ease-in-out;
            background-color: #fff;
        }

    .related-words-block {
        margin-top: 65px;
        border: 3px #333 solid;
        padding: 15px 25px 25px 25px;
        margin-left: -80px;
    }

    .related-words-title {
        background-color: #fff;
        padding: 10px;
        position: relative;
        top: -35px;
        font-size: 25px;
    }

    .related {
        font-size: 30px;
        margin: 5px;
        border-radius: 0px;
        background-color: #f5f5f5;
        border: #f5f5f5 solid 3px;
        transition: all .3s ease-in-out;
    }


        .related:hover {
            border: #cf5050 solid 3px;
            transition: all .3s ease-in-out;
            background-color: #fff;
        }

    .related-words {
        margin-top: -25px;
    }

    .play-button {
        font-size: 15px;
        padding-right: 5px;
    }

    .plural {
        font-size: 30px;
        font-weight: 500;
        color: #333;
        margin-left: 5px;
    }

    .plural-title {
        font-weight: 700;
        font-size: 13px;
        letter-spacing: 3px;
        color: #ababab;
        margin-top: 60px;
        margin-bottom: -5px;
    }

    .alternate-title {
        font-weight: 700;
        font-size: 13px;
        letter-spacing: 3px;
        color: #ababab;
        margin-top: 60px;
        margin-bottom: -5px;
    }

    .pluralized {
        padding-left: 17px;
    }

    .word-audio {
        font-size: 35px;
        position: relative;
        top: -5px;
        left: 10px;
    }

    .word-image {
        box-shadow: #5f5f5f 4px 3px 16px;
    }

    .image {
        width: 100%;
    }

    .video-box {
        width: 1100px;
        height: 625px;
    }

    .modal-dialog {
        width: 61%;
    }

    .content-block {
        padding-left: 70px;
        padding-top: 20px;
    }

    .dictionary-block {
        padding-left: 0px;
        padding-top: 20px;
    }

    .breadcrumbs {
        position: relative;
        top: -30px;
        left: -10px;
    }

    .sourdough {
        font-size: 12px;
        letter-spacing: 4px;
        font-weight: 600;
    }

        .sourdough a {
            color: #333;
            transition: all .3s ease-in-out;
        }

            .sourdough a:hover {
                color: #cf5050;
                transition: all .3s ease-in-out;
                text-decoration: none;
            }

    .bread-select {
        color: #cf5050;
        text-transform: uppercase;
    }

    .image-block {
        padding-right: 60px;
        margin-top: 30px;
    }

    .modal-content {
        padding: 15px;
        border-radius: 0px;
    }

    .modal-header {
        border-bottom: 1px solid #efefef;
    }

    .modal-title {
        font-weight: 700;
        letter-spacing: 4px;
    }

    .example-sentence {
        margin-top: 50px;
    }

    .example-title {
        font-weight: 700;
        font-size: 13px;
        letter-spacing: 3px;
        color: #ababab;
    }

    .example {
        text-indent: 2px;
        font-size: 16px;
    }

    .translation {
        text-indent: 70px;
        font-size: 30px;
        font-weight: 500;
    }

    .cultural-teaching {
        float: right;
        position: relative;
        top: -65px;
        right: 20px;
    }

    .culture-link {
        color: #fff;
        background-color: #cf5050;
        transition: ease-in-out .5s all;
        border-radius: 0px;
        font-size: 26px;
        border: none;
        font-weight: 600;
        padding: 2px 10px;
    }

        .culture-link:hover {
            color: #cf5050;
            background-color: #fff;
            box-shadow: #9e9e9e 2px 2px 5px 1px;
            transition: ease-in-out .5s all;
        }

        .culture-link:active {
            color: #cf5050;
            background-color: #fff;
            box-shadow: #9e9e9e 2px 2px 5px 1px;
            transition: ease-in-out .5s all;
        }

    .flash {
        -webkit-animation: flash linear 1.7s infinite;
        animation: flash linear 1.7s infinite;
        padding-left: 3px;
    }

    @-webkit-keyframes flash {
        0% {
            opacity: 1;
        }

        50% {
            opacity: .1;
        }

        100% {
            opacity: 1;
        }
    }

    @keyframes flash {
        0% {
            opacity: 1;
        }

        50% {
            opacity: .1;
        }

        100% {
            opacity: 1;
        }
    }

    .winter-story {
        color: #7c8dde;
        font-weight: 600;
        letter-spacing: 3px;
        border-bottom: 1px solid #d2d2d2;
        padding-bottom: 4px;
        font-size: 25px;
    }

    .modal-close {
        float: right;
        font-size: 21px;
        font-weight: bold;
        line-height: 1;
        color: #000;
        text-shadow: 0 1px 0 #fff;
        filter: alpha(opacity=20);
        opacity: .2;
    }

        .modal-close:hover {
            color: #000;
            text-decoration: none;
            cursor: pointer;
            filter: alpha(opacity=50);
            opacity: .5;
        }

    button.modal-close {
        -webkit-appearance: none;
        padding: 0;
        cursor: pointer;
        background: transparent;
        border: 0;
    }

    .translation-block {
        margin-top: 15px;
    }

    /*********************************************/

    /*********************DICTIONARY PAGE***************/

    .potawatomi-word-list {
        font-size: 23px;
        cursor: pointer;
        transition: ease-in-out .5s all;
        font-weight: 600;
    }

    .english-word-list {
        font-size: 15px;
        cursor: pointer;
        transition: ease-in-out .5s all;
        font-weight: 500;
    }

    .potawatomi-word-list:hover {
        color: #cf5050;
        transition: ease-in-out .5s all;
    }

    .english-word-list:hover {
        transition: ease-in-out .5s all;
        color: #cf5050;
    }


    ul li#list {
        border-bottom: 1px solid #ececec;
        line-height: 25px;
    }

    span.defined {
        float: right;
    }

    .unstyled {
        padding: 0px;
        list-style-type: none;
    }

    .letter-pagination {
        display: inline-block;
        padding-left: 0;
        margin: 20px 0;
        font-weight: 600;
        padding: 0px 0px;
        font-size: 30px;
        letter-spacing: 23px;
    }

        .letter-pagination > li {
            display: inline;
        }

            .letter-pagination > li > a,
            .letter-pagination > li > span {
                position: relative;
                float: left;
                padding: 6px 12px;
                text-align: center;
                line-height: 1.43;
                color: #333;
                text-decoration: none;
                border: none;
                transition: ease-in-out .5s all;
            }

            .letter-pagination > li:first-child > a,
            .letter-pagination > li:first-child > span {
                margin-left: 0;
                border-top-left-radius: 0px;
                border-bottom-left-radius: 0px;
                border: none;
            }

            .letter-pagination > li:last-child > a,
            .letter-pagination > li:last-child > span {
                border-top-right-radius: 0px;
                border-bottom-right-radius: 0px;
                border: none;
            }

            .letter-pagination > li > a:hover,
            .letter-pagination > li > span:hover,
            .letter-pagination > li > a:focus,
            .letter-pagination > li > span:focus {
                z-index: 2;
                color: #cf5050;
                background-color: transparent;
                border: none;
                transition: ease-in-out .5s all;
            }

        .letter-pagination > .active > a,
        .letter-pagination > .active > span,
        .letter-pagination > .active > a:hover,
        .letter-pagination > .active > span:hover,
        .letter-pagination > .active > a:focus,
        .letter-pagination > .active > span:focus {
            z-index: 3;
            color: #cf5050;
            cursor: default;
            background-color: transparent;
            border: none;
            transition: ease-in-out .5s all;
        }

        .letter-pagination > .disabled > span,
        .letter-pagination > .disabled > span:hover,
        .letter-pagination > .disabled > span:focus,
        .letter-pagination > .disabled > a,
        .letter-pagination > .disabled > a:hover,
        .letter-pagination > .disabled > a:focus {
            color: #777;
            cursor: not-allowed;
            background-color: #fff;
            border-color: #ddd;
        }

    .letter-pagination-lg > li > a,
    .letter-pagination-lg > li > span {
        padding: 10px 16px;
        font-size: 18px;
        line-height: 1.3333333;
    }

    .letter-pagination-lg > li:first-child > a,
    .letter-pagination-lg > li:first-child > span {
        border-top-left-radius: 0px;
        border-bottom-left-radius: 0px;
        border: none;
    }

    .letter-pagination-lg > li:last-child > a,
    .letter-pagination-lg > li:last-child > span {
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
    }

    .letter-pagination-sm > li > a,
    .letter-pagination-sm > li > span {
        padding: 5px 10px;
        font-size: 12px;
        line-height: 1.5;
    }

    .letter-pagination-sm > li:first-child > a,
    .letter-pagination-sm > li:first-child > span {
        border-top-left-radius: 0px;
        border-bottom-left-radius: 0px;
    }

    .letter-pagination-sm > li:last-child > a,
    .letter-pagination-sm > li:last-child > span {
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
    }



    .pagination {
        display: inline-block;
        padding-left: 0;
        margin: 20px 0;
        font-weight: 600;
        padding: 0px 0px;
        font-size: 30px;
        letter-spacing: 0px;
    }

        .pagination > li {
            display: inline;
        }

            .pagination > li > a,
            .pagination > li > span {
                position: relative;
                float: left;
                padding: 6px 12px;
                text-align: center;
                line-height: 1.43;
                color: #333;
                text-decoration: none;
                border: none;
                transition: ease-in-out .5s all;
            }

            .pagination > li:first-child > a,
            .pagination > li:first-child > span {
                margin-left: 0;
                border-top-left-radius: 0px;
                border-bottom-left-radius: 0px;
                border: none;
            }

            .pagination > li:last-child > a,
            .pagination > li:last-child > span {
                border-top-right-radius: 0px;
                border-bottom-right-radius: 0px;
                border: none;
            }

            .pagination > li > a:hover,
            .pagination > li > span:hover,
            .pagination > li > a:focus,
            .pagination > li > span:focus {
                z-index: 2;
                color: #cf5050;
                background-color: transparent;
                border: none;
                transition: ease-in-out .5s all;
            }

        .pagination > .active > a,
        .pagination > .active > span,
        .pagination > .active > a:hover,
        .pagination > .active > span:hover,
        .pagination > .active > a:focus,
        .pagination > .active > span:focus {
            z-index: 3;
            color: #cf5050;
            cursor: default;
            background-color: transparent;
            border: none;
            transition: ease-in-out .5s all;
        }

        .pagination > .disabled > span,
        .pagination > .disabled > span:hover,
        .pagination > .disabled > span:focus,
        .pagination > .disabled > a,
        .pagination > .disabled > a:hover,
        .pagination > .disabled > a:focus {
            color: #777;
            cursor: not-allowed;
            background-color: #fff;
            border-color: #ddd;
        }

    .pagination-lg > li > a,
    .pagination-lg > li > span {
        padding: 10px 16px;
        font-size: 18px;
        line-height: 1.3333333;
    }

    .pagination-lg > li:first-child > a,
    .pagination-lg > li:first-child > span {
        border-top-left-radius: 0px;
        border-bottom-left-radius: 0px;
        border: none;
    }

    .pagination-lg > li:last-child > a,
    .pagination-lg > li:last-child > span {
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
    }

    .pagination-sm > li > a,
    .pagination-sm > li > span {
        padding: 5px 10px;
        font-size: 12px;
        line-height: 1.5;
    }

    .pagination-sm > li:first-child > a,
    .pagination-sm > li:first-child > span {
        border-top-left-radius: 0px;
        border-bottom-left-radius: 0px;
    }

    .pagination-sm > li:last-child > a,
    .pagination-sm > li:last-child > span {
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
    }


    #dictionary-search input[type="search"] {
        width: 100%;
        color: #333;
        background: rgba(0, 0, 0, 0);
        font-size: 60px;
        font-weight: 600;
        text-align: left;
        border: 0px;
        margin: 0px auto;
        margin-top: -20px;
        margin-bottom: 20px;
        padding-left: 85px;
        padding-right: 15px;
        outline: none;
        border-bottom: 2px #333 solid;
        max-width: 1540px;
    }

    .inner-addon {
        position: relative;
    }

        .inner-addon .fal {
            position: absolute;
            padding: 10px;
            pointer-events: none;
            font-size: 60px
        }

    .left-addon .fal {
        left: 0px;
        top: -17px;
    }

    ::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
        color: #dedede;
        opacity: 1; /* Firefox */
    }

    :-ms-input-placeholder { /* Internet Explorer 10-11 */
        color: #dedede;
    }

    ::-ms-input-placeholder { /* Microsoft Edge */
        color: #dedede;
    }

    .tags-block {
        padding-left: 0px;
    }

    .tag-item-block {
        padding: 20px 20px;
        background-color: #f7f7f7;
        vertical-align: middle;
        white-space: nowrap;
        text-transform: lowercase;
        text-align: center;
        overflow: hidden;
        border: #fff 5px solid;
        transition: ease-in-out .5s all;
        cursor: pointer;
    }

        .tag-item-block:hover {
            background-color: #cf5050;
            color: #fff;
            transition: ease-in-out .5s all;
        }

    .tag-item {
        font-size: 38px;
        font-weight: 500;
    }

    .add-padding-left {
        position: relative;
        left: 10px;
    }
}

/*************/

/* Small screens - MOBILE */
@media screen and (max-width:600px) {
    .soft-launch {
        margin: 15px 0 15px 0;
    }

    .soft-disclaimer{
        font-size:14px;
    }

    .welcome-title {
        font-size: 40px;
        text-align: center;
    }

    .potawatomi-number {
        font-size: 60px;
        text-align: center;
        width: 100%;
    }

    .potawatomi-count{
        font-size:20px;
        width:100%;
        margin-top:15px;
    }

    #timeline{
        width:80%;
    }

    .word-of-week-title{
        text-align:left;
    }

    .word-of-week-img{
        width:100%;
    }

    .word-of-week-translation {
        font-size: 20px;
    }

    .word-of-week-sentence{
        font-size:20px;
    }

    .word-of-week-english {
        font-size: 16px;
    }

    .word-count{
        right: 0;
        left:0;
        padding: 0 15px;
    }

    .class-header {
        padding-right: 0;
    }

    .class-text {
        padding-right: 0;
        text-shadow: 2px 1px 2px white;
    }

    .class-button{
        width:100%;
    }


    .sub_icon{
        font-size:36px;
        padding:10px;
    }

    #sidebar-wrapper{
        height:56px;
    }

    .add-bottom-mobile{
        padding:0;
    }

    #dictionary-search input[type="search"]{
        font-size:40px;
    }

    .inner-addon .fal{
        font-size:40px;
    }

    #dictionary-search-potawatomi {
        width: 100%;
        border: 2px #CF5050 solid;
        font-size: 20px;
        font-weight: 300;
        letter-spacing: 3px;
        float: left;
    }

    #dictionary-search-english {
        margin-top:5px;
        width: 100%;
        border: 2px #CF5050 solid;
        font-size: 20px;
        font-weight: 300;
        letter-spacing: 3px;
        float: left;
    }

    .search-active {
        background-color: #FFFB98;
    }
    .word-page-block{
        padding-left:15px;
        padding-right:15px;
        margin-bottom:30px;
    }

    .breadcrumbs {
        left: 0;
        right: 20%;
        width: 80%;
    }

    .letter-nav{
        padding-left:0;
        padding-right:0;
    }

    .letter-pagination{
        font-size:24px;
        letter-spacing:5px;
        height:45px;
    }

    .potawatomi-word-list{
        font-size:1.8em;
    }

    .english-word-list{
        font-size:12px;
    }

    .pagination{
        font-size:16px;
    }

    .tag-item{
        font-size:24px;
    }

    #form_button{
        width:100%;
        font-size:1.3em;
    }

    .contact-text-title{
        font-size:32px;
    }

    .contact-text-content{
        font-size:14px;
    }

    #search input[type="search"] {
        top: 20%;
        font-size: 30px;
    }
    .btn-selected {
        border-color: #fff !important;
        color: #CF5050 !important;
    }
    .search-potawatomi{
        top:15%;
        margin-left:0;
        left:10%;
        right:10%;
        font-size:20px;
        width:80%;
        padding:10px;
    }

    .search-english {
        top: 25%;
    }

    .potawatomi-word{
        font-size:3em;
    }

    .potawatomi-part-of-speech {
        font-size: 22px;
        width: 100%;
        float: none;
        margin-top: -3px;
    }

    .related-words-block{
        margin-top: 36px;
        margin-left:0;
    }

    .related-words-title {
        top: -30px;
        font-size: 20px;
    }

    .related{
        font-size:16px;
        width:100%;
    }

    .image-block{
        padding-right:15px;
        padding-left:0;
    }

    .tags button{
        width:100%;
    }

    .cultural-text{
        font-size:20px;
    }

    .potawatomi-phonetic {
        font-size: 22px;
        width: 100%;
        float: none;
    }

    .example{
        font-size:16px;
    }
}



@media only screen and (max-width: 1999px) {
    .image-ads-block {
        margin-left: 0;
        margin-top: 15px;
        top:0;
    }

    .image-ads-img {
        width:100%;
        margin-right:0;
        margin-bottom:15px;
    }

    .lg-padding-right {
        padding-right: 0;
    }
}


@media only screen and (min-width: 1280px) {
    .lg-padding-right {
        padding-right: 15px;
    }

    #wrapper {
        padding-left: 0px;
        transition: all .4s ease 0s;
        height: 100%
    }

    #wrapper2 {
        padding-left: 65px;
        transition: all .4s ease 0s;
        height: 100%
    }

    #sidebar-wrapper {
        margin-left: -150px;
        left: 0px;
        width: 230px;
        background: #222;
        position: fixed;
        height: 100%;
        z-index: 10000;
        transition: all .4s ease 0s;
    }

    .sidebar-nav {
        display: block;
        float: left;
        width: 230px;
        list-style: none;
        margin: 0;
        padding: 0;
    }

    #page-content-wrapper {
        padding-left: 0;
        margin-left: 0;
        width: 100%;
        height: auto;
    }

    #wrapper.active {
        padding-left: 155px;
    }

        #wrapper.active #sidebar-wrapper {
            left: 150px;
        }

    #page-content-wrapper {
        width: 100%;
    }

    #sidebar_menu li a, .sidebar-nav li a {
        color: #e2e2e2;
        display: block;
        float: left;
        text-decoration: none;
        width: 230px;
        background: #252525;
        border-top: 1px solid #373737;
        border-bottom: 1px solid #1A1A1A;
        -webkit-transition: background .5s;
        -moz-transition: background .5s;
        -o-transition: background .5s;
        -ms-transition: background .5s;
        transition: background .5s;
    }

    .sidebar_name {
        padding-top: 25px;
        color: #fff;
        opacity: .7;
    }

    .sidebar-nav li {
        line-height: 53px;
        text-indent: 20px;
    }

        .sidebar-nav li a {
            color: #e2e2e2;
            display: block;
            text-decoration: none;
        }

            .sidebar-nav li a:hover {
                color: #fff;
                background: rgba(255,255,255,0.2);
                text-decoration: none;
            }

            .sidebar-nav li a:active,
            .sidebar-nav li a:focus {
                text-decoration: none;
            }

    .sidebar-nav > .sidebar-brand {
        height: 65px;
        line-height: 60px;
        font-size: 18px;
    }

        .sidebar-nav > .sidebar-brand a {
            color: #999999;
        }

            .sidebar-nav > .sidebar-brand a:hover {
                color: #fff;
                background: none;
            }

    #main_icon {
        float: right;
        padding-right: 25px;
        padding-top: 20px;
        font-size: 30px;
        color: #cf5050;
    }

    .sub_icon {
        float: right;
        font-size: 30px;
        padding-right: 20px;
        padding-top: 10px;
    }

    .nav-text {
        font-size: 12px;
        letter-spacing: 5px;
        font-weight: 500;
    }

    .content-header {
        height: 65px;
        line-height: 65px;
    }

        .content-header h1 {
            margin: 0;
            margin-left: 20px;
            line-height: 65px;
            display: inline-block;
        }

    @media (max-width:767px) {
        #wrapper {
            padding-left: 70px;
            transition: all .4s ease 0s;
        }

        #sidebar-wrapper {
            left: 70px;
        }

        #wrapper.active {
            padding-left: 150px;
        }

            #wrapper.active #sidebar-wrapper {
                left: 150px;
                width: 150px;
                transition: all .4s ease 0s;
            }
    }

    .welcome-block {
        height: 295px;
    }

    .word-count {
        top: unset;
        bottom: 10px;
    }

    .word-of-week-block {
        width: 100%;
    }

    .word-of-week-img {
        max-width: 100%;
        min-width: 100%;
    }

    .image-ads-block {
        width: 100%;
    }

    .class-header {
        padding-right: 0px;
    }

    .class-text {
        padding-right: 70px;
    }

    .image-ads-img {
        width: 110%;
        margin-right: -15px;
        margin-bottom: 0px;
    }

    .home-icon {
        width: 69em;
    }

    }
