.AnyTime-pkr * {
    border: 0;
    font: inherit;
    font-size: 12px;
    font-style: normal;
    font-weight: normal;
    list-style-type: none;
    margin: 0;
    padding: 0;
    white-space: nowrap;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

/*  .AnyTime-win simulates a "window" that might be a popup or inline.
 */

.AnyTime-win {
    background-color: #f5f5f5;
    border: 1px solid #b0b0b0;
    display: inline-block;
    z-index: 10000;
}

.AnyTime-pkr,
.AnyTime-pkr * {
    text-align: center;
}

    /*  .AnyTime-cloak covers an AnyTime-pkr whenever an AnyTime-yr-selector
 *  is placed over it.  The picker cannot be accessed until the
 *  AnyTime-yr-selector has been dismissed (possibly by clicking the
 *  AnyTime-cloak).
 */

    .AnyTime-pkr .AnyTime-cloak {
        background-color: #D7D7D7;
        opacity: 0.7;
        position: fixed;
        filter: alpha(opacity=70);
    }

    /*  .AnyTime-hdr is the title bar at the top of a "window." In addition to
 *  the title label, the title bar for popup (non-inline) pickers also
 *  contains .AnyTime-x-btn.
 */

    .AnyTime-pkr .AnyTime-hdr {
        display: none;
        background-color: #D0D0D1;
        color: #606062;
        font-weight: 700;
        font-size: 0.9em;
        padding: 5px;
    }

    /*  .AnyTime-x-btn is a pseudo-button that, when clicked, causes the entire
 *  picker to disappear (the picker also disappears if the user clicks
 *  almost anywhere off of it, or presses ESC).
 */

    .AnyTime-pkr .AnyTime-x-btn {
        color: #bb3825;
        float: right;
        font-size: 0.9em;
        font-weight: 900;
        cursor: pointer;
    }

    /*  .AnyTime-btn is a pseudo-button for selection of a format field value.
 */

    .AnyTime-pkr .AnyTime-btn {
        background-color: white;
        border: 1px solid #999;
        color: #222222;
        cursor: pointer;
        font-weight: 700;
        margin: 0 0.1em 0.1em 0;
        padding: 0.2em 0.3em 0.2em 0.3em;
    }

    /*  .AnyTime-body contains everything in thee picker except the title bar.
 */

    .AnyTime-pkr .AnyTime-body {
        margin: 0 1em 1em 0;
    }

    /*  .AnyTime-date contains all content (labels and pseudo-buttons) for selecting
 *  a date (or part thereof).
 */

    .AnyTime-pkr .AnyTime-date {
        display: inline-block;
        margin-left: 1em;
        vertical-align: top;
    }

    /*  .AnyTime-lbl headings appear before each group of pseudo-buttons for a
 *  particular format field.  Each specific label has a class, also.
 */

    .AnyTime-pkr .AnyTime-lbl {
        color: #606063;
        font-size: 100%;
        font-weight: 700;
        margin-top: 0.8em;
        visibility: hidden;
    }

    /*
 *  .AnyTime-yrs contains the year-selection pseudo-buttons.
 */

    .AnyTime-pkr .AnyTime-yrs {
        width: 20em;
    }

    /*
 *  Following are classes for the pseudo-buttons within .AnyTime-yrs
 */

    .AnyTime-pkr .AnyTime-yrs-past-btn,
    .AnyTime-pkr .AnyTime-yrs-ahead-btn {
        display: inline-block;
        width: 2.4em;
    }

    .AnyTime-pkr .AnyTime-yr-prior-btn,
    .AnyTime-pkr .AnyTime-yr-cur-btn,
    .AnyTime-pkr .AnyTime-yr-next-btn {
        display: inline-block;
        width: 4.8em;
    }

    /*  .AnyTime-mons contains the month-selection pseudo-buttons.
 */

    .AnyTime-pkr .AnyTime-mons {
        width: 20em;
    }

        .AnyTime-pkr .AnyTime-mons:after {
            content: "";
            display: table;
            clear: both;
        }


    /*  .AnyTime-mon-btn is for the pseudo-buttons within .AnyTime-mons
 *  Each pseudo-button also has a class of its own.
 */

    .AnyTime-pkr .AnyTime-mon-btn {
        float: left;
        width: 3.2em;
    }

    .AnyTime-pkr .AnyTime-mon7-btn {
        clear: left;
    }


    /*  .AnyTime-dom-table is the table containing days-of-the-month.
 *  .AnyTime-dom-head is the table heading, containing days-of-the-week labels.
 *  tr.AnyTime-dow is the row in the heading.
 *  td.AnyTime-dow is a column heading; each heading has its own class, also.
 *  .AnyTime-dom-body is the table heading, containing days-of-the-week labels.
 *  .AnyTime-wk is a table row, containing pseudo-buttons for days.
 *  Each week has its own class (.AnyTime-wk***), also.
 */

    .AnyTime-pkr .AnyTime-dom-table {
        background-color: #F0F0F1;
        border: 1px solid #E3E3E4;
        border-spacing: 1px;
        width: 20em;
    }

    .AnyTime-pkr th.AnyTime-dow {
        font-weight: 700;
        padding: 0.1em 0.3em;
    }

    /*  .AnyTime-dom-btn is a pseudo-button for a day-of-the-month.
 *  .AnyTime-dom-btn-filled is a button containing a specific day-of-the-month.
 *  .AnyTime-dom-btn-empty is a button for an empty cell (no day-of-the-month).
 *  .AnyTime-dom-btn-empty-above-filled is an empty button above a filled button.
 *  .AnyTime-dom-btn-empty-before-filled is empty, left of a filled button.
 *  .AnyTime-dom-btn-empty-after-filled is empty, right of a filled button.
 *  .AnyTime-dom-btn-empty-below-filled is empty, below a filled button.
 */

    .AnyTime-pkr .AnyTime-dom-btn {
        text-align: right;
        padding-right: 0.5em;
    }

    .AnyTime-pkr .AnyTime-dom-btn-empty,
    .AnyTime-pkr .AnyTime-min-ten-btn-empty,
    .AnyTime-pkr .AnyTime-min-one-btn-empty,
    .AnyTime-pkr .AnyTime-sec-ten-btn-empty,
    .AnyTime-pkr .AnyTime-sec-one-btn-empty {
        background-color: #F3F3F4;
        border: 1px solid #C0C0c1;
    }

    /*  .AnyTime-time contains all content (labels and pseudo-buttons) for selecting
 *  a time (or part thereof).
 */

    .AnyTime-pkr .AnyTime-time,
    .AnyTime-pkr .AnyTime-hrs-am,
    .AnyTime-pkr .AnyTime-hrs-pm,
    .AnyTime-pkr .AnyTime-mins-tens,
    .AnyTime-pkr .AnyTime-mins-ones,
    .AnyTime-pkr .AnyTime-secs-tens,
    .AnyTime-pkr .AnyTime-secs-ones {
        display: inline-block;
    }

    /*  .AnyTime-hrs contains two columns (.AnyTime-hrs-am and .AnyTime-hrs-pm) of
 *  pseudo-buttons for selecting hours.
 */

    .AnyTime-pkr .AnyTime-hrs,
    .AnyTime-pkr .AnyTime-mins,
    .AnyTime-pkr .AnyTime-secs,
    .AnyTime-pkr .AnyTime-offs {
        display: inline-block;
        margin-left: 1em;
    }

    /*  .AnyTime-hr-btn is a pseudo-button for selecting an hour.
 *  Each button also has a style of its own.
 */

    .AnyTime-pkr .AnyTime-hr-btn {
        text-align: right;
        width: 3.5em;
    }

    /*  .AnyTime-mins contains two columns (.AnyTime-mins-tens and .AnyTime-mins-ones)
 *  of pseudo-buttons for selecting minutes.
 *
 *  .AnyTime-min-ten-btn is a button in the .AnyTime-mins-tens column.
 *  .AnyTime-min-one-btn is a button in the .AnyTime-ones-tens column.
 *  Each button also has its own style.
 */

    .AnyTime-pkr .AnyTime-min-ten-btn,
    .AnyTime-pkr .AnyTime-min-one-btn {
        width: 2em;
    }

    /*  .AnyTime-secs contains two columns (.AnyTime-secs-tens and .AnyTime-secs-ones)
 *  of pseudo-buttons for selecting seconds.
 *
 *  .AnyTime-sec-ten-btn is a button in the .AnyTime-secs-tens column.
 *  .AnyTime-sec-one-btn is a button in the .AnyTime-ones-tens column.
 *  Each button also has its own style.
 */

    .AnyTime-pkr .AnyTime-sec-ten-btn,
    .AnyTime-pkr .AnyTime-sec-one-btn {
        width: 2em;
    }

    /*  .AnyTime-offs contains the UTC offset (timezone) selection pseudo-buttons.
 *  The two buttons have their own styles
 */

    .AnyTime-pkr .AnyTime-off-cur-btn {
        display: inline-block;
        overflow: hidden;
    }

    .AnyTime-pkr .AnyTime-off-select-btn {
        display: inline-block;
        vertical-align: top;
        width: 2em;
    }

    /*  .AnyTime-yr-selector is an overlay (popup) for selecting a specific year.
 *  The picker attempts to size the overlay automatically, based on
 *  whether "era" buttons are displayed.
 *
 *  AnyTime-hdr-yr-selector is its title bar.
 *  AnyTime-body-yr-selector is its body.
 *
 *  .AnyTime-yr-mil is the column of millenium-selector pseudo-buttons.
 *  .AnyTime-yr-cent is the column of century-selector pseudo-buttons.
 *  .AnyTime-yr-dec is the column of decade-selector pseudo-buttons.
 *  .AnyTime-yr-yr is the column of year-selector pseudo-buttons.
 *
 *  .AnyTime-mil-btn is a millenium-selector button.
 *  .AnyTime-cent-btn is a century-selector button.
 *  .AnyTime-dec-btn is a decade-selector button.
 *  .AnyTime-yr-btn is a year-selector button.
 *  Each button has its own class, also.
 *
 *  .AnyTime-yr-era contains the column of era-selection pseudo-buttons.
 *  Each era button has class .AnyTime-era-btn as well as its own class.
 */

    .AnyTime-pkr .AnyTime-yr-selector {
        position: fixed;
    }

    .AnyTime-pkr .AnyTime-body-yr-selector {
        margin: 0.8em 1em;
    }

    .AnyTime-pkr .AnyTime-yr-mil,
    .AnyTime-pkr .AnyTime-yr-cent,
    .AnyTime-pkr .AnyTime-yr-dec,
    .AnyTime-pkr .AnyTime-yr-yr,
    .AnyTime-pkr .AnyTime-yr-era {
        display: inline-block;
        vertical-align: top;
    }

    .AnyTime-pkr .AnyTime-mil-btn,
    .AnyTime-pkr .AnyTime-cent-btn,
    .AnyTime-pkr .AnyTime-dec-btn,
    .AnyTime-pkr .AnyTime-yr-btn {
        width: 2em;
    }

    .AnyTime-pkr .AnyTime-era-btn {
        margin-left: 1em;
    }


    /*  .AnyTime-off-selector is an overlay (popup) for selecting a specific year.
 *  The picker attempts to size the overlay automatically.
 *  .AnyTime-hdr-off-selector is its title bar.
 *  .AnyTime-body-off-selector is its body.
 *  .AnyTime-off-off is the column of offset-selector pseudo-buttons.
 *  .AnyTime-off-off-btn is an offset-selector pseudo-button.
 *  .AnyTime-off-off-last-btn is the last offset-selector pseudo-button.
 */

    .AnyTime-pkr .AnyTime-off-selector {
        margin: 1em 2em;
        position: absolute;
    }

    .AnyTime-pkr .AnyTime-body-off-selector {
        margin: 0.8em 1em;
        overflow-x: hidden;
        overflow-y: auto;
        white-space: nowrap
    }

    .AnyTime-pkr .AnyTime-off-off-btn {
        text-align: left;
    }

    /*  .AnyTime-cur-btn is applied to every pseudo-button that represents
 *  a currently-selected value.  They should stand out from the other
 *  buttons, using a different background-color, border, color, font,
 *  font-style and/or font-weight.  Note that color alone is not
 *  sufficient for color-blind users to differentiate the buttons.
 */

    .AnyTime-pkr .AnyTime-cur-btn {
        border: 1px solid #333334;
        background-color: #282828;
        color: white;
        font-weight: 700;
    }

    /*  .AnyTime-out-btn is applied to every pseudo-button that represents
 *  a value that should not be selected because it would make the value.
 *  out-of-range.  Typically, this is to give it a "grayed-out" appearance.
 *  Note that color alone is not sufficient for color-blind users to
 *  differentiate the buttons, but since there's no harm in pressing these
 *  buttons, it's probably no big deal.
 */

    .AnyTime-pkr .AnyTime-out-btn {
        background-color: #F0F0F1;
        border: 1px solid #C0C0c1;
    }

    /*  .AnyTime-focus-btn is applied to the single pseudo-button that appears to
 *  have keyboard focus.  It should stand out from all other buttons,
 *  using a different background-color, border, color, font, font-style
 *  and/or font-weight.  Note that color alone is not sufficient for
 *  color-blind users to differentiate the button.  Because most UIs
 *  represent focus using a dashed or dotted border, this is recommended.
 */

    .AnyTime-pkr .AnyTime-focus-btn {
        border: 1px dashed black;
    }

.dot {
    height: 10px;
    width: 10px;
    border-radius: 50%;
    display: inline-block;
    margin-left: 10px;
}

/*NAV*/
.nav {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 1;
    white-space: nowrap;
}

    .nav ul, .nav ul li {
        margin: 0;
        padding: 0;
        list-style-type: none;
    }

    .nav ul {
        margin: 28px 80px 28px 20px;
    }

        .nav ul li {
            float: left;
            position: relative;
        }

            .nav ul li div {
                display: block;
                color: #666 !important;
                padding: 3px 15px;
                font-size: 18px;
                font-family: "Lato";
                text-transform: uppercase;
                border-left: 1px solid #666;
            }

                .nav ul li div.active {
                    color: #DD721B;
                    font-family: "OpenSans-Bold";
                }

                .nav ul li div:hover {
                    color: #DD721B;
                    text-decoration: none;
                }

                .nav ul li div .profileBigIcon {
                    position: absolute;
                    top: -8px;
                    left: 100%;
                    width: 50px;
                }

            .nav ul li:first-child div {
                border-left: none;
            }

/*InfoBox*/
.infobox {
    position: fixed;
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 0vh;
    background-color: transparent;
    overflow: hidden;
    transition: background-color 0.25s ease;
    z-index: 9999;
}

    .infobox.open {
        position: fixed;
        width: 100%;
        height: 100vh;
        background-color: rgba(0, 0, 0, 0.5);
        transition: background-color 0.25s;
    }

        .infobox.open > .content-wrapper {
            transform: scale(1);
        }

    .infobox .content-wrapper {
        position: relative;
        /*display: flex;
        flex-direction: column;
        align-items: center;*/
        justify-content: flex-start;
        /*width: 50%;*/
        margin: 0;
        padding: 1.8rem;
        background-color: white;
        border-radius: 0.3125rem;
        box-shadow: 0 0 2.5rem rgba(0, 0, 0, 0.5);
        transform: scale(0);
        transition: transform 0.25s;
        transition-delay: 0.15s;
    }

        .infobox .content-wrapper .close {
            position: absolute;
            top: 0.5rem;
            right: 0.5rem;
            display: flex;
            align-items: center;
            justify-content: center;
            width: 2.5rem;
            height: 2.5rem;
            border: none;
            background-color: transparent;
            font-size: 1.5rem;
            transition: 0.25s linear;
            cursor: pointer;
        }

            .infobox .content-wrapper .close:before, .infobox .content-wrapper .close:after {
                position: absolute;
                content: '';
                width: 1.25rem;
                height: 0.125rem;
                background-color: black;
            }

            .infobox .content-wrapper .close:before {
                transform: rotate(-45deg);
            }

            .infobox .content-wrapper .close:after {
                transform: rotate(45deg);
            }

            .infobox .content-wrapper .close:hover {
                transform: rotate(360deg);
            }

                .infobox .content-wrapper .close:hover:before, .infobox .content-wrapper .close:hover:after {
                    background-color: tomato;
                }

        .infobox .content-wrapper .modal-header {
            position: relative;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: space-between;
            width: 100%;
            margin: 0;
            padding: 0 0 1.25rem;
        }

            .infobox .content-wrapper .modal-header h2 {
                font-size: 1.5rem;
                font-weight: bold;
            }

        .infobox .content-wrapper .content {
            position: relative;
            text-align: left;
            height: 260px;
            overflow-y: auto;
        }

            .infobox .content-wrapper .content p, .infobox .content-wrapper .content li, .infobox .content-wrapper .content a {
                font-size: 0.875rem;
                line-height: 1.2;
                margin-right: 10px;
            }

        .infobox .content-wrapper .modal-footer {
            position: relative;
            display: flex;
            align-items: center;
            justify-content: flex-end;
            width: 100%;
            margin: 0;
            padding: 1.5rem 0 0;
        }

            .infobox .content-wrapper .modal-footer .action {
                position: relative;
                margin-left: 0.625rem;
                padding: 0.625rem 1.25rem;
                border: none;
                background-color: slategray;
                border-radius: 0.25rem;
                color: white;
                font-size: 0.87rem;
                font-weight: 300;
                overflow: hidden;
                z-index: 1;
                cursor:pointer;
            }

                .infobox .content-wrapper .modal-footer .action:before {
                    position: absolute;
                    content: '';
                    top: 0;
                    left: 0;
                    width: 0%;
                    height: 100%;
                    background-color: rgba(255, 255, 255, 0.2);
                    transition: width 0.25s;
                    z-index: 0;
                }

                .infobox .content-wrapper .modal-footer .action:first-child {
                     background-color: #e74c3c;
                }

                .infobox .content-wrapper .modal-footer .action:last-child {
                    background-color: #2ecc71;
                }

                .infobox .content-wrapper .modal-footer .action:hover:before {
                    width: 100%;
                }


#crop-ensemble-prices-table {
    border-collapse: collapse;
    width: 100%;
}

    #crop-ensemble-prices-table td, #crop-ensemble-prices-table th {
        border: 1px solid #ddd;
        padding: 2px;
        vertical-align: middle !important;
    }

    #crop-ensemble-prices-table tr:nth-child(even) {
        background-color: #f2f2f2;
    }

    #crop-ensemble-prices-table tr:hover {
        background-color: #ddd;
    }

    #crop-ensemble-prices-table th {
        padding-top: 5px;
        padding-bottom: 5px;
        text-align: center;
        background-color: #808080;
        color: white;
    }
/*
 *  END OF FILE
 */