/* icons */

.icon-link {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0zLjU3IDE0LjY3YzAtLjU3LjEzLTEuMTEuMzgtMS42bC4wMi0uMDJ2LS4wMmwuMDItLjAyYzAtLjAyIDAtLjAyLjAyLS4wMi4xMi0uMjYuMy0uNTIuNTctLjhMNy43OCA5di0uMDJsLjAxLS4wMmMuNDQtLjQxLjkxLS43IDEuNDQtLjg1YTQuODcgNC44NyAwIDAgMC0xLjE5IDIuMzZBNS4wNCA1LjA0IDAgMCAwIDggMTEuNkw2LjA0IDEzLjZjLS4xOS4xOS0uMzIuNC0uMzguNjVhMiAyIDAgMCAwIDAgLjljLjA4LjIuMi40LjM4LjU3bDEuMjkgMS4zMWMuMjcuMjguNjIuNDIgMS4wMy40Mi40MiAwIC43OC0uMTQgMS4wNi0uNDJsMS4yMy0xLjI1Ljc5LS43OCAxLjE1LTEuMTZjLjA4LS4wOS4xOS0uMjIuMjgtLjQuMS0uMi4xNS0uNDIuMTUtLjY3IDAtLjE2LS4wMi0uMy0uMDYtLjQ1bC0uMDItLjAydi0uMDJsLS4wNy0uMTRzMC0uMDMtLjA0LS4wNmwtLjA2LS4xMy0uMDItLjAyYzAtLjAyIDAtLjAzLS4wMi0uMDVhLjYuNiAwIDAgMC0uMTQtLjE2bC0uNDgtLjVjMC0uMDQuMDItLjEuMDQtLjE1bC4wNi0uMTIgMS4xNy0xLjE0LjA5LS4wOS41Ni41N2MuMDIuMDQuMDguMS4xNi4xOGwuMDUuMDQuMDMuMDYuMDQuMDUuMDMuMDQuMDQuMDYuMS4xNC4wMi4wMmMwIC4wMi4wMS4wMy4wMy4wNGwuMS4ydi4wMmMuMS4xNi4yLjM4LjMuNjhhMSAxIDAgMCAxIC4wNC4yNSAzLjIgMy4yIDAgMCAxIC4wMiAxLjMzIDMuNDkgMy40OSAwIDAgMS0uOTUgMS44N2wtLjY2LjY3LS45Ny45Ny0xLjU2IDEuNTdhMy40IDMuNCAwIDAgMS0yLjQ3IDEuMDJjLS45NyAwLTEuOC0uMzQtMi40OS0xLjAzbC0xLjMtMS4zYTMuNTUgMy41NSAwIDAgMS0xLTIuNTF2LS4wMWgtLjAydi4wMnptNS4zOS0zLjQzYzAtLjE5LjAyLS40LjA3LS42My4xMy0uNzQuNDQtMS4zNy45NS0xLjg3bC42Ni0uNjcuOTctLjk4IDEuNTYtMS41NmMuNjgtLjY5IDEuNS0xLjAzIDIuNDctMS4wMy45NyAwIDEuOC4zNCAyLjQ4IDEuMDJsMS4zIDEuMzJhMy40OCAzLjQ4IDAgMCAxIDEgMi40OGMwIC41OC0uMTEgMS4xMS0uMzcgMS42bC0uMDIuMDJ2LjAybC0uMDIuMDRjLS4xNC4yNy0uMzUuNTQtLjYuOEwxNi4yMyAxNWwtLjAxLjAyLS4wMS4wMmMtLjQ0LjQyLS45Mi43LTEuNDMuODNhNC41NSA0LjU1IDAgMCAwIDEuMjMtMy41MkwxOCAxMC4zOGMuMTgtLjIxLjMtLjQyLjM1LS42NWEyLjAzIDIuMDMgMCAwIDAtLjAxLS45IDEuOTYgMS45NiAwIDAgMC0uMzYtLjU4bC0xLjMtMS4zYTEuNDkgMS40OSAwIDAgMC0xLjA2LS40MmMtLjQyIDAtLjc3LjE0LTEuMDYuNGwtMS4yIDEuMjctLjguOC0xLjE2IDEuMTVjLS4wOC4wOC0uMTguMjEtLjI5LjRhMS42NiAxLjY2IDAgMCAwLS4wOCAxLjEybC4wMi4wM3YuMDJsLjA2LjE0cy4wMS4wMy4wNS4wNmwuMDYuMTMuMDIuMDIuMDEuMDIuMDEuMDJjLjA1LjA4LjEuMTMuMTQuMTZsLjQ3LjVjMCAuMDQtLjAyLjA5LS4wNC4xNWwtLjA2LjEyLTEuMTUgMS4xNS0uMS4wOC0uNTYtLjU2YTIuMyAyLjMgMCAwIDAtLjE4LS4xOWMtLjAyLS4wMS0uMDItLjAzLS4wMi0uMDRsLS4wMi0uMDJhLjM3LjM3IDAgMCAxLS4xLS4xMmMtLjAzLS4wMy0uMDUtLjA0LS4wNS0uMDZsLS4xLS4xNS0uMDItLjAyLS4wMi0uMDQtLjA4LS4xN3YtLjAyYTUuMSA1LjEgMCAwIDEtLjI4LS42OSAxLjAzIDEuMDMgMCAwIDEtLjA0LS4yNmMtLjA2LS4yMy0uMS0uNDYtLjEtLjd2LjAxeiI+PC9wYXRoPjwvc3ZnPg==");
}

.icon-linkedin {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMTkuNzUgNS4zOXYxMy4yMmExLjE0IDEuMTQgMCAwIDEtMS4xNCAxLjE0SDUuMzlhMS4xNCAxLjE0IDAgMCAxLTEuMTQtMS4xNFY1LjM5YTEuMTQgMS4xNCAwIDAgMSAxLjE0LTEuMTRoMTMuMjJhMS4xNCAxLjE0IDAgMCAxIDEuMTQgMS4xNHpNOC44MSAxMC4xOEg2LjUzdjcuM0g4Ljh2LTcuM3pNOSA3LjY3YTEuMzEgMS4zMSAwIDAgMC0xLjMtMS4zMmgtLjA0YTEuMzIgMS4zMiAwIDAgMCAwIDIuNjRBMS4zMSAxLjMxIDAgMCAwIDkgNy43MXYtLjA0em04LjQ2IDUuMzdjMC0yLjItMS40LTMuMDUtMi43OC0zLjA1YTIuNiAyLjYgMCAwIDAtMi4zIDEuMThoLS4wN3YtMWgtMi4xNHY3LjNoMi4yOFYxMy42YTEuNTEgMS41MSAwIDAgMSAxLjM2LTEuNjNoLjA5Yy43MiAwIDEuMjYuNDUgMS4yNiAxLjZ2My45MWgyLjI4bC4wMi00LjQzeiI+PC9wYXRoPjwvc3ZnPg==");
}

.icon-facebook {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMTkuNzUgMTIuMDRjMC00LjMtMy40Ny03Ljc5LTcuNzUtNy43OWE3Ljc3IDcuNzcgMCAwIDAtNS45IDEyLjg0IDcuNzcgNy43NyAwIDAgMCA0LjY5IDIuNjN2LTUuNDloLTEuOXYtMi4yaDEuOXYtMS42MmMwLTEuODggMS4xNC0yLjkgMi44LTIuOS44IDAgMS40OS4wNiAxLjY5LjA4djEuOTdoLTEuMTVjLS45MSAwLTEuMS40My0xLjEgMS4wN3YxLjRoMi4xN2wtLjI4IDIuMmgtMS44OHY1LjUyYTcuNzcgNy43NyAwIDAgMCA2LjctNy43MSI+PC9wYXRoPjwvc3ZnPg==");
}

.icon-twitter {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMjAgNS4zNGMtLjY3LjQxLTEuNC43LTIuMTguODdhMy40NSAzLjQ1IDAgMCAwLTUuMDItLjEgMy40OSAzLjQ5IDAgMCAwLTEuMDIgMi40N2MwIC4yOC4wMy41NC4wNy44YTkuOTEgOS45MSAwIDAgMS03LjE3LTMuNjYgMy45IDMuOSAwIDAgMC0uNSAxLjc0IDMuNiAzLjYgMCAwIDAgMS41NiAyLjkyIDMuMzYgMy4zNiAwIDAgMS0xLjU1LS40NFYxMGMwIDEuNjcgMS4yIDMuMDggMi44IDMuNDItLjMuMDYtLjYuMS0uOTQuMTJsLS42Mi0uMDZhMy41IDMuNSAwIDAgMCAzLjI0IDIuNDMgNy4zNCA3LjM0IDAgMCAxLTQuMzYgMS40OWwtLjgxLS4wNWE5Ljk2IDkuOTYgMCAwIDAgNS4zNiAxLjU2YzYuNCAwIDkuOTEtNS4zMiA5LjktOS45di0uNWMuNjktLjQ5IDEuMjgtMS4xIDEuNzQtMS44MS0uNjMuMy0xLjMuNDgtMiAuNTZBMy4zMyAzLjMzIDAgMCAwIDIwIDUuMzMiPjwvcGF0aD48L3N2Zz4=");
}

.icon-twitter-blue {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMiAyIDI0IDI0IiBmaWxsPSIjMjI4OGZmIj48cGF0aCBkPSJNMjIuMDUgNy41NGE0LjQ3IDQuNDcgMCAwIDAtMy4zLTEuNDYgNC41MyA0LjUzIDAgMCAwLTQuNTMgNC41M2MwIC4zNS4wNC43LjA4IDEuMDVBMTIuOSAxMi45IDAgMCAxIDUgNi44OWE1LjEgNS4xIDAgMCAwLS42NSAyLjI2Yy4wMyAxLjYuODMgMi45OSAyLjAyIDMuNzlhNC4zIDQuMyAwIDAgMS0yLjAyLS41N3YuMDhhNC41NSA0LjU1IDAgMCAwIDMuNjMgNC40NGMtLjQuMDgtLjguMTMtMS4yMS4xNmwtLjgxLS4wOGE0LjU0IDQuNTQgMCAwIDAgNC4yIDMuMTUgOS41NiA5LjU2IDAgMCAxLTUuNjYgMS45NGwtMS4wNS0uMDhjMiAxLjI3IDQuMzggMi4wMiA2Ljk0IDIuMDIgOC4zIDAgMTIuODYtNi45IDEyLjg0LTEyLjg1LjAyLS4yNCAwLS40MyAwLS42NWE4LjY4IDguNjggMCAwIDAgMi4yNi0yLjM0Yy0uODIuMzgtMS43LjYyLTIuNi43MmE0LjM3IDQuMzcgMCAwIDAgMS45NS0yLjUxYy0uODQuNTMtMS44MS45LTIuODMgMS4xM3oiPjwvcGF0aD48L3N2Zz4=");
}

.icon-save {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMTcuNSAxLjI1YS41LjUgMCAwIDEgMSAwdjIuNUgyMWEuNS41IDAgMCAxIDAgMWgtMi41djIuNWEuNS41IDAgMCAxLTEgMHYtMi41SDE1YS41LjUgMCAwIDEgMC0xaDIuNXYtMi41em0tMTEgNC41YTEgMSAwIDAgMSAxLTFIMTFhLjUuNSAwIDAgMCAwLTFINy41YTIgMiAwIDAgMC0yIDJ2MTRhLjUuNSAwIDAgMCAuOC40bDUuNy00LjQgNS43IDQuNGEuNS41IDAgMCAwIC44LS40di04LjVhLjUuNSAwIDAgMC0xIDB2Ny40OGwtNS4yLTRhLjUuNSAwIDAgMC0uNiAwbC01LjIgNFY1Ljc1eiI+PC9wYXRoPjwvc3ZnPg==");
}

.icon-save-full {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNNy41IDMuNzVhMiAyIDAgMCAwLTIgMnYxNGEuNS41IDAgMCAwIC44LjRsNS43LTQuNCA1LjcgNC40YS41LjUgMCAwIDAgLjgtLjR2LTE0YTIgMiAwIDAgMC0yLTJoLTl6Ij48L3BhdGg+PC9zdmc+");
}

.icon-3dots {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik00LjM5IDEyYzAgLjU1LjIgMS4wMi41OSAxLjQxLjM5LjQuODYuNTkgMS40LjU5LjU2IDAgMS4wMy0uMiAxLjQyLS41OS40LS4zOS41OS0uODYuNTktMS40MSAwLS41NS0uMi0xLjAyLS42LTEuNDFBMS45MyAxLjkzIDAgMCAwIDYuNCAxMGMtLjU1IDAtMS4wMi4yLTEuNDEuNTktLjQuMzktLjYuODYtLjYgMS40MXpNMTAgMTJjMCAuNTUuMiAxLjAyLjU4IDEuNDEuNC40Ljg3LjU5IDEuNDIuNTkuNTQgMCAxLjAyLS4yIDEuNC0uNTkuNC0uMzkuNi0uODYuNi0xLjQxIDAtLjU1LS4yLTEuMDItLjYtMS40MWExLjkzIDEuOTMgMCAwIDAtMS40LS41OWMtLjU1IDAtMS4wNC4yLTEuNDIuNTktLjQuMzktLjU4Ljg2LS41OCAxLjQxem01LjYgMGMwIC41NS4yIDEuMDIuNTcgMS40MS40LjQuODguNTkgMS40My41OS41NyAwIDEuMDQtLjIgMS40My0uNTkuMzktLjM5LjU3LS44Ni41Ny0xLjQxIDAtLjU1LS4yLTEuMDItLjU3LTEuNDFBMS45MyAxLjkzIDAgMCAwIDE3LjYgMTBjLS41NSAwLTEuMDQuMi0xLjQzLjU5LS4zOC4zOS0uNTcuODYtLjU3IDEuNDF6Ij48L3BhdGg+PC9zdmc+");
}

.icon-star {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDIwIDIwIiBmaWxsPSIjRkZDMDE3Ij48cGF0aCBkPSJNMTIuNCAxMi43N2wtMS44MSA0Ljk5YS42My42MyAwIDAgMS0xLjE4IDBsLTEuOC00Ljk5YS42My42MyAwIDAgMC0uMzgtLjM3bC00Ljk5LTEuODFhLjYyLjYyIDAgMCAxIDAtMS4xOGw0Ljk5LTEuOGEuNjMuNjMgMCAwIDAgLjM3LS4zOGwxLjgxLTQuOTlhLjYzLjYzIDAgMCAxIDEuMTggMGwxLjggNC45OWEuNjMuNjMgMCAwIDAgLjM4LjM3bDQuOTkgMS44MWEuNjMuNjMgMCAwIDEgMCAxLjE4bC00Ljk5IDEuOGEuNjMuNjMgMCAwIDAtLjM3LjM4eiI+PC9wYXRoPjwvc3ZnPg==");
}

.icon-bell {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImJsYWNrIj48cGF0aCBkPSJNMTUgMTguNWEzIDMgMCAxIDEtNiAwIiBzdHJva2UtbGluZWNhcD0icm91bmQiPjwvcGF0aD48cGF0aCBkPSJNNS41IDEwLjUzVjlhNi41IDYuNSAwIDAgMSAxMyAwdjEuNTNjMCAxLjQyLjU2IDIuNzggMS41NyAzLjc5bC4wMy4wM2MuMjYuMjYuNC42LjQuOTd2Mi45M2MwIC4xNC0uMTEuMjUtLjI1LjI1SDMuNzVhLjI1LjI1IDAgMCAxLS4yNS0uMjV2LTIuOTNjMC0uMzcuMTQtLjcxLjQtLjk3bC4wMy0uMDNjMS0xIDEuNTctMi4zNyAxLjU3LTMuNzl6IiBzdHJva2UtbGluZWpvaW49InJvdW5kIj48L3BhdGg+PC9zdmc+");
}

.icon-search {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik00LjEgMTEuMDZhNi45NSA2Ljk1IDAgMSAxIDEzLjkgMCA2Ljk1IDYuOTUgMCAwIDEtMTMuOSAwem02Ljk0LTguMDVhOC4wNSA4LjA1IDAgMSAwIDUuMTMgMTQuMjZsMy43NSAzLjc1YS41Ni41NiAwIDEgMCAuOC0uNzlsLTMuNzQtMy43M0E4LjA1IDguMDUgMCAwIDAgMTEuMDQgM3YuMDF6Ij48L3BhdGg+PC9zdmc+");
}

.icon-clap {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xMS4zNy44M0wxMiAzLjI4bC42My0yLjQ1aC0xLjI2ek0xMy45MiAzLjk1bDEuNTItMi4xLTEuMTgtLjQtLjM0IDIuNXpNOC41OSAxLjg0bDEuNTIgMi4xMS0uMzQtMi41LTEuMTguNHpNMTguNTIgMTguOTJhNC4yMyA0LjIzIDAgMCAxLTIuNjIgMS4zM2wuNDEtLjM3YzIuMzktMi40IDIuODYtNC45NSAxLjQtNy42M2wtLjkxLTEuNi0uOC0xLjY3Yy0uMjUtLjU2LS4xOS0uOTguMjEtMS4yOWEuNy43IDAgMCAxIC41NS0uMTNjLjI4LjA1LjU0LjIzLjcyLjVsMi4zNyA0LjE2Yy45NyAxLjYyIDEuMTQgNC4yMy0xLjMzIDYuN3ptLTExLS40NGwtNC4xNS00LjE1YS44My44MyAwIDAgMSAxLjE3LTEuMTdsMi4xNiAyLjE2YS4zNy4zNyAwIDAgMCAuNTEtLjUybC0yLjE1LTIuMTZMMy42IDExLjJhLjgzLjgzIDAgMCAxIDEuMTctMS4xN2wzLjQzIDMuNDRhLjM2LjM2IDAgMCAwIC41MiAwIC4zNi4zNiAwIDAgMCAwLS41Mkw1LjI5IDkuNTFsLS45Ny0uOTdhLjgzLjgzIDAgMCAxIDAtMS4xNi44NC44NCAwIDAgMSAxLjE3IDBsLjk3Ljk3IDMuNDQgMy40M2EuMzYuMzYgMCAwIDAgLjUxIDAgLjM3LjM3IDAgMCAwIDAtLjUyTDYuOTggNy44M2EuODIuODIgMCAwIDEtLjE4LS45LjgyLjgyIDAgMCAxIC43Ni0uNTFjLjIyIDAgLjQzLjA5LjU4LjI0bDUuOCA1Ljc5YS4zNy4zNyAwIDAgMCAuNTgtLjQyTDEzLjQgOS42N2MtLjI2LS41Ni0uMi0uOTguMi0xLjI5YS43LjcgMCAwIDEgLjU1LS4xM2MuMjguMDUuNTUuMjMuNzMuNWwyLjIgMy44NmMxLjMgMi4zOC44NyA0LjU5LTEuMjkgNi43NWE0LjY1IDQuNjUgMCAwIDEtNC4xOSAxLjM3IDcuNzMgNy43MyAwIDAgMS00LjA3LTIuMjV6bTMuMjMtMTIuNWwyLjEyIDIuMTFjLS40MS41LS40NyAxLjE3LS4xMyAxLjlsLjIyLjQ2LTMuNTItMy41M2EuODEuODEgMCAwIDEtLjEtLjM2YzAtLjIzLjA5LS40My4yNC0uNTlhLjg1Ljg1IDAgMCAxIDEuMTcgMHptNy4zNiAxLjdhMS44NiAxLjg2IDAgMCAwLTEuMjMtLjg0IDEuNDQgMS40NCAwIDAgMC0xLjEyLjI3Yy0uMy4yNC0uNS41NS0uNTguODktLjI1LS4yNS0uNTctLjQtLjkxLS40Ny0uMjgtLjA0LS41NiAwLS44Mi4xbC0yLjE4LTIuMThhMS41NiAxLjU2IDAgMCAwLTIuMiAwYy0uMi4yLS4zMy40NC0uNC43YTEuNTYgMS41NiAwIDAgMC0yLjYzLjc1IDEuNiAxLjYgMCAwIDAtMi4yMy0uMDQgMS41NiAxLjU2IDAgMCAwIDAgMi4yYy0uMjQuMS0uNS4yNC0uNzIuNDVhMS41NiAxLjU2IDAgMCAwIDAgMi4ybC41Mi41MmExLjU2IDEuNTYgMCAwIDAtLjc1IDIuNjFMNyAxOWE4LjQ2IDguNDYgMCAwIDAgNC40OCAyLjQ1IDUuMTggNS4xOCAwIDAgMCAzLjM2LS41IDQuODkgNC44OSAwIDAgMCA0LjItMS41MWMyLjc1LTIuNzcgMi41NC01Ljc0IDEuNDMtNy41OUwxOC4xIDcuNjh6Ij48L3BhdGg+PC9zdmc+");
}

.icon-reply {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMTggMTYuOGE3LjE0IDcuMTQgMCAwIDAgMi4yNC01LjMyYzAtNC4xMi0zLjUzLTcuNDgtOC4wNS03LjQ4QzcuNjcgNCA0IDcuMzYgNCAxMS40OGMwIDQuMTMgMy42NyA3LjQ4IDguMiA3LjQ4YTguOSA4LjkgMCAwIDAgMi4zOC0uMzJjLjIzLjIuNDguMzkuNzUuNTYgMS4wNi42OSAyLjIgMS4wNCAzLjQgMS4wNC4yMiAwIC40LS4xMS40OC0uMjlhLjUuNSAwIDAgMC0uMDQtLjUyIDYuNCA2LjQgMCAwIDEtMS4xNi0yLjY1di4wMnptLTMuMTIgMS4wNmwtLjA2LS4yMi0uMzIuMWE4IDggMCAwIDEtMi4zLjMzYy00LjAzIDAtNy4zLTIuOTYtNy4zLTYuNTlTOC4xNyA0LjkgMTIuMiA0LjljNCAwIDcuMSAyLjk2IDcuMSA2LjYgMCAxLjgtLjYgMy40Ny0yLjAyIDQuNzJsLS4yLjE2di4yNmwuMDIuM2E2Ljc0IDYuNzQgMCAwIDAgLjg4IDIuNCA1LjI3IDUuMjcgMCAwIDEtMi4xNy0uODZjLS4yOC0uMTctLjcyLS4zOC0uOTQtLjU5bC4wMS0uMDJ6Ij48L3BhdGg+PC9zdmc+");
}

.icon-share {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xNS4yMiA0LjkzYS40Mi40MiAwIDAgMS0uMTIuMTNoLjAxYS40NS40NSAwIDAgMS0uMjkuMDguNTIuNTIgMCAwIDEtLjMtLjEzTDEyLjUgM3Y3LjA3YS41LjUgMCAwIDEtLjUuNS41LjUgMCAwIDEtLjUtLjVWMy4wMmwtMiAyYS40NS40NSAwIDAgMS0uNTcuMDRoLS4wMmEuNC40IDAgMCAxLS4xNi0uMy40LjQgMCAwIDEgLjEtLjMybDIuOC0yLjhhLjUuNSAwIDAgMSAuNyAwbDIuOCAyLjhhLjQyLjQyIDAgMCAxIC4wNy41em0tLjEuMTR6bS44OCAyaDEuNWEyIDIgMCAwIDEgMiAydjEwYTIgMiAwIDAgMS0yIDJoLTExYTIgMiAwIDAgMS0yLTJ2LTEwYTIgMiAwIDAgMSAyLTJIOGEuNS41IDAgMCAxIC4zNS4xNGMuMS4xLjE1LjIyLjE1LjM1YS41LjUgMCAwIDEtLjE1LjM1LjUuNSAwIDAgMS0uMzUuMTVINi40Yy0uNSAwLS45LjQtLjkuOXYxMC4yYS45LjkgMCAwIDAgLjkuOWgxMS4yYy41IDAgLjktLjQuOS0uOVY4Ljk2YzAtLjUtLjQtLjktLjktLjlIMTZhLjUuNSAwIDAgMSAwLTF6Ij48L3BhdGg+PC9zdmc+");
}

.icon-write {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMTQgNGEuNS41IDAgMCAwIDAtMXYxem03IDZhLjUuNSAwIDAgMC0xIDBoMXptLTctN0g0djFoMTBWM3pNMyA0djE2aDFWNEgzem0xIDE3aDE2di0xSDR2MXptMTctMVYxMGgtMXYxMGgxem0tMSAxYTEgMSAwIDAgMCAxLTFoLTF2MXpNMyAyMGExIDEgMCAwIDAgMSAxdi0xSDN6TTQgM2ExIDEgMCAwIDAtMSAxaDFWM3oiPjwvcGF0aD48cGF0aCBkPSJNMTcuNSA0LjVsLTguNDYgOC40NmEuMjUuMjUgMCAwIDAtLjA2LjFsLS44MiAyLjQ3Yy0uMDcuMi4xMi4zOC4zMS4zMWwyLjQ3LS44MmEuMjUuMjUgMCAwIDAgLjEtLjA2TDE5LjUgNi41bS0yLTJsMi4zMi0yLjMyYy4xLS4xLjI2LS4xLjM2IDBsMS42NCAxLjY0Yy4xLjEuMS4yNiAwIC4zNkwxOS41IDYuNW0tMi0ybDIgMiIgZmlsbD0ibm9uZSIgc3Ryb2tlPSJibGFjayI+PC9wYXRoPjwvc3ZnPg==");
}

.icon-listen {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDE2IDE2IiBmaWxsPSIjMUE4OTE3Ij48cGF0aCBkPSJNOCAwYTggOCAwIDEgMCAwIDE2QTggOCAwIDAgMCA4IDB6bTIuOCA4LjUxbC0zLjY5IDIuNDZhLjYyLjYyIDAgMCAxLS45Ni0uNVY1LjUzYS42Mi42MiAwIDAgMSAuOTYtLjUxbDMuNyAyLjQ2YS42Mi42MiAwIDAgMSAwIDEuMDJ6Ij48L3BhdGg+PC9zdmc+");
}

.icon-bold {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMSIgaGVpZ2h0PSIyMSIgdmlld0JveD0iMCAwIDIxIDIxIj48cGF0aCBkPSJNMTAuMyAxOEg0LjRsLjEtLjkuOC0uMTJjLjU1LS4xMS43OC0uMjMuNzgtLjQ1VjUuMzdjMC0uMjItLjExLS4zNC0uOS0uNDVINC41bC0uMTEtLjloNi4yNWM0LjAyIDAgNS41OCAxLjI0IDUuNTggMy4xNCAwIDEuOS0xLjc4IDMuMTItMy43OSAzLjQ2di4xMWMyLjcuMzQgNC4yNSAxLjU2IDQuMjUgMy41NyAwIDIuMzUtMiAzLjctNi4zNyAzLjdoLjAyLS4wMnpNOS45OCA1LjAyaC0xdjUuNDdoMS4yM2MxLjc5IDAgMi43OS0xLjIzIDIuNzktMi42OCAwLTEuNjktMS0yLjgtMy0yLjh2LjAxem0tLjIyIDYuMzZoLS43OFYxN2wxLjIyLjIyaC4yMmMxLjY3IDAgMy4wMS0xIDMuMDEtMi44IDAtMi4xMS0xLjU2LTMtMy42OS0zaC4wMnoiIGZpbGwtcnVsZT0iZXZlbm9kZCI+PC9wYXRoPjwvc3ZnPg==");
}

.icon-italic {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMSIgaGVpZ2h0PSIyMSIgdmlld0JveD0iMCAwIDIxIDIxIj48cGF0aCBkPSJNOS44NSAxOC4wNGMtLjU0IDAtMi4wMy0uNjQtMS45Mi0uODVMOS45NSA5LjVsLS42NC0uMjItMS4zOCAxLjUtLjQzLS40M2MuNTMtMS4xNyAxLjctMi42NyAyLjc3LTIuNjcuNTQgMCAyLjI0LjU0IDIuMTQuODZsLTIuMTQgNy43OC41NC4yMiAxLjYtMS4wNy40Mi40M2MtLjY0IDEuMDYtMS45MiAyLjEzLTIuOTggMi4xM3ptMi4zNC0xMS43M2MtLjk2IDAtMS4zOC0uNjQtMS4zOC0xLjM5IDAtMS4wNy43NC0xLjkyIDEuNDktMS45Mi44NSAwIDEuMzkuNjQgMS4zOSAxLjUtLjExIDEuMDYtLjc1IDEuOC0xLjUgMS44eiIgZmlsbC1ydWxlPSJldmVub2RkIj48L3BhdGg+PC9zdmc+");
}

.icon-responses-guidelines {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNSIgaGVpZ2h0PSIyNSIgdmlld0JveD0iMCAwIDI1IDI1Ij48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xMS45OSA1LjA0Yy4yNi0uMjEuNjQtLjIyLjkxLS4wMS45Ny43MiAxLjc3IDEuMjEgMi42IDEuNTQuODMuMzIgMS43Mi40OCAyLjg5LjUuNDEuMDEuNzQuMzUuNzQuNzYtLjAyIDMuNjItLjQzIDYuMjYtMS40NSA4LjIxLTEuMDMgMS45OC0yLjY2IDMuMjEtNC45NyA0LjA4YS43NS43NSAwIDAgMS0uNTMgMGMtMi4yNS0uODctMy44Ni0yLjEtNC45LTQuMDctMS4wMi0xLjk1LTEuNDYtNC41OS0xLjQ4LTguMjIgMC0uNDEuMzMtLjc1Ljc1LS43NiAxLjE5LS4wMiAyLjEtLjE4IDIuOTItLjUuODItLjMyIDEuNi0uODEgMi41Mi0xLjUzem0uNDYuOWMtLjkuNjktMS43MSAxLjIxLTIuNjIgMS41NmE4LjkgOC45IDAgMCAxLTMuMDIuNTdjLjAzIDMuNDUuNDYgNS44MiAxLjM2IDcuNTEuODggMS42OSAyLjI1IDIuNzcgNC4yOCAzLjU3IDIuMS0uOCAzLjQ3LTEuODkgNC4zNC0zLjU3Ljg5LTEuNyAxLjMtNC4wNyAxLjM0LTcuNTFhOC44IDguOCAwIDAgMS0zLS41NyAxMS44IDExLjggMCAwIDEtMi42OC0xLjU2em0wIDkuMTVhMi42NyAyLjY3IDAgMSAwIDAtNS4zNCAyLjY3IDIuNjcgMCAwIDAgMCA1LjM0em0wIDFhMy42NyAzLjY3IDAgMSAwIDAtNy4zNCAzLjY3IDMuNjcgMCAwIDAgMCA3LjM0em0tMS44Mi0zLjc3bC41My0uNTMuOTEuOTIgMS42My0xLjYzLjUyLjUzLTIuMTUgMi4xNS0xLjQ0LTEuNDR6Ij48L3BhdGg+PC9zdmc+");
}

.icon-responses-close {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNSIgaGVpZ2h0PSIyNSIgdmlld0JveD0iMCAwIDI1IDI1Ij48cGF0aCBkPSJNMTguMTMgNi4xMWwtNS42MSA1LjYxLTUuNi01LjYxLS44MS44IDUuNjEgNS42MS01LjYxIDUuNjEuOC44IDUuNjEtNS42IDUuNjEgNS42LjgtLjgtNS42LTUuNiA1LjYtNS42MiI+PC9wYXRoPjwvc3ZnPg==");
}

.icon-responses-menu {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNSIgaGVpZ2h0PSIyNSIgdmlld0JveD0iMCAwIDI1IDI1Ij48cGF0aCBkPSJNNSAxMi41YzAgLjU1LjIgMS4wMi41OSAxLjQxLjM5LjQuODYuNTkgMS40MS41OS41NSAwIDEuMDItLjIgMS40MS0uNTkuNC0uMzkuNTktLjg2LjU5LTEuNDEgMC0uNTUtLjItMS4wMi0uNTktMS40MUExLjkzIDEuOTMgMCAwIDAgNyAxMC41Yy0uNTUgMC0xLjAyLjItMS40MS41OS0uNC4zOS0uNTkuODYtLjU5IDEuNDF6bTUuNjIgMGMwIC41NS4yIDEuMDIuNTggMS40MS40LjQuODcuNTkgMS40Mi41OS41NSAwIDEuMDItLjIgMS40MS0uNTkuNC0uMzkuNTktLjg2LjU5LTEuNDEgMC0uNTUtLjItMS4wMi0uNTktMS40MWExLjkzIDEuOTMgMCAwIDAtMS40MS0uNTljLS41NSAwLTEuMDMuMi0xLjQyLjU5LS4zOS4zOS0uNTguODYtLjU4IDEuNDF6bTUuNiAwYzAgLjU1LjIgMS4wMi41OCAxLjQxLjQuNC44Ny41OSAxLjQzLjU5LjU2IDAgMS4wMy0uMiAxLjQyLS41OS4zOS0uMzkuNTgtLjg2LjU4LTEuNDEgMC0uNTUtLjItMS4wMi0uNTgtMS40MWExLjkzIDEuOTMgMCAwIDAtMS40Mi0uNTljLS41NiAwLTEuMDQuMi0xLjQzLjU5LS4zOS4zOS0uNTguODYtLjU4IDEuNDF6IiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjwvcGF0aD48L3N2Zz4=");
}

.icon-profile {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImJsYWNrIj48Y2lyY2xlIGN4PSIxMiIgY3k9IjciIHI9IjQuNSI+PC9jaXJjbGU+PHBhdGggZD0iTTMuNSAyMS41di00LjM0QzMuNSAxNS40IDcuMyAxNCAxMiAxNHM4LjUgMS40MSA4LjUgMy4xNnY0LjM0IiBzdHJva2UtbGluZWNhcD0icm91bmQiPjwvcGF0aD48L3N2Zz4=");
}

.icon-library {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImJsYWNrIj48cGF0aCBkPSJNNi40NCA2LjY5aDBhMS41IDEuNSAwIDAgMSAxLjA2LS40NGg5Yy40IDAgLjc4LjE2IDEuMDYuNDRsLjM1LS4zNS0uMzUuMzVjLjI4LjI4LjQ0LjY2LjQ0IDEuMDZ2MTRsLTUuNy00LjQtLjMtLjIzLS4zLjIzLTUuNyA0LjR2LTE0YzAtLjQuMTYtLjc4LjQ0LTEuMDZ6Ij48L3BhdGg+PHBhdGggZD0iTTEyLjUgMi43NWgtOGEyIDIgMCAwIDAtMiAydjExLjUiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCI+PC9wYXRoPjwvc3ZnPg==");
}

.icon-stories {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImJsYWNrIj48cGF0aCBkPSJNNC43NSAyMS41aDE0LjVjLjE0IDAgLjI1LS4xMS4yNS0uMjVWMi43NWEuMjUuMjUgMCAwIDAtLjI1LS4yNUg0Ljc1YS4yNS4yNSAwIDAgMC0uMjUuMjV2MTguNWMwIC4xNC4xMS4yNS4yNS4yNXoiPjwvcGF0aD48cGF0aCBkPSJNOCA4LjVoOE04IDE1LjVoNU04IDEyaDgiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCI+PC9wYXRoPjwvc3ZnPg==");
}

.icon-stats {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImJsYWNrIj48cGF0aCBkPSJNMi43NSAxOWg0LjVjLjE0IDAgLjI1LS4xMS4yNS0uMjV2LTYuNWEuMjUuMjUgMCAwIDAtLjI1LS4yNWgtNC41YS4yNS4yNSAwIDAgMC0uMjUuMjV2Ni41YzAgLjE0LjExLjI1LjI1LjI1ek05Ljc1IDE5aDQuNWMuMTQgMCAuMjUtLjExLjI1LS4yNVY4LjI1YS4yNS4yNSAwIDAgMC0uMjUtLjI1aC00LjVhLjI1LjI1IDAgMCAwLS4yNS4yNXYxMC41YzAgLjE0LjExLjI1LjI1LjI1ek0xNi43NSAxOWg0LjVjLjE0IDAgLjI1LS4xMS4yNS0uMjVWNC4yNWEuMjUuMjUgMCAwIDAtLjI1LS4yNWgtNC41YS4yNS4yNSAwIDAgMC0uMjUuMjV2MTQuNWMwIC4xNC4xMS4yNS4yNS4yNXoiPjwvcGF0aD48L3N2Zz4=");
}

.icon-v {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMiIgaGVpZ2h0PSIxMiIgdmlld0JveD0iMCAwIDE1IDE1Ij48cGF0aCBkPSJNMy44NSA1LjE1YS41LjUgMCAwIDAtLjcuN2w0LjM1IDQuMzYgNC4zNS00LjM2YS41LjUgMCAxIDAtLjctLjdMNy41IDguNzkgMy44NSA1LjE1eiIgZmlsbC1ydWxlPSJldmVub2RkIj48L3BhdGg+PC9zdmc+");
}

.tooltip-arrow-up {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0MCIgaGVpZ2h0PSIxMCI+PHBvbHlnb24gcG9pbnRzPSI0LDEwIDIwLDAgMzYsMTAiIC8+PC9zdmc+");
}

.tooltip-arrow-down {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0MCIgaGVpZ2h0PSIxMCI+PHBvbHlnb24gcG9pbnRzPSI0LDAgMjAsMTAgMzYsMCIgLz48L3N2Zz4=");
}

/* reset */

html, body {
    height: 100%;
}
html, body, body * {
    border: 0;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    vertical-align: top;
    color: inherit;
    user-select: text;
    font-family: inherit;
}
body {
    min-width: 20rem;
    margin: 0 auto;
    text-align: center;
}
body * {
    max-width: 100%;
    flex-shrink: 0;
}
div, header, main, nav, footer, h1, h2, h3, h4, h5, h6, section, p {
    display: inline-block;
    width: 100%;
    min-height: 10px;
    overflow: auto;
    text-align: left;
}
span, a, img, label, button, input { 
    display: inline-block;
    width: auto;
    overflow: hidden;
}
button, select, textarea, input {
    padding: 5px;
    outline: none;
    font-size: 1rem;
    font-weight: 500;
    color: black;
    background-color: white;
}
button {
    padding: 0; /* special */
    cursor: pointer;
}
textarea {
    resize: none;
}
img {
    object-fit: cover;
    object-position: center;
}
a {
    text-decoration: none;
}
hr {
    height: 1px;
    background-color: #dddddd;
}

/* anchor */

.link { /* for anchors inside text */
    display: inline;
    text-decoration: underline;
}

/* display */

.flexrow {
    display: inline-flex;
    justify-content: flex-start;
    align-items: center;
    row-gap: 1rem;
}
 
.flexcol {
    display: inline-flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
}

.wrap {
    flex-wrap: wrap;
}
    
.space-between {
    justify-content: space-between;
}

.colgap1 {
    column-gap: 1rem;
}

/* icon */
    
.bgicon {
    width: 1.5rem;
    height: 1.5rem;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
}

.transl {
    opacity: 0.55;
}
.transl:hover {
    opacity: 1;
}
.transl:focus { /* for input box */
    opacity: 1;
}

.transl2 {
    opacity: 0.4;
}
.transl2:hover {
    opacity: 0.9;
}

.bi-button {
    opacity: 0.6;
    border-radius: 4px;
}
.bi-button:hover {
    background-color: #e3e3e3;
}
.bi-button:active {
    background-color: #e3e3e3;
}

/* page header */

.header { 
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left:  clamp(20px, calc(100vw - 1400px), 40px);
    padding-right: clamp(20px, calc(100vw - 1400px), 40px);
    border-bottom: 1px solid rgb(238,238,238);
}

.header-logo {
    width: 3.125rem;
}

.header-search-frame {
    margin-left: 1rem;
    border-radius: 15px;
    background-color: rgb(247,247,255);
}

.header-search-icon {
    opacity: 0.6;
    cursor: default;
}

.header-search-box {
    width: 12rem;
    height: 2.5rem;
    font-family: Rubik, sans-serif;
    font-size: 0.875rem;
    color: #222222;
    background-color: transparent;
}

.header-icon-v {
    width: 0.875rem;
    height: 0.875rem;
    opacity: 0.6;
}

/* main */

.main {
    display: inline-flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: stretch;
    justify-content: space-evenly;
    max-width: min(85rem, 100%); /* 85rem == 1360px */
    overflow: visible;
}

/* master panel */

.master {    
    margin-top: 50px;
    padding: 0 20px;
    min-width: 320px; /* iphone 5 */
    max-width: 43.75rem; /* 43.75rem == 700px */
    width: calc(100% - 23rem); /* 23rem == 368px (side-panel); */
}

.master-header-follow {
    padding: 2px 8px;
    margin-left: 15px;
    border-radius: 12px;
    font-family: Rubik, sans-serif;
    font-size: 0.875rem;
    font-weight: 400;
    color: white;
    background-color: #1a8917;
}

.master-header-bigsave {
    margin-left: 1rem;
    padding: 5px 12px 5px 7px;
    border-radius: 20px;
    border: 1px solid #cccccc;
    opacity: 0.6;
}
    
.master-bottom {
    padding: 0 15px;
    background-color: rgb(250,250,250);
}

.master-featured {
    margin-top: 25px;
    font-size: 2rem;
    font-weight: 700;
    font-family: Lato, sans-serif;
}

/* article */

.article-h1 {
    font-family: Cardo, san-serif;
    font-size: 2rem;
    font-weight: 700;
    color: #292929;
}

.article-h2 {
    font-family: Lato, sans-serif;
    font-size: 1.375rem;
    font-weight: 400;
    color: #757575;
}

.article-h3 {
    margin: 1rem 0;
    font-family: Lato, sans-serif;
    font-size: 1.5rem;
    font-weight: 700;
    color: #292929;
}

.article-p {
    margin: 1rem 0;
    line-height: 150%;
    font-size: 1.375rem;
    font-family: "Crimson Text", serif;
    color: #292929;
}

/* featured article */

.featured-section {
    margin: 40px 0;
}

/* featured article header */

.featured-header {
    display: inline-flex;
    align-items: center;
    padding: 5px;
}

.featured-author {
    display: inline-flex;
    align-items: center;
}

.featured-avatar {
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 50%;
    margin-right: 7px;
}

.featured-name {
    font-size: 0.875rem;
    font-family: Rubik,sans-serif;
    color: #292929;
}

.featured-date {
    font-size: 0.875rem;
    font-family: Rubik, sans-serif;
    color: #757575;
}

/*  featured article main  */
      
.featured-main {
    display: inline-flex;
    align-items: center;
}

.featured-main-left {
    width: calc(100% - 125px);
}

.featured-main-right {
    width: 125px;
    text-align: right;
}
    
.featured-title { 
    padding: 10px 0;
    font-family: Rubik, sans-serif;
    font-size: 1.25rem;    
    font-weight: 700;
    color: #292929;
}

.featured-p {  
    font-family: Lato, serif; 
    font-size: 1rem;
    color: #292929;
}

.featured-image {
    width: 112px;
}

/* featured article footer */

.featured-footer { 
    display: inline-flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    row-gap: 10px;
    margin-top: 20px;
    width: calc(100% - 125px);
}

.featured-footer-left {
    display: inline-flex;
    align-items: center;
}

.featured-footer-right {
}

.featured-tag {
    padding: 4px 7px;
    margin-left: 5px;
    font-family: Rubik, sans-serif;
    font-size: 0.875rem;
    border-radius: 8px;
    color: #292929;
    background-color: #f2f2f2;
}

.featured-time {
    font-family: Rubik, sans-serif;
    font-size: 0.875rem;
    color: #757575;
}

/* article */

.article-highlighted {
    margin: 1rem 0;
    margin-left: -20px;
    padding-left: 17px;
    font-style: italic;
    font-size: 1.375rem;
    font-family: "Crimson Text", serif;
    border-left: 3px solid;
    color: #292929;
}

.article-highlighted-big {
    margin: 1rem 0;
    padding: 0 20px;
    line-height: 135%;
    font-family: Lato, sans-serif;
    font-size: 1.75rem;
    color: #757575;
}

.article-separator {
    text-align: center;
    font-size: 30px;
    color: #757575;
}

.image-remark {
    width: 100%;
    margin-top: 6px;
    text-align: center; 
    font-family: Lato, sans-serif;
    font-size: 0.875rem;
    font-weight: 400;
    color: #757575;
}

.article-tag {    
    padding: 8px 16px;
    border-radius: 18px;
    font-family: Lato, sans-serif;
    font-size: 0.875rem;
    font-weight: 400;
    color: #292929;
    background-color: #f2f2f2;
}

/* youtube */

.youtube-outer {
    margin: 1rem 0;
    position: relative;
    width: 100%;
    padding-top: 56.25%; /* 16:9 aspect ratio */
    margin-top: 10px;
    background-color: black;
}

.youtube-inner {
    position:  absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
}

/* side-panel.css */

.side-panel-outer {
    width: 23rem; /* 23rem == 368px */
    border-left: solid 1px #eeeeee;
    overflow: visible;
}

.side-panel { 
    top: 0;
    position: sticky;
    padding: 0 23px 0 23px;
}

.membership {
    width: 100%;
    padding: 12px 0;
    text-align: center;
    font-family: Rubik, sans-serif;
    font-size: 0.875rem;
    font-weight: 500;
    border-radius: 20px;
    color: white;
    background-color: #191919;
}

.side-author-avatar {
    width: 88px;
    height: 88px;
    border-radius: 50%;
}

.side-author-name {
    font-family: Rubik, sans-serif;
    font-size: 1rem;
    font-weight: 400;
    color: #292929;
}

.side-followers {
    margin-top: 5px;
    font-family: Rubik, sans-serif;
    font-size: 1rem;
    font-weight: 400;
    color: #757575;
}

.side-profile {
    margin-top: 12px;
    font-family: Rubik, sans-serif;
    font-size: 0.875rem;
    font-weight: 400;
    color: #757575;
}

.side-follow {
    margin-top: 20px;
    padding: 9px 16px;
    font-family: Rubik, sans-serif;
    font-size: 0.875rem;
    font-weight: 400;
    border-radius: 18px;
    color: white;
    background-color: #1a8917;
}

.side-tedium {
    font-family: Lato, sans-serif;
    font-size: 1.125rem;
    font-weight: 700;
    color: #292929;
}

.side-footer-link {
    margin-right: 5px;
    text-decoration: none;
    font-family: Rubik, sans-serif;
    font-size: 0.875rem;
    color: #757575;
}

/* responses panel */ 

.responses { 
    display:none;
    position: fixed;
    top: 0;
    right: 0;
    height: 100vh;
    width: 25rem;
    padding: 25px;
    overflow-y: auto;
    box-shadow: rgba(0,0,0,0.15) 0 4px 12px 0;
    background-color: white;
}

.responses-title {
    font-family: Rubik, sans-serif;
    font-size: 1.25rem;
    font-weight: 500;
    color: #292929;
}

/* response */

.response-outer {
    padding-left: 20px;
}

.response-inner {
    border-left: 3px #d6d6d6 solid;
    padding-left: 30px;
}

/* write reply box */

.write-reply {
    padding: 15px;
    box-shadow: rgba(0,0,0,0.12) 0 2px 8px 0;
    background-color: white;
}

.write-reply-respond {
    padding: 8px 14px;
    font-size: 0.875rem;
    font-family: Rubik, sans-serif;
    font-weight: 400;
    border-radius: 18px;
    opacity: 0.35;
    color: white;
    background-color: #1a8917;
}
          
/* height */

.height3 {
    height: 3rem;
}

/* size */

.size1 {
    width: 1rem;
    height: 1rem;
}

.size2 {
    width: 2rem;
    height: 2rem;
}

.size3 {
    width: 3rem;
    height: 3rem;
}

/* margin */

.marginl2 {
    margin-left: 2rem;
}

/* font */
 
.lato14 {
    font-family: Lato, sans-serif;
    font-size: 0.875rem;
    font-weight: 400;
}
    
.rubik14 {
    font-family: Rubik, sans-serif;
    font-size: 0.875rem;
    font-weight: 400;
}

.rubik16 {
    font-family: Rubik, sans-serif;
    font-size: 1rem;
    font-weight: 400;
}

.weight600 {
    font-weight: 600;
}

/* color */
    
.dark {
    color: #292929;
}
   
.lite {
    color: #757575;
}

.lite2 {
    color: #aaaaaa;
}

.green {
    color: #1a8917;
} 

/* other */

.round {
    border-radius: 50%;
}

.litedot {
    margin-top: -0.25rem;
    color: #757575;
}

.hover-underline { }

.hover-underline:hover {
    text-decoration: underline;
}

/* MEDIA QUERIES */

/* 59rem (944px) */

@media (max-width: 59rem) {  

    .wide-till59 { width: 100%; }     

    .hide-till59 { display: none;}        
}

/* 46rem (736px) */

@media (max-width: 46rem) {  

    .hide-till46 { display: none; } 
}

/* 40rem (640px) */
       
@media (max-width: 40rem) {
    
    .hide-till40 { display: none; }   
        
    .wide-till40 { width: 100%; }
    
    .responses-till40 { width: 100%; padding-left: 15px; padding-right: 15px; }
}

@media not (max-width: 40rem) { 

    .hide-after40 { display: none; }
}

/* 35rem (560px) */

@media (max-width: 35rem) { 

    .hide-till35 { display: none; }       
}

@media not (max-width: 35rem) {
    
    .hide-after35 { display: none }
}