@charset "utf-8";
/* CSS Document */


@media (max-width: 1220px){
	main page box team {
		grid-template-columns: 1fr;
		grid-template-rows: 1fr 1fr 1fr;
		grid-gap: 40px;
	}
}


@media (max-width: 1120px){
	main {
		grid-template-areas: 
			'page';
		grid-template-columns:  1fr;
	}
	
	main menu {
		display: none;
	}
	
	headerscroll {
		display: grid;
		grid-template-columns: 226px auto;
	}
	
	headerscroll .logo {
		align-self: center;
	}
	
	headerscroll .moto {
		display: none;
	}
	
	headerscroll .btn {
		text-align: right;
	}
	
	headerscroll button span {
		display: none;
	}
	
	button.contacts {
		display: none;
	}
	
	headerscroll button ico.contacts {
		margin: 0;
	}
	
	headerscroll button.menu {
		display: inline-block;
	}
	
	headerscroll button ico.menu {
		display: inline-block;
	}
}


@media (max-width: 720px){
	
	header {
		padding: 20px 0;
	}
	header .logo {
		margin-bottom: 10px;
	}
	
	header .logo img {
		max-width: 270px;
	}
	
	header .moto {
		font-size: 22px;
		line-height: 30px;
		padding: 8px 20px;
	}
	header button {
		margin-top: 15px;
		line-height: 40px;
		font-size: 16px;
	}
	main page box {
		margin-bottom: 40px;
	}

	main page box proposition {
		grid-template-columns: 1fr;
		grid-gap: 20px;
	}
	
	main page box bullets {
		grid-template-columns: 1fr;
		grid-gap: 20px;
	}

	main page box bullets.double {
		grid-template-columns: 1fr !important;
	}

	main page box bullets.double item {
		padding: 22px 22px;
		font-size: 17px;
		font-weight: 500;
	}
	
	main page box h1 {
		margin: 0 0 22px;
		font-size: 30px;
		line-height: 38px;
	}
	
	main page box h2 {
		font-size: 21px;
		line-height: 30px;
	}
	
	main page box team item info {
		font-size: 18px;
	}
	
	main page box.pic pic {
		padding: 15px 15px;
	}
	
	.contactsBox .address {
		font-size: 20px;
		line-height: 30px;
	}
	
	.contactsBox .address p {
		margin-top: 12px;
	}
	
	.contactsBox .email {
		margin-bottom: 5px;
		font-size: 20px;
		font-weight: 500;
	}
	
	.contactsBox {
		bottom: -585px;
		max-height: 585px;
	}
	
	.contactsBox .MAP iframe {
		width: 100%;
		height: 350px;
		border: none;
	}
	
	main page box text .accent p {
		background-image: url("../img/cb-green.svg");
		background-size: 20px auto;
		background-repeat: no-repeat;
		background-position: 0 6px;
		padding-left: 36px;
	}
	
	headerscroll {
		padding: 10px 10px;
	}
	
	header,
	footer{
		border-width: 7px;
		padding-top: 30px;
	}
	
	header info {
		display: block;
		margin-top: 20px;
		margin-bottom: -0px;
		font-size: 18px;
		font-weight: 300;
	}
}

@media (max-width: 480px){
	header .logo img {
		max-width: 235px;
	}

	header .moto {
		font-size: 20px;
		line-height: 28px;
	}

	main {
		padding: 0 12px;
	}

	main page box text {
		padding: 22px 22px;
	}

	main page box text p {
		font-size: 16px;
		line-height: 26px;
	}

	main page .btn button {
		font-size: 20px;
		line-height: 54px;
	}
}


@media (max-width: 1120px){
	main page box {
		margin-bottom: 68px;
	}
}

@media (max-width: 720px){
	main page box {
		margin-bottom: 56px;
	}

	main page box > text,
	main page box > bullets,
	main page box > proposition,
	main page box > team,
	main page box > ofchart {
		margin-top: 20px;
	}

	main page box text + proposition,
	main page box bullets + text,
	main page box ofchart + text,
	main page box team + text {
		margin-top: 22px;
	}

	main page box proposition item,
	main page box bullets item,
	main page box bullets.double item {
		min-height: auto;
	}

	main page box proposition item {
		padding: 28px 24px;
	}

	main page box bullets item {
		padding: 28px 24px;
	}

	main page box team {
		grid-template-columns: 1fr;
	}
}

/* Core Team responsive layout */
@media (min-width: 1121px){
	main page box team {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		grid-template-rows: auto;
		grid-gap: 24px;
	}
}

@media (max-width: 1120px) and (min-width: 721px){
	main page box team {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		grid-template-rows: auto;
		grid-gap: 22px;
	}

	main page box team item {
		padding: 20px 18px;
	}

	main page box team item pic {
		width: 180px;
		height: 180px;
		border-radius: 180px;
		margin-top: -110px;
	}

	main page box team item name {
		font-size: 21px;
	}

	main page box team item name .pro {
		font-size: 18px;
	}

	main page box team item info {
		font-size: 16px;
		line-height: 23px;
	}
}

@media (max-width: 720px){
	main page box team {
		grid-template-columns: 1fr;
		grid-template-rows: auto;
		grid-gap: 48px;
	}
}


/* Contact panel responsive layout */
@media (max-width: 720px){
    .contactsBox {
        bottom: -640px;
        max-height: 640px;
        overflow-y: auto;
    }

    .contactsBox .box {
        grid-template-rows: 64px 1fr;
    }

    .contactsBox .contactIntro strong {
        font-size: 28px;
        line-height: 36px;
    }

    .contactsBox .contactIntro p {
        font-size: 16px;
        line-height: 25px;
        padding: 0 8px;
    }

    .contactsBox .contactGrid {
        grid-template-columns: 1fr;
        grid-gap: 14px;
    }

    .contactsBox .contactCard {
        padding: 18px 18px;
        border-radius: 18px;
    }

    .contactsBox .contactCard a,
    .contactsBox .contactCard span {
        font-size: 18px;
        line-height: 25px;
    }
}

@media (max-width: 480px){
    .contactsBox {
        bottom: -700px;
        max-height: 700px;
    }
}