.maincontent {
    position: relative;
    max-width: 100%;
}

.clip-header{
     -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 77% 97%, 61% 100%, 45% 96%, 30% 100%, 12% 96%, 0% 100%);
clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 77% 97%, 61% 100%, 45% 96%, 30% 100%, 12% 96%, 0% 100%);
}

.card {
box-shadow: 5px 5px 5px 3px rgba(0,0,0,0.1);
padding: 20px;
width: 95%;
margin: 0 auto;
transition:0.5s;
}

.card-title{
     text-align:center;
}

.card:hover {
transform: translateY(-15px);
background:var(--accent-color);
color: #fff;
}

.card img {
width: 400px;

}

.card-body{
margin-bottom: 20px;
height: 80px;
}

.card-footer{

text-align: center;
}

a.btn.btn-primary {    padding: 16px 28px;    border-radius: 0;    background: #5f6d79;    border: none;   box-shadow: 0 4px 5px -3px #333;    transition: 0.5s;    font-weight: bold;transition: ease-out 0.4s;}
a.btn.btn-primary:hover {    box-shadow: inset 0 0 0 50px #2d2d2d; }


a.btn.btn-secondary{
padding: 16px 28px;    border-radius: 0;    background-color:#5AA1D1;    border: none;   box-shadow: 0 4px 5px -3px #333;    transition: 0.5s;    font-weight: bold;transition: ease-out 0.4s; color:white;
}

a.btn.btn-secondary:hover{
box-shadow: inset 0 0 0 50px #4F8EB8;
color:white;
}