/* 
    Document   : map
    Created on : 13/10/2014, 16:41:37
    Author     : matheusnic
    Description:
        Purpose of the stylesheet follows.
*/

.content.map{
    padding: 0px;
}

#mapContainer{
    display: block;
}

/* Map Canvas */
#map_canvas{
}

#map_canvas img{
    max-width: none !important; /* Para controles do Google Maps */
}

/* Map Control Components */
#map_canvas div.controlDiv{
    padding: 5px;
}

.containerTitle{
    background-color: #FFF;
    border-style: solid;
    border-width: 1px;
    border-color: rgba(0, 0, 0, 0.2);
    padding: 4px;
    position: relative;
    float: left;
}

.containerTitleContent{
    font-weight: 500;
}

.itemContainer{
    max-width: 250px;
}

#allItemsContainer{
}

/* Title Bars */
.titleBar{
    clear: both;
    white-space: nowrap;
}

.titleBar .titleItem, .attributeItem .titleItem{
    background-color: #FFFFFF;
    border-style: solid;
    border-width: 1px;
    border-color: rgba(0, 0, 0, 0.2);
    display: inline-block;
    padding: 4px;
    margin-bottom: 2px;
    margin-right: 2px;
}

.attributeItem .titleItem{
    float: none;
    margin-right: 0px;
}

.clickable{
    cursor: pointer;
}

.rangeContainer{
    max-width: 460px;
    display: inline-block;
}

.rangeItemContainer{
}

.rangeItem.range{
    border-style: solid;
    border-width: 1px;
    border-color: rgba(0, 0, 0, 0.2);
    padding: 4px;
    white-space: nowrap;
}

.range .displayContent{
    display: inline-block;
}

.range .rank{
    width: 30px;
    height: 10px;
    display: inline-block;
    margin-right: 5px;
}

.range.rank0 .rank{
    background-color:  #0028FF;
}

.range.rank1 .rank{
    background-color:  #2428DB;
}

.range.rank2 .rank{
    background-color:  #4828B7;
}

.range.rank3 .rank{
    background-color:  #6C2893;
}

.range.rank4 .rank{
    background-color:  #90286F;
}

.range.rank5 .rank{
    background-color:  #B4284B;
}

.range.rank6 .rank{
    background-color:  #FF2800;
}

.range.rank7 .rank{ /* All Values */
    background: rgb(0, 204, 172); /* Old browsers */
    /*background: -moz-linear-gradient(left, rgb(0, 49, 204) 0%, rgb(0, 204, 172) 100%); /* FF3.6 */
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgb(0, 49, 204)), color-stop(100%,rgb(0, 204, 172))); /* Chrome,Safari4 */
    /*background: -webkit-linear-gradient(left, rgb(0, 49, 204) 0%,rgb(0, 204, 172) 100%); /* Chrome10,Safari5.1 */
    /*background: -o-linear-gradient(left, rgb(0, 49, 204) 0%,rgb(0, 204, 172) 100%); /* Opera 11.10 */
    /*background: -ms-linear-gradient(left, rgb(0, 49, 204) 0%,rgb(0, 204, 172) 100%); /* IE10 */
    /*background: linear-gradient(left, rgb(0, 49, 204) 0%,rgb(0, 204, 172) 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='rgb(0, 49, 204)', endColorstr='rgb(0, 204, 172)',GradientType=1 ); /* IE6-9 */
        
/*    background: -moz-linear-gradient(left, #adedad 14%,#dce8bc 28%,#fce8b5 42%,#fbce81 56%,#eeb49f 70%,#dbb9ee 84%,#b6dbed 100%);  FF3.6 
    background: -webkit-linear-gradient(left, #adedad 0%, #adedad 14%,#dce8bc 28%,#fce8b5 42%,#fbce81 56%,#eeb49f 70%,#dbb9ee 84%,#b6dbed 96%, #b6dbed 100%);  Chrome10,Safari5.1 
    background: -o-linear-gradient(left, #adedad 0%, #adedad 14%,#dce8bc 28%,#fce8b5 42%,#fbce81 56%,#eeb49f 70%,#dbb9ee 84%,#b6dbed 96%, #b6dbed 100%);  Opera 11.10 
    background: -ms-linear-gradient(left, #adedad 0%, #adedad 14%,#dce8bc 28%,#fce8b5 42%,#fbce81 56%,#eeb49f 70%,#dbb9ee 84%,#b6dbed 96%, #b6dbed 100%);  IE10 
    background: linear-gradient(left, #adedad 0%, #adedad 14%,#dce8bc 28%,#fce8b5 42%,#fbce81 56%,#eeb49f 70%,#dbb9ee 84%,#b6dbed 96%, #b6dbed 100%);  W3C */
    
    background: -moz-linear-gradient(left, #0028FF 14%,#2428DB 28%,#4828B7 42%,#6C2893 56%,#90286F 70%,#B4284B 84%,#FF2800 100%); /* FF3.6 */
    background: -webkit-linear-gradient(left, #0028FF 0%, #0028FF 14%,#2428DB 28%,#4828B7 42%,#6C2893 56%,#90286F 70%,#B4284B 84%,#FF2800 96%, #FF2800 100%); /* Chrome10,Safari5.1 */
    background: -o-linear-gradient(left, #0028FF 0%, #0028FF 14%,#2428DB 28%,#4828B7 42%,#6C2893 56%,#90286F 70%,#B4284B 84%,#FF2800 96%, #FF2800 100%); /* Opera 11.10 */
    background: -ms-linear-gradient(left, #0028FF 0%, #0028FF 14%,#2428DB 28%,#4828B7 42%,#6C2893 56%,#90286F 70%,#B4284B 84%,#FF2800 96%, #FF2800 100%); /* IE10 */
    background: linear-gradient(left, #0028FF 0%, #0028FF 14%,#2428DB 28%,#4828B7 42%,#6C2893 56%,#90286F 70%,#B4284B 84%,#FF2800 96%, #FF2800 100%); /* W3C */
}

/* SearchBox */
.controlUI{
    padding: 5px;
    background-color: #FFFFFF;
    border-style: solid;
    border-width: 1px;
    border-color: rgba(0, 0, 0, 0.2);
    text-align: left;
    width: 100%;
    height: 100%;
}

#searchBox{
    width: 250px;
    height: 35px;
}

#statsDiv{
    position: absolute;
}

/* ASN Selector */
#asnSelectorContainer{
    width: 250px;
}

.asnItem{
    float:left;
    color: #000;
    background-color: #FFF;
    border-color: rgba(0, 0, 0, 0.2);
    border-width: 1px;
    border-style: solid;
    padding: 5px;
    /*width: 48px;*/
    /*cursor: pointer;*/
}

#asnItemContainer{
    position: relative;
    float: left;
}

#map_canvas .selectedDivContainer{
    position: relative;
    float: left;
}

/* Specific for selection components */
#networkTypeItemContainer {
    left: 45px;
    position: absolute;
}

#attributeItemContainer {
    left: 87px;
    position: absolute;
}

#rangeItemContainer {
    left: 144px;
    position: absolute;
}

#pmtSelectItemContainer{
    position: absolute;
}

#stateSelectItemContainer{
    position: absolute;
    max-height: 200px;
    overflow: scroll;
}

.networkTypeItem, .attributeItem, .rangeItem{
}

.withBorder{
    background-color: #FFF;
    border-color: rgba(0, 0, 0, 0.2);
    border-width: 1px;
    border-style: solid;
    padding: 5px;
}

.withBorder:hover{
    border-color: rgba(0, 0, 0, 1);
}

.withBorder.selected, .withBorder.selected.enabled{
    background-color: #FFFFAA;
}

.stateStatisticItem{
    white-space: nowrap;
}

.graphModalSection{
    padding: 5px;
    background-color: rgb(240, 240, 240);
    margin-bottom: 5px;
}

.buttonContainer{
}

.graphButton{
    display: inline-block;
    margin-right: 2px;
    margin-bottom: 2px;
}

.graphButton.disabled{
    background-color: #AAA;
    cursor: initial;
}

.graphButton.enabled{
    background-color: #FFF;
    cursor: pointer;
}

#graphDivContainer{
    height: 60%;
}

#graphDiv{
    height: 100%;
}

#attributeSelector {
}

.asnSummary{
    display: block;
    margin-right: 2px;
    margin-bottom: 2px;
}

.menuButton{
    overflow: hidden;
}

.hideableMenu2, .hideableMenu{
    display: inline-block;
}

.hideableMenu2{
    overflow: hidden;
}

div.centered {
    display: block;
    margin-left: auto;
    margin-right: auto;
    border-radius: 5px;
    padding: 10px;
}

div.centered img{
    display: block;
    margin-left: auto;
    margin-right: auto;
    clear: both;
}

p.centered {
    text-align: center;
    white-space: nowrap;
}