/* latin-ext */
@font-face {
  font-family: 'Lato';
  font-style: italic;
  font-weight: 400;
  src: local('Lato Italic'), local('Lato-Italic'), url(https://fonts.gstatic.com/s/lato/v15/S6u8w4BMUTPHjxsAUi-qNiXg7eU0.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Lato';
  font-style: italic;
  font-weight: 400;
  src: local('Lato Italic'), local('Lato-Italic'), url(https://fonts.gstatic.com/s/lato/v15/S6u8w4BMUTPHjxsAXC-qNiXg7Q.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Lato';
  font-style: italic;
  font-weight: 700;
  src: local('Lato Bold Italic'), local('Lato-BoldItalic'), url(https://fonts.gstatic.com/s/lato/v15/S6u_w4BMUTPHjxsI5wq_FQftx9897sxZ.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Lato';
  font-style: italic;
  font-weight: 700;
  src: local('Lato Bold Italic'), local('Lato-BoldItalic'), url(https://fonts.gstatic.com/s/lato/v15/S6u_w4BMUTPHjxsI5wq_Gwftx9897g.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  src: local('Lato Regular'), local('Lato-Regular'), url(https://fonts.gstatic.com/s/lato/v15/S6uyw4BMUTPHjxAwXiWtFCfQ7A.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  src: local('Lato Regular'), local('Lato-Regular'), url(https://fonts.gstatic.com/s/lato/v15/S6uyw4BMUTPHjx4wXiWtFCc.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 700;
  src: local('Lato Bold'), local('Lato-Bold'), url(https://fonts.gstatic.com/s/lato/v15/S6u9w4BMUTPHh6UVSwaPGQ3q5d0N7w.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 700;
  src: local('Lato Bold'), local('Lato-Bold'), url(https://fonts.gstatic.com/s/lato/v15/S6u9w4BMUTPHh6UVSwiPGQ3q5d0.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

a {
  color: #1772d0;
  text-decoration: none;
}

a:focus,
a:hover {
  color: #f09228;
  text-decoration: none;
}

body,
td,
th,
tr,
p,
a {
  font-family: 'Lato', Verdana, Helvetica, sans-serif;
  font-size: 14px
}

strong {
  font-family: 'Lato', Verdana, Helvetica, sans-serif;
  font-size: 14px;
}

heading {
  font-family: 'Lato', Verdana, Helvetica, sans-serif;
  font-size: 22px;
}

papertitle {
  font-family: 'Lato', Verdana, Helvetica, sans-serif;
  font-size: 14px;
  font-weight: 700
}

name {
  font-family: 'Lato', Verdana, Helvetica, sans-serif;
  font-size: 32px;
}

.one {
  width: 160px;
  height: 160px;
  position: relative;
}

.two {
  width: 160px;
  height: 160px;
  position: absolute;
  transition: opacity .2s ease-in-out;
  -moz-transition: opacity .2s ease-in-out;
  -webkit-transition: opacity .2s ease-in-out;
}

.fade {
  transition: opacity .2s ease-in-out;
  -moz-transition: opacity .2s ease-in-out;
  -webkit-transition: opacity .2s ease-in-out;
}

span.highlight {
  background-color: #ffffd0;
}

.CodeMirror {
    font-size: .8em;
    height: auto;
}

.CodeMirror-scroll {
    overflow-y: hidden;
    overflow-x: auto;
}

#header_img {
    margin-top: 2em;
    margin-bottom: 1em;
}

.list-inline {
	list-style: none;
	margin-left: -0.5em;
	margin-right: -0.5em;
	padding-left: 0;
}

.list-inline > li {
	display: inline-block;
	margin-left: 0.5em;
	margin-right: 0.5em;
}

.compare {
  margin : auto ;
  position : relative ;
  margin-top : 20px ;
  padding : 5px ;
  border : 1px solid #adadad ;
  border-radius : 3px ;
}

.compare .compared {
  visibility : hidden ;
  position : absolute ;
}

.compare-settings {
  display : flex ;
  align-items : center ;
  justify-content : space-between ;
}

.compare-setting {
  /*background-color : #494949 ;*/
  padding : 5px ;
  border : 1px solid #adadad ;
  border-radius : 5px ;
  display : flex ;
  align-items : center ;
}

.range-container {
  display : flex ;
  align-items : center ;
  border : 1px solid #0099cc ;
  border-radius : 5px ;
  box-shadow: 0 0 1px 0 #0099cc inset ;
  margin-left : 5px ;
  margin-right : 5px ;
  position : relative ;
}

.compare-setting label {
  font-family : 'Sans-serif' ;
}

.compare-setting input[type="range"] {
  background-color : #fff ;
  border : 1px solid #00f ;
}

.play {
  box-sizing : border-box ;
  height : 1em ;
  width : 1em ;
  
  border-color : transparent transparent transparent #202020 ;
  transition : 100ms all ease ;
  will-change : border-width ;
  cursor : pointer ;

  border-style : solid ;
  border-width : 0.5em 0em 0.5em 1em ;
}

.pause {
  box-sizing : border-box ;
  height : 1em ;
  width : 1em ;
  
  border-color : transparent transparent transparent #202020 ;
  transition : 100ms all ease ;
  will-change : border-width ;
  cursor : pointer ;

  border-style : double ;
  border-width : 0em 0em 0em 1em ;
}

#gallerywrapper {
     width:640px;
     height:600px;
     margin:0 auto;
     position:relative;
     font-family:verdana, arial, sans-serif;
 } 

 #gallerywrapper #gallery {
     position:relative;
     left:0;
     top:0;
     height:630px;
     width:640px;
     overflow:hidden;
     text-align:center;
 } 

 #gallerywrapper #gallery div {
     width:640px; height:630px; 
     padding-top:10px; 
     position:relative;
 } 

 #gallerywrapper #gallery div video {
     clear:both; 
     display:block; 
     margin:0 auto; 
     border:0;
 } 

 #gallerywrapper #gallery div h3 {
     padding:10px 0 0 0; 
     margin:0; 
     font-size:18px;
 } 

 #gallerywrapper #gallery div p {
     padding:5px 0; 
     margin:0; 
     font-size:12px; 
     line-height:18px;
 }

#gallery .previous {
    display: inline;
    float: center;
    margin-left: 80px;
    text-decoration: none;
    background-color: #04AA6D;
    color: white;
    padding: 8px 16px;
}

#gallery .next {
    display: inline;
    float: center;
    margin-right: 80px;
    text-decoration: none;
    background-color: #04AA6D;
    color: white;
    padding: 8px 16px;
}

#gallery a:hover {
    background-color: #ddd;
    color: black;
}