@charset "utf-8";
.pkmnInfo {
	clear: left;
	width: 25%;
	margin: 2.5%;
	margin-left: auto;
	margin-right: auto;
}
.pkmnInfo h2 {
	padding: 0;
}
.pkmnInfoIMG {
	clear: left;
	width: 40%;
	margin: 2.5%;
	margin-left: auto;
	margin-right: auto;
}
.pkmonInfoHalf {
	float: left;
	width: 50%;
	margin-left: auto;
	margin-right: auto;
}
#headerLinks a {
	text-decoration: none;
  }
  
  img.custom {
	height: 4em;
	max-height: 5em;
}
  #headerLinks ul {
	float: right;
	list-style: none;
	margin: 0;
	padding-left: 0;
  }
  
  #headerLinks li {
	color: rgba(255, 204, 0, 1.00);
	display: block;
	float: left;
	padding: 0.5rem;
	position: relative;
	text-decoration: none;
	border-radius: 10px;
	transition-duration: 0.5s;
  }


	
  #headerLinks li a {
	color: rgba(255, 204, 0, 1.00);
	width: 100%;
  }
  
  #headerLinks li:hover,
  #headerLinks li:focus-within {
	background: #c7360c;
	cursor: pointer;
  }
  
  #headerLinks li:focus-within a {
	outline: none;
  }
  
  #headerLinks ul li ul {
	background: #7f7f7f;
	visibility: hidden;
	opacity: 0;
	min-width: 7rem;
	position: absolute;
	border-radius: 10px;
	margin-top: 5%;
	transition: all 0.5s ease;
	left: 0;
	display: none;
  }
  
  #headerLinks ul li:hover > ul,
  #headerLinks ul li:focus-within > ul,
  #headerLinks ul li ul:hover,
  #headerLinks ul li ul:focus {
	 visibility: visible;
	 opacity: 1;
	 display: block;
  }
  
  #headerLinks ul li ul li {
	clear: both;
	padding: 0.1rem;
	padding-left: 5%;
	border-radius: 10px;
	width: 100%;
  }
/* Global Styles */
a:hover {
	color: rgba(213, 161, 0, 1.00);
}
a {
	color: hsl(48, 100%, 50%);
}
h2 {
	font-size: 1em;
	padding-left: 4%;
}
h3 {
	font-size: 1.5em;
	clear:left;
}
body {
	background-color: #efefef;
	font-family: 'Questrial', sans-serif;
	font-size: 16px;
}
.row {
	clear: left;
    margin-right: 0;
    margin-left: 0;
}
#viewmodal img {
	margin-bottom: 2%;
}
.col-md-3 {
    -ms-flex: 0 0 14.5%;
    flex: 0 0 14.5%;
    max-width: 14.5%;
    margin: 1%;
	padding:0;
	height: 99%;
	box-shadow: rgb(50 50 93 / 25%) 0px 6px 12px -2px, rgb(0 0 0 / 30%) 0px 3px 7px -3px;
}
.mb-3, .my-3 {
    max-height: 99%;
	margin-bottom: 0;
}
#poscenter {
    clear: both;
    display: block;
    margin-left: auto;
    margin-right: auto;
    text-align:center;
}
/*header*/
header {
	color: rgba(255, 204, 0, 1.00);
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
}
.modal-sm {
    max-width: 100%;
}
/* Logo placeholder*/
#logo {
	height: 90px;
	float: left;
	padding: 0.5%;
	width: auto;
	text-align: center;
}
/* div for Links in header */
#headerLinks {
	width: auto;
	height: 90px;
	text-align: left;
	padding: 0.5%;
	background-image: linear-gradient(#000000, #c7360c, #646363)
}
/* Links in header */
#headerLinks a {
	text-decoration: none;
	color: rgba(255, 204, 0, 1.00);
	font-size: 16px;
}
/* Offer text banner*/
#offer {
	box-shadow: rgb(0 0 0 / 35%) 0px 5px 15px;
	background-image: linear-gradient(#585858, #000000);
	clear: both;
	color: rgba(255, 204, 0, 1.00);
	padding: 2.5%;
}
.setsinfo {
	width: 24%;
	padding: 0.5%;
	vertical-align: top;
	display: inline-block;
	margin-bottom: 1%;
}
.setsinfohalf {
	width: 40%;
	padding: 0.5%;
	vertical-align: top;
	display: inline-block;
	margin-bottom: 1%;
}
/* Main content of the site */
#content {
	clear: both;
	padding-top: 1%;
}
/* main content of the site */
#content .mainContent {
	float: left;
	width: 100%;
	text-align: center;
}
label {
	font-size: 16px;
}
.modal-body > .img-responsive {
    display: block;
    margin-left: auto;
    margin-right: auto;
}
.selector {
	clear: left;
	width: auto;
	margin: 1%;
}
.menuSelector {
	float: left;
	width: 25%;
	margin-bottom: 2.5%;
}
.menuSelectorFor {
	width: 12.5%;
	margin: auto;
	height: 2em;
	float: left;
}
.menuSelectorFifth {
	float: left;
	width: 10%;
	margin-bottom: 2.5%;
}
.menuSelectorHalf {
	float: left;
	width: 50%;
	margin-bottom: 2.5%;
}
.menuSelectorThird {
	float: left;
	width: 33%;
	margin-bottom: 2.5%;
}
.menuSelectorTwo {
	float: left;
	width: 50%;
	margin-bottom: 2.5%;
}
.pkmnCard input {
clear: left;
}
.center {
	text-align: center;
	margin: auto;
	width: 100%;
	padding-top: 2.5%;
	padding-bottom: 2.5%;
}
/* footer */
#mainWrapper footer {
	clear: both;
	overflow: auto;
	background-color: rgba(208,207,207,1.00);
	font-family: monospace;
	font-style: normal;
	font-weight: 200;
	line-height: 1.8;
	padding: 2.5%;
	text-align: center;
}
/*Each footer content */
#mainWrapper footer div {
	width: 27%;
	float: left;
	padding-left: 4%;
	padding-right: 2%;
	color: rgba(255,255,255,1.00);
	text-align: justify;
}
/* Links in footer */
footer div a {
	color: rgba(146,146,146,1.00);
	display: block;
	text-decoration: none;
	text-align: center;
}

/* Container for links in footer */
footer .footerlinks {
	margin-top: -15px;
}



/*media query for screen devices */
@media (max-width: 700px) {
/*Container for links in header */
#logo {
	display: none;
}
.pkmnInfo {
	width: 90%;
}
.pkmnInfoIMG {
	width: 100%;
}
#offer {
	padding: 5%;
}
.setsinfo {
	width: 100%;
	padding: 0.5%;
	display: block;
}
.setsinfohalf {
	width: 100%;
	padding: 0.5%;
	display: block;
}
#mainWrapper header #headerLinks {
	width: 100%;
	text-align: center;
	background-color: rgba(190,190,190,1.00);
	padding-bottom: 21px;
}
.menuSelector {
    float: left;
    width: 100%;
	height: 2em;
}
.menuSelectorFifth {
	width: 50%;
	margin: auto;
	height: 2em;
}
.menuSelectorFor {
	width: 50%;
	margin: auto;
	height: 2em;
}
.menuSelectorTwo {
    float: left;
    width: 100%;
	height: 2em;
}
.menuSelectorThird {
    float: left;
    width: 100%;
	height: 2em;
}
/* Logo placeholder*/
#mainWrapper header #logo {
	width: 100%;
	text-align: center;
}
/* Links in header */
header #headerLinks a {
	text-align: center;
	padding-right: 15px;
	padding-left: 0px;
}
/*Offer - Text Banner */
#mainWrapper #offer {
	padding-left: 0px;
	text-align: center;
}
#content .mainContent {
	width: 100%;
	padding-left: 0;
}
/*Menu headings in sidebar */
#menubar .menu h2 {
	width: 100%;
	display: block;
}
#mainWrapper footer div {
	width: 100%;
	margin-left: -16px;
	text-align: justify;
	padding-bottom: 16px;
	overflow: auto;
}
.col-md-3 {
	flex: 0 0 45%;
	margin: 2.5%;
    max-width: 100%;
}
/* Container for links in footer */
#mainWrapper footer .footerlinks {
	padding-left: 8%;
}
/* Main content which excludes the sidebar */
#mainwrapper #content .mainContent {
	margin-top: -81px;
	text-align: center;
	width: 100%;
	padding-left: 0px;
}
}





/*media query for screen devices */
@media (min-width: 701px) and (max-width: 1000px) {
	/*Container for links in header */
	#mainWrapper header #headerLinks {
		width: 100%;
		text-align: center;
		background-color: rgba(190,190,190,1.00);
		padding-bottom: 21px;
	}
	.pkmnInfo {
		width: 90%;
	}
	.pkmnInfoIMG {
		width: 100%;
	}
	.setsinfohalf {
		width: 100%;
		padding: 0.5%;
	}
	.setsinfo {
		width: 40%;
		padding: 0.5%;
	}
	.menuSelector {
		float: left;
		width: 50%;
		height: 2em;
	} 
	.menuSelectorFifth {
		width: 50%;
		height: 2em;
	}
	.menuSelectorTwo {
		float: left;
		width: 50%;
		height: 2em;
	}
	.menuSelectorThird {
		float: left;
		width: 50%;
		height: 2em;
	}
	.menuSelectorFor {
		width: 25%;
		margin: auto;
		height: 2em;
	}
	/* Logo placeholder*/
	#mainWrapper header #logo {
		width: 100%;
		text-align: center;
	}
	/* Links in header */
	header #headerLinks a {
		text-align: center;
		padding-right: 15px;
		padding-left: 0px;
	}
	/*Offer - Text Banner */
	#mainWrapper #offer {
		padding-left: 0px;
		text-align: center;
	}
	#content .mainContent {
		width: 100%;
	}
	#mainWrapper footer div {
		width: 100%;
		margin-left: -16px;
		text-align: justify;
		padding-bottom: 16px;
		overflow: auto;
	}
	.col-md-3 {
		flex: 0 0 30%;
		margin: 1.5%;
		max-width: 100%;
	}
	/* Container for links in footer */
	#mainWrapper footer .footerlinks {
		padding-left: 8%;
	}
	/* Main content which excludes the sidebar */
	#mainwrapper #content .mainContent {
		margin-top: -81px;
		text-align: center;
		width: 100%;
		padding-left: 0px;
	}
	}


/*media query for screen devices */
@media (min-width: 1001px) and (max-width: 1400px) {
	/*Container for links in header */
	#mainWrapper header #headerLinks {
		width: 100%;
		text-align: center;
		background-color: rgba(190,190,190,1.00);
		padding-bottom: 21px;
	}
	.setsinfo {
		width: 30%;
		padding: 0.5%;
	}
	.setsinfohalf {
		width: 35%;
		padding: 0.5%;
	}
	.menuSelectorFifth {
		width: 10%;
	}
	.menuSelector {
		width: 28%;
	}
	.menuSelectorFor {
		width: 7%;
	}
	/* Logo placeholder*/
	#mainWrapper header #logo {
		width: 100%;
		text-align: center;
	}
	/* Links in header */
	header #headerLinks a {
		text-align: center;
		padding-right: 15px;
		padding-left: 0px;
	}
	/*Offer - Text Banner */
	#mainWrapper #offer {
		padding-left: 0px;
		text-align: center;
	}
	#mainWrapper footer div {
		width: 100%;
		margin-left: -16px;
		text-align: justify;
		padding-bottom: 16px;
		overflow: auto;
	}
	/* Unordered list for menu elements */
	.col-md-3 {
		flex: 0 0 22%;
		margin: 1.5%;
		max-width: 80%;
	}
	/* Container for links in footer */
	#mainWrapper footer .footerlinks {
		padding-left: 8%;
	}
	/* Main content which excludes the sidebar */
	#mainwrapper #content .mainContent {
		margin-top: -81px;
		text-align: center;
		width: 100%;
		padding-left: 0px;
	}
	}