/*------- BRANDS PAGE/WHO WE ARE ------*/
.brand-heading {
	margin-top: 2em;
}
.brand-heading:before {
	color: var(--black);
}
.brand-heading:after {
	color: var(--white);
}
.brand-carousel .carousel-item{
	margin-top: 2em;
	margin-bottom: 2em;
}
.brand-carousel .carousel-item-next, 
.brand-carousel .carousel-item-prev, 
.brand-carousel .carousel-item.active {
	height: 70vh;
}
.intro-row {
	margin-top: 2em;
}
.brand-intro-card {
	font-size: 1.1875em;
	border: none;
    border-radius: 0;
}
.brand-carousel .col-3 {
	margin: 1em;
}
.card-container {
	width: 400px;
    height: 566px;
    margin: 2em auto;
}
.card-container:hover > .brand-card {
	cursor: pointer;
	transform: rotatey(180deg);
}
.brand-card {
	width: 100%;
	height: 100%;
	position: relative;
	transition: transform 1500ms;
	transform-style: preserve-3d;
}
.front,
.back {
	height: 100%;
	width: 100%;
	position: absolute;
	backface-visibility: hidden;
}
.back {
	background-color: var(--white);
	transform: rotatey(180deg);
	display: flex;
	flex-direction: column;
	justify-content: space-evenly;
	align-items: center;
}
.back img {
	width: 50%;
}
.back p {
	margin: 1rem;
	font-size: 0.9em;
}
.desktop-brands {
	display: block;
}
.tablet-brands {
	display: none;
}
.mobile-brands {
	display: none;
}
.eu {
	background-color: #8596b0;
}
.emea {
	background-color: #1f325e;
}
.af {
	background-color: #187a34;
}
.apac {
	background-color: #3b6189;
}
.na {
	background-color: #b31c2b;
}
.latam {
	background-color: #7a2879;
}
.global {
	background-color: var(--black);
}
.global,
.eu,
.emea,
.af,
.apac,
.na,
.latam {
	color: var(--white)!important;
	padding: 5px;
}
.regions p {
	text-align: center;
    margin: 0.5rem;
}
.cxo-logo {
	width: 40%!important;
}
.itc {
	height: 566px;
}
@media (max-width: 1700px) {
	.card-container {
		width: 400px;
    	height: 566px;
	}
}
.about-btn {
	display: flex;
	justify-content: center;
	align-items: center;
}
.about-btn button {
	display: flex;
	justify-content: center;
	align-items: center;
}
.about-btn a {
	text-decoration: none;
}
i.fa-light.fa-chevrons-right {
	padding-left: 5px;
	transition: padding-left .5s;
}
.btn:hover i.fa-light.fa-chevrons-right {
	padding-left: 10px;
}
.btn-outline-primary {
    --bs-btn-color: var(--black);
    --bs-btn-border-color: var(--black);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--black);
    --bs-btn-hover-border-color: var(--black);
    --bs-btn-focus-shadow-rgb: 13,110,253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--black);
    --bs-btn-active-border-color: var(--black);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: var(--black);
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: var(--black);
    --bs-gradient: none;
	--bs-btn-border-radius: 0;
}
.btn {
	transition: all .5s!important;
}
i.fa-light.fa-file-pdf {
	padding-left: 10px;
}
.btn-outline-primary:hover i.fa-solid.fa-circle-chevron-right,
.btn-outline-primary:hover i.fa-light.fa-file-pdf {
	color: var(--white);
}
/*------- END OF BRANDS PAGE/WHO WE ARE ------*/
/*----SCREEN WIDTH 1200 to 1536px----*/
@media only screen 
	and (min-width: 1201px)
	and (max-width: 1536px) {
		/*----Brand Page----*/
		div.desktop-brands div.row div.col-md-4 {
			width: 50%;
		}
}
/*----SCREEN WIDTH 1200 to 1536px and SMALL VH----*/
@media only screen 
	and (min-width: 1201px)
	and (max-width: 1536px)
	and (min-height: 0px)
	and (max-height: 820px) {

}
/*----SCREEN WIDTH 0 to 991px----*/
@media only screen 
	and (min-width: 0px)
	and (max-width: 991px) {

}
/*----SCREEN WIDTH 900 to 1200px----*/
@media only screen 
	and (min-width: 901px)
	and (max-width: 1200px) {
		/*----Brand Page----*/
		div.desktop-brands div.row div.col-md-4 {
			width: 100%;
		}
}
/*----SCREEN WIDTH 900 to 1200px Landscape----*/
@media only screen and (orientation : landscape)
	and (min-width: 901px)
	and (max-width: 1200px) {

}
/*----SCREEN WIDTH 600 to 900px----*/
@media only screen 
	and (min-width: 601px)
	and (max-width: 900px) {
		/*----Brand Page----*/
		div.desktop-brands div.row div.col-md-4 {
			width: 100%;
		}
}
/*----SCREEN WIDTH 600 to 900px Landscape----*/
@media only screen and (orientation : landscape)
	and (min-width: 601px)
	and (max-width: 900px) {

}
/*----SCREEN WIDTH 0 to 600px----*/
@media only screen 
	and (min-width: 0px)
	and (max-width: 600px) {
		/*---Brands---*/
		.card-container {
			width: 270px;
			height: 382px;
		}
		.itc {
			height: 382px;
		}
		.about-btn button {
			font-size: 1em;
		}
		.regions {
			display: none;
		}
		img.ciso {
			width: 30%;
		}
}