/*tablet (viewed in landscape)*/

/*#primary-nav li.top-lvl > a,
header,
#mobileNavDrawerTrigger {
    color:blue !important;
}*/

.RadMenuPopup { top: 28px !important;}

header #header-title #header-parent-organization-logo.uf { width:68px; height:48px;}
header #header-title #header-title-text-right.uf { padding-left:89px;}


body header div.container { padding:1.5em 1em;}

body.home header #header-title h1, 
header #header-title h2.not-front { font-size:2.1em;}

body header #header-title { padding-right:165px;}


#slideshow,
#slideshow-reel .slide { width:550px;}

#slideshow .half-image-feature .slideImage { width:100%;}

#slideshow .half-image-feature a.custom-button { font-size: 0.8em; }

#slideshow .slideshow-arrow { opacity:.6;}
#slideshow .slideshow-arrow:hover { opacity:1;}

/*display table is the only way I could find where I could have a set width on the sidebar 
    nav and a flex (auto) width on the content and them appear side by side. A normal float 
    would usually fit this situation except that the nav element is outside of the article element.*/

#secondary #events,
#secondary #news-announcements, .ufhealth #secondary .span-6 { display:inline-block; vertical-align:top;}

#secondary #events, .ufhealth #secondary .span-6  { width:35% !important; float:right; }
#secondary #news-announcements { width:59% !important; padding-right:0;}

#secondary section { background-image:none;}

body #secondary div h3 { margin-left:0; margin-right:0;}

#user-role section { width:163px;}


#institutional-nav a { padding:0;}

#institutional-footer div.alpha { 
    display:block;
    float:none;
    margin-left:auto;
    margin-right:auto;
}

.ncqaImage {margin-right:0px;}

.ufhealth .location-search-results .right-col .location-info-box { display: inline-block; margin-right:3px; height:32px; width:78px;}

.ufhealth .location-search-results .right-col .location-info-box a { vertical-align:middle;}

.ufhealth .location-search-results .right-col .location-info-box p { font-size:.9em !important; }
.ufhealth .location-search-results .right-col .location-info-box.map-box { margin-right:0; width:60px;}
.ufhealth .location-search-results .right-col .location-info-box.map-box a { line-height:32px; }

/* the next 2 styles will eventually replace the styles on lines 60-66 */
.ufhealth .location-search-results .right-col .location-button {display: inline-block; margin-right:3px; height:32px; width:78px; vertical-align:middle;font-size:.9em !important; text-align:center;line-height: 1.4em;}
.ufhealth .location-search-results .right-col .location-button.map {margin-right:0; width:60px;line-height:32px;}


.ufhealth .specialty-banner-respon h1 {font-size:3em;}

body #searchform-wrap { background:none; height:auto; margin-top:auto; width:auto;}

body #searchform-wrap input[type="text"] { left:auto !important; right:0px; width:100px !important;}
body #searchform-wrap input[type="image"] { right:2px !important;}
body #header-search-wrap { top:auto; /*height:40px;*/ }
.hscj body #header-search-wrap { height:40px; }

.ufhealth body #content, 
body div.content, .ufhealth .searchcontainer { display:table; width:100% !important; box-sizing: border-box;}

body #sidebar-nav,
body div.content article { display:table-cell; float:none; vertical-align:top;}

body #sidebar-nav { margin-left:0;}

/*#primary-nav #about .col-2,*/
#primary-nav .span-26-right,
#primary-nav #patientcare .col-2 h3.clear,
#primary-nav #patientcare .col-2 .patient-feature,
#primary-nav .mega-feature-img-wrap,
#primary-nav #research .col-2,
.hscj body #utility-links,
.ufhealth .encyclopedia-mega-menu-image, .ufhealth #about-us-patient-care span, .ufhealth  #about-us-education span, 
.ufhealth  #about-us-community span, .ufhealth  #about-us-research span { display:none;}

#primary-nav #about .col-2,
#primary-nav #research .col-3,
#primary-nav #education .col-2,
#primary-nav #patientcare .col-2 { width:55%;}

#primary-nav .sub-mega.container, .ufhealth #secondary #events, .ufhealth #multimedia .item { width:100% !important;}
#primary-nav .sub-mega.container {box-sizing: border-box;}

.ufhealth #utility-links,
#primary-nav #education .col-2 div, 
.ufhealth #secondary #events { float:none;}

/*body div.accordion { padding-right:20px; padding-left:10px;}*/ /*this intentionally overwrites the default 10px of left padding and adds right padding to compensate for the new 0 left margin of the article element. */


#primary-nav #main-menu { padding-left:70px;}

#institutional-nav > li > a,
#primary-nav #main-menu > li > a { width:100% !important;}

#primary-nav #main-menu > li.top-lvl > a { letter-spacing:normal;}


#institutional-nav #inst-healing,
#institutional-nav #inst-learning,
#institutional-nav #inst-discovery,
#institutional-nav #inst-community {width:15%;}

#institutional-nav #inst-uf { width:23% !important;}


#primary-nav #main-menu #home { width:70px; margin-left:-70px; /*matches the width of this item and the padding left of the main-menu*/}


#primary-nav #main-menu #com,
#primary-nav #main-menu #cop,
#primary-nav #main-menu #con { width:27.13%;}

#primary-nav #main-menu #faculty,
#primary-nav #main-menu #patientcare,
#primary-nav #main-menu #departments,
#primary-nav #main-menu #community { width:22%;}

#primary-nav #main-menu #education,
#primary-nav #main-menu #research,
#primary-nav #main-menu #about { width:18.6%;}

.ufnorth #primary-nav #main-menu #research {width:34%}
    .ufnorth #research .sub-mega-inner li {width: 30% !important;}
.ufnorth #primary-nav #main-menu #education {width:21%}
    .ufnorth #education .col-1 {width: 26% !important;}
    .ufnorth #education .col-3 {display:none;}
.ufnorth #primary-nav #main-menu #patientcare {width:26%}
.ufnorth #primary-nav #main-menu #about {width:19%}
    .ufnorth .about-us-right {width: 43%;}

div.RadPanelBar_Apollo { box-shadow:none;}


/*article .hubpage-banner img,*/ 
.ufhealth .span-11, 
.ufhealth .map-style-ped, 
.ufhealth .tab-content .map-style  { width:97%;}



html div.RadTabStrip .rtsLI { width:25% !important;}

.ufhealth .primary-care-results p.label, .ufhealth .primary-care-results p.number {font-size:0.99em !important;}

.ufhealth .tab-content p.results, .ufhealth #medical-services .left-col, .ufhealth .primary-care-results .left-col  {width:auto;}

.ufhealth .entry-inner {float: left; width: 64%;}
.ufhealth .entry img {margin-right: 10px;}

.ufhealth .hubpage-box.loc-jax, .ufhealth .hubpage-box.loc-north, .ufhealth .hubpage-box.loc-emerson {background-image: none;}
.ufhealth .inlineLocationImg, .ufhealth ul.specialty-care-mega-links, .ufhealth div.patient-feature {display:block !important;}
.ufhealth .hubpage-box .first-row {margin-top:0;}

.ufhealth .feature-box {height:100px;}

#patientcare .col-1 {float: left;width: 43%;}
#patientcare div.long {float: right !important;width: 57% !important;}

.ufhealth #education .col-1 {float: left;width: 48%;}
.ufhealth #education div.long {float: right !important;width: 52% !important;}
#education .col-1 {float: left;width: 48%;}
#education .span-26-left {float: right !important;width: 52% !important;}
#education .span-26-left h3, .ufhealth #education .sub-mega-inner li {width:auto;}
#education .sub-mega-inner li {width:55%;}

.ufhealth #research .col-1 {float: left;width: 42%;}
#research .col-1 {float: left;width: 50%;}
.ufhealth #research div.long {float: right !important;width: 58% !important;}
#research .span-26-left  {float: right !important;width: 50% !important;}
#research .span-26-left h3 {width:auto;}
#research .sub-mega-inner li {width:100%; box-sizing:border-box;}

#departments div.span-25.firstColumn {width:37%; box-sizing: border-box;}
#departments div.span-25.secondColumn {width:38%;box-sizing: border-box;}
#departments div.span-25.thirdColumn {width:23%;margin-right:0;box-sizing: border-box;}
#departments h3 {font-size:1.25em;text-indent:10px;white-space: nowrap;}
#departments div.span-25 li a {width:inherit;}

.ufhealth #community .col-1 {width: 35%;}
.ufhealth #community .col-2 {width: 34%;}
.ufhealth #community .col-3 {float:right;width:30.5%;}

#about .col-1 {width: 40% !important;}
#about .col-2 {width: 59% !important;}
#about .span-26-left, #about .span-26-left h3, #about ul.list-col {width:100%;}
.ufhealth #about .col-2 img {width: 100%;}

article .deptCol1, .deptCol2, .deptCol3 {
    width: 30% !important;
}

.ufhealth .about-us-stats p {padding:0 10px 10px 16px;}


/*CONVERTING THE IMAGE LISTS INTO TEXT ================================================*/
#primary-nav ul.img-list li img {display:none;}
#primary-nav ul.img-list li {font-size: 100%; padding-left: 20px; margin-right:20px; padding-top: 0px; width:auto;}

/*bring back the arrow right icons for the image list since now the images are hidden and we're converting to a text link. HSCJ uses font icons and UFHealthJax uses background images so this is achieved in different ways*/
.ufhealth #primary-nav ul.img-list li {background-image: url(/images/template/bg-sprite-transparent.png);}
.hscj #primary-nav ul.img-list li::before {content:"";}

/*END CONVERTING THE IMAGE LISTS INTO TEXT =============================================*/




@media only screen and (max-width: 896px) {  /*only applies to the first half of the md viewport. for use in limited circumstances*/
    .responsiveMediaPlayer { 
        height:410px !important; 
        width:728px !important; 
    }
}

@media only screen and (min-width: 897px) { /*only applies to the second half of the md viewport. for use in limited circumstances*/
    .responsiveMediaPlayer { 
        height:482px !important; /*HEIGHT CALCULATED USING A 16 X 9 RATIO CALCULATOR AND INPUTTING THE DESIRED WIDTH*/
        width:856px !important;  /*WIDTH = MAX WIDTH OF 1/2 VIEWPORT SIZE DOWN - 40PX FOR PAGE MARGIN*/
    }
}