/*
Theme Name: Barcelona Costumer Congress
Description: A child theme of devdmbootstrap4
Version: 0.1
Template: devdmbootstrap4
*/
@import url("css/tt.css");
a,a:hover{
    color:#0c7dc3;
}
@font-face {
	font-family: 'ElegantIcons';
	src:url('css/fonts/ElegantIcons.eot');
	src:url('css/fonts/ElegantIcons.eot?#iefix') format('embedded-opentype'),
		url('css/fonts/ElegantIcons.woff') format('woff'),
		url('css/fonts/ElegantIcons.ttf') format('truetype'),
		url('css/fonts/ElegantIcons.svg#ElegantIcons') format('svg');
	font-weight: normal;
	font-style: normal;
}
body{
    font-family:'Poppins';
}

img.img {
    width: 300px;
}
div#ediciones .col-md-3:last-child {
    display: none;
}

/*AFORO COMPLETO*/
.col-md-4.c2but {
    display: block;
}
.col-md-8.c2claim {
    /*text-align: right;*/
}

.col-md-6.pdf_agenda{
    text-align: right;
    
}
.descargarpdf{
    color: white !important;
    background: #0c7dc3;
    font-size: 18px;
    letter-spacing: 2px;
    padding: 10px 20px 10px 20px;
    border-radius: 30px;
    text-align: center;
    margin-right: 15px;
}


.container {
    max-width:100%;
    padding: 60px 0;
}
.row{
    max-width:1200px;
    margin:0 auto;
}
.pret{
    font-style:italic;
    letter-spacing: 2px;
    font-family: 'Rubik';
}
.pret:before{
    content:'<';
}
.pret:after{
    content:'/>';
}
.dmbs-header{
    position: fixed;
    top:0px;
    padding: 20px 0 0;
    z-index: 2;
    background: rgba(0,0,0,0);
    transition: all 300ms ease;
}
.dmbs-header .row{
    margin:0 15px;
    max-width: 100%;
}
.dmbs-header.wheader{
    background: #fff;
}
.dmbs-header .dmbs-header-left{
    text-align: left;
}
.dmbs-header .dmbs-header-navbar.bg-dark{
    background-color: rgba(0,0,0,0) !important;
}
.navbar-dark .navbar-nav .nav-link{
    color:#fff;
    padding: 0;
    transition: all 300ms ease;
}
.wheader .navbar-dark .navbar-nav .nav-link{
    color:#000;
}
.navbar{
    display: block;
}
.navbar-collapse{
    float: right;
}
.nav-link{
    margin: 0 15px;
}
.dmbs-header .menu-item:last-child a,.dmbs-header .menu-item:last-child a:hover{
    margin:0px 10px 0px 14px;
}
.wheader.dmbs-header .menu-item:nth-child(5) a,.wheader.dmbs-header .menu-item:nth-child(5) a:hover{
    /*color:#000;*/
}
.dmbs-header .menu-item:nth-child(5) a,.dmbs-header .menu-item:nth-child(5) a:hover{
    /*color:rgba(0,0,0,0);*/
}
.dmbs-header .menu-item:nth-child(5) a:before, .dmbs-header .menu-item:nth-child(6) a:before{
    color:#fff;
    font-family: 'ElegantIcons';
}
.wheader.dmbs-header .menu-item:nth-child(5) a:before{
    color:#000;
}
.dmbs-header .menu-item:nth-child(5) a:before{
    /*content: "\55";
    font-family: 'ElegantIcons';*/
}
.dmbs-header #ticket{
    display:none;
}
#cabecera{
    height:100vh;
    background-repeat:no-repeat;
    background-size: cover;
}
#cabecera .row{
    height: 100%;
    align-items: center;
}
#cabecera.cabecera_noticias .row{
    align-items: flex-end;
}

.slidecntnt .pret{
    font-size:18px;
    line-height: 32px;
    color:#fff;
}
.slidecntnt .tit,.slidecntnt .ht{
    color:#fff;
    font-family: 'Poppins';
    font-size:50px;
    line-height: 65px;
    font-weight: 700;
}
.slidecntnt .excr{
    font-size: 15px;
    color:#fff;
    font-family:'Poppins';
    margin-top:30px;
}
#ediciones{
    padding:60px 0;
}
#ediciones .row{
    max-width: 100%;
    height: 330px;
}
#ediciones > .row > div{
    padding: 5px;
}
#ediciones .row div > a{
    display: block;
    background-size: cover;
    height: 100%;
}
#ediciones .row div:nth-child(1){
    padding-left:0;
}
#ediciones .row div:last-child{
    padding-right:0;
}
#ediciones .colorpic{
    opacity:0;
    transition:all 300ms ease;
    position: absolute;
    width:calc(100% - 10px);
    height: calc(100% - 10px);
    background-size: cover;
}
#ediciones h4{
    padding: 20px 46px;
    position: absolute;
    bottom: 0;
    left:0;
    color:#fff;
    font-weight: 700;
    font-size:30px;
    transition:all 300ms ease;
}
#ediciones .row > div > a{
    overflow: hidden;
}
#ediciones .row > div:hover .colorpic{
    opacity:1;
}
#ediciones .row > div:hover h4{
    opacity: 0.5;   
}
#about .pret,#patrocinadores .pret,.pret.blu{
    color:#0c7dc3;
}
#about h4{
    font-size: 40px;
    font-weight: 700;
    max-width: 50%;
}
.image_about img{
    max-width: 100%;
    max-height: 100%;
}
.about-cols{
    margin: 20px 0;
}
.about-cols > div{
    /*padding-left: 0;*/
}
.row.acciones{
    margin: 60px auto 0;
}
.row.acciones > div,.row.acciones > div.iwt-content > h4{
    text-align: center;
}
#about .row.acciones div.iwt-content > h4{
    max-width: 100%;
    font-size:25px;
    margin:28px;
}
.iwt-icon{
    height: 100px;
    overflow: hidden;
}
.iwt-icon .accionnum{
    position: absolute;
    top: 30px;
    left:50%;
    margin-left:-50px;
    width:100px;
    height: 100px;
    background: linear-gradient(135deg, #0c7dc3 1%,#27a851 100%);
    color:#fff;
    font-size:40px;
    font-weight: 700;
}
.iwt-icon .accionnum.atxt{
    padding: 30px 0;
    line-height: 40px;
}
#video{
    background: #000;
}
#video .pret,#last-news .pret,#contacto .pret,#ponentes .pret,#fotos .pret{
    color:#0c7dc3;
    font-size:15px;
}
#video h4,#last-news h4,#ponentes h4,#fotos h4{
    color:#fff;
    font-size:40px;
    max-width: 40%;
    font-weight: 700;   
}

#contacto h4{
    color:#fff;
    font-size:40px;
    font-weight: 700;
}
.vwrp{
    position: relative;
    max-width:1030px;
    margin:65px auto 0;
}
.vid-icon{
    display: block;
}
.vid-icon > svg{
    position: absolute;
    top:-65px;
    right:0;
}
.vidbut{
    position: absolute;
    top: -65px;
    right:0;
    margin-left:-32.5px;
    width:65px;
    height: 65px;
    background: #0c7dc3;
    color:#fff;
    font-size:40px;
    font-weight: 700;   
}
.vidbut:before{
    content: "\f522";
    font-family:'Dashicons';
    border:1px solid #fff;
    color:#fff;
    font-size:14px;
    border-radius:11px;
    width:22px;
    height: 22px;
    position: absolute;
    text-align: center;
    top: 21px;
    left: 21px;
}
#video .vwrp .if-wrp{
    max-width:calc(100% - 130px);
    margin:0 auto;
    display: block;
    position: relative;
}
#video .vwrp .if-wrp iframe{
    max-width: 100%;
    max-height: 506px;
}
#countdown .pret{
    color:#0c7dc3;
    font-size:15px;
}
#countdown h4,h4{
    font-size:40px;
    font-weight: 700;
}
#clock > div{
    text-align: center;
    font-size:72px;
    font-weight: 700;
}
#clabels > div{
    text-align: center;
    font-size:18px;
    font-weight: 700;
    color:#0c7dc3;
}
.col-b-5{
    width:20%;
}
.card, .dmbs-content-wrapper .dmbs-main .dmbs-comments .comment #respond{
    border:0px;
}
.card-header,.dmbs-post-footer{
    border:0px;
    background-color:#fff;
}
.dmbs-post-content p{
    font-size:1rem;
}
.dmbs-post-title a,.dmbs-post-title a:hover{
    color:#000;
}
.dmbs-post-header .pret{
    color:#0c7dc3;
}
.archive-header{
    /*margin:100px 0;
    background: #000;
    color:#0c7dc3;*/
    padding: 0;
}
.archive-header .pret{
    color:#fff;
}
.archive-header h1{
    /*font-size: 18px;
    font-style: italic;
    letter-spacing:2px;*/
    font-size: 40px;
    font-weight: 700;
    width:40%;
    color:#fff;
}
#calltwo{
    position: fixed;
    bottom: 40px;
    z-index: 9;
    margin: 60px 0;
    padding: 0px;
}
#calltwo .row{
    background: #fff;
    padding: 20px;
    position: relative;
    box-shadow: 5px -3px 21px 0 rgba(12,125,195,.37);
}
.c2claim{
    font-size:30px;
    font-weight: 700;
}
.c2but a:hover{
    color:#fff;  
}
.c2but a{
    background: #0c7dc3;
    color:#fff;
    font-size:18px;
    letter-spacing: 2px;
    margin: 5px 0;
    padding: 10px;
    border-radius:30px;
    text-align: center;
    text-transform: uppercase;
    display: block;
}
.close-tab{
    color:#999;
    cursor: pointer;
    position: absolute;
    top:10px;
    right:10px;
}
.close-tab:before{
    font-family:'Dashicons';
    content: "\f335";
}
.dropdown-toggle::after{
    display: none;
}
.dropdown-menu{
    border-radius: 0;
    left:15px;
}
.dmbs-post-featured-image{
    padding: 1.25rem
}
.card-footer.dmbs-post-footer{
    padding: .75rem 0;
}
.dmbs-post-meta-header{
    font-size: 14px;
}
dmbs-post-meta-header > .row > div{
    margin:0;
}
.dmbs-post-date{
    margin-right:15px;
}
.dmbs-post-meta-header a,.dmbs-post-meta-header a:hover{
    color:#000;
}
.bcc-footer{
    background: #555;
    color:#fff;
    padding: 20px 0;
}
.bcc-footer > .row{
    align-items: center;
}
.bcc-footer > .row > div:nth-child(2){
    text-align: center;
}
.bcc-footer > .row > div:nth-child(3){
    text-align: right;
}
.bcc-footer > .row > div:nth-child(3) > *{
    vertical-align: middle;
}
.bcc-footer > .row > div:nth-child(3) span{
    padding-top: 5px;   
}
.bcc-footer a.rrss,.bcc-footer a.rrss:hover{
    color:#fff;
    text-decoration: none;
}
.bcc-footer a.rrss:before{
    font-size: 35px;
    margin:0 5px;
}
#last-news h4,#ponentes h4,#fotos h4{
    color: #000;
    margin-bottom: 20px;
}
#last-news .row .row > div > div{
    float:right;
}
.home-blog-date{
    color:#fff;
    background: #0c7dc3;
    width: 65px;
    height: 65px;
    background: #0c7dc3;
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    text-align: center;
}
.home-blog-date .day{
    line-height: 16px;
    margin-top: 16px;
}
.home-blog-date .month{
    text-transform: capitalize;
}
#last-news h5 a,#last-news h5 a:hover{
    color:#000;
    font-size: 24px;
    font-weight: 700;
    line-height: 22px;
}
.home-blog-excerpt{
    font-size:14px;
    line-height: 18px;
}
#last-news .read-more{
    font-weight: 700;
    text-transform: uppercase;
    color:#000;
}
#contacto{
    background: #000;
    color:#fff;
}
#contacto .row > div:nth-child(3),#contacto .row > div:nth-child(3) a{
    color:#7da7bc;
    font-size:14px;
    line-height: 18px;
}
#contacto .row > div:nth-child(3) p{
    margin-bottom: 0;
}
#contacto .row > div:nth-child(3) strong{
    margin: 0 0 18px;
    display:block;
}
#contacto .row > div:nth-child(3) strong:nth-child(1){
    margin: 18px 0;
}
#contacto input,#contacto textarea{
    background: #000;
    color:#fff;
    border-width:0 0 1px 0;
    border-color: #fff;
    margin-bottom: 20px;
    max-width:100%;
}
#contacto textarea{
    height: 24px;   
}
#contacto input[type=submit]{
    background: #0c7dc3;
    color: #fff;
    font-size: 18px;
    letter-spacing: 2px;
    margin: 5px 0;
    padding: 10px 20px;
    border-radius: 30px;
    text-align: center;
    text-transform: uppercase;
    display: block;
    border-width: 0;
}
#cabecera.cabecera_edicion{
    height: 75vh;
}
.fullrow{
    max-width: 100%;
}
.ponente{
    height:500px;
    padding: 15px;
    position: relative;
    background-size: cover;
    background-position: 50% 50%;
    transition:all 300ms ease;
    background-color:#0c7dc3;
}
.ponente:hover{
    background-position: 20% 50%;
    background-blend-mode: hard-light;
}
.ponente h5,.ponente p{
    color:#fff;
}
.ponente h5{
    font-size:30px;
    font-weight:700;
    line-height: 39px;
    opacity: 0.5;
}
.ponente p{
    font-size:14px;
    line-height: 25px;
}
.ponente .phover{
    opacity: 0;
    transition:all 300ms ease;
}
.ponente:hover .phover,.ponente:hover h5{
    opacity: 1;   
}
.ponente .pret{
    transition:all 300ms ease;
}
.ponente:hover .pret{
    color:#fff !important;   
}
.track{
    margin:0 -15px;
    padding:15px;
    background: rgba(0,0,0,0.5);
    color:#fff;
    position: absolute;
    bottom: 70px;
    width: 100%;
}
.track p{
    line-height: 14px;
    margin-bottom: 0;
    margin-top:10px;
}
.track .track-n{
    text-transform: uppercase;
    font-weight: 700;
    margin-top: 0;
}
.ponente .pgo{
    position: absolute;
    bottom: 15px;
    color:#fff;
    font-size:36px;
    left:15px;
}
.ponente .pgo:hover{
    color:#fff;
    text-decoration: none;
}
.ponente > a:nth-of-type(2){
    left:80px;
}
.ponente > a:nth-of-type(3){
    left:135px;
}
#patrocinadores h6{
    font-size:40px;
    font-weight: 700;
}
#patrocinadores h6,#patrocinadores .pret{
    text-transform: capitalize;
}
#patrocinadores > .row > div{
    margin-bottom: 50px;
}
#patrocinadores > .row > div img{
    margin:20px;   
}
.navbar-dark .navbar-toggler{
    float:right;
    border-width: 0px;
    background: #fff;
    color:#000;
    border-radius: 0px;
    border-width: 0px;
}
.navbar-dark .navbar-toggler:focus{
    outline: 0;
}
.bcc-footer p{
    margin:0;
}
#menu-legal_footer{
    flex-direction: row;
    justify-content: center;
}
#menu-legal_footer a,#menu-legal_footer a:hover{
    color:#fff;
    font-size:12px;
    margin:0 5px;
}
#menu-legal_footer li{
    display: inline;
}
#loader{
    position: fixed;
    width:120%;
    height: 120%;
    background-color: rgba(12,125,195,1);
    top:-10%;
    background-image: url('imgs/B_Customer_Employee_Week.png');
    background-position: center;
    background-repeat: no-repeat;
    background-size: auto;
    z-index: 999;
    /*transition: all 300ms ease;*/
    animation: loader 2s infinite;
    /*transform-origin: center center;*/
    left: -10%;
}
@keyframes loader{
    0%{transform: scale(1);}
    30%{transform: scale(0.95);}
    40%{transform: scale(0.9);}
    70%{transform: scale(1);}
}
.page-id-33 h6{
    font-size:24px;
    font-weight: 700;
}
.page-id-33 #cabecera .pret{
    color:#fff;
}
.page-id-33 p{
    font-size:14px;
}
.page-id-33 h4{
    width:40%;
    margin-bottom: 30px;
}
.sc-iconos{
    text-align: center;
    margin-top:40px;
}
.sc-iconos p{
    font-size:14px;
}
#bcc,#opiniones{
    background: #000;
    color:#fff;
}
#bcc,#opiniones{

}
#objetivos .img-wrp{
    position: relative;
}
#objetivos .img-wrp .objico{
    position: absolute;
    bottom:0;
    left:0;
    background: linear-gradient(135deg, #0c7dc3 1%,#27a851 100%);
}
#opiniones h6,#opiniones p,.perfiles h6{
    text-align: center;
    
}
.perfiltxt,.perfilttl{
    margin-top:40px;
}
.iwt-icon{
    text-align: center;
    margin-bottom: 60px;
}
#objetivos h6{
    margin-top:20px;
    font-size:24px;
}
.obj-image{
    margin-top:60px;
}
.obj-image img{
    max-width: 100%;   
}
#contacta h4{
    font-size:24px;
}
.rrss-sc{
    justify-content: center;
}
.rrss-sc > div{
    text-align: center;
}
.rrss-sc a.rrss,.rrss-sc a.rrss:hover{
    text-decoration: none;
    color:#0c7dc3;
}
.rrss-sc a.rrss:before{
    font-size:60px;
}
.simple-page header h2{
    text-align: center;
    font-weight: 700;
    margin-top: 100px;
}
.timetable{
    margin-top:40px;
    text-align: left;
}
.timetable p{
    margin-bottom: 0;
}
.timetable > div{
    margin:2px 0;
    padding: 10px 0;
}
.timetable > div > div{
    padding: 10px 40px;
    margin:0 15px;
    
}
.timetable h6{
    font-size:24px;   
    font-weight: 700;
}
.timetable .hora{
    font-size:14px;
    font-style: italic;
    text-align:right;
    padding: 5px 40px;
}
.timetable .titulo{
    font-weight: 700;
    font-size:18px;
}
.timetable .descripcion{
    font-size:14px;
}
#perfil{
    background: #f2f2f2;
}
.b-in-out{
    background: #27a851;
    color:#fff;
}
.b-networking{
    background: #555;
    color:#fff;    
}
.b-in-out > .titulo,.b-networking > .titulo{
    margin: 0;
    padding: 0;
}
.b-track{
    background: #0c7dc3;
    color:#fff;
}
.b-track > .titulo{
    text-transform: uppercase;
    letter-spacing: 2px;
}
.b-track .row{
    background: #bee0f4;
    border-top:2px solid #fff;
    color:#000;
}
.b-track .row .titulo{
    font-size: 18px;
    letter-spacing: 0px;
}
.b-track .row div .titulo{
    text-transform: none;
}
#last-news .row .row{
    margin-top:60px;
}
.cabecera_noticias{
    background-image: url('imgs/blog_head.jpg');
    max-width: 100%;
}
.cabecera_noticias h1{
    width:60%;
}
.iwt-icon svg{
    opacity:0;
}
#maravillosa a,#maravillosa a:hover{
    color:#fff;
    font-size:12px;
}
@media (max-width: 992px){
    .dmbs-header .row .navbar-collapse{
        background: #fff;
        border-right: 1px solid #ccc;
        padding-right: 20px;
    }
    .navbar-dark .navbar-nav .nav-link{
        color:#000;
    }
    .navbar-dark .navbar-nav .nav-link:hover{
        color:#000;   
    }
    .navbar-collapse .dropdown-menu{
        border-width: 0px;
    }
    .dmbs-header .menu-item:nth-child(5) a, .dmbs-header .menu-item:nth-child(6) a, .dmbs-header .menu-item:nth-child(5) a:hover, .dmbs-header .menu-item:nth-child(6) a:hover,.dmbs-header .menu-item,.dmbs-header .menu-item:hover{
        margin: 0;
    }
    .nav-link{
        margin: 0;
    }
    .bcc-footer > .row > div{
        text-align: center !important;
        margin: 20px 0;
    }
}
@media (max-width: 768px){
    #ediciones .row{
        height: 100vh;
    }   
}
@media (max-width: 576px){
    #clock > div{
        font-size: 48px;
    }
    #clabels > div{
        font-size: 14px;
    }
    .descargarpdf{
        width: 100%;
        display: block;
    }

.slidecntnt .excr{
    font-size: 17px !important;
}

#button-home{
    width: 100% !important;
}


}




#agenda{
    padding:60px 0;
}
#agenda .row{
    max-width: 100%;
    height: 330px;
}
#agenda > .row > div{
    padding: 5px;
}
#agenda .row div > a{
    background: rgb(2,0,36);
background: linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(86,121,9,1) 0%, rgba(17,126,149,1) 100%);
    display: block;
    height: 100%;
}
#agenda .row div:nth-child(1){
    padding-left:0;
}
#agenda .row div:last-child{
    padding-right:0;
}
#agenda .colorpic{
    opacity:0;
    transition:all 300ms ease;
    position: absolute;
    width:calc(100% - 10px);
    height: calc(100% - 10px);
    background-size: cover;
}
#agenda h4{
    padding: 20px 46px;
    position: absolute;
    bottom: 0;
    left:0;
    color:#fff;
    font-weight: 700;
    font-size:30px;
    transition:all 300ms ease;
}
#agenda .row > div > a{
    overflow: hidden;
}
#agenda .row > div:hover .colorpic{
    opacity:1;
}
#agenda .row > div:hover h4{
    opacity: 0.5;   
}

.main{
  max-width: 1200px;
  margin: 0 auto;
}

.btn {
  color: #ffffff;
  padding: 0.8rem;
  font-size: 14px;
  text-transform: uppercase;
  border-radius: 4px;
  font-weight: 500;
  display: block;
  width: 50%;
  cursor: pointer;
  border: 1px solid rgba(255, 255, 255, 0.2);
  background: transparent;
}

.btn:hover {
  background-color: rgba(255, 255, 255, 0.12);
}

.cards {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  margin: 0;
  padding: 0;
}

.cards_item {
  display: flex;
  padding: 1rem;
}

.cards_item > a {
    width: 100%;
}


.cards_item_mid {
  display: flex;
  padding: 1rem;
}

.cards_item_mid > a {
    width: 100%;
}

@media (min-width: 40rem) {
  .cards_item {
    width: 20%;
  }

  .cards_item_mid {
    width: 50%;
  }

}

@media (min-width: 56rem) {
  .cards_item {
    width: 20%;
  }
.cards_item_mid {
    width: 50%;
  }
}
@media (max-width: 768px){
    .cards_item {
        width: 100%;
    }

  .cards_item_mid {
    width: 100%;
  }
    .row-cols-lg-8 > a {
      -ms-flex: 0 0 33% !important;
      flex: 0 0 33% !important;
      max-width: 33% !important;
      padding:1em 0;
    }

}

@media (max-width: 411px){

    .row-cols-lg-8 > a {
      -ms-flex: 0 0 100% !important;
      flex: 0 0 100% !important;
      max-width: 100% !important;
      padding: 1em 0;
    }


}

.card_b {
  background-color: white;
  border-radius: 0.25rem;
  box-shadow: 0 20px 40px -14px rgba(0, 0, 0, 0.25);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  width: 100%;
  height: 100%;
}

.card_c {
  background-color: white;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  width: 100%;
  height: 100%;
}

.card_content {
  padding: 1rem;
  background: linear-gradient(to bottom left, #0D7FBE 40%, #25A557 100%);
  height: 100%;
}

.card_content_1, .card_content_2{
      padding: 1rem;
background-size: contain;
    background-repeat: no-repeat;
      height: 100%;
}


.card_title {
  color: #ffffff;
  font-size: 2rem;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: capitalize;
  margin: 0px;
}

.card_text {
  color: #ffffff;
  font-size: 1rem;
  line-height: 1.5;
  margin-bottom: 1.25rem;    
  font-weight: 400;
}



    .row-cols-lg-8 > a {
      -ms-flex: 0 0 12.5%;
      flex: 0 0 12.5%;
      max-width: 12.5%;
    }

#part{
    display: block;
}

#part > img{
    width: 100%;
}

img.promo{
width: 45%;
    display: block;
    margin: 0 auto;
}

.destacado{
    font-size: 40px;
    font-weight: 700;
    width: 100%;
    margin-bottom: 50px;
    text-transform: capitalize;
}



#button-home{
    color: #fff;
    background-color: #00000096;
    border-color: #fdfeff;
    width: 40%;
    margin: 20px auto;
}

#button-home:hover{
        background-color: #000000;
        cursor: pointer;
        transition: all 0.3s ease;
        position: relative;
        /*display: inline-block;*/
}