﻿/* Sharegraph ***************************************************/

#periods div {
    margin: 0!important;
    float: left;
    padding: 7px;
    background-color: #eaeaea;
    border-right: 1px solid #FFF;
    color: #333;
    cursor: pointer;
}

#periods {
    margin-left: 10px;
    width: 50%;
    display: inline-block;
    z-index: 1000;
    margin-bottom: -38px;
    position: relative;
}

#periods div:hover {
    background-color: #FFF;
}

label {
    display: inline-block;
    min-height: 20px;
    padding-left: 20px;
    margin-bottom: 0;
    font-weight: normal;
}

label > input {
    margin: 0 5px;
    margin-left: -20px;
}

.excel-download {
    padding-top: 10px;
}
.excel-download a {
    color: #666;
    vertical-align: top;
    text-decoration: none;
}



#cision-websolution-container {

    background-color: #fff;
}

#container {
    height: 420px;
    width: 100%;
}

.actions {
    float: left;
    background-color: #CCC;
}
#tblNewShareholders {
    width: 100%;
}
#tblNewShareholders th, #tblShareSize th, #tblArea th, #tblLargest th, #tblAnnual th, #tblQuarterly th {
    color: #009DD9;
    text-align: left;
}
#tblNewShareholders tr:nth-child(even), #tblShareSize tr:nth-child(even), #tblArea tr:nth-child(even), #tblLargest tr:nth-child(even), #tblInsiderDetail tr:nth-child(even), 
#recommendations-history div:nth-child(even), #tblAnnual div:nth-child(even), #tblQuarterly div:nth-child(even), #tblInsider tr:nth-child(even) {
    background: #F3F4F4;
}

#tblShareSize, #tblLargest, #tblArea {
    width: 100%;
}

/* Information ***********************************************/

#info {
    padding: 0 1.5em 1em 1.5em;
    overflow: hidden;
    width: 100%;
}

#info  .info-input {padding-top: 10px;}

.infoHeader {
    background-color: #EBEBEB;
    border: 1px solid #BDBDBD;
    display: inline;
    padding: 1px 2px;
}

.column {
    width: 23%;
    float: left;
    padding-right: 10px;
}

.column:last-child {
    padding-right: 0;
}

.column h4 {
    height: 30px;
}

/* Share calculator ************************************************/

/*#shareHeader {
    width: 50%;
    margin-left: auto;
    margin-right: auto;
}*/

.sharecalclulator-container {
    /*width: 50%;
    margin-left: auto;
    margin-right: auto;*/
    clear: both;
}

.sharecalclulator-container input[type=radio] {
    margin: 4px 0 0;
    margin-left: -20px;
}

.sharecalclulator-container fieldset {
    margin-top: 5px;
    border: 1px solid #e5e5e5;
    border-radius: 4px;
    padding: 10px;
    clear: both;
}

.sharecalclulator-container legend {
    margin-bottom: 0px;
    color: #569fca;
    width: auto;
    border-bottom: none;
}

.sharecalclulator-container table td {
    padding: 4px 10px 4px 0px;
    width: 90px;
}

.sharecalclulator-container table th {
    text-align: left;
}

.sharecalclulator-container .fullsize {
    width: 100%;
}

.sharecalclulator-container .bold {
    font-weight: 700;
}

.sharecalclulator-container .amount {
    width: 100%;
}

.sharecalclulator-container .first {
    width: 200px;
}

.sharecalclulator-container .sharevalues .second {
    width: 180px;
}

.sharecalclulator-container .valuesSeparator {
    margin-top: 10px;
}

.sharecalclulator-container .helptext {
    font-style: italic;
    font-size: 13px;
}

.sharecalclulator-container #csvExport {
    margin-left: 10px;
}

.sharecalclulator-container .history-download {
    margin-top: 15px;
}

.sharecalclulator-container .compute-button {
    background-color: #569fca;
    border-color: #569fca;
    padding-left: 40px;
    padding-right: 40px;
    margin-top: 10px;
    clear: both;
}

.sharecalclulator-container #share-help-container {
    margin-top: 20px;
}

.sharecalclulator-container .results-right {
    width: 49%;
    float: left;
}

.sharecalclulator-container .results-left {
    width: 49%;
    float: left;
    margin-left: 10px;
    border-left: 1px solid #e5e5e5;
}

.sharecalclulator-container .border {        
    margin-left: 10px;        
}

.sharecalclulator-container h4 {        
    margin-bottom: 5px;        
}


/*==================================================
=                  Media Queries                   =
==================================================*/

@media screen and (max-width: 640px) {

    #periods {
        width: 60%;
    }

    .responsive-break {
        clear: both;
    }

    .column {
        height: 100px;
        margin-bottom: 20px;
        width: 45%;
    }

    .column h4 {
        height: auto;
    }

    .highcharts-input-group { display: none;}
}


@media screen and (min-width: 640px) and (max-width: 850px){
      #periods {
            width: 40%;
        }
        .responsive-break {
            clear: both;
        }
        .column {
                height: 100px;
            margin-bottom: 20px;
            width: 45%;
        }
        .column h4 {
            height: auto;
        }
    }

@media all and (min-width: 850px) and (max-width: 1100px) {
        .responsive-break {
            display: none;
        }
        /*.responsive-break {
            clear: both;
        }*/
        .column {
                height: 100px;
            margin-bottom: 20px;
            width: 45%;
        }
        #periods {
            width: 30%;
        }
        .column h4 {
            height: auto;
        }
    }
