#top-pane {display:flex; width:95%; max-width:1740px; flex-wrap:wrap; align-items:center; margin:60px auto;} #left-pane {width:35%; box-sizing:border-box; padding-left:40px;} #left-pane h2 {padding-left:60px; font:36px/40px 'gothammediumregular', arial, sans-serif; color:#070C19; background:url('../appel/icon-date-limite.png') no-repeat left top;} #left-pane p {font:18px/25px 'Apercu Pro', arial, sans-serif; color:#070C19; padding:0 10% 0 0; margin:0;} #left-pane p a {font:18px/25px 'Apercu Pro', arial, sans-serif; color:#00A9C0; padding:0 10% 0 0; margin:0;} #left-pane a.depot {font:18px/25px 'Apercu Pro', arial, sans-serif; color:#ffffff; transition:0.25s; padding:5px 40px; margin:0; background:#006fae; border-radius:8px; text-decoration:none;} #left-pane a:hover.depot {background: #4294c3;} #right-pane {width:65%; text-align:right;} #right-pane img {display:block; width:100%;} #right-pane p {font:18px/22px 'Apercu Pro', arial, sans-serif; color:#070C19; padding:0; margin:0;} @media only screen and (max-width: 1100px) { #left-pane {width:100%;} #right-pane {width:100%; order:-1;} } .wide {margin:100px 0 60px 0;} .wide img {display:block; width:100%;} .wide p {font:18px/22px 'Apercu Pro', arial, sans-serif; color:#070C19; padding:0; margin:10px 20px 0 20px; text-align:right;} #text-panel {width:95%; max-width:1410px; margin:100px auto;} #text-panel p {padding:45px 13%; margin:0; font:26px/30px 'gotham_bookitalic', arial, sans-serif; color:#070C19; background:url('../appel/icon-guillemet.png') no-repeat 20px top, url('../appel/icon-guillemet-close.png') no-repeat right bottom;} @media only screen and (max-width: 600px) { #text-panel p {font:16px/16px 'gothammediumitalic', arial, sans-serif;} } 