@import url(http://fonts.googleapis.com/css?family=Roboto:400,300,100,700,100italic,300italic,400italic,700italic); /* Template Name: Multi Version: 1.0 Author: ShapeBootstrap Author URL: http://shapebootstrap.net */ /************************* *******Typography****** **************************/ body { padding-top: 100px; background: #fff; font-family: 'Roboto', sans-serif; font-weight: 400; color: #64686d; line-height: 26px; } h1, h2, h3, h4, h5, h6 { font-weight: 600; font-family: 'Roboto Condensed', sans-serif; color: #272727; } a { color: #F01C1E; -webkit-transition: color 400ms, background-color 400ms; -moz-transition: color 400ms, background-color 400ms; -o-transition: color 400ms, background-color 400ms; transition: color 400ms, background-color 400ms; } a:hover, a:focus { text-decoration: none; color: #F01C1E; } hr { border-top: 1px solid #e5e5e5; border-bottom: 1px solid #fff; } .gradiant { background-image: -moz-linear-gradient(90deg, #2caab3 0%, #2c8cb3 100%); background-image: -webkit-linear-gradient(90deg, #2caab3 0%, #2c8cb3 100%); background-image: -ms-linear-gradient(90deg, #2caab3 0%, #2c8cb3 100%); } .gradiant-horizontal { background-image: -moz-linear-gradient(4deg, #2caab3 0%, #2c8cb3 100%); background-image: -webkit-linear-gradient(4deg, #2caab3 0%, #2c8cb3 100%); background-image: -ms-linear-gradient(4deg, #2caab3 0%, #2c8cb3 100%); } .section-header { margin-bottom: 40px; } /*.section-header .section-title { font-size: 44px; color: #272727; text-transform: uppercase; position: relative; padding-bottom: 20px; margin: 0 0 20px; }*/ .btn { border-width: 0; border-color: #7E120F; border-radius: 3px; background-color: #F54E4E; } .btn.btn-primary { border-bottom-width: 3px; background: #F01C1E; border-radius: 5px; color: #fff; } .btn.btn-primary:hover, .btn.btn-primary:focus { border-color: #7E120F; background: #7E120F; color: #fff; } .column-title { margin-top: 0; padding-bottom: 15px; border-bottom: 1px solid #eee; margin-bottom: 15px; position: relative; } .column-title:after { content: " "; position: absolute; bottom: -1px; left: 0; width: 40%; border-bottom: 1px solid #45aed6; } ul.nostyle { list-style: none; padding: 0; margin-bottom: 20px; } ul.nostyle i { color: #45aed6; } .scaleIn { -webkit-animation-name: scaleIn; animation-name: scaleIn; } @-webkit-keyframes scaleIn { 0% { opacity: 0; -webkit-transform: scale(0); transform: scale(0); } 100% { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } } @keyframes scaleIn { 0% { opacity: 0; -webkit-transform: scale(0); -ms-transform: scale(0); transform: scale(0); } 100% { opacity: 1; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } } /* HEADER */ #header .nav-folder{ box-shadow:rgba(0,0,0,0.5) 0 5px 5px; background:#FFF; border-bottom:2px solid #E62B1E; border-top:1px solid #DDD; position:absolute; left:0; top:100px; z-index:100030; padding:15px 0; width:100px; display:none; } #header ul, li, img { margin: 0; padding: 0; border: none; } .navbar.navbar-default { border: 0; border-radius: 0; margin-bottom: 0; } .navbar.navbar-default .navbar-toggle { margin-top: 32px; } .navbar.navbar-default .navbar-brand { height: auto; padding: 22px 15px 21px; } @media only screen and (min-width: 768px) { #main-menu.navbar-default { background: rgba(255, 255, 255, 0.9); -webkit-box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.1); box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.1); } #main-menu.navbar-default .navbar-nav > li > a { padding-top: 40px; padding-bottom: 40px; } #main-menu.navbar-default .navbar-nav > li.active > a, #main-menu.navbar-default .navbar-nav > li.open > a, #main-menu.navbar-default .navbar-nav > li:hover > a { background: transparent; padding-top: 37px; border-top: 3px solid #F01C1E; } #main-menu.navbar-default .dropdown-menu { padding: 0 20px; min-width: 220px; background-color: rgba(26, 28, 40, 0.9); border: 0; border-radius: 0; box-shadow: none; -webkit-box-shadow: none; background-clip: inherit; } #main-menu.navbar-default .dropdown-menu > li { border-left: 3px solid transparent; margin-left: -20px; padding-left: 17px; -webit-transition: border-color 400ms; transition: border-color 400ms; } #main-menu.navbar-default .dropdown-menu > li > a { border-top: 1px solid #404455; padding: 15px 0; color: #eeeeee; } #main-menu.navbar-default .dropdown-menu > li:first-child > a { border-top: 0; } #main-menu.navbar-default .dropdown-menu > li.active, #main-menu.navbar-default .dropdown-menu > li.open, #main-menu.navbar-default .dropdown-menu > li:hover { border-left-color: #45aed6; } #main-menu.navbar-default .dropdown-menu > li.active > a, #main-menu.navbar-default .dropdown-menu > li.open > a, #main-menu.navbar-default .dropdown-menu > li:hover > a { color: #45aed6; background-color: transparent; } } /* HOME PAGE */ @media (max-width: 980px) { #home-page { background-attachment: fixed; background-position: top center; background-repeat: no-repeat; overflow: hidden; width: 100%; height: 100%; top: 0; left: 0; } #home-page .home-inner { position: absolute; width:100%; top: 13%; } #home-page > div{ background:#800d08 url(../images/background-2.jpg); background-position: top center; background-repeat: no-repeat; background-size:cover; width: 100%; height: 86%; top: 0; left: 0; } #home-page #intro { /* padding: 20px 0px;*/ padding: 0px;/*change 9-6 */ font-size: 2em; font-family: 'Roboto', sans-serif; text-align: left; line-height: 1.2; font-weight: 400; color: #FFF; text-shadow: 1px 1px 1px #7E120F; } #home-page #detail { /*margin-top: 0px;*/ margin-top: 0px;margin-left:auto;margin-right:auto; line-height: 1.2; font-family: 'Roboto', sans-serif; test-align: left; font-size: 16px; color:#FFF; /*text-shadow: 1px 1px 1px #7E120F;*/ padding:15px;border-radius:5px;background:rgba(00,00,00, .2); } #home-page .home-content p { margin-top: 0px; font-size: 16px; } #home-page .home-content .btn { margin-bottom: 30px; margin-left: 15%; } #home-page .home-content .btn { font-family: 'Roboto Condensed', sans-serif; font-weight: 400; line-height: 1; text-align: center; color: #fff; margin-bottom: 60px; background-color: #F54E4E; border-radius: 10px; text-shadow: 1px 1px 1px #7E120F; } #home-page .home-content .btn:hover { font-family: 'Roboto Condensed', sans-serif; font-weight: 400; margin-bottom: 60px; line-height: 1; color: #fff; background-color: #7E120F; } #home-page .home-content .btn p:nth-child(1) { font-size: 2em; font-weight: 400; margin-top: 5px; margin-bottom: 5px; text-shadow: 1px 1px 1px #7E120F; } #home-page .home-content textarea { width: 100%; margin-top: 0px; margin-bottom: 7px; padding-top: 10px; padding-right: 15px; height: 106px; font-size: .74em; font-family: 'Droid Sans Mono'; line-height: 1.5; border: none; border-radius: 5px; color: #FFF; background-color: rgba(51,51,51,0.5); } #home-page .home-content #text-files .btn { background-color: rgba(51,51,51,0.5); float: right; margin-left: 7px; margin-right: 0px; border-radius: 5px; } #home-page .home-content #text-files .btn:hover { background-color: rgba(51,51,51,1); } #home-page .threebuttons{ text-align:center; } } @media (min-width: 981px){ #home-page { background-attachment: fixed; background-position: top center; background-repeat: no-repeat; overflow: hidden; width: 100%; height:100%; top: 0; left: 0; } #home-page > div{ background:#800d08 url(../images/background-2.jpg); background-position: top center; background-repeat: no-repeat; background-size:cover; width: 100%; height: 76%; top: 0; left: 0; } #animated-number { height:24%;} #home-page .home-inner { position:relative; top: 10%; left: 0; width: 100%; height: 500px; color: #000; overflow: hidden; } #home-page #intro { padding:0 0px; font-size: 3.5em; font-family: 'Roboto', sans-serif; text-align: center; line-height: 1.2; font-weight: 400; color: #FFF; text-shadow: 1px 1px 1px #7E120F;width:90%;margin-left:auto;margin-right:auto; } #home-page #detail { line-height: 1.2; font-family: 'Roboto', sans-serif; test-align: center; font-size: 1.1em; color:#FFF; /*text-shadow: 1px 1px 1px #7E120F;*/ /*padding:20px ;border-radius:5px;background:rgba(00,00,00, .2);*/ padding:20px ;border-radius:5px;background:rgba(00,00,00, .2);width:50%; margin-left:auto;margin-right:auto; margin-bottom:3%;margin-top:2%;font-size:14px;/*change 9-6*/ } #home-page .home-content p { margin-top: 0px; font-size: 16px; } #home-page .home-content .btn { margin-bottom: 30px; position:absolute;right:6%;top:85px; } #home-page .home-content .btn { font-family: 'Roboto Condensed', sans-serif; font-weight: 400; line-height: 1; text-align: center; color: #fff; margin-bottom: 60px; background-color: #F54E4E; border-radius: 10px; text-shadow: 1px 1px 1px #7E120F; } #home-page .home-content .btn:hover { font-family: 'Roboto Condensed', sans-serif; font-weight: 400; margin-bottom: 60px; line-height: 1; color: #fff; background-color: #7E120F; } #home-page .home-content .btn p:nth-child(1) { font-size: 2em; font-weight: 400; margin-top: 5px; margin-bottom: 5px; text-shadow: 1px 1px 1px #7E120F; } #home-page .home-content textarea { margin-top: 0px; margin-bottom: 7px; padding-top: 10px; height: 106px; font-size: .805em; font-family: 'Droid Sans Mono'; line-height: 1.5; border: none; border-radius: 5px; color: #FFF; background-color: rgba(51,51,51,0.5); } #home-page .home-content #text-files { padding-right: 0; } #home-page .home-content #text-files .btn { background-color: rgba(51,51,51,0.5); float: right; margin-left: 7px; border-radius: 5px; } #home-page .home-content #text-files .btn:hover { background-color: rgba(51,51,51,1); } #home-page .threebuttons{ margin-top:60px; text-align:center; } } @media (min-width: 981px) and (min-height:900px){ #home-page > div{height:84%} #animated-number {height:16%;} } /* Homepage animated FACTS */ #animated-number { background-size: cover; background:#666; padding:15px 0; color: #fff; } #animated-number h1, #animated-number h2, #animated-number h3, #animated-number h4 { color: #fff; } #animated-number strong { font-family: 'Roboto Condensed', sans-serif; font-size: 1em; display: block; } .animated-number { display: inline-block; width: 70px; height: 70px; font-size: 1.3em; font-weight: 700; line-height:70px; border: 2px solid #fff; border-radius: 100px; margin-bottom: 10px; } @media (min-width:768px) and (max-width:980px){ #home-page > div{height:84%;} #animated-number { height:16%;} #home-page #detail { margin-bottom:5%;margin-top:5%;width:70%;} } @media (max-width: 767px) { body,html{height:auto; overflow:auto;} #home-page > div{height:75%;} #animated-number { height:25%;} #home-page #intro { font-size:2.5em; } #home-page #detail { margin-bottom:5%;margin-top:5%;} } @media (max-width: 360px) { #home-page .home-inner { margin-top:35px; } #home-page #intro { font-size: 2em;} #home-page .threebuttons a{font-size:14px;padding:6px;} #animated-number strong { font-size:.8em; line-height:20px;} .animated-number { width: 50px; height: 50px; font-size: 1.1em; line-height:50px; margin-bottom: 5px; } } @media (max-width: 320px) { #home-page > div{height:70%;} #animated-number { height:30%;} #home-page .home-inner { margin-top:20%; } #home-page #detail {display:none;} #home-page .threebuttons{margin-top:20px;} } /* @media (min-width: 1280px){ #home-page .home-inner {padding:6.8% 0;}} @media (min-width: 1920px){ #home-page {height:970px;} #home-page .home-inner {padding:8.8% 0;}}*/ .area{margin-left:25px;margin-right:25px;} /* EXPLORE */ #explore { padding: 150px 0; background: url(../images/background-3.jpg); background-attachment: fixed; background-position: top center; background-repeat: repeat; /*changed for reset the proportion 8-30-11:30*/ height:100%; } #video { height: 180px; border: 1px solid #fff; border-radius: 3px; background-color: #FCD2D2; } #filter { height: 540px; border-radius: 3px; } #explore .btn { margin-bottom: 4px; } #explore .btn:hover { background-color: #CCC; } #panel { background-color: #FCD2D2; } .pager li>a { padding: 10px 12px; border: none; } #paginationdiv .btn { width: 40px; height: 40px; color: #FFF; background-color: #999999; margin-left: 7px; border-radius: 5px; } #paginationdiv .btn:hover { width: 40px; height: 40px; color: #FFF; background-color: #333333; margin-left: 7px; border-radius: 5px; } /* PAPERS */ @media (max-width: 980px) { #papers { color: #7E120F; padding: 50px 0 50px; background: url(../images/background-3.jpg); background-attachment: fixed; background-position: top center; background-repeat: repeat; } #papers .animated-number { display: inline-block; width: 140px; height: 140px; color: #FFF; font-size: 36px; font-weight: 700; text-align: center; line-height: 140px; border: none; border-radius: 100px; margin-bottom: 20px; } .media.service-box { margin: 25px 0 25px 0; } .media.service-box .btn { color: #FFF; background-color: #F54E4E; } .media.service-box .btn:hover { color: #FFF; background-color: #7E120F; } .media.service-box .pull-left { margin-right: 20px; } .media.service-box .pull-left > i { font-size: 24px; height: 64px; line-height: 64px; text-align: center; width: 64px; border-radius: 100%; color: #7E120F; box-shadow: inset 0 0 0 3px #7E120F; transition: background-color 400ms, background-color 400ms; position: relative; } #citation { background: none; background-size: cover; color: #fff; z-index: -1000; } #citation strong { width: 140px; font-family: 'Roboto Condensed', sans-serif; font-size: 1.5em; color: #7E120F; text-align: center; text-transform: uppercase; display: block; margin-bottom: 30px; } } @media (min-width: 981px) { #papers { color: #7E120F; padding: 50px 0 50px; background: url(../images/background-3.jpg); background-attachment: fixed; background-position: top center; background-repeat: repeat; background-size: 100%; } .media.service-box { margin: 25px 0 25px 0; } .media.service-box .btn { color: #FFF; background-color: #F54E4E; } .media.service-box .btn:hover { color: #FFF; background-color: #7E120F; } .media.service-box .pull-left { margin-right: 20px; } .media.service-box .pull-left > i { font-size: 24px; height: 64px; line-height: 64px; text-align: center; width: 64px; border-radius: 100%; color: #7E120F; box-shadow: inset 0 0 0 3px #7E120F; transition: background-color 400ms, background-color 400ms; position: relative; } #papers .animated-number { display: inline-block; width: 140px; height: 140px; color: #FFF; background-color: #7E120F; font-size: 36px; font-weight: 700; text-align: center; line-height: 140px; border: none; border-radius: 100px; margin-bottom: 20px; } #citation { background: none; background-size: cover; color: #fff; z-index: -1000; } #citation strong { width: 140px; font-family: 'Roboto Condensed', sans-serif; font-size: 1.5em; color: #7E120F; text-align: center; text-transform: uppercase; display: block; margin-bottom: 30px; } } /* ABOUT */ #about { color: #666666; padding: 0; background: url(../images/background-3.jpg); background-attachment: fixed; background-position: top center; background-repeat: repeat; height:100%; } #about .pull-left i { font-size: .9em; height: 64px; line-height: 40px; text-align: center; width: 64px; border-radius: 100%; color: #666666; transition: background-color 400ms, background-color 400ms; position: relative; } #about .container{ padding-bottom:100px; } #about .made li{ list-style: none; margin: 0; padding: 0; border: none; } #papers .tools-paper-container{ margin-top:300px; } .media-body { margin-bottom: 10px; margin-top:10px; } .media-body img { width: 130px; height: 130px; } #made img { border-radius: 5px; padding: 10px 0 30px 0; } /* PEOPLE PAGE */ #people-page{ color: #666666; padding: 0; background: url(../images/background-3.jpg); background-attachment: fixed; background-position: top center; background-repeat: repeat; height:100%; } /* DOWNLOAD PAGE */ #download { color: #666666; padding: 0; background: url(../images/background-3.jpg); background-attachment: fixed; background-position: top center; background-repeat: repeat; } #download .section-title i{ border-radius: 100%; text-align:center; font-size:20px; color:#F01C1E ;margin-right:10px; box-shadow: 0px 0px 0px 3px #F01C1E inset; height:50px; line-height:50px; width:50px; } #download .pull-left i { font-size: .9em; height: 64px; line-height: 40px; text-align: center; width: 64px; border-radius: 100%; color: #666666; transition: background-color 400ms, background-color 400ms; position: relative; } #download .section-header-version { margin-top:40px; } .download{ line-height:70px; margin-left:2px; } .download a{ color:#FFFFFF; font-size:1.1em; } .download a:hover{ color:#fff; background:#701616; padding:5px 10px; } #api{ color: #666666; padding: 0; /*padding: 100px 0;*/ background: url(../images/background-3.jpg); background-attachment: fixed; background-position: top center; background-repeat: repeat; } #api .section-header-api{ margin-top: 400px; } /* GET IN TOUCH */ #get-in-touch { padding: 100px 0 50px; background-color: #7E120F; color: #fff; text-align: center; } #get-in-touch h1, #get-in-touch h2 { color: #fff; font-family: 'Roboto Condensed', sans-serif; } #get-in-touch i { font-size: 36px; height: 94px; line-height: 92px; text-align: center; width: 94px; border-radius: 100%; color: #666666; background-color: #FFF; box-shadow: none; transition: background-color 400ms, background-color 400ms; position: relative; } #get-in-touch a { font-size: 1.2em; margin-top: 30px; padding: 10px 20px; background-color: #F54E4E; } #get-in-touch a:hover { margin-top: 30px; background-color: #7E120F; } /* FOOTER */ #footer { padding-top: 30px; padding-bottom: 30px; font-family: 'Roboto Condensed', sans-serif; color: #fff; background: #2e2e2e; } #footer a { color: #fff; } #footer a:hover { color: #45aed6; } #footer ul { list-style: none; padding: 0; margin: 0 -7.5px; } #footer ul > li { display: inline-block; margin: 0 7.5px; } .form-control { box-shadow: none; -webkit-box-shadow: none; } /*join-convention--DL*/ .join-convention{line-height:70px;margin-left:2px;} .join-convention a{color:#FFFFFF;font-size:1.1em; } .join-convention a:hover{ color:#fff; background:#701616;padding:5px 10px;} .bibtex{line-height:70px;margin-left:2px;} .bibtex a{color:#FFFFFF;font-size:1.1em; } .bibtex a:hover{ color:#fff; background:#701616;padding:5px 10px;} .interact-links a{ text-align: center; float: left; width: 36px; height: 36px; border:2px solid #909090; border-radius: 100%; margin-right: 7px; /*space between*/ display: inline-block; } .interact-links a i{ font-size: 20px; line-height: 38px; color: #909090; }