/*+++++++++++++++++ Font Face ++++++++++++++++++++++ */

@font-face {
  font-family: 'ProximaNova_black';
  font-weight: 900;
  font-style: normal;
  src: url('../fonts/proxima_nova_black.woff2') format('woff2'), url('../fonts/proxima_nova_black.woff') format('woff'), url('../fonts/proxima_nova_black.ttf') format('truetype');
}
@font-face {
  font-family: 'ProximaNova_light';
  font-weight: 300;
  font-style: normal;
  src: url('../fonts/proxima_nova_light.woff2') format('woff2'), url('../fonts/proxima_nova_light.woff') format('woff'), url('../fonts/proxima_nova_light.ttf') format('truetype');
} 
@font-face {
  font-family: 'ProximaNova_semibold';
  font-weight: 600;
  font-style: normal;
  src: url('../fonts/proxima_nova_semibold.woff2') format('woff2'), url('../fonts/proxima_nova_semibold.woff') format('woff'), url('../fonts/proxima_nova_semibold.ttf') format('truetype');
}
@font-face {
  font-family: 'ProximaNova_bold';
  font-weight: bold;
  font-style: normal;
  src: url('../fonts/proxima_nova_bold.woff2') format('woff2'), url('../fonts/proxima_nova_bold.woff') format('woff'), url('../fonts/proxima_nova_bold.ttf') format('truetype');
}
@font-face {
  font-family: 'ProximaNova';
  font-weight: normal;
  font-style: normal;
  src: url('../fonts/proxima_nova_regular.woff2') format('woff2'), url('../fonts/proxima_nova_regular.woff') format('woff'), url('../fonts/proxima_nova_regular.ttf') format('truetype');
}


body {
  font-family: 'ProximaNova';
}
section{padding: 40px 0px;}

.rating img {opacity: 0.5;}

/*banner LARGE CSS*/
.banner-wrapper {position: relative; max-width: 900px; margin: 0 auto; padding: 10px; height: 74px; /*line-height: 57px; */}
.banner-large span{ position: relative;color: #58666e;font-size: 20px; margin-right:25px;display: inline-block;}
.rating-title-large {text-transform: uppercase; font-weight: 700; font-family: 'ProximaNova_bold'; }
.banner-large .rating{top: -3px;}
.banner-large .reviews{font-size: 20px;}
.banner-large .logo{top:0px;}
.banner-large .powered-by {position: absolute; font-size: 12px; width: 100px; left: 2%; top: -45px; font-style: italic; font-weight: 700; }

/*banner MEDIUM CSS*/
.banner-wrapper-medium {position: relative; max-width:650px; margin: 0 auto; padding: 10px; /*height: 58px; line-height: 38px;*/ }
.banner-wrapper-medium span{ position: relative;color: #58666e; margin-right:10px;}
.banner-wrapper-medium .rating-title-large {text-transform: uppercase; font-weight: 700; font-family: 'ProximaNova_bold'; font-size: 20px;}
.banner-wrapper-medium .rating{top: -3px;}
.banner-wrapper-medium .reviews{font-size: 16px;}
.banner-wrapper-medium .logo{}
.banner-wrapper-medium .logo img{height:30px;}

/*banner MICRO CSS*/
.banner-wrapper-micro {position: relative; max-width:350px; margin: 0 auto; padding: 10px; height: 58px; line-height: 38px; } 
.banner-wrapper-micro span{ position: relative;color: #58666e; margin-right:10px;}
.banner-wrapper-micro .bg-light {background: #eff9fc; padding: 10px; border-radius: 5px; }
.banner-wrapper-micro .arrow {width: 0; height: 0; border-top: 10px solid transparent; border-bottom: 10px solid transparent; border-right: 10px solid #eff9fc; position: absolute; left: -8px; top: 8px; }

/*banner SMALL CSS*/
.banner-wrapper-small {position: relative; max-width:375px; margin: 0 auto; padding: 10px; height: 40px; line-height: 20px; } 
.banner-wrapper-small .banner-small{position: relative;top: -4px;}
.banner-wrapper-small span{ position: relative;color: #58666e; margin-right:10px;}
.banner-wrapper-small .logo img{height: 30px;}
.banner-flex {display: inline-block;}
@media(max-width: 500px) {
  .banner-wrapper,
  .banner-wrapper-micro,
  .banner-wrapper-medium {
    padding: 5px 10px;
  }
  .banner-flex {
      display: flex;
      align-items: center;
      justify-content: center;
  }
  .rating-title-large {
      vertical-align: top;
      margin-right: 10px !important;
  }
  .banner-wrapper-small span {
    line-height: normal;
  }
  .banner-large span {
      font-size: 17px;
  }
  .ts-badge-filled-star {
      font-size: 6px;
      margin-right: 0 !important;
  }
  .ts-badge-filled-star i {
      font-size: 20px;
  }
  .reviews, .logo {
      font-size: 12px !important;
      margin: 0 !important;
  }
}


