﻿/***********************
 * .dccw-boxu level: FAQ Viewer.
 * TODO: Needs to be styled properly and conceptualised.
 * TODO: Should be scoped to .dccw-boxu
 * TODO: No IDs - NB any remaining ids are referred to in javascript, will need update there also
 * TODO: Naming
 * TODO: Normalise colours
 * TODO: Not so much specificity
 * TODO: Buttons?
 **********************/
/* ------------------- Generic ----------------------*/
.dccw-boxu.faq-viewer h1 {
    color: #EE008C;
    font-weight: normal;
}
.dccw-boxu.faq-viewer .kbbody{
   width: 100%;
   opacity: 0.3;
   filter: alpha(opacity = 30);
   -moz-opacity: 0.3;
}
.dccw-boxu.faq-viewer .resize-limit {
    min-width: 280px;
    max-width: 980px;
}
.dccw-boxu.faq-viewer .body-container{
    min-height: 0;
}
.dccw-boxu.faq-viewer ul{
    list-style-type: none;
    padding: 0;
}
.dccw-boxu.faq-viewer a,
.dccw-boxu.faq-viewer a:hover {
    text-decoration: none;
}
.dccw-boxu.faq-viewer a:link, .faq-viewer a:visited,
.dccw-boxu.faq-viewer a{
    color: #303C9E;
}
.dccw-boxu.faq-viewer span{
    font-weight: normal;
    color: Black;
}
.dccw-boxu.faq-viewer .required{
    color: Black;
    font-weight: normal;
}

.dccw-boxu.faq-viewer ul {
    display: block;
}

.dccw-boxu.faq-viewer .header-container li {
    float: left;
    text-align: center;
    width: 180px;
}

/*************************
    Tab Headings
*************************/
.dccw-boxu.faq-viewer div.tab-section {
    float: left;
    display:inline-block;
    width: 50%;
}

.dccw-boxu.faq-viewer div.tab-section a {
    font-weight: bold;
    padding: 9px 1px;
    background-color: #DCDCDC;
    display:block;
    color: black;
    max-width: 95%;
    text-align: center;
}
.dccw-boxu.faq-viewer div.tab-section a:hover{
    cursor: pointer;
}

.dccw-boxu.faq-viewer div.tab-section > div {
    float: left;
    width: 50%;
}

.dccw-boxu.faq-viewer div.tab-section div.selected span {
    color:#045c8c;
    display:block;   
}

/*-----Search Box-------*/
.dccw-boxu.faq-viewer .search-panel {
    float:left;
    width: 50%;
}

.dccw-boxu.faq-viewer .search-textbox {
    max-width: 250px;
    margin-left: 15%;
    border: solid 1px #DCDCDC;
}

.dccw-boxu.faq-viewer .header-container {
    padding: 20px 0;
}

.dccw-boxu.faq-viewer div.search-textbox input {
    padding:2px 2px;
}

.dccw-boxu.faq-viewer div.search-textbox input[type="text"] {
    padding: 9px 0 9px 10px;
    color: grey;
    width: 80%;
    height: 15px;
    background-color: transparent;
    border: none;
}
.dccw-boxu.faq-viewer div.search-textbox input[type="text"]:focus {
    color: black;
}

.dccw-boxu.faq-viewer div.search-textbox input[type="button"] {
    background: url('../Images/search-icon_default.jpg') no-repeat;
    border: none;
    width: 32px;
    height: 32px;
    cursor: pointer;
    float: right;
}

.dccw-boxu.faq-viewer .loadingContent {
    background: url('../Images/spinner.gif');
    width: 32px;
    height: 32px;
    background-repeat: no-repeat;
    position: absolute;
    right: 50%;
}

.dccw-boxu.faq-viewer ul.results-list {
    list-style-type :none;
    padding:0;
    margin:0;
}
.dccw-boxu.faq-viewer ul.results-list li {
   padding: 5px 0;
}
.dccw-boxu.faq-viewer ul.results-list li div.toggle {
    color:#333333;
    padding: 5px 0;
}

.dccw-boxu.faq-viewer div.toggle a {
    font-weight: bold;
}

.dccw-boxu.faq-viewer div.results-footer {
    height:11px;
    color:#000000;
    margin-top: 10px;
}

.dccw-boxu.faq-viewer div.toggle .related-topics {
    margin-top: 7px;
}
.dccw-boxu.faq-viewer div.toggle .no-help-text,
.dccw-boxu.faq-viewer div.toggle .yes-help-text,
.dccw-boxu.faq-viewer div.toggle .related-topics,
.dccw-boxu.faq-viewer div.toggle .info-feedback {
    font-size: 0.846em;
    font-weight: bold;
}
.dccw-boxu.faq-viewer div.toggle .info-feedback a {
    padding-left: 15px;
}

/* ------------------- Search Results ----------------------*/
.dccw-boxu.faq-viewer div.results-header span.header {
    font-weight:bold;
    color:#000000;
}

.dccw-boxu.faq-viewer div.results-header p {
    color:#000000;
    font-size: 0.85em;
}

.dccw-boxu.faq-viewer div.results-header a {
    color:#3483C5;
    font-weight:bold;
}

.dccw-boxu.faq-viewer ul.results-list a.results-title {
    height:18px;
    padding-top:16px;
    display:inline-block;
    font-weight:bold;
    font-size: 1.15em;
    text-decoration: none;
}

.dccw-boxu.faq-viewer #faq-page-control-list {
    text-align: center;
}
.dccw-boxu.faq-viewer #faq-page-control-list li{
    display: inline-block;
    margin-right: 2%;
}
.dccw-boxu.faq-viewer #faq-page-control-list li.noSearchPage{
    color: lightgrey;
}
.dccw-boxu.faq-viewer #faq-page-control-list li.searchPaging{
    color: #3483C5;
}
.dccw-boxu.faq-viewer #faq-page-control-list li.searchPaging:hover{
    cursor: pointer;
    color: #317BB7;
}

/* ------------------- Help Tab ----------------------*/
.dccw-boxu.faq-viewer .hierarchy-browser .topic-container {
    padding: 20px 0;
}

.dccw-boxu.faq-viewer .hierarchy-browser ul {
    /*max-width: 640px;*/
}

.dccw-boxu.faq-viewer ul.hierarchy-list li {
    text-align :left;
    /*height:30px;*/
    padding: 5px 0;
    overflow :visible;
}

.dccw-boxu.faq-viewer ul.hierarchy-list li .leftcol {
    /*padding-right:10px;*/
    float: left;
    width: 50%;
}

.dccw-boxu.faq-viewer ul.hierarchy-list li .rightcol .dropdown-size {
    max-width: 250px;
    padding-left: 15%;
}
.dccw-boxu.faq-viewer ul.hierarchy-list li .rightcol {
    float: left;
    width: 50%;
}
.dccw-boxu.faq-viewer ul.hierarchy-list li .rightcol select {
    width: 100%;
}

.dccw-boxu.faq-viewer ul.hierarchy-list li select {
    border-top:2px solid #7a7877;
    border-right:2px solid #cccccc;
    border-bottom:2px solid #ffffff;
    border-left:2px solid #6c6969;
   
}

.dccw-boxu.faq-viewer ul.hierarchy-list span {
    color: black;
    font-weight:bold;
}

@media screen and (max-width: 630px) {
    .dccw-boxu.faq-viewer .header-container .tab-section{
        float: none;
        width: 80%;
        padding-bottom: 8px;
    }
    .dccw-boxu.faq-viewer .header-container .search-panel{
        float: none;
        width: 80%;
    }
    .dccw-boxu.faq-viewer .header-container .search-panel .search-textbox{
        margin: 0;
        width: 97.5%;
        max-width: none;
    }

    .dccw-boxu.faq-viewer ul.hierarchy-list li .leftcol {
        float: none;
    }
    .dccw-boxu.faq-viewer ul.hierarchy-list li .rightcol {
        float: left;
    }
    .dccw-boxu.faq-viewer ul.hierarchy-list li .rightcol .dropdown-size {
        padding: 0;
    }

    /*TODO Shift to Hierarchy section of css*/
    .dccw-boxu.faq-viewer .hierarchy-browser .topic-container {
        padding-top: 0;
    }

    .dccw-boxu.faq-viewer .hierarchy-browser .topic-container .hierarchy-list > li {
        padding-bottom: 20px;
    }
    .dccw-boxu.faq-viewer .hierarchy-browser .topic-container .hierarchy-list .leftcol {
        width: 75%;
    }
    .dccw-boxu.faq-viewer .hierarchy-browser .topic-container .hierarchy-list .rightcol {
        width: 80%;
    }
    .dccw-boxu.faq-viewer .hierarchy-browser .topic-container .hierarchy-list .rightcol .dropdown-size{
        width: 97.5%;
        max-width: none;
    }
}

@media screen and (max-width: 430px) {
    .dccw-boxu.faq-viewer .header-container .tab-section {
        padding: 0;
        width: 100%;
    }
    .dccw-boxu.faq-viewer .header-container .tab-section > div {
        float: none;
        padding-bottom: 8px;
        width: 100%;
    }
    .dccw-boxu.faq-viewer .header-container .tab-section > div > a {
        width: 100%;
        max-width: none;
    }
    .dccw-boxu.faq-viewer .header-container .search-panel{
        width: 100%;
    }
    .dccw-boxu.faq-viewer .header-container .search-panel .search-textbox{
        width: 100%;
    }


    /*TODO Shift to Hierarchy section of css*/
    .dccw-boxu.faq-viewer .hierarchy-browser .topic-container .hierarchy-list .leftcol {
        width: 100%;
    }
    .dccw-boxu.faq-viewer .hierarchy-browser .topic-container .hierarchy-list .rightcol {
        width: 100%;
    }
    .dccw-boxu.faq-viewer .hierarchy-browser .topic-container .hierarchy-list .rightcol .dropdown-size{
        width: 100%;
    }
}
/* ------------------- Topic Browse Tab ----------------------*/
.dccw-boxu.faq-viewer div.glossary-container {
    padding: 12px 4px 14px 8px;
}

.dccw-boxu.faq-viewer div.glossary-container ul {
    list-style-type:none;
    margin:0;
    padding:0;
    height:25px;
}

.dccw-boxu.faq-viewer div.glossary-container ul li {
    float:left;
    margin-right: 10px;
}

.dccw-boxu.faq-viewer div.glossary-container ul li.selectedLetter {
    color: black;
    font-weight:bold;
}

.dccw-boxu.faq-viewer div.glossary-container ul li.unselectedLetter a {
    color: #3483C5;
}
.dccw-boxu.faq-viewer div.glossary-container ul li.unselectedLetter a:hover {
    cursor: pointer;
}

.dccw-boxu.faq-viewer div.glossary-container ul li.inactive {
   color: lightgrey;
}

.dccw-boxu.faq-viewer ul.glossary-list {
    list-style-type:none;
    margin:0;
    padding:0;   
}

.dccw-boxu.faq-viewer ul.glossary-list li {
    padding:2px 30px 2px 21px;
    line-height:30px;
}
.dccw-boxu.faq-viewer ul.glossary-list>li {
    font-size: 1.0769em;
}

.dccw-boxu.faq-viewer ul.glossary-list a.glossary-title {
    font-weight:bold;
}

.dccw-boxu.faq-viewer ul.glossary-list li.glossary-expand {
    margin:0 7px;
    border:1px solid #ebebeb;
    padding-left:0;
    padding-right:0;
    background-color:#ffffff;
}

.dccw-boxu.faq-viewer ul.glossary-list li.glossary-expand a.glossary-title {
    padding-left:13px;
}

.dccw-boxu.faq-viewer ul.glossary-topic-list {
    list-style-type:none;
    margin:0;
    padding:0;
    padding-left:2px;
    margin-top:5px;
}

.dccw-boxu.faq-viewer ul.glossary-topic-list li {
    padding: 20px 0 0 30px;
    font-weight: bold;
}

.dccw-boxu.faq-viewer .content-container li {
    clear: left;
}

/* ------------------- Feedback Form ----------------------*/
.dccw-boxu.faq-viewer .contact-form tr td {
    vertical-align :top;   
}
.dccw-boxu.faq-viewer .contact-form tr td + td{
    width: 300px;
}
.dccw-boxu.faq-viewer .contact-form-lf {
    padding-right: 10px;
    text-align: right;
}

.dccw-boxu.faq-viewer #faq-commentFormRendered tr{
    height: 30px;
}
.dccw-boxu.faq-viewer #faq-commentFormRendered .contact-form-buttons button{
    padding: 5px 10px;
    font-weight: bold;
}
.dccw-boxu.faq-viewer #faq-commentFormRendered .contact-form-buttons button.contact-form-cancel:hover{
    background-color: #EAEFF2;
}
.dccw-boxu.faq-viewer #faq-commentFormRendered .contact-form-buttons button.feedback-form-submit:hover{
    background-color: #CE007B;
    border: #CE007B solid 1px;
}
.dccw-boxu.faq-viewer #faq-commentFormRendered .contact-form-buttons button.contact-form-cancel:hover, 
.dccw-boxu.faq-viewer #faq-commentFormRendered .contact-form-buttons button.feedback-form-submit:hover{
    box-shadow: 0 1px 1px rgba(0,0,0,0.2);
}

.dccw-boxu.faq-viewer div.contact-form input,div.contact-form textarea {
    border:1px solid grey;
    width: 100%;
    min-width: 300px;
    padding: 0;
}
div.contact-form textarea {
    min-height: 100px;
}

.dccw-boxu.faq-viewer .mandatorysymbol {
    color:Red;
    font-weight:bold;   
}

.dccw-boxu.faq-viewer div.toggle .feedback-form-submit {
    background: #ee008c none repeat scroll 0 0;
    border: #ee008c solid 1px;
    float:left;
    margin-right: 8px;
}

.dccw-boxu.faq-viewer div.toggle .contact-form-cancel {
    float:left;
    background-color: white;
    border: solid 1px grey;
}

.dccw-boxu.faq-viewer label.error {
    color:Red;
    padding-left:5px;
}

.dccw-boxu.faq-viewer p.footer {
    padding-left: 15px;
    padding-top: 11px;
    padding-right:15px;
    padding-bottom:0;
    margin:0;
}

form.commentForm {
   height:230px;
}

/* -------------------------------- Displayed Answers -------------------------------*/
.dccw-boxu.faq-viewer .answerText {
    clear: both;
}
.dccw-boxu.faq-viewer .answerText ul {
    display: block;
    clear: both;
    padding: 0 0 20px 20px;
}
.dccw-boxu.faq-viewer div.answerText li{
    font-weight: normal;
    list-style-type: disc;
    float: none;
    padding: 5px 0;
    line-height: 25px;
}

.dccw-boxu.faq-viewer li .answerText h1,
.dccw-boxu.faq-viewer li .answerText h2,
.dccw-boxu.faq-viewer li .answerText h3,
.dccw-boxu.faq-viewer li .answerText h4,
.dccw-boxu.faq-viewer li .answerText h5,
.dccw-boxu.faq-viewer li .answerText h6 {
   /*Remove font size from all heading elements*/
   font-size: 1em;
   color: #333333;
   margin: 0;
   padding: 0;
}
.dccw-boxu.faq-viewer li .answerText p {
    margin: 0 0 15px 0;
    padding: 0;
    font-weight: normal;
}