Diff
checker
Testo
Testo
Immagini
Documenti
Excel
Cartelle
Legal
Enterprise
Applicazione per desktop
Prezzi
Accedi
Scarica Diffchecker Desktop
Confronta il testo
Trova la differenza tra due file di testo
Strumenti
Cronologia
Editor live
Comprimi invariate
Senza a capo
Layout
Diviso
Unificato
Livello di dettaglio
Intelligente
Parola
Carattere
Evidenziazione sintassi
Scegli sintassi
Ignora
Trasforma testo
Vai alla prima modifica
Modifica input
Diffchecker Desktop
Il modo più sicuro per usare Diffchecker. Ottieni l'app Diffchecker Desktop: i tuoi diff non lasciano mai il tuo computer!
Ottieni Desktop
Untitled diff
Creato
7 anni fa
Il diff non scade mai
Eliminare
Esporta
Condividere
Spiegare
251 rimozioni
Linee
Totale
Rimosso
Caratteri
Totale
Rimosso
Per continuare a utilizzare questa funzione, aggiorna a
Diff
checker
Pro
Visualizza prezzi
512 linee
Copia tutti
129 aggiunte
Linee
Totale
Aggiunto
Caratteri
Totale
Aggiunto
Per continuare a utilizzare questa funzione, aggiorna a
Diff
checker
Pro
Visualizza prezzi
388 linee
Copia tutti
Copia
Copiato
Copia
Copiato
/*
--------------------------------------
/*
--------------------------------------
design.css
design.css
Contient les conteneurs de mise en page.
Contient les conteneurs de mise en page.
Le design.css permet de mettre en forme votre site web avec le design de votre choix
Le design.css permet de mettre en forme votre site web avec le design de votre choix
Copia
Copiato
Copia
Copiato
--------------------------------------
*/
--------------------------------------
*/
/* -- Elements HTML generiques specifique au theme -- */
/* -- Elements HTML generiques specifique au theme -- */
/* -------------------------------------------------- */
/* -------------------------------------------------- */
html {
html {
font-size: 100%;
font-size: 100%;
font-size: 10px;
font-size: 10px;
}
}
body {
body {
position: relative;
position: relative;
height: auto;
height: auto;
min-height: 100%;
min-height: 100%;
Copia
Copiato
Copia
Copiato
font-size: 1.
3em
;
font-size: 1.
456em
;
font-family: 'Open Sans', sans-serif;
font-family: 'Open Sans', sans-serif;
Copia
Copiato
Copia
Copiato
font-weight: 300;
line-height: 1.6;
}
}
Copia
Copiato
Copia
Copiato
@media (
max
-width: 76
8
px) {
@media (
min
-width: 76
9
px) {
body {
body {
Copia
Copiato
Copia
Copiato
font-size: 1.
4em
;
font-size: 1.
618em
;
}
}
}
}
Copia
Copiato
Copia
Copiato
/* -- Gestion de la taille du site -- */
/* -- Gestion de la taille du site -- */
/* ---------------------------------- */
/* ---------------------------------- */
Copia
Copiato
Copia
Copiato
#header,
#header,
#global,
#global,
#footer {
#footer {
width: 100%;
width: 100%;
Copia
Copiato
Copia
Copiato
padding: 0.809em;
}
}
Copia
Copiato
Copia
Copiato
@media (min-width: 76
8
px)
{
@media (min-width: 76
9
px)
{
#header
,
#header
{
padding: 1.618em 0;
}
#top-header,
#sub-header
,
#global,
#global,
#footer {
#footer {
Copia
Copiato
Copia
Copiato
max-
width:
1024px
;
margin: auto;
padding: 1.618em 0;
}
#top-header,
#sub-header,
#global,
#footer {
width:
768px
;
}
}
}
}
Copia
Copiato
Copia
Copiato
/* -- Gestion des couleurs principales -- */
@media (min-width: 1025px) { #top-header, #sub-header, #global, #footer { width: 1024px; } }
/* -------------------------------------- */
@media (min-width: 1367px) { #top-header, #sub-header, #global, #footer { width: 1280px; } }
/*
Blue => #021B34; #1E5083; #366493; #517BA6; #81A4C8;
Green => #003524; #168561; #2F9674; #4BAA8B; #7CCAB0;
red => #490011; #B81F43; #CF4162; #EA6886; #F294AA;
Orange => #511B00; #C95A21; #E27B47; #FFA172; #FFBF9C;
Yellow => #513000; #C98621; #E2A447; #FFC672; #FFD79C;
Purple => #080437; #2E278B; #47409D; #645CB1; #8F8ACF;
*/
body { background-color: #F1F1F1; }
#header, #global { background-color: #FAFAFA; }
#sub-header { background-color: #366493; }
#footer { background-color: #81A4C8; }
#top-header, #global { border-color: #E1E1E1; }
#footer { border-color: #366493; }
.footer-infos { border-color: #366493; }
Copia
Copiato
Copia
Copiato
body { color: #021B34; }
#site-name { color: #366493; }
#site-slogan { color: #81A4C8; }
#sub-header,
#sub-header a { color: #FFFFFF; }
.footer-infos span { color: #366493; }
.footer-infos span a { color: #021B34; }
/* -- En-tete de page - Header -- */
/* -- En-tete de page - Header -- */
/* ------------------------------ */
/* ------------------------------ */
Copia
Copiato
Copia
Copiato
#header {
#header {
margin: auto;
}
/* --- Partie superieure du header --- */
#top-header {
position: relative;
position: relative;
Copia
Copiato
Copia
Copiato
display: flex;
display: -ms-flexbox;
display: -webkit-flex;
flex-direction: row;
-ms-flex-direction: row;
-webkit-flex-direction: row;
margin: auto;
min-height: 139px;
border-width: 0 1px 0 1px;
border-style: solid;
}
#top-header-content {
flex: 1 1 auto;
-ms-flex: 1 1 auto;
-webkit-flex: 1 1 auto;
}
@media (max-width: 768px) {
#top-header {
flex-direction: column;
-ms-flex-direction: column;
-webkit-flex-direction: column;
}
#top-header-content {
align-self: flex-end;
-ms-align-self: flex-end;
-webkit-align-self: flex-end;
}
}
}
/* --- Partie inferieur du header --- */
/* --- Partie inferieur du header --- */
Copia
Copiato
Copia
Copiato
#sub-header {
min-height: 35px;
}
#sub-header-content{
margin: auto;
}
/* --- Logo et Nom du site web --- */
#site-infos {
display: flex;
display: -ms-flexbox;
display: -webkit-flex;
margin: 1.5em 0 0 1.5em;
max-width: 940px;
flex: 1 1 auto;
}
#site-logo {
#site-logo {
Copia
Copiato
Copia
Copiato
margin: 0 1em 0 0;
width: 60px;
width: 60px;
height: 60px;
height: 60px;
background-image: url(images/logo.png);
background-image: url(images/logo.png);
background-position: center;
background-position: center;
background-repeat: no-repeat;
background-repeat: no-repeat;
background-size: cover;
background-size: cover;
Copia
Copiato
Copia
Copiato
flex: 0 0 auto;
-ms-flex: 0 0 auto;
-webkit-flex: 0 0 auto;
}
}
#site-name-container {
#site-name-container {
Copia
Copiato
Copia
Copiato
margin: 0.
4
em 0 0 0
;
margin: 0.
2
em 0 0 0
.809em
;
}
}
#site-name {
#site-name {
Copia
Copiato
Copia
Copiato
font-size:
3em
;
font-size:
1.618em
;
font-weight:
bold;
display: block;
line-height: 1em;
font-weight:
400
;
letter-spacing: 0.02em
;
text-decoration: none;
text-decoration: none;
}
}
#site-slogan {
#site-slogan {
display: block;
display: block;
Copia
Copiato
Copia
Copiato
padding: 0.
1em
0 0 0.1
em;
padding: 0.
3236em
0 0 0.1
618
em;
font-size:
1
em;
font-size:
0.8
em;
letter-spacing: 0.1em;
letter-spacing: 0.1em;
}
}
@media (min-width: 769px) {
@media (min-width: 769px) {
#site-logo {
#site-logo {
width: 90px;
width: 90px;
height: 90px;
height: 90px;
}
}
#site-name-container {
#site-name-container {
Copia
Copiato
Copia
Copiato
margin:
1em
0 0 0
;
margin:
0 0 0
1.618em
;
}
}
#site-name {
#site-name {
Copia
Copiato
Copia
Copiato
font-size:
4
em;
font-size:
3.236em;
line-height: 1.2
em;
}
}
Copia
Copiato
Copia
Copiato
#site-slogan {
font-size: 1em;
padding: 0.1em 0 0 0.1618em;
}
}
}
Copia
Copiato
Copia
Copiato
/* -- Conteneur global du site -- */
/* -- Conteneur global du site -- */
/* ------------------------------ */
/* ------------------------------ */
Copia
Copiato
Copia
Copiato
#global {
display: flex;
display: -ms-flexbox;
display: -webkit-flex;
flex-direction: column;
-ms-flex-direction: column;
-webkit-flex-direction: column;
margin: 0 auto 0 auto;
padding: 0;
border-width: 0 1px 0 1px;
border-style: solid;
}
#main {
#main {
Copia
Copiato
Copia
Copiato
padding: 0 0 10px 0;
width: 100%;
max-
width: 100%;
order : 1;
-ms-flex-order: 1;
-webkit-flex-order: 1;
}
}
#menu-left,
#menu-left,
#menu-right {
#menu-right {
width: 100%;
width: 100%;
}
}
Copia
Copiato
Copia
Copiato
#menu-left {
order : 2;
-ms-flex-order: 2;
-webkit-flex-order: 2;
}
#menu-right {
order : 3;
-ms-flex-order: 3;
-webkit-flex-order: 3;
}
@media (min-width: 769px) {
@media (min-width: 769px) {
Copia
Copiato
Copia
Copiato
#global {
#menu-left { margin-right: 1.618em; }
min-height: 100vh;
#menu-right { margin-left: 1.618em; }
flex-direction: row;
-ms-flex-direction: row;
-webkit-flex-direction: row;
}
#main {
padding: 0 10px;
order : 2;
-ms-flex-order: 2;
-webkit-flex-order: 2;
flex: 1 0 auto;
-ms-flex: 1 0 100%;
}
#menu-left,
#menu-left,
#menu-right {
#menu-right {
Copia
Copiato
Copia
Copiato
width:
200px
;
width:
calc(100% / 13 * 3.5)
;
}
}
Copia
Copiato
Copia
Copiato
#menu-left
{
#menu-left
.narrow-menu-left
{
margin-right: 0.809em; }
order : 1;
#menu-right.narrow-menu-right { margin-left: 0.809em; }
-ms-flex-order: 1;
-webkit-flex-order: 1
;
#menu-left.narrow-menu-left,
#menu-right.narrow-menu-right {
width: calc(100% / 13 * 2.5)
;
}
}
Copia
Copiato
Copia
Copiato
#menu-right {
order : 3;
#main {
-ms-flex-order: 3;
padding: 0 0 1.618em
;
-webkit-flex-order: 3
;
}
}
Copia
Copiato
Copia
Copiato
#main.main-with-left,
#main.main-with-left,
#main.main-with-right {
#main.main-with-right {
Copia
Copiato
Copia
Copiato
width: calc(100% -
200px);
width: calc(100% -
((100% / 13 * 5)));
-ms-flex: 1 0 auto; /*Tricks IE*/
}
}
Copia
Copiato
Copia
Copiato
#main.main-with-left.main-with-right {
#main.main-with-left.main-with-right {
Copia
Copiato
Copia
Copiato
width: calc(100% -
400px);
width: calc(100% -
((100% / 13 * 8)));
-ms-flex: 1 0 auto; /*Tricks IE*/
}
}
}
}
#top-footer {
#top-footer {
Copia
Copiato
Copia
Copiato
padding: 0.
5em 0;
padding: 0.
809em;
}
/* -- Contenu de la page -- */
/* ------------------------ */
/* --- Contenu central --- */
#main-content {
padding: 1.5em 0.8em;
}
}
.block-container {
.block-container {
Copia
Copiato
Copia
Copiato
margin-top:
15px
;
margin-top:
1em
;
}
}
/* --- Emplacement au dessus et en dessous du contenu de la page --- */
/* --- Emplacement au dessus et en dessous du contenu de la page --- */
#top-content {
#top-content {
Copia
Copiato
Copia
Copiato
margin: 0 0
2% 0;
margin: 0 0
1.618
em 0
;
padding: 0.1
em 0
.8em
;
}
}
/* --- Emplacement au dessus du pied de page --- */
/* --- Emplacement au dessus du pied de page --- */
#bottom-content {
#bottom-content {
Copia
Copiato
Copia
Copiato
margin:
2% 0
0 0;
margin:
1.618em
0 0;
padding: 0.1em 0.8em;
}
}
/* -- Pied de page - Footer -- */
/* -- Pied de page - Footer -- */
/* --------------------------- */
/* --------------------------- */
#footer {
#footer {
Copia
Copiato
Copia
Copiato
margin: auto;
clear: both;
clear: both;
border-width: 4px 0 0 0;
border-width: 4px 0 0 0;
border-style: solid;
border-style: solid;
Copia
Copiato
Copia
Copiato
border-color: transparent;
}
}
.footer-content {
.footer-content {
margin: 0 auto 0 auto;
margin: 0 auto 0 auto;
Copia
Copiato
Copia
Copiato
padding:
1.5em 0
;
padding:
0.809em
;
}
}
.footer-infos {
.footer-infos {
margin: auto;
margin: auto;
Copia
Copiato
Copia
Copiato
padding
-top: 10px
;
padding
: 0.809em
;
min-height: 40px;
min-height: 40px;
border-width: 1px 0 0 0;
border-width: 1px 0 0 0;
border-style: solid;
border-style: solid;
Copia
Copiato
Copia
Copiato
border-color: transparent;
text-align: center;
text-align: center;
}
}
Copia
Copiato
Copia
Copiato
Text moved with changes to lines 310-315 (82.4% similarity)
@media (min-width: 769px) {
.footer-infos {
width: 400px;
}
}
.footer-infos span {
.footer-infos span {
font-size: 0.8em;
font-size: 0.8em;
Copia
Copiato
Copia
Copiato
display: block;
}
}
Copia
Copiato
Copia
Copiato
@media (max-width: 768px) {
.footer-infos span
.footer-infos-separator
{
.footer-infos span
{
display:
none;
display:
block
}
}
Copia
Copiato
Copia
Copiato
@media (min-width: 769px) {
.footer-infos span,
.footer-infos span.footer-infos-separator {
.footer-infos span.footer-infos-separator {
Copia
Copiato
Copia
Copiato
display:
none
;
display:
inline-block
;
}
}
.footer-infos {
.footer-infos {
Copia
Copiato
Copia
Copiato
padding:
10px
;
padding:
0.618em 0 0
;
}
}
}
}
/* -- Elements specifiques PHPboost -- */
/* -- Elements specifiques PHPboost -- */
/* ----------------------------------- */
/* ----------------------------------- */
/* --- Compteur de visites --- */
/* --- Compteur de visites --- */
#visit-counter {
#visit-counter {
position: absolute;
position: absolute;
Copia
Copiato
Copia
Copiato
right:
0;
right:
1.618em
;
bottom : 1em
;
top : 92.5%
;
margin-right: 10px
;
font-size: 0.9em;
font-size: 0.9em;
text-align: right;
text-align: right;
}
}
/* --- Barre de lien rapide --- */
/* --- Barre de lien rapide --- */
#breadcrumb {
#breadcrumb {
Copia
Copiato
Copia
Copiato
margin
: 0
0 20px 10px
;
padding
: 0
.618em
;
text-indent: 10px
;
font-size: 0.809em
;
}
}
#breadcrumb ol {
#breadcrumb ol {
margin: 0;
margin: 0;
list-style: none;
list-style: none;
}
}
#breadcrumb li {
#breadcrumb li {
display: inline;
display: inline;
}
}
#breadcrumb li:not(.current):after {
#breadcrumb li:not(.current):after {
content: '/';
content: '/';
Copia
Copiato
Copia
Copiato
color: #616161;
}
}
/* --- Scroll to Top --- */
/* --- Scroll to Top --- */
.scroll-to {
.scroll-to {
position: fixed;
position: fixed;
z-index: 10;
z-index: 10;
display: none;
display: none;
Copia
Copiato
Copia
Copiato
background-color: rgba(15, 15, 16, 0.8)
;
cursor: pointer
;
}
}
#scroll-to-top {
#scroll-to-top {
Copia
Copiato
Copia
Copiato
right:
25px
;
right:
0
;
bottom: 0
;
bottom: 0
.618em
;
padding:
2px 11px 3px 10px;
padding:
0.618em
0.
809em
;
transition:
0.
2s
;
}
}
Copia
Copiato
Copia
Copiato
#scroll-to-top,
.scroll-to i {
.scroll-to i {
Copia
Copiato
Copia
Copiato
color: rgba(255, 255, 255, 0.8);
transition: 0.2s;
transition: 0.2s;
}
}
Copia
Copiato
Copia
Copiato
#scroll-to-top:hover,
.scroll-to:hover i {
.scroll-to:hover i {
Copia
Copiato
Copia
Copiato
color: rgba(255, 255, 255, 1);
transition: 0.3s;
transition: 0.3s;
}
}
@media (min-width: 769px) {
@media (min-width: 769px) {
#scroll-to-top {
#scroll-to-top {
Copia
Copiato
Copia
Copiato
bottom: 25px;
right: 0.618em
;
padding: 9px 11px 11px 10px
;
}
}
.scroll-to i {
.scroll-to i {
Copia
Copiato
Copia
Copiato
font-size:
2em;
font-size:
1.618em;
}
}
@media (max-width: 768px) {
#scroll-to-top:hover {
padding: 9px 11px 11px 10px;
transition: 0.3s;
}
}
}
}
Copia
Copiato
Copia
Copiato
/* --
Cookie Bar
-- */
/* --
-
Cookie Bar
--- */
/* ----------------
--- */
.cookiebar-container {
.cookiebar-container {
z-index: 100;
z-index: 100;
left: 0;
left: 0;
right: 0;
right: 0;
top: 0;
top: 0;
Copia
Copiato
Copia
Copiato
padding:
7px 20px;
padding:
0.456em 1.309em
;
background-color: #F2F2F2;
font-size: 0.
80
9em;
border-bottom: 1px solid #E2E2E2
;
font-size: 0.
9em;
text-align: center;
text-align: center;
}
}
Copia
Copiato
Copia
Copiato
@media (max-width: 768px) {
.cookiebar-container {
position: fixed;
top: auto;
bottom: 0;
padding: 1.309em 1.309em 0.456em 1.309em;
margin: 1em 0.456em;
Text moved with changes from lines 320-325 (82.4% similarity)
border-style: solid;
border-width: 1px;
font-size: 1em;
}
}
.cookiebar-container.fixed {
.cookiebar-container.fixed {
position: fixed;
position: fixed;
}
}
.cookiebar-content {
.cookiebar-content {
text-align: justify;
text-align: justify;
}
}
@media (min-width: 769px) {
@media (min-width: 769px) {
.cookiebar-content {
.cookiebar-content {
display: inline-block;
display: inline-block;
Copia
Copiato
Copia
Copiato
max-width: calc(100% -
250px
);
max-width: calc(100% -
400px
);
vertical-align:
middle
;
vertical-align:
top
;
}
}
.cookiebar-actions {
.cookiebar-actions {
display: inline-block;
display: inline-block;
Copia
Copiato
Copia
Copiato
width:
250px
;
width:
400px
;
}
}
}
}
@media (max-width: 768px) {
@media (max-width: 768px) {
.cookiebar-content {
.cookiebar-content {
Copia
Copiato
Copia
Copiato
margin-bottom:
5px
;
margin-bottom:
0.309em
;
}
}
.cookiebar-actions {
.cookiebar-actions {
Copia
Copiato
Copia
Copiato
margin:
15px
0
5px
0;
margin:
1em
0
0.309em
0;
}
}
}
}
.cookiebar-button {
.cookiebar-button {
Copia
Copiato
Copia
Copiato
margin: 0
5px 0 5px;
margin: 0
0.309em
;
border-radius: 4px;
color: #FEFEFE
;
}
}
@media (max-width: 768px) {
@media (max-width: 768px) {
.cookiebar-button {
.cookiebar-button {
Copia
Copiato
Copia
Copiato
margin: 0
10px 0 10px
;
margin: 0
0.618em
;
}
}
}
}
Copia
Copiato
Copia
Copiato
.cookiebar-button-understand { background-color: #337AB7; border-color: #2E6DA4; }
.cookiebar-button-understand:hover { background-color: #2E6DA4; }
.cookiebar-button-allowed { background-color: #5CB85C; border-color: #4CAE4C; }
.cookiebar-button-allowed:hover { background-color: #4CAE4C; }
.cookiebar-button-declined { background-color: #E84E40; border-color: #CE271A; }
.cookiebar-button-declined:hover { background-color: #CE271A; }
@media (max-width: 468px) {
@media (max-width: 468px) {
.cookiebar-more {
.cookiebar-more {
display: block;
display: block;
Copia
Copiato
Copia
Copiato
margin:
10px
0
5px
0;
margin:
0.618em
0
0.309em
0;
}
}
}
}
.aboutcookie-title {
.aboutcookie-title {
font-size: 1.3em;
font-size: 1.3em;
line-height: 1.3em;
line-height: 1.3em;
font-weight: bold
font-weight: bold
}
}
.aboutcookie-title + p {
.aboutcookie-title + p {
Copia
Copiato
Copia
Copiato
margin:
0px
0
20px 0px
;
margin:
0
0
1.309 0
;
}
}
#cookiebar-change-choice {
#cookiebar-change-choice {
Copia
Copiato
Copia
Copiato
margin-top:
10px
;
margin-top:
0.618em
;
text-align: center;
text-align: center;
}
}
.cookiebar-change-choice-link {
.cookiebar-change-choice-link {
text-align: center;
text-align: center;
}
}
Copia
Copiato
Copia
Copiato
/* --- Search engines --- */
.robot {
font-size: 0.9em;
font-weight: bold;
}
Diff salvati
Testo originale
Apri file
/*-------------------------------------- design.css Contient les conteneurs de mise en page. Le design.css permet de mettre en forme votre site web avec le design de votre choix --------------------------------------*/ /* -- Elements HTML generiques specifique au theme -- */ /* -------------------------------------------------- */ html { font-size: 100%; font-size: 10px; } body { position: relative; height: auto; min-height: 100%; font-size: 1.3em; font-family: 'Open Sans', sans-serif; } @media (max-width: 768px) { body { font-size: 1.4em; } } /* -- Gestion de la taille du site -- */ /* ---------------------------------- */ #header, #global, #footer { width: 100%; } @media (min-width: 768px) { #header, #global, #footer { max-width: 1024px; } } /* -- Gestion des couleurs principales -- */ /* -------------------------------------- */ /* Blue => #021B34; #1E5083; #366493; #517BA6; #81A4C8; Green => #003524; #168561; #2F9674; #4BAA8B; #7CCAB0; red => #490011; #B81F43; #CF4162; #EA6886; #F294AA; Orange => #511B00; #C95A21; #E27B47; #FFA172; #FFBF9C; Yellow => #513000; #C98621; #E2A447; #FFC672; #FFD79C; Purple => #080437; #2E278B; #47409D; #645CB1; #8F8ACF; */ body { background-color: #F1F1F1; } #header, #global { background-color: #FAFAFA; } #sub-header { background-color: #366493; } #footer { background-color: #81A4C8; } #top-header, #global { border-color: #E1E1E1; } #footer { border-color: #366493; } .footer-infos { border-color: #366493; } body { color: #021B34; } #site-name { color: #366493; } #site-slogan { color: #81A4C8; } #sub-header, #sub-header a { color: #FFFFFF; } .footer-infos span { color: #366493; } .footer-infos span a { color: #021B34; } /* -- En-tete de page - Header -- */ /* ------------------------------ */ #header { margin: auto; } /* --- Partie superieure du header --- */ #top-header { position: relative; display: flex; display: -ms-flexbox; display: -webkit-flex; flex-direction: row; -ms-flex-direction: row; -webkit-flex-direction: row; margin: auto; min-height: 139px; border-width: 0 1px 0 1px; border-style: solid; } #top-header-content { flex: 1 1 auto; -ms-flex: 1 1 auto; -webkit-flex: 1 1 auto; } @media (max-width: 768px) { #top-header { flex-direction: column; -ms-flex-direction: column; -webkit-flex-direction: column; } #top-header-content { align-self: flex-end; -ms-align-self: flex-end; -webkit-align-self: flex-end; } } /* --- Partie inferieur du header --- */ #sub-header { min-height: 35px; } #sub-header-content{ margin: auto; } /* --- Logo et Nom du site web --- */ #site-infos { display: flex; display: -ms-flexbox; display: -webkit-flex; margin: 1.5em 0 0 1.5em; max-width: 940px; flex: 1 1 auto; } #site-logo { margin: 0 1em 0 0; width: 60px; height: 60px; background-image: url(images/logo.png); background-position: center; background-repeat: no-repeat; background-size: cover; flex: 0 0 auto; -ms-flex: 0 0 auto; -webkit-flex: 0 0 auto; } #site-name-container { margin: 0.4em 0 0 0; } #site-name { font-size: 3em; font-weight: bold; line-height: 1em; letter-spacing: 0.02em; text-decoration: none; } #site-slogan { display: block; padding: 0.1em 0 0 0.1em; font-size: 1em; letter-spacing: 0.1em; } @media (min-width: 769px) { #site-logo { width: 90px; height: 90px; } #site-name-container { margin: 1em 0 0 0; } #site-name { font-size: 4em; } } /* -- Conteneur global du site -- */ /* ------------------------------ */ #global { display: flex; display: -ms-flexbox; display: -webkit-flex; flex-direction: column; -ms-flex-direction: column; -webkit-flex-direction: column; margin: 0 auto 0 auto; padding: 0; border-width: 0 1px 0 1px; border-style: solid; } #main { padding: 0 0 10px 0; max-width: 100%; order : 1; -ms-flex-order: 1; -webkit-flex-order: 1; } #menu-left, #menu-right { width: 100%; } #menu-left { order : 2; -ms-flex-order: 2; -webkit-flex-order: 2; } #menu-right { order : 3; -ms-flex-order: 3; -webkit-flex-order: 3; } @media (min-width: 769px) { #global { min-height: 100vh; flex-direction: row; -ms-flex-direction: row; -webkit-flex-direction: row; } #main { padding: 0 10px; order : 2; -ms-flex-order: 2; -webkit-flex-order: 2; flex: 1 0 auto; -ms-flex: 1 0 100%; } #menu-left, #menu-right { width: 200px; } #menu-left { order : 1; -ms-flex-order: 1; -webkit-flex-order: 1; } #menu-right { order : 3; -ms-flex-order: 3; -webkit-flex-order: 3; } #main.main-with-left, #main.main-with-right { width: calc(100% - 200px); -ms-flex: 1 0 auto; /*Tricks IE*/ } #main.main-with-left.main-with-right { width: calc(100% - 400px); -ms-flex: 1 0 auto; /*Tricks IE*/ } } #top-footer { padding: 0.5em 0; } /* -- Contenu de la page -- */ /* ------------------------ */ /* --- Contenu central --- */ #main-content { padding: 1.5em 0.8em; } .block-container { margin-top: 15px; } /* --- Emplacement au dessus et en dessous du contenu de la page --- */ #top-content { margin: 0 0 2% 0; padding: 0.1em 0.8em; } /* --- Emplacement au dessus du pied de page --- */ #bottom-content { margin: 2% 0 0 0; padding: 0.1em 0.8em; } /* -- Pied de page - Footer -- */ /* --------------------------- */ #footer { margin: auto; clear: both; border-width: 4px 0 0 0; border-style: solid; } .footer-content { margin: 0 auto 0 auto; padding: 1.5em 0; } .footer-infos { margin: auto; padding-top: 10px; min-height: 40px; border-width: 1px 0 0 0; border-style: solid; text-align: center; } @media (min-width: 769px) { .footer-infos { width: 400px; } } .footer-infos span { font-size: 0.8em; } @media (max-width: 768px) { .footer-infos span { display: block } .footer-infos span.footer-infos-separator { display: none; } .footer-infos { padding: 10px; } } /* -- Elements specifiques PHPboost -- */ /* ----------------------------------- */ /* --- Compteur de visites --- */ #visit-counter { position: absolute; right: 0; bottom : 1em; margin-right: 10px; font-size: 0.9em; text-align: right; } /* --- Barre de lien rapide --- */ #breadcrumb { margin: 0 0 20px 10px; text-indent: 10px; } #breadcrumb ol { margin: 0; list-style: none; } #breadcrumb li { display: inline; } #breadcrumb li:not(.current):after { content: '/'; color: #616161; } /* --- Scroll to Top --- */ .scroll-to { position: fixed; z-index: 10; display: none; background-color: rgba(15, 15, 16, 0.8); } #scroll-to-top { right: 25px; bottom: 0; padding: 2px 11px 3px 10px; transition: 0.2s; } .scroll-to i { color: rgba(255, 255, 255, 0.8); transition: 0.2s; } .scroll-to:hover i { color: rgba(255, 255, 255, 1); transition: 0.3s; } @media (min-width: 769px) { #scroll-to-top { bottom: 25px; padding: 9px 11px 11px 10px; } .scroll-to i { font-size: 2em; } } @media (max-width: 768px) { #scroll-to-top:hover { padding: 9px 11px 11px 10px; transition: 0.3s; } } /* -- Cookie Bar -- */ /* ------------------- */ .cookiebar-container { z-index: 100; left: 0; right: 0; top: 0; padding: 7px 20px; background-color: #F2F2F2; border-bottom: 1px solid #E2E2E2; font-size: 0.9em; text-align: center; } .cookiebar-container.fixed { position: fixed; } .cookiebar-content { text-align: justify; } @media (min-width: 769px) { .cookiebar-content { display: inline-block; max-width: calc(100% - 250px); vertical-align: middle; } .cookiebar-actions { display: inline-block; width: 250px; } } @media (max-width: 768px) { .cookiebar-content { margin-bottom: 5px; } .cookiebar-actions { margin: 15px 0 5px 0; } } .cookiebar-button { margin: 0 5px 0 5px; border-radius: 4px; color: #FEFEFE; } @media (max-width: 768px) { .cookiebar-button { margin: 0 10px 0 10px; } } .cookiebar-button-understand { background-color: #337AB7; border-color: #2E6DA4; } .cookiebar-button-understand:hover { background-color: #2E6DA4; } .cookiebar-button-allowed { background-color: #5CB85C; border-color: #4CAE4C; } .cookiebar-button-allowed:hover { background-color: #4CAE4C; } .cookiebar-button-declined { background-color: #E84E40; border-color: #CE271A; } .cookiebar-button-declined:hover { background-color: #CE271A; } @media (max-width: 468px) { .cookiebar-more { display: block; margin: 10px 0 5px 0; } } .aboutcookie-title { font-size: 1.3em; line-height: 1.3em; font-weight: bold } .aboutcookie-title + p { margin: 0px 0 20px 0px; } #cookiebar-change-choice { margin-top: 10px; text-align: center; } .cookiebar-change-choice-link { text-align: center; }
Testo modificato
Apri file
/* -------------------------------------- design.css Contient les conteneurs de mise en page. Le design.css permet de mettre en forme votre site web avec le design de votre choix -------------------------------------- */ /* -- Elements HTML generiques specifique au theme -- */ /* -------------------------------------------------- */ html { font-size: 100%; font-size: 10px; } body { position: relative; height: auto; min-height: 100%; font-size: 1.456em; font-family: 'Open Sans', sans-serif; font-weight: 300; line-height: 1.6; } @media (min-width: 769px) { body { font-size: 1.618em; } } /* -- Gestion de la taille du site -- */ /* ---------------------------------- */ #header, #global, #footer { width: 100%; padding: 0.809em; } @media (min-width: 769px) { #header { padding: 1.618em 0; } #top-header, #sub-header, #global, #footer { margin: auto; padding: 1.618em 0; } #top-header, #sub-header, #global, #footer { width: 768px; } } @media (min-width: 1025px) { #top-header, #sub-header, #global, #footer { width: 1024px; } } @media (min-width: 1367px) { #top-header, #sub-header, #global, #footer { width: 1280px; } } /* -- En-tete de page - Header -- */ /* ------------------------------ */ #header { position: relative; } /* --- Partie inferieur du header --- */ #site-logo { width: 60px; height: 60px; background-image: url(images/logo.png); background-position: center; background-repeat: no-repeat; background-size: cover; } #site-name-container { margin: 0.2em 0 0 0.809em; } #site-name { font-size: 1.618em; display: block; font-weight: 400; text-decoration: none; } #site-slogan { display: block; padding: 0.3236em 0 0 0.1618em; font-size: 0.8em; letter-spacing: 0.1em; } @media (min-width: 769px) { #site-logo { width: 90px; height: 90px; } #site-name-container { margin: 0 0 0 1.618em; } #site-name { font-size: 3.236em; line-height: 1.2em; } #site-slogan { font-size: 1em; padding: 0.1em 0 0 0.1618em; } } /* -- Conteneur global du site -- */ /* ------------------------------ */ #main { width: 100%; } #menu-left, #menu-right { width: 100%; } @media (min-width: 769px) { #menu-left { margin-right: 1.618em; } #menu-right { margin-left: 1.618em; } #menu-left, #menu-right { width: calc(100% / 13 * 3.5); } #menu-left.narrow-menu-left { margin-right: 0.809em; } #menu-right.narrow-menu-right { margin-left: 0.809em; } #menu-left.narrow-menu-left, #menu-right.narrow-menu-right { width: calc(100% / 13 * 2.5); } #main { padding: 0 0 1.618em; } #main.main-with-left, #main.main-with-right { width: calc(100% - ((100% / 13 * 5))); } #main.main-with-left.main-with-right { width: calc(100% - ((100% / 13 * 8))); } } #top-footer { padding: 0.809em; } .block-container { margin-top: 1em; } /* --- Emplacement au dessus et en dessous du contenu de la page --- */ #top-content { margin: 0 0 1.618em 0; } /* --- Emplacement au dessus du pied de page --- */ #bottom-content { margin: 1.618em 0 0; } /* -- Pied de page - Footer -- */ /* --------------------------- */ #footer { clear: both; border-width: 4px 0 0 0; border-style: solid; border-color: transparent; } .footer-content { margin: 0 auto 0 auto; padding: 0.809em; } .footer-infos { margin: auto; padding: 0.809em; min-height: 40px; border-width: 1px 0 0 0; border-style: solid; border-color: transparent; text-align: center; } .footer-infos span { font-size: 0.8em; display: block; } .footer-infos span.footer-infos-separator { display: none; } @media (min-width: 769px) { .footer-infos span, .footer-infos span.footer-infos-separator { display: inline-block; } .footer-infos { padding: 0.618em 0 0; } } /* -- Elements specifiques PHPboost -- */ /* ----------------------------------- */ /* --- Compteur de visites --- */ #visit-counter { position: absolute; right: 1.618em; top : 92.5%; font-size: 0.9em; text-align: right; } /* --- Barre de lien rapide --- */ #breadcrumb { padding: 0.618em; font-size: 0.809em; } #breadcrumb ol { margin: 0; list-style: none; } #breadcrumb li { display: inline; } #breadcrumb li:not(.current):after { content: '/'; } /* --- Scroll to Top --- */ .scroll-to { position: fixed; z-index: 10; display: none; cursor: pointer; } #scroll-to-top { right: 0; bottom: 0.618em; padding: 0.618em 0.809em; } #scroll-to-top, .scroll-to i { transition: 0.2s; } #scroll-to-top:hover, .scroll-to:hover i { transition: 0.3s; } @media (min-width: 769px) { #scroll-to-top { right: 0.618em; } .scroll-to i { font-size: 1.618em; } } /* --- Cookie Bar --- */ .cookiebar-container { z-index: 100; left: 0; right: 0; top: 0; padding: 0.456em 1.309em; font-size: 0.809em; text-align: center; } @media (max-width: 768px) { .cookiebar-container { position: fixed; top: auto; bottom: 0; padding: 1.309em 1.309em 0.456em 1.309em; margin: 1em 0.456em; border-style: solid; border-width: 1px; font-size: 1em; } } .cookiebar-container.fixed { position: fixed; } .cookiebar-content { text-align: justify; } @media (min-width: 769px) { .cookiebar-content { display: inline-block; max-width: calc(100% - 400px); vertical-align: top; } .cookiebar-actions { display: inline-block; width: 400px; } } @media (max-width: 768px) { .cookiebar-content { margin-bottom: 0.309em; } .cookiebar-actions { margin: 1em 0 0.309em 0; } } .cookiebar-button { margin: 0 0.309em; } @media (max-width: 768px) { .cookiebar-button { margin: 0 0.618em; } } @media (max-width: 468px) { .cookiebar-more { display: block; margin: 0.618em 0 0.309em 0; } } .aboutcookie-title { font-size: 1.3em; line-height: 1.3em; font-weight: bold } .aboutcookie-title + p { margin: 0 0 1.309 0; } #cookiebar-change-choice { margin-top: 0.618em; text-align: center; } .cookiebar-change-choice-link { text-align: center; } /* --- Search engines --- */ .robot { font-size: 0.9em; font-weight: bold; }
Trovare la differenza