body {margin:0;padding:0;font-family:'soleil', sans-serif; font-weight:300;background-color: #9d1da6;overflow: visible;}
section {background-color: white;background-repeat:  no-repeat;}
.section-container {max-width: 990px; margin: 0 auto;padding: 30px 20px;font-size: 1.4em;}

header {position: fixed;top: 0;left: 0;width: 100%;z-index: 5000;}
header b {position: absolute; left: 0; top:0; right: 0; bottom: 0; background: linear-gradient(100deg, rgba(62,26,145,1) 0%, rgba(100,57,160,1) 55%, rgba(157,75,153,1) 100%);z-index: -1;opacity: 0;}
header a.logo {display: block;}
header a.logo img {height: 50px;}
header nav span {padding: 0 0 0 20px;}
header .section-container {display: flex;align-content: stretch;justify-content:space-between;align-items:center;padding: 10px 20px;}
header .section-container nav a {font-size:14pt; color: white; text-decoration: none; text-transform: uppercase;}

section#top {
    background: linear-gradient(100deg, rgba(62,26,145,1) 0%, rgb(211, 68, 168) 100%);
    box-sizing: border-box;position: absolute;top: 0;left: 0;width: 100vw;height: 100vh;overflow: hidden;color: white;
    box-shadow: 0 -11px 5px -5px rgba(0,0,0,0.75);
}
section#top b {
    display: block;position: absolute;top: 0;left: 0;width: 100vw;height: 100vh;
    background-image: url("../img/header.png");background-size: cover;background-position: center bottom;
}
/*section#top {*/
/*    background: linear-gradient(100deg, rgba(62,26,145,1) 0%, rgba(100,57,160,1) 55%, rgba(157,75,153,1) 100%);*/
/*    box-sizing: border-box;position: absolute;top: 0;left: 0;width: 100vw;height: 100vh;*/
/*    background-image: url("../img/header.png");background-size: cover;background-position: center top;overflow: hidden;color: white;*/
/*    box-shadow: 0 -11px 5px -5px rgba(0,0,0,0.75);*/
/*}*/
section#top canvas {width: 100vw;height: 100vh;position: absolute;left: 0;top: 0;}
section#top .section-container {max-width: 1200px;margin: 13% auto 0 auto;text-shadow: 0 0 2px rgba(150, 150, 150, 0.77);}
section#top .section-container h1 {font-size: 27pt;font-weight: normal;}
section#top .section-container h2 {font-size: 20pt;font-weight: normal;}

section#about {margin-top: 100vh;background-image: url(../img/bg-left01.svg); background-position: center left;}
section#about .section-container {display: flex;padding-top: 150px; padding-bottom: 130px;}
section#about .section-container div {flex: 1 1 0; width: 50%;}
section#about .section-container div:last-child {display: flex;}
section#about .section-container div img {max-width: 100%;object-fit: contain;}
section#about .section-container div i {text-decoration: underline;}

section#principles {background-image: url(../img/bg-right01.svg);background-position: center right;}
section#principles .section-container {text-align: center;}
section#principles .section-container div.grid4x4 {display: grid;grid-template-columns: 1fr 1fr;grid-column-gap: 35px;grid-row-gap:35px;}
section#principles .section-container div.grid4x4 div {border: 0.5px solid #eee;border-radius: 10px;box-shadow: 0 0 45px 0 rgba(0, 0, 0, 0.05);background-color: white;}
section#principles .section-container div.grid4x4 div img {margin: 20px 0;}
section#principles .section-container div.grid4x4 div h4 {font-size: 18pt;font-weight: normal;margin: 0 0 20px;}

section#services {background-image: url(../img/bg-center01.svg); background-position: center center;}
section#services .section-container h3 {font-size: 26pt;}
section#services .section-container {display: flex;padding-top: 150px; padding-bottom: 130px;}
section#services .section-container > div {flex: 1 1 0; width: 50%;}
section#services .section-container > div img {max-width: 80%;}
section#services .section-container div.rows {display: flex;flex-direction: column;align-items: center;justify-content: space-evenly;}
section#services .section-container div.rows div {display:block;width: 100%;padding: 5px;border: 0.5px solid #eee;border-radius: 10px;box-shadow: 0 0 45px 0 rgba(0, 0, 0, 0.05);background-color: white;}
section#services .section-container div.rows img {max-height: 100px;margin: 0 10px;vertical-align: middle;}
section#services .section-container div.rows h4 {display: inline;}

section#partners {background-color: #9d1da6;position: relative;overflow: hidden;}
section#partners b {position: absolute; box-shadow:inset 0 0 10px #000000;left:-5%;right: -5%; top:0;bottom: 0;}
section#partners span {position: absolute; left:20px; right: 20px; top: 30px; bottom: 0;font-size: 20vw; line-height: 200px; font-weight: bold; text-transform: uppercase;text-align: center;color: #881D91;text-shadow: -1px -1px 1px rgba(0, 0, 0, 0.5), 1px 1px 1px #bb4dee; }
section#partners .section-container {height: 222px;max-width:none;margin:5px 40px;display: flex;justify-content: space-between;align-items:center;position: relative;}
section#partners .section-container div {width: 110px; height: 110px;padding: 10px;background-color: rgba(255, 255, 255, 0.9);border-radius: 50%;z-index:10;border: 2px solid white;}
section#partners .section-container div img {width: 100%;height: 100%}

section#contact .section-container {padding-bottom: 3em;}
section#contact .section-container h3 {margin-bottom: 2em;}

section#footer {background-color: #9d1da6;position: relative;overflow: hidden;}
section#footer b {position: absolute; box-shadow: 0 0 10px 5px #000000;left:-5%;right: -5%; height: 1px;}
section#footer .section-container {max-width: none;display: flex;flex-wrap: nowrap;justify-content:space-around;margin:0 40px;padding: 20px 0;}
section#footer .section-container div, section#footer .section-container div a, section#footer .section-container div a:visited {font-size: 1.5vw;letter-spacing: 2px ;color: #881d91;text-shadow: -1px -1px 1px #000, 1px 1px 1px #bb4dee;}
section#footer .section-container div i {font-size: 2vw;vertical-align: middle; }
section#footer .section-container  .rtl {direction: rtl;text-align: left;unicode-bidi: bidi-override;}

input, textarea {font-size: 18px;font-style: italic;display: block;width: 100%;height: 40px;border: none;background-color: transparent;color: #222;border-radius: 0;border-bottom: 2px solid rgba(0, 0, 0, 0.2);}
input:required, textarea:required {box-shadow: none !important;}
input:focus, textarea:focus {outline: none !important;box-shadow: none !important;background-color: transparent !important;}

textarea {height: 130px;}

label {width:100%;color: #000;font-style: italic;font-size: 18px;font-weight: normal;position: absolute;pointer-events: none;left: 0;top: 14px;transition: top 0.3s ease-out, font-size 0.3s ease-out, color 0.3s ease-out;margin-bottom: 0;}
form .form-group {position: relative;z-index: 1;margin-bottom: 30px;}
form .bar {position: relative;display: block;width: 100%;}
form .bar:before, form .bar:after {content: '';height: 2px;width: 0;bottom: 0;position: absolute;background-color: #fff;-webkit-transition: 0.5s ease all;transition: 0.5s ease all;}
form .bar:before {left: 50%;}
form .bar:after {right: 50%;}
form ul {list-style: none; margin: 0;padding: 0;font-size: 16px;}
input:focus ~ label,
textarea:focus ~ label,
input:valid ~ label,
textarea:valid ~ label {top: -17px;font-size: 12px;color: #666;}
input:focus ~ .bar:before, textarea:focus ~ .bar:before, input:focus ~ .bar:after, textarea:focus ~ .bar:after {width: 50%;background-color: #000;}

.btn {position: relative;z-index: 1;min-width: 160px;height: 48px;line-height: 48px;font-size: 12px;font-weight: 600;letter-spacing: 1px;padding: 0 20px;text-align: center;text-transform: uppercase;background-size: 200% auto;color: #fff;
    box-shadow: 0 3px 20px rgba(0, 0, 0, 0.1);border-radius: 100px;
    background-image: linear-gradient(to right, #846FF4 0%, #F17674 51%, #846FF4 100%);
    border: 1px solid #fff;
    transition: all 500ms;
    display: block;
    margin: 0 auto;

}
.btn:hover {background-position: right center; color: #fff;}

/*!Icons*/
@font-face {
    font-family: "oratu-web";
    src:url("../fonts/oratu-web.eot");
    src:url("../fonts/oratu-web.eot?#iefix") format("embedded-opentype"), url("../fonts/oratu-web.woff") format("woff"), url("../fonts/oratu-web.ttf") format("truetype"),url("../fonts/oratu-web.svg#oratu-web") format("svg");
    font-weight: normal;
    font-style: normal;
}

[class^="icon-"]:before, [class*=" icon-"]:before {font-family: "oratu-web";font-style: normal !important;font-weight: normal !important;font-variant: normal !important;text-transform: none !important;speak: none;line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.icon-pencil:before {content: "\e906";}
.icon-lifebuoy:before {content: "\e941";}
.icon-bubbles:before {content: "\e96d";}
.icon-professional:before {content: "\e907";}
.icon-magic-wand:before {content: "\e997";}
.icon-rocket:before {content: "\e9a5";}
.icon-lab:before {content: "\e9aa";}
.icon-heart:before {content: "\e9da";}
.icon-embed:before {content: "\ea80";}
.icon-office:before {content: "\e903";}
.icon-phone:before {content: "\e942";}
.icon-envelop:before {content: "\e945";}
.icon-location:before {content: "\e948";}
.icon-twitter:before {content: "\ea91";}
.icon-loupe:before {content: "\ea92";}
.icon-link:before {content: "\ea93";}
.icon-linkedin:before {content: "\ea94";}