﻿/* DEFAULTS
----------------------------------------------------------*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
}

body   
{   
    background: #7a7a7a url(../rv4_images/body_gradient.jpg) repeat-x;
    color: #3d3d3d;
    font-family: Verdana, Arial, sans-serif;
    font-size: 65%;
    line-height: 1;
}

a:hover {
    color: #7b8738;
}

a:active
{
    color: #034af3;
}

ol, ul {
	list-style: none;
}

a {
    color: #3d3d3d;
    font-weight: bold;
    text-decoration: none;
}

a.bluehyper {
    color: #3300CC;
    font-weight: bold;
    text-decoration: none;
}

a.bluehyper:hover {
    background: none;
    color: #7B8738;
}

div.DropDownNav > a
{
    display: none;
}

/* HEADINGS   
----------------------------------------------------------*/

h1, h2, h3, h4, h5, h6 {
    font-weight: bold;
}

h1 {
    font-size: 2.6em;
    line-height: 1.2em;
}
h2 {
    font-size: 1.2em;
}

p {
    /*font-size: .9em;*/
    font-size: 1.1em;
    line-height: 1.3em;
    margin: 1.1em 0;
}

#rightCol p {
    font-size: .9em;
    line-height: 1.4em;
    margin: 1.1em 0;
}

/* this rule styles <h1> and <h2> tags that are the 
first child of the left and right table columns */
.rightColumn > h1, .rightColumn > h2, .leftColumn > h1, .leftColumn > h2
{
    margin-top: 0px;
}


/* PRIMARY LAYOUT ELEMENTS   
----------------------------------------------------------*/

.page
{
    width: 1016px;
    background-color: #fff;    
    margin: 0px auto 0px auto;
}

.header
{
    position: relative;
    background-repeat: no-repeat;
    border-top-color: #ffffff;
    border-top-style: solid;
    border-top-width: 10px;
    border-left-width: 10px;
    border-left-style: solid;
    border-left-color: #ffffff;
    border-right-width: 10px;
    border-right-style: solid;
    border-right-color: #ffffff;
    display: block;
}

.main
{    
    margin: 0px;
    background-repeat: no-repeat;
    border-top-color: #ffffff;
    border-top-style: solid;
    border-top-width: 10px;
    border-left-width: 10px;
    border-left-style: solid;
    border-left-color: #ffffff;
    border-right-width: 10px;
    border-right-style: solid;
    border-right-color: #ffffff;
    display: block;
    min-height: 420px;
}

.Museum 
{
    width: 70%;
}

.leftCol
{
    padding: 6px 0px;
    margin: 12px 8px 8px 8px;
    width: 200px;
    min-height: 200px;
}

.Calendar_sm_c 
{
    width: 95%;
    margin-top: 5%;
}

.calendarRegistrationL
{
    clear: both;
    width: 27%; 
    float: left; 
    text-align: right; 
    line-height: 25px;
    right: 25px;
    font-weight: bold;
}

.calendarRegistrationR
{
    float: right;
    width: 72%; 
    float: right; 
    line-height: 25px;    
}

.calendarborder
{
    border: 1px solid #999999;
    border-radius: 3px;
}

.contactborder
{    
    border: 1px solid #E0E0E0;
    border-radius: 3px;
    margin-bottom: 10px;
}

.contactemail
{   
    position: absolute;
    left: 410px;
}

.ContactUs 
{
    width: 85%;
}

.courseCalendarRow
{
    clear: both;
    text-align: center; 
    font-weight: bold; 
    height: 19px;    
}

.courceCalendarL 
{   
    border-left: 1px solid #B6B6B6;
    border-bottom: 1px solid #B6B6B6;
    /*width: 91px;*/ 
    width: 16.2%;
    float: left;
    height: 19px; 
    /*font-size: 14px;*/
    font-size: 1.2em;
    padding-top: 0px;
    line-height: 19px;
}

.courceCalendarLNorm
{
    font-weight: normal;
    /*font-size: 9px;*/ 
    font-size: .8em;
    text-align: left;
    border-left: 1px solid #B6B6B6;
    border-bottom: 1px solid #B6B6B6;
    /*width: 91px;*/ 
    width: 16.2%;
    float: left;
    height: 19px; 
}

.courceCalendarR
{
    border-right: 1px solid #B6B6B6;
    border-left: 1px solid #B6B6B6;
    border-bottom: 1px solid #B6B6B6;
    /*width: 91px;*/ 
    width: 16.2%;
    float: left;
    height: 19px; 
    /*font-size: 14px;*/
    font-size: 1.2em;
    line-height: 19px;
}

.courceCalendarRNorm
{
    font-weight: normal;
    /*font-size: 9px;*/ 
    font-size: .8em;
    text-align: left;
    border-right: 1px solid #B6B6B6;
    border-left: 1px solid #B6B6B6;
    border-bottom: 1px solid #B6B6B6;
    /*width: 91px;*/ 
    width: 16.2%;
    float: left;
    height: 19px; 
}

#mainContent h2.calendarh2 
{
    color: #fff;
    line-height: 16px; 
    height: 16px; 
    /*margin: 2% 3% 2% 3%;*/ 
    padding: 0;
    width: 100%;
}

.Engineers_ITAM 
{
    width: 90%;
}

.imgJAD 
{
    float: left; 
    padding: 10px;
    width: 250px; 
    height: 340px;
}

.imgCSM 
{
    float: left; 
    padding: 10px; 
    width: 250px; 
    height: 340px;
}

.imgCommander 
{
    width: 40%;
    float: left;
    padding: 1%;
}

.imgDorothea, .imgRichard, .imgDrew
{
    width: 200px; 
    height: 248px;
}

.divDorothea, .divRichard, .divDrew
{
    width: 200px; 
    height: 268px; 
    padding-left: 50px; 
    padding-right: 10px; 
    float: left;
}

.h1Dorothea, .h1Richard, .h1Drew, #mainContent h1.h1TheNameDix
{   
    float: right; 
    width: 398px; 
    padding-top: 25px;
}

.image-ActiveShooter
{   
    clear: both;
    float: right;
    background: url('../Images/Services/DPTMS/active_shooter.jpg') no-repeat;
    background-size: 222px 266px;
    width: 222px;
    height: 266px;
    margin: 10px 5px 0 0;
}

.image-ACC
{
    background: url('../Images/MICC/micc.gif') no-repeat center;
    background-size: 150px 147px;
    width: 200px;
    height: 175px;
}

.image-AORSmall
{
    background: url('../Images/Services/DHRM/aor_small.png') no-repeat center;
    background-size: 480px 400px;
    width: 600px;
    height: 420px;
    float: left;
    display: block;
}

.image-AORSmall > a.map
{
    clear: both;
    display: block;
    border: none;
    margin: 10px 60px 10px 60px;
    width: 480px; 
    height: 400px;
}

.image-APD 
{
    background: url('../Images/Services/DHRM/APD_HeaderLogo_sm.png') no-repeat center;
    background-size: 100%;
    width: 100%;    
    float: left;
}

.image-APD > a.map 
{    
    border: none;
    padding-top: 35%;
    display: block;
}


.image-blankbackground 
{
    background: url('../Images/Services/BlankBackground.JPG') no-repeat center;
    background-size: 90%;
    height: 0%;
    width: 99%;
    padding-top: 76%;
    border-left: 1px solid #c2c2c2;
}

.image-Calendar 
{
    background: url('../Images/Services/MSTC/Calendar_sm_c.png') no-repeat center;
    background-size: 95%;
    width: 45%;
    padding-top: 30%;
    float: left;
}

.image-Chap
{
    background: url('../Images/Services/Chapel/chap_mainimage.jpg') no-repeat center;
    background-size: 95%;
    width: 100%;
    /*height: 260px;*/
    padding-top: 40%;
    display: block;
}

.image-Chaplain1
{
    background: url('../Images/Services/Chapel/lawsonweb.jpg') no-repeat center;
    /*background-size: 190px 240px;*/
    background-size: 80%;
    width: 50%;
    /*height: 240px;*/
    padding-top: 55%;  /* (img-height / img-width * width) which is (576/459px * 50%) = 15.16% allows div to scale to image height when resizing*/
    display: block;
    float: left;
}

.image-Chaplain1-1
{
    background: url('../Images/Services/Chapel/lawsonweb.jpg') no-repeat center;
    /*background-size: 190px 240px;*/
    background-size: 80%;
    width: 33%;
    /*height: 240px;*/
    padding-top: 35%;  /* (img-height / img-width * width) which is (576/459px * 50%) = 15.16% allows div to scale to image height when resizing*/
    display: block;
    float: left;
}

.image-Chaplain2
{
    background: url('../Images/Services/Chapel/SANTIAGOweb.jpg') no-repeat center;
    /*background-size: 190px 274px;*/
    background-size: 73.5%;
    width: 49%;
    padding-top: 55%;
    /*height: 240px;*/
    display: block;
    float: left;
}

.image-Chaplain2-1
{
    background: url('../Images/Services/Chapel/SANTIAGOweb.jpg') no-repeat center;
    /*background-size: 190px 274px;*/
    background-size: 70%;
    width: 34%;
    padding-top: 35%;
    /*height: 240px;*/
    display: block;
    float: left;
}

.image-Chaplain3
{
    background: url('../Images/Services/Chapel/01-VELEZGARCIA.jpg') no-repeat center;
    background-size: 73.5%;    
    width: 50%;
    /*height: 240px;*/
    padding-top: 40%;
    display: block;
    float: left;
}

.image-Chaplain3-1
{
    background: url('../Images/Services/Chapel/01-VELEZGARCIA.jpg') no-repeat center;
    background-size: 82%;    
    width: 33%;
    /*height: 240px;*/
    padding-top: 35%;
    display: block;
    float: left;
}

.image-ContactUs 
{
    background: url('../Images/Services/MSTC/contactus.jpg') no-repeat center;
    background-size: 90%;
    width: 45%;
    padding-top: 35%;
    float: left;
}

.image-DefenseService
{
    background: url('../Images/Services/Legal/defense_service_logo.png') no-repeat center;
    background-size: 192px 226px;
    width: 50%;
    height: 250px;
    display: block;
    float: left;
    clear: both;
}


.image-DixFacebook
{
    background: url('../Images/fb_logo2.jpg') no-repeat center;
    background-size: 95%;
    width: 100%;
    float: left;
}

.image-DixFacebook > a.map
{
    clear: both;
    display: block;
    /*border: 1px solid red;*/
    border: none;
    width: 92%;
    margin: auto;
    padding-top: 40%;
}

.image-DPTMS1
{
    background: url('../Images/Services/DPTMS/dptms1Range.jpg') no-repeat center;
    background-size: 267px 159px;    
    width: 277px;
    height: 169px;
    display: block;
}

.image-DPTMS2
{
    background: url('../Images/Services/DPTMS/aviation.jpg') no-repeat center;
    background-size: 270px 171px;    
    width: 280px;
    height: 181px;
    display: block;
}

.image-DPTMSDefault
{
    clear: both;
    background: url('../Images/Services/DPTMS/DPTMS_default_image.jpg') no-repeat center;
    background-size: 80%;
    width: 100%;
    padding-top: 65%;    
    display: block;
    }
    
.image-FOIA 
{
    background: url('../Images/Services/DHRM/foia.jpg') no-repeat center;
    background-size: 365px 138px;
    width: 100%;
    height: 150px;
    display: block;
    position: relative;
    margin-left: auto;
    margin-right: auto;
    float: left;
}

.image-FOIA > a.map
{
    clear: both;
    display: block;
    border: none;
    margin-left: 3px;
    margin-right: 3px;
    width: 190px; 
    height: 78px;
}

.image-FortDixSix
{
    background: url('../Images/Services/DPTMS/fortdix_six.jpg') no-repeat center;
    background-size: 269px 400px;
    width: 280px;
    height: 420px;
    display: block;
}

.img-GiantVoice
{
    clear: both;
    background: url('../Images/Services/DPTMS/giantvoice.jpg') no-repeat center;
    background-size: 204px 296px;
    width: 204px;
    height: 296px;
    display: block;
}

.image-HonorGuard
{
    background: url('../Images/Services/DHRM/honorguard.jpg') no-repeat center;
    background-size: 177px 177px;
    width: 185px;
    height: 185px;
    float: left;
    display: block;
}

.image-Humvee
{
    clear: both;
    background: url('../Images/Logistics/humvee1.png') no-repeat center;
    background-size: 431px 214px;
    width: inherit;
    height: 240px;
    display: block;
    margin-top: 10px;
    text-align: center;
}

.image-iconLock
{
    background: url('../Images/lockIcon.png') no-repeat center;
    background-size: 20px 20px;
    width:20px; 
    height:24px; 
    margin-top: 2px; 
    display: inline-block;
    float: left;
}

.image-iconLock2
{
    background: url('../Images/lockIcon.png') no-repeat center;
    background-size: 20px 20px;
    width:20px; 
    height:24px; 
    margin-top: 2px; 
    display: inline-block;
    float: left;
}


.image-Legal 
{
    background: url('../Images/Services/Legal/sja.gif') no-repeat center;
    background-size: 55%;
    width: 50%;
    /*height: 300px;*/
    padding-top: 40%;
    margin: auto;
    float: left;
}

.image-LegalCivAdmin 
{
    background: url('../Images/Services/Legal/books.jpg') no-repeat center;
    background-size: 75%;
    width: 50%;
    height: 300px;
    margin: auto;
    float: left;
}

.image-LegalClaims 
{
    background: url('../Images/Services/Legal/ClaimsLogo.png') no-repeat center;
    background-size: 60%;
    width: 100%;
    padding-top: 25%;
    margin: auto;
    float: left;
}

.image-LegalLimited 
{
    background: url('../Images/Services/Legal/LIMITED lEGAL.png') no-repeat center;
    background-size: 65%;
    width: 40%;
    padding-top: 35%;
    margin: auto;
    float: left;

}

.image-LegalMJD 
{
    background: url('../Images/Services/Legal/militaryjustice.jpg') no-repeat center;
    background-size: 80%;
    width: 40%;
    padding-top: 35%;
    margin: auto;
    float: left;
}

.image-LegalSpecVic
{
    background: url('../Images/Services/Legal/spec_vic.jpg') no-repeat center;
    background-size: 80%;
    width: 40%;
    padding-top: 35%;
    margin: auto;
    float: left;
}

.image-LegalTD 
{
    background: url('../Images/Services/Legal/defense_service_logo.png') no-repeat center;
    background-size: 55%;
    width: 40%;
    padding-top: 35%;
    margin: auto;
    float: left;
}

.image-LegalJBMDLJAG
{
    background: url('../Images/Services/Legal/JBMDLJAG.jpg') no-repeat center;
    background-size: 70%;
    width: 100%;
    padding-top: 80%;
    margin: auto;
    float: left;
}

.image-LegalMovMil
{
    background: url('../Images/Services/Legal/MovMil.png') no-repeat center;
    background-size: 85%;
    width: 90%;
    padding-top: 45%;
    margin: auto;
    float: left;
}

.image-LRC
{
    background: url('../Images/Logistics/lrc.jpg') no-repeat center;
    background-size: 300px 308px;
    width: 604px;
    height: 320px;
    margin: auto;
    float: left;
}

.image-MOB
{
    background: url('../Images/Services/DPTMS/MOB_LOGO.jpg') no-repeat center;
    background-size: 85% 85%;
    width: 100%;
    padding-top: 57.5%;  /* (img-height / img-width * width) which is (400px/480px * 100%) = 15.16% allows div to scale to image height when resizing*/
    margin: auto;
    float: left;
}

li.dynamic a.dynamic div.image-iconLock
{
    background-size: 15px 15px;
    width: 15px; 
    height:15px;    
    display: block;
    float: right;
    position: absolute;
    top: 0;
    left: 3px;
}

li.dynamic a.dynamic div.image-iconLock2 
{
    background-size: 15px 15px;
    width: 15px; 
    height:15px;    
    display: block;
    float: right;
    position: absolute;
    top: 0;
    left: 170px;
}

ul.l3 li .image-iconLock 
{
    background-size: 12px 12px;
    width: 12px;
    height: 12px;
    float: right;
    /*margin-right: 0px;*/
    margin-right: 5%;
}

ul.l3 li .image-iconLock2
{
    background-size: 12px 12px;
    width: 12px;
    height: 12px;
    float: right;
    margin-right: 10px;
}


#rightCol .image-iconLock 
{
    background-size: 12px 12px;
    width: 12px;
    height: 12px;
}

/*#USASA,Directorates
#Services*/
/*#USASA\,Directorates > ul > li:nth-child(2) > a, #USASA\,Directorates > ul > li:nth-child(3) > a, 
#USASA\,Directorates > ul > li:nth-child(6) > a, #USASA\,Directorates > ul > li:nth-child(7) > a*/ 
#Directorates > ul > li:nth-child(2) > a, #Directorates > ul > li:nth-child(3) > a, 
#Directorates > ul > li:nth-child(6) > a, #Directorates > ul > li:nth-child(7) > a 
{
    line-height: 1.8em;
    padding-top: .5em;
    padding-bottom: .5em;    
}

/*#Services > ul > li:nth-child(2), #Services > ul > li:nth-child(3), 
#Services > ul > li:nth-child(6), #Services > ul > li:nth-child(7)
{
    line-height: 1.8em;
}*/

.image-Ice
{
    background: url('../Images/ICE_logo_Button.jpg') no-repeat center;
    background-size: 158px 56px;
    width: 196px;
    height: 65px;
    display: block;
    float: left;
}

.image-Ice > a.map
{
    clear: both;
    display: block;
    border: none;
    margin-top: 3px;
    margin-left: 19px;
    width: 156px; 
    height: 56px;
}

.image-iSalute {
      background: url('../Images/isalute.png') no-repeat top;
      background-size: 92%;
      width: 100%;      
      display: block;
      float: left;
}

.image-iSalute > a.map
{
    clear: both;
    display: block;
    border: none;
    //border: 1px solid red;
    margin: auto;
    width: 92%;
    padding-top: 50%;  /*This changes the image height*/
}

.image-JBMDL
{   
    background: url('../Images/jointbasemdl01.jpg') no-repeat center;
    width: 196px;
    height: 28px;
    display: block;
    float: left;
    margin:  20px 0px 3px 0px;
}

.image-JBMDL > a.map
{
    clear: both;
    display: block;
    border: none;
    //border: 1px solid red;
    width: 196px;
    height: 27px;
}

.image-JMMS
{
    background: url('../Images/Services/DPTMS/jmmslogo_purple.gif') no-repeat center;
    background-size: 85%;
    width: 100%;    
}

.image-JMMS > a.map
{
    clear: both;
    display: block;
    border: none;
    /*border: 1px solid red;*/
    padding-top: 45%;
}

.image-map
{
      background: url('../Images/History/dixtrio.jpg') no-repeat;
      width: 156px;
      height: 576px;
      display: block;
      position: relative;
      margin-left:10px;
      float: left;
}

.Dorothea 
{
    top: 0px; 
    left: 0px; 
    width: 156px; 
    height: 138px;
}
 
.Richard
{ 
    top: 140px; 
    left: 0px; 
    width: 156px; 
    height: 110px;
}

.Drew
{ 
    top: 250px; 
    left: 0px; 
    width: 156px; 
    height: 115px;
}

.History
{ 
    top: 365px; 
    left: 0px; 
    width: 156px;
    height: 200px
}
    
.image-map > a.map, .image-TelephoneChart1 > a.map, .image-TelephoneChart2 > a.map, .image-TelephoneChart3 > a.map
{
    clear: both;
    position: absolute;
    display: block;
    border: none;
}

.image-MCL
{
    background: url('../Images/Services/DHRM/mcl.jpg') no-repeat center;
    background-size: 65%;
    width: 100%;
    float: left;
}

.image-MCL > a.map
{
    padding-top: 105%;
    display: block;
    border: none;
}

.image-MCL2
{
      background: url('../Images/DefaultHome/MilitaryCrisisLine.png') no-repeat top;
      background-size: 190px 66px;
      width: 196px;
      height: 70px;
      float: left;
}

.image-MCL2 > a.map
{
    clear: both;
    border: none;
    margin-left: 3px; 
    width: 190px;
    height: 66px;
}

.image-MCL2
{      
      display: block;
}

.image-MCL2 > a.map
{    
    display: block;
}


.image-MWRJBMDL
{
    background: url('../Images/mwrjbmdl.png') no-repeat center;
    background-size: 97%;
    width: 100%;
    /*height: 105px;*/
    display: block;
    margin-top: 10px;
    float: left;
}

.image-MWRJBMDL > a.map
{
    clear: both;
    display: block;
    border: none;
    /*border: 1px solid red;*/
    width: 96%;
    padding-top: 45%;
    margin-left: auto;
    margin-right: auto;
}


.image-MSTC
{    
    background: url('../Images/Services/MSTC/MAIN_IMAGE.png') no-repeat center;
    background-size: 95%;
    width: 100%;
    padding-top: 43%;
}

.image-MSTCLogo
{
    float: left;
    background: url('../Images/Services/MSTC/mstclogo.gif') no-repeat center;
    background-size: 90%;
    width: 100%;
    padding-top: 100%;
}

.image-Museum
{
    background: url('../Images/Services/Museum/museum_main.png') no-repeat center;
    background-size: 90%;
    width: 50%;
    /*height: 300px;*/
    padding-top: 45%;
    float: left;
}

.image-MuseumOut
{
    background: url('../Images/Services/Museum/banner2h.png') no-repeat center;
    background-size: 95%;
    width: 100%;
    padding-top: 25%;
    float: left;
}

.image-MuseumIn
{
    background: url('../Images/Services/Museum/banner2v.png') no-repeat center;
    background-size: 90%;
    width: 30%;
    padding-top: 83%;
    float: right;
}

.image-MuseumEntrance
{
    background: url('../Images/Services/Museum/ARmuseum.jpg') no-repeat center;
    background-size: 95%;
    width: 70%;
    padding-top: 33%;
}


.image-opsec_small
{
    clear: both;
    background: url('../Images/Services/DPTMS/opsec_small.jpg') no-repeat center;
    background-size: 90px 133px;
    width: 95px;
    height: 143px;
    display: inline-block;
}

.image-opsec2_small
{    
    background: url('../Images/Services/DPTMS/opselc2_small.jpg') no-repeat center;
    background-size: 90px 133px;
    width: 95px;
    height: 143px;
    display: inline-block;
}

.image-opsec3_small
{    
    background: url('../Images/Services/DPTMS/opselc3_small.jpg') no-repeat center;
    background-size: 90px 133px;
    width: 95px;
    height: 143px;
    display: inline-block;
}

.image-opsec4_small
{    
    background: url('../Images/Services/DPTMS/opselc4_small.jpg') no-repeat center;
    background-size: 90px 133px;
    width: 95px;
    height: 143px;
    display: inline-block;
}

.image-opsec5_small
{    
    background: url('../Images/Services/DPTMS/iSalute_small.jpg') no-repeat center;
    background-size: 90px 133px;
    width: 95px;
    height: 143px;
    display: inline-block;
}

.image-PlansAndOps 
{
    background: url('../Images/Services/DPTMS/PlansOperations.jpg') no-repeat center;
    background-size: 90%;
    width: 45%;
    /*height: 143px;*/
    padding-top: 35%;
    display: inline-block;
    float: left;
}


.image-ReadyResilient
{
    clear: both;
    background: url('../Images/ReadyResilient.jpg') no-repeat center;
    background-size: 188px 100px;
    width: 196px;
    height: 110px;
    display: block;
    display: inline-block;
}

.image-ReadyResilient > a.map
{
    clear: both;
    display: block;
    border: none;
    margin-left: 4px;
    margin-right: 4px;
    margin-top: 5px;
    width: 188;
    height: 99px;
}

.image-Security
{
    clear: both;
    background: url('../Images/About/security_image.jpg') no-repeat center;
    background-size: 360px 240px;
    width: 380px;
    height: 260px;
    display: block;
    float: right;
}

.img-SeeSomthing
{
    clear: both;    
    background: url('../Images/Services/DPTMS/seesomething.png') no-repeat center;
    background-size: 196px 133px;
    width: 196px;
    height: 133px;
    display: block;
    float: left;
}

.image-Sharp1
{
    background: url('../Images/Services/DHRM/sharp.png') no-repeat center;
    background-size: 196px 35px;
    width: 196px;
    height: 35px;
    display: block;
    float: left;
}

.image-Sharp1 > a.map
{
    clear: both;
    display: block;
    border: none;
    width: 196;
    height: 34px;
}

.image-Sharp1R
{
    background: url('../Images/Services/DHRM/sharp.png') no-repeat center;
    background-size: 100%;
    width: 100%;
    display: none;
    float: left;
    margin-top: 4%;
}

.image-Sharp1R > a.map
{
    clear: both;
    display: block;
    /*border: 1px solid red;*/
    border: none;
    width: 99%;
    margin: auto;
    padding-top: 30%;
}


.image-Sponsorhip
{
    background: url('../Images/Services/DHRM/TASPBanner01.jpg') no-repeat center;
    background-size: 166px 250px;
    width: 200px;
    height: 260px;
    display: block;
}

.image-StrongBonds
{
    background: url('../Images/Services/Chapel/strongbonds.png') no-repeat center;
    background-size: 128px 72px;
    width: 196;
    height: 72px;
    display: block;
    margin-top: 5px;
    margin-bottom: 5px;
}

.image-StrongBonds > a.map
{
    clear: both;
    display: block;
    border: none;
    margin-left: 33px;
    margin-right: 33px;
    width: 128;
    height: 71px;
}

.image-SuicidePrevention
{
    background: url('../Images/SuicidePreventionLarge.jpg') no-repeat top;
    background-size: 92%;
    width: 100%;
    display: block;
    float: left;
}

.image-SuicidePrevention > a.map
{
    clear: both;
    display: block;
    /*border: 1px solid red;*/
    border: none;
    width: 92%;
    margin: auto;
    padding-top: 40%;
}

.image-TelephoneChart1
{
    background: url('../Images/ContactUs/chart.gif') no-repeat center;
    background-size: 600px 240px;
    width: 604;
    height: 245px;
    position: relative;
}

.image-TelephoneChart2
{
    background: url('../Images/ContactUs/army_call.gif') no-repeat center;
    background-size: 600px 250px;
    width: 604px;
    height: 255px;
    position: relative;
}

.image-TelephoneChart3
{
    background: url('../Images/ContactUs/other_call.gif') no-repeat center;
    background-size: 600px 311px;
    width: 604px;
    height: 315px;
    position: relative;
}

.image-TMD 
{
    background: url('../Images/Services/DPTMS/TMD.jpg') no-repeat center;
    background-size: 95%;
    width: 55%;
    padding-top: 35%;
    position: relative;
    float: left;
}

.image-Triage {    
    background: url('../Images/Services/MSTC/triage.jpg') no-repeat center;
    background-size: 95%;
    width: 50%;
    padding-top: 40%;
    float: left;
}

.image-directions
{
    background: url('../Images/Services/MSTC/directions_sm.jpg') no-repeat center;
    background-size: 90%;
    width: 45%;
    padding-top: 50%;
    float: left;
}

.directions 
{
    width: 75%;
}

.Triage 
{    
    width: 90%;
    margin-top: 2%;
}

.TSC_BilletsAndDining 
{
    width: 90%;
    margin-top: 8%;
}

.TSC_ClassRoom 
{
    width: 90%;
    margin-top: 5%;
}

.TSCButton 
{
    margin: auto;
    width: 95%;
}

.TSC_sm_Button 
{
    width: 85%;
    margin-top: 5%;
}

.TSC_Ranges_sm
{
    width: 90%;
}

.TSC_Training_sm 
{
    width: 85%;
}

.TSC_TrainingSystems_sm 
{
    width: 65%;
}

.image-TSCBulletinRight 
{
    background: url('../Images/Services/TMD/tscbutton.jpg') no-repeat center;
    background-size: 95%;
    width: 100%;
    /*height: 370px;*/
    padding-top: 75%;
    display: inline-block;
}


.image-Ultimate1
{   
    background: url('../Images/History/STATUE3.jpg') no-repeat center;
    background-size: 216px 360px;
    width: 240px;
    height: 370px;
    display: inline-block;
}

.image-Ultimate2
{
    background: url('../Images/History/STATUE2.jpg') no-repeat center;
    background-size: 285px 190px;
    width: 300px;
    height: 200px;
    display: inline-block;
}

.image-Ultimate3
{
    background: url('../Images/History/STATUE1.jpg') no-repeat center;
    background-size: 285px 380px;
    width: 300px;
    height: 380px;
    display: inline-block;
}

.image-USAJobs
{
    background: url('../Images/Services/Chapel/USAJobs.png') no-repeat center;
    background-size: 193px 47px;
    width: 196px;
    height: 50px;
    display: inline-block;
    margin-bottom: 5px;
}

.image-USAJobs > a.map
{
    clear: both;
    display: block;
    border: none;
    width: 194px;
    height: 50px;
}

.jmms 
{    
    width: 85%;
    margin-top: 15%;
}

.PlansAndOps 
{
    width: 85%;
    margin-top: 5%;
}

.SecurityOffice_sm 
{
    width: 80%;
    margin-top: 7%;
}

.TMD_sm 
{
    width: 90%;
    margin-top: 7%;
}

.arrow {
    font-size: 12px;
    color: #333;
    position: absolute;
    right: 5px;
    top : 11px;
    line-height: 1px;
}

.aviation 
{
    width: 90%;
}

.medical 
{
    width: 90%;
}


.policyL
{
    width: 60px; 
    text-align: center; 
    line-height: 15px;
    font-size: 12px;
    font-weight: bold;
    display: table-cell;
}

.policyC
{
    width: 450px;
    text-align: left; 
    line-height: 15px;
    font-size: 12px;
    display: table-cell;
}

.policyR
{
    width: 160px;
    text-align: center; 
    line-height: 15px;
    font-size: 12px;
    display: table-cell;
    position: relative;
    font-weight: bold;
}

.row  
{
    display: table-row;
}

.cell
{
    display: table-cell;    
}

#container 
{
    display: table;
    width: 600px;
    margin-left: auto;
    margin-right: auto;
}

.fun
{
    width: 280px; 
    height: 16px;
    font-size: 12px;
    padding-top: 2px;
}

#footerOuter 
{
    border-left: 10px solid #ffffff;
    border-right: 10px solid #ffffff;
}


#footer {
    background-color: #4e4e4e;
    clear: both;
    color: #e3e3e3;
    font-size: 1.2em;
    padding: 5px 0px 15px 0px;
    overflow: auto;
    width: 996px;
    border-bottom: 10px solid #ffffff;
    /*border-left: 10px solid #ffffff;
    border-right: 10px solid #ffffff;*/
}

#footer a {
    color: #e3e3e3;
    font-weight: normal;
}
#footer ul {
    text-align: center;
}
#footer li {
    display: inline;
    margin-right: 1.4em;
}
#footerLeft, #footerMiddle, #footerRight {
    float: left;
}
#footerLeft, #footerRight {
    width: 200px;
}
#footerMiddle {
    margin: 2.8em 0 0;
    width: 576px;
}
#footerRight {
    text-align: right;
}
#footerRight a {
    color: #ffd54a;
}

/* TAB MENU   
----------------------------------------------------------*/

#NavigationMenu select
{
    display: none; 
}

div.DropDownNav
{
    background: #cfcfcf url(../rv4_images/nav_gradient.gif) repeat-x;
    border-bottom: 1px solid #b6b6b6;
    height: 2.8em; 
    min-height: 28px;
    width: 100%;
    position: relative;
}

div.menu ul
{       
    list-style: none;
    width: auto;
    margin: 0;
    padding: 0;
    border-bottom-width: 0px;
    border-top-width: 0px;
    top: .5px;
    /*top: 0;*/
    line-height: 2.7em;
}

div.menu ul li ul
{   
    border-width: medium 1px 1px;
    border-style: none solid solid;
    border-color: #b6b6b6;
    z-index: 999;
}

div.menu ul li a, div.menu ul li a:visited
{   
    background: url(../rv4_images/drop_down_border1.gif) no-repeat right;
    color: #333;
    display: block;
    padding-left: 20px;
    padding-right: 20px;
    margin-right: -1px;
    text-decoration: none;
    white-space: nowrap;
    z-index: 999;
}

div.menu ul li ul li a, div.menu ul li ul li a:visited
{   
    background-image: none;
    background-color: #cfcfcf;
    border-top: none;
    /*line-height: 2.2em;*/
    overflow: auto;
}

#NavigationMenu\:submenu\:39 
{
    width: 30em;
}

#NavigationMenu\:submenu\:39 li:nth-child(2)
{
    display: block;
}

#NavigationMenu\:submenu\:39 li:nth-child(2) a
{
    line-height: 1.35em;
    white-space: normal;    
}


div.menu ul li a:hover
{
    background: url(../rv4_images/nav_hover_gradient.gif) repeat-x;
    background-position: inherit;
    color: #7b8738;    
    text-decoration: none;
}

div.menu ul li a:active
{
    background: url(../rv4_images/nav_hover_gradient.gif) repeat-x;
    color: #7b8738;  
    text-decoration: none;
}

#mainContent #MainContent_TMDMenuTop ul, 
#mainContent #MainContent_TMDMenuMid ul,
#mainContent #MainContent_TMDBottom ul
{
    font-size: 100%;
    padding-left: 0px;
    padding-right: 0px;
}


#MainContent_TMDMenuTop, #MainContent_TMDMenuTop ul, 
#MainContent_TMDMenuMid, #MainContent_TMDMenuMid ul, 
#MainContent_TMDBottom, #MainContent_TMDBottom ul
{
    width: 100%;
}

#MainContent_TMDMenuTop > ul > li, 
#MainContent_TMDMenuMid > ul > li, 
#MainContent_TMDBottom > ul > li
{
    width: 201px;
    text-align: center;
}

#MainContent_TMDMenuTop > ul > li > ul, 
#MainContent_TMDMenuMid > ul > li > ul, 
#MainContent_TMDBottom > ul > li > ul
{
    width: auto;
    min-width: 201px;
    text-align: center;
}

#MainContent_TMDMenuTop ul > li ul li, 
#MainContent_TMDMenuMid ul > li ul li, 
#MainContent_TMDBottom ul > li ul li
{    
    text-align: left;
}

#MainContent_TMDMenuTop.menu ul li ul, 
#MainContent_TMDMenuMid.menu ul li ul, 
#MainContent_TMDBottom.menu ul li ul 
{
    border-bottom: medium 2px 2px;
}


  

.level2 
{
    margin-left: -1px;
    border-width: medium 1px 1px;
    border-style: none solid none;
    border-color: #b6b6b6;
    z-index: 999;
}

.level3
{
    margin-bottom: -1px;    
}

/* FORM ELEMENTS   
----------------------------------------------------------*/

fieldset
{
    margin: 1em 0px;
    padding: 1em;
    border: 1px solid #ccc;
}

fieldset p 
{
    margin: 2px 12px 10px 10px;
}

fieldset.login label, fieldset.register label, fieldset.changePassword label
{
    display: block;
}

fieldset label.inline 
{
    display: inline;
}

legend 
{
    font-size: 1.1em;
    font-weight: 600;
    padding: 2px 4px 8px 4px;
}

input.textEntry 
{
    width: 320px;
    border: 1px solid #ccc;
}

div.accountInfo
{
    width: 42%;
}

/* MISC  
----------------------------------------------------------*/

.clear
{
    clear: both;
}

.title
{
    display: block;
    float: left;
    text-align: left;
    width: 100%;
}

.title_headerImg
{   
    background: url(../Images/FortDixASABanner.png) no-repeat;
    height: 151px;
    width: 996px;
}

.title_headerImg a.mapArmy 
{
    clear: both;
    width: 10%;
    padding-top: 14%;
    display: block;
    border: none;
    /*border: 1px solid green;*/
    position: absolute;
    top: 0;
}

.title_headerImg a.mapDix 
{
    width: 89.8%;
    margin-left: 10%;
    padding-top: 14%;
    display: block;
    border: none;
    /*border: 1px solid green;*/
    /*position: absolute;*/
    top: 0;
}

.imageResize
{
    display: none;
    height: 0px;
    width: 0px;    
}

.failureNotification
{
    font-size: 1.2em;
    color: Red;
}

.bold
{
    font-weight: bold;
}

#leftCol {
    background: #c2c2c2;
    float: left;
    width: 196px;
}
#leftCol .rss, #leftCol .podcasts {
    margin-left: 10px;
}
#leftColNav li {
    font-size: 11px;
    line-height: 2.8em;    
}
#leftColNav .l3 {
    background: #fff;
}
#leftColNav .l3 a
{
    border-left: 1px solid #c2c2c2;
    font-size: 10px;
    line-height: 15px; 
    padding-left: 10px;
}

#leftColNav .level4 {
    background: #fff;
    border-top: 1px solid #c2c2c2;
}
#leftColNav .level4 a {
    font-weight: normal;
    line-height: 15px;
}
#leftColNav .level4 a:hover {
    background: none;
    color: #3d3d3d;
}
#leftColNav li a.current {
    background: #4e4e4e;
    color: #fff;
}

.leftColNavliacurrent1 {
    background: rgb(161, 161, 161);
    color: #3d3d3d;
}

.leftColNavliacurrent2 {
    background: #4e4e4e;
    color: #fff;    
}

#leftColNav li a.current:hover {
    background: #4e4e4e;
    color: #fff;
}
#leftColNav li a.subNav {
    font-weight: normal;
    border-top: 1px solid #c2c2c2;
}
#leftColNav li a.subNav:hover {
    background: #f7f7f7;
    color: #3d3d3d;
}
#leftColNav li#last {
    border-bottom: 1px solid #939393;
    margin: 0.2em 5px 0;
}
#leftColNav li#sections {
    background: #a1a1a1;
    font-weight: bold;
    padding: 0 10px;
}
#leftColNav li a {
    display: block;
    padding: 0 10px;
    width: 176px;
}
#leftColNav li a:hover, #leftColNav li a.subNav:hover {
    background-color: #b4b4b4;
    color: #7b8738;
}

#leftColRSS {
    padding: 1em 0;
    margin-bottom: 2em;
}

#SideBarMenu li {
    font-size: 11px;
    line-height: 2.8em;
}

#mainContent {
    background: #f7f7f7;
    float: left;
    padding-bottom: 10px;
    width: 604px;
    min-height: 500px;
    /*clear: right;*/
}

#mainContent2 {
    background: #f7f7f7;
    float: left;
    padding-bottom: 10px;
    width: 604px;
    min-height: 500px;
    /*clear: right;*/
}

#mainContent h1, #mainContent h2 {
    padding: 8px 10px;
}

#mainContent p, #rightCol p {
    padding: 0 10px;
}

#mainContent ul {
    font-size: 1.1em;
    padding-left: 10px;
    padding-right: 10px;
}

#rightCol {
    display: inline;
    float: right;
    width: 196px;
}

#rightCol h2 {
    clear: both;
}
#rightCol ul {
    margin: 1em 0 1em 10px;
}
#rightCol li 
{
    background: url(../rv4_images/diamond_bullet.gif) no-repeat 0px 2px;
    background-size: 5px 5px;
    line-height: 1.1em;
    margin: 0.5em 0;
    padding-left: 8px;
    font-size: 10px;
}
#rightCol li a {
    display: block;
}

#contentBackground {
    background: url(../rv4_images/3column.gif) repeat-y;
    width: 996px;
    overflow: hidden;
    clear: both;
    border-left: 10px solid white;
    border-right: 10px solid white;
}

/* CSS Sprite Icons */
.rss {background: url(../images/icon_sprites.gif)           2px -114px no-repeat;}
.podcasts {background: url(../images/icon_sprites.gif)      0px -133px no-repeat;}
.youtubeSprite {background: url(../images/icon_sprites.gif)      0px -38px no-repeat;}

/* 4. Classes
------------------------------------*/
.block {
    clear: both;
    color: #fff;
    font-size: 11px;
    height: 26px;
    line-height: 26px;
    padding-left: 10px;
    text-transform: uppercase;
}

.bold {
    font-weight: bold;
}

.bordered {
    background: #fff;
    border-top: 1px solid #9b9b9b;
    border-bottom: 1px solid #9b9b9b;
}

.borderThin
{
    height: 0px; 
    width: 560px; 
    margin: 0px auto 0px auto;
}

.centered {
	padding-left: 0;
    text-align: center;
}

.strike 
{
    text-decoration: line-through;
}

.dark-gray {
    background: #4e4e4e;
}
.dark-red {
    background: #af2020;
}
.dark-green {
    background: #0E4E36;
}

.greenArmy
{
    background-color: #7B8738;
}

.diamondList li {
    background: url(../rv4_images/diamond_bullet.gif) no-repeat 0 2px;
    padding-left: 16px;
    margin: 12px 0;
}
.hide {
    display: none;
}
.hide2 {
    position:absolute;
    left:0px;
    top:-500px;
    width:1px;
    height:1px;
    overflow:hidden;
}
.icon_sprite {
    display: block;
    float: left;
    height: 19px;
    margin: 0 4px;
    width: 19px;
}
.light-gray {
    background: #c0c0c0;
    color: #565656;
}

.white 
{
    background: white;
}

.grid {	
	background-color: rgb(194, 194, 194);
	display:inline-block;
	cursor:pointer;
	color: #3d3d3d;
	font-family:arial;
	font-size:13px;
	font-weight:bold;
	/*width: 135px;*/	
    width: 100%;
	margin-top: 5px;
	text-align: center;	
}

.grid:hover {
	background-color: #4e4e4e;
	color: #7b8738;
	border-top: 1px solid #333333;
    border-right: 1px solid #CCCCCC;
    border-bottom: 1px solid #CCCCCC;
    border-left: 1px solid #333333;
    border-radius: 5px;
}


.gridBorder
{
    border-top: 1px solid #CCCCCC;
    border-right: 1px solid #333333;
    border-bottom: 1px solid #333333;
    border-left: 1px solid #CCCCCC;
    border-radius: 5px;
}

.yellow
{
    background: #ffcc00;
    color: #565656;
}
.rss, .podcasts {
    display: inline-block;
    height: 19px;
    line-height: 19px;
    margin: 0.4em 0;
}

.youtubeSprite {
    display: block;
    height: 20px;
    line-height: 20px;
    margin: 0px 0 0 30px;
}

.rss .textLink, .podcasts .textLink, #email .textLink, #print .textLink {
    margin-left: 24px;
}

.mainRow
{
    height: 200px;    
} 

.rowEndColumn
{
    float: left;
    width: 201px;
    text-align: center;
}

.rowCenterColumn
{
    float: left;
    width: 202px;    
    text-align: center;
}

.leftRef {
    height:150px; 
    /*width: 200px;*/ 
    width: 100%;
    padding-top: 5px; 
    float: left;
}

.centerRef
{   
    height:150px; 
    /*width: 201px;*/ 
    width: 100%;
    padding-top: 5px; 
    float: left; 
    border-left: 1px solid #c2c2c2;
}

.rightRef
{
    height:150px; 
    /*width: 200px;*/ 
    width: 100%;
    padding-top: 5px; 
    padding-top: 5px; 
    float: left; 
    border-left: 1px solid #c2c2c2;
}

.leftBorder
{
    border-left: 1px solid #c2c2c2;
}

.h2Bottom
{
   position: absolute;
   bottom: 0px;
   width: inherit;
}

.sliderWrapper
{
    position: relative; 
    float: left;
    width: 604px; 
    height: 300px;
}

.sliderInnerWrapper
{
    cursor: move; 
    position: absolute; 
    left: 0px; 
    top: 0px; 
    width:604px; 
    height:300px; 
    overflow: hidden;
}

.sliderCaptionL
{
    position: absolute; 
    top: 204px; 
    left: 0px; 
    width: 604px; 
    height: 85px;
}

.sliderCaptionOpacityL
{
    position: absolute; 
    top: 0px; 
    left: 0px; 
    width: 604px; 
    height: 108px; 
    background-color: black; 
    opacity: 0.5; 
    filter: alpha(opacity=50);
}


.sliderCaption 
{
    position: absolute; 
    top: 239px; 
    left: 0px; 
    width: 604px; 
    height: 50px;
}

.sliderCaptionOpacity
{
    position: absolute; 
    top: 0px; 
    left: 0px; 
    width: 604px; 
    height: 63px; 
    background-color: black; 
    opacity: 0.5; 
    filter: alpha(opacity=50);
}

.sliderCaptionPosition 
{
    position: absolute; 
    top: 0px; 
    left: 5px; 
    width: 604px; 
    height: 33px; 
    color: black; 
    font-size: 12px; 
    line-height: 15px; 
    text-align: left; 
    color: white
}

.mainFirstRowButtons 
{
    float: left; 
    width: 90%;
    margin-top: 10px; 
    margin-bottom: 0px;
    margin-left: 5%;
    margin-right: 5%;
    z-index: 999;
}

.mainSecondRowButtons 
{
    width: 90%;
    margin-left: 5%;
    margin-right: 5%;
    z-index: 999;
}

.rowButtons 
{
    width: 24.5%;
    margin-right: .5%;
}

.sharpFirstRowButtons 
{
    float: left; 
    width: 70%;
    margin-top: 10px; 
    margin-bottom: 0px;
    margin-left: 15%;
    margin-right: 15%;
    z-index: 999;
}


.sharpSecondRowButtons 
{
    width: 70%;
    margin-left: 15%;
    margin-right: 15%;
    z-index: 999;
}

.sharpRowButtons 
{
    width: 32%;
    /*margin-left: 17.5%;*/
    margin-right: 1%;
}

.h1JAD 
{
    float: right; 
    width: 314px;
}

.h1CSM
{
    float: right; 
    width: 314px;
}

.h1Commander 
{
    float: right; 
    width: 53%;
    text-align: center;
}

#mainContent p.pDorothea, #mainContent p.pRichard, #mainContent p.pDrew
{ 
    padding-top: 200px;  
    padding-left: 186px;
}

#mainContent p.pDrewQuote
{
    margin-top: 0;  
    padding-left: 216px; 
    padding-right: 70px;
}

#mainContent h2.legal
{
    margin-bottom: 10px; 
    padding-top: 0px; 
    padding-bottom: 0px
}

#mainContent h2.legal2lines 
{
    line-height: 13px; 
    height: 26px;
}

.DHRM
{
    float: left;
    clear: both;
}

#mainContent h2.DHRMH2 
{
    margin-bottom: 10px; 
    padding-top: 0px; 
    padding-bottom: 0px
}

.LegalClaims 
{   
    margin-top: 18%;
    width: 95%;
}

.LegalBooks 
{
    width: 70%;
}

.LegalAssistance 
{
    width: 70%;
}

.LegalMJD 
{
    width: 85%;
}

.LegalSpecVic
{
    margin-top: 2%;
    width: 80%;
}


.LegalTrial 
{
    width: 60%;
}

.DHRMAER
{
    width: 130px; 
    /*width: 70%;*/
    height: 130px; 
    padding: 5px;
}

.AERHeader 
{
    height: 170px; 
    width: 604px;
}

div.AERHeader div
{
    width: 170px; 
    height: 170px; 
    padding-left: 200px; 
    float: left;
}

div.AERHeader img
{
    width: 150px; 
    height: 150px; 
    padding:5px; 
    float: left;
}

.DHRMASAP 
{
    width: 175px; 
    height: 75px; 
    padding: 25px 5px 0px 5px;
}

.ASAPHeader
{
    height: 170px; 
    width: 604px; 
    background-color: #fff;
}

div.ASAPHeader img 
{
    width: 260px; 
    height: 110px; 
    padding:30px; 
    display: block; 
    margin-left: auto; 
    margin-right: auto;
}

.DHRMCA 
{
    width: 175px; 
    height: 75px; 
    padding: 25px 5px 5px 5px;
}

.CAHeader 
{
    height: 170px; 
    width: 604px;
}

div.CAHeader img
{
    width: 550px; 
    height: 140px; 
    padding:15px; 
    display: block; 
    margin-left: auto; 
    margin-right: auto;
}

.CABody 
{
    float: right; 
    width: 415px;
}

div.CAh2
{
    clear: both; 
    float: left;
    width: 100%;
}

.DHRMDirector 
{
    width: 175px; 
    height: 75px; 
    padding: 25px 5px 5px 5px;
}

.DHRMDirHeader 
{
    width: 604px; 
    height: 100px;
}

div.DHRMDirHeader h1
{
    width: 390px; 
    height: 0px; 
    font-size: 2.4em; 
    padding-left: 17px; 
    padding-bottom: 5px; 
    float: left;
}

div.DHRMDirHeader img 
{
    width: 180px; 
    height: 90px; 
    float: right; 
    padding-right: 5px; 
    padding-top: 5px;
}

.DHRMED 
{
    width: 120px; 
    height: 125px; 
    padding-top: 10px
}

div.DHRMEDHeader 
{
    height: auto; 
    width: 604px;
    float: left;
}

div.DHRMEDHeader img 
{
    width: 570px; 
    height: 160px;
    padding:5px; 
    display: block; 
    margin-left: auto; 
    margin-right: auto;
}

div.DHRMEDHeader h1
{
    width: 584px; 
    font-size: 2.4em; 
    padding-bottom: 15px; 
    padding-left: 0px; 
    padding-right: 0px; 
    float: left;
}

div.DHRMEDHeader p
{
    padding-left: 10px; 
    padding-top: 15px; 
    margin-bottom: 10px;
}

.DHRMEDRow1 
{
    width: 604px; 
    float: left;
}

div.DHRMEDRow1 > div.rowLeft, div.DHRMEDRow1 > div.rowRight
{
    width: 302px;
    height: auto;
    float: left;
}

div.rowLeft div 
{
    width: inherit; 
    height: 214px;
}

div.rowRight div 
{
    width: inherit; 
    height: 195px;
}

div.rowRight p 
{
    padding-left: 5px; 
    padding-top: 25px;
}

.rowLeft 
{
    width: 50%;
    height: 105px;
    float: left;
}

.rowRight
{
    width: 50%;
    height: 105px;
    float: left;
}

.rowRightDPTM, .rowLeftDPTM
{
    width: 50%;
    height: 250px;
    float: left;
}


.DHRMEDRow2
{
    width: 604px; 
    float: left;
}

#mainContent div.DHRMEDRow1 h2, #mainContent div.DHRMEDRow2 h2 
{
    margin-bottom: 10px; 
    padding-top: 0px; 
    padding-bottom: 0px
}

#mainContent div.DHRMEDRow2 p 
{
    width: 230px; 
    padding-left: 5px; 
    float: left;
}


.DHRMFOIA 
{
    width: 195px; 
    height: 90px; 
    padding-top: 20px;
}

.DHRMID
{
    width: 90px; 
    height: 125px; 
    padding-top: 10px;
}

.DHRMIDCards
{
    width: 95%; 
    padding: 2% 0 5% 5%; 
    height: auto;
}

.DHRMIDCards div
{
    float: left;
    width: 50%;
}

.DHRMIDCards img
{
    width: 97px; 
    height: 140px; 
    float: left;
    padding-bottom: 2%;
}

.DHRMIDCards p 
{
    margin-top: 25%;
}

.DHRMIDCards h1
{
    width: 50%; 
    font-size: 2.4em; 
    padding: 65px 0px 0px 17px; 
    float: left;
}

.DHRM_MP
{
    width: 165px; 
    height: 105px; 
    padding-top: 5px;
}

.DHRM_MPHeader
{
    width: 90%; 
    padding: 2% 5% 2% 5%;
}

.DHRM_MPHeader img 
{
    display: block; 
    margin-left: auto; 
    margin-right: auto;
}

.DHRMMOB
{
    width: 165px; 
    height: 115px; 
    padding-top: 10px;
}

.DHRMMOBHeader 
{
    width: 90%; 
    height: auto;
    padding: 3% 5% 3% 5%;     
}

.DHRMMOBHeader img
{
    width: 210px; 
    height: 140px; 
    float: left;
}

#mainContent .DHRMMOBHeader h1
{
    width: 280px; 
    font-size: 2.4em; 
    padding: 5px 0px 0px 17px; 
    float: left;
}

.DHRMPassPort 
{
    width: 115px; 
    height: 135px;
}

.DHRMPassPortHeader 
{
    width: 98%; 
    height: auto;
    padding: 2% 0px 2% 2%; 
}

.DHRMPassPortHeader div.cell2 
{
     width: 75%;
}

.DHRMPassPortHeader img 
{
    width: 137px; 
    height: 170px; 
    float: left;
}

.DHRMPassPortBody 
{
    width: 100%;
}

#mainContent div.DHRMPassPortBody p 
{
    width:96%; 
    padding-left: 4%; 
    margin-bottom: 0px;
    float: left;
}

.DHRMRecords 
{
    width: 135px; 
    height: 135px; 
    padding-top: 10px;
}

.DHRMRecordsHeader 
{
    width: 94%; 
    padding: 2% 0px 3% 3%; 
    height: auto;
}

.DHRMRecordsHeader div.cell1 img
{
    width: 140px; 
    height: 140px;
}

.DHRMRecordsHeader div.cell2 
{
    float: left; 
    width: 70%;
}

.DHRMRetirement 
{
    width: 165px;
    height: 115px;
    padding-top: 15px;
}

.DHRMRetireHeader 
{
    width: 97%; 
    padding: 3% 0px 3% 3%; 
    height: auto;
    float: left;
}

.DHRMRetireHeader img 
{
    width: 200px; 
    height: 140px;
}

.DHRMRetiredHeader h1 
{
    width: 55%; 
    font-size: 2.4em; 
    padding-left: 2%; 
    padding-right: 2%; 
    float: left;
}
    
.DHRMSHARP
{
    width: 195px; 
    height: 45px; 
    padding-top:45px;
}

#mainContent2 div.DHRMSHARPPage 
{
    background-image: url(../Images/Services/DHRM/Sharpbackground.jpg); 
    background-size: 800px 760px;
    width: 800px; 
    height: 760px;
}

.DHRMSHARPBody 
{
    width: 604px;
    float: left; 
}

.DHRMSHARPBody img
{
    width: 400px; 
    height: 62px; 
    padding:15px; 
    display: block; 
    margin-left: auto; 
    margin-right: auto;
}

.DHRMSFL 
{
    width: 185px; 
    height: 155px;
}

.DHRMSFLHeader 
{
    width: 94%; 
    padding: 3% 3% 3% 3%;
    height: 200px;
}

.DHRMSFLHeader img 
{
    width: 200px; 
    height: 180px;
}

.DHRMSFLHeader .cell1 
{
    float: left; 
    margin-right: 5px;
}

.DHRMSFLHeader .cell2
{
    float: right; 
    width: 354px;
    height: 200px;
}

.DHRMTASP 
{
    width: 115px; 
    height: 145px;
}

.DHRMTASPHeader
{
    width: 584; 
    padding: 10px 0px 10px 0px; 
    height: 260px;
}

.DHRMTASPHeader .cell1
{
    float: right; 
    width: 390px
}

#mainContent .DHRMTASPHeader .cell1h1 
{
    width: 95%; 
    font-size: 2.4em; 
    padding-left: 2%; 
    padding-right: 3%; 
    padding-top: 10%; 
    float: right;
}

.DHRMSurvivor 
{
    width: 145px; 
    height: 145px; 
    padding-top: 5px;
}

.DHRMSurvivorHeader 
{
    width: 96%; 
    padding: 3% 2% 3% 2%; 
    height: auto;
}

.DHRMSurvivorHeader img
{
    width: 100%;
    height: auto;   
}

.DHRMAdditionalInfo 
{
    width: 196px; 
    float: left
}

#MainContent_grdFreqUsedNum > tbody tr:nth-child(1), 
#MainContent_grdFreqUsedNum > tbody tr:nth-child(2), 
#MainContent_grdFreqUsedNum > tbody tr:nth-child(3)
{
    font-weight: bold;
}

#MainContent_grdFreqUsedNum > tbody tr:nth-child(1) td
{
    font-size: 16px;
}

#MainContent_grdFreqUsedNum > tbody tr:nth-child(1) > td
{
    padding-left: 3%;
    padding-bottom: 3%
}

#MainContent_grdFreqUsedNum tbody tr td 
{
    width: 50%;
}

#MainContent_grdPOC tbody > tr:nth-child(1)
{
     font-weight: bold;     
}

#MainContent_grdPOC tbody > tr:nth-child(1) td 
{
    padding-top: 5px;
    font-size: 1.1em;
    line-height: 1.5em;
    margin: 0px;
}

#MainContent_grdPOC tbody > tr.bold td
{
    padding: 5px 5px 5px 0px ;
    font-size: 1.1em;
    line-height: 1.5em;
    margin: 0px;
}



.LRCPOC_left
{
    text-align: right;
    padding-right: 5px;
    font-size: 0.9em;
    line-height: 1.4em;
    margin: 1.1em 0;
}

.LRCPOC_right
{
    text-align: left;
    font-size: 0.9em;
    line-height: 1.4em;
    margin: 1.1em 0;
}

#MainContent_grdArmyActivitiesL tbody > tr:nth-child(1), #MainContent_grdArmyActivitiesR tbody > tr:nth-child(1), 
#MainContent_grdSpecialStaff tbody > tr:nth-child(1), #MainContent_grdDirectorates tbody > tr:nth-child(1), 
#MainContent_grdUSASAFortDix tbody > tr:nth-child(1)
{
    display: none;
}

#MainContent_grdArmyActivitiesL td, #MainContent_grdArmyActivitiesR td, 
#MainContent_grdSpecialStaff td, #MainContent_grdDirectorates td, 
#MainContent_grdUSASAFortDix td
{   
    padding: 0px 10px 0px 30px; 
    line-height: 1.4em;
    font-size: 10px;
}

.TelephoneDirectory 
{
    clear: both; 
    float: left;
    width: 100%;
}

.TelephoneDirectory > div.rowLeft > div, .TelephoneDirectory > div.rowRight > div
{
    width: 100%;
}


/*
@media handheld and (max-device-width:1024px){
    #NavigationMenu ul 
    { 
        display: none; 
    }
    
    #NavigationMenu select
    {
        display: inline-block; 
    }
}
*/

@media screen and (max-device-width:1023px){
    #NavigationMenu ul 
    { 
        display: none; 
    }
    
    #NavigationMenu select
    {
        display: inline-block; 
    }
}

/*   ----------------------------------------------------  1024 SCREEN CHANGE ----------------------------------------------------    */
@media screen and (max-width:1023px){
    
    #contentBackground, .header, #footerOuter
    {
        border-left: none;
        border-right: none;
    }
    
    .page
    {
        width: 100%;
        background-color: #fff;
        margin: 0px auto 0px auto;
    }
        
    .leftCol
    {
        padding: 6px 0px;
        margin: 12px 8px 8px 8px;
        width: 200px;
        min-height: 200px;
    }
    
    .title_headerImg
    {   
        background-size: contain;
        padding-top: 15.16%; /* (img-height / img-width * width) which is (151px/996px * 100%) = 15.16% allows div to scale to image height when resizing*/
        height: 0;
        width: 100%;
    }
    
    .imageResize 
    {
        width: 100%;
        height: 100%;
        visibility: hidden;
    }
    
    .image-MCL, .image-DixFacebook, .image-JBMDL, .image-MWRJBMDL, .img-SeeSomthing
    {
        margin-left: auto;
        margin-right: auto;
        width: 100%;
    }
    
    .image-DixFacebook > a.map, .image-JBMDL > a.map, .image-MWRJBMDL > a.map
    {
        margin-left: auto;
        margin-right: auto;
    }
    
    .image-AORSmall
    {   
        background-size: contain;
        height: 0;
        width: 80%;
        padding-top: 66.67%; /* (img-height / img-width * width) which is (400px/480px * 100%) = 15.16% allows div to scale to image height when resizing*/
        padding-left: 10%;
        margin-left: auto;
        margin-right: auto;
        float: left;
        display: block;
        position: relative;
    }

    .image-AORSmall > a.map
    {
        clear: both;
        margin-left: auto;
        margin-right: auto;
        width: 80%;
        height: 100%;
        display: block;
        border: none;
        position: absolute;
        top: 0;        
    }

        
    .image-blankbackground 
    {
        background: url('../Images/Services/BlankBackground.JPG') no-repeat center;
        background-size: 90%;
        height: 0%;
        width: 99%;
        padding-top: 81%;
        border-left: 1px solid #c2c2c2;
    }

    .image-Humvee
    {   
        margin: auto;
    }
    
    .image-LRC 
    {
        width: 100%;
    }

    .DHRMAdditionalInfo 
    {
        width: 100%; 
        float: left;
    }
   

    .image-MCL2R 
    {        
        background: url('../Images/DefaultHome/MilitaryCrisisLine.png') no-repeat center;
        background-size: 90%;
        width: 100%;
        float: left;
        clear: both;
        display: block;
    }

    .image-MCL2R > a.map
    {        
        clear: both;
        float: left;
        /*border: 1px solid red;*/
        border: none;
        width: 99%;
        padding-top: 45%;
    }

    .image-Sharp1R
    {
        background: url('../Images/Services/DHRM/sharp.png') no-repeat center;
        background-size: 100%;
        width: 100%;        
        float: left;
        display: block;
        margin-top: 4%;
    }

    .image-Sharp1R > a.map
    {
        clear: both;
        display: block;
        /*border: 1px solid red;*/
    border: none;
        width: 99%;
        margin: auto;
        padding-top: 30%;
    }


    /*
    div.DropDownNav
    {
        background: #cfcfcf url(../rv4_images/nav_gradient.gif) repeat-x;
        border-bottom: 1px solid #b6b6b6;
        height: 2.8em;    
        min-height: 28px;
        height: 28px;
        width: 100%;
    }
    */
    
    #contentBackground 
    {
        background: none;
        width: 100%;
        clear: both;
    }
    
    #leftCol
    {   
        display: none;
    }
    
    #footer
    {
        background: #4e4e4e;
        clear: both;
        color: #e3e3e3;
        font-size: 1.2em;
        padding: 5px 0px 5px 0px;
        overflow: auto;
        width: 100%;
        border-bottom: 10px solid #ffffff;
        /*border-left: 10px solid white;
        border-right: 10px solid white;*/
    }
    
    #footerLeft, #footerRight {
    width: 20%;
    }

    #footerMiddle {
        margin: 2.8em 0 0;
        width: 57.6%;
    }
    
    #mainContent 
    {
        background: #f7f7f7;
        float: left;
        padding-bottom: 10px;
        width: 75%;
        min-height: 500px;
    }
    
    #mainContent2 {
        background: #f7f7f7;
        float: left;
        padding-bottom: 10px;
        width: 100%;
        min-height: 500px;
    }

    #rightCol 
    {
        float: left;
        width: 25%;
        min-width: 196px;
    }
    
    .sliderWrapper
    {
        position: relative; 
        width: 100%;
    }
    
    .sliderInnerWrapper
    {
        cursor: move; 
        position: absolute; 
        left: 0px; 
        top: 0px; 
        width:100%; 
        overflow: hidden;
    }
    
    .sliderInnerWrapper img 
    {
        width:100%;
    }
    
    .sliderCaption
    {
        position: absolute; 
        top: 80%; 
        left: 0px; 
        width: 100%;
        height: 50px;
    }

    .sliderCaptionOpacity
    {
        position: absolute; 
        top: 0px; 
        left: 0px; 
        width: 100%;
        background-color: black; 
        opacity: 0.5; 
        filter: alpha(opacity=50);
    }

    .sliderCaptionPosition 
    {
        position: absolute; 
        top: 0px; 
        left: 10px; 
        width: 100%;
        color: black; 
        font-size: 12px; 
        line-height: 15px; 
        text-align: left; 
        color: white
    }

    div.menu ul li a, div.menu ul li a:visited
    {   
        background: url(../rv4_images/drop_down_border1.gif) no-repeat right;
        color: #333;
        display: block;
        padding-left: 10px;
        padding-right: 10px;
        margin-right: -1px;
        text-decoration: none;
        white-space: nowrap;
        z-index: 999;
    }
    
    .mainFirstRowButtons 
    {
        float: left; 
        width: 90%;
        margin-top: 5%; 
        margin-bottom: 0px;
        margin-left: 5%;
        margin-right: 5%;
        z-index: 999;
    }

    .mainSecondRowButtons 
    {
        float: left;
        width: 90%; 
        margin-left: 5%;
        margin-right: 5%;
        z-index: 999;
    }
    
    .grid {	
	    background-color: rgb(194, 194, 194);
	    display:inline-block;
	    cursor:pointer;
	    color: #3d3d3d;
	    font-family:arial;
	    font-size:13px;
	    font-weight:bold;
	    width: 100%;
	    margin-top: 5px;
	    text-align: center;	
    }
    
    .rowButtons
    {
        width: 24.5%;
        margin-right: .5%;
    }
    
    .imgJAD 
    {
        float: left; 
        padding: 10px;
        width: 41%;
        height: auto;
        padding: 1% 1%;
    }
    
    .imgCommander, .imgCSM
    {
        float: left; 
        padding: 1%; 
        width: 41%; 
        height: auto;
    }

    #mainContent h1.h1JAD, #mainContent h1.h1Commander, #mainContent h1.h1CSM
    {
        float: left; 
        width: 50%;
        padding: 1% 1%;
    }
    
    .image-map
    {
          background-size: contain;
          width: 0px; 
          padding-left: 21%;  
          height: 0px;
          padding-top: 66%;
          display: block;
          position: relative;
          margin-left: 10px;
          float: left;
    }
    
    .Dorothea 
    {
        top: 0px; 
        left: 0px; 
        width: 85%; 
        height: 25%;
    }
 
    .Richard
    { 
        top: 25%; 
        left: 0px; 
        width: 85%; 
        height: 18%;
    }

    .Drew
    { 
        top: 43%; 
        left: 0px; 
        width: 85%; 
        height: 20%;
    }

    .History
    { 
        top: 63%; 
        left: 0px; 
        width: 85%; 
        height: 37%;
    }

    .image-map > a.map, .image-TelephoneChart1 > a.map, .image-TelephoneChart2 > a.map, .image-TelephoneChart3 > a.map
    {
        clear: both;
        position: absolute;
        display: block;
        border: none;
    }
    
    .imgDorothea, .imgRichard, .imgDrew
    {
        width: 80%;
        height: auto;
        /*height: 248px;*/
    }

    .divDorothea, .divRichard, .divDrew
    {
        width: 33%; 
        /*height: 268px; */
        height: auto;
        padding-left: 1%; 
        padding-right: 1%; 
        float: left;
    }

    #mainContent h1.h1Dorothea, #mainContent h1.h1Richard, #mainContent h1.h1Drew, #mainContent h1.h1TheNameDix
    {   
        float: right; 
        width: 65%; 
        padding-top: 2%;
    }
    
    #mainContent p.pDorothea, #mainContent p.pRichard, #mainContent p.pDrew
    { 
        padding-top: 35%;
        padding-left: 5%;
    }
    
    #mainContent p.pDrewQuote
    {
        padding-left: 10%; 
        padding-right: 10%;
    }

    .image-Security
    {
        clear: both;        
        background-size: contain;
        width: 63%;
        padding-top: 42%; /* (actual img-height / actual img-width * width%) which is (240px/360px * 63%) = 42% allows div to scale to image height when resizing*/
        height: 0;
        float: right;
    }
    
    .image-Ultimate1
    {   
        background-size: contain;
        width: 39.7%;
        padding-top: 61.16%; /* (actual img-height / actual img-width * width%) which is (360px/216px * 39.7%) = 61.16% allows div to scale to image height when resizing*/
        margin-right: 1%;
        margin-top: 1%;
        height: 0px;
        display: inline-block;
    }

    .image-Ultimate2
    {
        background-size: contain; /*285px 190px;*/
        width: 49.7%;  /* New width is calculated by dividing the original Div width of 300px by the original maincontent width of 604px (300px/604px = 49.66%)*/
        padding-top: 31.13%; /* (actual img-height / actual img-width * width%) which is (190px/285px * 49.7%) = 31.13% allows div to scale to image height when resizing*/
        height: 0px;
        margin-right: 5%;
    }

    .image-Ultimate3
    {   
        background-size: contain; /*285px 380px;*/
        width: 49.7%;
        padding-top: 62.27%; /* (actual img-height / actual img-width * width%) which is (380px/285px * 49.7%) = 31.13% allows div to scale to image height when resizing*/
        height: 0px;
    }
    
    #container 
    {
        width: 95%;
    }
    
    .policyL
    {
        width: 9%; 
    }

    .policyC
    {
        width: 76%;
    }

    .policyR
    {
        width: 15%;
    }
    
    .mainRow
    {
        width: 100%;
        height: auto;        
        float: left;
    } 
    
    .rowEndColumn
    {
        float: left;
        width: 33%;
        height: 100%;
        text-align: center;
    }
    
    .rowCenterColumn
    {
        float: left;
        width: 34%; 
        height: 100%;   
        text-align: center;
    }
    
    div.rowCenterColumn a.centerRef, div.rowEndColumn a.rightRef
    {
        width: 100%;
        height: auto;
        padding-bottom: 10%;
    }

    .rightRef 
    {
        height: 89px;
    }
    
    div.rowEndColumn a.leftRef
    {
        width: 100%;
        height: auto;
    }
    
        
    .DHRM
    {
        width: 100%;
    }
    
    .DHRMAER
    {
        width: 55%;
        height: auto;
    }
    
    .AERHeader 
    {   
        width: 100%;
        height: auto; 
    }

    div.AERHeader div
    {
        width: 100%; 
        height: auto; 
        padding-left: 37%; 
        float: left;
    }

    div.AERHeader img
    {
        width: 25%;
        height: auto;
        padding:5px; 
        float: left;
    }

    .DHRMASAP, .DHRMCA
    {
        width: 90%; 
        height: auto; 
        padding: 13% 1% 0px 1%;
    }
    
    .ASAPHeader
    {
        height: auto; 
        width: 100%; 
        background-color: #fff;
    }

    div.ASAPHeader img 
    {
        width: 35%; 
        height: auto; 
        padding: 3%; 
        display: block; 
        margin-left: auto; 
        margin-right: auto;
    }
    
    .CAHeader 
    {
        height: auto; 
        width: 100%;
    }

    div.CAHeader img
    {
        width: 85%; 
        height: auto; 
        padding: 2%; 
        display: block; 
        margin-left: auto; 
        margin-right: auto;
    }
    
    .DHRMDirector 
    {
        width: 80%; 
        height: auto; 
        padding: 8% 1% 16% 1%;
    }
    
    .DHRMFOIA 
    {
        width: 90%; 
        height: auto; 
        padding: 13% 1% 11% 1%;
    }
 
    .DHRMED 
    {
        width: 45%; 
        height: auto; 
        padding: 8% 1% 0px 1%;
        margin-bottom: 10%;
    }
    
    div.DHRMEDHeader 
    {
        height: auto; 
        width: 100%;
        float: left;
    }

    div.DHRMEDHeader img 
    {
        width: 570px; 
        height: 160px;
        padding:5px; 
        display: block; 
        margin-left: auto; 
        margin-right: auto;
    }

    #mainContent div.DHRMEDHeader h1
    {
        width: 90%; 
        font-size: 2.4em; 
        padding-bottom: 1%; 
        padding-left: 5%; 
        padding-right: 5%; 
        float: left;
    }

    #mainContent div.DHRMEDHeader p
    {
        padding-left: 2%; 
        padding-top: 1%; 
        padding-bottom: 1%;
    }
    
    .DHRMEDRow1, .DHRMEDRow2
    {
        width: 100%; 
        float: left;
    }

    div.DHRMEDRow1 > div.rowLeft, div.DHRMEDRow1 > div.rowRight
    {
        width: 50%;
        height: auto;
        float: left;
    }

    div.rowLeft div 
    {
        width: 100%; 
        height: 100%;
    }

    div.rowRight div 
    {
        width: 100%;
        height: 100%;
    }

    #mainContent div.rowRight p
    {
        padding-left: 2%; 
        padding-top: 3%;
        padding-bottom: 35%;
    }
    
    #mainContent div.DHRMEDRow2 p 
    {
        /*
        width: 230px; 
        padding-left: 5px; 
        float: left;
        */
        width: 35%;
        padding-left: 2%;
        float: left;
    }
    
    .DHRMID
    {
        width: 35%;
        height: auto;
        padding: 0% 1% 6% 1%;
    }
    
    .DHRM_MP
    {
        width: 80%;
        height: auto;
        padding: 10% 1% 10% 1%;
    }
 
    .DHRMMOB
    {
        width: 70%;
        height: auto;
        padding: 4% 1% 1% 1%;
    }
    
    .DHRMPassPort 
    {
        width: 43%;
        height: auto;
        padding: 0% 1% 0% 1%;
    }
    
    .DHRMRecords 
    {
        width: 63%;
        height: auto;
        padding: 0% 1% 0% 1%;
    }
    
    .DHRMRetirement 
    {
        width: 85%;
        height: auto;
        padding: 9% 1% 6% 1%;
    }
    
    .DHRMSHARP 
    {
        width: 85%;
        height: auto;
        padding: 30% 1% 20% 1%;
    }
    
    #mainContent2 div.DHRMSHARPPage 
    {
        background-size: 1024px 1368px;
        width: 100%; 
        height: 1368;
    }
    
    .DHRMSHARPBody 
    {
        width: 74.5%;
        float: left; 
    }

    .DHRMSHARPBody img
    {
        width: 60%; 
        height: auto; 
        padding:15px; 
        display: block; 
        margin-left: 20%; 
        margin-right: 20%;
    }
    
    #mainContent2 div#rightCol 
    {
        width: 25.5%;
        float: left; 
    }
    
    .youtubeSprite 
    {
        display: inline-block;
        width: 150px;
    }

    .DHRMSFL 
    {
        width: 72%;
        height: auto;
        padding: 0% 1% 4% 1%;
    }
    
    .DHRMSFLHeader 
    {
        width: 97%; 
        padding: 3% 0 3% 3%; 
        height: auto;
    }

    .DHRMSFLHeader img 
    {
        width: 200px; 
        height: 180px;
    }

    .DHRMSFLHeader .cell1 
    {
        width: 33%;
        margin-right: 2%;
    }

    .DHRMSFLHeader .cell2
    {   
        width: 65%;
        height: auto;        
    }
    
    .DHRMTASP 
    {
        width: 55%;
        height: auto;
        padding: 0% 1% 0% 1%;
    }
    
    .DHRMTASPHeader
    {
        width: 100%; 
        padding: 0%; /*3% 0px 10px 10px; */
        height: auto;
    }

    .DHRMTASPHeader .cell1 
    {
        float: right; 
        width: 60%;
    }
    
    .DHRMTASPHeader .image-Sponsorhip
    {
        width: 40%;
    }

    .DHRMSurvivor 
    {
        width: 65%;
        height: auto;
        padding: 0% 1% 0% 1%;
    }
    
    .scroll-text {
        width: 90%;
        height: 200px;
        overflow: hidden;
    }
    .scroll-text ul {
        width: 100%;
        height: 550px;
        overflow: hidden;
    }
    .scroll-text ul li {
        padding-bottom: 15px;
    }
    
    
}

/*   ----------------------------------------------------  806 SCREEN CHANGE ----------------------------------------------------    */
@media screen and (max-width:806px) {

    #contentBackground, .header 
    {
        border-left: none;
        border-right: none;
    }
        

    #rightCol {
        float: left;
        width: 100%;
    }

    #mainContent {
        background: #f7f7f7;
        float: left;
        padding-bottom: 10px;
        width: 100%;
        min-height: 500px;
    }

    .image-MCL {
        margin-left: auto;
        margin-right: auto;
        width: 50%;
    }

    .img-SeeSomthing {
        margin-left: auto;
        margin-right: auto;
        width: 100%;
    }

    .image-MWRJBMDL, .image-SuicidePrevention, .image-iSalute 
    {
        margin-left: auto;
        margin-right: auto;
        width: 33%;
    }

    .image-MCL2R 
    {
        width: 50%;
        background-size: 60%;
    }

    .image-MCL2R > a.map 
    {
        padding-top: 33%;
        width: 70%;
        margin-left: 15%;
        margin-right: 15%;
    }

    .image-Sharp1R
    {        
        width: 49%;
        background-size: 60%;
    }

    .image-Sharp1R > a.map 
    {
        padding-top: 20%;
        width: 90%;
        margin-left: 5%;
        margin-right: 5%;
    }

    .image-DixFacebook {
        margin-left: 33%;
        margin-right: 33%;
        width: 33%;
    }

    .image-iSalute 
    {
        margin-top: 1%;
    }

    .image-iSalute > a.map 
    {
        padding-top: 43%;
    }

    .image-JBMDL
    {
        margin-left: auto;
        margin-right: auto;
        width: 34%;
    }
    
    .image-HonorGuard
    {   
        background-size: contain;
        width: 25%;
        height: 0;
        padding-top: 25%; /*(img-height / img-width * width) which is (177px/177px * 25%) = 25% allows div to scale to image height when resizing*/
        float: left;
        display: block;
    }
    
    .image-LRC 
    {
        background-size: contain;
        width: 100%;
        height: 0;
        padding-top: 42%; 
        margin: auto;
        float: left;
    }
    
    .image-Humvee
    {
        background-size: contain;
        width: 100%;
        height: 0;
        padding-top: 30%;
        text-align: center;
    }

    
    .CABody 
    {
        float: right; 
        width: 75%;
    }
   
        
    #mainContent h2.calendarh2 
    {
        padding: 0% 0% 0% 0%; 
        line-height: 16px; 
        height: 32px;         
    }

    .DHRMAdditionalInfo 
    {
        width: 50%; 
        float: left;
    }
    
    .sliderWrapper
    {
        position: relative; 
        width: 100%;
    }
    
    .sliderInnerWrapper
    {
        cursor: move; 
        position: absolute; 
        left: 0px; 
        top: 0px; 
        width:100%; 
        overflow: hidden;
    }
    
    .sliderInnerWrapper img 
    {
        width:100%;
    }
    
    .sliderCaption 
    {
        position: absolute; 
        top: 80%; 
        left: 0px; 
        width: 100%;
        height: 50px;
    }

    .sliderCaptionOpacity
    {
        position: absolute; 
        top: 0px; 
        left: 0px; 
        width: 100%;
        background-color: black; 
        opacity: 0.5; 
        filter: alpha(opacity=50);
    }

    .sliderCaptionPosition 
    {
        position: absolute; 
        top: 0px; 
        left: 10px; 
        width: 100%;
        color: black; 
        font-size: 12px; 
        line-height: 15px; 
        text-align: left; 
        color: white
    }
    
    .scroll-text {
        width: 95%;
        height: 200px;
        overflow: hidden;
    }
    .scroll-text ul {
        width: 100%;
        height: 550px;
        overflow: hidden;
    }
    .scroll-text ul li {
        padding-bottom: 15px;
    }
    
    .mainFirstRowButtons 
    {
        float: left; 
        width: 90%; 
        margin-top: 5%; 
        margin-bottom: 0px;
        z-index: 999;
    }

    .mainSecondRowButtons 
    {
        float: left;
        width: 90%;
        z-index: 999;
    }
    
    .grid {	
	    background-color: rgb(194, 194, 194);
	    display:inline-block;
	    cursor:pointer;
	    color: #3d3d3d;
	    font-family:arial;
	    font-size:13px;
	    font-weight:bold;
	    width: 100%;
	    margin-top: 5px;
	    text-align: center;	
    }
    
    .rowButtons
    {
        width: 24.5%;
        margin-right: .5%;
    }

    .DHRMDirHeader 
    {
        width: 100%; 
        height: auto;
        float: left;
    }

    div.DHRMDirHeader h1
    {
        width: 60%; 
        height: auto; 
        font-size: 2.4em;
        float: left;
    }

    div.DHRMDirHeader img 
    {
        width: 28%; 
        height: auto; 
        float: right; 
        padding-right: 5%; 
        padding-bottom: 1%;
    }
        
}


@media screen and (max-width:800px)
{
    #NavigationMenu ul 
    { 
        display: none; 
    }
    
    #NavigationMenu select
    {
        display: inline-block; 
    }
    
    div.mainFirstRowButtons a, div.mainSecondRowButtons a
    {
        font-size: 10px;
    }
    
    .DHRMIDCards img
    {
        width: 25%; 
        height: auto; 
    }
    
    #mainContent .DHRMIDCards h1 
    {
        width: 69%;
        text-align: center;
        padding: 5% 3% 5% 3%;
    }
    
    #mainContent2 div.DHRMSHARPPage 
    {
        width: 100%;
        height: 1368px;
    }

    .DHRMSHARPBody 
    {
        width: 100%;
        float: left; 
    }

    .DHRMSHARPBody img
    {
        width: 60%; 
        height: auto; 
        padding: 3%; 
        display: block; 
        margin-left: 20%; 
        margin-right: 20%;
    }
    
    #mainContent2 div#rightCol 
    {
        width: 100%;
        float: left; 
    }
    
}


/*   ----------------------------------------------------  600 SCREEN CHANGE ----------------------------------------------------    */
@media screen and (max-width:600px)
{
    #mainContent 
    {
        background: #f7f7f7;
        float: left;
        padding-bottom: 10px;
        width: 100%;
        min-height: 500px;
    }
    
     #rightCol 
    {
        float: left;
        width: 100%;
    }
    
    .image-FOIA 
    {
        background-size: contain;
        width: 60%;
        height: 0;
        padding-top: 22.69%;    /*(img-height / img-width * width) which is (138px/365px * 60%) = 22.69% allows div to scale to image height when resizing*/
        display: block;
        position: relative;
        margin-left: 20%;
        margin-right: 20%;
        margin-top: 1%;
    }
    
    .image-MCL
    {   
        background-size: contain;
        width: 50%;     
        padding-top: 59.33%;    /*(img-height / img-width * width) which is (197px/166px * 50%) = 59.33% allows div to scale to image height when resizing*/
        height: auto;
        display: block;
        float: left;
        margin-left: auto;
        margin-right: auto;
        position: relative;
    }

    .image-MCL > a.map, .image-JBMDL > a.map
    {
        clear: both;
        display: block;
        border: none;
        //border: 1px solid red;
        width: 100%; 
        height: 100%;
        top: 0;
        position: absolute;
        margin-left: auto;
        margin-right: auto;
    }
        
    .image-DixFacebook
    {   
        background-size: 80%;
        /*padding-top: 12.68%;*/    /*(img-height / img-width * width) which is (73px/190px * 33%) = 12.68% allows div to scale to image height when resizing*/
        width: 100%;
        margin: auto;
    }
    
    .image-iSalute 
    {
        background-size: 80%;
        width: 100%;
        margin-bottom: 1%;
    }

    .image-iSalute > a.map, .image-DixFacebook > a.map
    {
        padding-top: 40%;
    }

    .image-MCL2R 
    {
        background-size: 80%;
        width: 100%;
    }

    .image-MCL2R > a.map 
    {
        width: 90%;
        margin-left: 5%;
    }

    .image-Sharp1R
    {        
        background-size: 90%;
        width: 100%;        
    }

    .image-Sharp1R > a.map 
    {
        padding-top: 25%;
        width: 90%;
        margin-left: 5%;
        margin-right: 5%;
    }

    .img-SeeSomthing
    {
        background-size: contain;
        padding-top: 23.07%; /*(img-height / img-width * width) which is (133px/196px * 34%) = 23.07% allows div to scale to image height when resizing*/
        padding-left: 65%;  /*(img-height / img-width * width) which is (133px/196px * 34%) = 23.07% allows div to scale to image height when resizing*/
        width: 34%;
        height: 0;
        display: block;
        float: left;
        margin-left: auto;
        margin-right: auto;
    }

    
    .image-MWRJBMDL
    {        
        background-size: 80%;
        /*padding-top: 16.5%;*/    /*(img-height / img-width * width) which is (95px/190px * 33%) = 16.5% allows div to scale to image height when resizing*/
        width: 100%;
    }

    .image-MWRJBMDL > a.map
    {   
        border: none;
        /*border: 1px solid red;*/
        width: 99%;
        height: inherit;
        padding-top: 45%;        
    }

    .image-SuicidePrevention
    {
        background-size: 80%;
        width: 100%;
    }

    .image-SuicidePrevention > a.map
    {
        
        /*border: 1px solid red;*/
        border: none;
        width: 92%;
        margin: auto;
        padding-top: 40%;
    }
    
    .image-JBMDL
    {   
        background-size: contain;
        /*padding-top: 4.86%;*/    /*(img-height / img-width * width) which is (28px/196px * 34%) = 16.5% allows div to scale to image height when resizing*/
        width: 34%;
        /*height: 0;*/        
        display: block;
        float: left;
        margin-left: .5%;
        margin-right: .5%;
        position: relative;
    }
            
    div.mainFirstRowButtons 
    {
        float: left; 
        width: 98%; 
        margin-top: 5%; 
        margin-bottom: 0px;
        margin-left: 1%;
        margin-right: 1%;
        padding: 0;
        z-index: 999;
    }
    
    div.mainFirstRowButtons a, div.mainSecondRowButtons a
    {
        font-size: 10px;
    }
    
    div.mainSecondRowButtons 
    {
        float: left;
        width: 98%; 
        margin-top: 0px; 
        margin-bottom: 0px;
        margin-left: 1%;
        margin-right: 1%;
        padding: 0;
        z-index: 999;
    }
    
    div.DHRMDirHeader h1
    {
        width: 60%; 
        height: auto; 
        font-size: 1.8em;
        float: left;
    }
    
    .rowButtons
    {
        width: 24%;
        margin-right: 1%;
    }
    
    .grid {	
	    background-color: rgb(194, 194, 194);
	    display:inline-block;
	    cursor:pointer;
	    color: #3d3d3d;
	    font-family:arial;
	    font-size:13px;
	    font-weight:bold;
	    width: 100%;
	    margin-top: 5px;
	    text-align: center;	
    }
    
    .sliderCaptionPosition, .sliderCaptionOpacity
    {
        display: none;
    }
    
    .sliderWrapper
    {
        position: relative; 
        width: 100%;
        height: 49.6%;
        padding-top: 49.6%;
    }
    
    .sliderInnerWrapper
    {
        cursor: move; 
        position: absolute; 
        left: 0px; 
        top: 0px; 
        width:100%; 
        height: 100%;
        padding-top: 0%;
        overflow: hidden;
    }
    
    .sliderInnerWrapper img 
    {
        width:100%;
    }
    
    #mainContent h2.DHRMH2
    {
        font-size: 10px;
        line-height: 12px;
    }
    
    div.DHRMEDRow2 img 
    {
        background-size: contain;
        float: left;
        width: 50%;
    }
    
    div.DHRMEDHeader img 
    {
        width: 100%; 
        height: auto;
        padding: 1%; 
        display: block; 
        margin-left: auto; 
        margin-right: auto;
    }
    
     div.DHRMEDRow1 > div.rowLeft, div.DHRMEDRow1 > div.rowRight
    {
        width: 100%;
        height: auto;
        float: left;
    }
    
    .leftBorder 
    {
        border-left: none;
    }
    
    #mainContent div.rowRight p 
    {   
        padding-bottom: 5%;
    }
    
    .DHRMIDCards div
    {
        float: left;
        width: 100%;
    }

    .DHRM_MPHeader img 
    {
        width: 50%;
        height: auto;
        margin-left: 25%; 
        margin-right: 25%;
    }
    
    .DHRMMOBHeader img
    {
        width: 40%; 
        height: auto;
        margin: 2% 30% 2% 30%;
    }

    #mainContent .DHRMMOBHeader h1
    {
        width: 97%; 
        font-size: 2.4em; 
        padding: 2% 3% 2% 0; 
        float: left;
    }
    
    .DHRMPassPortHeader div, .DHRMPassPortHeader div.cell2 
    {
        width: 98%; 
        height: auto;
        padding: 2% 0px 2% 2%; 
    }

    .DHRMPassPortHeader img 
    {
        width: 30%; 
        height: auto;
        margin: 2% 35% 2% 35%
    }
    
    .block 
    {
        line-height: 13px;
    }
    
    .DHRMRecordsHeader div.cell1
    {
        width: 100%;
    }
    .DHRMRecordsHeader div.cell1 img
    {
        width: 30%;
        height: auto;
        margin: 3% 35% 2% 35%;
    }
    
    .DHRMRecordsHeader div.cell2 
    {
        float: left; 
        width: 100%;
    }
    
    .DHRMRetireHeader
    {
        width: 100%;
        padding-left: 0;
    }
    .DHRMRetireHeader img 
    {
        width: 50%; 
        height: auto;
        margin: 3% 25% 3% 25%;
    }
    
    .DHRMRetireHeader > div 
    {
        width: 100%;
    }

    #mainContent .DHRMRetireHeader h1 
    {
        width: 98%; 
        font-size: 2.4em; 
        padding-left: 2%; 
        padding-right: 2%; 
        float: left;
    }

    #mainContent2 div.DHRMSHARPPage 
    {
        width: 100%;
        height: 1100px;
    }
    
    .DHRMSFLHeader 
    {
        width: 100%; 
        padding: 0; 
        height: auto;
    }
    
    .DHRMSFLHeader img 
    {
        width: 36%; 
        height: auto;
        margin-left: 33%;
        margin-right: 41%;
    }

    .DHRMSFLHeader .cell1 
    {
        width: 100%;
        margin-right: 0;
    }

    .DHRMSFLHeader .cell2
    {
        width: 100%;
        height: auto;
        float: left;
    }
    
    .DHRMTASPHeader .cell1 
    {
        float: left; 
        width: 100%;
    }
    
    .DHRMTASPHeader .image-Sponsorhip
    {
        background-size: contain;
        width: 40%;
        height: 0;
        padding-top: 60.24%; /*(img-height / img-width * width) which is (250px/166px * 40%) = 16.5% allows div to scale to image height when resizing*/
        margin-left: 30%;
        margin-right: 30%;
        float: left;
    }
    
    #mainContent .DHRMTASPHeader .cell1h1 
    {   
        padding-top: 3%; 
    }
    
    #MainContent_grdFreqUsedNum tbody tr td 
    {
        width: 50%;
    }
    
    #MainContent_grdFreqUsedNum tbody tr td:nth-child(2)
    {
        text-align: center;
    }
    
    #MainContent_grdFreqUsedNum > tbody tr:nth-child(1) > td
    {
        padding-left: 0px;
    }
    
    .fun 
    {
        width: 100%;
    }
    
    .rowLeft, .rowRight
    {
        width: 100%;
        height: auto;
        float: left;
    }
    
    div.rowLeft p 
    {
        padding-bottom: 0px;
        margin-bottom: 0px;
    }
    
    #mainContent div div.rowRight p
    {
        padding-top: 0px;
    }
    
    .image-MCL
    {
        width: 100%;
        padding-top: 29.33%
    }
    
    .DHRMAdditionalInfo 
    {
        width: 100%
    }
    
    .DHRMIDCards p 
    {
        margin-top: 5%;
    }
}