.btnPrimary.light {
color: #000;
background: #FFF;
}
.heroAssumi {
position: relative;
}
.overlayHero{
position: absolute;
background-color: #081112;
opacity: 0.2;
top: 0;
left: 0;
bottom: 0;
right: 0;
}
.contHeroAssumi {
text-align: center;
height: 100vh;
display: flex;
justify-content: space-between;
flex-direction: column;
gap: 0;
align-items: center;
margin: 0px;
z-index: 1;
position: relative;
}
.heroAssumi .titleHero{
color: #FFF;
font-size: 64px;
font-style: normal;
font-weight: 600;
line-height: 110.523%; letter-spacing: -2px;
margin-top: 42px;
margin-bottom: 0px;
}
.heroAssumi .titleHero span{
color:var(--primary-600);
}
.topTitleHero{
color:var(--primary-600);
font-weight: 500;
font-size: 22px;
margin: 0px 0px 0px 0px;
text-align: center;
}
.heroAssumi .subHero {
color: #FFF;
font-size: 22px;
font-style: normal;
font-weight: 500;
line-height: normal;
width: 45%;
margin: 0 auto;
}
.heroAssumi .btnContainer {
display: flex;
justify-content: center;
gap: 12px;
margin-top: 42px;
}
.btnPrimary {
border-radius: 999px;
border: 1px solid #FFF;
color: #fff;
display: flex;
padding: 16px 32px;
justify-content: center;
align-items: center;
gap: 10px;
transition: 0.2s all ease-in-out;
text-align: center;
font-size: 18px;
font-style: normal;
font-weight: 600;
line-height: normal;
letter-spacing: -0.54px;
text-decoration: none;
width: max-content;
}
.btnPrimary:hover {
color: #000;
background: #FFF;
box-shadow: 0px 0px 50px 0px #B0AAF8;
}
.heroAssumi{
background-position: center;
background-size: 80%;
background-repeat: no-repeat;
}
.fooHero {
position: relative;
width: 100%;
text-align: center;
}
.fooHero {
position: relative;
width: 100%;
text-align: center;
display: inline-block;
}
img.percheImg {
position: relative;
bottom: -5px;
z-index: 0;
}
.overlayHero {
background: linear-gradient(0deg, #091314 14.39%, rgba(9, 19, 20, 0.00) 100%);
position: absolute;
left: 0;
right: 0;
bottom: 0;
top: 50%;
opacity: 0.9;
z-index: 2;
}
.textHeroAssumi{
color: #FFF;
text-align: center;
font-size: 22px;
font-style: normal;
font-weight: 500;
line-height: normal;
margin: 42px 0px 0px;
}
.firstHeroAssumi{
position: relative;
width: 100%;
}
.gA {
position: absolute;
left: 25%;
top: 0;
z-index: -2;
}
.contAvatarAssumi{
display: flex;
justify-content: center;
align-items: center;
}
.contAvatarAssumi {
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: nowrap;
flex-direction: row;
width: 100%;
padding: 200px 70px 0px;
}
.singleAvAss {
height: 230px;
position: relative;
display: inline-block;
width: 100%;
}
.ca1 {
position: absolute;
top: 5%;
left: 15%;
}
.ca2 {
position: absolute;
bottom: 0;
left: 5%;
}
.ca3 {
position: absolute;
top: 0;
left: 15%;
}
.ca4 {
position: absolute;
bottom: 0;
left: 15%;
}
.ca5 {
position: absolute;
bottom: 5%;
left: 15%;
}
.ca6 {
position: absolute;
top: 5%;
left: 15%;
}
.dA {
position: absolute;
left: 0;
top: 45%;
}
.dA2 {
position: absolute;
right: 0;
top: 45%;
}
.secondHeroAssumi {
margin-bottom: 150px;
text-align: center;
width: 100%;
}
.circleAssumi{
width: 560px;
height: 399px;
transform: rotate(-49.878deg);
flex-shrink: 0;
border-radius: 560px;
opacity: 0.25;
background: var(--Quaternary-400, #9C95F6);
filter: blur(150px);
position: absolute;
left: -250px;
}
.stepAssumi{
margin-top: 40px;
overflow: hidden;
}
.step1Assumi{
text-align: center;
position: relative;
}
.line1{
height: 150px;
width: 1px;
margin: 0 auto;
background: linear-gradient(0deg, #FFF 0%, rgba(255, 255, 255, 0.00) 86.25%);
}
.step1 {
display: flex;
width: 53px;
height: 53px;
flex-direction: column;
justify-content: center;
border-radius: 9999px;
background: linear-gradient(74deg, #00CCB2 -18.54%, #84FFBE 89.8%);
color: #001310;
text-align: center;
font-size: 32px;
font-style: normal;
font-weight: 600;
line-height: 110.523%;
letter-spacing: -2px;
margin: 0 auto;
overflow: hidden;
}
.topTitStep1{
text-align: center;
font-size: 24px;
font-style: normal;
font-weight: 600;
line-height: 110.523%; letter-spacing: -0.48px;
background: var(--Gradient-Primary, linear-gradient(60deg, #00CCB2 0.19%, #84FFBE 100.03%));
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
margin-bottom: 24px;
}
.titStep1{
font-size: 48px;
font-style: normal;
font-weight: 600;
line-height: 110.523%; letter-spacing: -1.44px;
background: linear-gradient(180deg, #FFF 0%, #626262 325%);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
text-align: center;
margin: 0px;
}
.contSpecializzazioni{
display: flex;
justify-content: space-between;
align-items: flex-start;
margin-top: 48px;
}
.specilizzazione{
display: flex;
width: 350px;
padding: 32px;
flex-direction: column;
align-items: flex-start;
gap: 24px;
flex-shrink: 0;
border-radius: 20px;
border: 2px solid rgba(255, 255, 255, 0.15);
background: rgba(255, 255, 255, 0.05);
backdrop-filter: blur(25px);
padding: 32px;
}
.tsi{
color: #FFF;
font-size: 24px;
font-style: normal;
font-weight: 600;
line-height: 110.523%; margin: 0px;
}
.specilizzazione ul{
padding: 0px 15px;
margin: 0px;
text-align: left;
}
.specilizzazione ul li{
color: #FFF;
font-size: 16px;
font-style: normal;
font-weight: 500;
line-height: 110.523%; margin: 12px 0px;
}
.topTitStep2 {
text-align: center;
font-size: 24px;
font-style: normal;
font-weight: 600;
line-height: 110.523%;
letter-spacing: -0.48px;
background: linear-gradient(90deg, #A05F00 50% , #FAD9AA 60%);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
margin-bottom: 24px;
}
.step2 {
display: flex;
width: 53px;
height: 53px;
flex-direction: column;
justify-content: center;
border-radius: 9999px;
background: linear-gradient(90deg, #A05F00 0% , #FAD9AA 160%);
color: #001310;
text-align: center;
font-size: 32px;
font-style: normal;
font-weight: 600;
line-height: 110.523%;
letter-spacing: -2px;
margin: 0 auto;
}
.contSpecializzazioni2{
border-radius: 20px;
border: 2px solid rgba(255, 255, 255, 0.15);
background: rgba(255, 255, 255, 0.05);
backdrop-filter: blur(25px);
display: flex;
flex-direction: column;
align-items: center;
margin-top: 48px;
}
.rowS2{
display: flex;
align-items: flex-start;
}
.columnRS2{
display: flex;
padding: 48px;
flex-direction: column;
align-items: flex-start;
gap: 24px;
flex: 1 0 0;
}
.titColumn{
color: #FFF;
font-size: 24px;
font-style: normal;
font-weight: 700;
line-height: normal;
margin: 0px;
}
.textColumn{
color: #FFF;
font-size: 18px;
font-style: normal;
font-weight: 500;
line-height: normal;
margin: 0px;
}
.lineColumn{
background: rgba(255, 255, 255, 0.15);
height: 1px;
width: 100%;
}
.topTitStep3 {
text-align: center;
font-size: 24px;
font-style: normal;
font-weight: 600;
line-height: 110.523%;
letter-spacing: -0.48px;
background: linear-gradient(71deg, #726ACC -16.17%, #D7D4FB 120.39%);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
margin-bottom: 24px;
}
.step3 {
display: flex;
width: 53px;
height: 53px;
flex-direction: column;
justify-content: center;
border-radius: 9999px;
background: linear-gradient(71deg, #726ACC -16.17%, #D7D4FB 120.39%);
color: #001310;
text-align: center;
font-size: 32px;
font-style: normal;
font-weight: 600;
line-height: 110.523%;
letter-spacing: -2px;
margin: 0 auto;
}
.project3{
display: flex;
flex-direction: column;
align-items: center;
border-radius: 20px;
border: 2px solid rgba(255, 255, 255, 0.15);
background: rgba(255, 255, 255, 0.05);
backdrop-filter: blur(25px);
margin-top: 48px;
}
.rowProject3{
display: flex;
align-items: flex-start;
height: 540px;
}
.leftProject3{
display: flex;
padding: 48px;
flex-direction: column;
justify-content: center;
align-items: flex-start;
gap: 24px;
flex: 1 0 0;
align-self: stretch;
}
.rightProject3{
background: linear-gradient(71deg, #161528 -16.17%, #5B55A3 120.39%);
position: relative;
width: 50%;
height: 540px;
}
.rightProject3 img {
margin-top: 55px;
}
.lineFirst {
display: flex;
align-items: center;
gap: 24px;
align-self: stretch;
flex-direction: column;
align-content: flex-start;
}
.lineTextFirst{
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 8px;
flex: 1 0 0;
}
.titLinefirst{
margin: 0px;
color: #FFF;
font-size: 24px;
font-style: normal;
font-weight: 700;
line-height: normal;
}
.mansioneFirst{
margin: 0px;
color: #FFF;
font-size: 18px;
font-style: normal;
font-weight: 500;
line-height: normal;
}
.titTitoloFirst{
color: #FFF;
font-size: 32px;
font-style: normal;
font-weight: 600;
line-height: normal;
margin: 0px;
}
.textFirstLine{
color: rgba(255, 255, 255, 0.75);
font-size: 18px;
font-style: normal;
font-weight: 500;
line-height: normal;
margin: 0px;
}
.firstFirstLine{
display: flex;
align-items: center;
gap: 24px;
align-self: stretch;
}
.firstFirstLine img{
border-radius: 97px;
border: 5px solid #FFF;
box-shadow: 0px 0px 21.684px 0px #C4BFFA;
}
.secondProject3.rightProject3{
background: linear-gradient(71deg, #AAEEE5 -16.17%, #00221D 120.39%);
}
.secondProject3.rightProject3 img {
right: auto;
left: -60px !important;
position: absolute;
margin-top: 30px;
}
.secondHero {
margin: 124px 0px 250px;
}
.contLoghi {
width: 90%;
margin: 0 auto;
display: flex;
align-items: center;
justify-content: center;
position: relative;
gap: 14px;
flex-wrap: wrap;
flex-direction: row;
}
.titleLoghi {
color: #FFF;
text-align: center;
font-size: 18px;
font-style: normal;
font-weight: 400;
line-height: normal;
}
.singleLogo {
width: 20%;
}
.contactFooter > img {
position: absolute;
bottom: -240px;
left: 240px;
}
.contactFooter {
position: relative;
}
.circleStep1 {
width: 560px;
height: 560px;
flex-shrink: 0;
border-radius: 560px;
opacity: 0.25;
background: #4EB1B2;
filter: blur(150px);
position: absolute;
right: -250px;
top: 260px;
}
.step2Assumi{
position: relative;
}
.circleStep2 {
width: 560px;
height: 399px;
transform: rotate(-49.878deg);
flex-shrink: 0;
border-radius: 560px;
opacity: 0.4;
background: #F5B455;
filter: blur(150px);
position: absolute;
left: -300px;
top: 50%;
z-index: -10;
}
.imgStep2 {
position: absolute;
right: 0;
top: 210px;
}   @media only screen and (min-width : 1025px) and (max-width : 1198px) {
} @media (min-width: 768px) and (max-width: 1024px) {
} @media (min-width: 768px) and (max-width: 1024px) and (orientation:landscape) {
} @media (min-width: 768px) and (max-width: 1024px) and (orientation:portrait){
} @media only screen and (min-width: 320px) and (max-width: 767px) {
.gA {
left: -15%;
width: 100%;
}
.contAvatarAssumi {
padding: 310px 0px 0px;
}
.singleAvAss.sA1 {
display: none;
}
.singleAvAss.sA2 {
height: inherit;
left: -20px;
}
.singleAvAss.sA2 img {
height: 90px;
}
.singleAvAss {
height: inherit;
}
.singleAvAss.sA3 img {
height: 90px;
}
.singleAvAss.sA3 {
bottom: 120px;
}
.singleAvAss.sA6 {
display: none;
}
.singleAvAss.sA4 img {
height: 80px;
}
.singleAvAss.sA5 img {
height: 70px;
}
.secondHeroAssumi .titleHero {
font-size: 36px;
letter-spacing: 0;
}
.secondHeroAssumi {
padding: 24px;
}
p.textHeroAssumi {
font-size: 18px;
}
.dA {
position: absolute;
left: 0;
top: 55%;
width: 15%;
}
.dA2 {
position: absolute;
right: 0;
top: 55%;
width: 15%;
}
.contHeroAssumi {
height: auto;
}
.topTitStep1, .topTitStep2, .topTitStep3 {
font-size: 18px;
letter-spacing: 0px;
}
.titStep1, .titStep2, .titStep3 {
font-size: 32px;
letter-spacing: -1px;
}
.contSpecializzazioni {
display: flex;
justify-content: space-between;
align-items: flex-start;
margin-top: 48px;
flex-direction: column;
gap: 32px;
}
.specilizzazione img {
height: 48px;
}
.rowS2 {
display: flex;
align-items: flex-start;
flex-direction: column;
}
.columnRS2 {
padding: 32px;
}
img.imgStep2 {
width: 60%;
top: 130px;
}
.rowProject3 {
display: flex;
align-items: flex-start;
height: auto;
flex-direction: column;
width: 100%;
}
.leftProject3 {
padding: 32px 32px 64px 32px;
}
.firstFirstLine img {
height: 48px;
border: 2px solid #fff;
}
p.titLinefirst {
font-size: 20px;
}
p.mansioneFirst {
font-size: 14px;
}
p.titTitoloFirst {
font-size: 24px;
}
p.textFirstLine {
font-size: 16px;
}
.rightProject3 {
background: linear-gradient(71deg, #161528 -16.17%, #5B55A3 120.39%);
position: relative;
width: 100%;
height: 230px;
}
.rightProject3 img {
height: 220px;
margin: 0 auto;
display: block;
position: relative;
top: -30px;
}
.project3 {
overflow: hidden;
}
.project3.projectSecondd .rowProject3 {
display: flex;
flex-direction: column-reverse;
}
.rightProject3.secondProject3 img {
display: block;
margin: 0 auto;
position: relative;
left: inherit !important;
}
.contactFooter > img {
position: absolute;
bottom: -80px;
left: -50px;
width: 130%;
}
.contactFooter {
overflow: hidden;
}
.secondHero {
margin: 124px 0px 100px;
}
.secondHeroAssumi {
margin-bottom: 0px;
}
.specilizzazione {
width: 100%;
}
}