
body {
font-size: 1em;
font-family: 'Raleway', sans-serif;
}

.pink
{
color: #d8007e;
}

#top_bar {
position: absolute;
left:0px;
top:0px;
width:100vw;
height:5rem;
//background-color:black;
background-image: radial-gradient(ellipse at bottom, #393938 0%, #2f2f2e 70%);
text-align:center;

}
#top_bar a {
color: white;
}

#top_bar #top_content {
display:inline-block;
width:auto;
overflow:auto;
height:100%;
}

#top_bar #logo
{
float:left;
width:auto;

height:2em;
color: #d8007e;

transform: translateY(2.5rem) translateY(-50%);
}

#top_bar #top_links
{
float:left;
text-align:center;
line-height:1.6em;
transform: translateY(2.5rem) translateY(-50%);
}

#top_links .link
{
font-size: 1em;
text-decoration: none;
margin-left: 1.35em;
color: #bbb;
transition:.5s;
}

#top_links .link:hover {
color: #fff;
transition:.05s;
}

#top_links .selected
{
color: #d8007e;
}

#top_bar #lang {
float:left;
margin-left:4em;

font-size: .6em;
color:black;
transform: translateY(2.5rem) translateY(-50%);
}

#top_bar #lang span {
color: #bbb;
cursor: pointer;
margin-left:5pt;
margin-right:5pt;
text-transform: uppercase;
transition:.5s;
}

#top_bar #lang span:hover {
color: #fff;
transition:.05s;
}

#top_bar #lang .selected {
color: #d8007e;
}

#content {
position: absolute;
top: 5rem;
left: 0px;
width: 100vw;
height: calc(100% - 5rem);
background-color:white;
overflow-x: hidden;
overflow-y: auto;
color:black;
}

#content_image
{
position:relative;
width:100vw;
height: 20rem;
background: linear-gradient(#111010, #3a3938 15%);
}

#content_image .mainImage
{
position: absolute;
top: 0px;
left:0px;
width:100%;
height: 100%;
background-repeat: no-repeat;
background-size: 100% 100%;
opacity: 1.0;
-webkit-transition: opacity .3s ease-in-out;
overflow:hidden;




}

.imageCover {
object-fit: cover;
max-width:100%;
max-height:100%;
min-width:100%;
min-height:100%;
}

.imageWidth {
width:100%;
height:auto;
}

/*.imageSpread {
position:relative;
width:100%;
height:auto;
top:50%;
transform: translateY(-50%);
}

.imageCap {
width:600pt;
background-color: black;
font-size:.1em;
background-repeat: no-repeat;
background-size: 100% 100%;
}*/

#content_image .animationHide
{
opacity: 0.0;
-webkit-transition: opacity .05s ease-in-out;
}

#content .gap {
height:.3em;
}

#content h1 {
font-size: 1.5em;
line-height: 1.35em;
color: #d8007e;
padding-left: 10pt;
padding-right: 20pt;
}

#content h2 {
font-size: .9em;
line-height: 1.5em;
font-weight: normal;
padding-left: 10pt;
padding-right: 20pt;
}

#content_tier1 {
width: 100vw;
max-width: 970pt;
margin:auto;
min-height:calc(100vh - 5rem - 10rem - 20rem);
//background-color:#aaa;
}

#content_tier1 .frontHead {
margin-left:10pt;
margin-right:20pt;
padding-left:300pt;
box-sizing: border-box;
position:relative;
}

#content_tier1 .frontHeadImage {
position:absolute;
left:0px;
bottom:0px;
width:300pt;
height:auto;
}

#content_tier1 .logoImage {
/*position:relative;*/
/*width:300pt;
height:auto;*/
display:block;
margin:auto;
margin-top:20pt;
margin-bottom:10pt;
}

#content_tier2 {
width: 100vw;
max-width: 970pt;
margin:auto;
overflow:auto;
min-height:calc(100vh - 5rem - 10rem - 20em);
//background-color:#aaa;
}

.content_left {
float:left;
width: 70%;
box-sizing: border-box;
padding-top: 10pt;
}

.content_left .hidden {
display: none;
}

#content_menu {
width: 30%;
box-sizing: border-box;
padding-left:30pt;
padding-top: 15pt;
text-transform: uppercase;
}

#content_menu .area {
margin-bottom: .75em;
text-transform: none;
margin-left:5pt;
}

#content_menu .link {
color: black;
text-decoration: none;
font-size: 0.90em;
line-height: 1.5em;
font-weight:bold;
transition:.5s;
}

#content_menu .link:hover {
color: #aaa;
transition:.05s;
}

#content_menu .selected {
color: #d8007e;
}

#bottom_bar {
width:100vw;
height:10rem;
background-color:black;
background: linear-gradient(black, #2d2d2d 25%);
}

#bottom_bar .content {
width:70%;
height:100%;
margin:auto;
padding-top:1.5em;
box-sizing: border-box;
overflow:hidden;
/*display: table;*/
}

#bottom_bar h2
{
font-size:1.0em;
padding-top:0px;
padding-left:0px;
margin-top:0px;
margin-bottom:7pt;
}

#bottom_bar h3
{
font-size:0.95em;
line-height:1.5em;
color: #999;
}

#bottom_bar .left {
display: table-cell;
height:100%;
width:10%;
vertical-align: top;
margin-left:auto;
margin-right:0;
}

#bottom_bar .left_content {
clear:both;float:right;
}

#bottom_bar .right {
display: table-cell;
vertical-align: top;
height:100%;
width:90%;
color:white;
padding-left:2em;
}

#bottom_bar .right_scroll {
height:100%;
overflow-y:hidden;
}

#bottom_bar .right_text {
max-width:40em;
}

#bottom_bar ::-webkit-scrollbar {
display: none;
}

#bottom_bar .logo {
width:auto;
margin-bottom:0.7em;
height:1.7em;
}

#bottom_bar .badge {
width:auto;
height:2em;
}

.itemcontainer {
overflow:auto;
padding-right:10pt;



}

.item {
float:left;

box-sizing: border-box;
height: 200pt;
width: 120pt;

padding:0px;
padding-left: 10pt;
padding-right: 10pt;

outline:0px;
margin:0px;

overflow:hidden;




}

.item .inner {
overflow:hidden;
width:100%;
height:100%;
//background-color:cyan;
}

.two {
width: 50%;
height: 250pt !important;
}

.three {
width: 33.3%;
height: 250pt !important;
}

.item .pic {
width: 100%;
height: 60%;
}

#content .item .gap {
height: 15pt;
}

#content .item .text {
width: 100%;
height: 35%;
font-size: .95em;
line-height: 1.4em;



}


.item .text .head {
font-size: .85em;
font-weight:bold;
line-height: 12pt;
color: #d8007e;
text-transform: uppercase;
text-decoration: none;
}

.item .text .content {



}

.alignLeft {
text-align:left !important;
}


.page {
padding-left:1em;
}

.page .head {
font-size: 1.5em;
color: #d8007e;
margin-top: 10pt;
font-weight:bold;
}

.page .bold {
margin-top: 10pt;
font-weight: bold;
line-height:1.65em;
}

.page .text {
margin-top: 10pt;
font-size:.9em;
line-height:1.65em;
}

.page .geo {
margin-top:15pt;
color: #d8007e;
}

.page .picture {
position: relative;
margin-top: 10pt;
background-repeat: no-repeat;
background-size: 100% 100%;
background-color: #777;
}

.shidden {
position: fixed;
visibility: hidden;
/*white-space: nowrap;*/
}

.test{
background-color: red;
width:200px;
height:60px;
}

.youtube {
position: relative;
width: 100%;
height: 0;
padding-bottom: 56.25%;
}

.youtube .frame {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

#imagePopupBack {
display:none;
position:absolute;
top:0px;
left:0px;
width:100vw;
height:100vh;
background-color:black;
opacity:.7;
}

#imagePopup {
display:none;
position:absolute;
top:50%;
left:50%;
transform: translate(-50%, -50%);
background-position:center;
background-size:cover;
background-repeat: no-repeat;

background-color:white;
}

#imagePopup .arrowArea {
display:none;
position:absolute;
top:0px;
width:80pt;
height:100%;
//background-color:black;
cursor:pointer;
opacity:0.4;
-webkit-transition: opacity .2s ease-in-out;

-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
}

#imagePopup .arrowArea:hover {
opacity:0.8;
-webkit-transition: opacity .2s ease-in-out;
}

#imagePopup #imagePopupLeft {
left: 0px;
}

#imagePopup #imagePopupRight {
right: 0px;
}

#imagePopup .arrow {
width:20pt;
height:auto;
position:absolute;
top:50%;
transform: translateY(-50%);
}

#imagePopup .arrowLeft {
left:5pt;
}

#imagePopup .arrowRight {
right:5pt;
}

div.info {
margin:20pt;
margin-right:30pt;
//background-color:yellow;
}

div.info h1 {
color: #d8007e !important;
padding:0px !important;
font-size:1.5em !important;
font-weight: bold !important;
}

div.info h2 {
padding:0px !important;
font-size:1.2em !important;
font-weight: bold !important;
}

div.info h3 {
padding:0px !important;
font-size:1.1em !important;
font-weight: normal !important;
line-height:1.5em;
}

div.info ul {
padding:0px !important;
padding-left:10pt !important;
font-size:1.1em !important;
}
