/* -------------------------------- 

Primary style
#ff9445
-------------------------------- */

/*

Workforce Template

http://www.templatemo.com/free-website-templates/461-workforce

*/
body
    {
        background: #f9f9f9;
        font-family: 'Comfortaa', Arial;
        font-weight: 400;
        overflow-x: hidden;
    }

/* start hr */
hr
    {
        border: 1px solid #00c77b;
        width: 100px;
        margin-top: 20px;
    }
/* end hr */

/* start h2 */
h2
    {
        font-size: 60px;
        text-align: center;
    }
/* end h2 */

/* start h4 */
h4
    {
        text-align: center;
        padding-bottom: 50px;
    }
/* end h4 */
.clear {
clear: both;
}
.btn {
    background: transparent;
    border-radius: 10px;
    color: #ffffff;
    margin-top: 40px;
  padding: 12px 22px;
    transition: all 0.4s ease-in-out;  
}
.btn:hover {
    background: #00c77b;
    border-color: transparent;
}

/* start overlay */
.overlay 
    {
       background: rgba(0, 0, 0, 0.7);
    } 
/* end overlay */

/* start preloader */
.preloader
    {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 99999;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-flow: row nowrap;
            -ms-flex-flow: row nowrap;
                flex-flow: row nowrap;
        -webkit-justify-content: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-align-items: center;
            -ms-flex-align: center;
                align-items: center;
        background: none repeat scroll 0 0 #fff;
    }
.sk-spinner-rotating-plane.sk-spinner 
    {
         width: 30px;
        height: 30px;
        background-color: #00c77b;         
        -webkit-animation: sk-rotatePlane 1.2s infinite ease-in-out;
                animation: sk-rotatePlane 1.2s infinite ease-in-out;
     }

@-webkit-keyframes sk-rotatePlane {
  0% {
         -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg);
                 transform: perspective(120px) rotateX(0deg) rotateY(0deg); }

  50% {
        -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
                transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg); }

  100% {
            -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
                    transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg); } }

@keyframes sk-rotatePlane {
  0% {
         -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg);
                 transform: perspective(120px) rotateX(0deg) rotateY(0deg); }

  50% {
        -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
                transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg); }

  100% {
            -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
                    transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg); } }
/* end preloader */
li a
     {
         color: rgba(0, 0, 0, 0.8);
         font-weight: 400;
         font-size: 13px;
         text-transform: uppercase;       
         transition:all 0.4s easy-in-out;
        -webkit-transition:all 0.1s ease-in-out;
        -moz-transition:all 0.1s ease-in-out;
    }
li {
    list-style-type: none;
}
li a:hover
    {
        background: transparent;
        color: #00c77b;
        margin-top: -3px;
        text-decoration: none;
    }

 li.active > a
    {
         background-color: transparent;
         color: #00c77b;
    }
/* start navigation */
.custom-navbar 
    {
        margin-bottom: 0;
        background-color: #fff;
        text-align: right;
    }
.custom-navbar .navbar-brand 
    {
        color: #000000;
        font-weight: bold;
        font-size: 28px;
    }
.custom-navbar .nav li a
     {
         color: rgba(0, 0, 0, 0.8);
         font-weight: 400;
         font-size: 13px;
         text-transform: uppercase;
         transition:all 0.4s easy-in-out;
        -webkit-transition:all 0.1s ease-in-out;
        -moz-transition:all 0.1s ease-in-out;
    }
.custom-navbar .nav li a:hover
    {
        background: transparent;
        color: #fff;
        margin-top: -3px;
    }
.custom-navbar .nav li.active > a
    {
         background-color: transparent;
         color: #00c77b;
    }
.custom-navbar .navbar-toggle
    {
        border: none;
        padding-top: 10px;
    }
.custom-navbar .navbar-toggle .icon-bar
    {
        background: #00c77b;
        border-color: transparent;
    }
@media(min-width:768px){
    .custom-navbar
         {
             padding: 20px 0;
            border-bottom: 0;
             background: 0 .0;
             transition: all 0.3s ease;
         }
    .custom-navbar.top-nav-collapse
         {
            padding: 0;
            box-shadow: 0px 2px 8px 0px rgba(50, 50, 50, 0.08);
            background: #00c77b;
        }
}
/* end navigation */

/* start home */        
h5
    {
        font-size: 80px;
        font-weight: bold;
        line-height: 1em;
        letter-spacing: 2px;
        padding-top: 10px;
    }
 span
    {
        color: #00c77b;
        font-weight: bold;
    }
.btn {
    background: rgba(0,0,0,0.6);
    border: none;
    color: #f3f2f2;
}
.btn:hover {
    background: rgba(255,255,255,0.6);
}
.templatemo_homewrapper {
    padding-left: 15px;
    padding-right: 15px;
}
.flexslider {
    margin: 0 0 60px;
    background: #fff;
    padding: 0;
    position: relative;
    zoom: 1;
    background-color: #371604;
    overflow: hidden;
    margin: 0;
    text-align: center;
}
.flexslider .slides {
    padding: 0;
    zoom: 1;
}
.flexslider .slides img {
    width: 100%;
    min-width: 648px;
    min-height: 270px;
    display: block;
}
.flexslider .slides > li {
    display: none;  
    padding: 0;
    position: relative;
    -webkit-backface-visibility: hidden;
}
.flexslider img {
    position: relative;
    width: 100%;
}
.slider-caption {
    color:white;
    margin: 0;
    position: absolute;
    top: 0;
    left: 0;
    text-transform: uppercase;
    z-index: 7;
    width: 100%;
    height: 100%;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}
/* end home */

/* start service */
#service
    {
        background: #ffffff;
        padding-top: 80px;
        padding-bottom: 80px;
    }
#service .media
    {
        padding: 10px;
    }
#service .media .fa
    {
        color: #00c77b;
        font-size: 60px;
        margin-right: 20px;
        width: 65px;
        height: 65px;
    }
#service .media .media-heading
    {
        font-weight: 600;
        font-size: 20px;
        padding-bottom: 10px;
    }

.blockm {
background:#fff;
padding:15px;
margin-top:10px;
box-shadow: 0 2px 3px rgba(41, 41, 41, 0.27);
border-radius:25px;
margin:auto; 
width: 35%;
}    
.blockm li {
list-style-type:none;
display:inline;
padding: 10px;
} 
.mon {padding: 15px;}
.mon table {
  font-size: 14px;
  max-width: 70%;
  width: 70%;
  border-collapse: collapse;
  text-align: left;
  margin: auto;
}
.mon th {
  font-weight: normal;
  color: #039;
  border-bottom: 2px solid #6678b1;
  padding: 10px 8px;
}
.blockm li a {
  transition:all 0.4s easy-in-out;
}
.blockm li a:hover {
  margin-top:-1px;
}
.blockm li a:focus{text-decoration:none;}

.monl {
  border-bottom: 2px solid #6678b1;
  padding: 10px 8px;,
}
.mon td {
  color: #669;
  padding: 9px 8px;
  transition: .3s linear;
}
.mon tr:hover td{
  color: #6699ff;
}
.mon round {
    border-radius: 100px; /* Радиус скругления */
    border: 3px solid green; /* Параметры рамки */
    box-shadow: 0 0 7px #666; /* Параметры тени */
    
}
/* end service */
.short_info {
background:#fff;padding:20px;
margin-top:10px;
box-shadow: 0 2px 3px rgba(41, 41, 41, 0.27);
}
.short_info table {
    margin-left:85px;
width:100%;
    border-spacing: 10px 4px;
}
.short_info table tr td, .short_info table tr th {
width:33.3%;
}
.short_info table wtr thw {
    padding-bottom:12px;border-bottom: 1px solid #00c77b;text-align:left;font-size: 14px;color: #727272;
    max-width:15px;
}
.short_info  hr {
    border-bottom: 1px solid #00c77b;text-align:left;font-size: 14px;color: #727272;
    width:270px;
}
.short_info table tr td {
font-size: 25px;
    color: #00c77b;
}
.block-1 {
margin: auto; 
width: 80%;
}

.block-5 {
margin: auto; 
font-family: arial;
}
.block-3 {
background:  #fff;
}
.user_edit  ul {
  width: 289px;
  display: inline-block;
  list-style: none;
  margin-left:-4px; 
}

.user_edit  button[type="submit"],
.short_info button[type="submit"],
.marg button[type="submit"]{
border: 2px solid #00c77b;
color: #00c77b;
font-weight: bold;
transition:all 0.4s ease-in-out;
}

.user_edit input:hover,.short_info input:hover
{     
    border: solid 2px #00c77b;
    -webkit-box-shadow: 0 0 15px 1px rgba(0,163,182,.6); */
    -moz-box-shadow:0 0 15px 1px rgba(0,163,182,.6);
    box-shadow: 0 0 15px 1px rgba(0,163,182,.6); */
}
.short_info input
{
    transition:all 0.4s ease-in-out;
    border:solid 2px #00c77b;
    border-radius:2px;
    padding: 6px;
    margin-left: 15%; 
}
.marg{
margin: auto;
width: 15%;

}
.user_edit button[type="submit"]:hover,
.short_info button:hover,
.marg button:hover

{
    background: #00c77b;
    color: #fff;       
    border: solid 2px #00a86b;
    -webkit-box-shadow: 0 0 15px 1px rgba(0,163,182,.6); */
    -moz-box-shadow:0 0 15px 1px rgba(0,163,182,.6);
    box-shadow: 0 0 15px 1px rgba(0,163,182,.6); */
}
.user_edit{
background:#fff;padding:20px;margin-bottom:20px;
box-shadow: 0 2px 3px rgba(41, 41, 41, 0.27);
}
  .date{
font-size: 11px;
    float: right;
    padding: 5px;
    margin-top: -15px;
    text-transform: uppercase;
    border: 2px solid rgba(0, 219, 194, 0.63);
}
.margs{

    margin-left:35%; 
}


  .block_n{
background:#fff;padding:20px;margin-bottom:20px;
box-shadow: 0 2px 3px rgba(41, 41, 41, 0.27);
margin-left: 10%;margin-right:10%;  
}
  .r{
width: 80%;
}


/*
 * Animation for webkit
*/
@import url(http://weloveiconfonts.com/api/?family=fontawesome);
 
.fa {
 width: 60px;
 display: block;
 text-align: center;
 color:#990000;
 font:normal 45px 'FontAwesome';
 line-height:60px;
 text-rendering: auto;
 -webkit-font-smoothing: antialiased;
}
.fa-angle-double-down:before {content: "\f103";}
 
.bounce:hover {
 color:#00c77b;
 animation: bounce 0.5s infinite;
 -webkit-animation: bounce 0.5s infinite;
 -moz-animation: bounce 0.5s infinite;
 -o-animation: bounce 0.5s infinite;
}
 
@-webkit-keyframes bounce {
 0%, 20%, 50%, 80%, 100% {-webkit-transform: translateY(0);} 
 40% {-webkit-transform: translateY(-30px);}
 60% {-webkit-transform: translateY(-15px);}
}
 
@-moz-keyframes bounce {
 0%, 20%, 50%, 80%, 100% {-moz-transform: translateY(0);}
 40% {-moz-transform: translateY(-30px);}
 60% {-moz-transform: translateY(-15px);}
}
 
@-o-keyframes bounce {
 0%, 20%, 50%, 80%, 100% {-o-transform: translateY(0);}
 40% {-o-transform: translateY(-30px);}
 60% {-o-transform: translateY(-15px);}
}
@keyframes bounce {
 0%, 20%, 50%, 80%, 100% {transform: translateY(0);}
 40% {transform: translateY(-30px);}
 60% {transform: translateY(-15px);}
}
input:focus {
    border: solid 2px #00c77b;
    /* -webkit-box-shadow: 0 0 15px 1px rgba(0,163,182,.6); */
    -moz-box-shadow:0 0 15px 1px rgba(0,163,182,.6);
    /* box-shadow: 0 0 15px 1px rgba(0,163,182,.6); */
}
select:hover {
    -webkit-box-shadow: 0px 0px 20px rgba(0,163,182,.4);
    -moz-box-shadow: 0px 0px 20px rgba(0,163,182,.4);
    box-shadow: 0px 0px 20px rgba(0,163,182,.4);
}
.user_edit ul.right {float:inherit;margin-left:19px;}
.user_edit li {
  font-size: 14px;
  color: #727272;
  margin-top: 10px;
  padding: 2px;
  list-style-type: none;
  transition:all 0.4s easy-in-out;
  -webkit-transition:all 0.4s ease-in-out;
  -moz-transition:all 0.4s ease-in-out;
}
.user_edit li:hover {
transform:scale(1.5);
}
.user_edit ul li span {
float:right;
font-size: 15px;
    font-weight: bold;
    color: #00c77b;
  margin-top: -5px;
}
.user_edit li span {
font-weight: bold;
    text-transform: uppercase;
    color: #464545;
    }

.user_edit .form-control
    {
        background: transparent;
        border-radius: 5px;
        box-shadow: none;
        border: 1px solid #CCC;
        margin-bottom: 20px;
        transition: all 0.4s ease-in-out;
        font-family: arial;
    }



  .user_stats ul {
  width: 289px;
  display: inline-block;
  list-style: none;
  margin-left:55px; 
  margin-right:-14px;
}
  .user_stats{
background:#fff;padding:20px;margin-bottom:20px;
margin-top:10px;
margin-right:-14px;
box-shadow: 0 2px 3px rgba(41, 41, 41, 0.27);
margin-left:40px;
}
  .user_b{
background:#fff;padding:20px;margin-bottom:20px;
margin-top:82px;
}

.user_stats ul.right {float:inherit;margin-left:29px;}
.user_stats ul li {
font-size: 14px;
    color: #727272;
    padding-top:7px;
    border-bottom:1px solid #ddd;
  margin-top: 10px;
  transition:all 0.4s easy-in-out;
  -webkit-transition:all 0.4s ease-in-out;
  -moz-transition:all 0.4s ease-in-out;
}
.user_stats ul li:hover {
transform:scale(1.5) rotate(360deg) translate(0px, 3px) skew(0deg, -7deg);
}
.user_stats ul li span {
float:right;
font-size: 15px;
    font-weight: bold;
    color: #00c77b;
  margin-top: -5px;
}
.user_stats ul li span.none {
font-weight: bold;
    text-transform: uppercase;
    color: #e7e7e7;
    }
    
/* */
.team {
    margin-top: 10px;
    padding-bottom: 60px;
    background: white;
    height: 325px;
    box-shadow: 0 2px 3px rgba(0, 0, 0, 0.07);
}

.team .cover .overlay {
    height: 250px;
    padding-top: 60px;
    opacity: 0;
    background: rgba(0, 168, 255, 0.9);
    -webkit-transition: opacity 0.45s ease;
    transition: opacity 0.45s ease;
}

.team:hover .cover .overlay {
    opacity: 1;
}
.team .title {
    margin: 50px 0;
}
/* start divider */
.divider
    {
        background: url('../images/divider-bg.jpg');
        background-size: cover;
        background-repeat: no-repeat;
        background-attachment: fixed;
        color: #ffffff;
        text-align: center;
    }

.divider .divider-des
    {
        padding: 100px 15px;
    }
/* end divider */

/* start about */
h3.about-title {
    margin-top: 0;
}
#about
    {
        padding-top: 80px;
        padding-bottom: 80px;
    }
#about .progress
    {
        background: #f9f9f9;
        box-shadow: none;
        border-radius: 0px;
    }
#about .progress .progress-bar-danger
    {
        background: #00c77b;
    }
#about span
    {
        display: block;
        margin-top: 12px;
        margin-bottom: 6px;
    }
#about .about-wrapper
    {
        background: #ffffff;
        box-shadow: 0px 8px 2px 2px rgba(50,50,50, 0.08);
        margin-top: 60px;
        margin-bottom: 20px;
        max-width: 500px;
        padding: 20px;
    }
#about .about-wrapper h3
    {
        color: #00c77b;
        font-size: 20px;
        font-weight: bold;        
    }
/* end about */

/* start portfolio */
#portfolio
    {
        background: #fff;
        border-top: 1px solid #eeeeee;
        border-bottom: 1px solid #eeeeee;
        padding-top: 80px;
        padding-bottom: 80px;
    }
#portfolio .portfolio-thumb
    {
        overflow: hidden;
        margin: 0;
        position: relative;
    }
#portfolio .portfolio-thumb .portfolio-overlay
    {
        background: #333;
        color: #ffffff;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-align-items: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-justify-content: center;
            -ms-flex-pack: center;
                justify-content: center;
        top: 0;
        right: 0;
        left: 0;
        bottom: 0;
        width: 100%;
        height: 100%;
        text-align: center;
        position: absolute;
        opacity: 0;
        transition: all 0.4s ease-in-out;
    }
#portfolio .portfolio-thumb:hover .portfolio-overlay
    {
        opacity: 0.9;
    }
#portfolio .portfolio-thumb .portfolio-overlay .fa
    {
        border: 1px solid #ffffff;
        border-radius: 50%;
        color: #ffffff;
        width: 40px;
        height: 40px;
        line-height: 40px;
        text-align: center;
        text-decoration: none;
        margin-right: 6px;
        margin-bottom: 10px;
        transition: all 0.3s ease;
    }
#portfolio .portfolio-thumb .portfolio-overlay .fa:hover {
    background: #00c77b;
    border-color: #00c77b;
}
#portfolio .portfolio-thumb .portfolio-overlay h4
    {
        padding-bottom: 10px;
    }
    .portfolio-description {
        padding-left: 15px;
        padding-right: 15px;
    }
/*filter css*/
.filter-wrapper {
    width: 100%;
    margin: 0 0 24px 0;
    padding: 0;
    overflow: hidden;
    text-align: center;
}
.filter-wrapper li {
    display: inline-block;
    margin: 4px;
    transition: all 0.3s ease;
}
.filter-wrapper li:hover {
    background: #00c77b;
}
.filter-wrapper li:hover a {
    color: #fff;
}
.filter-wrapper li a {
    border: 1px solid #f2f2f2;
    color: #999;
    padding: 8px 17px;
    display: block;
    text-decoration: none;
}
/*isotope box css*/
.iso-box-section {
    width: 100%;
    margin: 0 0 24px 0;
}
.iso-box-wrapper {
    width: 100%;
    padding: 0;
    clear: both;
    position: relative;
}
.iso-box {
    position: relative;
    min-height: 50px;
    float: left;
    overflow: hidden;
    margin-bottom: 20px;
}
.fluid-img {
    width: 100%;
    display: block;
    height: auto;
}
/* end portfolio */

/* start contact */
#contact
    {
        background: #ffffff;
        padding-top: 80px;
        padding-bottom: 80px;
    }
#contact .form-control
    {
        background: transparent;
        border-radius: 0px;
        box-shadow: none;
        border: 1px solid #CCC;
        margin-bottom: 20px;
        transition: all 0.4s ease-in-out;
    }
#contact input
    {
        height: 50px;
    }
#contact input[type="submit"]
    {
        border: 2px solid #00c77b;
        font-weight: bold;
    color: #00c77b;
    }
#contact input[type="submit"]:hover
    {
        background: #00c77b;
    color: #fff;
    }
/* end contact */

/* start footer */
footer
    {
        background: #202020;
        color: #ffffff;
        text-align: center;
    }
footer p
    {
        display: block;
        padding-top: 40px;
    }
footer span
    {
        color: #00c77b;
        font-weight: bold;
    }
/* end footer */

/* start social icon */
.social-icon
    {
        display: block;
        position: relative;
        padding: 0;
        margin: 0;
        top: 20px;
    }
.social-icon li
    {
        display: inline-block;
        list-style: none;
        transition: all 0.4s ease-in-out;
        width: 40px;
        height: 40px;
    }
.social-icon li a
    {
        color: #fff;
        font-size: 30px;
        text-decoration: none;
        line-height: 40px;
        text-align: center;
    }
.social-icon li:hover
    {
        background: #00c77b;
    }
/* end social icon */
.progress .bar {
  float: left;
  width: 0;
  height: 100%;
  font-size: 12px;
  color: #ffffff;
  text-align: center;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  background-color: #00c77b;
  background-image: -moz-linear-gradient(top, #ff9447, #e05e00);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ff9447), to(#e05e00));
  background-image: -webkit-linear-gradient(top, #ff9447, #e05e00);
  background-image: -o-linear-gradient(top, #ff9447, #e05e00);
  background-image: linear-gradient(to bottom, #ff9447, #e05e00);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffff9447', endColorstr='#ffe05e00', GradientType=0);
  -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
     -moz-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
          box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-transition: width 0.6s ease;
     -moz-transition: width 0.6s ease;
       -o-transition: width 0.6s ease;
          transition: width 0.6s ease;
}

.progress .bar + .bar {
  -webkit-box-shadow: inset 1px 0 0 rgba(0, 0, 0, 0.15), inset 0 -1px 0 rgba(0, 0, 0, 0.15);
     -moz-box-shadow: inset 1px 0 0 rgba(0, 0, 0, 0.15), inset 0 -1px 0 rgba(0, 0, 0, 0.15);
          box-shadow: inset 1px 0 0 rgba(0, 0, 0, 0.15), inset 0 -1px 0 rgba(0, 0, 0, 0.15);
}

.progress-striped .bar {
  background-color: #ff9447;
  background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(255, 255, 255, 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.15)), color-stop(0.75, rgba(255, 255, 255, 0.15)), color-stop(0.75, transparent), to(transparent));
  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: -moz-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  -webkit-background-size: 40px 40px;
     -moz-background-size: 40px 40px;
       -o-background-size: 40px 40px;
          background-size: 40px 40px;
}

.progress.active .bar {
  -webkit-animation: progress-bar-stripes 2s linear infinite;
     -moz-animation: progress-bar-stripes 2s linear infinite;
      -ms-animation: progress-bar-stripes 2s linear infinite;
       -o-animation: progress-bar-stripes 2s linear infinite;
          animation: progress-bar-stripes 2s linear infinite;
}

.progress-danger .bar,
.progress .bar-danger {
  background-color: #dd514c;
  background-image: -moz-linear-gradient(top, #ee5f5b, #c43c35);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ee5f5b), to(#c43c35));
  background-image: -webkit-linear-gradient(top, #ee5f5b, #c43c35);
  background-image: -o-linear-gradient(top, #ee5f5b, #c43c35);
  background-image: linear-gradient(to bottom, #ee5f5b, #c43c35);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffee5f5b', endColorstr='#ffc43c35', GradientType=0);
}

.progress-danger.progress-striped .bar,
.progress-striped .bar-danger {
  background-color: #ee5f5b;
  background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(255, 255, 255, 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.15)), color-stop(0.75, rgba(255, 255, 255, 0.15)), color-stop(0.75, transparent), to(transparent));
  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: -moz-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
}

.progress-success .bar,
.progress .bar-success {
  background-color: #5eb95e;
  background-image: -moz-linear-gradient(top, #62c462, #57a957);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#62c462), to(#57a957));
  background-image: -webkit-linear-gradient(top, #62c462, #57a957);
  background-image: -o-linear-gradient(top, #62c462, #57a957);
  background-image: linear-gradient(to bottom, #62c462, #57a957);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff62c462', endColorstr='#ff57a957', GradientType=0);
}

.progress-success.progress-striped .bar,
.progress-striped .bar-success {
  background-color: #62c462;
  background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(255, 255, 255, 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.15)), color-stop(0.75, rgba(255, 255, 255, 0.15)), color-stop(0.75, transparent), to(transparent));
  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: -moz-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
}

.progress-info .bar,
.progress .bar-info {
  background-color: #4bb1cf;
  background-image: -moz-linear-gradient(top, #5bc0de, #339bb9);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#5bc0de), to(#339bb9));
  background-image: -webkit-linear-gradient(top, #5bc0de, #339bb9);
  background-image: -o-linear-gradient(top, #5bc0de, #339bb9);
  background-image: linear-gradient(to bottom, #5bc0de, #339bb9);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5bc0de', endColorstr='#ff339bb9', GradientType=0);
}

.progress-info.progress-striped .bar,
.progress-striped .bar-info {
  background-color: #5bc0de;
  background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(255, 255, 255, 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.15)), color-stop(0.75, rgba(255, 255, 255, 0.15)), color-stop(0.75, transparent), to(transparent));
  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: -moz-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
}

.progress-warning .bar,
.progress .bar-warning {
  background-color: #faa732;
  background-image: -moz-linear-gradient(top, #fbb450, #f89406);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#fbb450), to(#f89406));
  background-image: -webkit-linear-gradient(top, #fbb450, #f89406);
  background-image: -o-linear-gradient(top, #fbb450, #f89406);
  background-image: linear-gradient(to bottom, #fbb450, #f89406);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffbb450', endColorstr='#fff89406', GradientType=0);
}

.progress-warning.progress-striped .bar,
.progress-striped .bar-warning {
  background-color: #fbb450;
  background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(255, 255, 255, 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.15)), color-stop(0.75, rgba(255, 255, 255, 0.15)), color-stop(0.75, transparent), to(transparent));
  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: -moz-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
}
/* start media 980 */
@media screen and ( max-width: 980px ){
    #home h1
        {
            font-size: 40px;
            text-transform:uppercase;

        }
        h4:hover
        {
            font-size: 50px;
            text-transform:uppercase;

        }
    h2
        {
            font-size: 30px;
        }
    
}
/* end media 980 */
    .block-1 .block-2 .block-3 {  
      padding: 30px;
    }
    .shap {  
    display: block;
    font-size: 25px;
    margin-top: 15px;

    }
    .shap li {  
    display: block;
    font-size: 25px;
    margin-top: 15px;

    }
/* start media 768 */
@media screen and ( max-width: 767px ){
    h4 {
        padding-bottom: 20px;
    }
   #home h1
    {
        font-size: 40px;
    }
    #home {
        margin-top: 50px;
    }
    .templatemo-about-left {
        margin-bottom: 30px;
    }
    #about .about-wrapper {
        margin-left: auto;
        margin-right: auto;
    }
}
/* end media 768 */

@media screen and (max-width: 440px) {
    h4 {
        padding-bottom: 15px;
        line-height: 1.5em;
    }
    .filter-wrapper li {
        margin: 2px;
    }
    .filter-wrapper li a {
        padding: 6px 10px;
    }
}

@media screen and (max-width: 380px) {
    #service .media .fa {
        margin-right: 5px;
    }
}

/* start media 360 */
@media screen and ( max-width: 360px ){
    #home h1
        {
            font-size: 30px;
            line-height: 1.5em;
        }
}
/* end media 360 */

@media only screen and (min-width: 768px) {
  header[role=banner] {
    height: 80px;
  }
  header[role=banner] #cd-logo {
    margin: 20px 0 0 5%;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

.cd-intro {
  position: relative;
  height: 200px;
  line-height: 200px;
  text-align: center;
}
.cd-intro h1 {
  font-size: 22px;
  font-size: 1.375rem;
  color: rgba(52, 54, 66, 0.5);
}
@media only screen and (min-width: 600px) {
  .cd-intro {
    height: 300px;
    line-height: 300px;
  }
}
@media only screen and (min-width: 1170px) {
  .cd-intro h1 {
    font-size: 32px;
    font-size: 2rem;
  }
}

/* -------------------------------- 

xnugget info 

-------------------------------- */
.cd-nugget-info {
  text-align: center;
  position: absolute;
  width: 100%;
  height: 50px;
  line-height: 50px;
  bottom: 0;
  left: 0;
}
.cd-nugget-info a {
  position: relative;
  display: inline-block;
  padding: 0 2em;
  background-color: #da5067;
  border-radius: 50em;
  font-size: 16px;
  color: #fff;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  transition: all 0.2s;
}
.no-touch .cd-nugget-info a:hover {
  opacity: .8;
}
.cd-nugget-info span {
  display: inline-block;
}
.cd-nugget-info span svg {
  display: block;
}
.cd-nugget-info .cd-nugget-info-arrow {
  fill: #fff;
}

/* -------------------------------- 

xsigin/signup popup 

-------------------------------- */
.cd-user-modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(52, 54, 66, 0.9);
  z-index: 3;
  overflow-y: auto;
  cursor: pointer;
  visibility: hidden;
  opacity: 0;
  -webkit-transition: opacity 0.3s 0, visibility 0 0.3s;
  -moz-transition: opacity 0.3s 0, visibility 0 0.3s;
  transition: opacity 0.3s 0, visibility 0 0.3s;
}
.cd-user-modal.is-visible {
  visibility: visible;
  opacity: 1;
  -webkit-transition: opacity 0.3s 0, visibility 0 0;
  -moz-transition: opacity 0.3s 0, visibility 0 0;
  transition: opacity 0.3s 0, visibility 0 0;
}
.cd-user-modal.is-visible .cd-user-modal-container {
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  -o-transform: translateY(0);
  transform: translateY(0);
  transition:all 0.4s ease-in-out;
}
.cd-user-modal-container {
  position: relative;
  width: 90%;
  max-width: 600px;
  background: #FFF;
  margin: 3em auto 4em;
  cursor: auto;
  border-radius: 0.25em;
  -webkit-transform: translateY(-30px);
  -moz-transform: translateY(-30px);
  -ms-transform: translateY(-30px);
  -o-transform: translateY(-30px);
  transform: translateY(-30px);
  -webkit-transition-property: -webkit-transform;
  -moz-transition-property: -moz-transform;
  transition-property: transform;
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
  transition-duration: 0.3s;
}
.cd-user-modal-container .cd-switcher:after {
  content: "";
  display: table;
  clear: both;
}
.cd-user-modal-container .cd-switcher li {
  width: 50%;
  float: left;
  text-align: center;
  list-style:none;
}
.cd-user-modal-container .cd-switcher li:hover {
  margin-top: -3px;
         transition:all 0.4s easy-in-out;
        -webkit-transition:all 0.1s ease-in-out;
        -moz-transition:all 0.1s ease-in-out;

}
.cd-user-modal-container .cd-switcher a:hover {

  margin-top: -3px;
  transition:all 0.4s easy-in-out;
  -webkit-transition:all 0.1s ease-in-out;
  -moz-transition:all 0.1s ease-in-out;
  text-decoration: none;

}
.cd-user-modal-container .cd-switcher li:first-child a {
  border-radius: .25em 0 0 0;
}
.cd-user-modal-container .cd-switcher li:last-child a {
  border-radius: 0 .25em 0 0;
}
.cd-user-modal-container .cd-switcher a {
  display: block;
  width: 100%;
  height: 50px;
  line-height: 50px;
  background: #d2d8d8;
  color: #809191;
  text-decoration: none;
}
.cd-user-modal-container .cd-switcher a.selected {
  background: #FFF;
  color: #505260;
}
@media only screen and (min-width: 600px) {
  .cd-user-modal-container {
    margin: 4em auto;
  }
  .cd-user-modal-container .cd-switcher a {
    height: 70px;
    line-height: 70px;
  }
}
.cd-form {
  padding: 0;
}
.cd-form li{
  margin-left:33%; 
}
.cd-form .fieldset {
  position: relative;
  margin: 1.4em 0;
}
.cd-form .fieldset:first-child {
  margin-top: 0;
}
.cd-form .fieldset:last-child {
  margin-bottom: 0;
}
.cd-form label {
  font-size: 14px;
  font-size: 0.875rem;
}
.cd-form label.image-replace {
  /* заменить текст с иконой */
  display: inline-block;
  position: absolute;
  left: 15px;
  top: 50%;
  bottom: auto;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  height: 20px;
  width: 20px;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  color: transparent;
  text-shadow: none;
  background-repeat: no-repeat;
  background-position: 50% 0;
}
/* Иконки полей ввода */
.cd-form label.cd-username {
  background-image: url("../img/cd-icon-username.svg");
}
.cd-form label.cd-email {
  background-image: url("../img/cd-icon-email.svg");
}
.cd-form label.cd-password {
  background-image: url("../img/cd-icon-password.svg");
}
.cd-form label.cd-donate {
  background-image: url("http://dodgeram.ru/templates/jf_social/images/icons/shopping_cart_icon.png");
}
.cd-form input {
  margin: 0;
  padding: 0;
  border-radius: 0.25em;
}
.cd-form input.full-width {
  width: 100%;
}
.cd-form  input.has-padding {
  padding: 12px 20px 12px 50px;
}
.cd-form input.has-border {
  border: 1px solid #d2d8d8;
  transition:all 0.2s ease-in-out;  
}
.cd-form input:hover {
    -webkit-box-shadow: 0 0 15px 1px rgba(0,163,182,.6); */
    -moz-box-shadow:0 0 15px 1px rgba(0,163,182,.6);
    box-shadow: 0 0 15px 1px rgba(0,163,182,.6); */
}
.cd-form input.has-border:focus {
  border-color: #343642;
  box-shadow: 0 0 5px rgba(52, 54, 66, 0.1);
  outline: none;
}
.cd-form input.has-error {
  border: 1px solid #d76666;
}
.cd-form input[type=password] {
  /* пространство для кнопки Скрыть */
  padding-right: 65px;
}
.cd-form button {
  padding: 16px 0;
  cursor: pointer;
  background: #00c77b;
  color: #FFF;
  font-weight: bold;
  border: none;
  width: 100%;
  transition: all 0.4s ease-in-out;
}
.no-touch .cd-form button:hover{
  outline: none;
    -webkit-box-shadow: 0 0 15px 1px rgba(0,163,182,.6); */
    -moz-box-shadow:0 0 15px 1px rgba(0,163,182,.6);
    box-shadow: 0 0 15px 1px rgba(0,163,182,.6); */  
}
.no-touch .cd-form  input:hover{
  outline: none;
    -webkit-box-shadow: 0 0 15px 1px rgba(0,163,182,.6); */
    -moz-box-shadow:0 0 15px 1px rgba(0,163,182,.6);
    box-shadow: 0 0 15px 1px rgba(0,163,182,.6); */  
}
.cd-form .hide-password {
  display: inline-block;
  position: absolute;
  right: 0;
  top: 0;
  padding: 6px 15px;
  border-left: 1px solid #d2d8d8;
  top: 50%;
  bottom: auto;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  font-size: 14px;
  font-size: 0.875rem;
  color: #343642;
}
.cd-form .cd-error-message {
  display: inline-block;
  position: absolute;
  left: -5px;
  bottom: -35px;
  background: rgba(215, 102, 102, 0.9);
  padding: .8em;
  z-index: 2;
  color: #FFF;
  font-size: 13px;
  font-size: 0.8125rem;
  border-radius: 0.25em;
  /* предотвращения кликов и прикосновения */
  pointer-events: none;
  visibility: hidden;
  opacity: 0;
  -webkit-transition: opacity 0.2s 0, visibility 0 0.2s;
  -moz-transition: opacity 0.2s 0, visibility 0 0.2s;
  transition: opacity 0.2s 0, visibility 0 0.2s;
}
.cd-form .cd-error-message::after {
  /* уголок сообщения об ошибке */
  content: '';
  position: absolute;
  left: 22px;
  bottom: 100%;
  height: 0;
  width: 0;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 8px solid rgba(215, 102, 102, 0.9);
}
.cd-form .cd-error-message.is-visible {
  opacity: 1;
  visibility: visible;
  -webkit-transition: opacity 0.2s 0, visibility 0 0;
  -moz-transition: opacity 0.2s 0, visibility 0 0;
  transition: opacity 0.2s 0, visibility 0 0;
}
@media only screen and (min-width: 600px) {
  .cd-form {
    padding: 2em;
  }
  .cd-form .fieldset {
    margin: 2em 0;
  }
  .cd-form .fieldset:first-child {
    margin-top: 0;
  }
  .cd-form .fieldset:last-child {
    margin-bottom: 0;
  }
  .cd-form input.has-padding {
    padding: 16px 20px 16px 50px;
  }
  .cd-form input[type=submit] {
    padding: 16px 0;
  }
}
.cd-form-message {
  padding: 1.4em 1.4em 0;
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 1.4;
  text-align: center;
}
@media only screen and (min-width: 600px) {
  .cd-form-message {
    padding: 2em 2em 0;
  }
}
.cd-form-bottom-message {
  position: absolute;
  width: 100%;
  left: 0;
  bottom: -30px;
  text-align: center;
  font-size: 14px;
  font-size: 0.875rem;
}
.cd-form-bottom-message a {
  color: #FFF;
  text-decoration: underline;
}
.cd-close-form {
  /* стиль X кнопки вверху справа */
  display: block;
  position: absolute;
  width: 40px;
  height: 40px;
  right: 0;
  top: -40px;
  background: url("../img/cd-icon-close.svg") no-repeat center center;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
}
@media only screen and (min-width: 1170px) {
  .cd-close-form {
    display: none;
    transition:all 0.4s ease-in-out;
  }
}
#cd-login, #cd-signup, #cd-reset-password {
  display: none;
}
#cd-login.is-selected, #cd-signup.is-selected, #cd-reset-password.is-selected {
  display: block;
}