:root {
	--Cream				: RGB(161, 150, 126);
	--Grey				: #E6E6FA;
	--Grey2 			: #9f9f9f;
	--Transparent		: RGBA(0, 0, 0, 0.15);
	--Brown				: RGB(97, 71, 54);
	--Black				: RGB(24, 24, 24);
	--Blue				: RGB(75, 78, 113);
	--Light-Blue		: RGB(92, 96, 138);
	--Pink				: RGB(179, 98, 151);
	--Pomp				: #886191;
	--Lilac				: #CDA4C9;
	--Chinese-violet	: #7F5884;
	--Border-Radius		: 0em;
	--Page-Padding		: 3em;
}
HTML, BODY {
	padding				: 0;
	margin				: 0;
	word-wrap			: break-word;
}
HTML {
	height				: 100vh;
	overflow-y			: auto;
}
BODY {
	position			: Absolute;
	width				: 100%;
	min-height			: 100%;
	display				: Flex;
	font-family			: "Times New Roman", Times, serif;
	font-size			: 16px;
	flex-flow			: Column NoWrap;
}
DIV.logo {
	background			: Var(--Grey);
	flex-grow			: 0;
	flex-shrink			: 0;
	flex-basis			: Auto;
	order				: 1;
	min-height			: 7em;
	font-size			: 1.5em;
}
DIV.logo IMG {
	width				: 100%;
	max-width			: 520px;
	height				: Auto;
	border				: 0;
	margin				: 1em 0 1em 1em;
}
DIV.logo H1{
	font-style			: oblique;	
	padding-left		: 50px;
	color				: white;
	display				: none;
}
DIV.navigation {
	order				: 2;
	flex-grow			: 0;
	flex-shrink			: 0;
	flex-basis			: Auto;
	margin				: 0;
	padding				: 0;
	text-align			: Center;
}
DIV.navigation UL {
	display				: Inline-Block;
	list-style			: None;
	background			: white;
	padding				: 0;
	margin				: 0;
}
DIV.navigation UL LI {
	display				: Inline-Block;
	padding				: 0.5em 0;
}
DIV.navigation UL A {
	-text-align			: Center;
	display				: Inline-Block;
	padding				: 0.5em;
	min-width			: 5.5em;
	text-decoration		: None;
	font-size			: 1.2em;
	font-weight			: Normal;
	border-radius		: 4px;
	color				: Black;
}
@media only screen and (max-width: 900px) {
	DIV.navigation UL A {
		min-width			: Initial;
		font-size			: 1.15em;
	}
}
DIV.navigation UL A:hover {
	background			: #7c3c8c;
	background			: linear-gradient(to bottom,  #7c3c8c 0%,#886191 50%,#7c3c8c 55%,#772e89 100%);
	transition-delay	: 0.4s;
	transition			: 1s;
}
DIV.navigation LI A:hover, DIV.navigation LI span:hover{
	color				: white;
}
DIV.navigation SPAN.separator {
	display				: None;
}
DIV.navigation UL A:hover {
	background			: Var(--Pomp);
}
DIV.navigation UL UL{
	display				: None;
}
@media only screen and (max-width: 700px) {
	DIV.navigation {
		flex-grow			: 1;
		flex-shrink			: 0;
		flex-basis			: Auto;
		margin				: 0;
		order				: 0;
	}
	DIV.navigation:before {
		content				: "☰";
		font-size			: 150%;
		font-weight			: Bold;
		font-style			: Normal;
		margin-left			: 0.5em;
	}
	DIV.navigation UL {
		position			: Absolute;
		top					: 2em;
		left				: 0;
		width				: 16em;
		max-width			: 80%;
		bottom				: 0;
		padding				: 0.15em 0 0 0;
		display				: None;
	}
	DIV.navigation:hover UL {
		display				: Block;
	}
	DIV.navigation UL LI {
		display				: Block;
	}
	DIV.navigation UL LI {
		padding				: 0.5em 0.25em;
	}
	DIV.navigation UL A {
		display				: Block;
		padding				: 0.25em;
	}
}
DIV.body {
	padding				: 0 1em;
	order				: 3;
	flex-grow			: 1;
	flex-shrink			: 0;
	flex-basis			: Auto;
}
DIV.body A {
	text-decoration		: none;
	color				: Var(--Black);
	font-style			: oblique;
}
DIV.body A:hover {
	text-decoration		: none;
	color				: Var(--Brown);
	font-style			: oblique;
}
DIV.body DIV.banner {
	color				: White;
	display				: Flex;
	flex-flow			: Row Wrap;
	align-items			: Center;
	background			: Var(--Light-Blue);
	margin				: 0;
	padding				: 0;
	background-image	: url(images/stars.svg);
}
DIV.body DIV.banner.remodeling {
	background			: Var(--Pink);
	background-image	: url(images/stars.svg);
}
DIV.body DIV.banner.fashion {
	background			: Var(--Blue);
	background-image	: url(images/stars.svg);
}
DIV.body DIV.banner.reviews.a {
	background			: Var(--Pink); 
	background-image	: url(images/stars.svg);
}
DIV.body DIV.banner.reviews.b {
	background			: Var(--Chinese-violet); 
	background-image	: url(images/stars.svg);
}
DIV.body DIV.banner.reviews.c {
	background			: Var(--Blue); 
	background-image	: url(images/stars.svg);
}
DIV.body DIV.banner.reviews.d {
	background			: Var(--Lilac); 
	background-image	: url(images/stars.svg);
}
DIV.body DIV.banner.reviews IMG {
	vertical-align		: Middle;
	max-width			: 30%;
	flex-shrink			: 1;
	flex-grow			: 1;
	flex-basis			: 0;
}
@media only screen and (max-width: 768px) {
DIV.body DIV.banner.reviews IMG {
		width				: 100%;
		max-width			: 100%;
		flex-basis			: 100%;
	}
}
DIV.body DIV.banner.fashion DIV.content A:hover {
	text-decoration		: none;
	color				: Var(--Black);
}
DIV.body DIV.banner DIV.content {
	flex-shrink			: 1;
	flex-grow			: 1;
	flex-basis			: 0;
	padding-left		: 1.5em;
	padding-right		: 1.5em;
}
@media only screen and (max-width: 768px) {
DIV.body DIV.banner DIV.content {
		flex-basis			: 100%;
		min-width			: 10%;
	}
}
DIV.body DIV.banner DIV.content P {
	font-size			: 1.3em;
	font-weight			: Normal;
	text-align			: Center;
}
DIV.body DIV.banner IMG {
	vertical-align		: Middle;
	width				: 50%;
	flex-shrink			: 1;
	flex-grow			: 1;
	flex-basis			: 0;
}
@media only screen and (max-width: 768px) {
DIV.body DIV.banner IMG {
		width				: 100%;
		flex-basis			: 100%;
	}
}
DIV.body DIV.banner.right IMG {
	order				:	1;
}
DIV.body DIV.banner DIV.content H4 {
	font-style			: oblique;
	font-size			: 2em;
	text-align			: Center;
	color				: White;
}
DIV.body DIV.banner DIV.content H2 {
	font-size			: 4em;
	text-align			: Center;
	margin-top			: 0.25em;
	color				: White;
}
DIV.body DIV.banner DIV.content H3 {
	font-style			: oblique;
	font-size			: 2em;
	font-weight			: Normal;
	text-align			: Center;
}
DIV.body DIV.banner DIV.content A {
	text-decoration		: none;
	color				: white;
}
DIV.body DIV.banner DIV.content A:hover {
	text-decoration		: none;
	color				: Var(--Black);
}
DIV.body > H2 IMG.left {
	float				: Left;
	width				: 33%;
	margin				: 0 1em 0.5em 0;
	border-radius		: 4px;
}
DIV.body > H2 IMG.right {
	float				: Right;
	width				: 33%;
	margin				: 0 0 0.5em 1em;
	border-radius		: 4px;
}
DIV.body H2 {
	font-style			: oblique;
	font-size			: 3em;
	font-weight			: Normal;
	color				: Var(--Black);
}
DIV.body P {
	font-size			: 1.3em;
	font-weight			: Normal;
}
DIV.body P.lead {
	font-size			: 1.45em;
	color				: Var(--Brown);
}
DIV.body DIV.faq-page {
	max-width			: 70em;
	margin				: 0 auto 3em auto;
}
DIV.body DIV.faq-index {
	background			: Var(--Grey);
	padding				: 1em 1.5em;
	margin				: 1em 0 2em 0;
	border-left			: 0.35em Solid Var(--Pomp);
}
DIV.body DIV.faq-index H3,
DIV.body DIV.faq-list H3 {
	margin-top			: 0;
}
DIV.body DIV.faq-index UL {
	margin				: 0;
	padding-left			: 1.2em;
	font-size			: 1.25em;
}
DIV.body H3.faq-anchor {
	font-size			: 1.8em;
	font-style			: Oblique;
	color				: Var(--Pomp);
	margin-top			: 1.5em;
}
DIV.body DIV.faq-list {
	display				: Grid;
	grid-template-columns		: Repeat(2, MinMax(0, 1fr));
	gap				: 1em;
}
DIV.body DIV.faq-item {
	background			: RGBA(55, 55, 55, 0.06);
	border-top			: 0.25em Solid Var(--Lilac);
	padding				: 1em;
}
DIV.body DIV.faq-item H3 {
	font-size			: 1.35em;
	color				: Var(--Black);
}
DIV.body DIV.faq-item P {
	font-size			: 1.15em;
}
DIV.body P.faq-contact {
	background			: Var(--Pink);
	color				: White;
	padding				: 1em;
	text-align			: Center;
}
DIV.body P.faq-contact A {
	color				: White;
	font-weight			: Bold;
}
@media only screen and (max-width: 768px) {
	DIV.body DIV.faq-list {
		grid-template-columns		: 1fr;
	}
}
DIV.body FORM {
	float				: Left;
	padding				: 0.25em;
	margin				: 0 0 0.5em 0;
	background			: RGBA(255,255,255, 5%);
	border-radius		: 4px;
}
DIV.body DIV.banner DIV.content FORM {
	font-size			: 16px;
	width				: 50%;
}
DIV.body DIV.banner DIV.content FORM P.field {
	padding				: 0;
	margin				: 0 0 0.25em 0;
	text-align			: Left;
}
DIV.body DIV.banner DIV.content FORM P.error {
	font-size			: 1.5em;
	color				: White;
	background			: Red;
	border-radius		: 4px;
	margin				: 0.25em 2em;
}
DIV.body DIV.banner DIV.content FORM INPUT, DIV.body DIV.banner DIV.content FORM TEXTAREA {
	font-family			: "Times New Roman", Times, serif;
	font-size			: 1em;
	background			: White;
	display				: Block;
	box-sizing			: Border-Box;
	width				: 100%;
	padding				: 0;
	border				: None;
	border-radius		: 4px;
}
DIV.body DIV.banner DIV.content FORM P.controls {
	padding				: 0;
	margin				: 0.5em 0 0 0;
	text-align			: Left;
}
DIV.body DIV.banner DIV.content FORM P.controls BUTTON {
	font-family			: "Times New Roman", Times, serif;
	font-size			: 1em;
	padding				: 2px 2em;
	background			: White;
	border				: None;
	border-radius		: 4px;
}
DIV.body DIV.topics {
	display				: Flex;
	width				: 100%;
	flex-flow			: Row Wrap;
	justify-content		: Center;
}
@media only screen and (max-width: 768px) {
DIV.body DIV.topics {
		flex-flow			: Column NoWrap;
	}
}
DIV.body  DIV.topics DIV.topic {
	flex-grow			: 0;
	flex-shrink			: 1;
	flex-basis			: Auto;
	width				: 30%;
	min-width			: 10%;
	display				: Flex;
	flex-flow			: Column Nowrap;
	background			: Var(--Pink);
	padding				: 0 0 1em 0;
	margin				: 0.5em 1% 1em 1%;
	text-align			: Center;
	font-family			: "Times New Roman", Times, serif;
	color				: White;
}
@media only screen and (max-width: 768px) {
	DIV.body  DIV.topics DIV.topic {
		flex-grow			: 1;
		flex-shrink			: 1;
		flex-basis			: Auto;
		width				: Calc(100% - 2 * 2em);
		margin-left			: 2em;
		margin-right		: 2em;
	}
}
DIV.body  DIV.topics DIV.topic:nth-child(even) {
	padding				: 1em 0 0 0;
}
DIV.body  DIV.topics DIV.topic > * {
	flex-grow			: 1;
	flex-shrink			: 1;
	flex-basis			: Auto;
	margin				: 0.5em 1em 0 1em;
	padding				: 0;
	font-weight			: Normal;
	word-wrap			: Break-word;
}
DIV.body  DIV.topics DIV.topic:nth-child(even) H2 {
	margin-top			: 0;
}
DIV.body  DIV.topics DIV.topic H2 {
	flex-grow			: 1;
	font-size			: 250%;
	display				: Flex;
    align-items			: Flex-End;
    justify-content		: Center;
	color				: White;
}
DIV.body  DIV.topics DIV.topic H3 {
	font-size			: 150%;
	font-style			: Oblique;
}
DIV.body  DIV.topics DIV.topic P:last-child {
	flex-grow			: 1;
}
DIV.body  DIV.topics DIV.topic:nth-child(even) P:last-child {
	margin-bottom		: Calc(0.5em * 1.3);
}
DIV.body  DIV.topics DIV.topic A {
	text-decoration		: none;
	color				: White;
	font-weight			: Bold;
}
DIV.body  DIV.topics DIV.topic A:hover {
	text-decoration		: none;
	color				: Var(--Black);
	font-weight			: Bold;
}
DIV.body  DIV.topics DIV.topic .image {
	margin				: 0;
	padding				: 1em 0 0 0;
	order				: 4;
	background 			: White;
}
DIV.body  DIV.topics DIV.topic .image IMG {
	width				: 100%;
	display				: Block;
}
DIV.body  DIV.topics DIV.topic:nth-child(odd) .image {
	padding				: 0 0 1em 0;
	order				: -1;
}
DIV.review {
	margin				: 3em auto;
	padding				: 1em;
	overflow			: auto;
	box-shadow			: 0 1px 5px 0px rgba(0, 0, 0, 0.25);
	background			: rgba(55, 55, 55, 0.1);
}

DIV.footer {
	flex-grow			: 0;
	flex-shrink			: 0;
	flex-basis			: Auto;
	order				: 5;
	margin				: 0;
	padding				: 0;
	display				: Flex;
	flex-flow			: Row Wrap;
	background			: Var(--Grey);
	border-top			: 1px Solid Black;
	font-size			: 1.3em;
}

DIV.footer DIV.category:nth-child(1) { order : 1; }
DIV.footer DIV.category:nth-child(2) { order : 2; }
DIV.footer DIV.referers				{ order : 4; }
DIV.footer P.copyright 				{ order : 3; }

DIV.footer P {
	color				: Black;
	font-family			: Serif;
	font-weight			: Normal;
}

DIV.footer * A {
	font-weight			: Normal;
	text-decoration		: none;
	color				: Black;
}

DIV.footer A:hover {
	text-decoration		: none;
	color				: Var(--Blue);
}


DIV.footer * {
	padding				: 0;
	margin				: 0;
}

DIV.footer DIV.category {
	box-sizing			: Border-Box;
	flex-grow			: 1;
	flex-shrink			: 0;
	flex-basis			: 50%;
	min-width			: 15em;
	padding				: 0.25em 0.25em 0 2em;
	margin				: 0 0 1em 0;
}

DIV.footer DIV.category H2 {
	display				: None;
}

DIV.footer DIV.category UL {
	padding				: 0;
	margin				: 0;
	list-style-type		: None;
}

DIV.footer DIV.category LI {
	display				: Block;
	list-style-type		: None;
}

DIV.footer DIV.category LI.separator {
	height				: 1em;
}

DIV.footer DIV.category LI.separator  HR{
	display				: None;
}

DIV.footer DIV.category P.newsection {
	margin-top			: 0.5em;
}

DIV.footer DIV.referers {
	flex-grow			: 1;
	flex-shrink			: 0;
	flex-basis			: Auto;
	align-self			: Flex-End;
	margin				: 0 0.25em 0.25em 0;
}

DIV.footer DIV.referers SPAN.separator {
	display				: None;
}

DIV.footer DIV.referers A {
	display				: Block;
	float				: left;
}

DIV.footer DIV.referers A:nth-child(3) {
	margin-left			: 8px;
}

DIV.footer DIV.referers A:nth-child(5) {
	margin-left			: 24px;
}

DIV.footer DIV.referers IMG {
	display				: Block;
	width				: 48px;
	height				: 48px;
	clear				: Both;
}

DIV.footer P.copyright {
	flex-grow			: 1;
	flex-shrink			: 1;
	flex-basis			: Auto;
	align-self			: Flex-End;
	font-size			: 1em;
	margin				: 0 0 0.5em 0;
	width				: Calc(100% - 3 * 48px - 8px - 24px - 0.25em);
	text-align			: Center;
}

@media only screen and (max-width: 400px) {
	DIV.review {
		padding				: 0 1em 2em 1em;
	}
}
DIV.review IMG {
	max-width			: 70px;
	min-width			: 64px;
	float				: right;
	clear				: initial;
	margin				: initial;
	border-radius		: 15px;
}
DIV.review .Circle {
    border-radius		: 50%;
    width				: 64px;
    height				: 64px;
	line-height			: 64px;
    padding				: 8px;
	float				: right;
	background			: Var(--Grey);
    border				: 1px solid #FFF;
    color				: #666;
    text-align			: center;
	font-size			: 2em;
}
@media only screen and (max-width: 415px) {
DIV.review IMG {
	display				: none !important;
	}
}
DIV.review H3.author {
	float				: right;
	margin				: 0;
	padding				: 0;
	font-size			: 1.15em;
	text-align			: center;
	max-width			: 225px;
	min-width			: 100px;
}
@media only screen and (max-width: 415px) {
DIV.review H3.author {
	float				: none;
	margin				: 0;
	padding				: 0;
	font-size			: 1.15em;
	text-align			: left;
	-width				: 60%;
	max-width			: 100%;
		}
}
DIV.review H3.author * {
	display				: block;
}
DIV.review H4.date {
	float				: left;
	margin				: 0;
	padding				: 0;
	color				: #70757a;
	font-size			: 13px;
	width				: 8em;
}
@media only screen and (max-width: 400px) {
DIV.review H4.date {
    text-align			: right;
	margin				: 0;
	}
}
@media only screen and (max-width: 890px) {
DIV.review H4.date {
	width				: initial;
	}
}
DIV.review P.rating  {
	margin				: 0;
	padding				: 0;
}
DIV.review P  {
    text-align			: left!important;
}

DIV.review P.rating .textualRepresentation  {
	display				: none;
}

@media only speech {
DIV.review P.rating .graphicalRepresentation  {
	display				: inline-block;
	}
}

DIV.review P.rating .graphicalRepresentation  {
	display				: inline-block;
	width				: 8em;
	height				: 2em;
    background-size		: 100%;
    background-repeat	: no-repeat;
}

@media only screen and (max-width: 414px) {
DIV.review P.rating .graphicalRepresentation  {
	display				: flex;
	margin				: auto;
	width				: 100%;
    height				: 3em;
	}
}

@media only screen and (min-width: 415px) and (max-width: 680px) {
DIV.review P.rating .graphicalRepresentation  {
	width				: 10em;
    height				: 2em;
	}
}

DIV.review P.rating .rating_1_star {
	background-image	: url('/images/1-star.png');
}

DIV.review P.rating .rating_2_star {
	background-image	: url('/images/2-star.png');
}

DIV.review P.rating .rating_3_star {
	background-image	: url('/images/3-star.png');
}

DIV.review P.rating .rating_4_star {
	background-image	: url('/images/4-star.png');
}

DIV.review P.rating .rating_5_star {
	background-image	: url('/images/5-star.png');
}

DIV.review P.body {
	margin				: 0;
	padding				: 0;
	clear				: both;
}

@media only screen and (max-width: 415px) {
DIV.review P.body {
	margin				: 0;
	padding				: 0;
	margin-top			: 20px;
	}
}
