﻿@media screen and (max-width: 1400px) {
	.nav-item.login {
		margin-left: 240px;
	}
	.hero .col-md-8 {
		width: 75%;
	}
}
@media screen and (max-width: 1200px) {
	.nav-item {
		margin-left: 20px;
	}
	.nav-item.login {
		margin-left: 60px;
	}
	.hero.home .headlines h1 {
		font-size: 60px;
	}
	.model-catalog .list .providers img {
		margin-top: 5px;
		margin-bottom: 5px;
	}
}
@media screen and (max-width: 992px) {
	.navbar-collapse {
		background-color: #263752;
		border: solid 1px #556585;
		border-radius: 8px;
		margin-top: 10px;
		padding: 10px 10px 25px 10px;
	}
	.navbar-collapse .navbar-nav {
		align-items: start !important;
	}
    .nav-item.login {
        margin-left: 20px;
		margin-bottom: 20px;
    }
	section {
		padding-top: 60px;
		padding-bottom: 60px;
	}
	section.docs-home {
		padding-top: 100px;
	}
	footer .wrap,
	section.docs .wrap,
	.docs-header .wrap {
		max-width: 100%;
	}
	.hero.home .headlines h1 {
		font-size: 50px;
	}
	.hero.home .headlines h3 {
		font-size: 20px;
	}
	.hero.demo .cta {
		display: none;
	}
	.hero .copy,
	.hero .form,
	.hero .visual,
	.hero .widget {
		width: 100%;
	}
	.hero .visual {
		margin-top: 60px;
		text-align: center !important;
	}
	.value-prop .copy,
	.value-prop .visual {
		width: 100%;
	}
	.value-prop .visual {
		text-align: center !important;
	}
	.value-prop.copy-left {
		display: block;
	}
	.value-prop.copy-left .copy {
		margin-bottom: 30px;
	}
	.value-prop.copy-right {
		display: none;
	}
	.pillars .headlines {
		width: 100%;
		text-align: left;
	}
	.pillars .pillar-card {
		padding: 20px;
	}
	.pillars .pillar-card h3 {
		font-size: 20px;
	}
	.pillars .pillar-card p {
		font-size: 16px;
	}
	.pillars .pillar-icon i {
		font-size: 40px;
	}
	.pathways .headlines {
		width: 100%;
		text-align: left;
	}
	.pathways .copy {
		width: 100%;
		margin-bottom: 20px;
	}
	.testimonials .testimonial-card {
		height: 340px;
		padding: 20px;
	}
	.testimonials .testimonial-card .quote {
		font-size: 18px;
	}
	.mini-card {
		padding: 20px;
		width: 20%;
	}
	.mini-card .name {
		font-size: 14px;
	}
	.model-catalog .list {
		width: 100%;
	}
	.model-card {
		width: 100%;
	}
	.footer-cta {
		text-align: left;
	}
	.footer-cta .col-md-10 {
		width: 100%;
	}
}
@media screen and (max-width: 768px) {
	header .wrap {
		max-width: 100%;
	}
	section .wrap {
		max-width: 100%;
		padding-left: 30px;
		padding-right: 30px;
	}
	.hero.home .headlines h1,
	.hero .headlines h1,
	.value-prop .copy h2,
	.pillars .headlines h2,
	.pathways .headlines h2,
	.footer-cta h3 {
		font-size: 44px;
	}
	.customers .logos .col-md-2 {
		padding-bottom: 30px;
	}
	.customers .logos .col-md-2.last {
		padding-bottom: 0;
	}
	.pillars .pillar-card-wrap {
		margin-bottom: 30px;
	}
	.pillars .pillar-card-wrap.last {
		margin-bottom: 0;
	}
    .testimonials .testimonial-card {
        height: 200px;
		margin-bottom: 30px;
    }
    .testimonials .testimonial-card.last {
		margin-bottom: 0;
    }
	footer ul {
		margin-bottom: 30px;
	}
	.docs-toc-container {
		width: 25%;
	}
	.docs-content-container {
		width: 75%;
	}
	.docs-content .code-box {
		margin-top: 15px;
	}
	section.docs .wrap {
		padding-left: 5px;
		padding-right: 10px;
	}
}
@media screen and (max-width: 576px) {
	.hero.home .headlines h1,
	.hero .headlines h1,
	.value-prop .copy h2,
	.pillars .headlines h2,
	.pathways .headlines h2,
	.footer-cta h3 {
		font-size: 36px;
	}
    .hero.home .headlines h3,
	.hero .headlines h3 {
        font-size: 18px;
    }
	.zai-button__purple.large {
		padding: 12px 24px;
		font-size: 16px;
	}
	.zai-button__grey.large {
		padding: 12px 24px;
		font-size: 16px;
	}
	.pathways .nav.nav-pills {
		justify-content: left !important;
	}
	.pathways .nav.nav-pills .nav-item {
		margin: 0 10px 10px 0;
	}
    .testimonials .testimonial-card {
        height: 220px;
    }
	.docs-toc-container,
	.docs-content-container {
		width: 100%;
	}
	.docs-toc {
		height: auto;
		border: none;
		text-align: center;
	}
	.docs-toc ul {
		display: none;
	}
	.docs-toc select {
		display: block;
		width: 50%;
		margin: 15px auto 0 auto;
		color: #5e5959;
	}
	.docs-content .docs-section {
		margin-left: 0;
	}
    .mini-card {
        width: 27%;
    }
	.model-catalog .list,
	.model-card {
		padding: 10px 20px 20px 20px;
		font-size: 14px;
	}
	.pathways .tab-content ul li {
        line-height: 1.5em;
		margin-bottom: 5px;
    }
}
@media screen and (max-width: 440px) {

}
@media screen and (max-width: 428px) {
	.dropdown-menu.mega-menu {
		width: 355px;
	}
	.hero.home .headlines h1,
	.hero .headlines h1,
	.value-prop .copy h2,
	.pillars .headlines h2,
	.pathways .headlines h2,
	.footer-cta h3 {
		font-size: 30px;
	}
    .hero.home .headlines h3,
	.hero .headlines h3,
	.value-prop .copy p,
	.testimonials .testimonial-card .quote,
	.footer-cta p,
	.pillars .headlines p,
	.pathways .headlines p {
        font-size: 16px;
    }
	.zai-button__purple.large {
		padding: 10px 20px;
		font-size: 14px;
	}
	.zai-button__grey.large {
		padding: 10px 20px;
		font-size: 14px;
	}
    .testimonials .testimonial-card {
        height: 240px;
    }
	.docs-header .fa-ul li {
		margin-right: 10px;
	}
	.docs-content {
		font-size: 14px;
	}
	.docs-content .docs-section h1,
	.docs-content .docs-section h4 {
		font-size: 22px;
		margin-bottom: 15px;
	}
    .docs-toc {
        padding: 20px 5px 20px 10px;
    }
    .docs-toc select {
        width: 100%;
		font-size: 14px;
    }
    .mini-card {
        width: 40%;
    }
	.pathways .tab-content .visual {
		height: auto;
		padding: 20px;
	}
	.pathways .tab-content h3 {
		font-size: 20px;
	}
}
@media screen and (max-width: 414px) {

}
@media screen and (max-width: 390px) {
	.dropdown-menu.mega-menu {
		width: 320px;
	}
	.zai-button__purple.large {
		display: block;
		text-align: center;
		margin-bottom: 20px;
	}
	.zai-button__grey.large {
		display: block;
		text-align: center;
	}
}
@media screen and (max-width: 375px) {
	.dropdown-menu.mega-menu {
		width: 310px;
	}
}
@media screen and (max-width: 360px) {
	.dropdown-menu.mega-menu {
		width: 290px;
	}
}
@media screen and (max-width: 320px) {
	.dropdown-menu.mega-menu {
		width: 250px;
	}
	.hero.home .headlines h1,
	.hero .headlines h1,
	.value-prop .copy h2,
	.pillars .headlines h2,
	.pathways .headlines h2,
	.footer-cta h3 {
		font-size: 20px;
	}
    .hero.home .headlines h3,
	.hero .headlines h3,
	.value-prop .copy p,
	.testimonials .testimonial-card .quote,
	.testimonials .testimonial-card .author,
	.footer-cta p,
	.pillars .headlines p,
	.pillars .pillar-card p,
	.pathways .headlines p,
	.pathways .nav-pills .nav-link,
	.pathways .tab-content p,
	.pathways .tab-content ul li {
        font-size: 14px;
    }
    .pillars .pillar-card h3 {
        font-size: 16px;
    }
	.pathways .tab-content h3 {
		font-size: 16px;
	}
    .testimonials .testimonial-card {
        height: 250px;
    }
}
@media screen and (max-width: 280px) {

}
