/* Less Than 5000px Screen */
@media (max-width: 5000px) {
	
	#portrait-largescreen {
		display: inline-flex !important;
	}

	#portrait-smallscreen {
		display: none !important;
	}

	.show-small-screen {
		display: none;
	}

	.hide-small-screen {
		display: inline-block;
	}

	
	.product-highlights-section h4 {
		font-size: 1.85em;
	}

	.product-highlights-section h5 {
		font-size: 1.55em;
	}
	
}

	
/* Less Than 1400px Screen */
@media (max-width: 1400px) {
	.bootstrap-icon {
    	max-width: 100px;
	}

	.getting-started-step {
    	height: auto;
	}

	.product-highlights-section.padding-section {
        padding-top: 70px;
        padding-bottom: 70px;
    }
	
	#boardInsight-iframe-container {
		height: 750px;
	}
	
	#boardInsight-iframe {
		transform: scale(0.9);
		transform-origin: top left;
	}

}	
	
/* Less Than 1200px Screen */
@media (max-width: 1200px) {
	.bootstrap-icon {
    	max-width: 100px;
	}

	#boardInsight-iframe-container {
		height: 600px;
	}
	
	#boardInsight-iframe {
		transform: scale(0.75);
		transform-origin: top left;
	}

}	

/* Less Than 992px Screen */
@media (max-width: 992px) {

	p, div {
		font-size: 15px;
	}

	.btn {
		padding: 10px 25px;
	}

	.btn-avg-width {
		width: auto !important;
        max-width: fit-content;
        margin: 0 auto;
    }

	.hide-small {
		display: none;
	}

	.show-small {
		display: block !important;
	}

	.graphic-padding-ss {
		padding-bottom:5px
	}

	.realign-ss {
		text-align: center;
	}

	.text-larger {
		font-size: 1.0em !important;
	}

	/* Custom mobile nav */
	.navbar-collapse {
		display: none; /* Hide Bootstrap mobile collapse */
	  }

	.navbar img {
		max-height: 90px;
	}

	#uxbyjulia-logo {
		margin-bottom: -130px;
		height: 150px;
        width: 150px;
	}

	.navbar {
		background-color: rgba(0, 0, 0, 0.93);
		margin-bottom: -70px;
	}

	.navbar-collapse {
		flex-basis: auto;
		flex-grow: 0;
	}

	.navbar-collapse.show .logo-smallnav, .star-bg-navbar  {
		display: block !important;
	}

	.navbar-collapse.show .logo-smallnav {
		border-bottom: 1px solid rgb(255, 255, 255, 0.05);
	}

	.navbar .nav-link.active {
        color: #FFF;
        opacity: 1.0;
        height: auto;
        background: none;
	}

	.navbar-nav {
		display: none;
	}
	.navbar-collapse.show .navbar-nav {
		height: 100vh;
		display: flex;
		display: -webkit-flex;
		justify-content: center;
		-webkit-justify-content: center;
		flex-direction: column;
		-webkit-flex-direction: column;
		text-align: center;
	}

	.navbar-collapse.show .button {
		top: 1%;
        margin: 0 auto;		
	}
	
	.navbar .dropdown-menu.show {
		text-align: center;
		border-top: 1px solid rgb(255, 255, 255, 0.2);
		background: none;
	}
	
	.padding-section {
		padding: 60px 15px;
	}

	.padding-section-small {
		padding: 45px 15px;
	}

	.navbar {
    	height: auto;
	}

	.navbar .dropdown-menu.show, .navbar .dropdown-item {
    	background-color: inherit;
	}

	.nav-link:focus-visible {
		box-shadow: none;
	}

	#home-hero-image h1 {
		font-size: 2.0em;
	}
	
	#featured-projects {
		padding: 80px 0px 100px 0px;
	}

	.cs-hero-image h1 {
		margin-bottom:0px;
	}
	
	.cs-home-container {
		padding: 0px;
		margin: 30px 20px;
		border-radius: 0px 0px 10px 10px;
	}

    .cs-home-img {
        border-radius: 10px 10px 0px 0px;
        padding: 40px;
        margin-bottom: 15px;
        height: auto;
    }

	.cs-home-desc {
		margin-bottom: 10px;
		max-width: none;
	}

	.cs-home-tiletxt {
		padding: 20px 30px 40px 30px;
        text-align: center;
    }

	.cs-hero-image {
		text-align: center;
		padding: 25px;
	}

	.cs-hero-image img {
		padding-bottom: 10px;
	}

	.cs-nextcase img {
		max-width: none !important;
		width: 450px;
	}

	.cs-mobile-wireframe {
		max-height: 600px;
	}

	.cs-ph-maxwidth {
		padding: 30px 0px;
	}

	.show-small-screen {
		display: inline-block;
	}

	.hide-small-screen {
		display: none;
	}

	#footer-contact-detes {
		text-align: center;
		margin-bottom: 30px;
	}

	.custom-icon-cat {
		height: 21px;
	}

	#about-star-bg {
		height: 120px;
	}

	#about-page .padding-top-50 {
		padding-top:30px;
	}

	#julia-image {
		max-width: 275px;
	}

	#about-page .padding-bottom-50 {
		padding-bottom:30px;
	}
	
	#about-page .padding-tb-50 {
		padding-top:30px;
		padding-bottom:30px;
	}
	
	#about-education, #about-toolkit {
        padding-left: 15px;
        padding-top: 30px;
        margin-top: 30px;
        border-left: 0px !important;
        border-top: 1px solid #181818;
	}

	#about-experience, #about-skills {
        padding-right: 15px;
	}

	#about-skills {
		padding-top:30px;
	}
	
	#about-toolkit td {
		width: 50px;
	}
	  
	#about-toolkit img {
		width: 45px;
	}

	.gda-product-highlights .padding-tb-40 {
		padding: 20px 00px;
	}

	#flourish-hero-image img {
		max-width: 85%;
	}
	
	#footer-copyright.table>:not(caption)>*>* {
		padding: 2px;
	}

	.footer-icon {
		font-size: 19px;
		padding-right: 5px;
	}

	#uxbyjulia-footer {
		padding: 60px 0px;
	}

	.product-highlights-section.padding-section {
		padding-top:40px;
		padding-bottom: 40px;
	}

	.product-highlights-section h3 {
		font-size: 2.1em;
	}

	.product-highlights-section h4 {
		font-size: 1.85em;
	}

	.product-highlights-section h5 {
		font-size: 1.55em;
	}

	#KTS-product-highlights-section, #GDA-product-highlights-section .gda-section-one, #Flourish-product-highlights-section, #kinTies-product-highlights-section .kinTies-section-one {
		padding-top: 60px !important;
	}

	#kinTies-storyboards .storyboard, #kinTies-storyboards .storyboard-wrapper {
		padding-left: 0px;
		padding-right: 0px;
	}

	#boardInsight-iframe-container {
		height: 470px;
	}
	
	#boardInsight-iframe {
		transform: scale(0.55);
		transform-origin: top left;
	}

}
	

/* Less Than 768px Screen */
@media (max-width: 768px) {

	.kinTies-diagram {
		padding-left: 5px;
		padding-right: 5px;
	}

	.user-persona {
		padding: 5px;
	}
	
	#boardInsight-iframe-container {
		height: 400px;
	}

	#boardInsight-iframe {
		transform: scale(0.45);
		transform-origin: top left;
	}

}
	

/* Less Than 576px Screen */
@media (max-width: 576px) {

	.cs-nextcase img {
		max-width: none !important;
		width: 300px;
	}

	.hide-xsmall {
		display: none;
	}

	#home-hero-image h5 {
		line-height: 1.7;
		font-size: 1.0rem;
	}

	#home-hero-image h1 {
        margin-bottom: 0px;
    }

	#featured-projects h5, #featured-projects p, #more-projects h5, #more-projects p {
		font-size:15px !important;
	}

	.cs-home-projecttpe {
		display: none;
	}

	#about-toolkit img {
        width: 40px;
    }

	#about-toolkit td {
        width: 40px;
    }

	.cs-hero-image h1 {
        margin-bottom: 5px;
    }

	.product-highlights-section .padding-tb-40 {
		padding-top: 20px !important;
		padding-bottom: 20px !important;
	}

	.cs-title-icon {
		height: 70px;
		width: 70px;
		position: relative;
		left: -5px;
	}

	.product-highlights-section h4 {
		font-size: 1.65em;
		line-height: 1.5;
	}

	.product-highlights-section h5 {
		font-size: 1.45em;
		line-height: 1.5;
	}

	#boardInsight-iframe-container {
		height: 330px;
	}

	#boardInsight-iframe {
		transform: scale(0.35); 
		transform-origin: top left;
	}

	#TTTR-iframe-container {
		height: 660px;
	}

	#TTTR-iframe {
		transform: scale(0.8); 
		transform-origin: center;
	}

}

/* Less Than 500px Screen */
@media (max-width: 500px) {

	.cs-nextcase img {
		max-width: none !important;
		width: 300px;
	}

	.hide-xsmall {
		display: none;
	}

	#pdf-portfolio-download {
		margin-top: 5px;
	}

	#boardInsight-iframe-container {
		height: 280px;
	}

	#boardInsight-iframe {
		transform: scale(0.27); 
		transform-origin: top left;
	}

	#TTTR-iframe-container {
		height: 640px;
	}

	#TTTR-iframe {
		transform: scale(0.75); 
		transform-origin: top left;
	}

}