html { overflow-y: scroll; }
/* EECS MAIN STYLE SHEET */
body { background-color:white; margin:0; padding:0; font-family:arial,verdana,helvetica,sans-serif; font-size:14px; }
body.eecs {
background:url(/eecs/images/ECE-and-CSE-Gold-Background.png) repeat-x;
}
body.cse-body, body.ece-body {
background:url(/eecs/images/ECE-and-CSE-Gold-Background.png) repeat-x;
}
img { border:0; }
a { outline:none; }
.hide_full { display:none; }
/* general layout */
.blue_bar { width:100%; height:14px; background-color:#003366; } /* top bar */
.blue_bar2 { width:100%; height:38px; background-color:#003366; padding:0; display:block; } /* menu bar */
/* header */
header { width:1024px; height:100px; margin:0 auto; display:block; overflow:hidden; }
#eecs_logo_full {
float:left; width:445px; height:55px; margin-top:19px; margin-left:15px;
background:url(/eecs/images/EECS-Logo.png) top left no-repeat;
}
#eecs_logo_mobile, #cse_logo_mobile, #ece_logo_mobile, .slicknav_menu, div#mobile_hack, .cbd_slicknav_menu { display:none; }
div#mobile_hack2 { /*display:none;*/ height:auto; }
#cse_logo_full {
float:left; width:445px; height:55px; margin-top:19px; margin-left:15px;
background:url(/eecs/images/CSE-Logo.png) top left no-repeat;
}
#ece_logo_full {
float:left; width:445px; height:55px; margin-top:19px; margin-left:15px;
background:url(/eecs/images/ECE-Logo.png) top left no-repeat;
}
#header_right { float:right; width:495px; margin-right:15px; }
#header_tabs { float:left; width:170px; }
#header_search { float:right; width:177px; height:100px; text-align:right; }
#mobile_search { display:none; }
/* header tabs */
.header_tabs {
margin-top:-14px; width:54px; height:68px;
-webkit-border-bottom-right-radius: 6px;
-webkit-border-bottom-left-radius: 6px;
-moz-border-radius-bottomright: 6px;
-moz-border-radius-bottomleft: 6px;
border-bottom-right-radius: 6px;
border-bottom-left-radius: 6px;
cursor: pointer;
-webkit-transition: height 0.25s; /* For Safari 3.1 to 6.0 */
transition: height 0.25s;
}
.eecs_tab { background:url(/eecs/images/EECS-tab.png) no-repeat bottom center #FFCC33; float:right; }
.eecs_tab_maize { background:url(/eecs/images/EECS-maize-tab.png) no-repeat bottom center #003366; float:right; }
.eecs_tab:hover, .ece_tab:hover, .cse_tab:hover, .eecs_tab_maize:hover, .ece_tab_home:hover, .cse_tab_home:hover { height:82px; }
.ece_tab { background:url(/eecs/images/ECE-tab.png) no-repeat bottom center #003366; float:right; margin-left:3px; }
.ece_tab_home { background:url(/eecs/images/ECE-home-tab.png) no-repeat bottom center #FFCC33; float:right; margin-left:3px; }
.cse_tab { background:url(/eecs/images/CSE-tab.png) no-repeat bottom center #003366; float:right; margin-left:3px; }
.cse_tab_home { background:url(/eecs/images/CSE-home-tab.png) no-repeat bottom center #FFCC33; float:right; margin-left:3px; }
/* end header tabs */
/* header search */
#header_search form { margin:10px 0 0 0 ! important; padding:0; border:0 ! important; color:#ffffff ! important; }
#mobile_search form { display:none; }
#header_search > #cse-search-box { width:173px; height:auto; border:0 ! important; margin:0; padding:0; color:#ffffff ! important; }
#header_search > #cse-search-box { border:none ! important; }
#header_search > input.search_button[type=text], #header_search > #cse-search-box input[type=text] {
width:173px; height:28px; background-color:#003366 ! important; margin:0; text-align:center; color:#ffffff ! important;
line-height:28px; font-size:16px; border:0 ! important; padding:0; background-image:none ! important;
}
/* end top search */
/* social links */
.social_wrapper { width:100%; margin:15px auto; text-align:center; }
.social-icons em {display: none;}
ul.social-icons { list-style:none; float:right;margin:0; padding:0; }
.social-icons li{position: relative;float:left;margin:5px;border-radius:15px;-moz-border-radius:15px;-webkit-border-radius:15px;width:30px;height:30px;}
.social-icons li i{font-size:20px;line-height:30px;padding-left:6px;text-align:center;}
.social_wrapper .social-icons li i{padding-left:1px;}
.social-icons li:hover{background-color:#b0b0b0;border-bottom: none;}
.social-icons li .fa-facebook{padding-left:8px;}
.social_wrapper .social-icons li .fa-facebook{padding-left:1px;}
.social-icons li{background-color:#adafb2;}
.social-icons li i{color:#ffffff;}
.social-icons li:hover{background-color:#ffcf06;}
.social-icons li a{text-decoration: none;display:block;}
.social_wrapper6 { width:100%; margin:15px auto; text-align:center; }
.social_wrapper6 .social-icons li{
margin:5px 2px; padding:0; text-align:left; border-radius:12px; -moz-border-radius:12px; -webkit-border-radius:12px; width:25px; height:25px;
}
.social_wrapper6 .social-icons li i{font-size:16px;line-height:25px;text-align:center;}
/* end social links */
/* end header */
/* main menu */
#main_menu_holder { width:1024px; height:38px; margin:0 auto; padding:0; }
#main_menu_holder a, #main_menu_holder a:link, #main_menu_holder a:visited { color:#ffffff; }
#main_menu_holder .selected a, #main_menu_holder a:hover { color:#ffcc33; }
nav.main_menu { float:none; width:100%; max-width:1024px; height:38px; }
nav.main_menu ul { position: relative; margin:0; padding:0; list-style:none; display:table; width:100%; }
nav.main_menu ul div#menu_right_wrapper {
display:table; width:26%; float:right; text-align:right; margin-right:0.5%; margin-left:1px;
}
nav.main_menu ul div#menu_left_wrapper {
display:table; width:72%; float:left; text-align:left; margin-left:0.5%; margin-right:-1px;
}
nav.main_menu ul li { position: relative; display:inline-block; line-height:37px; padding:0 1.5%; }
nav.main_menu ul li a, nav.main_menu ul li a:link, nav.main_menu ul li a:active, nav.main_menu ul li a:visited {
text-decoration:none; font-weight:normal; color:#ffffff; font-size:16px;
}
nav.main_menu ul li a:hover { color:#ffcc00; }
nav.main_menu ul li a.current { color:#FFCC33; }
/* right_side menu items */
nav.main_menu ul li.menu_right { padding:0 3.25%; }
nav.main_menu ul li.menu_right a, nav.main_menu ul li.menu_right a:link,
nav.main_menu ul li.menu_right a:active, nav.main_menu ul li.menu_right a:visited {
color:#99ccff;
}
/* end right side menu items */
/* main drop menu */
nav.main_menu ul li ul {
display:none; position:absolute; text-align:left; list-style:none; top:37px; left:0px; padding:0; margin:0;
background: #003366; opacity:0.94; z-index:999;
}
nav.main_menu ul li ul { width:244px; }
nav.main_menu ul li.menu_right ul { width:190px; }
nav.main_menu ul li ul li { display:block; border-bottom:2px solid #2e5276; padding-left:4%; }
nav.main_menu ul li ul li a {
float:none; font-weight:normal ! important; font-size:14px ! important; color:#ffffff ! important;
text-align:left ! important; line-height:normal ! important; display:block; padding:5% 1.5%;
}
nav.main_menu ul li ul li a:hover { color:#FFCC33 ! important; }
/* end main drop menu */
/* end main menu */
/* slide show */
.container { clear:both; margin:0 auto; width:1024px; max-height:381px; padding:0; height:auto; }
/* Prevent the slideshow from flashing on load */
#slides { display: none; }
.slidesjs-pagination { clear:both; position:relative; top:-3em; margin: 0 20px 0 0; float: right; list-style: none; z-index:998; }
.slidesjs-pagination li { float: left; margin: 0 1px; }
.slidesjs-pagination li a {
display: block; width: 22px; height: 0; padding-top: 22px; background-image: url(/eecs/images/pagination.png);
background-position: 0 0; float: left; overflow: hidden; background-color:transparent;
}
.slidesjs-pagination li a.active, .slidesjs-pagination li a:hover.active { background-position: 0 -22px; }
.slidesjs-pagination li a:hover { background-position: 0 -44px; }
.slidesjs-navigation { display:none; }
/* end slide show */
/* internal page slideshow */
#slide_internal.container, #slide_internal { width:100%; max-height:283px; max-width:760px; padding:0 ! important; margin:0 auto ! important; }
#slide_internal #slides { padding:0 ! important; margin:0 auto ! important; max-height:283px; }
#slide_internal img { padding:0 ! important; margin:-10px auto 0 auto ! important; width:100%; height:auto; }
#slide_internal .slides-js-container { padding:0 ! important; margin:0 auto ! important; width:100%; height:auto; }
/* RA QL MENU */
/* research areas and quick links */
#mid_menu { clear:both; margin:0 auto; width:1024px; height:56px; background-color:#faf6e8; padding:0; position:relative; }
#ra_wrapper, #ql_wrapper { width:50%; margin:0; padding:0; text-align:center; }
#ra_wrapper { float:left; }
#ql_wrapper { float:right; }
#mid_menu ul { margin:4px; width:200px; float:left; list-style-type:none; text-align:left; }
#ra_wrapper div.subs, #ql_wrapper div.subs { position:relative; }
#ra_wrapper div.sub_drop, #ql_wrapper div.sub_drop {
padding:4px; margin:0; position:absolute; top:-1px; z-index:1; display:none; width:508px;
height:auto; background: #003366; opacity:0.94;
}
#mid_menu a, #mid_menu a:link, #mid_menu a:hover, #mid_menu a:active {
display:block; line-height:56px; margin:0 auto; width:43%; color:#003366; font-size:18px; text-decoration:none; background-color:#c6d9f1;
}
#mid_menu a:hover { background-color:#FFCC33; text-decoration:none ! important; }
#mid_menu ul li a, #mid_menu ul li a:link, #mid_menu ul li a:active, #mid_menu ul li a:visited {
color:#ffffff; margin:0 0 0 -30px ! important; padding:0 ! important; text-decoration:none; text-align:left ! important;
font-size:12px ! important; line-height:20px ! important; width:auto ! important; background-color:#003366;
}
#mid_menu ul li a:hover { background:transparent ! important; color:#FFCC33; text-decoration:none ! important; }
#ra_wrapper div.sub_drop ul li:first-child {color:#FFCF06;display:block;width:240px;text-align:left;margin:0 0 0 -30px ! important; padding:0 ! important;}
#ra_wrapper div.sub_drop ul li:first-child a {margin-left:0px ! important; }
/* adjustment for left sidebar display */
#left_sidebar #mid_menu { width:100%; height:auto; background:transparent; margin-top:13%; margin-bottom:13%; }
#left_sidebar #ra_wrapper {
width:100%; float:none; margin:4% 0 2% 0; /*background-color:#f1ede8;*/ background-color:#acc1ea;
}
#left_sidebar #ql_wrapper {
width:100%; float:none; margin:0 0 4% 0; /*background-color:#f1ede8;*/ background-color:#acc1ea;
}
#left_sidebar #mid_menu a, #left_sidebar #mid_menu a:link, #left_sidebar #mid_menu a:hover, #left_sidebar #mid_menu a:active {
width:100%; font-size:16px; line-height:35px; margin:auto ! important; text-decoration:none ! important; font-weight:normal;
}
#left_sidebar #ra_wrapper div.sub_drop, #left_sidebar #ql_wrapper div.sub_drop { left:100%; top:-35px; }
#mid_menu #ra_wrapper a:hover { text-decoration:none; }
/* research areas and quick links */
/* END RA QL MENU */
/* content area */
#content_holder { width:100%; max-width:1024px; height:auto; min-height:800px; margin:0 auto; background-color:#ffffff; }
#content_holder #feature { width:100%; height:auto; margin:0 auto; }
#content_holder #feature img { width:100%; }
.columns { display:table; border-collapse:collapse; }
#content_row { display:table-row; padding:0; }
/* content with side menu/s */
#content_body { display:table-cell; vertical-align:top; padding:3% 4% 4% 4%; max-width:560px; width:auto; }
.full { max-width:760px ! important; }
#content_body #feature { width:100%; height:auto; }
#content_body #feature img { width:100%; }
/* content with left menu only */
#content_row > #content { padding:3% 4% 4% 4.25%; max-width:820px; }
/* safari hack */
/* safari doesn't do display:table well, so we have to work around it */
_::-moz-svg-foreign-content, :root .full { max-width:760px ! important; padding:3% 2% 2% 2%; }
_::-moz-svg-foreign-content, :root .columns { display:block; }
_::-moz-svg-foreign-content, :root #content_row { display:block; }
_::-moz-svg-foreign-content, :root #content_body { display:block; }
/* external event template */
#content_holder.external { border:1px solid #ececec; max-width:1000px; margin-top:0; padding-top:0; }
#content_holder.external #left_sidebar { margin-top:0; padding-top:0; }
#content_holder.external nav#left_nav ul li a:hover { background-color:#76a9d6 ! important; }
#content_holder.external h1 { color:#76a9d6 ! important; }
/* SIDEBARS */
#left_sidebar, #right_sidebar { display:table-cell; vertical-align:top; padding-top:3%; padding-left:0; padding-right:0; }
/* left menu */
#left_sidebar { width:18%; max-width:179px; min-width:120px; }
nav#left_nav { background-color:#ececec; padding-top:10px; padding-bottom:0px; }
nav#right_nav { background-color:#f1ede8; padding:0; margin:0; }
nav#left_nav ul { margin:0; padding:0; list-style:none; width:100%; font-size:13px; }
nav#right_nav ul { margin:0; padding:0; list-style:none; width:100%; font-size:13px; } /* was margin-right:10%; */
nav#left_nav ul li { padding:0; border-bottom:1px solid #c7c7c7; /*#989898;*/ }
nav#left_nav ul li.last { border-bottom:0; }
nav#right_nav ul li { margin:0 ! important; padding:0; border-bottom:1px solid #ffffff; } /* was margin:5%; djh*/
nav#left_nav ul li.subtitle { font-weight:normal; letter-spacing:normal; display:block; padding:5%; background-color:#a4bcd4; }
nav#right_nav ul li.subtitle {
font-weight:bold; letter-spacing:normal; display:block; padding:5%; color:#cc9900; font-size:16px;
border-bottom:1px solid #cc9900;
}
nav#left_nav ul li a, nav#left_nav ul li a:link, nav#left_nav ul li a:active, nav#left_nav ul li a:visited {
text-decoration:none; font-weight:normal; color:#000000; display:block; padding:5%; font-size:13px; margin:auto ! important;
}
nav#right_nav ul li a, nav#right_nav ul li a:link, nav#right_nav ul li a:active, nav#right_nav ul li a:visited {
text-decoration:none; font-weight:normal; color:#000000; display:block; padding:3% 5% 3% 5%; font-size:13px; margin:auto ! important;
}
nav#left_nav ul li a:hover { background-color:#acc1ea; /*#a4bcd4;*/ }
nav#left_nav ul li.last a:hover { } /* this was here from when we added rounded corners */
nav#left_nav ul li a.current, nav#left_nav ul li a.current:visited { color:#ffffff; background-color:#003366; }
/*djh*/
nav#left_nav ul li a.current2, nav#left_nav ul li a.current2:visited { color:#ffffff; background-color:#003366; }
nav#right_nav ul li a.current, nav#right_nav ul li a.current:visited { color:#ffffff; background-color:#cc9900; }
nav#right_nav ul li a:hover { color:#ffffff; background-color:#cc9900; }
nav#left_nav ul li.last a.current, nav#left_nav ul li.last a.current:visited {
color:#ffffff ! important; background-color:#003366 ! important;
}
/* right menu */
#right_sidebar { width:20%; max-width:200px; }
/* buttons */
#left_sidebar .button, #right_sidebar .button { width:100%; padding:0%; display:block; margin:2% 0; clear:both; }
#left_sidebar .button img, #right_sidebar .button img { width:100%; }
.vcenter { display: inline-block; vertical-align: middle; line-height:normal; }
/* safari doesn't do display:table well, so we have to work around it */
_::-moz-svg-foreign-content, :root #left_sidebar { display:block; width:18%; float:left; }
_::-moz-svg-foreign-content, :root #content_body { display:block; float:left; }
_::-moz-svg-foreign-content, :root #right_sidebar { width:24%; float:right; }
/* END SIDEBARS */
@-moz-document url-prefix() {
#content_holder.columns { height:800px; }
}
/* generic columns */
.one_column { clear:both; width:100%; margin:18px 0 1px 0; overflow:hidden; height:auto; }
.two_column { float:left; width:45%; margin:0 2.5% 0 2.5%; }
.three_column { float:left; width:30%; margin:1%; }
.four_column { float:left; width:24%; max-width:236px; margin:0.5%; padding:0; }
.five_column { float:left; width:18%; margin:1%; padding:0; max-width:204px; }
.six_column { float:left; width:16%; max-width:158px; margin:0.25%; padding:0; font-size:12px; color:#000000; }
.explore { max-height:145px; }
.four_column img, .six_column img, .five_column img, .three_column img, .two_column img, .four_two_column img { width:100%; height:auto; border:0; margin:0 auto; }
.four_column img.fixed-size, .six_column img.fixed-size, .five_column img.fixed-size, .three_column img.fixed-size,
.two_column img.fixed-size, .four_two_column img.fixed_size {
width:auto; height:auto; border:0; margin:0 auto;
}
/* four_two_column shows 4 at full width; 2 (vs. 1) on mobile */
.four_two_column { float:left; width:24%; max-width:236px; margin:0.5%; padding:0; }
.numbers img { max-width:159px; }
.steves img { max-width:221px; }
.one_column_75 { width:75%; margin:1% auto; clear:both; }
.two_column_25 { float:left; width:25%; margin:1%; clear:both; }
.two_column_75 { float:right; width:71%; margin: 1%; }
.two_column_25 img { width:100%; max-width:200px; height:auto; }
.two_column_75 img { width:100%; max-width:500px; height:auto; }
.two_column_25r { float:right; width:25%; margin:1%; }
.two_column_75l { float:left; width:71%; margin: 1%; clear:both; }
.two_column_25r img { width:100%; max-width:200px; height:auto; }
.two_column_75l img { width:100%; max-width:500px; height:auto; }
.two_column_66 { float:left; width:64%; margin:1%; clear:both; }
.two_column_33 { float:right; width:31%; margin: 1%; }
.two_column_66 img { width:100%; max-width:448px; height:auto; }
.two_column_33 img { width:100%; max-width:217px; height:auto; }
.two_column_50l { float:left; width:48%; margin:1%; clear:both; }
.two_column_50r { float:right; width:48%; margin: 1%; }
.two_column_50l img { width:100%; max-width:350px; height:auto; }
.two_column_50r img { width:100%; max-width:350px; height:auto; }
.two_column_60 { float:left; width:58%; margin:1%; clear:both; }
.two_column_40 { float:right; width:36%; margin: 1%; padding:0 0 0 2%; }
.two_column_60 img { width:100%; max-width:593px; height:auto; }
.two_column_40 img { width:100%; max-width:389px; height:auto; }
.three_column_33l { float:left; width:31%; margin:0; clear:both; padding:1% 2% 0 0 ! important; max-width:296px; }
.three_column_33c { float:left; width:31%; margin:0 auto; padding:1% 0 0 2% ! important; max-width:296px; }
.three_column_33r { float:right; width:31%; margin:0; padding:1% 0 0 2% ! important; max-width:296px; }
.three_column_33l img, .three_column_33c img, .three_column_33r img { width:100%; max-width:233px; height:auto; }
.four_column_25l { float:left; width:23%; margin:0; clear:both; padding:1% 2% 0 0 ! important; max-width:173px; }
.four_column_25c { float:left; width:23%; margin:0; padding:1% 0 0 2% ! important; max-width:173px; }
.four_column_25r { float:right; width:23%; margin:0; padding:1% 0 0 2% ! important; max-width:173px; }
.four_column_25l img, .four_column_25c img, .four_column_25r img { width:100%; max-width:175px; height:auto; }
img.actual_size { max-width:100% ! important; }
img.percent25 { width:24%; }
img.percent50 { width:49%; }
img.percent30 { width:32%; }
.col_drop { } /* see media query 767 */
/* end generic columns */
/* home news section */
#news_wrapper { width:65%; margin:0; padding:1%; float:left; height:auto; }
/* end home news section */
/* home events section */
#events_wrapper { width:30%; float:right; margin:0; padding:1% 1% 1% 2%; height:auto; }
#news_wrapper a, #news_wrapper a:link, #news_wrapper a:visited, #news_wrapper a:active,
#events_wrapper a, #events_wrapper a:link, #events_wrapper a:visited, #events_wrapper a:active {
color:#000000; text-decoration:none; font-size:14px;
}
#news_wrapper a:hover, #events_wrapper a:hover { color:#a4bcd4; }
.wrapper { width:98%; padding:1%; clear:both; }
.icon_left { width:16%; float:left; margin-bottom:2%; }
.item_right { width:82%; float:right; margin-bottom:2%; }
/* end home events section */
/* floating columns */
.right_float_33 { width:28%; float:right; margin:0; padding:0 1.5% 0 1.5%; float:right; height:auto; }
/* FOOTER */
.footer_bar { clear:both; width:100%; background-color:#002147; height:auto; font-size:14px; }
#footer { width:1024px; padding:0; height:auto; margin: 0 auto; }
#footer_left { width:49%; float:left; margin:0 0 0 15px; padding:0; }
#footer_right { width:48%; float:right; margin:0 15px 0 0; padding:0; }
#footer_logo { margin:15px 0 0 0; width:363px; height:47px; background:url(/eecs/images/EECS-Rev-Logo.png) top left no-repeat; }
#footer_logo_ece { margin:15px 0 0 0; width:363px; height:47px; background:url(/eecs/images/ECE-Rev-Logo.png) top left no-repeat; }
#footer_logo_cse { margin:15px 0 0 0; width:363px; height:47px; background:url(/eecs/images/CSE-Rev-Logo.png) top left no-repeat; }
#footer_wrapper { width:100%; margin:0; }
nav.footer { clear:both; width:98%; height:auto; border:1px solid #002147; }
nav.footer2 { float:right; width:50%; max-width:100px; height:47px; text-align:right; margin-top:15px; }
nav.footer ul, nav.footer2 ul, #copyright ul { position: relative; padding:0; list-style:none; }
nav.footer ul li, #copyright ul li { position: relative; display:inline-block; line-height:20px; padding:0; color:#ffffff; }
nav.footer2 ul li { position: relative; display:inline-block; line-height:17px; padding:0; color:#ffffff; }
nav.footer ul li a, nav.footer ul li a:link, nav.footer ul li a:active, nav.footer ul li a:visited,
#copyright ul li, #copyright ul li a, #copyright ul li a:link, #copyright ul li a:active, #copyright ul li a:visited,
nav.footer2 ul li a, nav.footer2 ul li a:link, nav.footer2 ul li a:active, nav.footer2 ul li a:visited {
text-decoration:none; font-weight:normal; color:#ffffff; font-size:14px;
}
nav.footer ul li.first a { padding:0 27px 0 0; }
nav.footer ul li.last a { padding:0 0 0 27px; }
nav.footer ul li a:hover, nav.footer2 ul li a:hover, #copyright ul li a:hover { color:#ffcc33; }
.footer_social_wrapper { float:right; text-align:left; margin-top:15px; height:47px; width:200px; }
/* footer social for ECE */
.footer_social_wrapper6 { float:right; text-align:left; margin-top:15px; height:47px; width:200px; }
.footer_social_wrapper6 .social-icons li{
margin:5px 2px; padding:0; text-align:left; border-radius:12px; -moz-border-radius:12px; -webkit-border-radius:12px; width:25px; height:25px;
}
.footer_social_wrapper6 .social-icons li i{font-size:16px;line-height:25px;text-align:center;}
/* end ECE footer social */
#copyright { clear:both; text-align:right; color:#ffffff; line-height:20px; border:1px solid #002147; font-size:12px; }
#copyright p, #copyright ul, #copyright li { font-size:12px ! important; }
#copyright a, #copyright a:link, #copyright a:active, #copyright a:visited { color:#ffffff; font-size:12px ! important; }
/* end footer menu */
/* END FOOTER */
/* testing only */
#test {
display:none;
}
/* common */
.clear_fix { clear:both; }
.first_item { margin-top:10px; }
.center { text-align:center; }
/* retina images */
@media only screen and (min--moz-device-pixel-ratio: 2),
only screen and (-o-min-device-pixel-ratio: 2/1),
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (min-device-pixel-ratio: 2) {
#eecs_logo_full { background:url(/eecs/images/EECS-Logo-Hi.png) top left no-repeat; background-size: 445px 55px; }
#cse_logo_full { background:url(/eecs/images/CSE-Logo-Hi.png) top left no-repeat; background-size: 445px 55px; }
#ece_logo_full { background:url(/eecs/images/ECE-Logo-Hi.png) top left no-repeat; background-size: 445px 55px; }
#footer_logo { background:url(/eecs/images/EECS-Logo-Rev-Hi.png) top left no-repeat; background-size: 363px 47px; }
#footer_logo_cse { background:url(/eecs/images/CSE-Logo-Rev-Hi.png) top left no-repeat; background-size: 363px 47px; }
#footer_logo_ece { background:url(/eecs/images/ECE-Logo-Rev-Hi.png) top left no-repeat; background-size: 363px 47px; }
.eecs_tab { background:url(/eecs/images/EECS-tab-Hi.png) no-repeat bottom center #ffcc33; background-size: 54px 68px; }
.ece_tab { background:url(/eecs/images/ECE-tab-Hi.png) no-repeat bottom center #003366; background-size: 54px 68px; }
.cse_tab { background:url(/eecs/images/CSE-tab-Hi.png) no-repeat bottom center #003366; background-size: 54px 68px; }
.eecs_tab_maize { background:url(/eecs/images/EECS-maize-tab-Hi.png) no-repeat bottom center #003366; background-size: 54px 68px; }
.ece_tab_home { background:url(/eecs/images/ECE-home-tab-Hi.png) no-repeat bottom center #ffcc33; background-size: 54px 68px; }
.cse_tab_home { background:url(/eecs/images/CSE-home-tab-Hi.png) no-repeat bottom center #ffcc33; background-size: 54px 68px; }
}
/* RESPONSIVE STUFF */
/*
as soon as screen gets below 1024, but before it hits 924
affects desktop and laptop - not ipad
MUST MAKE ADDITIONS/CHANGES HERE TO THE NEXT SECTION, TOO!
*/
@media only screen and (max-width: 1023px) {
header, #main_menu_holder, #big_slide_wrapper, #mid_menu, .container, nav.main_menu, #footer { width:100%; max-width:1023px; }
.container { height:auto; position: relative; height: 0; overflow: hidden; padding-bottom:37.21%; }
.container img { width:100%; height:auto; outline:0; }
#mid_menu { margin-top:0; }
#header_right { width:48%; max-width:495px; margin-right:8px; }
#eecs_logo_full, #cse_logo_full, #ece_logo_full {
width:43%; max-width:445px; max-height:55px; background-size: 100%; margin-left:8px;
}
#footer_logo, #footer_logo_ece, #footer_logo_cse { width:100%; max-width:290px; background-size: 100%; }
#footer_left { margin-left:8px; width:49%; }
#footer_right { margin-right:8px; width:48.5%; }
_::-moz-svg-foreign-content, :root #content_body { max-width:80% ! important; padding:3% 1% 2% 2%; }
_::-moz-svg-foreign-content, :root .full {
max-width:760px ! important; padding:3% 1% 2% 2%; margin-right:-50px;
}
/* internal page slideshow */
#slide_internal.container, #slide_internal { height:auto; }
}
@media only screen and (max-width: 980px) {
.hide_mob { display:none; }
nav.main_menu ul div#menu_left_wrapper { width:74%; margin-left:0.25%; }
nav.main_menu ul div#menu_right_wrapper { width:25%; margin-right:0.25%; }
.four_column_25l { width:46%; margin:0 ! important; padding:2% ! important; max-width:350px; }
.four_column_25c { width:46%; margin:0 ! important; padding:2% ! important; max-width:350px; float:right; }
.four_column_25c + .four_column_25c { width:46%; margin:0 ! important; padding:2% ! important; max-width:350px; float:left; }
.four_column_25r { width:46%; margin:0 ! important; padding:2% ! important; max-width:350px; }
.no_space_mobile, .no_space_mobile + .no_space_mobile { padding-top:0 ! important; padding-bottom:0 ! important; }
.no_space_mobile ul { margin-top:0 ! important; margin-bottom:0 ! important; }
}
/*
for ipad in portrait mode
should be okay for iphone 4
and desktops/laptops down to 768 width
*/
@media only screen and (max-width: 924px) {
header, #main_menu, #big_slide_wrapper, #mid_menu { width:100%; max-width:1020px; }
#header_right { width:48%; max-width:370px; }
#eecs_logo_full, #cse_logo_full, #ece_logo_full { width:43%; max-width:390px; }
#footer_logo, #footer_logo_ece, #footer_logo_cse { margin-top:2%; width:100%; max-width:290px; }
#footer { max-width:1020px; }
.footer_social_wrapper, nav.footer2 {
height:auto; margin-top:1%; margin-bottom:1.25%;
}
#copyright { padding:0; width:100%; }
#copyright ul li a { padding:0; }
nav.footer ul, #copyright ul { width:auto; }
nav.footer ul li, #copyright ul li { line-height:20px; padding:2% 0 0 0; color:#ffffff; }
nav.footer ul li.first a { padding:0 1em 0 0; }
nav.footer ul li.last a { padding:0 0 0 1em; }
nav.footer2 ul li { padding:0; color:#ffffff; }
nav.main_menu ul div#menu_left_wrapper { width:74%; margin-left:0.5%; }
nav.main_menu ul div#menu_right_wrapper { width:25%; margin-right:0.5%; }
nav.main_menu ul li { padding:0 1.125%; }
nav.main_menu ul li.menu_right { padding:0 2.25%; }
nav.main_menu ul li a, nav.main_menu ul li a:link, nav.main_menu ul li a:active, nav.main_menu ul li a:visited { font-size:1em; }
#mid_menu a, #mid_menu a:link, #mid_menu a:hover, #mid_menu a:active { width:46%; }
}
@media only screen and (max-width: 767px) {
.clear_mobile { clear:both; width:100%; height:1px; display:block; }
.blue_bar { height:7px; }
.blue_bar2 { display:none; }
header { width:100%; max-width:767px; height:auto; }
#eecs_logo_full, #cse_logo_full, #ece_logo_full, .social_wrapper { display:none; }
#main_menu_holder, .hide767 { display:none ! important; }
div#mobile_hack { display:block; width:100%; height:auto; margin:1% 0 0 0; padding:0; background-color:#003366; }
div#mobile_hack2 { display:block; width:100%; margin:0 0 0 0; padding:0; }
#eecs_logo_mobile, #cse_logo_mobile, #ece_logo_mobile {
float:left; display:block; width:53.75%; max-width:20em; margin:0; padding:0; text-align:center; border:0;
}
#eecs_logo_mobile img, #cse_logo_mobile img, #ece_logo_mobile img { width:87.79%; margin:1.9% auto; padding:0; border:0; }
#header_right { float:right; display:block; margin:0; padding:0; width:46.25%; text-align:center; height:4em; }
#header_tabs { float:none; margin:0 auto 0 auto ! important; width:100%; max-width:11.1em; height:3.9em; padding:0; }
.header_tabs {
float:right; margin-top:0; width:30%; max-width:3.7em; height:3.9em; text-align:center; background-position:center center;
}
.eecs_tab:hover, .ece_tab:hover, .cse_tab:hover { height:3.8em; width:30%; max-width:3.7em; }
#header_search, #header_search form { display:none; }
#mobile_search { float:right; text-align:right; margin:0; padding:1%; width:40%; display:block; height:3em; }
#mobile_search form { float:right; padding:0; border:0; width:90%; display:block; margin: 4% 2% 0 0; }
input.search_button[type=text] {
background-color:#ffffff; color:#003366;
border:0; outline:0; width:80%; margin:0 5px 0 0; height:1.125em;
position: relative; vertical-align: middle; padding: 0.438em 0.625em 0.438em 0.625em;
-webkit-border-radius:0;
-moz-border-radius:0;
border-radius:0;
}
nav.main_menu ul li.menu_right { float:left; }
.js .slicknav_menu { display:block; width:56%; padding:1.5% 1% 1% 1%; margin:0; float:left; }
.js .cbd_slicknav_menu { display:block; width:80%; padding:1.5% 1% 1% 1%; margin:0; float:left; }
.js #main_menu { display:none; }
.js #cbd_mobile { display:none; }
#left_sidebar, #left_nav, .internal_mid, #left_nav #mid_menu .internal_mid { display:none ! important; }
/* research areas and quick links -- home page only */
#mid_menu {
clear:both; margin:0 auto 1% auto; width:100%; max-width:767px; background-color:#003366; padding:0; height:auto;
}
#ra_wrapper, #ql_wrapper { height:auto; margin:2%; width:46%; }
#mid_menu ul { margin:0; width:85%; float:none; list-style-type:none; text-align:left; line-height:normal; }
#mid_menu a, #mid_menu a:link, #mid_menu a:active {
display:block; line-height:2.25em; margin:0 auto; width:95%; background-color:#ffcc33; color:#003366;
font-size:1.0em; text-decoration:none;
}
#ra_wrapper div.subs, #ql_wrapper div.subs { position:absolute; left:0; width:98%; }
#ra_wrapper div.sub_drop, #ql_wrapper div.sub_drop {
padding:1%; margin:0; position:absolute; top:-2px; left:1%; z-index:1; display:none; width:98%; height:auto; opacity:1.0;
}
#mid_menu ul li a, #mid_menu ul li a:link, #mid_menu ul li a:active, #mid_menu ul li a:visited {
color:#ffffff; background-color:#003366; margin:0 0 0 -5% ! important; padding:1% ! important; text-decoration:none;
text-align:left ! important; font-size:1.0em ! important; line-height:2.125em ! important; width:98%;
}
#mid_menu ul li a:hover { color:#ffcc33; }
/* research areas and quick links */
/* content area */
.one_column { margin:1.5% auto 0 auto; }
.grid_left { clear:both; float:left; text-align:center; }
.grid_mid { float:left; text-align:center; }
.grid_right { float:right; text-align:center; }
.four_column, .explore { width:49%; max-width:49%; margin:1% auto; }
.four_column img { margin:1% auto; max-width:236px; }
.six_column { width:32%; max-width:32%; margin:0.65% ! important; text-align:center; }
.six_column img { max-width:158px; }
.five_column img { max-width:159px }
.six_column span { display:block; width:158px; max-width:158px; }
.four_column img.fixed-size, .five_column img.fixed-size, .six_column img.fixed-size { max-width:auto; }
.right_float_33 { width:28%; float:right; margin:0; padding:0 1.5% 0 1.5%; }
.col_drop, .three_column_33l .col_drop {
clear:both ! important; float:none ! important; width:96% ! important; margin:1% ! important; padding:1% ! important; max-width:765px ! important;
}
.four_column_25l { width:96%; margin:0 ! important; padding:2% ! important; max-width:676px; float:none; }
.four_column_25c { width:96%; margin:0 ! important; padding:2% ! important; max-width:676px; float:none; }
.four_column_25c + .four_column_25c { width:96%; margin:0 ! important; padding:2% ! important; max-width:676px; float:none; }
.four_column_25r { width:96%; margin:0 ! important; padding:2% ! important; max-width:676px; float:none; }
#content_holder, #content_holder.columns, #content_row, #content_body { width:100%; }
/* for home page only */
#content_holder .one_column #news_wrapper p { display:none; }
#content_holder .one_column #news_wrapper p.show_mob { display:block; margin-bottom:0; }
#content_holder .one_column #news_wrapper { clear:both; float:none; width:96%; margin-bottom:0 ! important; padding-bottom:0 ! important; }
#content_holder .one_column #events_wrapper { clear:both; float:none; width:96%; margin:0.5% 0 0 0; padding:0 1% 1% 1%; }
#content_body { padding:2% 1% 1% 1% ! important; }
/* end home page only */
#news_wrapper .two_column { clear:both; float:none; width:98%; padding:1%; }
/* for internal pages only */
.wrapper #news_wrapper { float:none; width:98%; padding:1%; }
.wrapper #events_wrapper { clear:both; float:none; width:98%; padding:1%; }
/* end internal pages only */
.explore img, .numbers img { width:100%; margin:0 auto; }
/* footer */
#footer { width:98%; padding:1%; max-width:1020px; height:auto; }
#footer_left { width:100%; max-width:26.25em; float:none; margin:1%; }
#footer_logo, #footer_logo_ece, #footer_logo_cse { max-width:20em; background-size:100%; min-height:3.5em; }
#footer_right { float:none; clear:both; width:100%; max-width:26.25em; margin:1%; }
nav.footer ul li.first a { padding:0 0.5em 0 0; font-size:1em; }
nav.footer ul li.last a { padding:0 0 0 0.5em; font-size:1em; }
nav.footer2 a { font-size:1em ! important; }
nav.footer2 { float:left; width:25%; max-width:6em; height:auto; text-align:left; }
.footer_social_wrapper { float:right; text-align:left; margin-top:2%; width:70%; max-width:15em; }
#copyright ul li, #copyright ul li a, #copyright ul li a:link, #copyright ul li a:active, #copyright ul li a:visited {
font-size:1em; padding:0; text-align:right;
}
.slidesjs-pagination { display:none; }
.slidesjs-navigation { display:block; position:relative ! important; top:-2.5em; z-index:998; }
#slides a.slidesjs-navigation { opacity:0.55; }
#slides a:hover.slidesjs-navigation { opacity:0.75; }
#slides a:link, #slides a:visited { color: #ffffff; font-size:4em; text-decoration:none; }
#slides a:hover, #slides a:active { color: #ffcc33; font-size:4em; text-decoration:none; }
#slides .slidesjs-previous { float: left; }
#slides .slidesjs-next { float:right; }
#right_sidebar.drop, #content_body.drop, .column_drop {
clear:both ! important; float:none ! important; width:96% ! important; max-width:96% ! important; display:block;
margin:2% ! important; padding:0 ! important;
}
.cbd_slicknav_nav li.subtitle { line-height:2.0 ! important; padding-top:10px; padding-bottom:10px; }
.hide767 { display:none; }
.show767 { display:block; }
.no_space_mobile, .no_space_mobile + .no_space_mobile { padding-top:0 ! important; padding-bottom:0 ! important; }
.no_space_mobile ul { margin-top:0 ! important; margin-bottom:0 ! important; }
}
@media only screen and (max-width: 600px) {
.grid_one { clear:both; float:left; text-align:center; }
.grid_two { float:right; text-align:center; }
.four_two_column { width:49%; max-width:49%; margin:1% 0.5%; }
}
@media only screen and (max-width: 500px) {
#content_body { max-width:500px; padding:0; }
.one_column { margin:2% auto 2% auto ! important; height:auto; }
.two_column, .four_column, .you_tube, .image555, .image767 {
clear:both; float:none; margin:2% auto 2% auto ! important; width:96% ! important; max-width:96% ! important;
height:auto; max-height:auto;
}
.you_tube img, .image555 img, .image767 img {
width:92%; max-width:92% ! important; padding:0 ! important;
}
.imageFull img { max-width:460px; }
.wide_image { max-width:460px ! important; }
.wide_image img { max-width:460px ! important; }
#image, #image img { max-width:460px ! important; }
.five_col { clear:both; float:none; margin:1% auto 1% auto; width:100%; max-width:100%; height:auto; max-height:auto; }
.five_column { width:50%; max-width:50%; margin:1% auto; }
.grid_left, .grid_right, .grid_mid { clear:both; float:none; width:98%; max-width:98%; height:auto; max-height:auto; }
.wrap_row { margin-top:-3% ! important; }
.four_column img { margin:0 auto; max-width:100%; width:100%; min-width:236px; max-width:12em; text-align:center; }
.five_column img { margin:0 auto; max-width:100%; width:100%; min-width:158px; max-width:11.75em; text-align:center; }
.four_column img.fixed-size, .five_column img.fixed-size, .six_column img.fixed-size { max-width:auto; }
#news_wrapper { clear:both; float:none; width:98%; }
#events_wrapper { clear:both; float:none; width:98%; margin:1.5% 0 0 0; padding:1%; }
/* footer */
#footer { width:98%; padding:1%; max-width:500px; height:auto; }
#footer_left { width:98%; max-width:500px; float:none; margin:0.5%; }
#footer_logo, #footer_logo_ece,#footer_logo_cse { max-width:19em; background-size:100%; min-height:3.5em; }
#footer_right { float:none; clear:both; width:98%; margin:0.5%; }
.slidesjs-navigation { top:-1.75em; }
#mobile_search form { margin: 6% 2% 0 0; }
}
@media only screen and (max-width: 450px) {
.social-inline { margin-right:-2px; width:55%; }
.social-inline .social-icons li { margin:2px 1.5px 1.5px 1.5px; }
}