CSS - Configuring different background images to be displayed on the Welcome, Questions & Results Page

CustomStyle Sheet code allows you to make cosmetic changes to the overall look and feel of the content that you create using Outgrow. This document will help you in getting an understanding of how you can set up different background images for the Welcome Page, Questions Page, and Results Page in different design layouts.

Chicago Design Layout

Design LayoutCSS Code
Chicago.V_3_5 .t1-landing {
background-image: url(image url here) !important;
}
.V_3_5 .t1-question {
background-image: url(image url here) !important;
}
.V_3_5 .t1-result {
background-image: url(image url here) !important;
}
London .has-background-tint {background-image: url("image URL") !important;background-size: cover !important;background-position: center !important;}
Greek .V_3_5 .t1-landing {
background-image: url(image url here) !important;
}
.V_3_5 .t1-question {
background-image: url(image url here) !important;
}
body .V_3_5 .page_1.t1-result,body .V_3_5 .page_2.t1-result{ {
background-image: url(image url here) !important;
}
Tokyo .experian-outer.result-outer-scroll {background-image: url(""image URL"") !important;background-size: cover;background-position: center top;}
.inline-tablecell {background-color: transparent !important;}
Madrid .V_3_5.template-five .t1-landing .landing-inner {
background-image: url(""https://cdn.filestackcontent.com/I8wbfwwTfOAmKHCLhrXr"") !important;
background-repeat: no-repeat !important;
background-size: cover !important;
}
.template-five.V_3_5 .t1-question {
background-image: url(""https://cdn.filestackcontent.com/I8wbfwwTfOAmKHCLhrXr"") !important;
background-repeat: no-repeat !important;
background-size: cover !important;
}
.template-five.V_3_5 .t1-result {
background-image: url(""https://cdn.filestackcontent.com/I8wbfwwTfOAmKHCLhrXr"") !important;
background-repeat: no-repeat !important;
background-size: cover !important;
}
Stockholm .V_3_5.template-six .t1-landing {
background-image: url(""https://cdn.filestackcontent.com/I8wbfwwTfOAmKHCLhrXr"") !important;
background-repeat: no-repeat !important;
background-size: cover !important;
}
.template-six.V_3_5 .t1-question {
background-image: url(""https://cdn.filestackcontent.com/I8wbfwwTfOAmKHCLhrXr"") !important;
background-repeat: no-repeat !important;
background-size: cover !important;
}
.template-six.V_3_5 .t1-result {
background-image: url(""https://cdn.filestackcontent.com/I8wbfwwTfOAmKHCLhrXr"") !important;
background-repeat: no-repeat !important;
background-size: cover !important;
}
Seattle Not Applicable
Venice .template-eight .t1-landing .eight-inner-wrapper {
background-image: url(""https://cdn.filestackcontent.com/I8wbfwwTfOAmKHCLhrXr"") !important;
background-repeat: no-repeat !important;
background-size: cover !important;
}
.template-eight .t1-question .eight-inner-wrapper {
background-image: url(""https://cdn.filestackcontent.com/I8wbfwwTfOAmKHCLhrXr"") !important;
background-repeat: no-repeat !important;
background-size: cover !important;
}
.template-eight .overlay-outer-eight {
background-image: url(""https://cdn.filestackcontent.com/I8wbfwwTfOAmKHCLhrXr"") !important;
background-repeat: no-repeat !important;
background-size: cover !important;
}
New York Not Applicable
Paris Not Applicable
Berlin Not Applicable
Auckland .t12 {background-image: url(""image URL"") !important;background-size: cover !important;background-position: center !important;}
.questionnaire {background: transparent !important;}

Feel free to reach out to us using our chat support or by reach out to us at [email protected] in case you have any questions or feedback and our team will be glad to assist you further.