/* This is a CSS template for a CS project page.
   For academic purposes, this file may be considered to be in public
   domain. So, feel free to reuse.

   Author: Srinath Sridhar (srinaths@umich.edu, srinathsridhar.com)
   Last updated: 2019-Jan for Stanford colors and font
   https://identity.stanford.edu/web-toolkit/
*/

/* Main page */
html, body
{
    margin:10px 0px;
    padding:0px;
    text-align:center;
    /* background-color: hsl(0, 0%, 91%); */
    background-color: white;
}

/* Global settings for hyperlinks and hr */
a:link { color: #990000; text-decoration: none; }
a:visited { color: #990000; text-decoration: none; }
a:hover { color: #011F5B; text-decoration: none; }
a:active { color: #4071c5; text-decoration: none; }
hr.smooth
{
    border: 0;
    height: 1px;
    width: 100%;
    background: #333;
    background-image: -webkit-linear-gradient(left, #ccc, #333, #ccc); 
    background-image:    -moz-linear-gradient(left, #ccc, #333, #ccc); 
    background-image:     -ms-linear-gradient(left, #ccc, #333, #ccc); 
    background-image:      -o-linear-gradient(left, #ccc, #333, #ccc); 
}

/* Main content div */
#content 
{
    width:auto;
    max-width:1000px;
    min-width:20px;
    height: auto !important;
    height: 100%;
    /*min-height: 100%;*/
    margin:0 auto;
    text-align:justify;
    border:10px solid #011F5B;
    background-color: white;
    font-family: "Arial";
    font-size: 11pt;
    /* line-height: 2; */
    -webkit-text-size-adjust: none;
    -webkit-font-smoothing: antialiased;
}
#content-inner
{
    padding: 30px 4em;
}

/* For paragraphs */
.publist {width: 900px; margin: 0; margin-top: 10px; margin-bottom: 10px; border: 1px solid #8a887d; padding: 5px; background-color: #f6f3e5;}

/* Tabs control */
/* 1000, 800 . Change below to adjust for main page width*/
div.tabContent { width: 960px; margin: 0 auto; border: 1px solid #8a887d; padding: 0.5em; background-color: #f2f1eb; }
div.tabContent.hide { display: none; }
ul#tabs { list-style-type: none; margin: 30px 0 0 11px; padding: 0 0 0.3em 0; }
ul#tabs li { display: inline; }
ul#tabs li a { color: #42454a; background-color: #e3dfd5; border: 1px solid #8a887d; border-bottom: none; padding: 0.3em; text-decoration: none; }
ul#tabs li a:hover { background-color: #d5d0c0; }
ul#tabs li a.selected { color: #000; background-color: #f2f1eb; font-weight: 500; padding: 0.7em 0.3em 0.38em 0.3em; }

/* Page sections */
/* Some of this has been copied from http://www.mpi-inf.mpg.de/resources/rgbz-camera/ */
.section
{
	margin: 35px 5px 5px 10px;
	line-height: 150%;
	-webkit-font-smoothing: antialiased; 
}

h2 { color: #990000; margin: 0 -1em .5em; }
h3 { font-size: 14pt; color: #011F5B; margin: 1em 0 .3em 0; }

ul { padding: 0; margin-left: 5pt; }

/* Logo section. */
.logos { margin: 1.5em 0; text-align: center; margin-top:0px; margin-bottom:0px; background-color: #cccccc;}
.logos img { vertical-align:top; margin: 10px 1.25em 10px; border:0; }

/* Page header. */
.head { text-align: center; margin: .5em 2em 0 2em; padding: 0.5em 2em; }
.head { color: #333333; }
.head h1
{
    font-family: 'Trebuchet MS'; font-weight: normal;
    font-size: 28pt; line-height:27pt; margin: 1em 0 0 0;
}
.head h1 a { text-decoration:none; }
.head h2
{
    font-family: "Verdana"; font-weight: 800;
    font-size: 18pt; margin: .8em 0 1.5em 0; color: #333333;
}
.authors { font-size: 12pt; margin: 0 0 1em 0; }
.affiliations { font-size: 10pt; margin: -1.5em 0 -1em 0; }
.venue { font-style:bold; font-size: 14pt; margin: 1em 0 1em 0; font-weight: 800 }

/* Page footer */
.footer { margin: 15px 5px 5px 10px; line-height: 130%; /*margin-left:auto; margin-right:auto;*/ }

/* Specific section styling. */
.teaser { margin: 1.5em 0; text-align: center; }
div.content-primary .teaser p img { display: block; float: none; border: 0; margin: 4em auto 1em auto; }
.abstract { line-height: 130%; }
.abstract p { margin-top: 0; }
.downloads ul { margin-top: 0.5em; }
.bibtex pre
{
    margin-top: -1.5em;
    margin-bottom: 0;
    font-family: Consolas, Monaco, monospace;
    font-size: 10pt;
    white-space: pre-wrap; /* CSS 3 */
    white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
    white-space: -pre-wrap; /* Opera 4-6 */
    white-space: -o-pre-wrap; /* Opera 7 */
    word-wrap: break-word; /* IE 5.5+ */
    width: 80%;
    color: #444;
    padding: 15px;
    background: #eee;
    border: 1px solid #ccc;
    overflow: auto;
    text-align: left;
}
.acknowledgments { line-height: 130%; }
.acknowledgments p { margin-top: 0; }
.contact { line-height: 130%; }

.intro ul { padding: 0; margin-left: 3em; }

.heading { margin: 2.5em 0; text-align: center; }
.datasets { width: 650px; margin: 3em auto; }
.datasets ul { padding-bottom: 1em; }
.dataset { float: left; width: 204px; margin: 5px 10px 15px 0px; text-align: center; }
.dataset h2 { display: inline; }
.dataset img { border: 2px solid #222; margin: 0.25em auto; display: block; }
.backlink { text-align: center; }

/* For displaying projects with a thumbnail image on the left and description on the right */
/* Display lists in a grid of fixed size. This is useful when lists have associated images. */
/* Idea from http://blog.mozilla.org/webdev/2009/02/20/cross-browser-inline-block/ */
li.pgrid
{
    width: auto;
    height: 150px;
    /* border: 1px solid #000; */
    display: -moz-inline-stack;
    display: inline-block;
    vertical-align: top;
    margin: 0;
    zoom: 1;
    *display: inline;
    _height: 100px;
}
/* Formatting for each item in a 2D grid. This is used typically in the downloads section. */
.pgriditem
{
    font-size: 10pt;
    font-weight: bold;
    text-align: center;
    padding: 3px 3px 3px 3px;
}
.pgriditem img
{
    text-align: center;
    height:120px;
    width:auto;
    border: 5px solid #eee;
}
#teaseimg
{
    height:auto;
    width:50%;
    box-shadow: 0px 0px 10px #444444;
    border:1px solid #000000;
}

/* Display lists in a grid of fixed size. This is useful when lists have associated images. */
/* Idea from http://blog.mozilla.org/webdev/2009/02/20/cross-browser-inline-block/ */
li.grid
{
    width: auto;
    height: 100px;
    /* border: 1px solid #000; */
    display: -moz-inline-stack;
    display: inline-block;
    vertical-align: top;
    margin: 20px;
    zoom: 1;
    *display: inline;
    _height: 100px;
}
/* Formatting for each item in a 2D grid. This is used typically in the downloads section. */
.griditem
{
    font-size: 11pt;
    text-align: center;
    padding: 5px 5px 5px 5px;
}
.griditem img
{
    text-align: center;
    height:40px;
    width:auto;
    border: 1px solid #eee;
    box-shadow: 0px 0px 2px #444444;
}

/* https://medium.com/swlh/how-to-render-your-3d-models-on-the-web-with-model-viewer-1c389a513855 */

/* The right grid contains the model and occupies 50% of the available space */
.model model-viewer {
    width: 100%;
    height: 320px;
	background-color: #EEE;
	border: 1px solid #000;
}


table, th, td {
    margin: 1em;
}

tbody td:nth-child(odd) {
  background-color: #CCCCCC;
}

tbody td:nth-child(even) {
  background-color: #F2F2F2;
}