body {
	background: #191919;
}

.menu_panel a:not(#menu_email):hover {
	color: #e7e7e7;
}

.menu_panel > a:not(#menu_email):before {
	background: #e7e7e7;
}

.burger_wrapper .hamburger,
.burger_wrapper .hamburger:before,
.burger_wrapper .hamburger:after {
	background: #fff; 
}

.footer,
.footer a {
	color: #fff;
}

.body {
	display: block;
	font-family: Roboto Bold;
	color: #fff;
	margin-top: 100px;
}

.body span {
	display: block;
	margin-bottom: 0;
	cursor: default;
}

.big_title {
	animation: slideInFromLeft 0.5s forwards;
	cursor: default !important;
	font-size: 70px;
}

@keyframes slideInFromLeft {
  0% {
    transform: translateX(-10%);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}

a:hover {
	text-decoration: none;
}

.works_container {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	margin-top: 80px;
}

.works_block {
	width: 48.5%;
	display: inline-block;
	margin-bottom: 50px;
	animation: showDesc 0.75s forwards;
}

@keyframes showDesc {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

.image_container {
	overflow: hidden;
	height: 438px;
	background: #e5e5e7;
	display: flex;
	justify-content: center;
}

.image_container img {
	height: 100%;
	transition: all .3s ease-in-out;
}

.image_container img:hover {
	transform: scale(1.03); 
}

.works_title {
	font-size: 30px;
	line-height: 1.3em;
	color: #c2c2c2;
	margin: 18px 0 3px;
	display: inline-block;
}

.works_title:hover {
	text-decoration: underline;
	color: #c2c2c2;
}

.works_cate {
	font-size: 16px;
	font-family: Roboto;
	color: #6a6a6a;
}

.footer {
	position: relative;
	bottom: 0;
	margin-bottom: 70px;
}

.menu_panel {
	background: #191919;
}

#menu_home,
#menu_works,
#menu_about,
#menu_email {
	color: #fff;
}

.menu_panel > a:before {
	background: #fff;
}

/********** MOBILE PORTRAIT **********/
@media only screen and (min-width: 320px) and (max-width: 812px) {
	.body {
		margin-top: 30px
	}

	.big_title {
		line-height: 1.2em;
		font-size: 40px;
	}

	.works_container {
		margin-top: 50px;
	}

	.works_block {
		width: 100%;
		margin-bottom: 45px;
	}
	
	.image_container {
		height: 213px;
	}

	.works_title {
		margin-top: 15px;
		font-size: 25px;
	}

	.footer {
		margin-bottom: 15px;
	}
}
/********** END MOBILE PORTRAIT **********/

/********** MOBILE LANDSCAPE **********/
@media only screen and (min-width: 320px) and (max-width: 812px) and (orientation:landscape) {
	.body {
		margin-top: 45px;
	}

	.works_block {
		width: 48.5%;
	}
}
/********** END MOBILE LANDSCAPE **********/

/********** TABLET PORTRAIT **********/
@media only screen and (min-width: 768px) and (max-width: 811px), (min-width: 813px) and (max-width: 1281px) {
	.body {
		padding-bottom: 30px;
	}

	.works_block {
		width: 48.5%;
	}
	
	.image_container {
		height: 335px;
	}
}
/********** END TABLET PORTRAIT **********/

/********** TABLET LANDSCAPE **********/
@media only screen and (min-width: 813px) and (max-width: 1281px) and (orientation:landscape) {
	.body {
		margin-top: 30px;
		padding: 60px 20px 30px; 
	}

	.big_title {
		font-size: 40px;
		line-height: 1.2em;
	}

	.works_container {
		margin-top: 50px;
	}

	.footer {
		margin-bottom: 15px;
	}
}
/********** END TABLET LANDSCAPE **********/