/*** RESET ***/
HTML{-webkit-text-size-adjust: 100%}
HTML,BODY{margin: 0px; padding: 0px; background: #fff}
H1,H2,H3,H4,H5,DIV,HEADER,NAV,FOOTER,SECTION, P,SPAN,A,UL,OL,LI,IMG,FORM,FIELDSET,INPUT,TEXTAREA,SELECT,OPTION,TABLE,TR,TH,TD{color: #000; font-family: 'Source Sans Pro', sans-serif; font-size: 16px; line-height: 24px; font-weight: normal; margin: 0px; padding: 0px}
IMG, FIELDSET, INPUT{border: none}
DIV, IMG{font-size: 1px; line-height: 0px}
UL{list-style-type: none}
TABLE{border-spacing: 0px; border-collapse: collapse}
/*** FONTS ***/
H1{font-size: 50px; line-height: 60px; font-weight: 300; letter-spacing: -2px; word-spacing: 4px; padding: 50px 0px 25px 0px}
P.body-text, P.body-text A, P.body-text SPAN{font-size: 18px; line-height: 26px}
P.body-text{padding: 0px 0px 30px 0px}
P.body-text--more-padding{padding-bottom: 40px}
P.body-text--less-padding{padding-bottom: 20px}
P.body-text STRONG{line-height: 30px; font-weight: 700}
/* COMMON CLASSES */
.clear{width: 100%; clear: both; font-size: 1px; line-height: 0px}
BODY .no-padding{padding-bottom: 0px}
BODY .precede-media{margin-bottom: 0px; padding-bottom: 0px}
BODY .follow-media{margin-top: 0px; padding-top: 0px}
.purple{color: #59007a}
.cerise{color: #b50472}
/*** HEADER ***/
HEADER{height: 96px; border-bottom: solid 1px #c8c8c8; position: relative}
.logo{position: absolute; left: 50px; top: 12px}
.nav{text-align: justify; position: absolute; right: 50px; top: 38px}
.nav UL LI{padding: 0px 0px 0px 50px; display: inline-block}
.nav A{font-size: 18px; line-height: 18px; text-decoration: none; border-bottom: solid 2px #fff; transition: .3s}
.nav A:hover{border-bottom: solid 2px #300048}
.icon-menu{width: 40px; height: 20px; position: absolute; right: 5%; top: 45px; cursor: pointer; display: none}
.icon-menu-active{height: 30px}
.icon-menu DIV{width: 40px; height: 2px; position: absolute; left: 0px; top: 0px; transition: .3s ease-in-out; background: #000}
.icon-menu .icon-menu-inner-2{top: 9px}
.icon-menu .icon-menu-inner-3{top: 18px}
.icon-menu-active .icon-menu-inner-1{top: 10px; transform: rotate(45deg)}
.icon-menu-active .icon-menu-inner-3{top: 10px; transform: rotate(-45deg)}
.icon-menu-active .icon-menu-inner-2{width: 0px; height: 0px; left: 13px}
/*** CONTAINER ***/
.container{width: 90%; max-width: 1200px; margin: 0px auto; position: relative}
.container--padding-bottom{padding-bottom: 30px}
/*** FOOTER ***/
FOOTER{background: #180024}
FOOTER .container{padding: 50px 0px}
FOOTER IMG{width: auto; height: 70px; margin-top: -35px; position: absolute; left: 0px; top: 50%}
FOOTER P, FOOTER A, FOOTER SPAN{color: #fff; font-size: 16px; line-height: 16px}
FOOTER SPAN{color: #e0e0e0; margin: 0px 15px}
FOOTER P{text-align: center; padding-left: 20px}
/*** MEDIA: ISO BANNER ***/
.iso-banner{width: 100%; max-width: 1200px; margin: 45px auto 50px; position: relative; overflow: hidden}
.iso-banner__img{width: 100%; height: auto}
/*** HOME BANNER ***/
#banner{overflow: hidden; position: relative; background-image: url(../images/banner.webp); background-repeat: no-repeat; background-position: right top; background-size: cover}
#banner SECTION{width: calc(50% - 120px); height: 100%; position: absolute; left: 0px; top: 0px; background-color: rgba(48,0,72,0.9)}
#banner SECTION::after{content: ""; width: 0px; height: 0px; border-right: 120px solid transparent; border-top: calc(100vh + 100px) solid #300048; position: absolute; right: -120px; top: 0px; opacity: 0.9}
#banner .container-inner{width: 45%; padding: 80px 0px}
#banner H1{font-size: 50px; line-height: 60px; color: #fff; padding: 0px}
#banner H1 SPAN{display: none}
P.banner-intro{color: #fff; font-size: 50px; line-height: 60px; font-weight: 700; letter-spacing: -1px; padding: 30px 50px 50px 0px}
P.banner-main{color: #fff; font-size: 20px; line-height: 30px; font-weight: 400; padding-right: 50px}
/*** HOME LOGIN ***/
#home-login{padding: 40px 0px; border-bottom: solid 1px #c8c8c8; background: #fff}
#home-login P, #home-login A{color: #b50472; font-size: 26px; line-height: 26px; font-weight: 700; text-decoration: none; letter-spacing: -1.5px; word-spacing: 1px}
#home-login A:hover{text-decoration: underline}
#home-login P.left{float: left}
#home-login P.right{float: right; padding-right: 40px; position: relative}
#home-login P.right::after{content: ""; width: 30px; height: 23px; position: absolute; right: 0px; top: 1px; background: url(../images/arrow-large.png)}
/*** HOME NEWS ***/
#home-news{padding: 60px 0px}
#featured-article{width: calc(100% - 2px); border: solid 1px #c8c8c8; display: flex}
#featured-article-left{width: calc(33.33% - 20px); position: relative}
#featured-article-right{width: calc(66.66% + 20px)}
P.news-header{padding: 60px 25px 25px 25px}
P.news-header A{color: #181818; font-size: 20px; line-height: 28px; font-weight: 700; text-decoration: none; letter-spacing: -1px; border-bottom: solid 2px #fff; transition: 0.3s}
P.news-header A:hover{border-color: #300048}
P.news-description{padding: 0px 25px 50px 25px}
P.news-more{padding: 0px 25px 60px 25px}
P.news-more A{font-size: 18px; line-height: 18px}
#home-news SPAN{padding-top: 45px; display: flex; justify-content: space-between}
.home-article{width: calc(33.33% - 20px); padding-bottom: 85px; border: solid 1px #c8c8c8; position: relative}
.home-article IMG{width: 100%; height: auto}
P.news-header-main{padding-top: 30px}
P.news-description-main{padding-bottom: 0px}
P.news-more-main{padding-bottom: 0px; position: absolute; bottom: 30px}
#home-services{padding: 80px 0px; background: #59007a}
.home-services{display: inline-block; vertical-align: top}
.home-services-1{width: 300px}
.home-services-2, .home-services-3{width: calc(50% - 150px); padding-top: 10px}
.home-services H2{color: #fff; font-size: 50px; line-height: 50px; padding: 0px; letter-spacing: -1px}
.home-services P{color: #fff}
.home-services P.home-service-header{font-size: 24px; line-height: 32px; font-weight: 700; margin-left: 60px; padding: 60px 0px 40px 0px}
.home-services P.home-service-header-top{padding-top: 0px}
.home-services P.home-service-header-no-padding-bottom{padding-bottom: 0px}
.home-services .home-service{color: #fff; text-decoration: none; margin: 0px 0px -1px 60px; padding: 15px 0px 15px 0px; border: solid 1px #c000e0; border-left: none; border-right: none; display: block; transition: .3s}
.home-services A.home-service:hover{background: #380058}
@media only screen and (min-width: 1300px)
{
H1{font-size: 60px; line-height: 70px; letter-spacing: -2.5px; padding-top: 60px}
#banner DIV.container-inner{padding: 100px 0px}
P.banner-intro{font-size: 56px; line-height: 66px}
}
@media only screen and (min-width: 1400px)
{
#banner DIV.container-inner{padding: 150px 0px}
}
@media only screen and (max-width: 960px)
{
.logo{left: 5%}
.nav{width: 0px; height: calc(100vh - 97px); left: 0px; top: 97px; overflow: hidden; z-index: 99; background-color: rgba(255,255,255,0)}
.nav--active{width: 100%; overflow: visible; transition: all 1s cubic-bezier(0, .99, 0, 0.99); background-color: rgba(255,255,255,1)}
.nav UL{padding-top: 60px}
.nav UL LI{padding: 10px 0px 5px 0px; padding-left: 5%; display: block}
.nav A{font-size: 20px; line-height: 1}
.icon-menu{display: block}
#banner SECTION{width: calc(65% - 120px)}
#banner .container-inner{width: 60%}
#featured-article{flex-direction: column}
#featured-article-left{width: 100%; order: 2}
#featured-article-right{width: 100%; padding-top: 56.25%; order: 1}
P.news-header{padding: 25px 20px 20px 20px}
P.news-description{padding: 0px 20px 35px 20px}
P.news-more{padding: 0px 20px 30px 20px}
#home-news SPAN{padding-top: 40px; flex-wrap: wrap}
.home-article{width: calc(50% - 20px)}
.home-article:last-child{margin-top: 40px}
P.news-description-main{padding-bottom: 0px}
P.news-more-main{padding-bottom: 0px}
#home-services SPAN{width: calc(100% - 300px); padding-top: 10px; display: inline-block; vertical-align: top}
.home-services-2, .home-services-3{width: 100%; padding-top: 0px; display: block}
.home-services-2{padding-bottom: 50px}
.home-services P.home-service-header, .home-services .home-service{margin-left: 20px}
}
@media only screen and (max-width: 750px)
{
H1{font-size: 40px; line-height: 50px; padding: 45px 0px 25px 0px}
FOOTER IMG{margin: 0px; top: 56px}
FOOTER SPAN{color: #180024; font-size: 1px; line-height: 1px; margin: 0px; display: block}
FOOTER P{line-height: 28px; text-align: left; padding-left: 110px}
/*** MEDIA: ISO BANNER ***/
.iso-banner{margin: 40px auto 45px}
#banner SECTION{display: none}
#banner .container{width: 100%; padding: 100px 0px}
#banner .container-inner{width: 90%; padding: 60px 0px; padding-left: 5%; padding-right: 5%; border: solid 1px #300048; border-left: none; border-right: none; background-color: rgba(48,0,72,0.85)}
P.banner-intro{font-size: 32px; line-height: 40px; padding-right: 0px; padding-bottom: 40px}
P.banner-main{padding-right: 0px}
#home-login P.left{padding-bottom: 20px; float: none}
#home-login P.right{float: none; display: inline-block}
#home-login P.right::after{top: 3px}
#featured-article-left{padding-bottom: 85px}
P.news-description{padding-bottom: 0px}
P.news-more{padding-bottom: 0px; position: absolute; bottom: 30px}
#home-news SPAN{padding-top: 0px; display: block}
.home-article{width: calc(100% - 2px)}
.home-article{margin-top: 40px}
#home-services{padding: 60px 0px}
#home-services H2{font-size: 40px; line-height: 1}
#home-services SPAN{width: 100%; padding-top: 50px; display: block}
.home-services P.home-service-header, .home-services .home-service{margin: 0px}
}