/*
   Styles for SADE-2 section
*/

/* General styles. */

body { font-family: helvetica, arial, sans-serif; margin: 0; background-color: #eeeeee; }
img, table, tr, td, div, a, form { border: 0; padding: 0; margin: 0; }
a { text-decoration: none; color: black; }


/* USC and Chan identity. */

#identity { width: 100%; height: 170px; position: relative; }
#usc-identity { display: block; position: absolute; right: 18px; top: 15px; }
#usc-identity img { width: auto; height: 48px; }
#chan-identity-2line { display: block; position: absolute; left: 29px; top: 70px; }
#chan-identity-2line img { width: auto; height: 80px; }


/* Children's Hospital identity. */

#childrens-hospital-identity { position: absolute; right: 10px; bottom: 15px; }
#childrens-hospital-identity img { width: 170px; height: 80px; }


/* Social media identity. */

#social-identity { position: absolute; left: 29px; top: 15px; margin: 0; }
#social-identity img { height: 25px; width: auto; padding-right: 6px; opacity: 0.25; filter: alpha(opacity=25); }
#social-identity img:hover { opacity: 1.0; filter: alpha(opacity=100); }


/* Main page container. */

#container { width: 1024px; margin: auto; background-color: white;
             border-left: 10px solid white; border-right: 10px solid white; }


/* Section banner. */

#section-banner { position: relative; }
#section-banner #section-title { position: absolute; left: 20px; bottom: 20px; }
#section-banner #section-title p { font-family: 'Source Sans'; font-size: 650%; font-weight: 800;
                                   margin: 0; padding: 0 10px 0 10px;
                                   color: rgb(0 0 0 / 0.40); background-color: rgb(255 255 255 / 0.25); }

#section-banner-ds img { width: 100%; height: auto; }


/* Content. */

#content { font-family: 'Source Sans', helvetica, arial; width: 960px; margin: auto; margin-bottom: 2em; clear: both; }

#content #title { font-size: 220%; font-weight: 800; color: #990000; margin: 1.5em 0 0.5em 0; }

#content h1 { font-size: 200%; font-weight: 800;
              margin-top: 1em; margin-bottom: 0.75em; line-height: 130%; color: black; }

#content h2 { font-size: 140%; font-weight: 800;
              margin-top: 1em; margin-bottom: 0.75em; line-height: 130%; color: black; }

#content h3 { font-size: 120%; font-weight: 800;
              margin-top: 1em; margin-bottom: 0.75em; line-height: 130%; color: black; }

#content h4 { font-size: 110%; font-weight: 800;
              margin-top: 1em; margin-bottom: 0.75em; line-height: 130%; color: black; }

#content p, #content li, #content blockquote { font-weight: 300; line-height: 140%; color: #333333; }
#content p, #content li { font-size: 100%; }
#content a { text-decoration: none; color: #265c9e; font-weight: 700; border-bottom: 1px solid #cccccc; padding: 0 2px; }
#content a:hover { border-bottom: 1px solid black; color: black; background-color: #eeeeee; }

.leftmargin p, .leftmargin ul { margin-left: 0; }

#content table.toplevel { width: 100%; font-size: 100%; line-height: 125%;
                          margin-top: 1em; margin-bottom: 1em; padding-bottom: 1em; }
#content td { vertical-align: top; }
#content td.label { width: 35%; text-align: right; padding: 5px; }
#content td.required, #content p.required { color: #990000; font-weight: bold; }
#content td.value { width: 65%; text-align: left; padding: 5px; }

#switchlanguage { float: right; font-family: 'Source Sans', helvetica, arial; margin: 1em 1em 0 0; }
#switchlanguage a { color: white; background-color: #990000; font-size: 125%;
                    text-decoration: none; border-bottom: 0; font-weight: 700;
                    padding: 3px 5px 3px 5px;
                    border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; }
#switchlanguage a:hover { border-bottom: 0; background-color: black; }


/* Specific styles for inquiry form. */

#sade2form { line-height: 125%; font-size: 120%; }
#sade2form input[type="text"], textarea { font-family: 'Source Sans'; font-size: 100%; font-weight: 300;
                                          border: 1px solid #cccccc; padding: 3px; background-color: #eeeeee; }
#sade2form input[type="text"].additional { width: auto; }
#sade2form input:focus, textarea:focus { background-color: #ffff99; }
#sade2form label { font-weight: 300; font-size: 90%; padding-left: 6px; padding-right: 3px; }
#sade2form p { margin: 0; font-size: 90%; }
#sade2form #Your_URL { display: none; }
#sade2form textarea { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 100%; }