﻿


/* https://projects.lukehaas.me/css-loaders/ */


.loader,
.loader:after {
  border-radius: 50%;
  width: 10em;
  height: 10em;
}
.loader {
  margin: 60px auto;
  font-size: 10px;
  position: relative;
  text-indent: -9999em;
  border-top: 1.1em solid rgba(238,162,80, 0.2);
  border-right: 1.1em solid rgba(238,162,80, 0.2);
  border-bottom: 1.1em solid rgba(238,162,80, 0.2);
  border-left: 1.1em solid #eea250;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation: load8 1.1s infinite linear;
  animation: load8 1.1s infinite linear;
}


.loader.littleFella,
.loader.littleFella:after {
  border-radius: 50%;
  width: 10px;
  height: 10px;
}

.loader.littleFella{
    border-top: 5px solid rgba(238,162,80, 0.2);
    border-right: 5px solid rgba(238,162,80, 0.2);
    border-bottom: 5px solid rgba(238,162,80, 0.2);
    border-left: 5px solid #eea250;
}
.loader.littleFella.inline{
    position: absolute;
    top: -19px;
    left: 8px;
    margin: 0px;
    padding: 0px;
}

@-webkit-keyframes load8 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes load8 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}


/*extra loader overrides*/

.loader {
    position: absolute;
    left: 50%;
    margin-top: 10%;
    margin-left: -60px;
}

.contentWithNoLeftNav .loader{
    position: absolute;
    left: 50%;
    margin-top: 10%;
    width: 100px;
    margin-left: -50px;
}

.loader.noMargin{
    position: relative;
    top: 0px;
    left: 0px;
    margin: 0px;
    padding: 0px;
}

        .modalLoadingContainer{
            position: absolute;
            left: 50%;
            margin-left: -63px;
            top: 38%;
        }

    .modal.collapsed .modalLoadingContainer {
        top: 28%;
    }

.fileActivityMessage{
    color: #eea250;
    font-size: 10px;
    position: relative;
    display: inline-block;
    top: 0px;
    margin: 0px;
    padding: 0px;
    overflow: hidden;
    margin-left: 15px;
    margin-bottom: 2px;
    text-decoration: none;
}


.miniButtonText {
    right: 0px;
    position: absolute;
    top: 0px;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 14px;
    cursor: pointer;
    color: #4673F3 !important;
}


.textbutton{
    background:none;
    color:#4673F3 !important;
    cursor:pointer;
}

.textbutton:hover{
    background:none;
    color:#eea250;
}

.textbutton:visited{
    background:none;
    color:#4673F3;
}

.miniButton {
    /*border: 1px rgb(223,223,223) solid;*/
    border: 1px transparent solid;
    background: rgb(223,223,223);
    color: #434F66 !important;
    /*padding: 0px 12px;*/
    display: inline-block;
    padding: 3px 10px;
    border-radius: 3px;
    margin: 0px;
    font-size: 13px;
    font-family: "Segoe UI";
    font-weight: 500;
    cursor: pointer;
}


.miniButton.needsToBeEnabled{
    opacity:0.5 !important;
}

.miniButton.needsToBeEnabled.isEnabled{
    opacity:1 !important;
}

    .miniButton.rightButton {
        float: right;
    }

    .miniButton.cancelButton {
        border: 1px #4673F3 solid !important;
        color: #4673F3 !important;
        background: white !important;
    }

    .miniButton.cancelButton:hover {
        color: #4673F3 !important;
        background: white !important;
        font-weight:bold;
    }

    .miniButton.leftButton {
        float: left;
    }

    .miniButton.redStyle {
        color: white !important;
        background: #de350b !important;
    }
        .miniButton.redStyle:hover {
            background: #eea250 !important;
        }

    .miniButton.primary, .miniButton.suggestedButton {
        background: #4673F3;
        color: white !important;
    }

    .miniButton.debug {
        background: #eea250;
        color: white !important;
    }

    .miniButton.signatureTokenButton {
        font-size: 14px;
        background: white;
        padding-bottom: 1px;
        position: relative;
        padding-top: 5px;
        margin-top: 0px;
        margin-bottom: 0px;
    }

        .miniButton.signatureTokenButton:hover {
            background: #e6e7e7;
            border-color: transparent;
            color: #999999 !important;
        }

    .miniButton span.signatureButtonTitle {
        top: 5px;
        position: absolute;
        left: 47px;
    }

    .miniButton.littleFella {
        font-size: 10px;
    }
    .miniButton.danger {
        background: #ee5050;
        color: white !important;
    }

    .miniButton.active {
        font-weight: bold;
    }

    .miniButton:hover {
        background: #eea250;
        border: 1px #eea250 solid;
        color: white !important;
    }

.button {
    border: 1px rgb(223,223,223) solid;
    background: rgb(223,223,223);
    color: #434F66;
    padding: 6px 12px;
    display: inline-block;
}

    .button.rightButton {
        float: right;
    }

    .button.suggestedButton {
        background: #4673F3;
        color: #fff;
    }



.ribbonButton {
    color: #eea250 !important;
    background: white;
    padding: 5px;
}

.toolbarActionButton {
    background: #374c56;
    border: 1px solid #dfe0e0;
    padding: 3px 9px;
    font-size: 14px;
    color: #fff;
}

    .toolbarActionButton:hover {
        background: #dfe0e0;
        border: 1px solid #374c56;
        color: #374c56;
    }


.handyAndy {
    cursor: pointer;
}

.offsetIconBy50:hover {
    background-position-x: -50px !important;
}

.help span.headericon {
    background: transparent url('img/sprite_topnavII.png') no-repeat left;
    padding-left: 20px;
    /*background-position-y: -222px;*/
    background-position: 0px -100px;
}

.notifications span.headericon {
    background: transparent url('img/sprite_topnavII.png') no-repeat left 2px;
    padding-left: 20px;
    /*background-position-y: -222px;*/
    background-position: 0px -51px;
}

.apps span.headericon {
    background: transparent url('img/sprite_topnavII.png') no-repeat left;
    padding-left: 20px;
    background-position: 0px -150px;
}

/* doc actions for search */

.miniButton > .icon {
    /*border:2px red solid;*/
    padding-left: 0px !important;
    padding-right: 25px;
}

.icon:hover {
    opacity: 0.7;
}

.icon.cross{
    opacity: 1;
    border-radius: 19px;
    padding-left: 11px;
    padding-bottom: 0px;
    padding-right: 8px;
    margin-left: 0px;
    padding-top: 0px;
    margin-right: 10px;
    background-position-x: 9px;
    background-position-y: -243px;
    background-color: rgb(243, 91, 94);
}

.icon.cross:hover{
    padding-right: 14px;
    color: white;
    text-transform:uppercase;
}

.icon.cross:hover::after{
    content:"Delete";
}



.icon.collapse {
    background: transparent url('img/sprite_optionsII.png') no-repeat left 2px;
    padding-left: 20px;
    background-position: 0px 2px;
}

    .icon.collapse:hover {
        opacity: 1;
    }

.icon.expand {
    background: transparent url('img/sprite_optionsII.png') no-repeat left 2px;
    padding-left: 20px;
    background-position: 0px -48px;
}

    .icon.expand:hover {
        opacity: 1;
    }

.icon.close:before {
    content: "x";
}

.icon.close {
    font-family: monospace;
    letter-spacing: 0px;
    cursor: pointer;
    background: #afafaf;
    border-radius: 30px;
    border: 1px solid #949494;
    color: #fff;
    font-size: 14px;
    padding: 7px;
    text-indent: 0!important;
    font-weight: bold;
    line-height: 0.5;
    position: absolute;
    padding-top: 6px;
}

.icon.close:hover{
    opacity:1;
}

.icon.signatureIcon {
    height: 22px;
    width: 22px;
    display: inline-block;
    background-size: 11px !important;
}

    .icon.signatureIcon.viewAllDocuments {
        background: transparent url('img/signing/iconAllDocuments.svg') no-repeat left 6px;
        background-position-x: 5px;
        background-position-y: 3px;
    }

    .icon.signatureIcon.viewAllDrafts {
        background: transparent url('img/signing/iconDraft.svg') no-repeat left 6px;
        background-position-x: 5px;
        background-position-y: 3px;
    }

    .icon.signatureIcon.viewCompleted {
        background: transparent url('img/signing/icon-Completed.svg') no-repeat left 6px;
        background-position-x: 5px;
        background-position-y: 3px;
    }

    .icon.signatureIcon.viewInProgress {
        background: transparent url('img/signing/icon-InProgress.svg') no-repeat left 6px;
        background-position-x: 5px;
        background-position-y: 3px;
    }

    .icon.signatureIcon.viewDeclined {
        background: transparent url('img/signing/iconDeclined.svg') no-repeat left 6px;
        background-position-x: 5px;
        background-position-y: 3px;
    }


    .icon.signature-actions-align-left {
        background: transparent url('img/signing/vertical-alignment.svg') no-repeat left 6px;
        background-position-x: 5px;
        background-position-y: 7px;
    }

.icon.signature-actions-align-top {
    background: transparent url('img/signing/horizontal-alignment.svg') no-repeat left 6px;
    background-position-x: 5px;
    background-position-y: 5px;
}

.icon.signature-actions-delete {
    background: transparent url('img/signing/delete.svg') no-repeat left 6px;
    background-position-x: 5px;
    background-position-y: 5px;
}

.icon.signature-zone-signature {
    background: transparent url('img/signing/iconSignature.svg') no-repeat left 6px;
    background-position-x: 5px;
    background-position-y: 5px;
}

.icon.signature-zone-initials {
    background: transparent url('img/signing/iconSFinitials.svg') no-repeat left 6px;
    background-position-x: 5px;
    background-position-y: 5px;
}

.icon.signature-zone-date {
    background: transparent url('img/signing/iconDateSigned.svg') no-repeat left 6px;
    background-position-x: 5px;
    background-position-y: 5px;
}

.icon.signature-zone-checkbox {
    background: transparent url('img/signing/iconCheckbox.svg') no-repeat left 6px;
    background-position-x: 5px;
    background-position-y: 5px;
}

.icon.signature-zone-name {
    background: transparent url('img/signing/iconFullName.svg') no-repeat left 6px;
    background-position-x: 5px;
    background-position-y: 5px;
    background-size: 9px !important;
}

.icon.signature-zone-note {
    background: transparent url('img/signing/iconNote.svg') no-repeat left 6px;
    background-position-x: 5px;
    background-position-y: 5px;
}

.icon.signature-zone-text {
    background: transparent url('img/signing/iconText.svg') no-repeat left 6px;
    background-position-x: 5px;
    background-position-y: 5px;
}

.icon.moreInfo:before {
    content: "...";
}

.icon.moreInfo {
    color: #5a5a5a;
    background: none;
    font-family: monospace;
    font-size: 16px;
    font-weight: bold;
    letter-spacing: -3px;
    margin: 0px;
    padding: 0px;
    cursor: pointer;
}

.icon.star {
    background: transparent url('img/sprite_optionsII.png') no-repeat left 2px;
    padding-left: 20px;
    background-position: 0px -100px;
}

    .icon.star.starOn {
        background-position-x: -50px;
    }

.icon.download {
    background: transparent url('img/sprite_optionsII.png') no-repeat left 2px;
    padding-left: 20px;
    background-position: 0px -148px;
}

.icon.download.blue{

    opacity: 1;
    border-radius: 19px;
    padding-left: 33px;
    padding-bottom: 8px;
    padding-top: 5px;

    background-position-x: -44px;
    background-position-y: -143px;
}

.icon.download.blue:hover{
    /*background-color: rgb(70, 115, 243);*/
    opacity: 1;
    border-radius: 19px;
    padding-left: 33px;
    padding-bottom: 8px;
    padding-top: 5px;

    background-position-y: -143px;
    background-position-x: 7px;
}

.icon.info{
    background: transparent url('img/sprite_topnav.png') no-repeat left 2px;
    padding-left: 0px;
    padding-right: 0px;
    margin-right: 0px;
    margin-left: 0px;
    padding-bottom: 10px;
    margin-bottom: -6px;
    width: 20px;
    height: 10px;
    background-position-x: -98px;
    background-position-y: -223px;
    display: inline-block;
}

.icon.search{
    background: transparent url('img/sprite_topnav.png') no-repeat left 2px;
    padding-left: 0px;
    padding-right: 0px;
    margin-right: 0px;
    margin-left: 0px;
    padding-bottom: 10px;
    margin-bottom: -6px;
    width: 20px;
    height: 10px;
    background-position-x: -98px;
    background-position-y: -200px;
    display: inline-block;
}

.icon.pin{
    background: transparent url('img/sprite_topnav.png') no-repeat left 2px;
    padding-left: 0px;
    padding-right: 0px;
    margin-right: 0px;
    margin-left: 0px;
    padding-bottom: 10px;
    margin-bottom: -6px;
    width: 20px;
    height: 10px;
    background-position-x: -98px;
    background-position-y: -173px;
    display: inline-block;
}

.icon.settings{
    background: transparent url('img/sprite_topnav.png') no-repeat left 2px;
    padding-left: 0px;
    padding-right: 0px;
    margin-right: 0px;
    margin-left: 0px;
    padding-bottom: 10px;
    margin-bottom: -6px;
    width: 20px;
    height: 10px;
    background-position-x: -98px;
    background-position-y: -148px;
    display: inline-block;
}

.icon.share {
    background: transparent url('img/sprite_optionsII.png') no-repeat left 2px;
    padding-left: 20px;
    padding-bottom: 2px;
    background-position: 0px -198px;
}

.icon.share.blue{
    opacity: 1;
    border-radius: 19px;
    padding-left: 33px;
    padding-bottom: 8px;
    padding-top: 5px;

    background-position-y: -192px;
    background-position-x: -43px;
}

.icon.share.blue:hover{
    /*background-color: rgb(70, 115, 243);*/
    opacity: 1;
    border-radius: 19px;
    background-position-y: -192px;
    background-position-x: 5px;
    padding-left: 33px;
    padding-bottom: 8px;
    padding-top: 5px;
}

.icon.edit {
    background: transparent url('img/sprite_optionsII.png') no-repeat left 2px;
    padding-left: 20px;
    background-position: 0px -248px;
    padding-bottom: 2px;
}

.icon.edit.blue{
    opacity: 1;
    border-radius: 19px;
    padding-left: 33px;
    padding-bottom: 8px;
    padding-top: 5px;

    background-position-x: -43px;
    background-position-y: -243px;
}

.icon.edit.blue:hover{
    /*background-color: rgb(70, 115, 243);*/
    opacity: 1;
    border-radius: 19px;
    background-position-y: -243px;
    background-position-x: 8px;
    padding-left: 33px;
    padding-bottom: 8px;
    padding-top: 5px;
}

.popDown.dropDown li .icon{
    margin-left: -15px;
    margin-right: 13px;
}


.icon.filetype{
    padding: 4px;
    font-size: 11px;
    color: white;
}


.icon.filetype.word{
    background-color: rgb(70, 115, 243);
}

.icon.filetype.word:after{
    content:"W";
}

.icon.filetype.excel{
    background-color: #63900d;
    padding-left: 6px;
    padding-right: 6px;
}

.icon.filetype.excel:after{
    content:"E";
}

.icon.filetype.powerpoint{
    background-color: rgb(249, 60, 79);
    padding-left: 6px;
    padding-right: 6px;
}

.icon.filetype.powerpoint:after{
    content:"P";
}

.icon.filetype.text{
    background-color: rgb(247, 127, 8);
    padding-left: 6px;
    padding-right: 6px;
}

.icon.filetype.text:after{
    content:"T";
}

.icon.filetype.onenote{
    background-color: rgb(119, 8, 247);
    padding-left: 5px;
    padding-right: 5px;
}

.icon.filetype.onenote:after{
    content:"O";
}

.icon.filetype.suitelink{
    background-color: #9dcc46;
    padding-left: 5px;
    padding-right: 5px;
}

.icon.filetype.suitelink:after{
    content:"L";
}

.icon.blue:hover{
    background-color: rgb(98, 199, 255); /*rgb(70, 115, 243);*/
    background-position-x: 0px;
    opacity: 1;
    border-radius: 10px;
}

.icon.archive {
    background: transparent url('img/sprite_optionsII.png') no-repeat left 2px;
    padding-left: 20px;
    background-position: 0px -300px;
}

.icon.move {
    background: transparent url('img/sprite_optionsII.png') no-repeat left 2px;
    padding-left: 20px;
    background-position: 0px -350px;
}

.icon.copy {
    background: transparent url('img/sprite_optionsII.png') no-repeat left 2px;
    padding-left: 20px;
    background-position: 0px -399px;
}

.icon.copy.blue{
    background-position: -50px -399px;
}

.icon.showInFolder {
    background: transparent url('img/sprite_optionsII.png') no-repeat left 2px;
    padding-left: 20px;
    background-position: 0px -449px;
}

.icon.next {
    background: transparent url('img/sprite_topnavII.png') no-repeat left 2px;
    padding-left: 20px;
    height: 20px;
    background-position-x: 7px;
    background-position-y: -597px;
}

.icon.previous {
    background: transparent url('img/sprite_topnavII.png') no-repeat left 2px;
    padding-left: 20px;
    height: 20px;
    background-position-x: 7px;
    background-position-y: -547px;
}

.icon.tick{
    background: transparent url('img/sprite_options.png') no-repeat left 2px;
    padding-left: 20px;
    background-position-x: 0px;
    background-position-y: -248px;
}

.icon.tick.viewSelectorTick{
    position: absolute;
    height: 15px;
    right: 10px;
    margin-top: 5px;
}

.icon.tick.inverse{
    opacity: 1;
    border-radius: 19px;
    padding-left: 33px;
    padding-bottom: 8px;
    padding-top: 5px;
    background-position-x: 9px;
    background-position-y: -243px;
    background-color: rgb(98, 199, 255);
}

.icon.tick.orange{
    background: transparent url('img/sprite_options.png') no-repeat left 2px;
    padding-left: 20px;
    background-position-x: -50px;
    background-position-y: -249px;
}

/* END doc actions for search */

.caret.icon {
    background: transparent url('img/sprite_topnavII.png') no-repeat left 2px;
    padding-left: 20px;
    background-position-x: 7px;
    background-position-y: -445px;
}

    .caret.icon:hover {
        opacity: 1;
    }

    .caret.icon.offset {
        background-position-y: -443px;
    }

    .caret.icon.reverseCaret {
        background: transparent url('img/sprite_topnavII.png') no-repeat left 2px;
        padding-left: 20px;
        background-position-x: 7px;
        background-position-y: -495px;
    }

.caret span.headericon {
    background: transparent url('img/sprite_topnavII.png') no-repeat left;
    padding-left: 20px;
    /*background-position-y: -222px;*/
    background-position: 0px -193px;
}

.icon.caret.white{
      background: transparent url('img/sprite_topnavII.png') no-repeat left;
    padding-left: 20px;
    /*background-position-y: -222px;*/
    background-position: 0px -195px;
}

.recent span.headericon {
    background: transparent url('img/sprite_topnavII.png') no-repeat left;
    padding-left: 20px;
    background-position: 0px 0px;
}

.settings span.headericon {
    background: transparent url('img/sprite_topnav.png') no-repeat left 2px;
    padding-left: 20px;
    /*background-position-y: -147px;*/
    background-position: -44px -47px; /*0px -147px;*/
}

.generator span.headericon {
    background: transparent url('img/sprite_topnav.png') no-repeat left 2px;
    padding-left: 20px;
    /*background-position-y: -122px;*/
    background-position: 0px -126px;
}
