﻿body {
	overflow-y:scroll;
}

.holidaybg {
	background-image: url('images/FrontPage/_Holiday/HolidayBackground.png');
	background-repeat: repeat;
	background-position: center; 
	background-attachment: fixed;
	background-size: cover;
	z-index: -1;
}

.container-full {
  margin: 0 auto;
  width: 100%;
  padding-left: 10px;
  padding-right: 10px;
}

/* Set padding to keep content from hitting the edges */
.body-content {
	padding: 2% 5%;
    /*padding-left: 5%;
    padding-right: 5%;*/
	position: relative;
}


/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

/* Set width on the form input elements since they're 100% wide by default
input,
select,
textarea {
    max-width: 280px;
}
 */




.tab-content {
	border-left: 1px solid #ddd;
	border-right: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
	padding: 10px;
}

.navbar {
	margin: 0;
}

.nav-tabs {
	margin-bottom: 0;
}

.nav-tabs li a{
	font-size: larger;
	font-weight: bold;
}


.modal-xl {
	width: 90%;
}

@media (min-width: 992px) {
	.modal-lg {
		width: 900px;
	}
}

@media (min-width: 1500px) {
	.modal-xl {
		width: 1450px;
	}
}

.modal-header {
	color: #FFF;
	padding: 9px 15px;
	border-bottom: 1px solid #eee;
	background-color: #337ab7;
	-webkit-border-top-left-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 5px;
     border-top-left-radius: 5px;
     border-top-right-radius: 5px;
}


.processingOverlay{
	background-color: #FFF;
	display: none;
	left: 0;
	right: 0;
	top: 0;
	bottom :0;
	z-index: 1000;
	padding-top: 10px;
	position: absolute;
	opacity: .6;
}



#vendors .popover{
	width: 400px;
    max-width: none;
}




.footer {
	background-color: #f4f4f4;
	padding: 10px;
	padding-left: 40px;
	padding-right: 40px;
	position: relative !important;
	z-index: 999 !important;
}

	.footer .col-sm-3 {
		text-align: center;
	}

	.footer h3 {
		color: #009bbd;
		font-size: 20px;
		font-weight: bold;
	}

	.footer a {
		color: #5f5f5f;
		text-decoration: none;
	}

	.footer a:hover{
		text-decoration: underline;
	}

	.footer h4 {
		color: #009bbd;
		font-size: 17px;
	}

	.footer .map {
		color: #009bbd;
	}

.copyright{
	margin-top: 20px;
	text-align: center;
}

.staticContent{
	font-size: 16px;
}

	.staticContent h4.h4_a {
		color: #9e120f;
		margin-top: 30px;
	}

	.staticContent h4.h4_b {
		color: #008334;
		margin-top: 30px;
	}



.navbar {
	position: relative;
}

.navbar .navbar-collapse .nav .dropdown .dropdown-toggle {
	color: #333;
}

.navbar-inverse .navbar-nav > .open > a, .navbar-inverse .navbar-nav > .open > a:hover, .navbar-inverse .navbar-nav > .open > a:focus {
}

.navbar .navbar-collapse .nav a {
	color: #333;
}

.navbar .navbar-collapse .nav .dropdown .dropdown-menu a {
	color: #000;
}

.customHeader {
	background-color: #0095ba;
	color: #FFF;
	padding: 5px;
	padding-left: 10px;
	padding-top: 10px;
	padding-bottom: 10px;
	font-weight: bold;
	font-size: 18px;
	border-top-left-radius: 6px;
	border-top-right-radius: 6px;
	background-image: url(/Content/images/title-design.png);
	background-repeat: no-repeat;
	background-position: right;
}


/*---------------------------- Front Page ----------------------------------*/

.frontpg-body {
	width: 100%;
}
#mainCarousel {
	height: auto;
	width: 100%;
}
.carousel-indicators {
	top: 14vw;
	height: 2rem;
	text-shadow: 10px 10px 50px grey;
}
.carousel-indicators li {
	background-color: #3b3b3b;
	border-color: #3b3b3b;
}
.carousel-control .glyphicon {
	top: 8vw;
	text-shadow: 20px;
	color: #ddd;
}
.carousel-control.left {
	width: 5vw;
	background-image: linear-gradient(to top left, rgba(0, 0, 0, 0.0001) 100%, rgba(0, 0, 0, 0.5) 0);
}
.carousel-control.right {
	width: 5vw;
	background-image: linear-gradient(to top right, rgba(0, 0, 0, 0.0001) 100%, rgba(0, 0, 0, 0.5) 0);
}
#bannerImg {
	position: relative;
	/*
	height: 100%;
	width: auto;
	*/
	object-fit: contain;
	height: 100%;
	width: 100%;
	/*background: linear-gradient(bottom, rgba(255, 255, 255, 0) 0, #fff 100%);*/
}


/************************** Module Section *****************************/

.moduleSection {
	margin: -20vw 3vw 10vw 3vw;
}

@media (max-width: 767.98px) {
	.moduleSection {
		margin: -18vw 3vw 10vw 3vw;
	}
}


	/* Modules */
	.moduleRow {
		margin: 0;
		height: 30rem;
		justify-content: center;
	}

	@media (min-width: 1500px) {
		.moduleRow {
			height: 38rem;
		}
	}

	/* Fixed Area */
	.fixedCol {
		margin: 1% 0% 1% 0%;
		padding: 1%;
		float: right;
		display: flex;
		flex-wrap: nowrap;
	}

	.fixedRow {
		height: 100%;
	}

		.fixedRow .col {
			padding: 0;
			height: 100%;
		}

	@media (min-width: 1200px) {
		.fixedCol {
			height: inherit;
		}

		.fixedRow .col {
			height: 50%;
		}
	}

	#shipping, #sns {
		background-image: linear-gradient(to top left, #e1e6ea, white);
		/*box-shadow: 5px 0px 30px grey;*/
		margin: 0 auto;
		padding: 0;
		text-align: center;
		height: 100%;
		font-size: 50%;
	}

	#shipping img {
		width: 100%;
		height: inherit;
	}

	#sns .snsLinks {
		padding: 2% 2% 0% 2%;
		height: 65%;
	}

	#sns .snsImages {
		/*background-image: linear-gradient(#e1e1e1, #e4e4e4, #e1e1e1);*/
		border: 2px solid #7ed4e4;
		border-radius: 2px;
		padding: 1%;
		height: 100%;
	}


	.snsLinks .col {
		padding: 0;
		width: auto;
		height: 100%;
	}

	.snsImages img {
		width: 48%;
		height: 33%;
	}

	#sns .snsText {
		width: auto;
		height: 35%;
	}

		#sns .snsText img {
			width: 100%;
			height: 100%;
			margin: 0;
		}


	#snsModule .thumbnail {
		display: flex;
		flex-flow: column;
		align-items: center;
	}

	@media (max-width: 767.98px) {
		#snsModule {
			height: 70%;
		}
	}

	.moduleCol {
		margin: 0;
		padding: 0.6%;
		display: flex;
		flex-wrap: wrap;
		height: inherit;
	}


	.title {
		font-weight: bold;
		font-size: 120%;
		line-height: 1.5vw;
	}

	.text {
		font-size: 75%;
		line-height: 1;
		color: black;
		font-stretch: extra-condensed;
	}


	/* -------- Modele1 ------- */
	#module1 {
		/*background-color: white;*/
		border: none;
		border-radius: 3px;
		/*box-shadow: 10px 10px 30px grey;*/
		margin: 0 auto;
		padding: 2%;
		text-align: center;
		overflow: hidden;
		width: 100%;
		height: 100%;

		background-position: top;
		background-size: cover;
		background-repeat: no-repeat;
		background-color: transparent;
		box-shadow: none;
	}



#module1 .link {
	color: darkred;
	font-weight: bold;
	font-stretch: extra-condensed;
	position: relative;
}

	.moduleImages {
		height: 85%;
		width: 100%;
	}

	.moduleImages {
		object-fit: fill;
		position: relative;
		top: 17%;
	}
	@media (min-width: 768px) and (max-width: 1199.98px) {
		#module1 .col {
			height: 100% !important;
		}
	}
	/*
#module1 .col {
	margin: 0;
	padding: 0;
	text-align: center;
	height: 48%;
}
*/
	#module1 .col {
		padding: 0;
		height: 48%;
	}

	#module1 a {
		height: 100%;
	}

	#module1 img {
		margin: 0 auto;
		object-fit: contain;
		height: 100%;
		width: auto;
	}

	#module1 .link {
		position: relative
	}

	/* -------- Modele2 ------- */
	#module2 {
		text-align: center;
		background-color: white;
		border: none;
		border-radius: 3px;
		box-shadow: 10px 10px 50px grey;
		width: 100%;
		height: 100%;
		margin: 0 auto;
		padding: 2%;
		overflow: hidden;
	}
	/*
		#module2 .col {
			padding: 0;
			margin: 0 auto;
			height: 50%;
			text-align: center;
		}
		*/
	#module2 a {
		height: 100%;
	}
		#module2 .link {
			color: darkred;
			line-height: 1vh;
			font-weight: bold;
			font-stretch: extra-condensed;
			position: relative;
		}

	/* -------- Modele3 ------- */
	#module3 {		
		text-align: center;
		background-color: white;
		border: none;
		border-radius: 3px;
		box-shadow: 10px 10px 50px grey;
		width: 100vw;
		height: 100%;
		margin: 0 auto;
		padding: 2%;
		overflow: hidden;
	}
	#module3 .text {
		color: black;
		line-height: 1.3;
		font-size: 60%;
	}

	#module3 .col {
		height: 100%;
		display: flex;
		align-items: center;
	}



	/********************************************    Pokemon module    ********************************************************/
	#pkmnModule > .thumbnail {
		background-image: url('images/FrontPage/_Holiday/ModuleBackground/Pokemon_bg.png');
	}
	@media (min-width: 600px) and (max-width: 1182px) {
		#pkmnModule > .thumbnail {
			background-image: url('images/FrontPage/_Holiday/ModuleBackground/Pokemon_bg_Long.png');
		}
	}
	#mtgModule > .thumbnail {
		background-image: url('images/FrontPage/_Holiday/ModuleBackground/Magic_bg.png');
	}
	@media (min-width: 600px) and (max-width: 1182px) {
		#mtgModule > .thumbnail {
			background-image: url('images/FrontPage/_Holiday/ModuleBackground/Magic_bg_Long.png');
		}
	}
	#ygoModule > .thumbnail {
		background-image: url('images/FrontPage/_Holiday/ModuleBackground/Yugioh_bg.png');
	}
	@media (min-width: 600px) and (max-width: 1182px) {
		#ygoModule > .thumbnail {
			background-image: url('images/FrontPage/_Holiday/ModuleBackground/Yugioh_bg_Long.png');
		}
	}
	#vgModule > .thumbnail {
		background-image: url('images/FrontPage/_Holiday/ModuleBackground/Vanguard_bg.png');
	}
	@media (min-width: 600px) and (max-width: 1182px) {
		#vgModule > .thumbnail {
			background-image: url('images/FrontPage/_Holiday/ModuleBackground/Vanguard_bg_Long.png');
		}
	}
	#dgmnModule > .thumbnail {
		background-image: url('images/FrontPage/_Holiday/ModuleBackground/Digimon_bg.png');
	}
	@media (min-width: 600px) and (max-width: 1182px) {
		#dgmnModule > .thumbnail {
			background-image: url('images/FrontPage/_Holiday/ModuleBackground/Digimon_bg_Long.png');
		}
	}
	#weissModule > .thumbnail {
		background-image: url('images/FrontPage/_Holiday/ModuleBackground/Weiss_bg.png');
	}
	@media (min-width: 600px) and (max-width: 1182px) {
		#weissModule > .thumbnail {
			background-image: url('images/FrontPage/_Holiday/ModuleBackground/Weiss_bg_Long.png');
		}
	}




#preorderCarousel,
#preorderCarousel .carousel-inner,
#bundleCarousel,
#bundleCarousel .carousel-inner
{
	height: 100%;
}
#preorderCarousel .item,
#bundleCarousel .item
{
	height: 100%;
	padding: 1%;
}
#preorderCarousel .col {
	height: 90%;
	display: flex;
	align-items: center;
}
#preorderCarousel .item a,
#bundleCarousel .item a {
	width: 100%;
	height: 100%;
}
#preorderCarousel img,
#bundleCarousel img {
	object-fit: contain;
	object-position: 50% 50%;
	width: 100%;
	height: 100%;
}
#preorderCarousel .carousel-inner .item.left.active,
#bundleCarousel .carousel-inner .item.left.active {
	transform: translateX(-33%);
}

#preorderCarousel .carousel-inner .item.right.active,
#bundleCarousel .carousel-inner .item.right.active {
	transform: translateX(33%);
}

#preorderCarousel .carousel-inner .item.next,
#bundleCarousel .carousel-inner .item.next {
	transform: translateX(33%)
}

#preorderCarousel .carousel-inner .item.prev,
#bundleCarousel .carousel-inner .item.prev {
	transform: translateX(-33%)
}

#preorderCarousel .carousel-inner .item.right,
#preorderCarousel .carousel-inner .item.left,
#bundleCarousel .carousel-inner .item.right,
#bundleCarousel .carousel-inner .item.left {
	transform: translateX(0);
}

#preorderCarousel .carousel-control .glyphicon,
#bundleCarousel .carousel-control .glyphicon{
	top: 50%;
}
