body {
    padding-top: 50px;
    padding-bottom: 20px;
}

/* Wrapping element */
/* Set some basic padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

/*Nested semi fluid*/
.body-wide {
    padding-left: 0px;
    padding-right: 0px;
}
.footer-bottom {
    position: fixed;
    bottom: 0;
    width: 100%;
    padding-left: 15px;
    padding-right: 15px;
}
.row-button{
    margin-top:15px;
    margin-bottom:15px;
   
}

/*Container/Row*/
.no-margin {
    margin-left: 0px !important;
    margin-right: 0px !important;
}


.red {
    color: red !important;
}
.center {
    margin: auto;
  
    padding: 10px;
}
.dropdown > .btn > .caret {
    margin-left : -5px
}
/* Set widths on the form inputs since otherwise they're 100% wide */
input,
select,
textarea {
    max-width: 280px;
}
    input.half {
        max-width: 140px;
    }

    input.wide {
        max-width: 80% !important;
    }
div.input {
    max-width: 280px;
}
    div.input.half {
        max-width: 140px;
    }
    div.input.wide {
        max-width: 80% !important;
    }

textarea {
    white-space: pre-wrap;
    overflow-wrap: break-word;
}

    textarea.full{

    display: inline-block;
    margin: 0;
    padding: .2em;
    width: auto;
    min-width: 30em;
    /* The max-width "100%" value fixes a weird issue where width is too wide by default and extends beyond 100% of the parent in some agents. */
    max-width: 100%;
    /* Height "auto" will allow the text area to expand vertically in size with a horizontal scrollbar if pre-existing content is added to the box before rendering. Remove this if you want a pre-set height. Use "em" to match the font size set in the website. */
    height: auto;
    /* Use "em" to define the height based on the text size set in your website and the text rows in the box, not a static pixel value. */
    min-height: 10em;
    /* Do not use "border" in textareas unless you want to remove the 3D box most browsers assign and flatten the box design. */
    /*border: 1px solid black;*/
    cursor: text;
    /* Some textareas have a light gray background by default anyway. */
    background-color: white;
    /* Overflow "auto" allows the box to start with no scrollbars but add them as content fills the box. */
    overflow: auto;
    /* Resize creates a tab in the lower right corner of textarea for most modern browsers and allows users to resize the box manually. Note: Resize isn't supported by most older agents and IE. */
    resize: both;
}
    textarea.fill {
       
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
}
    
    

    a.disabled {
        pointer-events: none;
        cursor: default;
    }

dt.rightAlign,
th.rightAlign{
   text-align:right;
   
}

input[currency],
input[type=number] {
    width: 75px;
    text-align: right;
}

.panel-dropdown-main {
    padding: 0px;
    border: 1px solid darkgray;
    border-radius: 4px;
    overflow: auto;
}
.panel-dropdown {
    padding: 0px;
   
}

.list-group-item {
    max-width: 280px;
}

/* in line glyphs (h3) */
.gliph-container {
    vertical-align: top;
    display: inline-block;
    padding-top: 2px;
    margin: 3px;
}

/* Carousel */
.carousel-caption p {
    font-size: 20px;
    line-height: 1.4;
}
.carousel-inner > .item > img {
    margin: 0 auto;
}
/* Tab Divs*/

.tabs {
    margin: 0;
    padding: 0;
    border-top: 1px solid gray;
    border-left: 1px solid gray;
    border-bottom: 1px solid gray;
    border-right: 1px solid gray;
}

.tabs-bottom {
    -webkit-border-radius: 0 0 4px 4px;
    -moz-border-radius: 0 0 4px 4px;
    border-radius: 0 0 4px 4px;
    border-top: none;
}

.tabs-top {
    -webkit-border-radius: 4px 4px 0 0;
    -moz-border-radius: 4px 4px 0 0;
    border-radius: 4px 4px 0 0;
    border-bottom: none;
}

.btn-tabs {
    background: Lightgray;
    color: ButtonText;
    height: 40px;
    line-height: 40px;
    text-align: center;
    display: inline-block;
   
    padding-left: 20px;
    padding-right: 20px;
}
.tabs-bottom > .btn-tabs.active {
    border-color: transparent black black black;
    color: black;
    background-color:  white;
}
.tabs-bottom > .btn-tabs {
    -webkit-border-radius: 0 0 4px 4px;
    -moz-border-radius: 0 0 4px 4px;
    border-radius: 0 0 4px 4px;
   
    border-top: 1px solid gray;
    border-left: 1px solid gray;
    border-bottom: 1px solid gray;
    border-right: 1px solid gray;   
}

.tabs-bottom > .tab-pane {
    border-top: 1px solid gray;
    border-left: 1px solid gray;
    border-bottom: none;
    border-right: 1px solid gray;
}

.tabs-top > .tab-pane {
    border-top: none;
    border-left: 1px solid gray;
    border-bottom: 1px solid gray;
    border-right: 1px solid gray;
}

.tab-content {
    border: 1px solid;
    border-color: transparent lightgray lightgray lightgray;
}

.tabs-top > .btn-tabs.active {
    border-color: black black transparent black;
    color: black;
    background-color: white;
}
.tabs-top > .btn-tabs {
    -webkit-border-radius: 4px 4px 0 0;
    -moz-border-radius: 4px 4px 0 0;
    border-radius: 4px 4px 0 0;
    display: inline-block;
    border-top: 1px solid gray;
    border-left: 1px solid gray;
    border-bottom: 1px solid gray;
    border-right: 1px solid gray;
   
}

.fill-field {
    display: none !important;
}


/* Make .svg files in the carousel display properly in older browsers */
.carousel-inner .item img[src$=".svg"] {
    width: 100%;
}

/* Hide/rearrange for smaller screens */
@media screen and (max-width: 767px) {
    /* Hide captions */
    .carousel-caption {
        display: none;
    }
}


/* Hide/rearrange for printing */
@media screen {
    .table-area {
        height: 200px;
        overflow: auto;
        margin: 2px;
    }
}
@media print {
    .table-area {
        border-style:hidden; 
        overflow: visible;
        margin: 2px;
    }
    .tab-content {
        border-style: hidden;    
    }
    .tab-pane {
        border-style: hidden;
    }
    .panel {
        border-style: hidden;
    }
    a[href]:after {
        display: none;
        visibility: hidden;
    }
}


svg.allergen {
    margin-right: 5px;
    height: 16px;
    width:16px;
}


/* Tooltip container */
.ttooltip {
    position: relative;
    display: inline-block;
    /* border-bottom: 1px dotted black; /* If you want dots under the hoverable text */
}

    /* Tooltip text */
    .ttooltip .tooltiptext {
        visibility: hidden;
        width: 120px;
        background: #5483f3;
        color: #fff;
        text-align: center;
        padding: 5px;
        border-radius: 6px;
        /* Position the tooltip text */
        position: absolute;
        z-index: 1;
        bottom: 125%;
        left: 50%;
        margin-left: -60px;
        opacity: 0;
        transition: opacity 0.3s;
    }

        /* Tooltip arrow */
        .ttooltip .tooltiptext::after {
            content: "";
            position: absolute;
            top: 100%;
            left: 50%;
            margin-left: -5px;
            border-width: 5px;
            border-style: solid;
            border-color: #17a2b8 transparent transparent transparent;
        }

    /* Show the tooltip text when you mouse over the tooltip container */
    .ttooltip:hover .tooltiptext {
        visibility: visible;
        opacity: 1;
    }

option:disabled {
    color: lightgrey;
}

/*Header icons*/
.header-glyph {
    font-size: 12px;
    padding-left: 15px;
    padding-right: 5px;
    padding-top: 1px;
}

.select-mini {
    font-size: 12px;
    height: 12px;
    width: 100px;
}

form.inline {
    display: inline;
}

.dl-horizontal dt, .dl-horizontal dd {
    float: left;
    margin: 0;
}

.dl-horizontal dt {
    text-align: right;
    font-weight: bold;
    width: 100px;
    margin-right: 10px;
    white-space: nowrap;
}

.dl-horizontal dd {
    width: calc(100% - 110px);
}

.vsplitbar {
    width: 4px;
    background: gray;
    cursor: col-resize;
}

.table > tbody > tr.active > td {
    background: #3F8CFF;
    color: #fff;
}

.table > tbody > tr.active > td:hover{
    background: #3fc4ff;
    color: #fff;
}

    .table > tbody > tr.active > td > a {
        background: #3F8CFF;
        color: #fff;
    }

        .table > tbody > tr.active > td > a:hover {
            background: #3fc4ff;
            color: #fff;
        }


.panel-resizablev {
    resize: vertical;
    overflow: auto
}

.panel-resizableh {
    resize: horizontal;
    overflow: auto
}


.panel-left-menu {
    height: 70vh;
    overflow: auto;
}

.row-flex {
    display: flex;
    flex-wrap: wrap;
}

    p.keyword-check {
    padding: 5px;
    margin-left: 5px;
    margin-right: 5px;
    font: bold 24px/45px;
    color: black;
    border-radius: 10px;
    border-color: darkgray !important;
    border-width: 3px;
    border-style: solid;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    
}

    p.keyword-check.active {
        border-color: black !important;
    }

/* Google autocomplete */
.pac-container {
    z-index: 10000 !important;
}

/* LED */
.led-box {
    height: 20px;
    width: 20px;
    margin: 5px 0;
    float: left;
}

.led-red {
    margin: 0 auto;
    width: 18px;
    height: 18px;
    background-color: #F00;
    border-radius: 50%;
    box-shadow: rgba(0, 0, 0, 0.2) 0 -1px 7px 1px, inset #441313 0 -1px 9px, rgba(255, 0, 0, 0.5) 0 2px 12px;
    -webkit-animation: blinkRed 0.5s infinite;
    -moz-animation: blinkRed 0.5s infinite;
    -ms-animation: blinkRed 0.5s infinite;
    -o-animation: blinkRed 0.5s infinite;
    animation: blinkRed 0.5s infinite;
}

@-webkit-keyframes blinkRed {
    from {
        background-color: #F00;
    }

    50% {
        background-color: #A00;
        box-shadow: rgba(0, 0, 0, 0.2) 0 -1px 7px 1px, inset #441313 0 -1px 9px, rgba(255, 0, 0, 0.5) 0 2px 0;
    }

    to {
        background-color: #F00;
    }
}

@-moz-keyframes blinkRed {
    from {
        background-color: #F00;
    }

    50% {
        background-color: #A00;
        box-shadow: rgba(0, 0, 0, 0.2) 0 -1px 7px 1px, inset #441313 0 -1px 9px, rgba(255, 0, 0, 0.5) 0 2px 0;
    }

    to {
        background-color: #F00;
    }
}

@-ms-keyframes blinkRed {
    from {
        background-color: #F00;
    }

    50% {
        background-color: #A00;
        box-shadow: rgba(0, 0, 0, 0.2) 0 -1px 7px 1px, inset #441313 0 -1px 9px, rgba(255, 0, 0, 0.5) 0 2px 0;
    }

    to {
        background-color: #F00;
    }
}

@-o-keyframes blinkRed {
    from {
        background-color: #F00;
    }

    50% {
        background-color: #A00;
        box-shadow: rgba(0, 0, 0, 0.2) 0 -1px 7px 1px, inset #441313 0 -1px 9px, rgba(255, 0, 0, 0.5) 0 2px 0;
    }

    to {
        background-color: #F00;
    }
}

@keyframes blinkRed {
    from {
        background-color: #F00;
    }

    50% {
        background-color: #A00;
        box-shadow: rgba(0, 0, 0, 0.2) 0 -1px 7px 1px, inset #441313 0 -1px 9px, rgba(255, 0, 0, 0.5) 0 2px 0;
    }

    to {
        background-color: #F00;
    }
}

.led-green {
    margin: 0 auto;
    width: 18px;
    height: 18px;
    background-color: #ABFF00;
    border-radius: 50%;
    box-shadow: rgba(0, 0, 0, 0.2) 0 -1px 7px 1px, inset #304701 0 -1px 9px, #89FF00 0 2px 12px;
}

.led-yellow {
    margin: 0 auto;
    width: 18px;
    height: 18px;
    background-color: #FF0;
    border-radius: 50%;
    box-shadow: rgba(0, 0, 0, 0.2) 0 -1px 7px 1px, inset #808002 0 -1px 9px, #FF0 0 2px 12px;
    -webkit-animation: blinkYellow 1s infinite;
    -moz-animation: blinkYellow 1s infinite;
    -ms-animation: blinkYellow 1s infinite;
    -o-animation: blinkYellow 1s infinite;
    animation: blinkYellow 1s infinite;
}


@-webkit-keyframes blinkYellow {
    from {
        background-color: #FF0;
    }

    50% {
        background-color: #AA0;
        box-shadow: rgba(0, 0, 0, 0.2) 0 -1px 7px 1px, inset #808002 0 -1px 9px, #FF0 0 2px 0;
    }

    to {
        background-color: #FF0;
    }
}

@-moz-keyframes blinkYellow {
    from {
        background-color: #FF0;
    }

    50% {
        background-color: #AA0;
        box-shadow: rgba(0, 0, 0, 0.2) 0 -1px 7px 1px, inset #808002 0 -1px 9px, #FF0 0 2px 0;
    }

    to {
        background-color: #FF0;
    }
}

@-ms-keyframes blinkYellow {
    from {
        background-color: #FF0;
    }

    50% {
        background-color: #AA0;
        box-shadow: rgba(0, 0, 0, 0.2) 0 -1px 7px 1px, inset #808002 0 -1px 9px, #FF0 0 2px 0;
    }

    to {
        background-color: #FF0;
    }
}

@-o-keyframes blinkYellow {
    from {
        background-color: #FF0;
    }

    50% {
        background-color: #AA0;
        box-shadow: rgba(0, 0, 0, 0.2) 0 -1px 7px 1px, inset #808002 0 -1px 9px, #FF0 0 2px 0;
    }

    to {
        background-color: #FF0;
    }
}

@keyframes blinkYellow {
    from {
        background-color: #FF0;
    }

    50% {
        background-color: #AA0;
        box-shadow: rgba(0, 0, 0, 0.2) 0 -1px 7px 1px, inset #808002 0 -1px 9px, #FF0 0 2px 0;
    }

    to {
        background-color: #FF0;
    }
}


.led-blue {
    margin: 0 auto;
    width: 18px;
    height: 18px;
    background-color: #24E0FF;
    border-radius: 50%;
    box-shadow: rgba(0, 0, 0, 0.2) 0 -1px 7px 1px, inset #006 0 -1px 9px, #3F8CFF 0 2px 14px;
}

/*Stacked Modal Scrollbar*/
.modal {
    overflow: auto !important;
}

/*Modal close spacing*/
.close{
    margin-left: 20px;
}
/*Order details in Table*/
.percent  {
    color:gray;
    font-size: 9px;
    height: 12px;
    padding:1px;
    margin:1px;
    font-weight:100;
}

/*Order details in Table*/
.tableStats {
    color: gray;
    font-size: 9px;
    height: 12px;
    padding: 1px;
    margin: 1px;
    font-weight: 100;
}
.multiline {
    white-space: pre-wrap;
}

/*Order details in Table*/
.orders {
    color: gray;
    font-size: 9px;
    height: 12px;
    padding: 1px;
    margin: 1px;
    font-weight: 100;
}
/*Tree Level*/
.level0 {
    margin-left: 0px;
}

.level1 {
    margin-left: 10px;
}

.level2 {
    margin-left: 20px;
}

.level3 {
    margin-left: 30px;
}

.level4 {
    margin-left: 40px;
}

.level5 {
    margin-left: 50px;
}

.level6 {
    margin-left: 60px;
}
.canCollapse {
    color: #428bca;
    font-weight:bolder;
}

.total:not(:empty) {
    font-weight: bolder;
    display: block;
    border-top: double gray;
    border-bottom: solid 1px Lightgray;
}

.collapsedTotal:not(:empty) {
    display: block;
    border-bottom: solid 1px Lightgray;
}
.grandTotal:not(:empty) {
    font-weight: bolder;
    display: block;
    border-bottom: solid black;
}

.orderTotal:not(:empty) {
    font-weight: bolder;
    display: block;
    border-top: solid black;
}

.regInputs{
    max-width:250px
}

.modal.modal-wide .modal-dialog {
    width: 70%;
}

.modal-wide .modal-body {
    overflow-y: auto;
}

ul.breadcrumb {
    padding: 10px 16px;
    list-style: none;
    background-color: #eee;
}

    ul.breadcrumb li {
        display: inline;
        font-size: 18px;
    }

        ul.breadcrumb li + li:before {
            padding: 8px;
            color: black;
            content: "/\00a0";
        }

        ul.breadcrumb li a {
            color: #0275d8;
            text-decoration: none;
        }

            ul.breadcrumb li a:hover {
                color: #01447e;
                text-decoration: underline;
            }
/* Test Order */
span.testOrder {
    background-color: yellow;
}
tr.testOrder {
    background-color: yellow;
}
/*Booking Events*/
a.beTestOrder {
    border-style: solid;
    border-color: yellow;
    border-width: 5px;
}

.beCreated, a.beCreated div {
    background-color: lightgreen !important;
    color: black !important;
}
.beOrdered, a.beOrdered div {
    background-color: green;
    color: white;
}
.beCanceled, a.beCanceled div {
    background-color: lightyellow;
    color: black;
}
.beApproved, a.beApproved div {
    background-color: darkgreen;
    color: white;
}
.beCompleted, a.beCompleted div {
    background-color: lightblue;
    color: black;
}
.beFailed, a.beFailed div {
    background-color: orangered;
    color: white;
}
div.beLedgend label {
    font-size: 1em;
    font-weight: normal;
    padding: 2px 10px 2px 10px;
    border-style: solid;
    border-color: lightgray;
    border-width: 1px;
}
div.beLedgend input {
    margin: 4px 5px 2px 5px; 
}


/*Copied from Bootstrap 4*/
@media (min-width: 992px) {
    .modal-lg,
    .modal-xl {
        width: 800px;
    }
}

@media (min-width: 1200px) {
    .modal-xl {
       width: 1140px;
    }
}


.padding-xs {
    padding: .25em;
}

.padding-sm {
    padding: .5em;
}

.padding-md {
    padding: 1em;
}

.padding-lg {
    padding: 1.5em;
}

.padding-xl {
    padding: 3em;
}

.padding-x-xs {
    padding: .25em 0;
}

.padding-x-sm {
    padding: .5em 0;
}

.padding-x-md {
    padding: 1em 0;
}

.padding-x-lg {
    padding: 1.5em 0;
}

.padding-x-xl {
    padding: 3em 0;
}

.padding-y-xs {
    padding: 0 .25em;
}

.padding-y-sm {
    padding: 0 .5em;
}

.padding-y-md {
    padding: 0 1em;
}

.padding-y-lg {
    padding: 0 1.5em;
}

.padding-y-xl {
    padding: 0 3em;
}

.padding-top-xs {
    padding-top: .25em;
}

.padding-top-sm {
    padding-top: .5em;
}

.padding-top-md {
    padding-top: 1em;
}

.padding-top-lg {
    padding-top: 1.5em;
}

.padding-top-xl {
    padding-top: 3em;
}

.padding-right-xs {
    padding-right: .25em;
}

.padding-right-sm {
    padding-right: .5em;
}

.padding-right-md {
    padding-right: 1em;
}

.padding-right-lg {
    padding-right: 1.5em;
}

.padding-right-xl {
    padding-right: 3em;
}

.padding-bottom-xs {
    padding-bottom: .25em;
}

.padding-bottom-sm {
    padding-bottom: .5em;
}

.padding-bottom-md {
    padding-bottom: 1em;
}

.padding-bottom-lg {
    padding-bottom: 1.5em;
}

.padding-bottom-xl {
    padding-bottom: 3em;
}

.padding-left-xs {
    padding-left: .25em;
}

.padding-left-sm {
    padding-left: .5em;
}

.padding-left-md {
    padding-left: 1em;
}

.padding-left-lg {
    padding-left: 1.5em;
}

.padding-left-xl {
    padding-left: 3em;
}

.margin-xs {
    margin: .25em;
}

.margin-sm {
    margin: .5em;
}

.margin-md {
    margin: 1em;
}

.margin-lg {
    margin: 1.5em;
}

.margin-xl {
    margin: 3em;
}

.margin-x-xs {
    margin: .25em 0;
}

.margin-x-sm {
    margin: .5em 0;
}

.margin-x-md {
    margin: 1em 0;
}

.margin-x-lg {
    margin: 1.5em 0;
}

.margin-x-xl {
    margin: 3em 0;
}

.margin-y-xs {
    margin: 0 .25em;
}

.margin-y-sm {
    margin: 0 .5em;
}

.margin-y-md {
    margin: 0 1em;
}

.margin-y-lg {
    margin: 0 1.5em;
}

.margin-y-xl {
    margin: 0 3em;
}

.margin-top-xs {
    margin-top: .25em;
}

.margin-top-sm {
    margin-top: .5em;
}

.margin-top-md {
    margin-top: 1em;
}

.margin-top-lg {
    margin-top: 1.5em;
}

.margin-top-xl {
    margin-top: 3em;
}

.margin-right-xs {
    margin-right: .25em;
}

.margin-right-sm {
    margin-right: .5em;
}

.margin-right-md {
    margin-right: 1em;
}

.margin-right-lg {
    margin-right: 1.5em;
}

.margin-right-xl {
    margin-right: 3em;
}

.margin-bottom-xs {
    margin-bottom: .25em;
}

.margin-bottom-sm {
    margin-bottom: .5em;
}

.margin-bottom-md {
    margin-bottom: 1em;
}

.margin-bottom-lg {
    margin-bottom: 1.5em;
}

.margin-bottom-xl {
    margin-bottom: 3em;
}

.margin-left-xs {
    margin-left: .25em;
}

.margin-left-sm {
    margin-left: .5em;
}

.margin-left-md {
    margin-left: 1em;
}

.margin-left-lg {
    margin-left: 1.5em;
}

.margin-left-xl {
    margin-left: 3em;
}
.google-maps {
    position: relative;
    /*padding-bottom: 75%;*/
    width: 100% !important;
    height: 100% !important;
    overflow: hidden;
}

    .google-maps iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100% !important;
        height: 100% !important;
    }
/* Remove Number Step Spinner Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}


/*Spinner*/
/* Absolute Center Spinner */
.loading {
    position: fixed;
    z-index: 9999;
    height: 2em;
    width: 2em;
    overflow: show;
    margin: auto;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}

    /* Transparent Overlay */
    .loading:before {
        content: '';
        display: block;
        position: fixed;
        z-index: 9999;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0,0,0,0.3);
    }

    /* :not(:required) hides these rules from IE9 and below */
    .loading:not(:required) {
        /* hide "loading..." text */
        font: 0/0 a;
        color: transparent;
        text-shadow: none;
        background-color: transparent;
        border: 0;
    }

        .loading:not(:required):after {
            content: '';
            display: block;
            font-size: 10px;
            width: 1em;
            height: 1em;
            margin-top: -0.5em;
            -webkit-animation: spinner 1500ms infinite linear;
            -moz-animation: spinner 1500ms infinite linear;
            -ms-animation: spinner 1500ms infinite linear;
            -o-animation: spinner 1500ms infinite linear;
            animation: spinner 1500ms infinite linear;
            border-radius: 0.5em;
            -webkit-box-shadow: rgba(0, 0, 0, 0.75) 1.5em 0 0 0, rgba(0, 0, 0, 0.75) 1.1em 1.1em 0 0, rgba(0, 0, 0, 0.75) 0 1.5em 0 0, rgba(0, 0, 0, 0.75) -1.1em 1.1em 0 0, rgba(0, 0, 0, 0.5) -1.5em 0 0 0, rgba(0, 0, 0, 0.5) -1.1em -1.1em 0 0, rgba(0, 0, 0, 0.75) 0 -1.5em 0 0, rgba(0, 0, 0, 0.75) 1.1em -1.1em 0 0;
            box-shadow: rgba(0, 0, 0, 0.75) 1.5em 0 0 0, rgba(0, 0, 0, 0.75) 1.1em 1.1em 0 0, rgba(0, 0, 0, 0.75) 0 1.5em 0 0, rgba(0, 0, 0, 0.75) -1.1em 1.1em 0 0, rgba(0, 0, 0, 0.75) -1.5em 0 0 0, rgba(0, 0, 0, 0.75) -1.1em -1.1em 0 0, rgba(0, 0, 0, 0.75) 0 -1.5em 0 0, rgba(0, 0, 0, 0.75) 1.1em -1.1em 0 0;
        }

/* Animation */

@-webkit-keyframes spinner {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-moz-keyframes spinner {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-o-keyframes spinner {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes spinner {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}