/*------------------------------------------------------------------ helper */ @-moz-keyframes rotate { 0% { -moz-transform: rotate(0deg); transform: rotate(0deg); } 100% { -moz-transform: rotate(1080deg); transform: rotate(1080deg); } } @-webkit-keyframes rotate { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(1080deg); transform: rotate(1080deg); } } @keyframes rotate { 0% { -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -moz-transform: rotate(1080deg); -ms-transform: rotate(1080deg); -webkit-transform: rotate(1080deg); transform: rotate(1080deg); } } .cb { clear: both; } .cb:before { content: " "; display: table; } .cb:after { content: " "; display: table; clear: both; } .overflow-hidden { overflow: hidden; } .spinner { width: 100%; position: relative; height: 100px; z-index: 0; } .spinner:after { content: ''; z-index: 1; position: absolute; left: 50%; top: 50%; margin-left: -14px; margin-top: -14px; width: 29px; height: 29px; background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB0AAAAdCAMAAABhTZc9AAAAUVBMVEXc3Nz////c3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NwE6Ok2AAAAGnRSTlMAAAEHDg8oLS8/QkR5fZmarL/H29zq6/Dy+eBwaHkAAABQSURBVHgBY2DEBwa1LAMIcPEJS+KSZROUAgIcspwSUmI87MzYZdnEpQRYcdnLJCQlwITTVdxSoiy43cwvxYvHRyJSHHhkJaWYh1IcIcCoLAD3aQWtupkg+gAAAABJRU5ErkJggg==) no-repeat; -moz-animation: rotate 2s linear infinite backwards; -webkit-animation: rotate 2s linear infinite backwards; animation: rotate 2s linear infinite backwards; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; } /*------------------------------------------------------------------ fonts */ h1 { font-size: 40px; line-height: 49px; color: #535353; font-weight: 600; } h1 a { color: #535353; text-decoration: none; -moz-transition: all 100ms ease-in-out; -o-transition: all 100ms ease-in-out; -webkit-transition: all 100ms ease-in-out; transition: all 100ms ease-in-out; } h1 a:hover, h1 a:active, h1 a:focus { text-decoration: none; color: #999999; } h2 { font-size: 35px; color: #666666; font-weight: 600; line-height: 44px; } h3 { font-size: 25px; line-height: 35px; color: #666666; font-weight: 600; } h3 a { color: #535353; text-decoration: none; -moz-transition: all 100ms ease-in-out; -o-transition: all 100ms ease-in-out; -webkit-transition: all 100ms ease-in-out; transition: all 100ms ease-in-out; } h3 a:hover { color: #999999; text-decoration: none; } p { font-size: 18px; line-height: 30px; color: #666666; } .common-list li { font-size: 18px; line-height: 30px; color: #666666; margin-top: 10px; list-style: none; background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2IDUiPjxwb2x5Z29uIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBmaWxsPSIjNTM1MzUzIiBwb2ludHM9IjUsMiA1LDEgNCwxIDQsMiAwLDIgMCwzIDQsMyA0LDQgNSw0IDUsMyA2LDMgNiwyIi8+PHJlY3QgeD0iMyIgZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGZpbGw9IiM1MzUzNTMiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiLz48cmVjdCB4PSIzIiB5PSI0IiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZmlsbD0iIzUzNTM1MyIgd2lkdGg9IjEiIGhlaWdodD0iMSIvPjwvc3ZnPg==); background-repeat: no-repeat; background-position: 0px 13px; -moz-background-size: 6px 5px; -o-background-size: 6px 5px; -webkit-background-size: 6px 5px; background-size: 6px 5px; padding-left: 13px; } @media (max-width: 1299px) { h1 { line-height: 40px; font-size: 35px; } } @media (max-width: 991px) { h1 { line-height: 35px; font-size: 30px; } h2 { font-size: 30px; line-height: 39px; } h3 { font-size: 20px; line-height: 26px; } p { font-size: 16px; line-height: 26px; } .common-list > li { font-size: 16px; line-height: 26px; margin-top: 6px; } } @media (max-width: 767px) { h1 { line-height: 35px; font-size: 30px; } h2 { font-size: 30px; line-height: 39px; } h3 { font-size: 18px; line-height: 24px; } p { font-size: 14px; line-height: 24px; } .common-list > li { font-size: 14px; line-height: 24px; margin-top: 4px; } } /*------------------------------------------------------------------ header */ .dark-opacity { background: rgba(222, 222, 222, 0.43); } #header-container { width: 100%; height: auto; background: rgba(255, 255, 255, 0.85); padding: 41px 0 45px 0; } #header-container .left { width: 70%; float: left; } #header-container .left h1 { margin-top: 12px; } #header-container .left .journal-container { margin-top: 30px; } #header-container .right { width: 30%; float: right; text-align: center; } #header-container .right .logo-fr { background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNjMgNzQiPjxwb2x5Z29uIGZpbGw9IiM4QUM2NTAiIHBvaW50cz0iMCw2Mi42MiAwLjA4LDM2LjUxIDI0LjQxLDI4Ljg4IDI0LjMyLDU1Ii8+PHBvbHlnb24gZmlsbD0iI0ZDQjgxMyIgcG9pbnRzPSIyNC4zMiw1NSAyNC40MSwyOC44OCA0MC45LDQwLjI2IDQwLjgyLDY2LjM4Ii8+PHBvbHlnb24gZmlsbD0iIzAwMzg2QyIgcG9pbnRzPSIxNi40OSw3NCAwLDYyLjYyIDI0LjMyLDU1IDQwLjgyLDY2LjM4Ii8+PHBvbHlnb24gZmlsbD0iIzU0MzA3QSIgcG9pbnRzPSIyMy44NSwyNy41NiAzMC40NiwxMi4zNSAzOC45NiwzMi40NiAzMi4zNSw0Ny42NiIvPjxwb2x5Z29uIGZpbGw9IiMwMDlEQzYiIHBvaW50cz0iMzIuMzUsNDcuNjYgMzguOTYsMzIuNDYgNjEuMjksMjguODIgNTQuNzEsNDMuODQiLz48cG9seWdvbiBmaWxsPSIjRjQ4MjU2IiBwb2ludHM9IjM4Ljk2LDMyLjQ2IDMwLjQ2LDEyLjM1IDUyLjc5LDguNzIgNjEuMjksMjguODIiLz48cG9seWdvbiBmaWxsPSIjQzgyNDNGIiBwb2ludHM9IjI0LjQxLDI4Ljg4IDcuNzksMjUuNzIgNS44Myw5LjIyIDIyLjQ1LDEyLjM4Ii8+PHBvbHlnb24gZmlsbD0iIzZCQzhDNiIgcG9pbnRzPSIyMi40NSwxMi4zOCA1LjgzLDkuMjIgMTUuMDMsMCAzMS42NSwzLjE2Ii8+PHBvbHlnb24gZmlsbD0iIzM3ODU0QiIgcG9pbnRzPSIzMy41OSwxOS43MiAyNC40MSwyOC44OCAyMi40NSwxMi4zOCAzMS42NSwzLjE2Ii8+PHBhdGggZmlsbD0iIzZENkU3MCIgZD0iTTcxLjY0LDQzLjg4aC00LjA0di01LjQ0aDQuMDRjMC03LjM3LDIuNTYtOS42NSw5LjcxLTkuNjVjMS4zMywwLDIuNzEsMC4xLDQuMDQsMC4xNXY1Ljk0Yy0wLjc5LTAuMS0xLjUzLTAuMTUtMi4yNy0wLjE1Yy0xLjkyLDAtMy4xMSwwLjI1LTMuMTEsMi41N3YxLjE0aDUuMDN2NS40NGgtNS4wM3YyMC4yM2gtOC4zOFY0My44OHoiLz48cGF0aCBmaWxsPSIjNkQ2RTcwIiBkPSJNODYuNjcsMzguNDRoOC4xM3Y0LjVoMC4xYzEuMjMtMy4yNyw0LjA5LTUsNy42OS01YzAuNjQsMCwxLjMzLDAuMDUsMS45NywwLjJ2Ny42N2MtMS4wOS0wLjMtMi4wNy0wLjQ5LTMuMjEtMC40OWMtNC4xNCwwLTYuMzEsMi44Ny02LjMxLDYuMDh2MTIuNzFoLTguMzhWMzguNDR6Ii8+PHBhdGggZmlsbD0iIzZENkU3MCIgZD0iTTExOC4wOSw1OC40M2MzLjg5LDAsNS4xMy0zLjg2LDUuMTMtNy4xMmMwLTMuMjYtMS4yMy03LjE3LTUuMTMtNy4xN2MtMy44OSwwLTUuMDgsMy45MS01LjA4LDcuMTdDMTEzLjAxLDU0LjU3LDExNC4yLDU4LjQzLDExOC4wOSw1OC40MyBNMTE4LjA5LDM3LjdjNy45NCwwLDEzLjUxLDUuODksMTMuNTEsMTMuNmMwLDcuNzItNS41NywxMy41Ni0xMy41MSwxMy41NmMtNy45NCwwLTEzLjQ2LTUuODQtMTMuNDYtMTMuNTZDMTA0LjYzLDQzLjU5LDExMC4xNSwzNy43LDExOC4wOSwzNy43Ii8+PHBhdGggZmlsbD0iIzZENkU3MCIgZD0iTTEzMi45NSwzOC40NGg4LjEzdjMuNTFoMC4xYzEuNTMtMi42Miw0Ljk4LTQuMjUsOC4wNC00LjI1YzguNTMsMCw5LjIyLDYuMjMsOS4yMiw5Ljk0djE2LjQ3aC04LjM4VjUxLjdjMC0zLjUxLDAuMzktNy4wNy00LjE5LTcuMDdjLTMuMTUsMC00LjU0LDIuNjctNC41NCw1LjQ5djE0aC04LjM4VjM4LjQ0eiIvPjxwYXRoIGZpbGw9IiM2RDZFNzAiIGQ9Ik0xNzcuMjcsNDMuODhoLTUuMTh2MTEuNjhjMCwyLjAzLDEuMTgsMi40NywzLjAxLDIuNDdjMC42OSwwLDEuNDMtMC4xLDIuMTctMC4xdjYuMThjLTEuNTMsMC4wNS0zLjA2LDAuMjUtNC41OSwwLjI1Yy03LjE1LDAtOC45Ny0yLjA4LTguOTctOS4wNVY0My44OGgtNC4yNHYtNS40NGg0LjI0di03Ljc3aDguMzh2Ny43N2g1LjE4VjQzLjg4eiIvPjxwYXRoIGZpbGw9IiM2RDZFNzAiIGQ9Ik0xNzkuMywzOC40NGg4LjM4djI1LjY4aC04LjM4VjM4LjQ0eiBNMTg3LjY4LDM1LjIzaC04LjM4di02LjQzaDguMzhWMzUuMjN6Ii8+PHBhdGggZmlsbD0iIzZENkU3MCIgZD0iTTIwOC41Miw0OC42M2MtMC4xNS0yLjg3LTIuMTctNS4yNC00Ljk4LTUuMjRjLTIuOTYsMC00LjkzLDIuMTMtNS40Miw1LjI0SDIwOC41MnogTTE5OC4xMSw1My4zM2MwLjE1LDMuNTEsMi4xNyw1Ljg0LDUuNzIsNS44NGMyLjAyLDAsMy45OS0wLjk0LDQuNzgtMi44Mmg3Ljg0Yy0xLjUzLDUuOTQtNyw4LjUxLTEyLjcyLDguNTFjLTguMzMsMC0xNC01LjA1LTE0LTEzLjY2YzAtNy44Nyw2LjI2LTEzLjUxLDEzLjgxLTEzLjUxYzkuMTcsMCwxMy43Niw2LjkzLDEzLjM2LDE1LjYzSDE5OC4xMXoiLz48cGF0aCBmaWxsPSIjNkQ2RTcwIiBkPSJNMjE4Ljk2LDM4LjQ0aDguMTN2NC41aDAuMWMxLjIzLTMuMjcsNC4wOS01LDcuNjktNWMwLjY0LDAsMS4zMywwLjA1LDEuOTcsMC4ydjcuNjdjLTEuMDgtMC4zLTIuMDctMC40OS0zLjItMC40OWMtNC4xNCwwLTYuMzEsMi44Ny02LjMxLDYuMDh2MTIuNzFoLTguMzhWMzguNDR6Ii8+PHBhdGggZmlsbD0iIzZENkU3MCIgZD0iTTI0Ni4xOSw1NS42NmMwLDEuMjksMC41NCwyLjIzLDEuMzgsMi44N2MwLjc5LDAuNTksMS45MiwwLjg5LDMuMTEsMC44OWMxLjYzLDAsMy45NC0wLjY5LDMuOTQtMi43MmMwLTEuOTgtMi42MS0yLjM3LTQuMDktMi43MmMtNS4yOC0xLjM0LTExLjg4LTEuNDgtMTEuODgtOC40MWMwLTYuMTgsNi42Ni03Ljg3LDExLjY4LTcuODdjNS42MiwwLDExLjQ5LDEuNjMsMTEuNzgsOC4zMWgtNy43NGMwLTEuMDktMC40LTEuNzgtMS4wOS0yLjIzYy0wLjY5LTAuNDUtMS42My0wLjY0LTIuNjYtMC42NGMtMS4zOCwwLTMuNiwwLjE1LTMuNiwxLjkzYzAsMi40Miw1LjYyLDIuODcsOS40NywzLjcxYzUuMTgsMS4wNCw2LjUxLDQuOCw2LjUxLDYuOTNjMCw2Ljg4LTYuNTEsOS4xNS0xMi4yOCw5LjE1Yy02LjA2LDAtMTIuMjgtMi4wMy0xMi41Mi05LjJIMjQ2LjE5eiIvPjwvc3ZnPg==) no-repeat 50% 50%; width: 263px; height: 74px; display: inline-block; } #header-container .right .divider { width: calc(100% - 100px); height: 2px; background: #f1f1f1; margin: 25px 50px 35px 50px; display: inline-block; } @media (max-width: 1299px) { #header-container { padding: 21px 0 40px 0; } #header-container .logo-fr { -moz-transform: scale(0.7); -ms-transform: scale(0.7); -webkit-transform: scale(0.7); transform: scale(0.7); } } @media (max-width: 991px) { #header-container .left { width: 100%; } #header-container .right { width: 100%; } #header-container .right .logo-fr, #header-container .right .divider { display: none; } #header-container .right .btn-orange-flex { float: left; margin-top: 20px; } } @media (max-width: 767px) { #header-container .container { margin: 0 20px; width: calc(100% - 40px); } } /*------------------------------------------------------------------ Main Menu */ #main-nav { position: relative; width: 100%; height: 170px; background: #f9f9f9; -moz-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; -webkit-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; } #main-nav.overflow-hidden { overflow: hidden; } #main-nav .title { opacity: 0; float: left; position: absolute; top: -55px; text-align: left; color: #535353; font-size: 18px; font-weight: 600; margin-top: 15px; max-width: 770px; -moz-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; -webkit-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; } #main-nav ul { width: 100%; height: 170px; -moz-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; -webkit-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-justify-content: center; justify-content: center; } #main-nav ul li { text-align: center; list-style: none; width: 20%; height: 100%; position: relative; -moz-transition: all 150ms ease-in-out; -o-transition: all 150ms ease-in-out; -webkit-transition: all 150ms ease-in-out; transition: all 150ms ease-in-out; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } #main-nav ul li.disabled { pointer-events: none; opacity: 0.5; } #main-nav ul li .rh-tt { position: absolute; background: white; width: calc(100% - 60px); border: 1px solid #e0e0e0; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; z-index: 8; word-wrap: break-word; -moz-box-shadow: rgba(0, 0, 0, 0.12) 0px 5px 20px; -webkit-box-shadow: rgba(0, 0, 0, 0.12) 0px 5px 20px; box-shadow: rgba(0, 0, 0, 0.12) 0px 5px 20px; left: 30px; top: calc(100% - 10px); font-size: 13px; line-height: 18px; color: #666666; padding: 15px; opacity: 0; -moz-transition: all 150ms ease-in-out; -o-transition: all 150ms ease-in-out; -webkit-transition: all 150ms ease-in-out; transition: all 150ms ease-in-out; } #main-nav ul li .rh-tt .highlighted { color: #f29400; font-weight: 600; } #main-nav ul li .rh-tt .altmetric-embed { margin-top: 6px; } #main-nav ul li .rh-tt:before { content: ''; position: absolute; width: 8px; height: 4px; top: -4px; left: 50%; margin-left: -4px; background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA4IDQiPjxwYXRoIGZpbGw9IiNCQUJBQkEiIGQ9Ik0wLDRsNC00bDQsNEgweiIvPjwvc3ZnPg==) no-repeat 50% 50%; } #main-nav ul li:hover a { color: #999; text-decoration: none; } #main-nav ul li:hover .rh-tt { top: calc(100% - 20px); opacity: 1; } #main-nav ul li:before { content: ''; position: absolute; width: 1px; height: 100%; left: -1px; top: 0; background: #f9f9f9; z-index: 10; -moz-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; -webkit-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; opacity: 0; } #main-nav ul li:after { content: ''; position: absolute; height: 9px; width: 20px; bottom: 0px; left: 50%; margin-left: -10px; background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCA5Ij48cGF0aCBmaWxsPSIjRkZGRkZGIiBkPSJNMCwwbDEwLDlsMTAtOUgweiIvPjwvc3ZnPg==) no-repeat; -moz-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; -webkit-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; z-index: -1; opacity: 0; } #main-nav ul li:last-child a:before { display: none; } #main-nav ul li.current { pointer-events: none; background: #FFF; z-index: 0; } #main-nav ul li.current:before { opacity: 1; } #main-nav ul li.current:after { bottom: -9px; opacity: 1; } #main-nav ul li.current a { color: #f29400; } #main-nav ul li.current a:before { display: none; } #main-nav ul li.current a .number { color: #f29400; } #main-nav ul li.current .icon-citation { background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyOCAyNSI+PHBhdGggZmlsbD0iI0YyOTQwMCIgZD0iTTI4LDguNTdjMC0yLjU0LTAuNzEtNC42LTIuMTQtNi4xOEMyNC40MywwLjc5LDIyLjc5LDAsMjAuOTIsMGMtMS4yOCwwLTIuNDEsMC41NS0zLjM5LDEuNjRjLTAuOTgsMS4wOS0xLjQ2LDIuNDEtMS40NiwzLjk2YzAsMS40LDAuNDYsMi41NywxLjM4LDMuNTJjMC45MiwwLjk1LDIuMDIsMS40MiwzLjMsMS40MmMwLjQ3LDAsMS4wNS0wLjA5LDEuNzUtMC4yNmwwLjQ0LTAuMDRjMC43LDAsMS4wNSwwLjUsMS4wNSwxLjQ5YzAsMS40OS0wLjY4LDMuMjUtMi4wMyw1LjI5Yy0xLjM1LDIuMDQtMy40Nyw0LjA5LTYuMzYsNi4xNmwxLjQsMS44NEMyNC4zMywyMC4xMywyOCwxNC42NiwyOCw4LjU3TDI4LDguNTd6IE0xMi40MSw4LjU3YzAtMi41NC0wLjcxLTQuNi0yLjEyLTYuMThDOC44OCwwLjc5LDcuMjIsMCw1LjMzLDBDNC4wOCwwLDIuOTYsMC41NCwxLjk3LDEuNjNjLTAuOTksMS4wOS0xLjQ5LDIuNC0xLjQ5LDMuOTRjMCwxLjM5LDAuNDYsMi41NiwxLjM4LDMuNWMwLjkyLDAuOTQsMi4wMywxLjQxLDMuMzQsMS40MWMwLjQ0LDAsMS4wMi0wLjA5LDEuNzUtMC4yNmwwLjQ0LTAuMDRjMC42NywwLDEuMDEsMC41LDEuMDEsMS40OWMwLDEuNDktMC42OCwzLjI2LTIuMDMsNS4zQzUsMTkuMDIsMi44OCwyMS4wOCwwLDIzLjE2TDEuNDQsMjVDOC43NSwyMC4xMywxMi40MSwxNC42NiwxMi40MSw4LjU3TDEyLjQxLDguNTd6Ii8+PC9zdmc+) no-repeat 50% 100%; -moz-background-size: 28px 25px; -o-background-size: 28px 25px; -webkit-background-size: 28px 25px; background-size: 28px 25px; } #main-nav ul li.current .icon-view { background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzMyAyNSI+PHBhdGggZmlsbD0iI0YyOTQwMCIgZD0iTTE2LjUsOC4zM2MwLDIuMy0xLjg1LDQuMTctNC4xMyw0LjE3YzAsMi4zLDEuODUsNC4xNyw0LjEzLDQuMTdjMi4yOCwwLDQuMTMtMS44Nyw0LjEzLTQuMTdDMjAuNjMsMTAuMiwxOC43OCw4LjMzLDE2LjUsOC4zM3ogTTE2LjUsMEM4LjA0LDAsMCw5LjY4LDAsMTIuNUMwLDE1LjMyLDguMDQsMjUsMTYuNSwyNVMzMywxNS4zMiwzMywxMi41QzMzLDkuNjgsMjQuOTYsMCwxNi41LDB6TTE2LjUsMjAuODNjLTQuNTYsMC04LjI1LTMuNzMtOC4yNS04LjMzYzAtNC42LDMuNjktOC4zMyw4LjI1LTguMzNzOC4yNSwzLjczLDguMjUsOC4zM0MyNC43NSwxNy4xLDIxLjA2LDIwLjgzLDE2LjUsMjAuODN6Ii8+PC9zdmc+) no-repeat 50% 100%; -moz-background-size: 33px 25px; -o-background-size: 33px 25px; -webkit-background-size: 33px 25px; background-size: 33px 25px; } #main-nav ul li.current .icon-download { background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzMyAyOCI+PHBhdGggZmlsbD0iI0YyOTQwMCIgZD0iTTMzLDI4SDBsMC0xNC45OWgzdjEyaDI3di0xMmgzVjI4TDMzLDI4eiBNNi40MSwxMC44OUw4LjMsOC4zM0wxNSwxNS4wMVYwaDN2MTUuMDFsNi43MS02LjY3bDEuODksMi41NmwtMTAuMSwxMC4yNUw2LjQxLDEwLjg5eiIvPjwvc3ZnPg==) no-repeat 50% 100%; -moz-background-size: 33px 28px; -o-background-size: 33px 28px; -webkit-background-size: 33px 28px; background-size: 33px 28px; } #main-nav ul li.current .icon-socialbuzz { background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxOCAyOCI+PHBhdGggZmlsbD0iI0YyOTQwMCIgZD0iTTE2LDBsLTUsMTJoN0wyLDI4bDUtMTJIMEwxNiwweiIvPjwvc3ZnPg==) no-repeat 50% 100%; -moz-background-size: 18px 28px; -o-background-size: 18px 28px; -webkit-background-size: 18px 28px; background-size: 18px 28px; } #main-nav ul li.current .icon-demographic { background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMyAyOCI+PHBhdGggZmlsbD0iI0YyOTQwMCIgZD0iTTExLjUsMEM1LjE1LDAsMCw1LjAxLDAsMTEuMkMwLDE3LjM5LDExLjUsMjgsMTEuNSwyOFMyMywxNy4zOSwyMywxMS4yQzIzLDUuMDEsMTcuODUsMCwxMS41LDB6IE0xMS41LDE2Ljc1Yy0zLjE4LDAtNS43Ny0yLjUtNS43Ny01LjU4YzAtMy4wOCwyLjU4LTUuNTgsNS43Ny01LjU4YzMuMTgsMCw1Ljc3LDIuNSw1Ljc3LDUuNThDMTcuMjcsMTQuMjUsMTQuNjgsMTYuNzUsMTEuNSwxNi43NXoiLz48L3N2Zz4=) no-repeat 50% 100%; -moz-background-size: 23px 28px; -o-background-size: 23px 28px; -webkit-background-size: 23px 28px; background-size: 23px 28px; } #main-nav ul li a { width: 100%; height: 100%; cursor: pointer; float: left; color: #666666; font-weight: 700; text-transform: uppercase; -moz-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; -webkit-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; position: relative; overflow: hidden; font-size: 14px; font-weight: 700; text-decoration: none; } #main-nav ul li a:before { content: ''; position: absolute; background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxIDYiPjxwYXRoIGZpbGw9IiNEQURBREEiIGQ9Ik0wLDBoMXY0SDBWMHoiLz48L3N2Zz4=) repeat-y top right; width: 1px; height: 70px; right: 0px; top: 51px; -moz-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; -webkit-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; } #main-nav ul li a .number { margin-top: 28px; margin-bottom: 2px; font-size: 35px; font-weight: 600; color: #dadada; } #main-nav ul li a i { height: 38px; width: 100%; dispplay: block; position: relative; float: left; background-position: 50% 100%; background-repeat: no-repeat; -moz-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; -webkit-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; } #main-nav ul li a .icon-citation { background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyOCAyNSI+PHBhdGggZmlsbD0iI2RhZGFkYSIgZD0iTTI4LDguNTdjMC0yLjU0LTAuNzEtNC42LTIuMTQtNi4xOEMyNC40MywwLjc5LDIyLjc5LDAsMjAuOTIsMGMtMS4yOCwwLTIuNDEsMC41NS0zLjM5LDEuNjRjLTAuOTgsMS4wOS0xLjQ2LDIuNDEtMS40NiwzLjk2YzAsMS40LDAuNDYsMi41NywxLjM4LDMuNTJjMC45MiwwLjk1LDIuMDIsMS40MiwzLjMsMS40MmMwLjQ3LDAsMS4wNS0wLjA5LDEuNzUtMC4yNmwwLjQ0LTAuMDRjMC43LDAsMS4wNSwwLjUsMS4wNSwxLjQ5YzAsMS40OS0wLjY4LDMuMjUtMi4wMyw1LjI5Yy0xLjM1LDIuMDQtMy40Nyw0LjA5LTYuMzYsNi4xNmwxLjQsMS44NEMyNC4zMywyMC4xMywyOCwxNC42NiwyOCw4LjU3TDI4LDguNTd6IE0xMi40MSw4LjU3YzAtMi41NC0wLjcxLTQuNi0yLjEyLTYuMThDOC44OCwwLjc5LDcuMjIsMCw1LjMzLDBDNC4wOCwwLDIuOTYsMC41NCwxLjk3LDEuNjNjLTAuOTksMS4wOS0xLjQ5LDIuNC0xLjQ5LDMuOTRjMCwxLjM5LDAuNDYsMi41NiwxLjM4LDMuNWMwLjkyLDAuOTQsMi4wMywxLjQxLDMuMzQsMS40MWMwLjQ0LDAsMS4wMi0wLjA5LDEuNzUtMC4yNmwwLjQ0LTAuMDRjMC42NywwLDEuMDEsMC41LDEuMDEsMS40OWMwLDEuNDktMC42OCwzLjI2LTIuMDMsNS4zQzUsMTkuMDIsMi44OCwyMS4wOCwwLDIzLjE2TDEuNDQsMjVDOC43NSwyMC4xMywxMi40MSwxNC42NiwxMi40MSw4LjU3TDEyLjQxLDguNTd6Ii8+PC9zdmc+) no-repeat 50% 100%; -moz-background-size: 28px 25px; -o-background-size: 28px 25px; -webkit-background-size: 28px 25px; background-size: 28px 25px; } #main-nav ul li a .icon-view { background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzMyAyNSI+PHBhdGggZmlsbD0iI2RhZGFkYSIgZD0iTTE2LjUsOC4zM2MwLDIuMy0xLjg1LDQuMTctNC4xMyw0LjE3YzAsMi4zLDEuODUsNC4xNyw0LjEzLDQuMTdjMi4yOCwwLDQuMTMtMS44Nyw0LjEzLTQuMTdDMjAuNjMsMTAuMiwxOC43OCw4LjMzLDE2LjUsOC4zM3ogTTE2LjUsMEM4LjA0LDAsMCw5LjY4LDAsMTIuNUMwLDE1LjMyLDguMDQsMjUsMTYuNSwyNVMzMywxNS4zMiwzMywxMi41QzMzLDkuNjgsMjQuOTYsMCwxNi41LDB6TTE2LjUsMjAuODNjLTQuNTYsMC04LjI1LTMuNzMtOC4yNS04LjMzYzAtNC42LDMuNjktOC4zMyw4LjI1LTguMzNzOC4yNSwzLjczLDguMjUsOC4zM0MyNC43NSwxNy4xLDIxLjA2LDIwLjgzLDE2LjUsMjAuODN6Ii8+PC9zdmc+) no-repeat 50% 100%; -moz-background-size: 33px 25px; -o-background-size: 33px 25px; -webkit-background-size: 33px 25px; background-size: 33px 25px; } #main-nav ul li a .icon-download { background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzMyAyOCI+PHBhdGggZmlsbD0iI2RhZGFkYSIgZD0iTTMzLDI4SDBsMC0xNC45OWgzdjEyaDI3di0xMmgzVjI4TDMzLDI4eiBNNi40MSwxMC44OUw4LjMsOC4zM0wxNSwxNS4wMVYwaDN2MTUuMDFsNi43MS02LjY3bDEuODksMi41NmwtMTAuMSwxMC4yNUw2LjQxLDEwLjg5eiIvPjwvc3ZnPg==) no-repeat 50% 100%; -moz-background-size: 33px 28px; -o-background-size: 33px 28px; -webkit-background-size: 33px 28px; background-size: 33px 28px; } #main-nav ul li a .icon-socialbuzz { background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxOCAyOCI+PHBhdGggZmlsbD0iI2RhZGFkYSIgZD0iTTE2LDBsLTUsMTJoN0wyLDI4bDUtMTJIMEwxNiwweiIvPjwvc3ZnPg==) no-repeat 50% 100%; -moz-background-size: 18px 28px; -o-background-size: 18px 28px; -webkit-background-size: 18px 28px; background-size: 18px 28px; } #main-nav ul li a .icon-demographic { background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMyAyOCI+PHBhdGggZmlsbD0iI0RBREFEQSIgZD0iTTExLjUsMEM1LjE1LDAsMCw1LjAxLDAsMTEuMkMwLDE3LjM5LDExLjUsMjgsMTEuNSwyOFMyMywxNy4zOSwyMywxMS4yQzIzLDUuMDEsMTcuODUsMCwxMS41LDB6IE0xMS41LDE2Ljc1Yy0zLjE4LDAtNS43Ny0yLjUtNS43Ny01LjU4YzAtMy4wOCwyLjU4LTUuNTgsNS43Ny01LjU4YzMuMTgsMCw1Ljc3LDIuNSw1Ljc3LDUuNThDMTcuMjcsMTQuMjUsMTQuNjgsMTYuNzUsMTEuNSwxNi43NXoiLz48L3N2Zz4=) no-repeat 50% 100%; -moz-background-size: 23px 28px; -o-background-size: 23px 28px; -webkit-background-size: 23px 28px; background-size: 23px 28px; } @media (max-width: 1299px) { #main-nav ul li { width: 25%; } #main-nav ul li .rh-tt { width: calc(100% - 40px); left: 20px; } } @media (max-width: 991px) { #main-nav { height: 110px; } #main-nav ul { height: 110px; } #main-nav ul li { width: 25%; } #main-nav ul li .rh-tt { display: none; } #main-nav ul li a .section-name { display: none; } #main-nav ul li a .number { margin-top: 20px; font-size: 30px; line-height: 30px; } #main-nav ul li a i { background-position: 50% 10px !important; } #main-nav ul li a:before { height: 46px; top: 32px; } } @media (max-width: 767px) { #main-nav { height: 55px; } #main-nav ul { height: 55px; } #main-nav ul li { width: 25%; } #main-nav ul li .rh-tt { display: none; } #main-nav ul li a .section-name { display: none; } #main-nav ul li a .number { display: none; } #main-nav ul li a i { background-position: 50% 100% !important; } #main-nav ul li a:before { height: 28px; top: 16px; } } /*------------------------------------------------------------------ tabs lvl2 */ .tabs-lvl2 { width: 100%; margin: 30px 0 -30px 0; float: left; } .tabs-lvl2 > li { list-style: none; float: left; background: #f9f9f9; cursor: pointer; padding: 40px 50px; -moz-transform: translateY(5px); -ms-transform: translateY(5px); -webkit-transform: translateY(5px); transform: translateY(5px); -moz-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; -webkit-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; z-index: 0; position: relative; } .tabs-lvl2 > li:nth-child(1) { -moz-box-shadow: inset -20px -20px 60px -30px rgba(0, 0, 0, 0.2); -webkit-box-shadow: inset -20px -20px 60px -30px rgba(0, 0, 0, 0.2); box-shadow: inset -20px -20px 60px -30px rgba(0, 0, 0, 0.2); } .tabs-lvl2 > li:nth-child(2) { -moz-box-shadow: inset 20px -20px 60px -30px rgba(0, 0, 0, 0.2); -webkit-box-shadow: inset 20px -20px 60px -30px rgba(0, 0, 0, 0.2); box-shadow: inset 20px -20px 60px -30px rgba(0, 0, 0, 0.2); } .tabs-lvl2 > li.current { z-index: 1; background: white; -moz-transform: translateY(0px); -ms-transform: translateY(0px); -webkit-transform: translateY(0px); transform: translateY(0px); -moz-box-shadow: inset 0px -20px 60px -30px transparent; -webkit-box-shadow: inset 0px -20px 60px -30px transparent; box-shadow: inset 0px -20px 60px -30px transparent; } .tabs-lvl2 > li.current .module-icon-info { pointer-events: auto; } .tabs-lvl2 > li.current .title { opacity: 1; } .tabs-lvl2 > li .title { font-size: 35px; color: #666666; font-weight: 600; line-height: 44px; float: left; padding-right: 10px; opacity: 0.7; } .tabs-lvl2 > li .title .number { color: #f29400; } .tabs-lvl2 > li .module-icon-info { pointer-events: none; } .tabs-lvl2 > li .module-icon-info .icon-info { margin-top: 17px; } @media (max-width: 1299px) { .tabs-lvl2 > li { padding: 40px; } .tabs-lvl2 > li .title { font-size: 30px; line-height: 39px; } .tabs-lvl2 > li .icon-info { margin-top: 15px; } } @media (max-width: 991px) { .tabs-lvl2 > li { padding: 30px; } .tabs-lvl2 > li .title { font-size: 25px; line-height: 34px; } .tabs-lvl2 > li .icon-info { margin-top: 11px; } } @media (max-width: 767px) { .tabs-lvl2 > li { padding: 10px; } .tabs-lvl2 > li .title { font-size: 18px; line-height: 29px; padding-right: 0; } .tabs-lvl2 > li .icon-info { display: none; } } /*------------------------------------------------------------------ main nav fixed*/ #main-nav-fixed { width: 100%; background: #f9f9f9; -moz-transition: all 700ms cubic-bezier(0.19, 1, 0.22, 1); -o-transition: all 700ms cubic-bezier(0.19, 1, 0.22, 1); -webkit-transition: all 700ms cubic-bezier(0.19, 1, 0.22, 1); transition: all 700ms cubic-bezier(0.19, 1, 0.22, 1); position: fixed; top: -70px; z-index: 10; height: 55px; box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.1); } #main-nav-fixed .title { float: left; text-align: left; color: #535353; font-size: 18px; font-weight: 600; margin-top: 15px; max-width: calc(100% - 320px); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; position: relative; } #main-nav-fixed ul { float: right; } #main-nav-fixed ul li { list-style: none; float: left; width: 80px; height: 55px; position: relative; cursor: pointer; z-index: 0; } #main-nav-fixed ul li.disabled { pointer-events: none; opacity: 0.5; } #main-nav-fixed ul li:after { content: ''; position: absolute; height: 19px; width: 40px; bottom: 0px; left: calc(50% - 20px); background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0MCAxOSIgd2lkdGg9IjQwIiBoZWlnaHQ9IjE5Ij48ZmlsdGVyIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgaWQ9ImRyb3BzaGFkb3ciIGhlaWdodD0iMjAwJSI+PGZlR2F1c3NpYW5CbHVyIGluPSJTb3VyY2VBbHBoYSIgc3RkRGV2aWF0aW9uPSIyIi8+PGZlT2Zmc2V0IGR4PSIwIiBkeT0iMSIgcmVzdWx0PSJvZmZzZXRibHVyIi8+PGZlQ29tcG9uZW50VHJhbnNmZXI+PGZlRnVuY0EgdHlwZT0ibGluZWFyIiBzbG9wZT0iMC4yIi8+PC9mZUNvbXBvbmVudFRyYW5zZmVyPjxmZU1lcmdlPjxmZU1lcmdlTm9kZS8+PGZlTWVyZ2VOb2RlIGluPSJTb3VyY2VHcmFwaGljIi8+PC9mZU1lcmdlPjwvZmlsdGVyPjxwYXRoIGZpbGw9IndoaXRlIiBkPSJNMTAsMGwxMCw5bDEwLTlIMTB6IiBmaWx0ZXI9InVybCgjZHJvcHNoYWRvdykiLz48L3N2Zz4=) no-repeat; -moz-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; -webkit-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; z-index: -1; opacity: 0; } #main-nav-fixed ul li i { height: 38px; width: 100%; dispplay: block; position: relative; float: left; background-position: 50% 100%; background-repeat: no-repeat; -moz-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; -webkit-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; } #main-nav-fixed ul li .icon-citation { background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyOCAyNSI+PHBhdGggZmlsbD0iI2RhZGFkYSIgZD0iTTI4LDguNTdjMC0yLjU0LTAuNzEtNC42LTIuMTQtNi4xOEMyNC40MywwLjc5LDIyLjc5LDAsMjAuOTIsMGMtMS4yOCwwLTIuNDEsMC41NS0zLjM5LDEuNjRjLTAuOTgsMS4wOS0xLjQ2LDIuNDEtMS40NiwzLjk2YzAsMS40LDAuNDYsMi41NywxLjM4LDMuNTJjMC45MiwwLjk1LDIuMDIsMS40MiwzLjMsMS40MmMwLjQ3LDAsMS4wNS0wLjA5LDEuNzUtMC4yNmwwLjQ0LTAuMDRjMC43LDAsMS4wNSwwLjUsMS4wNSwxLjQ5YzAsMS40OS0wLjY4LDMuMjUtMi4wMyw1LjI5Yy0xLjM1LDIuMDQtMy40Nyw0LjA5LTYuMzYsNi4xNmwxLjQsMS44NEMyNC4zMywyMC4xMywyOCwxNC42NiwyOCw4LjU3TDI4LDguNTd6IE0xMi40MSw4LjU3YzAtMi41NC0wLjcxLTQuNi0yLjEyLTYuMThDOC44OCwwLjc5LDcuMjIsMCw1LjMzLDBDNC4wOCwwLDIuOTYsMC41NCwxLjk3LDEuNjNjLTAuOTksMS4wOS0xLjQ5LDIuNC0xLjQ5LDMuOTRjMCwxLjM5LDAuNDYsMi41NiwxLjM4LDMuNWMwLjkyLDAuOTQsMi4wMywxLjQxLDMuMzQsMS40MWMwLjQ0LDAsMS4wMi0wLjA5LDEuNzUtMC4yNmwwLjQ0LTAuMDRjMC42NywwLDEuMDEsMC41LDEuMDEsMS40OWMwLDEuNDktMC42OCwzLjI2LTIuMDMsNS4zQzUsMTkuMDIsMi44OCwyMS4wOCwwLDIzLjE2TDEuNDQsMjVDOC43NSwyMC4xMywxMi40MSwxNC42NiwxMi40MSw4LjU3TDEyLjQxLDguNTd6Ii8+PC9zdmc+) no-repeat 50% 100%; -moz-background-size: 28px 25px; -o-background-size: 28px 25px; -webkit-background-size: 28px 25px; background-size: 28px 25px; } #main-nav-fixed ul li .icon-view { background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzMyAyNSI+PHBhdGggZmlsbD0iI2RhZGFkYSIgZD0iTTE2LjUsOC4zM2MwLDIuMy0xLjg1LDQuMTctNC4xMyw0LjE3YzAsMi4zLDEuODUsNC4xNyw0LjEzLDQuMTdjMi4yOCwwLDQuMTMtMS44Nyw0LjEzLTQuMTdDMjAuNjMsMTAuMiwxOC43OCw4LjMzLDE2LjUsOC4zM3ogTTE2LjUsMEM4LjA0LDAsMCw5LjY4LDAsMTIuNUMwLDE1LjMyLDguMDQsMjUsMTYuNSwyNVMzMywxNS4zMiwzMywxMi41QzMzLDkuNjgsMjQuOTYsMCwxNi41LDB6TTE2LjUsMjAuODNjLTQuNTYsMC04LjI1LTMuNzMtOC4yNS04LjMzYzAtNC42LDMuNjktOC4zMyw4LjI1LTguMzNzOC4yNSwzLjczLDguMjUsOC4zM0MyNC43NSwxNy4xLDIxLjA2LDIwLjgzLDE2LjUsMjAuODN6Ii8+PC9zdmc+) no-repeat 50% 100%; -moz-background-size: 33px 25px; -o-background-size: 33px 25px; -webkit-background-size: 33px 25px; background-size: 33px 25px; } #main-nav-fixed ul li .icon-download { background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzMyAyOCI+PHBhdGggZmlsbD0iI2RhZGFkYSIgZD0iTTMzLDI4SDBsMC0xNC45OWgzdjEyaDI3di0xMmgzVjI4TDMzLDI4eiBNNi40MSwxMC44OUw4LjMsOC4zM0wxNSwxNS4wMVYwaDN2MTUuMDFsNi43MS02LjY3bDEuODksMi41NmwtMTAuMSwxMC4yNUw2LjQxLDEwLjg5eiIvPjwvc3ZnPg==) no-repeat 50% 100%; -moz-background-size: 33px 28px; -o-background-size: 33px 28px; -webkit-background-size: 33px 28px; background-size: 33px 28px; } #main-nav-fixed ul li .icon-socialbuzz { background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxOCAyOCI+PHBhdGggZmlsbD0iI2RhZGFkYSIgZD0iTTE2LDBsLTUsMTJoN0wyLDI4bDUtMTJIMEwxNiwweiIvPjwvc3ZnPg==) no-repeat 50% 100%; -moz-background-size: 18px 28px; -o-background-size: 18px 28px; -webkit-background-size: 18px 28px; background-size: 18px 28px; } #main-nav-fixed ul li .icon-demographic { background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMyAyOCI+PHBhdGggZmlsbD0iI0RBREFEQSIgZD0iTTExLjUsMEM1LjE1LDAsMCw1LjAxLDAsMTEuMkMwLDE3LjM5LDExLjUsMjgsMTEuNSwyOFMyMywxNy4zOSwyMywxMS4yQzIzLDUuMDEsMTcuODUsMCwxMS41LDB6IE0xMS41LDE2Ljc1Yy0zLjE4LDAtNS43Ny0yLjUtNS43Ny01LjU4YzAtMy4wOCwyLjU4LTUuNTgsNS43Ny01LjU4YzMuMTgsMCw1Ljc3LDIuNSw1Ljc3LDUuNThDMTcuMjcsMTQuMjUsMTQuNjgsMTYuNzUsMTEuNSwxNi43NXoiLz48L3N2Zz4=) no-repeat 50% 100%; -moz-background-size: 23px 28px; -o-background-size: 23px 28px; -webkit-background-size: 23px 28px; background-size: 23px 28px; } #main-nav-fixed ul li.current { pointer-events: none; background: #FFF; z-index: 0; } #main-nav-fixed ul li.current:after { bottom: -19px; opacity: 1; } #main-nav-fixed ul li.current .icon-citation { background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyOCAyNSI+PHBhdGggZmlsbD0iI0YyOTQwMCIgZD0iTTI4LDguNTdjMC0yLjU0LTAuNzEtNC42LTIuMTQtNi4xOEMyNC40MywwLjc5LDIyLjc5LDAsMjAuOTIsMGMtMS4yOCwwLTIuNDEsMC41NS0zLjM5LDEuNjRjLTAuOTgsMS4wOS0xLjQ2LDIuNDEtMS40NiwzLjk2YzAsMS40LDAuNDYsMi41NywxLjM4LDMuNTJjMC45MiwwLjk1LDIuMDIsMS40MiwzLjMsMS40MmMwLjQ3LDAsMS4wNS0wLjA5LDEuNzUtMC4yNmwwLjQ0LTAuMDRjMC43LDAsMS4wNSwwLjUsMS4wNSwxLjQ5YzAsMS40OS0wLjY4LDMuMjUtMi4wMyw1LjI5Yy0xLjM1LDIuMDQtMy40Nyw0LjA5LTYuMzYsNi4xNmwxLjQsMS44NEMyNC4zMywyMC4xMywyOCwxNC42NiwyOCw4LjU3TDI4LDguNTd6IE0xMi40MSw4LjU3YzAtMi41NC0wLjcxLTQuNi0yLjEyLTYuMThDOC44OCwwLjc5LDcuMjIsMCw1LjMzLDBDNC4wOCwwLDIuOTYsMC41NCwxLjk3LDEuNjNjLTAuOTksMS4wOS0xLjQ5LDIuNC0xLjQ5LDMuOTRjMCwxLjM5LDAuNDYsMi41NiwxLjM4LDMuNWMwLjkyLDAuOTQsMi4wMywxLjQxLDMuMzQsMS40MWMwLjQ0LDAsMS4wMi0wLjA5LDEuNzUtMC4yNmwwLjQ0LTAuMDRjMC42NywwLDEuMDEsMC41LDEuMDEsMS40OWMwLDEuNDktMC42OCwzLjI2LTIuMDMsNS4zQzUsMTkuMDIsMi44OCwyMS4wOCwwLDIzLjE2TDEuNDQsMjVDOC43NSwyMC4xMywxMi40MSwxNC42NiwxMi40MSw4LjU3TDEyLjQxLDguNTd6Ii8+PC9zdmc+) no-repeat 50% 100%; -moz-background-size: 28px 25px; -o-background-size: 28px 25px; -webkit-background-size: 28px 25px; background-size: 28px 25px; } #main-nav-fixed ul li.current .icon-view { background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzMyAyNSI+PHBhdGggZmlsbD0iI0YyOTQwMCIgZD0iTTE2LjUsOC4zM2MwLDIuMy0xLjg1LDQuMTctNC4xMyw0LjE3YzAsMi4zLDEuODUsNC4xNyw0LjEzLDQuMTdjMi4yOCwwLDQuMTMtMS44Nyw0LjEzLTQuMTdDMjAuNjMsMTAuMiwxOC43OCw4LjMzLDE2LjUsOC4zM3ogTTE2LjUsMEM4LjA0LDAsMCw5LjY4LDAsMTIuNUMwLDE1LjMyLDguMDQsMjUsMTYuNSwyNVMzMywxNS4zMiwzMywxMi41QzMzLDkuNjgsMjQuOTYsMCwxNi41LDB6TTE2LjUsMjAuODNjLTQuNTYsMC04LjI1LTMuNzMtOC4yNS04LjMzYzAtNC42LDMuNjktOC4zMyw4LjI1LTguMzNzOC4yNSwzLjczLDguMjUsOC4zM0MyNC43NSwxNy4xLDIxLjA2LDIwLjgzLDE2LjUsMjAuODN6Ii8+PC9zdmc+) no-repeat 50% 100%; -moz-background-size: 33px 25px; -o-background-size: 33px 25px; -webkit-background-size: 33px 25px; background-size: 33px 25px; } #main-nav-fixed ul li.current .icon-download { background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzMyAyOCI+PHBhdGggZmlsbD0iI0YyOTQwMCIgZD0iTTMzLDI4SDBsMC0xNC45OWgzdjEyaDI3di0xMmgzVjI4TDMzLDI4eiBNNi40MSwxMC44OUw4LjMsOC4zM0wxNSwxNS4wMVYwaDN2MTUuMDFsNi43MS02LjY3bDEuODksMi41NmwtMTAuMSwxMC4yNUw2LjQxLDEwLjg5eiIvPjwvc3ZnPg==) no-repeat 50% 100%; -moz-background-size: 33px 28px; -o-background-size: 33px 28px; -webkit-background-size: 33px 28px; background-size: 33px 28px; } #main-nav-fixed ul li.current .icon-socialbuzz { background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxOCAyOCI+PHBhdGggZmlsbD0iI0YyOTQwMCIgZD0iTTE2LDBsLTUsMTJoN0wyLDI4bDUtMTJIMEwxNiwweiIvPjwvc3ZnPg==) no-repeat 50% 100%; -moz-background-size: 18px 28px; -o-background-size: 18px 28px; -webkit-background-size: 18px 28px; background-size: 18px 28px; } #main-nav-fixed ul li.current .icon-demographic { background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMyAyOCI+PHBhdGggZmlsbD0iI0YyOTQwMCIgZD0iTTExLjUsMEM1LjE1LDAsMCw1LjAxLDAsMTEuMkMwLDE3LjM5LDExLjUsMjgsMTEuNSwyOFMyMywxNy4zOSwyMywxMS4yQzIzLDUuMDEsMTcuODUsMCwxMS41LDB6IE0xMS41LDE2Ljc1Yy0zLjE4LDAtNS43Ny0yLjUtNS43Ny01LjU4YzAtMy4wOCwyLjU4LTUuNTgsNS43Ny01LjU4YzMuMTgsMCw1Ljc3LDIuNSw1Ljc3LDUuNThDMTcuMjcsMTQuMjUsMTQuNjgsMTYuNzUsMTEuNSwxNi43NXoiLz48L3N2Zz4=) no-repeat 50% 100%; -moz-background-size: 23px 28px; -o-background-size: 23px 28px; -webkit-background-size: 23px 28px; background-size: 23px 28px; } #main-nav-fixed.reveal { top: 0; } @media (max-width: 767px) { #main-nav-fixed .title { display: none; } #main-nav-fixed ul { width: 100%; } #main-nav-fixed ul li { width: 25%; } } /*------------------------------------------------------------------ Footer */ #footer-container { width: 100%; height: 55px; background: #f9f9f9; text-align: center; vertical-align: text-top; display: inline-block; display: -webkit-inline-flex; display: inline-flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; } #footer-container .footer { display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-justify-content: center; justify-content: center; } #footer-container .footer p { font-size: 13px; font-weight: 600; color: #666666; } #footer-container .footer p .highlighted { color: #f29400; font-weight: 700; } #footer-container .footer .logo-loop { width: 51px; height: 22px; background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MSAyMiI+PHBhdGggZD0iTTEuOTMsMHYxMi43OWMwLDEuMjYsMC42MiwxLjY5LDEuMjQsMS42OUgzLjljMCwwLDAuMjksMC43MSwwLjQxLDAuOTZjMC4xNCwwLjMyLDAuNDQsMC44MywwLjQ0LDAuODNIMi45NkMxLjE4LDE2LjI4LDAsMTUuMjcsMCwxMi45NFYwSDEuOTN6Ii8+PHBhdGggZD0iTTI4LjQ2LDEwLjcxYzAsMi4xNCwxLjg0LDQuMDMsMy45OSw0LjAzYzIuMTQsMCwzLjk5LTEuODksMy45OS00LjAzYzAtMi4zMS0xLjg0LTQuMDUtMy45OS00LjA1QzMwLjMxLDYuNjYsMjguNDYsOC40LDI4LjQ2LDEwLjcxIE0zMi40NSw0Ljg2YzMuNTEsMCw2LjA0LDIuNyw2LjA0LDUuODVjMCwzLjE5LTIuNCw1LjgzLTYuMDQsNS44M2MtMy42NCwwLTYuMDQtMi42My02LjA0LTUuODNDMjYuNDEsNy41NiwyOC45Myw0Ljg2LDMyLjQ1LDQuODYiLz48cGF0aCBkPSJNNDQuOTcsNC44NkM0My40LDQuODYsNDIsNS40MSw0MSw2LjI5VjVoLTJ2NS42MmMwLDAuMDMsMCwwLjA2LDAsMC4wOWMwLDAuMDMsMCwwLjA2LDAsMC4wOVYyMWgydi01LjgxYzEsMC44NCwyLjM3LDEuMzUsMy45NywxLjM1YzMuNjQsMCw2LjA0LTIuNjMsNi4wNC01LjgzQzUxLjAxLDcuNTYsNDguNDksNC44Niw0NC45Nyw0Ljg2eiBNNDQuOTYsMTQuNzRjLTIuMTQsMC0zLjk5LTEuODktMy45OS00LjAzYzAtMi4zMSwxLjg0LTQuMDUsMy45OS00LjA1YzIuMTQsMCwzLjk5LDEuNzQsMy45OSw0LjA1QzQ4Ljk0LDEyLjg1LDQ3LjEsMTQuNzQsNDQuOTYsMTQuNzR6Ii8+PHBhdGggZmlsbD0iIzdFN0EwMCIgZD0iTTE1LjA2LDAuMDZDOSwwLjA2LDQuMDksNC45Nyw0LjA5LDExLjAzQzQuMDksMTcuMDksOSwyMiwxNS4wNiwyMmM2LjA2LDAsMTAuOTctNC45MSwxMC45Ny0xMC45N0MyNi4wNCw0Ljk3LDIxLjEyLDAuMDYsMTUuMDYsMC4wNnogTTE1LjcsMjAuNzNjLTUuMzYsMC05LjctNC4zNC05LjctOS43YzAtNS4zNiw0LjM0LTkuNyw5LjctOS43YzUuMzYsMCw5LjcsNC4zNCw5LjcsOS43QzI1LjQsMTYuMzksMjEuMDYsMjAuNzMsMTUuNywyMC43M3oiLz48cGF0aCBmaWxsPSIjRENDRDAwIiBkPSJNMTAuNTMsMy4xOGMtNC4zNCwyLjUtNS44Miw4LjA0LTMuMzIsMTIuMzhjMi41LDQuMzMsOC4wNSw1LjgyLDEyLjM4LDMuMzJjNC4zNC0yLjUsNS44Mi04LjA1LDMuMzItMTIuMzhDMjAuNDEsMi4xNiwxNC44NywwLjY4LDEwLjUzLDMuMTh6IE0xOS41MSwxNy40NmMtMy43MywyLjE1LTguNDksMC44Ny0xMC42NC0yLjg1Yy0yLjE1LTMuNzMtMC44Ny04LjQ5LDIuODUtMTAuNjRjMy43My0yLjE1LDguNDktMC44NywxMC42NCwyLjg1QzI0LjUxLDEwLjU0LDIzLjI0LDE1LjMxLDE5LjUxLDE3LjQ2eiIvPjxwYXRoIGZpbGw9IiNGMjk0MDAiIGQ9Ik04Ljg3LDcuNDVjLTEuOTgsMy40Mi0wLjgsNy44LDIuNjIsOS43N2MzLjQyLDEuOTgsNy44LDAuOCw5Ljc4LTIuNjJjMS45OC0zLjQyLDAuOC03LjgtMi42Mi05Ljc3QzE1LjIyLDIuODYsMTAuODQsNC4wMyw4Ljg3LDcuNDV6IE0yMC42MSwxMy41Yy0xLjY3LDIuODktNS4zNiwzLjg4LTguMjUsMi4yMWMtMi44OS0xLjY3LTMuODgtNS4zNi0yLjIxLTguMjVjMS42Ny0yLjg5LDUuMzYtMy44OCw4LjI1LTIuMjFDMjEuMjksNi45MSwyMi4yOCwxMC42MSwyMC42MSwxMy41eiIvPjxwYXRoIGZpbGw9IiNENDAwMjgiIGQ9Ik05LjY2LDExLjAzYzAsMi45OSwyLjQyLDUuNDEsNS40MSw1LjQxYzIuOTksMCw1LjQxLTIuNDIsNS40MS01LjQxYzAtMi45OS0yLjQyLTUuNDEtNS40MS01LjQxQzEyLjA4LDUuNjIsOS42Niw4LjA0LDkuNjYsMTEuMDN6IE0xOS4zNiwxMC4zOWMwLDIuMzctMS45Miw0LjI5LTQuMjksNC4yOWMtMi4zNywwLTQuMjktMS45Mi00LjI5LTQuMjljMC0yLjM3LDEuOTItNC4yOSw0LjI5LTQuMjlDMTcuNDMsNi4xLDE5LjM2LDguMDIsMTkuMzYsMTAuMzl6Ii8+PC9zdmc+) no-repeat 50% 50%; margin: 5px 0 0 8px; -moz-transition: all 100ms ease-in-out; -o-transition: all 100ms ease-in-out; -webkit-transition: all 100ms ease-in-out; transition: all 100ms ease-in-out; } #footer-container .footer .logo-loop:hover { opacity: 0.7; } /*------------------------------------------------------------------ Impact sections */ .impact-section { width: 100%; height: auto; background: white; padding: 40px 50px; margin: 30px 0; position: relative; min-height: 220px; z-index: 0; } .impact-section .spinner-container { z-index: 1; } .impact-section .total-views-section { background: white; min-height: 70px; z-index: 2; position: relative; } @media (max-width: 1299px) { .impact-section { padding: 40px; } } @media (max-width: 991px) { .impact-section { padding: 30px; } } @media (max-width: 767px) { .impact-section { padding: 20px; } } /*------------------------------------------------------------------ Sources */ .title-and-source { width: 66.66666%; float: left; } .title-and-source.fw { width: 100%; } .title-and-source.citedin { width: 100%; } .title-and-source .title { width: 100%; border-bottom: 1px solid #e0e0e0; padding-bottom: 20px; } .title-and-source .title h2 { padding-right: 10px; float: left; } .title-and-source .title .icon-info { margin-top: 17px; } .title-and-source .source-list { width: 100%; float: left; } .title-and-source .source-list.no-filter li { cursor: default; } .title-and-source .source-list.no-filter li .line { background: #dadada; } .title-and-source .source-list.no-filter li .number { display: block; } .title-and-source .source-list.no-filter li .source { display: inline-block; float: left; } .title-and-source .source-list.no-filter li a { float: left; cursor: pointer; padding: 11px 10px 4px 10px; } .title-and-source .source-list.no-filter li a:hover .icon-link-container .icon-link:after { top: -2px; left: 2px; } .title-and-source .source-list.no-filter li a .icon-link-container { width: 16px; height: 16px; float: left; background: #f29400; position: relative; } .title-and-source .source-list.no-filter li a .icon-link-container:after { content: ''; position: absolute; width: calc(100% - 4px); height: calc(100% - 4px); top: 2px; left: 2px; background: white; z-index: 0; } .title-and-source .source-list.no-filter li a .icon-link-container .icon-link { width: 9px; height: 9px; position: absolute; top: 0; right: 0; background: white; z-index: 1; } .title-and-source .source-list.no-filter li a .icon-link-container .icon-link:after { content: ''; position: absolute; width: 9px; height: 9px; top: 0; left: 0; background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA5IDkiPjxwb2x5Z29uIGZpbGw9IiNGMjk0MDAiIHBvaW50cz0iNy40NSwwLjAyIDAsNy41OCAxLjQyLDkuMDIgOC44NywxLjQ2Ii8+PHJlY3QgeD0iNyIgZmlsbD0iI0YyOTQwMCIgd2lkdGg9IjIiIGhlaWdodD0iNiIvPjxyZWN0IHg9IjUiIHk9Ii0yIiB0cmFuc2Zvcm09Im1hdHJpeCg0LjU0NzQ1NWUtMDExIDEgLTEgNC41NDc0NTVlLTAxMSA3IC01KSIgZmlsbD0iI0YyOTQwMCIgd2lkdGg9IjIiIGhlaWdodD0iNiIvPjwvc3ZnPg==) no-repeat; -moz-transition: all 200ms cubic-bezier(0.37, 0.74, 0.15, 1); -o-transition: all 200ms cubic-bezier(0.37, 0.74, 0.15, 1); -webkit-transition: all 200ms cubic-bezier(0.37, 0.74, 0.15, 1); transition: all 200ms cubic-bezier(0.37, 0.74, 0.15, 1); } .title-and-source .source-list li { list-style: none; float: left; margin: 30px 40px 0px 0px; padding: 0 40px 10px 0; position: relative; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; cursor: pointer; } .title-and-source .source-list li .number { font: 30px/38px 'Open Sans', sans-serif; font-weight: 600; color: #f29400; } .title-and-source .source-list li .source { display: block; font: 24px/35px 'Open Sans', sans-serif; font-weight: 600; color: #666666; } .title-and-source .source-list li .line { position: absolute; width: 100%; height: 1px; bottom: 0; background: #f1f1f1; -moz-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; -webkit-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; } .title-and-source .source-list li a { text-decoration: none; cursor: pointer; -moz-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; -webkit-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; } .title-and-source .source-list li a .number { text-decoration: none; color: #dadada; -moz-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; -webkit-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; } .title-and-source .source-list li a .source { text-decoration: none; color: #dadada; -moz-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; -webkit-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; } .title-and-source .source-list li a .line { overflow: hidden; } .title-and-source .source-list li a .line:before { content: ''; position: absolute; width: 100%; left: -100%; height: 1px; bottom: 0; background: #666666; -moz-transition: all 0ms ease-in-out; -o-transition: all 0ms ease-in-out; -webkit-transition: all 0ms ease-in-out; transition: all 0ms ease-in-out; } .title-and-source .source-list li.active { pointer-events: none; } .title-and-source .source-list li.active .line { background: #dadada; } .title-and-source .source-list li.active a .number { color: #f29400; } .title-and-source .source-list li.active a .source { color: #666666; } .title-and-source .source-list li.active a .line:before { display: none; } .title-and-source .source-list li.active:hover .number { color: #f29400; } .title-and-source .source-list li:hover .line { background: #dadada; } .title-and-source .source-list li:hover a { text-decoration: none; } .title-and-source .source-list li:hover a .number { color: #666666; } .title-and-source .source-list li:hover a .source { color: #666666; } .title-and-source .source-list li:hover a .line:before { left: 100%; -moz-transition: all 300ms ease-in-out; -o-transition: all 300ms ease-in-out; -webkit-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out; } .title-and-source .period-title { font-size: 35px; color: #666666; margin-top: 60px; } /*------------------------------------------------------------------ Percentile Rank */ .rank { width: 33.33333%; float: right; position: relative; } .rank .percentile-chart-container { display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-justify-content: center; justify-content: center; float: left; width: 100%; } .rank .percentile-chart-container .number { font-size: 45px; line-height: 45px; font-weight: 600; text-align: center; color: #f29400; width: 100%; position: absolute; top: calc(50% - 60px); left: 0; } .rank .percentile-chart-container .rank-name { font-size: 16px; line-height: 22px; font-weight: 600; text-align: center; color: #666666; width: 100%; position: absolute; top: calc(50% - 10px); left: 0; } .rank .percentile-resume { font-size: 16px; line-height: 24px; text-align: center; margin: 0 40px; } .rank .percentile-resume .number, .rank .percentile-resume .highlighted { color: #f29400; font-weight: 700; } .percentile-chart-base { position: relative; width: 250px; height: 250px; pointer-events: none; } .percentile-chart-base:before { content: ''; position: absolute; width: 16px; height: 16px; top: calc(50% - 8px); left: calc(50% - 10px); background: #dadada; -moz-animation: grow 400ms cubic-bezier(0.37, 0.74, 0.15, 1) 0ms infinite alternate; -webkit-animation: grow 400ms cubic-bezier(0.37, 0.74, 0.15, 1) 0ms infinite alternate; animation: grow 400ms cubic-bezier(0.37, 0.74, 0.15, 1) 0ms infinite alternate; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; -moz-transform: scale(0); -ms-transform: scale(0); -webkit-transform: scale(0); transform: scale(0); z-index: -1; } .percentile-chart-base:after { content: ''; position: absolute; width: 16px; height: 16px; top: calc(50% - 8px); left: calc(50% + 10px); background: #dadada; -moz-animation: grow 400ms cubic-bezier(0.37, 0.74, 0.15, 1) 100ms infinite alternate; -webkit-animation: grow 400ms cubic-bezier(0.37, 0.74, 0.15, 1) 100ms infinite alternate; animation: grow 400ms cubic-bezier(0.37, 0.74, 0.15, 1) 100ms infinite alternate; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; -moz-transform: scale(0); -ms-transform: scale(0); -webkit-transform: scale(0); transform: scale(0); z-index: -1; } @media (max-width: 1299px) { .title-and-source .source-list li { margin: 50px 40px 0px 0px; } .title-and-source .source-list li .number { font: 30px/38px 'Open Sans', sans-serif; font-weight: 600; } .title-and-source .source-list li .source { display: block; font: 24px/35px 'Open Sans', sans-serif; } .rank .percentile-chart-container .number { font-size: 40px; line-height: 40px; } .rank .percentile-chart-container .rank-name { font-size: 15px; line-height: 20px; top: calc(50% - 15px); } .rank .percentile-resume { margin: 0; } .percentile-chart-base { position: relative; width: 220px; height: 220px; } } @media (max-width: 991px) { .rank .percentile-chart-container .number { font-size: 35px; line-height: 35px; top: calc(50% - 65px); } .rank .percentile-chart-container .rank-name { font-size: 14px; line-height: 18px; top: calc(50% - 30px); } .title-and-source.socialbuzz { width: 100%; } .title-and-source .title .icon-info { margin-top: 13px; } .title-and-source .source-list li { margin: 30px 20px 0px 0px; padding: 0 20px 10px 0; } .title-and-source .source-list li .number { font: 30px/38px 'Open Sans', sans-serif; font-weight: 600; } .title-and-source .source-list li .source { display: block; font: 24px/35px 'Open Sans', sans-serif; font-weight: 600; } } @media (max-width: 767px) { .title-and-source { width: 100%; -webkit-order: 1; order: 1; } .title-and-source .title .module-icon-info { display: none; } .title-and-source .period-title { display: none; } .title-and-source .source-list li { margin: 20px 15px 0px 0px; padding: 0 15px 10px 0; } .title-and-source .source-list li .number { font: 24px/30px 'Open Sans', sans-serif; font-weight: 600; } .title-and-source .source-list li .source { display: block; font: 20px/28px 'Open Sans', sans-serif; font-weight: 600; } .rank { width: 100%; clear: both; margin-top: 20px; } .rank .percentile-chart-container { display: none; } .rank .percentile-resume { text-align: left; } } /*------------------------------------------------------------------ altmetric Donnut */ .altmetric-container-plugin-container { width: calc(33.33333% - 40px); float: right; position: relative; background: #f9f9f9; -moz-border-radius: 18px; -webkit-border-radius: 18px; border-radius: 18px; padding: 35px 40px 40px 40px; margin-left: 40px; } .altmetric-container-plugin-container .title { font-size: 30px; font-weight: 600; color: #666666; text-align: center; margin-bottom: 40px; } .altmetric-container-plugin-container > .altmetric-embed { display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-justify-content: center; justify-content: center; } .altmetric-container-plugin-container .altmetric-normal-legend { text-align: center; margin: 0; width: 100%; } .altmetric-container-plugin-container .altmetric-normal-legend a img { width: 240px; height: 240px; } .altmetric-container-plugin-container .altmetric-normal-legend .altmetric-see-more-details { display: none; } .altmetric-container-plugin-container #_altmetric_popover_el { z-index: 0 !important; } .altmetric-container-plugin-container #_altmetric_popover_el #_altmetric_container #_altmetric_popover_inner .altmetric-popover-content { padding-top: 10px !important; background: none !important; } .altmetric-container-plugin-container #_altmetric_popover_el #_altmetric_container #_altmetric_popover_inner .altmetric-popover-content > div { line-height: 24px !important; border-left-style: solid !important; border-left-width: 24px !important; margin: 20px 0 0px 0px !important; } .altmetric-container-plugin-container #_altmetric_popover_el #_altmetric_container #_altmetric_popover_inner .altmetric-popover-content > div a.link-to-altmetric-details-tab { font-size: 16px; color: #666666; text-decoration: none; } .altmetric-container-plugin-container #_altmetric_popover_el #_altmetric_container #_altmetric_popover_inner .altmetric-popover-content > div a.link-to-altmetric-details-tab b { font-size: 18px; font-weight: 600; color: black; } .altmetric-container-plugin-container #_altmetric_popover_el #_altmetric_container #_altmetric_popover_inner .altmetric-popover-content .readers { border: none !important; } .altmetric-container-plugin-container #_altmetric_popover_el #_altmetric_container #_altmetric_popover_inner .altmetric-popover-content .readers .tip_mendeley, .altmetric-container-plugin-container #_altmetric_popover_el #_altmetric_container #_altmetric_popover_inner .altmetric-popover-content .readers .tip_citeulike { line-height: 24px !important; border-left-style: solid !important; border-left-width: 24px !important; margin: 20px 0 0px 0px !important; font-size: 16px; color: #666666; } .altmetric-container-plugin-container #_altmetric_popover_el #_altmetric_container #_altmetric_popover_inner .altmetric-popover-content .readers .tip_mendeley b, .altmetric-container-plugin-container #_altmetric_popover_el #_altmetric_container #_altmetric_popover_inner .altmetric-popover-content .readers .tip_citeulike b { font-size: 18px; font-weight: 600; color: black; } .altmetric-container-plugin-container .btn-container { margin-top: 40px; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-justify-content: center; justify-content: center; } .altmetric-container-plugin-container-sm { display: none; float: right; margin-top: 11px; } @media (max-width: 1299px) { .altmetric-container-plugin-container { padding: 20px; } .altmetric-container-plugin-container .title { font-size: 24px; margin-bottom: 30px; } .altmetric-container-plugin-container .altmetric-normal-legend a img { width: 160px; height: 160px; } .altmetric-container-plugin-container #_altmetric_popover_el #_altmetric_container #_altmetric_popover_inner .altmetric-popover-content { padding-top: 10px !important; background: none !important; } .altmetric-container-plugin-container #_altmetric_popover_el #_altmetric_container #_altmetric_popover_inner .altmetric-popover-content > div { line-height: 24px !important; border-left-style: solid !important; border-left-width: 24px !important; margin: 20px 0 0px 0px !important; } .altmetric-container-plugin-container #_altmetric_popover_el #_altmetric_container #_altmetric_popover_inner .altmetric-popover-content > div a.link-to-altmetric-details-tab { font-size: 16px; color: #666666; text-decoration: none; } .altmetric-container-plugin-container #_altmetric_popover_el #_altmetric_container #_altmetric_popover_inner .altmetric-popover-content > div a.link-to-altmetric-details-tab b { font-size: 18px; font-weight: 600; color: black; } .altmetric-container-plugin-container #_altmetric_popover_el #_altmetric_container #_altmetric_popover_inner .altmetric-popover-content .readers { border: none !important; } .altmetric-container-plugin-container #_altmetric_popover_el #_altmetric_container #_altmetric_popover_inner .altmetric-popover-content .readers .tip_mendeley, .altmetric-container-plugin-container #_altmetric_popover_el #_altmetric_container #_altmetric_popover_inner .altmetric-popover-content .readers .tip_citeulike { line-height: 24px !important; border-left-style: solid !important; border-left-width: 24px !important; margin: 20px 0 0px 0px !important; font-size: 16px; color: #666666; } .altmetric-container-plugin-container #_altmetric_popover_el #_altmetric_container #_altmetric_popover_inner .altmetric-popover-content .readers .tip_mendeley b, .altmetric-container-plugin-container #_altmetric_popover_el #_altmetric_container #_altmetric_popover_inner .altmetric-popover-content .readers .tip_citeulike b { font-size: 18px; font-weight: 600; color: black; } } @media (max-width: 991px) { .altmetric-container-plugin-container-sm { display: block; } .altmetric-container-plugin-container { display: none; } div#_altmetric_popover_el.altmetric-embed { z-index: 8 !important; } } /*------------------------------------------------------------------ Chart filters */ .chart-filter { width: 100%; border-top: 1px solid #e8e8e8; margin-top: 10px; } .chart-filter .select-wrapper { margin-top: 40px; position: relative; min-width: 160px; float: left; } .chart-filter .select-wrapper .select-background { display: inline-block; border: 1px solid #dadada; position: relative; border-radius: 2px; width: 100%; overflow: hidden; background: white; height: 27px; } .chart-filter .select-wrapper .select-background:before { content: ''; top: 0; right: 0; background: white; width: 22px; height: 27px; position: absolute; pointer-events: none; } .chart-filter .select-wrapper .select-background:after { content: ''; width: 0; position: absolute; right: 7px; top: 50%; margin-top: -3px; border-width: 6px 4px; border-style: solid; pointer-events: none; border-color: #666666 transparent transparent transparent; } .chart-filter .select-wrapper .select-background, .chart-filter .select-wrapper .select-background > * { cursor: pointer; } .chart-filter .select-wrapper .select-background select { -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; background: transparent; border: 0; outline: 0; padding: 0 8px; font-size: 12px; line-height: 27px; width: 100%; -webkit-user-select: none; -moz-user-select: -moz-none; -ms-user-select: none; user-select: none; -webkit-appearance: none; -moz-appearance: radio-container; appearance: none; } .chart-filter .filter { margin-top: 40px; float: right; height: 32px; width: auto; background: white; border: 1px solid #bababa; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; } .chart-filter .filter li { width: 40px; height: 32px; position: relative; float: left; list-style: none; background-color: white; cursor: pointer; } .chart-filter .filter li.rect { background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0MCAzMiI+PHBhdGggZmlsbD0iI0JBQkFCQSIgZD0iTTI0LDh2MTZoNFY4SDI0eiBNMTgsMjRoNFYxMmgtNFYyNHogTTEyLDI0aDR2LThoLTRWMjR6Ii8+PC9zdmc+); } .chart-filter .filter li.line { background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0MCAzMiI+PHBhdGggZmlsbD0iI0JBQkFCQSIgZD0iTTIyLjA4LDE2bDQuODUtNS4wMUwyOSwxMy4xNGwtNi45Myw3LjE2TDE3LjkyLDE2bC00Ljg1LDUuMDFMMTEsMTguODZsNi45My03LjE2TDIyLjA4LDE2eiIvPjwvc3ZnPg==); } .chart-filter .filter li.selected { background-color: #bababa; pointer-events: none; } .chart-filter .filter li.selected.rect { background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0MCAzMiI+PHBhdGggZmlsbD0iI0ZGRkZGRiIgZD0iTTI0LDh2MTZoNFY4SDI0eiBNMTgsMjRoNFYxMmgtNFYyNHogTTEyLDI0aDR2LThoLTRWMjR6Ii8+PC9zdmc+); } .chart-filter .filter li.selected.line { background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0MCAzMiI+PHBhdGggZmlsbD0iI0ZGRkZGRiIgZD0iTTIyLjA4LDE2bDQuODUtNS4wMUwyOSwxMy4xNGwtNi45Myw3LjE2TDE3LjkyLDE2bC00Ljg1LDUuMDFMMTEsMTguODZsNi45My03LjE2TDIyLjA4LDE2eiIvPjwvc3ZnPg==); } .chart { width: calc(100% + 54px); height: 400px; margin-left: -45px; position: relative; margin-top: 10px; } .chart .chart-base { position: absolute; top: 0; left: 0; width: 100%; height: 400px; } .chart .chart-base:before { content: ''; position: absolute; width: 16px; height: 16px; top: calc(50% - 8px); left: calc(50% - 10px); background: #dadada; -moz-animation: grow 400ms cubic-bezier(0.37, 0.74, 0.15, 1) 0ms infinite alternate; -webkit-animation: grow 400ms cubic-bezier(0.37, 0.74, 0.15, 1) 0ms infinite alternate; animation: grow 400ms cubic-bezier(0.37, 0.74, 0.15, 1) 0ms infinite alternate; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; -moz-transform: scale(0); -ms-transform: scale(0); -webkit-transform: scale(0); transform: scale(0); z-index: -1; } .chart .chart-base:after { content: ''; position: absolute; width: 16px; height: 16px; top: calc(50% - 8px); left: calc(50% + 10px); background: #dadada; -moz-animation: grow 400ms cubic-bezier(0.37, 0.74, 0.15, 1) 100ms infinite alternate; -webkit-animation: grow 400ms cubic-bezier(0.37, 0.74, 0.15, 1) 100ms infinite alternate; animation: grow 400ms cubic-bezier(0.37, 0.74, 0.15, 1) 100ms infinite alternate; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; -moz-transform: scale(0); -ms-transform: scale(0); -webkit-transform: scale(0); transform: scale(0); z-index: -1; } @media (max-width: 1299px) { .chart { width: calc(100% + 34px); margin-left: -25px; height: 350px; } .chart .chart-base { height: 350px; } } @media (max-width: 991px) { .chart { width: calc(100% + 29px); margin-left: -20px; height: 300px; } .chart .chart-base { height: 300px; } } @media (max-width: 767px) { .chart { width: calc(100% + 29px); margin-left: -20px; height: 250px; } .chart .chart-base { height: 250px; } } /*------------------------------------------------------------------ Popover icon info */ .module-icon-info { position: relative; display: block; float: left; } .module-icon-info .icon-info { background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2ZXJzaW9uPSIxLjEiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMTUgMTUiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDE1IDE1IiB4bWw6c3BhY2U9InByZXNlcnZlIj48Zz48Zz48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZmlsbD0iI0RBREFEQSIgZD0iTTcuNSAwQzMuNCAwIDAgMy40IDAgNy41QzAgMTEuNiAzLjQgMTUgNy41IDE1IGM0LjEgMCA3LjUtMy40IDcuNS03LjVDMTUgMy40IDExLjYgMCA3LjUgMHogTTkgMTNIN1Y3SDVWNWg0VjEzeiBNOSA0SDdWMmgyVjR6Ii8+PC9nPjwvZz48L3N2Zz4=) no-repeat top left; width: 15px; height: 15px; cursor: pointer; float: left; display: block; opacity: 1; -moz-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; -webkit-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; } .module-icon-info .icon-info:hover { opacity: 0.7; } .module-icon-info .info-popover { position: absolute; width: 300px; background: white; border: 1px solid #e0e0e0; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; z-index: 8; left: -3px; bottom: 22px; word-wrap: break-word; -moz-box-shadow: rgba(0, 0, 0, 0.12) 0px 5px 20px; -webkit-box-shadow: rgba(0, 0, 0, 0.12) 0px 5px 20px; box-shadow: rgba(0, 0, 0, 0.12) 0px 5px 20px; padding: 15px; -moz-transition: width 400ms ease-in-out; -o-transition: width 400ms ease-in-out; -webkit-transition: width 400ms ease-in-out; transition: width 400ms ease-in-out; } .module-icon-info .info-popover:before { content: ''; position: absolute; background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA4IDQiPjxwYXRoIGZpbGw9IiNCQUJBQkEiIGQ9Ik0wLDBoOEw0LDRMMCwweiIvPjwvc3ZnPg==) no-repeat; width: 8px; height: 4px; left: 6px; bottom: -5px; } .module-icon-info .info-popover h3, .module-icon-info .info-popover h4 { font-weight: 600; color: #666666; font-size: 13px; line-height: 18px; } .module-icon-info .info-popover h4 { margin: 10px 0 0 0; } .module-icon-info .info-popover p { font: 12px/18px 'Open Sans Neue', 'Open Sans', sans-serif; color: #999999; } .module-icon-info .info-popover .arrow-list { width: 100%; clear: both; text-align: left; } .module-icon-info .info-popover .arrow-list li { list-style: none; width: 100%; font: 12px/18px 'Open Sans Neue', 'Open Sans', sans-serif; color: #999999; -moz-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; -webkit-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; padding: 0 0 0 10px; background: url(data:image/gif;base64,R0lGODlhBgAFAIABAFlXUv///yH/C1hNUCBEYXRhWE1QPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS41LWMwMjEgNzkuMTU1NzcyLCAyMDE0LzAxLzEzLTE5OjQ0OjAwICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1wTU06T3JpZ2luYWxEb2N1bWVudElEPSJ4bXAuZGlkOmNlNjk4NGQ4LTI1NGItNGE0OS1hZmFkLWMxMWY1NzY1OWVlMCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo3NDEyQ0I0NDM5QUQxMUU0QkEyNkY3QjRBQUQ4MjEyMyIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo3NDEyQ0I0MzM5QUQxMUU0QkEyNkY3QjRBQUQ4MjEyMyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ0MgMjAxNCAoV2luZG93cykiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo3YjU4YzAxNi00ZDFlLTc3NGItYjMzYS04NjAwNmM5NmFiOGMiIHN0UmVmOmRvY3VtZW50SUQ9ImFkb2JlOmRvY2lkOnBob3Rvc2hvcDo0OWVmNTI5NC0yZDJlLTExZTQtYjRjNC1hYmI2OThjYjRkYTgiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz4B//79/Pv6+fj39vX08/Lx8O/u7ezr6uno5+bl5OPi4eDf3t3c29rZ2NfW1dTT0tHQz87NzMvKycjHxsXEw8LBwL++vby7urm4t7a1tLOysbCvrq2sq6qpqKempaSjoqGgn56dnJuamZiXlpWUk5KRkI+OjYyLiomIh4aFhIOCgYB/fn18e3p5eHd2dXRzcnFwb25tbGtqaWhnZmVkY2JhYF9eXVxbWllYV1ZVVFNSUVBPTk1MS0pJSEdGRURDQkFAPz49PDs6OTg3NjU0MzIxMC8uLSwrKikoJyYlJCMiISAfHh0cGxoZGBcWFRQTEhEQDw4NDAsKCQgHBgUEAwIBAAAh+QQBAAABACwAAAAABgAFAAACCIxhGQjtilIsADs=) no-repeat 0px 7px; margin-top: 10px; } .module-icon-info .info-popover .arrow-list li a { position: relative; text-decoration: none; color: #999999; } .module-icon-info .info-popover .arrow-list li a span { color: #666666; font-weight: 600; -moz-transition: all 100ms ease-in-out; -o-transition: all 100ms ease-in-out; -webkit-transition: all 100ms ease-in-out; transition: all 100ms ease-in-out; } .module-icon-info .info-popover .arrow-list li a:before { content: ''; position: absolute; width: 10px; height: 5px; top: 6px; left: -14px; background: url(data:image/gif;base64,R0lGODlhBgAFAIABAFlXUv///yH/C1hNUCBEYXRhWE1QPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS41LWMwMjEgNzkuMTU1NzcyLCAyMDE0LzAxLzEzLTE5OjQ0OjAwICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1wTU06T3JpZ2luYWxEb2N1bWVudElEPSJ4bXAuZGlkOmNlNjk4NGQ4LTI1NGItNGE0OS1hZmFkLWMxMWY1NzY1OWVlMCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo3NDEyQ0I0NDM5QUQxMUU0QkEyNkY3QjRBQUQ4MjEyMyIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo3NDEyQ0I0MzM5QUQxMUU0QkEyNkY3QjRBQUQ4MjEyMyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ0MgMjAxNCAoV2luZG93cykiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo3YjU4YzAxNi00ZDFlLTc3NGItYjMzYS04NjAwNmM5NmFiOGMiIHN0UmVmOmRvY3VtZW50SUQ9ImFkb2JlOmRvY2lkOnBob3Rvc2hvcDo0OWVmNTI5NC0yZDJlLTExZTQtYjRjNC1hYmI2OThjYjRkYTgiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz4B//79/Pv6+fj39vX08/Lx8O/u7ezr6uno5+bl5OPi4eDf3t3c29rZ2NfW1dTT0tHQz87NzMvKycjHxsXEw8LBwL++vby7urm4t7a1tLOysbCvrq2sq6qpqKempaSjoqGgn56dnJuamZiXlpWUk5KRkI+OjYyLiomIh4aFhIOCgYB/fn18e3p5eHd2dXRzcnFwb25tbGtqaWhnZmVkY2JhYF9eXVxbWllYV1ZVVFNSUVBPTk1MS0pJSEdGRURDQkFAPz49PDs6OTg3NjU0MzIxMC8uLSwrKikoJyYlJCMiISAfHh0cGxoZGBcWFRQTEhEQDw4NDAsKCQgHBgUEAwIBAAAh+QQBAAABACwAAAAABgAFAAACCIxhGQjtilIsADs=) no-repeat top right white; -moz-transition: all 100ms ease-in-out; -o-transition: all 100ms ease-in-out; -webkit-transition: all 100ms ease-in-out; transition: all 100ms ease-in-out; } .module-icon-info .info-popover .arrow-list li a:hover { text-decoration: none; } .module-icon-info .info-popover .arrow-list li a:hover span { color: #bababa; } .module-icon-info .info-popover .arrow-list li a:hover:before { left: -11px; } .module-icon-info .info-popover .arrow-list li span { color: #666666; font-weight: 600; } /*------------------------------------------------------------------ Fontiers citations */ .frontiers-citations-title { border-bottom: 1px solid #e0e0e0; width: 100%; padding-bottom: 20px; } .frontiers-citations-title h2 { font-weight: 300; float: left; width: calc(100% - 350px); } .frontiers-citations-title h2 span { color: #f29400; font-weight: 600; } .frontiers-citations-title .filter { float: right; position: relative; margin-top: 10px; width: 350px; } .frontiers-citations-title .filter li { list-style: none; float: left; background: white; color: #bababa; height: 34px; padding: 7px 25px; -moz-border-radius: 17px; -webkit-border-radius: 17px; border-radius: 17px; font-weight: 600; cursor: pointer; -moz-transition: all 100ms ease-in-out; -o-transition: all 100ms ease-in-out; -webkit-transition: all 100ms ease-in-out; transition: all 100ms ease-in-out; font-size: 14px; } .frontiers-citations-title .filter li.current { background: #bababa; color: white; pointer-events: none; } @media (max-width: 1299px) { .frontiers-citations-title h2 { width: 100%; } .frontiers-citations-title .filter { margin-top: 20px; width: 100%; } } @media (max-width: 991px) { .frontiers-citations-title h2 { width: 100%; } .frontiers-citations-title .filter { margin-top: 20px; width: 100%; } } @media (max-width: 767px) { .frontiers-citations-title h2 { width: 100%; } .frontiers-citations-title .filter { width: 100%; } .frontiers-citations-title .filter li { padding: 7px 15px; font-size: 13px; font-weight: 400; } } /*------------------------------------------------------------------ Journal source */ .journal-container { max-width: 100%; } .journal-container .logo-fr { background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzMiAzOCI+PHBvbHlnb24gZmlsbD0iIzhBQzY1MCIgcG9pbnRzPSIwLDMyLjE2IDAuMDQsMTguNzUgMTIuNzQsMTQuODMgMTIuNywyOC4yNCIvPjxwb2x5Z29uIGZpbGw9IiNGQ0I4MTMiIHBvaW50cz0iMTIuNywyOC4yNCAxMi43NCwxNC44MyAyMS4zNSwyMC42NyAyMS4zMSwzNC4wOCIvPjxwb2x5Z29uIGZpbGw9IiMwMDM4NkMiIHBvaW50cz0iOC42MSwzOCAwLDMyLjE2IDEyLjcsMjguMjQgMjEuMzEsMzQuMDgiLz48cG9seWdvbiBmaWxsPSIjNTQzMDdBIiBwb2ludHM9IjEyLjQ1LDE0LjE1IDE1LjksNi4zNCAyMC4zNCwxNi42NyAxNi44OSwyNC40NyIvPjxwb2x5Z29uIGZpbGw9IiMwMDlEQzYiIHBvaW50cz0iMTYuODksMjQuNDcgMjAuMzQsMTYuNjcgMzIsMTQuOCAyOC41NywyMi41MSIvPjxwb2x5Z29uIGZpbGw9IiNGNDgyNTYiIHBvaW50cz0iMjAuMzQsMTYuNjcgMTUuOSw2LjM0IDI3LjU2LDQuNDggMzIsMTQuOCIvPjxwb2x5Z29uIGZpbGw9IiNDODI0M0YiIHBvaW50cz0iMTIuNzUsMTQuODMgNC4wNywxMy4yMSAzLjA0LDQuNzQgMTEuNzIsNi4zNiIvPjxwb2x5Z29uIGZpbGw9IiM2QkM4QzYiIHBvaW50cz0iMTEuNzIsNi4zNiAzLjA0LDQuNzQgNy44NSwwIDE2LjUzLDEuNjIiLz48cG9seWdvbiBmaWxsPSIjMzc4NTRCIiBwb2ludHM9IjE3LjU0LDEwLjEyIDEyLjc1LDE0LjgzIDExLjcyLDYuMzYgMTYuNTMsMS42MiIvPjwvc3ZnPg==) no-repeat top left; width: 32px; height: 38px; float: left; margin: 5px 10px 0 0; } .journal-container .journal-metadata-container { font-size: 16px; color: #999999; text-align: left; float: left; max-width: calc(100% - 42px); } .journal-container .journal-metadata-container .journal-name { font-size: 16px; color: #666666; text-align: left; font-weight: 600; float: left; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; -moz-transition: all 100ms ease-in-out; -o-transition: all 100ms ease-in-out; -webkit-transition: all 100ms ease-in-out; transition: all 100ms ease-in-out; text-decoration: none; } .journal-container .journal-metadata-container .journal-name:hover { color: #bababa; } .journal-container .journal-metadata-container .journal-date { float: left; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } @media (max-width: 767px) { .journal-container .journal-data > a .journal-texts .journal-metadata-container, .journal-container .journal-data > div .journal-texts .journal-metadata-container { font-size: 14px; } .journal-container .journal-data > a .journal-texts .journal-doi, .journal-container .journal-data > div .journal-texts .journal-doi { display: block; } } /*-------------------------------------------------------- people list */ ul.people-list-hrz { overflow: hidden; float: left; display: block; width: 100%; } ul.people-list-hrz > li { list-style: none; display: inline; margin: 0; padding: 0; font-size: 16px; line-height: 31px; height: 21px; margin-top: 10px; max-width: 100%; color: #999999; } ul.people-list-hrz > li:after { content: "\00a0\00b7\00a0"; } ul.people-list-hrz > li:last-child:after { content: ""; } ul.people-list-hrz > li > a, ul.people-list-hrz > li > span { color: #999999; -moz-transition: all 100ms ease-in-out; -o-transition: all 100ms ease-in-out; -webkit-transition: all 100ms ease-in-out; transition: all 100ms ease-in-out; max-width: 100%; min-height: 21px; text-decoration: none; } ul.people-list-hrz > li > a .img-frame, ul.people-list-hrz > li > span .img-frame { margin: 0; padding: 0; width: 21px; height: 21px; position: relative; margin-right: 27px; } ul.people-list-hrz > li > a .img-frame img, ul.people-list-hrz > li > span .img-frame img { width: 21px; height: 21px; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; margin: 0; padding: 0; position: absolute; top: 0; left: 0; } ul.people-list-hrz > li > a { cursor: pointer; } ul.people-list-hrz > li > a:hover { color: #bababa; text-decoration: none; } ul.people-list-hrz > li > a.more { color: #f29400; font-weight: 700; } ul.people-list-hrz > li .name { word-break: break-word; -moz-hyphens: auto; -ms-hyphens: auto; -webkit-hyphens: auto; hyphens: auto; max-width: 100%; position: relative; } ul.people-list-hrz > li ul.sub { display: inline-block; } ul.people-list-hrz > li ul.sub > li { list-style: none; font-size: 10px; font-weight: 600; float: left; padding: 0; } ul.people-list-hrz > li ul.sub > li:before { content: ',\00a0'; } ul.people-list-hrz > li ul.sub > li:first-child:before { content: '\00a0'; } /*-------------------------------------------------------- publications list */ .impact-overview { margin-top: 20px; } .impact-overview li { list-style: none; float: left; margin-right: 40px; } .impact-overview li:last-child { margin-right: 0px; } .impact-overview li .number { font-size: 18px; line-height: 22px; font-weight: 700; color: #999999; } .impact-overview li i { margin-right: 10px; } .impact-overview li .icon-citation { background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2ZXJzaW9uPSIxLjEiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMjMgMjAiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDIzIDIwIiB4bWw6c3BhY2U9InByZXNlcnZlIj48cGF0aCBmaWxsPSIjREJEQURBIiBkPSJNMjMgNi45YzAtMi0wLjYtMy43LTEuOC00LjlDMjAuMSAwLjYgMTguNyAwIDE3LjIgMGMtMS4xIDAtMiAwLjQtMi44IDEuM2MtMC44IDAuOS0xLjIgMS45LTEuMiAzLjIgYzAgMS4xIDAuNCAyLjEgMS4xIDIuOEMxNS4xIDggMTYgOC40IDE3IDguNGMwLjQgMCAwLjktMC4xIDEuNC0wLjJsMC40IDBjMC42IDAgMC45IDAuNCAwLjkgMS4yYzAgMS4yLTAuNiAyLjYtMS43IDQuMiBjLTEuMSAxLjYtMi45IDMuMy01LjIgNC45TDE0IDIwQzIwIDE2LjEgMjMgMTEuNyAyMyA2LjlMMjMgNi45eiBNMTAuMiA2LjljMC0yLTAuNi0zLjctMS43LTQuOUM3LjMgMC42IDUuOSAwIDQuNCAwIGMtMSAwLTIgMC40LTIuOCAxLjNDMC44IDIuMiAwLjQgMy4yIDAuNCA0LjVjMCAxLjEgMC40IDIgMS4xIDIuOEMyLjMgOCAzLjIgOC40IDQuMyA4LjRjMC40IDAgMC44LTAuMSAxLjQtMC4ybDAuNCAwIGMwLjYgMCAwLjggMC40IDAuOCAxLjJjMCAxLjItMC42IDIuNi0xLjcgNC4yYy0xLjEgMS42LTIuOSAzLjMtNS4yIDQuOUwxLjIgMjBDNy4yIDE2LjEgMTAuMiAxMS43IDEwLjIgNi45TDEwLjIgNi45eiIvPjwvc3ZnPg==) no-repeat top left; width: 23px; height: 20px; float: left; display: block; } .impact-overview li .icon-download { background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2ZXJzaW9uPSIxLjEiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMjQgMjEiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDI0IDIxIiB4bWw6c3BhY2U9InByZXNlcnZlIj48Zz48Zz48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZmlsbD0iI0RCREFEQSIgZD0iTTI0IDEyaC0ydjdIMnYtN0gwbDAgOWgyNGwwLTIuNWgwTDI0IDEyeiBNMTkuNCA3LjhMMTggNS45IEwxMyAxMVYwaC0ydjExTDYgNS45TDQuNiA3LjhsNy40IDcuM0wxOS40IDcuOHoiLz48L2c+PC9nPjwvc3ZnPg==) no-repeat top left; width: 24px; height: 21px; float: left; display: block; } .impact-overview li .icon-view { background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2ZXJzaW9uPSIxLjEiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMjkgMjMiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDI5IDIzIiB4bWw6c3BhY2U9InByZXNlcnZlIj48cGF0aCBmaWxsPSIjREJEQURBIiBkPSJNMTQuNSA3LjdjMCAyLjEtMS42IDMuOC0zLjYgMy44YzAgMi4xIDEuNiAzLjggMy42IDMuOHMzLjYtMS43IDMuNi0zLjhDMTguMSA5LjQgMTYuNSA3LjcgMTQuNSA3Ljd6IE0xNC41IDBDNy4xIDAgMCA4LjkgMCAxMS41QzAgMTQuMSA3LjEgMjMgMTQuNSAyM1MyOSAxNC4xIDI5IDExLjVDMjkgOC45IDIxLjkgMCAxNC41IDB6IE0xNC41IDE5LjJjLTQgMC03LjMtMy40LTcuMy03LjcgYzAtNC4yIDMuMi03LjcgNy4zLTcuN2M0IDAgNy4zIDMuNCA3LjMgNy43QzIxLjggMTUuNyAxOC41IDE5LjIgMTQuNSAxOS4yeiIvPjwvc3ZnPg==) no-repeat top left; width: 29px; height: 23px; float: left; display: block; } @media (max-width: 767px) { .impact-overview li { margin-right: 20px; } } /*-------------------------------------------------------- publications and mention list */ .publications-list > li, .mentions-list > li { list-style: none; margin-top: 70px; } .publications-list > li .people-list-hrz, .mentions-list > li .people-list-hrz { margin-top: 20px; } .publications-list > li p, .mentions-list > li p { margin-top: 20px; } .publications-list > li .journal-container, .mentions-list > li .journal-container { margin-top: 20px; } .publications-list > li .source, .mentions-list > li .source { margin-top: 3px; margin-bottom: -7px; font-size: 16px; line-height: 24px; color: #666666; text-decoration: none; -moz-transition: all 100ms ease-in-out; -o-transition: all 100ms ease-in-out; -webkit-transition: all 100ms ease-in-out; transition: all 100ms ease-in-out; float: left; } .publications-list > li .source:hover, .mentions-list > li .source:hover { color: #999999; } .publications-list > li .date, .mentions-list > li .date { margin-top: 7px; color: #999999; } .publications-list > li.show-more, .mentions-list > li.show-more { width: 100%; border-top: 1px solid #e0e0e0; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-justify-content: center; justify-content: center; } .publications-list > li.show-more a, .mentions-list > li.show-more a { margin-top: 30px; } @media (max-width: 1299px) { .publications-list > li, .mentions-list > li { margin-top: 50px; } } @media (max-width: 991px) { .publications-list > li, .mentions-list > li { margin-top: 40px; padding-bottom: 40px; border-bottom: 1px solid #e0e0e0; } .publications-list > li:last-child, .mentions-list > li:last-child { border-bottom: none; } .publications-list > li.show-more, .mentions-list > li.show-more { border-top: none; } .publications-list > li.show-more a, .mentions-list > li.show-more a { margin-top: 0px; } } @media (max-width: 767px) { .publications-list > li, .mentions-list > li { margin-top: 30px; padding-bottom: 30px; border-bottom: 1px solid #e0e0e0; } .publications-list > li:last-child, .mentions-list > li:last-child { border-bottom: none; } } .mentions-list > li.has-logo .mention-logo { width: 145px; height: 145px; float: left; position: relative; } .mentions-list > li.has-logo .mention-logo .img-container { width: 105px; height: 105px; position: relative; float: left; z-index: 0; } .mentions-list > li.has-logo .mention-logo .img-container:before { content: ''; position: absolute; width: calc(100% + 2px); height: calc(100% + 2px); top: -1px; left: -1px; background: white; border: 1px solid #e0e0e0; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; -moz-transition: all 200ms cubic-bezier(0.37, 0.74, 0.15, 1) 0ms; -o-transition: all 200ms cubic-bezier(0.37, 0.74, 0.15, 1) 0ms; -webkit-transition: all 200ms cubic-bezier(0.37, 0.74, 0.15, 1); -webkit-transition-delay: 0ms; transition: all 200ms cubic-bezier(0.37, 0.74, 0.15, 1) 0ms; } .mentions-list > li.has-logo .mention-logo .img-container:after { content: ''; position: absolute; width: 100%; height: 100%; top: 0; left: 0; background: white; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; -moz-transition: all 200ms cubic-bezier(0.37, 0.74, 0.15, 1) 0ms; -o-transition: all 200ms cubic-bezier(0.37, 0.74, 0.15, 1) 0ms; -webkit-transition: all 200ms cubic-bezier(0.37, 0.74, 0.15, 1); -webkit-transition-delay: 0ms; transition: all 200ms cubic-bezier(0.37, 0.74, 0.15, 1) 0ms; } .mentions-list > li.has-logo .mention-logo .img-container a { margin: 1px 0 0 1px; width: 103px; height: 103px; background: white; -moz-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; -webkit-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; position: relative; float: left; z-index: 1; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; overflow: hidden; text-align: center; vertical-align: text-top; display: inline-block; display: -webkit-inline-flex; display: inline-flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; z-index: 1; } .mentions-list > li.has-logo .mention-logo .img-container a img { max-width: 95px; max-height: 95px; -moz-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; -webkit-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; z-index: 2; } .mentions-list > li.has-logo .mention-logo .img-container:hover:before { -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -webkit-transform: rotate(180deg); transform: rotate(180deg); } .mentions-list > li.has-logo .mention-logo .img-container:hover:after { -moz-transform: scale(1.3); -ms-transform: scale(1.3); -webkit-transform: scale(1.3); transform: scale(1.3); } .mentions-list > li.has-logo .mention-metadata { width: calc(100% - 145px); float: left; } @media (max-width: 767px) { .mentions-list > li.has-logo .mention-logo { width: 85px; height: 85px; } .mentions-list > li.has-logo .mention-logo .img-container { width: 65px; height: 65px; } .mentions-list > li.has-logo .mention-logo .img-container a { width: 63px; height: 63px; } .mentions-list > li.has-logo .mention-logo .img-container a img { max-width: 63px; max-height: 63px; } .mentions-list > li.has-logo .mention-metadata { width: calc(100% - 85px); } } /*--------------------buttons */ .btn-orange-flex { background: #f29400; z-index: 0; color: white; font-size: 18px; font-weight: 700; padding: 0 40px; line-height: 51px; height: 51px; -moz-border-radius: 25.5px; -webkit-border-radius: 25.5px; border-radius: 25.5px; display: inline-block; -moz-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; -webkit-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; text-decoration: none !important; overflow: hidden; position: relative; z-index: 0; } .btn-orange-flex:before { content: ''; position: absolute; width: 20%; height: 100%; top: 0; left: 40%; background: #bababa; z-index: -1; -moz-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; -webkit-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; opacity: 0; } .btn-orange-flex:hover { color: white; text-decoration: none; } .btn-orange-flex:hover:before { left: 0px; width: 100%; opacity: 1; } .btn-orange-flex:active { text-decoration: none; color: white; } .btn-orange-outlined-flex { background: none; z-index: 0; color: #f29400; font-size: 18px; font-weight: 700; padding: 0 40px; line-height: 47px; height: 51px; -moz-border-radius: 25.5px; -webkit-border-radius: 25.5px; border-radius: 25.5px; display: inline-block; -moz-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; -webkit-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; text-decoration: none !important; overflow: hidden; position: relative; z-index: 0; border: 2px solid #f29400; } .btn-orange-outlined-flex:before { content: ''; position: absolute; width: 20%; height: 100%; top: 0; left: 40%; background: #bababa; z-index: -1; -moz-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; -webkit-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; opacity: 0; } .btn-orange-outlined-flex:hover { color: white; text-decoration: none; border: 2px solid #bababa; } .btn-orange-outlined-flex:hover:before { left: 0px; width: 100%; opacity: 1; } .btn-orange-outlined-flex:active { text-decoration: none; color: white; } @media (max-width: 1299px) { .btn-orange-flex, .btn-orange-outlined-flex { font-size: 16px; padding: 0 30px; line-height: 46px; height: 46px; -moz-border-radius: 23px; -webkit-border-radius: 23px; border-radius: 23px; } .btn-orange-outlined-flex { line-height: 42px; } } @media (max-width: 991px) { .btn-orange-flex, .btn-orange-outlined-flex { font-size: 15px; padding: 0 25px; font-weight: 600; line-height: 44px; height: 44px; -moz-border-radius: 22px; -webkit-border-radius: 22px; border-radius: 22px; } .btn-orange-outlined-flex { line-height: 38px; } } @media (max-width: 767px) { .btn-orange-flex, .btn-orange-outlined-flex { font-size: 14px; padding: 0 20px; font-weight: 600; line-height: 42px; height: 42px; -moz-border-radius: 21px; -webkit-border-radius: 21px; border-radius: 21px; } .btn-orange-outlined-flex { line-height: 38px; } } /*---------------------------------------- Demographic */ .t-container { padding: 8px; background: rgba(255, 255, 255, 0.85); z-index: 9998; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; } .demographics-charts hr { margin: 40px 0; border: 0; border-top: 1px solid #e0e0e0; } .demographics-charts h5 { font: 24px/35px 'Open Sans', sans-serif; font-weight: 300; color: #666666; margin-bottom: 30px; } .demographics-charts #map-container { width: 100%; margin-top: 50px; float: left; } .demographics-charts #map-container #map { width: 100%; height: 510px; } .demographics-charts #map-container #map .labels { color: white; font-family: 'MuseoSans', Helvetica, Arial, sans-serif; font-size: 10px; text-align: center; white-space: nowrap; width: 31px; } .demographics-charts .top-charts .top-chart-base { width: 100%; height: 300px; z-index: 1; position: relative; } .demographics-charts .top-charts .top-chart-base:before { content: ''; position: absolute; width: 16px; height: 16px; top: calc(50% - 8px); left: calc(50% - 10px); background: #dadada; -moz-animation: grow 400ms cubic-bezier(0.37, 0.74, 0.15, 1) 0ms infinite alternate; -webkit-animation: grow 400ms cubic-bezier(0.37, 0.74, 0.15, 1) 0ms infinite alternate; animation: grow 400ms cubic-bezier(0.37, 0.74, 0.15, 1) 0ms infinite alternate; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; -moz-transform: scale(0); -ms-transform: scale(0); -webkit-transform: scale(0); transform: scale(0); z-index: -1; } .demographics-charts .top-charts .top-chart-base:after { content: ''; position: absolute; width: 16px; height: 16px; top: calc(50% - 8px); left: calc(50% + 10px); background: #dadada; -moz-animation: grow 400ms cubic-bezier(0.37, 0.74, 0.15, 1) 100ms infinite alternate; -webkit-animation: grow 400ms cubic-bezier(0.37, 0.74, 0.15, 1) 100ms infinite alternate; animation: grow 400ms cubic-bezier(0.37, 0.74, 0.15, 1) 100ms infinite alternate; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; -moz-transform: scale(0); -ms-transform: scale(0); -webkit-transform: scale(0); transform: scale(0); z-index: -1; } .demographics-charts .pie-charts h5 { text-align: center; } .demographics-charts .pie-charts .pie-chart-base { width: 100%; height: 310px; } .demographics-charts .pie-charts .pie-chart-base:before { content: ''; position: absolute; width: 16px; height: 16px; top: calc(50% - 8px); left: calc(50% - 10px); background: #dadada; -moz-animation: grow 400ms cubic-bezier(0.37, 0.74, 0.15, 1) 0ms infinite alternate; -webkit-animation: grow 400ms cubic-bezier(0.37, 0.74, 0.15, 1) 0ms infinite alternate; animation: grow 400ms cubic-bezier(0.37, 0.74, 0.15, 1) 0ms infinite alternate; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; -moz-transform: scale(0); -ms-transform: scale(0); -webkit-transform: scale(0); transform: scale(0); z-index: -1; } .demographics-charts .pie-charts .pie-chart-base:after { content: ''; position: absolute; width: 16px; height: 16px; top: calc(50% - 8px); left: calc(50% + 10px); background: #dadada; -moz-animation: grow 400ms cubic-bezier(0.37, 0.74, 0.15, 1) 100ms infinite alternate; -webkit-animation: grow 400ms cubic-bezier(0.37, 0.74, 0.15, 1) 100ms infinite alternate; animation: grow 400ms cubic-bezier(0.37, 0.74, 0.15, 1) 100ms infinite alternate; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; -moz-transform: scale(0); -ms-transform: scale(0); -webkit-transform: scale(0); transform: scale(0); z-index: -1; } .demographics-charts .doublebar-chart h5 { text-align: center; } .demographics-charts .doublebar-chart .doublebar-chart-base { width: 100%; height: 400px; } .demographics-charts .doublebar-chart .doublebar-chart-base:before { content: ''; position: absolute; width: 16px; height: 16px; top: calc(50% - 8px); left: calc(50% - 10px); background: #dadada; -moz-animation: grow 400ms cubic-bezier(0.37, 0.74, 0.15, 1) 0ms infinite alternate; -webkit-animation: grow 400ms cubic-bezier(0.37, 0.74, 0.15, 1) 0ms infinite alternate; animation: grow 400ms cubic-bezier(0.37, 0.74, 0.15, 1) 0ms infinite alternate; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; -moz-transform: scale(0); -ms-transform: scale(0); -webkit-transform: scale(0); transform: scale(0); z-index: -1; } .demographics-charts .doublebar-chart .doublebar-chart-base:after { content: ''; position: absolute; width: 16px; height: 16px; top: calc(50% - 8px); left: calc(50% + 10px); background: #dadada; -moz-animation: grow 400ms cubic-bezier(0.37, 0.74, 0.15, 1) 100ms infinite alternate; -webkit-animation: grow 400ms cubic-bezier(0.37, 0.74, 0.15, 1) 100ms infinite alternate; animation: grow 400ms cubic-bezier(0.37, 0.74, 0.15, 1) 100ms infinite alternate; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; -moz-transform: scale(0); -ms-transform: scale(0); -webkit-transform: scale(0); transform: scale(0); z-index: -1; } /*---------------------------------------- other*/ @-moz-keyframes grow { 0% { -moz-transform: scale(0); transform: scale(0); } 100% { -moz-transform: scale(1); transform: scale(1); } } @-webkit-keyframes grow { 0% { -webkit-transform: scale(0); transform: scale(0); } 100% { -webkit-transform: scale(1); transform: scale(1); } } @keyframes grow { 0% { -moz-transform: scale(0); -ms-transform: scale(0); -webkit-transform: scale(0); transform: scale(0); } 100% { -moz-transform: scale(1); -ms-transform: scale(1); -webkit-transform: scale(1); transform: scale(1); } } .spinner-container { position: relative; width: 100%; z-index: -1; } .spinner-container .spin { width: 60px; height: 16px; position: absolute; top: 70px; left: calc(50% - 31px); } .spinner-container .spin span { position: absolute; width: 16px; height: 16px; float: left; background: #dadada; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; -moz-transform: scale(0); -ms-transform: scale(0); -webkit-transform: scale(0); transform: scale(0); } .spinner-container .spin span:nth-child(1) { left: 0; -moz-animation: grow 400ms cubic-bezier(0.37, 0.74, 0.15, 1) 0ms infinite alternate; -webkit-animation: grow 400ms cubic-bezier(0.37, 0.74, 0.15, 1) 0ms infinite alternate; animation: grow 400ms cubic-bezier(0.37, 0.74, 0.15, 1) 0ms infinite alternate; } .spinner-container .spin span:nth-child(2) { left: 22px; -moz-animation: grow 400ms cubic-bezier(0.37, 0.74, 0.15, 1) 100ms infinite alternate; -webkit-animation: grow 400ms cubic-bezier(0.37, 0.74, 0.15, 1) 100ms infinite alternate; animation: grow 400ms cubic-bezier(0.37, 0.74, 0.15, 1) 100ms infinite alternate; } .spinner-container .spin span:nth-child(3) { left: 44px; -moz-animation: grow 400ms cubic-bezier(0.37, 0.74, 0.15, 1) 200ms infinite alternate; -webkit-animation: grow 400ms cubic-bezier(0.37, 0.74, 0.15, 1) 200ms infinite alternate; animation: grow 400ms cubic-bezier(0.37, 0.74, 0.15, 1) 200ms infinite alternate; } .error-module { background: #F5E8E8; float: left; padding: 20px 0; width: 100%; text-align: left; position: relative; margin-top: 46px; z-index: 1; } .error-module:before, .error-module:after { background: #F5E8E8; content: ''; position: absolute; width: 50px; height: 100%; top: 0; } .error-module:before { left: -50px; } .error-module:after { right: -50px; } .error-module p { font-size: 13px; line-height: 18px; color: #d40028; background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAsAAAALCAMAAACecocUAAAAWlBMVEXUACjUACjUACjUACjUACjUACjUACjUACjUACjUACjUACjUACjUACjUACjTACXSAB3UACfUACjUACjSAB3TACTUACbUACfUACjVCC/WCjHWDDPXFDnXFTr///9BCO+3AAAAE3RSTlMAFxsiIyZog4yTnaPp6uzv7+/zI8NNHgAAAFJJREFUCB0FwYEBwyAMBLHzYz+B/ZdtG3ClAeDNAQSEtwMQ4P1uAwmaOWL+LgLPzp4GkSuajjUQ5Zvktcla0EewXlVBZEBVPkgHivvkp6E7Ar5/H/gU8y5EMrsAAAAASUVORK5CYII=) no-repeat 0 3px; padding: 0 0 0 20px; min-height: 11px; } .error-module p a { font-weight: 700; -moz-transition: all 100ms ease-in-out; -o-transition: all 100ms ease-in-out; -webkit-transition: all 100ms ease-in-out; transition: all 100ms ease-in-out; cursor: pointer; text-decoration: none; color: #d40028; } .error-module p a:hover { color: black; } .no-content { padding: 20px 0; } .no-content a { font-weight: 600; -moz-transition: all 100ms ease-in-out; -o-transition: all 100ms ease-in-out; -webkit-transition: all 100ms ease-in-out; transition: all 100ms ease-in-out; cursor: pointer; text-decoration: none; color: #f29400; } .no-content a:hover { color: #bababa; text-decoration: none; }