@import url('https://fonts.googleapis.com/css?family=Montserrat:400,700');
*{
    margin: 0;
    padding: 0;
}
*,*::before,*::after {box-sizing: border-box;}
body {
	font-family: 'Montserrat', sans-serif;
	background: #3ea0eb;
    -ms-overflow-style: none;
    scrollbar-width: none;
}
body::-webkit-scrollbar {display: none;}
a{text-decoration: none;}
.canvas{
    position: absolute;
    width: 90%;
}
.header{
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    align-items: center;
    max-width: 1200px;
    margin: 0 auto 40px;
    padding: 0;
    transform: translateY(34.375px);
    
}
.logo_img{
    max-width: 120px;
    max-height: 120px;
    cursor: pointer;
}
.honeycomb {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    justify-content: center;
    align-items: center;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0;
    transform: translateY(34.375px);
}
.honeycomb-cell {
    flex: 0 1 250px;
    max-width: 250px;
    height: 137.5px;
    margin: 65.4761904762px 12.5px 25px;
    position: relative;
    padding: 0.5em;
    text-align: center;
    z-index: 1;
}
.honeycomb-cell__title {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    hyphens: auto;
    word-break: break-word;
    text-transform: uppercase;
    color: #fff;
    font-weight: 700;
    font-size: 1.75em;
    transition: opacity 350ms;
}
.honeycomb-cell__title > small {
    font-weight: 300;
    margin-top: 0.25em;
}
.honeycomb-cell__image {
    object-fit: cover;
    object-position: center;
}
.honeycomb-cell::before, .honeycomb-cell::after {content: '';}
.honeycomb-cell::before, .honeycomb-cell::after, .honeycomb-cell__image {
    top: -50%;
    left: 0;
    width: 100%;
    height: 200%;
    display: block;
    position: absolute;
    clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
    z-index: -1;
}
.honeycomb-cell::before {
    background: #fff;
    transform: scale(1.055);
}
.honeycomb-cell::after {
    background: #3ea0eb;
    opacity: 0.5;
    transition: opacity 350ms;
}
.honeycomb-cell:hover .honeycomb-cell__title {opacity: 0;}
.honeycomb-cell:hover::before {background: #082938;}
.honeycomb-cell:hover::after {opacity: 0;}
.honeycomb__placeholder {
    display: none;
    opacity: 0;
    width: 250px;
    margin: 0 12.5px;
}
.s-media{
    position: fixed;
    top: 25%;
    right: 0;
    z-index: 10;
    transition:all linear 0.2s ;
}
.s-media a:first-child{border-radius: 10px 0 0 10px ;}
.s-media a:last-child{border-radius: 0 0 0 10px;}
.facebook{border-radius: 10px 0 0 0 ;}
.s-item {
    display:block;
    width: 60px;
    height: 60px;
    color: white;
    font-size: 25px;
    line-height: 60px;
    text-align: center;
    transition:all linear 0.2s ;
}
.facebook:hover {opacity: 0.5;}
.instagram:hover {opacity: 0.5;}
.print:hover {
    opacity: 0.5;
    cursor: pointer;
}
.facebook {background-color: #305891;}
.instagram {background-color: #E1306C;}
/* .youtube {background-color: #ff0000;} */
.print {background-color: #7CB0A4;}
@media (max-width: 550px) {
	.honeycomb-cell {margin: 81.25px 25px;}
    .canvas{display: none;}
}
@media (min-width: 550px) and (max-width: 825px) {
	.honeycomb-cell:nth-child(3n) {
		margin-right: calc(50% - 125px);
		margin-left: calc(50% - 125px);
	}
    .canvas{display: none;}
	.honeycomb__placeholder:nth-child(3n + 5) {display: block;}
}
 @media (min-width: 825px) and (max-width: 1100px) {
	.honeycomb-cell:nth-child(5n + 4) {margin-left: calc(50% - 275px);}
	.honeycomb-cell:nth-child(5n + 5) {margin-right: calc(50% - 275px);}
	.honeycomb__placeholder:nth-child(5n), .honeycomb__placeholder:nth-child(5n + 3) {display: block;}
    .canvas{display: none;}
}
@media (min-width: 1100px) {
	.honeycomb-cell:nth-child(7n + 5) {margin-left: calc(50% - 400px);}
	.honeycomb-cell:nth-child(7n + 7), .honeycomb-cell:nth-child(7n + 5):nth-last-child(2) {margin-right: calc(50% - 400px);}
	.honeycomb__placeholder:nth-child(7n + 7), .honeycomb__placeholder:nth-child(7n + 9), .honeycomb__placeholder:nth-child(7n + 11) {
		display: block;
	}
}
 