
.IWrapper {

	width:100%;
	height:100%;
	display: flex;
  justify-content: center;
	align-items: center;
	position:relative;
	background-color:#000;
	}


		/* Index Page */
	.iGrid {
	    display: grid;
	    grid-template-columns: repeat(3, 1fr);
	    grid-gap: 10px;
			width: 782px;
			max-height:752px;

	}
	.iCols{grid-column: span 3 / auto;
		max-height:500px;
		min-height:400px;
		display: flex;
		justify-content: center;
		align-items: center;
	}


	.iTitle {width:100%; height:300px;text-align: center}

	.iLogo{
		width: 600px;
		height: 180px;

	 }

.iBlock{width:250px;height:188px;padding:2px;margin:0px;}


	.iBlock img {
		-webkit-filter: grayscale(100%);
		  -webkit-transition: .5s ease-in-out;
		  -moz-filter: grayscale(100%);
		  -moz-transition: .5s ease-in-out;
		  -o-filter: grayscale(100%);
		  -o-transition: .5s ease-in-out;
		  filter: grayscale(100%);
 }

 .iBlock img:hover {
	 -webkit-filter: grayscale(0%);
	   -webkit-transition: .5s ease-in-out;
	   -moz-filter: grayscale(0%);
	   -moz-transition: .5s ease-in-out;
	   -o-filter: grayscale(0%);
	   -o-transition: .5s ease-in-out;
	   filter: grayscale(0%);
 }



	/* Create three equal columns that floats next to each other */
.iColumn {
  float: left;
  width: 33.33%;
  padding: 50px;
  height: 300px; /* Should be removed. Only for demonstration */
	background-color: #fff;
}

/* Clear floats after the columns */
.iRow:after {
  content: "";
  display: table;
  clear: both;
	box-sizing: border-box;
}

/* Fonts */

#arrow { font-family: MPLSC; font-size: 100px; font-weight: 100; color:#fff; padding: 30px 25px;}

#IndexTxt {font-family: MPLSC; font-size: 30px; font-weight: 500; color:#fff;}
#IndexTxt50 {font-family: MPLSC; font-size: 30px; font-weight: 500; color: rgba(255, 255, 255, 0.5);}

#ReduxTxt {padding: 14px 14px;font-family: MPLSC; font-size: 28px; font-weight: 500; color:#fff;}

#BanTxt { font-family: MPLSC; font-size: 60px; font-weight: 100; color:#fff; padding: 30px 35px 30px 20px;}

#BigTxt { font-family: MPLSC; font-size: 35px; font-weight: 900; color:#fff; }

#ContTxt { font-family: MPLSC; font-size: 30px; font-weight: 500; color:#fff; padding: 20px 20px;}

#DataTxt {font-family: MPLSC; font-size: 28px; font-weight: 500; color:#fff;}
#DataTxt50 {font-family: MPLSC; font-size: 28px; font-weight: 500; color: rgba(255, 255, 255, 0.5);}

#DataSmTxt {font-family: MPLSC; font-size: 25px; font-weight: 500; color:#fff;}


/* Outer */
.wrapper {
	width:100%;
	height:100%;
	display: flex;
  justify-content: center;
  align-items: center;
	position:relative;

	}

.container {
	  width:1800px;
    height: 1350px;

		background-color:#fff;
    display: grid;
    grid-gap: 0px;
    grid-template-columns:
    	[main-start] 45px
    	[content-start] auto
    	[content-end] 45px [main-end];

    grid-template-rows:
    	[main-start] 45px
    	[content-start] auto
    	[content-end] 45px [main-end];
}

.to {
    grid-column: main;
    background-color:#fff;
}

.lo { background-color:#fff; width:45px; height:1260px; font-size: 10px; position:relative;
}



.ro {background-color:#fff; width:45px; height:1260px;}

.bo {
    grid-column: main;
    background-color:#fff;
}

.content {
    grid-area: content;
    width:1710px;
    height:1260px;
    position:relative;

}



#flag {height:135px; width:45px; position: absolute; top:90; left:0;}

.Flag {background-image: url("../imgs/flagl.png");}

a.Flag:link, a.Flag:visited {
  opacity: 0.5;
  border: none;
  -webkit-transition-duration: 0.4s;
  transition-duration: 0.4s;
  text-decoration: none;
  cursor: pointer;
  display: inline-block;
}

a.Flag:hover, a.Flag:active {
   opacity: 1;
}

#pt { height:90px; width:45px; background-color:#fff; position: absolute; top:0; left:0;}

#pc {height:30px; width:45px; background-color:#fff; position: absolute; top:225; left:0;}

#pb {height:45px; width:45px; background-color:#fff; position: absolute; top:1215; left:0;}

#cont {height:960px; width:45px; background-color:#fff; position: absolute; top:255; left:0;}


/* Inner */

.grid {
    width:1710px;
    height:1260px;
    position:relative;
    display: grid;
    grid-template-columns: repeat(6, auto);
    grid-gap: 0px;
    position:relative;
}

.TopPad {grid-column: span 5 / auto; height:90px; width:1663px;}

.CenPad {grid-column: span 5 / auto; height:30px;}

.BotPad {grid-column: span 5 / auto; height:45px;}

.Banner {grid-column: span 4 / auto;
	height:135px;
	width:1618px;
	display: flex;
  align-items: center;}

.ContLeft {grid-column: span 2 / auto; width:810px;}

.ContRight {grid-column: span 2 / auto; width:810px;}

.Cont {grid-column: span 4 / auto; width:1620x; box-sizing: border-box;}

.RightGut {grid-row: span 5 / auto; width:45px;}

#FGut {width:45px; height:135px; position:relative; }

#ContGut {width:45px; height:960px;}

/* Index Grid */

.IndexGrid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 5px;
    width:1620px;
    box-sizing: border-box;
	 padding:20px;
}
.IG-colspan{grid-column: span 3 / auto; padding:10px;}

.IG-colspan-title{grid-column: span 3 / auto;
		display: flex;
  	justify-content: center;
  	align-items: center;
		font-size: 50px;
 		font-weight: 100;}

#IG-columns {
	display:inline-block;
  width:auto;
        -moz-column-count: 3;
        -moz-column-gap: 5px;
        -webkit-column-count: 3;
        -webkit-column-gap: 5px;
        column-count: 3;
        column-gap: 5px;
				column-fill: auto;
    }

ol {margin-top: 0px;}

.TeamGrid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    max-width: 430px;
}
