﻿/* Styles for What's new page */

div.dt-banner
{
	background-color: #FFFFFF;
	display: none;
}

.MCDropDownBody
{
	margin-left: 24px;
}

div.MCDropDownBody > p
{
	margin-top: 15px;
}

/* Styles for FAQ content on home page */

h2.faq
{
    margin-bottom: 15px;
    font-weight: 600;
    letter-spacing: .128px;
    font-size: 1.5em;
    margin-top: 60px;
	padding-left: 10px;
}

.micro-content-proxy._Skins_claris_faq.mc-component .micro-content-collapsed .micro-content-drop-down-button
{
	background-size: 18px 20px;
	transform: translateY(-2px);
}

.micro-content-proxy._Skins_claris_faq.mc-component .micro-content-expanded .micro-content-drop-down-button
{
	background-size: 14px 18px;
	transform: translateY(-2px);
}

div.faq-section	/*This is a custom responsive layout row style (div class) in your stylesheet. To provide your own description for this style: (1) Open the stylesheet; (2) Find and select the div class with this name; and (3) In the Comment field, replace this text with your own. For more information on adding comments to styles, see the online Help.*/
{
	mc-grid-row: true;
	margin-left: auto;
	margin-right: auto;
	padding-bottom: 2em;
}

div.faq-section::before
{
	content: ' ';
	display: table;
}

div.faq-section::after
{
	content: ' ';
	display: table;
	clear: both;
}

div.faq-section > div
{
	float: left;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	text-align: center;
	padding-left: 40px;
	padding-right: 40px;
}

div.faq-section > div:nth-child(1)
{
	width: 66.667%;
	margin-left: 16.667%;
}

div.faq-section > div:nth-child(2)
{
	width: 50%;
	margin-left: 0%;
}

.micro-content
{
	line-height: 1.5em;
}

.micro-content a:link
{
	color: #36c;
}

.micro-content a:visited
{
	color: #99c;
}

div.micro-content-proxy > div.micro-content
{
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	padding: 40px;
	text-align: left;
}

div.micro-content-proxy > div.micro-content-collapsed:hover
{
	box-shadow: 0px 5px 20px 0px rgba(0, 0, 0, 0.15);
	background-color: #FFF;
}

div.micro-content-proxy:last-child
{
	padding-bottom: 0px;
}

div.micro-response > p
{
	line-height: 1.5em;
}

.micro-content-proxy._Skins_claris_faq.mc-component .micro-content-collapsed .micro-content-drop-down-button
{
	background-size: 18px 20px;
	transform: translateY(-2px);
	float: right;
}

ul.menu._Skins_cat_topic_menu.mc-component ul > li > a
{
	padding-left: 20px;
}

.micro-content-proxy._Skins_claris_faq.mc-component .micro-content-expanded .micro-content-drop-down-button
{
	background-size: 14px 18px;
	transform: translateY(-2px);
	float: right;
}

img.micro-response-img
{
	border: none;
	height: 343px;
	padding: 10px 0px;
}

/* Styles from Overview/Project Management Tutorial branch */
ul._Skins_landing_page_menu > ul.sub-menu > li
{
	transition: all 0.3s cubic-bezier(.25,.8,.25,1);
	padding: 10px;
}

	
div.overview-container
{
	display: flex;
	flex-wrap: nowrap;
	margin-bottom: 1rem;
}

div.overview-main-section
{
	width: 80%;
}

div.sidebar
{
	float: right;
	width: 40%;
	height: min-content;
	margin-top: 20px;
	margin-bottom: 1rem;
	margin-left: 1em;
	font-size: .9rem;
	border: solid 1px #808080;
	padding: .5em .5em 0em .5em;
	background-color: #f0f0f0;
}

p.sidebar-caption
{
	color: #626262;
	font-weight: bold;
}

div.side-menu
{
	float: right;
	width: 30%;
	margin-left: 1em;
}

@media only screen and (max-width: 1024px)
{
	div.faq-section > div:nth-child(1)
	{
		width: 50%;
		margin-left: 25%;
	}

	div.faq-section > div:nth-child(2)
	{
		width: 50%;
		margin-left: 0%;
	}
	
	div.overview-container
	{
		display: flex;
		flex-wrap: wrap;
	}
	
	div.sidebar
	{
		width: 100%;
		font-size: .9rem;
		margin-left: 0;
		border: solid 1px #808080;
		padding: .5em .5em 0em .5em;
		background-color: #f0f0f0;
	}
}

@media only screen and (max-width: 700px)
{
	div.faq-section > div
	{
		text-align: center;
	}

	div.faq-section > div:hover
	{
		-webkit-transform: none;
		-moz-transform: none;
		-ms-transform: none;
		-o-transform: none;
		transform: none;
		box-shadow: none;
		background-color: none;
	}

	div.faq-section > div:nth-child(1)
	{
		margin-top: 5%;
		width: 100%;
		margin-left: 0%;
		margin-bottom: 5%;
	}

	div.faq-section > div:nth-child(2)
	{
		margin-bottom: 5%;
		margin-left: 0%;
		width: 100%;
	}
}