php js css php js css

Changes

Changes to Design: AF Design

217374
Yesterday 11:56pm
Guevarra, Kim
Modified design
217375
Yesterday 11:56pm
Guevarra, Kim
Modified design
Html:
Id:
13
13
Deleted Datetime:

															

														
Type:
web
web
Title:
AF Design
AF Design
Css:
.formRow
{
background: none !important;
}

#search_popup_form button[type="submit"] {
position: absolute;
right: 0;
top: 50%;
transform: perspective(1px) translateY(-50%);
background: #d90f31;
border-radius: 0;
color: #ffffff;
padding: 8px;
margin: 0;
font-size: small;
}

#search_popup_form .formRow {
padding: 20px 0;
}

.s8-navigationPrimary li ul li.s8-navigationPrimary-hasChildren>a::after, .s8-navigationPrimary-vertical li.s8-navigationPrimary-hasChildren>a::after, .s8-navigationPrimary-mobileOpen li.s8-navigationPrimary-hasChildren>a::after
{
content: "";
}

.s8-navigationPrimary li.s8-navigationPrimary-hasChildren > a::after
{
border: solid #d90f31;
border-width: 0 1.5px 1.5px 0;
display: inline-block;
padding: 3px;
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
content: "";
margin-top: -7px;
margin-left: 10px;
transition: all .5s;
}

.s8-navigationPrimary > li.s8-navigationPrimary-hasChildren:hover > a::after
{
border-color: #d90f31;
margin-top: 0px;
transform: rotate(225deg);
-webkit-transform: rotate(225deg);
}

.s8-navigationPrimary ul li:hover a,
.s8-navigationPrimary ul li.s8-navigationPrimaryItem--active a
{
transform: translateX(10px);
}

.s8-navigationPrimary li ul li a
{
font-size: 13px;
transition: .2s ease;
position: relative;
text-transform: uppercase;
}

.s8-navigationPrimary li ul li a::after
{
content: "";
position: absolute;
width: 10px;
height: 2px;
background-color: #cf102d;
left: -5px;
top: 48%;
opacity: 0;
transition: .2s;
}

.s8-navigationPrimary li ul li a:hover::after,
.s8-navigationPrimary ul li.s8-navigationPrimaryItem--active a::after
{
opacity: 1;
}

.headingLine {
position: relative;
z-index: 2;
}

.headingLine::after {
content: "";
position: absolute;
top: 20px;
left: 0;
width: 105px;
height: 25px;
z-index: -1;
-ms-transform: rotate(20deg);
-webkit-transform: rotate(20deg);
transform: rotate(-21deg);
background-color: #d90f31;
opacity: 0.5;
}

@media(min-width: 768px) {
.s8-templates-row-container:not(.s8-templates-row-container .s8-templates-row-container) {
gap: 3rem;
}
}

.oncord-dataTable {
overflow-x: auto;
}

#packages_table {
width: 100%;
border-collapse: collapse;
}

#packages_table td {
padding: 10px;
}

.post-list-card.s8-templates-card .post-list-card__date {
display:none;
}

.s8-templates-card__cardsize-4 {
width: 365.33px!important;
}

.s8-templates-card[style*="box-shadow"] {
box-shadow: 0px 4px 20px rgb(0 0 0 / 6%) !important;
transition: .2s ease;
}

.s8-templates-card[style*="box-shadow"]:hover {
box-shadow: 0px 4px 20px rgb(0 0 0 / 10%) !important;
transform: translateY(-5px);
}

.s8-templates-card .post-list-custom__accent {
background-color: #d90f31 !important;
}

/* faqs */
h4.s8-faq__heading {
font-size: 1.2rem;
line-height: 1.8rem;
width: 98%;
}

.s8-faq__labelContainer {
background-color: transparent !important;
}

.s8-faq__heading {
margin-top: 0;
}

.s8-faq__labelContainer {
background-color: transparent !important;
border-radius: 0;
border-bottom: 1px solid rgb(51 51 51 / 14%);
padding-bottom: 20px;
}

.s8-faq__text {
margin-bottom: 0px;
}

/* Login popup styles */
#login_popup{
padding: 0;
border: 0;
border-radius: 0;
}

#login_popup .s8-templates-card img {
width: 50px !important;
}
#login_popup .s8-templates-card {
width: 150px;
text-align: center;
}
#login_popup .s8-templates-card p {
font-size:small;
}

#login_popup input[type=text], #login_popup input[type=password]{
background: #edf4f3;
border: none;
border-radius: 0;
}

#login_popup .formRowLabel{
display: none;

}

@media screen and (max-width:768px){
#login_popup{
width: 80% !important;
}
}

/* Prevent gallery from cropping the logo images */
.logos img {
width: auto;
height: auto;
object-fit: unset;
top: 50%;
left: 50%;
}

/*animated accent for cards*/
.s8-templates-card .post-list-custom__accent {
margin: 20px 20px 20px 0px;
width: 40px;
height: 3px;
background-color: currentColor;
border: none;
-webkit-transition: width 0.3s ease-out;
transition: width 0.3s ease-out;
}
.s8-templates-card:hover .post-list-custom__accent {
width: 80px;
}

/*header styles*/
.s8-templatesHeader-slim .s8-templatesHeader-navigation-container {
order: 2;
}
.s8-templatesHeader-slim .s8-templatesHeader-featuredContainer {
order: 4;
}
.s8-navigationPrimary ul {
background: #ffffff;
border-top: 0px solid #333;
}
.s8-navigationPrimary ul li a {
color: #242424 !important;
}
.s8-templatesHeader-logo-image {
margin-left: 1rem;
}
#headerNav li > a:hover {
color:#dc1836;
}

.s8-navigationPrimary li ul li a:hover{
color: #dc1836 !important;
}

/*form styles*/
.formRow {
padding: 0px 10px 10px 0px;
}
label {
font-weight: 400;
}

/*button styles*/
button[type="submit"] {
background: #d90f31;
color: #fff;
border: 0px solid #fff;
border-radius: 0px;
transition: all 0.2s ease-out;
}
button[type="submit"]:hover {
background: #d90f31;
color: #fff;
border: 0px solid #fff;
border-radius: 0px;
transition: all 0.2s ease-out;
}

/*footer styles*/
footer a {
color:#333;
}

.footer-flexContainer div
{
display: flex;
justify-content: flex-start;
align-items: center;
gap: .5rem
}

.footer-flexContainer p
{
margin: 0;
}

.vague {
border: 0px solid transparent;
height: 16px;
background : url('/media/website_designs/29/img/hr.png') 50% 0 no-repeat;
}

big {
font-family: inherit;
font-size: 28px;
line-height:32px;
}
.vcenter {
display: inline-block;
vertical-align: middle;
float: none;
}
.icon-post70{
width:70%;
margin:auto;
}

.icon-post-wlf{
width:60%;
margin:auto;
}
.icon-post{
margin: 0 auto;
}
.tag {
font-weight:700;
font-size:21px;
font-style: italic;
margin-bottom:20px;
line-height:23px;
display: block;
float: left;
width: auto;
border: 2px solid #cee8e3;
border-left:0;
border-right:0;
padding: 10px 30px 10px 0;
background: url('/media/website_designs/29/img/tag-right.png') no-repeat top right;
background-size: auto 100%;
}
.boxed {
box-shadow: 0px 0px 15px #ececec;
padding-bottom:40px;
overflow:auto;
}

.boxed:hover{
box-shadow: 0px 0px 15px #b5b5b5;
}
.boxed p, .boxed h3, .boxed .btn-red {
margin:20px;
}
.boxed .btn-red {
margin-bottom:50px;
}
.blue-bg {
background-color: #425893;
color:#FFFCD9;
}

.blue-bg hr {
border: 1px solid #4e9ca5;
}

.animButton {
width:auto;
padding:20px;
padding-left:100px;
border: 1px solid #FFFCD9;
font-size:45px;
text-transform:uppercase;
font-family:'loveloblack';
color:#FFFCD9;
overflow: hidden;
position: relative;
}
.animButton:hover {
color:#425893;
background-color: #FFFCD9;

}
.animButton img{
width:62px;
margin-right:10px;
position:absolute;
bottom:0px;
left:18px;
}

.animButton2 {
width:auto;
padding:20px;
padding-left:100px;
border: 2px solid #425893;
font-size:45px;
text-transform:uppercase;
font-family:'loveloblack';
color:#425893;
overflow: hidden;
position: relative;
}
.animButton2:hover {
color:#FFFCD9;
background-color: #425893;

}
.animButton2 img{
width:62px;
margin-right:10px;
position:absolute;
bottom:0px;
left:18px;
}

.levelImg {
bottom:23%!important;
}

dialogboxclose {
right: 7px;
}

.centered {
margin-left:auto;
margin-right:auto;
}

.s8-templates-card.s8-templates-fancybox.s8-templates-fancybox-accent .s8-templates-fancybox-image {
height: 250px !important;
padding: 0;
margin: 0;
}

.s8-templates-card.s8-templates-fancybox.s8-templates-fancybox-accent .s8-templates-fancybox-accent-hr {
margin: 30px 20px 30px 33px;
}

@media screen and (max-width:400px) {
.logoContainer{
width:160px;
}
.MobileMenuTopRight{
width: 32px;
margin-left: 10px;
}
}

@media screen and (max-width:991px){
button[type=submit], .btn-red {
padding: 5px 13px;
font-size: 18px;
}
}
@media screen and (max-width:399px){
.imagePostheight {
height: 85px;
}
.boxed p, .boxed h3, .boxed .btn-red {
margin:10px;
}
.btn-red {
padding: 3px 6px;
}
}

@media screen and (max-width:767px){
#bannerMovePrevious, #bannerMoveNext, #TopbannerMovePrevious, #TopbannerMoveNext{
opacity:0.7;
bottom: 32%;
}
big {
font-size: 17px;
line-height: 19px;
}
#newsletter_popup, #login_popup, #search_popup {
width:80%!important;
}
.margin-bottom {
margin-bottom:10px;
}
.animButton {
font-size:23px;
padding-left:75px;
}
.animButton img {
width:50px;
}
.h1smaller {
font-size:18px!important;
}
.ui-dialog {
width:90% !important;
}
#slideshow .container{
margin-left:0px;
margin-right:0px;
}
#slideshow .img-rounded{
border-radius:0;
}
.container-fluid {
padding-right: 0px;
padding-left: 0px;
}

.banner .bannerText{
top:40%;
max-width:200px;
}
#bannerMovePrevious, #TopbannerMovePrevious{
left:10px;
}

#bannerMoveNext, #TopbannerMoveNext{
right:10px;
}
.banner .bannerText {
left: 55px;
}
.banner .bannerText{
padding: 10px;
}

.img-slide{
/*min-width: 100vh;
min-height:350px;
margin-left:auto;
margin-right:auto; */
}
}

.bluetext {
color:#425893;
}

.s8-navigationPrimary-horizontal
{
flex-flow: row wrap;
}

@media screen and (max-width:470px){
.newsletter{
/*visibility: hidden;*/
}
}
@media screen and (max-width:700px){
.s8-templatesHeader-slim .s8-templatesHeader-logo {
flex: 0 1 20%;
display: flex;
flex-flow: row nowrap;
justify-content: center;
align-items: center;
padding: 10px 0 0 0;
order: 2;
}
.s8-templatesHeader-slim .s8-templatesHeader-navigation-container {
order: 1;
padding: 0;
}
.s8-templatesHeader-slim .s8-templatesHeader-featuredContainer {
order: 3;
}
}

@media screen and (max-width:1500px){
.s8-templatesHeader-slim .s8-templatesHeader-logo {
flex: initial;
display: flex;
flex-flow: row nowrap;
justify-content: center;
align-items: center;
padding: 15px;
order: 2;
}
.s8-templatesHeader-slim .s8-templatesHeader-navigation-container {
order: 1;
padding: 0;
flex: initial;
width: auto;
}
}

@media (max-width: 1000px){
.s8-templatesHeader-slim .s8-templatesHeader-featuredContainer {
flex: initial;
order: 2;
justify-content: center;
}

}

@media (max-width: 700px){
.s8-templatesHeader-slim .s8-templatesHeader-logo {
flex: 1 1 1%;
padding: 10px;
}

.s8-templatesHeader-slim .s8-templatesHeader-navigation-container {
flex: 1 1 1%;
}
.s8-templatesHeader-slim .s8-templatesHeader-featuredContainer {
flex: 1 1 1%;
order: 2;
justify-content: center;
align-items: flex-end;
padding: 0;
}
.s8-navigationPrimary--displayStateMobile.s8-navigationPrimaryMobile a{
justify-content: flex-start !important;
display: flex !important;
padding-left: 10px;
}
.s8-navigationPrimary--displayStateMobile.s8-navigationPrimaryMobile li{
width: auto;
}
.s8-navigationPrimaryMobile{
align-items: flex-start;
}

.s8-templates-row + .s8-templates-row
{
margin-top: 0 !important;
}
}

@media (max-width: 600px){
.s8-templatesHeader-slim .s8-templatesHeader-logo{
padding: 10px 0;
}
.login .s8-standard-icon{
display: block;
margin: auto;
}
.login a span{
font-size: 8px !important;
}
.s8-navigationPrimary--displayStateMobile.s8-navigationPrimaryMobile a{
font-size: 11px !important;
}
}

@media screen and (max-width:350px){
.s8-navigationPrimary--displayStateMobile.s8-navigationPrimaryMobile li{
width: 155px;
}

.s8-navigationPrimary--displayStateMobile.s8-navigationPrimaryMobile a{
justify-content: center!important;
}

.s8-templatesHeader-slim .s8-templatesHeader-featuredContainer{
align-items: center;
}

.s8-templatesHeader-slim .s8-templatesHeader-logo {
flex: 0 1 100%;
display: flex;
flex-flow: row nowrap;
justify-content: center;
align-items: center;
padding: 10px 0 0 0;
order: 1;
}
.s8-templatesHeader-slim .s8-templatesHeader-navigation-container {
order: 2;
padding: 0;
}
.s8-templatesHeader-slim .s8-templatesHeader-featuredContainer {
order: 3;
padding: 0;
}
}

/*Mobile-Navigation*/
@media screen and (max-width:1400px){
#headerNav{
justify-content: start;
}
}

table p
{
margin: 5px 0 !important;
}
.formRow
{
background: none !important;
}

#search_popup_form button[type="submit"] {
position: absolute;
right: 0;
top: 50%;
transform: perspective(1px) translateY(-50%);
background: #d90f31;
border-radius: 0;
color: #ffffff;
padding: 8px;
margin: 0;
font-size: small;
}

#search_popup_form .formRow {
padding: 20px 0;
}

.s8-navigationPrimary li ul li.s8-navigationPrimary-hasChildren>a::after, .s8-navigationPrimary-vertical li.s8-navigationPrimary-hasChildren>a::after, .s8-navigationPrimary-mobileOpen li.s8-navigationPrimary-hasChildren>a::after
{
content: "";
}

.s8-navigationPrimary li.s8-navigationPrimary-hasChildren > a::after
{
border: solid #d90f31;
border-width: 0 1.5px 1.5px 0;
display: inline-block;
padding: 3px;
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
content: "";
margin-top: -7px;
margin-left: 10px;
transition: all .5s;
}

.s8-navigationPrimary > li.s8-navigationPrimary-hasChildren:hover > a::after
{
border-color: #d90f31;
margin-top: 0px;
transform: rotate(225deg);
-webkit-transform: rotate(225deg);
}

.s8-navigationPrimary ul li:hover a,
.s8-navigationPrimary ul li.s8-navigationPrimaryItem--active a
{
transform: translateX(10px);
}

.s8-navigationPrimary li ul li a
{
font-size: 13px;
transition: .2s ease;
position: relative;
text-transform: uppercase;
}

.s8-navigationPrimary li ul li a::after
{
content: "";
position: absolute;
width: 10px;
height: 2px;
background-color: #cf102d;
left: -5px;
top: 48%;
opacity: 0;
transition: .2s;
}

.s8-navigationPrimary li ul li a:hover::after,
.s8-navigationPrimary ul li.s8-navigationPrimaryItem--active a::after
{
opacity: 1;
}

.headingLine {
position: relative;
z-index: 2;
}

.headingLine::after {
content: "";
position: absolute;
top: 20px;
left: 0;
width: 105px;
height: 25px;
z-index: -1;
-ms-transform: rotate(20deg);
-webkit-transform: rotate(20deg);
transform: rotate(-21deg);
background-color: #d90f31;
opacity: 0.5;
}

@media(min-width: 768px) {
.s8-templates-row-container:not(.s8-templates-row-container .s8-templates-row-container) {
gap: 3rem;
}
}

.oncord-dataTable {
overflow-x: auto;
}

#packages_table {
width: 100%;
border-collapse: collapse;
}

#packages_table td {
padding: 10px;
}

.post-list-card.s8-templates-card .post-list-card__date {
display:none;
}

.s8-templates-card__cardsize-4 {
width: 365.33px!important;
}

.s8-templates-card[style*="box-shadow"] {
box-shadow: 0px 4px 20px rgb(0 0 0 / 6%) !important;
transition: .2s ease;
}

.s8-templates-card[style*="box-shadow"]:hover {
box-shadow: 0px 4px 20px rgb(0 0 0 / 10%) !important;
transform: translateY(-5px);
}

.s8-templates-card .post-list-custom__accent {
background-color: #d90f31 !important;
}

/* faqs */
h4.s8-faq__heading {
font-size: 1.2rem;
line-height: 1.8rem;
width: 98%;
}

.s8-faq__labelContainer {
background-color: transparent !important;
}

.s8-faq__heading {
margin-top: 0;
}

.s8-faq__labelContainer {
background-color: transparent !important;
border-radius: 0;
border-bottom: 1px solid rgb(51 51 51 / 14%);
padding-bottom: 20px;
}

.s8-faq__text {
margin-bottom: 0px;
}

/* Login popup styles */
#login_popup{
padding: 0;
border: 0;
border-radius: 0;
}

#login_popup .s8-templates-card img {
width: 50px !important;
}
#login_popup .s8-templates-card {
width: 150px;
text-align: center;
}
#login_popup .s8-templates-card p {
font-size:small;
}

#login_popup input[type=text], #login_popup input[type=password]{
background: #edf4f3;
border: none;
border-radius: 0;
}

#login_popup .formRowLabel{
display: none;

}

@media screen and (max-width:768px){
#login_popup{
width: 80% !important;
}
}

/* Prevent gallery from cropping the logo images */
.logos img {
width: auto;
height: auto;
object-fit: unset;
top: 50%;
left: 50%;
}

/*animated accent for cards*/
.s8-templates-card .post-list-custom__accent {
margin: 20px 20px 20px 0px;
width: 40px;
height: 3px;
background-color: currentColor;
border: none;
-webkit-transition: width 0.3s ease-out;
transition: width 0.3s ease-out;
}
.s8-templates-card:hover .post-list-custom__accent {
width: 80px;
}

/*header styles*/
.s8-templatesHeader-slim .s8-templatesHeader-navigation-container {
order: 2;
}
.s8-templatesHeader-slim .s8-templatesHeader-featuredContainer {
order: 4;
}
.s8-navigationPrimary ul {
background: #ffffff;
border-top: 0px solid #333;
}
.s8-navigationPrimary ul li a {
color: #242424 !important;
}
.s8-templatesHeader-logo-image {
margin-left: 1rem;
}
#headerNav li > a:hover {
color:#dc1836;
}

.s8-navigationPrimary li ul li a:hover{
color: #dc1836 !important;
}

/*form styles*/
.formRow {
padding: 0px 10px 10px 0px;
}
label {
font-weight: 400;
}

/*button styles*/
button[type="submit"] {
background: #d90f31;
color: #fff;
border: 0px solid #fff;
border-radius: 0px;
transition: all 0.2s ease-out;
}
button[type="submit"]:hover {
background: #d90f31;
color: #fff;
border: 0px solid #fff;
border-radius: 0px;
transition: all 0.2s ease-out;
}

/*footer styles*/
footer a {
color:#333;
}

.footer-flexContainer div
{
display: flex;
justify-content: flex-start;
align-items: center;
gap: .5rem
}

.footer-flexContainer p
{
margin: 0;
}

.vague {
border: 0px solid transparent;
height: 16px;
background : url('/media/website_designs/29/img/hr.png') 50% 0 no-repeat;
}

big {
font-family: inherit;
font-size: 28px;
line-height:32px;
}
.vcenter {
display: inline-block;
vertical-align: middle;
float: none;
}
.icon-post70{
width:70%;
margin:auto;
}

.icon-post-wlf{
width:60%;
margin:auto;
}
.icon-post{
margin: 0 auto;
}
.tag {
font-weight:700;
font-size:21px;
font-style: italic;
margin-bottom:20px;
line-height:23px;
display: block;
float: left;
width: auto;
border: 2px solid #cee8e3;
border-left:0;
border-right:0;
padding: 10px 30px 10px 0;
background: url('/media/website_designs/29/img/tag-right.png') no-repeat top right;
background-size: auto 100%;
}
.boxed {
box-shadow: 0px 0px 15px #ececec;
padding-bottom:40px;
overflow:auto;
}

.boxed:hover{
box-shadow: 0px 0px 15px #b5b5b5;
}
.boxed p, .boxed h3, .boxed .btn-red {
margin:20px;
}
.boxed .btn-red {
margin-bottom:50px;
}
.blue-bg {
background-color: #425893;
color:#FFFCD9;
}

.blue-bg hr {
border: 1px solid #4e9ca5;
}

.animButton {
width:auto;
padding:20px;
padding-left:100px;
border: 1px solid #FFFCD9;
font-size:45px;
text-transform:uppercase;
font-family:'loveloblack';
color:#FFFCD9;
overflow: hidden;
position: relative;
}
.animButton:hover {
color:#425893;
background-color: #FFFCD9;

}
.animButton img{
width:62px;
margin-right:10px;
position:absolute;
bottom:0px;
left:18px;
}

.animButton2 {
width:auto;
padding:20px;
padding-left:100px;
border: 2px solid #425893;
font-size:45px;
text-transform:uppercase;
font-family:'loveloblack';
color:#425893;
overflow: hidden;
position: relative;
}
.animButton2:hover {
color:#FFFCD9;
background-color: #425893;

}
.animButton2 img{
width:62px;
margin-right:10px;
position:absolute;
bottom:0px;
left:18px;
}

.levelImg {
bottom:23%!important;
}

dialogboxclose {
right: 7px;
}

.centered {
margin-left:auto;
margin-right:auto;
}

.s8-templates-card.s8-templates-fancybox.s8-templates-fancybox-accent .s8-templates-fancybox-image {
height: 250px !important;
padding: 0;
margin: 0;
}

.s8-templates-card.s8-templates-fancybox.s8-templates-fancybox-accent .s8-templates-fancybox-accent-hr {
margin: 30px 20px 30px 33px;
}

@media screen and (max-width:400px) {
.logoContainer{
width:160px;
}
.MobileMenuTopRight{
width: 32px;
margin-left: 10px;
}
}

@media screen and (max-width:991px){
button[type=submit], .btn-red {
padding: 5px 13px;
font-size: 18px;
}
}
@media screen and (max-width:399px){
.imagePostheight {
height: 85px;
}
.boxed p, .boxed h3, .boxed .btn-red {
margin:10px;
}
.btn-red {
padding: 3px 6px;
}
}

@media screen and (max-width:767px){
#bannerMovePrevious, #bannerMoveNext, #TopbannerMovePrevious, #TopbannerMoveNext{
opacity:0.7;
bottom: 32%;
}
big {
font-size: 17px;
line-height: 19px;
}
#newsletter_popup, #login_popup, #search_popup {
width:80%!important;
}
.margin-bottom {
margin-bottom:10px;
}
.animButton {
font-size:23px;
padding-left:75px;
}
.animButton img {
width:50px;
}
.h1smaller {
font-size:18px!important;
}
.ui-dialog {
width:90% !important;
}
#slideshow .container{
margin-left:0px;
margin-right:0px;
}
#slideshow .img-rounded{
border-radius:0;
}
.container-fluid {
padding-right: 0px;
padding-left: 0px;
}

.banner .bannerText{
top:40%;
max-width:200px;
}
#bannerMovePrevious, #TopbannerMovePrevious{
left:10px;
}

#bannerMoveNext, #TopbannerMoveNext{
right:10px;
}
.banner .bannerText {
left: 55px;
}
.banner .bannerText{
padding: 10px;
}

.img-slide{
/*min-width: 100vh;
min-height:350px;
margin-left:auto;
margin-right:auto; */
}
}

.bluetext {
color:#425893;
}

.s8-navigationPrimary-horizontal
{
flex-flow: row wrap;
}

@media screen and (max-width:470px){
.newsletter{
/*visibility: hidden;*/
}
}
@media screen and (max-width:700px){
.s8-templatesHeader-slim .s8-templatesHeader-logo {
flex: 0 1 20%;
display: flex;
flex-flow: row nowrap;
justify-content: center;
align-items: center;
padding: 10px 0 0 0;
order: 2;
}
.s8-templatesHeader-slim .s8-templatesHeader-navigation-container {
order: 1;
padding: 0;
}
.s8-templatesHeader-slim .s8-templatesHeader-featuredContainer {
order: 3;
}
}

@media screen and (max-width:1500px){
.s8-templatesHeader-slim .s8-templatesHeader-logo {
flex: initial;
display: flex;
flex-flow: row nowrap;
justify-content: center;
align-items: center;
padding: 15px;
order: 2;
}
.s8-templatesHeader-slim .s8-templatesHeader-navigation-container {
order: 1;
padding: 0;
flex: initial;
width: auto;
}
}

@media (max-width: 1000px){
.s8-templatesHeader-slim .s8-templatesHeader-featuredContainer {
flex: initial;
order: 2;
justify-content: center;
}

}

@media (max-width: 700px){
.s8-templatesHeader-slim .s8-templatesHeader-logo {
flex: 1 1 1%;
padding: 10px;
}

.s8-templatesHeader-slim .s8-templatesHeader-navigation-container {
flex: 1 1 1%;
}
.s8-templatesHeader-slim .s8-templatesHeader-featuredContainer {
flex: 1 1 1%;
order: 2;
justify-content: center;
align-items: flex-end;
padding: 0;
}
.s8-navigationPrimary--displayStateMobile.s8-navigationPrimaryMobile a{
justify-content: flex-start !important;
display: flex !important;
padding-left: 10px;
}
.s8-navigationPrimary--displayStateMobile.s8-navigationPrimaryMobile li{
width: auto;
}
.s8-navigationPrimaryMobile{
align-items: flex-start;
}

.s8-templates-row + .s8-templates-row
{
margin-top: 0 !important;
}
}

@media (max-width: 600px){
.s8-templatesHeader-slim .s8-templatesHeader-logo{
padding: 10px 0;
}
.login .s8-standard-icon{
display: block;
margin: auto;
}
.login a span{
font-size: 8px !important;
}
.s8-navigationPrimary--displayStateMobile.s8-navigationPrimaryMobile a{
font-size: 11px !important;
}
}

@media screen and (max-width:350px){
.s8-navigationPrimary--displayStateMobile.s8-navigationPrimaryMobile li{
width: 155px;
}

.s8-navigationPrimary--displayStateMobile.s8-navigationPrimaryMobile a{
justify-content: center!important;
}

.s8-templatesHeader-slim .s8-templatesHeader-featuredContainer{
align-items: center;
}

.s8-templatesHeader-slim .s8-templatesHeader-logo {
flex: 0 1 100%;
display: flex;
flex-flow: row nowrap;
justify-content: center;
align-items: center;
padding: 10px 0 0 0;
order: 1;
}
.s8-templatesHeader-slim .s8-templatesHeader-navigation-container {
order: 2;
padding: 0;
}
.s8-templatesHeader-slim .s8-templatesHeader-featuredContainer {
order: 3;
padding: 0;
}
}

/*Mobile-Navigation*/
@media screen and (max-width:1400px){
#headerNav{
justify-content: start;
}
}

table p
{
margin: 5px 0 !important;
}
Js:
let observer = new MutationObserver(function () {
if ( document.querySelector('.sign-up')) {
const urlPath = document.querySelector('.sign-up a').getAttribute('href');
document.querySelector('.sign-up a').setAttribute('href', urlPath.replace('?login_popup_opened=1', ''))
}
});

// Start waiting for the element.
observer.observe(document, {
childList: true,
subtree: true
});

var activeChild = document.querySelector('.s8-navigationPrimary-hasChildren .s8-navigationPrimaryItem--active');

if (activeChild) {
var parentLi = activeChild.closest('.s8-navigationPrimary-hasChildren');
if (parentLi) {
parentLi.classList.add('s8-navigationPrimaryItem--active');
}
}
let observer = new MutationObserver(function () {
if ( document.querySelector('.sign-up')) {
const urlPath = document.querySelector('.sign-up a').getAttribute('href');
document.querySelector('.sign-up a').setAttribute('href', urlPath.replace('?login_popup_opened=1', ''))
}
});

// Start waiting for the element.
observer.observe(document, {
childList: true,
subtree: true
});

var activeChild = document.querySelector('.s8-navigationPrimary-hasChildren .s8-navigationPrimaryItem--active');

if (activeChild) {
var parentLi = activeChild.closest('.s8-navigationPrimary-hasChildren');
if (parentLi) {
parentLi.classList.add('s8-navigationPrimaryItem--active');
}
}
Php Source:
<?php

function determineHeaderImages()
{
$strPage = \Components\Website\Pages::currentPageId();

while($strPage)
{
if(file_exists('media/website_pages' . $strPage . 'header-images/'))
{
$arrFiles = \Components\Website\Media::getChildren('/media/website_pages' . $strPage . 'header-images/');

if(count($arrFiles))
{
return $arrFiles;
}
}

$strPage = \Framework\Components\TextualIds::getParent($strPage);
}

return [];
}

function youMayAlsoLikeGeneral()
{
$strCurrentPageId = \Components\Website\Pages::currentPageId();

$arrNoSideNavPages = [];
$arrNoSideNavPages[] = '/community/profile/';
$arrNoSideNavPages[] = '/placement-tests/';
$arrNoSideNavPages[] = '/af/';
$arrNoSideNavPages[] = '/commerce/';
$arrNoSideNavPages[] = '/products/';
$arrNoSideNavPages[] = '/order-a-course/';


foreach($arrNoSideNavPages as $strPageId)
{
if(strpos($strCurrentPageId, $strPageId) === 0)
{
return false;
}
}

return true;
}

?>
<?php

function determineHeaderImages()
{
$strPage = \Components\Website\Pages::currentPageId();

while($strPage)
{
if(file_exists('media/website_pages' . $strPage . 'header-images/'))
{
$arrFiles = \Components\Website\Media::getChildren('/media/website_pages' . $strPage . 'header-images/');

if(count($arrFiles))
{
return $arrFiles;
}
}

$strPage = \Framework\Components\TextualIds::getParent($strPage);
}

return [];
}

function youMayAlsoLikeGeneral()
{
$strCurrentPageId = \Components\Website\Pages::currentPageId();

$arrNoSideNavPages = [];
$arrNoSideNavPages[] = '/community/profile/';
$arrNoSideNavPages[] = '/placement-tests/';
$arrNoSideNavPages[] = '/af/';
$arrNoSideNavPages[] = '/commerce/';
$arrNoSideNavPages[] = '/products/';
$arrNoSideNavPages[] = '/order-a-course/';


foreach($arrNoSideNavPages as $strPageId)
{
if(strpos($strCurrentPageId, $strPageId) === 0)
{
return false;
}
}

return true;
}

?>
Mobile Function:
none
none
Mobile Value: