

/*  ///  MIN-WIDTH 2300PX  \\\  */
@media (min-width: 2300px) {
	#heroBG{
	height: 90vh;
	}
	.grid-newsitem img{ width: 50%; max-height: 800px; border-radius: 50px; box-shadow: 1rem 1rem 2rem rgba( 0, 0, 0, .5)}

    #newsresources .grid-newsitem img {
        width: 100%;
    }

}/* end of min-width 2300px*/






@media (max-width: 1680px) {
		
    /*  ///  AWARDS AWARDEES  \\\  */
	#oty .innerContainer {
		flex-direction: column;
	}

}/* end of max-width 1680px*/



/* @media (max-width: 1560px) {
    header .navigation .logo h1 {
        font-size: 2.5vw;
        margin-left: 20px;
    }

} */

/* end of max-width 1560px*/



@media (max-width: 1380px) {
		
}/*  end max-width 1380px  */



@media (max-width: 1365px) {
    .navbar {
        display: none;
    }

    .header {
        display: block;
    }

    .logo h1 {
        width: 600px;
    }
}

/* end of max-width 1365px*/



@media (max-width: 1366px) {

    /*     .coreComps {
        width: 100vw;
    }

    .card {
        width: 24vw;
    }
   
 */

    .column {
        margin-top: 100px;
    }

    .column h2 {
        padding-top: 10px;
        padding-bottom: 10px;
        font-size: 1.5rem;
    }

    .sub-nav-group li a {

        font-size: 1rem;
        padding: 8px;
    }

    .menuHeader h2 {
        font-family: var(--tcTitle);
        font-weight: 400;
        font-size: 2rem;
        padding: 25px;
    }

    /* header .navigation .logo h1 {
        font-size: 2rem;
        margin: 0;
        padding: 0;
        margin-left: 15px;
    } */

    .secondaryMenu .items {
        margin-left: 20vw;
    }

    .titleText {
        font-size: 2rem;
        margin: 0;
        padding-left: 10vw;

    }
		
	

    .tiles-item-1,
    .tiles-item-2,
    .tiles-item-3,
    .tiles-item-4,
    .tiles-item-5,
    .tiles-item-6 {
        width: 49.5%;

    }



    .museumHistoryContent img {
        display: none;

    }


    .history .tiles li {
        position: relative;
    }

    .history .tiles h2 {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        padding: 0;
        text-align: center;
        width: 100%;
    }

    .history .tiles a {
        position: absolute;
        inset: 0;
        margin: 0;
        padding: 0;
    }
}

/* end of max-width 1366px*/



@media (max-width: 1330px) {
    .museumHistoryContent img {
        height: 175px;
    }

}

/* end of max-width 1330px*/



@media (max-width: 1280px) {

    .contentContainer {
        width: 90vw;
    }
    
    #transportationCommand .indexContainer {
      padding: 100px 5vw;
    }

    .museumHistoryContent img {
        height: 150px;
    }


}/* end of max-width 1280px*/



@media (max-width: 1230px) {
    .museumHistoryContent img {
        display: block;
        width: 60%;
        height: auto;
        margin: 0;
        padding: 0;
        margin-top: 300px;
        right: 20vw;

    }

    .desktopOrgChart {
        display: none;
    }

    .tabletmobileOrgChart {
        display: block;
    }

    .pOc {
        width: 100%;
        display: block;
    }

    .safetySubmv {
        width: 100%;
    }

    .secondaryMenu .items {
        display: flex;
        flex-flow: row wrap;

    }

    .secondaryDropdown {
        width: 30%;

    }

    .secondaryDropbtn {
        width: 100%;
        height: 75px;
    }
	
	/*  TCWO application images */
	.careerapplicationContainer img{ width: 80%;} 

}

/* end of max-width 1230px*/





@media (max-width: 1200px) {

    /*  ///  TC/INDEX LEADERSHIP  \\\  */
	.leaderCard:not(:last-of-type) {
		margin-bottom: 2.5rem;
	}

}

/* end of max-width 1200px*/





@media (max-width: 1024px) {

		.sectionHead {
			width: calc(92vw - 100px);
			margin-inline: auto;
		}
		
    /*  ///  LEADERSHIP PAGE  \\\  */
    .leadershipInfo {
        flex-flow: column nowrap;
    }

    /*  ///  BIO PAGES  \\\  */
    .leadershipContainerTop {
        flex-flow: column wrap;
    }

    .leadershipContainerItem:last-of-type {
        width: 80vw;
    }

		
    /*  ///  REG SAFETY  \\\  */
    .safetySub {
        flex-direction: column;
    }

    .pOc {
        margin-left: auto;
        max-width: 550px;
    }

}

/* end of max-width 1024px*/



@media (max-width: 960px) {
	#heroBG{
	height: 70vh;
	}

	/*.contentContainer {
			margin-left: -1rem;
		} */
    


  header .navigation .logo h1 {
      display: none;
  }

    /*  ///  AWARDS AWARDEES  \\\  
	#memOfReg .innerContainer {
		flex-direction: column;
	}	*/


}

/* end of max-width 960px*/





@media (max-width: 850px) {
	#heroBG{
	height: 50vh;
	}

    .contentContainer {
        width: 80vw;
        /*margin-left: 2.5rem;*/
    }
	.bottomHeader{
		width: 80vw;
	}
	.topHeader{
		margin: 0 0 0 -8rem;
	}
	.compPeriod{
		margin-left: -2rem;

	}
	.footer{
		width: 70vw;
	}
	.officialWebsite p{
		width: 80%;
	}

  /*  ///  TC/INDEX MUSEUM/HISTORY  \\\  */
	
	
	
	 /*  ///  Sub Menu \\\  */
	.multiPage,
	.multiMenu {
		  width: -webkit-fill-available;
	}

}
	
/*  end max-width 850px*/





@media (max-width: 800px) {
	#lee .unitContact {
		flex-direction: column;
	}
	.unitPhone,
	.unitSocial,
	.unitAddress,
	.unitWeb{
		margin-left: 5vw;
	}
}

/*  end max-width 800px*/





@media (max-width: 768px) {
	
	#heroBG{
	height: 60vh;
    width: calc(100dvw - 10px);
	}
	
		.footer{
		width: 100vw;
	}
    header .navigation {
        width: calc(100dvw - 10px);
    }

    .socialIcons {
      max-width: calc(100dvw - 10px);
    }

    #transportationCommand {
        width: calc(100dvw - 10px);
    }

    .command-container {
        width: calc(100dvw - 10px);
        column-gap: 25px;
    }
		
    /*  ///  HISTORY-PUBLICATIONS  \\\  */
	#publications .pubContainer {
		flex-direction: column;
	}
	#publications .pubImg {
		display: flex;
		align-items: flex-end;
	}
	#publications .pubImg img {
		margin-bottom: 0;
	}
	#publications .button {
		margin-bottom: 3.5rem;
	}

    #hooahMVcon {
        margin: 0;
    }

    #museumCon {
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
        align-items: flex-start;
        width: 100%;
        height: auto;
        gap: 1rem;
        justify-content: center;
    }
    
    #currentCon p {
        display: none;
    }

    #currentNewsIndex {
        text-align: start;
    }
    
    #currentCon {
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
        align-items: flex-start;
        width: 100%;
        height: auto;
        gap: 1rem;
        justify-content: center;
    }
    
    .museumHistoryIndex {
        height: auto;
        text-align: start;
    }

}

/*  end max-width 786px  */



@media (max-width: 785px) {

       .officialWebsite {
        padding-left: 10px;
        padding-right: 10px;
    }
}

/* end of max-width 785px*/


@media (max-width: 710px) {

    .secondaryDropdown {
        width: 50%;
    }
		
}

/* end of max-width 710px*/



@media (max-width: 680px) {

	.sectionHead {
	  width: calc(100vw - 118px);
		margin: 0 auto;
	}
	.headerBlurb {
		width: 90vw;
	}
	.contentContainer {
		padding: 3rem 0;
	}
	
}/* end of max-width 680px*/



@media (max-width: 640px) {
	
	#heroBG{
        height: 45vh;
    
        }

    .bannerHead h1 {
        font-size: x-large;
    }

    .titleText h1 {
        max-height: inherit;
    }
		
  /*  ///  TC/INDEX MUSEUM/HISTORY  \\\  */
	.museumImg {
		width: 100%;
	}

}

/* end of max-width 640px*/


@media (max-width: 540px) {
	
	

  .bannerHead {
    margin: 50px 25px;
  }

  /*  ///  TC SCHOOL  \\\  */
  .schoolsTC .unitContact {
    flex-direction: column;
  }
	
  /*  ///  DPMO  \\\  */
	#dpmo .bannerHead p {
		display: none;
	}
	
	/* ///TCWO Application Image \\\ */ 
	.careerapplicationContainer img{ display: none;}
	#mobileapplicationpath, .careerapplicationContainer, .mobileapplicationpath img{display: inline; width: 80%; padding-left: 2.5rem;}
	.careerapplicationContainer h2{ margin: 2.5rem; text-align: center; }

}
	/*   ////OCOT\\\\ 
	
	.bannerHead h1{ margin-right: 5rem; }*/
	.lcf-box-1 img {width: 100%; max-height: 400px; min-height: 284px; }

/* end of max-width 540px*/

@media (max-width: 480px) {
    footer {
      width: calc(100dvw - 5px);
    }


    .newsItemCon{
        
        padding: 5px;
        text-align: center;
        height: max-content;
    }
	

    .newsItemCon a {

        text-align: center;
        justify-content: space-around;
        margin: 0;
        padding: 0;


    }

    .newsItemCon button {
        width: 125x;
        margin: 0;
        padding: 0;
        padding-top: 10px;
        padding-bottom: 10px;
        margin-bottom: 25px;
    }

    .newsItemCon button{
    width: 125px;
    }
	

    .newsItemCon h1 {
        margin: 0;
        padding: 0;
    }
    #museumCon {
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
        align-items: flex-start;
        width: 100%;
        height: auto;
        gap: 1rem;
        text-align: center;
        justify-content: center;
    }
    #currentCon {
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
        align-items: flex-start;
        width: 100%;
        height: auto;
        gap: 1rem;
        text-align: center;
        justify-content: center;
    }

    header .navigation {
        width: calc(100dvw - 5px);
    }

}

@media (max-width: 355px) {
	

    header .navigation .logo img {
        position: relative;
        height: 60px;
    }

    header .navigation .logo h1 {
        display: none;
    }

    .header {
        position: absolute;
        display: flex;
        align-items: center;
        left: 0;
        background-color: #333;
        width: calc(100dvw - 5px);
        height: 100px;
        /*z-index: -1;*/
        padding: 0;
    }

    .header a {
        position: absolute;
        display: block;
        width: 50px;
        margin: 2px 25px 0 0;
        padding: 0;
        font-family: var(--tcTitle);
    }

    .header a span {
        background: #fff;
        display: block;
        height: 3px;
        margin: 12px 0;
    }

    .titleText {
        font-size: 1.25em;
        margin: 0;
        padding: 0;
        padding-left: 25px;
    }

    .socialIcons {

        margin: 1px;
        margin-top: 25vh;
        margin-left: 0vw;
    }

    .socialIcons img {
        height: 50px;
    }

    /* #heroBG {
        height: 30vh;
        top: 90px;
    } */

       .transportationCommand {
        margin: 0;
        padding: 0;
        margin-top: 50px;
    }

    .command-container img {
        margin: 0;
        padding: 0;
        margin-top: 50px;

    }

    .cot {
        margin-bottom: 50px;
    }

    .dCot {
        margin-bottom: 50px;
    }

    .tcsm {
        margin-bottom: 50px;
    }

    .spearheadNewsletter {
        margin: 0;
        padding: 0;

        margin-top: 50px;
        margin-left: 25px;
        margin-right: 25px;
    }

    .spearheadNewsletter h2 {
        line-height: 45px;
        padding-top: 50px;
    }

    .spearheadNewsletter button {
        margin-bottom: 50px;
    }



    .cddp {
        margin: 0;
        padding: 0;
        margin-top: 50px;
        margin-left: 25px;
        margin-right: 25px;
    }

    .cddp h2 {
        line-height: 45px;
        padding-top: 50px;
    }

    .cddp button {
        margin-bottom: 50px;
    }

    .museumHistory {
        height: max-content;
        background-color: #dedede;

    }

    .newsItemCon {
        height: max-content;
    }

    .museumHistoryContent {
        margin: 0;
        padding: 0;
        padding-top: 20px;
       	text-align: center;
       
    }
	

    .museumHistoryContent a {

        text-align: center;
        justify-content: space-around;
        margin: 0;
        padding: 0;


    }

    .museumHistoryContent button {
        width: 200px;
        margin: 0;
        padding: 0;
        padding-top: 10px;
        padding-bottom: 10px;
        margin-bottom: 25px;
    }

    .museumHistoryContent button{
    width: 125px;
    }
	

    .museumHistoryContent h1 {
        margin: 0;
        padding: 0;
    }



    .footer-columns {
        width: 100%;
    }

    .footerRequiredItems a {
        width: 100%;
        margin-bottom: 25px;
    }

    .grayTop {
        display: none;
    }


    .leadershipContainerItem {
        width: 90vw;
        margin: 0;
		margin-left: -25px;
        padding: 0;
    }

    .leadershipContainerItem:first-of-type {
        width: 90vw;
        margin-top: 50px;
    }

    .leadershipContainerItem:last-of-type {
        width: 90vw;
    }

    .leadershipContainerItem h1 {
        padding: 0;
        margin: 0;
        text-align: center;
        margin: auto;
        font-size: 30px;
        width: auto;
        padding: 10px 20px 10px 20px;
    }

    .leadershipContainerItem h2 {
        width: auto;
        margin: 0;
        padding: 0;
        text-align: center;
        font-size: 30px;
        margin-top: 25px;
        text-decoration: underline;
    }

    .leadershipContainerItem p {
        width: auto;
        margin: 0;
        padding: 0;
        margin-top: 25px;
    }

    .tiles-container a {
        width: 100%;
    }

    .headerCon-menu {
        bottom: 0;
        margin: 0;
        padding-top: 165px;
    }

    .bannerHead h1 {
    font-size: 3.6rem;
    margin-bottom: 0;
    }
		
	.contentContainer{
		width: 90vw;
		margin: 0 auto;
		font-size: var(--tc-xs);
	}
	
	.contactUs li{ width: 80vw;}

}

/* ==//// Officer \\\\ ==*/

	.cardsContainer{
		grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
		margin-left: -20px;
}


/* end of max-width 415px*/



/*iPad*/

@media (max-width: 768px) and (orientation: portrait) {

    .card {
        width: 75vw;
    }

    .school .tiles h2 {
        font-size: 1.75rem;
    }


    .missionLeft {
        width: 100vw;
        padding-top: 400px;
    }

    .missionRight {
        width: 100vw;
        left: 0;
        top: 0;
        margin: 0;
        padding: 0;
    }

    .missionPage {
        background-color: white;
    }

    .seventyyearsBody {
        margin: 0;
        padding: 0;
        margin-top: 25px;

    }

    .seventyyearsBody p {
        margin: 0;
        margin-left: 10vw;
        margin-right: 10vw;
    }

    .seventyyearsBody h2 {
        margin-left: 10vw;
        margin-right: 10vw;
    }

    .secondaryMenu .items {
        margin-left: 24vw;
    }


}



/*iPhone 6/7/8 Plus*/

@media (max-width: 480px) and (orientation: portrait) {

    #heroBG {
        top: 1px;
        width: calc(100dvw - 5px);
        height: 50dvh;
    }

    
    .enlistedHeader h1 {
        font-size: 2rem;
    }

    .enlistedHeader p {
        font-size: 1rem;
    }

    .warrantHeader h1 {
        font-size: 2rem;
    }

    .warrantHeader p {
        font-size: 1rem;
    }

    .warrantOfficer .tiles-item-1,
    .warrantOfficer .tiles-item-2,
    .warrantOfficer .tiles-item-3 {
        width: 100%;
    }

    .newsandresources .tiles-item-1,
    .newsandresources .tiles-item-2,
    .newsandresources .tiles-item-3 {
        width: 100%;
    }

    .officerHeader h1 {
        font-size: 2rem;
    }

    .officerHeader p {
        font-size: 1rem;
    }

    .newsandresources h1 {
        font-size: 2rem;
    }

    .newsandresources p {
        font-size: 1rem;
    }

    .school .tiles {
        margin-top: 93px;
    }

    .school .tiles-item-1,
    .school .tiles-item-2,
    .school .tiles-item-3 {
        width: 100%;

    }

    .orgChart h1 {
        margin-top: 125px;
        margin-bottom: 50px;
    }

    .missionRight {
        width: 100vw;

    }

    .missionLeft {
        padding-top: 450px;
    }

    header .navigation .subLogo {
        margin-top: 15px;
        margin-left: 15px;
    }

    .historyHeader {
        padding-top: 50px;
    }

    .seventyyearsHead h1 {
        padding: 0;
        margin: 0;
        line-height: 1.25;
        padding-top: 25px;
    }

    .history .tiles-item-1,
    .history .tiles-item-2,
    .history .tiles-item-3 {
        width: 100%;
    }

    .secondaryMenu .items {
        display: flex;
        margin: 0;
        width: 100%;
        margin: auto;
        text-align: center;
    }

    .secondaryDropbtn {
        width: 138px;
        border: 1px solid white;
    }

    .secondaryMenuTitle {
        display: none;
    }

    .header #popout {


        margin-right: 20vw;
    }

    h1 {
        width: calc(100dvw - 5px);
    }

/* ////OCOT\\\\ 
	
	.bannerHead h1{ margin-right: 6rem; }*/
	.lcf-box-1 img {width: 100%; max-height: 300px; min-height: 184px; }


	
	.Mitdheader h1 { margin-right: 6rem; }
}



/*iPhone 5/SE*/
/*Smallest responsiveness will go*/

@media (max-width: 480px) and (orientation: portrait) {

    #heroBG {
        top: 1px;
        width: calc(100dvw - 5px);
        height: 50dvh;
    }

    .header a {
        margin: 8px 25px 0 0;
    }

    .logo img {
        margin-top: 10px;
    }
 

    .titleText {
        font-size: .75rem;
        margin-left: 1px;
        margin-top: 50px;
        width: calc(100dvw - 5px);
        padding-bottom: 50px;
    }

    .socialIcons {
        scale: 50%;
        margin-top: -60px;
        flex-wrap: nowrap;
    }

    .footerIcons {
        margin: 0;
        padding: 0;

        margin: auto;
        margin-top: 50px;
        width: 320px;
        text-align: center;
    }

    .footerIcons img {
        height: 60px;
    }

    .secondaryDropbtn {
        width: 110px;
        font-size: 14px;

    }

    .header #popout {


        margin-right: 22vw;
        margin-top: 2vh;
    }

    .header #popout input[type=search]:focus {
        width: 80px;

        height: 35px;
    }

		
}

