/*
	Website Name: Cousineau Auto Inc., Custom Website
	Designed by: Katherine Leonard, Car-Part.com
	Last updated: 23 June 2026
*/

@media screen and ( max-width: 1199px ) {
	#pgHeader {
		background-size: cover;
		background-position: bottom;
		background-attachment: scroll;
		position: relative;
		z-index: 150;
	}
	#menuBtn {
		margin-right: .5rem;
	}
	#mainMenu ul.nav {
		background-color: #d1ae6d;
		/* box-shadow: -3px 3px 3px rgba( 0,0,0,0.7 ); */
		color: #fff;
		min-width: 20ch;
	}
	#mainMenu ul.nav li.desktop {
		display: none;
	}
	#mainMenu ul.nav li.mobile {
		display: block;
	}
	#mainMenu ul.nav li:hover {
		background-color: #444;
	}
    #hero.home {
        background-size: 100% auto;
        background-repeat: no-repeat;
    }
    #hero.home .flex-parent-row {
        width: 100%;
        flex-wrap: wrap;
        justify-content: flex-end;
    }
    #hero.home .two-thirds-col, #hero.home .one-third-col {
        flex-basis: 100%;
        max-width: 100%;
    }
    #hero .container {
        padding: 0;
    }
    #homeInfoBlock {
        margin-right: 0;
    }
    
    
	section.content, section.home {
		padding: 0 1rem 0 2rem;
	}
    #sellVehicle .container.flex-parent-row {
        flex-wrap: wrap;
		flex-direction: column;
        padding: 0;
    }
    #sellVehicleImg, #sellVehicleInfo {
        max-width: 95%;
        padding: 2rem;
        text-align: center;
    }
    #services .flex-parent-row {
        flex-wrap: wrap;
    }
    #services .six-even-col {
        flex-basis: 30%;
	    max-width: 30%;
        padding-bottom: 1rem;
    }
    #aboutCousineau {
        padding-left: 2rem;
    }
    #aboutCousineau h1.sz3 {
        font-size: 2rem;
    }
    
    ul.small-nav a li {
        display: block;
        padding: .5em;
    }
    ul.small-nav a li::after {
        content: "";
    }
    
}
@media screen and ( max-width: 1099px ) {
    .slide {
        width: auto;
        max-width: 100%;
        height: auto;
        text-align: center;
    }
    #slide1, #slide2, #slide3 {
        background-image: none;
    }
    .slide img {
        display: block;
        margin: auto;
        max-width: 100%;
        height: auto;
    }
}
@media screen and ( max-width: 999px ) {
	#pgFooter .flex-parent-row {
		flex-wrap: wrap;
		flex-direction: column;
	}
	#pgHeader .slogan {
		font-size: 3rem;
	}
	#hero.contact {
		background-attachment: scroll;
		background-position: center center;
		height: 30vh;
	}
    
    #cutSheetsContainer .flex-child-col.two-even-col {
        flex-basis: 90%;
	    max-width: 90%;
    }
    
	#map {
		height: 50vh;
	}
	#services .six-even-col {
        flex-basis: 45%;
	    max-width: 45%;
    }
    #meetTheTeam .screwHeader {
        display: none;
    }
    #contactUs .flex-parent-row.flex-top {
        flex-wrap: wrap;
		flex-direction: column;
    }
    #contactUs h2 {
        display: none;
    }
    #contactUs .flex-parent-row .flex-child-col {
        margin: auto;
        padding: 1rem;
    }
	#pgFooter .block {
		display: block;
		padding: .25em;
	}
	#pgFooter .divider {
		display: none;
	}
}
@media screen and ( max-width: 799px ) {
    #pgHeader .flex-parent-row {
		flex-wrap: wrap;
		flex-direction: column;
	}
    #logoBlock {
        padding: 1rem;
    }
    #services .six-even-col {
        flex-basis: 90%;
	    max-width: 90%;
    }
}