/*
Author : Nakul Chauhan
www : 29kreativ.com
@ : nakul@29kreativ.com
*/

body{font-family: 'Lato', sans-serif; margin: 0; background-color: rgba(255,255,255,0);}
* {-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}

.div-popover-map{width:98.9vw; height: 41.9vw ; background-image: url(../images/map-sprite-50.png); background-size: contain; background-repeat: no-repeat; position: relative; } 
.map-leaf-icon{z-index:2;width: 62px; height: 50px; background-image: url(../images/leaf-sprite.png); background-repeat: no-repeat; background-size: 124px; background-position: -63px 0px; position: absolute;  cursor: pointer;}
.map-leaf-icon:hover, .map-leaf-icon.hover{background-position: 0px 0px;}
.leaf-small{width: 31px; height: 25px; background-size: 62px; background-position: -31px 0px;}

.leaf-us{left:16%; bottom:65%}
.leaf-uk{left:46.5%; bottom:81%}
.leaf-mex{left:23.3%; bottom:50%}
.leaf-fra{left:49%; bottom:78%}
.leaf-tun{left:58%; bottom:37%}
.leaf-egy{left:55.3%; bottom:59%}
.leaf-nig{left:49.3%; bottom:43%}
.leaf-ug{left:56.5%; bottom:39.8%}
.leaf-tan{left:58%; bottom:32.5%}
.leaf-mad{left:60.6%; bottom:24.5%}
.leaf-ind{left:68.3%; bottom:51%}
.leaf-chn{left:77%; bottom:57.5%}
.leaf-viet{left:76.6%; bottom:48%}
.leaf-indo{left:76.6%; bottom:35.5%}
.leaf-aus{left:84.3%; bottom:20%}
.leaf-mor{left:46.3%; bottom:65%}

.leaf-data{display: none;}

.popover-template{display: none;}
.map-leaf-popover{  position: absolute; z-index:1 ; width: 0px;}
.popover-graphic-top-gap{display: none; height: 60px;}
.green-circle{left:-4px; position: relative; width: 14px; height: 14px; border-radius: 100%; border: solid 3px #18b580 ; opacity: 0; transition: margin .5s, opacity .5s; margin-top:0px;  } 
.green-line{background-color: #18b580; width:3px; height: 0px; position: relative; left:1px; opacity: 0; transition: height .5s, opacity .5s  }
.main-popover-dialog{width: 500px; background-color: #18b580; position: absolute; left: 1px; padding: 10px; color: white; opacity: 0; transition: height .5s, opacity .5s }
.main-popover-dialog .map-popover-title{font-size: 24px; font-weight: 400;  }
.main-popover-dialog .map-popover-main-text{text-align: justify; padding-top: 5px; border-bottom: 1px solid white ; padding-bottom: 10px; margin-bottom: 10px;  }
.text-16-light{font-weight: 300; font-size: 16px;}

.map-leaf-popover.visible{z-index: 10;}
.map-leaf-popover.visible .green-circle{opacity: 1; margin-top:3px }
.map-leaf-popover.visible .green-line{height: 100px; opacity: 1;}
.map-leaf-popover.visible .main-popover-dialog {opacity: 1; }
.map-leaf-popover .main-popover-dialog.invert-horizontally{left:-496px}


/* Extra small devices (portrait phones, less than 576px)*/
@media (max-width: 575.98px) { }

/* Small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) {
    .green-circle{display: none;}
    .green-line{opacity: 0 !important;}
    .main-popover-dialog{width:98.9vw !important; left: 0px !important; }
    .map-leaf-popover{left: 0px !important; top: 20vw !important}
    .map-leaf-icon{z-index:20;}
}

/* Medium devices (tablets, less than 992px) */
@media (max-width: 991.98px) { 
    .map-leaf-icon {background-size: 80px; background-position: -40px 0px; width: 40px; height: 33px; }
    .map-leaf-icon:hover{background-position: 1px 0px;}
    .leaf-small{width: 20px; height: 17px; background-size: 40px; background-position: -20px 0px;}
    .popover-graphic-top-gap{height: 40px;}
    .main-popover-dialog{width: 383px;}
    .map-leaf-popover .main-popover-dialog.invert-horizontally{left:-379px}
 }