@import url(icomon.css);
body {
	margin: 0;
	background: #e6e8ec;
	/*overflow-x: hidden;*/
}

a {
	text-decoration: none;
}

a:hover,
a:focus,
a:active {
	outline: none;
	text-decoration: none;
}

.wrapper.show {
	padding: 86px 0 0 300px;
}

.at-themebtn {
	color: #fff;
	font-size: 16px;
	padding: 0 30px;
	line-height: 44px;
	text-align: center;
	background: #018bcf;
	border-radius: 10px;
	display: inline-block;
	vertical-align: middle;
}

.at-themebtn + .at-themebtn {
	margin: 0 0 0 15px;
}

.at-themebtn:hover,
.at-themebtn:focus {
	color: #fff;
	background: #018bcf;
	-webkit-box-shadow: 0 5px 20px 0 rgba(1, 138, 205, 0.2);
	box-shadow: 0 5px 20px 0 rgba(1, 138, 205, 0.2);
}

.right-footer .at-themebtn + .at-themebtn {
	margin: 0 0 0 15px;
}

.mCSB_scrollTools .mCSB_draggerRail {
	width: 6px;
	background: #ddd;
}

._mCS_1 .mCSB_dragger .mCSB_dragger_bar {
	width: 6px;
	background-color: #02a2de;
}

._mCS_1 .mCSB_dragger .mCSB_dragger_bar:hover {
	background-color: #02a2de;
}

.mCSB_inside > .mCSB_container {
	margin-right: 12px;
}

.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
	margin: 0;
	height: 10px;
}

.at-stopwatchcontent {
	width: 100%;
	float: left;
	position: relative;
	background: #fff;
	height: calc(100% - 48px);
}

#goldenlayoutwrapper {
	background: url(/images/multi-games-background.png) no-repeat center center fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
}

#goldenlayoutfill-rest {
	display: flex;
	flex-direction: row;
	flex: 1;
}

#goldenlayoutlayoutContainer {
	flex: 1 1 auto;
}

.golder-layout-header {
	width: 100%;
	float: left;
	/* height: 35px; */
	/* display: flex;
	justify-content: space-between; */
	padding: 6px 90px 6px 20px;
	background: #fff;
}

.golder-layout-header img {
	float: left;
}

.golder-layout-header ul {
	margin: 0;
	list-style: none;
	align-items: center;
}

.golder-layout-header ul.at-gametabmenu {
	display: block;
	float: left;
	line-height: 20px;
	padding: 13px 20px 13px 40px;
}

.golder-layout-header ul.at-gametabmenu li {
	float: left;
	padding: 6px 20px;
	display: block;
	line-height: inherit;
	border-radius: 15px;
	background: rgba(0, 0, 0, 0.05);
}

.golder-layout-header ul.at-gametabmenu li.at-active {
	color: #fff;
	background: #02a2de;
}

.golder-layout-header ul.at-gametabmenu li + li {
	margin: 0 0 0 15px;
}

.golder-layout-header ul.at-allgames {
	float: right;
	display: flex;
	padding: 0;
	margin: 7px 0;
	max-width: 100%;
	overflow: auto;
	overflow-y: hidden;
	flex-flow: row wrap;
	border: 1px solid #fff;
	background: #02a2de;
	/* border: 1px solid slategray; */
	/* background-color: lightblue; */
}

.golder-layout-header ul.at-allgames li {
	padding: 5px;
}

.golder-layout-header ul.at-allgames li + li {
	border-left: 1px solid #fff;
}

.golder-layout-header ul li {
	cursor: pointer;
}

.golder-layout-header ul li img {
	width: 40px;
	height: 30px;
}

.lm_goldenlayout {
	background: url(/images/multi-games-background.png) no-repeat center center fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}

.folder,
.folder:after,
.folder:before {
	cursor: pointer;
}
.folder {
	margin: 30px 40px;
	width: 300px;
	height: 200px;
	position: relative;
	padding: 3px;
	display: inline-block;
	background-color: lightgrey;
	transform-origin: 150px 200px;
	transform: skew(0deg);
	z-index: 0;
	border-radius: 0 20px 20px 20px;
}
.folder:after {
	content: "";
	width: 300px;
	height: 200px;
	background-color: #eaea61;
	-webkit-box-shadow: inset -200px -200px 0px -188px rgba(56, 232, 12, 1), 0px 1px 3px 1px rgba(0, 0, 0, 0.6);
	-moz-box-shadow: inset -200px -200px 0px -188px rgba(56, 232, 12, 1), 0px 1px 3px 1px rgba(0, 0, 0, 0.6);
	box-shadow: inset -200px -200px 0px -188px rgba(56, 232, 12, 1), 0px 1px 3px 1px rgba(0, 0, 0, 0.6);
	border-radius: 0 20px 20px 20px;
	position: absolute;
	transform: skew(0deg) scaleX(1.1) scaleY(1.1);
	top: 6px;
}
.folder:before {
	content: "";
	font-size: 16px;
	box-sizing: content-box;
	top: -25px;
	left: -50px;
	height: 15px;
	padding: 3px 25px 10px 15px;
	background-color: #eaea61;
	position: absolute;
	z-index: 1;
	border-radius: 5px 5px 0px 0px;
	left: -12px;
	transform: skew(0deg);
}
.folder:hover {
	animation: anim_folder 0.3s alternate forwards;
}
.folder:hover:before {
	animation: anim_title 0.3s alternate forwards;
}
.folder:hover:after {
	animation: anim_front 0.3s alternate forwards;
}

/* .folder:before{
  content:element(a);
} */

@keyframes anim_front {
	from {
		transform: skew(0deg) scaleX(1.1) scaleY(1.1);
		left: 0px;
		-webkit-box-shadow: inset -200px -200px 0px -188px rgba(56, 232, 12, 1), 0px 1px 3px 1px rgba(0, 0, 0, 0.6);
		-moz-box-shadow: inset -200px -200px 0px -188px rgba(56, 232, 12, 1), 0px 1px 3px 1px rgba(0, 0, 0, 0.6);
		box-shadow: inset -200px -200px 0px -188px rgba(56, 232, 12, 1), 0px 1px 3px 1px rgba(0, 0, 0, 0.6);
	}
	to {
		transform: skew(7deg) scaleX(1.1) scaleY(1.1);
		left: -23px;
		-webkit-box-shadow: inset -200px -200px 0px -188px rgba(56, 232, 12, 1), 0px 1px 3px 1px rgba(0, 0, 0, 0.3);
		-moz-box-shadow: inset -200px -200px 0px -188px rgba(56, 232, 12, 1), 0px 1px 3px 1px rgba(0, 0, 0, 0.3);
		box-shadow: inset -200px -200px 0px -188px rgba(56, 232, 12, 1), 0px 1px 3px 1px rgba(0, 0, 0, 0.3);
	}
}

@keyframes anim_folder {
	from {
		transform: skew(0deg);
	}
	to {
		transform: skew(-3deg) translateY(-10px);
	}
}

@keyframes anim_title {
	from {
		left: -12px;
		transform: skew(0deg);
	}
	to {
		left: -51px;
		transform: skew(3deg);
	}
}

.card-columns {
	-webkit-column-count: 4;
	-moz-column-count: 4;
	column-count: 4;
}