@import url(//db.onlinewebfonts.com/c/066ce24dae3730ed6c648b09efaea93a?family=Acumin+Variable+Concept);
@font-face {font-family: "Acumin Variable Concept"; src: url("//db.onlinewebfonts.com/t/066ce24dae3730ed6c648b09efaea93a.eot"); src: url("//db.onlinewebfonts.com/t/066ce24dae3730ed6c648b09efaea93a.eot?#iefix") format("embedded-opentype"), url("//db.onlinewebfonts.com/t/066ce24dae3730ed6c648b09efaea93a.woff2") format("woff2"), url("//db.onlinewebfonts.com/t/066ce24dae3730ed6c648b09efaea93a.woff") format("woff"), url("//db.onlinewebfonts.com/t/066ce24dae3730ed6c648b09efaea93a.ttf") format("truetype"), url("//db.onlinewebfonts.com/t/066ce24dae3730ed6c648b09efaea93a.svg#Acumin Variable Concept") format("svg"); } 
@darkmode-link-color: #69f;
@darkmode-link-visited-color: #709bbd;

body,html{
  background: url("http://www.pokemc.com/img/8Uafbh3.jpg") rgba(0,0,0,0.6) center no-repeat;
  background-size: cover;
  background-attachment: fixed;
  min-height:100%;
  font-family: 'Verdana';
  font-size:15px;
  display:flex;
  align-items:center;
  justify-content:center
}
h1,h2{
  font-weight:400;
  letter-spacing:-2px
}
#slideshow {
	position: relative;
	min-height: 340px;
}
#slideshow > div {
  position: absolute;
  top: 10px;
  left: 10px;
  right: 10px;
  bottom: 10px;
  min-height: 340px;
  text-align: center;
}
.slide {
	height: 325px;
}
.background {
	background-color: rgba(0, 0, 0, 0.2);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    min-height: 100%;
}
.logo-links {
  padding: 5px;
  clear:both;
  margin:0px auto;
  width: 50vw;
  text-align:center;
  vertical-align:top;
}
.logo {
  padding: 5px;
  clear:both;
  margin:0px auto;
  width: 930px;
  text-align:center;
  vertical-align:top;
}
.grid-container-links {
  display:block;
  padding: 5px;
  margin:0px auto;
  width: 90vw;
  text-align:center;
}
.grid-container {
  display:block;
  padding: 5px;
  margin:0px auto;
  width: 930px;
  text-align:center;
}
.icon {
  position: absolute;
  background:#fff;
  left: 215px;
  top: 125px;
  width: 75px;
  height: 75px;
  border-radius: 50%;
  overflow:hidden;
  border:3px solid #fff;
  box-shadow:0 4px 3px #0002;
  z-index:1;
}
.card1 {
  position: relative;
  float: left;
  margin: 0;
  padding: 0;
  height:625px;
  min-height:625px;
  width: 300px;
  min-width: 300px;
  background: #ffffff;
  border-radius: 5px;
  box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.3);
  -webkit-animation: fadein 2s;
          animation: fadein 2s;
  overflow:hidden;
  z-index: 999;
  text-align:left;
}
.card2 {
  display:inline-block;
  margin: 0 auto;
  padding: 0;
  height:625px;
  min-height:625px;
  width: 300px;
  min-width: 300px;
  background: #ffffff;
  border-radius: 5px;
  box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.3);
  -webkit-animation: fadein 2s;
          animation: fadein 2s;
  overflow:hidden;
  z-index: 999;
  text-align:left;
}
.card3 {
  float: right;
  margin: 0;
  height:625px;
  min-height:625px;
  width: 300px;
  min-width: 300px;
  background: #ffffff;
  border-radius: 5px;
  box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.3);
  -webkit-animation: fadein 2s;
          animation: fadein 2s;
  overflow:hidden;
  z-index: 999;
  text-align:left;
}
.card4 {
  display:inline-block;
  margin-top: 5px;
  padding: 0;
  width: 930px;
  min-width: 930px;
  background: #ffffff;
  border-radius: 5px;
  box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.3);
  -webkit-animation: fadein 2s;
          animation: fadein 2s;
  overflow:hidden;
  z-index: 999;
  text-align:left;
}
.card7 {
  display:inline-block;
  margin-top: 5px;
  padding: 0;
  width: 90vw;
  min-width: 140px;
  background: #ffffff;
  border-radius: 5px;
  box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.3);
  -webkit-animation: fadein 2s;
          animation: fadein 2s;
  z-index: 999;
  text-align: center;
}
.card5 {
	display:inline-block;
  margin-top: 5px;
  padding: 0;
  width: 930px;
  min-width: 910px;
  background: #ffffff;
  border-radius: 5px;
  box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.3);
  -webkit-animation: fadein 2s;
          animation: fadein 2s;
  overflow:hidden;
  z-index: 999;
  text-align:left;
}
.card6 {
	display:inline-block;
  margin-top: 5px;
  padding: 0;
  width: 930px;
  min-width: 930px;
  background: #ffffff;
  border-radius: 5px;
  box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.3);
  -webkit-animation: fadein 2s;
          animation: fadein 2s;
  overflow:hidden;
  z-index: 999;
  text-align:left;
}
.pagehead {
	color: #ffffff;
	font-weight: 1000;
	font-size: 18pt;
    /* -webkit-text-stroke: 2px #3b59a1;
    -webkit-text-fill-color: #ffd42c; */
}
.footer-links {
  float: left;
  clear: left;
  margin-top: 50px;
  margin-bottom: 50px;
  padding: 0;
  width: 90vw;
  min-width: 90vw;
  border-radius: 5px;
  text-align: center;
  color: #fff;
  overflow:hidden;
  z-index: 999;
}
.footer {
  float: left;
  clear: left;
  margin-top: 50px;
  margin-bottom: 50px;
  padding: 0;
  width: 930px;
  min-width: 930px;
  border-radius: 5px;
  text-align: center;
  color: #fff;
  overflow:hidden;
  z-index: 999;
}
.header {
	position: relative;
	z-index: 1;
	width: 100%;
	box-shadow:0 4px 3px #0002;
	overflow: hidden;
}
.header-noimg-links {
	text-align: center;
	position: relative;
	z-index: 1;
	width: 100%;
	box-shadow:0 4px 3px #0002;
	overflow: hidden;
	background: linear-gradient(to bottom, rgba(235,246,251,0.85) 0%,rgba(86,150,193,0.85) 100%);
}
.header-noimg {
	text-align: center;
	position: relative;
	z-index: 1;
	width: 100%;
	box-shadow:0 4px 3px #0002;
	overflow: hidden;
	padding:0 10px;
	background: linear-gradient(to bottom, rgba(235,246,251,0.85) 0%,rgba(86,150,193,0.85) 100%);
}
.desctext-links {
	position: relative;
	z-index:1;
	min-height: 188px;
	padding: 0 10px 15px 10px;
}
.desctext {
	position: relative;
	z-index:1;
	width: 98%;
	min-height: 188px;
	padding: 0 10px 15px 10px;
}
.tab {
	position: relative;
	display: none;
	z-index:1;
	width: 98%;
	padding: 0 10px 15px 10px;
}
.card1 img{
  width:100%;
  transition: all 1s ease;
  z-index:5;
}


.header h2{
  position:absolute;
  bottom:0;
  margin:0;
  width:100%;
  padding:0 10px;
  color:#fff;
  text-transform:uppercase;
  pointer-events:none;
  background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0.85) 100%);
  z-index: 6;
}

.rest{
  padding-right: 15px;
  color:#000d42;
}

.playerList{
	font-size:75%;
}

.guideTabs {
	width:100%;
	margin-top:10px;
	text-align:center;
}

.voteButton {
	height: 50px;
}

.testiglink {       
	min-width: 90;
    position: absolute;
    text-align: center;
    padding-top:100%;
    -webkit-transform: translateY(-50%); /* child now centers itself relative to the midline based on own contents */
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -ms-filter: 'progid:DXImageTransform.Microsoft.Matrix(Dx=0,Dy=0)'; /*IE8 */
    filter: progid:DXImageTransform.Microsoft.Matrix(Dx=0,Dy=0); /*IE6, IE7*/
    transform: translateY(-50%);
	
	display: inline-block;
	height: 38px;
	background-image: url("https://www.pokemc.com/img/iglinkbutton.png");
	background-size: cover;
	background-position: center;
}
.iglinkbutton {
	cursor: pointer;	
	height: 38px;
	border: 4px solid;
	border-color: #435fa3;
	font-family: Arial;
	-webkit-text-stroke: 1px #435fa3;
	color: #ffcc03;
	background-color: #ffcc03;
	text-align: center;
	display: inline-block;
	font-weight: 900;
	line-height: 38px;
	vertical-align: middle;
	min-width:120px;
	margin-top:10px;
	padding-left:10px;
	padding-right:10px;
}

.linkButton {
	padding-top: 5px;
	height: 45px;
	display:inline-block;
}

.guideButton {
	height: 75px;
}

.center {
	text-align: center;
}

.pbr {
	width: 800px;
}

.posrel {
	position:relative;
}

/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1000; /* Sit on top */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.75); /* Black w/ opacity */
}

/* The Modal Close Button */
.close {
  color: #aaa;
  float: right;
  margin-right: 15px;
  font-size: 28px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: black;
  text-decoration: none;
  cursor: pointer;
}

/* Vote Modal Box */
.card2-modal {
  text-align: center;
  position: fixed;
  left: 50%;
  margin-left: -475px;
  top: 50%;
  margin-top: -400px;
  padding: 0;
  min-width: 300px;
  background: #ffffff;
  border-radius: 5px;
  box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.3);
  -webkit-animation: fadein 2s;
          animation: fadein 2s;
  overflow:hidden;
  z-index: 999;
}
.modal-desctext {
	text-align: center;
	position:relative;
	float:left;
	z-index:1;
	min-height: 400px;
	padding: 0 10px 15px 10px;
}
.voteFrame {
	border: 0;
}
.modalVoteButton {
	height: 38px;
}


#darkmode-link {
	content: '\263E'; /* Moon Icon */
	display: inline-block;
}

html.darkmode {
	filter: invert(1) hue-rotate(180deg);
	-webkit-filter: invert( 1 ) hue-rotate( 180deg );
	#darkmode-link {
		content: '\263C'; /* Sun Icon */
	}
	
	img,
	video,
	svg,
	iframe {
		filter: invert( 1 ) hue-rotate( 180deg );
		-webkit-filter: invert( 1 ) hue-rotate( 180deg );
	}
	
		/* Normal links */
	a {
		color: @darkmode-link-color;
	}

	/* Visited links */
	a:visited {
		color: @darkmode-link-visited-color;
	}
}