/*<meta />*/

@namespace MadCap url(http://www.madcapsoftware.com/Schemas/MadCap.xsd);

/*===========================================================================================================================================================
Color palette:
#005AAA
#54C9EF
#FFFFFF
#12122D
#4CB748
#EE2624
#53469C
#F1EFED
#F8ED41
#F37C28
#CCCCCC
#808080
===========================================================================================================================================================*/

:root
{
	--white: #f5f5f5;
	--blue: #005aaa;
	--light_blue: #54c9ef;
	--hover_blue: #F5F7F9;
	--black: #12122D;
	--purple: #53469c;
	--hover_grey: #808080;
	--tile-background: #c0e7f8;
	--tile-background-hover: #c0e7f8;
	--radius: 10px;
	--shadow: 7px 25px 23px 0 rgba(0,0,0,.15);
}

@font-face 
{
	font-family: 'Lato Black';
	src: url('../Fonts/Lato-Black.ttf');
}

@font-face 
{
	font-family: 'Lato';
	src: url('../Fonts/Lato-Regular.ttf');
}

body
{
	font-family: "Open Sans", "Lato", Arial;
}

h1
{
	font-weight: bold;
	font-size: 24pt;
	color: #005aaa;
}

h1.landing-page
{
	color: #12122D;
	font-family: 'Lato Black';
	font-size: 3rem;
	line-height: normal;
	padding-bottom: 10px;
	margin: 3rem 0 1rem 0;
}

h2
{
	font-weight: bold;
	font-size: 18pt;
}

h2.landing-page
{
	color: #12122D;
	font-family: 'Lato Black';
	font-size: 2rem;
	line-height: normal;
	font-weight: 700;
	margin: 2rem 0 1rem 0;
}

h3
{
	font-weight: bold;
	font-size: 16pt;
}

h4
{
	font-weight: bold;
	font-size: 14pt;
}

h5
{
	font-weight: bold;
	font-size: 12pt;
}

h6
{
	font-weight: bold;
	font-size: 10pt;
}

p
{
	font-size: 11pt;
	margin-top: 0pt;
	margin-bottom: 0pt;
}

a:hover
{
	text-decoration: none;
}

ul.product_homepage > li > a:hover
{
	text-decoration: underline;
}

.supporting-text > a:hover
{
	color: var(--black);
}

ol,
ul
{
	margin-top: 0px;
	margin-bottom: 0px;
}

img
{
	border: none;
	max-width: 100%;
}

MadCap|expandingHead
{
	font-style: italic;
	font-weight: normal;
	cursor: hand;
	text-decoration: none;
	color: #4cb748;
}

MadCap|expandingBody
{
	color: #cccccc;
	font-style: italic;
}

MadCap|dropDownHotspot
{
	cursor: hand;
	text-decoration: none;
}

.body-container
{
	padding-top: 2em;
	padding-left: 3em;
	padding-right: 3em;
}

div.survey
{
	margin-top: 2.5em;
	padding: 1em 2em;
	float: left;
	background: var(--blue);
	border-radius: 72px;
	color: #fff;
	font-weight: 600;
	text-transform: capitalize;
}

div.survey > a
{
	text-decoration: none;
	color: white;
}

div.survey:hover
{
	background: #005aaa;
}

.search-bar .search-submit
{
	border: none;
}

.search-bar .search-filter
{
	background-image: url('../Icons/filter.svg');
	margin-right: 20px;
}

.search-bar.search-bar-container .search-submit
{
	background-image: url('../Icons/search.svg');
	background-color: var(--purple);
	border-radius: 32px;
	width: 55px;
	height: 55px;
	margin: 5px 20px 0px 0px;
}

.search-bar.search-bar-container .search-submit:hover
{
	background-image: url('../Icons/search.svg');
	background-color: var(--purple);
	border-radius: 32px;
	width: 55px;
	height: 55px;
	margin: 5px 20px 0px 0px;
}

.search,
.search-bar
{
	font-size: 16px;
}

/*== Other topics header bar styles ==*/

.title-bar-container
{
	box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
	/*adds the shadow effect to the header*/
}

/* Styling the navbar expander icon */

.is-accordion-submenu-parent > a span.submenu-toggle	/* Removes the default arrow/triangle */
{
	border: none;
}

.is-accordion-submenu-parent > a span.submenu-toggle::after	/* Adds an icon */
{
	content: "\25b6";
	color: #005aaa;
	font-size: smaller;
}

.is-accordion-submenu-parent > a span.submenu-toggle-container
{
	height: 60%;
	left: -35px;
}

.submenu-toggle-container[aria-expanded="true"] > span.submenu-toggle,
.is-accordion-submenu-parent > a[aria-expanded="true"] > .submenu-toggle-container > span.submenu-toggle
{
	-webkit-transform-origin: 50% 50%;
	-ms-transform-origin: 50% 50%;
	transform-origin: 50% 50%;
	-webkit-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	transform: rotate(90deg);
	left: 35px;
}

.smaller_font
{
	font-size: 12pt;
	line-height: 1em;
}

/* Styling the back-top-top button */

#myBtn
{
	display: none;
	position: fixed;
	bottom: 10px;
	right: 10px;
	z-index: 99;
	font-size: 45px;
	border: none;
	color: transparent;
	cursor: pointer;
	background-color: transparent;
	background-image: url(../Icons/back-to-top5.png);
	background-position: center;
	background-repeat: no-repeat;
	background-size: 40px 40px;
}

#myBtn:hover
{
	background-image: url(../Icons/back-to-top2.png);
}

/*== madcap proxy assigned styles ==*/

MadCap|breadcrumbsProxy
{
	border-bottom-width: 0;
	color: #808080;
}

p.TOC1
{
	font-size: 8pt;
}

p.TOC2
{
	font-size: 8pt;
}

p.TOC3
{
	font-size: 8pt;
}

p.TOC4
{
	font-size: 8pt;
}

p.TOC5
{
	font-size: 8pt;
}

p.TOC6
{
	font-size: 8pt;
}

p.TOC7
{
	font-size: 8pt;
}

p.TOC8
{
	font-size: 8pt;
}

p.TOC9
{
	font-size: 8pt;
}

p.MiniTOC1,
p.MiniTOC2,
p.MiniTOC3,
p.MiniTOC4,
p.MiniTOC5,
p.MiniTOC6,
p.MiniTOC7,
p.MiniTOC8,
p.MiniTOC9
{
	font-size: 11pt;
}

span.SearchHighlight
{
	background-color: #ffff00;
}

span.SearchHighlight1
{
	background-color: #ffff00;
}

span.SearchHighlight10
{
	background-color: #ffff00;
}

span.SearchHighlight9
{
	background-color: #ffff00;
}

span.SearchHighlight2
{
	background-color: #ffff00;
}

span.SearchHighlight3
{
	background-color: #ffff00;
}

span.SearchHighlight4
{
	background-color: #ffff00;
}

span.SearchHighlight5
{
	background-color: #ffff00;
}

span.SearchHighlight6
{
	background-color: #ffff00;
}

span.SearchHighlight7
{
	background-color: #ffff00;
}

span.SearchHighlight8
{
	background-color: #ffff00;
}

MadCap|xref
{
	text-decoration: none;
	color: #005aaa;
}

a
{
	color: #005AAA;
	text-decoration: none;
}

MadCap|expanding
{
	mc-closed-image: none;
	mc-open-image: none;
}

MadCap|dropDown
{
	mc-closed-image: none;
	mc-closed-image-alt-text: none;
	mc-open-image-alt-text: none;
	mc-open-image: none;
}

MadCap|dropDownHead
{
	
}

span.title-bar-container
{
	
}

MadCap|toggler.section_heading_toggler
{
	font-size: 18pt;
	color: #005aaa;
	font-weight: bold;
	mc-open-image: none;
	mc-closed-image: none;
}

table
{
	padding-top: 15px;
	padding-bottom: 15px;
}

td.section_heading
{
	text-align: center;
	vertical-align: middle;
	mc-hyphenate: never;
	color: #12122d;
	font-weight: bold;
	font-size: 36pt;
	background-color: #f1efed;
	padding-top: 15px;
	padding-bottom: 15px;
	border-radius: 10px;
}

.subheading
{
	width: 119px;
}

td.section_heading > span > img
{
	border: none;
	float: center;
	vertical-align: middle;
	height: 120px;
	width: auto;
}

td.section_subheading_item
{
	color: #12122d;
	padding-left: 10px;
	font-size: 16pt;
}

td.section_subheading_icon
{
	mc-hyphenate: never;
	vertical-align: middle;
	background-repeat: no-repeat;
	background-position-x: center;
	background-position-y: center;
	color: #12122d;
	background-color: #f1efed;
	border-radius: 10px;
	padding-top: 10px;
	padding-bottom: 10px;
}

img.section_subheading_icon
{
	border: none;
	float: center;
	vertical-align: middle;
	height: 50px;
	width: auto;
}

td.section_subheading
{
	padding-left: 10px;
	color: #12122D;
	font-size: 18pt;
	font-weight: bold;
}

p.section_subheading_item
{
	font-size: 16pt;
}

a.section_subheading
{
	color: #005AAA;
	font-size: 16pt;
}

MadCap|dropDownHead.input_file_widget
{
	background: #ebeff2;
	border: 2px solid #ebeff2;
	border-radius: 4px;
	padding: 10px 5px;
}

MadCap|dropDownHead.input_file_widget:hover
{
	transform: scale(1.01);
}

MadCap|dropDownHotspot.input_file_widget
{
	cursor: hand;
	color: #203448;
	text-decoration: none;
	padding: 6px 6px 0px 0px;
	font-size: 12pt;
	font-weight: normal;
}

MadCap|dropDown.input_file_widget
{
	mc-open-image: url('../Images/minus.png');
	mc-closed-image: url('../Images/plus.png');
	margin-bottom: 2em;
	width: 95%;
	margin-right: auto;
	margin-top: auto;
}

MadCap|dropDown.tasks
{
	mc-open-image: url('../Images/minus.png');
	mc-closed-image: url('../Images/plus.png');
}

MadCap|dropDownHotspot.tasks
{
	cursor: hand;
	text-decoration: none;
	padding: 6px 6px 0px 0px;
	font-size: 12pt;
	font-weight: normal;
}

MadCap|xref.tasks
{
	text-decoration: none;
	font-size: 12pt;
	font-weight: normal;
}

p.tasks
{
	margin-top: 10px;
	margin-bottom: 5px;
}

MadCap|dropDown.panel_help
{
	mc-open-image: url('../Images/minus.png');
	mc-closed-image: url('../Images/plus.png');
	margin-bottom: 2em;
	width: 90%;
	margin-right: auto;
	margin-top: auto;
	font-size: 11pt;
}

MadCap|dropDown.panel_help > MadCap|dropDownHead > MadCap|dropDownHotspot
{
	cursor: hand;
	text-decoration: none;
	padding: 6px 6px 0px 0px;
	font-size: 11pt;
	font-weight: 500;
	color: #005aaa;
}

MadCap|dropDownHotspot.panel_help
{
	cursor: hand;
	text-decoration: none;
	padding: 6px 6px 0px 0px;
	font-size: 11pt;
	font-weight: 500;
	color: #005aaa;
}

MadCap|dropDown.panel_help > MadCap|dropDownHead
{
	background: #ebeff2;
	border: 2px solid #ebeff2;
	border-radius: 4px;
	padding: 10px 5px;
}

MadCap|dropDownHead.panel_help
{
	background: #ebeff2;
	border: 2px solid #ebeff2;
	border-radius: 4px;
	padding: 10px 5px;
}

pre.gray_box
{
	border-radius: 4px;
	background: #f5f5f5;
	padding: 1em 0em;
}

div.input_file_widget
{
	background: #203448;
	color: #eeeeee;
	margin: 1em;
	height: 30px;
	line-height: 30px;
	border-radius: 10px;
	text-align: center;
	float: left;
	font-weight: 400;
	width: auto;
	padding-left: 1em;
	padding-right: 1em;
	font-size: 11pt;
}

div.input_file_widget:hover
{
	transform: scale(1.05);
}

MadCap|toggler.input_file_widget
{
	mc-closed-image: none;
	mc-image-position: none;
	mc-open-image: none;
}

div.input_file_widget_header
{
	background: #ebeff2;
	border: 2px solid #0050a0;
	border-radius: 4px;
	padding: 10px 5px;
	cursor: hand;
	color: #203448;
	text-decoration: none;
	font-size: 11pt;
	font-weight: normal;
}

div.input_file_widget_header::before
{
	content: url('../Images/plus.png');
	padding-right: 3pt;
}

div.input_file_widget_header:hover
{
	background: #0050a0;
	color: #ffffff;
}

.title-bar-layout a.logo
{
	background: transparent url(../logos/schrodinger-logo-horizontal-white-top.svg) no-repeat center center;
}

p.input_file_widget
{
	margin-top: 1em;
	margin-bottom: 0pt;
	font-size: 11pt;
	color: #005aaa;
}

p.input_file_widget_comment
{
	margin-top: 1em;
	margin-bottom: 0pt;
	font-size: 11pt;
	color: #203448;
}

dt.bold
{
	font-weight: 600;
}

div.NewRowClass1	/*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;
}

div.NewRowClass1::before
{
	content: ' ';
	display: table;
}

div.NewRowClass1::after
{
	content: ' ';
	display: table;
	clear: both;
}

div.NewRowClass1 > div
{
	float: left;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

div.NewRowClass1 > div:nth-child(1)
{
	width: 66.66667%;
	margin-left: 0%;
}

div.NewRowClass1 > div:nth-child(2)
{
	width: 33.33333%;
	margin-left: 0%;
}

div.two-thirds-one-third	/*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;
}

div.two-thirds-one-third::before
{
	content: ' ';
	display: table;
}

div.two-thirds-one-third::after
{
	content: ' ';
	display: table;
	clear: both;
}

div.two-thirds-one-third > div
{
	float: left;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

div.two-thirds-one-third > div:nth-child(1)
{
	width: 66.66667%;
	margin-left: 0%;
}

div.two-thirds-one-third > div:nth-child(2)
{
	width: 33.33333%;
	margin-left: 0%;
}

h2.product_homepage
{
	font-weight: bold;
	font-size: 18pt;
	padding-bottom: 0.25rem;
	border-bottom: solid 2px #7b7b7d;
	color: #7b7b7d;
}

ul.product_homepage
{
	margin: 1rem 2rem;
	padding: 0px;
	position: relative;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(400px,1fr));
	grid-gap: 10px;
}

div.product_homepage_container	/*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;
}

div.product_homepage_container:before
{
	content: ' ';
	display: table;
}

div.product_homepage_container::after
{
	content: ' ';
	display: table;
	clear: both;
}

div.product_homepage_container > div
{
	float: left;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

div.product_homepage_container > div:nth-child(1)
{
	width: 60%;
}

div.product_homepage_container > div:nth-child(2)
{
	width: 40%;
}

div.product_homepage
{
	margin: 4.5em auto;
	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: 40px;
	row-gap: 40px;
}

div.product_homepage > a > div
{
	padding: 30px 40px;
	background: var(--blue);
	border-radius: 24px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	max-width: 350px;
	box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25), 0 4px 4px 0 rgba(0, 0, 0, 0.25);
}

div.product_homepage > a > div > div
{
	font-size: 14pt;
	font-weight: 600;
	color: #FFF;
	margin: 0;
	margin-right: 5px;
}

div.side-link
{
	display: flex;
	padding: 10px 10px 10px 32px;
	align-items: center;
	gap: 24px;
	flex-shrink: 0;
	border-radius: 72px;
	border: 1px solid var(--black);
	margin: 0 auto 3em auto;
	width: 260px;
}

div.side-link:hover
{
	transform: scale(1.05);
}

div.side-link > div
{
	font-size: 12pt;
	font-weight: 600;
	color: var(--black);
	text-decoration: none;
}

div.side-link > div:hover
{
	text-decoration: none;
}

div.quick-link
{
	display: flex;
	flex-wrap: wrap;
	gap: 40px;
	min-width: 667px;
	max-width: 1288px;
	margin: 2em 0;
}

div.quick-link > div
{
	min-width: 250px;
	max-width: 350px;
	border-radius: 24px;
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	box-sizing: border-box;
	gap: 24px;
}

.quick-link-image
{
	align-self: stretch;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-start;
	gap: 40px;
	font-family: Lato;
}

.quick-link-image > a > img
{
	border: 1px solid #000;
	border-radius: 24px;
}

.supporting-text
{
	align-self: stretch;
	position: relative;
	line-height: 120%;
	font-family: Lato;
}

.supporting-text > a
{
	font-size: 14pt;
	font-weight: 600;
	color: var(--black);
	margin: 0;
	margin-right: 5px;
}

.arrowhead
{
	content: url("../Icons/arrow.svg");
	border-radius: 32px;
	border: 1px solid #fff;
	padding: 14px;
}

.cite-quote
{
	content: url("../Icons/cite.svg");
	width: 35px;
	flex-shrink: 0;
}

.arrowhead-black
{
	content: url("../Icons/arrow-black.svg");
	border-radius: 32px;
	border: 1px solid var(--black);
	padding: 12px;
	margin-left: 24px;
}

div.product_homepage > a > div:hover
{
	transform: scale(1.02);
	text-decoration: none;
}

div.individual_product_homepage
{
	padding: 20px 30px;
	margin: 1em;
	border: 2pt solid #f1efed;
}

div.individual_product_homepage > a > p
{
	font-size: 14pt;
	font-weight: bold;
	text-align: center;
	color: #005aaa;
	margin: 0;
}

div.individual_product_homepage:hover
{
	box-shadow: 0 12px 18px rgba(0, 0, 0, 0.16), 0 12px 18px rgba(0, 0, 0, 0.23);
	transform: scale(1.05);
	outline-color: #f1efed;
	outline-width: 6px;
}

._Skins_SearchResults.mc-component #resultList h3.title
{
	font-style: normal;
}

/* some styles for the side menu proxy */

div.sidemenu-topics	/*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;
	margin-top: 3.1rem;
	margin-bottom: 3.1rem;
}

div.sidemenu-topics::before
{
	content: ' ';
	display: table;
}

div.sidemenu-topics::after
{
	content: ' ';
	display: table;
	clear: both;
}

div.sidemenu-topics > div
{
	float: left;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

div.sidemenu-topics > div:nth-child(1)
{
	width: 67%;
	margin-left: 0;
	margin-right: 8%;
}

div.sidemenu-topics > div:nth-child(2)
{
	width: 25%;
	margin-left: 0;
}

ul.menu._Skins_SideMenu.mc-component
{
	border-left: 1px solid #d3d3d3;
	overflow: visible;
}

ul.menu._Skins_SideMenu.mc-component li > a.selected
{
	position: relative;
}

ul.menu._Skins_SideMenu.mc-component li > a
{
	line-height: normal;
}

ul.menu._Skins_SideMenu.mc-component li > a.selected::before
{
	content: '';
	width: 0.66em;
	height: 0.66em;
	background: url(../Images/ellipse.svg);
	background-repeat: no-repeat;
	background-position: left center;
	position: absolute;
	top: 19px;
	left: -16.5px;
}

.tutorial-homepage-card-link
{
	text-decoration: none;
	color: #12122D;
}

.tutorial-homepage-card
{
	margin: 20px;
	background-color: #F5F7F9;
	border-radius: 0 0 var(--radius) var(--radius);
}

.tutorial-homepage img
{
	border-radius: var(--radius);
}

.tutorial-homepage .content
{
	padding: 10px 20px 0 20px;
}

.tutorial-homepage .content p
{
	text-align: center;
	font-weight: bold;
	font-size: 16pt;
	margin-bottom: 0;
	padding-bottom: 0;
}

.tutorial-homepage-card:hover
{
	transform: scale(1.03);
}

.tutorial-homepage-card-link:hover
{
	text-decoration: none;
	color: #12122D;
}

div.tutorial-homepage	/*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;
	margin-top: 2rem;
	border-spacing: 0px 20px;
	width: 100%;
	background-color: #F5F7F9;
	margin: 0;
	border-radius: 4px;
}

div.tutorial-homepage::before
{
	content: ' ';
	display: table;
}

div.tutorial-homepage::after
{
	content: ' ';
	display: table;
	clear: both;
}

div.tutorial-homepage > div
{
	float: left;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

div.tutorial-homepage > div:nth-child(1)
{
	width: 40%;
	margin: 0 2.5%;
}

div.tutorial-homepage > div:nth-child(2)
{
	width: 50%;
	margin: 0 2.5%;
}

div.type_tag
{
	margin: 0;
	margin-top: 2rem;
	margin-bottom: 1rem;
	padding: 0px;
	position: relative;
}

div.type_tag .tab_item
{
	color: #fff;
	display: inline-block;
	padding: 5px 15px;
	cursor: pointer;
	border: 1px solid var(--black);
	background: var(--black);
	font-size: 1rem;
	margin: 10px 25px 10px 0px;
	border-radius: var(--radius);
}

div.type_tag .tab_item:hover
{
	transform: scale(1.01);
}

.tooltip
{
	border-radius: 4px;
	color: black;
	background: #cfcfcf;
	padding: 25px 15px;
	border-color: #cfcfcf;
}

div.two-column	/*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;
	margin-top: 1rem;
	width: 100%;
}

div.two-column:before
{
	content: ' ';
	display: table;
}

div.two-column::after
{
	content: ' ';
	display: table;
	clear: both;
}

div.two-column > div
{
	float: left;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

div.two-column > div:nth-child(1)
{
	width: 30%;
	margin: 0 2%;
}

div.two-column > div:nth-child(2)
{
	width: 64%;
	margin: 2% 2% 2% 0;
}

div.next_button
{
	font-weight: 500;
	font-size: 1rem;
	background-color: #E89B25;
	height: auto;
	text-align: center;
	vertical-align: middle;
	align: center;
	padding: 10pt 20pt;
	border-radius: 30px;
	margin-left: auto;
	margin-right: auto;
}

.next-button-wide
{
	width: 50%;
	margin-top: 3rem;
}

.next-button-narrow
{
	width: 25%;
	margin-top: 5rem;
}

div.next_button:hover
{
	transform: scale(1.05);
}

a.next_button
{
	text-decoration: none;
}

a.next_button:hover
{
	text-decoration: none;
}

.four-box-grid
{
	display: grid;
	grid-template-columns: 23% 23% 23% 23%;
	grid-auto-rows: 1fr;
	justify-content: space-between;
	width: 95%;
	margin: auto;
	margin-top: 2rem;
	margin-bottom: 5rem;
}

div.grid-item
{
	padding: 10px 20px;
	color: var(--black);
	border-radius: var(--radius);
	box-shadow: 0px 0px 12px rgba(0,0,0,0.2);
	background-color: #E2F1FF;
	align-items: center;
	height: 100%;
}

div.grid-item:hover
{
	background-color: #E2F1B3;
}

div.grid-item h2
{
	font-weight: bold;
	font-size: 16pt;
}

div.grid-item .header
{
	height: 20%;
}

div.grid-item .content
{
	padding-top: 1rem;
	height: 40%;
}

div.grid-item .footer
{
	height: 35%;
}

div.grid-item .list-info .button
{
	border: 1px solid var(--blue);
	border-radius: 4px;
	padding: 5px 10px;
	font-size: 1em;
	color: var(--blue);
	text-align: center;
	width: 80%;
}

div.grid-item .list-info .button:hover
{
	transform: scale(1.05);
	background-color: var(--blue);
	text-decoration: none;
	color: #fff;
}

div.learn-more
{
	display: grid;
	grid-auto-rows: 1fr;
	margin: 10px;
	padding: 10px;
}

/* New Table Styles - 6 Options */
/* Style1: Simple table with a header */

table.Simple
{
	width: auto;
	border-collapse: collapse;
	border-left: 0px solid #000;
	border-right: 0px solid #000;
	border-top: 2px solid #000;
	border-bottom: 2px solid #000;
	border-spacing: 7px 0px;
	display: table;
}

/* Header style */

table.Simple th
{
	padding: 5px;
	text-align: left;
	vertical-align: top;
	border-bottom: 1px solid #000;
	font-weight: bold;
}

/* Cell style */

table.Simple td
{
	padding: 5px;
	text-align: left;
	vertical-align: top;
}

/* Style2: Simple table without a header */

table.SimpleNoHeader
{
	width: auto;
	border-collapse: collapse;
	border-left: 0px solid #000;
	border-right: 0px solid #000;
	border-top: 2px solid #000;
	border-bottom: 2px solid #000;
	border-spacing: 7px 0px;
	margin-top: 1em;
	margin-bottom: 1em;
	display: table;
}

/* First row style (acting as header) */

table.SimpleNoHeader tr:first-child td
{
	padding: 5px;
	text-align: left;
	vertical-align: top;
	border-bottom: 1px solid #000;
	font-weight: bold;
}

/* Cell style */

table.SimpleNoHeader td
{
	padding: 5px;
	text-align: left;
	vertical-align: top;
}

/* Style3: Gray table with a header */

table.Gray
{
	width: auto;
	border-collapse: collapse;
	border-left: 0px solid #000;
	border-right: 0px solid #000;
	border-top: 2px solid #000;
	border-bottom: 2px solid #000;
	border-spacing: 7px 0px;
	display: table;
}

/* Header style */

table.Gray th
{
	padding: 5px;
	text-align: left;
	vertical-align: top;
	border-bottom: 1px solid #000;
	font-weight: bold;
	display: table-cell;
	background-color: #f2f2f2;
}

/* Cell style */

table.Gray td
{
	padding: 5px;
	text-align: left;
	vertical-align: top;
}

/* Style4: Gray table without a header */

table.GrayNoHeader
{
	width: auto;
	border-collapse: collapse;
	border-left: 0px solid #000;
	border-right: 0px solid #000;
	border-top: 2px solid #000;
	border-bottom: 2px solid #000;
	border-spacing: 7px 0px;
	display: table;
}

/* First row style (acting as header) */

table.GrayNoHeader tr:first-child td
{
	padding: 5px;
	text-align: left;
	vertical-align: top;
	border-bottom: 1px solid #000;
	font-weight: bold;
	background-color: #f2f2f2;
}

/* Cell style */

table.GrayNoHeader td
{
	padding: 5px;
	text-align: left;
	vertical-align: top;
}

/* Style5: Simple table with a header, specifically for tables with 2 columns. Col1 for variables, col2 for descriptions. */

table.SimpleTwoCols
{
	width: auto;
	border-collapse: collapse;
	border-left: 0px solid #000;
	border-right: 0px solid #000;
	border-top: 2px solid #000;
	border-bottom: 2px solid #000;
	border-spacing: 7px 0px;
	display: table;
}

/* Header style */

table.SimpleTwoCols th
{
	padding: 5px;
	text-align: left;
	vertical-align: top;
	border-bottom: 1px solid #000;
	font-weight: bold;
}

/* Cell style */

table.SimpleTwoCols td
{
	padding: 5px;
	text-align: left;
	vertical-align: top;
	display: table-cell;
}

/* First column style */

table.SimpleTwoCols td:first-child,
table.SimpleTwoCols th:first-child
{
	width: 25%;
}

/* Second column style */

table.SimpleTwoCols td:last-child,
table.SimpleTwoCols th:last-child
{
	width: 75%;
}

/* Style6: Simple table without a header, specifically for tables with 2 columns. Col1 for variables, col2 for descriptions. */

table.SimpleTwoColsNoHeader
{
	width: auto;
	border-collapse: collapse;
	border-left: 0px solid #000;
	border-right: 0px solid #000;
	border-top: 2px solid #000;
	border-bottom: 2px solid #000;
	border-spacing: 7px 0px;
	display: table;
}

/* First row style (acting as header) */

table.SimpleTwoColsNoHeader tr:first-child td
{
	padding: 5px;
	text-align: left;
	vertical-align: top;
	border-bottom: 1px solid #000;
	font-weight: bold;
	display: table-cell;
}

/* Cell style */

table.SimpleTwoColsNoHeader td
{
	padding: 5px;
	text-align: left;
	vertical-align: top;
	display: table-cell;
}

/* First column style */

table.SimpleTwoColsNoHeader td:first-child
{
	width: 25%;
}

/* Second column style */

table.SimpleTwoColsNoHeader td:last-child
{
	width: 75%;
}

/* Style7: Simple table with alternative row colors */

table.SimpleAlternating
{
	width: auto;
	border-collapse: collapse;
	border-left: 0px solid #000;
	border-right: 0px solid #000;
	border-top: 2px solid #000;
	border-bottom: 2px solid #000;
	border-spacing: 7px 0px;
	margin-top: 1em;
	margin-bottom: 1em;
	display: table;
}

/* First row style (acting as header) */

table.SimpleAlternating tr:first-child td
{
	padding: 5px;
	text-align: left;
	vertical-align: top;
	border-bottom: 1px solid #000;
	font-weight: bold;
}

/* Alternate row style (acting as header) */

table.SimpleAlternating tr:nth-child(even)
{
	background-color: #f8f9fd;
}

/* Cell style */

table.SimpleAlternating td
{
	padding: 5px;
	text-align: left;
	vertical-align: top;
}

p#interior-title
{
	margin-top: 0pt;
	margin-bottom: 0pt;
	font-family: 'Lato Black';
	font-size: 64pt;
	color: #12122d;
}

p.intro
{
	font-family: 'Lato';
	font-size: 14pt;
	margin-top: 5px;
	margin-bottom: 5px;
	line-height: normal;
}

td.caption-main
{
	line-height: normal;
	font-size: 1rem;
}

div.note_admonition
{
	border-width: 1px 3px;
	border-color: var(--blue);
	border-style: solid;
	border-radius: 5px;
	margin-bottom: 1rem;
	margin-top: 1rem;
	padding: 10px;
}

div.note_warning
{
	border-width: 1px 3px;
	border-color: #960000;
	border-style: solid;
	border-radius: 5px;
	margin-bottom: 1rem;
	margin-top: 1rem;
	padding: 10px;
}

div.panel_licensing
{
	border-width: 1px 3px;
	border-color: var(--blue);
	border-style: solid;
	border-radius: 5px;
	margin-bottom: 1rem;
	margin-top: 1rem;
	padding: 10px;
}

/*===========================================================================================================================================================
Styles after this point are styles that are for specific mediums. If any additional styles are added to this template they will be listed after mediums.
[@media tablet] declares styles that will apply when the screen is in tablet view
[@media mobile] declares styles that will apply when the screen is in mobile view
===========================================================================================================================================================*/

@media only screen and (max-width: 1279px)
{
	.body-container
	{
		padding-left: 1em;
		padding-right: 1em;
	}

	td.section_heading > span
	{
		display: inline-block;
	}

	.title-bar-layout a.logo
	{
		margin-left: 50px;
	}

	div.product_homepage
	{
		display: grid;
	}

	.four-box-grid
	{
		grid-template-columns: 47% 47%;
		grid-auto-rows: 1fr;
		justify-content: space-between;
		width: 95%;
		margin: auto;
		margin-top: 2rem;
		margin-bottom: 1rem;
	}

	div.NewRowClass1 > div:nth-child(1)
	{
		width: 66.66667%;
		margin-left: 0%;
	}

	div.NewRowClass1 > div:nth-child(2)
	{
		width: 33.33333%;
		margin-left: 0%;
	}

	div.two-thirds-one-third > div:nth-child(1)
	{
		width: 66.66667%;
		margin-left: 0%;
	}

	div.two-thirds-one-third > div:nth-child(2)
	{
		width: 33.33333%;
		margin-left: 0%;
	}
}

@media only screen and (max-width: 767px)
{
	.title-bar-layout a.logo
	{
		margin-left: 50px;
	}

	td.section_heading
	{
		font-size: 2.5rem;
	}

	td.section_heading > span > img
	{
		width: 90px;
		height: auto;
	}

	p.section_subheading_item
	{
		font-size: smaller;
	}

	.subheading
	{
		width: 90px;
	}

	.tutorial-homepage-card
	{
		width: 90%;
	}

	div.NewRowClass1 > div:nth-child(1)
	{
		width: 100%;
		margin-left: 0%;
	}

	div.NewRowClass1 > div:nth-child(2)
	{
		width: 100%;
		margin-left: 0%;
	}

	div.two-thirds-one-third > div:nth-child(1)
	{
		width: 100%;
		margin-left: 0%;
	}

	div.two-thirds-one-third > div:nth-child(2)
	{
		width: 100%;
		margin-left: 0%;
	}

	div.product_homepage_container > div:nth-child(1)
	{
		width: 100%;
	}

	div.product_homepage_container > div:nth-child(2)
	{
		width: 100%;
	}

	div.product_homepage
	{
		grid-template-columns: 1fr;
	}

	div.product_homepage > a > div
	{
		width: 70%;
		margin: auto;
	}
}