/* 
    Created on : 22/05/2018, 23:41:48
    Author     : Laécio de Souza Barboza - Lsb Web
*/
*{
  margin:0;
  padding:0;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  }
 
:root{
    --bg-red: #F2594B;
    --bg-green: #5fa961;
    --bg-blue: #00CCFF;
   --yellow-primary: #C2984C;
    
    --green: #46ceac;
    --green_h: #35ba9d;
    --green_l: #61ddbc;
    
    --blue:#0099CC;
    --blue_h:#006699;
    --blue_l: #66d4f1;
    --blue_light: #0099FF;
    --blue_strong: #003056;
    
    --yellow: #fdcd56;
    --yellow_h: #f5b945;
    --yellow_l: #fbd277;
    
    --red: #eb5463;
    --red_h: #d94452;
    --red_l: #f76c82;
    
    --orange_strong:#ff9900;
    
    --bg_orange: #F2594B;
    --bg_green: #5fa961;
    --bg_blue:#00CCFF;
    
   }
   ul{
       list-style: none;
   }
img{
    max-width:100%;
    display: block;
}
img a{
    border:none;
}
.box-shadow-light{
    box-shadow:1px 1px 1px #aaa;
    -moz-box-shadow:1px 1px 1px #aaa;
    -webkit-box-shadow:1px 1px 1px #aaa;
}
.ds_none{
    display:none !important;
}
.ds_block{
    display:block !important;
}
.bold-medio{
    font-weight: 500;
}
.radius{
    border-radius: 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
}
.radius-2{
    border-radius: 16px;
    -moz-border-radius: 16px;
    -webkit-border-radius: 16px;
}
/*CORES DE TEXTOS E BACKGROUNDES*/
.bg-white{
    background: #fff;
}
.bg-green{
    background: #5fa961;
}
.bg-yellow{
    background: #EEA306;
}
.bg-blue{
    background: #00A8FF;
}
.bg-red{
    background: #F2594B;
}
.bg-grey-1{
    background: #fbfbfb;
}
.bg-grey-2{
    background: #eee;
}
.bg-grey-3{
    background: #ddd;
}
.bg-black{
    background: #000;
}

.all_center{
    text-align: center !important;
}
.all_lef{
    text-align: left !important;
}
.all_right{
    text-align: right !important;
}
/*PADDING E MARGINS*/

 .padding-0{padding: 0;}
.padding-5{padding: 5px;}
.padding-10{padding: 10px;}
.padding-15{padding: 15px;}
.padding-20{padding: 20px;}
.padding-25{padding: 25px;}
.padding-30{padding: 30px;}

.margin-0{margin:0;}
.margin-left{margin-left:10px  !important;}
.margin-right{margin-top:10px  !important;}
.margin-bottom{margin-bottom:10px !important;}
.margin-top{margin-top:10px;}


.font-white{color:#fff !important;}
.font-blue{color:#00A8FF !important;}
.font-red{color:#ff6666;}
.font-yellow{color:#f4ff81;}
.font-grey-strong{color:#777;}
.font-grey-small{color:#999;}
.font-black{color:#000;}
.font-padrao{
    color: var(--blue) !important;
}
.font-mini-1{
    font-size: 0.675em !important;
}
.font-mini-2{
    font-size: 0.785em !important;
}
.font-big-1{
    font-size: 2em !important;
}
.ronded{
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
}
.link_ler_mais{
       font-size: 0.9em;
      color: var(--blue);
      font-weight: 600;
  }
  .text-decoration{
      text-decoration:none;
  }
embed,
video,
iframe,
iframe[style]{
   max-width:100%;
   height:auto;
}

/*CONTAINERS*/

.container{
    max-width: 1366px;
    margin:0 auto;
   
}
.embed-container{
    position:relative;
    max-width:100%;
    height:0;
    padding-bottom:56.25%;
    overflow:  hidden;
    background: blue;
}
.embed-container embed,
.embed-container video,
.embed-container iframe{
    position: absolute;
    left:0;
    bottom:0;
    width:100%;
    height:100%;
}
/*BOXSTYLES*/


.transition{
     transition-duration: 0.8s;
    -moz-transition-duration: 0.8s;;
    -webkit-transition-duration: 0.8s;;
    cursor:pointer;
}

/*TRIGGERS*/

.trigger{
    margin:12px;
    font-size: 0.875em;
    background:#888;
    text-shadow:1px 1px rgba(0,0,0, 0.3);
    padding:12px;
    border:1px solid #777;
    color:#fff;
    text-align:center;
}
.trigger-success{
    background: var(--green);
    border-color:  var(--green_h);
}
.trigger-success-out{
    color: var(--green);
    border-color: var(--green_h);
    background: none;
    text-shadow: none;
}


.trigger-info{
    background: var(--blue) !important;
    border-color:  var(--blue_h);
    
}
.trigger-info-out{
    color: var(--blue);
    border-color: var(--blue_h);
    background: none;
    text-shadow: none;
}

.trigger-alert{
    background: var(--yellow);
    border-color:  var(--yellow_h);
    color:#333;
   
}
.trigger-alert-out{
    color: var(--orange_strong);
    border-color: var(--yellow_h);
    background: none;
    text-shadow: none;
}


.trigger-error{
    background: var(--red);
    border-color:  var(--red_h);
    
}
.trigger-error-out{
    color: var(--red);
    border-color: var(--red_h);
    background: none;
    text-shadow: none;
}
.maintenance{
    font-size: 1.1em;
    padding:15px;
    text-transform: uppercase;
    z-index: 999;
    width:100%;
    margin:0 auto;
    
    
}
/*BUTTON*/

.btn{
   display:inline-block;
   padding:10px 20px;
   background: #888;
   border:none;
   font-size: 1em;
   font-weight: normal;
   color:#fff;
   text-shadow: 1px 1px rgba(0,0,0,0.3);
   cursor: pointer;
   text-decoration:none;
}
.btn:hover{
    color:#fff;
    text-decoration: none;
    background: #666;
}

.btn-small{
    font-size: 0.875em;
}
.btn-big{
    font-size: 1.127em;
}
/*BTN GREEN*/
.btn-green{
    background: var(--green);
    padding:5px 10px;
}
.btn-green:hover{
    background: var(--green_h);
}
.btn-theme{
    background: var(--yellow-primary);
}
.btn-theme:hover{
    background: var(--blue);
}
.btn-green-out{
    color: var(--green);
    border: 1px solid var(--green);
    background: none;
    text-shadow:none;     
}
.btn-green-out:hover{
    color: var(--green_h);
    border: 1px solid var(--green_h);
    background: none;
    text-shadow:none;     
}
/*BTN BLUE*/
.btn-blue{
    background: var(--blue);
}
.btn-blue:hover{
    background: var(--blue_h);
}
.btn-blue-out{
    color: var(--blue);
    border: 1px solid var(--blue);
    background: none;
    text-shadow:none;     
}
.btn-blue-out:hover{
    color: #fff;
     border: 1px solid var(--blue);
    background: var(--blue);
    text-shadow:none;     
}
/*BTN RED*/
.btn-red{
    background: var(--red);
}
.btn-red:hover{
    background: var(--red_h);
}
.btn-red-out{
    color: var(--red);
    border: 1px solid var(--red);
    background: none;
    text-shadow:none;     
}
.btn-red-out:hover{
    color: var(--red_h);
    border: 1px solid var(--red_h);
    background: none;
    text-shadow:none;     
}

/*BTN YELLOW*/
.btn-yellow{
    background: var(--yellow);
}
.btn-yellow:hover{
    background: var(--yellow_h);
}
.btn-yellow-out{
    color: var(--yellow);
    border: 1px solid var(--yellow);
    background: none;
    text-shadow:none;     
}
.btn-yellow-out:hover{
    color: var(--yellow_h);
    border: 1px solid var(--yellow_h);
    background: none;
    text-shadow:none;     
}
/*my btns*/
.my_btn_blue{
    background-color: #00CCFF;
    text-shadow: 1px 1px #096397;
    border-radius: 0px;
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
    text-transform: uppercase;
}
.my_btn_blue:hover{background-color: #096397;}

.my_btn_red{
    background-color: #F2594B;
    text-shadow: 1px 1px #096397;
    border-radius: 0px;
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
    text-transform: uppercase;
}
.my_btn_red:hover{background-color: #F72E00;}

.my_btn_green{
    background-color: #5fa961;
    text-shadow: 1px 1px #096397;
    border-radius: 0px;
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
    text-transform: uppercase;
}
.my_btn_green:hover{background-color: #008068;}

.btn-theme{
    background-color: var(--yellow-primary);
    text-shadow: none;
    border-radius: 0px;
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
    text-transform: uppercase;
    color:#fff;
}
.btn-theme:hover{background-color: #996600;}
.btn-theme-out{
    color: var(--yellow-primary);
    border: 1px solid var(--yellow-primary);
    background: none;
    text-shadow:none;     
}
.btn-theme-out:hover{
    color: #fff;
    border: 1px solid var(--yellow-primary);
    background: var(--yellow-primary);
    text-shadow:none;     
}


/*BACKGROUNDS*/
.bg-orange{
    background: var(--bg_orange);
}
.bg-green{
    background: var(--bg_green);
}
.bg-blue{
    background: var(--bg_blue);
}
.uppercase{
    text-transform: uppercase;
}
.my_tagline{
    font-size: 1.1em !important;
    font-weight: 300;
}
.my-p{
    font-size: 0.875;
    color:#888;
    font-weight: 400;
}

/*FLEX BOX*/

.flex{
    display:flex;
    flex-wrap: wrap;
    
}
.flex .flex-1{
   flex-basis: calc(100% - 10px);
  }
.flex .flex-2{
   flex-basis: calc(50% - 40px);
   margin:20px;
}
.flex .flex-3{
   flex-basis: calc(33.33% - 30px);
   margin:15px;
}
.flex .flex-4{
   flex-basis: calc(25% - 20px);
   margin:10px;
}
.flex-30{
    border:1px solid #fbfbfb;
    display:flex;
    flex-wrap:wrap;
    flex-basis:calc(22% - 20px);
    margin:10px;
    padding:10px;
}
.flex-70{
    display: flex;
     flex-wrap:wrap;
     flex-basis:calc(78% - 20px);
     justify-content: flex-start;
     align-content: flex-start;
    margin:0 10px;
    padding:20px;
    border:1px solid #fbfbfb;
}
.flex-70-views{
    display: flex;
    flex-basis:calc(78% - 20px);
    justify-content: center;
    align-content: center;
    margin:0 10px;
    padding:20px;
    border:1px solid #fbfbfb;
}
/*SLIDE*/
.j_slide{
    position: relative;
}
.j_slide_item{
   display: none; 
}
.j_slide_item:first-child{
    display: block;
}
.j_slide_nav{
    position: absolute;
    left:0;
    bottom: 0;
    margin-bottom:10px;
    width:100%;
    text-align:center;
    
    
}
.j_slide_nav span{
    display:inline-block;
    background: rgba(0,0,0,0.4);
    width:20px;
    height:20px;
    margin:0 5px;
    cursor:pointer;
}
.j_slide_nav span:hover{
    background: var(--themeColorA);
}
.j_slide_nav span.active{
    background: var(--themeColorA);
}
/*TABS*/
.j_tabs_nav.active{
    background: var(--themeColorA); 
}
.j_tabs_item{
    display: none;
}
.j_tabs_item:first-child{
    display: block;
}
/*SOCIAL*/
.main_social{
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: stretch;
}
.main_social li{
    margin:0 10px;
}
.main_social li a{
    text-decoration: none;
    color:#999;
    font-size: 4em;
    padding: 5px;
}
.main_social li a:hover{
    color:#bbb;
}
/*CONTACT*/
.container .container-contact{
    display:flex;
    flex-wrap:wrap;
    width:60%;
    align-items: center;
    max-width:95%;
    margin:40px auto;
    border:1px solid #ddd;
    padding:10px;
  
 
}
.container-contact header{
    flex-basis:100%;
   
}
.container-contact h1{
    margin:10px;
    color:#555;
    font-size: 2em;
}
.container-contact p{
    margin:10px;
    color:#333;
    font-size: 1.1em;
}
.my-form{
    flex-basis:100%;
   
}
.my-form label{
    display:flex;
     flex-wrap:wrap;
    flex-basis:90%;
    margin-top: 10px;
    
     
}
.my-form label span{
     display:flex;
   flex-basis:100%;
   padding-left:10px;
   margin-bottom: 0;
    
   
}
.my-form input, select{
    display:flex;
   flex-basis:calc(98% - 20px);
    margin:0 10px 10px 10px;
    padding:8px 10px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border:1px solid #ddd;
    outline:none;
    
}
.my-form textarea{
    display:flex;
   flex-basis:calc(100% - 20px);
    margin:10px;
    padding:8px 10px;
}
.my-form .btn{
    margin-left:10px;
}


/*search*/


  .search{
      margin: 0 auto 40px auto;
      width:100%;
     
  }
      
  .main_header_search form{
      flex-basis:100%;
      display:flex;        
      overflow: hidden;
      
  }
  .main_header_search form input{
     width:100%;
     border:1px solid #eee;
     outline: none;
     padding:20px;
     font-size: 1.2em;
     border-top-left-radius: 6px;
     -webkit-border-top-left-radius: 6px;
     -moz-border-top-left-radius: 6px;
     border-bottom-left-radius: 6px;
     -webkit-border-bottom-left-radius: 6px;
    -moz-border-bottom-left-radius: 6px;
     
  }
  .main_header_search form button{
      border:none;
      padding:0 40px;
      background: var(--blue);
      color:#fff;
      font-size: 2em;
      text-decoration: none;
      border-top-right-radius: 6px;
      -webkit-border-top-right-radius: 6px;
      -moz-border-top-right-radius: 6px;
      border-bottom-right-radius: 6px;
      -webkit-border-bottom-right-radius: 6px;
      -moz-border-bottom-right-radius: 6px;
      
  }
  .main_header_search button:hover{
      background: var(--blue_h); 
     color:#fff;
     cursor:pointer;
     
  }  
  /*PAGINAÇÃO*/
    .paginacao{
      display:flex;
      width:100%;
  }
  .paginator{
    display: flex;
    flex-basis:100%;
   justify-content:center;
    margin-top: 50px;
    align-items:flex-end;
}

.paginator li{
   margin:5px;
}

.paginator li span,
.paginator li a{
    font-size: 1em;
    display: inline-block;
    padding: 6px 12px;
    background: var(--blue);
    margin: 0 5px;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    text-decoration: none;
    color: #fff;
    font-weight: 600;
    text-shadow: 1px 1px #006699;
    transition-duration: 0.8s;
}

.paginator li a:hover{
    background: var(--blue_h);
    transition-duration: 0.8s;
}

.paginator li span{
    border:1px solid var(--blue);
    background:none;
    color:var(--blue);
    text-shadow: none;
    
}
@media(max-width: 50em){
    .content_search{
    flex-basis:100%;
    padding:0;
    margin:0 auto;
   
  }
 .search{
      margin: 5px auto;
      width:100%;
     
  }
  .main_header_search form input{
     padding:10px;
     font-size: 1.1em;
        
  }
  .main_header_search form button{
     padding:0 20px;
     font-size: 1.2em;
      
      
  }
}  
  