/*==========================================================================
[Master Stylesheet]
Project:		Promigo
Version:		1
Last change:	30/6/2016 [no Change]
Primary use:	Coffee template
 ==========================================================================*/
/*==========================================================================
[Table of contents]
1 import css files
2 general setting
3 margin
4 backgrounds colors styles
5 buttons 
1-1 headers
2-1 social icons
3-1 mobile nav menu
4-1 heading
5-1 sliders, banner
6-1 features
7-1 our story
8-1 blog
9-1  team
10-1 gellary
11-1 accordion
12-1 Subscribe
13-1 clients 
14-1 events
15-1 contact
16-1 page title
17-1 About page
18-1 blog 
19-1 blog pages
20-1  comments erea
21-1 cart page
22-1 produst pages
23-1 shop pages
24-1 error 404 page
25-1 pagination
26-1 coming soon page
27-1 footer
28-1 responsive
==========================================================================*/
@import url(animate.css);
@import url(animsition.min.css);
@import url(jquery.fancybox.css);
@import url(owl.carousel.css);
@import url(ritag-icons.css);
@import url(slider-pro.min.css);
@import url(themifyicons.css);
@import url(jquery.mmenu.all.css);
/* ==========================================================================
genneral setting
 ========================================================================== */
*{
    padding:0;
    margin:0;
    font-family: 'Ubuntu', sans-serif;
}

html,body{
    height: 100%;
    line-height: 1.5;    
}

h1,h2,h3,h4,h5,h6{
    line-height: 1.5;
    font-family: 'Open Sans Condensed', sans-serif;
    margin: 0 0 15px 0;
    position: relative;
    -webkit-transition: 0.2s ease-in;
    -moz-transition: 0.2s ease-in;
    transition: 0.2s ease-in;
    font-weight:bold;

}

ul,ol{
    list-style: none;
    margin: 0;
    padding: 0;
    color: #8d8d8d
}

section{
    padding: 80px 0;
    position: relative
}

h1{
    font-size: 52px;

}

h2{
    font-size: 32px;
}

h3{
    font-size: 27px;
}

h4{
    font-size: 20px;
}

p{
    position: relative;
    font-size: 14px;
    color: #8d8d8d;
    line-height: 23px
}

a,a:hover,a:focus{
    text-decoration: none;
    -webkit-transition: 0.2s ease-in;
    -moz-transition: 0.2s ease-in;
    transition: 0.2s ease-in;
}
input,textarea,select{
    border: 1px solid #cfcfcf;
    width: 100%;
    height: 40px;
    padding: 15px;
    background: 0 0;
    margin-bottom: 30px;
}

input[type='number'] { -moz-appearance:textfield; }
input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; }
textarea{height: 80px;}

select{
    padding: 0 15px;
}

.bg-parallax{
    background:center center fixed  ;
    background-size: cover;
}

.fw-parallax{
    background:center center;
    background-size: cover;
    height:450px;
}


.site-loading{
    background: #252424 url(../img/loader.svg)no-repeat center center;
    height: 100%;
    width: 100%;
    position:fixed;
    top:0;
    z-index:100;
    text-align: center;
    font-size: 30px
}
/* ==========================================================================
        margin 
 ========================================================================== */
.m-top-30{
    margin-top: 30px
}

.m-top-40{
    margin-top: 40px
}

.m-top-50{
    margin-top:  50px
}

.m-top-60{
    margin-top:  60px
}

.m-top-70{
    margin-top:  70px
}

.m-top-80{
    margin-top:  80px
}

.m-bottom-30{
    margin-bottom: 30px
}

.m-bottom-40{
    margin-bottom: 40px
}

.m-bottom-50{
    margin-bottom: 50px
}

.m-bottom-60{
    margin-bottom: 60px
}

.m-bottom-70{
    margin-bottom: 70px
}

.m-bottom-80{
    margin-bottom: 80px
}
/* ==========================================================================
colors & background colors
 ========================================================================== */
.r-overlay-dark{
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-color: rgba(0,0,0,0.8);
}
.r-overlay-light{
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-color: rgba(255,255,255,0.8);
}

/* ==========================================================================
colors & background colors
 ========================================================================== */
.transparent{background: transparent!important;}
.bg-white{background: #fff !important;}
.bg-orang{background: #736e6a !important;}
.bg-defult{background: #ff9700 !important;}
.bg-black{background: #222 !important;}
.bg-gray{background: #f6f6f6 !important;}
.bg-brown{background: #736e6a !important;}
.bg-blue{background: #33c6f4 !important;}

.color-white{color:  #fff !important;}
.color-orang{color: #b61c12 !important;}
.color-defult{color: #b61c12 !important;}
.color-black{color: #222 !important;}
.color-gray{color: #f6f6f6 !important;}
.color-brown{color: #6b412c !important;}
.color-blue{color: #33c6f4 !important;}

.hover-white:hover{color:  #fff !important;}
.hover-orang:hover{color: #ff9700 !important;}
.hover-defult:hover{color: #ff9700 !important;}
.hover-black:hover{color: #222 !important;}
.hover-gray:hover{color: #f6f6f6 !important;}
.hover-brown:hover{color: #d48f52 !important;}
.hover-blue:hover{color: #33c6f4 !important;}
/* ==========================================================================
buttons
 ========================================================================== */
.btn{
    text-transform: uppercase;
    -webkit-transition: 0.2s ease-in;
    -moz-transition: 0.2s ease-in;
    transition: 0.2s ease-in;

}

.btn-hover-brown:hover{
    background-color: #5f3a27 !important;
    border-color: #5f3a27 !important;
}

.btn-hover-blue:hover{
    background-color:  #33c6f4  !important;
    border-color: #33c6f4  !important;

}

.r-btn-default,.r-btn-primary,.r-btn-success,.r-btn-info,
.r-btn-warning,.r-btn-danger,.r-btn-link,.r-btn-brown{
    padding: 7px 20px;
    border-radius: 0;
    color: #fff
}
.r-btn-brown{
    background: #6b412c
}
.r-btn-brown:hover{
    background: #5f3a27;
    color: #fff
}
.btn-default,.r-btn-default{color: #333;}

.btn-default:hover,.r-btn-default:hover{
    background: #e41a0d;
    color: #fff;
    border-color:#e41a0d;
}

.btn-warning,.r-btn-warning{
    background: #b61c12;;
}
.r-btn-info{
    background: #33c6f4
}
/* ==========================================================================
header
 ========================================================================== */
.top-nav{padding: 10px 0;}

.email,.phone{
    text-align: left;
    color: #777777;
    float: left;
    margin-right: 15px;
    position: relative;
    top: 6px;
}

.email span,.phone span{
    color: #fff;
    margin-right: 8px
}

.top-social {
    float: right;
}

.navbar-default{
    margin: 0;
    min-height: 50px;
    background: #fff;
    border: 0;
    border-radius: 0
}


.navbar-default.bg-black{
    background: #000!important
}

.navbar-default.bg-black .navbar-nav>li>a{
    color: #fff    
}

.navbar-nav>li>a{
    line-height: 50px;
    text-transform: uppercase;
}

.navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:focus, .navbar-default .navbar-nav>.open>a:hover,
.navbar-default .navbar-nav>li>a:focus, .navbar-default .navbar-nav>li>a:hover{
    color: #ff9700;
    background: 0 0    
}
.blue-header .navbar-nav>.open>a,.blue-header .navbar-nav>.open>a:focus,.blue-header .navbar-default .navbar-nav>.open>a:hover,
.blue-header .navbar-nav>li>a:focus,.blue-header .navbar-nav>li>a:hover{
    color:#33c6f4
}
.blue-header .dropdown-menu>li>a:focus,.blue-header .dropdown-menu>li>a:hover{
    background: #33c6f4
}

.brown-header .navbar-nav>.open>a,.blue-header .navbar-nav>.open>a:focus,.brown-header .navbar-nav>.open>a:hover,
.brown-header .navbar-nav>li>a:focus,.brown-header .navbar-nav>li>a:hover{
    color:#d48f52
}
.brown-header .dropdown-menu>li>a:focus,.brown-header .dropdown-menu>li>a:hover{
    background: #d48f52
}

.navbar-nav>li>.dropdown-menu{
    padding: 0;
    width: 200px

}

.dropdown-menu>li>a{
    padding: 10px 20px;
    text-transform: capitalize
}

.dropdown-menu>li>a i{
    position: absolute;
    right: 15px;
    top: 15px;
    font-size: 11px;
}

.dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover{
    color: #fff;
    background: #ff9700
}

.navbar-brand{
    display: inline-block;
    line-height: 50px;
}
.navbar-brand>img{
    display: inline-block;
}

/*dropdown*/
.dropdown-menu{
    padding: 0

}
.dropdown-menu>li{
    position:relative;
    -webkit-user-select: none; /* Chrome/Safari */        
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* IE10+ */
    /* Rules below not implemented in browsers yet */
    -o-user-select: none;
    user-select: none;
    cursor:pointer;
}

.dropdown-menu .sub-menu {
    left: 100%;
    position: absolute;
    top: -3px;
    visibility: hidden;
    border-radius: 0 
}

.dropdown-menu li:hover .sub-menu {
    visibility: visible;
}

.dropdown:hover .dropdown-menu {
    display: block;
}
/*cart*/
.shop-cart{
    padding: 20px 15px !important;
    width: 270px;
    background: #fff;
    position: absolute;
    top: 98%;
    z-index: 10;
    display: none;
    float: left;
    left: auto;
    right: 0;
    padding: 5px 0;
    margin: 2px 0 0;
    font-size: 14px;
    text-align: left;
    list-style: none;
    background-color: #fff;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    border: 1px solid #ccc;
    border: 1px solid rgba(0,0,0,.15);
    border-radius: 4px;
    -webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175);
    box-shadow: 0 6px 12px rgba(0,0,0,.175);
}

.shop-cart .item{
    position: relative;
    padding: 10px 0;
    border-bottom: 1px solid #000
}
.shop-cart .item:last-child{
    border: none
}
.shop-cart p a{
    color:  #000;
    font-weight: bold;
    font-size: 13px;
    text-transform: capitalize;
}
.shop-cart img{
    float: left;
    margin-right: 15px
}
.shop-cart .desc{padding-right: 13px}
.shop-cart .r-close{
    position: absolute;
    right: 0;
    top: 15px;
    font-size: 11px;
    color: #000;
    font-weight: bold;
    cursor: pointer;
}

.shop-cart span{
    color: #ff9700;
    font-weight: bold
}

.total {
    padding: 10px;
    background: #F6F6F6;
    margin: 10px 0 20px 0;
    color: #333;
}

.total_left{
    float:left;
}
.total_right{
    float:right;
    color:#ff9700;
    font-weight:600;
}

.nav-search{
    padding: 20px 15px !important;
    width: 270px;
    background: #fff;
    position: absolute;
    top: 98%;
    z-index: 10;
    display: none;
    float: left;
    left: auto;
    right: 0;
    padding: 5px 0;
    margin: 2px 0 0;
    font-size: 14px;
    text-align: left;
    list-style: none;
    background-color: #fff;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    border: 1px solid #ccc;
    border: 1px solid rgba(0,0,0,.15);
    border-radius: 4px;
    -webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175);
    box-shadow: 0 6px 12px rgba(0,0,0,.175);
}

.nav-search input{
    margin: 0
}

/* ==========================================================================
mobile nav menu
 ========================================================================== */
#menuu{
    background: #313131
}

#menuu a{
    color: #fff;
    text-transform: uppercase;
    font-size: 13px;
    font-family: 'Lato', sans-serif;
}
.mm-menu em.mm-counter,
.mm-menu .mm-listview > li .mm-next:after, .mm-menu .mm-listview > li .mm-arrow:after,
.mm-menu .mm-navbar .mm-btn:before, .mm-menu .mm-navbar .mm-btn:after{
    color: #fff;
    border-color: #fff
}

.mm-close:after {
    content: "\e646";
    font-family: 'themify';}

.mm-menu > .mm-navbar{
    background: rgb(37, 38, 39);
}
.mm-menu > .mm-navbar img{   
    height: 30px;
    margin-top: -4px;}

.mm-panels > .mm-panel > .mm-navbar + .mm-listview {
    margin-top: -10px; }

.mm-close.mm-btn{
    font-size: 20px !important;
    top: 0px;

}
.mm-panels>.mm-panel>.mm-listview{
    margin: 0
}
.sidebar-search input{
    height: 30px;
    background: #252627;
    border: 1px solid #ff9700;
    border-radius: 5px;
    width: 80%;
    color: #fff;
    padding: 0 15px;
}
.sidebar-search button{
    border: 1px solid #ff9700;
    background: #252627;
    color: #fff;
    height: 30px;
    width: 16%;
    border-radius: 5px;
    font-size: 14px;
    margin-left: 5px;
}

#bottom-m-nav{
    background: #ff9700
}

/* ==========================================================================
social icons
 ========================================================================== */
.social-icon li{
    display: inline-block
}

.social-icon li a{
    display: inline-block;
    text-align: center;
    width: 30px;
    height: 30px;
    margin: 0 3px;
    line-height: 30px;
    border: 1px solid #525252;
    color: #8d8d8d;
    border-radius: 3px;
    -webkit-transition: 0.2s ease-in;
    -moz-transition: 0.2s ease-in;
    transition: 0.2s ease-in;
}
/* ==========================================================================
heading
 ========================================================================== */
.heading{
    margin-bottom: 60px;
    position: relative;
}

.heading h2{
    text-transform: capitalize;
    position: relative;
    padding-bottom: 25px;
    margin-bottom: 30px
}

.heading h2:before{
    content: "";
    position: absolute;
    margin: 0 auto;
    height: 4px;
    width: 50px;
    bottom: 0;
    left: 0;
    right: 0;
}

.heading-defult-color h2:before{
    background: #ff9700
}

.heading-blue h2:before{
    background: #33c6f4
}
.heading-brown h2:before,.heading-2.heading-brown:before{
    background: #d48f52 !important
}

.heading-2{
    margin-bottom: 60px;
    position: relative;
    padding-left: 60px;
}

.heading-2:before{
    content: "";
    position: absolute;
    top: 18px;
    left: 0;
    height:4px;
    width:50px;
    background: #C5C5C5;
}
/* ==========================================================================
sliders, banner
 ========================================================================== */
.banner-1{
    text-align: center;
    height: 100vh ;
    width: 100%;
    position: relative;
    z-index: 1;
    overflow: hidden

}

.banner-caption{
    display: table;
    width: 100%;
    height: 100vh;
    text-align: center;
}

.banner-caption-inner{
    display: table-cell;
    height: 100%;
    vertical-align: middle;
}

.banner-caption h1{
    font-weight: bold;
    text-transform: capitalize;
    position: relative;
    z-index: 1;
    margin: 0 0 40px 0;
    letter-spacing: 8px
}

.banner-caption p{
    font-size: 16px;
    position: relative;
    z-index: 1;
    letter-spacing: 3px;
    margin: 0 0 40px 0;
}

.banner-buttons{
    margin-left: -15px;
    position: relative
}
.banner-buttons a{
    margin: 0 15px;
}


#ritag-hero-slider{
    overflow: hidden
}
.sp-layer[class^="sp-layer bg-"]{
    padding: 5px 20px
}

#ritag-hero-slider .big-caption{
    font-size: 70px;
    font-weight: bold;
    letter-spacing: 5px;
    display: inline-block;

}
#ritag-hero-slider p{
    font-size: 20px;
    margin: auto!important;
}

#ritag-hero-slider a{
    font-size: 18px    
}

#ritag-hero-slider.sp-horizontal .sp-next-arrow,
#g-slider.sp-horizontal .sp-next-arrow,
#sh-slider.sp-horizontal .sp-next-arrow{
    right:25px;
}

#ritag-hero-slider.sp-horizontal .sp-previous-arrow,
#g-slider.sp-horizontal .sp-previous-arrow,
#sh-slider.sp-horizontal .sp-previous-arrow{
    left:25px;
}
#ritag-hero-slider.sp-horizontal .sp-previous-arrow,
#ritag-hero-slider.sp-horizontal .sp-next-arrow,
#g-slider.sp-horizontal .sp-previous-arrow,
#g-slider.sp-horizontal .sp-next-arrow,
#sh-slider.sp-horizontal .sp-previous-arrow,
#sh-slider.sp-horizontal .sp-next-arrow{
    font-size: 20px;
    text-align: center;
    background: #fff;
    height: 50px;
    width: 50px;
    line-height:50px;
    border-radius: 50%;
    -webkit-transition: 0.2s ease-out;
    -moz-transition: 0.2s ease-out;
    transition: 0.2s ease-out;
}

.sp-next-arrow:after, 
.sp-previous-arrow:after{
    content: none
}

.sp-next-arrow:before{
    content: "\e628";
    font-family: 'themify';
}

.sp-previous-arrow:before{
    content: "\e629";
    font-family:'themify';
}

.sp-next-arrow:before,.sp-previous-arrow:before{
    -webkit-transform: skew(0);
    -ms-transform: skew(0);
    transform: skew(0);
    background: 0 0;
}

#ritag-hero-slider.sp-horizontal .sp-next-arrow:hover,
#ritag-hero-slider.sp-horizontal .sp-previous-arrow:hover,
#g-slider.sp-horizontal .sp-next-arrow:hover,
#g-slider.sp-horizontal .sp-previous-arrow:hover,
#sh-slider.sp-horizontal .sp-next-arrow:hover,
#sh-slider.sp-horizontal .sp-previous-arrow:hover{
    color: #fff;
    background: #ff9700
}

.brown-arrows#ritag-hero-slider.sp-horizontal .sp-next-arrow:hover,
.brown-arrows#ritag-hero-slider.sp-horizontal .sp-previous-arrow:hover,
.brown-arrows#g-slider.sp-horizontal .sp-next-arrow:hover,
.brown-arrows#g-slider.sp-horizontal .sp-previous-arrow:hover,
.brown-arrows#sh-slider.sp-horizontal .sp-next-arrow:hover,
.brown-arrows#sh-slider.sp-horizontal .sp-previous-arrow:hover{
    background: #6b412c
}
/* ==========================================================================
features
 ========================================================================== */
.icon-box-item-1 span{
    position: relative;
    display: inline-block;
    width: 100px;
    height: 100px;
    line-height: 100px;
    color: #fff;
    border-radius: 50%;
    z-index: 1;
    margin-bottom: 30px;
    font-size: 32px;
}

.icon-box-item-1 span:before{
    content: "";
    position: absolute;
    top: 5px;
    left: 5px;
    right: 5px;
    bottom: 5px;
    background-color: #403f3f;
    border-radius: 50%;
    z-index: -1;
    -webkit-transform: scale(1.8);
    -moz-transform: scale(1.8);;
    -ms-transform: scale(1.8);;
    transform: scale(1.8);
    -webkit-transition: 0.2s linear;
    -moz-transition: 0.2s linear;
    -o-transition: 0.2s linear;
    opacity: 0
}

.icon-box-item-1:hover span:before{
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    opacity: 1
}

.icon-box-item-1 h4{
    margin-bottom: 20px;
    text-transform: uppercase;
    font-weight: bold;
}

.feature-1{
    border: 1px solid #d4d4d4;
    padding: 30px;
    position: relative;
    margin-bottom: 30px;
    -webkit-transition: 0.2s linear;
    -moz-transition: 0.2s linear;
    transition: 0.2s linear;
}
.feature-1 span{
    float: left;
    overflow: hidden;
    margin-right: 20px;
    font-size: 30px;
    -webkit-transition: 0.2s linear;
    -moz-transition: 0.2s linear;
    transition: 0.2s linear;
}

.feature-1 .content{
    overflow: hidden
}

.feature-1 h4{
    font-weight: bold;
    text-transform: uppercase;
    -webkit-transition: 0.2s linear;
    -moz-transition: 0.2s linear;
    transition: 0.2s linear;
}

.feature-1 a{
    position: absolute;
    bottom: 0;
    right: 0;
    width: 30px;
    height: 30px;
    line-height: 35px;
    background: #d4d4d4;
    text-align: center;
    color: #000;
    -webkit-transition: 0.2s linear;
    -moz-transition: 0.2s linear;
    transition: 0.2s linear;
}
.feature-1:hover{
    background: #ff9700;
}

.feature-1:hover p,.feature-1:hover span{
    color: #fff !important;
}

.feature-1:hover a{
    background: #fff;
    color: #ff9700
}


.feature-2{
    background: #fff;
    border: 1px solid #d4d4d4;
    padding: 10px;
    position: relative;
    margin-bottom: 30px;
    text-align: center
}

.feature-2 img{
    float: left;
    margin-right: 10px;

}

.feature-2 h4{
    font-family: 'Ubuntu', sans-serif;
    text-transform: uppercase;
    margin:15px 0  30px 0;

}

.feature-2 p{
    border-bottom: 1px solid #eaeaea;
    margin-bottom: 20px;
    padding-bottom: 20px;
    overflow: hidden;
    font-size: 25px;
}

.feature-2 .rate {
    float: left;
    color:#ff9700;
    margin-top: 5px;
}

.feature-2 .price{
    float: right;
    font-size: 18px;
    font-weight: bold;
    color: #a4a3a3
}
.feature-3{
    transition: 0.2s linear;
}
.feature-3:hover{
    box-shadow: 0 4px 8px rgb(175,175,175);
    background: #fff
}

.feature-3 .content{
    padding: 30px 20px;
    background-color: #fafafa
}

.feature-3 .content h4,.feature-3 .content h4 a{
    border-bottom: 1px solid #eaeaea;
    padding-bottom: 20px;
    font-weight: bold;
    color: #333;
    text-transform: capitalize
}

.feature-3 .content h4:hover,.feature-3 .content h4 a:hover{
    color: #33c6f4
}
.feature-3 .content p,.feature-3 .content p a{
    color: #909faa;
}
.menu-item-cercle {
    margin-bottom: 50px
}
.menu-item-cercle img{
    float: left;
    margin-right: 20px;
    overflow: hidden;
    margin-top: -15px;
}

.menu-item-cercle .content{
    margin-top: 10px;
    overflow: hidden
}

.menu-item-cercle h4 a{
    border-bottom: 1px solid #4d4940;
    padding-bottom: 15px;
    display: block;
    color: #333;
    font-weight: bold
}

.menu-item-cercle p span{
    float: right;
    font-size: 18px;
    font-weight: bold;
}

.services-item-1{
    margin-bottom: 30px;
    background: #f7f7f7;
    padding-right: 20px;
}

.services-item-1 h4{
    font-weight: bold;
    margin-top: 20px;
    text-transform: uppercase
}


.services-item-1 img{
    float: left;
    margin-right: 20px
}
/* ==========================================================================
our story
 ========================================================================== */
.our-story{
    position: relative
}

.our-story-inner{

}

.our-story-item{
    overflow: hidden;
    position: relative
}
.our-story-content{
    padding: 60px 30px;
}

.our-story-content .heading-2{
    margin-bottom: 30px
}
.our-story-content span{
    font-size: 20px;
    text-transform: capitalize;
    display: inline-block;
    margin-bottom: 20px
}

.our-story-content h4{
    font-weight: bold
}

.our-story-content p{
    margin-bottom: 25px;
    text-align: left
}

.img-holder {
    overflow: hidden;
    padding: 0px;
    position: absolute;
    top: 0;
    height: 100%;
}

.img-holder-right {
    overflow: hidden;
    padding: 0px;
    position: absolute;
    top: 0;
    left: auto;
    right: 0;
    height: 100%;
}

.background-imgholder {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-size: cover;
}

.background-imgholder-right {
    position: absolute;
    top: 0;
    right:  0;
    height: 100%;
    width: 100%;
    background-size: cover;
}
/* ==========================================================================
blog
 ========================================================================== */
.recent-blog-item img{
    margin-bottom: 30px
}

.recent-blog-item h4,.recent-blog-item h4 a{
    color: #000;
    font-weight: bold;
    text-transform: uppercase;
    -webkit-transition: 0.2s ease-in;
    -moz-transition: 0.2s ease-in;
    transition: 0.2s ease-in;
}

.recent-blog-item h4:hover,.recent-blog-item h4 a:hover{
    color: #ff9700
}

.recent-blog-item .meta{
    border-top: 1px solid #eee;
    border-bottom:  1px solid #eee;
    padding-top: 10px;
    margin-bottom: 15px
}

.recent-blog-item .meta span{
    margin-right: 15px
}

.recent-blog-item .meta span i{
    margin-right:8px
}
/* ==========================================================================
team
 ========================================================================== */
.team-item{
    position: relative;
    background: #f6f6f6;
    padding-bottom: 30px;
    overflow: hidden;
    margin-bottom: 30px;
    border: 1px solid #ddd;
}

.team-item img{
    margin-bottom: 30px;
}

.team-item > h4{
    position: relative;
    padding: 0 15px;
    padding-bottom: 20px;
    text-transform: uppercase;
}

.team-item h4:before{
    content: "";
    position: absolute;
    bottom: 0;
    left: 20px;
    width: 50px;
    height: 4px;
    background: #ff9700;
}

.team-item > span{
    padding: 0 15px;
    display:flex;
}


.team-item .mask{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 30px;
    background: #ff9700;
    -webkit-transform: translateY(100%);
    -moz-transform: translateY(100%);
    transform: translateY(100%);
    -webkit-transition: 0.2s ease-in;
    -moz-transition: 0.2s ease-in;
    transition: 0.2s ease-in;
}

.team-item .mask h4{
    padding-bottom: 20px;
    font-weight: bold;
    text-transform: uppercase
}
.team-item .mask h4:before{
    content: "";
    position: absolute;
    bottom: 0;
    left: 0px;
    width: 50px;
    height: 4px;
    background: #fff;
}

.team-item .mask span{
    font-weight: bold;
    text-transform: capitalize
}

.team-item .mask p{
    color: #fff
}

.team-item .mask .social-icon li a{
    margin: 0 3px;
    color: #000;
    border-color: #eee
}

.team-item:hover .mask {
    -webkit-transform: translateY(0%);
    -moz-transform: translateY(0%);
    transform: translateY(0%);
}

.team-item:hover .mask .social-icon a:hover{
    background: #fff;
    color: #ff9700
}

.team-item-brown .mask, .team-item-brown h4:before{
    background: #d48f52
}

.team-item-brown .mask .social-icon li a:hover{
    color: #d48f52 !important
}


.team-item-blue .mask, .team-item-blue h4:before{
    background: #33c6f4
}

.team-item-blue .mask .social-icon li a:hover{
    color: #33c6f4 !important
}
/* ==========================================================================
gellary
 ========================================================================== */
.portfolio-item {
    text-align: center;
    position: relative;
    overflow: hidden;
    float:left;
    display:inline-block;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.portfolio-item:before {
    content: '';
    box-sizing: border-box
}
#projects-grid{
    position:relative;
    text-align:center;
    margin:0 auto;
    width:100%
}
#portfolio-filter{
    margin-bottom: 35px
}

#filter-1 li{
    display: inline-block;
}

#filter-1 li a{
    display: inline-block;
    color: #333;
    margin: 0 10px;
    text-transform: uppercase
}
#filter-1 li a.current{
    color: #ff9700
}
.portfolio-box-1{
    position:relative;
    width:25%;
}
.box-1{
    width:25%;

}
.portfolio-box-2{
    position:relative;
    width:33.33333333%
}

.box-port-half{
    position:relative;
    width:66.666666666%;
}

.box-half{
    position:relative;
    width:50%;
}

.thumb{
    position: relative;
    overflow: hidden
}

.portfolio-item .title{
    background: #FB383B;
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 60px;
    line-height: 60px;
    color: #fff;
}

.col-2-items .portfolio-item{
    width: 50%
}
.col-3-items .portfolio-item{
    width:33.3333333%
}

.col-4-items .portfolio-item{
    width:25%
}
.col-5-items .portfolio-item{
    width:20%
}

.gutter .portfolio-item{
    padding: 15px
}

.portfolio-item .mask{
    position:absolute;
    width:100%;
    height:100%;
    top:0;
    left:0;
    background-color: rgba(0,0,0,0.8);
    -webkit-transition: 0.3s linear;
    -moz-transition: 0.3s linear;
    transition: 0.3s linear;
    opacity: 0;
}

.portfolio-item .mask:before{
    content: "";
    position: absolute;
    top: 15px;
    left: 15px;
    right: 15px;
    bottom: 15px;
    border: 1px solid #fff
}
.portfolio-item .mask h4,.portfolio-item .mask h4 a{
    color: #fff;
    text-transform: uppercase;
    font-weight: bold;
    font-family: 'Ubuntu', sans-serif;
    position: absolute;
    padding-bottom: 15px;
    top: 35%;
    left: 0;
    right: 0;
    -webkit-transform: translateY(100px);
    -moz-transform: translateY(100px);
    transform: translateY(100px);
    -webkit-transition: 0.3s linear;
    -moz-transition: 0.3s linear;
    transition: 0.3s linear;
    opacity: 0;
}

.portfolio-item .mask h4 a:before{
    content: "";
    position: absolute;
    bottom: 0;
    height: 4px;
    width: 50px;
    background: #ff9700;
    left: 0;
    right: 0;
    margin: 0 auto;
}

.portfolio-item .mask p{
    text-transform: uppercase;
    font-weight: bold;
    font-size: 13px;
    font-family: 'Ubuntu', sans-serif;
    position: absolute;
    padding-bottom: 15px;
    top: 57%;
    left: 0;
    right: 0;
    -webkit-transform: translateY(100px);
    -moz-transform: translateY(100px);
    transform: translateY(100px);
    -webkit-transition: 0.3s linear;
    -moz-transition: 0.3s linear;
    transition: 0.3s linear;
    opacity: 0;
}

.portfolio-item .mask > a{
    position: absolute;
    top: 15px;
    background: #ff9700;
    right: 15px;
    display: inline-block;
    height: 30px;
    width: 30px;
    line-height: 30px;
    text-align: center;
    color: #fff;
    border: 1px solid #fff;
}

.portfolio-box-1 img{
    width:100%;
    height:auto;
    display:block;
    -webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
    transition: all 300ms linear; 
    max-width: 100%;
    height: auto
}

.portfolio-item img{
    display:block;
    -webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
    transition: all 300ms linear; 
    max-width: 100%;
    height: auto
}

.portfolio-item:hover img{
    -webkit-transform: scale(1.05);
    -moz-transform: scale(1.05);
    -ms-transform: scale(1.05);
    -o-transform: scale(1.05);
    transform: scale(1.05);

}
.portfolio-item:hover .mask{
    opacity:1;
}
.portfolio-item:hover h4,.portfolio-item:hover h4 a,.portfolio-item:hover p{
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    transform: translateY(0);
    opacity: 1
}
/* ==========================================================================
accordion
 ========================================================================== */
.panel-default>.panel-heading.active{
    background: red
}

.panel-default>.panel-heading{
    background: none;
    height: 50px;
    padding: 0 15px;
    overflow: hidden;
}

.panel-title{
    line-height: 50px
}
.panel-title a{
    display: block
}
.panel-title i{
    position: relative;
    top: -50px;
    right: -15px;
    width: 50px;
    border-left: 1px solid #ddd;
    height: 50px;
    line-height: 50px;
    text-align: center;
    overflow: hidden;
}
.panel-group .panel,.panel{
    border-radius: 0
}
/* ==========================================================================
Subscribe
 ========================================================================== */
.input-group-btn{
    vertical-align: top
}
.input-group .btn{
    width: 150px;
    height: 40px;
    background: #ff9700;
    color: #fff;
    text-transform: uppercase
}
/* ==========================================================================
clients 
 ========================================================================== */
.clients-slider{

}

.clients-slider li{
    text-align: center

}

.clients-slider img{
    width: 90px !important;
    height: 90px;
    border-radius: 50%;
    margin: 0 auto 20px auto
}
.clients-slider h4{
    margin-bottom: 0px;
    color: #000; 
    text-transform: capitalize;
    font-weight: bold
}
.clients-slider span{
    font-size: 11px;
    color: #000; 
}

.clients-slider p{
    background: #fff;
    padding: 25px;
    border: 1px solid #FFF1B0;
    margin-top: 30px
}

.clients-slider .owl-dots{
    text-align: center;
    margin-top:20px
}

.clients-slider .owl-dot{
    width: 20px;
    height: 6px;
    border-radius: 5px;
    background: #ddd;
    display: inline-block;
    margin: 0 3px
}

.clients-slider .owl-dot.active{
    background: #ff9700;
}
.brown-dots .owl-dot.active{
    background: #d48f52;
}

.brown-dots p{
    border: 1px solid #d48f52;
}
.blue-dots .owl-dot.active{
    background: #33c6f4;
}
.blue-dots p{
    border: 1px solid #33c6f4
}
/* ==========================================================================
events
 ========================================================================== */
.event-item{
    background-color: #fff;
    padding: 30px 20px;
    transition: 0.2s linear
}

.event-item:hover{
    box-shadow: 0 4px 8px rgb(175,175,175);
}

.event-item .content{
    overflow: hidden
}
.event-item h4{
    text-transform: uppercase;
    font-weight: bold
}

.event-date{
    float: left;
    overflow: hidden;
    background-color: #f1f1f1;
    width: 85px;
    text-align: center;
    padding: 15px 10px;
    font-size: 32px;
    color: #000;
    font-weight: bold;
    margin-right: 12px;
}

.event-date span{
    display: block;
    color: #fff;
    font-size: 18px;
    font-weight: bold;
    text-transform: capitalize;
    margin-top: 15px
}
/* ==========================================================================
contact
 ========================================================================== */
.left-inner-addon {
    position: relative;
}

.left-inner-addon input,
.left-inner-addon textarea{
    padding-left: 40px;    
}

.left-inner-addon i {
    position: absolute;
    padding: 11px 15px;
    pointer-events: none;
    font-size: 20px;
}

.right-inner-addon {
    position: relative;
}
.right-inner-addon input {
    padding-right: 30px;    
}
.right-inner-addon i {
    position: absolute;
    right: 0px;
    padding: 10px 12px;
    pointer-events: none;
}

.contact-info p {
    margin-bottom: 20px
}
.contact-info p i{
    margin-right: 10px
}

#map{
    height: 400px;
}
#map iframe{
    width: 100%;
}

.map-top{
    margin-top: -80px
}
/* ==========================================================================
page title
 ========================================================================== */
.page-title{
    padding: 50px 0;
}

.page-title ul li{
    display: inline-block;
}

.page-title ul li a{
    position: relative;
    display: inline-block;
    color: #a2a2a2;
    text-transform: capitalize;
}

.page-title ul li a:after{
    content: "/";
    margin: 0 10px
}

.page-title ul li:last-of-type a:after{
    content: none
}
/* ==========================================================================
About page
 ========================================================================== */
.our-mission,.our-vision{
    padding: 30px;
}

.r-title{
    position: relative ;
    padding-bottom: 18px;
}

.r-title:before{
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 50px;
    height: 4px;
    background: #C5C5C5
}

.a-title{
    position: relative ;
    padding-bottom: 15px;
    color: #fff;
    text-transform: uppercase;
    font-weight: bold
}

.a-title:before{
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 50px;
    height: 4px;
    background: #000
}

.our-mission p,.our-vision p{
    color: #fff
}
.about-us-text p{
    margin-bottom:30px
}
.list-1 li{
    margin-bottom: 10px;
}

.list-1 li i{
    margin-right: 8px
}

.all-u-need{
    padding: 40px 0 30px 0;
}
.all-u-need a{
    margin-top: 25px
}
/* ==========================================================================
blog pages
 ========================================================================== */
.b-sidebar .widget{
    margin-bottom: 40px
}

.w-title{
    margin-bottom: 20px;
    position: relative;
}


.w-title h4{
    font-weight: bold;
    text-transform: uppercase;
    padding-bottom:15px 
}
.w-title:before{
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    height: 4px;
    width: 50px;
    background: #c5c5c5
}
.w-title.w-title-brown:before{
    background: #d48f52 
}

.w-title.w-title-blue:before{
    background: #33c6f4
}

.b-sidebar input{
    color: #222;
    margin-bottom: 0
}

.cat-sidebar li a{
    display: block;
    color: #8d8d8d;
    text-transform: capitalize;
    margin-bottom: 10px
}

.cat-sidebar li a:hover{
    color: #ff9700
}
.cat-sidebar li a span{
    float: right;
}

.po-posts li{
    margin-bottom: 20px;
    clear: both
}

.po-posts li img{
    float: left;
    margin-right: 15px
}

.po-posts li p a{
    text-transform: capitalize;
    font-weight: bold;
    color: #000;
}

.po-posts li p a:hover{
    color: #ff9700
}

.tags-list li{
    display: inline-block;
}

.tags-list li a{
    display: inline-block;
    margin:0 3px 6px 0;
    background-color: #eeeeee;
    color: #34495e;
    text-transform: capitalize;
    padding:5px 15px;
    -webkit-transition: 0.2s linear;
    -moz-transition: 0.2s linear;
    transition: 0.2s linear;
}


.tags-list li a:hover{
    background-color: #ff9700;
    color: #fff;
}

.ins-feed li{
    position: relative;
    overflow: hidden;
    display: inline-block;
    width: 85px;
    height: 85px;
}

.ins-feed li .mask{
    text-align: center;
    position:absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: #ff9700;
    color: #fff;
    -webkit-transform: translateY(100%);
    -moz-transform: translateY(100%);
    transform: translateY(100%);
    opacity: 0;
    -webkit-transition: 0.2s ease-in;
    -moz-transition: 0.2s ease-in;
    transition: 0.2s ease-in;
}
.ins-feed li .mask a{
    color: #fff;
    line-height: 85px;
    font-size: 20px
}

.ins-feed li:hover .mask{
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    transform: translateY(0);
    opacity: 1
}
/* ==========================================================================
blog pages
 ========================================================================== */
.r-blog,.r-post{
    position: relative;
    margin-bottom: 30px;
    overflow: hidden;
    border: 1px solid #eee;
}

.r-blog .r-blog-img,
.r-post .post-img{
    position: relative;
    overflow: hidden;
    margin-bottom: 20px;
}

.r-blog .r-blog-img span,
.r-post .post-img span{
    position: absolute;
    z-index: 1;
    top: 20px;
    left: 20px;
    font-size: 25px;
    width: 40px;
    height: 40px;
    line-height: 45px;
    text-align: center;
    background: #2d2d2d;
    color: #ededed;
    -webkit-transition: 0.2s ease-in;
    -moz-transition: 0.2s ease-in;
    transition: 0.2s ease-in;
}

.r-blog:hover .r-blog-img span,
.r-post:hover .post-img span{
    background: #ff9700
}
.r-blog .content,.r-post .content{
    padding: 0 20px 30px 20px
}

.r-blog h4 a,.r-post h2 a,.r-post .content h2{
    font-family: 'Ubuntu', sans-serif;
    text-transform: capitalize;
    font-weight: bold;
    color: #333;
    -webkit-transition: 0.2s ease-in;
    -moz-transition: 0.2s ease-in;
    transition: 0.2s ease-in;
}

.r-blog h4 a:hover,.r-post h2 a:hover{
    color: #ff9700;
}

.r-post .content .w-title{
    margin-top: 30px
}

.r-blog .meta p{
    font-size: 12px;
}

.r-blog .meta p span{
    float: right
}

.r-post h2 a {
    color: #333;
}
.r-blog .content > p{
    margin-bottom: 20px
}
.post-img iframe{
    width: 100%
}

.post-sound .post-img{
    padding: 30px;
    background: #eee
}

.post-meta a:first-child{
    margin-left: 0
}
.post-meta a{
    margin: 0 10px;
    text-transform: capitalize;
    color:#8d8d8d
}

.post-slider .owl-next,
.post-slider .owl-prev{
    position: absolute;
    top: 45%;
    display: inline-block;
    width: 40px;
    height: 40px;
    text-align: center;
    line-height: 45px;
    font-size: 20px;
    border-radius: 3px;
    background:#2d2d2d;
    -webkit-transition: 0.2s ease-out;
    -moz-transition: 0.2s ease-out;
    transition: 0.2s ease-out;
}

.post-slider .owl-next:hover,
.post-slider .owl-prev:hover{
    background:#ff9700;
    color: #fff
}
.post-slider .owl-next{
    right: 15px;
}

.post-slider .owl-prev{
    left: 15px;
}
/* ==========================================================================
comments erea
 ========================================================================== */
.about-author{
    padding: 30px;
    margin-bottom: 30px
}

.about-author img{
    float: left;
    margin-right: 30px

}

.about-author h4,.about-author h4 a{
    font-weight: bold;
    color: #333
}

.about-author{}

.comments-list li{
    border: 1px solid #eee;
    padding: 30px;
    margin-bottom: 30px;

}

.comments-list li .comment-head{
    margin-bottom: 15px;
}

.comments-list li .reply-link{
    float: right;
    text-transform: uppercase;
    padding: 7px 25px;
    background-color: #ff9700;
    color: #fff;
    -webkit-transition: 0.3s linear;
    -moz-transition: 0.3s linear;
    -o-transition: 0.3s linear;
    transition: 0.3s linear;
}

.comments-list li .reply-link:hover{
    background: #232323;
}

.comments-list li .avatar{
    float: left;
    margin-right: 15px;
}

.comments-list li .avatar img{
    width: 90px;
    height: 90px;
}

.comments-list li .commenter {
    margin-top: 10px;
    overflow: hidden
}
.comments-list li .commenter h4 a{
    color: #333;
    font-weight: bold;
    margin-bottom: 0;
    -webkit-transition: 0.2s ease-in;
    -moz-transition: 0.2s ease-in;
    transition: 0.2s ease-in;
}

.comments-list li .commenter h4 a:hover{
    color: #ff9700
}

.comments-list li ol,.comments-list li ul{
    margin-left: 100px;
    margin-top: 30px;
}

.comments-list li ol li,.comments-list li ul li{
    background: #FDFDFD;

}

.comments-form input,.comments-form textareas{
    color: #222222;
}
/* ==========================================================================
cart page
 ========================================================================== */
.table-bordered>thead>tr>td, .table-bordered>thead>tr>th{
    border-bottom-width: 1px; 
}
.table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th{
    vertical-align: middle;
    text-align: center;
    text-transform: capitalize
}

.c-table{
    border: 1px solid #eee;
    margin-bottom: 30px;
}
.c-table thead{
    border: 1px solid #eee;
    height: 50px;
    background: #ff9700;
    color: #fff;
}
.c-table thead tr th{
    border:none;
    text-align: center;
    height: 50px
}

.cart-delete a{
    display: inline-block;
    color: #ff9700;
    width: 25px;
    height: 25px;
    line-height: 25px;
    font-size: 10px;
    border-radius: 2px;
    -webkit-transition: 0.2s linear;
    -moz-transition: 0.2s linear;
    transition: 0.2s linear;
}

.cart-delete a:hover{
    background: #ff9700;
    color: #fff;

}
.quantity {
    display: inline-block;
    position: relative;
    width: auto;
}
.quantity input[type="number"] {
    background: none; 
    border-color: #ddd;
    font-size: 14px; 
    margin-bottom: 0;
    padding: 0 34px 0 10px; 
    position: relative;
    text-align: center; 
    width:75px; 
    color:#232323 }

.quantity button { background: none;border: none; border-left: 2px solid #f8f8fb; position: absolute; -webkit-transition: all .1s; transition: all .1s; height: -webkit-calc(50% - 2px); height: calc(50% - 2px); right: 2px; z-index: 1; width: 25px; font-size: 10px}
.quantity button:focus { outline-color:#ff9700; z-index: 1; }
.quantity button.plus { 
    border-radius: 0 2px 0 0; 
    border-bottom: 1px solid #eee;
    top: 2px; }
.quantity button.minus {
    -webkit-border-radius: 0 0 2px 0;
    border-radius: 0 0 2px 0;
    border-top: 1px solid #eee;
    bottom: 2px; }

.total-table tr th{
    border:none;
    text-align: left;
}
/* ==========================================================================
produst pages
 ========================================================================== */
.pro-info-head{
    border-bottom: 1px solid #eee;
    margin-bottom: 30px;
    padding-bottom: 10px
}

.pro-info-head h2{ 
    font-family: 'Ubuntu', sans-serif;
}
.pro-info-price{
    border-top: 1px solid #eee;
    border-bottom:  1px solid #eee; 
    padding: 15px 0
}
.pro-info-price > div{
    display: inline-block;
    margin-right: 15px
}

.pro-info-price .price p{
    font-size: 26px;
    font-weight: bold;
}

.pro-info h4{
    font-weight: bold;
    margin: 20px 0;
}

#example4.slider-pro img.sp-image{
    height: 400px !important
}
/* ==========================================================================
shop pages
 ========================================================================== */
.r-shop{
    margin-bottom: 30px
}
.r-shop img{
    margin-bottom: 20px;
}

.r-shop h4 a{
    color: #222;
    font-weight: bold;
    -webkit-transition: 0.2s ease-in;
    -moz-transition: 0.2s ease-in;
    transition: 0.2s ease-in;
}
.r-shop h4 a:hover{
    color: #ff9700
}

.r-shop span{
    color: #FB383B;
    font-weight: bold;
    font-size: 16px;
}

.r-list-shop{
    margin-bottom: 30px
}

.r-list-shop-content p{
    margin-bottom: 20px
}
.shop-bar{
    border: 1px solid #eee;
    padding:  15px;
    margin-bottom: 30px;
}

.r-list-head{
    border-bottom: 1px solid #eee;
    margin-bottom: 20px
}

.r-list-head h3 a{
    color: #000;
    font-size: 18px;
    text-transform: uppercase
}

.r-list-head .rate{
    display: inline-block;

}

.r-list-head span{
    margin-right: 35px;
    color: #ed1e24;
    font-weight: bold;
    font-size: 17px
}

.shop-bar ul{
    text-align: right
}

.shop-bar ul li{
    display: inline-block;
}


.shop-bar ul li a{
    margin: 0 3px;
    color: #333;
    width: 30px;
    height: 30px;
    line-height: 30px;
    display: inline-block;
    text-align: center;
    border:1px solid #eee;
    -webkit-transition: 0.2s linear;
    -moz-transition: 0.2s linear;
    transition: 0.2s linear;

}
.shop-bar ul li a:hover,.shop-bar ul li a.active,.gride-list a:hover,.gride-list a.active{

    background: #ff9700;
    color: #fff;
    border-color: #ff9700
}

.gride-list a{
    display: inline-block;
    text-align: center;
    width: 30px;
    height: 30px;
    line-height: 33px;
    color: #333;
    background-color: #eee;
    margin-right: 5px;
    -webkit-transition: 0.2s linear;
    -moz-transition: 0.2s linear;
    transition: 0.2s linear;
}

.shop-bar select{
    margin: 0;
    height: 30px
}
/* ==========================================================================
error 404 page
 ========================================================================== */
.p-404 h1{  
    font-size: 160px;
    font-family: inherit;
    font-weight: bold;}
.p-404 p{margin-bottom: 30px}

/* ==========================================================================
pagination
 ========================================================================== */
.pagination li a{color: #333}
.pagination li a:hover,.pagination li a.active{color: #fff;background-color: #ff9700}

/* ==========================================================================
coming soon page
 ========================================================================== */
.coming-soon{
    height: 100vh
}
.countdown{}

.countdown article{
    color: #000;
    text-align: center;
    border: 2px solid #ff9700;
    background-color: rgba(255,255,255,.50);
    padding: 30px 0 0;
}

.countdown article span{
    color: #000;
    font-size: 50px
}
.countdown article p{
    font-size: 14px;
    color: #000;
    text-transform: uppercase;
    font-weight: bold
}

.soon-inner{

}

.soon-inner h1{
    position: relative;
    font-family: 'Ubuntu', sans-serif;
    color: #fff;
    padding-bottom: 20px;
    margin-bottom: 35px;
    text-transform: uppercase;
    font-weight: bold

}

.soon-inner h1:before{
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    width: 50px;
    height: 4px;
    background: #ff9700;
    margin: 0 auto
}

.soon-inner p{
    color: #fff;
    margin-bottom: 40px
}
/* ==========================================================================
footer
 ========================================================================== */
.main-footer{
    background: #333333;
    padding: 80px 0;
}

.f-head{
    margin-bottom: 30px
}

.f-head h4{
    color: #fff;
    text-transform: uppercase;
    padding-bottom: 20px
}

.f-head h4:before{
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 50px;
    height: 4px;
    background: #ff9700
}

.f-head-blue h4:before{
    background: #33c6f4
}
.f-head-brown h4:before{
    background: #d48f52
}
.footer-item ul.social-icon{
    margin-top: 20px
}

.footer-item ul.f-list li{
    margin-bottom: 10px
}


.footer-item ul.f-list li a{
    text-transform: capitalize;
    color: #8d8d8d
}

.footer-item ul.f-list li a:hover{
    color: #ff9700
}

.footer-item  p i{
    margin-right: 8px;
    color: #fff
}

.f-gallery li{
    position: relative;
    display: inline-block;
    margin: 0 0 1px 5px;
    width: 80px;
    height: 80px;
    overflow: hidden;
}
.bottom-footer{
    padding: 10px 0 0px 0;
    background: #222222
}

.copy-right p{
    color: #fff
}
.designed-by{
    text-transform: uppercase;
    text-align: right
}

.designed-by p a{
    color: #fff
}

/*responsive and media query*/

@media screen and (min-width:991px){
    #toggle-sidebar{
        display: none
    }
    .our-story {
        height: 730px;
        z-index: 1;
    }
    .our-story-inner {
        position: relative;
        top: -150px;
    }
    .menu-paddint-top{
        padding-top: 200px
    }

}


@media screen and (max-width:991px){
    .navbar-brand>img{
        display: block
    }
    #toggle-search,.navbar-collapse .navbar-nav{
        display: none
    }
    #toggle-sidebar{
        font-size: 21px;
        position: absolute;
        right: 10px;
        top: 18px;
        color: #fff;
        width: 35px;
        height:35px;
        line-height: 35px;
        text-align: center;
        background: #ff9700
    }

    #toggle-cart{
        font-size: 21px;
        position: absolute;
        right: 65px;
        top: -40px;
        color: #fff;
        width: 35px;
        height:35px;
        padding: 0 0 0 3px;
        line-height: 35px;
        text-align: center;
        background: #ff9700
    }

    .our-vision{
        margin: 30px 0
    }
    .about-us-text{
        margin-top: 30px
    }

    .countdown article{
        margin-bottom: 30px
    }
    .portfolio-box-1{
        width:50%;
    } 
	.coming-soon { height: auto;}
}

@media screen and (max-width:767px) {
    .comments-list li{
        padding: 20px;
    }
    .comments-list li .reply-link{
        padding: 5px 10px;
        font-size: 11px
    }
    .comments-list li .avatar img {
        width: 50px;
        height: 50px;
    }
    .comments-list li ol, .comments-list li ul{ margin-left: 0}
    .comments-list li .commenter p{font-size: 11px}
    
    .r-list-shop{
        text-align: center;
    }
    .r-list-shop-img{
        margin-bottom: 15px
    }
    .portfolio-item{
        width: 100% !important
    }
}

.navbar-default .navbar-collapse, .navbar-default .navbar-form {
    background-color: #b61c12;
}

.navbar-default {    
    background-color: #b61c12;
}

.navbar-default .navbar-nav>li>a {
    color: #fff;
    font-size: 20px;
    font-family: 'Oswald', sans-serif;
    font-weight: bolder;
}

.btn-warning {
    border-color: #b61c12;
}

li {
    color: white;
    padding-top: 5px;
}

span.r-overlay-dark.kategorije {
    background-color: white;
}

/*.team-item.team-item-brown.kategorije {
    height: 400px;
}

@media (max-width:991px) {
    
.team-item.team-item-brown.kategorije {
    height:700px;
    text-align:center !important;
}

img.img-responsive {
    margin: 0 auto;
    width: 100%;
    margin-bottom: 30px;
}

.team-item > span {
    justify-content: center;
}

.team-item > h4 {
    display: flex !important;
    justify-content: center !important;
}
}}
}