/* topnav styles - last edited on 12-11-24 ----------------------------------------------- */ #topnav { min-width: 1180px; width: 100% !important; height: 205px; float: left; clear: both; margin-top: 0; padding-top: 0; text-align: center; } header#branding { padding: 0; width: 100%; min-width: 1180px; } #topnav, header#branding { height: 205px; } .toplinks { height: 40px; /* overflow: hidden; */ background: #ececec; } ul#utility { color: #333; font: 700 13px/18px 'Montserrat', sans-serif; text-align: center; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; height: 30px; width: auto; padding: 0; margin: 10px auto 0 auto; white-space: nowrap; float: right; clear: none; /* position: absolute; top: 12px; */ } ul#utility li { text-align: center; float: left; padding: 0; margin: 0; list-style: none; display: inline !important; border: none; white-space: nowrap; width: auto; } ul#utility li.search { color: #333; width: auto; margin-top: -5px; margin-left: 15px; } ul#utility li a { font-weight: 700; background: url(../css-images/topdiv-line.png) no-repeat right 3px; text-decoration: none; border: none; height: 32px; margin: 0; padding: 1px 13px 0px 13px; display: block; white-space: nowrap; } ul#utility li a:link, ul#utility li a:visited { } ul#utility li a:hover, ul#utility li a:active { } .navwrapper { width: 100%; max-width: 1180px; height: auto; margin: 0 auto !important; display: block; } .navwrapper .row { float: left; } .logowrap { width: 100%; max-height: 165px; background: #58008b url(../css-images/mainnav.png) repeat-x center bottom; display: block; margin: 0 auto; padding: 0; float: left; } #logo { float: left; clear: none; margin: 0; padding: 0; width: 450px; height: 165px; text-align: center; white-space: nowrap; } #logo img { float: left; clear: none; margin: 0; padding: 0; width: 450px; height: auto; text-align: center; white-space: nowrap; display: block; } #logos-mobile, #logos-mobile-sm { display: none; visibility: hidden; } #menu { width: auto; text-align: center; margin: 0 !important; -webkit-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.30); -moz-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.30); box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.30); } #menu ul#mainnav { color: #fff; height: 60px; width: auto; float: right; clear: none; margin-right: -30px; /* margin-top: 102px; */ margin-top: 92px; z-index: 10; } #menu ul#mainnav li { text-align: left; height: 60px; width: auto; float: left; padding: 0; margin: 0 1px; list-style: none; display: inline; border: none; white-space: normal; } #menu ul#mainnav li a { font-weight: 600; color: #fff; font-size: 16px; text-shadow: #27034e 1px 1px 2px; padding: 20px 15px 10px 15px; width: inherit; display: block; text-transform: none; } #menu ul#mainnav li a:hover { color: #b4c9e5; text-decoration: none; } #menu ul#mainnav li.AboutSBAS { /*display: none; visibility: hidden; */ min-width: 50px; text-align: center; white-space: nowrap; padding: 20px 0px 0px 5px; } #menu ul#mainnav li.AboutSBAS a.format .word1, #menu ul#mainnav li.AboutSBAS a.format .word2 { display: inline; } #menu ul#mainnav li.AnnualMeeting { /* width: 150px; */ white-space: nowrap; padding: 20px 0px 0px 0px; margin-top: 0px; text-align: center; } #menu ul#mainnav li.OpportunitiesforSurgeons, #menu ul#mainnav li.Surgeons, #menu ul#mainnav li.OpportunitiesforResidents, #menu ul#mainnav li.Residents, #menu ul#mainnav li.InformationforStudents, #menu ul#mainnav li.Students { width: auto; text-align: center; padding-top: 20px; } #menu ul#mainnav li.Media { min-width: 100px; white-space: nowrap; padding: 20px 0px 0px 0px; margin: 0 15px 0 0; } #menu ul#mainnav li a.format .word1 { display: block; } #menu ul#mainnav li a.format .word2 { } #menu ul#mainnav li a.format .word3 { /* text-transform: uppercase; */ } #menu ul#mainnav li.AnnualMeeting a.format .word1 { display: inline; } #menu ul#mainnav li.AnnualMeeting a.format .word2 { display: inline; } /* #menu ul#mainnav li.OpportunitiesforSurgeons a.format .word1, #menu ul#mainnav li.OpportunitiesforResidents a.format .word1, #menu ul#mainnav li.InformationforStudents a.format .word1 { display: block; visibility: hidden; } #menu ul#mainnav li.OpportunitiesforSurgeons a.format .word2, #menu ul#mainnav li.OpportunitiesforResidents a.format .word2, #menu ul#mainnav li.InformationforStudents a.format .word2 { display: none; visibility: hidden; } #menu ul#mainnav li.OpportunitiesforSurgeons a.format .word3, #menu ul#mainnav li.OpportunitiesforResidents a.format .word3, #menu ul#mainnav li.InformationforStudents a.format .word3 { margin-left: -0.375em; } */ #menu ul#mainnav li.join a, #menu ul#mainnav li.JoinSBAS a, #menu ul#mainnav li.JoinSBAS a.format { -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; text-shadow: 1px 1px 3px #79411f; color: #fff; font-size: 18px; font-weight: 700; background: #d17036; padding: 7px 18px 7px 18px; border: solid #8f4542 1px; text-decoration: none; white-space: nowrap !important; } #menu ul#mainnav li.join a:hover, #menu ul#mainnav li.JoinSBAS a:hover { background: #590e85; text-decoration: none; text-shadow: #27034d 1px 1px 2px; white-space: nowrap !important; } #menu ul#mainnav li.join a.format .word1, #menu ul#mainnav li.JoinSBAS a.format .word1, #menu ul#mainnav li.JoinSBAS a .word2 { display: inline !important; } #menu ul#mainnav li.join a.format .word2, #menu ul#mainnav li.JoinSBAS a.format .word2, #menu ul#mainnav li.JoinSBAS a .word2 { display: inline !important; } ul#mainnav li.SBASF a { background-color: #b91b24 !important; border: solid #b91b24 1px !important; } #menu ul#mainnav li.SBASF a:hover { background-color: #590e85 !important; } #topnav a.show { display: none; } .join-mobile, .membership-mobile { display: none; white-space: nowrap; position: absolute; } .expand { display: block; } .expand .topcontent { } .expanded .topcontent { } #menu ul#mainnav li.topNav ul { display: none; } #menu ul#mainnav li.topNav ul { /* mobile color background-color: rgba(38,0,81,0.93); */ background-color: rgba(88,0,139,0.93); min-width: 275px; width: 100%; min-height: 100% !important; float: left; position: absolute; z-index: 75000; border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; } #menu ul#mainnav li.topNav ul li { clear: both; height: auto !important; width: 100%; margin: 0px auto; padding: 0px; overflow: hidden; } #menu ul#mainnav li.topNav ul li a { font-weight: 500; padding-right: 5%; padding-left: 17px; width: 90% !important; display: block; white-space: normal !important; } /* drop-down menus */ .mainmenu { } .dropit { list-style: none; padding: 0; margin: 0; } .dropit .dropit-trigger { position: relative; } .dropit .dropit-submenu { position: absolute; top: 100%; left: 0; /* dropdown left or right */ z-index: 75000; display: none; min-width: 150px; list-style: none; padding: 0; margin: 0; } .dropit .dropit-open .dropit-submenu { display: block; border: solid 1px #a27cbe; margin: 1px 0 1px 1%; padding: 1px 0 5px 0; } .dropit .dropit-open .dropit-submenu { border-top: solid 0px #a27cbe; } .dropit-open a, .dropit-open a:hover { color: #d17036 !important; font-weight: 700; } .dropit .dropit-open .dropit-submenu a { color: #fff !important; font-weight: 500; } .dropit .dropit-open .dropit-submenu a:hover { color: #b4c9e5 !important; } #menu ul#mainnav li.AnnualMeeting ul { margin-left: 15px !important; } #menu ul#mainnav li.Media ul { margin-left: -159px !important; } #menu ul#mainnav li.InformationforStudents ul, #menu ul#mainnav li.Students ul { margin-left: -85px !important; } #menu ul#mainnav li.AboutSBAS ul, #menu ul#mainnav li.AnnualMeeting ul, #menu ul#mainnav li.OpportunitiesforSurgeons ul, #menu ul#mainnav li.Surgeons ul, #menu ul#mainnav li.OpportunitiesforResidents ul, #menu ul#mainnav li.Residents ul, #menu ul#mainnav li.InformationforStudents ul, #menu ul#mainnav li.Students ul, #menu ul#mainnav li.Media ul { margin-top: -9px !important; } #menu ul#mainnav li.AboutSBAS ul li a, #menu ul#mainnav li.AnnualMeeting ul li a, #menu ul#mainnav li.Media ul li a, #menu ul#mainnav li.OpportunitiesforSurgeons ul li a, #menu ul#mainnav li.Surgeons ul li a, #menu ul#mainnav li.OpportunitiesforResidents ul li a, #menu ul#mainnav li.Residents ul li a, #menu ul#mainnav li.InformationforStudents ul li a, #menu ul#mainnav li.Students ul li a { padding-top: 10px; padding-bottom: 10px; } #menu ul#mainnav li.JoinSBAS { display: inline-block; white-space: nowrap !important; position: absolute; top: 65px; margin-left: -293px; } #menu ul#mainnav li.SBASF { display: inline-block; white-space: nowrap !important; position: absolute; top: 65px; margin-left: -153px; } #menu ul#mainnav li.membership-btn { display: inline-block; white-space: nowrap !important; position: absolute; top: 65px; margin-left: -520px !important; } /* Responsive ---------------------------------------------------------------- */ @media only screen and (max-width: 1200px) { /* #menu ul#mainnav li.join, #menu ul#mainnav li.JoinSBAS { margin-left: 0px; right: 15px; } #menu ul#mainnav li.membership-btn { margin-left: 0px !important; right: 155px; } */ } @media only screen and (max-width: 1180px) { #topnav, header#branding { min-width: 100%; } #menu ul#mainnav { margin-top: 92px; position: absolute; right: 0px; } #menu ul#mainnav li.Media { margin-right: 15px; } #menu ul#mainnav li a { padding-right: 15px; padding-left: 15px; } /* #menu ul#mainnav li.JoinSBAS + li.JoinSBAS { margin-right: 33px; margin-left: 0px; top: -67px; } */ #menu ul#mainnav li.JoinSBAS, #menu ul#mainnav li.SBASF, #menu ul#mainnav li.membership-btn { top: -67px; } } @media only screen and (max-width: 980px) { #menu ul#mainnav li a { } ul#utility a { padding-right: 10px; padding-left: 10px; } ul#utility li.mlogin a { background: none !important; } ul#utility li.search { margin-left: 7px; } } @media only screen and (max-width: 960px) { #menu ul#mainnav { margin-top: 95px; } #menu ul#mainnav li a { font-size: 15px !important; } #menu ul#mainnav li a .word1, #menu ul#mainnav li a .word2, #menu ul#mainnav li a .word3 { font-size: 15px !important; } #menu ul#mainnav li.AboutSBAS { padding-top: 19px; } #menu ul#mainnav li.AnnualMeeting { /* width: 150px; */ padding-top: 19px; } #menu ul#mainnav li.OpportunitiesforSurgeons, #menu ul#mainnav li.Surgeons { /* width: 150px; */ padding-top: 19px; } #menu ul#mainnav li.OpportunitiesforResidents, #menu ul#mainnav li.Residents { /* width: 150px; */ padding-top: 19px; } #menu ul#mainnav li.InformationforStudents, #menu ul#mainnav li.Students { /* width: 145px; */ padding-top: 19px; } #menu ul#mainnav li.Media { width: 90px; padding-top: 19px; padding-right: 18px; margin-right: 5px; } #menu ul#mainnav li.AboutSBAS ul, #menu ul#mainnav li.AnnualMeeting ul, #menu ul#mainnav li.OpportunitiesforSurgeons ul, #menu ul#mainnav li.Surgeons ul, #menu ul#mainnav li.OpportunitiesforResidents ul, #menu ul#mainnav li.Residents ul, #menu ul#mainnav li.InformationforStudents ul, #menu ul#mainnav li.Students ul, #menu ul#mainnav li.Media ul { margin-top: -11px !important; } #menu ul#mainnav li.join a, #menu ul#mainnav li.JoinSBAS a, #menu ul#mainnav li.SBASF a, #menu ul#mainnav li.membership-btn a { font-size: 17px !important; } #menu ul#mainnav li.JoinSBAS { top: -70px; margin-left: -288px; } #menu ul#mainnav li.SBASF { top: -70px; margin-left: -152px; } #menu ul#mainnav li.membership-btn { top: -70px; margin-left: -505px !important; } } @media only screen and (max-width: 880px) { #topnav, header#branding { height: 180px; } #logo { display: none; visibility: hidden; } #logos-mobile { float: left; clear: none; margin: 1px 0 0 1px; padding: 0; display: block; visibility: visible; max-height: 130px !important; width: auto; } #logos-mobile a { padding: 5px; display: block; } #logos-mobile img { max-height: 130px; width: auto; } .logowrap { height: 140px; background: url(../css-images/mainnav.png) repeat-x center bottom; } #menu ul#mainnav { margin-top: 70px; } #menu ul#mainnav li.Media { margin-right: 2px; margin-left: 0px; } .dropit .dropit-open .dropit-submenu { } #menu ul#mainnav li.AboutSBAS ul, #menu ul#mainnav li.AnnualMeeting ul, #menu ul#mainnav li.OpportunitiesforSurgeons ul, #menu ul#mainnav li.Surgeons ul, #menu ul#mainnav li.OpportunitiesforResidents ul, #menu ul#mainnav li.Residents ul, #menu ul#mainnav li.InformationforStudents ul, #menu ul#mainnav li.Students ul, #menu ul#mainnav li.Media ul { margin-top: -11px !important; } #menu ul#mainnav li.join, #menu ul#mainnav li.JoinSBAS { margin-top: 18px; } } @media only screen and (max-width: 840px) { #menu ul#mainnav { padding-top: 0px; padding-right: 7px; margin-top: 73px; } #menu ul#mainnav li a, #menu ul#mainnav li a .word1, #menu ul#mainnav li a .word2, #menu ul#mainnav li a .word3 { font-size: 14px !important; } #menu ul#mainnav li.AboutSBAS { margin-top: -1px; } #menu ul#mainnav li.AnnualMeeting { /* width: 131px; */ margin-top: -1px; } #menu ul#mainnav li.OpportunitiesforSurgeons, #menu ul#mainnav li.Surgeons { /* width: 133px; */ margin-top: -1px; } #menu ul#mainnav li.OpportunitiesforResidents, #menu ul#mainnav li.Residents { /* width: 133px; */ margin-top: -1px; } #menu ul#mainnav li.InformationforStudents, #menu ul#mainnav li.Students { /* width: 133px; */ margin-top: -1px; } #menu ul#mainnav li.Media { /* width: 75px; */ margin-top: -1px; padding-left: 0px; } #menu ul#mainnav li.AboutSBAS ul, #menu ul#mainnav li.AnnualMeeting ul, #menu ul#mainnav li.OpportunitiesforSurgeons ul, #menu ul#mainnav li.Surgeons ul, #menu ul#mainnav li.OpportunitiesforResidents ul, #menu ul#mainnav li.Residents ul, #menu ul#mainnav li.InformationforStudents ul, #menu ul#mainnav li.Students ul, #menu ul#mainnav li.Media ul { margin-top: -13px !important; } } @media only screen and (max-width: 830px) { ul#utility a .hide { display: none; } #menu ul#mainnav li.Media { margin-right: -5px; } #menu ul#mainnav li a { padding-right: 11px; padding-left: 11px; } } @media only screen and (max-width: 759px) { #logos-mobile img.logo { max-height: 128px; margin-left: -1px; } #menu ul#mainnav li.AnnualMeeting { white-space: nowrap; } #menu ul#mainnav li.AnnualMeeting a { position: relative; z-index: 10; } #menu ul#mainnav li.OpportunitiesforSurgeons, #menu ul#mainnav li.Surgeons, #menu ul#mainnav li.OpportunitiesforResidents, #menu ul#mainnav li.Residents, #menu ul#mainnav li.InformationforStudents, #menu ul#mainnav li.Students, #menu ul#mainnav li.Media { margin-left: 0px; } #menu ul#mainnav li.AnnualMeeting ul { margin-left: -9px !important; } #menu ul#mainnav li.AnnualMeeting ul li a { margin-left: 0px; } #menu ul#mainnav li.topNav ul { margin-left: 0; } #menu ul#mainnav li.Media { margin-right: -15px; width: 65px; } } @media only screen and (max-width: 720px) { #menu ul#mainnav li.AnnualMeeting { margin-right: 3px; } #menu ul#mainnav li.OpportunitiesforSurgeons, #menu ul#mainnav li.Surgeons { padding-left: 0px; } #menu ul#mainnav li.OpportunitiesforSurgeons a, #menu ul#mainnav li.Surgeons a { padding-left: 13px; } #menu ul#mainnav li.OpportunitiesforResidents, #menu ul#mainnav li.Residents { } #menu ul#mainnav li.InformationforStudents, #menu ul#mainnav li.Students { } #menu ul#mainnav li.Media { margin-left: 0px; padding-right: 22px; } } @media only screen and (max-width: 710px) { input#quicksearch { max-width: 230px; } } @media only screen and (max-width: 684px) { /* #logos-mobile img.logo { max-height: 100px; } */ #topnav { height: 120px; background: #58008b url(../css-images/mainnav.png) repeat-x center bottom; display: block; margin: 0; position: relative; z-index: 20; } #logos-mobile-sm { float: left; clear: none; margin: 0 0 0 1px; padding: 0; display: block; visibility: visible; max-height: 120px !important; width: auto; } #logos-mobile-sm a { display: block; position: relative; z-index: 100; padding-right: 3px; padding-left: 3px; max-height: 118px; overflow: hidden; } #logos-mobile-sm img.logo { max-height: 119px; margin-left: 0px; width: auto; } #logos-mobile-sm img.logo-550 { display: none; visibility: hidden; } .join-mobile { display: block; top: 48px; right: 161px; z-index: 100; } .membership-mobile { display: block; top: 48px; right: 274px; z-index: 100; } .sbasf-mobile { display: block; top: 48px; right: 71px; z-index: 100; } .join-mobile a.btn { -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; text-shadow: 1px 1px 3px #79411f; color: #fff; font-size: 16px !important; font-weight: 700; background: #d17036; padding: 6px 12px 6px 12px; border: solid #8f4542 1px; text-decoration: none; } .join-mobile a.btn:hover { background: #590e85; text-decoration: none; text-shadow: #27034d 1px 1px 2px; } .sbasf-mobile a.btn { background-color: #b91b24 !important; border: solid #b91b24 1px !important; } .sbasf-mobile a.btn:hover { background-color: #590e85 !important; } #topnav .expanded { background-image: none; min-height: 100%; min-width: 100%; position: absolute; z-index: 150; } .expand { position: relative; } .topcontent {/* margin-top: -25px; */ }/* added negative margin of -15px to account for the hidden expand link */ .topcontent { margin-top: 0px; } /* Expand functions, for use on the topnav -- */ .topcontent { display: none; overflow: hidden; width: 100%; height: 100% } .topcontent #logos-mobile, .topcontent #logos-mobile img.logo { display: block !important; } #topnav .expand-link { display: block; z-index: 100 !important; } #topnav .expand-link a { height: 21px; margin-top: -5px; padding-top: 3px; } #topnav .expand-link small { font-size: 12px; font-weight: 400; } a.show { white-space: nowrap; display: block !important; z-index: 500; } a.show:link, a.show:visited { font-weight: bold; text-decoration: none; } a.show:hover, a.show:active { font-weight: bold; text-decoration: none; } .expand { /* height: 40px; */ height: auto; margin: 0 !important; width: 100% !important; float: left; overflow: visible; } .expand a.show { text-align: left; padding: 10px 5px 4px 5px; margin: 0 !important; position: absolute; top: 38px; right: 14px; height: 23px !important; width: 30px !important; overflow: hidden; /* display: none; */ background: url(../css-images/menu-icon.png); background-repeat: no-repeat; text-indent: 150px; -webkit-background-size: 36px 90px; -moz-background-size: 36px 90px; -o-background-size: 36px 90px; background-size: 36px 90px; background-position: 2px 0px; background-color: rgba(108,1,170,0.75); text-decoration: none; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; cursor: pointer; display: block !important; border: solid 1px #a27cb8; -webkit-box-shadow: 0 0 5px #26034d; -moz-box-shadow: 0 0 5px #26034d; box-shadow: 0 0 5px #26034d; } .expand a.show:hover { background-position: 2px -42px; } .expanded a.show { text-align: left; text-indent: 150px; padding: 10px 5px 4px 5px; margin: 0 !important; position: absolute; top: 38px; right: 15px; height: 23px !important; width: 30px !important; overflow: hidden; /* display: none; */ background-image: url(../css-images/menu-icon-x.png); background-repeat: no-repeat; -webkit-background-size: 36px 90px; -moz-background-size: 36px 90px; -o-background-size: 36px 90px; background-size: 36px 90px; background-position: 2px 0px; background-color: rgba(108,1,170,0.85); float: left; text-decoration: none; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; cursor: pointer; display: block !important; border: solid 1px #a27cb8; -webkit-box-shadow: 0 0 5px #26034d; -moz-box-shadow: 0 0 5px #26034d; box-shadow: 0 0 5px #26034d; } .expanded a.show:hover { background-position: 2px -42px; } .expanded .mobile-menu-bg { background-color: rgba(38,0,81,0.95) !important; width: 100% !important; min-height: 2000% !important; float: left; position: absolute; z-index: 1000 !important; margin-top: 2px !important; } /* Expand overrides ----- */ .expanded .toplinks { height: auto; overflow: visible; background: none; position: relative; z-index: 250; } .expanded ul#utility { color: #333; font: 700 13px/18px 'Montserrat', sans-serif; text-align: center; width: 100% !important; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; height: 30px; padding: 3px 0 7px 0; margin: 7px auto 10px auto; white-space: nowrap; float: left; clear: none; position: relative; z-index: 250; border-bottom: solid #7a669d 1px; } .expanded ul#utility li.about { display: none !important; visibility: hidden; } .expanded ul#utility li { text-align: left; float: none; padding: 0 !important; margin: 0 !important; list-style: none; display: inline-block !important; border: none; white-space: nowrap; width: auto; } .expanded ul#utility li.search { color: #333; width: auto; margin-top: -5px; margin-left: 15px; } .expanded ul#utility li a { font-weight: 400; background: url(../css-images/topdiv-line.png) no-repeat right 7px; text-decoration: none; border: none; height: 30px; margin: 0; padding: 5px 15px 3px 13px; display: block; white-space: nowrap; } .expanded ul#utility li.search form input#quicksearch { color: #58008b; border: solid #58008b 1px; background-color: #c8a5e2; } .expanded ul#utility li.search form input.search { color: #fff; } .expanded ul#utility li a:link, .expanded ul#utility li a:visited { color: #fff; text-shadow: #27034e 1px 1px 2px; } .expanded ul#utility li a:hover, .expanded ul#utility li a:active { color: #b4c9e5; text-shadow: #27034e 1px 1px 2px; } .expanded .navwrapper { width: 100%; max-width: 1180px; margin: 0 !important; height: auto; display: block; } .expanded .logowrap { width: 100%; height: auto; background: url(../css-images/spacer.gif) repeat-x center bottom; display: block; margin: 0 auto; } .expanded #logo { float: left; clear: none; margin: 0; padding: 0; width: 450px; height: 165px; text-align: center; white-space: nowrap; } .expanded #logo img { float: left; clear: none; margin: 0; padding: 0; width: 450px; height: auto; text-align: center; white-space: nowrap; display: block; } .expanded #logos-mobile { display: none; visibility: hidden; } .expanded #logos-mobile-sm { } .expanded #menu { width: 100%; text-align: center; padding: 0 !important; margin: 0 !important; } .expanded #menu ul#mainnav { color: #fff; height: auto; float: none !important; clear: both; display: block; width: 99%; padding-left: 1%; margin: 0 !important; overflow: hidden; -webkit-column-count: 2; -moz-column-count: 2; column-count: 2; -moz-column-fill: balance; -webkit-column-width: 50%; -moz-column-width: 50%; column-width: 50%; } .expanded #menu ul#mainnav li { height: 100%; width: auto; float: left; clear: both; padding: 0; margin: 0; overflow: visible; display: table; -webkit-column-break-inside: avoid; page-break-inside: avoid; break-inside: avoid-column; } .expanded #menu ul#mainnav li a { font-weight: 700; color: #fff; text-shadow: #27034e 1px 1px 2px; padding: 9px 0px 10px 19px; width: inherit; display: block; white-space: normal !important; overflow: visible; text-transform: uppercase; } .expanded #menu ul#mainnav li a:hover { color: #b4c9e5; /* background-color: rgba(38,0,81,0.99); */ text-shadow: #27034e 1px 1px 2px; text-decoration: none; } .expanded #menu ul#mainnav li.AboutSBAS { display: block; visibility: visible; width: 97%; margin: 0; padding-right: 0px; text-align: left; } .expanded #menu ul#mainnav li.AboutSBAS a { display: block; visibility: visible; width: 85% !important; margin: 0; padding-right: 7%; text-align: left; } .expanded #menu ul#mainnav li.AnnualMeeting { width: 97%; margin: 0; text-align: left; } .expanded #menu ul#mainnav li.AnnualMeeting a { width: 85% !important; margin: 0; padding-right: 7%; text-align: left; } .expanded #menu ul#mainnav li.OpportunitiesforSurgeons, .expanded #menu ul#mainnav li.Surgeons { width: 97%; margin: 0; white-space: normal !important; text-align: left; } .expanded #menu ul#mainnav li.OpportunitiesforSurgeons a, .expanded #menu ul#mainnav li.Surgeons a { width: 85% !important; margin: 0; padding-right: 7%; white-space: normal !important; text-align: left; } .expanded #menu ul#mainnav li.OpportunitiesforResidents, .expanded #menu ul#mainnav li.Residents { width: 97%; margin: 0; white-space: normal !important; text-align: left; } .expanded #menu ul#mainnav li.OpportunitiesforResidents a, .expanded #menu ul#mainnav li.Residents a { width: 85% !important; margin: 0; padding-right: 7%; white-space: normal !important; text-align: left; } .expanded #menu ul#mainnav li.InformationforStudents, .expanded #menu ul#mainnav li.Students { width: 97%; margin: 0; white-space: normal !important; text-align: left; } .expanded #menu ul#mainnav li.InformationforStudents a, .expanded #menu ul#mainnav li.Students a { width: 85% !important; margin: 0; padding-right: 7%; white-space: normal !important; text-align: left; } .expanded #menu ul#mainnav li.Media { width: 97%; margin: 0; text-align: left; } .expanded #menu ul#mainnav li.Media a { width: 85% !important; margin: 0; padding-right: 7%; text-align: left; } .expanded #menu ul#mainnav li.join, .expanded #menu ul#mainnav li.JoinSBAS { display: none !important; visibility: hidden !important; } #menu ul#mainnav li a.format .word1, .expanded #menu ul#mainnav li a.format .word1 { display: inline; } #menu ul#mainnav li a.format .word2, .expanded #menu ul#mainnav li a.format .word2 { display: inline; } #menu ul#mainnav li a.format .word3, .expanded #menu ul#mainnav li a.format .word3 { display: inline; text-transform: uppercase; } #menu ul#mainnav li.OpportunitiesforSurgeons a.format .word1, #menu ul#mainnav li.OpportunitiesforResidents a.format .word1, #menu ul#mainnav li.InformationforStudents a.format .word1 { display: none; visibility: hidden; } #menu ul#mainnav li.OpportunitiesforSurgeons a.format .word2, #menu ul#mainnav li.OpportunitiesforResidents a.format .word2, #menu ul#mainnav li.InformationforStudents a.format .word2 { display: none; visibility: hidden; } .expanded #menu ul#mainnav li.topNav ul { background-color: rgba(88,0,139,0.40); width: 100% !important; margin: 0 !important; border-radius: 0px; border: none; position: relative; z-index: 7505; } .expanded #menu ul#mainnav li.topNav ul li { position: relative; z-index: 7515; } .expanded #menu ul#mainnav li.dropit-open { border-top: solid 1px #7a669d !important; border-bottom: solid 1px #7a669d !important; } .dropit-trigger a, .dropit-open a { padding-left: 34px !important; } .dropit-trigger a:before { content: "\f078 "; font-family: FontAwesome; font-weight: 100; padding-right: 5px; margin-left: -20px; font-size: 95%; display: inline-block; } .dropit-open a, .dropit-open a:hover { color: #d17036 !important; /* background-color: #260051 !important; */ } .dropit-open a:before { content: "\f077 "; font-family: FontAwesome; font-weight: 100; padding-right: 5px; margin-left: -20px; font-size: 95%; display: inline-block; } .dropit-trigger ul li a, .dropit-open ul li a { color: #fff !important; background-color: transparent !important; font-weight: 500 !important; padding-left: 32px !important; } .dropit-trigger ul li a:before, .dropit-open ul li a:before { content: "\f0a9 "; padding-right: 6px; margin-left: -17px; } /* END Expand (needed for the show hide scripts) ----- */ } @media only screen and (max-width: 640px) { input#quicksearch { max-width: 175px; } } @media only screen and (max-width: 605px) { .expanded #menu ul#mainnav li.AboutSBAS { width: 103% !important; } .expanded #menu ul#mainnav li.AnnualMeeting { width: 100%; } .expanded #menu ul#mainnav li.OpportunitiesforSurgeons, .expanded #menu ul#mainnav li.Surgeons { width: 100%; } .expanded #menu ul#mainnav li.OpportunitiesforResidents, .expanded #menu ul#mainnav li.Residents { width: 100%; } .expanded #menu ul#mainnav li.InformationforStudents, .expanded #menu ul#mainnav li.Students { width: 100%; } .expanded #menu ul#mainnav li.Media { width: 100%; } } @media only screen and (max-width: 600px) { .expanded #menu ul#mainnav li.AboutSBAS a { width: 83% !important; padding-right: 7%; } .expanded #menu ul#mainnav li.AnnualMeeting a { width: 83% !important; padding-right: 7%; } .expanded #menu ul#mainnav li.OpportunitiesforSurgeons a, .expanded #menu ul#mainnav li.Surgeons a { width: 83% !important; padding-right: 7%; } .expanded #menu ul#mainnav li.OpportunitiesforResidents a, .expanded #menu ul#mainnav li.Residents a{ width: 83% !important; padding-right: 7%; } .expanded #menu ul#mainnav li.InformationforStudents a, .expanded #menu ul#mainnav li.Students a{ width: 83% !important; padding-right: 7%; } .expanded #menu ul#mainnav li.Media a { width: 83% !important; padding-right: 7%; } } @media only screen and (max-width: 590px) { .join-mobile a .hide { display: none; } .membership-mobile { right: 225px; } } @media only screen and (max-width: 580px) { input#quicksearch { max-width: 170px; } ul#utility a .hide-2 { display: none; } } @media only screen and (max-width: 539px) { #topnav { height: 121px; } .expanded .mobile-menu-bg { margin-top: 3px !important; } #logos-mobile-sm { max-width: 125px; overflow: hidden; } #logos-mobile-sm img.logo { display: none; visibility: hidden; } #logos-mobile-sm img.logo-550 { display: block; visibility: visible; max-height: 119px; margin-left: 0px; width: auto; } .expanded #menu ul#mainnav li, .expanded #menu ul#mainnav li a { } .expanded ul#utility li a { padding: 5px 13px 3px 12px; } } @media only screen and (max-width: 520px) { .expanded input#quicksearch { max-width: 150px; } .expanded ul#utility li.search { margin-left: 5px; } .expanded ul#utility li a { padding-right: 13px; padding-left: 10px; } } @media only screen and (max-width: 515px) { .expanded #menu ul#mainnav { -webkit-column-count: 1; -moz-column-count: 1; column-count: 1; -webkit-column-width: 100%; -moz-column-width: 100%; column-width: 100%; } .expanded #menu ul#mainnav li.AboutSBAS a { width: 100% !important; padding-right: 0; } .expanded #menu ul#mainnav li.AnnualMeeting a { width: 100% !important; padding-right: 0; } .expanded #menu ul#mainnav li.OpportunitiesforSurgeons a, .expanded #menu ul#mainnav li.Surgeons a { width: 100% !important; padding-right: 0; } .expanded #menu ul#mainnav li.OpportunitiesforResidents a, .expanded #menu ul#mainnav li.Residents a { width: 100% !important; padding-right: 0; } .expanded #menu ul#mainnav li.InformationforStudents a, .expanded #menu ul#mainnav li.Students a { width: 100% !important; padding-right: 0; } .expanded #menu ul#mainnav li.Media a { width: 100% !important; padding-right: 0; } } @media only screen and (max-width: 470px) { .expanded #menu ul#mainnav li ul { margin-left: 1.5%; } .expanded #menu ul#mainnav li.AboutSBAS { width: 100%; } .expanded #menu ul#mainnav li.AnnualMeeting { width: 100%; } .expanded #menu ul#mainnav li.OpportunitiesforSurgeons, .expanded #menu ul#mainnav li.Surgeons { width: 100%; } .expanded #menu ul#mainnav li.OpportunitiesforResidents, .expanded #menu ul#mainnav li.Residents { width: 100%; } .expanded #menu ul#mainnav li.InformationforStudents, .expanded #menu ul#mainnav li.Students { width: 100%; } .expanded #menu ul#mainnav li.Media { width: 100%; } } @media only screen and (max-width: 445px) { .expanded ul#utility { height: 70px; } .expanded ul#utility li { margin-top: -3px; } .expanded ul#utility li a { padding-bottom: 0px; height: 26px; } .expanded ul#utility li.search { width: auto; display: inline-block; position: absolute; margin: 35px auto 0 auto !important; z-index: 100; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .expanded ul#utility li.search form input#quicksearch { max-width: 229px; } ul#utility a .hide-2 { display: inline-block; margin-right: 4px; } } @media only screen and (max-width: 430px) { .join-mobile { right: 152px; } .membership-mobile { right: 215px; } .sbasf-mobile { right: 63px; } } @media only screen and (max-width: 415px) { .join-mobile { top: 47px; right: 141px; } .membership-mobile { top: 47px; right: 200px; } .sbasf-mobile { top: 47px; right: 59px; } .join-mobile a.btn { font-size: 14px !important; } #logos-mobile-sm img.logo-550 { max-height: 103px; margin-left: -4px; margin-top: 7px; } .expand a.show { right: 12px; } } @media only screen and (max-width: 340px) { .expanded ul#utility li a { padding-right: 11px; padding-left: 9px; } .expanded ul#utility li.search form { margin-left: -5px; } .expanded ul#utility li.search form input#quicksearch { max-width: 224px; } .expanded ul#utility li.search form input.search { margin-left: -2px; } } /*-------------------------------------------------------------- END --------------------------------------------------------------*/