@media only screen and (min-width: 375px) {  /* iPhone */
    .landingContentContainer h1 {
        font-size: 40px;
    }
	.mobileToolBar .standardSearch.searchVisible .ts-control {
		width: 300px;
	}
	.menuBarButton {
		padding: 9px 16px;
	}
	.litterAnimals .litterAnimalPreview {
		width: 50%;
	}
}

@media only screen and (min-width: 470px) {
    .litterProfile {
        flex-wrap: nowrap;
    }
    .litterInfo {width: 28%;}
    .litterOffspring {
        width: calc(72% - 40px);
    }
    .searchResultButtons, .searchResultsInfo {
        width: auto;
        text-align: left;
    }
    .landingNewsInnerContainer > div { padding: 46px; }
	.factsContainer > div { width: 46%; }
	.mobileToolBar .standardSearch.searchVisible .ts-control {
		width: 400px;
	}
	.personLandingPicture {
		max-height: 240px;
	}
}

@media  only screen and (min-width: 600px) {
    .factsContainer .factsContainerButton {
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
	}
	.factsContainerButton .button { width: 40%; }
	.factsContainerButton .button.alternative { width: 55%; }
	.fourtabItems .tabHeaderName {display: block; font-size: 10px;}
	.contentSection h2, .contentSection h3 { font-size: 26px; }
	.litterAnimals .litterAnimalPreview { width: 33%; }
	.litterFacts { flex-wrap: nowrap; }
	.litterAnimalDetailContainer { flex-wrap: nowrap; }
	.litterAnimalDetail { width: 49%; }
	.mateMatcherDialog .standardDialog .mateMatcherProfileDetails .mateMatcherMetaDataContainer {
		display: flex;
	}
	.landingMobilePicture { background-image: url("../../images/breed_photo_mobile.jpg?version=1.0.0"); }
	.watchListAnimal .recordInfo {
		width: 160px;
		text-align: right;
		margin-bottom: 30px;
	}
	.watchListAnimal .profileDetails {
		width: calc(100% - 170px);
	}
}

@media only screen and (min-width: 700px) {
	.fourtabItems .tabHeaderName {font-size: 12px;}
	.fivetabItems .tabHeaderName {display: block; font-size: 10px;}
	.profileDetails {flex-wrap: nowrap;}
}

@media only screen and (min-width: 768px) {
	.maxTablet {display:none !important;}
	.formField, .textDescription {width: 64%;}
	.formRow, .textRow {display: flex;}
	label, .textLabel {width: 34%;}
    .standardDialog.smallSizeDialog, .standardDialog.midSizeDialog, .standardDialog.largeSizeDialog {
      border-radius: 10px;
    }
    .standardDialog.largeSizeDialog {
        max-width: 75%;
    }
    .wave, .waveAlt {
		height: calc(100vw / 63);
		min-height: 15px;
		max-height: 24px;
	}
	.waveAlt {top: calc((100vw / 64) * -1);}
    .scrollToTop {bottom: 20px; right: 20px;}
	.scrollToTop:hover {bottom: 25px;}
    .itemBox.smallProfile {
        width: calc((100% - 10px) / 2);
    }
    .formContainer label, .formContainer .textLabel {
        text-align: right;
    }
	.sectionBackground.leftRounded {
		border-radius: 10px 10px 0 270px;
	}
    /*Search*/
    .filterButton, .searchResultLink {display: none;}
	.splitSection.indexPage {
  		display: flex;
		align-content: stretch;
		justify-content: space-between;
        flex-wrap: wrap;
		flex-direction: row;
	}
	.searchBoxContainer {
		position: sticky;
        height: 100%;
        z-index: 0;
        top: var(--nav-height);
        left: 0;
		padding-right:10px;
		width: 358px;
	}
	.searchFilterContainer {
		height: calc(100vh - 60px);
		overflow: hidden;
	}
    .searchFilters {
		padding-top: 10px;
		position: relative;
		top: auto;
		overflow-y: auto;
		height: 100%;
		margin-bottom: 50px;
		/*height: calc(100% - 80px);*/
	}
	.resultContainer {
  		display: flex;
		flex-direction: column;
		width: calc(100% - 370px);
		padding-left: 10px;
		border-left: 1px solid var(--lightgrey);
		min-height: 370px;
	}
	.pageHeaderSearchContainer .searchResultsInfo, .pageHeaderSearchContainer .breederFilter {
		width: auto;
		max-width: 100%;
	}
    .profileInfo {
        width: 300px;
    }
    .generalInfo {
        width: calc(100% - 310px);
    }
    #map {
        height: 350px;
    }
    .landingContentContainer h1 {
		/* https://css-tricks.com/snippets/css/fluid-typography/ */
		font-size: calc(40px + (100 - 40) * ((100vw - 768px) / (1680 - 768)));
	}
	.landingContentContainer h2, .landingNumbers {
		font-size: calc(14px + (28 - 14) * ((100vw - 768px) / (1680 - 768)));
	}
	.animalCount {
		font-size: calc(32px + (64 - 32) * ((100vw - 768px) / (1680 - 768)));
	}
    .memberContainer, .sponsorContainer {
		display: flex;
		justify-content: center;
		gap: 20px;
	}
	.memberContainer {
		margin-top: 60px;
	}
	.sponsorDetail {width: 30%;}
	.sponsorDetail:only-child {width: 100%;}
	.memberDetail {width: 33%;}
	.memberDetail {
		padding-bottom: 16px;
	}
	.memberDetail:nth-child(2) {
		border-left: 1px solid var(--grey);
		border-right: 1px solid var(--grey);
		border-top: 0;
		border-bottom: 0;
	}
	.tabHeader {letter-spacing: 1px;}
	.personLandingPicture {
		max-height: 350px;
	}
	.breederPagePhotoSave {
		position: absolute;
		z-index: 1;
		bottom: 0;
		right: 10px;
	}
	.personLandingName {
		position: absolute;
		bottom: 10px;
		left: 30px;
		font-size: 28px;
		z-index: 1;
	}
	.personLandingName .kennelName {
		font-size: 36px;
	}
	.moveCropareaInfo {
		position: absolute;
		right: 20px;
		bottom: 44px;
	}
	.litterAnimals .litterAnimalPreview { width: 25%; }
	.mateMatcherSearchContainer {
		flex-wrap: nowrap;
	}
	.mateMatcherSearchHistoryContainer .mateMatcherSearchItem {
		width: calc((100% - 48px)/3);
	}
	.mateMatcherProfileDetails {
		max-width: 600px;
		margin: 0 auto;
	}
	.personStatistics {
		flex-wrap: nowrap;
	}
}

@media only screen and (min-width: 980px) {
    .profileMainData {
        flex-wrap: nowrap;
    }
    .contentLeft, .contentRight { width: 49%; }
    .generalInfo.personInfo, .litterDetails {
        display: flex;
		flex-direction: row;
        justify-content: space-between;
        gap: 20px;
    }
    .fullProfile.flexBoxItem { width: calc((100% - 10px) / 2);}
    .landingNewsInnerContainer > div { width: 48%;}
	.fourtabItems .tabHeaderName {font-size: 16px;}
	.fivetabItems .tabHeaderName {font-size: 12px;}
	.fourtabItems .tabHeader, .fivetabItems .tabHeader {flex-direction: row;}
	.feragenLanding .splitSectionLeft {
		padding: 40px 80px 40px 10px;
	}
	.feragenLanding h1 {
		color: var(--maincolor);
		position: relative;
		text-align: left;
		padding: 0;
	}
	.feragenImageContainer {
		height: 720px;
	}
	.feragenResultOverview {
		left: -85px;
		max-width: initial;
	}
	.standardDialog.plainDialog {
        max-height: 80vh;
        max-width: 80vw;
        border-radius: 8px;
        max-width: 1344px;
        background-color: var(--primary-background-color);
        position: relative;
        min-height: 460px;
      }
	.standardDialog.mateMatcherDialog.plainDialog {
		max-width: 1024px;
	}
	.standardDialog.plainDialog .dialogContent {
		display: flex;
		flex-wrap: wrap;
		gap: 10px;
		justify-content: space-between;
		min-height: 320px;
	}
}


/* Standard tablet landscape mode */
@media only screen and (min-width: 1024px) {
    .itemBox.smallProfile {
        width: calc((100% - 20px) / 3);
    }
    .itemBox.litterProfile, .itemBox.breederProfile { width: calc((100% - 10px) / 2);}
    .litterMatingPartner .animalProfile {
        flex-wrap: nowrap;
		height: auto;
    }
    .tabHeader {letter-spacing: 1px;}
    .tbaClaim {
		width: 40%;
		align-items: flex-start;}
	.landingFactContainer {text-align: left;}
	.factsContainer { width: 55%; }
    .splitSection {
  		display: flex;
		align-content: stretch;
		justify-content: space-between;
		flex-direction: row-reverse;
        flex-wrap: wrap;
		align-items: flex-start;
	}
	.splitSectionLeft  {  width: calc(100% - 370px)  }
	.splitSectionRight {
		width: 360px;
  		display: flex;
		flex-direction: column;
	}
	.tabletOnly { display: none !important; }
	.resultProfile .secondaryProfileData {  display: block; max-width: 20%; }
	.resultProfile .primaryProfileData {  width: 80%;  }
	.breederPageTopics > div {
		width: 49%;
	}
}

/* switch to normal menu  */
@media only screen and (min-width: 1124px) {
    :root {
        --topcontainer-height: 44px;
    }
    .mobileToolBar { display: none;}
    .mobileOnly {display: none !important;}
    .mainContentContainer { height: calc(100vh - var(--topcontainer-height) - var(--menu-height) - var(--submenu-height)); }
    nav {height: auto;}
    .landingPage nav {box-shadow: none;}
    .landingPage .standardSearch .ts-control {width: var(--landingpage-menusearch-input-width);}
    .landingPage .tbaLogoContainer {
        width: 230px;
    }
    .landingPage .tbaLogo, footer .tbaLogo {
        font-size: 50px;
    }
    .landingPage .breedLogo span:first-child {
        font-size: 40px;
        top: 2px;
        left: 7px;
    }
    .landingPage .breedLogo span:nth-child(2) {
		font-size: 48px;
		bottom: 2px;
		left: 1px;
	}
    .landingContentContainer {
		flex-direction: row;
	}
	.landingContentContainer h1 {white-space: nowrap;}
	.landingMobilePicture {display: none;}
	.landingPictureContainer, .landingTextContainer { width: 50%; }
	.landingPictureContainer {
		display: block;
		padding-right: 40px;
	}
	.landingPicture {
		background-image: url("../../images/breed_photo_ellipse.png?version=1.0.0");
		background-repeat: no-repeat;
		background-size: cover;
		background-position: center left;
		width: 100%;
		height: calc(45vw / 3 * 2);
		min-height: 342px;
		max-height: 486px;
	}
	.webp.webpalpha .landingPicture, .webp.webp-alpha .landingPicture {
		background-image: url("../../images/breed_photo_ellipse.webp?version=1.0.0");
	}
	.landingContentContainer h1 span {
		display: flex;
		justify-content: flex-end;
		line-height: 1.1;
	}
	.landingTextContainer { right: -10px; }
	.landingTextContainer * { text-align: right; }
	.landingNumbers { padding-right: 70px; }
    .highlightInnerContainer {justify-content: space-between;}
    .highlightMessage {width: auto;}
    .headerMeta {
		display: flex;
		align-items: center;
		justify-content: space-between;
        gap: 15px;
	}
    #account_menu .newMessageIndicator {
        top: 0;
        left: 32px;
    }
    footer a {
		width: auto;
	}
    .revisionTable {
        flex-direction: row;
        flex-wrap: nowrap;
    }
    .revisionHistory {
        width: 250px;
    }
    .revisionTable table {
        width: calc(100% - 260px);
    }
    table.fixedHeader thead th {
        top: 0;
    }
    .stickyHeader:not(.landingPage) .headerTopContainer,
	.stickyHeader:not(.landingPage) header {
		position: fixed;
		transition: var(--ease-transition);
	}
	.stickyHeader header { top: 44px; }
	.stickyHeader:not(.landingPage) #container {  top: 160px;  }
	.stickyHeader:not(.landingPage).noSubmenu #container {	top: 124px;  }
    .standardDialog.plainDialog.scrollDialog {
        max-width: 1024px;
        max-height: 450px;
    }
	.searchBoxContainer {
		top: 0;
	}
	.stickyHeader .searchBoxContainer {
		top: 122px;
	}
	.stickyHeader .searchBoxContainer.hasSubmenu {
		top: 158px;
	}
    .standardDialog.plainDialog.scrollDialog .litterAnimalDetailContainer {
        height: calc(100% - 55px);
    }
    .standardDialog.plainDialog .dialogClose {
		position: fixed;
		color: var(--alternate-text-color);
		font-size: 20px;
		width: auto;
	}
	.standardDialog.plainDialog .dialogContentContainer {
		padding-top: 0;
	}
	.detailNavigation {height: 100%;}
    .detailNavigation.prev {left: -50px; top: 0;}
	.detailNavigation.next {right: -50px; top: 0;}
	.detailNavigation span {
		background-color: transparent;
		color: var(--alternate-text-color);
	}
    .breederPageHeadContainer {padding: 0 10px;}
	.fivetabItems .tabHeaderName {  font-size: 14px; }
	.publishButtonContainer {
		padding: 0 0 20px 0;
	}

	.profilePhotoContainer {
		width: 270px;
		margin: 50px 0 0 0;
		padding: 10px;
	}
	.mateMatcherProfileDetails {
		width: calc(100% - 280px);
		max-width: 100%;
		margin: 0;
	}
	.mateMatcherArea .searchResults {
		justify-content: space-between;
	}
}

@media only screen and (min-width: 1560px) {
	.waveAlt {top: -24px;}
}

@media only screen and (min-width: 1680px) {
	.landingContentContainer h1 {font-size: 100px;}
	.landingContentContainer h2, .landingNumbers {font-size: 28px;}
	.animalCount {font-size: 64px;}
}

@media only screen and (max-width: 767px) {
	.minTablet {display:none !important;}
	/*Hide Footer on mobile if search is active to omit scrolling on search page */
	.searchIndexPage footer {display: none !important;}
	.resultContainer { display: none; }
	.searchBoxMobileHidden .searchBoxContainer {
		display: none;
	}
	.searchBoxMobileHidden .resultContainer {
		display: block;
	}
	.searchIndexPage .scrollToTop {
		display: none !important;
	}
}

@media only screen and (max-width: 1123px) {
    .minFullMenu {display: none !important;}
    header, .landingPage header {
      position: sticky;
    }
    .menuContainer, .submenuContainer {
        display: none;
    }
	.openMenu #container {
		transform: translate3d(280px, 0px, 0px);
	}
	.openMenu {
		position: fixed;
		width: 100%;
	}
	.mobileToolBar .standardSearch {
		position: absolute;
		right: 8px;
		top: 9px;
		visibility: hidden;
	}
	.mobileToolBar .standardSearch.searchVisible {
		visibility: visible;
	}
	.mobileToolBar .standardSearch .ts-control {
		width: 1px;
		transition: all 300ms linear;
	}
	.activeMenuSearch .menuBarButton {
		transition: none;
		visibility: hidden;
	}
	.ribbon .banner.personLandingBanner {
		left: -6px;
	}
	.mateMatcherMetaDataContainer button {
		margin: 0 auto;
	}
	.profilePhotoContainer { /* correctly align navigation arrows */
		display: flex;
	}
}

@media only print {
	#cookie_info {display: none !important;}
	.menuBarButtons {display: none !important;}
	header, .headerTopContainer { display: none !important;}
	footer { display: none !important;}
	.main { padding: 0; margin: 0;}
	.topContent { display: none !important;}
	.splitSectionRight { display: none !important;}
	.scrollToTop { display: none !important;}
}

@media only screen {
	.termsofuse.info {display: none;}
}