/*------------------------------------------------------------------------*/
/*  1500px                                                                */
/*------------------------------------------------------------------------*/
@media only screen and (max-width : 1440px) {

	body {
		font: normal 14px/18px "Neue Montreal";
	}

	h1 { font: bold 60px/66px "Neue Montreal"; }
	h2 { font: bold 28px/30px "Neue Montreal"; }

	.container {
		width: 1080px;
	}

	header {
	    height: 80px;
	}
	header .left {
		margin: 0 0 0 120px;
	}
	header .right {
		margin: 0;
	}
	header .logo img {
		height: 40px;
		margin: 0 auto;
	}
	header .left li {
		margin: 0 25px 0 0;
	}
	header .right li {
		margin: 0 0 0 25px;
	}
	header ul li a {
		font: 500 14px/40px "Neue Montreal";
	}
	header .button_menu {
		padding: 0 25px;
	}

	.icon_wpp {
		right: 20px;
		bottom: 20px;
	}

	.icon_wpp img {
		width: 90px;
	}

	section#featured {
		height: 580px;
	}
	section#featured .title {
		max-width: 480px;
	}
	section#featured .button {
		font: 500 12px/50px "Neue Montreal";
		background-size: auto 40px;
		margin: 20px 0 0 0;
		padding: 0 70px 0 25px;
	}

	section#about {
		width: 900px;
		-webkit-border-radius: 20px;
				border-radius: 20px;
		margin: 80px auto;
		padding: 40px;
	}
	section#about .title {
	    padding: 0 20px 0 0;
	}
	section#about .title img {
		margin: 20px 0 0 0;
		-webkit-border-radius: 20px;
				border-radius: 20px;
	}
	section#about .text {
		padding: 0 0 0 20px;
	}
	section#about .infos {
	    margin: 40px 0 0 0;
	    padding: 40px 0 0 0;
	}
	section#about .infos ul li {
	    padding: 0 40px 0 0;
	}
	section#about .infos ul li h2:before {
	    width: 40px;
	    height: 40px;
	    margin: 0 0 10px 0;
	}

	section#about_big {
	    width: 900px;
	    -webkit-border-radius: 20px;
				border-radius: 20px;
	    margin: 40px auto 80px auto;
	    padding: 50px;
	}

	section#services {
		padding: 60px 0;
	}
	section#services img {
		height: 260px;
		-webkit-border-radius: 20px;
				border-radius: 20px;
		margin: 0 15px 30px 15px;
	}
	section#services .button {
		font: 500 12px/50px "Neue Montreal";
		background-size: auto 40px;
		padding: 0 70px 0 25px;
	}

	section#contact {
		width: 900px;
		margin: 80px auto;
	}
	section#contact .image,
	section#contact .title {
	    padding: 0 40px;
	}
	section#contact .title p {
	    margin: 5px 0 15px 0;
	}
	section#contact .button {
		font: 500 12px/50px "Neue Montreal";
		background-size: auto 40px;
		padding: 0 70px 0 25px;
	}

	footer .infos img {
		height: 60px;
	}
	footer .infos .right li {
	    margin: 0 0 0 30px;
	}
	footer .infos .right ul li a {
	    font: 500 14px/60px "Neue Montreal";
	}

	footer .copyright li {
		margin: 0 0 0 30px;
	}
	footer .copyright ul li a {
		font: 500 11px/60px "Neue Montreal";
	}
	footer .copyright span {
		font-size: 11px;
		line-height: 60px;
	}

}

/*------------------------------------------------------------------------*/
/*  440px                                                                 */
/*------------------------------------------------------------------------*/
@media only screen and (max-width : 440px) {

	h1 { font: bold 48px/48px "Neue Montreal"; }
	h2 { font: bold 22px/26px "Neue Montreal"; }

	.container {
        width: 100%;
    }

    header {
        height: 90px;
    }
	header .left,
	header .right {
		display: none;
	}

    header .logo img {
    	position: relative;
        margin: 0 auto;
    }

    .icon_wpp {
        right: 15px;
        bottom: 15px;
    }

    section#featured {
	    height: 440px;
	}

	section#featured .title {
	    width: 100%;
		margin: 0 0 40px 0;
	    padding: 0;
	}

    section#about {
        width: calc(100% - 60px);
        margin: 60px auto;
        padding: 30px;
    }
	section#about .title,
	section#about .text {
	    width: 100%;
	    float: none;
	    padding: 0;
	}

	section#about .title img {
	    margin: 30px 0;
	}

	section#about .infos ul li {
		width: 100%;
        padding: 0;
        margin: 0 0 30px 0;
    }

    section#about_big {
        width: calc(100% - 60px);
        margin: 0px auto 80px auto;
        padding: 30px;
    }

    section#cases {
        padding: 40px 30px;
        display: inline-block;
    }
	section#services .images {
	    display: flex;
	    margin: 30px 0 0 0;
	    padding: 0 30px;
	}
	section#services img {
        width: 100%;
        height: auto;
        margin: 0 0 30px 0;
    }

	section#contact {
        width: calc(100% - 60px);
        margin: 60px auto;
        padding: 0;
    }
    section#contact .image {
	    width: 100%;
	    padding: 0;
	}
	section#contact .image img {
	    -webkit-border-radius: 20px;
	    		border-radius: 20px;
	}
	section#contact .title {
	    width: 100%;
		display: inline-block;
	    float: none;
	    padding: 0;
	}
	section#contact .button {
		float: none;
	}

    footer {
        width: 100%;
    }
	footer .infos .left,
	footer .infos .right {
	    width: 100%;
	    float: none;
	    text-align: center;
	}
	footer .infos {
	    width: 100%;
	    display: inline-block;
	}
	footer .infos a img {
		height: 50px;
	    display: block;
	    margin: auto;
	}
	footer .infos .right ul {
	    display: inline-block;
	    float: none;
	    margin: 30px 0 0 0;
	}
	footer .infos .right li {
        float: none;
        margin: 0;
    }
    footer .infos .right ul li a {
        font: 500 16px / 60px "Neue Montreal";
    }
    footer .infos .right ul li.tel {
		margin: 0 0 0 10px;
	    padding: 0 0 0 15px;
	}
	footer .infos .right ul li.insta {
		margin: 0 0 0 15px;
	    padding: 0 0 0 15px;
	}
    footer .infos .right .button_menu {
	    margin: 15px 0 0 0;
	}

	footer .copyright {
        text-align: center;
        padding: 0 60px;
    }
    footer .copyright ul {
    	float: none;
        margin: 40px 0 0 0;
    }
    footer .copyright li {
        margin: 0;
        float: none;
    }
    footer .copyright ul li a {
        font: 500 11px / 40px "Neue Montreal";
    }
	footer .copyright span {
        font-size: 11px;
        line-height: 16px;
        display: inline-block;
        margin: 20px 0;
    }

}