@charset "UTF-8";
/* CSS Document */

	.cls-1{fill:#483e32; stroke:#e6e7e8; stroke-linecap:round; stroke-linejoin:round; stroke-width:0.85px; fill-rule:evenodd;
}
	.cls-2{fill:#fff;
}
	.select{fill:#1a5632;
	-webkit-transition: all 0.5s ease;
 		-moz-transition: all 0.5s ease;
  		-o-transition:  all 0.5s ease;
 		transition:  all 0.5s ease;
}
.select:hover {
		fill:#abbfa3;
		-webkit-1a5632transition: all 0.5s ease;
 		-moz-transition: all 0.5s ease;
  		-o-transition:  all 0.5s ease;
 		transition:  all 0.5s ease;
		cursor: pointer;
}
.close{
	float: right; padding-left: 10px; padding-right: 12px; padding-top: 10px; padding-bottom:15px; font-size:20px; font-weight: bold;
	width: 10px; height: 20px; 	cursor: pointer; background-color: #1a5632; color: #fffef9;-webkit-transition: all 0.5s ease;
 		-moz-transition: all 0.5s ease;
  		-o-transition:  all 0.5s ease;
 		transition:  all 0.5s ease;
	border-radius: 5px;
}
.close:hover{background-color: #fffef9; color: #483e32;-webkit-transition: all 0.5s ease;
 		-moz-transition: all 0.5s ease;
  		-o-transition:  all 0.5s ease;
 		transition:  all 0.5s ease; 
}
.allcounty {
	background-color: #1a5632;
	color: #fffef9;
	width: 250px;
	height: auto;
	position: absolute;
	margin-left: 380px;
	margin-top: 20px;
	padding-top:0px;
	padding-bottom:10px;
	padding-left: 20px;
	padding-right: 20px;
	border: 1px solid #483e32;
	border-radius: 15px;
  }

.allcounty ul li a{
	color: #fffef9;
	text-decoration: none;
}
.allcounty ul li a:hover{
	color: #abbfa3;
	text-decoration: none;
}

	.popup {
    display: none;
	background-color: #fffef9;
	width: 400px;
	max-height: 300px;
	position: absolute;
	margin-left: 20px;
	margin-top: 0px;
	padding: 20px;
	border: 1px solid #6f8024;
	border-radius: 15px;
	top: 30px;
	left: 10px;
	overflow-y: auto;     /* Scroll only vertically when needed */
	overflow-x: hidden;   /* Hide horizontal scroll bar */
  }
.popmove{
	margin-left: 150px;
}


/* ----------- Tablet screen horizontal ----------- */
@media only screen and (max-width: 1367px) {
	
	.popmove{
	margin-left:0px;
}
	
	.allcounty {
	background-color: #1a5632;
	color: #fffef9;
	width: 250px;
	height: auto;
	position: absolute;
	margin-left:390px;
	margin-top: 0px;
	padding-top:0px;
	padding-bottom:10px;
	padding-left: 20px;
	padding-right: 20px;
	border: 1px solid #483e32;
	border-radius: 15px;
  }
	.allcounty ul {
	margin-top: -7px;
	}
	
	.allcounty ul li {
	margin-left: -25px;
	}

	.popup {
    display: none;
	background-color: #fffef9;
	width: 400px;
	max-height: 300px;
	position: absolute;
	margin-left: 20px;
	margin-top: 0px;
	padding: 20px;
	border: 1px solid #6f8024;
	border-radius: 15px;
	top: 30px;
	left: 10px;
	overflow-y: auto;     /* Scroll only vertically when needed */
	overflow-x: hidden;   /* Hide horizontal scroll bar */
  }
	
}

/* ----------- Tablet screen horizontal ----------- */
@media only screen and (max-width: 1113px) {
	
	
	.allcounty {
	font-size:12px;	
	background-color: #1a5632;
	color: #fffef9;
	width: 230px;
	height: auto;
	position: absolute;
	margin-left:310px;
	margin-top: 0px;
	padding-top:0px;
	padding-bottom:10px;
	padding-left: 20px;
	padding-right: 20px;
	border: 1px solid #483e32;
	border-radius: 15px;
  }

	.popup {
    display: none;
	background-color: #fffef9;
	width: 400px;
	max-height: 300px;
	position: absolute;
	margin-left: 20px;
	margin-top: 0px;
	padding: 20px;
	border: 1px solid #6f8024;
	border-radius: 15px;
	top: 30px;
	left: 10px;
	overflow-y: auto;     /* Scroll only vertically when needed */
	overflow-x: hidden;   /* Hide horizontal scroll bar */
  }
	
	
}

/* ----------- Tablet screen horizontal ----------- */
@media only screen and (max-width: 1024px) {
	
	.popmove{
	margin-left:0px;
}
	
	.allcounty {
	font-size: 12px;	
	background-color: #1a5632;
	color: #fffef9;
	width: 300px;
	height: auto;
	position: absolute;
	margin-left:250px;
	margin-top: 0px;
	padding-top:0px;
	padding-bottom:10px;
	padding-left: 20px;
	padding-right: 20px;
	border: 1px solid #483e32;
	border-radius: 15px;
  }
	.allcounty ul {
	margin-top: -7px;
	}
	
	.allcounty ul li {
	margin-left: -25px;
	}
	
	.popup {
    display: none;
	background-color: #fffef9;
	width: 400px;
	max-height: 300px;
	position: absolute;
	margin-left: 20px;
	margin-top: 0px;
	padding: 20px;
	border: 1px solid #6f8024;
	border-radius: 15px;
	top: 30px;
	left: 10px;
	overflow-y: auto;     /* Scroll only vertically when needed */
	overflow-x: hidden;   /* Hide horizontal scroll bar */
  }
	
	
}


/* ----------- iPhone SE 6+, 7+ and 8+ Vert tablet ----------- */
@media only screen and (max-width: 768px) {
	
	.popmove{
	margin-left:0px;
}
	
	.allcounty {
	font-size: 12px;	
	background-color: #1a5632;
	color: #fffef9;
	width: 280px;
	height: 100px;
	position: absolute;
	margin-left:20px;
	margin-top: 20px;
	padding-top:0px;
	padding-bottom:10px;
	padding-left: 20px;
	padding-right: 20px;
	border: 1px solid #483e32;
	border-radius: 15px;
  }
	.allcounty ul {
	margin-top: -7px;
	}
	
	.allcounty ul li {
	margin-left: -25px;
	}
}

@media only screen and (max-width: 445px) {
  .popup {
    /* Positioning */
    position: fixed;       /* relative to viewport */
    top: 0;                /* stick to top */
    left: 0;               /* align to left edge */
    right: 0;              /* align to right edge */
    z-index: 9999;         /* keep above other elements */

    /* Sizing */
    max-width: 300px;      /* cap popup width */
    max-height: 100vh;     /* fit within viewport height */

    /* Scrolling */
    overflow-y: auto;      /* enable vertical scrolling */
    -webkit-overflow-scrolling: touch; /* smooth iOS scrolling */

    /* Safe area for iPhone notch */
    padding-top: env(safe-area-inset-top);
  }
}


/*** 
====================================================================
	IPHONE 8
====================================================================

***/	

@media only screen and (max-width: 415px){
	
	.popmove{
		position: absolute;
		margin-top: 160px;
		
	}
	

	
}
