/*
GRID based on 4x 396px, 15px spacing (1629px in total) + 146px sides in margin.
*/

/* large screen sizes */
@media
only screen and (min-width : 1448px)  {

	/* width settings */
	.container.width_max { width: 1432px; }
	.container { width: 1296px; }

	/* header and navigation */

	/* content */

	/* footer */
	.footer_content ul li { width: 196px; }

	/* show / hide */
	.no_mobile { display: block; visibility: visible; }
	.mobile_only { display: none; visibility: hidden; }
}

/* regular screen sizes*/
@media
only screen and (min-width : 1280px) and (max-width : 1447px)   {

	/* width settings */
	.container.width_max { width: 100%; max-width: 1264px; }
	.container { width: 1220px; }

	/* column widths */
	.col-max { width: 1264px; }
	.col-12 { width: 1220px; }
	.col-11 { width: 1115px; }
	.col-10 { width: 1010px; }
	.col-9, .col-smaller-9 { width: 905px; }
	.col-8 { width: 800px; }
	.col-7 { width: 695px; }
	.col-6 { width: 590px; }
	.col-5 { width: 485px; }
	.col-4 { width: 380px; }
	.col-3 { width: 275px; }
	.col-2 { width: 170px; }
	.col-1 { width: 65px; }

	/* cards */
	.card {	width: 390px;	height: 270px; }

	/* effects */
	.page_header_bg {	top: -20vh; }
	@keyframes floating {
	    0% { transform: translate(0, 0); }
	    50%  { transform: translate(100px, 100px) scale(1.5); }
	    100%   { transform: translate(0, 0); }
	}

	@keyframes floating2 {
	    0% { transform: translate(0, 0); }
	    50%  { transform: translate(-250px, 70px) scale(2); }
	    100%   { transform: translate(0, 0); }
	}

	/* spacing */

	/* before/after */
	.image_text { font-size: 70px; }

	/* footer */
	.footer_content ul li { width: 176px; }

	/* show / hide */
	.no_mobile { display: block; visibility: visible; }
	.mobile_only { display: none; visibility: hidden; }
}


/* small screen sizes */
@media
only screen and (min-width : 1024px) and (max-width : 1279px)   {

	/* width settings */
	.container.width_max { width: 100%; max-width: 1006px; }
	.container { width: 960px; }

	/* main font settings */
	html, body { font-size: 16px; line-height: 24px; }
	h1 { font-size: 40px; }
	h2 { font-size: 30px;	}
	h3 { font-size: 20px;	}
	h1.header_title, h1.header_title_white { font-size: 46px; }
	.home h1.header_title, h1.homepage_title { font-size: 62px;  }
	a:link, a:visited {	}
	a.readmore_button:link, a.readmore_button:visited {  font-size: 18px;	 }

	/* column widths */
	.col_wrap {	padding: 0 20px 0 0; }
	.col-max { width: 1006px; }
	.col-12 { width: 960px; }
	.col-11 { width: 895px; }
	.col-10 { width: 810px; }
	.col-9 { width: 725px; }
	.col-8 { width: 640px; }
	.col-7 { width: 555px; }
	.col-6 { width: 470px; }
	.col-5 { width: 385px; }
	.col-4 { width: 300px; }
	.col-3 { width: 215px; }
	.col-2 { width: 130px; }
	.col-1 { width: 45px; }

	/* column adjustment */
	.col-smaller-7 { width: 555px; }
	.col-smaller-6 { width: 470px; }
	.col-smaller-5 { width: 385px; }
	.col-smaller-4 { width: 300px; }

	/* header and navigation */
	#menu_trigger { height: 36px; width: 36px; background-size: 14px 14px; }
	.main_menu li a:link, .main_menu li a:visited {  }
	.main_menu .sub-menu { margin-top: 10px !important; }
	.main_menu .sub-menu .menu-item a:link, .main_menu .sub-menu .menu-item a:visited  { text-indent: 60px; font-size: 28px; line-height: 28px; }
	#subnavigation_wrap .page_item a:link, #subnavigation_wrap .page_item a:visited { font-size: 16px; }

	/* cards */
	.card { width: 470px; height: 270px; }
	.card__icon { padding: 16px 8px 8px 8px; }

	/* images */
	.image_wrap.large { width: auto; }
	.image_wrap.medium {  width: 350px; }
	.image_wrap.medium-height { height: 500px; width: auto; }
	.image_wrap.thumbnail {  width: 220px; }

	/* featured image and others heights */
	.height_image { height: 460px; }
	.height_image_s { height: 322px; }
	.height_image_m { height: 390px; }
	.height_image_portrait_m { height: 500px; }
	.height_image_l { height: 750px; }
	.height_preview { height: 400px; }
	.height_preview_link { height: 110px; }
	.height_preview_link_wide { height: 114px; }
	.height_preview_link_small { height: 70px; }
	.height_preview_l { height: 540px; }

	/* before/after */
	.image_text { font-size: 60px; }

	/* effects */
	.page_header_bg {	top: -5vh; }
	@keyframes floating {
	    0% { transform: translate(0, 0); }
	    50%  { transform: translate(50px, -50px) scale(1.2); }
	    100%   { transform: translate(0, 0); }
	}

	@keyframes floating2 {
	    0% { transform: translate(0, 0); }
	    50%  { transform: translate(-150px, -70px) scale(1,2); }
	    100%   { transform: translate(0, 0); }
	}

	/* spacing */
	.section_spacing { padding: 70px 0 70px 0; }
	.margin_top_min { margin-top: -5vh !important; }

	/* footer */
	.footer_content ul li { width: 147px; font-size: 18px; }

	/* show / hide */
	.no_mobile { display: block; visibility: visible; }
	.mobile_only { display: none; visibility: hidden;  }

}

/* Tablet portrait size and up */
@media
only screen and (min-width : 768px) and (max-width : 1023px)   {

	/* width settings */
	.container.width_max { width: 100%; max-width: 760px; }
	.container { width: 720px; }

	/* main font settings */
	html, body { font-size: 16px; line-height: 24px; }
	h1, h1.header_title, h1.header_title_white, h1.homepage_title  { font-size: 36px; }
	h2 { font-size: 26px;	}
	h3 { font-size: 20px;	}
	h2.preview_title, h2.preview_subtitle  { font-size: 20px; line-height: 24px; }
	a:link, a:visited {	 }

	/* columns */
	.col-max { width: 760px; }
	.col-12 { width: 720px; }
	.col-11 { width: 658px; }
	.col-10 { width: 596px; }
	.col-9 { width: 534px; }
	.col-8 { width: 472px; }
	.col-7 { width: 410px; }
	.col-6 { width: 348px; }
	.col-5 { width: 286px; }
	.col-4 { width: 224px; }
	.col-3 { width: 162px; }
	.col-2 { width: 100px; }
	.col-1 { width: 38px; }

	/* tablet column adjustments */
	.col_wrap { padding: 0 24px 0 0; }
	.col-tablet-full { width: 100%; }
	.col-tablet-half { width: 50%;  }
	.col-tablet-third { width: 33.3333%; }
	.col-tablet-8 { width: 472px; }
	.col-tablet-7 { width: 410px; }
	.col-tablet-6 { width: 348px; }
	.col-tablet-5 { width: 286px; }
	.col-tablet-4 { width: 224px; }

	/* flex */
	.flex-basis-40, .flex-basis-45, .flex-basis-50, .flex-basis-55, .flex-basis-60 {  width: 100%; }

	/* header and navigation */
	#logo { position: fixed; width: 120px; z-index: 11; }
	#menu_trigger { height: 36px; width: 36px; }
	.main_menu li a:link, .main_menu li a:visited {   }
	.main_menu .sub-menu { margin-top: 10px !important; }
	.main_menu .sub-menu .menu-item a:link, .main_menu .sub-menu .menu-item a:visited  { text-indent: 60px; font-size: 28px; line-height: 28px; }
	#subnavigation_wrap .page_item a:link, #subnavigation_wrap .page_item a:visited { font-size: 16px; }

	/* cards */
	.card__icon { padding: 16px 8px 8px 8px; }

	/* content */
	.quote { font-size: 24px; }

	/* images */
	.image_wrap {  }
	.image_wrap.large {  width: auto; }
	.image_wrap.medium { width: 220px; }
	.image_wrap.thumbnail { width: 90px; }
	.image_container.two.image_1  { padding-right: 24px; }
	.image_container.three.image_1 { padding-right: 24px; }
	.image_container.three.image_2 { padding-right: 24px; }
	.image_wrap.large { width: auto; }
	.image_wrap.medium {  width: 350px; }
	.image_wrap.medium-height { height: 500px; width: auto; }
	.image_wrap.thumbnail {  width: 220px; }

	/* before/after */
	.image_text { font-size: 50px; }
	.bg_image_container {	height: 60	vw; }

	/* effects */
	.homepage_cloud_2 { width: 230px;	height: 220px; }
	.homepage_cloud_3 { width: 258px; height: 200px; }
	.page_header_bg {	top: 0; }
	@keyframes floating {
			0% { transform: translate(0, 0); }
			50%  { transform: translate(150px, 50px) scale(2.1); }
			100%   { transform: translate(0, 0); }
	}

	@keyframes floating2 {
			0% { transform: translate(0, 0); }
			50%  { transform: translate(-100px, -120px) scale(2.2); }
			100%   { transform: translate(0, 0); }
	}

	/* spacing */
	.section_spacing { padding: 40px 0 40px 0; }
	.padding_left_mobile, .padding_left_tablet { padding-left: 20px; max-width: calc(100% - 20px); }
	.padding_sides_mobile { padding-left: 20px; padding-right: 20px; max-width: calc(100% - 40px); }
	.padding_none_mobile { padding: 0; }
	.margin_top_min { margin-top: 0 !important; }
	.padding_top { padding-top: 30px; }
	.padding_top_m { padding-top: 45px; }
	.padding_top_l { padding-top: 80px; }

	/* featured image and others heights */
	.height_image { height: 460px; }
	.height_image_s { height: 322px; }
	.height_image_m { height: 390px; }
	.height_image_portrait_m { height: 500px; }
	.height_image_l { height: 750px; }
	.height_preview { height: 400px; }
	.height_preview_link { height: 107px; }
	.height_preview_link_wide { height: 112px; }
	.height_preview_link_small { height: 70px; }
	.height_preview_l { height: 420px; }

	/* footer */
	.footer_wrap { }
	.footer_content ul li { float: left; width: auto; font-size: 16px; padding-right: 20px; }
	.footer_content_nav ul.menu li:nth-child(3n+4){	width: auto; }
	.footer_content_small ul.menu li:nth-child(3n+3){ width: auto; }
	.image_wrap.medium-height { padding: 20px; height: 400px; width: auto; }

	/* show / hide */
	.mobile_only { display: block; visibility: visible; }
	.no_mobile, .no_tablet { display: none; visibility: hidden; }

}

/* Mobile sizes - large */
@media only screen and (min-device-width : 1px) and (max-device-width : 767px),
only screen and (min-width : 1px) and (max-width : 767px) {

	/* width settings */
	.container { width: calc(100% - 40px); max-width: 520px; }

	/* font settings */
	html, body { font-size: 16px; line-height: 24px;  }
	h1 { font-size: 28px; letter-spacing: 0; padding: 0 0 16px 0 !important; }
	h2 { font-size: 22px;	letter-spacing: 0; }
	h3 { font-size: 20px;	}
	h1.header_title, h1.header_title_white { font-size: 36px; }
	h1.homepage_title { font-size: 46px; }
	h2.preview_title, h2.preview_subtitle  { font-size: 18px; line-height: 24px; padding-left: 20px; width: calc( 100% - 20px); }
	blockquote { padding: 50px 0 70px 0;	margin: 0;	font-size: 30px;	width: 100%; background-image: url(../images/quotes.svg); }

	/* cards */
	.card__icon { padding: 16px 8px 8px 8px; }

	/* content */
	.quote { font-size: 22px; }

	/* column adjustments */
	.col_wrap { padding: 0; }
	.col-2, .col-3, .col-4, .col-5, .col-6, .col-full-mobile, .col-quarter,
	.col-7, .col-8, .col-9, .col-10, .col-11, .col-12, 	.col-max { width: 100%; }
	.col-1 { width: 50%); }
	.col_content { padding: 0 !important; margin: 0 !important;  }

	/* flex */
	.flex-basis-40, .flex-basis-45, .flex-basis-50, .flex-basis-55, .flex-basis-60 {  width: 100%; }

	/* header and navigation */
	#header { height: 75px;  }
	#logo { position: fixed; top: 15px; width: 92px; height: 45px; z-index: 11;  }
	#menu_trigger { top: 10px; right: 15px; height: 36px; width: 36px; }
	.main_menu ul { list-style: none; padding: 25px 0 25px 0; width: 100%; margin: 50px 0 0 0; }
	.main_menu li a:link, .main_menu li a:visited { font-size: 40px; letter-spacing: -1.5px; line-height: 45px; width: calc(100% - 40px);	padding: 10px 20px 5px 20px; }
	.main_menu .sub-menu { margin-top: 0 !important; }
	.main_menu .sub-menu .menu-item a:link, .main_menu .sub-menu .menu-item a:visited  {	padding: 5px 20px 5px 20px; text-indent: 30px; font-size: 22px;	line-height: 22px; }
	#wrap { padding: 40px 0 0 0; }

	/* before/after */
	.image_text { font-size: 32px; letter-spacing: -0.5px; max-width: 80vw; }
	.bg_image_container {	height: 50vh !important; }
	.bg_image_full { height: 50vh;  }

	/* effects */
	.homepage_cloud_2 { width: 230px;	height: 220px; }
	.homepage_cloud_3 { width: 162px;	height: 180px;  }
	.page_header_bg {	top: 0; min-height: 130vh; background-size: auto 130vh; }
	@keyframes floating {
			0% { transform: translate(0, 0); }
			50%  { transform: translate(150px, 150px) scale(2.1); }
			100%   { transform: translate(0, 0); }
	}

	@keyframes floating2 {
			0% { transform: translate(0, 0); }
			50%  { transform: translate(-150px, -120px) scale(2.2); }
			100%   { transform: translate(0, 0); }
	}


	/* spacing */
	.space, .space.medium { height: 40px; }
	.space.small { height: 10px; }
	.space.large { height: 60px; }
	.margin_top_min { margin-top: 0 !important; }
	.margin_top { margin-top: 20px; }
	.margin_bottom { margin-bottom: 40px; }
	.padding_full { padding: 20px; }
	.padding_top { padding-top: 20px; }
	.padding_top_m { padding-top: 30px; }
	.padding_top_l { padding-top: 40px; }
	.padding_bottom { padding-bottom: 20px; }
	.padding_bottom_m { padding-bottom: 30px; }
	.padding_bottom_l { padding-bottom: 40px; }
	.padding_left { padding-left: 20px; }
	.padding_left_m { padding-left: 30px; }
	.padding_left_l { padding-left: 40px; }
	.padding_right { padding-right: 20px; }
	.padding_right_m { padding-right: 30px; }
	.padding_right_l { padding-right: 40px; }
	.padding_none_mobile { padding: 0; }
	.padding_top_mobile { padding-top: 150px; }
	.padding_top_mobile_small { padding-top: 20px; }
	.padding_bottom_mobile { padding-bottom: 100px; }
	.padding_bottom_mobile_small { padding-bottom: 20px; }
	.padding_left_mobile { padding-left: 20px; max-width: calc(100% - 40px); }
	.padding_sides_mobile { padding-left: 16px; padding-right: 16px; max-width: calc(100% - 32px); }
	.section_spacing { padding: 20px 0 20px 0; }
	.min_height { min-height: 20px; }
	.post_content_introduction.padding_left { padding: 0; }

	/* images */
	.image_wrap { padding: 20px !important; }
	.image_wrap.large {  width: auto; }
	.image_wrap.medium { width: 220px; }
	.image_wrap.thumbnail { width: 90px; }
	.image_container.two.image_1  { padding-right: 0; }
	.image_container.three.image_1 { padding-right: 0; }
	.image_container.three.image_2 { padding-right: 0; }

	/* images */
	.image_wrap.large { width: auto; }
	.image_wrap.medium {  width: 350px; }
	.image_wrap.medium-height { height: 500px; width: auto; }
	.image_wrap.thumbnail {  width: 220px; }

	/* featured image and others heights */
	.height_image { height: 460px; }
	.height_image_s { height: 322px; }
	.height_image_m { height: 390px; }
	.height_image_portrait_m { height: 500px; }
	.height_image_l { height: 750px; }
	.height_preview { height: 400px; }
	.height_preview_link { height: 110px; }
	.height_preview_link_small { height: 70px; }
	.height_preview_link_wide { height: 134px; }
	.height_preview_l { height: 420px; }

	/* footer override */
	.image_wrap.medium-height { padding: 20px; height: 400px; width: auto; }
	.footer_wrap { padding: 40px 0 40px 0; width: 100%; }
	.footer_content { padding: 5px 0 0 0 !important; }
	.footer_content h3 { padding: 0 0 5px 0 !important; }
	.footer_content ul, .footer_content_right { padding: 0 !important; margin: 0 !important; }
	.footer_content_nav { padding: 50px 0 20px 0; }
	.footer_content ul li { width: 100%; font-size: 18px; padding: 0; }

	/* show / hide */
	.no_mobile { display: none; visibility: hidden; }
	.mobile_only { display: block; visibility: visible; }
}
