.hmp-menu{
    background-color: #fff;
    border-radius: 60px;
    box-shadow: 0 32px 60px 0 rgba(0, 0, 0, 0.15);
    display: flex;
    padding: 30px;
}
.hmp-menu .nav.nav-tabs{border: none; padding-right: 25px; width: 40%;}
.hmp-menu .nav.nav-tabs>li{
    background: transparent;
    border-radius: 25px;
    display: block;
    float: none;
    padding: 0;
    position: relative;
    width: 100%;
}
.hmp-menu .nav.nav-tabs>li>a[role="tab"]{
    background: transparent;
    border: none;
    padding: 50px 60px;
    padding-right: 80px;
    text-align: left;
}
.hmp-menu .nav.nav-tabs>li.active{background-color: #f9f6f3;}
.hmp-menu .nav.nav-tabs>li>a[role="tab"] h2{font-size: 32px; color: #303030; margin-top: 0;}
.hmp-menu .nav.nav-tabs>li>a[role="tab"] p{font-size: 16px; color: #7d7d7d;}
.hmp-menu .nav.nav-tabs>li .btn-arr{
    background: transparent;
    border:none;
    cursor: pointer;
    display: none;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}
.hmp-menu .nav.nav-tabs>li .btn-arr>div{
    background-image: url(/img/icons/ic-carousel-right@2x.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 14px;
    background-color: rgba(0, 0, 0, .3);
    border-radius: 50%;
    bottom: 25px;
    cursor: pointer;
    height: 40px;
    position: absolute;
    right: 35px;
    transform: rotate(0);
    transition: .5s ease!important;
    width: 40px;
}
.hmp-menu .nav.nav-tabs>li.active .btn-arr{
    display: block;
}
.hmp-menu .nav.nav-tabs>li .btn-arr:hover>div{
    background-color: #1e7eee;
    transform: rotate(-45deg);
}

.hmp-menu .tab-content{
    border-left: 4px solid #f9f6f3;
    flex: 1;
}
.hmp-menu .tab-content>.tab-pane{
    height: 100%;
    padding: 25px 50px;
    text-align: left;
}
.hmp-menu .tab-content>.tab-pane h4{color: #303030; font-size: 15px; opacity: .24;}
.hmp-menu .tab-content>.tab-pane p{color: #1a1a1a; font-size: 14px;}
.hmp-menu .tab-content>.tab-pane ul{list-style-type: none; margin: 16px 0 32px; padding: 0;}
.hmp-menu .tab-content>.tab-pane ul li{font-size: 16px; padding-left: 18px; position: relative;}
.hmp-menu .tab-content>.tab-pane ul li:before{
    background-color: #1e7eee;
    border-radius: 50%;
    content: '';
    display: block;
    height: 6px;
    position: absolute;
    top:8px;
    left: 0;
    width: 6px;
}
.hmp-menu .tab-content>.tab-pane ul li:last-child:before{display: none;}

@media screen and (max-width: 1199.5px){
    .hmp-menu{
        border-radius: 25px;
        left: 0;
        right: 0;
        padding: 15px;
        width: 100%;
    }
    .hmp-menu .nav.nav-tabs>li>a[role="tab"]{
        padding: 20px 55px 10px 20px;
    }
    .hmp-menu .nav.nav-tabs>li .btn-arr>div{
        bottom: 10px;
        right: 10px;
    }
    .hmp-menu .tab-content>.tab-pane{
        padding: 15px 30px;
    }
}

@media screen and (max-width: 767.5px){
	.hmp-menu{flex-direction: column;}
	.hmp-menu .nav.nav-tabs{width: 100%;}
	.hmp-menu .tab-content{border: none;}
	.hmp-menu .tab-content .form{text-align: center;}
}