body {
    font : normal  12px;
    font-family : "Liberation Sans", Arial, Helvetica, sans-serif;
    height : 100%;
    margin : 0;
    padding : 0;
    text-align : center;
    width : 100%;
/* 
    padding-top: 26px;
    padding-bottom: 51px;
 */
}

a, a:visited {
                   color : #2d8b8c;
         text-decoration : none;
}
a:hover, a:active {
                   color : #f90;
                  cursor : pointer;
}

ul,li {
         list-style-type : none;
}

#wrapper{
    /*margin : 20px;*/
    text-align : left;
    /*width : 920px;*/
	width : 100%;
	height : 100%;
}

.wrapper_e_M{
    margin: 0px; 
    text-align : left;
    width : 720px;
}

.wrapper_e_L{
    margin: 0px; 
    text-align : left;
    width : 962px;
}

/* ------------------ */
/*      PAGE CSS      */
/* ------------------ */
#page {
    z-index: 1;
    /*width: 960px;
    height: 880px;*/
	height : 100%;
    width : 100%;
    /*background-image: none;
    border-width: 1px;
    border-style: solid;
    border-color: #000000;
    background-color: #FFFFFF;*/
    /*padding-bottom: 0px;
    margin-left: auto;
    margin-top:20px;*/
    /*margin-bottom:20px;*/
    /*margin-right: auto;*/
}

.page_e_M {
    z-index: 1;
    width: 720px;
    height: 540px;
    background-image: none;
    background-color: #FFFFFF;
    /*padding-bottom: 0px;
    margin-left: auto;
    margin-top:20px;
    margin-right: auto;*/
}

.page_e_L {
    z-index: 1;
    width: 962px; /*960px;*/
    height: 710px;
    background-image: none;
    /*border-width: 1px;
    border-style: solid;
    border-color: #000000;*/
    background-color: #FFFFFF;
    /*padding-bottom: 0px;
    margin-left: auto;
    margin-top:20px;*/
    /*margin-bottom:20px;*/
    /*margin-right: auto;*/
}

/* ------------------ */
/*      MAP CSS       */
/* ------------------ */
#map {
   clear : both;
   left : 20px;                    
   /*width : 920px;
   height : 610px;*/
   width : 100%;
   height : 100%;
}

.map_e_M {
   clear : both;
   left : 20px;                    
   width : 720px;
   height : 500px;
}

.map_e_L {
   clear : both;
   left : 20px;                    
   width : 962px;
   height : 670px;
}

/* ------------------ */
/*      MAIN CSS      */
/* ------------------ */
#main {
    float : left;
    /*height : 610px;
    width : 920px;*/
    /*height : 100%;*/
    width : 100%;
    top: 72px;
    bottom: 0px;
}

.main_e_M {
    float : left;
	width : 720px;
    height : 500px;
    /*height : 100%;
    width : 100%;*/
}

.main_e_L {
    float : left;
    width : 962px;
	height : 670px;
    /*height : 100%;
    width : 100%;*/
}

/*
#EmbedLink {
	padding: 0;
	margin: 1px 0 1px 5px;
	height: 15px;
	background-image: url("../img/link_button_bg.png");
}

#EmbedLink span {
	margin: 0 5px 0 20px;
	padding: 0;
}
*/

/*YEARS SELECTION STYLE*/

#selectionYears{
    width:100%;
    color: #FFFFFF;    
    font-weight: 400;
    position:relative;    
    background-color: #57BCE6;    
    background-color: rgba(41, 171, 226, 0.6);
    margin: 0 0;
    height:13px;
    font-size: 12px;
    font-family: asap, sans-serif;
    font-style: normal;
    cursor:pointer;
    padding-left: 5px;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-right:0px;
}

#selectionYears:hover{
    background-color: #71BFE0;
    background-color: rgba(41, 171, 226, 0.4);
}
#selectionYears.open{
    background-color: #57BCE6;
    background-color: rgba(41, 171, 226, 0.6);
}

#yearsContent{
    background-color: #F9F9F9;
    background-color: rgba(255, 255, 255, 0.8);
    height:0px;
    width:100%;
    overflow:hidden;
    font-family:  Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: 400;
    margin-bottom:4px;
}
#yearsContent div{
    /*width:95px;
    margin-left:50px;*/
    float:left;
}
/*#yearsContent p{
    padding:3px;
    margin:0;
}*/

/*RFB SELECTION STYLE*/

#selectionRFB{
    width:100%;
    color: #FFFFFF;    
    font-weight: 400;
    position:relative;    
    background-color: #57BCE6;    
    background-color: rgba(41, 171, 226, 0.6);
    margin: 0 0;
    height:13px;
    font-size: 12px;
    font-family: asap, sans-serif;
    font-style: normal;
    cursor:pointer;
    padding-left: 5px;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-right:0px;

}

#selectionRFB:hover{
    background-color: #71BFE0;
    background-color: rgba(41, 171, 226, 0.4);
}
#selectionRFB.open{
    background-color: #57BCE6;
    background-color: rgba(41, 171, 226, 0.6);
}


#RFBCombo {
    background-color: #F9F9F9;
    background-color: rgba(255, 255, 255, 0.8);
    height:0px;
    width:100%;
    overflow:hidden;
    font-family:  Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: 400;   
}

#selectRFB .x-panel-body{
    background: transparent !important;
    background-color: rgba(0, 0, 0, 0);   
}

#selectRFB .x-column{
    margin-top: 3px;
    margin-left: 6px;
}
#selectRFB .x-form-cb-label{
    margin-left: 2px;
    color: #000000;
    font-family:  Arial, Helvetica, sans-serif;
    overflow:hidden;
    font-size: 12px;
    font-weight: 400;   
}

/* change projection */
#lblSRS{
    width:100%;
    color: #FFFFFF;
    position:relative;
    background-color: #57BCE6;    
    background-color: rgba(41, 171, 226, 0.6);    
    margin: 0 0;
    height:13px;
    font-size: 12px;
    font-family: asap, sans-serif;
    font-weight: 400;
    font-style: normal;
    cursor:pointer;
    padding-left: 5px;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-right:0px;

}

#lblSRS:hover{    
    background-color: #71BFE0;
    background-color: rgba(41, 171, 226, 0.4);
}

#lblSRS.open{
    background-color: #57BCE6;
    background-color: rgba(41, 171, 226, 0.6);
}

#SelectSRS{
    background-color: #F9F9F9;
    background-color: rgba(255, 255, 255, 0.8);
    height:0px;
    width:100%;
    overflow:hidden;
    font-family:  Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: 400;   
}
#SelectSRS div{
    width:95px;
    float:left;
}
#SelectSRS p{
    padding:3px;
    margin:0;
}
#bottomLeftPanel{
    bottom:65px;
    width:200px;
    position:absolute;
    z-index:5000;
}

#bottomRightPanel {
    height:40px;
    width:155px;
    position: relative;
    display: table;
    margin-left:22px;    
    /*right: 380px;*/
    z-index: 5000;
    /*background-color: #57BCE6;    
    background-color: rgba(41, 171, 226, 0.6);*/
}
#bottomRightPanel div {
    float:left;
}

#yearLess{
    width: 42px;
    height: 40px;
    position: relative;
    text-align: left;
    background-image: url('../img/asaparrowleft.png');
    background-repeat:no-repeat;
    background-position: center center;
}

#yearLess:hover{
    width: 42px;
    height: 40px;
    position: relative;
    text-align: left;
    background-image: url('../img/asaparrowleft.png');
    background-repeat:no-repeat;
    background-position: center 46%;
}

#yearsLabel{
    width: 155px;
    height: 20px;
    text-align:center;
    position: relative; 
    font-size: 14px;
    font-family: asap, sans-serif;
    font-style: normal;    
    text-shadow: 1px 2px 2px #101010;
    color:#FFFFFF;
}

#yearCurrent{
    width: 69px;
    height: 40px;
    text-align:center;
    position: relative;    
    line-height: 40px;
    font-family: asap,sans-serif;
    font-size: 32px;
    font-weight: 400;
    text-shadow: 1px 2px 2px #101010;
    color:#FFFFFF;
}

#yearCurrent.ie {
    width: 70px;
    height: 40px;
    position: relative;    
    text-align:center;
    line-height: 40px;
    font-family: asap,sans-serif;
    font-size: 30px;
    font-weight: 400;
    color:#FFFFFF;
    zoom: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.DropShadow(Color=#868686, OffX=1, OffY=2)"; 
    filter: progid:DXImageTransform.Microsoft.DropShadow(OffX=1, OffY=2, Color=#868686);
}


#yearMore{
    width: 42px;
    height: 40px;
    position: relative;
    text-align: right;    
    background-image: url('../img/asaparrowright.png');
    background-repeat:no-repeat;
    background-position: center center;
}

#yearMore:hover{
    width: 42px;
    height: 40px;
    position: relative;
    text-align: right;     
    background-image: url('../img/asaparrowright.png');
    background-repeat:no-repeat;
    background-position: center 46%;
}

#yearLess, #yearCurrent, #yearCurrent.ie, #yearLess{
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: -moz-none;
    -ms-user-select: none;
    user-select: none;
}

.nobackground {
    background-image: none !important;
}

/* side panel */
#sidebar {
    border-left-color : #000;
    float : right;
    font-size :  12px;
    padding : 0;
    width : 275px;
    position:absolute;
    z-index:5000;
    top:0;right:0;
}
#sidebarP{
    overflow :  auto ;
}
#leftTopPan{
    -webkit-box-shadow: 0px 2px 5px -1px rgba(0, 79, 131, 0.5);
    box-shadow: 0px 2px 5px rgba(0, 79, 131, 0.5);
    border-color: #000000;
    background-color: #57BCE6;
    background-color: rgba(41, 171, 226, 0.5);
    height:82px;

}
#searchtextwrapper{
    background:url(../img/searchsimplebox.png) no-repeat;
    padding-top: 13px;
    margin-top:0px;
    padding-left:15px;
    padding-bottom:30px;
    margin-bottom:0px;
}
#leftTopPan div{
    margin-left: 20px;
}
#leftTopLinks{
    padding-left:15px;
    color: #FFFFFF;
    font-family: asap, sans-serif;
    font-size: 12px;
    font-weight: 400;
    position:relative;
    
}

#leftTopLinks a,#leftTopLinks a:hover{
    color: #FFFFFF;
    text-decoration:none;
}
#searchtext{

    background-color:transparent;
    border: 0px solid;
    height:20px;
    width:155px;
    padding-right:2px;
    padding-left:2px;

    color:#666;
}


#sidebarP{
    width:260px; 
	margin-left:12px;
    -webkit-box-shadow: 0px 2px 5px -1px rgba(0, 79, 131, 0.5);
    box-shadow: 0px 2px 5px rgba(0, 79, 131, 0.5);
}
#sidebar .x-panel-body{
    background: rgba(41, 171, 226, 0.5);
    font-weight:bold;
   
    border-color: #000000;
    background-color: #57BCE6;
    background-color: rgba(41, 171, 226, 0.5);
    background:linear-gradient(to bottom,rgba(41, 171, 226, 0.5) 70%,rgba(41, 171, 226, 0) ); 
}

#sidebar .x-panel-body .x-panel-body{
    background: transparent !important;
    font-weight:bold;
    
    
}
#simpleSearchButton{
    height: 25px;
    width: 29px;
    position: absolute;background:white;
    -/* IE 8 */
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  /* IE 5-7 */
  filter: alpha(opacity=0);
  /* Netscape */
  -moz-opacity: 0;
  /* Safari 1.x */
  -khtml-opacity: 0;

  /* Good browsers */
  opacity: 0;
    
    top: 10px;
    left: 174px;
    cursor: pointer;
    margin: 0;
}
.xbutton-closepanels{
    position:absolute;
    right:10px;
    top:-3px;
    width:21px;
    height:21px;
    cursor:pointer;
    background:url('../img/xbutton.png');
    float:right;

}
#sidebar .legend {
        margin : .5em;
}
#sidebar .legendTitle {
	font-weight: bold;
	padding: .5em 0;
}
#MemberCountries {
}

#top {
       background-repeat : no-repeat;
                   color : rgb(11, 50, 93);
                   float : left;
               font-size :  25px;
                  height : 120px;
             text-shadow : rgb(204, 204, 204)   2px   2px   2px;
          vertical-align : bottom;
                   width : 1024px;
}
#title {
                   color : #036;
                 display : block;
               font-size :  30px;
              font-style : normal;
             font-weight : bold;
                    left : 0.5em;
                  margin : 0;
                 padding : 0;
             text-shadow : #CCC   2px   2px   2px;
                     top : 0.5em;
}

#topBar {
	background-color: #57BCE6; 
	background-color: rgba(41, 171, 226, 0.5);
	/*background-color : rgb(51, 102, 153);*/
	/*background-color : rgb(24, 16, 86);*/
	/*background-image : url("../img/patternbanner.jpg");*/
	/*clear : both;
	color : black;
	font-size :  12px;*/
	/*height: 73px;*/
	/*margin-top :  2px;
	margin-bottom :  2px;
	padding-right :  10px;
	text-align : right;
	padding-top: 2px;
	padding-bottom: 2px;*/
}

#topBar a,
#topBar a:visited {
                   color : #fff;
                  cursor : pointer;
}
#topBar a:hover,
#topBar a:active {
                   color : #f90;
                  cursor : pointer;
}
#bottomBar1 {
	position: absolute;
	margin: 0 auto;
	width: 100%;
	opacity: .7;
	bottom: 10px;
	clear: both;
	color: black;
	font-size:  12px;
	font-weight: bold;
	line-height: 1.5em;              
	text-align: center;
	z-index:1000;
}

#bottomBar1_e {
	position: absolute;
	margin: 0 auto;
	width: 100%;
	opacity: .7;
	bottom: 10px;
	clear: both;
	color: black;
	font-size:  12px;
	font-weight: bold;
	line-height: 1.5em;              
	text-align: center;
	z-index:1000;
}

#bottomBar1 a, #bottomBar1 a:visited,
#bottomBar1_e a, #bottomBar1_e a:visited {
                   color : #000;
}
#bottomBar1 a:hover, #bottomBar1 a:active,
#bottomBar1_e a:hover, #bottomBar1_e a:active {
                    opacity:1;
                   color : #f90;
}
/*
#bottomBar2 {
            border-color : #693;
            border-right : 0 solid #693;
            border-style : solid;
            border-width :   1px 0 0;
                   clear : both;
                  height :   1px;
           margin-bottom :  30px;
              margin-top :   1px;
}
*/
/*
#disclaimer {
                   clear : both;
               font-size :  12px;
             padding-top :  55px;
                   width : 100%;
}
*/
#disclaimer{
	/*color: #FFFFFF;*/
    font-size: 10px;
    font-family: asap, sans-serif;
    font-weight: 400;
    width : 920px;
    margin-left: auto;
    margin-top:2px;
    margin-bottom:2px;
    margin-right: auto;
    top:-70px;
    position:relative;
    text-align:left;
}

.disclaimer_e_M{
    font-size: 10px;
    font-family: asap, sans-serif;
    font-weight: 400;
    width : 720px;
    /*margin-left: auto;*/
    margin-top:2px;
    margin-bottom:2px;
    /*margin-right: auto;*/
    top:-30px;
    position:relative;
    text-align:left;
}

.disclaimer_e_L{
	/*color: #FFFFFF;*/
    font-size: 10px;
    font-family: asap, sans-serif;
    font-weight: 400;
    width : 962px;
    /*margin-left: auto;*/
    margin-top:2px;
    margin-bottom:2px;
    /*margin-right: auto;*/
    top:-30px;
    position:relative;
    text-align:left;
}

#disclaimer p {
                 padding :   0px  10px;
}
#embed {
              border-top :   1px solid;
              margin-top :  20px;
}
#embed-code textarea {
                  height : 300px;
}
/*.embed-link {
                   color : black;
         text-decoration : underline;
}*/
.olControlLoadingPanel {
        background-image : url(../img/loading.gif);
     background-position : center;
       background-repeat : no-repeat;
                 width   : 100%;
                 height  : 100%;
}
.olControlMousePosition {
                  bottom :   0px;
                 display : block;
                    left :   9px;
                position : absolute;
}
.olControlAttribution {
                   color : Blue;
                 display : block;
               font-size :  12px !important;
              font-style : normal;
                    left :  50px;
                position : absolute;
                     top : 0.5em;
}
.olPoweredBy .olControlAttribution{
                   color : Blue;
                 display : block;
               font-size :  12px;
              font-style : normal;
                position : absolute;
}

.olFAOLogo{
    height:48px; /*60px;*/
    width:176px; /*56px;*/
	cursor: pointer;
}

.olFAOLogo_e{
	opacity: .6;
}


.FigisMapLegend {
              border-top :   1px solid;
                   clear : both;
               font-size :  12px;
             padding-top :  20px;
              text-align : left;
                   width : 100%;
}
.FigisMapLegend div {
                 display : inline;
            margin-right : 1em;
              text-align : center;
}
.FigisMapLegend div img {
            margin-right :   3px;
          vertical-align : middle;
}
#e-link {
        /*background-color : rgb(51, 102, 153);*/
        /*display : none;*/
        height : 100px;
        padding: .5em 0;
}
#e-link div {
        color : white;
        padding : .5em 0;
        text-align : center;
}
#e-link label {
        font-size :  10px;
}
#legend {
           margin-bottom :   0px;
}
.legend img {
          vertical-align : middle;
}
.olControlGraticuleActive svg g text * {
	font-size: 11px;
}
.olControlGraticuleActive svg g polyline {
	opacity: .7;
}
#custom-slider {
    /*width:810px;*/
    padding-top:15px;
    padding-bottom:15px;
    background-image:url(../img/ticks.gif);
}
#custom-slider .x-slider-thumb {
    background-image:url(../img/slider-thumb.png);
}

h3 {
    padding:15px 0 5px;
}

.year-max-largestep{
    background-image: url(../img/control_fastforward_blue.png) !important;
}

.year-min-littlestep{
    background-image: url(../img/resultset_previous.png) !important;
}

.year-min-largestep{
    background-image: url(../img/control_rewind_blue.png) !important;
}

.year-max-littlestep{
    background-image: url(../img/resultset_next.png) !important;
}

.first-year{
    background-image: url(../img/resultset_first.png) !important;
}

.last-year{
    background-image: url(../img/resultset_last.png) !important;
}
/* FeatureInfo */
.FeatureInfo{
	text-align: left;
	font: normal 14px tahoma,arial,helvetica,sans-serif;
	
}

.FeatureInfo ul{
	padding-left: 10px;
}

.FeatureInfo a{
	text-align:right;
}

.FeatureInfo .links {
	text-align:right;
}

/* button icons */
.icon-cancel{
	 background-image: url(../img/cancel.png) !important;
}
.icon-login{
	 background-image: url(../img/door_in.png) !important;
}
.icon-logout{
	 background-image: url(../img/door_out.png) !important;
}
.icon-user{
	 background-image: url(../img/user.png) !important;
}
.encounters-icon{
	background-image: url(../img/bullet_purple.png) !important;

}

.surveydata-icon{
	background-image: url(../img/bullet_red.png) !important;

}


.figisButton{

    background-repeat: no-repeat;
    width:90px;
    -moz-box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.5);
    -webkit-box-shadow: 0px 3px 3px -1px rgba(0, 0, 0, 0.5);
    box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.5);
    color:black;
	margin: 0px 12px 0px 12px;
    background-position: 3px 0px; /* equivalent to 'top left' */
    border: none;           /* assuming we don't want any borders */
    cursor: pointer;        /* make the cursor like hovering over an <a> element */
    height: 16px;
    padding:  2px ;
    text-align:center;/* make text start to the right of the image */
    vertical-align: baseline; /* align the text vertically centered */
    /*display:inline-block;*/
    -moz-border-radius: 15px;
    -webkit-border-radius: 15px;
    -khtml-border-radius: 15px;
    border-radius: 15px;
    font-size: 12px;
    text-align: center;
    font-family: asap, sans-serif;
    font-weight: 400;
    font-style: normal;
    background-color: #57BCE6; 
    background-color: rgba(41, 171, 226, 0.5);
    z-index:1050;
}

.figisButtonVME{
    background-repeat: no-repeat;
    width:90px;
    -moz-box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.5);
    -webkit-box-shadow: 0px 3px 3px -1px rgba(0, 0, 0, 0.5);
    box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.5);
    color:black;
	margin: 0px 12px 0px 12px;
    background-position: 3px 0px; /* equivalent to 'top left' */
    border: none;           /* assuming we don't want any borders */
    cursor: pointer;        /* make the cursor like hovering over an <a> element */
    height: 26px;
    padding:  2px ;
    text-align:center;/* make text start to the right of the image */
    vertical-align: baseline; /* align the text vertically centered */
    /*display:inline-block;*/
    -moz-border-radius: 15px;
    -webkit-border-radius: 15px;
    -khtml-border-radius: 15px;
    border-radius: 15px;
    font-size: 12px;
    text-align: center;
    font-family: asap, sans-serif;
    font-weight: 400;
    font-style: normal;
    background-color: #DFDFDF; 
    background-color: rgba(223, 223, 223, 0.4);
    z-index:1050;
}

.figisButtonOTHER{
    background-repeat: no-repeat;
    width:90px;
    -moz-box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.5);
    -webkit-box-shadow: 0px 3px 3px -1px rgba(0, 0, 0, 0.5);
    box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.5);
    color:black;
	margin: 0px 12px 0px 12px;
    background-position: 3px 0px; /* equivalent to 'top left' */
    border: none;           /* assuming we don't want any borders */
    cursor: pointer;        /* make the cursor like hovering over an <a> element */
    height: 30px;
    padding:  2px ;
    text-align:center;/* make text start to the right of the image */
    vertical-align: baseline; /* align the text vertically centered */
    /*display:inline-block;*/
    -moz-border-radius: 15px;
    -webkit-border-radius: 15px;
    -khtml-border-radius: 15px;
    border-radius: 15px;
    font-size: 12px;
    text-align: center;
    font-family: asap, sans-serif;
    font-weight: 400;
    font-style: normal;
    background-color: #DFDFDF; 
    background-color: rgba(223, 223, 223, 0.4);
    z-index:1050;
}

.figisButtonBOTTOM{
    background-repeat: no-repeat;
    width:90px;
    -moz-box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.5);
    -webkit-box-shadow: 0px 3px 3px -1px rgba(0, 0, 0, 0.5);
    box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.5);
    color:black;
	margin: 0px 12px 0px 12px;
    background-position: 3px 0px; /* equivalent to 'top left' */
    border: none;           /* assuming we don't want any borders */
    cursor: pointer;        /* make the cursor like hovering over an <a> element */
    height: 26px;
    padding:  2px ;
    text-align:center;/* make text start to the right of the image */
    vertical-align: baseline; /* align the text vertically centered */
    /*display:inline-block;*/
    -moz-border-radius: 15px;
    -webkit-border-radius: 15px;
    -khtml-border-radius: 15px;
    border-radius: 15px;
    font-size: 12px;
    text-align: center;
    font-family: asap, sans-serif;
    font-weight: 400;
    font-style: normal;
    background-color: #DFDFDF; 
    background-color: rgba(223, 223, 223, 0.4);
    z-index:1050;
}

.figisButtonToggleVME{
    background-repeat: no-repeat;
    width:90px;
    -moz-box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.5);
    -webkit-box-shadow: 0px 3px 3px -1px rgba(0, 0, 0, 0.5);
    box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.5);
    color:black;
	margin: 0px 12px 0px 12px;
    background-position: 3px 0px; /* equivalent to 'top left' */
    border: none;           /* assuming we don't want any borders */
    cursor: pointer;        /* make the cursor like hovering over an <a> element */
    height: 26px;
    padding:  2px ;
    text-align:center;/* make text start to the right of the image */
    vertical-align: baseline; /* align the text vertically centered */
    /*display:inline-block;*/
    -moz-border-radius: 15px;
    -webkit-border-radius: 15px;
    -khtml-border-radius: 15px;
    border-radius: 15px;
    font-size: 12px;
    text-align: center;
    font-family: asap, sans-serif;
    font-weight: 400;
    font-style: normal;
    background-color: #CE5956; 
    background-color: rgba(228, 69, 56, 0.8);
    z-index:1050;
}

.figisButtonToggleOTHER{
    background-repeat: no-repeat;
    width:90px;
    -moz-box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.5);
    -webkit-box-shadow: 0px 3px 3px -1px rgba(0, 0, 0, 0.5);
    box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.5);
    color:black;
	margin: 0px 12px 0px 12px;
    background-position: 3px 0px; /* equivalent to 'top left' */
    border: none;           /* assuming we don't want any borders */
    cursor: pointer;        /* make the cursor like hovering over an <a> element */
    height: 30px;
    padding:  2px ;
    text-align:center;/* make text start to the right of the image */
    vertical-align: baseline; /* align the text vertically centered */
    /*display:inline-block;*/
    -moz-border-radius: 15px;
    -webkit-border-radius: 15px;
    -khtml-border-radius: 15px;
    border-radius: 15px;
    font-size: 12px;
    text-align: center;
    font-family: asap, sans-serif;
    font-weight: 400;
    font-style: normal;
    background-color: #C3A546; 
    background-color: rgba(214, 164, 35, 0.8);
    z-index:1050;
}

.figisButtonToggleBOTTOM{
    background-repeat: no-repeat;
    width:90px;
    -moz-box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.5);
    -webkit-box-shadow: 0px 3px 3px -1px rgba(0, 0, 0, 0.5);
    box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.5);
    color:black;
	margin: 0px 12px 0px 12px;
    background-position: 3px 0px; /* equivalent to 'top left' */
    border: none;           /* assuming we don't want any borders */
    cursor: pointer;        /* make the cursor like hovering over an <a> element */
    height: 26px;
    padding:  2px ;
    text-align:center;/* make text start to the right of the image */
    vertical-align: baseline; /* align the text vertically centered */
    /*display:inline-block;*/
    -moz-border-radius: 15px;
    -webkit-border-radius: 15px;
    -khtml-border-radius: 15px;
    border-radius: 15px;
    font-size: 12px;
    text-align: center;
    font-family: asap, sans-serif;
    font-weight: 400;
    font-style: normal;
    background-color: #59D26A; 
    background-color: rgba(80, 219, 80, 0.8);
    z-index:1050;
}

#sidebar .figisButton .x-btn-tl,#sidebar .figisButton .x-btn-tr,#sidebar .figisButton .x-btn-tc,
#sidebar .figisButton .x-btn-ml,#sidebar .figisButton .x-btn-mr,#sidebar .figisButton .x-btn-mc,
#sidebar .figisButton .x-btn-bl,#sidebar .figisButton .x-btn-br,#sidebar .figisButton .x-btn-bc{
    background:transparent;
    
}
#sidebar .figisButton{
    background-color: #17A2FF;
    background-color: rgba(23, 162, 255, 0.61);
    
    }
#sidebar .figisButton button{
    font-weight:bold;
}

.figisButton:hover{
    line-height: 1.3;
}

a.lblReset {    
    /*background-image: url(../img/house.png);*/    
}

#lblVME{
    position:absolute;
    top:10px;
    left:-1px;
}

#lblVMEOther{
    position:absolute;
    top:50px;
    left:-1px;
}

#lblFootprints{
    position:absolute;
    top:93px;
    left:-1px;
}

#lblReset{
    position:absolute;
    top:270px;
    left:-1px;
}


/*---------------------*/

.figisButtonToggle{
    background-repeat: no-repeat;
    width:90px;
    -moz-box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.5);
    -webkit-box-shadow: 0px 3px 3px -1px rgba(0, 0, 0, 0.5);
    box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.5);
    color:black;
	margin: 0px 12px 0px 12px;
    background-position: 3px 0px; /* equivalent to 'top left' */
    border: none;           /* assuming we don't want any borders */
    cursor: pointer;        /* make the cursor like hovering over an <a> element */
    height: 16px;
    padding:  2px ;
    text-align:center;/* make text start to the right of the image */
    vertical-align: baseline; /* align the text vertically centered */
    /*display:inline-block;*/
    -moz-border-radius: 15px;
    -webkit-border-radius: 15px;
    -khtml-border-radius: 15px;
    border-radius: 15px;
    font-size: 12px;
    text-align: center;
    font-family: asap, sans-serif;
    font-weight: 400;
    font-style: normal;
    background-color: #5D696E; 
    background-color: rgba(93, 105, 110, 0.5);
    z-index:1050;
}

/*---------------------*/

#loginContainer{
    position:absolute;
    top:10px;
    left:-1px;
}

#login.user-login a{
	padding-left:20px;
	background-image: url(../img/door_in.png) !important;
	background-repeat:no-repeat;

}

#login.user-logout a{
	padding-left:20px;
	background-image: url(../img/door_out.png) !important;
	background-repeat:no-repeat;

}

#user.user-logout em{
	font-weight:bold;
}

.x-combo-list {
    text-align : left;
}

.x-combo-list-item {
    text-align : left;
}

#layerswitcher >div{
	display:none;
}
#layerswitcher div.layersDiv{
	margin: 10px 5px;
	display:block;
}

#layerswitcher div.layersDiv .baseLbl, #layerswitcher div.layersDiv .dataLbl{
	font-weight:bold;
	margin: 4px auto;
	
}

.dataLbl {
    display: none;
}
/** Search Results **/
.search-result{
	margin:0;
	padding: 6px 2px;
	border-bottom:thin solid black;
}
#sidebar .search-result{

    margin-left: 5px;
    margin-right: 5px;
}
.search-result em{
	font-weight: bold;
}
.search-result .searchResultValue{
	font-weight: normal;
}
/**
 popup custom style
 **/
.gx-popup .gx-popup, .gx-popup .x-tab-panel-body,.gx-popup .x-panel-body,.gx-popup .x-tab-panel-header,.gx-popup .x-tab-strip-wrap,.gx-popup  .x-tab-strip-wrap .x-tab-strip, .gx-popup .x-window-mc{
    background:transparent ;
}
 .gx-popup.x-window{
    background: #FFFFFF;
    background-color: rgba(255, 255, 255, 0.8) !important;
    border-radius: 10px;
    box-shadow: 0px 8px 8px rgba(0, 0, 0, 0.5);
    border-width: 1px;
    border-style: solid;
    border-color: #999999;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    -khtml-border-radius: 10px;
    border-radius: 10px;
}

.gx-popup.x-window-tc{   
    height: 18px;
    overflow: visible;
}
/** popup content */
.popup-result h3{
    font-family: asap, sans-serif;
    font-size: 22px;
    font-weight: 400;
    padding: 0px;
}
.popup-result{
    font-family: asap, sans-serif;
    font-size: 12px;
    font-weight: normal;
    line-height: 1.5;
	margin:0;
	padding: 6px 2px;
}
.popup-result em{
	font-weight: bold;
}

.x-view-over{background-color:rgba(219, 241, 255, 0.56);cursor:default;}
.x-view-selected{background-color:rgba(162, 202, 229, 0.81)}

/** ICONS **/
.legend-icon{
	background-image: url(../img/icons/legend.png) !important;
}
.map-icon{
	background-image: url(../img/icons/map.png) !important;
}
.layers-icon{
	background-image: url(../img/icons/layers.png) !important;
}
.search-icon{
	background-image: url(../img/icons/magnifier.png) !important;
}
.clear-icon{
	background-image: url(../img/icons/delete.png) !important;
}
.back-search-icon{
	background-image: url(../img/icons/application_form_magnify.png) !important;
}

.zoomlink{ 
	padding-left: 15px;
	background-size:13px;
	background-image: url(../img/icons/magnifier.png) !important;
	background-repeat: no-repeat;
}

.zipmlink{ 
	padding-left: 15px;
	background-size:13px;
	background-image: url(../img/icons/compress.png) !important;
	background-repeat: no-repeat;
}

.factlink{ 
	padding-left: 15px;
	background-size:13px;
	background-image: url(../img/icons/page_white_go.png) !important;
	background-repeat: no-repeat;
}
.rellink{ 
	padding-left: 15px;
	background-size:13px;
	background-image: url(../img/icons/attach.png) !important;
	background-repeat: no-repeat;
}

div.olControlMousePosition {
    font-family:asap, sans-serif;
    font-size:small;
    width:150px;
}

div.olControlMousePosition.olControlNoSelect {                                                                                        
    font-family:asap, sans-serif;                                                                                                     
    font-size:xx-small;                                                                                                               
    width:150px;                                                                                                                      
}