.container-body {
	max-width: 100%;
}

.carousel-item {
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	cursor: pointer;
}

	.carousel-item .note {
		position: absolute;
		margin-bottom: 0;
		bottom: 0;
		/*background-color: rgba(44,44,44,0.5);*/
		height: 150px;
		width: 100%;
		text-align: center;
	}
		.carousel-item .note .note-text {
			display: table;
			height: 150px;
			width: 80%;
			margin: auto;
		}

		.carousel-item .note p {
			display: table-cell;
			vertical-align: middle;
			color: white;
			font-size: 18px;
			padding-right: 0;
		}

.carousel-control-next-icon, .carousel-control-prev-icon {
	width: 30px;
	height: 30px;
}


.carousel.slide {
	height: calc(100vh - 130px);
}

.carousel-inner, .carousel-item, .carousel-inner img {
	width: 100%;
	height: 100%;
}

.change-mode {
	position: absolute;
	z-index: 1;
	right: 6%;
    top: 25px;
	cursor: pointer;
	opacity: 0.5;
	padding: 10px;
}

	.change-mode:hover {
		opacity: 1;
	}


.mode-list {
	padding-bottom: 20px;
}

.mode-list-header {
	overflow: auto;
    margin-top: 20px;
	margin-right: 0;
	margin-left: 0;
	border-bottom: solid 1px #337ab7;
	padding-bottom: 20px;
}

	.mode-list-header div{
		padding-left: 0;
		padding-right: 0;
	}

.mode-list-header img {
	float: right;
	cursor: pointer;
	margin-top: 5px;
}

.mode-list .item {
	margin-top: 20px;
	cursor: pointer;
}

.mode-list .item-image {
	text-align: center;
}

.mode-list .image {
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
	width: 100%;
	height: 152px;
}

.mode-list .item-info :hover {	
	color: #334D80;
}

.list-mode-icon {
	width: 35px;
}

/* LOADING */
.container-loading {
	margin: 20px auto 0 auto;
}

.container-loading span {
	padding-left: 30px;
	color: #849DBD;
}

.container-endResults{
	margin: 20px auto 0 auto;
	padding-left: 30px;
}

.loader-custom {
    border: 3px solid #849DBD;
    border-top: 3px solid #334D80;
    border-radius: 50%;
    width: 25px;
    height: 25px;
    animation: spin 2s linear infinite;
	position: absolute
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

@media (max-width: 699px)
{
	.carousel.slide {
		margin-left: -15px !important;
		margin-right: -15px !important;
	}
	
	.mode-list .image1 {
		min-height: 300px;
	}
}

@media (min-width: 700px)
{
	.carousel.slide {
		margin-left: -15px !important;
		margin-right: -15px !important;
	}
	
	.container-body {
		padding-bottom: 0;
	}
	
	.carousel-item .note p {
		font-size: 24px;
	}
}

@media (min-width: 768px)
{
	.carousel.slide {
		margin-left: -15px !important;
		margin-right: -15px !important;
	}
		
	.mode-list .image {
		background-repeat: no-repeat;
		background-size: cover;
		width: 100%;
		height: 152px;
		max-width: 250px;
		float: right;
	}
}

@media (min-width: 992px)
{
	.carousel.slide {
		margin-left: -15px !important;
		margin-right: -15px !important;
	}
}

@media (min-width: 1200px)
{
	.carousel.slide {
		margin-left: -15px !important;
		margin-right: -15px !important;
	}
}