.grid {
	width: 100%;
	height: 100vh;
	min-height: 480px;
	margin: 0 auto
}

.grid:after {
	display: block;
	clear: both;
	content: ""
}

.grid__sidebar {
	position: fixed;
	z-index: 2;
	top: 0;
	left: 0;
	overflow-y: auto;
	width: 376px;
	height: 100vh;
	-webkit-transition: .5s;
	-moz-transition: .5s;
	-o-transition: .5s;
	transition: .5s;
	-webkit-transform: translateX(-100%);
	-moz-transform: translateX(-100%);
	-ms-transform: translateX(-100%);
	-o-transform: translateX(-100%);
	transform: translateX(-100%)
}

.grid__sidebar--visibility--visible {
	-webkit-transform: translateX(0);
	-moz-transform: translateX(0);
	-ms-transform: translateX(0);
	-o-transform: translateX(0);
	transform: translateX(0);
	-webkit-box-shadow: -1.9px .7px 9px rgba(0, 0, 2, .4);
	-moz-box-shadow: -1.9px .7px 9px rgba(0, 0, 2, .4);
	box-shadow: -1.9px .7px 9px rgba(0, 0, 2, .4)
}

.slideout-open .grid__sidebar {
	display: block
}

.grid__main {
	position: relative;
	z-index: 1;
	width: 100%;
	min-height: 100vh;
	background-image: url(../../images/bgd1.jpg);
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-position: 50%;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover
}

.slideout-open, .slideout-open .grid__main {
	overflow: hidden
}

.grid__content {
	clear: both;
	width: 100%;
	background-color: #fff
}

.grid__content-wrap {
	position: relative;
	width: -webkit-calc(86% - -2rem);
	width: -moz-calc(86% - -2rem);
	width: calc(86% - -2rem);
	margin: 0 auto;
	padding-right: 16px;
	padding-right: 1rem;
	padding-bottom: 6em;
	padding-left: 16px;
	padding-left: 1rem
}

.grid__content-col-left {
	float: left;
	width: -webkit-calc(60% - -150px);
	width: -moz-calc(60% - -150px);
	width: calc(60% - -150px);
	padding: 32px 32px 0 0;
	padding: 2rem 2rem 0 0
}

.grid__content-col-right {
	float: right;
	width: -webkit-calc(40% - 150px);
	width: -moz-calc(40% - 150px);
	width: calc(40% - 150px);
	padding: 32px 0 0;
	padding: 2rem 0 0
}

@media screen and (max-width:1120px) {
	.grid__content-col-left {
		width: 60%
	}

	.grid__content-col-right {
		width: 40%
	}

}

@media screen and (max-width:640px) {
	.grid__content-col-left {
		width: 100%;
		margin-bottom: 32px;
		margin-bottom: 2rem;
		padding-right: 0;
		padding-bottom: 32px;
		padding-bottom: 2rem;
		border-right: none;
		border-bottom: 1px solid #c4c4c4
	}

	.grid__content-col-right {
		width: 100%;
		padding-left: 0
	}

}