﻿/*
	--------------------------
	Home Styles
	--------------------------
*/

div.body section div div a, div.body section div.w a, div.body section div#ocms_cphbody a  { text-decoration: underline; }
div.body section div a:hover, div.body section div.w a:hover, div.body section div#ocms_cphbody a::hover  { text-decoration: none; }

div.body section    { border-bottom: solid 1px #ccc; float: left; width: 100%; padding: 1em 0px; }
div.body section.t  { border-bottom: 0px; margin-top: 1em; font-size: 0.8em; }

div.body section > div > img, div.body section > div > a > img    { width: 9.6775%; float: left; margin-right: 3%; margin-top: 0.5em; }
div.body section > div > div    { float: left; width: 86.9%; }
div.body section > aside        { float: left; margin-left: 5%; width: 33%; margin-bottom: 1em; }
div.body section > aside div    { background: #e6e6e6; border: solid 1px #d3d3d3; border-radius: 1em; padding: 6% 10%; text-align: center; }
div.body section > aside div a  { display: block; margin-top: 1em; background-color: #0192d4; color: #fff; border-radius: 2em; padding: 0.5em; font-family: arial, sans-serif; font-weight: bold; text-align: center; 
                                    background-image: -webkit-gradient(linear, 0% 0%, 100% 0%, from(#0192d4), to(#186cb5));
                                    background-image: -webkit-linear-gradient(left, #0192d4, #186cb5); 
                                    background-image:    -moz-linear-gradient(left, #0192d4, #186cb5);
                                    background-image:     -ms-linear-gradient(left, #0192d4, #186cb5);
                                    background-image:      -o-linear-gradient(left, #0192d4, #186cb5);
                                    background: linear-gradient(to right, #0192d4 0%,#186cb5 100%);
                                }
div.body section > aside > img  { width: 100%; }

div.body section:not(:first-child) > div ul li  { width: 48%; float: left; margin-left: 2%; }

div.body section:not(:first-child) > div    { font-size: 0.85em; }
div.body section > div                      { float: left; width: 62%; }
div.body section > div.w                    { width: 92%; margin-left: 8%; }
div.body section > div.s                    { width: 47%; }
div.body section > div.s img                { width: 12.7659%; margin-right: 3.9574%; }
div.body section > div.s > div              { width: 72.9103%; }
div.body section > div.l                    { width: 100%; }
div.body section > div.l img                { width: 6%; margin-right: 1.86%; }
div.body section > div.cols                 { column-count: 2; -moz-column-count: 2; -webkit-column-count: 2; column-gap: 5%; -moz-column-gap: 5%; -webkit-column-gap: 5%; }

div.body section:first-child > aside    { float: left; width: 18.4426%; margin-right: 5%; margin-left: 0px;}
div.body section > aside form           { box-shadow: 2px 2px 6px #666; }
div.body section:first-child > div      { width: 100%; }
div.body section > div div.sm           { float: right; width: 33%; margin-left: 2%; }
div.body section > div div.sm > a > img     { margin-right: 0.25em; }

div.body section:nth-child(6n+2) h1, div.body section:nth-child(6n+2) h1 a  { color: #ff8200; }
div.body section:nth-child(6n+6) h1, div.body section:nth-child(6n+3) h1 a  { color: #ff008c; }
div.body section:nth-child(6n+3) h1, div.body section:nth-child(6n+4) h1 a  { color: #323291; }
div.body section:nth-child(6n+4) h1, div.body section:nth-child(6n+5) h1 a  { color: #3fa9f5; }
div.body section:nth-child(6n+5) h1, div.body section:nth-child(6n+6) h1 a  { color: #b0152a; }
div.body section:nth-child(6n+7) h1, div.body section:nth-child(6n+7) h1 a  { color: #00a6a6; }
div.body section:nth-child(6n+8) h1, div.body section:nth-child(6n+8) h1 a, div.body section:nth-child(6n+8) h3  { color: #d6de23; }

/* Law Links */
div.body section nav.b                          { float: left; width: 50%; margin-left: 3%; position: relative; }
div.body section nav.b ul                       { margin: 0px; padding: 0px; list-style-type: none; }
div.body section nav.b ul li                    { float: left; width: 24.25%; padding: 0px; height: 10em; margin-left: 1%; margin-bottom: 1%; font-size: 0.8em; font-weight: bold; text-align: center; }
div.body section nav.b ul li:nth-child(4n+1)    { margin-left: 0px; }
div.body section nav.b ul li:first-child        { background-color: #3fa9f5; color: #fff; transform: rotate(-15deg); padding-top: 1.75em; height: 8.25em; }
div.body section nav.b ul li:first-child:before { content: url(/_resources/files/content/home/paper-clip.png); position: absolute; top: -2em; left: -1.75em;  transform: rotate(15deg); }
div.body section nav.b ul li a                  { background-color: #323291; color: #fff; display: block; padding: 35% 3% 3% 3%; width: 94%; height: 62%; }
div.body section nav.b ul li a:hover            { background-color: #3fa9f5; }

/* Care search form */
div.body section div.form.c form div.f                      { margin-top: 1em; float: left; width: 92%; }
div.body section div.form.c form div.f p                    { float: left; margin-right: 1em; font-style: italic; width: 100%; }
div.body section div.form.c form div.f label                { display: block; float: left; font-size: 0.8em; width: 24%; margin-right: 1%; }
div.body section div.form.c form div.f label input          { display: inline; width: auto; }


/* Property Search Form */
div.body section div.form           { background: #e6e6e6; border: solid 1px #d3d3d3; border-radius: 1em; width: 100%; margin-bottom: 1em; font-size: 1em; }
div.body section div.form form      { width: 96%; float: left; border: 0px; padding: 2%; }
div.body section div.form > a img   { margin: 2%; width: 17.7%; float: left; }

div.body section div.form form input    { padding: 1% 2%; width: 100%; }
div.body section div.form form select   { width: 23.5%; padding: 1%; margin-left: 2%; float: left; }

div.body section div.form.c form legend             { text-align: left; float: left; width: 21%; padding-left: 1.5%; margin-right: 2%; box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -webkit-box-sizing: border-box; }
div.body section div.form.c form input              { float: left; width: 21%; margin-left: 0px; margin-right: 2%; }
div.body section div.form.c form select             { float: left; width: 21%; margin-left: 0px; margin-right: 2%; }
div.body section div.form.c form input[type=submit] { width: 8%; padding: 0px; margin: 0px; font-size: 1em; }

div.body section div.form.p                                 { margin-top: 1em; margin-bottom: 0px; }
div.body section div.form.p form                            { width: 74.3%; }
div.body section div.form.p form select:nth-of-type(4n + 1) { margin-left: 0px; }
div.body section div.form.p form div.f                      { margin-top: 1em; float: left; width: 80%; }
div.body section div.form.p form div.f p                    { float: left; margin-right: 1em; font-style: italic; }
div.body section div.form.p form div.f label                { display: block; float: left; margin-right: 0.5em; font-size: 0.85em; }
div.body section div.form.p form div.f label input          { display: inline; width: auto; }
div.body section div.form.p form input[type=submit]         { margin-top: 1em; padding: 0px; float: left; width: 20%; font-size: 1em; }

div.body section div.form.p form span.as                { position: relative; display: block; margin-bottom: 1em; float: left; width: 100%; }
div.body section div.form.p form span.as ul             { list-style-type: none; margin: 0px; padding: 0px; position: absolute; top: 1.4em; left: 0px; background: #fff; text-align: left; border: solid 1px #ccc; border-top: 0px; box-shadow: 2px 2px 2px #999; width: 100%; border-bottom-right-radius: 1em; border-bottom-left-radius: 1em; box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -webkit-box-sizing: border-box; }
div.body section div.form.p form span.as ul li          { font-size: 0.7em; padding: 2%; border-bottom: solid 1px #f1f1f1; cursor: pointer; width: 42%; }
div.body section div.form.p form span.as ul li:hover    { background: #f1f1f1; }

/* Carers */
section.carers section.banner                   { padding: 0px; background: #3fa9f5; }
section.carers section.banner div.cbody         { float: left; width: 40%; margin: 1.75% 3%; font-size: 1em; }
section.carers section.banner div.slider        { float: left; margin: 0px; width: 31%; position: relative; top: 0px; bottom: 0px; overflow: hidden; }
section.carers section.banner div.slider img    { float: left; width: 100%; margin: 0px; }
section.carers section.banner aside             { float: left; width: 17%; padding: 2% 3%; margin: 0px; font-size: 0.8em; }

section.carers section.banner div.cbody h1              { color: #fff; font-family: Georgia, serif; font-weight: normal; font-size: 1.25em; }
section.carers section.banner div.cbody p               { color: #92e0fd; font-size: 0.75em; }
section.carers section.banner div.cbody p:last-child    { margin-bottom: 0px; }

section.carers section.banner aside form                        { box-shadow: 2px 2px 8px #333; }
section.carers section.banner aside fieldset legend             { font-size: 1.15em; }
section.carers section.banner aside fieldset img                { float: left; }
section.carers section.banner aside fieldset input[type=submit] { font-size: 0.8em; }

section.carers section.spotlight            { float: left; margin-top: 0.25em; padding: 0px; border: 0px; }
section.carers section.spotlight > span     { display: block; float: left; background: #ff8200; width: 4%; height: 4.75em; }
section.carers section.spotlight > a        { display: block; float: left; background: #ff8200; padding: 2.7% 2.95%; }
section.carers section.spotlight > a img    { float: left; }
section.carers section.spotlight ul         { margin: 0px; padding: 0px; list-style-type: none; }
section.carers section.spotlight ul li      { float: left; }

section.carers div.sections, div.body section:not(:first-child) > div.sections         { float: left; width: 100%; margin-top: 1em; font-size: 1em; }
section.carers div.sections>div     { width: 25%; float: left; text-align: left; padding-bottom: 4%; font-size: 1em; }
section.carers div.sections div img { float: left; }
section.carers div.sections>div div { position: relative; top: 4.5em; left: -1.5em; font-size: 1em; }
section.carers div.sections div h2  { font-family: Georgia, serif; font-weight: normal; font-size: 1.15em; margin-bottom: 0px; }
section.carers div.sections div p   { font-size: 0.7em; margin-bottom: 0px; }
section.carers div.sections div a   { color: #d0c900; }

section.carers div.sections > div:nth-child(4n+2) a  { color: #8cc63f; }
section.carers div.sections > div:nth-child(4n+3) a  { color: #b9529f; }
section.carers div.sections > div:nth-child(4n+4) a  { color: #f7931e; }

/*  Forms 
--------------------------  */

form                    { background: #e6e6e6; border: solid 1px #d3d3d3; border-radius: 1em; padding: 5%; float: left; width: 90%; }
form label              { display: none; }
form input              { padding: 5%; border-radius: 2em; width: 90%; margin-bottom: 0.5em; font-size: 0.8em; }
form select             { padding: 5%; border-radius: 2em; border: 0px; width: 100%; margin-bottom: 0.5em; background-color: #0192d4; color: #fff; font-size: 0.8em; 
                            background-image: -webkit-gradient(linear, 0% 0%, 100% 0%, from(#0192d4), to(#186cb5));
                            background-image: -webkit-linear-gradient(left, #0192d4, #186cb5); 
                            background-image: -moz-linear-gradient(left, #0192d4, #186cb5);
                            background-image: -ms-linear-gradient(left, #0192d4, #186cb5);
                            background-image: -o-linear-gradient(left, #0192d4, #186cb5);
                            background: linear-gradient(to right, #0192d4 0%,#186cb5 100%);
                            box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -webkit-box-sizing: border-box;
                        }
form select option      { background: #fff; color: #575757; }
form input[type=submit] { width: 100%; padding: 0px; border: 0px; text-align: right; background: transparent; color: #666; font-size: 0.7em; font-weight: bold; }