.laptop-section
{
    padding: 20% 0;
    background: linear-gradient(to top, $bg-carousel-color, $bg-laptop-section-color, #0d0d0b);
    background-color: $bg-laptop-section-color;
    h3
    {
        color: $laptop-section-name-c;
        margin-bottom: 1.5rem;
        font-size: 4rem;
		@media screen and (max-width: 991.9px) {
	        font-size: 2.8rem;
        }
    }
    p
    {
        color: $laptop-section-text-c;
    }
    &-text{
    	margin: auto auto;
        text-align: left;
    }
    
    .laptop
    {
        padding: 0 10%;
        &-img
        {
        	position: relative;
            width: 85%;
            padding-bottom: 55%;
			margin-left: 7.5%;
			border-radius: 20px 20px 0 0;
// 			box-shadow: inset 0 0 20px 20px rgba(0, 0, 0, 0.1);
            background: linear-gradient(to top right, $laptop-color-start, $laptop-color-end, $laptop-color-start, $laptop-color-end, $laptop-color-start, $laptop-color-end, $laptop-color-start, $laptop-color-end);
            background-size: 300% 300%;
            animation: gradientAnimation 3s linear infinite;

            @keyframes gradientAnimation { 
                0%{background-position:100% 0%}
                // 50%{background-position:0% 100%}
                // 100%{background-position:100% 0%}
            }
        }
        &-img-border
        {
            width: 100%;
            padding: 1%;
            border-radius: 0 0 50% 50%;
            margin-top: -0.2%;
            z-index: 1;
            background: linear-gradient(to top right, #d21b4d, $laptop-color-end);
            animation: gradientAnimation 2s ease infinite;
        }
        &-content{
			position: absolute;
			top: 10%;
			left: 50%;
			text-align: center;
			transform: translateX(-50%);
			.camera{
				margin-top: -24%;
				color: $bg-laptop-section-color;
				font-size: 3.2rem;
				line-height: 4.8rem;
			}
			.laptop-text{
				font-size: 4.8rem;
				font-weight: bold;
				text-transform: uppercase;
				margin-top: 35%;
				line-height: 7.2rem;
				@media screen and (min-width: 992px) and (max-width: 1200px) {
			        margin-top: 20%;
		        }
				&-box{
					font-style: italic;
				}
			}
			
        }
    }
    .container {
	    padding: 0 8rem;
    }
    .row {
	    display: flex;
	    @media screen and (max-width: 991.9px) {
	        flex-wrap: wrap;
        }
    }
}
