html {
	scroll-behavior: smooth;
}
body {

}
img {
	width: 100%;
}

/* NAVBAR */
.nav-menu {
  transition: all .7s;
}
.nav-menu li a {
	color: #fff;
	font-size: 1.5rem;
	text-transform: uppercase;
	margin-left: 20px;
	transition: all .7s;
}
.custom-navbar li a {
	font-size: 1rem;

}
.custom-navbar {
	background: #000;
}
.custom-navbar .logo img {
	max-width: 40px;
}
.logo {
	float: left;
}
.logo img {
	max-width: 60px;
	transition: all .7s;
}
.logo-label {
	color: #fff;
	margin-left: 20px;
	text-transform: uppercase;
	font-size: 1.5rem;
	font-weight: 700;
}
.logo-label-2 {
	color: green;
}
/* BANNIERE */
.home-top-banner:before {
	content: "";
	background-image: url(../img/dot.png);
	background-color: rgba(0,0,0, 0.18);
	position: absolute;
	right: 0;
	left: 0;
	top: 0;
	bottom: 0;
	box-sizing: border-box;
}
.home-top-banner {
	background: url(../img/banner-1.jpg) no-repeat top left;
	background-size: 100% auto;
	color: #fff;
	text-align: center;
	padding: 100px 0 40px;
	position: relative;
}
.home-top-banner h1 {
	text-transform: uppercase;
	margin-bottom: 30px;
}
.home-top-banner h2 {
	text-transform: uppercase;
	margin: 30px 0;
}
/* ANCRES MENU */
#skills {
    display: block;
    position: relative;
    top: -55px;
    visibility: hidden;
}
#freelances {
    display: block;
    position: relative;
    top: -55px;
    visibility: hidden;
}
/* BLOC COMPETENCES */
.skills-cont {
	padding: 40px 0;
	background: #F5F5F5;
	text-align: center;
}
.skills-cont img {
	border-radius: 15px;
}
/* BLOC FREELANCES */
.infos-cont {
	position: absolute;
	bottom: 0;
	left: 0;
	color: #fff;
	width: 100%;
	background: rgba(0,0,0,0.5);
	padding: 10px 0;
}
.imghvr-push-up p {
	margin-bottom: 0;
}
/* CONTENU */
.color-perso-1, .color-perso-2, .color-perso-3 {
	text-align: center;
	color: #fff;
}
.color-perso-1 {
	background: red;
}
.color-perso-2 {
	background: green;
}
.color-perso-3 {
	background: purple;
}
.color-perso-4 {
	background: rgba(255,255,255,0.3);
	color: #fff;
}
/* PIED DE PAGE */
.footer-cont {
	background: #000;
	padding: 30px 0;
}
/* IMAGE HOVER EFFECTS GLOBAL */
[class^='imghvr-'], [class*=' imghvr-'] {
    position: relative;
    display: inline-block;
    margin: 0;
    max-width: 100%;
    background-color: #2266a5;
    color: #fff;
    overflow: hidden;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -moz-osx-font-smoothing: grayscale;
    -webkit-transform: translateZ(0);
            transform: translateZ(0);
			border-radius: 15px;
}
[class^='imghvr-'] > img, [class*=' imghvr-'] > img {
    vertical-align: top;
    max-width: 100%;
}
[class^='imghvr-'] figcaption, [class*=' imghvr-'] figcaption {
    background-color: #333;
    padding: 30px;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    color: #ffffff;
	border-radius: 15px;
}
[class^='imghvr-'] figcaption h1, [class^='imghvr-'] figcaption h2, [class^='imghvr-'] figcaption h3, [class^='imghvr-'] figcaption h4, [class^='imghvr-'] figcaption h5, [class^='imghvr-'] figcaption h6, [class*=' imghvr-'] figcaption h1, [class*=' imghvr-'] figcaption h2, [class*=' imghvr-'] figcaption h3, [class*=' imghvr-'] figcaption h4, [class*=' imghvr-'] figcaption h5, [class*=' imghvr-'] figcaption h6 {
    color: #fff;
	border: 2px solid #fff;
	text-transform: uppercase;
	font-size: 1.2rem;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	left: 50%;
	transform: translateX(-50%);
	padding: 5px 15px;
	border-radius: 5px;
}
[class^='imghvr-'] a, [class*=' imghvr-'] a {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1;
}
[class^='imghvr-'], [class*=' imghvr-'], [class^='imghvr-']:before,
[class^='imghvr-']:after, [class*=' imghvr-']:before, [class*=' imghvr-']:after,
[class^='imghvr-'] *, [class*=' imghvr-'] *, [class^='imghvr-'] *:before,
[class^='imghvr-'] *:after, [class*=' imghvr-'] *:before, [class*=' imghvr-'] *:after {
    box-sizing: border-box;
    transition: all .35s ease;
}
/* IMAGE PUSH UP EFFECT GLOBAL */
[class^='imghvr-push-']:hover figcaption, [class*=' imghvr-push-']:hover figcaption {
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0);
}
/* IMAGE PUSH UP EFFECT PERSO */
.imghvr-push-up figcaption {
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
}

.imghvr-push-up:hover > img {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
}
/* PAGE FREELANCES */
.freelance-cont {
	margin-top: 120px;
}
.freelance-cont img {
	margin-bottom: 30px;
}
.freelance-block {
	background: #000;
	padding: 20px;
	color: #fff;
	margin-bottom: 30px;
	border-radius: 5px;
}
.freelance-header nav {
	background: #000;
}