/* MOBILE - iphone/ipad css */ softbr { display: none; } @media all and (max-device-width: 1024px) { softbr { display: block; height: 10px; } /* header / footer */ header .slogan { padding-left: 10px; } header .splash { display: none; } .home header .links a { margin-right: 0; } header .links a { padding-right: 0; margin-right: 14px; font-size: 14px; } footer { font-size: 14px; line-height: 1.6; } footer > div:nth-child(1) { padding: 0; color: #ccc; margin-bottom: 15px; } footer > div:nth-child(2) { padding: 0; color: #ccc; margin-bottom: 15px; } footer a { color: #fff; border-color: white; } footer ul { flex-wrap: wrap; } h1 { font-size: 34px; } /* MOBILE content */ .intro_section { padding: 50px 0 20px 0; } .intro_section .hero_desc { font-size: 28px; line-height: 50px; margin-bottom: 20px; } .intro_section .inner { margin: 0; max-width: 100%; padding: 20px; } .intro_section .hero_subdesc { max-width: 100%; } section h1, section h2, section h3, section h4, section h5, section h6, section p { max-width: 100%; } section { width: 100%; padding: 0 10px; } section.about-menu { padding: 0; } .content-about section:first-of-type > p:first-of-type { font-size: 18px; line-height: 30px; } .meta { margin-right: 0px; margin-bottom: 10px; } .modal img { max-width: 100%; } th { overflow: hidden; text-overflow: ellipsis; } section.wide { width: 100%; } .map, .map .applet { height: 360px; } .dataset-heading section { padding: 0; } .dataset-list .dataset { width: 100%; } .dataset-list a { width: 100%; } .content td a { text-overflow: ellipsis; max-width: 100%; overflow: hidden; display: inline-block; } .content-about .team-member { margin: 0 0 10px 0; padding: 10px; } .page_name { display: none; } } /* iphone-specific */ @media all and (max-device-width: 640px) { .right-sidebar { float: none; width: 100%; border: 0; margin: 0 0 14px 0; padding: 0 2px; } .map, .map .applet { height: 360px; } .citationBrowser input.q { max-width: 180px; } .columns { flex-direction: column; } .columns .column { margin: 0; } .columns-2 .column, .columns-3 .column, .columns-4 .column { width: 100%; } .teaser { display: none; } }