@charset "UTF-8";
/* CSS Document */

p { text-align: justify;}

#license {
	display: flex;
	flex-direction: column;
	justify-content: center;
}

#license > div {
  text-align: center;
  line-height: 2em;
  font-size: 10px;
  margin-bottom: -10%;
}

#Kirillov-Kostant-Souriau {
	position:relative;
	height:310px;
	width: 100%;
}
#Kirillov {
	position:absolute;
	background-image: url(../images/kirillov.png);
	background-repeat: no-repeat;
	width:247px;
	height:271px;
	margin-top:30px;
	margin-left:10%;
}
#Kostant {
	position:absolute;
	background-image: url(../images/kostant.png);
	background-repeat: no-repeat;
	width:248px;
	height:268px;
	margin-top:12px;
	margin-left:36%;
}
#Souriau {
	position:absolute;
	background-image: url(../images/souriau.png);
	background-repeat: no-repeat;
	width:277px;
	height:291px;
	margin-top:40px;
	margin-left:60%;
}

#ref-sds {
	position:relative;
	height:300px;
	width:90%;
	margin-top:20px;
	background-color: black;

}
#sds-cover {
	position:absolute;
	float:left;
}
#sds-description {
	float:right;
	width:65%;
	margin-top:20px;
	padding: 40 10 10 20;
}

.align-left {
	text-align: left;
}

#cell {padding:10px;}
#box {padding:20px;}

.text-red {color: #FF0000;}
.text-lightpink {color: #d1bdbc;}
.text-pink {color: #d1827d;}
.text-orange {color: #f3a83b;}
.text-lightyellow {color: #d1c27d;}
.text-yellow {color: #d1c27d;}
.text-lightgreen {color: #bcd1c3;}
.text-green {color: #7dd199;}
.text-lightblue {color: #bcc7d1;}
.text-blue {color: #7da9d1;}
.text-brightblue {color: #04c4fc;}
.text-purple {color: #8d36ba;}
.text-lightgray {color: lightgray;}
	
.white {background-color: #fff;}
.black {background-color: #000;}
.lightgreen {background-color: #edf5ed;}
.lightorange {background-color: #fff7eb;}
.lightpurple {background-color: #f1e9f7;}	
.lightred {background-color: #f5eded;}
.lightblue {background-color: #edf1f5;}
.lightgray {background-color: lightgray;}

.alpha-100 {opacity: 1; filter:alpha(opacity=100)}
.alpha-90 {opacity: 0.9; filter:alpha(opacity=90)}
.alpha-80 {opacity: 0.8; filter:alpha(opacity=80)}
.alpha-70 {opacity: 0.7; filter:alpha(opacity=70)}
.alpha-60 {opacity: 0.6; filter:alpha(opacity=60)}
.alpha-50 {opacity: 0.5; filter:alpha(opacity=50)}
.alpha-40 {opacity: 0.4; filter:alpha(opacity=40)}
.alpha-30 {opacity: 0.3; filter:alpha(opacity=30)}
.alpha-20 {opacity: 0.2; filter:alpha(opacity=20)}
.alpha-10 {opacity: 0.1; filter:alpha(opacity=10)}
.alpha-0 {opacity: 0; filter:alpha(opacity=0)}

/* Default: almost opaque background */
.frosted-glass {
  background: rgba(0, 0, 0, 0.9); 
}
/* or if backdrop support: more translucent and blurred */
@supports ((-webkit-backdrop-filter: blur(1em)) or (backdrop-filter: blur(1em))) {
  .frosted-glass {
    background-color: rgba(0, 0, 0, 0.7);
    -webkit-backdrop-filter: blur(1em);
    backdrop-filter: blur(1em);
  }
}

.green-txt {color: #007f00;}
.orange-txt {color: #f3a83b;}
.purple-txt {color: purple;}
.red-txt {color: #de3131;}
.blue-txt {color: #000e85;}

.green-bg {background: #007f00;}
.orange-bg {background: #f3a83b;}
.purple-bg {background: purple;}
.red-bg {background: #de3131;}
.blue-bg {background: #000d80;}
.bluegreen-bg {background: #006a80;}
.black-bg {background: #000000;}
.yellow-bg {background: #ccad2f;}

.lightgreen-bg {background: #edf5ed;}
.lightorange-bg {background: #fff7eb;}
.lightpurple-bg {background: #f1e9f7;}	
.lightred-bg {background: #f5eded;}
.lightblue-bg {background: #edf1f5;}

.disc-ref{
    margin: -3px 4px 0px -5px;
    width: 22px;
	height: 22px;
	border-radius:100px;
    text-align:center;
	border: 2px solid #fff;
	font-family: Arial, "Helvetica Neue", Helvetica, Gotham, "sans-serif";
    font-size: 11px;
    vertical-align: super;
	font-weight: bold;
    line-height: 18px; /* 100 - 10 */
	color: white;
}
a.disc-ref:hover {
	background: white;
	pointer: auto;
	color: black !important;
}
a.disc-ref {
	pointer: auto;
	color: white !important;
}
.bottom-ref {
	margin-left: -50px;
	margin-right: 25px;
}



.center-div {
	margin: 0 auto;
	width: 100px; 
}

#container-line {
	display: flex; 
	flex-direction: row;
	width: 1034px;
	height: 274px;
	white-space: nowrap;
	padding: 0;
	margin: 40px 0 40px; 0;
	/*border: 1px solid red;*/
}

#gravity-line {
	position:relative;
	margin: 0 auto;
    right:450px;
    bottom: 336px;
	width: 644px;
	height: 274px;
	padding-bottom: 0px;
		margin-bottom: -350px;
}

#logo {
	margin: 0 auto;
	width: 520px;
    height: 336px;
	padding-left: 130px;
	padding-bottom: 0px;

}

.ancre {
  position: relative;
  height: 10px;
}
.ancre .ancre_gap {
  position: absolute;
  left: 0px;
  top: -100px;
  height: 1px;
}



header {
	padding-top: 100px !important;
}

@media (max-width: 414px) { /* smartphones portrait */
	#container-line { margin-left: -520px;}
}
@viewport {
	max-width: 414px;
	zoom: 0.1;
}
	
@media (min-width: 415px) and (max-width: 767px) { /* smartphones landscape */
	#container-line { margin-left: -440px; }
}
	
@media (min-width: 768px) and (max-width: 991px) { /* iPad portrait: 758: Mini/9", 834: Pro 10" */
	#container-line { margin-left: -300px; }
}
@media (min-width: 992px) and (max-width: 1199px) { /* iPad landscape or iPad Pro 12" portrait */
	#container-line { margin-left: -200px; }
}
@media (min-width: 1200px) and (max-width: 1399px) {  /* computers */
	#container-line { margin-left: -250px; }
}
@media (min-width: 1400px) { /* big screen computers */
	#container-line { margin-left: -500px; }
}


.menu-container { 
	display: flex; 
	flex-direction: row;
	justify-content: center;
	margin: 60px 0 40px 0px;
}




div#logo-title {
	display: inline-flex;
	justify-content: flex-end;
	align-content: flex-end;
	width: 390px;
	height: 336px;
	max-width: 410px;
	max-height: 374px;
	margin-left: 0px;
	background-image: url("../images/the-janus-theory.png");
	background-size: contain;
	margin: 0px 0px px 0px;
}

.quote-frame {
    display: flex;
    width: 100%;
    min-height: 80px;
    background: black;
    margin-bottom: 20px;
    margin: auto auto;
    max-width: 100%;
    border: 2px white solid;
}

.quote-left {
    display: flex;
    background-position: bottom;
    min-height: 60px;
    overflow: hidden;
    float: left;
    flex: 0 0 255px;
    background: white;
    justify-content: space-between;
    flex-direction: column-reverse;
}

.quote-image {

	align-self: flex-end;
}

.quote-right {
	display: flex;
    float: left;
    min-height: 300px;
    min-width: 10%;
    max-width: 100%;
    align-content: flex-end;
    flex-direction: column;
}

.quote-text {
	display: flex;
    padding: 20px 10px 20px 10px;
    min-height: 40px;
    margin: auto;
    width: 90%;
    flex-direction: column;
    align-items: stretch;
}

span.quote-start:before {
    font-family:"Times New Roman";
    content: '“';
    float: left; 
    color: #b2b2b2; 
    font-size: 75px; 
    line-height: 20px; 
    padding-top: 10px; 
    padding-right: 8px; 
    padding-left: 3px; 
}
span.quote-end:before {
    font-family:"Times New Roman";
    content: '”';
    float: right; 
    color: #b2b2b2; 
    font-size: 75px; 
    line-height: 20px;
    padding-top: 40px;
    padding-right: 3px; 
    padding-left: 8px; 
}

p.signature, span.signature {
	font-family:"Mistral";
	font-size: 1.4em;
	color: #b2b2b2;
	text-align: center;
}

.paper-top{
	background-image: url("../images/torn-paper-top.png");	
	height: 150px;
}
.paper-middle{
	background-image: url("../images/torn-paper-middle.png");
	font-family: Times New Roman;
	font-size: 1.2em;
	line-height: 1.45em;
	color: black;
	min-height: 500px;
	padding: 0 80px 20px 80px;
}
.paper-bottom{
	background-image: url("../images/torn-paper-bottom.png");
	height: 150px;
}


      .card {
        width: 100%;
		border: none;
		margin-left: 0px;
      }
      .front, .back, .other-front, .other-back {
        padding: 0;
      }
      .front, .other-front {
        background-color: #00000000;
      }
      .back, .other-back {
        background-color: #00000000;
      }

/*
@media (max-width: 991px) {
	.card { margin: 0 0 0 0; }
}
@media (min-width: 992px) and (max-width: 1199px) {
	.card { margin: 0 0 0 260px; }
}
@media (min-width: 1200px) {
	.card { margin: 0 0 0 300px; }
}
*/

/*
nav.menu {
	width: 245px;
	height: 245px;
	margin: 40px;
	border: none;
}

.menu-button {
	width: 245px;
	height: 35px;
    background-color: pink;
    padding: 0 20px 0 0;
	margin: 0px;
	font-family: 'DIN Condensed';
	font-weight: bold;
    text-align: right;
    text-decoration: none;
    display: block;
    font-size: 24px;
	color: black;
	border-bottom: solid 1px white;
}
.menu-button:hover {
    background-color: #4CAF50; 
    color: white;
}
*/



.button {
  display: inline-block;
  border-radius: 4px;
  background-color: #305673;
  border: none;
  color: #FFFFFF;
  text-align: center;
  font-size: 24px;
  padding: 10px;
  width: 300px;
  transition: all 0.5s;
  cursor: pointer;
  margin: 5px;
  float:right;
  text-decoration: none;
	
}

.button span {
  cursor: pointer;
  display: inline-block;
  position: relative;
  transition: 0.5s;
}

.button span:after {
  content: '\00bb';
  position: absolute;
  opacity: 0;
  top: 0;
  right: -20px;
  transition: 0.5s;
}

.button:hover span {
  padding-right: 25px;
}

.button:hover span:after {
  opacity: 1;
  right: 0;
}

.videoWrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
}
.videoWrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}


.big-equation {
    font-size: 1.8em;
    text-align: center;
}

.mid-equation {
    font-size: 1.4em;
    text-align: center;
}

.small-equation {
    font-size: 1.1em;
    text-align: center;
}

.xsmall-equation {
    font-size: 0.9em;
    text-align: center;
}

.table-symmetries {
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    border-collapse: collapse;
    width: 100%;
}

.table-symmetries td, .table-symmetries th {
    padding: 8px;
  	border-right: solid 1px #0d0d0d; 
  	border-left: solid 1px #0d0d0d;
}
}

.table-symmetries tr:nth-child(even){background-color: #f2f2f2;}

.table-symmetries th {
    padding-top: 8px;
    padding-bottom: 8px;
    text-align: left;
    color: white;

.bordertop { border-top-style: solid 1px #0d0d0d !important; }
.borderright { border-top-style: solid 1px #0d0d0d !important; }
.borderbottom { border-top-style: solid 1px #0d0d0d !important; }
.borderleft { border-top-style: solid 1px #0d0d0d !important; }

.nobordertop { border-top: none 0px #0d0d0d !important; }
.noborderright { border-right: none 0px #0d0d0d !important; }
.noborderbottom { border-bottom: none 0px #0d0d0d !important; }
.noborderleft { border-left: none 0px #0d0d0d !important; }


.reinitialise {
animation : none !important;
animation-delay : 0 !important;
animation-direction : normal !important;
animation-duration : 0 !important;
animation-fill-mode : none !important;
animation-iteration-count : 1 !important;
animation-name : none !important;
animation-play-state : running !important;
animation-timing-function : ease !important;
backface-visibility : visible !important;
background : 0 !important;
background-attachment : scroll !important;
background-clip : border-box !important;
background-color : transparent !important;
background-image : none !important;
background-origin : padding-box !important;
background-position : 0 0 !important;
background-position-x : 0 !important;
background-position-y : 0 !important;
background-repeat : repeat !important;
background-size : auto auto !important;
border : 0 !important;
border-style : none !important;
border-width : medium !important;
border-color : inherit !important;
border-bottom : 0 !important;
border-bottom-color : inherit !important;
border-bottom-left-radius : 0 !important;
border-bottom-right-radius : 0 !important;
border-bottom-style : none !important;
border-bottom-width : medium !important;
border-collapse : separate !important;
border-image : none !important;
border-left : 0 !important;
border-left-color : inherit !important;
border-left-style : none !important;
border-left-width : medium !important;
border-radius : 0 !important;
border-right : 0 !important;
border-right-color : inherit !important;
border-right-style : none !important;
border-right-width : medium !important;
border-spacing : 0 !important;
border-top : 0 !important;
border-top-color : inherit !important;
border-top-left-radius : 0 !important;
border-top-right-radius : 0 !important;
border-top-style : none !important;
border-top-width : medium !important;
bottom : auto !important;
box-shadow : none !important;
box-sizing : content-box !important;
caption-side : top !important;
clear : none !important;
clip : auto !important;
color : inherit !important;
columns : auto !important;
column-count : auto !important;
column-fill : balance !important;
column-gap : normal !important;
column-rule : medium none currentColor !important;
column-rule-color : currentColor !important;
column-rule-style : none !important;
column-rule-width : none !important;
column-span : 1 !important;
column-width : auto !important;
content : normal !important;
counter-increment : none !important;
counter-reset : none !important;
cursor : auto !important;
direction : ltr !important;
display : inline !important;
empty-cells : show !important;
float : none !important;
font : normal !important;
font-family : inherit !important;
font-size : medium !important;
font-style : normal !important;
font-variant : normal !important;
font-weight : normal !important;
height : auto !important;
hyphens : none !important;
left : auto !important;
letter-spacing : normal !important;
line-height : normal !important;
list-style : none !important;
list-style-image : none !important;
list-style-position : outside !important;
list-style-type : disc !important;
margin : 0 !important;
margin-bottom : 0 !important;
margin-left : 0 !important;
margin-right : 0 !important;
margin-top : 0 !important;
max-height : none !important;
max-width : none !important;
min-height : 0 !important;
min-width : 0 !important;
opacity : 1 !important;
orphans : 0 !important;
outline : 0 !important;
outline-color : invert !important;
outline-style : none !important;
outline-width : medium !important;
overflow : visible !important;
overflow-x : visible !important;
overflow-y : visible !important;
padding : 0 !important;
padding-bottom : 0 !important;
padding-left : 0 !important;
padding-right : 0 !important;
padding-top : 0 !important;
page-break-after : auto !important;
page-break-before : auto !important;
page-break-inside : auto !important;
perspective : none !important;
perspective-origin : 50% 50% !important;
position : static !important;
quotes : '201C' '201D' '2018' '2019' !important;
right : auto !important;
tab-size : 8 !important;
table-layout : auto !important;
text-align : inherit !important;
text-align-last : auto !important;
text-decoration : none !important;
text-decoration-color : inherit !important;
text-decoration-line : none !important;
text-decoration-style : solid !important;
text-indent : 0 !important;
text-shadow : none !important;
text-transform : none !important;
top : auto !important;
transform : none !important;
transform-style : flat !important;
transition : none !important;
transition-delay : 0s !important;
transition-duration : 0s !important;
transition-property : none !important;
transition-timing-function : ease !important;
unicode-bidi : normal !important;
vertical-align : baseline !important;
visibility : visible !important;
white-space : normal !important;
widows : 0 !important;
width : auto !important;
word-spacing : normal !important;
z-index : auto !important;
}