/*----------------------------------------------------------------------------------------------------------------------
    HITMAP CSS LIBRARY

    General classes written in a semantic way, made for use with Semantic UI
    The purpose is to have a collection of atomic classes, ideally with one instruction, and mix them in HTML
    !important is used because Semantic UI is very specific and sometimes is too hard to override properly
----------------------------------------------------------------------------------------------------------------------*/

/*----------------------------
    PADDING REMOVAL
----------------------------*/

.unpadded {
    padding: 0 !important;
}
.unpadded_top {
    padding-top: 0 !important;
}
.unpadded_bottom {
    padding-bottom: 0 !important;
}
.unpadded_left {
    padding-left: 0 !important;
}
.unpadded_right {
    padding-right: 0 !important;
}

/*----------------------------
    ADD PADDING
----------------------------*/

.padded_05em {
    padding: 0.5em !important;
}
.padded_1em {
    padding: 1em !important;
}
.padded_15em {
    padding: 1.5em !important;
}
.padded_2em {
    padding: 2em !important;
}
.padded_top_05em {
    padding-top: 0.5em !important;
}
.padded_top_1em {
    padding-top: 1em !important;
}
.padded_top_15em {
    padding-top: 1.5em !important;
}
.padded_top_2em {
    padding-top: 2em !important;
}
.padded_bottom_05em {
    padding-bottom: 0.5em !important;
}
.padded_bottom_1em {
    padding-bottom: 1em !important;
}
.padded_bottom_15em {
    padding-bottom: 1.5em !important;
}
.padded_bottom_2em {
    padding-bottom: 2em !important;
}
.padded_left_05em {
    padding-left: 0.5em !important;
}
.padded_left_1em {
    padding-left: 1em !important;
}
.padded_left_15em {
    padding-left: 1.5em !important;
}
.padded_left_2em {
    padding-left: 2em !important;
}
.padded_right_05em {
    padding-right: 0.5em !important;
}
.padded_right_1em {
    padding-right: 1em !important;
}
.padded_right_15em {
    padding-right: 1.5em !important;
}
.padded_right_2em {
    padding-right: 2em !important;
}

/*----------------------------
    MARGIN REMOVAL
----------------------------*/

.marginless {
    margin: 0 !important;
}
.marginless_top {
    margin-top: 0 !important;
}
.marginless_bottom {
    margin-bottom: 0 !important;
}
.marginless_left {
    margin-left: 0 !important;
}
.marginless_right {
    margin-right: 0 !important;
}

/*----------------------------
    FLOAT CONTENT
----------------------------*/

.left_floated {
    float: left !important;
}
.right_floated {
    float: right !important;
}

/*----------------------------
    OVERFLOW CONTENT
----------------------------*/

.overflow_y_auto {
    overflow-y: auto;
}
.overflow_hidden {
    overflow: hidden;
}

/*----------------------------
    HEIGHT AND WIDTH
----------------------------*/

.width_30px {
    width: 30px !important;
}
.auto_width {
    width: auto !important;
}
.full_width {
    width: 100% !important;
}
.full_height {
    height: 100% !important;
}
.full_height_min {
    min-height: 100% !important;
}

/*----------------------------
    CURSOR
----------------------------*/

.disabled_link {
    opacity: 0.45 !important;
    pointer-events: none !important;
    cursor: default !important;
}
.cursor_text {
    cursor: text !important;
}
.cursor_pointer {
    cursor: pointer !important;
}
.cursor_move {
    cursor: move !important;
}

/*----------------------------
    TEXT TRANSFORMATIONS
----------------------------*/

.lowercased {
    text-transform: lowercase !important;
}
.capitalized {
    text-transform: capitalize !important;
}
.first_capitalized::first-letter {
    /* If it does not work alone, use both: 'lowercased first_capitalized' (the order is important) */
    text-transform: uppercase !important;
}
.uppercased {
    text-transform: uppercase !important;
}
.no_transform_text {
    text-transform: none !important;
}
.ellipsis {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}
.white_space_pre {
    white-space: pre !important;
}
.white_space_pre_line {
    white-space: pre-line;
}

/*----------------------------
    TEXT FORMATTING
----------------------------*/

.normal_text {
    font-weight: normal !important;
}
.bold_text {
    font-weight: bold !important;
}
.italic_text {
    font-style: italic !important;
}
.left_text {
    text-align: left !important;
}
.center_text {
    text-align: center !important;
}
.right_text {
    text-align: right !important;
}
.top_text {
    vertical-align: top !important;
}
.middle_text {
    vertical-align: middle !important;
}
.bottom_text {
    vertical-align: bottom !important;
}
.underline_text {
    text-decoration: underline !important;
}
.large_text {
    font-size: 1.1em !important;
}
.bigger_text {
    font-size: 1.5em !important;
}

/*----------------------------
    TEXT COLORS
----------------------------*/

.white_color {
    color: #FFFFFF !important;
}
.blue_color {
    /* #4EB2D4 rgb(78, 178, 212) */
    color: #4EB2D4 !important;
}
.navy_color {
    /* #2D5A82 rgb(45, 90, 130) */
    color: #2D5A82 !important;
}
.magenta_color {
    /* #C04D8F rgb(192, 77, 143) */
    color: #C04D8F !important;
}
.orange_color {
    /* #F07824 rgb(240, 120, 36) */
    color: #F07824 !important;
}
.dark_grey_color {
    /* #767676 rgb(118, 118, 118) */
    color: #767676 !important;
}
.transparent_color {
    color: transparent !important;
}

/*----------------------------
    BACKGROUND COLORS
----------------------------*/

.white_background {
    background: #FFFFFF !important;
}
.extremely_light_grey_background {
    /* #F3F3F3 rgb(243, 243, 243) */
    background: #F3F3F3 !important;
}
.very_light_grey_background {
    /* #EBEBEB rgb(235, 235, 235) */
    background: #EBEBEB !important;
}
.light_grey_background {
    /* #C6C6C6 rgb(198, 198, 198) */
    background: #C6C6C6 !important;
}
.grey_background {
    /* #B7B7B7 rgb(183, 183, 183) */
    background: #B7B7B7 !important;
}
.dark_grey_background {
    /* #767676 rgb(118, 118, 118) */
    background: #767676 !important;
}
.blue_background {
    /* #4EB2D4 rgb(78, 178, 212) */
    background: #4EB2D4 !important;
}
.navy_background {
    /* #2D5A82 rgb(45, 90, 130) */
    background: #2D5A82 !important;
}
.magenta_background {
    /* #C04D8F rgb(192, 77, 143) */
    background: #C04D8F !important;
}
/* Polygons and Isochrones */
.orange_background {
    /* #F07824 rgb(240, 120, 36) */
    background: #F07824 !important;
}
.green_background {
    /* #39B54A rgb(57, 181, 74) */
    background: #39B54A !important;
}
/* Isochrones only */
.darker_green_background {
    /* #006837 rgb(0, 104, 55) */
    background: #006837 !important;
}
.dark_green_background {
    /* #208E41 rgb(32, 142, 65) */
    background: #208E41 !important;
}
.light_green_background {
    /* #85C044 rgb(133, 192, 68) */
    background: #85C044 !important;
}
.green_yellow_background {
    /* #BDCA3C rgb(189, 202, 60) */
    background: #BDCA3C !important;
}
.yellow_background {
    /* #F0D232 rgb(240, 210, 50) */
    background: #F0D232 !important;
}

/*----------------------------
    BORDER
----------------------------*/

.grey_border {
    /* #B7B7B7 rgb(183, 183, 183) */
    border: 1px solid #B7B7B7 !important;
}
.blue_border {
    /* #4EB2D4 rgb(78, 178, 212) */
    border: 1px solid #4EB2D4 !important;
}
.navy_border {
    /* #2D5A82 rgb(45, 90, 130) */
    border: 1px solid #2D5A82 !important;
}
.magenta_border {
    /* #C04D8F rgb(192, 77, 143) */
    border: 1px solid #C04D8F !important;
}
.orange_border {
    /* #F07824 rgb(240, 120, 36) */
    border: 1px solid #F07824 !important;
}
/* For dividing header */
.blue_bottom_border {
    /* #4EB2D4 rgb(78, 178, 212) */
    border-bottom: 2px solid #4EB2D4 !important;
}
.navy_bottom_border {
    /* #2D5A82 rgb(45, 90, 130) */
    border-bottom: 2px solid #2D5A82 !important;
}
.magenta_bottom_border {
    /* #C04D8F rgb(192, 77, 143) */
    border-bottom: 2px solid #C04D8F !important;
}
.orange_bottom_border {
    /* #F07824 rgb(240, 120, 36) */
    border-bottom: 2px solid #F07824 !important;
}

/*----------------------------
    OPACITY
----------------------------*/

.less_opacity {
    opacity: 0.7 !important;
}
.opacity_hover:hover {
    opacity: 0.8 !important;
}

/*----------------------------
    RESPONSIVE UTILITIES
----------------------------*/

.totally_hidden {
    display: none !important;
}
.inline_block {
    display: inline-block !important;
}
/* Printer */
.print_only {
    display: none !important;
}
@media print {
    .print_hidden {
        display: none !important;
    }
    .print_only {
        display: inherit !important;
    }
}
/* Mobile */
@media only screen and (max-width: 767px) {
    .mobile_hidden,
    .tablet_only,
    .computer_only,
    .large_screen_only,
    .widescreen_only {
        display: none !important;
    }
}
/* Tablet / iPad Portrait */
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .mobile_only,
    .tablet_hidden,
    .computer_only,
    .large_screen_only,
    .widescreen_only {
        display: none !important;
    }
}
/* Computer / Desktop / iPad Landscape */
@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .mobile_only,
    .tablet_only,
    .computer_hidden,
    .large_screen_only,
    .widescreen_only {
        display: none !important;
    }
}
/* Large Screen */
@media only screen and (min-width: 1200px) and (max-width: 1919px) {
    .mobile_only,
    .tablet_only,
    .computer_only,
    .large_screen_hidden,
    .widescreen_only {
        display: none !important;
    }
}
/* Widescreen */
@media only screen and (min-width: 1920px) {
    .mobile_only,
    .tablet_only,
    .computer_only,
    .large_screen_only,
    .widescreen_hidden {
        display: none !important;
    }
}

/*------------------------------------------------
    ALERT MESSAGE BOX
------------------------------------------------*/

.alert_message {
    -webkit-box-shadow: 0px 0px 0px 1px rgba(34, 36, 38, 0.22) inset, 0px 3px 4px 0px rgba(34, 36, 38, 0.12), 0px 3px 10px 0px rgba(34, 36, 38, 0.08) !important;
    box-shadow: 0px 0px 0px 1px rgba(34, 36, 38, 0.22) inset, 0px 3px 4px 0px rgba(34, 36, 38, 0.12), 0px 3px 10px 0px rgba(34, 36, 38, 0.08) !important;
    top: 3em !important;
    right: 1em !important;
    margin-left: 1em !important;
    min-width: 12em !important;
    z-index: 9999 !important;
}
@media only screen and (min-width: 992px) {
    .alert_message {
        max-width: 38.196448768% !important;
    }
}