/*********************************************************************************************

x. Basic Setup (Body, Fonts, etc.) 

********************************************************************************************/
@media only screen and (max-width:1300px) {
	.wrapper.large {
		width: auto;
		margin: 0 50px;
	}
}
@media only screen and (max-width:1200px) {
	.wrapper.medium {
		width: auto;
		margin: 0 50px;
	}
}
@media only screen and (max-width:1000px) {
	h1 {
		font-size: 3.750em;
	}
	h2 {
		font-size: 2.500em;
	}
	h3 {
		font-size: 1.875em;
	}
	h4,
	h5 {
		font-size: 1.250em;
	}
}
@media only screen and (max-width:800px) {
	.wrapper.large,
	.wrapper.medium {
		margin: 0 30px;
	}
}
@media only screen and (max-width:760px) {
	.wrapper.small {
		width: auto;
		margin: 0 30px;
	}
	.wrapper.large .wrapper.small {
		margin: 0;
	}
}
@media only screen and (max-width:700px) {
	h1 {
		font-size: 3.125em;
	}
}
@media only screen and (max-width:500px) {
	html,
	body {
		font-size: 14px;
	}
	h1 {
		font-size: 2.500em;
	}
	h2 {
		font-size: 2.000em;
	}
}

/********************************************************************************************* 

x. Awards + Press
x. Statistics

*********************************************************************************************/
@media only screen and (max-width:1100px) {
	section.awards-press.background-black,
	section.statistics.background-black {
		padding: 100px 0;
	}
}
@media only screen and (max-width:1000px) {
	section.awards-press .columns, 
	section.statistics .columns {
		flex-direction: column;	
	}
	section.awards-press .columns .column, 
	section.statistics .columns .column {
		width: 100%;
		max-width: none;
	}
	section.awards-press .columns .column:not(:last-child), 
	section.statistics .columns .column:not(:last-child) {
		border-right: none;
		border-bottom: 1px solid #9F9F9F;
		margin: 0 0 30px 0;
		padding: 0 0 30px 0;
	}
}
@media only screen and (max-width:800px) {
	section.awards-press.background-black,
	section.statistics.background-black {
		padding: 50px 0;
	}
	section.text.background-black + section.awards-press.background-black, 
	section.text.background-black + section.statistics.background-black {
		margin-top: -60px;	
	}
	section.awards-press .columns, 
	section.statistics .columns {
		margin: 0 -30px;	
	}
	section.awards-press .columns .column .inside, 
	section.statistics .columns .column .inside {
		padding: 0 30px;
	}
}

/********************************************************************************************* 

x. Slick

*********************************************************************************************/
@media only screen and (max-width:1300px) {
	.slick-prev {
		left: -40px;
	}
	.slick-next {
		right: -40px;
	}
	.slick-arrow {
		width: 40px; height: 60px;
	}
	.slick-arrow svg {
		width: 10px; height: 18px;
	}
}
@media only screen and (max-width:800px) {
	.slick-next {
		right: 0;
	}
	.slick-prev {
		left: 0;
	}
}

/********************************************************************************************* 

x. Slick

*********************************************************************************************/
@media only screen and (max-width:1300px) {
	.flex-direction-nav a.flex-prev {
		left: -30px;
	}
	.flex-direction-nav a.flex-next {
		right: -30px;
	}
	.flex-direction-nav a {
		width: 10px;
	}
	.flex-direction-nav a svg  {
		width: 10px; height: 18px;
	}
}
@media only screen and (max-width:800px) {
	.flex-direction-nav a {
		width: 40px; height: 60px;
		background: #7995A7;
	}
	.flex-direction-nav a.flex-next {
		right: 0;
	}
	.flex-direction-nav a.flex-prev {
		left: 0;
	}
	.flex-direction-nav a svg,
	.background-black .flex-direction-nav a svg {
		fill: white;
		-moz-transform: translateX(-50%) translateY(-50%);
		-webkit-transform: translateX(-50%) translateY(-50%);
		-o-transform: translateX(-50%) translateY(-50%);
		-ms-transform: translateX(-50%) translateY(-50%);
		transform: translateX(-50%) translateY(-50%);
		position: absolute;
		top: 50%; left: 50%;
	}
	.flex-direction-nav a:hover svg,
	.background-black .flex-direction-nav a:hover svg {
		fill: black;
	}
}


/********************************************************************************************* 

x. Footer

*********************************************************************************************/
@media only screen and (max-width:600px) {
	footer,
	.footer {
		padding: 50px 0;
	}
	footer .columns,
	.footer .columns {
		flex-direction: column;
	}
	footer .columns .column,
	.footer .columns .column {
		width: 100%;
	}
	footer .content,
	.footer .content {
		text-align: center;
	}
	footer .social-media,
	.footer .social-media {
		text-align: center;
		margin: 0 0 30px 0;
	}
	footer .social-media li,
	footer .social-media li:not(:first-child),
	.footer .social-media li,
	.footer .social-media li:not(:first-child) {
		margin: 0 15px;
	}
}


/********************************************************************************************* 

x. Header

*********************************************************************************************/
@media only screen and (max-width:1100px) {
	header .navigation.main {
		display: none;
	}
	header .navigation.rollout {
		right: 50px;
	}
}
@media only screen and (max-width:1000px) {
	header .navigation.rollout > li > a {
		font-size: 1.875em;
	}
}
@media only screen and (max-width:800px) {
	header .navigation.rollout {
		right: 30px;
	}
}
@media only screen and (max-width:700px) {
	header .navigation.rollout > li > a {
		font-size: 1.313em;
	}
	header .navigation.rollout > li > .sub-menu > li > a {
		font-size: 1.063em;
	}
}
@media only screen and (max-width:600px) {
	header {
		padding: 50px 0;
	}
	header.pinned:not(.top) {
		padding: 30px 0;
	}
	header .navigation.rollout {
		right: 0;
	}
	header .notification-bar {
		margin-top: -50px;
	}
}
@media only screen and (max-width:500px) {
	header.dark .logo {
		width: 100px;
	}
}

/********************************************************************************************* 

x. Home

*********************************************************************************************/
@media only screen and (max-width:1200px) {
	#text .wrapper {
		-moz-transform: none;
		-webkit-transform: none;
		-o-transform: none;
		-ms-transform: none;
		transform: none;
		bottom: 50px;
		left: 0; right: 0;
	}
}
@media only screen and (max-width:800px) {
	#slides .slide.image {
		background-attachment: scroll;
	}
	#text .wrapper {
		bottom: 30px;
	}
}

/********************************************************************************************* 

x. Images

*********************************************************************************************/
@media only screen and (max-width:600px) {
	section.image .image .content {
		padding: 20px;
	}
}

/********************************************************************************************* 

x. Images

*********************************************************************************************/
@media only screen and (max-width:1300px) {
	section.images.image-alignment-bottom .columns .column:first-of-type .inside, 
	section.images.image-alignment-center .columns .column:first-of-type .inside, 
	section.images.image-alignment-top .columns .column:first-of-type .inside {
		padding-right: 50px;
	}
}
@media only screen and (max-width:800px) {
	section.images.image-alignment-bottom .columns .column:first-of-type .inside, 
	section.images.image-alignment-center .columns .column:first-of-type .inside, 
	section.images.image-alignment-top .columns .column:first-of-type .inside {
		padding-right: 30px;
	}
}
@media only screen and (max-width:600px) {
	section.images.image-alignment-bottom .columns,
	section.images.image-alignment-top .columns {
		flex-direction: column;
	}
	section.images.image-alignment-bottom .columns .column,
	section.images.image-alignment-top .columns .column {
		width: 100%;
	}
	section.images.image-alignment-bottom .columns .column:first-of-type .inside, 
	section.images.image-alignment-center .columns .column:first-of-type .inside, 
	section.images.image-alignment-top .columns .column:first-of-type .inside {
		padding-right: 0;
	}
	section.images.image-alignment-bottom.image-spacing-left .columns .column:last-of-type .inside,
	section.images.image-alignment-bottom.image-spacing-right .columns .column:last-of-type .inside {
		padding-bottom: 0;
	}
	section.images.image-alignment-top.image-spacing-left .columns .column:last-of-type .inside,
	section.images.image-alignment-top.image-spacing-right .columns .column:last-of-type .inside {
		padding-top: 0;
	}
}


/********************************************************************************************* 

x. Main

*********************************************************************************************/
@media only screen and (max-width:800px) {
	main section {
		margin: 0 0 50px 0;
	}
	section.full-width + section.full-width {
		margin-top: -50px;
	}
}
@media only screen and (max-width:600px) {
	main {
		padding: 100px 0 0 0;
	}
}

/********************************************************************************************* 

x. News

*********************************************************************************************/
@media only screen and (max-width:1300px) {
	section.news .post .columns {
		margin: 0 -25px;
		align-items: flex-start;
	}
	section.news .post .columns .column .inside {
		padding: 0 25px;
	}
}
@media only screen and (max-width:800px) {
	section.news .post .columns {
		margin: 0 -15px;
	}
	section.news .post .columns .column .inside {
		padding: 0 15px;
	}
}
@media only screen and (max-width:700px) {
	section.news .post .columns {
		flex-direction: column;
	}
	section.news .post .columns .column {
		width: 100%;
	}
	section.news .post .columns .column:first-child {
		margin: 0 0 30px 0;
	}
}


/********************************************************************************************* 

x. Projects

*********************************************************************************************/
@media only screen and (max-width:1300px) {
	section.projects .grid {
		margin: -25px !important;
	}
	section.projects .grid .item .inside {
		padding: 25px !important;
	}
}
@media only screen and (max-width:1200px) {
	section.projects .columns {
		flex-direction: column;
	}
	section.projects .columns .column {
		width: 100%;
	}
	section.projects .columns .column:first-child {
		margin: 0 0 30px 0;
	}
}
@media only screen and (max-width:900px) {
	section.projects .grid .item.width-33 {
		width: 50%;
	}
}
@media only screen and (max-width:800px) {
	section.projects .grid {
		margin: -15px !important;
	}
	section.projects .grid .item .inside {
		padding: 15px !important;
	}
}
@media only screen and (max-width:700px) {
	/*
	section.projects .map {
		height: 600px;
	}
	*/
}
@media only screen and (max-width:600px) {
	section.projects .grid .item.width-33,
	section.projects .grid .item.width-50 {
		width: 100%;
	}
}
@media only screen and (max-width:500px) {
	/*
	section.projects .map {
		height: 400px;
	}
	*/
}

/********************************************************************************************* 

x. Quotation

*********************************************************************************************/
@media only screen and (max-width:1100px) {
	section.quotation.background-black {
		padding: 100px 0;
	}
}
@media only screen and (max-width:800px) {
	section.quotation.background-black {
		padding: 50px 0;
	}
}

/********************************************************************************************* 

x. Related Projects

*********************************************************************************************/
@media only screen and (max-width:1300px) {
	section.related-projects .columns {
		margin: 50px -25px 0 -25px;
	}
	section.related-projects .columns .column .inside {
		padding: 0 25px;
	}	
}
@media only screen and (max-width:800px) {
	section.related-projects .columns {
		margin: 30px -15px 0 -15px;
	}
	section.related-projects .columns .column .inside {
		padding: 0 15px;
	}	
}
@media only screen and (max-width:600px) {
	section.related-projects .columns {
		flex-direction: column;
	}
	section.related-projects .columns .column {
		width: 100%;
	}
	section.related-projects .columns .column:first-child {
		margin: 0 0 30px 0;
	}
}

/********************************************************************************************* 

x. Search

*********************************************************************************************/
@media only screen and (max-width:1000px) {
	#search form input[type="text"] {
		font-size: 2.500em;
	}
}
@media only screen and (max-width:700px) {
	#search .close svg {
		width: 20px; height: 20px;
	}
}
@media only screen and (max-width:500px) {
	#search.open {
		border-width: 15px;
	}
	#search form input[type="text"] {
		font-size: 2.000em;
	}
}

/********************************************************************************************* 

x. Slideshow

*********************************************************************************************/
@media only screen and (max-width:1100px) {
	section.slideshow.background-black {
		padding: 100px 0;
	}
}
@media only screen and (max-width:800px) {
	section.slideshow.background-black {
		padding: 50px 0;
	}
}

/********************************************************************************************* 

x. Team

*********************************************************************************************/
@media only screen and (max-width:1300px) {
	section.team .grid {
		margin: -25px;
	}
	section.team .grid .full-information .inside,
	section.team .grid .item .inside {
		padding: 25px;
	}
	section.team .grid .full-information .columns .column:first-child .inside {
		padding-right: 50px;
	}
	section.team .grid .full-information .spacer {
		height: 50px;
	}
}
@media only screen and (max-width:900px) {
	section.team .grid .item {
		width: 50%;
	}
}
@media only screen and (max-width:800px) {
	section.team .grid {
		margin: -15px;
	}
	section.team .grid .full-information .inside,
	section.team .grid .item .inside {
		padding: 15px;
	}
	section.team .grid .full-information .columns {
		flex-direction: column;
	}
	section.team .grid .full-information .columns .column {
		width: 100%;
	}
	section.team .grid .full-information .columns .column:first-child {
		margin: 0 0 30px 0;
	}
	section.team .grid .full-information .columns .column:first-child .inside {
		padding-right: 0;
	}
}
@media only screen and (max-width:600px) {
	section.team .grid .item {
		width: 100%;
	}
}

/********************************************************************************************* 

x. Text

*********************************************************************************************/
@media only screen and (max-width:1200px) {
	section.text .columns {
		flex-direction: column-reverse;
	}
	section.text .columns .column {
		width: 100%;
	}
	section.text .columns .column:last-child {
		margin: 0 0 30px 0;
	}
	section.text .columns .column .inside .filters > ul {
		margin: 20px 40px 0 40px;
	}
	section.text .columns .column .inside .sub-navigation,
	section.text .columns .column .inside .filters {
		display: inline-block;
		zoom: 1; 
		*display: inline;
		vertical-align: top;
	}
	section.text .columns .column .inside .sub-navigation {
		margin: 5px 15px 0 0;
	}
}
@media only screen and (max-width:1100px) {
	section.text.background-black {
		padding: 100px 0;
	}
}
@media only screen and (max-width:800px) {
	section.text.background-black,
	section.text.background-dots .wrapper.small {
		padding: 50px 0;
	}
}

/********************************************************************************************* 

x. Text + Image
x. Text + Map

*********************************************************************************************/
@media only screen and (max-width:1300px) {
	section.text-image.text-position-left .columns .column:last-child .inside, 
	section.text-map.text-position-left .columns .column:last-child .inside {
		padding-right: 50px;
	}
	section.text-image.text-position-right .columns .column:last-child .inside, 
	section.text-map.text-position-right .columns .column:last-child .inside {
		padding-left: 50px;
	}
}
@media only screen and (max-width:1100px) {
	section.text-image.background-black, 
	section.text-map.background-black {
		padding: 100px 0;
	}
	section.text-image.text-alignment-top .columns .column:last-child, 
	section.text-map.text-alignment-top .columns .column:last-child {
		padding-top: 0;
	}
	section.text-image.text-alignment-bottom .columns .column:last-child, 
	section.text-map.text-alignment-bottom .columns .column:last-child {
		padding-bottom: 0;
	}
	section.text-image.text-alignment-bottom .columns, 
	section.text-map.text-alignment-bottom .columns {
		align-items: flex-start;
	}
}
@media only screen and (max-width:800px) {
	section.text-image.background-black, 
	section.text-map.background-black {
		padding: 50px 0;
	}
	section.text-image .columns, 
	section.text-map .columns,
	section.text-image.text-position-left .columns, 
	section.text-map.text-position-left .columns,
	section.text-image.text-alignment-top .columns, 
	section.text-map.text-alignment-top .columns,
	section.text-image.text-position-right .columns, 
	section.text-map.text-position-right .columns {
		flex-direction: column;
	}
	section.text-image .columns .column, 
	section.text-map .columns .column {
		width: 100%;
	}
	section.text-image .columns .column:first-child, 
	section.text-map .columns .column:first-child {
		margin: 0 0 30px 0;
	}
	section.text-image.text-position-left .columns .column:last-child .inside, 
	section.text-map.text-position-left .columns .column:last-child .inside {
		padding-right: 0;
	}
	section.text-image.text-position-right .columns .column:last-child .inside, 
	section.text-map.text-position-right .columns .column:last-child .inside {
		padding-left: 0;
	}
}
@media only screen and (max-width:500px) {
	section.text-map .map {
		height: 500px;
	}
}

/********************************************************************************************* 

x. Text + Images

*********************************************************************************************/
@media only screen and (max-width:1300px) {
	section.text-images .columns .column.width-45 .inside {
		margin-left: 50px;
	}
}
@media only screen and (max-width:900px) {
	section.text-images .desktop {
		display: none;
	}
	section.text-images .mobile {
		display: block;
	}
	section.text-images .image .columns .inside .content .numbers {
		/*display: none;*/
	}
}
@media only screen and (max-width:600px) {
	section.text-images .image .columns {
		padding: 20px;
	}
}

/********************************************************************************************* 

x. WordPress Core

*********************************************************************************************/
@media only screen and (max-width:800px) {
	.alignleft,
	.alignright {
		width: auto; height: auto;
		max-width: 50%;
	}
}
@media only screen and (max-width:800px) {
	.alignleft,
	.alignright {
		width: 100%; height: auto;
		max-width: 100%;
	}
}


/********************************************************************************************* 

x. Smaller than 1024px

*********************************************************************************************/
@media only screen and (max-width:1024px) {
	
	input,
	textarea {
	    border-radius: 0;
	    -webkit-appearance: none;
	}
	
}