/* New CSS */
#shadowImage {
	display: none;
}

.centerHorizontal_middleVertical_img {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}

.middleVertical_img {
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
}

.centerHorizontal_img {
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
}

.middleVertical_with_float_img {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}

#refresh_button {
    float: right;
    margin-right: 50px;
}

#setting_button {
    float: right;
}

#pokedex100_nav {
    height: 65px;
    position: relative;
}

#responsive-btn {
	font-size: 14px;
	width: 25%;
}

.span_18 {
	font-size: 18px;
	margin-left: 28%;
}

._span_18 {
	font-size: 18px;
	margin-left: -3%;
}

.container_div {
	width: 110px;
	margin-top: 6px;
	position: relative;
}

._container_div {
	width: 250px;
	margin-top: 6px;
	position: relative;
}

.container_div > img:first-child {
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
}

#myDropdown {
	margin-top: 70px;
	background-color: #5b5a58;
	min-width: 200px;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";       /* IE 8 */
	filter: alpha(opacity=96);  /* IE 5-7 */
	-moz-opacity: 0.96;          /* Netscape */
	-khtml-opacity: 0.96;        /* Safari 1.x */
	opacity: 0.96;               /* Good browsers */
}

/* triangle */
/*#myDropdown:after {
    border-bottom: 15px solid #535353;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    top: 0px;
    content: "";
    position: absolute;
    left: 5%;
}*/

#myDropdown p {
	display: inline-block;
	color: white;
}

#myDropdown a {
	height: 70px;
	border-bottom: 1px solid #e6b990;
	text-decoration: none;
}

#myDropdown a:hover {
	background-color: #ea7a2e;
}

.selected_menu {
	background-color: #ea7a2e;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f1f1f1;
    min-width: 160px;
    overflow: auto;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
}

.dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
}

.dropdown a:hover {background-color: #ddd}

.show {display:block;}

#new-component > div > input {
	text-align: center;
    color: black;
    height: 28px;
    border: 1px solid rgba(113,139,214,1);
}

#new-component > div > label {
	position: relative;
}

#new-component > div > label > input {
    width: 18px;
    height: 18px;
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
}

#checkbox_group_area label {
	width: 180px;
	height: 28px;
}

#checkbox_group_area > div > input {
/*	width: 18px;
    height: 18px;*/
}

#gps_btn {
	position: absolute;
	width: 5%;
}

#gps_btn > img {
	max-width: 28px; 
	height: 28px;
	position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}

#apply_btn {
	position: absolute;
	width: 10%;    
}

.blue_style_btn {
	background-color: #7289d9;
    color: white;
    border: none;
    height: 28px;
    border-radius: 4px;
}

.blue_style_btn:hover {
	background-color: #ea7a2e;
}

.no_margin_right {
	margin-right: 15px! important;
}

.background_unset {
    background-color: unset;
}

.close_btn {
	width: 100px;
	color:rgba(113,139,214,1)! important;
}

.close_btn:hover {
	background-color: #7289d9! important;
	color: white! important;
}

.absolute_close_btn {
	position: absolute;
    right: -15px;
    opacity: 1! important;
    top: -15px;
}

.relative_modal_header {
	position: relative;
}

input[type='radio']:checked:after {
    width: 18px;
    height: 18px;
    border-radius: 18px;
    top: -2px;
    left: -1px;
    position: relative;
    background-color: #7289d9;
    content: '';
    display: inline-block;
    visibility: visible;
    border: 3px solid white;
}

.newLine {
	display: none;
}

.small_text > b {
	font-size: 30px;
}

.tmp_div {
	display: none;
}

#table_container {
	overflow-y: scroll;
    max-height: 1388px;
}

#paging {
	display: table! important;
    margin: 0 auto;
}

#paging button {
	width: 70px;
}

#paging span {
	margin-left: 10px;
    margin-right: 10px;
}

#topBtn {
  bottom: 130px;
  display: none;
}

#bottomBtn {
  top: 130px;
  display: block;
}

.myBtn {
  right: 26px;
  position: fixed;
  z-index: 99;
  font-size: 30px;
  outline: none;
  cursor: pointer;
  background-color: #7289d9;
  color: white;
  border: none;
  border-radius: 4px;
  opacity: 0.5;
}

.myBtn:hover {
  background-color: #ea7a2e;
}

.male {
	color: #3355ff;
	font-size: 25px;
}

.female {
	color: #ff77dd;
    font-size: 25px;
}

.pokemon img {
	width: 40px! important;
}

/*.animate-repeat {
	line-height:40px;
	list-style:none;
	box-sizing:border-box;
	display: block;
}*/

.animate-repeat.ng-move,
.animate-repeat.ng-enter,
.animate-repeat.ng-leave {
	-webkit-transition:all linear 0.5s;
	transition:all linear 0.5s;
}

.animate-repeat.ng-leave.ng-leave-active,
.animate-repeat.ng-move,
.animate-repeat.ng-enter {
	opacity:0;
	max-height:0;
}

.animate-repeat.ng-leave,
.animate-repeat.ng-move.ng-move-active,
.animate-repeat.ng-enter.ng-enter-active {
	opacity:1;
	max-height:73px;
}


/*.removed-item {
    animation: removed-item-animation 1s cubic-bezier(0.55, -0.04, 0.91, 0.94) forwards;
    transform-origin: 0% 100%;
}
 
@keyframes removed-item-animation {
    0% {
        opacity: 1;
        transform: rotateZ(0);
}
 
    100% {
        opacity: 0;
        transform: translateY(600px) rotateZ(90deg);
    }
}*/


/*----------------------------------------------------------*/
@media only screen and (min-width: 1921px){
	.pokemon .lv {
		float: right;
	}
	
	#new-component {
		/*background-color: red;*/
	}

	#new-component label {
		margin-left: 2%;
    	width: 12%;
	}

	#new-component > div > input {
		width: 30%;
	}
}

@media only screen and (max-width: 1920px) and (min-width: 1025px){
	.pokemon .lv {
		float: right;
	}

	#new-component {
		/*background-color: green;*/
	}

	#new-component label {
		margin-left: 2%;
    	width: 12%;
	}

	#new-component > div > input {
		width: 30%;
	}
}

@media only screen and (max-width: 1024px) and (min-width: 992px){
	#new-component {
		/*background-color: blue;*/
	}

	#new-component label {
		margin-left: 2%;
    	width: 12%;
	}

	#new-component > div > input {
		width: 30%;
	}
}

@media only screen and (max-width: 991px) and (min-width: 769px){
	#new-component {
		/*background-color: pink;*/
	}

	#new-component label {
		margin-left: 2%;
    	width: 12%;
	}

	#new-component > div > input {
		margin-left: 3%;
		width: 55%;
	}

	#new-component > div > label > span {
		margin-left: 37%! important;
	}

	#responsive-btn {
	    width: 40%;
	}

	#pokedex-number-input {
		width: 140px;
	}
}

@media only screen and (max-width: 768px) and (min-width: 691px){
	#new-component {
		/*background-color: yellow;*/
	}

	#new-component label {
		margin-left: 2%;
    	width: 12%;
	}

	#new-component > div > input {
		width: 40%;
	}

	#responsive-btn {
	    width: 40%;
	}

	#pokedex-number-input {
		width: 140px;
	}
}


@media only screen and (max-width: 690px) and (min-width: 481px){
	#new-component {
		/*background-color: brown;*/
	}

	#new-component label {
		margin-left: 2%;
    	width: 12%;
	}

	#new-component > div > input {
		width: 50%;
		margin-left: 7%;
	    font-size: 13px;
	}

	#responsive-btn {
	    width: 50%;
	}

	#pokedex-number-input {
		width: 140px;
	}

	#new-component > div > label > span {
		margin-left: 47%! important;
	}

	#gps_btn {
	    width: 10%;
	}

	#apply_btn {
	    width: 15%;
	}

	#refresh_button {
     margin-right: 0px; 
	}
}

/** START: Special handle */
@media only screen and (max-width: 516px) {
	.newLine {
		display: block;
	}

	#total-span {
		float: unset! important;
	}
}

@media only screen and (max-width: 420px) {
	.small_img {
		width: 150px! important;
	}

	.small_text, .small_text > b {
		font-size: 15px! important;
	}

	#pokedex100_nav {
	    height: 48px;
	}

	#refresh_button {
		margin-right: 0px! important; 
	}

	.banner-bottom {
	    font-size: 15px;
	    margin-left: 5px;
	}

	.small_b_tag > b {
		font-size: 20px;
	}

	#small_discord_text {
		font-size: 20px! important;
	}
}

@media only screen and (max-width: 991px) {
	.inline-block-p > p {
		display: inline-block;
	}
}

@media only screen and (max-width: 409px) {
	#responsive-btn {
	    width: 75%! important;
	}

	.tmp_div {
		display: block;
	}

	#new-component > div > input {
	    width: 70%! important;
	    margin-left: 4%! important;
	}

	#new-component label {
	    margin-left: 4%! important;
	    width: 22%! important;
	}

	#apply_btn {
	    width: 20%! important;
	}
}

@media only screen and (max-width: 320px) {
	#responsive-btn {
	    width: 87%! important;
	}

	.tmp_div {
		display: block;
	}

	#new-component > div > input {
	    width: 70%! important;
	    margin-left: 4%! important;
	}

	#new-component label {
	    width: 40%! important;
	}

	#apply_btn {
	    width: 20%! important;
	}

	#gps_btn {
	    width: 10%;
	}
}
/** END: Special handle */

@media only screen and (max-width: 480px) and (min-width: 332px){
	#new-component {
		/*background-color: orange;*/
	}

	#refresh_button {
		margin-right: 15px; 
	}

	#logo_img {
		width: 150px;
	}

	#hamburger_menu {
		width: 35px;
    	height: 35px;
	}

	#setting_button {
		width: 35px;
    	height: 35px;
	}

	#refresh_button {
		width: 35px;
    	height: 35px;
	}

	#new-component label {
		margin-left: 2%;
    	width: 12%;
	}

	#new-component > div > input {
		width: 60%;
		margin-left: 8%;
		font-size: 13px;
	}

	#new-component > div > label > span {
		margin-left: 47%! important;
	}

	#responsive-btn {
	    width: 60%;
	}

	#gps_btn {
	    width: 10%;
	}

	#apply_btn {
	    width: 15%;
	}
 	
	#pokedex-number-input  {
		width: 153px
	}
}

@media only screen and (max-width: 333px){
	#new-component {
		/*background-color: pink;*/
	}

	#refresh_button {
		margin-right: 15px; 
	}

	#logo_img {
		width: 150px;
		margin-top: 10px;
	}

	#hamburger_menu {
		width: 35px;
    	height: 35px;
    	margin-top: 40px;
	}

	#setting_button {
		width: 35px;
    	height: 35px;
    	margin-top: 15px
	}

	#refresh_button {
		width: 35px;
    	height: 35px;
    	margin-top: 15px
	}

	#pokedex-number-input  {
		width: 153px;
	}

	#pokedex100_nav {
	    height: 80px;
	}
}

@media only screen and (max-width: 258px){
	#ul_container > ul {
		width: 100%;
	}
}

/*----------------------------------------------------------*/
 
/*@media only screen and (min-width: 1200px){
	#new-component {
	    padding-left: 22px;
	    padding-right: 82px;
	}

	#responsive-btn {
		float: right;
	}
}

@media only screen and (max-width: 1199px) and (min-width: 992px){
	#new-component {
	    padding-left: 22px;
	    padding-right: 241px;
	}

	#responsive-btn {
		float: right;
	}
}

@media only screen and (max-width: 991px) and (min-width: 787px){
	#new-component {
	    padding-left: 22px;
	    padding-right: 167px;
	}

	#responsive-btn {
		float: right;
	}
}

@media only screen and (max-width: 767px) and (min-width: 756px){
	#new-component {
	    padding-left: 22px;
	    padding-right: 53px;
	}

	#responsive-btn {
		float: right;
	}
}

@media only screen and (max-width: 755px) and (min-width: 614px){
	#new-component {
	    padding-left: 22px;
	}
}

@media only screen and (max-width: 613px) and (min-width: 0px){
	#new-component {
	    padding-left: 22px;
	}
	
	#responsive-btn {
		margin-top: 3px;
	}
}*/

/*
#hamburger_menu {
	background-image: url('./pokemonlist/images/homepage/newdesign/home_top_bt_menu.png');
	width: 62px;
	height: 62px;
}

#hamburger_menu:hover {
	background-image: url('./pokemonlist/images/homepage/newdesign/home_top_bt_menu_hover.png');
}

#setting_button {
    background-image: url('./pokemonlist/images/homepage/newdesign/home_top_bt_settings.png');
	width: 62px;
	height: 62px;
}

#setting_button:hover {
    background-image: url('./pokemonlist/images/homepage/newdesign/home_top_bt_settings_hover.png');
}

#refresh_button {
    background-image: url('./pokemonlist/images/homepage/newdesign/home_top_bt_refresh.png');
	width: 62px;
	height: 62px;
}

#refresh_button:hover {
    background-image: url('./pokemonlist/images/homepage/newdesign/home_top_bt_refresh_hover.png');
}

#refresh_button:not(:hover) {
    background-image: url('./pokemonlist/images/homepage/newdesign/home_top_bt_refresh.png');
}
*/
/** New CSS