/* buttons
------------------------------------------------*/

/* standard button */
.btn,
button.btn {
    transition: background-color 300ms ease-out;
    display: block;
    border-radius: 4px;
    float: left;
    background-repeat: no-repeat;
    position: relative;
}
.text-center .btn,
.text-center button.btn {
    float: none;
    display: inline-block;
}
/*.btn span { killing other styling */
/*    display: block;*/
/*    font-size: 11px;*/
/*    padding: 0 0 0 15px;*/
/*}*/
.btn span.jsCompareCount {
    display: inline;
    font-size: inherit;
    padding: 0 0 0 5px;
}
.btn:focus,
button:focus,
.btn:hover,
button:hover {
    text-decoration: none;
}

/* size */
.btn.btn-r-icon-only {
    padding: 17px 19px;
}
.btn.btn-l {
    padding: 11px 24px;
}
.btn.btn-m {
    padding: 10px 44px;
}
.btn.btn-r {
    padding: 10px 24px;
}
button.btn.btn-r {
    min-height: 35px;
}
.btn.btn-s {
    padding: 3px 15px;
}
.btn.btn-xs {
    padding: 5px 13px;
    line-height: 1.3em;
}

.full-width {
    width: 100%;
}

/* style */
.btn.solid:before {
    filter: invert(100%);
}
.btn.outline,
.btn.outline-accent {
    background-color: var(--color-ui-1);
    border: 1px solid var(--color-ui-200);
}
.btn.outline:hover:before,
.btn.outline-accent:hover:before {
    filter: invert(100%);
}
.btn.colour-outline,
.btn.colour-outline-accent {
    background-color: var(--color-ui-1);
    border: 1px solid var(--color-ui-200);
    color: var(--color-ui-200);
}

.btn.colour-outline:hover:before,
.btn.colour-outline-accent:hover:before {
    filter: invert(100%);
}
/* outline hover =======================*/
.btn.outline-hover {
    color: var(--color-ui-500);
}
.btn.outline-hover:before {
    filter: var(--filter-ui-500);
}
.btn.outline-hover:hover {
    color: var(--color-ui-800);
    background: #e5f2ff;
}
.btn.outline-hover:hover:before {
    filter: var(--filter-ui-800);
}

.btn.ico-left,
.btn.ico-right {
    position: relative;
}
.btn.ico-left:before,
.btn.ico-right:before,
.btn-r-icon-only:before {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
}
.btn-r-icon-only:before {
    left: 50%;
    transform: translate(-50%, -50%);
    margin: 0 !important;
}
.btn.ico-left:before {
    left: 16px;
}
.btn.ico-right:before {
    right: 16px;
}
.btn.btn-m.ico-left:before {
    left: 38px;
}
.btn.btn-m.ico-right:before {
    right: 38px;
}

.btn.btn-s.ico-left:before,
.btn.btn-s.ico-right:before {
    background-size: auto 10px;
}

.btn.but-link {
    background: inherit;
    border: none;
    color: var(--color-ui-500);
}
.btn.but-link:before {
    filter: var(--filter-ui-500);
}
.btn.but-link:hover {
    background: inherit;
    border: none;
    color: var(--color-ui-800);
}
.btn.but-link:hover:before {
    filter: var(--filter-ui-800);
}

.btn.but-link.btn-l {
    padding: 11px 0;
}
.btn.but-link.btn-r {
    padding: 7px 0;
}
.btn.but-link.btn-s {
    padding: 3px 0;
}

/* right arrow button -------------------------*/
.btn.btn-arrow-right:before {
    background: url(/resources/images/buttons/next-arrow.svg) 0 50% no-repeat;
    height: 14px;
    width: 9px;
    margin-top: -7px;
}
.btn.btn-arrow-right.ico-left {
    padding-left: 34px;
}
.btn.btn-arrow-right.ico-right {
    padding-right: 34px;
}
.btn.btn-r.btn-arrow-right:before {
    background-size: auto 12px;
    background-position: 0 1px;
}
.outline-hover:before {
    filter: var(--filter-ui-500);
}

/* left arrow button -----------------------*/
.btn.btn-arrow-left:before {
    background: url(/resources/images/buttons/back-arrow.svg) 0 0 no-repeat;
    height: 14px;
    width: 9px;
    margin-top: -7px;
}
.btn.btn-arrow-left.ico-left {
    padding-left: 34px;
}
.btn.btn-arrow-left.ico-right {
    padding-right: 34px;
}
.btn.btn-m.btn-arrow-left.ico-left {
    padding-left: 60px;
}
.btn.btn-m.btn-arrow-right.ico-right {
    padding-right: 60px;
}
.btn.btn-r.btn-arrow-left:before {
    background-size: auto 12px;
    background-position: 0 1px;
}
.btn.btn-toggle-nav-left:before {
    background: url(/resources/images/icons/sub-nav-more.svg) 0 0 no-repeat;
    background-size: auto 14px;
    height: 14px;
    width: 9px;
    margin-top: -7px;
}
.btn.btn-toggle-nav-left.ico-left {
    padding-left: 31px;
    color: var(--color-brand-700);
}
.btn-toggle-nav-left .closed {
    display: none;
}
.btn-toggle-nav-left.toggled .closed {
    display: block;
}
.btn-toggle-nav-left.toggled .open {
    display: none;
}

/* camera button -----------------------*/
.btn.btn-camera:before {
    background: url(/resources/images/buttons/camera.svg) 0 0 no-repeat;
    height: 18px;
    width: 18px;
    margin-top: -9px;
    background-size: 18px auto;
}
.btn.btn-camera.ico-left {
    padding-left: 44px;
}
.btn.btn-m.btn-camera.ico-left {
    padding-left: 66px;
}
.btn.btn-camera.ico-right {
    padding-right: 44px;
}

/* button cross ---------------------------*/
.btn.btn-cross:before {
    background: url(../images/buttons/cross.svg) 0 0 no-repeat;
    height: 12px;
    width: 12px;
    margin-top: -6px;
}
.btn.btn-cross.ico-left {
    padding-left: 37px;
}
.btn.btn-cross.ico-right {
    padding-right: 37px;
}

/* tick --------------------*/
.btn.btn-tick:before {
    background: url(/resources/images/buttons/save-search-tick.svg) 0 0 no-repeat;
    height: 12px;
    width: 14px;
    margin-top: -6px;
}
.btn.btn-tick.ico-left {
    padding-left: 39px;
}
.btn.btn-tick.ico-right {
    padding-right: 39px;
}

/* expand --------------------*/
.btn.btn-expand:before {
    background: url(/resources/images/buttons/expand.svg?v=2) 0 0 no-repeat;
    height: 16px;
    width: 16px;
    margin-top: -7px;
}
.btn.btn-expand.ico-left {
    padding-left: 43px;
}
.btn.btn-expand.ico-right {
    padding-right: 43px;
}

/* compress --------------------*/
.btn.btn-compress:before {
    background: url(/resources/images/buttons/compress.svg) 0 0 no-repeat;
    height: 16px;
    width: 16px;
    margin-top: -7px;
}
.btn.btn-compress.ico-left {
    padding-left: 43px;
}
.btn.btn-compress.ico-right {
    padding-right: 43px;
}

/* button add ----------------------*/
.btn.btn-add:before {
    background: url(/resources/images/buttons/add.svg) 0 0 no-repeat;
    width: 14px;
    height: 14px;
    margin-top: -7px;
}
.btn.btn-add.ico-left {
    padding-left: 39px;
}
.btn.btn-add.ico-right {
    padding-right: 39px;
}

/* remove button ----------------------*/
.btn.btn-remove:before {
    background: url(/resources/images/buttons/remove.svg) 0 0 no-repeat;
    width: 14px;
    height: 14px;
    margin-top: -7px;
}
.btn.btn-remove.ico-left {
    padding-left: 39px;
}
.btn.btn-remove.ico-right {
    padding-right: 39px;
}

/* button view --------------------------*/
.btn.btn-view:before {
    background: url(/resources/images/buttons/view.svg) 0 0 no-repeat;
    width: 16px;
    height: 14px;
    margin-top: -7px;
}
.btn.btn-view.ico-left {
    padding-left: 41px;
}
.btn.btn-view.ico-right {
    padding-right: 41px;
}

.btn.btn-s.btn-view.ico-left:before,
.btn.btn-s.btn-view.ico-right:before {
    background-size: auto 15px;
    margin-top: -8px;
}

/* button edit -------------------------------*/
.btn.btn-edit:before {
    background: url(/resources/images/buttons/edit.svg) no-repeat;
    width: 12px;
    height: 12px;
    margin-top: -6px;
}
.btn.btn-edit.ico-left {
    padding-left: 38px;
}
.btn.btn-edit.ico-right {
    padding-right: 38px;
}
.btn.btn-edit.btn-s.ico-left {
    padding-left: 27px;
}
.btn.btn-edit.btn-s.ico-left:before {
    left: 10px;
    margin-top: -5px;
}

/* compare button ---------------------------*/
.btn.btn-compare:before {
    background: url(../images/buttons/compare.svg) 0 0 no-repeat;
    height: 18px;
    width: 18px;
    margin-top: -9px;
}
.btn.btn-compare.ico-left {
    padding-left: 43px;
}
.btn.btn-compare.ico-right {
    padding-right: 43px;
}

.btn.btn-compare.ico-left.compareYachtsButtonbtn {
    padding-left: 64px;
}

.small-options-container .btn.btn-compare {
    height: 20px;
    width: 20px;
    padding: 0;
    float: right;
}
.small-options-container .btn.btn-compare:hover {
    background: none;
}
.small-options-container .btn.btn-compare:before {
    background: url(../images/buttons/compare.svg) center center no-repeat;
    position: absolute;
    top: 2px;
    left: 2px;
    margin-top: 0;
}
.small-options-container .btn.btn-compare:hover:before {
    filter: var(--color-accent-400-filter);
}

/* save button ---------------------*/
.btn.btn-save:before {
    background: url(../images/buttons/save-search-tick.svg) 0 0 no-repeat;
    height: 12px;
    width: 14px;
    margin-top: -6px;
}
.btn.btn-save.ico-left {
    padding-left: 41px;
}
.btn.btn-save.ico-right {
    padding-right: 41px;
}

.btn.btn-s.btn-save {
    padding-left: 30px;
}
.btn.btn-s.btn-save:before {
    margin-top: -5px;
    left: 12px;
}

/* to make the button green add the class .btn-save-green colour in the theme */

/* shortlist button -------*/
.btn.btn-shortlist:before {
    background: url(../images/buttons/shortlist.svg) 0 0 no-repeat;
    height: 16px;
    width: 16px;
    margin-top: -8px;
}
.btn.btn-shortlist.ico-left,
.btn.btn-shortlist.ico-left.onShortlist {
    padding-left: 42px;
}
.btn.btn-shortlist.ico-right,
.btn.btn-shortlist.ico-right.onShortlist {
    padding-right: 42px;
}

@media screen and (max-width: 640px) {
    .btn.btn-shortlist.extended-fleet-btn {
        text-indent: 0;
        padding-left: 39px;
    }
    .btn.btn-shortlist.extended-fleet-btn:before {
        margin-top: -7px;
        background-size: auto 14px;
    }
}

/* shortlit new ---------------------*/
.btn-shortlist-new:before {
    content: "";
    background: url("/resources/images/icons/header-favorites.svg") 0 0 no-repeat;
    height: 17px;
    width: 20px;
    margin-top: -9px;
    background-size: 18px auto;
}
.btn.btn-shortlist-new.ico-left,
.btn.btn-shortlist-new.ico-left.onShortlist {
    padding-left: 42px;
}
.btn.btn-shortlist-new.ico-right,
.btn.btn-shortlist-new.ico-right.onShortlist {
    padding-right: 42px;
}
.btn-shortlist-new:hover:before,
.btn-shortlist-new.active:before {
    background: url("/resources/images/icons/favorites-red.svg") 0 0 no-repeat;
    /*background-size: 14px auto;*/
    opacity: 1;
}
.btn-shortlist-new.active:before {
    filter: none;
}
.btn-shortlist-new,
.theme .searchResults .result .resultDetails a.btn-shortlist-new {
    color: var(--color-ui-500);
    float: right;
}
.theme .searchResults .result .resultDetails a.btn-shortlist-new.active,
.theme .searchResults .result .resultDetails a.btn-shortlist-new:hover {
    color: var(--color-brand-700);
}
.btn-shortlist-new.ico-right {
    padding-right: 41px;
}

.add-copy .btn-shortlist-new:after {
    content: "Shortlist";
}

.dropdown-pane-wrap .btn-shortlist-new {
    margin-top: 0;
}

.small-options-container .btn.addShortlist {
    height: 20px;
    width: 20px;
    float: right;
    padding: 0;
}
.small-options-container .btn.addShortlist:hover {
    background: none;
}
.small-options-container .btn.addShortlist:before {
    margin: 0;
    top: 2px;
    left: 0;
    height: 20px;
    width: 20px;
    background-position: center center;
}

@media screen and (max-width: 640px) {
    .add-copy .btn-shortlist-new:after {
        content: "Shortlist";
        position: relative;
        top: -5px;
    }
    .add-copy .btn.btn-shortlist-new.ico-left {
        padding-left: 28px;
    }
    .add-copy .btn.btn-shortlist-new.ico-left:before {
        left: 0;
    }

    .list-view.brokerage-table tbody tr td.shortlist a.btn.btn-shortlist-new.ico-left:after {
        top: -1px;
    }

    .small-options-container .btn.addShortlist {
        text-indent: -9999px;
    }
}

/* download button -------*/
.btn.btn-download:before {
    background: url(../images/buttons/download.svg) 0 0 no-repeat;
    height: 14px;
    width: 12px;
    margin-top: -7px;
}
.btn.btn-download.ico-left {
    padding-left: 37px;
}
.btn.btn-download.ico-right {
    padding-right: 37px;
}

/* upload button -------*/
.btn.btn-upload:before {
    background: url(/resources/images/buttons/upload.svg) 0 0 no-repeat;
    height: 14px;
    width: 12px;
    margin-top: -7px;
}
.btn.btn-upload.ico-left {
    padding-left: 37px;
}
.btn.btn-upload.ico-right {
    padding-right: 37px;
}

/* search button -------*/
.btn.btn-search:before {
    background: url(/resources/images/buttons/search.svg) 0 0 no-repeat;
    height: 16px;
    width: 16px;
    margin-top: -8px;
}
.btn.btn-search.ico-left {
    padding-left: 42px;
}
.btn.btn-search.ico-right {
    padding-right: 42px;
}

/* advanced search button -------*/
.btn.btn-search-advanced:before {
    background: url(/resources/images/buttons/advanced-search.svg) 0 0 no-repeat;
    height: 18px;
    width: 18px;
    margin-top: -9px;
}
.btn.btn-search-advanced.ico-left {
    padding-left: 44px;
}
.btn.btn-search-advanced.ico-right {
    padding-right: 44px;
}

/* duplicate shortlist button -------*/
.btn.btn-duplicate:before {
    background: url(../images/buttons/duplicate.svg) 0 0 no-repeat;
    height: 16px;
    width: 15px;
    margin-top: -8px;
}
.btn.btn-duplicate.ico-left {
    padding-left: 40px;
}
.btn.btn-duplicate.ico-right {
    padding-right: 40px;
}

/* broker button -------*/
.btn.btn-broker:before {
    background: url(../images/buttons/broker.svg) 0 0 no-repeat;
    height: 16px;
    width: 16px;
    margin-top: -8px;
}
.btn.btn-broker.ico-left {
    padding-left: 41px;
}
.btn.btn-broker.ico-right {
    padding-right: 41px;
}

/* pdf button -------*/
.btn.btn-pdf:before {
    background: url(../images/buttons/download-pdf.svg) 0 0 no-repeat;
    height: 16px;
    width: 15px;
    margin-top: -8px;
}
.btn.btn-pdf.ico-left {
    padding-left: 40px;
}
.btn.btn-pdf.ico-right {
    padding-right: 40px;
}

/* update --------------------*/
.btn.btn-update:before {
    background: url(../images/buttons/news-refresh.svg) 0 0 no-repeat;
    height: 16px;
    width: 16px;
    margin-top: -7px;
}
.btn.btn-update.ico-left {
    padding-left: 41px;
}
.btn.btn-update.ico-right {
    padding-right: 41px;
}

/* external links --------------*/
.btn.btn-external:before {
    background: url("/resources/images/buttons/external-link.svg") 0 0 no-repeat;
    height: 14px;
    width: 14px;
    margin-top: -7px;
}
.btn.btn-external.ico-left {
    padding-left: 44px;
}
.btn.btn-external.ico-right {
    padding-right: 44px;
}
.btn.btn-xs.btn-external.ico-left {
    padding-left: 33px;
}
.btn.btn-xs.btn-external:before {
    background-size: auto 12px;
    left: 12px;
}

/* compress -------*/
.btn.btn-compress:before {
    background: url(../images/buttons/compress.svg) 0 0 no-repeat;
    height: 16px;
    width: 16px;
    margin-top: -8px;
}
.btn.btn-compress.ico-left {
    padding-left: 41px;
}
.btn.btn-compress.ico-left:before {
    left: 14px;
}
.btn.btn-compress.ico-right {
    padding-right: 41px;
}
.btn.btn-compress.ico-right:before {
    right: 14px;
}

/* import -------*/
.btn.btn-import:before {
    background: url(../images/buttons/import.svg) 0 0 no-repeat;
    height: 14px;
    width: 16px;
    margin-top: -7px;
}
.btn.btn-import.ico-left {
    padding-left: 40px;
}
.btn.btn-import.ico-right {
    padding-right: 40px;
}

/* email & webapp -------*/
.btn.btn-webapp:before {
    background: url(../images/buttons/email-app.svg) 0 0 no-repeat;
    height: 16px;
    width: 14px;
    margin-top: -8px;
}
.btn.btn-webapp.ico-left {
    padding-left: 37px;
}
.btn.btn-webapp.ico-right {
    padding-right: 37px;
}

/* load -------*/
.btn.btn-load:before {
    background: url(../images/buttons/load.svg) 0 0 no-repeat;
    height: 16px;
    width: 14px;
    margin-top: -8px;
}
.btn.btn-load.ico-left {
    padding-left: 38px;
}
.btn.btn-load.ico-right {
    padding-right: 38px;
}

/* apply / load & apply  -------*/
.btn.btn-apply:before {
    background: url(../images/buttons/apply.svg) 0 0 no-repeat;
    height: 18px;
    width: 18px;
    margin-top: -9px;
}
.btn.btn-apply.ico-left {
    padding-left: 42px;
}
.btn.btn-apply.ico-right {
    padding-right: 42px;
}

/* generate ai  -------*/
.btn.btn-generate:before {
    background: url(../images/buttons/generate.svg) 0 0 no-repeat;
    height: 16px;
    width: 21px;
    margin-top: -8px;
}
.btn.btn-generate.ico-left {
    padding-left: 45px;
}
.btn.btn-generate.ico-right {
    padding-right: 45px;
}

/* generate ai copy -------*/
.btn.btn-generate-copy:before {
    background: url(../images/buttons/generate-text.svg) 0 0 no-repeat;
    height: 16px;
    width: 21px;
    margin-top: -8px;
}
.btn.btn-generate-copy.ico-left {
    padding-left: 45px;
}
.btn.btn-generate-copy.ico-right {
    padding-right: 45px;
}

/* copy link  -------*/
.btn.btn-link:before {
    background: url(../images/buttons/copy-link.svg) 0 0 no-repeat;
    height: 16px;
    width: 16px;
    margin-top: -8px;
}
.btn.btn-link.ico-left {
    padding-left: 41px;
}
.btn.btn-link.ico-right {
    padding-right: 41px;
}

/* facts --------------------*/
.btn.btn-facts:before {
    background: url(../images/buttons/facts.svg) 0 0 no-repeat;
    height: 14px;
    width: 14px;
    margin-top: -7px;
}
.btn.btn-facts.ico-left {
    padding-left: 39px;
}
.btn.btn-facts.ico-right {
    padding-right: 39px;
}

/* download PDF button -------*/
.btn.btn-download-pdf:before {
    background: url(../images/buttons/download-pdf.svg) 0 0 no-repeat;
    height: 14px;
    width: 16px;
    margin-top: -7px;
}
.btn.btn-download-pdf.ico-left {
    padding-left: 39px;
}
.btn.btn-download-pdf.ico-left:before {
    left: 18px;
}
.btn.btn-download-pdf.ico-right {
    padding-right: 39px;
}
.btn.btn-download-pdf.ico-right:before {
    right: 18px;
}

/* fleet button -------*/
.btn.btn-fleet:before {
    background: url(../images/buttons/fleet.svg) 0 0 no-repeat;
    height: 18px;
    width: 16px;
    margin-top: -9px;
}
.btn.btn-fleet.ico-left {
    padding-left: 44px;
}
.btn.btn-fleet.ico-left:before {
    left: 18px;
}
.btn.btn-fleet.ico-right {
    padding-right: 44px;
}
.btn.btn-fleet.ico-right:before {
    right: 18px;
}

/* model button -------*/
.btn.btn-model:before {
    background: url(../images/buttons/models.svg) 0 0 no-repeat;
    height: 16px;
    width: 14px;
    margin-top: -8px;
}
.btn.btn-model.ico-left {
    padding-left: 39px;
}
.btn.btn-model.ico-right {
    padding-right: 39px;
}

/* historic button -------*/
.btn.btn-history:before {
    background: url(../images/buttons/historic.svg) 0 0 no-repeat;
    height: 16px;
    width: 15px;
    margin-top: -8px;
}
.btn.btn-history.ico-left {
    padding-left: 40px;
}
.btn.btn-history.ico-right {
    padding-right: 40px;
}

/* statistics button -------*/
.btn.btn-statistics:before {
    background: url(../images/buttons/statistics.svg) 0 0 no-repeat;
    height: 18px;
    width: 17px;
    margin-top: -9px;
}
.btn.btn-statistics.ico-left {
    padding-left: 42px;
}
.btn.btn-statistics.ico-right {
    padding-right: 42px;
}

/* contact button -------*/
.btn.btn-contact:before {
    background: url(../images/buttons/contact.svg) 0 0 no-repeat;
    height: 18px;
    width: 17px;
    margin-top: -9px;
}
.btn.btn-contact.ico-left {
    padding-left: 44px;
}
.btn.btn-contact.ico-right {
    padding-right: 44px;
}

/* contact refresh ---------------*/
.btn.btn-refresh:before {
    background: url(../images/buttons/news-refresh.svg) 0 0 no-repeat;
    height: 16px;
    width: 16px;
    left: 12px;
    margin-top: -8px;
}
.btn.btn-refresh {
    position: relative;
    width: 42px;
    height: 42px;
    padding: 0;
    display: block;
}

/* view website -------*/
.btn.btn-website:before {
    background: url(../images/buttons/website.svg) 0 0 no-repeat;
    height: 16px;
    width: 16px;
    margin-top: -8px;
}
.btn.btn-website.ico-left {
    padding-left: 44px;
}
.btn.btn-website.ico-left:before {
    left: 18px;
}
.btn.btn-website.ico-right {
    padding-right: 44px;
}
.btn.btn-website.ico-right:before {
    right: 18px;
}

/* facebook -------*/
.btn.btn-facebook:before {
    background: url(../images/buttons/facebook.svg) 0 0 no-repeat;
    height: 18px;
    width: 9px;
    margin-top: -9px;
}
.btn.btn-facebook.ico-left {
    padding-left: 34px;
}
.btn.btn-facebook.ico-right {
    padding-right: 34px;
}

/* X (previously twitter) -------*/
.btn.btn-twitter:before {
    background: url(../images/buttons/x.svg) 0 0 no-repeat;
    height: 18px;
    width: 18px;
    margin-top: -9px;
}
.btn.btn-twitter.ico-left {
    padding-left: 43px;
}
.btn.btn-twitter.ico-right {
    padding-right: 43px;
}

/* email -------*/
.btn.btn-email:before {
    background: url(../images/buttons/email.svg) 0 0 no-repeat;
    height: 21px;
    width: 18px;
    margin-top: -9px;
}
.btn.btn-email.ico-left {
    padding-left: 43px;
}
.btn.btn-email.ico-right {
    padding-right: 43px;
}
/* phone -------*/
.btn.btn-phone:before {
    background: url(../images/buttons/phone.svg) 0 0 no-repeat;
    height: 21px;
    width: 18px;
    margin-top: -9px;
}
.btn.btn-phone.ico-left {
    padding-left: 43px;
}
.btn.btn-phone.ico-right {
    padding-right: 43px;
}

/* meeting -------*/
.btn.btn-meeting:before {
    background: url(../images/buttons/meeting.svg) 0 0 no-repeat;
    height: 21px;
    width: 18px;
    margin-top: -9px;
}
.btn.btn-meeting.ico-left {
    padding-left: 43px;
}
.btn.btn-meeting.ico-right {
    padding-right: 43px;
}

/* forbes -------*/
.btn.btn-forbes:before {
    background: url(../images/buttons/forbes.svg) 0 0 no-repeat;
    height: 21px;
    width: 18px;
    margin-top: -9px;
}
.btn.btn-forbes.ico-left {
    padding-left: 43px;
}
.btn.btn-forbes.ico-right {
    padding-right: 43px;
}
/* zillow -------*/
.btn.btn-zillow:before {
    background: url(../images/buttons/zillow.svg) 0 0 no-repeat;
    height: 20px;
    width: 18px;
    margin-top: -9px;
}
.btn.btn-zillow.ico-left {
    padding-left: 43px;
}
.btn.btn-zillow.ico-right {
    padding-right: 43px;
}

/* wikipedia -------*/
.btn.btn-wikipedia:before {
    background: url(../images/buttons/wikipedia.svg) 0 0 no-repeat;
    height: 18px;
    width: 28px;
    margin-top: -9px;
}
.btn.btn-wikipedia.ico-left {
    padding-left: 43px;
}
.btn.btn-wikipedia.ico-right {
    padding-right: 43px;
}

/* instagram -------*/
.btn.btn-instagram:before {
    background: url(../images/buttons/intsagram.svg) 0 0 no-repeat;
    height: 18px;
    width: 18px;
    margin-top: -9px;
}
.btn.btn-instagram.ico-left {
    padding-left: 43px;
}
.btn.btn-instagram.ico-right {
    padding-right: 43px;
}

/* flickr -------*/
.btn.btn-flickr:before {
    background: url(../images/buttons/flickr.svg) 0 0 no-repeat;
    height: 18px;
    width: 18px;
    margin-top: -9px;
}
.btn.btn-flickr.ico-left {
    padding-left: 43px;
}
.btn.btn-flickr.ico-right {
    padding-right: 43px;
}

/* linkedin -------*/
.btn.btn-linkedin:before {
    background: url(../images/buttons/linkedin.svg) 0 0 no-repeat;
    height: 18px;
    width: 18px;
    margin-top: -9px;
}
.btn.btn-linkedin.ico-left {
    padding-left: 43px;
}
.btn.btn-linkedin.ico-right {
    padding-right: 43px;
}

/* tripadvisor -------*/
.btn.bth-tripadvisor:before {
    background: url(../images/buttons/tripadvisor.svg) 0 0 no-repeat;
    height: 18px;
    width: 23px;
    margin-top: -9px;
}
.btn.btn-tripadvisor.ico-left {
    padding-left: 46px;
}
.btn.btn-tripadvisor.ico-right {
    padding-right: 46px;
}

/* vimeo -------*/
.btn.btn-vimeo:before {
    background: url(../images/buttons/vimeo.svg) 0 0 no-repeat;
    height: 18px;
    width: 23px;
    margin-top: -9px;
}
.btn.btn-vimeo.ico-left {
    padding-left: 43px;
}
.btn.btn-vimeo.ico-right {
    padding-right: 43px;
}

/* youTube -------*/
.btn.btn-youtube:before {
    background: url(../images/buttons/youtube.svg) 0 0 no-repeat;
    height: 18px;
    width: 26px;
    margin-top: -9px;
}
.btn.btn-youtube.ico-left {
    padding-left: 51px;
}
.btn.btn-youtube.ico-right {
    padding-right: 51px;
}

/* tiktok -------*/
.btn.btn-tiktok:before {
    background: url(../images/buttons/tiktok.svg) 0 0 no-repeat;
    height: 18px;
    width: 16px;
    margin-top: -9px;
}
.btn.btn-tiktok.ico-left {
    padding-left: 44px;
}
.btn.btn-tiktok.ico-right {
    padding-right: 44px;
}

/* 2fa -------*/
.btn.btn-2fa:before {
    background: url(../images/buttons/two-fa.svg) 0 0 no-repeat;
    height: 16px;
    width: 16px;
    margin-top: -8px;
}
.btn.btn-2fa.ico-left {
    padding-left: 42px;
}
.btn.btn-2fa.ico-right {
    padding-right: 42px;
}

/* save changes button ------*/
button {
    cursor: pointer;
}
.saveButton span {
    height: 35px;
    line-height: 35px;
    display: block;
    background-image: url(/resources/images/buttons/save-search-tick-green.svg);
    background-position: 10px 0;
    background-repeat: no-repeat;
    padding: 0 0 0 37px;
}
.saveButton:hover span {
    background-position: 10px -35px;
}

/* search button ------------*/
.search-button {
    background-image: url(/resources/images/button_ico-search.svg);
    background-position: 12px 50%;
    padding-left: 40px;
}
.search-button:hover {
    background-position: 12px 50%;
}

/* advanced search --------*/
.advanced-search {
    position: relative;
    padding-left: 44px;
}
.advanced-search:before {
    background: url(/resources/images/icons/button_advanced-search.svg) 0 0 no-repeat;
    display: block;
    content: "";
    height: 18px;
    width: 18px;
    position: absolute;
    top: 8px;
    left: 16px;
}
.advanced-search:hover:before {
    background-position: 0 -18px;
}

/* add note button ------*/
.addNoteButton {
}

/* add notes small ---------*/
.buttonAddNoteS span {
    background: url(/resources/images/button_ico-notes-hover-sm.svg) 0 0 no-repeat;
    padding: 0 0 0 18px;
    margin: 0 0 0 10px;
}
.buttonAddNoteS:hover span {
    background-position: 0 -22px;
}

/* tick button -----*/
.btn.outline.tick-button {
    background: url(../images/icons/button-select-icon.svg) 16px 5px no-repeat #fff;
    padding-left: 37px;
}
.btn.outline.tick-button:hover,
.btn.outline.tick-button.active,
.btn.outline.tick-button.active:hover {
    background: url(../images/icons/button-select-icon.svg) 16px -20px no-repeat #0093ee;
    color: #fff;
    border: 1px solid #0093ee;
}

.btn.outline.tick-button.tick-small {
    line-height: 28px;
    padding-left: 33px;
    background-position: 13px 1px;
}
.btn.outline.tick-button.tick-small:hover,
.btn.outline.tick-button.tick-small.active,
.btn.outline.tick-button.tick-small.active:hover {
    background-position: 13px -24px;
}

.section-ourphotos .add-button,
.section-myphotos .add-button,
.section-photo-yachtshow .add-button,
.section-photo-shortlist .add-button {
    margin: 20px 0 0 0;
}

.section-ourphotos .btn.view-button,
.section-myphotos .btn.view-button {
    margin: 20px 0 0 0;
}

.btn.edit-button.bookmark-edit,
.btn.edit-button.contacts-edit {
    float: right;
    margin: 16px 20px 0 0;
}
.btn.right-aligned {
    float: right;
}

.btn.pdf-button,
.btn.doc-button,
.btn.ocx-button,
.btn.xsl-button,
.btn.lsx-button,
.btn.ods-button,
.btn.odt-button {
    font-size: 13px;
    font-family: "Inter", Arial, Helvetica, sans-serif;
    font-weight: 500;
    color: #0093ee;
    padding: 0 16px 0 36px;
    position: relative;
    border: 1px solid #e2eaef;
    line-height: 34px;
    background: #fff;
}
.btn.pdf-button:before {
    content: "";
    background: url(/resources/images/icons/pdf.svg) no-repeat;
    width: 15px;
    height: 16px;
    position: absolute;
    top: 9px;
    left: 13px;
    background-size: 43px auto;
}
.btn.doc-button:before,
.btn.ocx-button:before {
    /*docx*/
    content: "";
    background: url(/resources/images/icons/doc.svg) no-repeat;
    width: 18px;
    height: 21px;
    position: absolute;
    top: 7px;
    left: 11px;
    background-size: 58px auto;
}

.btn.xsl-button:before {
    content: "";
    background: url(/resources/images/icons/xsl.svg) no-repeat;
    width: 18px;
    height: 21px;
    position: absolute;
    top: 7px;
    left: 11px;
    background-size: 58px auto;
}

.btn.lsx-button:before {
    /*xlsx*/
    content: "";
    background: url(/resources/images/icons/xlsx.svg) no-repeat;
    width: 18px;
    height: 21px;
    position: absolute;
    top: 7px;
    left: 11px;
    background-size: 58px auto;
}

.btn.pdf-button:hover,
.btn.doc-button:hover,
.btn.ocx-button:hover,
.btn.xsl-button:hover,
.btn.lsx-button:hover,
.btn.ods-button:hover,
.btn.odt-button:hover {
    color: #fff;
    border: 1px solid #0093ee;
    background-color: #0093ee;
}
.btn.pdf-button:hover:before {
    background-position: -25px 0;
}
.btn.doc-button:hover:before,
.btn.ocx-button:hover:before,
.btn.xsl-button:hover:before,
.btn.lsx-button:hover:before,
.btn.ods-button:hover:before,
.btn.odt-button:hover:before {
    background-position: -34px 0;
}

/* visit website
--------------------------------------------------------*/
.visit-website {
    font-weight: 500;
    position: relative;
    padding-left: 42px;
}
.visit-website:before {
    display: block;
    content: "";
    width: 46px;
    height: 23px;
    background: url(/resources/images/icons/button_show-site.svg) 0 0 no-repeat;
    top: 9px;
    left: 12px;
    position: absolute;
}
.visit-website:hover:before {
    background-position: 0 -35px;
}

/* shortlist all ---------*/
.shortlist-all {
    position: relative;
    padding-left: 40px;
}
.shortlist-all:before {
    background: url(../images/icons/button-create-shortlist.svg) 0 -9px no-repeat;
    top: 8px;
    left: 14px;
    position: absolute;
    display: block;
    content: "";
    height: 20px;
    width: 20px;
}
.shortlist-all:hover:before {
    background-position: 0 -44px;
}

/*.notifications-btn
------------------------------------------------*/
.apps-btn,
.favourites-btn {
    width: 50px;
    height: 50px;
    float: right;
    cursor: pointer;
    transition: opacity 100ms linear;
    margin-right: 5px;
    margin-top: 10px;
}
/*.notifications-btn {*/
/*    background: url(/resources/images/icons/bell.svg) 50% 50% no-repeat;*/
/*    background-size: 18px auto;*/
/*}*/
.apps-btn {
    background: url(/resources/images/icons/apps.svg) 50% 50% no-repeat;
    background-size: 20px auto;
}
.favourites-btn {
    background: url(/resources/images-maby/heart-white.svg) 50% 50% no-repeat;
    background-size: 20px auto;
}
@media screen and (max-width: 640px) {
    header .favourites-btn {
        background: none;
    }
}

/*.notifications-btn:hover,*/
.apps-btn:hover {
    opacity: 0.8;
}

/* delete button */
.btn.button-delete {
    position: relative;
    padding-left: 34px;
}
.btn.button-delete:before {
    content: "";
    display: block;
    background: url(/resources/images/buttons/delete.svg) 0 0 no-repeat;
    height: 12px;
    width: 12px;
    position: absolute;
    top: 50%;
    left: 16px;
    margin-top: -5px;
    background-size: 10px auto;
}

/* profile buttons
----------------------------------------------*/
.profile-btn {
    float: right;
    cursor: pointer;
    transition: opacity 100ms linear;
    margin: 10px 5px 0 10px;
    display: flex;
    /*max-width: 165px;*/
    position: relative;
    width: 94px;
    border: 1px solid #fff;
    border-radius: 40px;
}
.profile-btn .menu-icon-rhs {
    flex: 0 0 50px;
    height: 48px;
    background: url(/resources/images/main-menu/menu-icon-rhs.svg?v=3) 17px 14px no-repeat;
    border: none;
    border-radius: 0;
    text-align: left;
    padding: 0;
    border: 0;
    transition: opacity 75ms linear;
    background-color: transparent;
    background-size: 22px auto;
}
.profile-btn:hover .menu-icon-rhs {
    opacity: 0.8;
}
.profile-btn .image-profile {
    flex: 0 0 36px;
    overflow: hidden;
    border-radius: 100%;
    border: 2px solid #fff;
    width: 36px;
    height: 36px;
    margin: 6px 0 0 0;
}
.profile-btn .profile-name {
    flex: 0 1 auto;
    color: #fff;
    font-size: 14px;
    line-height: 1.3em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 125px;
    padding: 9px 24px 0 10px;
    position: relative;
}
.profile-btn .profile-name:after {
    content: "";
    position: absolute;
    top: 9px;
    right: 0;
    width: 20px;
    height: 20px;
    background: url(/resources/images/forms/drop-arrow-light.svg) 50% 50% no-repeat;
    background-size: 12px auto;
}

.profile-btn .notification-count {
    position: absolute;
    top: 0;
    right: -6px;
    background: #ff3300;
    color: #fff;
    font-size: 10px;
    font-weight: bold;
    width: 16px;
    height: 16px;
    line-height: 16px;
    text-align: center;
    border-radius: 100%;
    display: none;
}
.profile-btn.has-notification .notification-count {
    display: block;
}

.map-container {
    position: relative;
}
.full-view-map-btn {
    position: absolute !important;
    top: -5px;
    left: 21px;
    z-index: 100;
    box-shadow: 0 0px 5px 0 rgba(0, 0, 0, 0.16);
}
.full-view-map-btn:not(.map-expanded) .expanded {
    display: none;
}
.full-view-map-btn.map-expanded .minified {
    display: none;
}

/* buttons on the dashboard graphs */
.btn.outline.inline-doughnut-label:hover {
    color: #fff;
}
.btn.outline.inline-doughnut-label:hover a:hover {
    color: #fff;
}
.btn.btn-loading {
    padding-left: 40px;
}
.btn.btn-loading:before {
    content: "";
    position: absolute;
    border-radius: 100%;
    right: 6px;
    top: 50%;
    width: 0px;
    height: 0px;
    margin-top: -2px;
    border: 2px solid rgba(255,255,255,0.5);
    border-left-color: #000;
    border-top-color: #000;
    animation: btn-loading-spin .6s infinite linear, btn-loading-grow .3s forwards ease-out;
}
@keyframes btn-loading-spin {
    to {
        transform: rotate(359deg);
    }
}
@keyframes btn-loading-grow {
    to {
        width: 14px;
        height: 14px;
        margin-top: -8px;
        right: 13px;
    }
}