html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font: inherit;
vertical-align: baseline;
outline: 0;
box-sizing: border-box;
/*text-align: center;*/
}
@import url('https://fonts.googleapis.com/css?family=Open+Sans|Roboto:700');
.bg-black{background-color: black;}
.bg-dark-gray{background-color: #2F2F2F;}
.bg-middle-gray{background-color: #575757;}
.bg-light-gray{background-color: #D8D8D8;}
.height100vh{height: 100vh;}
.flex{display: flex;}
.marginbottom20{margin-bottom: 20px;}
body {
font-family: 'Open Sans', sans-serif;
font-size: 18px;
line-height: 24px;
}
h1, h2, h3,h4{font-family: 'Roboto', sans-serif; font-weight: 700; text-align: left;}
h1{font-size: 2em;margin-bottom: 20px; line-height: 1.5em;}
h2{font-size: 1.5em; line-height: 1.15em; margin-bottom: 10px;}
h3{font-size: 1.25em;margin-bottom: 10px;}
h4{font-size: 1.05em;margin-bottom: 10px;}
p{text-align: left; margin-bottom: 20px;}
em{font-style: italic;}
ul, li{text-align: left;}
header, section, footer {padding: 20px; width: 100%; max-width: 1200px; margin: auto; }
header{display: flex; align-items: flex-end;background-color: red;}
img.logo-site{width: 100%; max-width: 300px; margin-bottom: 25px;}
a{text-decoration: none;}
/*nav*/
nav {
padding: 8px;
}
nav ul {
float: right;
}
nav ul li {
display: inline-block;
float: left;
}
nav ul li:not(:first-child) {
margin-left: 48px;
}
nav ul li:last-child {
margin-right: 24px;
}
nav ul li a {
display: inline-block;
outline: none;
color: #000;
text-transform: uppercase;
text-decoration: none;
font-size: 14px;
letter-spacing: 1.2px;
font-weight: 600;
}
@media screen and (max-width: 1000px) {
.logo {
padding: 0;
}
.nav-wrapper {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: -1;
background: #fff;
opacity: 0;
transition: all 0.2s ease;
}
.nav-wrapper ul {
position: absolute;
top: 50%;
transform: translateY(-50%);
width: 100%;
}
.nav-wrapper ul li {
display: block;
float: none;
width: 100%;
text-align: right;
margin-bottom: 10px;
}
.nav-wrapper ul li:nth-child(1) a {
transition-delay: 0.2s;
}
.nav-wrapper ul li:nth-child(2) a {
transition-delay: 0.3s;
}
.nav-wrapper ul li:nth-child(3) a {
transition-delay: 0.4s;
}
.nav-wrapper ul li:nth-child(4) a {
transition-delay: 0.5s;
}
.nav-wrapper ul li:nth-child(5) a {
transition-delay: 0.6s;
}
.nav-wrapper ul li:nth-child(6) a {
transition-delay: 0.7s;
}
.nav-wrapper ul li:not(:first-child) {
margin-left: 0;
}
.nav-wrapper ul li a {
padding: 10px 24px;
opacity: 0;
color: #000;
font-size: 14px;
font-weight: 600;
letter-spacing: 1.2px;
transform: translateX(-20px);
transition: all 0.2s ease;
}
.nav-btn {
position: fixed;
right: 10px;
top: 10px;
display: block;
width: 48px;
height: 48px;
cursor: pointer;
z-index: 9999;
border-radius: 50%;
}
.nav-btn i {
display: block;
width: 20px;
height: 2px;
background: #000;
border-radius: 2px;
margin-left: 14px;
}
.nav-btn i:nth-child(1) {
margin-top: 16px;
}
.nav-btn i:nth-child(2) {
margin-top: 4px;
opacity: 1;
}
.nav-btn i:nth-child(3) {
margin-top: 4px;
}
.nav-btn i:nth-child(4) {
margin-top: 4px;
}
.nav-btn i:nth-child(5) {
margin-top: 4px;
}
}
#nav:checked + .nav-btn {
transform: rotate(45deg);
}
#nav:checked + .nav-btn i {
background: #000;
transition: transform 0.2s ease;
}
#nav:checked + .nav-btn i:nth-child(1) {
transform: translateY(6px) rotate(180deg);
}
#nav:checked + .nav-btn i:nth-child(2) {
opacity: 0;
}
#nav:checked + .nav-btn i:nth-child(3) {
transform: translateY(-6px) rotate(90deg);
}
#nav:checked + .nav-btn i:nth-child(4) {
transform: translateY(-6px) rotate(90deg);
}
#nav:checked + .nav-btn i:nth-child(5) {
transform: translateY(-6px) rotate(90deg);
}
#nav:checked ~ .nav-wrapper {
z-index: 9990;
opacity: 1;
}
#nav:checked ~ .nav-wrapper ul li a {
opacity: 1;
transform: translateX(0);
}
.hidden {
display: none;
}
.link-activity {
display: inline-block;
color: #474E51;
position: relative;
}
.link-activity::after {
content: '';
position: absolute;
width: 100%;
transform: scaleX(1);
height: 2px;
bottom: 0;
left: 0;
background-color: #474E51;
transform-origin: bottom left;
transition: transform .3s ease-in-out;
}
.link-activity:hover::after {
transform: scaleX(0);
transform-origin: bottom right;
}
/**/
.clients h3{
	text-align: center;
}

.logos-clients{
	display: flex;
	justify-content: space-between;
}
img.logo-client{
width: 100%; max-width: 200px;
}
/*GLITCH*/