/* ###################################################### */
/* STRUCTURE */
/* ###################################################### */

header { padding: 1em 0; min-height: 0;}
._wrapper { max-width: 1200px;}
.card {margin-left: 0; width: auto;}

/* grid settings */
.container {display: -ms-grid;} /* fallback for nested layout */
.list_view, .author_card_wrap {display: flex; flex-wrap: wrap;} /* fallback for simple listing */
.container, .list_view, .author_card_wrap {
	display: grid; 
  grid-gap: 10px 1em;
}
.container {
	-ms-grid-columns: 1fr 1fr 1fr; 
	-ms-grid-rows: 120px 120px 120px auto; 
	grid-template-columns: repeat(3, 1fr); 
	grid-template-rows: repeat(3, 120px); 
}
.box {border-radius: 3px; margin-bottom: 0 }
/* IE needs a specific positioning for each element */
.box:nth-child(2) {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
}
.box:nth-child(3) {
  -ms-grid-row: 2;
  -ms-grid-column: 3;
}
.box:nth-child(4) {
  -ms-grid-row: 3;
  -ms-grid-column: 3;
}
.box:nth-child(6) {
  -ms-grid-row: 4;
  -ms-grid-column: 3;
}

.featured {padding:20px 20px 20px 170px;overflow: hidden;}
.list_view {
	-ms-grid-columns: 1fr 1fr;
	grid-template-columns: repeat(2, 1fr);
 }
.author_card_wrap { 
	-ms-grid-columns: 1fr 1fr;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}

/* IE fallback */
.container > * {margin: 10px .5em;}
.list_view .card {width: 31.3%; margin-left:1%;margin-right: 1%;display:block;float:left;}
.author_card_wrap .card {width: 18%; margin-left:1%;margin-right: 1%;display: block;float: left;}

/* IE fallback overrides */
@supports (display: grid) {
  .container > * {margin: 0;}
	.list_view .card, 
	.author_card_wrap .card {width: auto;margin-left:0;margin-right:0;float: none;}
}
.main_article_pic, .main_article_txt {
  -ms-grid-column: 1;
  -ms-grid-column-span: 2;
}
.main_article_pic {
  -ms-grid-row: 1;
  -ms-grid-row-span: 3;
	grid-column: 1 / span 2; 
	grid-row: auto / span 3; 
	margin-bottom: 0; min-height: 300px; }
.main_article_txt {
  -ms-grid-row: 4;
	grid-column: 1 / span 2;
	margin-bottom: 0; margin-top: -10px;padding-top: 1.5em; padding-bottom: 1.5em;}

.mgzn_topmenu li { display: inline-block; padding: 0 1.5em; font-size: 14px; line-height: 2.2; text-transform: uppercase; letter-spacing: 1px;text-align: center; margin: 0; }
.mgzn_topmenu a {position: relative;outline: none; padding: 0 0 5px; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none;cursor: pointer;}
#mgzn_logo { width: 290px; height: 30px; margin-top: 16px;}
#pi_logo { width: 196px; height: 30px; margin-top: 16px;}
.mgzn_lnx { position: absolute; right: 20px; top: 0; background: #e1e6ea; padding: 0 10px 5px; border-radius: 0 0 5px 5px; }
.mgzn_lnx a { font-size: 15px; }
._sidebar {width: 25%; position: absolute; top: 0; right: 0; min-width: 250px}
.sidebar_wrap {min-height: 900px;}
.sidebar_wrap.tall {min-height: 1200px}
.sidebar_wrap.mini {min-height: 555px}
.side_banner {padding:1em 1.5em 200px;line-height: 1.4;overflow: hidden;position: relative;}
.side_banner img {position: absolute;left: 50%; bottom: 0; transform: translate(-50%,0);width:240px;}
.side_banner.sticky {position: fixed;right:1em;top: 70px; width: 21%; max-width: 300px; box-shadow: 0 0 20px rgba(0,0,0,.1); z-index: 4000;
-webkit-transition: .6s ease;
        transition: .6s ease;}

.article_teaser_wrap {margin-left: 6%}
.article_thumb_wrap {width: 33.33%; float: left;}
.no_top_border { border-top: none; margin: 0; border-color: #b7c5cf}

article img { max-width: 100%;display: block;background: #eff2f5; }

.article_bg {background:no-repeat center;background-size: cover;}
.top_article_wrap article:last-child .article_bg {margin-right: 0}
.top_article_wrap h3 {height: 3.6em;}

.article_img { background: #eff2f5 no-repeat center; min-height: 15.5em; background-size: cover;}

.article_data_wrap {position: absolute;left: 0; bottom: 30px;width: 100%; padding: 0 2em;box-sizing: border-box;pointer-events: none;cursor: pointer;}

.tabs_switch {margin-bottom: 2em; }
.tabs_switch a { margin: 0 1em; display: inline-block;}
.tabs_switch a.active { color:#35c190; text-decoration: underline;}
.tab_wrap a {margin-right: 2em;white-space:nowrap; color: #5a6677;font-size: 16px}
.tab_wrap_narrow a {display: block; white-space:nowrap; color: #5a6677;}
.tab_wrap a:hover, .tab_wrap_narrow a:hover {color: #35c190;}
.tab_wrap_narrow a svg, .tab_wrap a svg {margin-right: 1em}
.tab_wrap a:last-child {margin-right: 0}

.authors_listing .author_pic { margin: auto; }
.authors_listing .card p {text-align: left;}
.mini_article .card:after {display: none;}


.author_card { background: no-repeat top left; background-size: cover; height: 260px; display: inline-block; vertical-align: top;overflow: hidden; }
.author_card p {text-align: left;color: #fff; position: absolute;left: 0; bottom:0; padding: 0 1em; pointer-events: none; line-height: 1.4}
.author_card p, .author_card .iced {-webkit-transition: opacity .3s;transition: opacity .3s}
.author_card:hover p, .author_card:hover .iced {opacity: 0}

.fb_iframe_widget, .fb_iframe_widget span,.fb_iframe_widget iframe {max-width: 100% !important}



/* ###################################################### */
/* TYPOGRAPHY FIX */
/* ###################################################### */

.list_view .card {font-size: .9em;overflow: hidden;margin-bottom:2em}
.list_view .card h3, .article_bg h3 {font-size: 22px;line-height: 1.2;}
.featured h3 {font-size: 16px;line-height: 1.2;font-weight: 700;}
.featured .thumb {height: 100%; width: 155px; position: absolute; left: 0; top: 0; background: no-repeat center; background-size: cover;}
.main_article_txt .tags {position: absolute; top: -24px; background: #fff; padding: 10px 1em; border-radius: 2px;}
.main_article_txt h3 {font-size: 1.6em}
.main_article_txt .author {margin-bottom: 0}
.main_article_txt .author .photo {width: 70px}
.main_article_txt .author .small {margin-top:2em; display: inline-block;}
.main_article_txt h4, .main_article_txt .multiline, .main_article_txt .social_mini { display: none;}

.mini_article .card_photo {min-height: 0}
.mini_article .card {height: 390px}
.mini_article h3, 
h3 a {
		color:#4c5567; -webkit-transition: color .3s; transition: color .3s
	}
.mini_article:hover h3, 
h3 a:hover {
		color: #35c190
	}
.product-insights .mini_article:hover h3, 
.product-insights h3 a:hover {
		color: #ff801e
	}
.excerpt {line-height: 1.5;}
.multiline h2 {font-size: 2.2em; margin: 1.5em 0 0.6em; text-align: left; line-height: 1.2em; font-weight: 400;}
.mgzn .multiline h2 { line-height: 1.1; font-family: Lato, sans-serif; font-weight: 900;font-size: 2em; margin: 0 0 .5em;color: #4d5568;margin-top: 1.6em; }
.multiline h3 {font-size: 1.4em; margin: 1.5em 0 0.5em;}
.multiline h4 {font-size: 1em; font-weight: 300; text-transform: uppercase;}
b {font-weight: 600;}

.tags, .tags a {font-size: 14px; color: #b7c5cf; line-height: 1.2;}
.tags a {white-space: nowrap;}
.tags a:hover { text-decoration: underline; }
.tags > span { display: inline-block;}
.pic .tags a { color: #fff }
.article_bg .tags {opacity: .8}
.article_bg .tags_social {margin-top: 3em}
.list_view .card .tags_social { opacity: 0; position: absolute;left:2rem;bottom:0; z-index: 1;
	-webkit-transition: .3s ease;
      		transition: .3s ease; 
      -webkit-transform: translateY(5px);
      				-ms-transform: translateY(5px);
          transform: translateY(5px);}
.list_view .card:hover .tags_social { opacity: 1;
      -webkit-transform: translateY(0px);
      				-ms-transform: translateY(0px);
          transform: translateY(0px);}

.category_tag { position: absolute; top: 0; left: 3em; max-width: 200px; display: inline-block; background: rgba(0,0,0,.3); padding: 1em; color: #fff; text-transform: uppercase;z-index: 3; font-size: 11px}
.category_tag a { color: #fff}


.author_page_wrap {text-align: center;}
.author_page_wrap .photo {border-radius: 50%; margin-bottom: 1em; width: 160px; border: 6px solid #eff2f5;margin: auto;}
.author_page_wrap .social_mini li {float:none; display: inline-block; margin: 0 5px;}

.auth_name {margin: .5em 3em 1em 1em;}
.teamMember.box h3 {font-size: 1.4em;}
.social_buttons {overflow: hidden;margin: 1.5em 0;}
.teamMember .tiny {font-size:13px; font-family:'open sans'; position:relative; top:-.5em; color: #8FA0AC;}

.fb-share-button span {vertical-align: top !important; } /* fix share button aligning */
.multiline ul {padding-left:30px; list-style:disc; margin:1em 0; overflow: hidden;}
.deco.check_list {list-style: none; background: #eff2f5; padding: 2em 3em;}
.size-full {max-width: 100%; height: auto;}

.pagination {margin: 0}
.pagination a {display: inline-block;background: #fff; width: 2em; border-radius: 2px; font-size: 16px; height: 2em; line-height: 2em;
/*box-shadow: 0px 2px 15px rgba(0,0,0,.1);*/
}
.pagination a.current {background: #35c190;color: #fff}
.product-insights .pagination a.current {background: #ff801e;}
.product-insights .pagination a:hover {color: #ff801e;}
.tweet_me {padding-left: 3%; border-left: 2px solid; margin: 2em 0 2em 10%; color: #1da1f2; font-size: .9em; width: 75%;position: relative; }
.tweet_me:before {content: ''; display: block; position: absolute; left: -8%; top: 50%; width: 40px; height: 40px; background: url(../imgs/ico_tw_orig.svg) no-repeat center; background-size: contain; margin-top: -20px;}




/* ###################################################### */
/* ICONS */
/* ###################################################### */

.ico_author, 
.ico_cat, 
.ico_social {white-space:nowrap;}
/*.ico_author:before, 
.ico_cat:before, 
.ico_social:before {content: ''; display: inline-block; width: 30px; height: 24px; background: url(../imgs/magazine/sidebar_sprite2015.png) no-repeat; background-size: 20px;vertical-align: middle;}
.ico_author:before {background-position: center -46px;}
	 .ico_cat:before {background-position: center -74px;}
.ico_social:before {background-position: center -104px;}*/
.ico_social:before {content: '|'; display: inline-block; width: 16px;padding-left: 10px;}
.ico_social:first-child:before {display: none;}

.ico_time {margin-top: -2px;}
.ico_time svg {margin-right:5px; position: relative;top: 2px}

.ico_shares svg {margin-right:5px; position: relative;top: 3px}


.social_mini { overflow: hidden; margin-bottom: 40px; margin-top: 20px; list-style: none;}
.social_mini li {float: left; margin-right: 10px;}
.social_mini a { display: block; width: 20px; height: 20px; background: #256A99 url(../imgs/magazine/sprite_author_social17.png) no-repeat center top; background-size: 20px;}
.social_mini .author_tw {background-position: center -25px}
.social_mini .author_gg {background-position: center -50px}
.social_mini .author_li {background-position: center -75px}
.social_mini .author_xi {background-position: center -100px}
.social_mini .author_pin {background-position: center -125px}
.social_mini .author_home {background-position: center -150px}
.social_mini .author_blog {background-position: center -175px}




/* ###################################################### */
/* SIDEBAR */
/* ###################################################### */

._sidebar .list {margin-bottom: 20px; }
._sidebar .list li {width: auto; height: auto; padding: 4px 6px 4px 10px; border-radius: 0; margin: 0; line-height: 1.6; display: block; }
._sidebar .list li:hover {background-color: #eff2f5; }
._widgets li {margin-bottom: 1em}

._sidebar .small {color: #93A4B1;font-size:0.9em; line-height: 1.4; font-weight: 300}
._sidebar .button {padding-left:5%; padding-right:5%; width:90%; margin-top: .5em;font-size: .8em;}
._sidebar .button.neutral_bt {margin-top: 2em}
.fb-facepile {background: #d8e0e6; width: 90%; min-height: 150px; padding: 1em 5%;}

.author .photo {border-radius: 50%; float: left; margin-right: 1em; width: 95px;}
.author .multiline {font-size: 0.9em; line-height:1.5em}
.round_pic { height: 110px; width: 110px; background: no-repeat center; background-size: cover; border-radius: 50%;margin:.5em 1.5em 1em 0;float: left;}

.wp_banner {background: #eff2f5 no-repeat -30px center; background-size:250px; padding:1.5em 2em .5em 30%;line-height: 1.4; font-size: .9em}
.wp_banner .button {margin-top: .8em}
.wp_banner strong {font-size: 1.2em}
.wp_banner.center {padding:.5em 2em;}


/* ###################################################### */
/* SEARCH */
/* ###################################################### */

.searchform {display: inline-block;position: relative;height: 28px;margin: 1em;}
.searchform input[type="text"] {background: none; border: 0px solid; color: #fff !important; width: 0; outline: none; display: inline-block; height: 28px;padding: 0 20px 3px 0;position: relative; top: 0; right: 0; z-index: 3;
  -webkit-transition: width .4s cubic-bezier(0.000, 0.795, 0.000, 1.000);
          transition: width .4s cubic-bezier(0.000, 0.795, 0.000, 1.000);
  cursor: pointer; }
.searchform input[type="text"]::-webkit-input-placeholder { color:#fff;}
.searchform input[type="text"]::-moz-placeholder { color:#fff;} /* firefox 19+ */
.searchform input[type="text"]:-ms-input-placeholder { color:#fff;} /* ie */
.searchform input[type="text"]:-moz-placeholder { color:#fff;}

.searchform input[type="text"]:focus:hover {border-bottom-width: 2px; }
.searchform input[type="text"]:focus {width: 200px; z-index: 1; border-bottom-width: 2px; cursor: text; }
.searchsubmit {top:6px; right: 0; opacity: 1;background-size: 15px;}




/* ###################################################### */
/* MEDIA QUERIES */
/* ###################################################### */

@media only screen and (max-width: 480px) {
	#mgzn_logo { width: 200px;height: 20px;margin-top: 21px;}
	.article_bg {height: 200px;}
	.mgzn_topmenu li { display: block;}
	.article_bg {margin-right:0;}
	.mini_article .card {height: auto}
	.wp_banner {padding-left:2em; background-image: none !important}
	.author_card_wrap { 
		-ms-grid-columns: 1fr 1fr;
		grid-template-columns: repeat(2, 1fr);
	}
	.excerpt {display: none;}
}
@media only screen and (min-width: 481px) and (max-width: 767px) {
	.article_bg {height: 300px;}
	.mini_article .card  {padding:250px 1em 1em;height: 380px}
}

@media only screen and (max-width: 767px) {
	.list_view {
		-ms-grid-columns: 1fr;
		grid-template-columns: 1fr;
	}
	.mgzn_lnx {padding-bottom: 2px}
	.sidebar_wrap {min-height: 300px !important}
	.ico_author:before { display: none; } 
	.ico_cat:before, 
	.ico_social:before { width: 5px; background: none; }
	.tabs_switch a {  margin-left: 2px; }
	a.bt_share {margin-right: 1em;}
	a.bt_share:last-child {margin-right: 0;}
	.article_teaser_wrap {margin-left: 0%}
	.article_teaser_wrap .tags_social {display: none;}
	.article_thumb_wrap {width: 100%; float: none;}
}

@media only screen and (min-width: 768px) {
	.no_top_border { min-height: 6.1em;padding: 5% 7%;}
	.tags:first-child { margin:0 0 .6em 0}
	.half .article_bg_main h3 {max-width:500px}
}

@media only screen and (min-width: 768px) and (max-width: 1045px) {
	.article_bg {height: 400px;}
}

@media only screen and (min-width: 481px) and (max-width: 1045px) {
	.author_card_wrap { 
		-ms-grid-columns: 1fr 1fr 1fr;
		grid-template-columns: repeat(3, 1fr);
	}
}

@media only screen and (max-width: 1045px) {
	.two_thirds.ipad_fix {width: 100%}
	.article_bg_main {margin-right: 0;}
	.author_card {height: 240px}
	._sidebar, .tags_social {display: none;}
	.container {
		-ms-grid-columns: 1fr; 
		-ms-grid-rows: auto;
		grid-template-columns: 1fr; 
		grid-template-rows: auto;
	}

	.searchform {margin-left: 0}
	.searchform input[type="text"] {color: #fff !important}
	.searchform input[type="text"]::-webkit-input-placeholder { color:#fff;}
	.searchform input[type="text"]::-moz-placeholder { color:#fff;} /* firefox 19+ */
	.searchform input[type="text"]:-ms-input-placeholder { color:#fff;} /* ie */
	.searchform input[type="text"]:-moz-placeholder { color:#fff;}
	.searchsubmit {background-image: url(../imgs/lupe_w.svg);}
}

@media only screen and (min-width: 1046px) {
	/* link underline effect */
	.mgzn_topmenu a::after {position: absolute; top: 100%; left: 0; width: 100%; height: 1px; background: #35c190; content: ''; opacity: 0;
		-webkit-transition: height 0.3s, opacity 0.3s, -webkit-transform 0.3s;
						transition: height 0.3s, opacity 0.3s, transform 0.3s;
		 -webkit-transform: translateY(-5px);
						 -ms-transform: translateY(-5px);
		     transform: translateY(-5px);
	}
	.mgzn_topmenu a:hover::after,
	.mgzn_topmenu a:focus::after,
	.mgzn_topmenu a.current::after {height: 3px; opacity: 1; 
		-webkit-transform: translateY(0px);
						-ms-transform: translateY(0px);
		    transform: translateY(0px); }

.list_view {
	-ms-grid-columns: 1fr 1fr 1fr;
	grid-template-columns: repeat(3, 1fr);
}
.two_thirds {width: 72%;}
}


@media only screen and (max-width: 1799px) {
	.article_bg .iced {height: 100%}
	.article_data_wrap {padding-right: 1em}
}
