/*GLOBALS*/
*{margin:0; padding:0; list-style:none;}
a{text-decoration:none; color:#666;}
a:hover{color:#750e31;}
body, hmtl{background: #ecf0f1; font-family: 'Anton', sans-serif;}


#wrapper {
    width: 600px;
    position: relative;
    color: #fff;
    text-shadow: rgba(0,0,0,0.1) 2px 2px 0px;
}

#slider-wrap {
    width: 600px;
    height: 400px;
    position: relative;
    overflow: hidden;
}

#slider-wrap ul#slider{
  width:100%;
  height:100%;
  
  position:absolute;
  top:0;
  left:0;   
}

#slider-wrap ul#slider li{
  float:left;
  position:relative;
  width:600px;
  height:400px; 
}

#slider-wrap ul#slider li > div{
  position:absolute;
  top:20px;
  left:35px;  
}

#slider-wrap ul#slider li > div h3{
  font-size:36px;
  text-transform:uppercase; 
}

#slider-wrap ul#slider li > div span{
  font-family: Neucha, Arial, sans serif;
  font-size:21px;
}

#slider-wrap ul#slider li i{
  text-align:center;
  line-height:400px;
  display:block;
  width:100%;
  font-size:90px; 
}


/*btns*/
.btns{
  position:absolute;
  width:50px;
  height:60px;
  top:50%;
  margin-top:-25px;
  line-height:57px;
  text-align:center;
  cursor:pointer; 
  background:rgba(0,0,0,0.1);
  z-index:100;
  
  
  -webkit-user-select: none;  
  -moz-user-select: none; 
  -khtml-user-select: none; 
  -ms-user-select: none;
  
  -webkit-transition: all 0.1s ease;
  -moz-transition: all 0.1s ease;
  -o-transition: all 0.1s ease;
  -ms-transition: all 0.1s ease;
  transition: all 0.1s ease;
}

.btns:hover{
  background:rgba(0,0,0,0.3); 
}

#next{right:-50px; border-radius:7px 0px 0px 7px;}
#previous{left:-50px; border-radius:0px 7px 7px 7px;}
#counter{
  top: 30px; 
  right:35px; 
  width:auto;
  position:absolute;
}

#slider-wrap.active #next{right:0px;}
#slider-wrap.active #previous{left:0px;}


/*bar*/
#pagination-wrap {
    min-width: 20px;
    margin-left: auto;
    margin-right: auto;
    height: 15px;
    left: 0;
    position: absolute;
    right: 0;
    text-align: center;
    bottom: 28px;
}

#pagination-wrap ul {
  width:100%;
}

#pagination-wrap ul li{
  margin: 0 4px;
  display: inline-block;
  width:5px;
  height:5px;
  border-radius:50%;
  background:#fff;
  opacity:0.5;
  position:relative;
  top:0;
  
  
}

#pagination-wrap ul li.active{
  width:12px;
  height:12px;
  top:3px;
  opacity:1;
  box-shadow:rgba(0,0,0,0.1) 1px 1px 0px; 
}









/*ANIMATION*/
#slider-wrap ul, #pagination-wrap ul li{
  -webkit-transition: all 0.3s cubic-bezier(1,.01,.32,1);
  -moz-transition: all 0.3s cubic-bezier(1,.01,.32,1);
  -o-transition: all 0.3s cubic-bezier(1,.01,.32,1);
  -ms-transition: all 0.3s cubic-bezier(1,.01,.32,1);
  transition: all 0.3s cubic-bezier(1,.01,.32,1); 
}


.pop_text_1{}

.pop_text_1 h3 {
    margin-top: 7%;
    color: #333333;
    text-align: left;
}

.pop_text_1 p {
    overflow: hidden;
    margin-top: 25px;
    color: #666;
}


.social ul{}

.social li {
    display: inline-block;
    margin-right: 15px;
    text-align: center;
    color: #333;
    margin-top: 10%;
    
    transition: .5s ease;


}


.social li:hover{ color: #760F31; cursor: pointer; }

.social li i{}



.cat-list label{ font-weight: 900; color: #333333; }


.cat-list {
    margin-top: 0%;
}


.modal-title {
    margin: 0;
    line-height: 1.42857143;
    padding-left: 2% !important;
}


@media(max-width: 1199px){



  #slider-wrap img {
    width: 80%;
}


#slider-wrap.active #next {
    right: 120px;
    top: 40%;
}

#slider-wrap.active #previous {
    left: 0px;
    top: 40%;
}

}



@media(max-width: 991px){

  #slider-wrap.active #previous {
      left: 0px;
      
  }
  .cat-list {
      margin-top: 0% !important;
      
  }

  .social li {
      display: inline-block;
      margin-right: 15px;
      
      
      color: #fff;
      margin-top: 5% !important;
      
  }



  .pop_text_1 p {
      /*height: 260px !important;*/
      overflow: hidden;
      margin-top: 25px;
      
  }

  #wrapper {
      width: 600px;
      position: relative;
      color: #fff;
      text-shadow: rgba(0,0,0,0.1) 2px 2px 0px;
      margin: auto;
  }

  .pop_text_1 h3 {
      
      margin-top: 10%;
  }

  .social ul {
      
  }

  .modal-title {
      margin: 0;
      line-height: 1.42857143;
      
      padding-left: 2% !important;
  }

}