/* GLOBAL */
* {margin:0; padding:0; box-sizing:border-box;}
html, body {width: 100%; font-size: 1em; background: #0b0b0b; color: #e2e2e2; font-family: 'Hind Siliguri', sans-serif; font-weight: 500; overflow-y: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}
ol, ul, li {list-style:none; display:inline;}
a, img {outline:none; border:none; text-decoration:none;}
img {display:block; max-width:100%; height:auto;}
/* END GLOBAL */


/* BODY ID */
body#a-propos a#a-propos-a, body#portfolio a#portfolio-a, body#contact a#contact-a {color:#fff; font-weight:900; text-transform:uppercase; }
/* END BODY ID */


/* TEXT */
h1 {font-size:1.4em; font-weight:700; color:#FFF; margin-bottom:1.75%;}
h2 {font-size:1.4em; font-weight:700; color:#FFF; margin-bottom:1.5%;}
h3 {font-size:1em; font-weight:700; color:#FFF;}
.legende {font-size:0.9em; color:#7f7f7f;}
.bold {font-weight:600;}
.sum {font-size:1.1em;}
.blue {color:#2d62ff;}
.xlg {color:#c1c1c1;}
.white {color:#FFF;}
.link-simple {font-size:1em; color:#2d62ff; transition:0.3s;}
.width-100 {width:100%;}
/* LINKS */
a:link {color:#cfcfcf; font-size:0.9em;}
a:visited {color:#cfcfcf;}
a:hover {color:#FFF; transition:0.3s;}
a:active {color:#FFF;}

.contenu a:link {color:#2d62ff; font-size:1em;}
.contenu a:visited {color:#2d62ff;}
.contenu a:hover {color:#CCC; transition:0.3s;}
.contenu a:active {color:#FFF;}

footer a:hover {color:#5e5e5e; transition:0.3s;}
footer a:active {color:#5e5e5e;}


/* BOUTONS */
.bouton {display:table; border-radius:30px; border:0; cursor:default; color:#ffffff; font-weight:5400; font-size:1.15em; padding:10px 40px; text-decoration:none; transition:0.3s;}
.bouton:hover {color:#ffffff; cursor:pointer; background-color:#1149e3; transition:0.3s;}

.bg-xdg {background-color:#1149e3; font-size:1.15em;}
.bg-xdg:hover {background-color:#2f64f7; transition:0.3s;}
.border-lg {border:0px #F2F2F2 solid}

.bg-dg {background-color:#252525; font-size:1.15em;}
.bg-dg:hover {background-color:#1b1b1b; transition:0.3s;}

.bg-border {background-color:#0b0b0b; border:2px #1149e3 solid; font-size:1.15em;}
.bg-border:hover {background-color:#1149e3; transition:0.3s;}

/* ALIGN */
.left {text-align:left;}
.center {text-align:center;}
.center-disabled {text-align:left;}

.right {text-align:right;}
.inline {display:inline;}

/* MARGINS */
.margin-center {margin:0 auto;}
.margin-center-disabled {}

.margin-right-s {margin-right:1%;}
.margin-right-m {margin-right:5%;}
.margin-bottom-m {margin-bottom:7.5%;}
.margin-bottom-s {margin-bottom:2.5%;}


/* STRUCTURE */
.global {width:100%; max-width:80%; height:100%; margin-top:30px; padding:0 10px;}
.wrapper {display:inline-block; padding:0 15.5% 0 15.5%;}
.wrap {display:inline-block;}
.bloc-left-top {float:left; width:47.5%; height:100%;}
.bloc-right-top {float:right; width:47.5%; height:100%;}

.bloc-left {float:left; width:47.5%; height:100%;}
.bloc-right {float:right; width:47.5%; height:100%;}
.bloc-right img {float:right;}

/* HEADER */
header {height:25px; display:flex; align-items:center; margin-bottom:150px;}
.header-logo {float:left; width:50%;}
.header-menu {float:right; width:50%;}
.header-menu a {text-transform:uppercase;}

/* SECTION */
section {max-width:100%; margin:0 auto 75px auto; text-align:left;} 

/* FOOTER */
footer {width:100%; height:75px; background-color:#111; color:#FFF; font-size:0.9em; display:flex; align-items:center; }
.footer-content {width:100%; max-width:1200px; padding:0 10px; display:flex; align-items:center; }
.footer-text {float:left; width:50%;}
.footer-logo {float:right; width:50%;}
.footer-logo img {float:right;}




/* RESPONSIVE L */
@media only screen and (min-width:751px) and (max-width:859px) {
	
.center-disabled {text-align:center;}
.margin-center-disabled {margin:0 auto;}

	.bloc-left-top {float:left; width:100%; height:100%;}
	.bloc-right-top {float:right; width:100%; height:100%;}

}



/* RESPONSIVE M */
@media only screen and (min-width:661px) and (max-width:750px) {
.center-disabled {text-align:center;}
.margin-center-disabled {margin:0 auto;}

.global {width:100%; max-width:100%; height:100%; margin-top:15px; padding:0 10px;}
.bloc-left-top {float:left; width:100%; height:100%;}
.bloc-right-top {float:right; width:100%; height:100%;}
.wrapper {padding:0 5% 0 5%;}
.header-logo {float:left; width:100%;}
.header-menu {float:left; width:100%;}
}


/* RESPONSIVE PAYSAGE M */
@media only screen and (max-width:750px) and (orientation:landscape) {
.global {width:100%; max-width:100%; height:100%; margin-top:15px; padding:0 10px;}
.bloc-left-top {float:left; width:100%; height:100%;}
.bloc-right-top {float:right; width:100%; height:100%;}
.wrapper {padding:0 5% 0 5%;}
header {display:block;}
.header-logo {float:left; width:100%;}
.header-menu {float:left; width:100%;}
}


/* RESPONSIVE PORTRAIT S */
@media only screen and (max-width:660px) and (orientation:portrait) {
.center-disabled {text-align:center;}
.margin-center-disabled {margin:0 auto;}

.margin-bottom-m {margin-bottom:10%;}
.margin-bottom-s {margin-bottom:7.5%;}

.global {width:100%; max-width:100%; height:100%; margin-top:15px; padding:0 10px;}

.bloc-left-top {float:left; width:100%; height:100%;}
.bloc-right-top {float:right; width:100%; height:100%;}

.wrapper {padding:0 5% 0 5%;}
header {display:block; margin-bottom:100px;}
.header-logo {float:right; width:100%; margin-bottom:5%;}
.header-menu {float:left; width:100%; text-align:center;}
section {margin:0 auto 75px auto;} 
section img {max-width:100%; zoom:1.2;}

footer {width:100%; height:50px; background-color:#000; color:#FFF; font-size:0.9em; display:flex; align-items:center; }
.footer-content {width:100%; max-width:100%; padding:0 10px; display:flex; align-items:center; }
.footer-text {float:left; width:70%;}
.footer-logo {float:right; width:30%;}
.footer-logo img {float:right;}
}

/* RESPONSIVE PAYSAGE S */
@media only screen and (max-width:660px) and (orientation:landscape) {
.global {width:100%; max-width:100%; height:100%; margin-top:15px; padding:0 10px;}

.bloc-left-top {float:left; width:100%; height:100%;}
.bloc-right-top {float:right; width:100%; height:100%;}

.wrapper {padding:0 5% 0 5%;}
.header-logo {float:left; width:100%;}
.header-menu {float:left; width:100%;}
}


