@import url('https://fonts.googleapis.com/css2?family=Signika:wght@300..700&display=swap');
*,*::before,*::after{-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box}
html, body{ height: 100%;padding:0; margin:0} 
body{color: #1b1b1b!important; background-color:#fff!important;font-size:16px!important;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;font-family: "Signika", sans-serif;font-optical-sizing: auto; font-weight: 300; font-style: normal;line-height: 1.5;}
h1, h2, h3, h4, h5, h6, ol, ul {margin: 0; padding: 0; font-weight: normal} ol, ul { list-style: none}
.container, .container-fluid{margin-right: auto !important;margin-left: auto !important; width: 100%; max-width: 100%!important}
.container{padding-left: 15px !important; padding-right: 15px !important}
@media (min-width:1200px){.container{max-width:1140px!important}}
@media (min-width:1400px){.container{max-width:1340px!important}}
html::-webkit-scrollbar-track { background: #d9f2ff; box-shadow: inset 0 0 6px #fff; }
html::-webkit-scrollbar-thumb { background:#9360a7}
html::-webkit-scrollbar { width: 8px; }
a{color:#174fa3;outline:none!important; border: none!important; text-decoration:none}
a:hover{text-decoration:none!important; color:var(--color-teal);outline:none!important; border: none!important}
::-moz-selection { background-color:#9360a7; color:#fff;-webkit-text-fill-color:#fff}
::selection {background-color:#9360a7; color:#fff;-webkit-text-fill-color:#fff}
*:focus{outline:none!important;text-decoration:none!important;border:none!important}
.tc{text-align:center!important}
.pr{position: relative}
.tl, .tl p, .tl a{text-align:left!important}
p{line-height: 130%!important}
.smooth a, a{-webkit-transition: all 400ms linear!important; -moz-transition: all 400ms linear!important; -o-transition: all 400ms linear!important; transition: all 400ms linear!important}
.pt35{padding-top:35px!important}

.nm15{margin-top:-15px!important}
.mt15{margin-top:15px!important}
.dummy{max-width: 10px}
.fw-500{font-weight: 500}.fw-600{font-weight: 600}.fw-700{font-weight: 700}.fw-800{font-weight: 800}
.zi{z-index: 99!important}
.ucase{text-transform: uppercase}
.ul ul{list-style-type:disc;padding-left:20px} .ul ul li{padding-left:5px; padding-bottom: 10px}
.ul ol{list-style-type:decimal;padding-left:20px} .ul ol li{padding-left:5px; padding-bottom: 10px}

/* ------------------- IDS and Classes------------------------ */

#page-container{overflow-x: hidden}
.header{background-color: #b0ddc9;}
.logo img{height: 70px!important; width: auto; margin-top: 35px}
.banner{min-height: 300px; position: relative}
.banner:before { content: ''; position: absolute; top: 0; left:-50px; width: 100%; height: 100%; display: inline-block!important; bottom: 0; background-image: url('../img/icon.svg'); background-repeat: no-repeat;background-position:left;background-size:auto 80%}

.footer{border-bottom:15px solid #b0ddc9}
.gb{ background: linear-gradient(to top,#b0ddc9 0%, #915aa5 100% ); }
.key > div > .wpb_wrapper {background-image: url('../img/keyboard.jpg'); background-repeat: no-repeat;background-position:left;background-size:100% auto}
.purple-box{background-color: rgba(147,96,167,0.95); color: #fff; padding: 20px}
.gray-bg{background-color: #3c3c3b; color: #fff}
.f-logo img{height: 70px!important; width: auto; margin-top: 35px}
/* ------------------- Text & Colors------------------------ */


.white, .white p, .white h1, .white h2, .white h3{color: #fff!important}
.green, .green p{color: #afdac9!important}
.purple, .purple p, .purple a{color:#925aa5!important}
h1{font-size:30px;line-height: 1.2}
.banner h1{color: #fff; font-weight: 600}
.t1, .t3{font-size: 24px}
.t2, ul li{font-size: 20px; font-weight: 300}
.purple a:hover{color:#b0ddc9!important}
/* ------------------- Links ------------------------ */

#totopbutton { display: inline-block; background-color:var(--color-teal);width:40px; height:40px; text-align: center;position: fixed; bottom: 0; right: 0;  opacity:0; visibility: hidden; z-index:999999!important; cursor: pointer; }
#totopbutton svg{fill:#fff; width: 30px; height: 30px; margin-top:8px}
#totopbutton:hover svg {fill:var(--color-blue)!important}#totopbutton:hover{background-color:var(--color-green)}
#totopbutton.show { opacity: 1; visibility: visible}

a.linkedin {
    display: inline-flex;
    align-items: center;
    text-decoration: none;
    color: #925aa5; font-size:24px;
    font-weight:200;  padding: 4px 8px;
}

a.linkedin svg {
    width: 30px;
    height: 30px;
    fill: #fff;
    background-color: #925aa5;
    border-radius: 50%;
    padding: 5px;
    margin-right: 8px;
    transition: all 0.3s ease;
}

a.linkedin:hover svg {
    fill: #3c3c3b;
    background-color: #b0ddc9;
}

a.linkedin:hover {
    color: #b0ddc9;
}