@charset "UTF-8";

/* esp.css */

main, #modalMsg, #volcanoNames, #volcanoData, #volcanoEditor{
    /*font-family:Calibri,Helvetica,Verdana,Nimbus Sans L,sans-serif;*/
    font-size:0.85em;
    margin:0px;
    padding:0px;
    overflow-y:scroll;
    color:rgb(0,48,66);
    line-height: normal;
    }

h1, h2, h3, h4, p, li{
    margin:0;
    padding:5px;
    }

h1{	font-size:150%;}
h2{	font-size:135%; text-align: start;}
h3{	font-size:120%;}
h4{	font-size:100%;}
p, li{	font-size:100%;}

header {
    position: relative;
}

#names{width:calc(100% - 400px);background-color:#FFF;float:right;border-bottom:1px solid rgb(102,130,140);border-top:1px solid rgb(102,130,140);}
#filters{width:400px;height:640px;background-color:#FFF;float:left;border-top:1px solid rgb(102,130,140);border-bottom:1px solid rgb(102,130,140);}
#map{width:calc(100% - 400px);height:600px;background-color:#CCF;float:right;border-bottom:1px solid rgb(102,130,140);}
#info{width:100%;height:100px;background-color:#FFF;clear:both;}

#modalMsg{
    display:block;
    background-color:rgba(0,0,0,0.4);
    /* border:2px solid #000; */
    color:#FFF;
    position:absolute;
    top:0%;
    left:0%;
    right:0%;
    bottom:0%;
    z-index:9999;
    font-size:100%;
    padding:0px;
    margin:0px;
    }

#modalMsg{
    text-shadow: 2px 2px 4px #000;
    font-size:180%;
    padding:20% 0px;
    }

#modalMsg>h2{
    text-align:center;
}

#filters>h3{border-bottom:1px solid rgb(102,130,140);background-color:#EEE;cursor:pointer;}

#filters>h3>span{
    font-weight:normal;
    font-size:80%;
    display:inline-block;
    float:right;
    padding: 3px;
    }

#names>article>*{
    display:inline-block;
    margin:3px;
    }


#tabs>article>p.tabs{
    margin:0px;
    padding:0px;
    background-image:linear-gradient(180deg, #FFFFFF, #EEEEEE);
    }

#tabs>article>p.tabs>span{
    color:#246;
    background-color:#F1F1F1;
    display:inline-block;
    margin: 0px 8px;
    padding: 4px 8px;
    border:1px solid #CCC;
    border-bottom:none;
    cursor:pointer;
    border-top-left-radius:5px;
    border-top-right-radius:5px;
    }
#tabs>article>p.tabs>span:hover{
    background-color:#F1F1F1;
    border-color:#369;
    color:#369;
    }
#tabs>article>p.tabs>span.active{
    background-color:#FFF;
    }
#tabs>article>p.tabs>span.active:hover{
    background-color:#FFF;
    }

#filters>article{
    border-bottom:1px dotted rgb(102,130,140);
    }

#filters>article ul{
    display:block;
    margin:2px 2px;
    padding:0px;
    background-color:#FFF;
    list-style-type:none;
    }

#filters>article ul>li{
    margin:1px;
    padding:4px;
    background-color:#FFFFFF;
    }

 #filters>article#filter_region>ul>li{
    border-top:1px solid #CCC;
    }

#filter_region>ul>li>img{
    padding:2px;
    margin:2px;
    width:12px;
    border-radius:50%;
    cursor:pointer;

    }
#filter_region>ul>li>img:hover{
    }

#filter_region>ul>li>img.closed{
     transform: rotate(90deg);
    }

#filters>article ul>li>span{
    color:#900;
    display:inline-block;
    float:right;
    font-size:90%;
    }

#filters>article>ul>li>ul{
    margin:1px;
    }

#filters>article>ul>li>ul>li{
    /* display:none; */
    border-top:1px solid #CCC;
    padding-left:20px;
    }

#filters>article>ul>li>ul.closed>li{
    display:none;
    background-color:#FFFFCC;
    border-top:1px solid #CCC;
    }

#filters>article ul>li>label{display:inline-block;padding:2px 4px;}

#filters>article ul>li>input{}

#filters>article>ul{height:320px;overflow-y:scroll;}

#filters>article.open>p.summary{display:none;}
#filters>article.closed>p.summary{display:block;}

#filters>article.open>p.input{display:block;}
#filters>article.closed>p.input{display:none;}

#filters>article.open>h3, #filters>article.closed>h3{
    background-repeat:no-repeat;
    background-position:2px 50%;
    padding-left:30px;
    }

#filters>article>h3>img, #filter_text>p>img{
    float:right;
    background-color:#FFF;
    padding:2px;
    margin:2px;
    width:18px;
    border-radius:5px;
    cursor:pointer;
    border:1px solid #EEE;
    opacity:0.5;
    }

/*#filters>article>h3>img.clearIcon{width:18px;}*/


#filterTxt{ padding:2px 5px;margin:0px;}

#filters>article>h3>img:hover, #filter_text>p>img:hover{
    opacity:1;
    border:1px solid rgb(206,196,169);
    }



#filter_text>p>img{ margin:1px; }

#filters>article>h3{background-color:#FFF;cursor:pointer;}
#filters>article.open>h3{background-image:url(/images/ui/small/minus.png);}
#filters>article.closed>h3{background-image:url(/images/ui/small/plus.png);}

#filters>article.open>ul{display:block;clear: both;}
#filters>article.closed>ul{
 display:none;
}

#filters>article.closed>h3>img.sortIcon{display:none;}


#filter_downloads>p.summary{
    background-color:#FAFAFA;
    margin:2px;
    cursor:pointer;
    }
#filter_downloads>p.summary:hover{
    background-color:#AAD3DF;
    }

img.downloadIcon{
    width:24px;
    margin:1px 4px;
    }



#volcanoNames, #volcanoData, #volcanoEditor{
    position:absolute;
    background-color:#FFF;
    display:block;
    margin:0px;
    padding:0px;
    height:200px;
    z-index:999;
    }

#volcanoNames{
    top:196px;
    width:400px;
    left:480px;
    height:430px;
    overflow-y:scroll;
    background-color:#FFF;
    border:1px solid #DDD;
    box-shadow: 2px 2px 4px #444;
    }

#volcanoNames.closed, #volcanoData.closed, #volcanoEditor.closed{
    display:none;
    }

#volcanoNames>p{border-bottom:1px solid #CCC;background-color:#FFF;}
#volcanoNames>p:hover{background-color:#EEE;}
#volcanoNames>p>strong{color:#900;}

#volcanoData, #volcanoEditor{
    top:196px;
    left:0px;
    width:400px;
    height:600px;
    border-right:1px solid #DDD;
    }

#volcanoData>table, #volcanoEditor>table{margin:2px auto;width:97%;}

#volcanoData>table th,#volcanoData>table td, #volcanoEditor>table th, #volcanoEditor>table td{
    margin:0px;
    padding:3px 5px;
    }

#volcanoEditor>table td>input{width:15em;}
#volcanoEditor>table td>input#new_eruptionDesc{width:95%;}
#volcanoEditor>table td>input#new_HAV_KM{width:4em;}
#volcanoEditor>table td>input#new_D_HR{width:4em;}
#volcanoEditor>table td>input#new_M_KGS{width:4em;}
#volcanoEditor>table td>input#new_V_KMS{width:4em;}
#volcanoEditor>table td>input#new_MFS{width:4em;}

#volcanoData>table>caption, #volcanoEditor>table>caption{
    font-size:120%;
    border-bottom:1px solid #CCC;
    text-align:left;
    padding:3px 5px;
    background-color:#EEE;
    caption-side: initial;
    }

#volcanoData>table>caption>img{
    border:1px solid #DDD;
    background-color:#FFF;
    padding:2px;
    cursor:pointer;
    width:18px;
    opacity:0.5;
    }

#volcanoData>table>caption>img:hover{
    background-color:#FFF;
    opacity:1;
    border:1px solid rgb(206,196,169);
    }

#volcanoData>table th, #volcanoEditor>table th{border-bottom:1px solid #CCC;text-align:left;}
#volcanoData>table td, #volcanoEditor>table td{border-bottom:1px solid #CCC;text-align:left;}

#volcanoData>table th>em{font-weight:normal;}


#volcanoMap{
    margin:0px;
    padding:0px;
    width:100%;
    height:600px;
    background-color:#AAD3DF;
    }


#editBtn, #cancelBtn, #sendBtn, #downloadBtn, #resetBtn{
    color:#FFF;
    margin:5px;
    padding:5px 10px;
    font-weight:bold;
    border:none;
    box-shadow: 2px 2px 4px #666;
    opacity:0.9;
    }
#editBtn, #resetBtn{background-image:linear-gradient(0deg, #006, #009);}
#cancelBtn{background-image:linear-gradient(0deg, #600, #900);}
#sendBtn, #downloadBtn{background-image:linear-gradient(0deg, #060, #090);}

#editBtn:hover, #cancelBtn:hover, #sendBtn:hover{
    box-shadow: 1px 1px 2px #222;
    opacity:1.0;
    }

/* ====== */


#siGVPinfo{
    background-color:#222;
    color:#FFF;
    display:block;
    clear:both;
    margin:0px;
    /* margin-left: 400px; */
    padding:0px;
    }

#siGVPinfo.closed{
    display:none;
    }

#siGVPinfo>h3{background-color:#111;}
#siGVPinfo>h3>a{color:#FFFFFF;}
#siGVPinfo>h3>strong{color:#FD9;}
#siGVPinfo>figure{padding:0px;margin:0px;}
#siGVPinfo>figure>img{width:200px;float:left;margin:10px;border:1px solid #FFF;}
#siGVPinfo>figure>figcaption{padding:10px;margin-left:200px;}
#siGVPinfo>figure>figcaption>*{
    display:block;
    margin:0px;
    padding:5px 10px;
    }




/* #filters > article ul#filterVolcanoType > li{
    padding-left:20px;
    }
#filterVolcanoType > li{
    background-image:url(/images/mapIcons/red.png);
    background-repeat:no-repeat;
    background-size:auto 75%;
    background-position:2px 50% ;
    }

#filterVolcanoType>li:nth-child(1){background-image:none;}
#filterVolcanoType>li:nth-child(2){background-image:url(/images/mapIcons/blue.png);}
#filterVolcanoType>li:nth-child(3){background-image:url(/images/mapIcons/orange.png);}
#filterVolcanoType>li:nth-child(4){background-image:url(/images/mapIcons/yellow.png);}
#filterVolcanoType>li:nth-child(5){background-image:url(/images/mapIcons/cream.png);}
#filterVolcanoType>li:nth-child(6){background-image:url(/images/mapIcons/gray.png);}
#filterVolcanoType>li:nth-child(7){background-image:url(/images/mapIcons/green.png);}
#filterVolcanoType>li:nth-child(8){background-image:url(/images/mapIcons/purple.png);}
#filterVolcanoType>li:nth-child(9){background-image:url(/images/mapIcons/lime.png);}
#filterVolcanoType>li:nth-child(26){background-image:url(/images/mapIcons/gray.png);} */

#map_key{
    display:block;
    clear:both;
    text-align:center;
    float: right;
    /*border-bottom:1px solid rgb(102,130,140);*/
    }
#map_key>*{
    display:inline-block;
    }
#map_key>h3{
    }
#map_key>p{
    }

#map_key>p>span{
    /* background-color:#F1F1F1;
    border:1px solid #CCC; */
    display:inline-block;
    padding:2px 4px;
    margin:0px 1px;
    }

#map_key>p>span>img{
    width:16px;
    }

#about{
    position:absolute;
    top:216px;
    left:8px;
    right:8px;
    /* min-height:400px;
    overflow-y:scroll;*/
    padding:4px;
    margin:0px;
    border:1px solid rgb(102,130,140);
    border-top:1px solid #F1F1F1;
    background-color:#FFF;
    z-index:9999;
    padding-bottom: 20px;
    /* box-shadow: 2px 2px 4px #444; */
    }

#about>article>table{margin:2px auto; width:95%; border-left:1px solid rgb(102,130,140);background-color:#FFF;}
#about>article>table>caption{text-align:left;padding:5px;caption-side:bottom;}
#about>article>table>thead>tr>th{background-color:rgb(102,130,140);color:#FFF;text-align:left;}
/*#about>article>table>tbody>tr:nth-child(odd)>td{background-color:#EEE;}
#about>article>table>tbody>tr:nth-child(even)>td{background-color:#FFF;}*/

#about>article>table>tbody>tr>td,#about>article>table>thead>tr>th{
    border-right:1px solid rgb(102,130,140);
    border-bottom:1px solid rgb(102,130,140);
    padding:2px 4px;
    }

#about>article>ol{margin-left:20px;}
#about>article li{padding:1px 4px;}


.marker-cluster-small {
    background-color: rgba(241, 211, 87, 0.6);
    }
.marker-cluster-small div {
    background-color: rgba(240, 194, 12, 0.6);
    }

.marker-cluster-medium {
    background-color: rgba(241, 211, 87, 0.6);
    }
.marker-cluster-medium div {
    background-color: rgba(240, 194, 12, 0.6);
    }

.marker-cluster-large {
    background-color: rgba(241, 211, 87, 0.6);
    }
.marker-cluster-large div {
    background-color: rgba(240, 194, 12, 0.6);
    }
