@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@100..900&display=swap');

:root {
    --font-1: "Outfit", sans-serif;

    --color-primary: #289ec9FF;
    --color-primary-light: #289ec9EE;
    --color-secondary: #1b5070FF;
    --color-secondary-light: #1b5070EE;

    --color-white: #FFFFFF;

    --background-gradient: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(222,222,222,1) 100%);
    --background-gradient-theme: linear-gradient(0deg, rgba(40, 158, 201, 1) 0%, rgba(27, 80, 112, 1) 100%);
}

* { font-family: "Outfit", sans-serif; }

html { scroll-behavior: smooth; background: #FFF; font-size: 14px; height: 100%; }
body {
    font-family: var(--font-1);
    height: 100%;
    margin: 0;
    padding: 0;
    overflow-x: hidden;
    min-width: 320px;
    background: #fff;
    font-size: 14px;
    line-height: 1.4285em;
    color: rgba(0, 0, 0, 0.87);
}

#loader { z-index: 2025! important; position: fixed; }
.hidden { display: none !important }
.si.cursor { cursor: pointer; }
.si.hide { display: none !important }
.si.full.height{ height:100%; }
.si.flex{ display: flex !important; flex-direction: column; }
.si.grow{ flex-grow: 1; }
.si.overflow{ overflow-y: auto; overflow-x: hidden;  }
.si.overflow.none { overflow: hidden !important }
.si.padding.none { padding: 0 !important }
.si.padding.minimum{ padding: 5px !important }
.si.margin.none { margin: 0px !important; }
.si.margin.minimum{ margin: 5px !important }
.si.margin.bottom { margin-bottom: 16px !important }
.si.margin.right{ margin-right: 5px; }
.si.underline{ text-decoration: underline; }
.si.centered {
    width:100%;
    height: 100%;
    display:flex;
    align-items: center;
    justify-content: center;
}

/** Colors **/
.si.color.primary{ color: var(--color-primary) !important; }
.si.color.secondary{ color: var(--color-secondary) !important; }
.si.background.primary{
    background-color: var(--color-primary) !important;
    color: var(--color-white) !important;
}
.si.background.primary:hover{
    background-color: var(--color-primary-light) !important;
}
.si.background.secondary{
    background-color: var(--color-secondary) !important;
    color: var(--color-white) !important;
}
.si.background.secondary:hover{
    background-color: var(--color-secondary-light) !important;
}

.ui .masthead.segment {
    min-height: 700px;
    padding: 3em 0em;
    background: linear-gradient(-45deg, #0a1e49, #182641, #1d3a45, #d9f2ec) !important;
    background-size: 400% 400% !important;
    animation: gradient 15s ease infinite !important;  
}

@keyframes gradient {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

.masthead .ui.header {
    margin-top: 3em;
    margin-bottom: 1em;
    font-family: var(--font-1);
}

.masthead .ui.header h1 {
    font-family: var(--font-1);
    font-weight: 700; 
    font-size: 4em;
    margin: -0.6em 0 0 0;
    color:#333;
}

.masthead .ui.header img {
    font-weight: 700; 
    font-size: 6em;
    filter: drop-shadow(5px 5px 10px rgba(0, 0, 0, 0.5));
}

.ui.vertical.section {
    padding: 6em 0em 10em 0;
    border: 0.1px dotted #EEEEEE;
}

.ui.vertical.section h3{
    font-size: 2em;
}

.ui.vertical.section p {
    font-size: 1.2em;
    font-family: var(--font-1);
}

.ui.vertical.section h1.ui.header .sub.header {
    font-size: 1.4rem;   
}

.ui.vertical.page {
    padding: 6em 0em 10em 0;
    border: 0.1px dotted #EEEEEE;
}

h1.header.title{
    font-size: 4em;
    color: #333;    
}

#about .card>.content>.header{
    font-size: 1.8em;
    font-family: var(--font-1);
}

.ui.footer.segment {
  padding: 1em 0em;
  background-color: #F3F3F3;
}

.notarix.menu .toc.item {
    display: none;
}

.notarix_label_dark{
    color: var(--color-secondary) !important;
    font-weight: 600;
}

.notarix_label{
    color: #2897c7;
    font-weight: 600;
}

#why, #pricing, #how{
    background-color: #EEE;
/*    background: linear-gradient(-45deg, #0a1e49, #182641, #1d3a45, #d9f2ec) !important;
    background-size: 400% 400% !important;
    animation: gradient 15s ease infinite !important;  */
}

.ui.feed>.event>.content .summary {
    font-weight: 300 !important;
}

.header{
    font-family: var(--font-1) !important;
}

@media only screen and (max-width: 700px) {
    /*.notarix.menu .item:not(.header){*/
        /*display: none !important;*/
    /*}*/
    
    .notarix.menu .main {
        display: none !important;
    } 
    
    .notarix.menu .toc.item {
        display: flex;
    }    
    
    .masthead.segment {
        min-height: 350px;
    }
    
    .masthead .ui.header {
        margin-top: 3em;
        margin-bottom: 1em;
        font-family: var(--font-1);
    }    
    
    .masthead .ui.header h1 {
        font-family: var(--font-1);
        font-weight: 700; 
        font-size: 2em;
        margin: -0.6em 0 -0.2em 0;
        color:#333;
    }    
    
}

.pricing{
    height: 178px;
}

.pricing.unli{
    background: rgba(251,217,211, 0.8) !important;
}

.pricing .header{
    font-size: 1.8em !important;
}

img.avatar.social{
    width: 1.4em !important;
    height: 1.4em !important;
}

sup{
    color: var(--color-secondary);
}