/*---------------------------------
TYPOGRAPHY
---------------------------------*/
* {
  font-family: 'Lato', sans-serif;
  font-weight: lighter;
}
h1,
h2,
h3,
h4 {
  font-family: 'Montserrat', sans-serif;
  font-weight: 400;
}
h4 {
  text-transform: uppercase;
  font-size: 14px;
}
h5 {
  font-size: 12px;
  text-transform: uppercase;
  line-height: 10px;
}
h6 {
  margin-bottom: 30px;
}
h1 {
  font-size: 60px;
}
h2 {
  text-transform: uppercase;
  margin-bottom: 20px;
}
p {
  line-height: 1.8em;
  letter-spacing: .5px;
  font-weight: lighter;
  margin-bottom: 40px;
  color: #949494;
}
a {
  text-decoration: none;
  font-weight: normal;
}
a,
a:visited {
  color: #c62828;
}
a:hover {
  color: #9c1f1f;
}
a:active {
  color: #da4747;
}
/*---------------------------------
SPECIAL CLASSES
---------------------------------*/
.graybg {
  background: #fafafa;
  color: #212121;
}
.lightbg {
  background: #ffffff;
  color: #212121;
}
.darkbg {
  background: #212121;
  color: #ffffff;
}
.redbg {
  background: #c62828;
  color: #ffffff;
}
.pinkbg {
  background: #d81b60;
  color: #ffffff;
}
.greenbg {
  background: #4caf50;
  color: #ffffff;
}
.yellowbg {
  background: #fdd835;
  color: #ffffff;
}
.orangebg {
  background: #fb8c00;
  color: #ffffff;
}
.accent {
  color: #c62828;
}
.section,
section {
  padding-top: 140px;
  padding-bottom: 100px;
}
.section-head {
  margin-bottom: 80px;
}
hr {
  background: #ededed;
  height: 1px;
  margin: 0;
}
.rev-icon {
  font-size: 20px;
}
.mid-icon {
  font-size: 30px;
}
.big-icon {
  font-size: 50px;
}
.col-md-4 {
  margin-bottom: 40px;
}
img {
  max-width: 100%;
}
.item {
  padding: 0;
  margin-top: 20px;
}
.col-md-2 {
  padding-top: 35px;
}
.item-style-1 {
  margin: 0;
  padding: 0;
}
.col-md-3.item-style-2 {
  width: 23%;
  margin: 1%;
}
.col-md-4.item-style-2 {
  padding: 0;
  width: 31%;
  margin: 1.1%;
}
.btn {
  font-weight: bold;
  letter-spacing: 2px;
  border-radius: 0;
  border: none;
  padding: 18px 40px;
  margin-left: 2px;
  margin-right: 2px;
  text-transform: uppercase;
  font-size: .8em;
}
.btn:focus {
  outline: none;
}
.btn.btn-default {
  background: #c62828;
  color: #ffffff;
}
.btn.btn-default:hover {
  background: #9c1f1f;
}
.btn.btn-default:active {
  background: #da4747;
}
.btn.btn-ghost {
  background: none;
  color: #212121;
  padding: 16px 40px;
  border: 2px solid #212121;
}
.btn.btn-ghost:hover {
  border: 2px solid #c62828;
  background: #c62828;
  color: #ffffff;
}
.btn.btn-ghost:active {
  border: 2px solid #9c1f1f;
  background: #9c1f1f;
}
.btn.btn-link {
  padding: 14px 10px;
  text-decoration: none;
  color: #949494;
}
.btn.btn-link:hover {
  color: #c62828;
}
.btn.btn-link:active {
  color: #c62828;
}
.btn.active {
  color: #c62828;
}
.social-icons a:hover {
  text-decoration: none;
}
.social-icon {
  color: #949494;
  font-size: 1.6em;
  margin-right: 5px;
}
.social-icon.social_twitter_circle:hover {
  color: #55acee;
}
.social-icon.social_facebook_circle:hover {
  color: #3b5998;
}
.social-icon.social_googleplus_circle:hover {
  color: #dd4b39;
}
.social-icon.social_instagram_circle:hover {
  color: #3f729b;
}
.social-icon.social_pinterest_circle:hover {
  color: #cc2127;
}
.social-icon.social_dribbble_circle:hover {
  color: #ea4c89;
}
.social-icon.social_tumblr_circle:hover {
  color: #35465c;
}
.social-icon.social_linkedin_circle:hover {
  color: #0976b4;
}
.item-meta {
  padding: 20px;
}
.parallax-meta {
  color: #949494;
}
.mfp-zoom-in {
  overflow: hidden;
  /* start state */
  /* animate in */
  /* animate out */
}
.mfp-zoom-in .mfp-with-anim {
  opacity: 0;
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  -webkit-transform: scale(0.8);
  -ms-transform: scale(0.8);
  transform: scale(0.8);
}
.mfp-zoom-in.mfp-bg {
  opacity: 0;
  -webkit-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}
.mfp-zoom-in.mfp-ready .mfp-with-anim {
  opacity: 1;
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
}
.mfp-zoom-in.mfp-ready.mfp-bg {
  opacity: 0.8;
}
.mfp-zoom-in.mfp-removing .mfp-with-anim {
  -webkit-transform: scale(0.8);
  -ms-transform: scale(0.8);
  transform: scale(0.8);
  opacity: 0;
}
.mfp-zoom-in.mfp-removing.mfp-bg {
  opacity: 0;
}
.carousel-content {
  margin-bottom: 50px;
}
.container-960 {
  max-width: 960px;
}
.lead {
  font-weight: lighter;
}
/*---------------------------------
NAVBAR
---------------------------------*/
.navbar {
  font-family: 'Montserrat', sans-serif;
  text-transform: uppercase;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 1px;
  padding: 15px 0;
  margin: 0;
}
.navbar a {
  font-weight: bold;
}
.navbar-default {
  background: #ffffff;
}
.navbar-default .navbar-toggle {
  border-color: #c62828;
  background: rgba(198, 40, 40, 0.9);
}
.navbar-default .navbar-toggle .icon-bar {
  background: #fff;
}
.navbar-default .navbar-toggle:hover {
  background: #c62828;
}
.navbar-default .navbar-nav > li > a {
  color: #212121;
  font-weight: bold;
}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > .active,
.brandname:hover {
  color: #c62828;
}
.brandlogo {
  max-height: 30px;
  max-width: 30px;
}
.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus {
  color: #c62828;
  background-color: #ffffff;
}
.navbar .dropdown-menu > li > a {
  line-height: 3;
  font-size: 13px;
  letter-spacing: 1px;
  text-transform: capitalize;
}
.navbar .dropdown-menu > li > a:hover {
  background: #c62828;
  color: #ffffff;
}
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
  color: #c62828;
  background-color: #ffffff;
}
#slider {
  color: #fff;
  overflow: hidden;
  position: relative;
}
#slider .item {
  -webkit-background-size: cover;
  background-size: cover;
}
#slider .color-overlay {
  width: 100%;
  height: 100%;
  background: rgba(198, 40, 40, 0.8);
  z-index: 10;
}
#slider .caption {
  position: absolute;
  top: 50%;
  margin-top: -104px;
  text-align: left;
  text-transform: uppercase;
  z-index: 15;
  font-size: 18px;
  font-weight: 300;
  padding: 0 100px;
  color: #fff;
  text-align: center;
}
#slider .carousel-indicators {
  bottom: 70px;
}
#slider .carousel-indicators li {
  border-color: rgba(255, 255, 255, 0.9);
  height: 8px;
  width: 30px;
  margin-right: 10px;
}
#slider .carousel-indicators .carousel-indicators .active {
  top: -1px;
  position: relative;
  background: rgba(255, 255, 255, 0.9);
}
#slider .carousel-indicators .active {
  top: -1px;
  position: relative;
}
#slider h1 {
  padding-bottom: 30px;
  margin-bottom: 40px;
  position: relative;
}
#slider h1:before {
  position: absolute;
  left: 50%;
  -webkit-transform: translate(-50%);
  -ms-transform: translate(-50%);
  transform: translate(-50%);
  bottom: 0;
  content: "";
  width: 20%;
  height: 6px;
  background: #fff;
}
#slider .lead {
  color: #fff;
  text-transform: uppercase;
  font-weight: bold;
}
.hero-btn {
  width: 100%;
  float: left;
  text-align: center;
  position: relative;
  top: -70px;
}
.hero-btn a {
  color: #fff;
}
.hero-btn a:hover,
.hero-btn a:focus {
  text-decoration: none;
}
/*---------------------------------
OVERVIEW
---------------------------------*/
#overview {
  float: left;
  width: 100%;
}
#overview .section {
  padding-bottom: 0;
}
/*---------------------------------
FEATURES
---------------------------------*/
#features {
  float: left;
  width: 100%;
}
#features .section.container {
  padding-bottom: 20px;
}
/*---------------------------------
FUN FACT
---------------------------------*/
#funFact {
  float: left;
  width: 100%;
  background: url(../img/funfact-bg.gif) fixed;
  text-transform: uppercase;
}
#funFact h3 {
  font-size: 35px;
  letter-spacing: 5px;
}
#funFact p {
  font-family: 'Montserrat', sans-serif;
  text-transform: uppercase;
  font-weight: 400;
  font-size: 12px;
  letter-spacing: 1px;
}
/*---------------------------------
PRODUCTS
---------------------------------*/
#products {
  float: left;
  width: 100%;
}
#products .container.row {
  margin: 0 -25px;
}
#products .item {
  overflow: hidden;
}
#products .item .itemhover {
  position: absolute;
  padding: 32% 19%;
  background: rgba(255, 255, 255, 0.75);
  opacity: 0;
  -webkit-transition: all 300ms;
  transition: all 300ms;
  width: 100%;
  height: 100%;
}
#products .item .itemhover:hover {
  opacity: 1;
  -webkit-transition: all 300ms;
  transition: all 300ms;
}
#products .item-meta a {
  color: #212121;
  text-decoration: none;
}
#products .item-meta a:hover {
  color: #c62828;
}
#products .item-meta .productRating {
  margin-bottom: 30px;
  color: #c62828;
}
/*---------------------------------
SERVICES
---------------------------------*/
#services {
  float: left;
  width: 100%;
}
#services .mid-icon {
  background: #c62828;
  padding: 25px;
  border-radius: 50%;
  color: #ffffff;
}
/*---------------------------------
RIBBON
---------------------------------*/
#ribbon {
  float: left;
  width: 100%;
}
#ribbon .section {
  padding: 40px 0 20px;
}
#ribbon .col-md-9 {
  padding: 0;
  padding-top: 20px;
}
#ribbon p {
  font-size: 1.3em;
  font-weight: bold;
}
/*---------------------------------
TEAM
---------------------------------*/
#team {
  float: left;
  width: 100%;
}
#team .teamMemberPic {
  margin-bottom: 40px;
}
#team .memberPicNormal {
  position: absolute;
  opacity: 1;
  -webkit-transition: all 400ms;
  transition: all 400ms;
}
#team .memberPicNormal:hover {
  opacity: 0;
  -webkit-transition: all 400ms;
  transition: all 400ms;
}
#team .teamMemberMeta p {
  margin-bottom: 20px;
}
#team .teamPosition {
  margin-bottom: 20px;
  text-transform: uppercase;
  color: #c62828;
}
/*---------------------------------
TWEETS
---------------------------------*/
#tweets {
  float: left;
  width: 100%;
  background: url(../img/funfact-bg.gif) fixed;
}
#tweets .container {
  max-width: 960px;
}
#tweets .tweet {
  margin-top: 40px;
  font-size: 24px;
}
/*---------------------------------
PORTFOLIO
---------------------------------*/
#Container .mix {
  display: none;
}
#portfolio {
  float: left;
  width: 100%;
  overflow: hidden;
}
#portfolio .section {
  padding-bottom: 20px;
}
#portfolio #Container .mix {
  overflow: hidden;
  z-index: 1;
}
#portfolio #Container .mix img {
  z-index: -999;
  position: absolute;
}
#portfolio #Container .mix .folio-hover {
  z-index: 999;
  background: rgba(33, 33, 33, 0.5);
  padding: 30% 0;
  opacity: 0;
  -webkit-transition: all 300ms;
  transition: all 300ms;
}
#portfolio #Container .mix .folio-hover:hover {
  opacity: 1;
  -webkit-transition: all 300ms;
  transition: all 300ms;
}
#portfolio #Container .mix .folio-hover .btn.btn-default {
  padding: 15px;
}
/*---------------------------------
BLOG
---------------------------------*/
#blog {
  float: left;
  width: 100%;
}
#blog .post-title a {
  text-decoration: none;
  color: #212121;
}
#blog .post-title a:hover {
  color: #c62828;
}
/*---------------------------------
TESTIMONIALS
---------------------------------*/
#testimonials {
  float: left;
  width: 100%;
  overflow: hidden;
  background: url(../img/funfact-bg.gif) fixed;
  position: relative;
}
#testimonials .container {
  max-width: 960px;
}
#testimonials .testimonial {
  margin-top: 20px;
  font-size: 24px;
}
#testimonials .client-photo {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  margin-bottom: 20px;
}
#testimonials .item-rating {
  color: #c62828;
  font-size: 1.5em;
}
/*---------------------------------
MOGA CTA
---------------------------------*/
#moga-cta {
  float: left;
  width: 100%;
}
#moga-cta {
  background: url(../img/moga-cta-bg.png);
}
#moga-cta .head-icon {
  margin-bottom: 40px;
}
/*---------------------------------
CONTACTS
---------------------------------*/
#contact {
  float: left;
  width: 100%;
}
#contact .contactform {
  padding: 60px 60px 30px 0;
  background: #ffffff;
}
#contact .form-group {
  margin-bottom: 40px;
}
#contact #name,
#contact #email,
#contact #subject,
#contact textarea {
  border: none;
  background: none;
  border-bottom: 2px solid #212121;
  border-radius: 0;
  padding: 18px 0 30px;
}
#contact #name.form-control,
#contact #email.form-control,
#contact #subject.form-control,
#contact textarea.form-control {
  -webkit-box-shadow: none;
  box-shadow: none;
  webkit-box-shadow: none;
}
#contact #name.form-control:focus,
#contact #email.form-control:focus,
#contact #subject.form-control:focus,
#contact textarea.form-control:focus {
  border-bottom: 2px solid #c62828;
}
#contact textarea {
  padding-top: 10px;
}
#contact .contact-address {
  padding-left: 40px;
}
#contact .contact-address h3 {
  margin-bottom: 20px;
}
/*---------------------------------
CLIENTS
---------------------------------*/
#clients {
  float: left;
  width: 100%;
}
#clients .section {
  padding-top: 40px;
  padding-bottom: 30px;
}
#clients .client-logo {
  opacity: 1;
}
#clients .client-logo:hover {
  opacity: .8;
}
/*---------------------------------
FOOTER
---------------------------------*/
footer {
  float: left;
  width: 100%;
}
footer h3 {
  font-size: 1.3em;
  margin-bottom: 25px;
}
footer ul {
  list-style: none;
  padding-left: 0;
}
footer ul li {
  margin-bottom: 15px;
  padding-bottom: 15px;
  border-bottom: 1px solid #2e2e2e;
}
footer .section .col-md-3 a {
  color: #949494;
}
footer .section .col-md-3 a:hover {
  color: #c62828;
  text-decoration: none;
}
/*Normal display*/
@media (min-width: 1366px) {
  .container {
    width: 1280px;
  }
}
/*Wider display*/
@media (min-width: 1680px) {
  .container {
    width: 1600px;
  }
  #products .item .itemhover {
    padding: 33.5% 25%;
  }
}
@media (max-width: 991px) {
  #funFact .col-md-3.item-style-2,
  #funFact .col-md-3.item-style-3,
  #funFact .col-md-3.item-style-4 {
    width: 100%;
  }
  #products .col-md-3.item-style-2 {
    width: 48%;
    float: left;
  }
  #ribbon .item-style-2 {
    text-align: center;
  }
  #ribbon p {
    text-align: center;
  }
  #services .mid-icon {
    display: inline-block;
    margin-bottom: 15px;
  }
  #team .col-md-3.item-style-2 {
    width: 48%;
    float: left;
    margin-bottom: 40px;
  }
  #portfolio .mix {
    width: 33%;
    margin: 0;
  }
  #blog .item-style-2 {
    width: 47.8%;
    float: left;
  }
}
@media (max-width: 640px) {
  h1 {
    font-size: 30px;
  }
  #slider h1 {
    margin-bottom: 10px;
    padding-bottom: 10px;
  }
  #portfolio .mix {
    width: 50%;
    float: left;
    margin: 0;
  }
  #contact .contactform {
    padding: 60px 15px 30px 15px;
  }
}
@media (max-width: 480px) {
  #products .col-md-3.item-style-2 {
    width: 100%;
    float: left;
  }
  #slider h1 {
    font-size: 20px;
  }
  .section,
  section {
    padding-top: 100px;
  }
  #team .col-md-3.item-style-2 {
    width: 96%;
    float: left;
    padding: 2%;
    margin: 0;
  }
  #portfolio .mix {
    width: 100%;
    float: left;
    margin: 0;
  }
  #blog .item-style-2 {
    width: 97%;
  }
  #moga-cta {
    float: left;
    width: 100%;
  }
  #moga-cta .btn {
    margin-bottom: 20px;
  }
}
