@charset "UTF-8";
@import url(../_Inc/css_FontAwesome.min.css);
@import url("https://fonts.googleapis.com/css?family=Khand:400,500");

/* Reset *************************************************************************************************************************************************************************** */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, Foot, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
text-align: center;
}

article, aside, details, figcaption, figure, Foot, header, hgroup, menu, nav, section {
display: block;
}

body {
line-height: 1;
}

ol, ul {
list-style: none;
}

blockquote, q {
quotes: none;
}

blockquote:before, blockquote:after, q:before, q:after {
content: '';
content: none;
}

table {
border-collapse: collapse;
border-spacing: 0;
}

body {
-webkit-text-size-adjust: none;
}

*, *:before, *:after {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}

@-ms-viewport {
width: device-width;
}

body {
-ms-overflow-style: scrollbar;
}

@media only screen and (max-width: 480px) {
html, body {
min-width: 320px;
}
}

body {
background-image: url("../_Imports/HM_BackGreyNoise.jpg"); 
background-repeat: repeat;
background-attachment: fixed;
}

body.is-loading *, body.is-loading *:before, body.is-loading *:after {
-moz-animation: none !important;
-webkit-animation: none !important;
-ms-animation: none !important;
animation: none !important;
-moz-transition: none !important;
-webkit-transition: none !important;
-ms-transition: none !important;
transition: none !important;
}

/* Typography ********************************************************************************************************************************************************************** */

body, input, select, textarea {
color: #000000;
font-family: "Khand", sans-serif;
font-size: 12pt;
font-weight: 400;
line-height: 118%;
}

@media only screen and (min-width: 1025px) { /* Desktop */
body, input, select, textarea {
font-size: 14pt;
}
}

a, a:active, a:focus, a:visited {
-moz-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
-webkit-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
-ms-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
text-decoration: none;
outline: 0;
color: #6450DC;
}

a:hover {
border: none;
color: #666666;
}

strong, b {
font-weight: 500;
color: #666666;
}

em, i {
font-style: italic;
}

p {
margin: 0 0 2em 0;
}

h2 a, h3 a, h6 a {
font-weight: 500;
color: inherit;
text-decoration: none;
}

h2 {
font-weight: 500;
font-size: 1.5em;
margin: 0 0 0.4em 0;
}

h3 {
font-weight: 500;
font-size: 1.3em;
line-height: 1em;
}

h6 {
font-weight: 400;
font-size: 0.7em;
color: #666666;
}

sub {
font-size: 0.8em;
position: relative;
top: 0.5em;
}

sup {
font-size: 0.8em;
position: relative;
top: -0.5em;
}

hr {
border: 2;
border-bottom: solid 1px #CCCCCC;
margin: 1em 0 0 0;
}

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

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

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

/* Sections ************************************************************************************************************************************************************************ */

#HeadBanner {
margin: 0;
background-color: #000000;
}

#BannerVid {
display: block;
right: 0;
top: 0;
width: 100%;
}

#BannerPix img {
display: none;
width: 100%;
height: auto;
}

@media only screen and (max-width: 568px) { /* iPhone Horizontal + Vertical */
#BannerVid {
display: none !important;
}
#BannerPix img {
display: block;
}
}

/* ********************************************************************************************* */

#MainContent {
padding: 0 0 0 0;
background-image: url("../_Imports/HM_BackGreyNoiseGrad.png"); 
background-position: center top;
background-repeat: repeat-x;
}

#MainContent .inner {
width: 90%;
max-width: 80em;
margin: 0 auto;
}

/* ********************************************************************************************* */

.SectionTitles {
color: #FFFFFF;
font-size: 1.75em;
font-weight: 500;
line-height: 110%;
text-shadow: 1.8px 1.8px 2px #000000;
padding: 0.3em;
margin: 1em 0 0.5em 0;
border-radius: 0.2em;
/* 50% > 50% > 0% #000000 */
background: -moz-linear-gradient(top, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.5) 50%, rgba(0,0,0,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(0,0,0,0.5) 0%,rgba(0,0,0,0.5) 50%,rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(0,0,0,0.5) 0%,rgba(0,0,0,0.5) 50%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#80000000', endColorstr='#00000000',GradientType=0 ); /* IE6-9 */
}

/* ********************************************************************************************* */

#HeadIntro {
margin: 0 0 0 0;
}

#HeadIntro img {
box-shadow: 1.8px 1.8px 4px #000000;
float:left;
margin: 0 1.5em 1em 0;
}

#HeadIntro p {
text-align: justify;
text-justify: inter-word;
margin: -0.2em 0 0.5em 0;
}

@media only screen and (min-width: 1025px) { /* Desktop */
#HeadIntro p {
line-height: 140%;
margin: -0.2em 0 1em 0;
}
}

@media only screen and (max-width: 768px) {
#HeadIntro img {
max-height: 150px;
}
}

/* ********************************************************************************************* */

.TickerNews {
width: 100%;
font-size: 1em;
text-shadow: 1px 1px 2px #000000;
color: #FFFFFF;
padding: 0.2em 0.4em 0.2em 0.4em;
border-radius: 0.2em;
background-color: #6450DC;
}
.TickerNews_Wrap {
width: 100%;
position: relative;
overflow: hidden;
}
.TickerNews_Slide{
width: 30000px;
position: relative;
left: 0;
top: 0;
}
.TickerNews_Content {
width: 8000px;
position: relative;
float:left;
}
.TickerNews_Topic {
float:left;
}
.TickerNews_Topic a {
display: block;
color: #FFFFFF;
text-decoration: none;
}
.TickerNews_Topic a::before {
content: "   ≡   ";
margin: 0 0.4em 0 0.5em;
}

/* ********************************************************************************************* */

#TheSlider {
position: relative;
top: 0px;
left: 0px;
height: 115px;
overflow: hidden;
box-shadow: 0.1em 0.1em 0.3em 0 #333333;
margin: 1em 0 1em 0;
}

/* ********************************************************************************************* */

ul.HeadPictos {
cursor: default;
list-style: none;
}

ul.HeadPictos h3 {
line-height: 1em;
}

ul.HeadPictos li {
display: inline-block;
text-align: center;
padding: 0 0.8em 0 0.8em;
}

ul.HeadPictos li a {
color: #6450DC;
text-shadow: 1px 1px #000000;
display: block;
padding: 0.5em 1.3em 0.3em 1.3em;
}

ul.HeadPictos li a:before {
font-size: 2em;
display: block;
height: 1.2em;
line-height: 1.8em;
}

ul.HeadPictos li a:hover {
color: #666666;
}

ul.HeadPictos li:last-child {
padding-right: 0;
}

@media only screen and (max-width: 736px) {
ul.HeadPictos h3 {
font-size: 1em;
}

ul.HeadPictos li {
padding: 0 0 0 0;
}

ul.HeadPictos li a {
padding: 0 1em 0.3em 1em;
}
}


/* ********************************************************************************************* */

#UnderProd {
margin: 0 0 0 0;
}

#FeatureFilms {
margin: 0 0 0 0;
}


#ShortFilms {
margin: 0 0 0 0;
}


#TvWebFilms {
margin: 0 0 0 0;
}

/* Box Thumbnails Images *********************************************************************************************************************************************************** */

.box {
text-align: center;
border-radius: 0.5em;
/* 50% > 50% > 0% #000000 */
background: -moz-linear-gradient(top, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.5) 50%, rgba(0,0,0,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(0,0,0,0.5) 0%,rgba(0,0,0,0.5) 50%,rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(0,0,0,0.5) 0%,rgba(0,0,0,0.5) 50%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#80000000', endColorstr='#00000000',GradientType=0 ); /* IE6-9 */
}

.box > :last-child,
.box > :last-child > :last-child,
.box > :last-child > :last-child > :last-child {
margin-bottom: 0;
}

.box .image.fit {
margin: 0;
}

.box .image img { /* PC Horizontal : 6 thumbs */
border-radius: 0.5em;
padding: 0.15em 0.15em 0.35em 0.15em;
cursor: pointer;
}

@media only screen and (max-width: 1024px) { /* iPad Horizontal : 6 thumbs */
}

@media only screen and (max-width: 768px) { /* iPad Vertical : 5 thumbs */
}

@media only screen and (max-width: 568px) { /* iPhone Horizontal : 4 thumbs */
}

@media only screen and (max-width: 320px) { /* iPhone Vertical : 2 thumbs */
}

.box .inner {
padding: 0 1em 0 1em;
width: 100% !important;
}

.thumbnails {
display: -moz-flex;
display: -webkit-flex;
display: -ms-flex;
display: flex;
-moz-align-items: stretch;
-webkit-align-items: stretch;
-ms-align-items: stretch;
align-items: stretch;
-moz-justify-content: center;
-webkit-justify-content: center;
-ms-justify-content: center;
justify-content: center;
-moz-flex-wrap: wrap;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}

.thumbnails .box { /* PC Horizontal : 6 thumbs */
margin: 0 0.2em 0.5em 0.2em;
width: 16.1%;
}

@media only screen and (max-width: 1280px) { /* iPad Horizontal : 6 thumbs */
.thumbnails .box {
width: 15.8%;
}
}

@media only screen and (max-width: 980px) { /* iPad Vertical : 5 thumbs */
.thumbnails .box {
width: 19%;
}
}

@media only screen and (max-width: 736px) { /* iPhone Horizontal : 4 thumbs */
.thumbnails .box {
width: 23.6%;
}
}

@media only screen and (max-width: 480px) { /* iPhone Vertical : 2 thumbs */
.thumbnails .box {
width: 47.5%;
}
}

.image {
border: 0;
display: inline-block;
position: relative;
}

.image img {
border-radius: 4px;
display: block;
}

.image.left, .image.right {
max-width: 40%;
}

.image.left img, .image.right img {
width: 100%;
}

.image.left {
float: left;
padding: 0 1.5em 1em 0;
top: 0.25em;
}

.image.right {
float: right;
padding: 0 0 1em 1.5em;
top: 0.25em;
}

.image.fit {
display: block;
margin: 0 0 2em 0;
width: 100%;
}

.image.fit img {
width: 100%;
}

/* ********************************************************************************************* */

button[data-balloon] {
overflow: visible;
}
[data-balloon] {
position: relative;
cursor: pointer;
}
[data-balloon]:after {
font-family: font-family:"Khand", sans-serif !important;
font-size: 0,9em !important;
font-weight: 400 !important;
font-style: normal !important;
text-align: center;
color: #FFFFFF;
text-shadow: none !important;
padding: 0.1em 0.3em 0em 0.3em ;
filter: alpha(opacity=0);
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
-moz-opacity: 0;
-khtml-opacity: 0;
opacity: 0;
pointer-events: none;
-webkit-transition: all 0.18s ease-out 0.18s;
-moz-transition: all 0.18s ease-out 0.18s;
-ms-transition: all 0.18s ease-out 0.18s;
-o-transition: all 0.18s ease-out 0.18s;
transition: all 0.18s ease-out 0.18s;
background-color: #6450DC;
border-radius: 0.2em;
content: attr(data-balloon);
position: absolute;
white-space: nowrap;
z-index: 10;
-webkit-box-shadow: 0 0 0.3em 0.2em rgba(0,0,0,0.75);
-moz-box-shadow: 0 0 0.3em 0.2em rgba(0,0,0,0.75);
box-shadow: 0 0 0.3em 0.2em rgba(0,0,0,0.75);
}
[data-balloon]:before {
height: 0px;
width: 0px;
}
[data-balloon]:hover:before, [data-balloon]:hover:after, [data-balloon][data-balloon-visible]:before, [data-balloon][data-balloon-visible]:after {
filter: alpha(opacity=100);
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
-moz-opacity: 1;
-khtml-opacity: 1;
opacity: 1;
pointer-events: auto;
}
[data-balloon].font-awesome:after {
font-family: FontAwesome;
}
[data-balloon][data-balloon-break]:after {
white-space: pre;
}
[data-balloon][data-balloon-blunt]:before, [data-balloon][data-balloon-blunt]:after {
-webkit-transition: none;
-moz-transition: none;
-ms-transition: none;
-o-transition: none;
transition: none;
}

[data-balloon][data-balloon-pos='down']:after { /* POSTER */
left: 50%;
margin-top: -2em;
top: 100%;
-webkit-transform: translate(-50%, -10px);
-moz-transform: translate(-50%, -10px);
-ms-transform: translate(-50%, -10px);
transform: translate(-50%, -10px);
}
[data-balloon][data-balloon-pos='down']:before {
width: 0px;
height: 0px;
}
[data-balloon][data-balloon-pos='down']:hover:after, [data-balloon][data-balloon-pos='down'][data-balloon-visible]:after {
-webkit-transform: translate(-50%, 0);
-moz-transform: translate(-50%, 0);
-ms-transform: translate(-50%, 0);
transform: translate(-50%, 0); }
[data-balloon][data-balloon-pos='down']:hover:before, [data-balloon][data-balloon-pos='down'][data-balloon-visible]:before {
-webkit-transform: translate(-50%, 0);
-moz-transform: translate(-50%, 0);
-ms-transform: translate(-50%, 0);
transform: translate(-50%, 0);
}

[data-balloon][data-balloon-pos="up"]:after { /* CREDITS */
bottom: 100%;
left: 50%;
margin-bottom: 0.8em;
-webkit-transform: translate(-50%, 10px);
-moz-transform: translate(-50%, 10px);
-ms-transform: translate(-50%, 10px);
transform: translate(-50%, 10px);
-webkit-transform-origin: top;
-moz-transform-origin: top;
-ms-transform-origin: top;
transform-origin: top;
}
[data-balloon][data-balloon-pos="up"]:before {
bottom: 100%;
left: 50%;
margin-bottom: 0.3em;
-webkit-transform: translate(-50%, 10px);
-moz-transform: translate(-50%, 10px);
-ms-transform: translate(-50%, 10px);
transform: translate(-50%, 10px);
-webkit-transform-origin: top;
-moz-transform-origin: top;
-ms-transform-origin: top;
transform-origin: top;
}
[data-balloon][data-balloon-pos="up"]:hover:after, [data-balloon][data-balloon-pos="up"][data-balloon-visible]:after {
-webkit-transform: translate(-50%, 0);
-moz-transform: translate(-50%, 0);
-ms-transform: translate(-50%, 0);
transform: translate(-50%, 0);
}
[data-balloon][data-balloon-pos="up"]:hover:before, [data-balloon][data-balloon-pos="up"][data-balloon-visible]:before {
-webkit-transform: translate(-50%, 0);
-moz-transform: translate(-50%, 0);
-ms-transform: translate(-50%, 0);
transform: translate(-50%, 0);
}

[data-balloon][data-balloon-length='fit']:after {
white-space: normal;
width: 100%;
}


/* Foot Info + Pictos ************************************************************************************************************************************************************** */

#FootInfo {
padding: 1em 0 0 0;
font-weight: 400;
text-align: center;
}

#FootInfo .inner {
width: 50%;
margin: 0 auto;
}

@media only screen and (max-width: 980px) {
#FootInfo .inner {
width: 75%;
}
}

@media only screen and (max-width: 736px) {
#FootInfo .inner {
width: 90%;
}
}

ul.FootPictos {
cursor: default;
list-style: none;
}

ul.FootPictos li {
display: inline-block;
text-align: center;
}

ul.FootPictos li a {
color: #6450DC;
display: block;
margin: 0 0 0 -0.3em;
padding: 0.5em;
}

ul.FootPictos li a:before {
font-size: 2em;
display: block;
line-height: 1.5em;
}

ul.FootPictos li a:hover {
color: #666666;
}

ul.FootPictos li:last-child {
padding-right: 0;
}

/* PopTrox ************************************************************************************************************************************************************************* */

.poptrox-popup {
background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(top, #ffffff 0%, #777777 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #ffffff 0%,#777777 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #ffffff 0%,#777777 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#777777',GradientType=0 ); /* IE6-9 */
}