/* .page-moblify *******************************/

.page-moblify {
	height: 100%;
	position: relative;

  section {

	  .position {

	    .wrapper {
     		padding: 40px 20px;
				width: 100%;
			}
		}
	}
}

@media (min-width: 576px) {

  .page-moblify {

	  section {

		  .position {
				align-items: center;
				display: flex;
				justify-content: center;

	    	.wrapper {
					max-width: 1600px;
      		padding: 80px 40px;
				}
			}
		}
  }
}

@media (min-width: 1600px) {

  .page-moblify {

	  section {

		  .position {

	    	.wrapper {
					max-width: 1600px;
        }
      }
    }
  }
}

@media (min-width: 3000px) {

  .page-moblify {

	  section {

		  .position {

	    	.wrapper {
					max-width: 3000px;
        }
      }
    }
  }
}

/* .page-moblify section.carousel *******************************/

.page-moblify section.carousel {
	height: 100%;

	.carousel {
		height: 100%;
		touch-action: pan-y pinch-zoom;

		.carousel-indicators {
			gap: 20px
		}

		.carousel-inner {
			height: 100%;
			touch-action: pan-y pinch-zoom;

			.carousel-item {
				background-position: center;
				background-size: cover;
				height: 100%;
				padding-top: 140px;
				transition: transform 0.3s ease-in-out;

				.item-wrapper {
					align-items: center;
					display: flex;
					flex-direction: column;
					height: calc(100% - 85px);
					justify-content: center;
					padding: 40px 20px;
					text-align: center;

					h1, h2 {
						margin-bottom: 20px;
					}

					.logos {
						align-items: center;
						display: flex;
						justify-content: center;
						gap: 30px;
						margin-bottom: 10px;

						a {
							align-items: center;
							color: #fff;
							display: flex;
							flex-direction: column;
							font-family: var(--font-default);
							font-size: 1rem;
							gap: 5px;
							justify-content: center;
							text-decoration: underline;

							&:hover {
								text-decoration: none;
							}

							img {
								height: auto;
								width: 100px;
							}
						}
					}
				}
			}
		}
	}
}

#slide-1 {
	background-image: url('../../images/moblify/bgs/slides/default.webp');
	background-position: top center;
}

#slide-2 {
	background-image: url('../../images/moblify/bgs/slides/ski.webp');
	background-position: top center;
}

#slide-3 {
	background-image: url('../../images/moblify/bgs/slides/flashover-istockphoto-lawrey-1024x1024.webp');
	background-position: center;
}

#slide-4 {
	background-image: url('../../images/moblify/bgs/slides/saloon.webp');
}

#slide-5 {
	background-image: url('../../images/moblify/bgs/slides/taphophobia.webp');
	background-position: center right;
}

#slide-6 {
	background-image: url('../../images/moblify/bgs/slides/about.webp');
	background-position: top center;

	h2 {
		font-size: 1.5rem;
	}

	.panel {
		margin-bottom: 15px;
	}
}


/* iPhone 14 plus 428px by 926px */
@media (min-width: 430px) {

	.canvas-moblify > header {

		.logo {
			img {
				height: 120px;
			}
		}
	}

	.page-home section.carousel {
		
		.carousel {
			
			.carousel-inner {
			
				.carousel-item {

					.item-wrapper {

						height: calc(100% - 40px);

						.logos {
							margin-bottom: 20px;
							padding: 20px 0;
						}
					}
				}
			}
		}
	}
	#slide-6 {
		h2 {
			font-size: 2.2rem;
		}

		.panel {
			margin-bottom: 20px;
		}
	}
}