@import url("../guidelines_variables.css");

.header-catalog-showcases-image{

  background:  linear-gradient(to bottom, rgba(var(--showcase-overlay-gradient1), 0.75), rgba(var(--showcase-overlay-gradient2), 0.00)),center no-repeat;

}

#header_carousel .views-field-field-top-showcases{
	position: absolute;
	left: 50%;
	top: 30%;
    padding: 40px;
	max-width: 715px;
}

#header_carousel .token-app-right
{
  width: 24vw;
  /*height:176px;*/
    height:228px;
    margin-top: -25px;
}

.header-catalog-showcases-image > img{
    position: relative;
    z-index: -1;
        width: 100vw;
           min-height: 573px;
       max-height: 573px;
}

.views-field-field-top-showcases .field-content{
  height: inherit;
  position: relative;
}


.contextual-region.api.is-promoted.token.clearfix{

     height: inherit;
}


.token-app-right{
 height: inherit;

}

.token-showcases-sub-right .field--name-field-api-app,
.right-side-app-header .field--name-field-api-app {
display: flex;
}


.token-app-right{
    height: inherit;

  }

.token-api-sub-right{
	padding-left: 15%;
  }

.token-api-sub-right h2{
  margin-top: 0
}

.token-app-link{
  object-fit: contain;
  border: solid 2px #eeeeee;
    float: left;
    text-align: center;
}
.token-app-link a{
    font-size: 1.2rem;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.2;
  letter-spacing: normal;
   color:  #ffffff;
}

.token-app-link a:hover{

    /*background-color: rgba(255,255,255,0.2)!important;*/
    height: 100%;
    color: #ffffff;
    border-color: #ffffff;
}

.token-logo-api-wrapper{

  /* TODO */
}

.token-app-right .author{
color:  white;
font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.2;
  letter-spacing: normal;
  color: var(--showcase-head-title);
  opacity: 0.7;
}

.token-eapi-title{
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.33;
  letter-spacing: normal;
  color: var(--showcase-head-title);
}

.sh-body-token{
  color: var(--showcase-head-title);
}


.token-showcases-sub-right .token-eapi-title span{
    text-align: left;
    font-size: 1.8vw;
    color: #FFFFFF;
    margin-top: 5px;
    margin-bottom: 20px;
}

.api-icon-header{
    display: none;
}
.api-icon-header .field--name-field-api-app{
display: flex;
}
.api-icon-header .field--name-field-api-app > div.field--item{
  display: none;
}

.api-icon-header .field--name-field-api-app > div.field--item:nth-child(1){
transform: translateX(50%);
display:flex;
}
.api-icon-header .field--name-field-api-app > div.field--item:nth-child(2){
transform: translateX(0%);
display:flex;
}
.api-icon-header .field--name-field-api-app > div.field--item:nth-child(3){
transform: translateX(-50%);
display:flex;
}



.logo-api-in-app-card-header .content{

  display: flex;
}
.token-showcases-sub-right >h2 {
  margin-top: 0;
}

.view-header-showcases-catalog .dx h2 {
	width: auto;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    height: 55px;
}

.showcase-head-title {
	color: var(--showcase-head-title);
}

.showcase-head-txt {
	color: var(--showcase-head-txt);
}