﻿/* Eric Meyer's Reset CSS v2.0 - http://cssreset.com */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{border:0;font-size:100%;font:inherit;vertical-align:baseline;margin:0;padding:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}table{border-collapse:collapse;border-spacing:0}

/* Web Application Template CSS */
html {
    font-size:100%;
    height:100%;
}
body {
    font-family:sans-serif;
    font-size:62.5%;
    height:100%;
    line-height:normal;
    text-align:center;
    margin:0; padding:0;
}
/* Clear floated elements */
.clear:before,
.clear:after {
    content: "";
    display: table;
} 
.clear:after {
    clear: both;
}
.clear {
    zoom: 1; /* For IE 6/7 (trigger hasLayout) */
}
/* External links*/
a.ext {
    position:relative;
    overflow:visible;
}
a.ext > span {
    position: absolute;
    left: -9000px;
    width: 0;
    opacity:0;
    overflow: hidden;
}
a.ext:hover > span, a.ext:focus > span, a.ext:active > span {
    display:block;
    position:absolute;
    z-index:10;
    top:-1.5em; left:75%;
    background:#736c5b;
    color:#fff;
    padding:4px;
    width:auto;
    white-space:nowrap;
    opacity:1;
    transition:opacity .5s;
}

a:focus {
    color:#19324c!important;
    background-color:#f6efcc!important;
    outline:none;
    /*outline:1px solid #f6efcc;*/
}
input:focus {
    outline:1px solid #328efd;
}

/* skip to main content */
#skip-maincontent {
    display:block;
    position:absolute;
    top:-40px; left:0;
    font-size:1.4em;
    text-decoration:none;
    padding:8px;
    background:#DCF1E4!important;
}
#skip-maincontent:focus  {
    top:0;
    transition:top .1s  ;
}
#maincontent:focus {
    outline:none;
}
#maincontent:focus h1 {
    background:#DCF1E4;
}
#maincontent:focus .section h1 {
    background:inherit;
}
#maincontent:focus .section:focus h1 {
    background:#DCF1E4;
    outline:none;
}

/* Layout */
.layout-section {
    margin:16px;
    overflow:hidden;
}

#layout_page {
    text-align:left;
    padding:0 16px;
    min-width:728px;
    max-width:1280px;
    background:#fff;
    margin:0 auto;
    min-height:100%;
    height:auto!important;
    height:100%;
    overflow:hidden;
}
#layout_header {
    overflow:hidden;
}
#layout_body {
    margin-bottom:80px;
    overflow:hidden;
}
#layout_footer {
    min-width:728px;
    max-width:1280px;
    margin:0 auto;
    margin-top:-80px;
    padding:0 16px;
    height:64px;
    overflow:hidden;
}
#layout_main {
    overflow:hidden;
}
#layout_main .layout-section {
    margin-top:4px;
}
#layout_main.with-left-nav {
    margin-left:176px;
}


#layout_leftnav {
    float:left;
    width:176px;
}
#layout_leftnav .layout-section {
    margin-left:0;
    margin-right:8px;
    overflow:visible;
}
#pagelayout_left {
    float:left;
    width:70%;
    overflow:hidden;
}
#pagelayout_left .layout-section {
    margin-left:0;
    margin-top:0;
    margin-bottom:0;
}
#pagelayout_right {
    float:right;
    width:30%;
    overflow:hidden;
}
#pagelayout_right .layout-section {
    margin-right:0;
    margin-top:0;
    margin-bottom:0;
}

/* Header */
/* Title (Logo) */
#title {
    margin-top:36px; margin-bottom:16px;
    border-top:1px dotted #999;
    border-bottom:1px dotted #999;
    padding:16px 208px 20px 12px;
    color:#413E4A;
    font-family:serif;
    position:relative;
}
#title .title {
    font-size:3.7em;
    font-weight:bold;
    margin-bottom:8px;
}
#title .sub-title {
    font-family:serif;
    font-size:2.6em;
    margin-left:2px;
    margin-bottom:8px;
}
#title .sub-sub-title {
    font-family:serif;
    font-size:2.6em;
    margin-left:2px;
}
#title .title span,
#title .sub-title span {
    white-space:nowrap;
}

#title .flag {
    position:absolute;
    right:12px;
    top:16px;
}
/* Main Navigation */
#mainnavigation {
    background:#c99e16;
    color:#fff;
}
#mainnavigation ul.nav {
    font-size:1.6em;
}
#mainnavigation ul.nav li {
    float:left;
}
#mainnavigation ul.nav li:last-child {
}
#mainnavigation ul.nav a {
    display:block;
    color:#fff;
    text-decoration:none;
    padding:8px 16px;

}
#mainnavigation ul.nav a:hover {
    background:#DCF1E4;
    color:#413E4A;
}
#mainnavigation ul.nav a.selected {
    background:#9B7503;
    color:#fff;
}

/* Footer */
#footer {
    border-top:1px dotted #999;
    text-align:left;
    font-size:1.2em;
    line-height:1.5;
    color:#353535;
}
#footer .disclaimer {
    margin:16px;
    margin-right:256px;
}
#footer .disclaimer a {
    color:#353535;
}
#footer .last-updated {
    float:right;
    text-align:right;
    width:256px;
    margin:16px;
}

/* Twitter Widget*/
.twitter-widget {
    margin:16px 0;
}

/* Left Nav Content*/
#leftnavcontent ul.nav {
    font-size:1.6em;
}
#leftnavcontent ul.nav li {
}
#leftnavcontent ul.nav li a {
    display:block;
    padding:8px;
    color:#413E4A;
    text-decoration:none;
}
#leftnavcontent ul.nav li a:hover {
    background:#DCF1E4;
}
#leftnavcontent ul.nav li a.selected {
    background:#DCF1E4;
}

#main_content p {
    font-size:1.6em;
    margin:12px 0;
    line-height:1.5;
}

/* Main Content*/
#maincontent {
    color:#353535;
}
#maincontent .section {
    margin-bottom:16px;
}
#maincontent .indented {
    margin-left:12px;
}
#maincontent strong {
   font-weight:bold; 
}
#maincontent em {
   font-style:italic;
    font-weight: 700;
}
#maincontent h1 {
    font-size:2.4em;
    font-weight:bold;
    margin:0.5454em 0;
    color:#413E4A;
}
#maincontent h2 {
    font-size:1.8em;
    font-weight:bold;
    margin:0.6666em 0;
    color:#413E4A;
}
#maincontent h3 {
    font-size:1.6em;
    font-weight:bold;
    margin:0.75em 0;
    color:#413E4A;
}
#maincontent p {
    font-size:1.6em;
    margin:12px 0;
    line-height:1.5;
}
#maincontent ol {
    list-style:decimal;
    margin-left:32px;
    font-size:1.6em;
    line-height:1.5; 
    text-align:justify;
}
#maincontent ul {
    font-size:1.6em;
    list-style:disc;
    margin-left:32px;
    line-height:1.5; 
    text-align:justify;
}
#maincontent ul ul,
#maincontent ul ol,
#maincontent ol ul,
#maincontent ol ol {
    font-size:1em;
}
#maincontent ul li {
    margin:8px 0
}
#maincontent a {
    color:#3770a9;
}
#maincontent a {
    color:#3770a9;
}
#maincontent a:hover {
    color:#19324c;
    background:#f6efcc;
    transition:color .25s, background .25s;
}


/* Features */
#maincontent div.section.features {
    margin:0;
    overflow:hidden;
}
#maincontent ul.features {
    margin:12px 0;
    padding:24px 0 0 0;
    /*padding-top:12px;*/
    border-top:1px solid #c99e16;
    /*border-bottom:1px solid #c99e16;*/
    /*border-top:1px dotted #999;*/
    text-align:center;
}
#maincontent ul.features li {
    display: block;
}
#maincontent ul.features li a,
#maincontent ul.features li span.nolink
 {
    display: block;
    margin: 0;
    color: #fff;
    background:#999;
    text-decoration: none;
    border-radius:8px;
    box-shadow:rgba(0,0,0,0.5) 2px 2px 3px;
}
#maincontent ul.features li a:hover {
    background:#aaa;
}
#maincontent ul.features li a>span,
#maincontent ul.features li span.nolink>span 
{
    display: block;
    padding:48px 16px;
}

#maincontent ul.features li.feature1 a {
    background: #413e4a;
}
#maincontent ul.features li.feature1 a:hover {
    background-color: #585463;
}
#maincontent ul.features li.feature2 a {
    background: #812626;
}
#maincontent ul.features li.feature2 a:hover {
    background-color: #9c2f2f;
}
#maincontent ul.features li.feature3 a {
    background: #937b47;
}
#maincontent ul.features li.feature3 a:hover {
    background-color: #ad9153;
}
#maincontent ul.features li.feature4 a {
    background: #7E8F7C;
}
#maincontent ul.features li.feature4 a:hover {
    background-color: #92a590;
}
#maincontent ul.features li.feature5 a {
    background: #c99e16;
}
#maincontent ul.features li.feature5 a:hover {
    background-color: #e1b11a;
}
#maincontent ul.features li.feature6 a,
#maincontent ul.features li.feature6 span.nolink
 {
    background: #5f88a7;
}
#maincontent ul.features li.feature6 a:hover {
    background-color: #6996b9;
}
#maincontent ul.features li.feature7 a {
    background: #5a906f;
}
#maincontent ul.features li.feature7 a:hover {
    background-color: #6aa882;
}
#maincontent ul.features li.feature8 a {
    background: #9ba2a5;
}
#maincontent ul.features li.feature8 a:hover {
    background-color: #aab1b5;
}

#maincontent ul.features.fullwidth li {
    width:100%!important;
}
#maincontent ul.features.fullwidth li a {
    margin-left:0;
}

@media screen and (min-width: 936px) {
    #maincontent ul.features li {
        display: block;
        width: 25%;     /*Divide 100 by number of boxes in row to get % */
        float: left;
    }
    #maincontent ul.features li a {
        margin: 0 8px;
    }
    #maincontent ul.features li.feature1 a {
        margin-left: 0;
    }
    #maincontent ul.features li.feature1 a>span {
        padding-top:29px;
        padding-bottom:29px;
    }

    /*Change the feature below back to feature3 if putting the 4th button back at the bottom; changed rt margin here so 3 and 4 wouldn't be so close together and so 4 would display at the end of the row right to the edge*/
    #maincontent ul.features li.feature4 a {
        margin-right: 0;
    }

    /*#maincontent ul.features li.feature7 {
        width:50%;
        margin:0 auto;
        float:none;
    }*/

    /*#maincontent ul.features li.feature5, 
    #maincontent ul.features li.feature6,
    #maincontent ul.features li.feature7,
    #maincontent ul.features li.feature8
    {
        width:25%;
    }*/

}

@media screen and (min-width: 1296px) {
    #maincontent ul.features li.feature1 a>span {
        padding-top:38px;
        padding-bottom:39px;
    }
}


/* Featured External links*/
a.ext-feature {
    position:relative;
    overflow:visible;
}
a.ext-feature > span > span {
    position: absolute;
    left: -9000px;
    width: 0;
    opacity:0;
    overflow: hidden;
}
a.ext-feature:hover > span > span,
a.ext-feature:focus > span > span,
a.ext-feature:active > span > span {
    display:block;
    position:absolute;
    z-index:10;
    top:-1.5em; left:0;
    background:#736c5b;
    color:#fff;
    padding:4px;
    width:auto;
    white-space:nowrap;
    opacity:1;
    transition:opacity .5s;
}

/* Bio */
#maincontent .bio {
    overflow:hidden;
    padding-bottom:8px;
    margin-bottom:16px;
}
#maincontent .bio img {
    margin:8px 16px 8px 0;
    display:block;
    float:left;
    border:1px solid #ccc;
    box-shadow:rgba(0,0,0,0.2) 2px 2px 3px;
}
#maincontent .bio h2,
#maincontent .bio p {
    margin-left:176px;
    text-align:justify;
}

/* FAQ */
#maincontent ol.faq {
    font-weight:bold;
    color:#413E4A;
}
#maincontent ol.faq li {
    margin:1.25em 0;
}
#maincontent ol.faq h2 {
    font-size:1.125em;
}
#maincontent ol.faq p {
    font-size:1em;
    font-weight:normal;
    color:#353535;
}
#maincontent ol.faq ul {
    font-size:1em;
    font-weight:normal;
    color:#353535;
}

/* Feedback Form */
#maincontent #feedbackform {
    width:100%;
    min-width:736px;
    height:640px;
    overflow:hidden;
}
#maincontent #feedbackform iframe {
    position:relative;
    left:17px;
    width:100%;
    height:100%;
    overflow:hidden;
}

/* Contact Us */
#map-canvas {
    height:100%;
    height:475px;
}
#maincontent .contact-info {
    margin-top:5em;
}
#maincontent .contact-info .section {
    border-top:1px dotted #999;
}
#maincontent .contact-info h2 {
    font-size:1.6em;
}
#maincontent .contact-info h2.office {
    font-size:1.6em;
    margin-bottom:0;
}
#maincontent .contact-info p.address {
    margin-top:0;
}

/* Terms of Reference */
#maincontent .terms-of-reference h1 {
    text-align:center;
}
#maincontent .terms-of-reference h1 .title {
    display:block;
    margin-bottom:0.75em;
}
#maincontent .terms-of-reference h1 .sub-title {
    display:block;
    font-size:0.8181em;
}
#maincontent .terms-of-reference p strong {
    color:#413E4A;
}
#maincontent .terms-of-reference p {
    text-align:justify;
}

/* Review Process */
#maincontent .review-process p {
    text-align:justify;
}

/* FAQ */
#maincontent .faqjustify p {
    text-align:justify;
}

/* Expressions of Interest */
#maincontent .expressions-of-interest p {
    text-align:justify;
}

/* How to Get Involved */
#maincontent .involved p {
    text-align:justify;
}

/* Webcast */
#maincontent .webcast p {
    text-align:justify;
}

/* Schedule */
#maincontent .schedule p {
    text-align:justify;
}

/* Summary Report - ATIPPA Coordinator Questionnaire */
#maincontent .summary p {
    text-align:justify;
}

/* Committee Report */
#maincontent .committeereport p {
    text-align:justify;
}



/*  */
.question {
    font-family:sans-serif;
    font-size:1.6em;
    height:100%;
    line-height:normal;
    margin:0; padding:0;
    align-content:center;    
}
