Stylepage

Here are the stylepageN.css files corresponding to the subpages of the demo database with the display of the skin6-guppy-03 for GuppY 6.

The GuppY 6 demo database offers you a configuration with a main page: the home page and five subpages: subpage 1 for the blog, subpage 2 for news and photos, subpage 3 for articles, Faq and downloads, subpage 4 for the forum, links and guestbook, subpage 5 for the agenda, newsletter and contact.

The only objective is to make the display as light and as fast as possible in the "Mobile-First" perspective.
 

Subpage: 1 - blog

/*  ---------  CSS to customize skin6-guppy-03 for secondary page blog  ----------- */

.T1entrow0 { padding: 10px 0;background-color: #0F056B;}
.T1entrow3 { padding: 10px 25px;}
.T1entrow4 { display: none; }
.T1entrow6 { display: none; }
.B1entrow1 { padding: 20px 40px !important; }
@media screen and (min-width: 768px) and (max-width: 1080px) {
.B1entrow2 .col-md-3 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 100%; }
}

The only difference is the configuration, T0 and B0 are replaced by T1 and B1 for subpage 1.
 

Subpage: 2 - news_photos

/*  ---------  CSS to customize skin6-guppy-03 for secondary page news_photos  ----------- */

.T2entrow0 { padding: 10px 0;background-color: #0F056B;}
.T2entrow3 { padding: 10px 25px;}
.T2entrow4 { display: none; }
.B2entrow1 { padding: 20px 40px !important; }
@media screen and (min-width: 768px) and (max-width: 1080px) {
.B2entrow2 .col-md-3 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 100%; }
}

As for the previous one, the change is T2 and B2 for subpage 2.
 

Subpage : 3 - articles_faq_telech
 

/*  ---------  CSS to customize skin6-guppy-03 for secondary page articles_faq_telech  ----------- */

.T3entrow0 { padding: 10px 0;background-color: #0F056B;}
.T3entrow3 { padding: 10ox 25px;}
.T3entrow4 { display: none; }
.T3entrow6 { display: none; }
.B3entrow1 { padding: 20px 40px !important; }
@media screen and (min-width: 768px) and (max-width: 1080px) {
.B3entrow2 .col-md-3 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 100%; }
}

Same change, T3 and B3 for subpage 3.
 

Subpage : 4 - forum_liens_lo
 

/*  ---------  CSS to customize skin6-guppy-03 for secondary page forum_liens_lo  ----------- */

.T4entrow0 { padding: 10px 0;background-color: #0F056B;}
.T4entrow3 { padding: 10ox 25px;}
.T4entrow4 { display: none; }
.T4entrow6 { display: none; }
div.rep.text-left.mx-1.thbodycontentW { border: 1px dotted #A39167; }
div.col-md-3.rep.text-center { border: 1px dotted #A39167; }
.B4entrow1 { padding: 20px 40px !important; }
@media screen and (min-width: 768px) and (max-width: 1080px) {
.B4entrow2 .col-md-3 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 100%; }
}

As the previous pages, modifications with T4 and B4 for the subpage 4, and an addition of two divs to put a border to the posts on the forum.
It is possible to add customizations on a single subpage, as it is possible to make a different box configuration per subpage.

Warning: if you add a large number of customizations, subpages, in case of change, the work to be done will be proportional to the number !!!

Subpage : 5 - agenda_info_contact
 

/*  ---------  CSS to customize skin6-guppy-03 for secondary page agenda_info_contact  ----------- */

.T5entrow0 { padding: 10px 0;background-color: #0F056B;}
.T5entrow3 { padding: 10ox 25px;}
.T5entrow4 { display: none; }
.T5entrow6 { display: none; }
.B5entrow1 { padding: 20px 40px !important; }
@media screen and (min-width: 768px) and (max-width: 1080px) {
.B5entrow2 .col-md-3 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 100%; }
}

For the last subpage, same principle T5 and B5 for subpage 5.

We've finished reviewing the styles of the subpages, now it's up to you to adapt them to your site.