/*
w3-pro used
    w3-align-left
    w3-animate-left
    w3-bar-block
    w3-bar-item
    w3-border-0
    w3-button
    w3-card-3
    w3-card-4
    w3-center
    w3-check
    w3-collapse
    w3-container
    w3-hide
    w3-hide-large
    w3-hide-medium
    w3-large
    w3-main
    w3-margin-left
    w3-overlay
    w3-red
    w3-right
    w3-right-align
    w3-show-inline-block
    w3-sidebar
    w3-top
    w3-transparent
    w3-xxlarge
*/
.Microsoft-Badge {
    height: auto;
    width: 30%;
    margin: 10px;
    text-align: center;
}

.Thinkage-Green {
    color: rgb(56,88,21);
}

.Thinkage-Yellow {
    color: rgb(255,235,160);
}

.Thinkage-Button {
    background: rgb(255,235,160);
    color: rgb(56,88,21);
    width: 40px;
    max-width: 40px;
    border-radius: 16px;
    align-content: center;
}

.Thinkage-Standout {
    background: rgb(255,235,160);
    border: 1px solid rgb(56,88,21);
    color: rgb(56,88,21);
    border-radius: 32px;
    padding-left: 10%;
    padding-right: 10%;
}

.Thinkage-Menu-Button {
    background: rgb(255,235,160);
    border: 1px solid rgb(56,88,21);
    color: rgb(56,88,21);
    border-radius: 32px;
    padding-left: 10%;
    padding-right: 10%;
    margin: 20px;
    margin-right: 50px;
}

.Thinkage-Back-Button {
    background: rgb(255,235,160);
    border: 1px solid rgb(56,88,21);
    color: rgb(56,88,21);
    border-radius: 32px;
    float: left;
    margin: 20px;
    margin-left: 200px;
    display: none;
}

.no-js .Thinkage-Menu-Button {
    display: none;
}


h1, h2, h3, a {
    color: rgb(56,88,21);
}

.Thinkage-Menu {
    border: 3px solid rgb(56,88,21);
    border-radius: 32px;
    margin: 4px;
}

.Thinkage-Picture-Spacing {
    margin-top: 20px;
}

.Thinkage-Warning {
    color: red;
    padding-left: 10%;
    padding-right: 10%;
}

.Thinkage-Report-Image {
    border: solid;
    border-color: rgb(193,182,125);
}

.Thinkage-Indent {
    margin-left: 50px;
}

.Thinkage-Logo {
    display: block;
    padding: 8px;
    border-radius: 32px;
    border: 3px solid rgb(56,88,21);
    background: rgb(255,235,160);
    margin: 10px 2px 21px 2px;
    width: 290px;
    height: auto;
}

.Thinkage-Menu-Overlay {
    z-index: 3;
    width: 440px;
}


.Thinkage-Picture {
    display: block;
    padding: 8px;
    border-radius: 32px;
    border: 3px solid rgb(56,88,21);
    background: rgb(255,235,160);
    margin: 10px 2px 21px 2px;
    width: 220px;
    height: auto;
}

.Thinkage-Menu-Frame {
    margin-bottom: 25px;
    margin-left: 10px;
    margin-right: 10px;
    background: rgb(255,235,160);
    border: 3px solid rgb(56,88,21);
    color: rgb(56,88,21);
    border-radius: 32px;
    padding-left: 2px;
    padding-right: 2px;
    height: 400px;
}

.Thinkage-Right {
    float: right;
}

.Thinkage-Right-Column {
    float: right;
    position: absolute;
    top: 75px;
    right: 0;
    width: 250px;
}

.Thinkage-Main {
    transition: margin-left .4s;
    transition: margin-right .4s;
    margin-left: 460px;
    margin-right: 250px;
}

.Thinkage-Center-Column {
    padding-right: 20px;
    padding-left: 20px;
    max-width: 800px;
}

.no-js .Thinkage-Right-Column {
    display: none;
}

.Thinkage-Form-Line-Left {
    margin-top: 20px;
    width: 200px;
    float: left;
}

.Thinkage-Form-Line-Right {
    margin-top: 20px;
    width: 300px;
    float: right;
}

.Thinkage-Accordion-Header {
    display: flex;
    flex-flow: row;
}

.Thinkage-Accordion-Button {
    width: 45px;
    margin: 5px;
    margin-top: 10px;
    margin-bottom: 10px;
    display: inline-block;
}

.Thinkage-Accordion-Input {
    text-align-last: right;
    margin: 5px;
    margin-top: 10px;
    margin-bottom: 10px;
    max-width: 95px;
    min-width: 95px;
    display: inline-block;
    text-align: right;
}

.Thinkage-Accordion-Money {
    margin: 5px;
    margin-top: 10px;
    margin-bottom: 10px;
    max-width: 80px;
    min-width: 80px;
    display: inline-block;
    text-align: right;
}

.Thinkage-Accordion-Title {
    margin: 5px;
    margin-top: 10px;
    margin-left: 5px;
    display: inline-block;
    text-align: left
}

.Thinkage-Accordion-Body {
    margin-left: 60px;
}

.Thinkage-Accordion-Hide {
    display: none;
}

@media (max-width:1400px) {
    .Thinkage-Menu-Overlay {
        width: 375px;
    }

    .Thinkage-Main {
        margin-left: 385px;
        margin-right: 250px;
    }
}

@media(max-width: 1200px) {
    .Thinkage-Menu-Overlay {
        width: 350px;
    }

    .Thinkage-Right-Column {
        display: none;
    }

    .Thinkage-Main {
        margin-right: 10px;
        margin-left: 360px;
    }
}

@media (max-width: 992px) {
    .no-js .w3-sidebar {
        display: block;
    }

    .Thinkage-Right-Column {
        display: block;
    }

    .Thinkage-Main {
        margin-right: 250px;
        margin-left: 10px;
    }
}

@media(max-width: 700px) {
    .Thinkage-Right-Column {
        display: none;
    }

    .Thinkage-Main {
        margin-right: 10px;
        margin-left: 10px;
    }
}

@media (max-width:500px) {
    .Thinkage-Logo {
        margin-top: 80px;
    }

    .Thinkage-Main {
        margin-right: 0;
        margin-left: 0;
    }

    .Thinkage-Back-Button {
        display: block;
    }
}


@media (max-width: 320px) {
    .Thinkage-Accordion-Body {
        margin-left: 0;
    }

    .Thinkage-Center-Column {
        padding-left: 5px;
        padding-right: 5px;
    }
}

@media print {
    .Thinkage-Hide-If-Print, .w3-collapse, .w3-sidebar, .w3-sidebar.w3-collapse {
        display: none !important;
    }

    .Thinkage-Accordion-Hide {
        display: block;
    }

    .Thinkage-Main {
        margin-left: 0;
        margin-right: 0;
        display: block;
    }
}

/* Just to note that we will use this rule in media directives
.Thinkage-Hide-If-TTY {
}
*/

@media tty {
    .Thinkage-Hide-If-Print, .w3-collapse, .w3-sidebar, .w3-sidebar.w3-collapse {
        display: block;
    }

    .Thinkage-Hide-If-TTY {
        display: none;
    }

    .Thinkage-Right-Column {
        display: none;
    }

    .Thinkage-Center-Column {
        padding-right: 0;
    }

    .Thinkage-Accordion-Hide {
        display: block;
    }

    .w3-sidebar {
        display: block;
    }

    .Thinkage-Main {
        margin-left: 350px;
        margin-right: 0;
        padding-right: 10px;
    }
}

.no-js .Thinkage-Main {
    margin-left: 360px;
    margin-right: 0;
}

.no-js .Thinkage-Logo {
    margin-top: 10px;
}

.no-js .Thinkage-Right-Column {
    display: none;
}

/*
.Thinkage-Hide-no-js {
}
*/
.no-js .Thinkage-Hide-no-js {
    display: none;
}

.Thinkage-Hide-js-ok {
    display: none;
}

.no-js .Thinkage-Hide-js-ok {
    display: block;
}

.no-js .Thinkage-Menu-Overlay {
    width: 350px;
}

.no-js .w3-sidebar {
    width: 350px;
}
