source: VirtualCollectionRegistry/trunk/VirtualCollectionRegistry/src/main/webapp/css/CLARIN.scss @ 5558

@charset "UTF-8";

$indent: 7px;

// Colors

$red: #9e0025;
//$blue: #52acda;
//$dark_powder_blue: #003399;
//$clarin_blue_old: #007bc5;
$clarin_blue: #00406f;
$grey: #e3e3e3;
$light_grey: #f3f3f3;

$thin_separator_grey: #e7e7e7;
$text: #666;
$text2: #222;
//$hyperlink_color: #03683f;
$hyperlink_visited: #806a52;
$background_color: #f9f9f9;

// Font

@import "//fonts.googleapis.com/css?family=Roboto";
// "//fonts.googleapis.com/css?family=Roboto:100italic,100,300italic,300,400italic,400,500italic,500,700italic,700,900italic,900"
$font-stack: 'Roboto', Arial, Helvetica, Myriad, Verdana, Sans-Serif;


body {
    font-family: $font-stack;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: $text2;
    font-size: 100%;
    word-wrap: break-word;
}

a {
    //color: $text2;
    text-decoration: dotted !important;

    &:hover, &:focus {
        // color: inherit;
        text-decoration: none !important;
    }

    &:visited {
        color: $hyperlink_visited;
    }
}

a.navbar-brand {
    // color: #d7ceb2;
    //text-shadow: 3px 3px 0px #2c2e38, 5px 5px 0px #5c5f72;
    font-size: 3em;
    //letter-spacing: 1px;

    //$clarin_blue1: #00406f;
    //$clarin_blue2: #006dab;
    //$clarin_blue3: #007eda;

    //font-weight: bold;
    line-height: 1em;
    //color: $clarin_blue !important;

    text-shadow: -.025em -.025em .0125em rgba(0, 64, 111, 0.8), -.060em -.080em 0.02em rgba(0, 64, 111, 0.6); //rgba(90, 90, 90, .6);
}

/*
a {
    text-decoration: none;
}

a:link {
    color: #00c;
    border-bottom: 1px solid #00c;
}

a:visited {
    color: #6D006D;
    border-bottom: 1px dotted #6D006D;
}

a:focus {
    color: #c00;
    border-bottom: 1px dashed #c00;
}

a:hover {
    color: #c00;
    border-bottom: 1px dashed #c00;
}

a:active {
    color: #c00;
    border-bottom: 1px solid #c00;
    font-style: italic;
}
*/

h1, h2, h3, h4, h5, h6, label {
    color: $text;
    font-weight: normal;
    line-height: 1.2em;
}

body, h1, h2, h3, h4, h5, h6 {
    font-size-adjust: 0.5;
}

/* Based on http://typecast.com/blog/a-more-modern-scale-for-web-typography */

#page {
    font-size: 1em;
    /* equivalent to 16px */
    line-height: 1.25;
    /* equivalent to 20px */
}

h1 {
    font-size: 2em;
    /* 2x body copy size = 32px */
    line-height: 1.25;
    /* 45px / 36px */
    margin-top: 0px !important;
    margin-bottom: 0px !important;
}

h2 {
    font-size: 1.625em;
    /* 1.625x body copy size = 26px */
    line-height: 1.15384615;
    /* 30px / 26px */
}

h3 {
    font-size: 1.375em;
    /* 1.375x body copy size = 22px */
    line-height: 1.13636364;
    /* 25px / 22px */
}

h4 {
    font-size: 1.125em;
    /* 1.125x body copy size = 18px */
    line-height: 1.11111111;
}

blockquote {
    font-size: 1.25em;
    /* 20px / 16px */
    line-height: 1.25;
    /* 25px / 20px */
}

@media (min-width: 56.25em) {
    h1 {
        font-size: 3em;
        /* 3x body copy size = 48px */
        line-height: 1.05;
        /* keep to a multiple of the 20px line height
        and something more appropriate for display headings */
    }

    h2 {
        font-size: 2.25em;
        /* 2.25x body copy size = 36px */
        line-height: 1.25;
    }

    h3 {
        font-size: 1.75em;
        /* 1.75x body copy size = 28px */
        line-height: 1.25;
    }
}

@media (min-width: 43.75em) {
    #page {
        font-size: 1em;
        /* equivalent to 16px */
        line-height: 1.375;
        /* equivalent to 22px */
    }

    h1 {
        font-size: 2.5em;
        /* 2.5x body copy size = 40px */
        line-height: 1.125;
    }

    h2 {
        font-size: 2em;
        /* 2x body copy size = 32px */
        line-height: 1.25;
    }

    h3 {
        font-size: 1.5em;
        /* 1.5x body copy size = 24px */
        line-height: 1.25;
    }

    h4 {
        line-height: 1.22222222;
        /* (22px / 18px */
    }

    blockquote {
        font-size: 1.5em;
        /* 24px / 16px = */
        line-height: 1.45833333;
        /* 35px / 24px */
    }
}

p {
    margin: 0 0 15px 0;
}

//input {
//  @include box-sizing(border-box);
//}

menu, ol, ul {
    padding: 0 0 0 20px;
}

hr {
    clear: both;
}

div.container {
    z-index: -1 !important;
}

// Tables

//@import "compass/utilities/tables";

table.display {
    border-collapse: collapse !important;
    position: relative !important;
    border-spacing: 0 !important;
    border: 0px !important;
    background-clip: padding-box;
    //background-repeat: no-repeat;
    //background-position: center top;

    th, td {
        border: 0px !important;
        //background-clip: content-box !important;
    }

    thead tr th {
        background-color: $clarin_blue !important;
        border-collapse: collapse !important;
        //background-clip: content-box !important;
        background-attachment: scroll !important;
        //border-bottom: 0px !important;
        color: #fff !important;
    }

    thead {
        tr th:first-child {
            border-top-left-radius: 6px !important;
            border-bottom-left-radius: 6px !important;

            -webkit-border-top-left-radius: 6px !important;
            -webkit-border-bottom-left-radius: 6px !important;

            -moz-border-top-left-radius: 6px !important;
            -moz-border-bottom-left-radius: 6px !important;
        }

        tr {
            padding: $indent $indent !important;
            font-weight: bolder !important;
            text-align: left !important;
            border: 0px !important;
        }

        tr th a {
            color: #fff !important;
            text-decoration: underline !important;
        }

        tr th:last-child {
            border-top-right-radius: 6px !important;
            border-bottom-right-radius: 6px !important;

            -webkit-border-top-right-radius: 6px !important;
            -webkit-border-bottom-right-radius: 6px !important;

            -moz-border-top-right-radius: 6px !important;
            -moz-border-bottom-right-radius: 6px !important;
        }
    }
}

table {
    tbody {
        tr:nth-child(2n+1) td {
            background-color: $grey !important;
        }

        td:first-child {
            -webkit-border-top-left-radius: 6px !important;
            -webkit-border-bottom-left-radius: 6px !important;

            -moz-border-top-left-radius: 6px !important;
            -moz-border-bottom-left-radius: 6px !important;

            border-top-left-radius: 6px !important;
            border-bottom-left-radius: 6px !important;
        }

        td:last-child {
            -webkit-border-top-right-radius: 6px !important;
            -webkit-border-bottom-right-radius: 6px !important;

            -moz-border-top-right-radius: 6px !important;
            -moz-border-bottom-right-radius: 6px !important;

            border-top-right-radius: 6px !important;
            border-bottom-right-radius: 6px !important;
        }

        tr {
            //border-bottom: 1px solid #e6e6e6 !important;
            vertical-align: middle !important;
            //background-clip: padding-box !important;
            //border-collapse: collapse !important;
        }

        tr:last-child td:first-child {
            -webkit-border-bottom-left-radius: 6px !important;
            -moz-border-bottom-left-radius: 6px !important;
            border-bottom-left-radius: 6px !important;
        }

        tr:last-child td:last-child {
            -webkit-border-bottom-right-radius: 6px !important;
            -moz-border-bottom-right-radius: 6px !important;
            border-bottom-right-radius: 6px !important;
        }

        tr:last-child {
            border-bottom: 1px solid $clarin_blue !important;
        }
    }
}

table:not(.display) {
    tr:first-child {
        border-top: 1px solid $clarin_blue !important;
    }

    td, th {
        padding: 5px;
    }

    th {
        background-color: $grey;
        border-right: 1px dotted black;
    }

}

html body ul#nav ul, html body ul#nav ul li {
    width: 200px;
}

html body ul#nav ul ul {
    margin: 0 0 0 200px;
}

div#body {
    min-height: 100%;
    height: auto;
    margin: 0 auto -60px;
    /* Pad top and bottom to prevent overflow over body div. */
    padding: 60px 0 60px;
}

div#footer {
    height: 60px;
    background-color: #f5f5f5;
    //position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    border-top: 1px solid $thin_separator_grey;
    margin-top: 20px;

    div.container {
        // height: 60px !important;
        height: 100%;
    }

    a {
        color: $text2;
        text-decoration: none;

        &:hover, &:focus {
            color: inherit;
            text-decoration: none !important;
        }

        &:visited {
            color: inherit;
        }
    }

    div#CLARIN_footer_left {
        float: left;
        display: inline-block;
        text-align: left;
        width: 25%;
        max-height: 100%;
    }

    div#CLARIN_footer_middle {
        float: left;
        display: inline-block;
        text-align: center;
        width: 50%;
        max-height: 100%;

        img {
            display: inline-block;
            max-width: 100%;
            max-height: 100%;
            overflow: hidden;
        }
    }

    div#CLARIN_footer_right {
        float: left;
        text-align: right;
        width: 25%;
        max-height: 100%;
    }
}

ul#CLARIN_header_right, div#CLARIN_footer_left, div#CLARIN_footer_right {
    :not(.glyphicon) {
        font-family: $font-stack;
    }

    margin: 0px 4px 0 p x 4px;
    text-shadow: -1px -1px 1px #fff, 1px 1px 1px #000;
    color: #584938;
    opacity: 0.4;
}