:root{
    --colorfirst: #56aabb;

/* COR DEV */
/*    --colorfirst: #da70dc;*/
    
    --colorsecond: #3eba66;
    --white: #fff;
    --black: #000000;
    --verydarkgrey: #191919;
    --darkgrey: #323232;
    --grey: #5a5a5a ;
    --lightgrey: #dcdcdc;
    --verylightgrey: #f5f5f5;

    --green: #41906c; 
    --yellow: #f2e530;
    --red: #e31827;

    --smoothgreen: #41906c;
    --smoothyellow: #f2e530;
    --smoothred: #e31827;

    --colorfirst_trans: rgba(184, 63, 107, 0.8);
}
.var_use_example {
    background-color: var(--white); 
}

.bg_colorfirst {  background-color: var(--colorfirst) !important;
}

.bg_footer {  background-color: #28373c !important;
}

.bg_colorfirst_trans {  background-color: var(--colorfirst_trans) !important;
}

.color_colorfirst {
  color: var(--colorfirst) !important;
}
.bg_colorsecond {
  background-color: var(--colorsecond) !important;
}
.color_colorsecond {
  color: var(--colorsecond) !important;
}
.bg_black {
  background-color: var(--black) !important;
}
.color_black {
  color: var(--black) !important;
}
.bg_verydarkgrey {
  background-color: var(--verydarkgrey) !important;
}
.color_verydarkgrey {
  color: var(--verydarkgrey) !important;
}
.bg_darkgrey {
  background-color: var(--darkgrey) !important;
}
.color_darkgrey {
  color: var(--darkgrey) !important;
}
.bg_grey {
  background-color: var(--grey) !important;
}
.color_grey {
  color: var(--grey) !important;
}
.bg_lightgrey {
  background-color: var(--lightgrey) !important;
}
.color_lightgrey {
  color: var(--lightgrey) !important;
}
.bg_verylightgrey {
  background-color: var(--verylightgrey) !important;
}
.color_verylightgrey {
  color: var(--verylightgrey) !important;
}
.bg_white {
  background-color: var(--white) !important;
}
.color_white {
  color: var(--white) !important;
}

.color_smoothgreen {
  color: var(--smoothgreen) !important;
}
.color_smoothyellow {
  color: var(--smoothyellow) !important;
}
.color_smoothred {
  color: var(--smoothred) !important;
}

.force_colorfirst h1,
.force_colorfirst .h1,
.force_colorfirst h2,
.force_colorfirst .h2,
.force_colorfirst h3,
.force_colorfirst .h3,
.force_colorfirst h4,
.force_colorfirst .h4,
.force_colorfirst h5,
.force_colorfirst .h5,
.force_colorfirst p,
.force_colorfirst .p
{
    color: var(--colorfirst) !important;
}

@font-face {
  font-family: 'PTSans-Regular';
  font-style: normal;
  src: url('../fonts/PT_Sans-Web-Regular.ttf');
}

@font-face { 
  font-family: 'PTSans-Bold';
  font-style: normal;
  src: url('../fonts/PT_Sans-Web-Bold.ttf');
}

@font-face {
  font-family: 'Fontawesome-webfont';
  font-style: normal;
  src: url('../universal/fonts/fonts/fontawesome-webfont.ttf');
}

.checkbox_item_custom label,
.checkbox_item_custom label p,
.checkbox_item_custom label .p{
    font-size: 12px !important;
    line-height: 24px !important;
    color: var(--darkgrey) !important;
}

.checkbox_item_custom label a,
.checkbox_item_custom label p a,
.checkbox_item_custom label .p a{
    color: var(--darkgrey) !important;
}

.checkbox_item_custom .container{
    min-height: 5px !important;
}

.checkbox_item_custom .container input:checked ~ .checkmark{
    background-color: var(--colorfirst) !important;
}

.form-holder input[type="text"],
.form-holder input[type="mail"],
.form-holder input[type="email"],
.form-holder input[type="number"],
.form-holder input[type="password"],
.form-holder select,
.form-holder .checkbox_holder,
.form-holder textarea, 
.form-holder .styled-form input, 
.form-holder .styled-form select{
  border: 1px solid var(--grey) !important; 
}

a {
    color: var(--colorfirst) !important;
    cursor: pointer;
}

h1,
.h1 {
  font-family: PTSans-Bold;
  font-size: 40px;
  line-height: 50px;
  color: var(--colorfirst); 
  font-weight: normal !important;
  margin: 0;
  padding: 0;

}
h2,
.h2 {
  font-family: PTSans-Bold;
  font-size: 30px;
  line-height: 40px;
  color: var(--colorfirst);
  font-weight: normal !important;
  margin: 0;
  padding: 0;
}

h3,
.h3 {
  font-family: PTSans-Bold;
  font-size: 22px;
  line-height: 30px;
  color: var(--colorfirst);
  font-weight: normal !important;
  margin: 0;
  padding: 0;
}

h3.bold,
.h3.bold{
  font-weight: bold !important;  
} 
   
h4,
.h4 {
  font-family: PTSans-Regular;
  font-size: 18px;
  line-height: 28px;
  color: var(--colorfirst);
  font-weight: normal !important;
  margin: 0;
  padding: 0;
}
h5,
.h5 {
  font-family: PTSans-Regular;
  font-size: 24px;
  line-height: 32px;
  color: var(--white);
  font-weight: normal !important;
  margin: 0;
  padding: 0;  
}
h6,
.h6 {
  font-family: PTSans-Regular;
  font-size: 18px;
  line-height: 24px;
  color: var(--grey);
  font-weight: normal !important;
  margin: 0;
  padding: 0;
}
h7,
.h7 {
  font-family: PTSans-Regular;
  font-size: 80px;
  line-height: 80px;
  color: var(--white);
  font-weight: normal !important;
}

h8,
.h8 {
  font-family: PTSans-Regular;
  font-size: 20px;
  line-height: 28px;
  color: var(--lightgrey);
  font-weight: normal !important;
}

h12,
.h12 {
  font-family: PTSans-Regular;
  font-size: 18px;
  line-height: 28px;
  color: var(--white);
  font-weight: normal !important;
}

h13,
.h13 {
  font-family: PTSans-Regular;
  font-size: 24px;
  line-height: 26px;
  color: var(--lightgrey);
  font-weight: normal !important;
}

h14,
.h14 {
  font-family: PTSans-Regular;
  font-size: 60px;
  line-height: 80px;
  color: var(--darkgrey);
  font-weight: normal !important;
}

p,
.p {
  font-family: PTSans-Regular;   
  font-size: 14px;
  line-height: 22px;  
  color: var(--grey);
  font-weight: normal !important;
  margin: 0;
  padding: 0;
}

p.small,
.p.small {
  font-family: ubuntu-li;
  font-size: 12px;
  line-height: 18px;
  color: var(--grey);
  font-weight: normal !important;
}

/* FONTES EM MOBILE */

@media screen and (max-width: 960px) {
    h1,
    .h1 {
      /* font-family: ubuntu-li; */
      font-size: 35px;
      line-height: 45px;
      /* color: var(--colorfirst);
      font-weight: normal !important;
      margin: 0;
      padding: 0; */

    }
    h2,
    .h2 {
      /* font-family: ubuntu-b; */
      font-size: 22px;
      line-height: 32px;
      /* color: var(--colorsecond);
      font-weight: normal !important;
      margin: 0;
      padding: 0; */
    }

    h3,
    .h3 {
      /* font-family: ubuntu-li; */
      font-size: 18px;
      line-height: 24px;
      /* color: var(--grey);
      font-weight: normal !important;
      margin: 0;
      padding: 0; */
    }
    h4,
    .h4 {
      /* font-family: ubuntu-li; */
      font-size: 18px;
      line-height: 22px;
      /* color: var(--colorsecond);
      font-weight: normal !important;
      margin: 0;
      padding: 0; */
    }
    h5,
    .h5 {
      font-family: ubuntu-li;
      font-size: 20px;
      line-height: 28px;
      color: var(--white);
      font-weight: normal !important;
      margin: 0;
      padding: 0;
    }
    h6,
    .h6 {
      font-family: OpenSans-Regular;
      font-size: 16px;
      line-height: 20px;
      color: var(--lightgrey);
      font-weight: normal !important;
      margin: 0;
      padding: 0;
    }
    h7,
    .h7 {
      font-family: OpenSans-Bold;
      font-size: 50px;
      line-height: 50px;
      color: var(--white);
      font-weight: normal !important;
    }

    h8,
    .h8 {
      font-family: OpenSans-Regular;
      font-size: 16px;
      line-height: 22px;
      color: var(--lightgrey);
      font-weight: normal !important;
    }

    h12,
    .h12 {
      font-family: OpenSans-Regular;
      font-size: 16px;
      line-height: 24px;
      color: var(--white);
      font-weight: normal !important;
    }

    h13,
    .h13 {
      font-family: OpenSans-Regular;
      font-size: 20px;
      line-height: 24px;
      color: var(--lightgrey);
      font-weight: normal !important;
    }

    h14,
    .h14 {
      font-family: OpenSans-Regular;
      font-size: 45px;
      line-height: 60px;
      color: var(--darkgrey);
      font-weight: normal !important;
    }

    p,
    .p {
      /* font-family: ubuntu-li; */
      font-size: 16px;
      line-height: 24px;
      /* color: var(--grey);
      font-weight: normal !important;
      margin: 0;
      padding: 0; */
    }

}



@media screen and (max-width: 500px) {
    h1,
    .h1 {
      /* font-family: ubuntu-li; */
      font-size: 30px;
      line-height: 40px;
      /* color: var(--colorfirst); */
      /* font-weight: normal !important;
      margin: 0;
      padding: 0; */

    }
    h2,
    .h2 {
      /* font-family: ubuntu-b; */
      font-size: 20px;
      line-height: 30px;
      /* color: var(--colorsecond);
      font-weight: normal !important;
      margin: 0;
      padding: 0; */
    }

    h3,
    .h3 {
      /* font-family: ubuntu-li; */
      font-size: 18px;
      line-height: 24px;
      /* color: var(--grey);
      font-weight: normal !important;
      margin: 0;
      padding: 0; */
    }
    h4,
    .h4 {
      /* font-family: ubuntu-li; */
      font-size: 18px;
      line-height: 22px;
      /* color: var(--colorsecond);
      font-weight: normal !important;
      margin: 0;
      padding: 0; */
    }
    h5,
    .h5 {
      /* font-family: ubuntu-li; */
      font-size: 20px;
      line-height: 28px;
      /* color: var(--white);
      font-weight: normal !important;
      margin: 0;
      padding: 0; */
    }
    h6,
    .h6 {
      /* font-family: OpenSans-Regular; */
      font-size: 16px;
      line-height: 20px;
      /* color: var(--lightgrey);
      font-weight: normal !important;
      margin: 0;
      padding: 0; */
    }
    h7,
    .h7 {
      font-family: OpenSans-Bold;
      font-size: 50px;
      line-height: 50px;
      color: var(--white);
      font-weight: normal !important;
    }

    h8,
    .h8 {
      font-family: OpenSans-Regular;
      font-size: 16px;
      line-height: 22px;
      color: var(--lightgrey);
      font-weight: normal !important;
    }

    h12,
    .h12 {
      font-family: OpenSans-Regular;
      font-size: 16px;
      line-height: 24px;
      color: var(--white);
      font-weight: normal !important;
    }

    h13,
    .h13 {
      font-family: OpenSans-Regular;
      font-size: 20px;
      line-height: 24px;
      color: var(--lightgrey);
      font-weight: normal !important;
    }

    h14,
    .h14 {
      font-family: OpenSans-Regular;
      font-size: 45px;
      line-height: 60px;
      color: var(--darkgrey);
      font-weight: normal !important;
    }

    p,
    .p {
      /* font-family: ubuntu-li; */
      font-size: 16px;
      line-height: 24px;
      /* color: var(--grey);
      font-weight: normal !important;
      margin: 0;
      padding: 0; */
    }

}


/* FIM DE FONTES EM MOBILES */


input[type="text"],
input[type="mail"],
input[type="email"],
input[type="number"],
input[type="password"],
select,
.checkbox_holder,
textarea,
.styled-form input,
.styled-form select {
  border: 0px solid var(--white);
  border-radius: 10px;
  background-color: var(--white);
  width: 100%;
  padding: 10px 10px;
  color: var(--grey);
  height: 46px;
}
select
.styled-form select {
  padding: 12px 10px;
  height: 46px;
} 

.SumoSelect{
    width: 100%;
    height: 46px;
    border-radius: 10px;
    background-color: var(--white);
    border: 0px solid var(--white);
}

.SumoSelect .SelectBox{
    height: 46px;
    line-height: 35px;
    border-radius: 10px;
    background-color: var(--white);
    border: 0px solid var(--white);
}

.SumoSelect .SelectBox span,
.SumoSelect .SelectBox p{
    color: var(--grey);
}

.SumoSelect .optWrapper .options li{
    color: var(--grey);
}

.SumoSelect > .optWrapper > .options li label{
    color: var(--grey);
    font-family: ubuntu-li;
    font-size: 14px;
    line-height: 18px;
}

::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: var(--grey);
}
::-moz-placeholder { /* Firefox 19+ */
  color: var(--grey);
}
:-ms-input-placeholder { /* IE 10+ */
  color: var(--grey);
}
:-moz-placeholder { /* Firefox 18- */
  color: var(--grey);
}

.calendar-table .table-condensed thead tr th{
    font-size: 12px;
}

a{
    text-decoration: none !important;
}

.modal-title{
    color: var(--colorfirst) !important;
}


.modal-body,
.modal-body p,
.modal-body .p{
    color: var(--verydarkgrey) !important;
}

.modal-footer .btn-secondary{
    background-color: var(--colorfirst);
    color: var(--white);
    border: 0px;
}

.line_100{
    width: 100%;
    height: 1px;
    background-color: var(--lightgrey);
}

.border_item_pet{
    border:1px solid var(--lightgrey);
    font-size: 25px;
    border-radius: 10px;

    width: 50px;
    height: 50px;
    text-align: center;
    line-height: 50px;
    margin-left: 4px;
    margin-right: 4px;
    display: inline-block;
}

.border_item_pet_calendar{
    border:1px solid var(--colorfirst);
    font-size: 25px;
    border-radius: 10px;
    width: auto;
    height: 50px;
    text-align: center;
    line-height: 50px;
    margin-left: 4px;
    margin-right: 4px;
    display: inline-block;
    padding-left: 8px;
    padding-right: 8px;

    font-family: ubuntu-b;
    font-size: 18px;
    line-height: 50px;
    color: var(--colorfirst);
    font-weight: normal !important;
    letter-spacing:2px;
}

.sideLines {
  overflow: hidden;
  text-align: center;
}

.sideLines:before,
.sideLines:after {
  background-color: var(--colorsecond);
  content: "";
  display: inline-block;
  height: 1px;
  position: relative;
  vertical-align: middle;
  width: 50%;
}

.sideLines:before {
  right: 0.5em;
  margin-left: -50%;
}

.sideLines:after {
  left: 0.5em;
  margin-right: -50%;
}

.hide{
    display: none !important;
}


.a_white a{
    color: var(--white) !important;
}

.img-responsive-force img{
    width: 100%;
    height: auto;
}

.rand_facts_title{
    color: var(--grey);
    font-family: ubuntu-b;
    font-size: 16px;
    line-height: 22px;
    font-style: italic;
}


@media screen and (max-width: 576px ) {

    .mobile_center,
    .mobile_center *{
        text-align:center !important;
    }
    
    .padding_top{
        padding-top: 15px !important;
    }
    
    .padding_top_60{
        padding-top: 30px !important;
    } 
 
} 
     
.container.container--big{
    min-height: 350px !important;
}

@media screen and (max-width: 576px ) {
    .container.container--big{
        min-height: 350px !important;
    }
    
}

/* .row{
    margin-right: 0px !important;
    margin-left: 0px !important;
} */

.image_pop{
    cursor: pointer;
}


.tooltip.bs-tooltip-bottom .tooltip-inner{
    background:var(--colorfirst) !important;
}


.tooltip .arrow:before {
    border-bottom-color:var(--colorfirst) !important;
    border-top-color:var(--colorfirst) !important;
}

.tooltip > .tooltip-inner {
    background-color: var(--colorfirst) !important;
}


.round{
    border-radius: 50%;
}

.testemunho_foto{
    position: absolute;
    bottom: 0;
    transform: translateY(50%);
    border-radius: 50%;
    background-color: white;
    z-index: 1;
}



.dataTables_scrollHead, 
.dataTables_scrollHeadInner{
    width: 100% !important;
}

table.dataTable{
    width: 100% !important;
}
table.dataTable td {
    text-align: center; 
    vertical-align: middle;
}

.dataTables_info{ 
    text-align: left !important;
}

/*
input:invalid {
  border: 1px solid red !important;
}
*/

@keyframes blink {
  50% { border:1px solid red; } 
}  

input.invalid{ /*or other element you want*/
   animation-name: blink ;
   animation-duration: .5s ;
   animation-timing-function: step-end ;
   animation-iteration-count: infinite ;
   animation-direction: alternate ;
   background-color: rgba(255, 0, 0, 0.2) !important;
}
 

.margin_top_15{
  margin-top: 15px;   
}

.main_btn{    
  border-radius: 20px;
  border: 1px solid var(--colorfirst) !important;
  height: 45px !important;
  display: inline-flex;
  align-items: center;
  padding: 0 20px;
  margin: 15px 0;
} 
.main_btn.main_btn_white{    
  border: 1px solid white !important;
} 
.main_btn.main_btn_white:hover{    
  background-color: transparent !important;
} 

.form_holder input .main_btn{
  border: 1px solid var(--colorfirst) !important;
  height: 45px !important;
}

.proj_btn{
  cursor: pointer;
  background-color: var(--colorfirst) !important;
  /* border: solid 1px var(--grey); */
  border-radius: 40px;
  padding: 12px 40px;
  color: white !important;
  /* text-transform: uppercase; */
  border: none;

}

.animated.delay-0s {
  -webkit-animation-delay: 0s;
  animation-delay: 0s;
}
.animated.delay-100ms {
  -webkit-animation-delay: 100ms;
  animation-delay: 100ms;
}
.animated.delay-200ms {
  -webkit-animation-delay: 200ms;
  animation-delay: 200ms;
}
.animated.delay-300ms {
  -webkit-animation-delay: 300ms;
  animation-delay: 300ms;
}
.animated.delay-400ms {
  -webkit-animation-delay: 400ms;
  animation-delay: 400ms;
}
.animated.delay-500ms {
  -webkit-animation-delay: 500ms;
  animation-delay: 500ms;
}
.animated.delay-600ms {
  -webkit-animation-delay: 600ms;
  animation-delay: 600ms;
}
.animated.delay-800ms {
  -webkit-animation-delay: 800ms;
  animation-delay: 800ms;
}
.animated.delay-800ms {
  -webkit-animation-delay: 800ms;
  animation-delay: 800ms;
}
.animated.delay-400ms {
  -webkit-animation-delay: 400ms;
  animation-delay: 400ms;
}



/* video from pet */
    .sideLines {
      overflow: hidden;
      text-align: center;
    }

    .sideLines:before,
    .sideLines:after {
      background-color: var(--colorsecond);
      content: "";
      display: inline-block;
      height: 1px;
      position: relative;
      vertical-align: middle;
      width: 50%;
    }

    .sideLines:before {
      right: 0.5em;
      margin-left: -50%;
    }

    .sideLines:after {
      left: 0.5em;
      margin-right: -50%;
    }

    .noticia_image{
        border-radius: 10px;
    }
        
    .blog_categories{
        width:100%;
        position: fixed;
        z-index: 6;
    }
    .blog_cat_list{
        padding: 15px 0;
        margin: 0;
        width: 100%;
    }

    .blog_cat_submenu{
        display: none;
        position: absolute;
        width: 100%;
        text-align: left;
    }
    .blog_cat_submenu ul{
        list-style: none;
        padding: 5px 10px;
    }
    .blog_cat_submenu li p{
        border-bottom: 1px solid #c4c4c4;
    }
    .blog_cat_submenu > li:last-child p{
        border: 0;
    }

    .blog_cat_list li.has_submenu.active .blog_cat_submenu{
        display: block;
        
    }

    .ler_post_holder{
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        background-color: rgba(184,63,107, 0.4);
        opacity: 0;
        
        -webkit-transition: all 0.3s ease-in-out;
        -moz-transition: all 0.3s ease-in-out;
        -ms-transition: all 0.3s ease-in-out;
        -o-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
    }

    .post_img_holder:hover .ler_post_holder{
        opacity: 1;
    }

    .list_post_corpo{
      overflow: hidden;
      max-height: 110px;
      
    }

    .list_post_titulo{
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .blog_search_box{
        background-color: transparent !important;
        border: solid white 1px !important;
        color: white !important;
        border-right: none !important;
        border-top-right-radius: 0px !important;
        border-bottom-right-radius: 0px !important;
    }
    .blog_search_box::placeholder{
        color: white;
        text-transform: uppercase;
    }

    .blog_search_glass{
        border: solid white 1px;
        border-radius: 10px;
        padding: 10px 10px;
        height: 46px;
        border-left: none;
        border-top-left-radius: 0px;
        border-bottom-left-radius: 0px;
        cursor: pointer;
    }

    .catchoosed{
        cursor: pointer;
        color: white;
    }




    .tv {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        overflow: hidden;
        z-index: -1;
      }
      .tv .screen {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        margin: auto;
        opacity: 0;
        transition: opacity .5s;
      }   
      .tv .screen.active {
        opacity: 1;
      }
      
      .video_section{
          display: block;
      }
      @media (max-width: 1024px) {
          .video_section{
              display: none;
          }
      }
      .video_section_mobile{
          display: none;
      }
      @media (max-width: 1024px) {
          .video_section_mobile{
              display: block;
          }
      }

      /* SLIDER VIDEO */

    .video_slider_holder .slick-slide, .slick-slide::before, .caption {
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
    }

    .video_slider_holder .slick-slide::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }

    .video_slider_holder .main-slider {
        position: relative;
        width: 100%;
        /*height: 38vw;*/
        height: auto;
        min-height: 8vw;
        /* margin-bottom: 50px; */
        opacity: 0;
        visibility: hidden;
        transition: all 1.2s ease;
    }

    .video_slider_holder .main-slider.slick-initialized {
        opacity: 1;
        visibility: visible;
    }

    .video_slider_holder .slick-slide {
        position: relative;
        /* height: 38vw; */
        height: auto;
    }

    .video_slider_holder .slick-slide::before {
        background-color: transparent;
        opacity: 0.3;
        z-index: 1;
    }

    .video_slider_holder .slick-slide video {
        display: block;
        position: absolute;
        top: 50%;
        left: 50%;
        min-width: 100%;
        min-height: 100%;
        width: auto;
        height: auto;
        transform: translate(-50%, -50%);
    }

    .video_slider_holder .slick-slide iframe {
        position: relative;
        pointer-events: none;
    }

    .video_slider_holder .slick-slide figure {
        position: relative;
        height: 100%;
    }

    .video_slider_holder .slick-slide .slide-image {
        opacity: 0;
        height: 100%;
        background-size: cover;
        background-position: center;
        transition: all 0.8s ease;
    }

    .video_slider_holder .slick-slide .slide-image.show {
        opacity: 1;
    }

    .video_slider_holder .slick-slide .image-entity {
        width: 100%;
        opacity: 0;
        visibility: hidden;
    }

    .video_slider_holder .slick-slide .loading {
        position: absolute;
        top: 44%;
        left: 0;
        width: 100%;
    }

    .video_slider_holder .slick-slide .slide-media {
        animation: slideOut 0.4s cubic-bezier(0.4, 0.29, 0.01, 1);
    }

    .video_slider_holder .slick-slide.slick-active {
        z-index: 1;
    }

    .video_slider_holder .slick-slide.slick-active .slide-media {
        animation: slideIn 2.4s cubic-bezier(0.4, 0.29, 0.01, 1);
    }

    .video_slider_holder .slick-slide.slick-active .caption {
        opacity: 1;
        transform: translateY(0);
        transition: all 0.7s cubic-bezier(0.32, 0.34, 0, 1.62) 0.6s;
    }

    .video_slider_holder .caption {
        position: absolute;
        top: 0%;
        bottom: 0;
        right: 0%;

        width: 35%;
        height: 100%;

        text-align: center;
        padding: 20px;
        border: 3px solid;
        color: var(--colorfirst_trans);
        margin: 0;
        font-size: 40px;
        font-weight: bold;
        letter-spacing: 0.02em;
        opacity: 0;
        z-index: 1; 
        transition: all 0.3s ease;
        transform: translateY(100px);
        background-color: rgba(255,255,255, 0.6);
    }

    .video_slider_holder .caption_container_box{
        position: relative;
        height: 100%;
        width: 100%;
    }

    .video_slider_holder .caption_container{
        position: absolute;
        top: 50% !important;
        bottom: auto !important;
        left: 50% !important;
        right: auto !important;
        -ms-transform: translate(-50%,-50%) !important;
        -webkit-transform: translate(-50%,-50%) !important;
        transform: translate(-50%,-50%) !important;
        width: 100%;
    }

    @media (max-width: 1200px) {
        .video_slider_holder .caption {
            width: 50%;
        }
    }

    @media (max-width: 900px) {
        .video_slider_holder .caption {
            width: 60%;
        }
    }

    @media (max-width: 700px) {
        .video_slider_holder .caption {
            width: 100%;
        }
    }

    .video_slider_holder .slick-dots {
        text-align: center;
        /* padding-top: 15px; */

        position: absolute;
        bottom: 5px;
        right: 15px;
    }

    .video_slider_holder .slick-dots li {
        display: inline-block;
        vertical-align: top;
        margin: 0 8px;
    }

    .video_slider_holder .slick-dots li button {
        width: 29px;
        height: 30px;
        border: none;
        cursor: pointer;
        border-radius: 50%;
        /*border: 2px solid var(--colorfirst);*/
        box-shadow: 0 0 0 0 transparent;
        vertical-align: middle;
        color: #fff;
        background-color: var(--colorfirst);
        transition: all 0.3s ease;
        opacity: 0.4;
    }

    .video_slider_holder .slick-dots li button:focus {
        outline: none;
    }

    .video_slider_holder .slick-dots li button:hover {
        opacity: 1;
    }

    .video_slider_holder .slick-dots li.slick-active button {
        border-color: var(--colorsecond);
        box-shadow: 0 0 0 2px #fff;
        opacity: 1;
    }

    .video_slider_holder .container {
        background-color: #f2f2f2;
        color: #444;
        line-height: 1.6;
        padding: 40px 0;
    }

    .video_slider_holder .container .content {
        width: 90%;
        max-width: 980px;
        margin: 0 auto;
    }

    .video_slider_holder .container p {
        margin-bottom: 40px;
    }

    @keyframes slideIn {
        from {
            filter: blur(15px);
        }
        to {
            filter: blur(0);
        }
    }
    @keyframes slideOut {
        from {
            filter: blur(0);
        }
        to {
            filter: blur(15px);
        }
    }


    .slidervideomutebtn{
        position: absolute;
        bottom: 20px;
        right: 20px;
        cursor: pointer;
        z-index: 9999;
    }

    .video_text_holder{
        margin: 50px;
    }

    .topvideoholder_body{
        height: 600px;
    }

    @media (max-width: 575px) {
        .slide-media{
            width: 100% !important;
            height: auto;
            left: 0;
            right: 0;
        }

        .video_text_holder{
            margin: 10px;
            margin-bottom: 80px !important;
        }

        .tv .screen{
            left: 0 !important;
            width: 100% !important;
        }
    
        .video_tv_txt_holder{
            display: none !important;
        }

        .topvideoholder_body{
            height: 350px;
        }

        .topvideoholder{
            /* background-color: #000; */
            z-index: 2;
        }

        .main_body.main_body_mobile_100{
            width: 100% !important; 
        }

        .main_body.main_body_mobile_100 .col-12{
            padding: 0;
            margin: 0;
        }
        
        
        .main_body_mobile_100 .video_slider_holder{
            padding: 0;
            margin: 0;
        }

    }

    .row.row_height_100{
        height: 100% !important;
    }


/* video from pet */

.embed-container{
    position: relative;
    padding-bottom: 56.25%; /* 16/9 */
    overflow: hidden;
}
.embed-container iframe,
.embed-container object,
.embed-container embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.swiper-pagination-bullet{
  transition: all 0.3s ease-in-out;
}

.swiper-pagination{
  white-space: nowrap !important;
}

#subcats_slider_arrow_p{
    left: -3%;
}
#subcats_slider_arrow_n{
    right: -3%;
}

@media (max-width: 991px) {
    #subcats_slider_arrow_p{
        left: -0%;
    }
    #subcats_slider_arrow_n{
        right: -0%;
    }
}   


.bookSlideImageCont{
  width: 45%;
  padding: 0 15px;
}
.bookSlideImageCont img{
  /* box-shadow: rgba(0, 0, 0, 0.3) 0px 19px 38px, rgba(0, 0, 0, 0.22) 0px 15px 12px; */
}
.bookSlideTextCont{
  width: 55%;
  padding: 0 15px;
}

.swiper-pagination-bullet{
  width: 15px !important;
  height: 15px !important;
}