/****************** COMMON ***********************/ * {margin:0;padding:0;} *, *:before, *:after {-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;} html, body {height:100%;} body {margin:0;padding:0;font-family:'Lato', Arial, sans-serif;font-size:16px;font-weight:400;background:#fff;color:#5e5e5e;overflow-x:hidden;} .clearfix:after {content:"\0020";display:block;height:0;clear:both;overflow:hidden;visibility:hidden;} .hidden {display:none;} #wrap {min-height:100%;height:auto !important;height:100%;margin:0 auto;} img {max-width:100%;} a {color:#111;} h1 {font-family:'Merriweather', serif;font-size:60px;line-height:60px;font-weight:700;color:#fff;} h2 {font-family:'Merriweather', serif;font-size:44px;line-height:44px;font-weight:700;color:#1b243f;margin:0 0 20px;} h3 {font-family:'Merriweather', serif;font-size:20px;line-height:26px;font-weight:700;color:#1b243f;margin:0 0 20px;} h4 {font-family:'Lato', serif;font-size:18px;line-height:24px;font-weight:700;color:#1b243f;margin:0 0 10px;} hr {width:100%;height:0;border:0;border-top:1px solid #ddd;margin:10px 0;} div.txt {font-size:16px;line-height:22px;font-weight:400;margin:0 0 20px;} div.txt ul {} div.txt li {margin:10px 0 10px 20px;} div.wrap {position:relative;max-width:1200px;margin:0 auto;height:100%;padding:0;} div.wrap:after {content:"\0020";display:block;height:0;clear:both;overflow:hidden;visibility:hidden;} .btn {display:inline-block;padding:15px 25px;font-family:'Lato', Arial, sans-serif;font-size:16px;font-weight:700;color:#fff;background:#df5e2c;border:0;cursor:pointer;border-radius:5px;text-transform:uppercase;text-decoration:none;text-align:center;} .btn.small {padding:3px 8px;font-size:12px;border-radius:5px;} .btn.medium {padding:10px 15px;font-size:13px;border-radius:5px;} .btn:hover {background:#1B243F;color:#fff;} .btn.blue {background:#1b243f;border:1px solid #1b243f;} .btn.blue:hover {background:#fff;color:#1b243f;} .orange {color:#df5e2c !important;} [data-url] {cursor:pointer;} div.cover {background-repeat:no-repeat;background-position:center;-webkit-background-size:cover;-moz-background-size:cover;-o-background-size:cover;background-size:cover;background-position:left top;} div.contain {background-repeat:no-repeat;background-position:center;-webkit-background-size:contain;-moz-background-size:contain;-o-background-size:contain;background-size:contain;background-position:left top;} div.slider, div.slider div {position:relative;height:55vh;} @media (max-width:1280px) { #page div.wrap {margin:0 40px !important;} } @media (max-width:992px) { #page div.wrap {margin:0 20px !important;} h1 {font-size:40px;line-height:40px;} h2 {font-size:36px;line-height:36px;} div.slider, div.slider div {height:400px;} } /****************** HEADER ***********************/ #header {position:relative;background:#1b243f;padding:20px 20px 0;} #header h1 {position:relative;min-height:100px;color:#fff;padding:0 0 0 100px;} #header h1 svg {position:absolute;top:0;left:0;width:80px;height:80px;fill:#fff;} #header h1 a {display:block;color:#fff;text-decoration:none;padding:14px 0 0 0;} #header h1 p {display:block;font-family:'Lato', Arial, sans-serif;font-size:27px;font-weight:700;line-height:32px;} #header h1 span {display:block;font-family:'Lato', Arial, sans-serif;font-size:19px;font-weight:300;line-height:22px;} #nav {display:flex;flex-flow:row wrap;margin:20px 20px 0;} #nav div {position:relative;flex-grow:1;text-align:left !important;align-items:flex-end;justify-content:flex-end;} #nav a {display:inline-block;color:#fff;text-decoration:none;text-transform:uppercase;padding:0 0 10px;border-bottom:3px solid transparent;} #nav a:hover, #nav a.on {border-color:#fff;} #nav div.young {text-align:center !important;display:none;} #nav a.young {display:inline-block;font-family:'Merriweather', serif;font-size:12px;font-weight:400;color:#fff;padding:10px 10px;text-align:center;border:1px solid #fff;border-radius:30px;text-decoration:none;background-color:none !important;margin:20px auto;} #nav a.young:hover {background-color:transparent !important;color:#df5e2c;border-color:#df5e2c;} #nav div ul {position:absolute;top:calc(100%);list-style:none;display:none;z-index:9999999;} #nav div:hover ul {display:block;} #nav div ul li a {display:block;background-image:url('../img/arrow-btn.png');background-repeat:no-repeat;background-position:10px center;background-color:#1b243f;font-size:13px;color:#fff;padding:10px 20px 10px 30px;border-bottom:1px solid #111 !important;} #nav div ul li a:hover {background-color:#df5e2c;} #young-link {position:absolute;top:20px;right:0;font-family:'Merriweather', serif;font-size:14px;font-weight:400;color:#fff;padding:10px 30px;border:1px solid #fff;border-radius:30px;text-decoration:none;} #young-link:hover {color:#df5e2c;border-color:#df5e2c;} @media (max-width:992px) { #young-link {display:none;} #nav {display:none;margin:0;} #nav.on {display:block;} #nav.off {display:none;} #nav div {display:block;} #nav a {display:block;border:0;padding:10px;} #nav a:hover, #nav a.on {background-color:#000;} #nav div ul {position:relative;display:block;} #nav div.young {display:block;} } @media (max-width:600px) { #header h1 p, #header h1 span {display:none;} } /****************** FOOTER ***********************/ #footer {margin:40px 0 100px;} #footer div.wrap {padding:30px 10px;border-top:1px solid #ded9d4;} #footer div.iiw {position:absolute;min-height:80px;padding-top:90px;font-size:18px;font-weight:700;color:#111522;} #footer div.iiw svg {position:absolute;top:0;left:0;width:80px;height:80px;fill:#1b243f;} #footer ul.nav {list-style:none;margin:15px 30px 15px 100px;display:flex;justify-content:center;align-items:center;} #footer ul.nav li {display:inline-block;margin:10px 20px;} #footer ul.nav li a {font-size:14px;color:#111522;text-decoration:none;} #footer ul.nav li a:hover {color:#df5e2c;} #footer ul.details {list-style:none;float:right;margin:45px 10px 0 0;} #footer ul.details li {display:inline-block;margin:0;font-size:11px;} #footer ul.details li a {font-size:11px;color:#111522;text-decoration:none;} @media (max-width:992px) { #footer {margin-bottom:0px;} #footer div.iiw {padding:0 0 0 100px;} #footer div.iiw p {padding-top:25px;} #footer div.iiw br {display:none;} #footer ul.nav {display:block;margin:100px 0 0;} #footer ul.nav li {display:block;margin:0;padding:10px;} } /****************** HOME ***********************/ #homeslider div.slider div.content {position:absolute;height:auto;top:50%;left:0;transform:translate(0, -50%);padding:0 20px;} #homeslider div.slider div.content h3 {font-size:46px;line-height:46px;color:#fff;margin:0 0 30px;} #homeslider div.slider div.content h3 sup{font-size:20px;line-height:26px;} #homeslider div.slider div.content h3 span{font-size:20px;line-height:26px;} #homeintro {padding:40px 20px 60px 20px;text-align:center;} #homelinks {background:#ded9d4;padding:30px;} #homelinks div.items {width:100%;display:flex;justify-content:space-between;align-items:center;max-width:900px;margin:0 auto;} #homelinks div.items a {display:block;text-decoration:none;} #homelinks div.items .item {position:relative;padding-left:80px;} #homelinks div.items .item svg {position:absolute;top:0;left:0;width:60px;height:60px;fill:#fff;} #homelinks div.items .item svg .fill {stroke:#fff !important;} #homelinks div.items .item svg .stroke {fill:#fff !important;} #homelinks div.items a:hover p {color:#fff;} #homelinks div.picto {position:absolute;top:0;left:0;width:60px;height:60px;} #homelinks div.items .item strong {display:block;font-size:15px;color:#df5e2c;text-transform:uppercase;margin:0 0 3px 0;} #homelinks div.items .item p {font-family:'Merriweather', serif;font-size:24px;line-height:26px;font-weight:700;color:#1b243f;} #homenews {padding:40px 20px;} #homenews div.left {float:left;} #homenews div.right {float:right;width:36%;max-width:420px;} #homenews div.title {position:relative;font-weight:bold;color:#df5e2c;text-transform:uppercase;margin:0 0 40px 80px;} #homenews div.title:before {position:absolute;content:'';width:100px;height:2px;background:#df5e2c;bottom:5px;left:-120px;} #homenews div.item {overflow:hidden;margin:0 auto 30px;max-width:620px;} #homenews div.picture {float:left;width:265px;height:210px;} #homenews div.content {float:left;width:340px;padding:25px;} #homenews div.content h3 {font-size:26px;line-height:30px;margin-bottom:15px;} #homenews div.content p {margin:0 0 10px;} #homenews div.content p a {position:relative;font-size:13px;font-weight:bold;color:#df5e2c;text-transform:uppercase;text-decoration:none;} #homenews div.content .date {font-size:14px;font-weight:bold;color:#c2c3c4;text-transform:uppercase;} @media (min-width:993px) { #homenews div.big div.picture {width:420px;height:300px;margin-bottom:30px;} #homenews div.big div.content {width:100%;border-left:1px dotted #df5e2c;} } @media (max-width:992px) { #homeslider div.slider div.content {padding:50px 20px;} #homeslider div.slider div.content h3 {font-size:32px;line-height:32px;margin:10px 0 20px;} #homeslider div.slider div.content h3 sup{font-size:12px;line-height:16px;} #homeslider div.slider div.content h3 span{font-size:14px;line-height:20px;} #homelinks {padding:20px;} #homelinks div.items {justify-content:center;flex-direction:column;max-width:300px;;} #homelinks div.items a {width:100%;} #homelinks div.items a {padding:15px 0;} #homelinks div.items .item p {font-size:17px;line-height:20px;} #homenews div.left {float:none;} #homenews div.right {float:none;width:auto;max-width:100%;} } /****************** ARTICLE ***********************/ div.cms {font-size:16px;line-height:24px;} div.cms strong {font-weight:700;} div.cms ul {list-style:disc;padding-left:20px;} div.cms li {font-size:16px;line-height:24px;margin:8px 0;} div.cms h3 {margin-bottom:5px;} div.cms table {} div.cms table a {display:inline-block;padding:15px 25px;font-family:'Lato', Arial, sans-serif;font-size:16px;font-weight:700;color:#fff;background:#df5e2c;border:0;cursor:pointer;border-radius:5px;text-transform:uppercase;text-decoration:none;text-align:center;margin-right:10px;} #hero {padding:8em 5em;} #content {padding:40px 0;} #content.with-sidebar {float:left;width:75%;padding:40px 40px 40px 0;} #sidebar {float:right;width:25%;background:#ded9d4;padding:10px 30px;} #sidebar a.iiw {position:relative;display:block;padding-left:80px;margin-bottom:0px;min-height:60px;color:#fff;text-decoration:none;} #sidebar a.iiw svg {position:absolute;top:25px;left:0;width:50px;height:50px;fill:none;stroke:#fff;} #sidebar a.iiw svg .fill {fill:#fff !important;} #sidebar a.iiw svg .stroke {stroke:#fff !important;} #sidebar a.iiw div.picto {position:absolute;top:18px;left:0;width:60px;height:60px;} #sidebar a.iiw div.inner {border-top:1px solid #fff;padding:20px 0;} #sidebar a.iiw:first-child div {border-top:0;} #sidebar a.iiw strong {display:block;font-size:13px;font-weight:700;line-height:17px;color:#df5e2c;text-transform:uppercase;} #sidebar a.iiw p {display:block;font-family:'Merriweather', serif;font-size:16px;line-height:21px;font-weight:700;color:#1b243f;} #sidebar a.iiw:hover svg {stroke:#1b243f;} #sidebar a.iiw:hover svg .fill {fill:#1b243f !important;} #sidebar a.iiw:hover svg .stroke {stroke:#1b243f !important;} #sidebar a.iiw:hover strong_ {color:#1b243f;} #sidebar a.iiw:hover p {color:#fff;} #sidebar a.go-back {float:right;margin:25px 0 35px;} @media (max-width:1200px) { #content {padding-left_:40px !important;} } @media (max-width:992px) { #hero {padding:40px 20px;} #content {float:none !important;width:auto !important;padding:20px 0px !important;} #sidebar {float:none;width:auto;padding:20px;} } /****************** ACTUALITES ***********************/ #actualites select {border:1px solid #ded9d4;width:500px;max-width:100%;border-radius:5px;font-family:'Lato', Arial, sans-serif;color:#5e5e5e;text-transform:uppercase;font-size:12px;font-weight:700;padding:5px 10px;margin:40px 0;} #filters {margin-bottom:30px;} #filters li {display:inline-block;margin:0 10px 10px 0;} #filters li a {display:inline-block;border:1px solid #1b243f;border-radius:20px;padding:8px 25px;font-family:'Lato', Arial, sans-serif;color:#1b243f;text-transform:uppercase;font-size:12px;font-weight:700;text-decoration:none;} #filters li a:hover, #filters li a.on {background:#1b243f;color:#fff;} #actualites div.col {float:left;width:33.3333%;max-width:400px;min-width:300px;} div.actualite {margin:0 20px 20px 0;background:#fff;border:1px solid #ded9d4;overflow:hidden;} div.actualite img {display:block;max-width:100%;} div.actualite div.inner {padding:0 20px 20px;} div.actualite p a {font-size:13px;font-weight:bold;color:#df5e2c;text-transform:uppercase;text-decoration:none;} div.actualite div.cat {display:inline-block;font-size:14px;font-weight:300;color:#fff;text-transform:uppercase;background:#df5e2c;padding:10px 5px 3px;} div.actualite div.date {display:inline-block;font-size:14px;font-weight:bold;color:#c2c3c4;text-transform:uppercase;} div.actualite h3 {margin:15px 0;} div.actualite div.left {float:left;width:20%;} div.actualite div.right {float:left;width:80%;padding-left:30px;} #actualite {margin:0;border:0;} #actualite h2 {margin-bottom:5px;} #actualite div.date {margin-bottom:30px;} #actualite div.picture {margin-bottom:30px;} #actualite div.paging {position:absolute;top:40px;right:0;} @media (max-width:992px) { #actualite div.paging {top:20px;} #actualites div.col {width:50%;max-width:auto;min-width:auto;} } @media (max-width:600px) { #actualite div.paging {display:none;} #actualites div.col {width:100%;} div.actualite {margin-right:0;} div.actualite div.left {float:none;width:auto;} div.actualite div.right {float:none;width:auto;padding-left:0;} } /****************** BREADCRUMB ***********************/ #breadcrumb {list-style:none;margin:0 0 40px;} #breadcrumb li {display:inline-block;margin:0 3px;font-size:12px;} #breadcrumb li a.home {display:inline-block;background:url('../img/home.png') no-repeat top left;width:12px;height:12px;text-indent:-999em;} #breadcrumb li span {font-size:14px;color:#d8652d;} /****************** MEMBERS ***********************/ #members div.search {overflow:hidden;padding:40px 0 0;} #members div.search label {float:left;font-size:12px;font-weight:700;line-height:30px;color:#df5e2c;text-transform:uppercase;margin:0 10px 10px 0;} #members div.search select {float:left;border:1px solid #ded9d4;width:270px;max-width:100%;border-radius:5px;font-family:'Lato', Arial, sans-serif;color:#5e5e5e;text-transform:uppercase;font-size:12px;font-weight:700;padding:5px 10px;} #members div.search ul {float:right;} #members div.search li {display:inline-block;margin:0 8px 8px 0;} #members div.search li a {display:inline-block;border:1px solid #df5e2c;border-radius:5px;padding:8px 14px;font-family:'Lato', Arial, sans-serif;color:#df5e2c;text-transform:uppercase;font-size:12px;font-weight:700;text-decoration:none;} #members div.search li a:hover, #members div.search li a.on {background:#df5e2c;color:#fff;} #members-list {margin-bottom:60px;} #members table {width:100%;} #members table .center {text-align:center;} #members table .right {text-align:right;} #members table thead th {font-size:12px;color:#5e5e5e;text-transform:uppercase;text-align:left;border:solid #c8c8c8;border-width:1px 0;padding:10px;cursor:pointer;} #members table thead th:first-child {border-left:1px solid #c8c8c8;} #members table thead th:last-child {border-right:1px solid #c8c8c8;} #members table tbody td {font-size:12px;color:#5e5e5e;text-transform:uppercase;text-align:left;border-bottom:1px dotted #c8c8c8;padding:10px;} #members table tbody td p {position:relative;float:left;line-height:24px;padding-left:38px;} #members table tbody td a {text-decoration:none;} #members table tbody td img {position:absolute;top:0;left:0;width:24px;} #members thead tr th p {position:relative;display:inline-block;padding-right:25px;} #members thead tr th span {position:absolute;top:4px;right:0;display:block;width:13px;height:9px;background:url('../img/arrow.png') no-repeat top;} #members thead tr th.tablesorter-headerDesc span {background-position:bottom;} #members thead tr th.headerSortUp span {background-position:0 -9px;} #members thead tr th.headerSortDown span{background-position:0 0;} #members table tbody td p.anb {position:relative;display:inline-block;padding-left:25px;line-height:11px;background_:blue;} #members table tbody td p.anb span {position:absolute;top:0px;left:0;display:block;width:14px;height:11px;background:url('../img/check.png') no-repeat top left;text-indent:-999em;line-height:0;} #members table tbody td span.anb {color:#d2d2d2;} @media (max-width:992px) { #members div.search ul {float:none;clear:both;padding-top:20px;} } /****************** MEMBER ***********************/ #member {min-height:70vh;} #member div.prez {position:relative;width:100%;background:#f5f4f2;padding:40px 80px;overflow:hidden;} #member div.prez div.logo {float:left;width:260px;} #member div.prez div.logo img {display:block;margin:0 auto 15px;} #member div.prez div.logo h2 {font-family:'Lato', Arial, sans-serif;font-size:30px;font-weight:700;color:#df5e2c;text-transform:uppercase;text-align:center;margin:0;} #member div.prez div.intro {float:left;width:68%;} #member div.prez .arrow {position:absolute;width:34px;height:57px;top:50%;margin-top:-29px;background:url('../img/arrow-big.png') no-repeat;} #member div.prez .arrow.prev {left:35px;} #member div.prez .arrow.next {right:35px;} #member div.prez a.arrow.prev {background-position:0 0;} #member div.prez a.arrow.next {background-position:-34px 0;} #member div.prez span.arrow.prev {background-position:0 -57px;} #member div.prez span.arrow.next {background-position:-34px -57px;} #member div.societes {display:flex;flex-wrap:wrap;justify-content:space-between;align-items:top;} #member div.societes div.item {border:1px solid #c8c8c8;padding:20px;width:calc(50% - 10px);margin-bottom:20px;overflow:hidden;font-size:13px;} #member div.societes div.item div {float:left;width:33%;word-wrap:break-word;padding-right:20px;} #member div.societes div.item div.last {padding-right:0;} #member div.societes div.item h4 {font-family:'Lato', Arial, sans-serif;font-size:16px;line-height:20px;font-weight:700;color:#df5e2c;margin:0 0 3px;} #member div.societes div.item h5 {font-family:Arial, sans-serif;font-size:13px;font-weight:700;text-transform:uppercase;color:#000;margin:0 0 20px;} #member div.societes div.item strong {font-size:13px;color:#1b243f;text-transform:uppercase;} #member div.societes div.item.first {border-left:10px solid #df5e2c;} #member div.more-info {margin:30px 0 70px;} #member div.more-info ul {list-style:square;margin:10px 30px;} #member div.more-info ul li {margin:0 0 5px;} #member div.more-info ul li a:hover {color:#df5e2c;} #member div.news {margin-top:40px;} #member div.news h5 {font-family:'Merriweather', serif;font-size:22px;font-weight:700;color:#1b243f;margin:0 0 20px;} #member div.news div.list {display:flex;flex-wrap:wrap;justify-content:space-between;align-items:top;} #member div.news div.item {position:relative;width:calc(50% - 10px);margin-bottom:20px;overflow:hidden;background:url('../img/dot.png') repeat-x bottom;padding-bottom:30px;} #member div.news div.item .picture {position:absolute;top:0;left:0;width:120px;height:120px;background-position:center;} #member div.news div.item .inner {min-height:120px;padding-left:140px;} #member div.news div.item .date {font-size:14px;font-weight:700;color:#df5e2c;margin-bottom:5px;} #member div.news div.item h3 {font-size:18px;font-weight:700;color:#5e5e5e;margin-bottom:10px;} #member div.news div.item a {font-size:13px;font-weight:bold;color:#df5e2c;text-transform:uppercase;text-decoration:none;} @media (max-width:992px) { #member div.prez div.logo {float:none;width:auto;margin:0 auto;} #member div.prez div.intro {float:none;width:auto;padding:30px 5% 0;} #member div.societes {display:block;} #member div.societes div.item {width:auto;} #member div.news {margin:40px 0px;} #member div.news div.list {display:block;} #member div.news div.item {width:auto;} } @media (max-width:600px) { #member div.prez {padding:40px 10px;} #member div.prez .arrow {top:40px;margin-top:0;} #member div.prez .arrow.prev {left:10px;} #member div.prez .arrow.next {right:10px;} #member div.societes div.item div {float:none;width:auto;} #member div.news div.item .picture {position:relative;top:auto;left:auto;margin:0 auto 20px;} #member div.news div.item .inner {padding-left:0;} #member div.societes div.item h5 {border-bottom:1px solid #eee;padding-bottom:10px;} } /****************** TECHNICAL ***********************/ #technical div.blocs {display:flex;flex-wrap:wrap;justify-content:space-between;align-items:top;} #technical div.blocs div.item {width:calc(50% - 25px);margin:60px 0 100px;} #technical div.blocs div.cms {margin-bottom:30px;} @media (max-width:992px) { #technical div.blocs {display:block;} #technical div.blocs div.item {width:auto;} } /****************** QUALIFICATION ***********************/ #qualif {position:relative;left:-100px;width:calc( 100% + 100px );background:#f5f4f2;padding:30px 30px 30px 130px;margin-top:80px;} #qualif div.boxes {display:flex;flex-wrap:wrap;justify-content:space-between;align-items:top;margin-bottom:30px;} #qualif div.boxes div {width:33.33%;} #qualif div.boxes a {display:block;height:100%;margin-right:20px;background:#1b243f;border-radius:10px;padding:15px 25px;font-family:Arial, sans-serif;font-size:13px;color:#fff;text-decoration:none;} #qualif div.boxes a strong {display:block;font-size:14px;margin-bottom:5px;} #qualif div.boxes a:hover {background:#df5e2c;} #qualif h6 {font-family:Arial, sans-serif;font-size:12px;text-transform:uppercase;margin:0 20px 10px;} #qualif div.links {display:flex;flex-wrap:wrap;justify-content:space-between;align-items:top;} #qualif div.links div {width:33.33%;} #qualif div.links a {font-size:12px;font-weight:700;line-height:13px;color:#5e5e5e;background:url('../img/link.png') no-repeat left;padding-left:18px;text-decoration:none;margin:0 20px;} #qualif div.links a:hover {color:#df5e2c;} @media (max-width:992px) { #qualif {left:auto;width:auto;padding:20px;} #qualif div.boxes div {width:100%;margin-bottom:20px;} #qualif div.boxes a {margin:0;} #qualif div.boxes br {display:none;} #qualif h6 {margin:0 0 10px;} #qualif div.links div {width:100%;} #qualif div.links a {display:block;margin:10px 0 5px;} } /****************** WORKING UNITS ***********************/ #working ul.filters {margin:60px 0 40px;} #working ul.filters li {display:inline-block;margin:0 10px 10px 0;} #working ul.filters li a {display:inline-block;background:#1b243f;border-radius:5px;padding:12px 20px;font-family:'Lato', Arial, sans-serif;color:#fff;text-transform:uppercase;font-size:12px;font-weight:700;text-decoration:none;} #working ul.filters li a:hover, #working ul.filters li a.on {background:#df5e2c;} #working-list {display:flex;flex-wrap:wrap;justify-content:space-between;align-items:top;} #working-list div.item {position:relative;width:calc(50% - 10px);margin-bottom:20px;overflow:hidden;border:1px solid #c8c8c8;min-height:133px;} #working-list div.item .picture {position:absolute;top:0;left:0;width:120px;height:100%;background-position:center;background-color:#c8c8c8;} #working-list div.item .inner {padding:30px 30px 30px 150px;} #working-list div.item h4 {font-size:12px;font-weight:700;color:#df5e2c;text-transform:uppercase;margin-bottom:10px;} #working-list div.item a {display:block;margin-top:10px;font-size:12px;font-weight:bold;color:#1b243f;text-transform:uppercase;text-decoration:none;} #working-list div.item a span {color:#df5e2c;} @media (max-width:992px) { #working-list {display:block;} #working-list div.item {width:auto;} } @media (max-width:600px) { #working-list div.item .picture {display_:none;} #working-list div.item .inner {padding:20px;} } /****************** WORK ***********************/ #workfiche {position:relative;width:480px;width:480px;margin-left:200px;} #workfiche #code {position:absolute;top:0;left:-200px;width:150px;height:150px;line-height:150px;border:1px solid #e5e5e5;border-radius:50%;text-align:center;font-family:'Merriweather', serif;font-size:40px;font-weight:700;color:#df5e2c;} #workfiche h2 {font-size:40px;} #workfiche div.intro p {font-size:17px;font-weight:700;} #workfiche div.cms {margin-top:100px;} #workfiche h3 {margin-bottom:10px;} #work #sidebar {background:none;padding:10px 0;} #work div.chair {position:relative;} #work div.chair div {position:relative;z-index:1;} #work div.chair p {font-size:17px;line-height:26px;color:#1b243f;} #work div.chair:before {position:absolute;z-index:0;top:35px;left:-60px;content:'';width:67px;height:46px;background:url('../img/quote-left.png') no-repeat;} #work div.chair:after {position:absolute;z-index:0;bottom:0;right:0;content:'';width:67px;height:46px;background:url('../img/quote-right.png') no-repeat;} #workcontact {position:relative;clear:both;background:#edeae7;padding:30px;margin-bottom:10px;text-align:center;} #workcontact div.inner {position:relative;overflow:hidden;text-align:left;} #workcontact div.picture {display:none;} #workcontact.has-picture div.picture {display:block;position:absolute;top:0;left:0;width:100px;height:100%;background-position:center;background-color:#fff;} #workcontact div.inner {padding:0;font-size:13px;text-align:center;} #workcontact.has-picture div.inner {padding:0 20px 0 120px;text-align:left;} #workcontact div.inner span {font-size:11px;font-weight:bold;color:#000;text-transform:uppercase;} #workcontact a {margin:30px auto 0;} #worksub {position:relative;border:1px solid #c8c8c8;padding:30px;} #worksub h6 {font-size:16px;font-weight:700;color:#5e5e5e;text-transform:uppercase;margin-bottom:5px;} #worksub li {position:relative;background:url('../img/dot.png') repeat-x top;list-style:none;padding:15px 0 5px 30px;font-size:14px;overflow:hidden;} #worksub li:first-child {background:none;} #worksub li span {position:absolute;top:15px;left:0;width:50px;font-weight:700;color:#df5e2c;} #worksub li p {} #workdoc {position:relative;border:1px solid #c8c8c8;border-top:0;padding:30px;} #workdoc h6 {font-size:16px;font-weight:700;color:#5e5e5e;text-transform:uppercase;margin-bottom:5px;} #workdoc li {background:url('../img/dot.png') repeat-x top;list-style:none;padding:15px 0 5px;font-size:14px;} #workdoc li:first-child {background:none;} #workdoc li a {position:relative;display:block;color:#5e5e5e;text-decoration:none;font-size:14px;min-height:15px;} #workdoc li a span {position:absolute;top:0;right:0;width:14px;height:15px;background:url('../img/doc.png') no-repeat;} #workdoc li a:hover span {background-position:0 -15px;} @media (max-width:992px) { #workfiche {width:auto;margin-left:0;} } /****************** RESSOURCES MATERIALS ***********************/ #ressources-list {display:flex;flex-wrap:wrap;justify-content:space-between;align-items:top;} #ressources-list div.item {position:relative;width:100%;margin-bottom:20px;overflow:hidden;border:1px solid #c8c8c8;min-height:190px;} #ressources-list div.item img {position:absolute;top:10px;left:10px;} #ressources-list div.item .inner {padding:10px 30px 10px 150px;} #ressources-list div.item h4 {font-size:17px;font-weight:700;color:#df5e2c;text-transform:uppercase;margin-bottom:10px;} #ressources-list div.item a {display:block;margin-top:10px;font-size:12px;font-weight:bold;color:#1b243f;text-transform:uppercase;text-decoration:none;} #ressources-list div.item a span {color:#df5e2c;} @media (max-width:992px) { #ressources-list {display:block;} #ressources-list div.item {width:auto;} } @media (max-width:600px) { #ressources-list div.item img {position:relative;top:auto;left:auto;display:block;margin:10px auto;} #ressources-list div.item .inner {padding:20px;text-align:center;} } /****************** CONTACT ***********************/ ::-webkit-input-placeholder {color:#666;} :-ms-input-placeholder {color:#666;} ::-moz-placeholder {color:#666;opacity:1;} :-moz-placeholder {color:#666;opacity:1;} #wrap-contact {display:flex;} #wrap-contact > div {position:relative;flex-grow:1;} #coords {padding:40px 40px 40px 0;} div.form {position:relative;background:#ded9d4;padding:30px 20px;max-width:640px;} div.form.contact {/*float:right;width:55%;*/background:#ded9d4;padding:30px 20px;} div.form .counter {position:absolute;top:30px;right:30px;} div.form h3 {font-size:24px;line-height:28px;padding:0 10px;} div.form div.row {overflow:hidden;} div.form div.col {float:left;width:50%;padding:10px;} div.form div.row.message {padding:10px;} div.form div.row.submit {text-align:center;padding:10px 10px 120px 10px;} div.form div.row.single {padding:10px;} div.form div.row.single div.field {position:relative;margin-bottom:20px;} div.form div.number ::-webkit-input-placeholder {color:#df5e2c;} div.form div.number :-ms-input-placeholder {color:#df5e2c;} div.form div.number ::-moz-placeholder {color:#df5e2c;} div.form div.number :-moz-placeholder {color:#df5e2c;} div.form div.number span.note {position:absolute;display:block;top:0;right:0;width:240px;height:100%;padding:15px 10px;background:#df5e2c;color:#fff;font-size:10px;font-weight:700;text-transform:uppercase;} div.form div.number input {padding-right:260px;} div.form p {padding:10px 0;} div.form input.text, div.form select, div.form textarea {display:block;width:100%;background:#fff;border:1px solid #c8c8c8;padding:10px 15px;font-family:'Lato', Arial, sans-serif;font-size:15px;font-weight:400;font-style:italic;color:#666;} div.form option {font-family:'Lato', Arial, sans-serif;font-size:15px;font-weight:400;font-style:italic;color:#666;} div.form textarea {height:200px;} div.form .error {border-color:#cc3300 !important;} div.form label.error {display:none !important;} div.form div.thanks {padding:20px 10px;font-family:'Lato', Arial, sans-serif;font-size:15px;font-weight:400;} div.form div.mentions {position:absolute;bottom:0;font-size:12px;padding:10px;} #library #step1.done {position:absolute;top:-1000%;left:-1000%;visibility:hidden;} #collab {} #collab div.item {padding:30px 0;border-bottom:1px solid #eee;overflow:hidden;} #collab div.item:first-child {padding-top:0;} #collab div.item img {float:left;width:100px;margin:0 30px 0 0;} #collab div.item div {} #collab div.item h5 {font-size:16px;line-height:22px;font-weight:700;color:#1b243f;margin:0 0 3px;} #collab div.item h6 {font-family:'Merriweather', serif;font-size:16px;font-weight:700;color:#df5e2c;margin:0 0 7px;} #collab div.item p {margin:0 0 7px;} @media (max-width:992px) { #coords {width:auto;padding:20px;} div.form {float:none !important;width:auto !important;padding:25px 15px !important;} } @media (max-width:600px) { #wrap-contact {flex-direction:column;} #coords {order:2;} div.form h3 {padding:0;} div.form div.col {float:none;width:auto;padding:10px 0;} div.form div.row.message {padding:10px 0;} div.form div.row.single {padding:10px 0;} div.form div.number span.note {position:relative;top:auto;right:auto;width:auto;height:auto;padding:5px 10px;} div.form div.number input {padding-right:0;} div.form.library {padding-top:60px !important;} div.form .counter {top:15px;right:15px;} } #burger {position:absolute;top:27px;right:0;outline:none;display:none; -webkit-transform: scale(.8); transform: scale(.8); margin:0 auto; z-index:9999999999999; width:36px; height: 36px; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } @media (max-width:992px) { #burger {display:block;} } .burger-icon { position: absolute; padding:; height: 36px; width: 36px; } .burger-container { position: relative; height: 28px; width: 36px; } .burger-bun-top, .burger-bun-bot, .burger-filling { position: absolute; display: block; height: 4px; width: 36px; background: #fff; transition:background 2s ease; } #burger.open .burger-bun-top, #burger.open .burger-bun-bot, #burger.open .burger-filling { background: #fff; } .burger-bun-top { top: 0; -webkit-transform-origin: 34px 2px; transform-origin: 34px 2px; } .burger-bun-bot { bottom: 0; -webkit-transform-origin: 34px 2px; transform-origin: 34px 2px; } .burger-filling { top: 12px; } #burger.open .burger-bun-top { -webkit-animation: bun-top-out 0.6s linear normal; animation: bun-top-out 0.6s linear normal; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; } #burger.open .burger-bun-bot { -webkit-animation: bun-bot-out 0.6s linear normal; animation: bun-bot-out 0.6s linear normal; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; } #burger.closed .burger-bun-top { -webkit-animation: bun-top-in 0.6s linear normal; animation: bun-top-in 0.6s linear normal; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; } #burger.closed .burger-bun-bot { -webkit-animation: bun-bot-in 0.6s linear normal; animation: bun-bot-in 0.6s linear normal; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; } @-webkit-keyframes bun-top-out { 0% { left: 0; top: 0; -webkit-transform: rotate(0deg); transform: rotate(0deg); } 20% { left: 0; top: 0; -webkit-transform: rotate(15deg); transform: rotate(15deg); } 80% { left: -5px; top: 0; -webkit-transform: rotate(-60deg); transform: rotate(-60deg); } 100% { left: -5px; top: 1px; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); } } @keyframes bun-top-out { 0% { left: 0; top: 0; -webkit-transform: rotate(0deg); transform: rotate(0deg); } 20% { left: 0; top: 0; -webkit-transform: rotate(15deg); transform: rotate(15deg); } 80% { left: -5px; top: 0; -webkit-transform: rotate(-60deg); transform: rotate(-60deg); } 100% { left: -5px; top: 1px; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); } } @-webkit-keyframes bun-bot-out { 0% { left: 0; -webkit-transform: rotate(0deg); transform: rotate(0deg); } 20% { left: 0; -webkit-transform: rotate(-15deg); transform: rotate(-15deg); } 80% { left: -5px; -webkit-transform: rotate(60deg); transform: rotate(60deg); } 100% { left: -5px; -webkit-transform: rotate(45deg); transform: rotate(45deg); } } @keyframes bun-bot-out { 0% { left: 0; -webkit-transform: rotate(0deg); transform: rotate(0deg); } 20% { left: 0; -webkit-transform: rotate(-15deg); transform: rotate(-15deg); } 80% { left: -5px; -webkit-transform: rotate(60deg); transform: rotate(60deg); } 100% { left: -5px; -webkit-transform: rotate(45deg); transform: rotate(45deg); } } @-webkit-keyframes bun-top-in { 0% { left: -5px; bot: 0; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); } 20% { left: -5px; bot: 0; -webkit-transform: rotate(-60deg); transform: rotate(-60deg); } 80% { left: 0; bot: 0; -webkit-transform: rotate(15deg); transform: rotate(15deg); } 100% { left: 0; bot: 1px; -webkit-transform: rotate(0deg); transform: rotate(0deg); } } @keyframes bun-top-in { 0% { left: -5px; bot: 0; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); } 20% { left: -5px; bot: 0; -webkit-transform: rotate(-60deg); transform: rotate(-60deg); } 80% { left: 0; bot: 0; -webkit-transform: rotate(15deg); transform: rotate(15deg); } 100% { left: 0; bot: 1px; -webkit-transform: rotate(0deg); transform: rotate(0deg); } } @-webkit-keyframes bun-bot-in { 0% { left: -5px; -webkit-transform: rotate(45deg); transform: rotate(45deg); } 20% { left: -5px; bot: 0; -webkit-transform: rotate(60deg); transform: rotate(60deg); } 80% { left: 0; bot: 0; -webkit-transform: rotate(-15deg); transform: rotate(-15deg); } 100% { left: 0; -webkit-transform: rotate(0deg); transform: rotate(0deg); } } @keyframes bun-bot-in { 0% { left: -5px; -webkit-transform: rotate(45deg); transform: rotate(45deg); } 20% { left: -5px; bot: 0; -webkit-transform: rotate(60deg); transform: rotate(60deg); } 80% { left: 0; bot: 0; -webkit-transform: rotate(-15deg); transform: rotate(-15deg); } 100% { left: 0; -webkit-transform: rotate(0deg); transform: rotate(0deg); } } #burger.open .burger-filling { -webkit-animation: burger-fill-out 0.6s linear normal; animation: burger-fill-out 0.6s linear normal; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; } #burger.closed .burger-filling { -webkit-animation: burger-fill-in 0.6s linear normal; animation: burger-fill-in 0.6s linear normal; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; } @-webkit-keyframes burger-fill-in { 0% { width: 0; left: 36px; } 40% { width: 0; left: 40px; } 80% { width: 36px; left: -6px; } 100% { width: 36px; left: 0px; } } @keyframes burger-fill-in { 0% { width: 0; left: 36px; } 40% { width: 0; left: 40px; } 80% { width: 36px; left: -6px; } 100% { width: 36px; left: 0px; } } @-webkit-keyframes burger-fill-out { 0% { width: 36px; left: 0px; } 20% { width: 42px; left: -6px; } 40% { width: 0; left: 40px; } 100% { width: 0; left: 36px; } } @keyframes burger-fill-out { 0% { width: 36px; left: 0px; } 20% { width: 42px; left: -6px; } 40% { width: 0; left: 40px; } 100% { width: 0; left: 36px; } } /* REQUIRED CSS: change your reflow breakpoint here (35em below) */ @media ( max-width: 600px ) { /************* Default Theme *************/ /* overall */ .tablesorter-default { width: 100%; font: 12px/18px Arial, Sans-serif; color: #333; background-color: #fff; border-spacing: 0; margin: 10px 0 15px; text-align: left; } /* header */ .tablesorter-default th, .tablesorter-default thead td { font-weight: bold; color: #000; background-color: #fff; border-collapse: collapse; border-bottom: #ccc 2px solid; padding: 0; } .tablesorter-default tfoot th, .tablesorter-default tfoot td { border: 0; } .tablesorter-default .header, .tablesorter-default .tablesorter-header { background-image: url(data:image/gif;base64,R0lGODlhFQAJAIAAACMtMP///yH5BAEAAAEALAAAAAAVAAkAAAIXjI+AywnaYnhUMoqt3gZXPmVg94yJVQAAOw==); background-position: center right; background-repeat: no-repeat; cursor: pointer; white-space: normal; padding: 4px 20px 4px 4px; } .tablesorter-default thead .headerSortUp, .tablesorter-default thead .tablesorter-headerSortUp, .tablesorter-default thead .tablesorter-headerAsc { background-image: url(data:image/gif;base64,R0lGODlhFQAEAIAAACMtMP///yH5BAEAAAEALAAAAAAVAAQAAAINjI8Bya2wnINUMopZAQA7); border-bottom: #000 2px solid; } .tablesorter-default thead .headerSortDown, .tablesorter-default thead .tablesorter-headerSortDown, .tablesorter-default thead .tablesorter-headerDesc { background-image: url(data:image/gif;base64,R0lGODlhFQAEAIAAACMtMP///yH5BAEAAAEALAAAAAAVAAQAAAINjB+gC+jP2ptn0WskLQA7); border-bottom: #000 2px solid; } .tablesorter-default thead .sorter-false { background-image: none; cursor: default; padding: 4px; } /* tfoot */ .tablesorter-default tfoot .tablesorter-headerSortUp, .tablesorter-default tfoot .tablesorter-headerSortDown, .tablesorter-default tfoot .tablesorter-headerAsc, .tablesorter-default tfoot .tablesorter-headerDesc { border-top: #000 2px solid; } /* tbody */ .tablesorter-default td { background-color: #fff; border-bottom: #ccc 1px solid; padding: 4px; vertical-align: top; } .tablesorter-default td.center { text-align:left !important; } /* hovered row colors */ .tablesorter-default tbody > tr.hover > td, .tablesorter-default tbody > tr:hover > td, .tablesorter-default tbody > tr.even:hover > td, .tablesorter-default tbody > tr.odd:hover > td { background-color: #fff; color: #000; } /* Zebra Widget - row alternating colors */ .tablesorter-default tr > td:first-child { border-top:1px solid #DF5E2C; } /* uncomment out the line below if you don't want the sortable headers to show */ table.ui-table-reflow thead { display: none; } .ui-table-reflow td, .ui-table-reflow th { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; float: right; width: 100% !important; height: auto !important; } .ui-table-reflow tbody td[data-title]:before { color: #111; font-size: .9em; content: attr(data-title); float: left; width: 50%; white-space: pre-wrap; text-align: bottom; display: inline-block; font-weight:700; } } #history {background:url('../img/history.jpg') no-repeat top right #101626;} #history div.header div.wrap {max-width:1140px;height:auto;} #history div.header div.inner {padding:120px 0;margin-right:100px;border-bottom:1px solid #df5e2c;} #history h1 {font-size:46px;line-height:50px;text-transform:uppercase;} #history h1 span {color:#df5e2c;} #history h5 {position:absolute;top:-1000px;padding:20px 0;font-size:24px;line-height:28px;text-transform:uppercase;color:#fff;transform:translateY(-100%);opacity_:.3;transition:transform 1s ease;} #history h5 span {color:#df5e2c;} #history div.header p {color:#fff;max-width:560px;padding-top:20px;line-height:22px;} #history div.main {position:relative;} #history div.list {padding:80px 0;} #history div.currentyear {position:relative;padding:0 0 40px;font-family:'Merriweather', serif;font-size:48px;text-transform:uppercase;font-weight:700;color:#36487d;text-align:center;display:none;} #history div.currentyear:after {position:absolute;content:'';width:40px;height:3px;background:#36487d;left:50%;bottom:20px;transform:translate(-50%, 0);} #history div.item {position:relative;margin-bottom:80px;padding-left:120px;max-width:600px;} #history div.item div.left {position:absolute;top:0;left:0;} #history div.item div.date {font-family:'Merriweather', serif;font-size:20px;line-height:24px;text-transform:uppercase;font-weight:700;color:#df5e2c;margin:0 0 3px;} #history div.item div.year {font-size:14px;line-height:20px;letter-spacing:2px;text-transform:uppercase;font-weight:300;color:#fff;margin:0 0 15px 2px;} #history div.item div.cat {font-size:11px;line-height:14px;text-transform:uppercase;font-weight:700;color:#36487d;} #history div.item div.cat svg {display:inline-block;width:16px;height:16px;fill:#36487d;margin-right:10px;position:relative;top:3px;} #history div.item div.content {position:relative;font-weight:300;color:#ddd;text-align:justify;} #history div.item h2 {font-family:'Merriweather', serif;font-size:18px;line-height:24px;text-transform:uppercase;font-weight:700;color:#fff;margin:0 0 15px;min-height:50px;} #history div.item p {font-weight:300;color:#ddd;text-align:justify;} #history div.item.with-pict div.content {display:flex;position:relative;left:-300px;width:calc( 100% + 300px );} #history div.item.with-pict div.inner {flex:1;padding-left:30px;} #history div.item.with-pict div.pict {width:300px;} #history div.item.with-pict img {max-width:100%;float:right;} #history div.item.with-pict div.pict {width:300px;} #history div.item.with-pict div.pict.margin {margin-top:35px;} #history div.item div.docs {margin:30px 0;} #history div.item div.docs p {font-size:11px;line-height:14px;text-transform:uppercase;font-weight:700;color:#df5e2c;margin:0 0 10px;} #history div.item div.docs li {list-style:none;margin:5px 0;} #history div.item div.docs li a {font-size:12px;line-height:17px;color:#ccc;text-decoration:none;transition:all .3s ease;} #history div.item div.docs li a svg {display:inline-block;width:16px;height:16px;fill:#df5e2c;margin-right:10px;position:relative;top:3px;} #history div.item div.docs li a img {display:inline-block;width:16px;height:16px;margin-right:10px;position:relative;top:3px;} #history div.item div.docs li a:hover{color:#fff;margin-left:2px;} #history div.footer {background:#0b101b;padding:60px 0;position:relative;z-index:4;border-top_:80px solid #101626; -webkit-box-shadow: 0px -52px 5px 0px rgba(16,22,38,0.34); -moz-box-shadow: 0px -52px 5px 0px rgba(16,22,38,0.34); box-shadow: 0px -52px 5px 0px rgba(16,22,38,0.34); } #history div.footer div.cols {display:flex;flex-wrap:wrap;justify-content:space-between;} #history div.footer div.cols div {display:flex;flex-wrap:wrap;justify-content:space-between;max-width:33.33%;} #history div.footer h4 {font-family:'Merriweather', serif;font-size:13px;line-height:18px;text-transform:uppercase;font-weight:700;color:#df5e2c;margin:0 40px 0 0;} #history div.footer ul {margin:0 40px 0 0;list-style:none;} #history div.footer li {} #history div.footer li a {font-size:11px;color:#eee;text-decoration:none;} #history div.footer li a:hover {color:#fff;} #timeline {position:absolute;top:-50px;right:100px;height:100%;width:1px;border-left:1px solid #fff;z-index:3;} #timeline h6 {position:absolute;top:-50px;margin-left:-50px;font-family:'Merriweather', serif;font-size:16px;text-transform:uppercase;font-weight:300;letter-spacing:2px;color:#fff;} #tlwrap {position:absolute;top:0;height:100%;width:300px;left:-150px;overflow-y:hidden;} #tlyears {position:absolute;width:100%;top:40px;text-align:center;transition:top .3s ease-out;} #timeline div.year {position:relative;display:block;width:15px;height:15px;border:2px solid #fff;border-radius:50%;background:#101626;margin:0 auto 60px;transition:all .3s ease-out;cursor:pointer;} #timeline div.year span {position:absolute;font-family:'Merriweather', serif;font-size:16px;text-transform:uppercase;font-weight:300;letter-spacing:2px;color:#fff;top:-5px;left:30px;background:#101626;} #timeline div.year:nth-child(odd) span {left:auto;right:30px;} #timeline div.year.on {transform:scale(1.6);border-color:#df5e2c;} #timeline div.year.on span {font-weight:700;color:#df5e2c;padding:0 5px 0 10px;} #timeline div.year:hover {background:#fff;} #timeline div.year.on {cursor:default;} #timeline div.year.on:hover {background:#101626;} #timeline div.year.off {border-color:#888;cursor:default;} #timeline div.year.off span {color:#888;} #timeline div.year.off:hover {background:#101626;} body.history #footer {background:#0b101b;margin:0;padding:40px 0 100px;position:relative;z-index:4;} body.history #footer div.iiw svg {fill:#fff;} body.history #footer p {color:#fff;} body.history #footer ul.nav li a {color:#666;} body.history #footer ul.details li a{color:#666;} body.history #footer a:hover {color:#fff !important;} div.video {position:relative;padding-bottom:56.25%;padding-top:25px;height:0;} div.video iframe {position:absolute;top:0;left:0;width:100%;height:100%;} #history.fixed div.header {position:fixed;top:0;width:100%;z-index:2;background:#101626;} #history.fixed div.header div.inner {padding:0;-webkit-box-shadow:0px 46px 116px -14px rgba(16,22,38,1);-moz-box-shadow:0px 46px 116px -14px rgba(16,22,38,1);box-shadow:0px 46px 116px -14px rgba(16,22,38,1);} #history.fixed h1 {display:none;} #history.fixed h5 {position:relative;top:auto;opacity:1;transform:translateY(0%);} #history.fixed div.header p {display:none;} #history.fixed #timeline {position:fixed;} #selectyears {display:none;margin:15px 0 0;} #selectyears p {font-size:11px;line-height:14px;text-transform:uppercase;font-weight:700;color:#fff;margin:0 0 5px;} #selectyears select {display:block;width:100%;background:#000;padding:10px;color:#fff;border:1px solid #333;/*-webkit-appearance:none;*/} @media (max-width:1580px) { #history div.item.with-pict div.content {left:-160px;width:calc( 100% + 160px );} #history div.item.with-pict div.pict{width:160px;} } @media (max-width:1280px) { } @media (max-width:992px) { #history {background:url('../img/history.jpg') no-repeat top right #101626;} #history h1 {display:block !important;font-size:24px;line-height:28px;} #history.fixed div.header {position:relative;top:auto;width:auto;background:none;} #history h5 {display:none !important;} #history div.header div.inner {margin-right:0;padding:120px 0 !important;} #history div.item {max-width:100%;padding-left:0;} #history div.item div.left {position:relative;top:auto;left:auto;} #history div.item h2 {margin-top:20px;} #history div.item.with-pict div.content {padding-left:0;min-height:100%;} #history div.item.with-pict div.pict.margin {margin-top:0;} #history div.item.with-pict img {position:relative;right:auto;top:auto;display:block;max-height:100%;margin:0 0 15px;} #timeline {display:none;} #selectyears {display:block;} #history div.currentyear {display:block;} #history div.footer div.cols div{display:block;max-width:33.33%;} #history div.item.with-pict div.content {left:auto;width:100%;} #history div.item.with-pict div.pict{width:180px;} } @media (max-width:600px) { #history div.item.with-pict div.content {display:block;} #history div.item.with-pict div.inner {padding-left:0;} #history div.footer div.cols {display:block;} #history div.footer div.cols div{max-width:100%;margin-bottom:30px;} }