﻿       .portflio {
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
        }

        .portflio-image {
            width: 100%;
            height: auto;
        }

         .portflio-overlay {
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            height: 100%;
            width: 100%;
            opacity: 0.3;
            transition: .3s ease;
            background-color: transparent;        }

         .portflio-container {
            position: relative;
            width: 100%;
            max-width: 1200px;
        }


        .portflio-overlay:hover {
            opacity: 0.7;
        }

        .portflio-play-icon {
            color: black;
            font-size: 2rem;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            -ms-transform: translate(-50%, -50%);
            cursor: pointer;
            width: 20%;
            z-index: 2;       
        }
             
        .portflio-like-button {
            position: absolute;
            z-index: 2;
            color: whitesmoke;
            font-size: 20px;
            text-align: right;
            cursor: pointer;
            border-radius: 10rem;
            background-color: transparent;
            border: transparent;
            width: 99%;
            padding-top: 4px;
            padding-right: 4px;
        }

        .port-flio-like-button :hover {
            color: red;
        }

        .portflio-fa-heart {
            position: absolute;
            z-index: 2;
            color: red;
            position: absolute;
        }