/*------------------------------------------------------------------
Project:    Mosaic
Author:     Simpleqode
URL:        http://simpleqode.com/
            https://twitter.com/YevSim
            https://www.facebook.com/simpleqode
Version:    1.3.1
Created:        20/01/2014
Last change:    06/07/2015
-------------------------------------------------------------------*/

/* ===== Helper Classes ===== */

.primary-font {
  font-family: 'Roboto', sans-serif;
}

.first-child {
  margin-top: 0 !important;
}

@media (max-width: 767px) {
  .first-child-m {
    margin-top: 20px !important;
  }
}

.delay-1 {
  animation-delay: 0.3s;
  -webkit-animation-delay: 0.3s;
}

.delay-2 {
  animation-delay: 0.6s;
  -webkit-animation-delay: 0.6s;
}

.delay-3 {
  animation-delay: 1s;
  -webkit-animation-delay: 1s;
}

.tab-1 {
  margin-right: 15px;
}

.tab-2 {
  margin-right: 30px;
}

.tab-3 {
  margin-right: 45px;
}

.tab-3 {
  margin-right: 60px;
}

hr.arrow-down {
  margin-top: 40px;
  margin-bottom: 40px;
  position: relative;
}

hr.arrow-down:after {
  content: url(../img/arrow.png);
  position: absolute;
  left: 50%;
  margin-left: -10px;
  top: -5px;
}


/* ===== Buttons ===== */

.btn {
  border-radius: 3px;
}

/* ===== Headlines ===== */

.headline {
  padding-bottom: 1px;
  border-bottom: 1px solid #eee;
  margin-bottom: 30px;
  line-height: 50px;
}

.headline span {
  padding-bottom: 4px;
  border-bottom-width: 1px;
  border-bottom-style: solid;
}

h3.headline span {
  padding-bottom: 8px;
}

/* ===== Breadcrumbs ===== */

.topic {
  margin-top: -20px;
  margin-bottom: 40px;
  border-bottom: 1px solid #eee;
}

.topic h3 {
  display: inline-block;
  padding: 20px 0 20px;
  margin: 0 0 -1px 0;
  font-size: 20px;
}

.topic .breadcrumb {
  margin-bottom: 0;
  padding: 21px 0;
  background: transparent;
}


/* ===== Pagination ===== */

.body-green .pagination>.active>a,
.body-green .pagination>.active>span,
.body-green .pagination>.active>a:hover,
.body-green .pagination>.active>span:hover,
.body-green .pagination>.active>a:focus,
.body-green .pagination>.active>span:focus {
  background-color: #94BA65;
  border-color: #94BA65;
}

.body-blue .pagination>.active>a,
.body-blue .pagination>.active>span,
.body-blue .pagination>.active>a:hover,
.body-blue .pagination>.active>span:hover,
.body-blue .pagination>.active>a:focus,
.body-blue .pagination>.active>span:focus {
  background-color: #2790B0;
  border-color: #2790B0;
}

.body-red .pagination>.active>a,
.body-red .pagination>.active>span,
.body-red .pagination>.active>a:hover,
.body-red .pagination>.active>span:hover,
.body-red .pagination>.active>a:focus,
.body-red .pagination>.active>span:focus {
  background-color: #E35E54;
  border-color: #E35E54;
}

.body-orange .pagination>.active>a,
.body-orange .pagination>.active>span,
.body-orange .pagination>.active>a:hover,
.body-orange .pagination>.active>span:hover,
.body-orange .pagination>.active>a:focus,
.body-orange .pagination>.active>span:focus {
  background-color: #D26C22;
  border-color: #D26C22;
}

.pagination>li>a,
.pagination>li>span {
  color: #999;
}

.pagination>li>a:hover,
.pagination>li>span:hover,
.pagination>li>a:focus,
.pagination>li>span:focus {
  color: #666;
}

/* ===== Panels ===== */

/* 1. Panel Green */

.panel-green {
  border-color: rgb(54, 78, 106);
}

.panel-green>.panel-heading {
  color: rgb(245, 243, 243);
  background-color: rgb(54, 78, 106);
  border-color: rgb(54, 78, 106);
}

.panel-green>.panel-heading+.panel-collapse .panel-body {
  border-top-color: #94BA65;

}

.panel-green>.panel-footer+.panel-collapse .panel-body {
  border-bottom-color: #94BA65;

}

.panel-green>.panel-footer {
  background-color: rgb(215, 221, 228);
  border-top: 1px solid #94BA65;
}

/* 2. Panel Blue */

.panel-blue {
  border-color: #2790B0;
}

.panel-blue>.panel-heading {
  color: #fff;
  background-color: #2790B0;
  border-color: #2790B0;
}

.panel-blue>.panel-heading+.panel-collapse .panel-body {
  border-top-color: #2790B0;

}

.panel-blue>.panel-footer+.panel-collapse .panel-body {
  border-bottom-color: #2790B0;
}

.panel-blue>.panel-footer {
  background-color: #2790B0;
  border-top: 1px solid #2790B0;
}

/* 3. Panel Red */

.panel-red {
  border-color: #E35E54;
}

.panel-red>.panel-heading {
  color: #fff;
  background-color: #E35E54;
  border-color: #E35E54;
}

.panel-red>.panel-heading+.panel-collapse .panel-body {
  border-top-color: #E35E54;
}

.panel-red>.panel-footer+.panel-collapse .panel-body {
  border-bottom-color: #E35E54;
}

.panel-red>.panel-footer {
  background-color: #E35E54;
  border-top: 1px solid #E35E54;
}

/* 4. Panel Orange */

.panel-orange {
  border-color: #D26C22;
}

.panel-orange>.panel-heading {
  color: #fff;
  background-color: #D26C22;
  border-color: #D26C22;
}

.panel-orange>.panel-heading+.panel-collapse .panel-body {
  border-top-color: #D26C22;
}

.panel-orange>.panel-footer+.panel-collapse .panel-body {
  border-bottom-color: #D26C22;
}

.panel-orange>.panel-footer {
  background-color: #D26C22;
  border-top: 1px solid #D26C22;
}

/* ===== Info Boards ==== */

.info-board {
  margin: 20px 0;
  padding: 15px 30px 15px 15px;
  border-left: 5px solid #eee;
}

.info-board h4 {
  margin-top: 0;
  font-family: 'Roboto', sans-serif;
}

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

/* 1. Info board green */

.info-board-green {
  background-color: #F5F9F1;
  border-color: #94BA65;
}

/* 2. Info board blue */

.info-board-blue {
  background-color: #EEF8FB;
  border-color: #2790B0;
}

/* 3. Info board orange */

.info-board-orange {
  background-color: #FCF4ED;
  border-color: #D26C22;
}

/* 4. Info board red */

.info-board-red {
  background-color: #FCEEED;
  border-color: #E35E54;
}

/* ===== Navs ===== */

/* 1. Nav tabs */

.nav-tabs {
  margin-bottom: 15px;
}

.nav-tabs>li>a {
  border-bottom: 1px solid #dedede;
  border-radius: 0;
  background: #fff;
  color: #999;
  -webkit-transition: color 200ms;
  transition: color 200ms;
}

.nav-tabs>li>a:hover,
.nav>li>a:focus {
  text-decoration: none;
  background-color: #fff;
  border-color: #fff #fff #dedede;
  color: #515151;
}

.nav-tabs>li.active>a,
.nav-tabs>li.active>a:hover,
.nav-tabs>li.active>a:focus {
  color: #515151;
  cursor: default;
  background-color: #fff;
  border: 1px solid transparent;
}

.body-green .nav-tabs>li.active>a,
.body-green .nav-tabs>li.active>a:hover,
.body-green .nav-tabs>li.active>a:focus {
  border-bottom-color: #94BA65;
}

.body-blue .nav-tabs>li.active>a,
.body-blue .nav-tabs>li.active>a:hover,
.body-blue .nav-tabs>li.active>a:focus {
  border-bottom-color: #2790B0;
}

.body-orange .nav-tabs>li.active>a,
.body-orange .nav-tabs>li.active>a:hover,
.body-orange .nav-tabs>li.active>a:focus {
  border-bottom-color: #D26C22;
}

.body-red .nav-tabs>li.active>a,
.body-red .nav-tabs>li.active>a:hover,
.body-red .nav-tabs>li.active>a:focus {
  border-bottom-color: #E35E54;
}

.nav-tabs.nav-justified>li>a {
  margin-right: 0;
  border-radius: 0;
}

.nav-tabs.nav-justified>.active>a,
.nav-tabs.nav-justified>.active>a:hover,
.nav-tabs.nav-justified>.active>a:focus {
  border: 1px solid transparent;
  border
}

/* 2. Nav pills */

.nav-pills {
  margin-bottom: 15px;
}

.nav-pills>li>a {
  color: #515151;
  -webkit-transition: background-color 200ms;
  transition: background-color 200ms;
}

.nav-pills>li>a {
  background-color: #f5f5f5;
}

.body-green .nav-pills>li.active>a,
.body-green .nav-pills>li.active>a:hover,
.body-green .nav-pills>li.active>a:focus {
  background-color: #94BA65;
}

.body-blue .nav-pills>li.active>a,
.body-blue .nav-pills>li.active>a:hover,
.body-blue .nav-pills>li.active>a:focus {
  background-color: #2790B0;
}

.body-orange .nav-pills>li.active>a,
.body-orange .nav-pills>li.active>a:hover,
.body-orange .nav-pills>li.active>a:focus {
  background-color: #D26C22;
}

.body-red .nav-pills>li.active>a,
.body-red .nav-pills>li.active>a:hover,
.body-red .nav-pills>li.active>a:focus {
  background-color: #E35E54;
}

.nav.nav-pills>li>a:hover,
.nav>li>a:focus {
  text-decoration: none;
  background-color: #f0f0f0;
}

.nav-pills-green>li.active>a,
.nav-pills-green>li.active>a:hover,
.nav-pills-green>li.active>a:focus {
  background-color: #94BA65 !important;
}

.nav-pills-blue>li.active>a,
.nav-pills-blue>li.active>a:hover,
.nav-pills-blue>li.active>a:focus {
  background-color: #2790B0 !important;
}

.nav-pills-red>li.active>a,
.nav-pills-red>li.active>a:hover,
.nav-pills-red>li.active>a:focus {
  background-color: #E35E54 !important;
}

.nav-pills-orange>li.active>a,
.nav-pills-orange>li.active>a:hover,
.nav-pills-orange>li.active>a:focus {
  background-color: #D26C22 !important;
}