.card-layout{
    margin-bottom:50px; padding:15px 10px 5px 10px;
    box-shadow:1px 1px 5px gray;
}

.horizontal-layout{
    display:flex; overflow-x: scroll;
}


.bevel-button-1{
    height:50px; width:250px;  margin:10px; border-radius:5px; background:white; border:1px solid black;
    transition-property: color; transition-duration:350ms;
}

.bevel-button-1:hover{color:red; border-color:red}

.bevel-buttons{
    border:1px solid black; padding:10px 40px; border-radius:50px; color:black; text-decoration:none;
    transition-property: color; transition-duration:350ms;
}

.bevel-buttons:hover{ border-color:red; color:red}

.simple-card-layout-1{
    width:200px; height:320px; border:1px solid lightgray; padding:5px; margin:5px;
    transition-property:background; transition-duration:1s;
}
.simple-card-layout-1:hover{
    background:rgba(0, 0, 0, 0.1); border-color:red;
}
.simple-card-layout-1 h4, .simple-card-layout-1 p{
    margin:5px;
}

.image-text-link-layout{
    text-decoration:none;
    color:white;
    margin:auto;
    transition-property:color; transition-duration:1s;
}

.image-text-link-layout:hover{
    color:red;
}

.image-text-link-layout:hover img{
    /*height: 260px; width:360px;*/
}

.image-text-link-layout img{
    height:250px; width:350px;
    transition-property:width, height;
    transition-duration:0.5s
}

.image-text-link-layout .img{
    
    background-position: center!important;
    background-repeat:no-repeat!important;
    background-size:contain!important;
    transition-property:width, height; transition-duration:0.5s
}

@media (max-width: 500px){
    .image-text-link-layout img{
    height: auto; width:350px;
}
}