html,body{
	width: 100%;
	height: 100%;
	overflow-x: hidden;
	background-color: #fefaf4;
	font-size: 16px;
}
.modal-content{
	background-color: #fefaf4;
}
.center-vertical {
	display: flex;
    align-content: center;
    align-items: center;
    justify-content: center;
}


#home{
	padding-top: 60px;
	padding-bottom: 60px;
}
.homeImg{
	width: 65%;
	z-index: 1;
	margin-top: 12vh;
}

.myContainer{
	width: 90vw;
	margin-left: 5vw;	
}

.myContainerCourage{
	width: 76vw;
	margin-left: 12vw;	
}

.size1{
	font-size: calc(60vw * 0.32 ) !important;
	height: calc(60vw * 0.32 ) !important;
}
.size2{
	font-size: calc(60vw * 0.27 ) !important;
	height: calc(60vw * 0.27 ) !important;
	margin-top: -3.6vw;
}
.size3{
	font-size: calc(60vw * 0.33 ) !important;
	height: calc(60vw * 0.33 ) !important;
	margin-top: -3.3vw;
}
.full-width.bg{
	position: relative;
	z-index: 0;
	color: #f9e5cd;
	text-align: justify;
	text-justify: inter-character;
	font-size: 26.99vw;
	height: 27vw;
	line-height: 27vw;
	display: flex;
    align-content: center;
    align-items: center;
    justify-content: center;
  	font-family: 'Champion-HTF-Flyweight';
}

.bgImg{
	width: 95%;
	margin-left: 2.5%;
	z-index: 0;
}

.textSubTitle{
	text-align: justify;
	width: 100%;
	font-size: 111px;
	line-height: 111px;
	margin-top: 27px;
}

.CourageImg{
	z-index: 1;
	position: relative;
	/*margin-bottom: 27px;*/
	margin-bottom: 51px;
}
.bgImgCourage{
	height: 93vh;
	width: auto;
	max-width: 100%;
}
.row{
	margin: 0;
}
.col-12{
	padding: 0;
}

.bg-black{
	background-color: black;
} 
.text-white{
	color: white;
}

.courageTextBlack{
	padding-left: 15px;
	padding-right: 5px;
	padding-top: 3px;
	padding-bottom: 3px;
	font-size: 30px;
	margin-top: 15px;
}

.courageTextBlack.itaBigger{
	font-size: 47px;
	text-align: center;
}

.courageTextBlack.tiktok,h4.courageTextBlack.demoContainer{
	font-size: 30px;
	padding-top: 0px;
	padding-bottom: 0px;
}

#footerK2{
	display: block!important;
}
#footerInfinityLogo{
	visibility: hidden;
}
section.footer_bg .border-top{
	/*border-bottom: 2px solid #979696 !important;*/
}

section.footer_bg .row{
	/*margin-bottom:  3rem !important;*/
}

.videoContainer{
	width:78%;
}
.spacek2{
	height: 45px;
	width: 100%;
}
.flipCardContainer{
	width: auto;
	display: flex;
	justify-content: center;
	align-items: center;
	/*margin-bottom: 45px;*/
}

.flip-card {
  background-color: transparent;
  width: 390px;
  height: 390px;
  margin: 6px;
  perspective: 1000px; /* Remove this if you don't want the 3D effect */
}

/* This container is needed to position the front and back side */
.flip-card-inner {
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
  transition: transform 0.8s;
  transform-style: preserve-3d;
}

/* Do an horizontal flip when you move the mouse over the flip box container */
.flip-card:hover .flip-card-inner , .flip-card.cliccked .flip-card-inner {
  transform: rotateY(180deg);
}

/* Position the front and back side */
.flip-card-front, .flip-card-back {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden; /* Safari */
  backface-visibility: hidden;
}

/* Style the back side */
.flip-card-back {
  transform: rotateY(180deg);
}


.videoText{
	width: 90%;
	margin: auto;
	max-width: 900px;
}

.video{
	/*margin-bottom: 45px;*/
}

.borderDemo{
	padding: 6px;
}

.mtop{
	margin-top: 15px;
}

.mtopBig{
	margin-top: 45px;	
}

.btn-action{
	background-color: #c55428;
	color: white!important;
	font-size: 30px;
	padding: 6px 30px;
}

	.letterSpacing{
		letter-spacing: 0.029vw;
	}

	.imgBackVideo{
		bottom:90%;
		left:0;
		z-index:0;
	}
	.imgtopSx{
		top:-7vh;
		left:0;
		z-index:0;
		width:66%;
	}
	.imgBackOcchi{
		bottom:0%;
		left:0;
		z-index:0;
		width: 100%;
	}
	.demoContainer{
		width: 70%;
	}
	.demoPaddingRight{
		padding-right: 20%;
	}
	.occhioTop{
		max-width:70%
	}
	.modal-body.video{
		height: 90vh;
	}
	.modal-body.video video{
		max-height: 100%;
	}
	.modal-content.video{
		width: auto!important;
		background-color: transparent;
		border: none;
		margin: auto;
	}
	.modal-dialog.video{
		max-width: unset!important;
		text-align: center;
		margin: auto;
		background-color: #000000FA;
		transition: none!important;
	}
	.svgClose{
		position: absolute;
		top: 1vh;
		right: 3vh;
	}
	.arrow{
		position: absolute;
		bottom: 60%;
		left: 0;
		width: 100%;
		text-align: center;
		margin: auto;
		display: flex;
		align-items: center;
		align-content: center;
	}
	.arrow img{
		height: 50vh;
	}
	.titleModal{
		font-size: 48px!important;
		line-height: 48px;
	}
	button.titleModal{
		background-color: black!important;
		color: white!important;
		font-size: 30px!important;
		/*line-height: 30px;*/
		line-height: normal;
		padding-top: 0.7rem !important;
	}
	.text-black{
		color: black!important;
	}
@media screen and (orientation:  portrait) and (max-width:  600px){
	button.titleModal{
		padding-top: 10px !important;
	}
	.homeImg{
		margin-top: 3vh;
		width: 66%;
	}
	.bgImg{
		width: 92%;
		margin-left: 4%;
	}
	.bgImgCourage{
		width: 110%;
		height: auto;
		max-width: unset;
		margin-left: -5%
	}
	.courageTextBlack{
		padding-left: 5px;
		padding-right: 5px;
		padding-top: 3px;
		padding-bottom: 3px;
		font-size: 18px;
		margin-top: 6px;
		text-align: justify;
	}
	.courageTextBlack.itaBigger{
		font-size: 15px;
	}
	.courageTextBlack.tiktok{
		font-size: 15px;
		text-align: left;		
	}
	h4.courageTextBlack.demoContainer{
			font-size: 15px;
			text-align: center;		
	}
	.courageTextBlack.demoContainer{
		text-align: center;	
	}
	.videoText{
		width: 75%;
		margin: auto;
		max-width: 900px;
		margin-top: -21px;
	}
	.textSubTitle{
		text-align: left;
		width: 100%;
		font-size: 52px;
		line-height: 45px;
		margin-top: 21px;
	}
	.titleModal{
		font-size: 52px!important;
		line-height: 52px;
	}
	.CourageImg{
		z-index: 1;
		position: relative;
		margin-bottom: 21px;
	}

	.videoContainer{
		width: 100%;
	}
	.flip-card {
  	width: 300px;
  	height: 300px;
  	margin: auto;
	}
	.col-md-auto{
		margin-top: 15px;
		margin-bottom: 15px;
	}
	.imgLogoAscent{
		height:50%;
	}
	.imgBackVideo{
		width: 100%;
		bottom:73%;
		left:0;
		z-index:0;
	}
	.imgtopSx{
		width:100%;
	}
	.imgtopSx{
		width:100%;
	}
	.mtopBig{
		margin-top: 15px;
	}
	.demoContainer{
		width: 95%;
	}
	.btn-action{
		background-color: #c55428;
		color: white;
		font-size: 15px;
		padding: 3px 15px;
		z-index: 4;
		position: relative;
		margin-bottom: 0px;
	}
	.w-100-mobile{
		width: 75% !important;
	}
	.demoPaddingRight{
		padding-right: 0%;
	}
	.demoPaddingTop{
		margin-top: 70%;
	}
	.occhioTop{
		max-width:100%;
		margin-left: 40% !important;
		margin-top: 30px !important;
	}
	html{
    font-size: 9px;
  }
	#home{
		padding-top: 15px;
		padding-bottom: 15px;
	}
	.modal-body.video{
		height: 80vh;
	}
	.modal-body.video video{
		max-width: 100%;
	}
	.svgClose{
		position: absolute;
		top: 1vh;
		right: 1vh;
	}
	.mTopDemo{
		margin-top: 30px;
	}
	.nomtopmobile{
		margin-top: 0!important;
	}
	.imgBackOcchi{
		z-index: 2;
	}
	.arrow img{
		height: 10vh;
	}
}



@media screen and (orientation:  landscape) and (min-width: 2000px){
	.videoText{
		max-width: 60vw;
	}
	.textSubTitle{
		font-size: 201px;
		line-height: 201px;
	}
	.courageTextBlack{
		font-size: 45px;
	}
	.courageTextBlack.tiktok,h4.courageTextBlack.demoContainer{
		font-size: 45px;
	}

	.courageTextBlack.itaBigger{
		font-size: 66px;
	}
	.flip-card{
		width: 481px;
		height: 481px;
		margin: 12px;
	}
	.courageTextBlack{
		padding-left: 18px;
	}
	.letterSpacing{
		letter-spacing: 6.9px;
	}
	.img.demoContainer{
		max-width: 840px;
	}
}


@media screen and (orientation:  landscape) and (max-width: 1280px) and (min-width: 1280px){
	.videoText{
		max-width: 60vw;
	}
	.textSubTitle{
		font-size: 58.4px;
		line-height: 59px;
	}
	.courageTextBlack{
		font-size: 29px;
	}
	.courageTextBlack.tiktok,h4.courageTextBlack.demoContainer{
		font-size: 27px;
	}
	.flip-card{
		width: 230px;
		height: 230px;
		margin: 6px;
	}
	.courageTextBlack{
		padding-left: 18px;
	}
	/*.letterSpacing{
		letter-spacing: 6.9px;
	}*/
	.img.demoContainer{
		max-width: 60vw;
	}
}