:root{
	--text-color: #444;
	--second-color: #888888;
	--white-color: #fff;
	--light-green: #5cd994;
	--green: #6bf5a9;
	--font-family:'Source Sans Pro', sans-serif ;
}
html{
	overflow-x: hidden;
}
body {
	background-color: #F4F4F4;
	font-family: var(--font-family);
	font-size: 18px;
	line-height: 30px;
	color: #555555;
	font-weight: 300;
	overflow-x:hidden;
}
section {
	overflow: hidden;
	width: 100%;
}
section-team {
	overflow: scroll;
	width: 100%;
}
h1, h2, h3, a.back, .header {
	font-family: var(--font-family);;
}
h1 {
	font-weight: 300;
	font-size: 4em;
	color: var(--text-color);
	line-height: 1em;
	letter-spacing: 0px;
}
h2 {
	font-weight: 300;
	font-size: 36px;
	line-height: 42px;
	margin-bottom: 20px;
	margin-top: 30px !important;
	color: var(--text-color);
	text-transform:capitalize;
}
h3 {
	color: var(--text-color);
	font-weight: 500;
}
a:link, a:visited {
	text-decoration: underline;
	color: var(--text-color);
}
a.button:visited {
	color: var(--white-color);
}
a.button:active {
	background-color: var(--light-green);
}
::selection {
	background-color: #feffc3;
	color: var(--second-color);
}
.copy_wrap a {
	display:block;
	width:100%;
	font-size:15px;
	color:var(--white-color);
	text-decoration:none;
	cursor:pointer;
}
.copy_wrap {
    width:100%;
    background-color:#C4E288;
    padding: 25px 0px;
	text-align:center;
}
.copy_wrap a:hover {
	color: #749533;
	-webkit-transition: color 0.2s ease;
	-moz-transition: color 0.2s ease;
	-ms-transition: color 0.2s ease;
	-o-transition: color 0.2s ease;
	transition: color 0.2s ease;
}
.header {
	width: 88%;
	padding: 20px 6%;
	font-size: 11px;
	letter-spacing: 1.5px;
	text-align: center;
	background-color: var(--white-color);
	box-shadow: 0px 4px rgba(0, 0, 0, 0.1);
	z-index: 999;
	position: fixed;
	top: 0;
}
.header a:link, .header a:visited {
	color: var(--second-color) !important;
	text-decoration: none;
}
.header a:hover {
	color: #00341E !important;
	-webkit-transition: color 0.2s ease;
	-moz-transition: color 0.2s ease;
	-ms-transition: color 0.2s ease;
	-o-transition: color 0.2s ease;
	transition: color 0.2s ease;
}
.header:after {
	content: "";
	display: table;
	clear: both;
}
header.header #logo-type {
	font-size: 13px;
	letter-spacing: 2.5px;
	color: #555555;
	float: left;
	line-height: 30px;
}
header.header nav.nav {
	float: right;
	margin-right: 100px;
}
header.header nav.nav ul li {
	display: inline;
	margin: 0px 10px;
}
.social {
	position: fixed;
	right: -150px;
	float: right;
	top: 23px;
}
.container {
	max-width: 740px;
	width: 90%;
	padding: 0px 0%;
	margin: auto;
}
#animation {
	position: relative;
}
#animation h1, #intro h1 {
	width: 100%;
	text-align: center;
	position: absolute;
	top: 130px;
	z-index: 90;
}
.animation-container {
	padding: 140px 0px 40px 0px;
	overflow: hidden;
}
#object {
	display: block;
	height: 250px;
	width: 250px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 100px;
	background: url('../img/ross-v2.png') no-repeat center;
	background-size: contain;
	visibility: hidden;
}
#animation .cta-wrapper {
	width: 100%;
	position: absolute;
	bottom: 55px;
	text-align: center;
}
#animation .examples {
	font-family: var(--font-family);
	font-size: 16px;
	color: var(--text-color);
	padding: 10px 20px;
	border-radius: 5px;
	background-color: transparent;
	letter-spacing: 1px;
	text-decoration: none;
}
#animation a.examples:hover {
	background-color: #e8e8e8;
	-webkit-transition: background-color 0.4s ease;
	-moz-transition: background-color 0.4s ease;
	-ms-transition: background-color 0.4s ease;
	-o-transition: background-color 0.4s ease;
	transition: background-color 0.4s ease;
}
#actions {
	background-color: var(--white-color);
	padding: 20px 0px 50px 0px;
}
a.button {
	padding: 6px 16px;
	background-color: #61e69d;
	color: var(--white-color);
	text-decoration: none;
	border-bottom: 4px solid var(--light-green);
	margin: 0px 15px 15px 0px;
	display: inline-block;
	border-radius: 5px;
	font-size: 16px;
}
a.button:link, a.button:visited {
	color: var(--white-color);
}
a.button:hover {
	background-color: var(--green);
	-webkit-transition: background-color 0.2s ease;
	-moz-transition: background-color 0.2s ease;
	-ms-transition: background-color 0.2s ease;
	-o-transition: background-color 0.2s ease;
	transition: background-color 0.2s ease;
}
a.activeBtn {
	background-color: #DDDDDD;
	border-bottom: 4px solid #D0D0D0;
}
a.activeBtn:hover {
	background-color: #DDDDDD;
	border-bottom: 4px solid #D0D0D0;
}
#how {
	background-color: #F4F4F4;
	padding-bottom: 80px;
}
#how h2, #download h2 {
	margin: 60px 0px 30px 0px;
}
#how p {
	margin: 40px 0px;
}
#how p.emphasis {
	padding: 4%;
	border-radius: 8px;
	border: 2px solid #dddddd;
	font-style: italic;
	margin-bottom: 60px;
}
#how span.strikethrough {
	text-decoration: line-through;
	color: var(--second-color);
}
#how pre {
	padding: 0;
}
#how h4 {
	margin: 40px 0px 15px 0px;
	display: block;
	font-size: 19px;
	font-weight: 400;
	color: var(--text-color);
}
#how code {
	display: block;
	background-color: #E8E8E8;
	color: var(--second-color);
	border-radius: 8px;
	width: 96%;
	padding: 2%;
}
#how code.no-corners {
	border-bottom-left-radius: 0px;
	border-bottom-right-radius: 0px;
}
#how span {
	color: #00c670;
}
#how span.modify {
	color: #ed921c;
}
#how div.additional-info {
	background-color: var(--white-color);
	font-size: 16px;
	font-family: 'Source Sans Pro', sans-serif;
	color: var(--second-color);
	padding: 10px 20px;
	border-bottom-left-radius: 8px;
	border-bottom-right-radius: 8px;
	font-style: italic;
	box-shadow: 0px 3px rgba(0, 0, 0, 0.05);
}
#how div.additional-info p {
	margin: 5px 0px;
}
#download {
	background-color: var(--white-color);
	text-align: center;
	padding: 100px 0px 80px 0px;
}
#download a.download {
	background-color: #61e69d;
	color: var(--white-color);
	font-size: 46px;
	padding: 25px 0px;
	border-bottom: 5px solid var(--light-green);
	margin-bottom: 20px;
	display: block;
	border-radius: 8px;
	text-decoration: none;
}
#download a.download:hover {
	background-color: var(--green);
	-webkit-transition: background-color 0.2s ease;
	-moz-transition: background-color 0.2s ease;
	-ms-transition: background-color 0.2s ease;
	-o-transition: background-color 0.2s ease;
	transition: background-color 0.2s ease;
}
/*
==============================================
FPF
==============================================
*/
#fpf {
	background-color: #f7f7f7;
	padding: 80px 0px;
	height: 350px;
	border-top: 2px solid rgba(0, 0, 0, 0.1);
	border-bottom: 2px solid rgba(0, 0, 0, 0.1);
}
#fpf .images {
    visibility: hidden;
    width: 30%;
    height: auto;
    float: right;
    margin-top: 50px;
    text-align: center;
}
#fpf .images img {
    width: auto;
    height: 140px;
}
#fpf .images > div {
    display: flex;
    align-items: center;
    justify-content: center;
}
#fpf .copy {
	width: 65%;
	float: left;
	/*text-transform:capitalize;*/  
}
#fpf div.container {
	max-width: 740px;
}
#fpf h2 {
	margin-bottom: 20px;
}
#fpf p {
	margin-bottom: 20px;
}
/*
==============================================
HISTORIA
==============================================
*/
#history {
	background-color: #f7f7f7;
	padding: 80px 0px;
	border-bottom: 2px solid rgba(0, 0, 0, 0.1);
}
#history .title {
	width: 100%;
	text-align: center;
}
#history .columnimage {
	width: 60%;
	float: left;
	margin-left: 2%;
	margin-top:3%;
}
.left-column img {
    max-width: 100%; /* Image will not exceed the width of the column */
    max-height: 400px; /* Restrict the maximum height */
    width: auto; /* Maintains aspect ratio */
    height: auto; /* Maintains aspect ratio */
}
#history .columntext {
	width: 40%;
	float: left;
	margin-left: 2%;
	margin-top:3%;
}
@media (max-width: 768px) {
    #history .columnimage {
			width: 100%;
			margin-left: 2%;
			margin-top:3%;
    }
		#history .columntext {
			width: 100%;
			margin-left: 2%;
			margin-top:3%;
		}
}
#history .column1 {
	width: 35%;
	float: left;
	margin-left: 2%;
	margin-top:3%;
}
#history .column2 {
	width: 35%;
	float: left;
	margin-left: 3%;
	margin-right: 2%;
	margin-top:3%;
}
#history .column3 {
	width: 35%;
	float: right;
	margin-top:3%;
}
#history div.container {
	max-width: 740px;
	display: flex;
}
#history  .column4 {
    margin-left: 2%;
}
#history  .column5, #history  .column6 ,#history .column3{
    margin-left: 3%;
}
#history h2 {
	margin-bottom: 20px;
}
#history p {
	margin-bottom: 20px;
}
/*
==============================================
TEAM
==============================================
*/
#team img {
	border-radius: 50%;
	width: 100px;
	height: 100px;
	background: rgb(255, 255, 255);
	box-shadow: 0px 2px 10px 1px rgba(0, 0, 0, 0.2);
	border: 3px solid green;
}
#team coach {
	visibility: hidden;
	width: 150px;
	height: auto;
	margin-top: 0px;
}
#team .column1 {
	width: 29.7%;
	float: left;
	padding: 1%;
	height: 145px;
	margin-bottom: 1%;
	text-align: center;
	border-top-left-radius: 1em;
	border-top-right-radius: 1em;
	border-bottom-left-radius: 1em;
	border-bottom-right-radius: 1em;
}
#team .column2 {
	width: 29.7%;
	float: left;
	padding: 1%;
	height: 145px;
	margin-bottom: 1%;
	margin-left: 1%;
	margin-right: 1%;
	text-align: center;
	border-top-left-radius: 1em;
	border-top-right-radius: 1em;
	border-bottom-left-radius: 1em;
	border-bottom-right-radius: 1em;
}
#team .column3 {
	width: 29.7%;
	padding: 1%;
	float: left;
	height: 145px;
	margin-bottom: 1%;
	text-align: center;
	border-top-left-radius: 1em;
	border-top-right-radius: 1em;
	border-bottom-left-radius: 1em;
	border-bottom-right-radius: 1em;
}
#team .column4 {
	width: 23%;
	padding: 1%;
	float: right;
	height: 145px;
	margin-bottom: 1%;
	text-align: center;
	border-top-left-radius: 1em;
	border-top-right-radius: 1em;
	border-bottom-left-radius: 1em;
	border-bottom-right-radius: 1em;
}
#team div.container {
	max-width: 740px;
}
#team h2 {
	margin-bottom: 40px;
}
#team p {
	margin-bottom: 20px;
}
/*
==============================================
VIDEO
==============================================
*/
#video, #eusebio, .main{
	display: none;
}
#video {
	background-color: #f7f7f7;
	background: url('../img/bg2.svg') no-repeat fixed;
	background-position: -5% 77%;
	padding: 80px 0px;
	height: 490px;
	border-top: 2px solid rgba(0, 0, 0, 0.1);
	border-bottom: 2px solid rgba(231, 231, 231, 1);
}
#video img {
	visibility: hidden;
	width: 40%;
	height: auto;
	float: left;
	margin-top: 0px;
	margin-left: -10%;
}
#video .copy {
	width: 60%;
	float: right;
}
#video div.container {
	max-width: 740px;
}
#video h2 {
	margin-bottom: 40px;
}
#video p {
	margin-bottom: 20px;
}
/*
==============================================
COACH
==============================================
*/
#mister {
	background-color: #f7f7f7;
	padding: 80px 0px;
	height: 395px;
	border-top: 2px solid rgba(0, 0, 0, 0.1);
	border-bottom: 2px solid rgba(0, 0, 0, 0.1);
}
#mister .copy {
	width: 59%;
	float: right;
}
#mister div.container {
	max-width: 740px;
}
#mister h2 {
	margin-bottom: 20px;
}
#mister p {
	margin-bottom: 20px;
}
/*
==============================================
PANTERA NEGRA
==============================================
*/
#eusebio {
    min-height: 530px;
    width: 100%;
    height: 800px;
    overflow: hidden;
    text-align: center;
    z-index: 1;
    background: url(../img/eusebio.jpg) 50% 0 no-repeat fixed;
    border-top: 2px solid rgba(0, 0, 0, 0.1);
    border-bottom: 2px solid rgba(0, 0, 0, 0.1);
    background-size: cover;
}
#eusebio img {
	visibility: hidden;
	width: 55%;
	height: auto;
	float: right;
	margin-top: 0px;
}
#eusebio .copy {
	width: 65%;
	float: right;
	text-align: left;
	margin-left: 5%;
}
#eusebio div.container {
	max-width: 740px;
	padding: 4%;
}
#eusebio h2 {
	margin-bottom: 20px;
	font-weight: 600;
}
#eusebio p {
	margin-bottom: 20px;
}
/*
==============================================
EXAMPLES CSS
==============================================
*/
.example-container {
    max-width: 800px;
    width: 100%;
    margin: 0 auto;
}
.bogota .example-container {
    width: 100%;
    text-align: center;
    position: relative;
    z-index: 2;
    background: #ffffff80 !important;
    padding: 40px;
    border-radius: 10px;
    border: 1px solid #dddddd87;
    margin-top: 80px;
}
#intro {
	height: 650px;
	width: 100%;
	position: relative;
}
#intro h1 span {
	font-size: 16px;
}
#intro .animation-container {
	padding: 240px 0px 40px 0px;
	overflow: hidden;
}
#intro-copy {
	width: 100%;
	position: absolute;
	bottom: 30px;
	text-align: center;
}
#intro-copy p {
	color: #CCCCCC;
}
#homepage {
    background-color: #ffffff;
    height: 550px;
    box-shadow: 0px 2px rgba(0, 0, 0, 0.1);
    background-image: url('../img/xis.png');
    background-repeat: no-repeat;
    background-position: 50% 94%;
    background-size: contain;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}
#homepage:before {
    position: absolute;
    background: #f4f4f4f0;
    content: '';
    width: 100%;
    height: 100%;
}
.bogota .copy p {
    margin-bottom: 0px !important;
}
.bogota {
    width: 100%;
}
#bogota .copy {
	width: 55%;
	float: right;
}
#homepage p {
	margin-bottom: 20px;
}
/*
==============================================
example-6
==============================================
*/
/*#example-6 {
	text-align: center;
	height: 785px;
}
#example-6 .device-diagram {
	font-family: var(--font-family);
	font-size: 200px;
	color: #61e69d;
	margin: 6%;
}*/
#example-6 .device-arrow {
	width: 30%;
	margin-bottom: 50px;
	visibility: hidden;
}
#example-6 h3 {
	margin-top: 30px;
}
/*
==============================================
OVERWRITE ANIMATIONS
==============================================
*/
.example-container {
	background-color: transparent !important;
}
.bounce, .pulse, .floatingt {
	visibility: visible !important;
}
/*
==============================================
for slider
==============================================
*/
/*
.full-width {
	overflow: hidden;
	position: relative;
}
.full-width, .full-width .slide img {
	width: 100%;
}
.full-width:hover {
	background: transparent;
}
.full-width .inner {
	height: 800px !important;
	overflow-y: hidden;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=00)";
	filter: alpha(opacity=00);
	-moz-opacity: 0;
	opacity: 0;
	-webkit-transition: margin 500ms linear;
	-moz-transition: margin 500ms linear;
	-ms-transition: margin 500ms linear;
	-o-transition: margin 500ms linear;
	transition: margin 500ms linear;
}
.full-width .slide {
	float: left;
	overflow-x: hidden;
	position: relative;
}
.full-width .slide img {
	height: auto;
	min-width: 100%;
	max-width: none;
}
.full-width .slide div {
	color: var(--white-color);
	position: absolute;
	padding: 0 5%;
	left: 0;
	width: 90%;
	text-align: right;
	font-size: 32px;
}
.full-width .slide div p {
	float: right;
	text-align: left;
	padding: 10px;
	margin: 0;
	background: rgba(0, 0, 0, 0.8);
}
.full-width .controls a {
	position: absolute;
	top: 50%;
	margin-top: -46px;
	display: block;
	text-decoration: none;
	color: var(--white-color);
	padding: 0 10px 2px 7px;
	display: none;
}
.full-width .controls a.left {
	left: 0px;
}

.full-width .controls a.right {
	right: 0px;
}
.full-width .slide-nav {
	font-size: 30px;
	margin: 0px auto;
	line-height: 50px;
	font-family: 'Helvetica', Arial, sans-serif;
	position: relative;
	z-index: 1;
	top: -55px;
}
.full-width .slide-nav span {
	cursor: pointer;
	color: #ccc;
	opacity: 0.4;
}
.full-width .slide-nav span.current {
	color: #ccc;
	opacity: 0.8;
}
/*

.full-width {
    overflow: hidden;
    position: relative;
}

.full-width, .full-width .slide img {
    width: 100%;
}

.full-width:hover {
    background: transparent;
}

.full-width .inner {
    height: auto;
    overflow: hidden;
    display: flex;
    transition: margin 500ms linear;
}

.full-width .slide {
    flex: 1;
    overflow: hidden;
    position: relative;
}

.full-width .slide img {
    width: 100%;
    height: 100%;
    object-fit: contain; /* Ensures the image is resized while keeping its aspect ratio */
}

.full-width .slide div {
    color: var(--white-color);
    position: absolute;
    padding: 0 5%;
    left: 0;
    width: 90%;
    text-align: right;
    font-size: 32px;
}

.full-width .slide div p {
    float: right;
    text-align: left;
    padding: 10px;
    margin: 0;
    background: rgba(0, 0, 0, 0.8);
}

.full-width .controls a {
    position: absolute;
    top: 50%;
    margin-top: -46px;
    display: block;
    text-decoration: none;
    color: var(--white-color);
    padding: 0 10px 2px 7px;
    display: none;
}

.full-width .controls a.left {
    left: 0px;
}

.full-width .controls a.right {
    right: 0px;
}

.full-width .slide-nav {
    font-size: 30px;
    margin: 0px auto;
    line-height: 50px;
    font-family: 'Helvetica', Arial, sans-serif;
    position: relative;
    z-index: 1;
    top: -55px;
}

.full-width .slide-nav span {
    cursor: pointer;
    color: #ccc;
    opacity: 0.4;
}

.full-width .slide-nav span.current {
    color: #ccc;
    opacity: 1;
}

/* Ensure the section resizes correctly */
#example-6 {
    text-align: center;
    height: auto;
    overflow: hidden;
}

#example-6 .device-diagram {
    font-family: var(--font-family);
    font-size: 200px;
    color: #61e69d;
    margin: 6%;
}

==============================================
for suffule
==============================================
*/
ul.gallery {
    display: flex !important;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    list-style: none;
	list-style-type: none;
}
ul.gallery img {
    width: 100%;
    transition: .9s all ease-in-out;
}
ul.gallery a {
    margin: 0px;
    padding: 0px;
    display: block;
    height: auto;
    background-image: url('../img/images/27.jpg');
}
ul.gallery li {
    width: 10%;
    margin-bottom: -9px;
}
/*** css start here by (py) ***/
#fixures{
	padding:60px 10px;
}
.copy_wrap .container {
    max-width:1320px;
    width:100%;
    padding:0px 15px;
    margin:auto;
}
.copy_wrap ul {
    display:flex;
    width:100%;
    justify-content:center;
    list-style:none;
}
.copy_wrap ul li {
    margin-right:15px;
}
.copy_wrap ul li a {
    background:#000;
    width:max-content;
    margin:0 auto;
    padding:3px 10px;
    border-radius:19px;
	font-weight:400;
	font-size:14px;
}
.copy_wrap ul li a i {
    margin-right:7px;
}
/*** css end here by (py) ***/
/*
==============================================
for reset
==============================================
*/
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
}
/***media Query***/
@media(max-width:991px){
	ul.gallery li{
		width: 16.6%;
	}
	#video {
		background-position: -35% 77%;
		padding: 20px 0px 80px;
	}
	#fpf, #history, #mister  {
		padding: 20px 0px 80px;
	}
	#mister img {
		margin-left: -32px;
	}
}
@media(max-width:767px){
	#homepage .bogota {
		background-position: 18%;
	}
	h1 {
		font-size: 3em;
	}
	#fpf .copy, #video .copy, #eusebio .copy {
		width: 100%;
		float: none;
	}
	#example-6 {
		height: 600px;
	}
	#fpf, #video, #history, #mister {
		padding: 20px 0px 40px;
		height: auto;
	}
	#eusebio {
		min-height: auto;
		height: auto;
		background-size: auto;
		padding-bottom: 50px;
	}
	#team {
		padding: 10px 0px 60px;
		height: auto;
	}
	#homepage img {
		margin-top: 60px;
	}
	.bogota .example-container {
		width: 80%;
		padding: 20px;
		max-width: 100%;
	}
	#fpf .images {
		width: auto;
	}
}
@media only screen and (max-width: 600px) {
	header.header {
		position: fixed;
	}
	nav {
		display: none;
	}
	#homepage .bogota {
		float: none;
	}
	#homepage img {
		width: 37%;
		float: left;
		margin-top:5%;
		margin-left: 0px;
	}
	#homepage p {
		font-size: 16px;
		margin-top: 10px;
	}
	#homepage .copy h1 {
		font-size: 28px;
		width: 100%;
		margin-right: 0%;
		margin-top: 0%;
	}
	#homepage {
		height:475px;
	}
	#fpf .copy {
		font-size: 70%;
		width: 100%;
		text-align: center;
		margin-top: -5%;
	}
	#fpf .images {
		font-size: 100%;
		width: 34%;
		margin-top: 0%;
		margin-right: 0% !important;
		float: none;
		position: relative;
		left: 34%;
	}
	#video {
		background-size: cover;
		background-position-x: 120%;
	}
	#video .container {
		max-width: 70px;
	}
	#video img {
		width: 60%;
		float: left;
		margin-top: 0px;
		margin-left: 12%;
	}
	section#video iframe {
		width: 284px;
	}
	#history {
		padding: 40px 0px 40px;
	}
	#eusebio .copy {
		margin-left: 0px;
	}
	#video .copy h2 {
		font-size: 100%;
		width: 100%;
		float: left;
		margin-top: 5%;
		margin-bottom: 5%;
	}
	#history img {
		width: 100%;
		margin-top: 0px !important;
	}
	#history .column3 {
		margin-top: 0px;
	}
	#history .column2,#history .column3, #history .column1,  #history .column4,  #history .column5,  #history .column6 {
		font-size: 70%;
		width: 100%;
		margin: 0px;
	}
	#history p {
		margin-bottom: 10px;
	}
	#history div.container {
		flex-direction: column;
	}
	#eusebio {
		height: 650px;
	}
	#eusebio .copy {
		font-size: 80%;
		width: 100%;
		margin-top: -5%;
	}
	#team {
		background-size: cover;
		background-position-x: 120%;
		height: 1000px;
	}
	#team .text {
		font-size: 60%;
		width: 100%;
		margin-top: -5%;
	}
	#mister .copy {
		font-size: 70%;
		width: 100%;
		margin-top: 0px;
		text-align: center;
		order: 1;
	}
	#mister {
		padding: 0px;
	}
	section#mister .container {
		display: flex;
		flex-direction: column;
	}
	#mister img {
		font-size: 70%;
		width: 60%;
		text-align: center;
		margin-top: 100%;
		padding: 0px;
		margin: 10px auto 0px;
		order: 2;
	}
	#nani {
		height: 680px;
	}
	#nani .copy {
		font-size: 70%;
		width: 100%;
	}
	#nani img {
		width: 60%;
	}
	ul.gallery li{
		width: 16.6%;
	}
	h3{
		font-size: 14px;
	}
	#fixures {
		padding:10px 10px 35px 10px;
	}
	.copy_wrap ul li a {
		padding:2px 8px;
		font-size:12px;
	}
}
/** media (py) **/

@media screen and (min-width:992px) and (max-width:1199px){
	#homepage img {
		margin-top:30px;
	}
}
@media screen and (min-width:768px) and (max-width:991px){
	#fixures {
		padding:10px 10px 40px 10px;
	}
	#homepage img {
		margin-top:30px;
	}
	.bogota .example-container {
		max-width: 600px;
	}
}
@media screen and (max-width:575px){
	#homepage img {
		margin-top:11%;
	}
	#team img {
		width: 18vw;
		height: 18vw;
		object-fit:cover;
	}
	#team {
		padding:10px 0px 42px;
	}
}