
.sidenav {
    height: 100%;
    width: 100%;
    display: none;
    position: fixed;
    z-index: 999;
    top: 0;
    right: 0;
    color: #ccc;
    background-color: rgba(1,1,1,0.8);
    overflow-x: hidden;
    padding-top: 30px;
    transition: 0.5s;
}
.sidenav.show {
    display: block;
}
.sidenav .closebtn {
    position: absolute;
    top: 10px;
    left: 20px;
    font-size: 36px;
    color: #fff;
}
.sidenav ul {
    list-style: none;
    margin: 0;
}
.sidenav ul a {
    text-decoration: none;
    font-size: 0.8rem;
    color: #ccc !important;
    font-weight: 400;
    display: block;
    transition: 0.3s;
}
#mySidenav .menu-center {
padding: 0 60px;

}
#mySidenav .social-icons {
    width: 100%;
    position: absolute;
    text-align: center;
    bottom: 0;
    background-color: #333;
    left: 0;
    margin: 0 auto 0;
    padding-top: 10px;
    padding-bottom: 20px;
    display: block;
    overflow: hidden;
    border-top: 1px solid rgba(255,255,255,0.2);
}
#mySidenav .social-icons a {
    background: none;
    padding: 15px;
    display: inline;
    font-size: 15px;
    color:#ccc;
}

#nav-icon {
    width: 25px;
    height: 25px;
    position: absolute;
    z-index: 1002;
    right: 20px;
    top: 24px;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .5s ease-in-out;
    -moz-transition: .5s ease-in-out;
    -o-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
    cursor: pointer;
}
nav a {
    color: #333;
}
#nav-icon span:nth-child(1) {
    top: 0px;
}
#nav-icon span:nth-child(2) {
    top: 7px;
}
#nav-icon span:nth-child(3) {
    top: 14px;
}
#nav-icon span {
    display: inline-block;
    text-indent: -9999em;
    position: absolute;
    height: 2px;
    width: 100%;
    background: #333;
    border-radius: 9px;
    opacity: 1;
    left: 0;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .25s ease-in-out;
    -moz-transition: .25s ease-in-out;
    -o-transition: .25s ease-in-out;
    transition: .25s ease-in-out;
}
#nav-icon.open {
	color: #fff;
	z-index: 2000;
}
#nav-icon.open span:nth-child(1) {
    top: 7px;
    background: #fff;
    -webkit-transform: rotate(135deg);
    -moz-transform: rotate(135deg);
    -o-transform: rotate(135deg);
    transform: rotate(135deg);
}
#nav-icon.open span:nth-child(2) {
    opacity: 0;
    left: -60px;
}
#nav-icon.open span:nth-child(3) {
    top: 7px;
    background: #fff;
    -webkit-transform: rotate(-135deg);
    -moz-transform: rotate(-135deg);
    -o-transform: rotate(-135deg);
    transform: rotate(-135deg);
}

@media screen and (max-width: 1020px) {
			.page-contact .form-actions {
  		float: none;

}
		.field-name-field-mainnewsphoto img, .field-name-field-mainimg img, .rtecenter img {
				height: auto !important;
				width: 100% !important;
				margin-left: 0 !important;
		}
		.field-name-field-exhpics {
  			width: 100%;
  		}

  		.videoWrapper {
			position: relative;
			padding-bottom: 56.25%; /* 16:9 */
			padding-top: 25px;
			height: 0;
		}
		.videoWrapper iframe {
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
		}

		.node-type-text #content {
			width:70% !important;
		}
}


@media screen and (max-width: 960px) {
		.page-contact .form-actions {
  		float: right;

}
	#header {
		padding-left: 20px;

	}
	#header .section {
		width: 100%;
	}
	#logo {
		float: none;
	}
	#main-menu {
		margin-right: 20px;
	}
	#content, .no-sidebars #content {
		width: 100%
	}
	#page-wrapper, .region-bottom {
		width: 100%;
	}
	.region-content {
	  width: 100%;
	  min-width: 100%;
	}
	.view-works .views-row {
	  margin-right: 0px;
	}
	.field-items img {
		max-width: 100%;
	}
}

@media screen and (max-width: 880px) {
	#header {
		    background-color: rgba(255, 255, 255, 0.8);
		    position: relative;
		}
	#page {
		margin-top: 1px;
	}
	p {
    	margin: 30px 80px;
	}



		.field-name-field-mainnewsphoto img, .workimg img {
				height: auto;
				width: 100%;
				margin-left: 0 !important;
		}
		.node-type-text #content {
			width:65% !important;
		}
	}

@media screen and (max-width: 550px) {
	h2 {
		font-size: 14px;
	}
	p {
	    margin: 1.5em 0;
	}

	#logo {
    	font-size: 26px;
	}
	#openSidebar {
    	font-size: 28px;
	}
	#supersized img {
		left: 0 !important;
	}

	#block-block-6.block, #block-block-5.block {
		width:100%;
		margin-left: 0;
	}
	.node-type-text #block-block-6.block {
			margin-left: -20px;
		    background: none;
		    bottom: -20px;
	}
	#block-menu-menu-works-sub-menu {
		display: none;
	}
	#header {

	}
	#main-menu {
		text-align: center;
		line-height: 2;
		margin-right: 0px;
		margin-top: 10px;
		font-size: 13px;
	}

	#main-wrapper img {

		margin-left: 0 !important;
	}
	#block-block-5 img {
		width:40px;
		height: 40px;
	}
	form.contact-form {
		padding-left: 0px; 
		}
	.page-contact .form-text, textarea,.form-textarea-wrapper {
		width: 100%;
	}
	.view-works .views-row {
		  float: none;
		  margin-right: 0px;
		}
	#block-menu-menu-works-sub-menu ul {
		float: none;
	}
	#block-menu-menu-works-sub-menu ul.menu li {
		float: none;
		padding: 0;
	}

	.views-limit-grouping-group {
		float: none;
		}

	.node-type-text .region-sidebar-first {
		float: none;
		margin: 0;
		width: 100%
	}
		.node-type-text .region-sidebar-first .section {
			margin-top: 20px;
			margin-right: 0;
		}

	.node-type-text #content {
	  float: none;
	  width: 100% !important;
	  margin: 0;
	}

	}