File: /home/imensosw/www/imenso.co/imenso-new/sass/_app.scss
.hero {
display: flex;
h1 {
font-size:56px;
letter-spacing:-.03125rem;
color:$color__primary;
margin-bottom: 50px;
}
&__left {
width: 50%;
padding-left: 100px;
padding-right: 10px;
display: flex;
flex-direction: column;
justify-content: center;
}
&__right {
width: 50%;
}
}
p {
color:rgba(0,0,0,0.5);
}
.services {
h2 {
color: #FFF;
}
p {
color: #FFF;
}
}
.work {
h2 {
font-size: 40px;
}
}
.swiper-wrapper {
align-items: flex-end;
}
.stats {
text-align: center;
color: #FFF;
display: flex;
list-style: none;
padding: 0;
margin-top: 0; }
.stats li {
margin-bottom: 0px;
text-align: center !important;
margin-right: 20px;
width: 130px;
padding: 36px 0; }
.stats li img {
height: 36px;
width: auto;
margin: 0 auto 10px;
display: block; }
.stats li strong {
font-size: 2em;
line-height: 1.2em;
margin-top: .5em;
display: block;
font-weight: 700; }
.stats li span {
font-size: 12px;
opacity: 0.5;
}
.stats-2 li:nth-child(odd) {
border-right: 1px solid #fff; }
.stats-2 li:nth-child(1), .stats-2 li:nth-child(2) {
border-bottom: 1px solid #fff; }
.sr-container {
width: 600%;
height: 100%;
display: flex;
flex-wrap: nowrap;
.panel {
width: 100%;
height: 100vh;
display: flex;
justify-content: center;
align-items: center;
position: relative;
box-sizing: border-box;
padding: 10px;
will-change: transform;
&__content {
width: calc(100% - 200px);
height: calc(100% - 100px);
background-color: #efefef;
padding: 80px;
}
}
.srbg {
background-image: url('../images/sr-bg.png');
background-size: cover;
background-repeat: no-repeat;
color: #FFF;
}
h2 {
font-size: 32px;
line-height: 1.5;
color: #FFF;
}
.scroll-down {
padding-top: 100px;
position: relative;
text-transform: uppercase;
letter-spacing: 2px;
font-size: 12px;
margin-bottom: 20px;
color: #000;
&:before {
content:"";
position: absolute;
height: 100px;
width: 1px;
background-color: #000;
top: 0;
left: 50%;
}
}
}
.zigzag {
h2 {
font-size: 26px;
line-height: 1.5;
}
}
.capabilities {
.nav-link {
background-color: #efefef;
border-radius: 0 !important;
padding: 15px 40px;
}
.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
background-color: $color__primary;
}
.media-body {
p {
font-size: 0.9em;
}
}
h5 {
color: #000;
}
}
.about {
.section-header {
width: 80%;
h2 {
font-size: 26px;
line-height: 1.7;
}
}
.logos {
ul {
list-style: none;
padding:0;
}
li {
width: 100px;
margin: 0 20px;
display: inline-block;
}
}
}
.techstack {
.tech-icons {
list-style: none;
padding-left: 0;
li {
display: inline-block;
text-align: center;
min-width: 136px;
margin-bottom: 50px;
span {
display: block;
font-size: 14px;
margin-top: 15px;
}
}
}
h3 {
color: #000;
font-size: 22px;
}
.nav-pills .nav-link {
color: rgba(0,0,0,0.3);
}
.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
background-color: transparent;
color: #000;
font-size: 1.3em;
position: relative;
&:after {
content:"";
position: absolute;
width: 100px;
height: 2px;
background-color: #000;
right: 0;
top: 50%;
}
}
}