@media screen and (max-width: 414px) { // typographie header{ a{ font-size: $txt-figli-m; line-height: $Flhome-m; } } .home{ p{ font-size: $txt-figli-m!important; line-height: $Flhome-m!important; } } .other_projets{ h3{ font-size: $txt-figli-m; } } // mep header{ width: calc( #{$Wi-m} - (#{$marg} * 2) ); } body{ #start{ width: calc( #{$Wi-m} - (#{$marg} * 2) ); } &:not(.home){ #start{ margin-top: $Flhome; } } .sidebar-right{ display: none; } } #item_list{ .card{ width: calc( #{$Wi-m} ); &:nth-child(odd){ margin-right: 0; } .card-header{ margin-bottom: $marg; & > * { margin-right: $marg; } } } } .other_projets{ margin-top: $margI; .card{ width: $Wi-m; &:nth-child(-1n+3){ margin-right: 0; } } } } @media screen and (max-width: 768px) and (orientation: portrait) { // typographie header{ a{ font-size: 2.5rem; line-height: 3rem; } } .home{ p{ font-size: $txt-figli-t!important; line-height: $Flhome-t!important; } } .other_projets{ h3{ font-size: $txt-figli-t; } } body{ &:not(.home){ #start{ margin-top: 5rem; } } } #item_list{ .card{ width: calc( #{$Wi-m} ); &:nth-child(odd){ margin-right: 0; } .card-header{ margin-bottom: $marg; & > * { margin-right: $marg; } } } } } @media screen and (max-width: 812px) and (orientation: landscape) { // typographie header{ a{ font-size: $txt-figli-m; line-height: $Flhome-m; } } .home{ p{ font-size: $txt-figli-m!important; line-height: $Flhome-m!important; } } .other_projets{ h3{ font-size: $txt-figli-m; } } // mep header{ width: calc( #{$Wi-m} - (#{$marg} * 2) ); } body{ #start{ width: calc( #{$Wi-m} - (#{$marg} * 2) ); } &:not(.home){ #start{ margin-top: $Flhome; } } .sidebar-right{ display: none; } } #item_list{ .card{ width: $Wi50; &:nth-child(odd){ margin-right: $margI; } } } .other_projets{ .card{ width: $Wi33; &:nth-child(-1n+3){ margin-right: $marg; } } } } @media screen and (max-width: 910px) and (orientation: portrait) { header{ a{ font-size: 2.5rem; line-height: 3rem; } } .home{ p{ font-size: $txt-figli-t!important; line-height: $Flhome-t!important; } } .other_projets{ h3{ font-size: $txt-figli-t; } } body{ &:not(.home){ #start{ margin-top: 5rem; } } } } @media screen and (max-width: 660px) { header{ a{ font-size: $txt-figli-m; line-height: $Flhome-m; } } .home{ p{ font-size: $txt-figli-m!important; line-height: $Flhome-m!important; } } .other_projets{ h3{ font-size: $txt-figli-m; } } body{ &:not(.home){ #start{ margin-top: $Flhome; } } } }