@media screen and (max-width: 39.9375em) {
    div#top_content, .lowerpart {
        height: auto !important;
    }
   
}

.item {
    background-size: cover;
    background-position: center;
}

.slider {
    height: auto;
}

#template3 {
    height: 100%;
}

    #template3 .casting .fadeinlayer {
        background: url('../img/trans-green.png');
        background-repeat: repeat;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        color: white;
        padding: 2rem;
    }

    #template3 .roundlayer {
        text-transform: uppercase;
        color: white;
        width: calc(0.6*17vw);
        height: calc(0.6*17vw);
        line-height: calc(0.6*17vw);
        border-radius: 100%;
        text-align: center;
        background: url('../img/trans-green.png');
        background-repeat: repeat;
        position: absolute;
        margin: auto;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        vertical-align: middle;
        display: table-cell;
        -webkit-transition-property: all;
        -webkit-transition-duration: .5s;
        -webkit-transition-timing-function: cubic-bezier(0, 1, 0.5, 1);
        -moz-transition-property: all;
        -moz-transition-duration: .5s;
        -moz-transition-timing-function: cubic-bezier(0, 1, 0.5, 1);
        -ms-transition-property: all;
        -ms-transition-duration: .5s;
        -ms-transition-timing-function: cubic-bezier(0, 1, 0.5, 1);
        transition-property: all;
        transition-duration: .5s;
        transition-timing-function: cubic-bezier(0, 1, 0.5, 1);
    }

    #template3 .casting:hover .roundlayer,#template3 .owl-item.current .casting .roundlayer {
        line-height: 17vw;
        border-radius: 0;
        width: 100%;
        height: 100%;
        -webkit-transition-property: all;
        -webkit-transition-duration: .5s;
        -webkit-transition-timing-function: cubic-bezier(0, 1, 0.5, 1);
        -moz-transition-property: all;
        -moz-transition-duration: .5s;
        -moz-transition-timing-function: cubic-bezier(0, 1, 0.5, 1);
        -ms-transition-property: all;
        -ms-transition-duration: .5s;
        -ms-transition-timing-function: cubic-bezier(0, 1, 0.5, 1);
        transition-property: all;
        transition-duration: .5s;
        transition-timing-function: cubic-bezier(0, 1, 0.5, 1);
        color: transparent;
    }

    
    /*#template3 .roundlayer h6 {
        text-transform:uppercase;
        font-weight:bold;
        margin: auto;
        display: table;
        vertical-align: middle;
        height: 100%;
        text-align: center;
        color: white;
    }*/
    #template3 .casting > a {
        display: table;
    }

    #template3 .casting {
        cursor: pointer;
        position: relative;
        height: 17vw;
        background-size: cover;
    }

        #template3 .casting .fadeinlayer h6 {
            text-transform: uppercase;
            font-weight: bold;
            border-bottom: 1px solid white;
        }

        #template3 .casting .fadeinlayer p {
        }

.lowerpart {
    height: calc( 100vh - (20.7vw + 90px));
}
.b-button {
    padding: 0.5rem;
    cursor:pointer
}
.b-button .inner
{
  background:  #89989d;
  border-radius: 0.3rem;
padding: 0.7rem 0.05rem;
}
.b-button:hover .inner,.b-button.active .inner{
    background: #141328;}
.b-button:hover .most-inner,.b-button.active .most-inner
{
    color:#5686c2;
    border: 1px solid #4fc9e8;
}
.b-button .most-inner{

text-align: center;

padding: 0.2rem;

border-radius: 0.3rem;

border: 1px solid #141328;

color: white;
}
 #template3 .page-title
    {
          background: #063f60;
          vertical-align: middle;
          text-align: center;
          display: table;
    }
 #template3 .page-title h5
    {
    margin-bottom:0;
    color: white;
    margin: auto;
    display: table-cell;
    height: 40px;
    vertical-align: middle;
    width: 100%;
    text-align: center;
    }
@media screen and (min-width: 40em) and (max-width: 63.9375em) {
    #template3 .casting {
        height: 50vw;
        background-size: cover;
    }

    #template3 .roundlayer {
        text-transform: uppercase;
        color: white;
        line-height: 23.3vw;
        width: 23.3vw;
        height: 23.3vw;
    }

    #template3 .casting:hover .roundlayer , #template3 .owl-item.current .casting .roundlayer{
        line-height: 50vw;
        width: 50vw;
        height: 50vw;
        opacity:0;
    }
}

@media screen and (max-width: 39.9375em) {
    #template3 .roundlayer {
        text-transform: uppercase;
        color: white;
        line-height: 60vw;
        width: 60vw;
        height: 60vw;
    }

    #template3 .casting:hover .roundlayer, #template3 .owl-item.current .casting .roundlayer {
        line-height: 100vw;
        width: 100vw;
        height: 100vw;
          opacity:0;
    }

    div#top_content {
        height: auto !important;
    }

    #template3 .casting {
        height: 100vw;
        background-size: cover;
    }
    
}
.jspPane a {
    color:inherit;
}