
@font-face {
    font-family: 'Circular Std Book';
    src: url('../fonts/CircularStd-Book.eot');
    src: local('Circular Std Book'), local('CircularStd-Book'),
        url('../fonts/CircularStd-Book.eot?#iefix') format('embedded-opentype'),
        url('../fonts/CircularStd-Book.woff2') format('woff2'),
        url('../fonts/CircularStd-Book.woff') format('woff'),
        url('../fonts/CircularStd-Book.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

body {
  background: #fff;
  color: #666666;
    font-family: 'Circular Std Book';
}

a {
  color: #18d26e;
  transition: 0.5s;
}

a:hover, a:active, a:focus {
  color: #18d36e;
  outline: none;
  text-decoration: none;
}

p {
  padding: 0;
  margin: 0 0 30px 0;
}

h1, h2, h3, h4, h5, h6 {
 
  font-weight: 400;
  margin: 0 0 20px 0;
  padding: 0;
}

/* Back to top button */
.back-to-top {
  position: fixed;
  display: none;
  background: #0082CC;
  color: #fff;
  display: inline-block;
  width: 44px;
  height: 44px;
  text-align: center;
  line-height: 1;
  font-size: 16px;
  border-radius: 50%;
  right: 15px;
  bottom: 15px;
  transition: background 0.5s;
  z-index: 11;
}

.back-to-top i {
  padding-top: 12px;
  color: #fff;
}

@media (max-width: 768px) {
  .back-to-top {
    bottom: 15px;
  }
}

/*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/
#top-header img{
width: 100%;
}
/*--------------------------------------------------------------
# Intro Section
--------------------------------------------------------------*/
#intro {
  display: table;
  width: 100%;
  height: 70vh;
  background: #000;
}

#intro .carousel-item {
  width: 100%;
  height: 70vh;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

#intro .carousel-item::before {
  content: '';
  background-color: rgba(0, 0, 0, 0.4);
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
}

#intro .carousel-container {
  display: flex;
  justify-content: left;
  align-items: center;
  position: absolute;
  bottom: 0;
  top: 0;
  left: 0;
  right: 0;
} 

#intro .carousel-content {
 padding-left: 140px;
    text-align: center;
}

#intro h2 {
  color: #fff;
  margin-bottom: 0px;
  font-size: 48px;
  font-weight: 700;
}
#intro p {
   
    color: #0082cc;
    font-size: 37px;
    font-weight: bold;

}
#intro p span{
  color: #fff;
}





/*@media (min-width: 1024px) {
  #intro p {
    width: 60%;
  }
}*/

#intro .carousel-fade .carousel-inner .carousel-item {
  -webkit-transition-property: opacity;
  transition-property: opacity;
}

#intro .carousel-fade .carousel-inner .carousel-item,
#intro .carousel-fade .carousel-inner .active.carousel-item-left,
#intro .carousel-fade .carousel-inner .active.carousel-item-right {
  opacity: 0;
}

#intro .carousel-fade .carousel-inner .active,
#intro .carousel-fade .carousel-inner .carousel-item-next.carousel-item-left,
#intro .carousel-fade .carousel-inner .carousel-item-prev.carousel-item-right {
  opacity: 1;
  transition: 0.5s;
}

#intro .carousel-fade .carousel-inner .carousel-item-next,
#intro .carousel-fade .carousel-inner .carousel-item-prev,
#intro .carousel-fade .carousel-inner .active.carousel-item-left,
#intro .carousel-fade .carousel-inner .active.carousel-item-right {
  left: 0;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

#intro .carousel-control-prev, #intro .carousel-control-next {
  width: 10%;
}

@media (min-width: 1024px) {
  #intro .carousel-control-prev, #intro .carousel-control-next {
    width: 5%;
  }
}

#intro .carousel-control-next-icon, #intro .carousel-control-prev-icon {
  background: none;
  font-size: 32px;
  line-height: 1;
}

#intro .carousel-indicators li {
    cursor: pointer;
    width: 15px;
    height: 15px;
    border-radius: 50%;
}

#intro .btn-get-started {

  font-weight: 500;
  font-size: 16px;
  letter-spacing: 1px;
  display: inline-block;
  padding: 8px 32px;
  border-radius: 50px;
  transition: 0.5s;
  margin: 10px;
  color: #fff;
  background: #18d26e;
}

#intro .btn-get-started:hover {
  background: #fff;
  color: #18d26e;
}

/*************************
******* headers ******
**************************/
.section-header h1{
color: rgb(162, 155, 155);
font-size: 17px;
font-weight: bold;
}
.section-header h2{
color: rgb(0, 130, 204);
    font-size: 20px;
    font-weight: 900;
    line-height: 0;
    padding-bottom: 7px;
}
.header-fancy {
       position: relative;
    display: block;
    clear: both;
    width: 100%;
    /* padding: 0 10px; */
    /* padding: 0px 10px; */
    /* margin-top: 35px; */
    margin-bottom: 44px;
    background: url(../img/horizontal.png) no-repeat center center;
    text-align: left;
    height: 34px;
    text-transform: capitalize;
    font-size: 12px;
    
    margin-top: 20px;
}
.header-fancy span {
   display: inline-block;
    padding: 7px 22px;
    background-image: none !important;
    background-color: #0082CC;
    color: #fff;
    font-size: 12px;
    word-spacing: 3px;
    border-left: 10px solid #efc80a;
}
/*************************
*******Posts section******
**************************/
#posts{
  padding: 40px 0;
}
#posts .teams{
display: inline-flex;
text-align: center;
}
.teams .team-img{
  width: 100px;
}
.teams .team-img img {
width: 100%
}
.teams .team-imgs{
     padding-left: 20px;
    margin: auto;
}
.teams .team-imgs img{
  width: 20%;
}
.teams .team-country{
  margin: auto;
}
.teams .team-country h3{
font-size: 11px;
color: #0082CC;
}
.teams .team-country h2{
font-size: 14px;
font-weight: bold;
}
.teams .team-country img{
  width: 30%;
}
#posts .blog{
height: 590px;
    overflow-y: scroll;
    overflow-x: hidden;
    padding: 0 16px;
}
#posts .blog .col-lg-6{
  padding: 0;
}
#posts .blog .card{
  margin: 3px 3px;
}
#posts .blog .card img{
  width: 100%;
}
#posts .blog .card-body{
 background:  #0082CC;
 padding: 15px 7px;
}
#posts .blog .card-body span{
font-size: 11px;
color: #F2F2F2;
}
#posts .blog .card-body h4{
  font-size: 14px;
  color: #fff;
  padding-top: 10px;
  line-height: 1.5;

}
#posts .blog .card-body h4 a{
  color: #fff;
}
#posts .blog .card-body h4 a:hover{
  color: #f1cb0a;
}
#posts .race{
background:#ededed;
padding:16px 8px;

}
#posts .race .race_profile{
display: inline-flex;
    /* border-left: 1px solid #ccc; */
    border-bottom: 1px solid #ccc;

}
#posts .race .race_profile img{
  width: 50%
}
#posts .race .race_description {
  padding-left: 10px;
}
#posts .race .race_description span{
font-size: 11px;
color: #0082CC;


}
#posts .race .race_description h1{
font-size: 14px;
font-weight: 900;

padding-top: 10px;


}
#posts .race .race_description p{
font-size: 13px;
    font-weight: 700;
    color: #9e9e9e;

}

/* width */
#posts .blog::-webkit-scrollbar {
  width: 10px;
}

/* Track */
#posts .blog::-webkit-scrollbar-track {
  background:#ccc; 
}
 
/* Handle */
#posts .blog::-webkit-scrollbar-thumb {
  background: #0082cc; 
}

/* Handle on hover */
#posts .blog::-webkit-scrollbar-thumb:hover {
  background:  #0082dd; 
}

#banners .banner-after-menu img{
width: 100%
}
/*************************
*******News section******
**************************/
#media{
 /* border-bottom: 3px solid #206a8d;*/
    padding: 19px 10px;
}

#media .text-center h3 {
 font-size: 20px;
    text-align: center;
    font-weight: 700;
    position: relative;
    padding-bottom: 15px;
    color: #206a8d;
  }
#media .text-center h3::before {
    content: '';
    position: absolute;
    display: block;
    width: 120px;
    height: 1px;
    background: #ddd;
    bottom: 1px;
    left: calc(50% - 60px);
}
#media .text-center h3::after {
    content: '';
    position: absolute;
    display: block;
    width: 40px;
    height: 3px;
    background: #206a8d;
    bottom: 0;
    left: calc(50% - 20px);
  }

#media .whates-caption{
      padding: 17px 16px;
}
#media .whates-caption h4{
font-size: 14px;
}
#media .whates-caption h4 a{
    color: #000;
    /*font-family: "Poppins", sans-serif;*/
  
}
#media .whates-caption h4 a:hover{
    opacity: 0.7;
    text-decoration: none;
}
#media .whates-caption span{
font-size: 14px;
    color: #bfad7d;
}
#media  .whats-right-cap{
  padding-left: 13px;
}
#media .whats-right-cap h4{
font-size: 14px;
    
}
#media .whats-right-cap h4 a{
    color: #000;
    text-decoration: none;
    font-weight: 500;
    line-height: 1.4;
   
}
#media .whats-right-cap h4 a:hover{
    opacity: 0.7;
    text-decoration: none;
}

#media .whats-right-single{
 
    padding: 9px 0px;
}
#media .whats-right-cap p{
  font-size: 13px;
    color: #bfad7d;
}
#media .whats-right-img img{
    width: 160px;
    height: 96px;
    object-fit: cover;
}
#media .text-center {
  padding-top:20px;
  margin-bottom:30px;
  padding-bottom:10px;
}
 .latest{
  color: #554722;
}
 @media (max-width: 700px){
 #media{
    padding: 0;
 }
 #media .whates-caption h4{
  font-size: 13px;
 }
 #media .whates-caption span {
    font-size: 11px;
}
#media .whats-right-cap h4 {
    font-size: 13px;
}
#media .whats-right-cap p {
    font-size: 12px;
}
}

/*====================Footer=====================*/
#footer{
  background: #0082CC;
  text-align: center;
  padding: 30px 0;
}
#footer .footer-img img{
  width: 20%;
}

/*================================================================
=======================mobile version-===============================*/
@media (max-width: 768px) {
  #intro {
  
  height: 44vh;

}

#intro .carousel-item {

  height: 44vh;
}
#intro .carousel-container {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    bottom: 0;
    top: 0;
    left: 0;
    right: 0;
}
  #intro .carousel-content {
    /* padding-left: 0; */
    text-align: center;
    padding: 47px;
}
#intro p {
    color: #0082cc;
    font-size: 24px;
    font-weight: bold;
    padding-top: 13px;
}
  #intro h2 {
    font-size: 17px;
  }
.section-header{
  text-align: center;
}
.teams .team-country {
    margin: auto;
    width: 200px;
}
.col-lg-7 .section-header{
  padding-top: 15px;
}
#banners .banner-after-menu{
  padding-bottom: 8px;
}
#media .section-header{
  padding-top: 15px;
}
#posts {
    padding: 25px 0;
}
#posts .teams {
    display: inline-flex;
    text-align: center;
    /* border-bottom: 1px solid #cccccc4d; */
    padding: 10px 0;
}
#posts .race .race_description h1 {
    font-size: 12px;
    font-weight: 900;
    padding-top: 10px;
}
.section-header h1 {
    color: rgb(162, 155, 155);
    font-size: 14px;
    font-weight: bold;
}
.section-header h2 {
    color: rgb(0, 130, 204);
    font-size: 15px;
    font-weight: 900;
}
.header-fancy{
  margin-bottom: 17px;
}
.teams .team-img img {
    width: 87%;
}
#media .whates-img iframe{
  height: 200px;
}
#media .whats-right-img iframe{
   height: 200px;
}

}