store/* Body */
body {
	  
	font-family: source-sans-pro;
	background-color: #B7DCFF;
	 color: #000000;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	font-style: normal;
	font-weight: 200;
	
}/*Strip the ul of padding and list styling*/
	tr:nth-child(odd) {
  background-color: #BFBFBF;
		font-weight: bold;
	color: #000000;
}
tr:nth-child(even) {
  background-color: #cddbd8;
		font-weight: bold;
	color: #000000;
}
.lightheader {
	background-color: #BFBFBF;
	text-align: center;
	font-weight: bold;
	color: #9A0505;
}
/* Style the tab */
.tab {
  overflow: hidden;
  border: 1px solid #ccc;
  background-color: #f1f1f1;
}

/* Style the buttons that are used to open the tab content */
.tab button {
  background-color: inherit;
  float: left;
	 width: 16.5%;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 14px 16px;
  transition: 0.3s;
}

/* Change background color of buttons on hover */
.tab button:hover {
  background-color: #ddd;
}

/* Create an active/current tablink class */
.tab button.active {
  background-color: #ccc;
}

/* Style the tab content */
.tabcontent {
  display: none;
  padding: 6px 12px;
  border: 1px solid #ccc;
  border-top: none;
}
.tabcontent {
  animation: fadeEffect 5s; /* Fading effect takes 5 seconds */
}
	
div.gallery {
  margin: 5px;
  border: 1px solid #ccc;
  float:none;
  width: 300px;
}

div.gallery:hover {
  border: 1px solid #777;
}

div.gallery img {
  width: 100%;
  height: auto;
}

div.desc {
  padding: 20px;
	   overflow: hidden;
      display: -webkit-box;
   -webkit-line-clamp: 6; /* number of lines to show */
   -webkit-box-orient: vertical;
  text-align: left;
}


/* Go from zero to full opacity */
@keyframes fadeEffect {
  from {opacity: 0;}
  to {opacity: 1;}
}
/* Style the buttons that are used to open and close the accordion panel */
.accordion {
  background-color: #777;
  color: #444;
  cursor: help;
  padding: 18px;
  width: 90%;
	height: 250px;
  border: none;
  text-align: left;
  outline: none;
  font-size: 15px;
  transition: 0.4s;
}
/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
.active, .accordion:hover {
  background-color: #ccc; 
	color: #000000;
}
/* Add a symbols for expand and contract -  '\02795' Unicode character for "plus" sign (+)  */
.accordion:after {
  content: '\2695'; /*  Unicode character for colapsed folder */
  font-size: 26px;
  color: #777;
  float: left;
  margin-left: 5px;
}
.active:after {
  content: "\2624"; /* Unicode character for expanded folder */
}

/* Style the accordion panel. Note: hidden by default */
.panel {
  padding: 0 18px;
  background-color: #B7DCFF;
	 width: 90%;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
}
.about {
	font-family:Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
	
text-align: left;
	color:#000000;
	
	  margin-left: auto;
    margin-right: auto;
    width: 90%;
		font-size: 18px;
	letter-spacing: 1px;
	
	}

ul {
      width: 100%;
   display: table;
   text-align: center;
	list-style-type:none;
    margin:0;
	float:none;
	padding-left:0;
	padding-right:0;
    position:absolute;
}
/*Create a horizontal list with spacing*/
li {
    display:block;
   	float: left;
    ;
}
/*Style for menu links*/
li a {
    display:block;
    min-width:120px;
    height: 115px;
    text-align: center;
    line-height: 100px;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: #fff;
    background: #7C0000;
    text-decoration: none;
}
/*Hover state for top level links*/
li:hover a {
    background: #b7dcff;
  color: #000000;
}
/*Style for dropdown links*/
li:hover ul a {
    background: #7C0000;
    color: #fff;
    height: 40px;
    line-height: 40px;
}
/*Hover state for dropdown links*/
li:hover ul a:hover {
    background: #b7dcff;
    color: #000000;
	}
/*Hide dropdown links until they are needed*/
li ul {
   display: none;
}
/*Make dropdown links vertical*/
li ul li {
    display: block;
    float: none;
}
/*Prevent text wrapping*/
li ul li a {
    width: auto;
    min-width: 100px;
    padding: 0 20px;
}
/*Display the dropdown on hover*/
ul li a:hover + .hidden, .hidden:hover {
    display: block;
}
/*Style 'show menu' label button and hide it by default*/
.show-menu {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    text-decoration: none;
    color: #fff;
	    background: #7C0000;
    text-align: center;
    padding: 9px 0;
	    display: none;
}
/*Hide checkbox*/
input[type=checkbox]{
    display: none;
}
/*Show menu when invisible checkbox is checked*/
input[type=checkbox]:checked ~ #menu{
    display: block;
}
	.contained_large{
	 border-radius: 5px;
  background-color: #B7DCFF;
  padding: 20px;	
}
.contained {
  border-radius: 5px;
	width: 80%;
	background-color: #B7DCFF;
  
	}
.storelayout{
	  display: grid;
  grid-template-columns: auto auto auto;
  grid-gap: 10px;
   padding: 0px;
margin: auto;
  justify-content: center;
  align-content: center;
  	text-align: center;
	width:80%;
}
	
	
.storelayout > article {
  text-align: center;
  padding: 0px 0;
  }


.col-container {
  display: table; /* Make the container element behave like a table */
  width: 100%; /* Set full-width to expand the whole page */
	
}

.col {
  display: table-cell; /* Make elements inside the container behave like table cells */
width: 50%;
}


	.contained2hide {
	width: 75%;
		display: block;
	}
/* Dropdown Button */
.dropbtn {
   display:block; background-color: #7C0000;
  color: #B7DCFF;
  padding: 16px;
  font-size: 16px;
  border: none;
}
/* The container <div> - needed to position the dropdown content */
.dropdown {
  position: relative;
  display: inline-block;
}
/* Dropdown Content (Hidden by Default) */
.dropdown-content {
  display: none;
  position: absolute;
  background-color: #B7DCFF;
  min-width: 250px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}
/* Links inside the dropdown */
.dropdown-content a {
  color: #b7dcff;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
	
}
/* Change color of dropdown links on hover */
.dropdown-content a:hover {background-color: #000000; color: #b7dcff}
/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {display: block;}
/* Change the background color of the dropdown button when the dropdown content is shown */
.dropdown:hover .dropbtn {

	color: #7C0000;
}



.iframecontainer {
  position: relative;
  overflow: hidden;
  width: 100%;
  padding-top: 56.25%; 
}

/* Then style the iframe to fit in the container div with full height and width */
.responsive-iframe {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
}








/*Responsive Styles*/
@media screen and (max-width : 1006px){
    /*Make dropdown links appear inline*/
    ul {
        position: static;
        display: none;
    }
    /*Create vertical spacing*/
    li {
        margin-bottom: 0px;
    }
    /*Make all menu links full width*/
    ul li, li a {
        width: 100%;
    }
    /*Display 'show menu' link*/
    .show-menu {
        display:block;
		    }
		.contained2hide {
			display: none;
	}
	.nmgsfooter {
	background-color: #717070;
	padding-bottom: 5px;
}

}.homebutton {
margin-top: 2px;
	margin-left: 3px;
	background-color: #E8E8E8;
	text-align: center;
	vertical-align: center;
	border-radius: 0px;
	text-transform: uppercase;
	font-weight: bold;
	letter-spacing: 2px;
	color: #FFFFFF;
	transition: all 0.3s linear;
}
.homebutton:hover {
	background-color: #B7DCFF;
	color: #C4C4C4;
	cursor: pointer;
}

/*Shops page */
.profilepix {
	height: 75%;
	width: 75%;
margin-top: 1px;
	margin-left: 1px;
		text-align: center;
	vertical-align: center;
	border-radius: 0px;
	text-transform: uppercase;
	font-weight: bold;
	letter-spacing: 2px;
		transition: all 0.3s linear;
}


.shopbutton {
	height: 75%;
	width: 75%;
margin-top: 1px;
	margin-left: 1px;
	background-color: #FFFFFF;
	text-align: center;
	vertical-align: center;
	border-radius: 0px;
	text-transform: uppercase;
	font-weight: bold;
	letter-spacing: 2px;
	color: #FFFFFF;
	transition: all 0.3s linear;
}
.shopbutton:hover {
	background-color: #B7DCFF;
	color: #C4C4C4;
	cursor: pointer;
}
.shop_column{
padding-left: 5px;
  margin: auto;
  border: 3px solid #000000;
	text-align: center;
	float: center;
	 max-width: 425px;
	height: auto;
}

.halfcolumn{
	display: table-cell; /* Make elements inside the container behave like table cells */
padding-left: 5px;
  margin: auto;
  border: 3px solid #000000;
	text-align: center;
	float: center;
	 max-width: '50%';
	height: auto;
}

.Featured_stores{
	vertical-align: center;
	
}
.Featured_stores2{
vertical-align: center;
}
	.contained_large{
	 border-radius: 5px;
  background-color: #B7DCFF;
  padding: 20px;	
}

.shopicon {
	height: 15%;
	width: 15%;
margin-top: 1px;
	margin-left: 1px;
		background-color: #FFFFFF;
		text-align: center;
	vertical-align: center;
	border-radius: 0px;
	text-transform: uppercase;
	font-weight: bold;
	letter-spacing: 2px;
	color: #FFFFFF;
	transition: all 0.3s linear;
}
.shopicon:hover {
	color: #FFFFFF;
	background-color: #B7DCFF;
			cursor: pointer;
	
}
.hosticon {
				background-color: #045ab1;
		vertical-align: center;
	border-radius: 0px;
		transition: all 0.3s linear;
}
.hosticon:hover {
	background-color: #B7DCFF;
			cursor: pointer;
}
.hosticon2 {
				background-color: #045ab1;
	max-width: 50%;
		vertical-align: center;
	border-radius: 0px;
		transition: all 0.3s linear;
}
.hosticon2:hover {
	background-color: #B7DCFF;
			cursor: pointer;
}
.modicon {
	max-width: 16%;
			background-color: #b501bc;
		vertical-align: center;
	border-radius: 0px;
		transition: all 0.3s linear;
}
.modicon:hover {
	background-color: #B7DCFF;
			cursor: pointer;
}
.playericon {
	max-width: 50%;
			background-color: #93d250;
		vertical-align: center;
	border-radius: 0px;
		transition: all 0.3s linear;
}
.playericon:hover {
	background-color: #B7DCFF;
			cursor: pointer;	
}
.adminicon {
	max-width: 33%;
			background-color: #5c5c5c;
		vertical-align: center;
	border-radius: 0px;
		transition: all 0.3s linear;
}
.adminicon:hover {
	background-color: #B7DCFF;
			cursor: pointer;
	
}
/*Mature */
.mature {
	width: 90%;
	margin-left: auto;
	margin-right: auto;
	height: 100%;
	background-color: #0F0000;
	filter: sepia(50%);
	filter: grayscale(50%);
	
		}
/* Container */
.container {
	width: 90%;
	margin-left: auto;
	margin-right: auto;
	height: 100%;
	background-color: #B7DCFF;
}
/* Container */
.slideshow-container {
	width: 90%;
	margin-left: auto;
	margin-right: auto;
	height: 100%;
	background-color: #222222;
}
/* Navigation */
header {
	width: 100%;
	height: 120px;
	font-weight: bold;
	justify-content:space-around;
	background-color: #7C0000;
	border-bottom:0px solid #2C9AB7;
}
.logo {
	color: #fff;
	font-weight: bold;
	text-align: undefined;
		margin-top: 15px;
	margin-left: 10px;
	margin-right: 10px;
	letter-spacing: 4px;
}
.icon {
font: bold;
	color: #C4C4C4;
	text-align: left;

}
.icon:hover {
	background-color: #FEFEFE;
	color: #C4C4C4;
	cursor: pointer;
}
nav {
	float: right;
	width: 50%;
	text-align: right;
	margin-right: 5px;
}

header nav ol {
	list-style: none;
	float: right;
	
}
nav ol li {
	list-style-type: none;
	float: right;
	color: #FFFFFF;
	font-size: 20px;
	text-align: right;
	margin-right: 15px;
	letter-spacing: 2px;
	font-weight: bold;
	transition: all 0.3s linear;
}
ol li z {
    align-content: flex-start;
	color: #0D0505;
	text-decoration: none;
}
ol li:hover z {
	color: #000000;
}
ol li a {
    align-content: flex-start;
	color: #FFFFFF;
	text-decoration: none;
}
ol li:hover a {
	color: #000000;}
header nav ul {
	list-style: none;
	float: right;
}
nav ul li {
	float: right;
	color: #FFFFFF;
	font-size: 20px;
	text-align: right;
	margin-right: 15px;
	letter-spacing: 2px;
	font-weight: bold;
	transition: all 0.3s linear;
}
ul li z {
    align-content: flex-start;
	color: #0D0505;
	text-decoration: none;
}
ul li:hover z {
	color: #000000;
}
ul li a {
    align-content: flex-start;
	color: #FFFFFF;
	text-decoration: none;
}
ul li:hover a {
	color: #000000;
}
.hero_header {
	color: #430000;
	text-align: center;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	letter-spacing: 4px;
	
}

/* Convention Section */
/* Style the container with a rounded border, grey background and some padding and margin */
.concontainer {
  border: 2px solid #ccc;
  background-color: #eee;
  border-radius: 5px;
  padding: 16px;
  margin: 16px 0;
}

/* Clear floats after containers */
.concontainer::after {
  content: "";
  clear: both;
  display: table;
}

/* Float images inside the container to the left. Add a right margin, and style the image as a circle */
.concontainer img {
  float: left;
  margin-right: 20px;
  border-radius: 5%;
}

/* Increase the font-size of a span element */
.concontainer span {
  font-size: 20px;
  margin-right: 15px;
}

.conrow {
  margin: 8px -16px;
}

/* Add padding BETWEEN each column (if you want) */
.conrow,
.conrow > .concolumn {
  padding: 8px;
}

/* Create four equal columns that floats next to each other */
.concolumn {
  float: left;
  width: 25%;
}

/* Clear floats after rows */
.conrow:after {
  content: "";
  display: table;
  clear: both;
}

/* Content */
.concontent {
  background-color: white;
  padding: 10px;
}



/* Hero Section */
.hero {
	background-color: #B7DCFF;
	padding-top: 15px;
	padding-bottom: 5px;
	padding-right: 5px;
	padding-left: 5px;
}

.imageconstraint{
	max-width: 100%;
	max-height:inherit;
	height: auto;
/* fit images to container */}
.imageconstraintsmaller{
	width: 15%;
	    height: auto;
/* fit images to container */}

.light {
	font-weight: bold;
	color: #9A0505;
}
.tagline {
	text-align: center;
	color: #470F18;
	margin-top: 4px;
	font-weight: bold;
	text-transform: uppercase;
	letter-spacing: 1px;
}
.Paragraph {
	text-align: left;
	margin-left: 5%;
			margin-right: 5%;
	font-weight: bold;
	color: #21121A;
	background: #B7DCFF;
	letter-spacing: 2px;
}
.Paragraph2 {
	text-align: left;
			margin-right: 5%;
	font-weight: bold;
	color: #21121A;
	
}
/* About Section */
.text_column {
	text-align: left;
		line-height: 25px;
	float: left;
	padding-left: 20px;
	padding-right: 20px;
	color: #000000;
}
.about {
	padding-left: 25px;
	padding-right: 25px;
	padding-top: 15px;
	padding-bottom: 15px;
	
	display: inline-block;
	background-color: #B7DCFF;
	margin-top: 0px;
}
.CoC {
	width: 100%;
			padding-top: 15px;
	padding-bottom: 15px;
	
			margin-right: 1%;	
	
	display: inline-block;
	background-color: #B7DCFF;
	
}
/* Stats Gallery */
.stats {
	color: #717070;
	margin-bottom: 5px;
}
.gallery {
	clear: both;
	display: inline-block;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	
		padding-bottom: 35px;
	padding-top: 0px;
	margin-top: 0px;
	margin-bottom: 0px;
	
	
}
.gallery2 {
	clear: both;
	display: inline-block;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	
		padding-bottom: 35px;
	padding-top: 0px;
	margin-top: 0px;
	margin-bottom: 0px;
	
	
}
.thumbnail {
	width: 30px;
	vertical-align: text-bottom;
	}
.gallery .thumbnail h4 {
	margin-top: 5px;
	margin-right: 5px;
	margin-bottom: 5px;
	margin-left: 5px;
	color: #52BAD5;
}
.gallery .thumbnail p {
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	color: #A3A3A3;
}
/* Parallax Section */
.banner {
	background-color: #B7DCFF;
	background-image: url(../images/parallax.png);
	height: 400px;
	background-attachment: fixed;
	background-size: cover;
	background-repeat: no-repeat;
}
.parallax {
		width: 95%;
	text-align: center;
	padding-top: 110px;
	}
.parallax_description {
	width: 95%;
	text-align: center;
	}
.blocktext {
    margin-left: auto;
    margin-right: auto;
    width: 90%;
	color: #470F18;
	text-align: left;
	font-weight: bold;
	font-size: 18px;
	letter-spacing: 1px;
	background: #B7DCFF;
	}
.boxtext {
	width: 100%;
	align-self: center;
	text-align: left;
	float: center;
padding-bottom: 35px;
	margin-bottom: 10px;
}
/* More info */
.nmgsfooter {
	background-color: #717070;
	padding-bottom: 5px;
}
.footer_column {
	width: 50%;
	text-align: center;
}
footer .footer_column h3 {
	color: #B3B3B3;
	text-align: center;
}
footer .footer_column p {
	color: #717070;
	background-color: #FFFFFF;
	
}
.footer_column_1 {
	width: 25%;
	text-align: center;
	justify-content: center;
		margin-bottom: 5px;
}
footer .footer_column_1 h3 {
	color: #B3B3B3;
	text-align: center;
}
footer .footer_column_1 p {
	color: #717070;
	background-color: #FFFFFF;
	
}.footer_column_2 {
	width: 20%;
	
	text-align: center;
	float:left;
	margin-bottom: 5px;

}
footer .footer_column_2 h3 {
	color: #B3B3B3;
	text-align: center;
}
footer .footer_column_2 p {
	color: #717070;
	background-color: #FFFFFF;
	}
.socialmediafooter {
width: 100%;
	

	margin-right: 20%;
	height: 75px;
	

}
footer .socialmediafooter h3 {
	color: #B3B3B3;
	text-align: center;
	
}
footer .socialmediafooter p {
	color: #717070;
	background-color: #FFFFFF;
}
.footer_column_3 {
	width: 25%;
	text-align: center;
	justify-content: center;
	float: left;
	margin-bottom: 5px;

}
footer .footer_column_3 h3 {
	color: #B3B3B3;
	text-align: center;
}
footer .footer_column_3 p {
	color: #717070;
	background-color: #FFFFFF;
}
.footer_column_4 {
	width: 25%;
	text-align: center;
	justify-content: center;
	float: right;
	margin-bottom: 5px;

}
footer .footer_column_4 h3 {
	color: #B3B3B3;
	text-align: center;
}
footer .footer_column_4 p {
	color: #717070;
	background-color: #FFFFFF;
}
.cards {
	width: 100%;
	height: auto;
	max-width: 400px;
	max-height: 200px;
}
footer .footer_column p {
	padding-left: 30px;
	padding-right: 30px;
	text-align: justify;
	line-height: 25px;
	font-weight: lighter;
	margin-left: 20px;
	margin-right: 20px;
}
.button {
	margin-top: auto;
	margin-right: auto;
	margin-bottom: auto;
	margin-left: auto;
	padding-top: 1%;
	padding-right: 1%;
	padding-bottom: 1%;
	padding-left: 1%;
	text-align: center;
	vertical-align: middle;
	border-radius: 0px;
	text-transform: uppercase;
	font-weight: bold;
	letter-spacing: 2px;
	border: 3px  ;
	color: #FFFFFF;
	transition: all 0.3s linear;
}
.button:hover {
	background-color: #FEFEFE;
	color: #C4C4C4;
	cursor: pointer;
}

.CoC_buttons {
	width: 100%;
	hieght: auto;
	text-align: left;
	float: left;
		background-color: #FEFEFE;
		border: 3px solid;
	transition: all 0.3s linear;
}
.CoC_buttons:hover {
	background-color: #706666;
	color: #C4C4C4;
	cursor: pointer;
}
.homebutton {
margin-top: 2px;
	margin-left: 3px;
	background-color: #E8E8E8;
	text-align: center;
	vertical-align: center;
	border-radius: 0px;
	text-transform: uppercase;
	font-weight: bold;
	letter-spacing: 2px;
	color: #FFFFFF;
	transition: all 0.3s linear;
}
.homebutton:hover {
	background-color: #B7DCFF;
	color: #C4C4C4;
	cursor: pointer;
}
.copyright {
	text-align: center;
	padding-top: 20px;
	padding-bottom: 5px;
	background-color: #717070;
	color: #FFFFFF;
	text-transform: uppercase;
	font-weight: lighter;
	letter-spacing: 2px;
	border-top-width: 2px;
}
.footer{
		text-align: center;
	padding-top: 20px;
	padding-bottom: 5px;
	background-color: #717070;
	color: #FFFFFF;
	text-transform: uppercase;
	font-weight: lighter;
	letter-spacing: 2px;
	border-top-width: 2px;
}
.footer_banner 
{width: 25%; background-color: #B3B3B3; padding-bottom: 5px}

footer {
	display: inline-block;
}
.hidden {
	display: none;
}

* {
  box-sizing: border-box;
}

/* Position the image container (needed to position the left and right arrows) */
.container {
  position: relative;
}
/* Position the image container (needed to position the left and right arrows) */
.slideshow-container {
  position: relative;
}

/* Hide the images by default */
.mySlides {
  display: none;
}

/* Add a pointer when hovering over the thumbnail images */
.cursor {
  cursor: pointer;
}

/* Next & previous buttons */
.prev,
.next {
  cursor: pointer;
  position: absolute;
  top: 40%;
  width: auto;
  padding: 16px;
  margin-top: -50px;
  color: white;
  font-weight: bold;
  font-size: 20px;
  border-radius: 0 3px 3px 0;
  user-select: none;
  -webkit-user-select: none;
}

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* Position the "previous button" to the left */
.prev {
  left: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover,
.next:hover {
  background-color: rgba(0, 0, 0, 0.8);
}



/* Next & previous buttons */
.prevslide,
.nextslide {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  padding: 16px;
  margin-top: -50px;
  color: white;
  font-weight: bold;
  font-size: 20px;
  border-radius: 0 3px 3px 0;
  user-select: none;
  -webkit-user-select: none;
}

/* Position the "next button" to the right */
.nextslide {
  right: 10%;
  border-radius: 3px 0 0 3px;
}

/* Position the "previous button" to the left */
.prevslide {
  left: 45%;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prevslide:hover,
.nextslide:hover {
  background-color: rgba(0, 0, 0, 0.8);
}

/* Next & previous buttons */
.prevslide1,
.nextslide1 {
  cursor: pointer;
  position: absolute;
  top: 40%;
  width: auto;
  padding: 16px;
  margin-top: -50px;
  color: white;
  font-weight: bold;
  font-size: 20px;
  border-radius: 0 3px 3px 0;
  user-select: none;
  -webkit-user-select: none;
}

/* Position the "next button" to the right */
.nextslide1 {
  right: 45%;
  border-radius: 3px 0 0 3px;
}

/* Position the "previous button" to the left */
.prevslide1 {
  left: 5%;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prevslide1:hover,
.nextslide1:hover {
  background-color: rgba(0, 0, 0, 0.8);
}

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
	  margin-top: 1px;
  margin-right: 2px;
  top: 0;
	right:0;
}

/* Container for image text */
.caption-container {
  text-align: center;
  background-color: #222;
  padding: 2px 16px;
  color: white;
}

.row:after {
  content: "";
  display: table;
  clear: both;
}

/* Six columns side by side */
.column {
  float: left;
  width: 16.66%;
}

/* Add a transparency effect for thumnbail images */
.demo {
  opacity: 0.6;
}

.active,
.demo:hover {
  opacity: 1;
}
/* Responsive layout - makes a two column-layout instead of four columns */
@media screen and (max-width : 800px) {
  .column {
    flex: 50%;
    max-width: 50%;
  }	.modicon {
max-width: 15.5%;
	}
	.adminicon {
max-width: 32.5%
	}	
}
  .concolumn {
    width: 25%;
  }


/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width : 600px) {
		.col-container {
		display: grid;

	}
	.col {
 	display: block;
	width: 100%;
	}

 		  .concolumn {
    width: 50%;
  }
.playericon {
max-width: 49%;
	}
	.column {
    flex: 100%;
    max-width: 100%;
  }	.modicon {
max-width: 15%px;
	}
	.adminicon {
max-width: 32.5%
	}	
	
}
@media screen and (max-width: 511 px){
	.col-container {
		display: grid;
		
	}
	.col {
 	display: block;
	width: 100%;
	}

	.modicon {
max-width: 14.5%;
	}
.playericon {
max-width: 49%;
	}
  .concontainer {
    text-align: center;
  }

  .concontainer img {
    margin: auto;
    float: none;
    display: block;
  }



	  .concolumn {
    width: 100%;
  }

		.adminicon {
	max-width: 32.5%;
	}

/* Mobile */
@media screen and (max-width : 450px) {
		.col-container {
		display: grid;
		
	}
	.col {
 	display: block;
	width: 100%;
	}
	.modicon {
max-width: 15%;
	}
	  .concolumn {
    width: 100%;
  }
	.playericon {
max-width: 49%;
	}

		.adminicon {
	max-width: 32.5%;
	}
	.button {
			font-size: 10px;
			width: 90%;
	height: 75%;
	}
		.storelayout{
	  display: inline-block;
  margin: auto;
  justify-content: center;
  align-content: center;
  	text-align: center;
	width:100%;
		
	}.shop_column {
  margin: auto;
		padding-left: 5px;
  border: 3px solid #000000;
	text-align: center;
	 max-width: 500px;
	}

	
	nav {
	float: center;
	width: 100%;
	text-align: center;
	margin-right: 5px;
}header {
	width: 100%;
	height: 100%;
	background-color: #7C0000;
	border-bottom: 1px solid #2C9AB7;
}
	header nav ol {
	list-style: none;
	float: center;
	
}
nav ol li {
	float: left;
	font-size: 25px;
	}
	.homebutton {
			height: auto;
		width: 80%;
	vertical-align: center;
		}
	.button {
			font-size: 14px;
			width: 90%;
	height: 75%;
	}
	.contained_large{
	 display: none;
}

}
/* Tablets */
@media (min-width : 451px)and (max-width : 1006px)
{header {
	width: 100%;
	height: 100%;
	background-color: #7C0000;
	border-bottom: 1px solid #2C9AB7;
}  .concolumn {
    width: 100%;
  }

	.nmgsfooter {
	background-color: #717070;
	padding-bottom: 5px;
}
	.contained {
  border-radius: 5px;
  background-color: #B7DCFF;

	}
	.button {
	width: 75%;
	height: 50%;
	margin-top: 10px;
		padding-top: 10px;
	padding-bottom: 20px;
	}
	.contained_large{
	 display: none;
}
	.storelayout{
	  display: inline-block;
  margin: auto;
  justify-content: center;
  align-content: center;
  	text-align: center;
	width:80%;
		
	}.shop_column {
  margin: auto;
		padding-left: 5px;
  border: 3px solid #000000;
	text-align: center;
	float: center;
	 max-width: 500px;
	}
		
/* Small Desktops */
@media ( min-width : 1007px ) and (max-width : 1155px ){
	nav {
	float: right;
	width: 80%;
	text-align: right;
	margin-right: 5px;
}

	.button {
			font-size: 14px;
			width: 90%;
	height: 75%;
	}

	nav ol li {
	list-style-type: none;
	float: right;
	color: #FFFFFF;
	font-size: 18px;
	text-align: right;
	margin-right: 15px;
	letter-spacing: 2px;
	font-weight: bold;
	transition: all 0.3s linear;
}
	
	.contained2hide {
			display: none;
	}

.imageconstraintsmaller{
	width: 20%;
	    height: auto;
/* fit images to container */}
	.text_column {
	width: 100%;
}
.text_column {
	width: 100%;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	}
.banner {
	margin-top: 0px;
	padding-top: 0px;
	}
	}
/* Style inputs with type="text", select elements and textareas */
input[type=text], select, textarea {
  width: 90%; /* Full width */
  padding: 12px; /* Some padding */ 
  border: 1px solid #B7DCFF; /* Gray border */
  border-radius: 4px; /* Rounded borders */
  box-sizing: border-box; /* Make sure that padding and width stays in place */
  margin-top: 6px; /* Add a top margin */
  margin-bottom: 16px; /* Bottom margin */
  margin-left: 5%; /* Add a top margin */
  margin-right: 5%; /* Bottom margin */
  resize: vertical /* Allow the user to vertically resize the textarea (not horizontally) */
}

/* Style the submit button with a specific background color etc */
input[type=submit] {
align-content: center;
	border: 3px #161314;
	cursor: pointer;
	width: 90%;
	height: 75%;
	background-color:#585858;
	margin-top: 40px;
	padding-top: 20px;
	padding-right: 10px;
	padding-bottom: 20px;
	padding-left: 10px;
	text-align: center;
	vertical-align: middle;
	border-radius: 0px;
	text-transform: uppercase;
	font-weight: bold;
	letter-spacing: 2px;
		color: #FFFFFF;
	transition: all 0.3s linear;
}

/* When moving the mouse over the submit button, add a darker green color */
input[type=submit]:hover {
 	background-color: #FEFEFE;
	color: #868686;
	cursor: pointer;
}
.contained {
  border-radius: 5px;
  background-color: #B7DCFF;
  
	}
	
	
	
	.contained_large{
	 border-radius: 5px;
  background-color: #B7DCFF;
  padding: 20px;	
	}
	
}

.Featured_stores{
}
.Featured_stores2{
}
shop_column {
 padding-left: 5px;
  margin: auto;
  border: 3px solid #000000;
	text-align: center;
	float: left;
	 max-width: 500px;
	}
	.blo {
}
}.center {
}