@font-face {
    font-family: 'Empera';
  
    src: url('../fonts/empera-regular.ttf');
    src: url('../fonts/empera-regular.ttf') format('embedded-opentype'), url('../fonts/empera-regular.ttf') format('truetype');
}

:root{
    --principal_text: #05182f;
    --principal_hover: #888888;
    --principal_bg: #E7E7E7;
  }

.img-shadow{
    filter: drop-shadow(0 2px 5px rgba(0, 0, 0, 0.7));
}

.img-shadow-2{
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.2));
}

.img-shadow-3{
  filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.9));
}

.round{
    border-radius: 100px !important;
}

.v-center{
  display: flex !important; 
  align-items: center !important;
}

.bg-info{
    background-color: #EAEAEA !important;
}

.white-txt{
    color: white !important;
}

.casta-txt{
    font-family: 'Empera' !important;
    font-weight: normal !important;
}

/* BACKGROUNDS */
.bg-casta{
    background-image: url('../img/casta_bg_x1_10.png') !important;
    /* background-position: center !important; 
    -webkit-background-size: cover !important;
    -moz-background-size: cover !important;
    -o-background-size: cover !important;
    background-size: cover !important;     */
}

.bg-casta-50{
    background-image: url('../img/casta_bg_x1_50.png') !important;
}

.bg-casta-solid{
    /* background-image: url('../img/casta_bg_x1_10.png') !important; */
    background-position: center !important; 
    -webkit-background-size: cover !important;
    -moz-background-size: cover !important;
    -o-background-size: cover !important;
    background-size: cover !important;    
}

.bg-casta-solid.scrolled{
    background: #000 !important;
    background-image: url('../img/casta_bg_x1_10.png') !important;
    background-position: center !important; 
    -webkit-background-size: cover !important;
    -moz-background-size: cover !important;
    -o-background-size: cover !important;
    background-size: cover !important;    
}

.bg-casta-img{
    background: #000 !important;
    background-image: url('../img/casta_bg_img.jpeg') !important;
    background-position: center !important; 
    -webkit-background-size: cover !important;
    -moz-background-size: cover !important;
    -o-background-size: cover !important;
    background-size: cover !important;   
}

/*
Gradient Background colors
*/
.bg-teal-gradient {
    background: #39cccc !important;
    background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #39cccc), color-stop(1, #7adddd)) !important;
    background: -ms-linear-gradient(bottom, #39cccc, #7adddd) !important;
    background: -moz-linear-gradient(center bottom, #39cccc 0%, #7adddd 100%) !important;
    background: -o-linear-gradient(#7adddd, #39cccc) !important;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#7adddd', endColorstr='#39cccc', GradientType=0) !important;
    color: #fff;
  }
  .bg-light-blue-gradient {
    background: #3c8dbc !important;
    background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #3c8dbc), color-stop(1, #67a8ce)) !important;
    background: -ms-linear-gradient(bottom, #3c8dbc, #67a8ce) !important;
    background: -moz-linear-gradient(center bottom, #3c8dbc 0%, #67a8ce 100%) !important;
    background: -o-linear-gradient(#67a8ce, #3c8dbc) !important;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#67a8ce', endColorstr='#3c8dbc', GradientType=0) !important;
    color: #fff;
  }
  .bg-blue-gradient {
    background: #0073b7 !important;
    background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #0073b7), color-stop(1, #0089db)) !important;
    background: -ms-linear-gradient(bottom, #0073b7, #0089db) !important;
    background: -moz-linear-gradient(center bottom, #0073b7 0%, #0089db 100%) !important;
    background: -o-linear-gradient(#0089db, #0073b7) !important;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0089db', endColorstr='#0073b7', GradientType=0) !important;
    color: #fff;
  }
  .bg-aqua-gradient {
    background: #00c0ef !important;
    background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #00c0ef), color-stop(1, #14d1ff)) !important;
    background: -ms-linear-gradient(bottom, #00c0ef, #14d1ff) !important;
    background: -moz-linear-gradient(center bottom, #00c0ef 0%, #14d1ff 100%) !important;
    background: -o-linear-gradient(#14d1ff, #00c0ef) !important;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#14d1ff', endColorstr='#00c0ef', GradientType=0) !important;
    color: #fff;
  }
  .bg-yellow-gradient {
    background: #f39c12 !important;
    background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #f39c12), color-stop(1, #f7bc60)) !important;
    background: -ms-linear-gradient(bottom, #f39c12, #f7bc60) !important;
    background: -moz-linear-gradient(center bottom, #f39c12 0%, #f7bc60 100%) !important;
    background: -o-linear-gradient(#f7bc60, #f39c12) !important;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f7bc60', endColorstr='#f39c12', GradientType=0) !important;
    color: #fff;
  }
  .bg-purple-gradient {
    background: #932ab6 !important;
    background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #932ab6), color-stop(1, #b959d9)) !important;
    background: -ms-linear-gradient(bottom, #932ab6, #b959d9) !important;
    background: -moz-linear-gradient(center bottom, #932ab6 0%, #b959d9 100%) !important;
    background: -o-linear-gradient(#b959d9, #932ab6) !important;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#b959d9', endColorstr='#932ab6', GradientType=0) !important;
    color: #fff;
  }
  .bg-green-gradient {
    background: #00a65a !important;
    background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #00a65a), color-stop(1, #00ca6d)) !important;
    background: -ms-linear-gradient(bottom, #00a65a, #00ca6d) !important;
    background: -moz-linear-gradient(center bottom, #00a65a 0%, #00ca6d 100%) !important;
    background: -o-linear-gradient(#00ca6d, #00a65a) !important;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00ca6d', endColorstr='#00a65a', GradientType=0) !important;
    color: #fff;
  }
  .bg-red-gradient {
    background: #f56954 !important;
    background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #f56954), color-stop(1, #f89384)) !important;
    background: -ms-linear-gradient(bottom, #f56954, #f89384) !important;
    background: -moz-linear-gradient(center bottom, #f56954 0%, #f89384 100%) !important;
    background: -o-linear-gradient(#f89384, #f56954) !important;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f89384', endColorstr='#f56954', GradientType=0) !important;
    color: #fff;
  }
  .bg-black-gradient {
    background: #222222 !important;
    background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #222222), color-stop(1, #3c3c3c)) !important;
    background: -ms-linear-gradient(bottom, #222222, #3c3c3c) !important;
    background: -moz-linear-gradient(center bottom, #222222 0%, #3c3c3c 100%) !important;
    background: -o-linear-gradient(#3c3c3c, #222222) !important;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#3c3c3c', endColorstr='#222222', GradientType=0) !important;
    color: #fff;
  }
  .bg-maroon-gradient {
    background: #85144b !important;
    background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #85144b), color-stop(1, #b11b64)) !important;
    background: -ms-linear-gradient(bottom, #85144b, #b11b64) !important;
    background: -moz-linear-gradient(center bottom, #85144b 0%, #b11b64 100%) !important;
    background: -o-linear-gradient(#b11b64, #85144b) !important;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#b11b64', endColorstr='#85144b', GradientType=0) !important;
    color: #fff;
  }


.download-box{
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);border-radius: 5px; padding: 10px; margin: 15px;
}

.download-box > center > i {
    font-size: 5rem;
}

.fb-container {
    width: 500px;
}

.pull-right{
    float: right!important;
}

@media screen and (max-width: 560px) {
    .download-box > center > a > span{
      display: none !important;
    }

    .fb-container {
        width: 150px;
    }
    
}

.img-gallery{
    margin: 2px;
}

.img-round-10{
    border-radius: 10px !important;
}

.center{
    margin: auto;
    display: block;
}

.casta-light{
    filter: drop-shadow(0 2px 5px rgb(255, 196, 0));
}

.yellow-color{
    color:yellow !important;
}

.white-color{
    color:white !important;
}

.success-color{
  color: #08b866 !important;
}

.danger-color{
  color: #f56954 !important;
}

.main-color{
  color: var(--principal_text) !important;
}


.link{
    color: #EAEAEA !important;
    text-decoration: underline wavy #EAEAEA;
}

.link:hover{
    color: white !important;
    text-decoration: underline wavy white;
}

.link-dark{
    color: black !important;
    text-decoration: underline wavy black;
}

.link-dark:hover{
    color: rgba(0, 0, 0, 0.733) !important;
    text-decoration: underline wavy rgba(0, 0, 0, 0.733);
}

.column-money{
    text-align:right; font-weight:600;
}






/* CODEIGNITER TEMPLATE */
/* WEEEB */
.treeview-web {
    display: none;
    list-style: none;
    padding: 0;
    margin: 0;
}

.treeview-web > li > a {
    color: #EAEAEA !important;
    margin-left: 25px !important;
    font-size: 0.9rem;
    line-height: 15px !important;    
}


@media screen and (max-width: 560px) {  
    .mobile-hdn{
      display: none !important;
    }
  
    .mobile-vw{
      display: block !important;
    }
  
    .desk-vw{
      display: none !important;
    }

    .spotify-widget{
      height: 260px !important;     
    }
  
}
  
.mobile-vw{
  display: none;
}

.desk-vw{
  display: block;
}

.spotify-widget{
  height: 352px;     
}

.pointer{
  cursor: pointer !important;
}

.page{                                
  background-color: #f1f2f3 !important;
  border-color: #f1f2f3 !important;
}

.page-selected{
  font-weight: 600 !important;
  background-color: #e2e6ea !important;
  border-color: #dae0e5 !important;
}


/* Blog Page ==================================================================================*/
.blogpage-section {
  position: relative;
  padding: 50px 0;
  background: #f9f9fb;
  width: 100%;
  float: left;
}
.blogpage-section .blog_content {
  text-align: center;
}
.blogpage-section .blog_content h2 {
  margin-bottom: 46px;
}
.blogpage-section .blog-box{
  position: relative;
  background: var(--primary-color);
  z-index: 3;
width: 100%;
margin-bottom: 25px;
box-shadow: 50px 50px 50px rgb(0 0 0 / 5%);
border-radius: 10px;
overflow: hidden;
}
.blogpage-section .blog-box .post-image .badge{
margin-left: 5px !important;
filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.4)) !important;
}
.blogpage-section .blog-box .lower-portion{
  padding: 26px 30px 20px;
border-bottom: 1px solid var(--button-color);
}
.blogpage-section .blog-box .lower-portion i{
  font-size: 13px;
  color: var(--button-color);
  margin-right: 3px;
  margin-bottom: 10px;
}
.blogpage-section .blog-box .lower-portion .text-mr{
  margin-right: 20px;
  color: var(--text-color);
}
.blogpage-section .blog-box .lower-portion h5{
  font-size: 22px;
  line-height: 30px;
  margin-bottom: 0;
color: var(--text-color);
  position: relative;
  letter-spacing: 0;
  word-spacing: 0;
  font-weight: 500;
}
.blogpage-section .blog-box .lower-portion a{
display: inline-block;
}
.blogpage-section .blog-box .lower-portion a:hover h5{
color: var(--button-color);
}
.blogpage-section .blog-box .button-portion {
position: relative;
padding: 16px 30px 16px 30px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.blogpage-section .blog-box .button-portion .date{
display: inline-block;
}
.blogpage-section .blog-box .button-portion .button{
display: inline-block;
}
.blogpage-section .blog-box .button-portion span {
  color: var(--text-color);
}


.blogpage-section .blog-box-2{
  /* position: relative;
  z-index: 3;
width: 100%;
margin-bottom: 25px;
box-shadow: 50px 50px 50px rgb(0 0 0 / 5%);
border-radius: 10px;
overflow: hidden; */

background-size: cover; 
background-size: 250%;
background-repeat: no-repeat;    
background-position: center;
height: 350px;
align-items: end; 
display: flex;
position: relative;

-webkit-transition: all .5s;
  -moz-transition: all .5s;
  -o-transition: all .5s;
transition: all 0.3s ease-in-out;
cursor: pointer;
}

.blogpage-section .blog-box-2:hover, .blog-box-2:focus{
background-size: 350%;
}

.blogpage-section .blog-box .button-portion .calendar-ml {
  font-size: 18px;
  color: var(--button-color);
  margin-right: 0px;
  margin-bottom: 28px;
}
.blogpage-section .blog-box .button-portion .read_more {
  background: var(--button-color);
  color: var(--primary-color);
  font-size: 14px;
  line-height: 22px;
  font-weight: 400;
  padding: 14px 24px 14px 26px;
  text-align: center;
  display: inline-block;
  transition: all 0.3s ease-in-out;
border: none;
  overflow: visible;
  outline: none;
border: 1px solid transparent;
border-radius: 10px;
}
.button-portion .date i{
  color: var(--button-color);
  margin-right: 5px;
}
.blogpage-section .blog-box .button-portion .read_more:hover {
color: var(--button-color);
  background: transparent;
border-color: var(--button-color);
}
.blog-posts a{
  text-decoration: none;
}

.insta_button{
  
}

.share-btn-instagram {
  background: radial-gradient(circle farthest-corner at 0% 150%, #ffe17d 0%, #ffcd69 12%, #fa9137 25%, #eb4141 41%, transparent 95%), linear-gradient(-15deg, #234bd7 -10%, #c33cbe 65%);
  background-size: 110% 110%;
  animation: GradientBackground 5s ease-out infinite;
  transition: 0.3s;
}

.share-btn-instagram:hover {
  background: radial-gradient(circle farthest-corner at 0% 150%, #ffe17d 0%, #ffcd69 12%, #fa9137 25%, #eb4141 41%, transparent 95%), linear-gradient(-15deg, #234bd7 -10%, #c33cbe 65%);
  background-size: 170% 170%;
}

.share-btn-instagram:active {
  background: radial-gradient(circle farthest-corner at 0% 150%, #ffe17d 0%, #ffcd69 12%, #fa9137 25%, #eb4141 41%, transparent 95%), linear-gradient(-15deg, #234bd7 -10%, #c33cbe 65%) !important;
  background-size: 200% 200% !important;
  filter: drop-shadow(0 2px 4px #fa9137) !important;
}
/*==================================================================================*/
