Le fichier custom.css

Styles des articles

Bloc titre

.article-header {
margin: 70px 0 40px;
}
.article-details .article-header h1 {
font-size: 100px;
font-weight: normal;
line-height: 1em;
color: #000;
text-indent: -9vw;
margin-left: 9vw;
}

Bloc auteur & intro

.art-intro {
margin: 50px 50px 100px;
}
.author {
text-align: center;
margin: 0;
align-self: center;
display: flex;
flex-flow: column;
}
.blog-avatar img {
display: block;
margin: 0 auto;
border-radius: 100%;
max-width: 96px;
border: 1px solid #969696;
padding: 1px;
}
.blog-author {
font-size: 16px;
text-transform: uppercase;
color: #828282;
letter-spacing: 3px;
margin: 12px 0 0 0;
display: inline-block;
font-family: raleway;
}
.link-author a {
letter-spacing: 1px;
text-transform: uppercase;
font-size: 10px;
font-weight: 700;
}
.link-author a::before {
display: block;
cont: ;
content: "";
margin: 16px auto;
border-top: 4px solid silver;
max-width: 30px;
}
.chapo {
font-size: 26px;
line-height: 1.3em;
font-style: italic;
color: #7e7e7e;
align-self: center;
padding: 30px 0;
}
.chapo p {
margin: 0;
}

Image et legende 1 & 2

.art-image {
position: relative;
margin: 50px 0 230px;
}
.art-image img {
max-width: 80%;
}
.legend {
position: absolute;
max-width: 55%;
bottom: -150px;
margin: 0px 0 0 40%;
padding: 60px;
color: #ffffff;
font-style: italic;
line-height: 1.8em;
}

Paragraphes de texte

.paragraph {
margin: 0 0 0 25%;
text-align: justify;
}

Plugin TWEET ME

span.tweetme[class*="t1_"]:not([class*="trans"]) {
box-shadow: 1px 1px 1px 2px rgba(0,0,0,0);
-webkit-box-shadow: 1px 1px 1px 2px rgba(0,0,0,0);
}
span.tweetme.sbBox {
margin-left: 80px;
}
span.tweetme[class*="t1_"] .sbText {
padding: 30px 35px;
font-size: 26px;
font-style: italic;
}

Call To Action - lien bouton

.art-cta {
text-align: center;
margin-top: 90px;
}
.art-cta a {
background-color: #000;
color: #fff;
padding: 20px 50px;
display: inline-block;
box-shadow: 10px 10px 0 #919191;
transition: all ease 0.6s;
text-transform: uppercase;
font-size: 0.8em;
letter-spacing: 3px;
}
.art-cta a:hover {
box-shadow: 20px 20px 1px #D1D1D1;
transform: translate(-10px,-10px);
}

Galerie d'images

.galtitle {
border-top: 1px solid #000000;
margin: 150px 0 0px 0;
padding: 30px 0 0 0;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 2px;
}
.galimg {
margin: 100px 0;
border-bottom: 1px solid #000000;
}
.galimg img {
margin: 50px 0;
}

Styles du template Shaper Helix Ultimate

Bloc logo menu

#sp-header {
box-shadow: 0 0 0 0 transparent;
margin: 0 0 50px 0;
}
#sp-header .logo a {
line-height: 1;
margin: 0;
padding: 0;
letter-spacing: 4px;
color: #000;
text-transform: uppercase;
font-size: 15px;
font-weight: 900;
}
.sp-megamenu-parent > li > a, .sp-megamenu-parent > li.active > a {
text-transform: uppercase;
letter-spacing: 4px;
font-weight: 700;
}
nav img {
display: inline-block;
margin: 0 0 3px 0;
padding: 0;
}

Body

#sp-main-body {
padding: 0;
min-height: calc(100VH - 202px);
}

Largeur des articles non categorisés

.article-details:not(.jday){
max-width: 80%;
margin-left: 10%;
}

Styles page blog

.article-list .article {
border: none;
border-radius: 0;
}
.article-list .article .article-intro-image, .article-list .article .article-featured-video, .article-list .article .article-featured-audio, .article-list .article .article-feature-gallery {
border-bottom: none;
}
.article-list .article .article-intro-image img, .article-list .article .article-featured-video img, .article-list .article .article-featured-audio img, .article-list .article .article-feature-gallery img {
border-radius: 0;
padding: 0 20px;
}

Styles des articles tuto

.h2, h2 {
font-size: 2rem;
margin: 4rem 0 2rem;
}
.h3, h3 {
font-size: 1rem;
text-transform: uppercase;
margin: 3rem 0 1rem;
font-weight: 700;
border-bottom: 1px solid #f0eded;
max-width: 50%;
padding: 0 0 0.3rem 0;
}
pre {
display: block;
background: #f0eded;
padding: 20px;
border-radius: 4px;
margin: 20px 0;