.Message {
    display:table;
    position:relative;
    margin:0 auto;
    width:100%;
    background:linear-gradient(141deg,#87ffb7,#78d2dc 71%,#2f6c83);
    color:#fff;
    transition:all .2s ease;
    border-radius:20px
}
.Message.is-hidden {
    opacity:0;
    height:0;
    font-size:0;
    padding:0;
    margin:0 auto;
    display:block
}
.Message--orange {
    background-color:#f39c12
}
.Message--red {
    background-color:#ff4136
}
.Message--green {
    background-color:#2ecc40
}
.Message-icon {
    display:table-cell;
    vertical-align:middle;
    width:100px;
    padding:30px;
    text-align:center;
    background-color:rgba(109,29,55,.09);
    border-top-right-radius:20px;
    border-bottom-right-radius:20px
}
.Message-icon>svg {
    width:20px;
    font-size:20px;
    color:#ffe6b7;
    -webkit-animation-name:spaceboots;
    -webkit-animation-duration:.8s;
    -webkit-transform-origin:50% 50%;
    -webkit-animation-iteration-count:infinite;
    -webkit-animation-timing-function:linear
}
.Message-body {
    display:table-cell;
    vertical-align:middle;
    padding:30px 20px 30px 10px
}
.Message-body>p {
    line-height:2;
    margin-top:6px;
    font-size:15px
}
.Message-button {
    position:relative;
    margin:15px 5px -10px;
    background-color:rgba(0,0,0,.25);
    box-shadow:0 3px rgba(0,0,0,.4);
    border:none;
    padding:10px 15px;
    font-size:16px;
    color:#fff;
    outline:none;
    cursor:pointer;
//float:left;
    border-radius:20px
}
.Message-button:active,
.Message-button:hover {
    background:rgba(0,0,0,.3)
}
.Message-button:active {
    box-shadow:0 0 rgba(0,0,0,.4);
    top:3px
}
.Message-close {
    position:absolute;
    background-color:rgba(0,0,0,.3);
    color:#fff;
    border:none;
    outline:none;
    font-size:20px;
    right:5px;
    top:5px;
    opacity:0;
    cursor:pointer
}
.Message:hover .Message-close {
    opacity:1
}
.Message-close:hover {
    background-color:rgba(0,0,0,.5)
}

.u-italic {
    font-style:italic
}
@-webkit-keyframes spaceboots {
    0% {
        -webkit-transform:translate(2px,1px) rotate(0deg)
    }
    10% {
        -webkit-transform:translate(-1px,-2px) rotate(-1deg)
    }
    20% {
        -webkit-transform:translate(-3px) rotate(1deg)
    }
    30% {
        -webkit-transform:translateY(2px) rotate(0deg)
    }
    40% {
        -webkit-transform:translate(1px,-1px) rotate(1deg)
    }
    50% {
        -webkit-transform:translate(-1px,2px) rotate(-1deg)
    }
    60% {
        -webkit-transform:translate(-3px,1px) rotate(0deg)
    }
    70% {
        -webkit-transform:translate(2px,1px) rotate(-1deg)
    }
    80% {
        -webkit-transform:translate(-1px,-1px) rotate(1deg)
    }
    90% {
        -webkit-transform:translate(2px,2px) rotate(0deg)
    }
    to {
        -webkit-transform:translate(1px,-2px) rotate(-1deg)
    }
}
.imgshake:hover {
    -webkit-animation-name:spaceboots;
    -webkit-animation-duration:.8s;
    -webkit-transform-origin:50% 50%;
    -webkit-animation-iteration-count:infinite;
    -webkit-animation-timing-function:linear
}


.inner-box{
    border-radius: 30px;
}



/* clip mask effect */

.clip-mask-01{
    transition: 0.2s ease;
    max-width:100%;
    -webkit-clip-path: polygon(10% 25%, 35% 25%, 35% 0%, 65% 0%, 65% 25%, 90% 25%, 90% 50%, 65% 50%, 65% 100%, 35% 100%, 35% 50%, 10% 50%);
    clip-path: polygon(10% 25%, 35% 25%, 35% 0%, 65% 0%, 65% 25%, 90% 25%, 90% 50%, 65% 50%, 65% 100%, 35% 100%, 35% 50%, 10% 50%);
}

.clip-mask-01:hover{
    -webkit-clip-path: polygon(20% 0%, 0% 20%, 30% 50%, 0% 80%, 20% 100%, 50% 70%, 80% 100%, 100% 80%, 70% 50%, 100% 20%, 80% 0%, 50% 30%);
    clip-path: polygon(20% 0%, 0% 20%, 30% 50%, 0% 80%, 20% 100%, 50% 70%, 80% 100%, 100% 80%, 70% 50%, 100% 20%, 80% 0%, 50% 30%);
}

.clip-mask-02{
    transition: clip-path 0.2s ease;
    max-width:100%;
    -webkit-clip-path: polygon(75% 0%, 100% 50%, 75% 100%, 0% 100%, 25% 50%, 0% 0%);
    clip-path: polygon(75% 0%, 100% 50%, 75% 100%, 0% 100%, 25% 50%, 0% 0%);
}

.clip-mask-02:hover{
    -webkit-clip-path: polygon(100% 0%, 100% 50%, 0% 100%, 0% 50%, 25% 25%, 0% 0%);
    clip-path: polygon(100% 0%, 100% 50%, 0% 100%, 0% 50%, 25% 25%, 0% 0%);
}


.clip-mask-03{
    transition: 0.2s ease;
    max-width:100%;
    -webkit-clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
    clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
}

.clip-mask-03:hover{
    -webkit-clip-path: polygon(25% 0%, 100% 0%, 75% 100%, 0% 100%);
    clip-path: polygon(25% 0%, 100% 0%, 75% 100%, 0% 100%);
}



.clip-mask-04{
    transition: 0.2s ease;
    max-width:100%;
    -webkit-clip-path: polygon(100% 0%, 75% 50%, 100% 100%, 25% 100%, 0% 50%, 25% 0%);
    clip-path: polygon(100% 0%, 75% 50%, 100% 100%, 25% 100%, 0% 50%, 25% 0%);
}

.clip-mask-04:hover{
    -webkit-clip-path: polygon(100% 0%, 75% 50%, 100% 50%, 25% 100%, 20% 50%, 25% 30%);
    clip-path: polygon(100% 0%, 75% 50%, 100% 50%, 25% 100%, 20% 50%, 25% 30%);
}

.service-block{
    margin-bottom: 0;
}