/* The Ionicons font is declared by ionicons.min.css. */

@font-face {
  font-family: 'Linearicons';
  src: local('Linearicons'),
  url('../../font/Linearicons.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

.linearicons,
[class^="linearicons-"], [class*=" linearicons-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'Linearicons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}


.linearicons-magnifier:before {
  content: "\ec22";
}

html,
body {
    -webkit-font-smoothing: antialiased;
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
	font-smoothing: antialiased;
	overflow-x: hidden;
}
body {
	background: #ffffff none repeat scroll 0 0;
    color: #687188;
    font-family: "Archivo", sans-serif;
    font-size: 16px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	color: #292b2c;
	font-family: "Archivo", sans-serif;
}
p {
	color:#000;
	line-height: 28px;
	margin-bottom: 25px;
}
a {
	color: #292b2c;
	text-decoration: none;
	-webkit-transition: all 0.3s ease-in-out;
	transition: all .3s ease-in-out;
}
a:hover {
	color: #ff7a00;
	text-decoration: none;
}
a:focus {
	outline: none;
}
img {
	max-width: 100%;
}
button {
	-webkit-transition: all 0.3s ease-in-out;
	transition: all .3s ease-in-out;
}
ul,
li,
ol {
	margin: 0;
	padding: 0;
}
fieldset {
	border: 0 none;
	margin: 0 auto;
	padding: 0;
}
label {
	color: #6c757d;
}
input:focus,
textarea:focus {
	outline: none;
	box-shadow: none;
}
iframe {
	border: 0;
	display: block;
}
video {
	width: 100%;
}
.section {
	padding: 40px 0;
	position:relative;
}
.section.small_pt,
.footer_top.small_pt {
	padding-top: 50px;
}
.section.small_pb,
.footer_top.small_pb {
	padding-bottom: 50px;
}
.section.pb_20,
.pb_20,
.footer_top.pb_20 {
	padding-bottom: 20px;
}
.section.pb_70,
.footer_top.pb_70 {
	padding-bottom: 70px;
}
.section.pb_85,
.footer_top.pb_85 {
	padding-bottom: 85px;
}
.btn:focus,
.btn:hover,
.btn.active {
	box-shadow: none;
	outline: medium none;
}
button:focus {
	outline:none;
}
.border-2 {
	border-width: 2px !important;
}
.btn {
	border-width: 1px;
	cursor: pointer;
	line-height: normal;
	padding: 12px 35px;
	text-transform: capitalize;
	transition: all 0.3s ease-in-out;
}
.btn.active:focus,
.btn:active:focus {
	box-shadow: none !important;
}
.btn-fill-out {
	background-color: transparent;
	border: 1px solid #ff7a00;
	color: #fff;
	position: relative;
	overflow: hidden;
	z-index: 1;
}
.btn-fill-out::before,
.btn-fill-out::after {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	background-color: #ff7a00;
	z-index: -1;
	transition: all 0.3s ease-in-out;
	width: 51%;
}
.btn-fill-out::after {
	right: 0;
	left: auto;
}
.btn-fill-out:hover:before,
.btn-fill-out:hover:after {
	width: 0;
}
.btn-fill-out:hover {
	color: #ff7a00 !important;
}
.btn-fill-line {
	background-color: transparent;
	border: 1px solid #333;
	overflow: hidden;
	position: relative;
	color: #fff !important;
	transition: all 0.8s ease 0s;
	z-index: 1;
}
.btn-fill-line:before,
.btn-fill-line:after {
	position: absolute;
	content: '';
	left: 0;
	top: 0;
	bottom: 0;
	background-color: #333;
	z-index: -1;
	transition: all 0.3s ease-in-out;
	width: 50%;
}
.btn-fill-line::after {
	right: 0;
	left: auto;
}
.btn-fill-line:hover:before,
.btn-fill-line:hover:after {
	width: 0;
}
.btn-fill-line:hover {
	color: #333 !important;
}
.btn-border-fill {
	border: 1px solid #ff7a00;
	color: #ff7a00;
	position: relative;
	overflow: hidden;
	z-index: 1;
}
.btn-border-fill::before,
.btn-border-fill::after {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	background-color: #ff7a00;
	z-index: -1;
	transition: all 0.3s ease-in-out;
	width: 0;
}
.btn-border-fill::after {
	right: 0;
	left: auto;
}
.btn-border-fill:hover:before,
.btn-border-fill:hover:after {
	width: 50%;
}
.btn-border-fill:hover {
	color: #fff !important;
}
.btn-white {
	background-color: transparent;
	border: 1px solid #fff;
	color: #292b2c !important;
	position: relative;
	overflow: hidden;
	z-index: 1;
}
.btn-white::before,
.btn-white::after {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	background-color: #fff;
	z-index: -1;
	transition: all 0.5s ease-in-out;
	width: 50%;
}
.btn-white::after {
	right: 0;
	left: auto;
}
.btn-white:hover:before,
.btn-white:hover:after {
	width: 0;
}
.btn-white:hover {
	color: #fff !important;
}
.btn-fill-out-dark {
	background-color: transparent;
	border: 1px solid #333;
	color: #fff !important;
	position: relative;
	overflow: hidden;
	z-index: 1;
}
.btn-fill-out-dark:hover {
	color: #333 !important;
}
.btn-fill-out-dark::before {
	display: block;
	position: absolute;
	top: 0px;
	left: 0px;
	height: 100%;
	width: 100%;
	z-index: -1;
	content: '';
	background-color: #333;
	transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1);
}
.btn-line-fill {
	border: 1px solid #333;
	overflow: hidden;
	position: relative;
	color: #333 !important;
	transition: all 0.8s ease 0s;
	z-index: 1;
}
.btn-line-fill:hover {
	color: #fff !important;
}
@keyframes criss-cross-left {
  0% {
    left: -20px;
  }
  50% {
    left: 50%;
    width: 20px;
    height: 20px;
  }
  100% {
    left: 50%;
    width: 450px;
    height: 450px;
  }
}
@keyframes criss-cross-right {
  0% {
    right: -20px;
  }
  50% {
    right: 50%;
    width: 20px;
    height: 20px;
  }
  100% {
    right: 50%;
    width: 450px;
    height: 450px;
  }
}
.btn-line-fill:before,
.btn-line-fill:after {
	position: absolute;
	top: 50%;
	content: '';
	width: 20px;
	height: 20px;
	background-color: #333;
	border-radius: 50%;
	z-index: -1;
}
.btn-line-fill:before {
	left: -20px;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}
.btn-line-fill:after {
	right: -20px;
	-webkit-transform: translate(50%, -50%);
	transform: translate(50%, -50%);
}
.btn-line-fill:hover:before {
	-webkit-animation: criss-cross-left 0.7s both;
	animation: criss-cross-left 0.7s both;
	-webkit-animation-direction: alternate;
	animation-direction: alternate;
}
.btn-line-fill:hover:after {
	-webkit-animation: criss-cross-right 0.7s both;
	animation: criss-cross-right 0.7s both;
	-webkit-animation-direction: alternate;
	animation-direction: alternate;
}
.btn-line-white {
	border: 1px solid #fff;
	color: #fff !important;
}
.btn-line-white:hover {
	color: #333 !important;
}
.btn-line-fill.btn-line-white:before,
.btn-line-fill.btn-line-white:after {
	background-color: #fff;
}
.btn-tran-light {
	background-color: rgba(255,255,255,0.2);
	color: #fff;
}
.btn-tran-light:hover {
	background-color: #fff;
}
.btn-radius {
	border-radius: 40px;
}
.btn + .btn {
	margin-left: 10px;
}
.btn i {
	font-size: 16px;
	margin-right: 5px;
	vertical-align: middle;
	line-height: 1;
}
.btn span {
	vertical-align: middle;
}
.btn-group-sm > .btn,
.btn-sm {
    padding: 8px 25px;
}
.btn-group-lg > .btn,
.btn-lg {
    padding: 16px 45px;
}
.btn-xs {
    padding: 4px 20px;
    font-size: 12px;
}
.btn-md {
    padding: 12px 35px;
    font-size: 16px;
}
.btn.btn-xs i {
    font-size: 10px;
}
.btn.btn-sm i {
    font-size: 12px;
}
.btn.btn-lg i {
    font-size: 22px;
}
.btn-ripple {
	padding-right: 0 !important;
	border: 0;
}
.btn-link {
	position: relative;
	z-index: 2;
	text-decoration: none;
}
.btn-link:hover {
	text-decoration: none;
}
.btn-link::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0px;
	height: 1px;
	background-color: #ff7a00;
	z-index: -1;
}
.text_white * {
	color: #fff;
}
.bg_dark {
	background-color: #1D2224 !important;
}
/* Hidden until the page is scrolled; scripts.js fades it in. */
.scrollup {
	display: none;
	background-color: #171717;
	bottom: 20px;
	color: #ffffff;
	font-size: 24px;
	height: 40px;
	line-height: 40px;
	position: fixed;
	right: 20px;
	text-align: center;
	width: 40px;
	z-index: 99;
}
.scrollup:hover {
	background-color: #ff7a00;
	color:#fff;
}
.scrollup:focus {
	color:#fff;
}
.scrollup.scrollup_style1:hover {
	background-color: #333;
}
.background_bg {
	background-position: center center;
	background-size: cover;
}
[class*=overlay_bg_] {
	position: relative;
}
[class*=overlay_bg_]::before {
	background-color: #000;
	bottom: 0;
	content: "";
	left: 0;
	position: absolute;
	right: 0;
	top: 0;
	z-index: 0;

}
[class*=overlay_bg_default_]::before {
	background-color: #ff7a00;
}
[class*=overlay_bg_blue_]::before {
	background-color: #031B4E;
}
[class*=overlay_bg_white_]::before {
	background-color: #fff;
}
@-webkit-keyframes ripple {
    0%{
        opacity:0;
        -webkit-transform:scale(0);
        transform:scale(0)
    }
    50%{
        opacity:0.5;
    }
	100%{
        opacity:0;
        -webkit-transform:scale(1);
        transform:scale(1)
    }
}
@keyframes ripple {
    0%{
        opacity:0;
        -webkit-transform:scale(0);
        transform:scale(0)
    }
    50%{
        opacity:0.5;
    }
	100%{
        opacity:0;
        -webkit-transform:scale(1);
        transform:scale(1)
    }
}
.btn-ripple-white .ripple::before,
.btn-ripple-white .ripple::after,
.btn-ripple-white .ripple {
	background-color: #fff;
}
.btn-ripple-white .ripple {
	color: #ff7a00;
}
.border-top-tran {
	border-top: 1px solid rgba(255,255,255,0.1);
}
.border_bottom_tran {
	border-bottom: 1px solid rgba(255,255,255,0.1);
}
.heading_s3.text-center::before {
	margin: 0 auto;
}
.heading_s3.text-right::before {
	left: auto;
	right: 0;
}
@-webkit-keyframes ball-pulse-sync {
	33% {
		-webkit-transform:translateY(10px);
		transform:translateY(10px)
 }
	66% {
		-webkit-transform:translateY(-10px);
		transform:translateY(-10px)
	}
	100% {
		-webkit-transform:translateY(0);
		transform:translateY(0)
	}
}
@keyframes ball-pulse-sync {
	33% {
		-webkit-transform:translateY(10px);
		transform:translateY(10px)
	}
	66% {
		-webkit-transform:translateY(-10px);
		transform:translateY(-10px)
	}
	100% {
		-webkit-transform:translateY(0);
		transform:translateY(0)
	}
}
.custom-container {
    max-width: 90%;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
}
/*===================================*
  01.END GENERAL STYLE
*===================================*/

/*===================================*
  02.START HEADER STYLE
*===================================*/
.navbar-brand {
	padding: 10px 0;
	vertical-align: top;
	margin: 0;
}
/*
 * The logo is uploaded in the panel, so its own size is not relied on: it is
 * fitted into the box the design gives it, keeping its proportions.
 */
.navbar-brand img {
	max-width: 178px;
	max-height: 154px;
	width: auto;
	height: auto;
}
.dark_skin .logo_light,
.dark_skin .logo_default,
.light_skin .logo_default,
.light_skin .logo_dark,
.logo_light,
.logo_dark {
	display: none;
}
.dark_skin .logo_dark,
.light_skin .logo_light {
	display: block;
}
.light_skin .navbar-nav a,
.light_skin .navbar-toggler,
.light_skin .navbar a.pr_search_trigger {
	color: #ffffff;
}
.navbar {
	padding: 0;
}
.header_wrap {
	transition: all 0.5s ease 0s;
}
.header_wrap:not([class*="bg_"]):not([class*="bg-"]) {
	background-color: #fff;
}
.header_wrap:not([class*="bg_"]):not([class*="bg-"]).transparent_header {
	background-color: transparent;
}
.header_wrap:not([class*="bg_"]):not([class*="bg-"]).transparent_header.nav-fixed {
	background-color: #fff;
}
.header_wrap:not([class*="bg_"]):not([class*="bg-"]).transparent_header.light_skin.nav-fixed,
.header_wrap:not([class*="bg_"]):not([class*="bg-"]).transparent_header.nav-fixed .light_skin {
	background-color: #1D2224;
}
.header_wrap:not([class*="bg_"]):not([class*="bg-"]).transparent_header.sticky_dark_skin.nav-fixed,
.light_skin .sidetoggle_icon::after,
.light_skin .sidetoggle_icon::before,
.light_skin .toggle_center_line {
	background-color: #fff;
}
.navbar .navbar-nav li {
	position: relative;
	list-style: none;
	transition: all 0.3s ease 0s;
}
.navbar-nav .dropdown-menu {
	border: 0;
	border-radius: 0;
	margin: 0;
	padding: 0;
	min-width: 14rem;
}
.navbar-nav .dropdown-menu {
	background-color: #252A2C;
}

.light_skin .navbar-nav .dropdown-menu .mega-menu .dropdown-menu,
.light_skin .navbar-nav .dropdown-menu .dropdown-menu {
	background-color: #303537;
}
.dark_skin .navbar-nav .dropdown-menu {
	background-color: #fff;
	box-shadow: 0 13px 42px 11px rgba(0,0,0,.05);
}
.dark_skin .mega-menu-col,
.dark_skin .cart_list li {
	border-color: #ddd;
}
.dark_skin .navbar .navbar-nav .dropdown-menu li a.active,
.dark_skin .navbar .navbar-nav .dropdown-menu li a:hover,
.dark_skin .navbar .navbar-nav .dropdown-menu > ul > li:hover > a,
.dark_skin .navbar .navbar-nav .dropdown-menu > ul > .mega-menu-col ul > li:hover > a {
	color: #ff7a00;
}
.dark_skin .navbar .navbar-nav li > .dropdown-item,
.dark_skin .navbar .navbar-nav .dropdown-header,
.dark_skin .cart_quantity,
.dark_skin .cart_total {
	color: #333333;
}
.dropdown-toggle::after,
.dropdown-toggler::after {
	border: 0 none;
	content: "\f3d0";
	font-family: "Ionicons";
	margin-left: 5px;
	vertical-align: middle;
}
.dropdown-toggler::after {
	-moz-transform: rotate(-90deg);
	-webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
}
.dropdown-menu .dropdown-toggler::after {
	position: absolute;
	right: 15px;
	top: 10px;
}
.navbar .navbar-nav > li > .nav-link {
	font-weight: 600;
	padding: 19px 7px;
	text-transform: capitalize;
	font-size: 17px;
	color:#010101;
	white-space: nowrap;
}
.navbar .navbar-nav > li > a.active,
.navbar .navbar-nav > li:hover > a,
.light_skin.transparent_header.nav-fixed .navbar .navbar-nav > li > a.active,
.light_skin.transparent_header.nav-fixed .navbar .navbar-nav > li:hover > a,
.transparent_header.nav-fixed .light_skin .navbar .navbar-nav > li > a.active,
.transparent_header.nav-fixed .light_skin .navbar .navbar-nav > li:hover > a {
	color: #ff7a00;
}
.light_skin .navbar .navbar-nav .dropdown-item,
.light_skin .navbar .navbar-nav .dropdown-header {
	color: #fff;
}
.light_skin .item_remove {
	color: #fff !important;
}
.light_skin .mega-menu-col {
	border-right: 1px solid #3f3f3f;
}
.navbar .navbar-nav .dropdown-item {
	padding: 8px 20px 8px 20px;
	color: #333;
	font-size: 14px;
	text-transform: capitalize;
}
.navbar .navbar-nav .dropdown-item.dropdown-toggler {
	padding-right: 30px;
}
.navbar .navbar-nav .dropdown-header {
    color: #333;
    padding: 10px 20px;
    text-transform: uppercase;
    font-weight: bold;
}
.navbar-nav.attr-nav {
	-ms-flex-direction: row;
	flex-direction: row;
}
.navbar-nav.attr-nav li .nav-link {
	padding: 20px 10px;
	position: relative;
	white-space: nowrap;
}
.navbar .attr-nav li.nav-btn {
	margin-left: 10px;
}
.navbar-nav.attr-nav li .nav-link i {
	font-size: 20px;
}
.hover_menu_style2 .navbar .navbar-nav.attr-nav > li > .nav-link {
	margin: 0;
	padding: 20px 10px;
}
.dropdown-item:focus,
.dropdown-item:hover,
.dropdown-item.active,
.dropdown-item:active {
	background-color: transparent;
}
.navbar .navbar-nav.attr-nav .dropdown-menu li a.active,
.navbar .navbar-nav.attr-nav .dropdown-menu li a:hover,
.navbar .navbar-nav.attr-nav .dropdown-menu > ul > li:hover > a {
	background-color: rgba(0,0,0,0);
}
.navbar .navbar-nav .dropdown-menu li a.active,
.navbar .navbar-nav .dropdown-menu li a:hover,
.navbar .navbar-nav .dropdown-menu > ul > li:hover > a,
.navbar .navbar-nav .dropdown-menu > ul > .mega-menu-col ul > li:hover > a,
.sticky_dark_skin.nav-fixed .navbar .navbar-nav .dropdown-item:hover {
	color: #ff7a00;
}
.sticky_dark_skin.nav-fixed .logo_light {
    display: none;
}
.sticky_dark_skin.nav-fixed .logo_dark {
	display: block;
}
.sticky_dark_skin.nav-fixed .navbar-nav li > a,
.sticky_dark_skin.nav-fixed .navbar-toggler,
.sticky_dark_skin.nav-fixed .navbar .navbar-nav .dropdown-item,
.sticky_dark_skin.nav-fixed .navbar .navbar-nav .dropdown-header {
	color: #333;
}
.sticky_dark_skin.nav-fixed .navbar .navbar-nav .dropdown-item.active {
	color: #ff7a00;
}
.sticky_dark_skin.nav-fixed .navbar-nav .dropdown-menu,
.sticky_dark_skin.nav-fixed .navbar-nav .dropdown-menu .dropdown-menu {
	background-color: #fff;
	box-shadow: 0 13px 42px 11px rgba(0,0,0,.05);
}
.sticky_dark_skin.nav-fixed.header_wrap[class*="bg_"],
.sticky_dark_skin.nav-fixed.header_wrap[class*="bg-"] {
	background-color: #fff !important;
}
.sticky_light_skin.nav-fixed .logo_dark {
    display: none;
}
.sticky_light_skin.nav-fixed .logo_light {
	display: block;
}
.sticky_light_skin.nav-fixed.header_wrap:not([class*="bg_"]):not([class*="bg-"]).transparent_header,
.sticky_light_skin.nav-fixed.header_wrap:not([class*="bg_"]):not([class*="bg-"]) {
	background-color: #1D2224;
}
.sticky_light_skin.nav-fixed.header_wrap[class*="bg_"],
.sticky_light_skin.nav-fixed.header_wrap[class*="bg-"] {
	background-color: #1D2224 !important;
}
.sticky_light_skin.nav-fixed .navbar-nav a,
.sticky_light_skin.nav-fixed .navbar-toggler,
.sticky_light_skin.nav-fixed .navbar .navbar-nav .dropdown-item,
.sticky_light_skin.nav-fixed .navbar .navbar-nav .dropdown-header {
	color: #fff;
}
.header_wrap:not([class*="bg_"]):not([class*="bg-"]).sticky_light_skin.nav-fixed .navbar-nav .dropdown-menu {
	background-color: #252A2C;
	border-color: #252A2C;
}
.header_wrap:not([class*="bg_"]):not([class*="bg-"]).sticky_light_skin.nav-fixed .navbar-nav .dropdown-menu .mega-menu .dropdown-menu,
.header_wrap:not([class*="bg_"]):not([class*="bg-"]).sticky_light_skin.nav-fixed .navbar-nav .dropdown-menu .dropdown-menu {
	background-color: #303537;
}
.sticky_dark_skin.nav-fixed .btn-tran-light {
	background-color: #333;
	color: #fff !important;
}
.sticky_dark_skin.nav-fixed .btn-tran-light:hover {
	background-color: transparent;
	color: #333 !important;
	border-color: #333;
}
.search_overlay {
	content: "";
	background-color: #000;
	height: 100%;
	top: 0;
	position: fixed;
	text-align: center;
	opacity: 0.5;
	right: 0;
	transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1);
	width: 0;
	z-index: 99;
}
.search_overlay.open {
	left: 0;
	right: auto;
	width: 100%;
}
.search-overlay.open {
    visibility: visible;
    opacity: 1;
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-o-transform: scale(1);
    transform: scale(1);
}
.search_trigger.open i::before {
	content: "\f129";
	font-family: "Ionicons";
}
.search_wrap {
	position: fixed;
	left: 0;
	right: 0;
	max-width: 800px;
	margin: 0 auto;
	padding: 80px 0;
	z-index: 9999;
	bottom: 0;
	opacity: 0;
	visibility: hidden;
	display: -ms-flexbox;
	display: flex;
	height: 100%;
	-ms-flex-align: center;
	align-items: center;
}
.search_wrap.open {
	opacity: 1;
	visibility: visible;
	-webkit-animation: slideInLeft 1s both;
	animation: slideInLeft 1s both;
}
.search_wrap form {
	position: relative;
	width: 100%;
}
.search_wrap .form-control:focus {
	color: #fff;
}
.search_icon {
	font-size: 24px;
	position: absolute;
	right: 5px;
	top: 5px;
	border: 0;
	background-color: transparent;
	cursor: pointer;
	padding: 0;
	color: #fff;
}
.search_wrap .form-control {
	background-color: transparent;
	border-bottom: 2px solid #fff;
	border-top: 0;
	border-left: 0;
	border-right: 0;
	border-radius: 0;
	padding: 10px 0;
	color: #fff;
}
.search_wrap .form-control::-webkit-input-placeholder {
	color:#ffffff;
}
.search_wrap .form-control::-moz-placeholder {
	color:#ffffff;
}
.search_wrap .form-control:-ms-input-placeholder {
	color:#ffffff;
}
.search_wrap .form-control::-ms-input-placeholder {
	color:#ffffff;
}
.search_wrap .form-control::placeholder {
	color:#ffffff;
}
.close-search {
	font-size: 40px;
	color: #fff;
	cursor: pointer;
	position: absolute;
	right: 0;
	top: 25%;
}
.navbar .attr-nav li .search_trigger i {
	font-size: 20px;
	vertical-align: middle;
	line-height: normal;
}
.navbar .attr-nav li.cart_wrap .nav-link i {
	font-size: 20px;
}
.navbar .attr-nav li.cart_wrap .nav-link {
	padding: 35px 5px;
}
.navbar .attr-nav li .nav-link.sidetoggle i {
	font-size: 28px;
}
.pr_search_trigger.show i::before {
	content: "\ec2a";
}
.header_wrap.fixed-top {
	position: relative;
	padding-right: 0 !important;
}
.header_wrap.transparent_header {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	z-index: 1030;
}
.header_wrap.nav-fixed {
	box-shadow:  0 0 5px rgba(0,0,0,0.15);
	position: fixed;
	right: 0;
	left: 0;
	top: 0;
	z-index: 1041;
	-webkit-animation: slideInDown 0.65s cubic-bezier(0.23, 1, 0.32, 1);
	-moz-animation: slideInDown 0.65s cubic-bezier(0.23, 1, 0.32, 1);
	-o-animation: slideInDown 0.65s cubic-bezier(0.23, 1, 0.32, 1);
	animation: slideInDown 0.65s cubic-bezier(0.23, 1, 0.32, 1);
	-webkit-animation-fill-mode: none;
	-moz-animation-fill-mode: none;
	-o-animation-fill-mode: none;
	animation-fill-mode: none;
}
.nav-fixed.border_bottom_tran {
	border: 0;
}
.header_wrap.fixed-top.transparent_header.nav-fixed.no-sticky {
	position: absolute;
}
.header_wrap.fixed-top.nav-fixed.no-sticky {
	position: relative;
}
.header_wrap:not([class*="bg_"]):not([class*="bg-"]).transparent_header.nav-fixed.no-sticky {
	background-color: transparent;
	box-shadow: none;
}
.navbar .navbar-nav li.dropdown-mega-menu {
	position: static;
}
.navbar .navbar-nav li.dropdown-mega-menu .dropdown-menu {
	right: 0;
	padding-left: 0;
	padding-right: 0;
}
.dropdown-menu li a i {
    font-size: 14px;
    width: 20px;
    display: inline-block;
	vertical-align: middle;
}
.navbar .navbar-nav > li > .nav-link.cart_trigger i {
	font-size: 20px;
}
.navbar-nav .dropdown-menu.cart_box {
	width: 320px;
	position: absolute !important;
	-webkit-transform: scale(0) !important;
	transform: scale(0) !important;
	-webkit-transform-origin: -webkit-calc(100% - 30px) 0;
	transform-origin: calc(100% - 30px) 0;
	display: block;
	transition: all 0.25s ease-in-out;
	padding: 0;
	top: 100% !important;
	left: auto !important;
	right: 0;
}
.navbar-nav .dropdown-menu.cart_box.show {
	-webkit-transform: scale(1) !important;
	transform: scale(1) !important;
}
.dropdown-menu .cart_list li a i {
	width: auto;
}
.top-header {
	border-bottom: 1px solid #eee;
	background:#2c2c2c;
}
.top-header.light_skin {
	border-color: rgba(255,255,255,0.2);
}
.top-header {
    padding: 10px 0;
	transition: all 0.5s ease-in-out;
}
.top-header[class*="bg_"],
.top-header[class*="bg-"] {
	border: 0;
}
.top-header span {
	font-size: 12px;
	vertical-align: middle;
}
.header_wrap .social_icons li {
	padding-bottom: 0;
}
.social_icons {
	font-size: 0;
}
.header_list > li:last-child {
	padding-right: 0;
	border-right: 0;
}
.social_icons li {
	display: inline-block;
	padding: 0px 5px 5px 0;
}
.social_icons li a {
	font-size: 18px;
	color: #687188;
	height: 36px;
	width: 36px;
	line-height: 36px;
	display: inline-block;
	text-align: center;
	vertical-align: middle;
	overflow: hidden;
}
.social_icons li a:hover,
.header_wrap .social_icons li a:hover {
	color: #ff7a00;
}
.social_icons.social_small li a {
	height: 25px;
	width: 25px;
	line-height: 26px;
	font-size: 16px;
}
.social_white .social_icons li a,
.social_white.social_icons li a,
.header_wrap .social_white .social_icons li a,
.header_wrap .social_white.social_icons li a {
	color: #fff;
	border-color: #fff;
}
.social_white .social_icons li a:hover,
.social_white.social_icons li a:hover {
	color: #ff7a00;
}
.border_social .social_icons li a:hover,
.border_social.social_icons li a:hover {
	background-color: #ff7a00;
	border-color: #ff7a00;
	color: #fff;
}
.border_social.social_white .social_icons li a:hover,
.social_white.border_social.social_icons li a:hover {
	color: #fff;
}
.border_social li a {
	border: 1px solid #687188;
	line-height: 35px;
}
.social_icons li:last-child a {
	margin-right: 0px;
}
.rounded_social li a {
	border-radius: 50px;
}
.social_icons.social_style1 li a {
	background-color: #fff;
	color: #ff7a00;
}
.social_icons.social_style1 li a:hover {
	background-color: #ff7a00;
	color: #fff !important;
}
.header_wrap .social_icons li a {
	color: #333;
}
.header_list > li {
	color: #333;
    font-size: 13px;
    vertical-align: middle;
    display: inline-block;
    padding: 2px 5px 2px 0;
    border-right: 1px #666 solid;
    line-height: 14px;
}
.header_list > li i {
	margin-right: 6px;
	vertical-align: middle;
}
.header_list > li .dropdown-item:hover {
	color: #F32B56;
}
.header_dropdown .dropdown-menu {
	border-radius: 0;
	padding: 0;
	margin-top: 0px;
	border: 0;
	transform: none !important;
	top: 100% !important;
	will-change: auto !important;
}
.header_dropdown .dropdown-menu[x-placement^="bottom"],
.dropdown-menu[x-placement^="left"],
.dropdown-menu[x-placement^="right"],
.dropdown-menu[x-placement^="top"] {
	right: 0;
	left: auto !important;
}
.header_dropdown .dropdown-item {
	padding: 5px 10px;
	border-bottom: 1px solid #e6e6e6;
	text-transform: capitalize;
}
.top-header.light_skin .contact_detail li,
.top-header.light_skin .contact_detail li a,
.top-header.light_skin .widget_text span {
	color: #fff;
}
.top-header.dark_skin .contact_detail li {
	color: #000;
}
.nav-fixed .top-header {
	display: none !important;
}
.navbar-toggler {
	float: right;
	margin: 13px 0 0 3px;
	font-size: 28px;
	color: #333;
	transition: all 0.5s ease 0s;
	border-radius: 0;
	height: 35px;
	width: 35px;
	padding: 0;
	line-height: 36px;
	transition: none;
}
.navbar-toggler[aria-expanded="true"] span::before {
    content: "\f129";
    font-size: 16px;
}
.navbar-toggler[aria-expanded="true"] {
	line-height: 32px;
	font-size: 20px;
}
header .attr-nav + .social_icons {
	border-left: 1px solid #333;
	margin-left: 5px;
	padding-left: 5px;
}
header .attr-nav + .social_icons li {
	padding: 0;
}
header.light_skin .attr-nav + .social_icons {
	border-color: #fff;
}
header.light_skin.nav-fixed .attr-nav + .social_icons {
	border-color: #333;
}
header.light_skin.nav-fixed .social_icons li a {
	color: #000;
}
header.light_skin.nav-fixed .social_icons li a:hover {
    color: #0E93D8;
}
.top-header.light_skin .header_list li a,
.top-header.light_skin .ddArrow::before,
.top-header.light_skin .ddcommon .ddTitle .ddlabel,
.light_skin.top-header span,
.light_skin .icon_list > li a {
	color: #fff;
	text-transform:uppercase;
	padding: 0 2px;
}
.top-header.light_skin .header_list > li::before {
	background-color: #fff;
}
.top-header .custome_dropdown .ddChild {
	background-color: #fff;
	border: 0 !important;
	min-width: 10rem;
	left: -10px;
}
.top-header.light_skin .header_list li a:hover,
.top-header.light_skin .contact_detail li a:hover,
.top-header.light_skin .header_list li a:hover span {
	color: #ff7a00;
}
.main_menu_uppercase .navbar-nav > li > .nav-link {
	text-transform: uppercase;
}
.main_menu_weight_100 .navbar .navbar-nav > li > .nav-link {
	font-weight: 100;
}
.main_menu_weight_200 .navbar .navbar-nav > li > .nav-link {
	font-weight: 200;
}
.main_menu_weight_300 .navbar .navbar-nav > li > .nav-link {
	font-weight: 300;
}
.main_menu_weight_400 .navbar .navbar-nav > li > .nav-link {
	font-weight: 400;
}
.main_menu_weight_500 .navbar .navbar-nav > li > .nav-link {
	font-weight: 500;
}
.main_menu_weight_600 .navbar .navbar-nav > li > .nav-link {
	font-weight: 600;
}
.main_menu_weight_700 .navbar .navbar-nav > li > .nav-link {
	font-weight: 700;
}
.main_menu_weight_800 .navbar .navbar-nav > li > .nav-link {
	font-weight: 800;
}
.main_menu_weight_900 .navbar .navbar-nav > li > .nav-link {
	font-weight: 900;
}
.main_menu_size_16 .navbar .navbar-nav > li > .nav-link,
.dd_menu_size_16 .navbar .navbar-nav .dropdown-item {
	font-size: 16px;
}
.sidebar_menu.active {
	right: 0;
	visibility: visible;
}
.sidebar_menu .widget {
	margin-bottom: 20px;
	display: inline-block;
	width: 100%;
}
.sidebar_left .sidebar_menu.active,
.sidebar_left_push .sidebar_menu.active {
	left: 0;
}
.sidebar_left_push.sidetoggle_active .header_wrap.nav-fixed {
	left: 400px;
	right: -400px;
}
.sidebar_right_push.sidetoggle_active .header_wrap.nav-fixed {
	left: -400px;
	right: 400px;
}
body.active {
	overflow: hidden;
	padding-right: 17px;
}
.sidetoggle.open .sidetoggle_icon::before {
	top: 0;
	-moz-transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	transition-property: top,transform;
	transition-delay: 0s,.3s;
}
.sidetoggle.open .sidetoggle_icon::after {
	bottom: 0;
	-moz-transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
	transition-delay: 0s,.3s;
	transition-property: bottom,transform;
	width: 100%;
}
.sidetoggle.open .toggle_center_line {
	opacity: 0;
}
.hover_menu_style1 .navbar-collapse .navbar-nav > li > a {
	position: relative;
	padding: 30px 0px;
	margin: 0 10px;
}
.hover_menu_style1.nav-fixed .navbar .navbar-collapse .navbar-nav > li > .nav-link {
	padding: 20px 0px;
}
.hover_menu_style1 .navbar-collapse .navbar-nav > li > a::before {
	display: block;
	position: absolute;
	bottom: 20px;
	right: 0px;
	height: 2px;
	width: 0;
	z-index: 0;
	content: '';
	background-color: #ff7a00;
	transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1);
}
.hover_menu_style1.nav-fixed .navbar-collapse .navbar-nav > li > a::before {
	bottom: 10px;
}
.hover_menu_style1 .navbar-collapse .navbar-nav > li:hover > a::before,
.hover_menu_style1 .navbar-collapse .navbar-nav > li > a.active::before {
	left: 0;
	right: auto;
	width: 100%;
}
input.text {
	display: none;
}
.ddcommon.borderRadiusTp .ddChild {
	opacity: 1;
	visibility: visible !important;
	-webkit-transform: scale(1) translateY(0);
	-ms-transform: scale(1) translateY(0);
	transform: scale(1) translateY(0);
}
.nav_cat.collapse:not(.show) {
	display: block;
}
#navCatContent li a.dropdown-toggler::after {
	position: absolute;
	right: 15px;
	top: 15px;
}
#navCatContent ul li .dropdown-menu {
	left: 100%;
	top: 0;
	margin: 0;
	border: 0;
	min-width: 800px;
	width: 100%;
	right: 0;
	box-shadow: 10px 16px 49px 0px rgba(38,42,46,0.05);
	border-radius: 0;
	padding: 0;
}
#navCatContent ul li .dropdown-menu .dropdown-header {
	color: #333;
	padding: 10px 15px;
	text-transform: uppercase;
	font-weight: bold;
}
.more_categories.show::before {
	content: "\ec37";
}
.search_form_btn .form-control {
	padding-right: 120px !important;
}
.cfi_search_form.rounded_input select {
	border-radius: 30px 0 0 30px;
	padding: 8px 35px 8px 15px;
}
.cfi_search_form.rounded_input input {
	border-radius: 0 30px 30px 0 !important;
}
.banner_content_inner {
	padding: 50px;
}
SLIDER STYLE
*===================================*/
.banner_section {
	position: relative;
}
.full_screen.banner_half_content {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-pack: center;
	justify-content: center;
	-ms-flex-align: center;
	align-items: center;
}
.banner_section:not(.full_screen),
.banner_section:not(.full_screen) .carousel-item,
.banner_section:not(.full_screen) .banner_content_wrap,
.banner_section:not(.full_screen) .banner_content_wrap .carousel-item {
	height: 800px;
}
.full_screen,
.full_screen .carousel-item {
	height: 100vh;
	min-height: 45rem;
	background-position: top;
}
.banner_section.slide_medium,
.banner_section.slide_medium .carousel-item,
.banner_section.slide_medium .banner_content_wrap,
.banner_section.slide_medium .banner_content_wrap .carousel-item,
.banner_section.shop_el_slider,
.banner_section.shop_el_slider .carousel-item,
.banner_section.shop_el_slider .banner_content_wrap,
.banner_section.shop_el_slider .banner_content_wrap .carousel-item {
	height: 500px;
}
.banner_section.slide_wrap,
.banner_section.slide_wrap .carousel-item,
.banner_section.slide_wrap .banner_content_wrap,
.banner_section.slide_wrap .banner_content_wrap .carousel-item {
	height: 650px;
}

.banner_section.custom_wrap_slider,
.banner_section.custom_wrap_slider .carousel-item,
.banner_section.custom_wrap_slider .banner_content_wrap,
.banner_section.custom_wrap_slider .banner_content_wrap .carousel-item {
	height: 670px;
}
.banner_section .banner_slide_content {
	left: 0;
	position: absolute;
	right: 0;
	top: 50%;
	-moz-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	z-index: 1;
}
.carousel-item img {
	position: relative;
	z-index: -1;
	width: 100%;
}
.carousel-control-next, .carousel-control-prev {
	background-color: rgba(0,0,0,0.5);
	font-size: 18px;
	height: 50px;
	opacity: 0;
	top: 50%;
	-moz-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	width: 50px;
	transition: all 0.3s ease-in-out;
}
.carousel-control-next:focus, .carousel-control-next:hover, .carousel-control-prev:focus, .carousel-control-prev:hover {
	opacity: 0;
}
.carousel:hover .carousel-control-next, .carousel:hover .carousel-control-prev {
	opacity: 1;
}
.carousel-control-next {
	right: 20px;
}
.carousel-control-prev {
	left: 20px;
}
.carousel_style1 .carousel-control-next,
.carousel_style1 .carousel-control-prev {
	border-radius: 100%;
}
.carousel_style2 .carousel-control-next,
.carousel_style2 .carousel-control-prev {
	font-size: 16px;
	border-radius: 4px;
	height: 40px;
	width: 40px;
}
.light_arrow .carousel-control-next,
.light_arrow .carousel-control-prev {
	background-color:#fff;
	box-shadow: 0 0 10px rgba(0,0,0,0.1);
	color: #000;
}
.carousel-control-next:hover,
.carousel-control-prev:hover,
.light_arrow .carousel-control-next:hover,
.light_arrow .carousel-control-prev:hover {
	background-color: #ff7a00;
	color: #fff;
}
.indicators_style1 li.active,
.indicators_style2 li.active {
	background-color: #ff7a00;
}
.indicators_style2 li.active:before,
.indicators_style1 li.active:before {
	border-color: #ff7a00;
}
.banner_content .carousel-item {
	padding: 100px 0;
}
/*.banner_content h2 {
	font-size: 60px;
	margin-bottom: 20px;
	font-weight: 600;
	text-transform: capitalize;
}*/
.banner_content p {
	margin-bottom: 30px;
}
.carousel-indicators.vertical_center_right {
	display: block;
	right: 40px;
	top: 50%;
	margin: 0;
	left: auto;
	-moz-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	bottom: auto;
}
@keyframes zoomin {
  0% {
    -moz-transform: scale(1.2) rotate(3deg);
	-webkit-transform: scale(1.2) rotate(3deg);
	transform: scale(1.2) rotate(3deg);
  }
  100% {
   -moz-transform: scale(1) rotate(0deg);
	-webkit-transform: scale(1) rotate(0deg);
    transform: scale(1) rotate(0deg);
  }
}
.header_with_topbar.transparent_header + .banner_section .banner_slide_content {
	margin-top: 45px;
}
/*===================================*
  06.END ICON BOX STYLE
*===================================*/

/*===================================*
  07.START PORTFOLIO STYLE
*===================================*/
.carousel_slider li {
	list-style: none;
}
.grid_filter li a.current {
	color: #ff7a00;
}
.grid_filter.filter_style1 li a.current {
	color: #fff;
	background-color: #ff7a00;
}
.grid_filter.filter_style2 li a.current {
	border-bottom-color: #ff7a00;
}
h6.blog_title {
	line-height: 24px;
}
.blog_img .owl-dots {
	position: absolute;
	top: 0;
	right: 15px;
}
.rounded-input {
	border-radius: 50px;
}
.newsletter_form .btn-send {
	background-color: #ff7a00;
	color: #fff;
	font-size: 20px;
	right: 5px;
	border: 0;
	border-radius: 100%;
	width: 40px;
	height: 40px;
	padding: 0;
	line-height: 40px;
}
.newsletter_form .btn-send2 {
	background-color: transparent;
	color: #ff7a00;
	font-size: 20px;
	right: 5px;
	width: 50px;
	height: 40px;
	line-height: 40px;
	border-left: 1px solid #ddd;
	border-top: 0;
	border-bottom: 0;
	border-right: 0;
	padding: 0 0 0 5px;
}
.footer_dark {
	background-color: #000c27;
	position: relative;
}
.footer_top {
	padding: 60px 0 20px;
}
.footer_logo {
	margin-bottom: 20px;
	margin-top: -60px;
}
.footer_logo  img {
border-radius:0 0 20px 20px;
max-height:170px;
width:auto;
}
footer p {
	font-size: 14px;
}
footer .widget {
	margin-bottom: 30px;
}
footer .widget_title {
	text-transform:uppercase;
	margin-top: 10px;
	margin-bottom: 25px;
	font-size: 21px;
	color: #ff7a00 !important;
	font-weight:500;
}
.widget_links li {
	list-style: none;
	padding-bottom: 10px;
}
.widget_links li:last-child {
	padding-bottom: 0;
}
.widget_links li a {
	font-size: 14px;
	color: #687188;
}
.contact_info > li {
	margin-bottom: 15px;
	list-style: none;
}
.contact_info > li:last-child {
	margin-bottom: 0px;
}
.contact_info li i {
	display: inline-block;
	margin-right: 10px;
	margin-top: 4px;
	font-size: 18px;
	vertical-align: top;
}
.contact_info li span {
	float: left;
	margin-right: 10px;
	max-width: 70px;
	width: 100%;
	color: #292b2c;
}
.contact_info span + * {
	overflow: hidden;
	color: #687188;
	margin: 0;
	font-size: 14px;
	line-height: 26px;
}
.contact_info i + * {
	overflow: hidden;
	font-size: 14px;
	color: #687188;
	line-height: 26px;
	margin: 0;
	vertical-align: middle;
	max-width: 78%;
	display: inline-block;
}
.contact_info_light li i {
	border-color: #fff;
	color: #fff;
}
.contact_info_light li span,
.contact_info_light li a {
	color: #fff;
}
.bottom_footer {
	padding: 30px 0;
	position: relative;
}
/* The copyright bar opens when the footer logos are clicked (scripts.js). */
.bottom_footer.hidden-menu {
	display: none;
}
.footer_dark h1,
.footer_dark h2,
.footer_dark h3,
.footer_dark h4,
.footer_dark h5,
.footer_dark h6,
.footer_dark p,
.footer_dark a,
.footer_dark .widget_links li a,
.footer_dark .footer_link li a,
.footer_dark .post_content a {
	color: #fff;
}
.footer_dark a:hover,
.footer_dark .widget_links li a:hover,
.widget_links li a:hover,
.footer_dark .footer_link li a:hover {
	color: #ff7a00;
}
.bottom_footer .social_icons li {
	padding-bottom: 0;
}
.team_style1 .social_icons + .team_title {
	margin-top: 10px;
}
.team_single_info .contact_info {
	margin: 20px 0;
}
.team_style1 .social_icons {
    position: absolute;
    top: 0%;
    left: 0;
    right: 0;
    text-align: center;
    -moz-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    opacity: 0;
    transition: all 0.5s ease-in-out;
	z-index: 1;
}
.team_style1:hover .social_icons {
    top: 50%;
    opacity: 1;
}
.header_wrap.transparent_header  + .breadcrumb_section {
	padding-top: 200px;
}
.header_wrap.transparent_header.header_with_topbar + .breadcrumb_section {
	padding-top: 250px;
}
.accordion_style2 .card-header a.collapsed:after {
    content: "\f123";
}
.accordion_style4 .card-header a.collapsed::after {
	content: "\f123";
}
.btn-login li {
	margin: 0px 5px 0;
	display: inline-block;
}
.btn-login li a {
	border-radius: 5px;
	padding: 10px 20px;
	color: #fff;
	display: block;
}
.btn-login li a i {
	margin-right: 10px;
	font-size: 18px;
	margin-left: 0;
}
.btn-facebook {
	background: #3b5998;
	border-color: #3b5998;
}
.btn-facebook:hover {
	color: #fff;
	background: #344e86;
	border-color: #344e86;
}
.btn-google {
	background: #d85040;
	border-color: #d85040;
}
.btn-google:hover {
	color: #fff;
	background: #d33d2b;
	border-color: #d33d2b;
}
.tab-content.shop_info_tab {
	margin-top: 40px;
}
.releted_cfi_slider .item {
	margin: 10px 0px 0px;
}
.compare_box table tr td.row_title {
	width: 270px;
	text-transform: uppercase;
	font-weight: 600;
}
.row_remove a,
.row_remove a:hover {
	color: #FF0000;
}
.row_color .cfi_color_switch span {
	pointer-events: none;
}
label.label_info {
	color: #292b2c !important;
	font-weight: 600;
}
/*===================================*
  23.END SHOP DESIGN
*===================================*/

/*===================================*
  24.START ELEMENT DESIGN
*===================================*/
.form-control {
	color: #000;
	box-shadow: none;
	height: 50px;
	padding: 8px 15px;
}
.form-control:focus {
	color: #000;
	box-shadow: none;
	height: 50px;
}
textarea.form-control,
textarea.form-control:focus {
	height: auto;
	padding: 12px 15px;
}
select.not_chosen,
select.first_null option:first-child,
select.not_chosen:focus,
select.form-control.not_chosen,
select.form-control.first_null option:first-child,
select.not_chosen.form-control:focus {
	color: #6c757d;
}
select option {
	color: #000;
}

.rounded_input .form-control,
.rounded_input input {
	border-radius: 30px;
	padding: 10px 20px;
}
.rounded_input .custom_select select {
	padding-right: 40px;
}
.rounded_input .custom_select::before {
	right: 20px;
}
.rounded_input textarea.form-control,
.rounded_input textarea.form-control:focus {
	padding: 15px 20px;
}
.rounded_input .input_icon {
	top: 12px;
}
.pagination_style1 .page-item.disabled .page-link,
.pagination_style3 .page-item.disabled .page-link {
	color: #c6c6c6;
	pointer-events: none;
	background-color: #fff;
	border-color: #f4f4f4;
}
.pagination_style1 .page-item.active .page-link {
	background-color: #ff7a00;
	border-color: #ff7a00;
	color: #fff;
}
.widget_title {
	margin-bottom: 25px;
	text-transform: capitalize;
	font-weight: 600;
	letter-spacing: 0.3px;
}
.sidebar .widget + .widget {
    border-top: 1px solid #ddd;
    margin-top: 30px;
    padding-top: 30px;
}
.widget_newsletter .btn i {
	font-size: 18px;
}
.nav-tabs li.nav-item a {
	background-color: transparent;
	border: 0;
	font-weight: 500;
	text-align: center;
	text-transform: capitalize;
	padding: 5px 20px;
}
.tab-content {
	margin-top: 25px;
}
.tab-style1 .nav-tabs,
.tab-style2 .nav-tabs {
	border-bottom: 0;

}
.tab-style1 .nav-tabs li.nav-item a.active,
.tab-style1 .nav-tabs li.nav-item a.active:hover,
.tab-style2 .nav-tabs li.nav-item a.active,
.tab-style2 .nav-tabs li.nav-item a.active:hover {
	background: #050033;
    color: #ff7800;
}
.tab-style2 .nav-tabs li.nav-item a {
	padding: 0px 15px;
}
.tab-style2 .nav-tabs li.nav-item:last-child a {
	padding-right: 0;
}
.tab-style3 .nav-tabs li.nav-item a {
	background-color: transparent;
	display: block;
	padding: .5rem 1rem;
	border-top: 0;
	border-left: 0;
	border-right: 0;
	border-bottom: 2px solid rgba(0,0,0,0);
	text-align: center;
	text-transform: uppercase;
}
.tab-style3 .nav-tabs .nav-item a.active {
	border-bottom-color: #ff7a00;
	color: #ff7a00;
}
.tab_slider > .tab-pane {
	display: block;
	height: 0;
}
.tab_slider .tab-pane.active {
	height: auto;
	display: block;
	-webkit-animation-name: moveUp;
	animation-name: moveUp;
	-webkit-animation-duration: .5s;
	animation-duration: .5s;
	-webkit-animation-timing-function: cubic-bezier(.26,.69,.37,.96);
	animation-timing-function: cubic-bezier(.26,.69,.37,.96);
	-webkit-animation-play-state: running;
	animation-play-state: running;
}
@-webkit-keyframes moveUp {
	0% {
		opacity:0;
		-webkit-transform:translateY(25px);
		transform:translateY(25px)
	}
	100% {
		opacity:1;
		-webkit-transform:translateY(0);
		transform:translateY(0)
	}
}
@keyframes moveUp {
	0% {
		opacity:0;
		-webkit-transform:translateY(25px);
		transform:translateY(25px)
	}
	100% {
		opacity:1;
		-webkit-transform:translateY(0);
		transform:translateY(0)
	}
}
.owl-theme .owl-nav {
	margin-top: 0;
}
body .owl-theme .owl-nav [class*="owl-"] {
	background-color: #fff;
	color: #222;
	font-size: 26px;
	line-height: 50px;
	transition: all 0.3s ease-in-out;
	height: 50px;
	padding: 0;
	margin: 0;
	width: 50px;
	text-align: center;
}
.owl-theme .owl-nav [class*="owl-"] i {
	line-height: normal;
}
.owl-theme .owl-dots {
	font-size: 0;
	margin-top: 15px;
}
.owl-theme .owl-dots .owl-dot span {
	background-color: transparent;
	border: 1px solid #ff7a00;
	cursor: pointer;
	margin: 3px;
	opacity: 1;
	transition: all 0.3s ease-in-out;
}
.owl-theme .owl-dots .owl-dot.active span,
.owl-theme .owl-dots .owl-dot:hover span {
	background-color: #ff7a00;
}
.dot_style1.owl-theme .owl-dots .owl-dot.active span {
	width: 30px;
}
.nav_style1.owl-theme .owl-nav [class*="owl-"],
.nav_style5.owl-theme .owl-nav [class*="owl-"] {
	position: absolute;
	top: 50%;
	-moz-transform: translateY(-50%);
	-webkittransform: translateY(-50%);
	transform: translateY(-50%);
	border-radius: 0;
	width: 30px;
}
.nav_style1.owl-theme .owl-nav [class*="owl-"]:hover {
	background-color: #fff;
	color: #555;
}
.nav_style1.owl-theme .owl-nav .owl-prev {
	left: -50px;
}
.nav_style1.owl-theme .owl-nav .owl-next {
	right: -50px;
}
.nav_style2.owl-theme .owl-nav [class*="owl-"] {
	background-color: transparent;
	position: absolute;
	bottom: 10px;
}
.nav_style2.owl-theme .owl-nav [class*="owl-"]:hover,
.nav_style3.owl-theme .owl-nav [class*="owl-"]:hover,
.nav_style4.owl-theme .owl-nav [class*="owl-"]:hover {
	color: #555;
}
.nav_style2.owl-theme .owl-nav .owl-prev,
.nav_style5.owl-theme .owl-nav .owl-prev {
	left: 0px;
}
.nav_style2.owl-theme .owl-nav .owl-next,
.nav_style5.owl-theme .owl-nav .owl-next {
	right: 0px;
}
.nav_style3.owl-theme .owl-nav [class*="owl-"],
.nav_style4.owl-theme .owl-nav [class*="owl-"] {
	position: absolute;
	top: -90px;
	border-radius: 0;
	right: 0;
	height: auto;
	width: auto;
	background-color: transparent;
}
.nav_style3.owl-theme .owl-nav .owl-prev {
	right: 40px;
}
.nav_style4.owl-theme .owl-nav .owl-prev {
	left: 0px;
	right: auto;
}
.nav_style4.owl-theme .owl-nav .owl-prev i::before {
	content: "\ec43";
	font-family: 'Linearicons';
}
.nav_style4.owl-theme .owl-nav .owl-next i::before {
	content: "\ec44";
	font-family: 'Linearicons';
}
.nav_style5.owl-theme .owl-nav .owl-prev,
.nav_style5.owl-theme .owl-nav .owl-next {
	opacity: 0;
	border-radius: 4px;
	width: 40px;
	height: 40px;
	line-height: 40px;
	box-shadow: 0 0 10px rgba(0,0,0,0.1);
}
.nav_style5.owl-theme .owl-nav .owl-prev:hover,
.nav_style5.owl-theme .owl-nav .owl-next:hover {
	background-color: #ff7a00;
	color: #fff;
}
.nav_style5.owl-theme:hover .owl-nav .owl-prev {
	left: 20px;
	opacity: 1;
}
.nav_style5.owl-theme:hover .owl-nav .owl-next {
	right: 20px;
	opacity: 1;
}
.dot_white.owl-theme .owl-dots .owl-dot span {
	border-color: #fff;
}
.dot_white.owl-theme .owl-dots .owl-dot.active span,
.dot_white.owl-theme .owl-dots .owl-dot:hover span {
	background-color: #fff;
}
.social_icons [class*="sc_"] {
	color: #fff !important;
}
.social_icons [class*="sc_"] i {
    transition: all 0.3s ease-in-out;
    display: block;
	line-height: 36px;
}
.social_icons [class*="sc_"]:hover i {
    -webkit-animation: toLeftFromRight 0.3s forwards;
	-moz-animation: toLeftFromRight 0.3s forwards;
	animation: toLeftFromRight 0.3s forwards;
}
blockquote {
	font-size: 20px;
	line-height: 34px;
}
blockquote p {
	line-height: 34px;
}
blockquote p:last-child {
	margin: 0;
}
.modal {
	padding-right: 0 !important;
}
.button_group .btn {
	margin-bottom: 20px;
}
.subscribe_popup .modal-body {
	padding: 0;
}
.subscribe_popup .modal-content {
	border: 0;
	border-radius: 0;
}
.modal {
	z-index: 99999;
}
.modal-backdrop {
	z-index: 9999;
}
.dashboard_menu .nav-tabs li.nav-item a {
	text-align: left;
	padding: 12px 20px;
	border-radius: 0;
	border-bottom: 1px solid #efefef;
	color: #2b2f4c;
}
.dashboard_menu .nav-tabs li.nav-item a.active {
	background-color: #ff7a00;
	color: #fff;
}
.dashboard_menu .nav-tabs li.nav-item a i {
	margin-right: 8px;
	vertical-align: middle;
}
/*===================================*
  24.END ELEMENT DESIGN
*===================================*/


.tagline {
font-size:14px;
}
.nav-link {color:#010101; font-size:18px;}
.ticker { background:#222042; padding:15px 10px; color:#fff; text-transform:uppercase; font-size:14px; font-weight:500;}
.ticker a { color:#fff;}
.ticker .ticker-title {color:#ff7a00;}
/* Without JavaScript the messages simply read one after another. */
.ticker-messages {display:inline; margin:0; padding:0; list-style:none;}
.ticker-messages li {display:inline;}
.ticker-messages li + li::before {content:" \00b7 ";}
.login-sm-btn {
background:#276d03;
font-size:13px;
color:#fff;
padding:2px 30px !important;
border-radius:50px;
display:inline-block;
}
.btn-green {
	background-color: transparent;
	border: 1px solid #208f34;
	color: #fff !important;
	position: relative;
	overflow: hidden;
	z-index: 1;
	padding:15px 25px;
	display:inline-block;
	font-size:18px;
	font-weight:500px;
	border-radius: 50px;
}
.btn-green::before,
.btn-green::after {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	background-color: #208f34;
	z-index: -1;
	transition: all 0.5s ease-in-out;
	width: 51%;
}
.btn-green::after {
	right: 0;
	left: auto;
}
.btn-green:hover:before,
.btn-green:hover:after {
	width: 0;
}
.btn-green:hover {
	color: #fff !important;
	border: 1px solid #208f34;
}
.btn-orange {
	background-color: transparent;
	border: 1px solid #ff7a00;
	color: #fff !important;
	position: relative;
	overflow: hidden;
	z-index: 1;
	padding:15px 25px;
	display:inline-block;
	font-size:18px;
	border-radius: 50px;
}
.btn-orange::before,
.btn-orange::after {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	background-color: #ff7a00;
	z-index: -1;
	transition: all 0.5s ease-in-out;
	width: 50%;
}
.btn-orange::after {
	right: 0;
	left: auto;
}
.btn-orange:hover:before,
.btn-orange:hover:after {
	width: 0;
}
.btn-orange:hover {
	color: #fff !important;
	border: 1px solid #ff7a00;
}
.banner_content h2 {
	font-size: 50px;
	margin-bottom: 0px;
	font-weight: 600;
	/*text-transform: uppercase;*/
	line-height:70px;
}
.banner_content p {
	margin-bottom: 30px;
	font-size:20px;
}
.banner_slide_content.banner1 {
position:absolute;
bottom:-120px !important;
top:inherit;
background:url(../../img/website/dot1.png) repeat;
}
.banner_slide_content.banner2 {
    position: absolute;
    bottom: -174px !important;
    top: inherit;
	
}

.carousel-item.background_bg::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 300px 20px 20px;
    color: #fff;
    background: linear-gradient( to top, rgba(0, 0, 0, 0.95), rgba(0, 0, 0, 0) );
}


.Qlnk-box {

}
.Qlnk-box ul {
	display: flex;
  flex-wrap: wrap; /* Allows items to wrap to the next row */
  align-items: stretch; /* Makes all li children equal height in a row */
  justify-content: center;
}
.Qlnk-box ul li {
margin:0px;
padding:10px;
display:inline-block;
background-color: #fff;
position: relative;
transition: all 0.5s ease-in-out;
box-shadow: 0 0 7px rgb(0 0 0 / 10%);
width:18.7%;
margin:0 10px;
}
.Qlnk-box ul li .Qlnk-ico {
margin:10px 0;
}
/* A tile with an address is clickable as a whole, and looks the same. */
.Qlnk-box ul li .Qlnk-link {
display:block;
color:inherit;
text-decoration:none;
}
.Qlnk-box ul li .Qlnk-ico img {
height:80px;
}
.Qlnk-box ul li .Qlnk-title {
font-size: 19px;
font-weight: 700;
text-transform: uppercase;
color: #000000;
}
.skew-bg {
  position: relative;
  display: inline-block;
  padding: 10px 20px;
  color: #ffffff; /* Text color */
  z-index: 1;     /* Keeps text above the background */
  font-size:30px;
  text-transform:uppercase;
}
.skew-bg::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #000000; /* Background color */
  transform: skewX(-20deg);  /* Adjust angle here */
  z-index: -1;               /* Places background behind text */
}
.thumb-box {
margin-left: -15px;
    margin-right: -15px;
}
.thumb-box ul {
display: flex;
flex-wrap: wrap; /* Allows items to wrap to the next row */
align-items: stretch; /* Makes all li children equal height in a row */
width:100%;
}
.thumb-box ul li {
margin:0px;
display:inline-block;
background-color: #fff;
position: relative;
transition: all 0.5s ease-in-out;
box-shadow: 0 0 7px rgb(0 0 0 / 10%);
width:100%;
height:100%;
}
.thumb-box ul li .thumb-img img {
	width: 100%;
  height: 100%;
  object-fit: fill;
}
.thumb-box ul li .thumb-title {
font-size:18px;
font-weight:700;
text-transform:uppercase;
color:#fff;
position:absolute;
bottom:10px;
right:20px;
}

.thumb-box .thumb-img::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 100px 20px 20px;
    color: #fff;
    background: linear-gradient( to top, rgba(0, 0, 0, 0.95), rgba(0, 0, 0, 0) );
}
.track {border-bottom:8px #069ecf solid;}
.road {border-bottom:8px #df2418 solid;}
.mtb {border-bottom:8px #202221 solid;}
.ecycling {border-bottom:8px #f5e015 solid;}
.paracycling {border-bottom:8px #2ca36a solid;}
.b-track {background: #069ecf !important; font-size:14px; font-weight:500;}
.b-road {background: #df2418 !important; font-size:14px; font-weight:500;}
.b-mtb {background: #202221 !important; font-size:14px; font-weight:500;}
.b-ecycling {background: #f5e015 !important; font-size:14px; font-weight:500;}
.track_bg { background:#069ecf;}
.EventsArea {
background:url(../../img/website/event-bg.jpg);
position:relative;
margin-top:40px;
}
.EventsArea .vertical-head1 {
	position: absolute;
    bottom: 25px;
	font-size:68px;
	color:#ffffff;
	text-transform:uppercase;
	font-weight:700;
}
.EventsArea h1 {
  transform: rotate(-90deg);
  /*transform-origin: left bottom;*/
  transform-origin: -27px center;
  opacity: 0.8;
}
.EventsArea .Event_box {
background:#fff;
display: flex;
 flex-direction: column;
}
.EventsArea .Event_box .eboxtag {
background:#069ecf;
}
.EventsArea .Event_box .Etag {
background:#df2418;
}
.EventsArea .pr_flash1 {
	background-color: #FF9F00;
	position: absolute;
	right: 10px;
	top: 10px;
	text-transform: uppercase;
	color: #fff;
	padding: 2px 8px;
	font-size: 13px;
	z-index: 1;
}

.EventsArea .pr_flash1.roadflash {background-color: #df2418;}
.EventsArea .pr_flash1.mtbflash {background-color: #202221;}
.EventsArea .pr_flash1.trackflash {background-color: #069ecf;}
.EventsArea .pr_flash1.ecyclingflash {background-color: #f5e015;}

.EventsArea .Event_box .roadbox{}
.EventsArea .Event_box .roadbox .btn_e{background-color: #df2418; color:#fff !important;}
.EventsArea .Event_box .roadbox .text_e{color: #ff0000;}
.EventsArea .Event_box .mtbbox{}
.EventsArea .Event_box .mtbbox .btn_e{background-color: #202221; color:#fff !important;}
.EventsArea .Event_box .mtbbox .text_e{color: #202221;}
.EventsArea .Event_box .trackbox{}
.EventsArea .Event_box .trackbox .btn_e{background-color: #069ecf; color:#fff !important;}
.EventsArea .Event_box .trackbox .text_e{color: #069ecf;}
.EventsArea .Event_box .ecyclingbox{}
.EventsArea .Event_box .ecyclingbox .btn_e{background-color: #f5e015; color:#fff !important;}
.EventsArea .Event_box .ecyclingbox .text_e{color: #f5e015;}

.EventsArea .Event_box .button {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M12 4l-1.41 1.41L16.17 11H4v2h12.17l-5.58 5.59L12 20l8-8z' fill='white'/%3E%3C/svg%3E");

  background-repeat: no-repeat;
  background-position: 125px 12px;
  background-color:#ff7a00;
  color:#fff;
  border-radius:50px;
  transition: background-position 0.5s ease, padding-left 0.5s ease;
  width: 150px;
  height: 45px;
  line-height:45px;
  font-size: 13px;
  font-weight:600;
  text-transform:uppercase;
  text-align:left;
  padding: 1px 7px 1px 7px;
  text-align:center;
  display: block;
  margin: 4px auto;
}
.EventsArea .Event_box .button:hover {
  transition: background-position 0.5s ease, padding-left 0.5s ease;
  background-position: 115px 12px;
  background-color:#000;
  padding-left: 0;
  color:#fff;
  display: block;
}

.EventsArea .Events { position:relative;}
.EventsArea .Events .eboxtag { 
	background: #069ecf;
    color: #fff;
    position: absolute;
    z-index: 2;
    padding: 2px 10px;
    text-transform: uppercase;
    top: -23px; font-size:13px; }
.EventsArea .Events .eboxtag-upcoming { background: #ff7a00;}
.EventsArea .Events .eboxtag-latest { background: #ff7a00;}
.EventsArea .event_table_bg { background:#fff; box-shadow: inset 0 0 50px #d1d1d1; padding:20px; min-height:415px;}
.event_table_bg .Event-sm-logo {width:100px; margin:0 auto;}
.event_table_bg .Event_name {font-size:22px; line-height:24px; font-weight:700; text-transform:uppercase; color:#000; margin-top:10px; text-transform:uppercase; margin-left:30px; margin-right:30px;}
.event_table_bg .Event_date {font-size:22px; font-weight:700; text-transform:uppercase; color:#df2418; padding:10px 0;}
.event_table_bg .Event_logo img { width:50px;}
.event_table_bg .Event_vanue {font-size:20px; font-weight:700; text-transform:normal; color:#000000;}
.event_table_bg sup,
.event_table_bg sub { text-transform:none;}
/* A class rather than an id: the carousel clones its slides. */
.marquee-full {
  max-width: 1920px!important;
  margin: 0 auto;
}
.default-content-container {
    margin-left: auto;
    margin-right: auto;
    margin-top: 0;
    margin-bottom: 0;
    padding-left: 5rem;
    padding-right: 5rem;
    padding-top: 4.5rem;
    padding-bottom: 4.5rem;
    width: 100%;
    min-height: 100vh;
}
div.marquee>a>img {
  height: 120px;
}
.logoMarqueeSection>div>div {
    padding-top: 0;
    padding-bottom: 0;
    min-height: 0;
}
.marquee-wrapper {
  display:  inline-block;
  white-space: nowrap;
}
.marquee {
    display:  inline-block;
    white-space: nowrap;
    position: relative;
    transform: translate3d(0%, 0, 0);
    animation-name: marquee;
    animation-duration: 10s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}
.marquee a {
    display:  inline-block;
    white-space: nowrap;
    padding-right: 5.4rem;
}
.marquee-wrapper:hover .marquee {
    animation-play-state: paused !important;
}
@keyframes marquee {
    0% {
        transform: translate3d(0%, 0, 0);
    }

    100% {
        transform: translate3d(-100%, 0, 0);
    }
}
.owl-carousel .owl-item img {
    display: inline-block;
    width: 85px;;
}
.about-members-area {
background: #F5E8CF;
background: linear-gradient(0deg,rgba(245, 232, 207, 1) 0%, rgba(255, 255, 255, 1) 100%);
}
.about-img{ min-height:100%;}
.Latestnews {
background:#d1d1d1;
padding-bottom:30px;
margin-top:40px;
}
.latestnews-head {
position:relative;
top:-60px;
margin-bottom:0;
width:100%;
}


.newsbox{ position:relative;}


.newsbox .innerbox::before{ 
content: "";
position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 180px 20px 20px;
    color: #fff;

    background: linear-gradient(
        to top,
        rgba(0, 0, 0, 0.95),
        rgba(0, 0, 0, 0)
    );
}

.newsbox .pr_flash1 {
	background-color: #df2418;
	text-transform: uppercase;
	color: #fff;
	padding: 2px 5px;
	font-size: 11px;
	display:inline-block;
	
}
.newsbox img {
	width:100% !important;
}
.newsbox .newsdesc {
position:absolute;
bottom:10px;
left:10px;
}
.newsbox .ln-title {
font-size:23px;
color:#fff;
text-transform:capitalize;
font-weight: 600;
padding:5px 0;
}
.newsbox .sm-btn {
font-size:12px;
color:#fff;
text-transform:capitalize;
background:#df2418;
border-radius:50px;
padding:5px 20px;
}

.news .newsbox::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 300px 20px 20px;
    color: #fff;
    background: linear-gradient( to top, rgba(0, 0, 0, 0.95), rgba(0, 0, 0, 0) );
}
.MediaGallery .mediagallery-box {
position:relative;
}
.MediaGallery   .media-desc {
position:absolute;
bottom:20px;
left:10px;
width:100%;
}
.MediaGallery .mediagallery-box h1 {
font-size:27px;
text-align:center;
color:#ffffff;
}
.MediaGallery .mediagallery-box .sm-btn {
font-size:12px;
color:#fff;
text-transform:capitalize;
background:#df2418;
border-radius:50px;
padding:10px 20px;
}

.Instafeed {
}
.right {
float:right;
}
.newsbox .newsdesc .button {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M12 4l-1.41 1.41L16.17 11H4v2h12.17l-5.58 5.59L12 20l8-8z' fill='white'/%3E%3C/svg%3E");

  background-repeat: no-repeat;
  background-position: 125px 7px;
  background-color:#ff7a00;
  color:#fff;
  border-radius:50px;
  transition: background-position 0.5s ease, padding-left 0.5s ease;
  width: 150px;
  height: 35px;
  line-height:35px;
  font-size: 13px;
  font-weight:600;
  text-transform:uppercase;
  text-align:left;
  padding: 1px 7px 1px 7px;
  text-align:center;
  display: block;
}
.newsbox .newsdesc .button:hover {
  transition: background-position 0.5s ease, padding-left 0.5s ease;
  background-position: 115px 7px;
  background-color:#000;
  padding-left: 0;
  color:#fff;
}


.newsbox .newsdesc .btn_ln_road{ background-color:#df2418;}
.newsbox .newsdesc .btn_ln_mtb{background-color:#202221 ;}
.newsbox .newsdesc .btn_ln_track{background-color:#069ecf;}
.newsbox .newsdesc .btn_ln_ecycling{background-color:#f5e015;}

.button {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M12 4l-1.41 1.41L16.17 11H4v2h12.17l-5.58 5.59L12 20l8-8z' fill='white'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: 115px 8px;
  background-color:#ff7a00;
  color:#fff;
  border-radius:50px;
  transition: background-position 0.5s ease, padding-left 0.5s ease;
  width: 150px;
  height: 40px;
  line-height:40px;
  font-size: 16px;
  padding: 1px 7px 1px 7px;
  text-align:center;
}
.button:hover {
  transition: background-position 0.5s ease, padding-left 0.5s ease;
  background-position: 103px 8px;
  padding-left: 0;
  color:#fff;
}
.eventbtn {
position:relative;
right:0px;
top:-60px;
}
.Rankingbtn {
position:relative;
right:0px;
top:-60px;
}
.about-1 {
}
.about-1 .about-area {
font-size: 16px;
font-weight: 500;
color: #222222;
margin-bottom: 20px;
}
.about-1 .about-members-area {
text-align:center;
}
.about-1 .about-members-area img {
margin-bottom:10px;
}
.about-1 .about-members-area .member p {
font-size:16px;
color:#000;
font-weight:700;
line-height:22px;
margin-bottom:20px;
}
.cfi_slider.news { margin-top:-30px;}
.ered {
background:#df2418 !important;
}

.eorange {
background:#ff7a00 !important;
}

.eblue {
background:#2e2c4f !important;
}
/* Header */
.bottom-footer {
    width: 100%;
    height: 84px;
    position: relative;
}
/* Navy top area */
.header-navy {
    width: 100%;
    height: 51px;
    background: #000d2b;
}
/* Center white curved area */
.logo-wrapper {
    position: absolute;
    top: 0px;
    left: 50%;
    transform: translateX(-50%);

    width: 295px;
    height: 62px;

    background: #ffffff;

    border-radius: 45px 45px 0 0 ;

    display: flex;
    align-items: flex-start;
    justify-content: center;
    gap: 12px;

    padding-top: 3px;
}
/* Logos */
.logo-wrapper img {
    height: 68px;
    width: auto;
    object-fit: contain;
}
/* CFI logo */
.cfi-logo {
    width: 115px;
}
/* Info Serve logo */
.infoserve-logo {
    width: 120px;
}
/* Bottom white area */
.footer-bottom {
    width: 100%;
    height: 33px;
    background: #ffffff;
}
/* Responsive */
@media (max-width: 600px) {

    .logo-wrapper {
        width: 260px;
        height: 58px;
        gap: 5px;
    }

    .logo-wrapper img {
        height: 60px;
    }

}
.RankingArea {
background:url(../../img/website/ranking-bg.jpg);
position:relative;
margin-top:40px;
}
.RankingArea .vertical-head {
	position: absolute;
    bottom: 0;
	font-size:60px;
	color:#ffffff;
	text-transform:uppercase;
	font-weight:700;
}
.RankingArea h1 {
  transform: rotate(-90deg);
  transform-origin: left bottom;
  opacity: 0.8;
}
.RankingArea .Ranking_box {
background:#fff;
display: flex;
 flex-direction: column;
}
.RankingArea .Ranking_box .nav-tabs li.nav-item a {
	background: #050033;
    color: #ff7800;
    border: 0;
    border-radius: 10px 10px 0 0;
    /* min-width: 265px; */
    padding: 13px 22px;
    background: rgba(255,255,255,.95);
    color: #111;
    font-size: 17px;
    font-weight: 700;
    text-align: center;
    text-transform: uppercase;
}
.RankingArea .Ranking_box .tab-style1 .nav-tabs li.nav-item a.active,
.tab-style1 .nav-tabs li.nav-item a.active:hover {
	background: #050033;
    color: #ff7800;
}
.RankingArea .Ranking_box .nav-tabs li.innertab a {
	background: transparent;
    color: #fff;
    border: 0;
    border-radius: 10px;
    /* min-width: 265px; */
    padding: 8px 25px;
    font-size: 14px;
    font-weight: 700;
    text-align: center;
    text-transform: uppercase;
}
.RankingArea .Ranking_box .nav-tabs li.innertab a.active,
.nav-tabs li.innertab a.active:hover {
	background: #02002b;
    color: #ff7800;
}
.category-bar .nav-tabs {
    border-bottom: 0;
}
.RankingArea .Ranking_box .tab-content {margin-top:0;}
/* =========================================
           RANKING WRAPPER
        ========================================= */

        .ranking-wrapper {
            position: relative;

            width: 100%;

            background: rgba(255,255,255,0.88);

            padding: 27px 19px 17px;

            box-shadow:
                0 0 15px rgba(0,0,0,.05);
        }
/* =========================================
           HEADER
        ========================================= */

        .ranking-header {
            position: relative;

            min-height: 70px;

            display: flex;
            align-items: center;
            justify-content: center;
        }
.ranking-title {
            margin: 0;

            color: #ef7200;

            font-size: 47px;
            line-height: 1;
            font-weight: 800;

            text-transform: uppercase;
        }
.ranking-type-tabs .nav-link {
            border: 0;

            border-radius: 10px 10px 0 0;

            min-width: 265px;

            padding: 13px 22px;

            background: rgba(255,255,255,.95);

            color: #111;

            font-size: 19px;
            font-weight: 700;

            text-align: center;

            text-transform: uppercase;
        }
.ranking-type-tabs .nav-link.active {
            background: #050033;
            color: #ff7800;
        }
.ranking-type-tabs .road-tab {
            color: #e5241b;
        }
/* =========================================
           CATEGORY NAVIGATION
        ========================================= */

        .category-bar {
            display: flex;
            align-items: center;
            justify-content: space-around;

            background: #302d58;

            padding: 7px 70px;
        }
.category-item.active {
            background: #050033;
            color: #ff7800;
        }
/* =========================================
           RANKING CONTENT
        ========================================= */

        .ranking-content {
            display: grid;

            grid-template-columns:
                repeat(3, 1fr);

            background: #050033;

            min-height: 206px;

            padding: 27px 28px 24px;

            gap: 30px;
        }
/* =========================================
           RANK CARD
        ========================================= */

        .rank-card {
            position: relative;

            display: flex;
            align-items: center;

            min-width: 0;
        }
.rank-number {
            width: 90px;
                
				text-align:center;
            flex-shrink: 0;

            color: #302d58;

            font-size: 135px;
            line-height: .75;

            font-weight: 400;
        }
/* =========================================
           RIDER IMAGE
        ========================================= */

        .rider-image {
            width: 151px;
            height: 151px;

            flex-shrink: 0;

            border-radius: 50%;

            object-fit: cover;

            border: 0;
        }
/* =========================================
           RIDER INFORMATION
        ========================================= */

        .rider-info {
            padding-left: 24px;

            color: #fff;
        }
.rider-name {
            margin: 0 0 8px;

            color: #fff;

            font-size: 15px;
            line-height: 1.05;

            font-weight: 800;

            text-transform: uppercase;
        }
.rider-stat {
            margin: 2px 0;

            color: #ff7800;

            font-size: 13px;
            line-height: 1.25;

            font-weight: 700;

            text-transform: uppercase;
        }
/* =========================================
           DISCIPLINE BADGE
        ========================================= */

        .discipline {
            display: block;

            margin-top: 8px;

            padding: 4px 12px;

            color: #fff;

            font-size: 11px;

            font-weight: 800;

            line-height: 1;

            text-transform: uppercase;
			text-align:center;
			    border: none;
        }
.discipline.mtb {
            background: #242024;
        }
.discipline.road {
            background: #ff1d1d;
        }
.discipline.track {
            background: #1bb8d0;
        }
/* =========================================
           RESPONSIVE
        ========================================= */

        @media (max-width: 1600px) {

            .ranking-section {
                padding-left: 12%;
                padding-right: 7%;
            }

            .vertical-title {
                left: 7.5%;
            }

            .ranking-title {
                font-size: 43px;
            }

            .ranking-type-tabs .nav-link {
                min-width: 230px;
                font-size: 17px;
            }

            .rider-image {
                width: 130px;
                height: 130px;
            }

            .rank-number {
                width: 90px;
                font-size: 115px;
				text-align:center;
				
            }

            .rider-info {
                padding-left: 17px;
            }

        }
@media (max-width: 1200px) {
.ranking-wrapper {
                max-width: 100%;
            }
.ranking-title {
                font-size: 38px;
            }
.ranking-type-tabs .nav-link {
                min-width: 190px;
                font-size: 14px;
            }
.category-bar {
                padding: 0 15px;
            }
.ranking-content {
                gap: 10px;
                padding: 22px 12px;
            }
.rank-number {
                width: 55px;
                font-size: 90px;
            }
.rider-image {
                width: 105px;
                height: 105px;
            }
.rider-info {
                padding-left: 12px;
            }
.rider-name {
                font-size: 15px;
            }
.rider-stat {
                font-size: 11px;
            }
}
@media (max-width: 768px) {
.ranking-header {
                min-height: 60px;
            }
.ranking-title {
                font-size: 27px;
            }
.ranking-type-tabs .nav-link {
                min-width: auto;
                flex: 1;
                font-size: 11px;
                padding: 11px 7px;
            }
.category-bar {
                height: auto;
                flex-wrap: wrap;
                padding: 8px;
                gap: 3px;
            }
.ranking-content {
                grid-template-columns: 1fr;

                padding: 25px 15px;

                gap: 35px;
            }
.rank-card {
                justify-content: center;
            }
}
@media (max-width: 480px) {
.ranking-title {
                font-size: 23px;
            }
.ranking-type-tabs .nav-link {
                font-size: 9px;
            }
.rider-image {
                width: 90px;
                height: 90px;
            }
.rank-number {
                width: 45px;
                font-size: 75px;
            }
.rider-name {
                font-size: 13px;
            }
}
/* Owl navigation container */
.carousel_slider .owl-nav {
    display: flex;
    align-items: center;
    gap: 10px;
}
/* Both arrow buttons */
.carousel_slider .owl-nav button {
    width: 42px !important;
    height: 42px !important;
    padding: 0 !important;
    margin: 0 !important;

    background: #ff7a00 !important;
    border: none !important;
    border-radius: 50% !important;

    display: flex !important;
    align-items: center;
    justify-content: center;

    cursor: pointer;
    transition: all 0.3s ease;
}
/* Arrow */
.carousel_slider .owl-arrow {
    color: #fff;
    font-size: 25px;
    font-family: Arial, sans-serif;
    font-weight: 300;
    line-height: 1;
}
/* Hover */
.carousel_slider .owl-nav button:hover {
    background: #e96500 !important;
    transform: scale(1.05);
}
/* Remove Owl default text styling */
.carousel_slider .owl-nav button span {
    display: flex;
    align-items: center;
    justify-content: center;
}
.videoGallery {
  position: relative;
  width: 100%;
  padding-bottom: 75%;
  height: 0;
}

.videoGallery iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.MediaGallery .photoGallery {
position:relative;
overflow:hidden;
}
.MediaGallery .photoGallery .gallery_content {
		position: absolute;
		bottom:0;
		left: 0px;
	  width: 100%;
      background: #000;
      padding: 10px;
	  opacity:1;
	  text-align:center;
}
.MediaGallery .photoGallery .gallery_content h2 {
font-size:24px;
font-weight:700;
text-transform:none;
color:#fff;
}
.MediaGallery .photoGallery .gallery_content .g_desc {
font-size:12px;
font-weight:500;
color:#fff;
}
.MediaGallery .photoGallery .gallery_content .button {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M12 4l-1.41 1.41L16.17 11H4v2h12.17l-5.58 5.59L12 20l8-8z' fill='white'/%3E%3C/svg%3E");

  background-repeat: no-repeat;
  background-position: 125px 8px;
  background-color:#ff7a00;
  color:#fff;
  border-radius:50px;
  transition: background-position 0.5s ease, padding-left 0.5s ease;
  width: 150px;
  height: 35px;
  line-height:35px;
  font-size: 13px;
  font-weight:600;
  text-transform:uppercase;
  text-align:left;
  padding: 1px 7px 1px 7px;
  text-align:center;
  display:block;
  margin:4px auto;
}
.MediaGallery .photoGallery .gallery_content .button:hover {
  transition: background-position 0.5s ease, padding-left 0.5s ease;
  background-position: 115px 8px;
  padding-left: 0;
  color:#fff;
  display:block;
}
.footer_dark .social_white.social_icons li a {
border:1px #fff solid;
border-radius:50px;
}
.footer_dark .widget_links li {
border-bottom: 1px #0d1832 solid;
padding: 5px 0;
}
.footer_dark .widget_links li a {
	font-size: 14px;
	color: #fff;
}
.footer_dark .follow_us {
font-size:18px;
color:#ee7303;
line-height:30px;
}
.footer_dark .contact_title {
font-size:18px;
}
footer .head_title {
    text-transform: normal;
    margin-top: 10px;
    margin-bottom: 25px;
    font-size: 18px;
    color: #ff7a00 !important;
    font-weight: 500;
}
.mobile_show {
    display: none;
}
.mobile_s_show{
display:block;
}
.box {
  display: grid;
  align-items: center;
  justify-items: center;
  width: 60%;
  height: auto;
  transition: transform 0.5s ease-in;
  margin: 8px auto;
}
.box img {
  max-width: 100%;
  max-height: 100%;
  width: 100%;
}
.box:hover {
  transform: scale(1.2);
}
.sponsors .client-img {
width:100% !important;
}
.event_bg{
/*background: rgb(0,50,113);
background: linear-gradient(180deg, rgba(0,50,113,1) 0%, rgba(1,111,183,1) 100%);*/
background-color:#fff;
}

.Events{
}

.Events h2{
color:#000;
font-size:24px;
text-align:left;
border-left:5px #37a07f solid;
padding-left:15px;
}

.Events hr{
  border: 0;
    border-top: 1px solid #37a07f;
    border-bottom: 1px solid #37a07f;
}

.Events h2 .live-youtube{
float:right;
}

.Events .small-btn .btn-readmore-sm{
padding: 5px 15px;
font-size: .8rem;
text-transform:uppercase;
}

.Events .post_img .ttfi-logo-sm {
    width: 75px;
	height:43px;
	
}

.Events .accordion h3{
color:#000;
font-size:18px;
font-weight:bold;
text-align:left;
border:none;
margin-top:0px;
margin-bottom:5px;
}

.Events .accordion h3 span{
color:#2aaea8;
}

.Events .accordion p{
color:#000;
font-size:14px;
font-weight:600px;
line-height:21px;
text-align:left;
}

.Events .accordion hr {
  border: 0;
  border-top: 1px solid #b2b2b2;
  border-bottom: 1px solid #fff;
}

.Events .accordion .post_footer{
border-bottom:1px #ccc solid;
padding-top:20px;
padding-bottom:20px;
}

.Events .accordion .post_footer:first-child{
padding-top:0px;
}

.Events .accordion .post_footer:last-child{
border-bottom:none;
padding-bottom:0;
}

.event-info-box .card {
	background-color: transparent;
	margin-bottom: 15px;
	border-radius: 0;
	border: 0;
}
.event-info-box .card:last-child {
	margin-bottom: 0;
}
.event-info-box .card-body {
	padding: 15px;
	background:#fff;
	border-radius:0 0 10px 10px;
}

.event-info-box .card-body ul{
margin:0;
padding:0;
list-style:none;
}

.event-info-box .card-body ul li{
margin:0;
padding:5px 0;
list-style:none;
border-bottom:1px #ccc solid;
}

.event-info-box .card-body ul li a{
font-size:14px;
color:#000;
font-weight:bold;
}

.event-info-box .card-body ul li a:hover{
color:#37a07f;
}


.event-info-box .card-header a {
	padding-left: 0;
	padding-top: 0;
	font-weight: 600;
	color:#fff;
	text-transform:uppercase;
	font-size:16px;
	padding: 0 15px 0 0px;
}

.event-info-box .card-header h6 {
background: #000;
/*background: linear-gradient(360deg, rgba(0,19,42,1) 0%, rgba(0,19,42,1) 50%, rgba(0,44,76,1) 50%, rgba(0,44,76,1) 100%);*/
border-radius:10px 10px 0 0;
padding: 15px 20px;

font-weight: 600;
	color:#fff;
	text-transform:uppercase;
	font-size:16px;


}

.event-info-box .card-header h6 a span, .event-info-box .card-header h6 span{
	color:#37a07f;
}
.event-info-box .card-header a::after {
	content: "\f208";
	font-family: "Ionicons";
	font-size: 12px;
	font-weight: normal;
	position: absolute;
	right: 15px;
	top: 18px;
	/*border:1px #fff solid;*/
	padding:0 3px;
}
.event-info-box .card-header a[aria-expanded="false"]::after {
	content: "\f217";
}

.event-info-box  .card-body .accordion.accordion_style4 h6 {
background: #118f89;
font-size: 22px !important;
font-weight: bold;
text-transform: uppercase;
padding: 12px 0px 12px 40px;
border-radius: 0 10px 0 10px;
}

.event-info-box  .card-body .accordion.accordion_style4 h6 a{
color:#fff;
}

.event-info-box  .card-body .accordion.accordion_style4 h6 a:after {
border:none;
top:20px;
}

.breadcrumb-area{
border-bottom:#ccc 1px solid;
margin-bottom:20px;
font-size:15px;
font-weight:600;
}

.breadcrumb-item + .breadcrumb-item::before {
    content: "\f3d1";
    font-family: "Ionicons";
    vertical-align: middle;
}

h2.innerhead{
border-left:#ff7a00 5px solid;
padding-left:15px;
margin-bottom:20px;
}

.about-members{text-align:center; background: none; width:100%; background-image: 
     radial-gradient(25% 25% at 25% 25%,#fbfbfb 80%,#0000 81%),
     radial-gradient(25% 25% at 75% 75%,#fbfbfb 80%,#0000 81%);
   background-size: 100px 100px;  border-radius:0%; padding: 20px; }


.about-members .text-center{font-size: 22px; color:#000; font-weight:700; line-height:30px; margin-top:10px;}

.about-members img{
	border-radius:50%;
	width: 80%;

}

.mission{ /*list-style:lower-hexadecimal;*/ list-style: disc; margin-left:20px; }

.main_content .custom-container .content-area {
    background: #ffffff;
    padding: 20px;
    border-radius: 10px;
    -webkit-box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 51%);
    -moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.51);
    box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 51%);
    overflow: auto;
}

.ecdata{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,f3f3f3+50,ededed+51,ffffff+100;White+Gloss+%232 */
background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(top,  #ffffff 0%, #f3f3f3 50%, #ededed 51%, #ffffff 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #ffffff 0%,#f3f3f3 50%,#ededed 51%,#ffffff 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #ffffff 0%,#f3f3f3 50%,#ededed 51%,#ffffff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */

box-shadow: 3px 3px 3px 3px #ccc;

padding:20px 0;
border:1px #ccc solid;
border-radius: 0 30px 0 30px;
min-height:250px;
margin-bottom: 20px;
}

.ecdata img{
/*border:1px #ccc solid;*/
/*border-radius: 50%;*/
margin-bottom:10px;
}


.accordion-button.collapsed{
	background:#2e2c51;
	color:#fff;
	text-transform:uppercase;
}
.accordion-button:not(.collapsed),
.accordion-button:focus {
  outline: none;
  border-color: transparent;
  box-shadow: none;
  background:#2e2c51;
  color:#fff;
  text-transform:uppercase;
}
.accordion-button::after {
  width: 11px;
  height: 11px;
  border-radius: 100%;
  background-color: var(--bs-danger);
  background-image: none !important;
}
.accordion-button.collapsed::after {
  background-color: var(--bs-gray-300);
}



/* ===== Events page: the scrollable tabs and the banner carousel ===== */

.custom-tabs-wrapper {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    min-width: 0;
    padding: 5px;
    border: 1px solid #e2e5e9;
    border-radius: 10px;
    background: #fff;
}


/* Tabs scrolling area */
.custom-tabs-scroll {
    flex: 1 1 auto;
    min-width: 0;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-behavior: smooth;
    scrollbar-width: none;
}

/* Chrome / Edge / Safari */
.custom-tabs-scroll::-webkit-scrollbar {
    display: none;
}


/* Bootstrap tabs */
.custom-tabs {
    display: flex;
    flex-wrap: nowrap;
    gap: 9px;
    width: max-content;
    min-width: 100%;
    margin: 0;
    padding: 5px 0;
}


/* Individual tab */
.custom-tabs .nav-item {
    flex: 0 0 auto;
}


/* Tab button */
.custom-tabs .nav-link {
    display: flex;
    align-items: center;
    justify-content: center;

    height: 50px;
    padding: 0 23px;

    border: 0;
    border-radius: 11px;

    background: #f1f2f4;
    color: #111;

    font-size: 17px;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;

    transition: all 0.25s ease;
}


/* Hover */
.custom-tabs .nav-link:hover {
    background: #e7e8ea;
    color: #111;
}


/* Active */
.custom-tabs .nav-link.active {
    background: #ff7a00;
    color: #fff;
}


/* =========================================
   SCROLL ARROWS
========================================= */

.tab-scroll-btn {
    flex: 0 0 45px;

    width: 45px;
    height: 50px;

    padding: 0;
    border: 0;

    background: #fff;
    color: #333;

    display: flex;
    align-items: center;
    justify-content: center;

    font-size: 18px;

    cursor: pointer;
    z-index: 2;
}


.tab-scroll-btn:hover {
    color: #df271c;
}


/* Left arrow */
.tab-scroll-left {
    margin-right: 2px;
}


/* Right arrow */
.tab-scroll-right {
    margin-left: 2px;
}


/* =========================================
   TAB CONTENT
========================================= */

.custom-tabs-wrapper + .tab-content {
    padding: 10px 5px;
}


/* =========================================
   RESPONSIVE
========================================= */

@media (max-width: 991.98px) {

    .custom-tabs .nav-link {
        height: 46px;
        padding: 0 18px;
        font-size: 15px;
    }

    .tab-scroll-btn {
        flex-basis: 38px;
        width: 38px;
        height: 46px;
    }
}
.custom-tabs-wrapper .tab-scroll-left, .custom-tabs-wrapper .tab-scroll-right{
		display:none;
	}

@media (max-width: 575.98px) {

    .custom-tabs-wrapper {
        padding: 3px;
    }

    .custom-tabs {
        gap: 6px;
    }

    .custom-tabs .nav-link {
        height: 44px;
        padding: 0 15px;
        font-size: 14px;
        border-radius: 9px;
    }

    .tab-scroll-btn {
        flex-basis: 34px;
        width: 34px;
        height: 44px;
    }
}

.dateSelect{margin-top:-10px;}

/* =====================================
   Championship Owl Carousel Banner
===================================== */

.championship-banner {
    position: relative;
    width: 100%;
    overflow: hidden;
    background: #020d20;
}

.championship-slider {
    width: 100%;
}

.championship-slide {
    position: relative;
    min-height: 215px;
    padding: 20px 20px 20px;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    background: linear-gradient(
        110deg,
        #06152c 0%,
        #001027 55%,
        #020817 100%
    );
    color: #fff;
    text-align: center;
}

/* Main content */
.championship-content {
    width: 100%;
    padding: 0 20px;
}

.championship-title {
    margin: 0 0 5px;
    color: #f8f9fc;
    font-family: Arial, Helvetica, sans-serif;
    font-size: clamp(18px, 2.5vw, 29px);
    font-weight: 800;
    line-height: 1.2;
    text-transform: uppercase;
    white-space: nowrap;
}

/* Organizer */
.championship-organizer {
    margin: 0 0 15px;
    color: #e6ed00;
    font-size: 16px;
    line-height: 1.3;
}

/* Federation details */
.championship-auspices {
    margin: 0 0 10px;
    color: #e1e5ed;
    font-size: 15px;
    line-height: 1.35;
}

.championship-auspices strong {
    font-size: 18px;
    font-weight: 500;
}

/* Date */
.championship-date {
    margin: 0 0 8px;
    color: #e6ed00;
    font-size: clamp(23px, 3vw, 32px);
    font-weight: 400;
    line-height: 1.2;
}

/* Venue pill */
.championship-venue {
    display: inline-block;
    padding: 5px 12px;
    border-radius: 12px;
    background: #fff;
    color: #111827;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.4;
}

/* Bottom-right logos */
.championship-logos {
    position: absolute;
    right: 3.5%;
    bottom: 8px;
    display: flex;
    align-items: center;
    gap: 4px;
    z-index: 2;
}

.championship-logos img {
    display: block;
    width: 53px;
    height: 46px;
    object-fit: contain;
    background: #fff;
}

/* Remove Owl default focus outline */
.championship-slider .owl-item {
    outline: none;
}

/* Responsive */
@media (max-width: 991px) {
    .championship-slide {
        min-height: 215px;
        padding: 15px 12px 55px;
    }

    .championship-content {
        padding: 0;
    }

    .championship-title {
        white-space: normal;
    }

    .championship-logos {
        right: 12px;
        bottom: 7px;
    }

    .championship-logos img {
        width: 42px;
        height: 36px;
    }
}

@media (max-width: 576px) {
    .championship-slide {
        min-height: 235px;
        padding: 14px 12px 55px;
    }

    .championship-title {
        font-size: 17px;
        line-height: 1.3;
    }

    .championship-organizer {
        margin-bottom: 12px;
        font-size: 14px;
    }

    .championship-auspices {
        font-size: 13px;
    }

    .championship-auspices strong {
        font-size: 15px;
    }

    .championship-date {
        font-size: 22px;
    }

    .championship-venue {
        font-size: 12px;
    }

    .championship-logos {
        right: 10px;
        bottom: 7px;
    }
}

/* ===== Events list: the pills, the rows and their buttons ===== */
.event_list .post_footer{border-bottom:1px solid #ccc;padding-top:20px;padding-bottom:20px; display:flex; position:relative;}
.event_list .post_footer:first-child{padding-top:0}
.event_list .post_footer:last-child{border-bottom:;padding-bottom:20px;}
.event_list .post_footer .newslogo{width:128px;height:128px;border-radius:10px;background:#fff;display:flex;align-items:center;justify-content:center;border:1px solid #ccc; margin-right:20px;}
.event_list .post_footer p{ margin:0 0 5px 0;}
.event_list .post_footer .pr_flash1.roadflash {background-color: #df2418; color:#fff; display:inline; font-size:12px; padding:2px 10px;}
.event_list .post_footer .pr_flash1.mtbflash {background-color: #202221; color:#fff;}
.event_list .post_footer .pr_flash1.trackflash {background-color: #069ecf; color:#fff;}
.event_list .post_footer .pr_flash1.ecyclingflash {background:#03a459; color:#fff;}
.event_list .post_footer h6{     font-size: 20px; font-weight: 700; line-height: 20px;}
.event_list .post_footer .news-date{ font-size:90%;}
.event_list .post_footer .post_img img{width:62px}
.event_list .post_footer .button {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M12 4l-1.41 1.41L16.17 11H4v2h12.17l-5.58 5.59L12 20l8-8z' fill='white'/%3E%3C/svg%3E");

  background-repeat: no-repeat;
  background-position: 125px 7px;
  background-color:#ff7a00;
  color:#fff;
  border-radius:50px;
  transition: background-position 0.5s ease, padding-left 0.5s ease;
  width: 150px;
  height: 35px;
  line-height:35px;
  font-size: 13px;
  font-weight:600;
  text-transform:uppercase;
  text-align:left;
  padding: 1px 7px 1px 7px;
  text-align:center;
  display: block;
}
.event_list .post_footer .button:hover {
  transition: background-position 0.5s ease, padding-left 0.5s ease;
  background-position: 115px 7px;
  background-color:#000;
  padding-left: 0;
  color:#fff;
  display: block;
}

.event_list_one .nav-pills .nav-link{ width:200px;}
.event_list_one .nav-pills .nav-link.active, .event_list_one .nav-pills .nav-link:hover, .event_list_one .nav-pills .show>.nav-link {
    background: #050033;
    color: #ff7800;
}

.event_list_one .nav-pills .nav-link:hover{
    color: #ff7800;
}
.event_list_one .tab-content{ border-left:1px #f1f1f1 solid; margin:0; padding-left:50px; width: 100%;}

.tab-content {
    margin-top: 25px;
}
.event_list_two{
	margin-left:20px;
	border-bottom:none;
}

.event_list_two .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active{
	background: #050033;
    color: #ff7800;
	
	}
	
	.event_list_two .nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover {
    background: #050033;   color: #ff7800;}

.event_list .post_footer:after {
content: "";
position: absolute;
bottom: -1px;
left: 0;
height: 4px;
width: 40px;
background: var(--accent-color, #ff9900);
}

.event_list .post_footer.road:after {
background: #df2418;
}
.event_list .post_footer.track:after {
background: #069ecf;
}

/* ===== Media Gallery: the album cards, the photographs and their paging ===== */

.mediaGallery .card{ margin-bottom:20px; min-height: 586px;}
.mediaGallery .card-body .card-title{ font-size:22px; font-weight:700;}
.mediaGallery .card-body .card-text{ font-size:16px; line-height:24px;}
.mediaGallery .card-body .date{ font-size:16px; line-height:24px; color:#000; margin-bottom: 10px;}
.mediaGallery .card-body .venue{ font-size:16px; line-height:24px;}

.mediaGallery .card-body .button {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M12 4l-1.41 1.41L16.17 11H4v2h12.17l-5.58 5.59L12 20l8-8z' fill='white'/%3E%3C/svg%3E");

  background-repeat: no-repeat;
  background-position: 125px 12px;
  background-color:#ff7a00;
  color:#fff;
  border-radius:50px;
  transition: background-position 0.5s ease, padding-left 0.5s ease;
  width: 150px;
  height: 45px;
  line-height:45px;
  font-size: 13px;
  font-weight:600;
  text-transform:uppercase;
  text-align:left;
  padding: 1px 7px 1px 7px;
  text-align:center;
  display: block;
  margin: 4px 0;
}
.mediaGallery .card-body .button:hover {
  transition: background-position 0.5s ease, padding-left 0.5s ease;
  background-position: 115px 12px;
  background-color:#000;
  padding-left: 0;
  color:#fff;
  display: block;
}

.magnific-img img {
    width: 100%;
    height: auto;
}
.mfp-bottom-bar,*{
   font-family: 'Abel', sans-serif;
}
.magnific-img {
    display: inline-block;
    width: 32.3%;
	margin-bottom:4px;
}
a.image-popup-vertical-fit {
    cursor: -webkit-zoom-in;
}
.mfp-with-zoom .mfp-container,
.mfp-with-zoom.mfp-bg {
  opacity: 0;
  -webkit-backface-visibility: hidden;
  /* ideally, transition speed should match zoom duration */
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}

.mfp-with-zoom.mfp-ready .mfp-container {
    opacity: 1;
}
.mfp-with-zoom.mfp-ready.mfp-bg {
    opacity: 0.98;
}

.mfp-with-zoom.mfp-removing .mfp-container,
.mfp-with-zoom.mfp-removing.mfp-bg {
  opacity: 0;
}
.mfp-arrow-left:before {
    border-right: none !important;
}
.mfp-arrow-right:before {
    border-left: none !important;
}
button.mfp-arrow, .mfp-counter {
    opacity: 0 !important;
    transition: opacity 200ms ease-in, opacity 2000ms ease-out;
}
.mfp-container:hover button.mfp-arrow, .mfp-container:hover .mfp-counter{
	opacity: 1 !important;
}


/* Magnific Popup CSS */
.mfp-bg {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1042;
  overflow: hidden;
  position: fixed;
  background: #0b0b0b;
  opacity: 0.8; }

.mfp-wrap {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1043;
  position: fixed;
  outline: none !important;
  -webkit-backface-visibility: hidden; }

.mfp-container {
  text-align: center;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  padding: 0 8px;
  box-sizing: border-box; }

.mfp-container:before {
  content: '';
  display: inline-block;
  height: 100%;
  vertical-align: middle; }

.mfp-align-top .mfp-container:before {
  display: none; }

.mfp-content {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  margin: 0 auto;
  text-align: left;
  z-index: 1045; }

.mfp-inline-holder .mfp-content,
.mfp-ajax-holder .mfp-content {
  width: 100%;
  cursor: auto; }

.mfp-ajax-cur {
  cursor: progress; }

.mfp-zoom-out-cur, .mfp-zoom-out-cur .mfp-image-holder .mfp-close {
  cursor: -moz-zoom-out;
  cursor: -webkit-zoom-out;
  cursor: zoom-out; }

.mfp-zoom {
  cursor: pointer;
  cursor: -webkit-zoom-in;
  cursor: -moz-zoom-in;
  cursor: zoom-in; }

.mfp-auto-cursor .mfp-content {
  cursor: auto; }

.mfp-close,
.mfp-arrow,
.mfp-preloader,
.mfp-counter {
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none; }

.mfp-loading.mfp-figure {
  display: none; }

.mfp-hide {
  display: none !important; }

.mfp-preloader {
  color: #CCC;
  position: absolute;
  top: 50%;
  width: auto;
  text-align: center;
  margin-top: -0.8em;
  left: 8px;
  right: 8px;
  z-index: 1044; }
  .mfp-preloader a {
    color: #CCC; }
    .mfp-preloader a:hover {
      color: #FFF; }

.mfp-s-ready .mfp-preloader {
  display: none; }

.mfp-s-error .mfp-content {
  display: none; }

button.mfp-close,
button.mfp-arrow {
  overflow: visible;
  cursor: pointer;
  background: transparent;
  border: 0;
  -webkit-appearance: none;
  display: block;
  outline: none;
  padding: 0;
  z-index: 1046;
  box-shadow: none;
  touch-action: manipulation; }

button::-moz-focus-inner {
  padding: 0;
  border: 0; }

.mfp-close {
  width: 44px;
  height: 44px;
  line-height: 44px;
  position: absolute;
  right: 0;
  top: 0;
  text-decoration: none;
  text-align: center;
  opacity: 0.65;
  padding: 0 0 18px 10px;
  color: #FFF;
  font-style: normal;
  font-size: 28px;
  font-family: Arial, Baskerville, monospace; }
  .mfp-close:hover,
  .mfp-close:focus {
    opacity: 1; }
  .mfp-close:active {
    top: 1px; }

.mfp-close-btn-in .mfp-close {
  color: #333; }

.mfp-image-holder .mfp-close,
.mfp-iframe-holder .mfp-close {
  color: #FFF;
  right: -6px;
  text-align: right;
  padding-right: 6px;
  width: 100%; }

.mfp-counter {
  position: absolute;
  top: 0;
  right: 0;
  color: #CCC;
  font-size: 12px;
  line-height: 18px;
  white-space: nowrap; }

.mfp-arrow {
  position: absolute;
  opacity: 0.65;
  margin: 0;
  top: 50%;
  margin-top: -55px;
  padding: 0;
  width: 90px;
  height: 110px;
  -webkit-tap-highlight-color: transparent; }
  .mfp-arrow:active {
    margin-top: -54px; }
  .mfp-arrow:hover,
  .mfp-arrow:focus {
    opacity: 1; }
  .mfp-arrow:before,
  .mfp-arrow:after {
    content: '';
    display: block;
    width: 0;
    height: 0;
    position: absolute;
    left: 0;
    top: 0;
    margin-top: 35px;
    margin-left: 35px;
    border: medium inset transparent; }
  .mfp-arrow:after {
    border-top-width: 13px;
    border-bottom-width: 13px;
    top: 8px; }
  .mfp-arrow:before {
    border-top-width: 21px;
    border-bottom-width: 21px;
    opacity: 0.7; }

.mfp-arrow-left {
  left: 0; }
  .mfp-arrow-left:after {
    border-right: 17px solid #FFF;
    margin-left: 31px; }
  .mfp-arrow-left:before {
    margin-left: 25px;
    border-right: 27px solid #3F3F3F; }

.mfp-arrow-right {
  right: 0; }
  .mfp-arrow-right:after {
    border-left: 17px solid #FFF;
    margin-left: 39px; }
  .mfp-arrow-right:before {
    border-left: 27px solid #3F3F3F; }

.mfp-iframe-holder {
  padding-top: 40px;
  padding-bottom: 40px; }
  .mfp-iframe-holder .mfp-content {
    line-height: 0;
    width: 100%;
    max-width: 900px; }
  .mfp-iframe-holder .mfp-close {
    top: -40px; }

.mfp-iframe-scaler {
  width: 100%;
  height: 0;
  overflow: hidden;
  padding-top: 56.25%; }
  .mfp-iframe-scaler iframe {
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
    background: #000; }

/* Main image in popup */
img.mfp-img {
  width: auto;
  max-width: 100%;
  height: auto;
  display: block;
  line-height: 0;
  box-sizing: border-box;
  padding: 40px 0 40px;
  margin: 0 auto; }

/* The shadow behind the image */
.mfp-figure {
  line-height: 0; }
  .mfp-figure:after {
    content: '';
    position: absolute;
    left: 0;
    top: 40px;
    bottom: 40px;
    display: block;
    right: 0;
    width: auto;
    height: auto;
    z-index: -1;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
    background: #444; }
  .mfp-figure small {
    color: #BDBDBD;
    display: block;
    font-size: 12px;
    line-height: 14px; }
  .mfp-figure figure {
    margin: 0; }

.mfp-bottom-bar {
  margin-top: -36px;
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  cursor: auto; }

.mfp-title {
  text-align: left;
  line-height: 18px;
  color: #F3F3F3;
  word-wrap: break-word;
  padding-right: 36px; }

.mfp-image-holder .mfp-content {
  max-width: 100%; }

.mfp-gallery .mfp-image-holder .mfp-figure {
  cursor: pointer; }

@media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) {
  /**
       * Remove all paddings around the image on small screen
       */
  .mfp-img-mobile .mfp-image-holder {
    padding-left: 0;
    padding-right: 0; }
  .mfp-img-mobile img.mfp-img {
    padding: 0; }
  .mfp-img-mobile .mfp-figure:after {
    top: 0;
    bottom: 0; }
  .mfp-img-mobile .mfp-figure small {
    display: inline;
    margin-left: 5px; }
  .mfp-img-mobile .mfp-bottom-bar {
    background: rgba(0, 0, 0, 0.6);
    bottom: 0;
    margin: 0;
    top: auto;
    padding: 3px 5px;
    position: fixed;
    box-sizing: border-box; }
    .mfp-img-mobile .mfp-bottom-bar:empty {
      padding: 0; }
  .mfp-img-mobile .mfp-counter {
    right: 5px;
    top: 3px; }
  .mfp-img-mobile .mfp-close {
    top: 0;
    right: 0;
    width: 35px;
    height: 35px;
    line-height: 35px;
    background: rgba(0, 0, 0, 0.6);
    position: fixed;
    text-align: center;
    padding: 0; } }

@media all and (max-width: 900px) {
  .mfp-arrow {
    -webkit-transform: scale(0.75);
    transform: scale(0.75); }
  .mfp-arrow-left {
    -webkit-transform-origin: 0;
    transform-origin: 0; }
  .mfp-arrow-right {
    -webkit-transform-origin: 100%;
    transform-origin: 100%; }
  .mfp-container {
    padding-left: 6px;
    padding-right: 6px; } }
	
	
	
	#pagination {
  margin: 20px 0;
  padding: 0;
  text-align: center
  
}
#pagination li {
  display: inline
}
#pagination li a {
  display: inline-block;
  text-decoration: none;
  padding: 5px 10px;
  color: #000
}

/* Active and Hoverable Pagination */
#pagination li a {
  border-radius: 5px;
  -webkit-transition: background-color 0.3s;
  transition: background-color 0.3s
    
}
#pagination li a.active {
  background-color: #ff7a00;
  color: #fff
}
#pagination li a:hover:not(.active) {
  background-color: #ddd;
} 

.flashtag{color: #fff;
    display: inline;
    font-size: 12px;
    padding: 2px 10px;}


.Instafeed {
    position: relative;
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    padding: 0;
	margin-top: 40px;
}

/* Images */
.Instafeed .item {
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #000;
    height: 600px;
}

/*.Instafeed .item img {
    display: block;
    width: 100%;
    height: 300px;
    object-fit: cover;
}*/

.Instafeed .item img {
    display: block;
    width: 100%;
    object-fit: contain;
}

/* Navigation */
.Instafeed .owl-nav {
    margin: 0;
}

.Instafeed .owl-nav button.owl-prev,
.Instafeed .owl-nav button.owl-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);

    width: 50px;
    height: 50px;

    margin: 0;
    padding: 0 !important;

    background: rgba(0, 0, 0, 0.55) !important;
    color: #fff !important;

    border: 0;
    border-radius: 50%;

    display: flex;
    align-items: center;
    justify-content: center;

    font-size: 32px !important;
    line-height: 1;

    z-index: 10;
    transition: all 0.3s ease;
}

/* Left arrow */
.Instafeed .owl-nav button.owl-prev {
    left: 20px;
}

/* Right arrow */
.Instafeed .owl-nav button.owl-next {
    right: 20px;
}

/* Hover */
.Instafeed .owl-nav button.owl-prev:hover,
.Instafeed .owl-nav button.owl-next:hover {
    background: rgba(0, 0, 0, 0.85) !important;
    color: #fff !important;
}

/* Remove focus outline */
.Instafeed .owl-nav button:focus {
    outline: none;
}

@media screen and (width >= 1025px) and (width <= 1440px) {
  .Instafeed .item {
    height: 440px;
	}
}

/* Mobile */
@media (max-width: 767px) {
    .Instafeed .owl-nav button.owl-prev,
    .Instafeed .owl-nav button.owl-next {
        width: 40px;
        height: 40px;
        font-size: 24px !important;
    }

    .Instafeed .owl-nav button.owl-prev {
        left: 10px;
    }

    .Instafeed .owl-nav button.owl-next {
        right: 10px;
    }

    .Instafeed .item img {
        height: auto;
    }
    .Instafeed .item {
    height: 500px;
	}
}
.ecdata img{border-radius: 100%; width: 230px; height: 230px !important;}


/* New Added CSS */

.dateSelect{margin-top:-10px;}


/* Accordion wrapper */
        .custom-accordion {
            --accordion-blue: #171477;
            --accordion-arrow: #1689ed;
            --accordion-border: #c9c9c9;
            --accordion-text: #26384b;

            display: flex;
            flex-direction: column;
            gap: 12px;
        }

        /* Individual accordion item */
        .custom-accordion .accordion-item {
            border: 1px solid var(--accordion-border);
            border-left: 4px solid var(--accordion-blue);
            border-radius: 12px !important;
            overflow: hidden;
            background: #fff;
        }
		.custom-accordion .accordion-item .accordion-header .title{ font-weight:700; }

        /* Accordion heading button */
        .custom-accordion .accordion-button {
            position: relative;
            display: flex;
            align-items: center;
            gap: 14px;

            padding: 14px 18px 14px 14px;
            min-height: 45px;

            background-color: #fff;
            color: var(--accordion-text);
            font-size: 15px;
            font-weight: 400;
            line-height: 1.5;

            border: 0;
            border-radius: 0;
            box-shadow: none;
        }

        /* Remove Bootstrap's default accordion arrow */
        .custom-accordion .accordion-button::after {
            display: none;
        }

        /* Keep the header white when expanded */
        .custom-accordion .accordion-button:not(.collapsed) {
            color: var(--accordion-text);
            background-color: #fff;
            box-shadow: none;
        }

        /* Custom left arrow icon */
        .custom-accordion .accordion-icon {
            flex: 0 0 22px;
            width: 22px;
            height: 22px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
        }

        .custom-accordion .accordion-icon svg {
            display: block;
            width: 22px;
            height: 22px;
        }

        /* Right-side chevron */
        .custom-accordion .accordion-chevron {
            flex: 0 0 9px;
            width: 9px;
            height: 9px;
            margin-left: auto;
            margin-right: 2px;
            border-right: 2px solid #111;
            border-bottom: 2px solid #111;
            transform: rotate(45deg);
            transition: transform 0.25s ease;
        }

        .custom-accordion .accordion-button:not(.collapsed)
        .accordion-chevron {
            transform: rotate(225deg);
            margin-top: 8px;
        }
		
		.accordion-chevron {
            transform: rotate(225deg);
            margin-top: 8px;
        }

        /* Accordion content */
        .custom-accordion .accordion-body {
            padding: 0 24px 24px 59px;
            color: var(--accordion-text);
            font-size: 14px;
            font-weight: 400;
            line-height: 1.7;
        }

        /* Nested document list */
        .custom-accordion .document-list {
            list-style: none;
            padding: 0;
            margin: 0;
        }

        .custom-accordion .document-list li {
            margin-bottom: 10px;
			display:inline-block;
        }
		.custom-accordion .document-list li a{
			color:#fff;
			text-transform:uppercase;
			text-decoration:none;
			border-radius:20px;
        }
		.custom-accordion .document-list li a:hover{
			border-color:#ff7700;
        }

        .custom-accordion .document-list li:last-child {
            margin-bottom: 0;
        }

        /* Blue roman numerals */
        .custom-accordion .roman {
            color: #087be0;
            margin-right: 5px;
        }

        /* Document links */
        .custom-accordion .document-list a {
            color: var(--accordion-text);
            text-decoration: underline;
            text-underline-offset: 2px;
        }

        .custom-accordion .document-list a:hover {
            color: #087be0;
        }

        /* Mobile adjustments */
        @media (max-width: 576px) {
            .custom-accordion {
                gap: 8px;
            }

            .custom-accordion .accordion-button {
                gap: 10px;
                padding: 12px 12px 12px 10px;
                font-size: 14px;
            }

            .custom-accordion .accordion-body {
                padding: 0 15px 18px 42px;
                font-size: 13px;
            }
        }
		
		
		
		
		
		
/* Bicycle icon */
.bicycle-icon {
    flex: 0 0 26px;
    width: 26px;
    height: 26px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.bicycle-icon svg {
    display: block;
    width: 26px;
    height: 26px;
}

/* Listing row */
.tournament-item {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px 18px;
    min-height: 54px;
    border: 1px solid #c9c9c9;
    border-left: 4px solid #171477;
    border-radius: 12px;
    background: #f8f8f8;
    margin-bottom: 12px;
}

.tournament-item:hover, .accordion-item:hover, .custom-accordion .accordion-item:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 24px #da841a4d;
    border-color: #da841a4d;
    border-left-color: var(--red);
}

/* Text */
.tournament-item .item-title {
    flex: 1;
    min-width: 0;
    color: #26384b;
    font-size: 14px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Right-side badge */
.tournament-item .item-badge {
    flex-shrink: 0;
    padding: 6px 12px;
    border: 1px solid #c7c9df;
    border-radius: 4px;
    background: #e9eaf2;
    color: #171747;
    font-size: 12px;
    white-space: nowrap;
}

@media (max-width: 576px) {
    .tournament-item {
        gap: 10px;
        padding: 10px;
    }

    .bicycle-icon,
    .bicycle-icon svg {
        width: 22px;
        height: 22px;
    }

    .bicycle-icon {
        flex-basis: 22px;
    }

    .tournament-item .item-title {
        font-size: 12px;
    }

    .tournament-item .item-badge {
        padding: 5px 7px;
        font-size: 10px;
    }
}




/* =====================================
   Championship Owl Carousel Banner
===================================== */

.championship-banner {
    position: relative;
    width: 100%;
    overflow: hidden;
    background: #020d20;
}

.championship-slider {
    width: 100%;
}

.championship-slide {
    position: relative;
    min-height: 215px;
    padding: 20px 20px 20px;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    background: linear-gradient(
        110deg,
        #06152c 0%,
        #001027 55%,
        #020817 100%
    );
    color: #fff;
    text-align: center;
}

/* Main content */
.championship-content {
    width: 100%;
    padding: 0 20px;
}

.championship-title {
    margin: 0 0 5px;
    color: #f8f9fc;
    font-family: Arial, Helvetica, sans-serif;
    font-size: clamp(18px, 2.5vw, 29px);
    font-weight: 800;
    line-height: 1.2;
    text-transform: uppercase;
    white-space: nowrap;
}

/* Organizer */
.championship-organizer {
    margin: 0 0 15px;
    color: #e6ed00;
    font-size: 16px;
    line-height: 1.3;
}

/* Federation details */
.championship-auspices {
    margin: 0 0 10px;
    color: #e1e5ed;
    font-size: 15px;
    line-height: 1.35;
}

.championship-auspices strong {
    font-size: 18px;
    font-weight: 500;
}

/* Date */
.championship-date {
    margin: 0 0 8px;
    color: #e6ed00;
    font-size: clamp(23px, 3vw, 32px);
    font-weight: 400;
    line-height: 1.2;
}

/* Venue pill */
.championship-venue {
    display: inline-block;
    padding: 5px 12px;
    border-radius: 12px;
    background: #fff;
    color: #111827;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.4;
}

/* Bottom-right logos */
.championship-logos {
    position: absolute;
    right: 3.5%;
    bottom: 8px;
    display: flex;
    align-items: center;
    gap: 4px;
    z-index: 2;
}

.championship-logos img {
    display: block;
    width: 53px;
    height: 46px;
    object-fit: contain;
    background: #fff;
}

/* Remove Owl default focus outline */
.championship-slider .owl-item {
    outline: none;
}

/* Responsive */
@media (max-width: 991px) {
    .championship-slide {
        min-height: 215px;
        padding: 15px 12px 55px;
    }

    .championship-content {
        padding: 0;
    }

    .championship-title {
        white-space: normal;
    }

    .championship-logos {
        right: 12px;
        bottom: 7px;
    }

    .championship-logos img {
        width: 42px;
        height: 36px;
    }
}

@media (max-width: 576px) {
    .championship-slide {
        min-height: 235px;
        padding: 14px 12px 55px;
    }

    .championship-title {
        font-size: 17px;
        line-height: 1.3;
    }

    .championship-organizer {
        margin-bottom: 12px;
        font-size: 14px;
    }

    .championship-auspices {
        font-size: 13px;
    }

    .championship-auspices strong {
        font-size: 15px;
    }

    .championship-date {
        font-size: 22px;
    }

    .championship-venue {
        font-size: 12px;
    }

    .championship-logos {
        right: 10px;
        bottom: 7px;
    }
}

/* Left + right faded shadow */
.owl-carousel-wrap {
    position: relative;
}

.owl-carousel-wrap::before,
.owl-carousel-wrap::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    width: 100px;
    z-index: 3;
    pointer-events: none;
}

.owl-carousel-wrap::before {
    left: 0;
    background: linear-gradient(
        to right,
        #000 0%,
        rgba(255,255,255,0) 100%
    );
}

.owl-carousel-wrap::after {
    right: 0;
    background: linear-gradient(
        to left,
        #000 0%,
        rgba(255,255,255,0) 100%);
}

/* =========================================
   COMMON CYCLING BANNER
========================================= */

.common-banner {
    position: relative;
    width: 100%;
    max-width: 2000px;
    height: 200px;
    margin: 0 auto;

    display: flex;
    align-items: center;
    justify-content: center;

    background-image: url("../images/cycling-ranking.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

    overflow: hidden;
}

/* Dark overlay */
.common-banner-overlay {
    position: absolute;
    inset: 0;
    z-index: 1;

    background:
        linear-gradient(
            90deg,
            rgba(46, 44, 81, 0.70) 0%,
            rgba(46, 44, 81, 0.45) 45%,
            rgba(46, 44, 81, 0.60) 100%
        );
}

/* Content always above overlay */
.common-banner-content {
    position: relative;
    z-index: 2;

    width: 100%;
    text-align: center;
}

/* Heading */
.common-banner-content h1 {
    display: inline-block;

    margin: 0;
    padding: 12px 35px;

    font-size: 40px;
    line-height: 1.2;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;

    color: #fff;

    text-shadow:
        0 2px 4px rgba(0, 0, 0, 0.8),
        0 4px 12px rgba(0, 0, 0, 0.5);
}

.common-banner-overlay {
    position: absolute;
    inset: 0;
    z-index: 1;

    background:
        linear-gradient(
            90deg,
            rgba(255, 153, 51, 0.55) 0%,
            rgba(0, 0, 0, 0.55) 45%,
            rgba(19, 136, 8, 0.55) 100%
        );
}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 767px) {

    .common-banner {
        height: 180px;
    }

    .common-banner-content h1 {
        font-size: 28px;
        padding: 10px 20px;
    }
}



/* =========================================
   ORGANIZATION CARD
========================================= */

.org-card {
    width: 100%;
    margin-bottom: 12px;
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 0;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

/* =========================================
   TITLE
========================================= */

.org-title {
    height: 47px;
    display: flex;
    align-items: center;

    padding: 0 20px;

    background: #2e2c51;
    color: #fff;

    font-size: 15px;
    font-weight: 700;
    line-height: 1.3;

    text-align: left !important;
	text-transform:uppercase;
}

/* =========================================
   BODY
========================================= */

.org-body {
    min-height: 153px;

    display: grid;
    grid-template-columns: 31% 44% 25%;
    align-items: center;

    padding: 12px 20px;
}

/* =========================================
   LOGO
========================================= */

.org-logo {
    height: 100%;
    min-height: 125px;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 5px 20px;
}

.org-logo img {
    display: block;

    max-width: 170px;
    max-height: 125px;

    width: auto;
    height: auto;

    object-fit: contain;
	
	margin: 0 auto;
}

.org-logo .contactlogo {
    display: block;

    margin-bottom: 10px;

    color: #555;
    font-size: 14px;
    font-weight: 600;
}

/* =========================================
   PERSON INFORMATION
========================================= */

.org-person {
    padding: 0 20px;
}

.org-person h5 {
    margin: 0;

    color: #111;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.35;
}

.org-person .designation {
    display: block;

    margin-bottom: 10px;

    color: #555;
    font-size: 14px;
    font-weight: 600;
}

/* =========================================
   INFORMATION ROW
========================================= */

.org-info {
    margin-top: 2px;
}

.info-row {
    display: flex;
    align-items: flex-start;

    margin-bottom: 7px;

    color: #555;
    font-size: 14px;
    line-height: 1.4;
}

.info-row:last-child {
    margin-bottom: 0;
}

.info-row i {
    flex: 0 0 20px;

    margin-right: 5px;

    color: #111;
    font-size: 17px;

    line-height: 20px;
}

.info-row span {
    display: block;
    flex: 1;
}


/* =========================================
   RESPONSIVE
========================================= */

@media (max-width: 991px) {

    .org-body {
        grid-template-columns: 25% 37.5% 37.5%;
    }

    .org-logo {
        padding: 5px 10px;
    }

    .org-logo img {
        max-width: 140px;
        max-height: 110px;
    }

    .org-person {
        padding: 0 12px;
    }

    .info-row {
        font-size: 13px;
    }
}


/* =========================================
   TABLET / MOBILE
========================================= */

@media (max-width: 767px) {

    .org-title {
        min-height: 47px;
        height: auto;

        padding: 12px 15px;

        font-size: 14px;
    }

    .org-body {
        display: grid;
        grid-template-columns: 1fr;
        gap: 20px;

        padding: 20px 15px;
    }

    .org-logo {
        min-height: 100px;
        padding: 0;
    }

    .org-logo img {
        max-width: 150px;
        max-height: 110px;
    }

    .org-person {
        padding: 0;
    }

    .org-person h5 {
        font-size: 15px;
    }

    .info-row {
        font-size: 14px;
    }
}


/* =========================================
   SMALL MOBILE
========================================= */

@media (max-width: 480px) {

    .org-card {
        margin-bottom: 10px;
    }

    .org-title {
        font-size: 13px;
    }

    .org-body {
        gap: 18px;
    }

    .info-row {
        font-size: 13px;
    }
}
/* =========================================
   CONTENT THE PANEL FILLS IN
   What the design's own rules cannot carry, because what they lay out comes
   from the panel: pictures uploaded in any shape, colours chosen per row, and
   lists that can still be empty.
========================================= */

/* The colour under a discipline tile is the panel's, so the tile gives the
   line its width and the script paints it. */
.thumb-box ul li.thumb-tile {
    border-bottom: 8px solid transparent;
}

/* Event cards carry what the panel was given, so one has a technical book and
   the next has none. Every card of a row is therefore as tall as the tallest
   of them. */
.EventsArea .owl-stage {
    display: flex;
    align-items: stretch;
}

.EventsArea .owl-item {
    display: flex;
    /* The carousel sizes its own slides; flex must not resize them. */
    flex: 0 0 auto;
}

.EventsArea .owl-item > .item,
.EventsArea .Event_box {
    display: flex;
    width: 100%;
}

.EventsArea .event_table_bg {
    display: flex;
    flex-direction: column;
    width: 100%;
}

/* A column of the Events section with nothing in it yet. The design has no
   such state, so it stays as quiet as a card is tall. */
.EventsArea .events-empty {
    display: flex;
    min-height: 415px;
    margin: 0;
    padding: 2.5rem 1rem;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: #ffffff;
    background-color: rgba(0, 0, 0, 0.35);
}

/* The album pictures come from the panel, so they are all shapes, while the
   design drew a slider of one height and a row of cards of one height. Each
   picture fills the frame it was drawn in rather than being stretched. */
.MediaGallery .photoGallery img {
    width: 100%;
    aspect-ratio: 686 / 400;
    /* The album's picture is the panel's, in whatever shape it was taken, and
       the slider's frame is the one the design drew. The whole picture is
       fitted inside that frame rather than cropped to fill it. */
    object-fit: contain;
    background-color: #f1f1f5;
}

.mediaGallery .card-img-top {
    aspect-ratio: 4 / 5;
    object-fit: cover;
}

/* The badge beside a result is the discipline it belongs to, and a discipline
   reads in its own colour everywhere on the site. The colour is the panel's,
   so the script paints the background and the words; the outline the design
   drew around a grey badge is dropped here, because a painted badge needs
   none. Keyed on the attribute rather than a class of its own, so a badge the
   script never reached keeps the design's grey and its dark words. */
.tournament-item .item-badge[data-accent-bg] {
    border-color: transparent;
}

/* The page a wrong address lands on. The design drew none, so it is built from
   the parts of its own inner pages, with the code read large over the line
   that explains it. */
.error-page {
    padding: 10px 0 30px;
}

.error-page-code {
    margin: 0 0 8px;
    color: #ff7a00;
    font-size: 64px;
    font-weight: 700;
    line-height: 1;
}

.error-page-text {
    max-width: 640px;
    margin-bottom: 24px;
    color: #66717d;
    font-size: 15px;
    line-height: 1.8;
}

/* The design's pill is sized in width and height, which a link only takes once
   it is given a box of its own; and it is widened here, because the words on
   this one are longer than the "Read More" it was drawn for. */
.error-page .button {
    display: inline-block;
    width: 200px;
    background-position: 165px 8px;
}

.error-page .button:hover {
    background-position: 153px 8px;
}
/* The Video Gallery page lists players where the album cards carry pictures,
   so each card's player keeps the shape a video is filmed in and fills it.
   The box is the positioned one and the player is pinned inside it: the
   stylesheet already has rules that lay an iframe out absolutely, and this way
   none of them can decide where ours lands.

   Not called `videoGallery`: the stylesheet already uses that name for a box
   of its own, drawn four by three. */
.video-cards .video-frame {
    position: relative;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background-color: #000;
}

.video-cards .video-frame iframe {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
}

/* Each tab opens a page of its own, so they are links where the design drew
   buttons; a link reads from the left unless it is told otherwise. */
.custom-tabs .nav-link {
    text-align: center;
}

/* The day over a story, beside the discipline it belongs to. */
.news-date {
    margin-bottom: 1.25rem;
}

.news-date .flashtag {
    margin-right: 0.6rem;
    text-transform: uppercase;
}

/* The line the Executive Committee page opens its block with. The design gave
   it a spacing class of its own; it is written in the panel's editor now,
   which keeps no classes, so the spacing is given here. */
.page-content .bg-light > h3 {
    margin-bottom: 1rem;
}
/* The discipline over a story. The design names a class per discipline, which
   carries the weight along with the colour; the colour is the panel's now, so
   the weight is given here. */
.newsbox .pr_flash1 {
    font-size: 14px;
    font-weight: 500;
}
/* The photograph an office bearer may be given. The design's card has no room
   drawn for one, so it stands to the left of what is said about the person,
   with a line between the two. The line is drawn on the words rather than the
   picture, so a person without one reads as the design has them. */
.org-person {
    display: flex;
    /* The photograph stands level with the middle of what is said beside it. */
    align-items: center;
    gap: 14px;
}

/* As tall as the words beside it — name, designation, number and address come
   to 96 points — and square, so it is never drawn as an oval. It is a set
   size rather than one that follows the words: a picture whose width grew
   with its height would squeeze those words and grow again. */
.org-person .org-photo {
    flex: 0 0 96px;
    width: 96px;
    height: 96px;
    border-radius: 50%;
    object-fit: cover;
}

.org-person .org-photo + .org-person-body {
    padding-left: 14px;
    border-left: 1px solid #c7c7d1;
}

.org-person-body {
    flex: 1;
    min-width: 0;
}
/* The papers of a fold on the Government Compliance page open as the design's
   own buttons, which the client's newer stylesheet draws in navy. Our copy of
   that stylesheet still has `.btn-fill-out` orange everywhere, and the rest of
   the site is meant to stay that way, so the navy is given to this page's
   buttons alone. The hover colour is the design's own and is left as it is. */
.custom-accordion .document-list .btn-fill-out {
    border-color: #2e2c51;
}

.custom-accordion .document-list .btn-fill-out::before,
.custom-accordion .document-list .btn-fill-out::after {
    background-color: #2e2c51;
}
/* A heading given a paper of its own opens that paper instead of folding, so
   it is a link. It is meant to read exactly as the headings beside it, which
   are buttons and carry no underline. */
.custom-accordion .accordion-button[href] {
    text-decoration: none;
}
/* =========================================
   TWO COLUMN BUTTONS
   The design's own rules, copied verbatim from the end of its styles.css: our
   copy of that stylesheet predates them. When the client's next re-merge
   brings them along, this block goes.
========================================= */

.gamesarea {
    padding: 10px 0;
    background: #fff;
}

.gamesarea .button-column {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

/* Horizontal Button */
.gamesarea .horizontal-btn {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 64px;
    padding: 0 20px;
    background: #222042;
    border: 1px solid #222042;
    border-radius: 20px;
    color: #fff;
    text-decoration: none;
    overflow: hidden;
    transition: all 0.35s ease;
}

/* Left Icon */
.gamesarea .btn-icon {
    width: 38px;
    height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 15px;
    border-radius: 50%;
    background: #f1f1f1;
    color: #222;
    transition: all 0.35s ease;
}

/* Text */
.gamesarea .btn-text {
    flex: 1;
    font-size: 16px;
    font-weight: 600;
    transition: all 0.35s ease;
}

/* Right Arrow */
.gamesarea .btn-arrow {
    font-size: 22px;
    line-height: 1;
    transform: translateX(0);
    transition: all 0.35s ease;
}

/* =========================================
   HOVER EFFECT
========================================= */

.gamesarea .horizontal-btn:hover {
    color: #fff;
    background: #f68f3d;
    border-color: #f68f3d;
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);
}

.gamesarea .horizontal-btn:hover .btn-icon {
    background: #fff;
    color: #d71920;
    transform: rotate(45deg);
}

.gamesarea .horizontal-btn:hover .btn-arrow {
    transform: translateX(7px);
}

/* =========================================
   RESPONSIVE
========================================= */

@media (max-width: 767.98px) {

    .gamesarea .button-section {
        padding: 35px 0;
    }

    .gamesarea .horizontal-btn {
        min-height: 58px;
        padding: 0 15px;
    }

    .gamesarea .btn-icon {
        width: 34px;
        height: 34px;
        margin-right: 12px;
    }

    .gamesarea .btn-text {
        font-size: 14px;
    }

    .gamesarea .btn-arrow {
        font-size: 20px;
    }
}

/* =========================================
   NEWS CARD
   The design's own rules for the cards of the news page, copied verbatim from
   its styles.css: our copy of that stylesheet predates them. When the client's
   next re-merge brings them along, this block goes.
========================================= */
/* News Card */
.news-card {
    height: 100%;
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid #e8edf1;
    transition: transform .3s ease, box-shadow .3s ease;
}

.news-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 12px 30px rgba(0, 0, 0, .10);
}

/* Image */
.news-image {
    height: 350px;
    position: relative;
    overflow: hidden;
}

.news-image::after {
    content: "";
    position: absolute;
    inset: 45% 0 0;
    background: linear-gradient(
        to bottom,
        transparent,
        rgba(0, 0, 0, .45)
    );
    pointer-events: none;
}

.news-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
	object-position: center top;
    display: block;
    transition: transform .5s ease;
}

.news-card:hover .news-image img {
    transform: scale(1.07);
}

/* Category Badge */
.news-category {
    position: absolute;
    z-index: 1;
    left: 15px;
    bottom: 15px;
    background: #198754;
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    padding: 6px 12px;
    border-radius: 3px;
    text-transform: uppercase;
}

/* Content */
.news-content {
    padding: 22px;
}

.news-date {
    color: #ff7900;
    font-size: 12px;
    margin-bottom: 12px;
}

.news-content h4 {
    color: #000;
    font-size: 23px;
    font-weight: 700;
    line-height: 1.4;
    margin-bottom: 12px;
    transition: color .3s ease;
}

.news-card:hover .news-content h4 {
    color: #ff7900;
}

.news-content p {
    color: #66717d;
    font-size: 14px;
    line-height: 1.8;
    margin-bottom: 18px;
}


/* Responsive */
@media (max-width: 767.98px) {
    .section-title {
        font-size: 26px;
    }

    .news-image {
        height: 350px;
    }

    .news-content {
        padding: 18px;
    }

    .view-all {
        font-size: 12px;
    }
}

@media (max-width: 420px) {
    .section-heading {
        align-items: flex-start !important;
        gap: 12px;
    }

    .section-title {
        font-size: 23px;
    }
}

.news-card .button {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M12 4l-1.41 1.41L16.17 11H4v2h12.17l-5.58 5.59L12 20l8-8z' fill='white'/%3E%3C/svg%3E");

  background-repeat: no-repeat;
  background-position: 125px 12px;
  background-color:#ff7a00;
  color:#fff;
  border-radius:50px;
  transition: background-position 0.5s ease, padding-left 0.5s ease;
  width: 150px;
  height: 45px;
  line-height:45px;
  font-size: 13px;
  font-weight:600;
  text-transform:uppercase;
  text-align:left;
  padding: 1px 7px 1px 7px;
  text-align:center;
  display: block;
}
.news-card .button:hover {
  transition: background-position 0.5s ease, padding-left 0.5s ease;
  background-position: 115px 12px;
  background-color:#000;
  padding-left: 0;
  color:#fff;
  display: block;
}

/* ==========================================================================
   COMMISSIONS
   Copied verbatim from the design's own styles.css, where this block is newer
   than our copy of the file. It can go the next time the client's stylesheet
   is merged in again.
   ========================================================================== */



/* TABLE CARD */

.commissions .table-card {
    background: #fff;
    border: 1px solid #e7e9ec;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.06);
	margin:0 auto 10px auto;
}

.commissions .accordion-button:not(.collapsed),
.commissions .accordion-button:focus {
  outline: none;
  border-color: transparent;
  box-shadow: none;
  background:#2e2c51;
  color:#fff;
  text-transform:uppercase;
  padding-left:20px;
  padding-right:20px;
}


/* TABLE */

.commissions .cycling-data-table {
	width:100%;
}

.commissions .cycling-data-table thead th {
    background: #151515;
    color: #fff;
    border: 0;
    padding: 16px 15px;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .5px;
    white-space: nowrap;
}

.commissions .cycling-data-table tbody td {
    padding: 8px;
    border-bottom: 1px solid #edf0f2;
    color: #555;
    font-size: 14px;
    vertical-align: middle;
	height:60px;
	text-transform:uppercase;
}

.commissions .cycling-data-table tbody tr {
    transition: all .25s ease;
}

.commissions .cycling-data-table tbody tr:hover {
    background: #f8fafb;
}

.commissions .cycling-data-table tbody tr:last-child td {
    border-bottom: 0;
}


/* NUMBER */

.commissions .cycling-data-table tbody td:first-child {
    color: #999;
    font-size: 13px;
    font-weight: 700;
	width:100px;
	text-align:center;
	border-left:10px #2e2c51 solid;
}

.commissions .cycling-data-table tbody td:last-child {
	width:250px;
	font-weight:700;
}


/* MEMBER PHOTO */

.commissions .member-photo {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    overflow: hidden;
    border: 3px solid #f1f2f3;
}

.commissions .member-photo img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}


/* MEMBER NAME */

.commissions .member-info strong {
    display: block;
    color: #222;
    font-size: 15px;
    font-weight: 700;
}

.commissions .member-info span {
    display: block;
    color: #999;
    font-size: 12px;
}


/* EMAIL */

.commissions .cycling-data-table a {
    color: #e21b23;
    text-decoration: none;
    font-size: 13px;
}

.commissions .cycling-data-table a:hover {
    text-decoration: underline;
}


/* STATUS */

.commissions .status {
    display: inline-block;
    padding: 5px 12px;
    border-radius: 30px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
}

.commissions .status.active {
    color: #187b43;
    background: #e7f7ee;
}

.commissions .status.inactive {
    color: #a33a3a;
    background: #fdeaea;
}


/* RESPONSIVE */

@media (max-width: 767px) {

    .commissions .section-heading h2 {
        font-size: 25px;
    }

    .commissions .table-card {
        border-radius: 8px;
    }

    .commissions .cycling-data-table thead th,
    .commissions .cycling-data-table tbody td {
        padding: 12px;
    }

}


/* THE CARD OF THE PERSON WHO HEADS THEM */

.pbox .card{
    display: flex;
    flex-direction: column;
    align-items: center;
    border-radius: 0 0 15px 15px;
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
    width: 330px;
	margin: 50px auto;
    padding-bottom: 15px;
    background-color: white;
}

.pbox .card img{
    width: 110px;
    height: 110px;
    border-radius: 0%;
    background-image: linear-gradient(60deg, #2AAA8A, #4169E1);
    padding: 5px;
    margin-top: -55px;
}

.pbox .card h2{
    margin: 10px 0 0 0;
	font-size: 24px;
}

.pbox .card p{
	margin-bottom: 10px;
}

/* ==========================================================================
   TEAM LIST — the Sportsperson of Outstanding Merit cards
   Copied verbatim from the design's own styles.css, where this block is newer
   than our copy of the file. It can go the next time the client's stylesheet
   is merged in again.
   ========================================================================== */


.team-list ul {
  padding: 0;
}

.team-list ul li {
  /* Remove li Bullets with zero-width space for accessability */
  list-style-type: none;
}

.team-list ul li:before {
  content: "​";
  /* add zero-width space */
  clip: rect(0 0 0 0);
  height: 1px;
  width: 1px;
  position: absolute;
}


.team-list .avatar {
  width: 100%;
  max-width: 30%;
  border: 6px solid #d1d1d1;
  border-radius: 100%;
}

.team-list .team-item:hover .avatar {
  border: 6px solid #fff;
}

.team-list .title,
.team-list .name {
  color: #2e2c51;
  font-weight: 700;
  text-transform: uppercase;
  font-family: Arial, Helvetica, sans-serif;
  margin-bottom: 15px;
}

.team-list .team-item {
  padding: 50px 25px;
  color: #000;
  background-color: #fff;
  border-radius: 25px;
  border: 1px solid #ddd;
  box-shadow: 0 1px 3px rgb(0 0 0 / 8%);
  /*box-shadow: 2px 2px 10px rgba(61, 61, 61, 0.596);*/
  transition: all 300ms ease, transform 300ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
  position: relative;
  z-index: 1;
}

.team-list .team-item:hover .title,
.team-list .team-item:hover .name {
  color: #fff !important;
  transition-duration: 500ms;
}

.team-list .team-item:hover h5.sep{
  color: #fff !important;
  transition-duration: 500ms;
}

.team-list .team-item:hover {
  background-color: #2e2c51;
  color: #fff !important;
  transition-duration: 500ms;
}


.team-list .team-item::after:hover {
  background-color: #fff;
  color: #ff4848;
  transition-duration: 500ms;

}

.team-list .social {
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  right: 0;
  width: 50px;
  height: 50px;
  border-radius: 25px 0;
  cursor: pointer;
  transition: inherit;
  box-shadow: inset 4px 4px 7px rgba(61, 61, 61, 0.596);
  background-color: #ff7900;
  background-size: 20px 20px;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9JzMwMHB4JyB3aWR0aD0nMzAwcHgnICBmaWxsPSIjZmZmZmZmIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGRhdGEtbmFtZT0iTGF5ZXIgMSIgdmlld0JveD0iMCAwIDEwMCAxMDAiIHg9IjBweCIgeT0iMHB4Ij48dGl0bGU+NTI8L3RpdGxlPjxwYXRoIGQ9Ik04MS4zMDMyOSwzOC41MjkzOUExNC4wMTgsMTQuMDE4LDAsMSwwLDYxLjQ3NywxOC43MDY3MUw0Ny4wMDMxNSwzMy4xNzkxNGExNC4wMzAzNywxNC4wMzAzNywwLDAsMCwwLDE5LjgyMTcxLDQuODAxMTMsNC44MDExMywwLDAsMS02Ljc4OTc5LDYuNzg5ODcsMjMuNjQzMjcsMjMuNjQzMjcsMCwwLDEsMC0zMy40MDE0NUw1NC42ODcyMSwxMS45MTY4NEEyMy42MjAzLDIzLjYyMDMsMCwwLDEsODguMDkzMDgsNDUuMzE5MjdMODAuOTIzOCw1Mi40ODcxMWE0LjgwMTE0LDQuODAxMTQsMCwwLDEtNi43ODk4LTYuNzg5ODdaTTExLjkwNzQxLDg4LjA5MzlhMjMuNjUwNTMsMjMuNjUwNTMsMCwwLDAsMzMuNDA1ODYtLjAwMUw1OS43ODY2NCw3My42MjE0N2EyMy42MTU4MywyMy42MTU4MywwLDAsMCwwLTMzLjQwMTQ1LDQuODAxMTQsNC44MDExNCwwLDAsMC02Ljc4OTc5LDYuNzg5ODgsMTQuMDE1MzEsMTQuMDE1MzEsMCwwLDEsMCwxOS44MjI2OEwzOC41MjM0OCw4MS4zMDRBMTQuMDE4LDE0LjAxOCwwLDEsMSwxOC42OTcyLDYxLjQ4MTM1TDI1Ljg2Niw1NC4zMTM1YTQuODAxMTQsNC44MDExNCwwLDAsMC02Ljc4OTgtNi43ODk4N2wtNy4xNjg3OSw3LjE2Nzg1QTIzLjY0NDg5LDIzLjY0NDg5LDAsMCwwLDExLjkwNzQxLDg4LjA5MzlaIj48L3BhdGg+PC9zdmc+");
}

.team-list .team-item:hover .social {
  cursor: default;
  color: #000;
  background-color: #fff;
  width: 100%;
  transition-duration: 500ms;
  border-radius: 0 0 25px 25px;
}

.team-list .social i {
  opacity: 0;
  padding: 0px 10px;
  transform: scale(0.7);
}

.team-list .social i:hover {
  cursor: pointer;
  transform: scale(1);
}

.team-list .team-item:hover .social i {
  opacity: 1;
  transition: opacity 0.2s ease 200ms;
}

.team-list .team-item:hover .social i:hover {
  transition: 500ms;
}

.team-list .description {
  text-align: justify;
}

/*
 * Ours: the design colours each icon with a style attribute on the icon
 * itself, which this site does not do. The colour is said here instead.
 */
.team-list .social i {
    color: #ff4848;
}


/* ==========================================================================
   CONTACT US
   Ours: the theme's own card and rows carry the page, with only the body of
   the card described here. The offices and the numbers come from Site
   settings, so the page says as much or as little as the panel holds.
   ========================================================================== */

.contact-card {
    height: calc(100% - 12px);
}

.contact-body {
    padding: 18px 20px;
}

.contact-address {
    margin: 0;
    color: #555;
    font-size: 14px;
    line-height: 1.7;
}

.contact-rows {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 10px 24px;
}

.contact-label {
    display: block;
    color: #111;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.4px;
    text-transform: uppercase;
}

.contact-body a {
    color: #e21b23;
    text-decoration: none;
}

.contact-body a:hover,
.contact-body a:focus-visible {
    text-decoration: underline;
}


/* ==========================================================================
   SEARCH
   Ours: what the magnifier in the header opens on. The card is the theme's
   own; only the search box and the hits inside it are described here.
   ========================================================================== */

.search-form {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 18px;
}

.search-form .button{
	border:0px;
}

.search-form .form-control {
    flex: 1 1 260px;
    height: 45px;
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 0 14px;
    font-size: 15px;
}

.search-form .form-control:focus {
    border-color: #2e2c51;
    outline: none;
}

.search-note {
    margin-bottom: 20px;
    color: #555;
    font-size: 15px;
}

.search-card {
    margin-bottom: 20px;
}

.search-body {
    padding: 6px 20px;
}

.search-hit {
    padding: 14px 0;
    border-bottom: 1px solid #edf0f2;
}

.search-hit:last-child {
    border-bottom: 0;
}

.search-hit-title {
    margin: 0;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.35;
}

.search-hit-title a {
    color: #2e2c51;
    text-decoration: none;
}

.search-hit-title a:hover,
.search-hit-title a:focus-visible {
    color: #e21b23;
    text-decoration: underline;
}

.search-hit-note {
    margin: 4px 0 0;
    color: #777;
    font-size: 13px;
    line-height: 1.6;
}


/* ==========================================================================
   LOGO STRIP
   Ours: the row of logos at the foot of the home page, standing midway
   between the block above it and the footer. The section above already lays
   20px under its own content, so 20px here makes the 40px above match the
   40px below, and the band is the same height it was with the heading.
   ========================================================================== */

.logo-strip {
    padding-top: 20px;
    padding-bottom: 40px;
}

/*
 * A sponsor given a website wears its logo in a link. The link stands in the
 * slide where the bare picture stood, so a logo that leads somewhere is the
 * size of one that leads nowhere.
 */
.logo-strip .box > a {
    display: block;
    width: 100%;
}

/* The picture fills the link rather than sitting on a line inside it, which
   would leave a few pixels under it and stand a linked logo taller. */
.logo-strip .box > a > img {
    display: block;
}


/* ==========================================================================
   EVENT ROW: WHO HOLDS THE EVENT
   Ours: the body that holds an event reads beside the flash of its discipline,
   on the line the design gives that flash alone.
   ========================================================================== */

.event-organiser {
    margin-left: 12px;
}

/* Side by side is cramped on a phone, so it drops under the flash. */
@media (max-width: 767.98px) {
    .event-organiser {
        display: block;
        margin-top: 5px;
        margin-left: 0;
    }
}


/* ==========================================================================
   EVENT BUTTON THAT OPENS THE GUIDE ITSELF
   Ours: "Technical guide" needs more room than the design's "Read More", so
   the button is widened and its arrow moved along with it. Everything else —
   the colour, the height, the way the arrow steps on hover — is the design's.
   ========================================================================== */

.event_list .post_footer .button-guide,
.EventsArea .Event_box .button-guide {
    width: 190px;
}

.event_list .post_footer .button-guide {
    background-position: 165px 7px;
}

.event_list .post_footer .button-guide:hover {
    background-position: 155px 7px;
}

.EventsArea .Event_box .button-guide {
    background-position: 165px 12px;
}

.EventsArea .Event_box .button-guide:hover {
    background-position: 155px 12px;
}


/* ==========================================================================
   EVENT'S OWN LOGO
   Ours: an event given a logo of its own carries it where the design carries
   the federation's. The design sizes that one by hand — 62 pixels across, 43
   down — which only suits a logo of that shape, so one uploaded in any shape
   is fitted into the square the design drew instead.
   ========================================================================== */

.event_list .post_footer .post_img img.event-logo {
    width: auto;
    height: auto;
    max-width: 100px;
    max-height: 100px;
}

/* ==========================================================================
   EVENTS: THE MARK ON EVERY CARD
   Ours: the design drew the mark once over a whole column, so the second of
   the two cards still to come went unmarked. The mark says what a card is, so
   every card now carries its own, above it, where the design read it.

   The slider shows nothing of a slide outside its own frame, so a card makes
   the room for its mark within itself: it is as much taller as the mark hangs
   above it, and the column is pulled back up by as much, which leaves the
   cards and everything under them exactly where the design drew them.
   ========================================================================== */

.EventsArea .Events {
    margin-top: -23px;
}

.EventsArea .Event_box {
    padding-top: 23px;
    /* The white of the card is the box's own. The room above it is the mark's,
       and what shows beside the mark is the section behind it. */
    background: transparent;
}

.EventsArea .Event_box .eboxtag {
    top: 0;
    left: 0;
}

/* The badge of the discipline reads in the corner of the white box, as it
   always did, so the box is what it is placed against — not the card, whose
   top is now the mark's. */
.EventsArea .event_table_bg {
    position: relative;
}

/* The empty column has no card to make that room, so it keeps its own. */
.EventsArea .events-empty {
    margin-top: 23px;
}

/* An event being ridden now wears the green of the logo's own band, under the
   CFI letters, so it is told apart at a glance from the ones still to come. */
.EventsArea .Events .eboxtag-ongoing {
    background: #09a15c;
}

/* ==========================================================================
   LOAD MORE
   Ours: the button under a listing that reads in the next of its entries and
   adds them to the ones already shown. It stands where the numbered bar stood,
   in the middle and with the same room around it.
   ========================================================================== */

.load-more {
    margin: 20px 0;
    text-align: center;
}

.load-more .button {
    display: inline-block;
}

/* ==========================================================================
   COMMISSIONS: THE PERSON WHO HEADS THEM
   Ours: the design wrote the name in capitals into the page itself and drew
   the photograph square. Both are the panel's now — a name typed however it is
   typed, a photograph in whatever shape it was taken — so the card does the
   capitalising, and the picture fills the square the design drew rather than
   being squashed into it.
   ========================================================================== */

.pbox .card h2 {
    text-transform: uppercase;
}

.pbox .card img {
    object-fit: cover;
}


.page-content {

}

.page-content ul, .page-content ol  {
	margin: 0 20px;
	padding: 0;
}

.page-content ul li, .page-content ol li {
	margin: 0;
	padding: 0;
	color: #222;

}

.page-content p {
	margin: 0;
	padding: 0;
}

.page-content a {
	font-style: italic;
	color: #ff7900;
}
.page-content a:hover {
	font-style: italic;
	color: #000;
	text-decoration: underline;
}




/* =========================================
   RIGHT TO INFORMATION
========================================= */

.rti-section {
    max-width: 100%;
    margin: 0 auto;
    padding: 20px 0;
    font-family: Arial, Helvetica, sans-serif;
    color: #33334a;
    line-height: 1.8;
    box-sizing: border-box;
}

.rti-section *,
.rti-section *::before,
.rti-section *::after {
    box-sizing: border-box;
}


/* =========================================
   HEADER
========================================= */

.rti-header {
    text-align: center;
    margin-bottom: 30px;
    padding: 25px 15px;
    border-bottom: 3px solid #2e2c52;
}

.rti-header h2 {
    margin: 0 0 10px;
    font-size: 30px;
    font-weight: 700;
    color: #2e2c52;
    text-transform: uppercase;
}

.rti-header p {
    margin: 0;
    font-size: 15px;
    color: #68677d;
}


/* =========================================
   CARDS WRAPPER
========================================= */

.rti-cards {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
    align-items: stretch;
}


/* =========================================
   CARD
========================================= */

.rti-card {
    flex: 1 1 320px;
    min-width: 0;
    padding: 28px;
    background: #ffffff;
    border: 1px solid #e2e1eb;
    border-top: 5px solid #2e2c52;
    border-radius: 8px;
    box-shadow: 0 4px 16px rgba(46, 44, 82, 0.07);
}


/* =========================================
   ICON
========================================= */

.rti-icon {
    width: 52px;
    height: 52px;
    line-height: 52px;
    text-align: center;
    background: #2e2c52;
    color: #ffffff;
    border-radius: 50%;
    font-size: 23px;
    margin-bottom: 18px;
}


/* =========================================
   CARD HEADINGS
========================================= */

.rti-card h3 {
    margin: 0 0 18px;
    font-size: 21px;
    color: #2e2c52;
}

.rti-card h4 {
    margin: 0 0 5px;
    font-size: 18px;
    color: #252440;
}


/* =========================================
   DESIGNATION
========================================= */

.rti-designation {
    margin: 0;
    font-size: 14px;
    color: #68677d;
}


/* =========================================
   DIVIDER
========================================= */

.rti-divider {
    height: 1px;
    background: #e7e6ef;
    margin: 15px 0;
}


/* =========================================
   CARD CONTENT
========================================= */

.rti-card p {
    margin: 0 0 15px;
    font-size: 14px;
}

.rti-card p:last-child {
    margin-bottom: 0;
}

.rti-card strong {
    display: block;
    color: #2e2c52;
    margin-bottom: 4px;
}


/* =========================================
   LINKS
========================================= */

.rti-card a {
    color: #2e2c52;
    text-decoration: none;
    transition: all 0.3s ease;
}

.rti-card a:hover {
    color: #16152d;
    text-decoration: underline;
}

.rti-email {
    overflow-wrap: anywhere;
}


/* =========================================
   BOTTOM INFORMATION
========================================= */

.rti-info {
    margin-top: 28px;
    padding: 18px 20px;
    background: #f3f2f8;
    border-left: 4px solid #2e2c52;
    border-radius: 4px;
}

.rti-info p {
    margin: 0;
    font-size: 14px;
    color: #48465f;
}

.rti-info strong {
    color: #2e2c52;
}


/* =========================================
   RESPONSIVE
========================================= */

@media (max-width: 767px) {

    .rti-section {
        padding: 15px 0;
    }

    .rti-header {
        margin-bottom: 20px;
        padding: 20px 10px;
    }

    .rti-header h2 {
        font-size: 24px;
    }

    .rti-header p {
        font-size: 14px;
    }

    .rti-cards {
        gap: 18px;
    }

    .rti-card {
        flex: 1 1 100%;
        padding: 22px;
    }

    .rti-card h3 {
        font-size: 19px;
    }

    .rti-card h4 {
        font-size: 17px;
    }

    .rti-info {
        margin-top: 20px;
        padding: 15px;
    }

}

.banner_content{ min-height:180px; }