/* search display */
/* Form styles */
.activity-search-form {
/*    width: 650px;*/
    max-width: 100%;
}

.activity-search-form *:focus {
    outline: none;
}
.activity-search-form .form-item select, .activity-search-form .form-item input {
    width: 400px;
    padding: 13px;
    margin-bottom: 0;
    outline: none;
    height: auto;
    font-size: 1.8rem;
    max-width: 100%;
    margin-bottom: 5px;
    margin: 0 auto;
    background: transparent;
    margin-bottom: 5px;
    color: #fff;
    border: none;
    border-bottom: 1px solid white;
}

.activity-search-form .form-item input::placeholder {
    color: white;
}
/*.activity-search-form .form-item:after{
    display: inline-block;
    font-family: "Font Awesome 5 Free";
     font-weight: 900;
    content: "\f002";
    position: absolute;
    right: 10px;
    z-index: 10;
    top: 0;
}*/
.searchblock .block {
    padding-top: 20vh;
}

.activity-search-form .form-item.form-item-name {
    text-align: center;
    width: 100%;
}
.activity-search-form .form-item {
    display: inline-block;

    box-sizing: border-box;
    margin: 0;
    padding: 0;
    position: relative;
}
/* Results styles */
.searchblock {
    position: fixed;
    z-index: 9999;
    left: 0;
    width: 100%;
    top: 0;
    height: 100vh;
    display: none;
    background: #000000e8;
    align-items: flex-start;
    justify-content: center;
    align-content: flex-start;
    flex-direction: row;
    flex-wrap: nowrap;
}
.searchblock.active{
    display:flex;
}

.search-icon-re{
    position: absolute;
    z-index: 10000;
    /* height: 46px; */
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    justify-content: center;
    align-content: center;
    flex-wrap: nowrap;
    flex-direction: row;
    background: none;
    padding: 10px;
    transform: translateX(-110%) translateY(15px);
}
.searchblock  .search-icon-re{
    transform:none;
}

.navbar-collapse .search-icon-re {


    transform: translateX(-110%) translateY(2px);
}

.spinner-container{
    display: flex;
    height: 200px;
    justify-content: center;
    align-content: center;
    padding-top:10vh;

}
.searchblock .search-icon-re.active {
    background: none;
    right: 25px;
    top: 27px;
    position: absolute;
}
.noresults{
    padding-top:10vh;
        color: #fff;

}
.path-not-frontpage .search-icon-re {
    z-index: 10000;
    /*background:transparent;*/
}


.search-icon-re.active svg,
.search-icon-re.active img{
    display: none;
}
.searchblock .search-icon-re.active:before {
    content: "";
    width: 35px;
    height: 2px;
    display: inline-block;
    -webkit-transform: rotate(43deg);
    transform: rotate(43deg);
    position: absolute;
    top: 50%;
    left: calc(50% - 17px);
    background-color: #fff;
}

.search-icon-re,
.search-icon-re i,
.search-icon-re svg{
    font-size: 27px;
}
.navbar-collapse .search-icon-re,
.navbar-collapse .search-icon-re i,
.navbar-collapse .search-icon-re svg{
    color:#333;
    font-size: 20px;
}

@media(max-width: 992px){
    .navbar-collapse .search-icon-re {
        z-index: 10000;
        right: 0;
        position: relative;
        background:transparent;
        transform: translateX(0) translateY(0) scale(0.7);
    }


    .navbar-collapse .search-icon-re, .navbar-collapse .search-icon-re i, .navbar-collapse .search-icon-re svg {
        color: #333;
        font-size: 33px;
        border-radius: 12px;
        background: #fff;
    }
    .navbar-collapse .search-icon-re:after {
        content: " Buscar";
        padding-left: 19px;
    }
    .path-frontpage .cat-container{
        display: block !important;
    }


}
.searchblock .search-icon-re.active:after {
    content: "";
    width: 35px;
    height: 2px;
    display: inline-block;
    -webkit-transform: rotate(-43deg);
    transform: rotate(-43deg);
    position: absolute;
    top: 50%;
    left: calc(50% - 17px);
    background-color: #fff;
}
.activity-search-form #product-search-result{
	width: 100%;
}
.activity-search-form .container-results{

}
.resultimg {
    flex-basis: 12%;
}
.resultimg img {
    max-width: 100%;
    height: auto;
}

.results-bar .emotag,
.results-bar .readtime,
.results-bar{
    display: flex;
    margin-right: auto;
    padding: 2px 0 0 0;
    align-items: center;
}

.results-bar {
    justify-content: space-between;
    padding-left: 5px;
}
.results-bar .details{
    margin-bottom: 0;
}

.resultbody {
    flex-basis: 88%;
    padding-left: 10px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: stretch;
}
.activity-search-form .container-row > a:hover {
    text-decoration: none;
    color: #222;
    background: #f7f7f7e0;
    /*border-left: 10px solid #b9b4b4;*/
}
.activity-search-form .container-results {
    max-height: 60vh;
    overflow-y: scroll;
}
.activity-search-form .container-row > a {
    border-left: 0px solid #000;
    border-color: #fff;
    transition: all 200ms ease-in-out;
    position: relative;
    color: #fff;
    display: block;
    text-decoration: none;
    padding: 10px;
    margin-bottom: 4px;
    background: none;
    border-bottom: 1px solid #f1f1f1;
    display: flex;
}
@media (max-width: 992px){
    .activity-search-form .container-row > a {
        padding: 10px 10px 30px;
    }

}
.activity-search-form .container-row{

}
.activity-search-form .title-activity{
	margin: 0;
	margin-bottom: 5px;
	font-size: 23px;
	text-transform: uppercase;

}
.activity-search-form .title-activity small{
	font-size: 14px;
	color:#999;
	font-style: italic;
}
@media (max-width: 992px){
    .activity-search-form .title-activity {
        font-size: 19px;
    }
}
.activity-search-form .subtitle-activity{
	margin:0;
    color: #777;
}
.activity-search-form .details-activity {
    display: flex;
    justify-content: flex-end;
}
.activity-search-form .langname-activity{
	padding: 5px 10px;
    background: #bdbdbd;
    margin-right: 5px;
    color:#fff;

}
.activity-search-form .unitname-activity{
	padding: 5px 10px;
    background: #bdbdbd;
    color:#fff;
}

.activity-search-form .container-row > a:hover .langname-activity,
.activity-search-form .container-row > a:hover .unitname-activity {
	/*background: #ccc;*/
}