@import url(https://fonts.googleapis.com/css?family=Titillium+Web:400,600,600italic);

/* 
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - https://richclarkdesign.com 
Twitter: @rich_clark
*/

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

body {
    line-height:1;
}

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

nav ul {
    list-style:none;
}

blockquote, q {
    quotes:none;
}

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

a {
    margin:0;
    padding:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
    transition: all ease 0.3s;
	-moz-transition: all ease 0.3s;
	-webkit-transition: all ease 0.3s;
	-o-transition: all ease 0.3s;
}

/* change colours to suit your needs */
ins {
    background-color:#ff9;
    color:#000;
    text-decoration:none;
}

/* change colours to suit your needs */
mark {
    background-color:#ff9;
    color:#000; 
    font-style:italic;
    font-weight:bold;
}

del {
    text-decoration: line-through;
}

abbr[title], dfn[title] {
    border-bottom:1px dotted;
    cursor:help;
}

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

/* change border colour to suit your needs */
hr {
    display:block;
    height:1px;
    border:0;   
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
}

input, select {
    vertical-align:middle;
}

/*

Trollmag
v.0.1
Last Updated: 29-01-2013
Author: FACO - https://www.asuntosgraficos.com 
Twitter: @asuntosgraficos

*/



html{
background-image: linear-gradient(bottom, rgb(57,49,49) 20%, rgb(90,74,83) 60%);
background-image: -o-linear-gradient(bottom, rgb(57,49,49) 20%, rgb(90,74,83) 60%);
background-image: -moz-linear-gradient(bottom, rgb(57,49,49) 20%, rgb(90,74,83) 60%);
background-image: -webkit-linear-gradient(bottom, rgb(57,49,49) 20%, rgb(90,74,83) 60%);
background-image: -ms-linear-gradient(bottom, rgb(57,49,49) 20%, rgb(90,74,83) 60%);
background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0.2, rgb(57,49,49)), color-stop(0.6, rgb(90,74,83)));
color:white;
min-height: 100%;
font-family: Verdana, sans-serif;
font-size:12px;
}


#trollmag{
width:870px;
min-height:525px;
margin:3% auto auto auto;
}

h1, h2, h3, h4, h5 {
font-weight: 600;
font-family: 'Titillium Web', sans-serif;
}

hr{
border:none;
width:100%;
clear:both;
}

header{
height:auto;
width:100%;
padding-top: 10px;
}

hgroup{
width:350px;
height:65px;
float:left;
}

hgroup h1 a{
background:transparent url("images/logo.png") 0 0 no-repeat;
display:block;
width:340px;
height:55px;
padding:5px;
text-indent:-9999em;
opacity:0.7;
filter:alpha(opacity=70);
}

hgroup h1 a:hover{
opacity:1;
filter:alpha(opacity=100);
}

nav{
width:518px;
float:right;
margin:20px 0 25px 0;
padding-left:0;
height:20px;
font-weight: 400;
font-family: 'Titillium Web', sans-serif;
font-size:12px;
letter-spacing:1px;
border-left:2px solid #ff4500;
}

nav ul {
list-style: none;
margin: 0;
width:518px;
}

nav li{
float: left;
position: relative;
}

nav a {
color: #cdcdce;
display: block;
line-height: 20px;
padding: 0 9px;
text-decoration: none;
border-right:2px solid #ff4500;
}

nav a.first {
color: #cdcdce;
display: block;
line-height: 20px;
padding: 0 10px;
text-decoration: none;
border-right:2px solid #ff4500;
}


nav a.es {
display: block;
text-decoration: none;
margin: 0;
border:none;
padding:0;
font-size: 8px;
}

nav a.es:hover{
background-position:0 0;
}

nav a.en {
display: block;
text-decoration: none;
margin: 0;
padding: 0 8px;
font-size: 8px;
border:none;
}

nav a.en:hover{
background-position:-16px 0;
}

nav a.de {
display: block;
text-decoration: none;
margin: 0;
padding: 0 8px;
font-size: 8px;
border:none;
}

nav a.de:hover{
background-position:-16px 0;
}


nav li:hover > a, nav ul ul :hover > a {
/*background: transparent;*/
color: white;
text-shadow: 0 0 3px #393131;

}
nav ul li:hover > ul {
display: block;
}

nav ul li.current_page_item > a,
nav ul li.current-menu-ancestor > a,
nav ul li.current-menu-item > a,
nav ul li.current-menu-parent > a {
color: black;
font-weight:600;
}

* htmlnav ul li.current_page_item a,
* html nav ul li.current-menu-ancestor a,
* html nav ul li.current-menu-item a,
* html nav ul li.current-menu-parent a,
* html nav ul li a:hover {
color: red;
}



aside{
height:440px;
width:340px;
float:left;
position:relative;
}

aside.deutsch{
height:460px;
width:340px;
float:left;
position:relative;
}

aside h2, aside h3{
padding:12px 36px 3px 12px;
text-shadow: 0 0 3px #393131;
}

aside h2{
font-size:15px;
line-height:1.5;
letter-spacing: 2px;
text-transform:uppercase;
}

aside h3{
font-size:17px;
line-height:1.4;
letter-spacing:1px;
}

div.video{
height:160px;
width:285px;
background:black;
padding:5px;
margin: 10px 10px 0 10px;
position: absolute;
bottom: 18px;
left: 0;
}

div.video-top{
height:160px;
width:285px;
background:black;
padding:5px;
margin: 10px 10px 0 10px;
position: absolute;
bottom: 200px;
left: 0;
}

section{
float:right;
width:520px;
height:410px;
margin:10px 0 20px 0;
background:transparent;
color:gray;
}

section a{color:#fff; text-decoration: none; font-weight:700;}

section a:hover{text-decoration: underline;}


section h3{padding:4px 10px 10px 5px; border-bottom:1px solid #fff; margin:5px 10px 15px 10px; text-transform:uppercase; letter-spacing: 1px; color:#fff;}

section h3.restWidth{margin:5px 25px 15px 10px;}


section h2{padding:5px; margin:5px 25px 5px 10px; text-transform:uppercase; letter-spacing: 1px; color:#FF4500;}

section h2 small{font-size:10px; text-transform:uppercase; letter-spacing: 1px; color:#fff;}

section p{margin:10px 25px 10px 15px; color:#fff; line-height:1.5;}

footer{
clear:both;
background:#ff4500;
color:white;
height:15px;
width:860px;
text-align: right;
padding:5px;
font-size:12px;
line-height: 15px;
letter-spacing: 1px;
font-family: 'Titillium Web', sans-serif;
}

footer a{
display:block;
height:15px;
width:90px;
margin-left:770px;
background:transparent url('images/logo-polimin.png') 0 0 no-repeat;
text-indent:9999em;
overflow: hidden;
}

p.orang{
    color: #FF4500;
}


/*if you just want to adjust the size of the stage and the thumbnails, you can do so by editing the following lines: */

.pika-thumbs li{width: 72px; height:40px;}

.pika-stage {height: 410px; width:520px; background:black;}

.pikachoose {width: 500px; margin: 0 auto;}

.pika-stage {position: relative;}
	
.pika-stage .main-image {position: absolute; top: 0px; left: 0px;}

.pika-stage .pika-aniwrap{position: absolute; top: 0px; left: 0px;}

.pika-stage .pika-ani {position:relative;display: none;z-index:2;margin:0 auto;}

.pika-stage img {border:0;height:100%;}

.pika-stage .caption {
position: absolute; 
background: url(75-black.png);  
font-size: 11px; 
color: #fafafa; 
padding: 10px; 
text-align: right; 
bottom: 10px; 
right: 10px;}
			
.pika-stage .caption p {padding: 0; margin: 0; line-height: 14px;}

.pika-imgnav a {position: absolute; text-indent: -5000px; display: block;z-index:3;cursor:pointer;}

.pika-imgnav a.previous {width:20px;height:20px;border-left: 5px solid #FFF;border-top: 5px solid #FFF;opacity:0;-webkit-transition: opacity 300ms linear;
		-webkit-transform: rotate(-45deg);-moz-transform: rotate(-45deg);transform: rotate(-45deg);top:45%;left:10px;}

.pika-imgnav a.next {width:20px;height:20px;border-right: 5px solid #FFF;border-top: 5px solid #FFF;opacity:0;-webkit-transition: opacity 300ms linear;
		-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);transform: rotate(45deg);top:45%;right:10px;}
		
.pika-imgnav a:hover{opacity:.6;-webkit-transition: opacity 300ms linear;}	

.pika-imgnav a.play  {border-color: transparent transparent rgba(255,255,255,.7);border-style: solid;border-width: 0 0 25px 25px;height: 0;width: 0;position:absolute;
		-webkit-transform: rotate(-45deg);-moz-transform: rotate(-45deg);transform: rotate(-45deg);top:14px;left:47%;display:none;}

.pika-imgnav a.pause {display:none;border-left:5px solid rgba(255,255,255,.7);border-right:5px solid rgba(255,255,255,.8);height: 30px;width: 14px; position:absolute;top:10px;left:47%;}

.pika-textnav {display:none;}
	
.pika-thumbs {margin: -60px 0 0 13px; padding: 0;}

.pika-thumbs li {
float: left; 
list-style-type: none;
margin: 0 5px; 
cursor: pointer;
}

.pika-thumbs li:last {margin: 0;}

.pika-thumbs li .clip {position:relative;height:100%; text-align: center; vertical-align: center; overflow: hidden; border:2px solid black;}

.pika-tooltip{font-size:12px;position:absolute;color:white;padding:3px; background-color: rgba(0,0,0,0.7);}

.pika-counter{display:none;}
	
.jcarousel-skin-pika .jcarousel-container-horizontal { padding: 15px 20px; overflow:hidden;}
.jcarousel-skin-pika .jcarousel-clip-horizontal {height: 90px; width: 485px;}
.jcarousel-skin-pika .jcarousel-item-horizontal { margin-right: 10px;}

/* Tiny Scrollbar */
#scrollbar1 {
    margin:0;
    width: 520px;
}

#scrollbar1 .viewport { width: 520px; height: 410px; overflow: hidden; position: absolute; }
#scrollbar1 .overview { list-style: none; position: absolute; left: 0; top: 0; padding: 0; margin: 0; width: 100% }
#scrollbar1 .scrollbar{ position: relative; background-position: 0 0; float: right; width: 15px; }
#scrollbar1 .track { background:#EEE; height: 100%; width:13px; position: relative; padding: 0 1px; overflow:hidden; z-index:9999; }

#scrollbar1 .thumb { 
    background:#999; 
    height: 20px; 
    width: 25px; 
    cursor: pointer; 
    overflow: hidden; 
    position: absolute; 
    top: 0; 
    left: -5px;
     z-index:9999; 
}

#scrollbar1 .disable { display: none; }
.noSelect { user-select: none; -o-user-select: none; -moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none; }

/* Contact */

form{
}

.campo{
    margin: 10px 10px 10px 15px;
    width: 260px;
}

.campo label{
    width: 100%;
    margin-bottom: 5px;
    display: block;
}

.campo input[type="text"]{
    width: 100%;
    border:1px solid #999;
    height: 15px;
    line-height: 15px;
    padding: 5px; 
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

.campo textarea{
    width: 100%;
    border:1px solid #999;
    height: 95px;
    line-height: 15px;
    padding: 5px; 
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    font-size: 12px;
    font-family: Verdana, sans-serif;


}

.campo input[type="text"]:focus{
    width: 110%;
    border:1px solid #FF4500;
    transition: all ease 0.3s;
    -moz-transition: all ease 0.3s;
    -webkit-transition: all ease 0.3s;
    -o-transition: all ease 0.3s;
}

.campo textarea:focus{
    width: 110%;
    border:1px solid #FF4500;
    transition: all ease 0.3s;
    -moz-transition: all ease 0.3s;
    -webkit-transition: all ease 0.3s;
    -o-transition: all ease 0.3s;
}

input[type="submit"]{
    margin: 0px 15px 15px 15px;
    padding: 5px 20px;
    border: none;
    background: #FF4500;
    color: #FFF;
    cursor: pointer;
}

input[type="submit"]:hover{
    opacity: 0.8;
    transition: all ease 0.3s;
    -moz-transition: all ease 0.3s;
    -webkit-transition: all ease 0.3s;
    -o-transition: all ease 0.3s;
}

.eng .en{
     color: #FF4500;
}

.spa .es{
     color: #FF4500;
}

.deu .de{
     color: #FF4500;
}


.clear{
    clear: both;
}

/* Med */

.leng{
    position: absolute;
    top: 15px;
    right: 20px;
}

.bootstrapiso{
    display: none;
}
.m{
    display:none !important;
}
section a{
    font-weight: 500;
}

@media (max-width: 910px){
    html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
    font-size: 14px;
    }
    .leng li{
        font-size: 10px !important;
    }
    .m{
        display:block !important;
    }
    nav{
        display:none;
        width: auto;    
    }
    .navbar{
        display:inline-block;
        margin-top: 30px !important;
    }
    .pika-stage, .pika-stage img {
        height: auto !important;
        width: 100%;
    }
    .bootstrapiso{
        display: initial;
    }
    footer a {
        position: relative;
        margin-left: 0px;
        text-align: right;
        display: inline-block;
        margin-top: 10px;
        margin-bottom: 10px;
        }

        aside{
            display:none !important;
        }

        header hr{
            display: none;
        }

    aside, section{
        width: 100%;
        display:block;
        float: none;
    }
    section{
        margin-top: 0px;
        float: left;
    }
    #trollmag, footer{
        width: 100%;
        margin-top: 0px;
    }
    .navbar{
        margin-right: 20px;
        border: none;
    }
    .navbar-collapse{
        left: 0px !important;
    }
    .navbar-collapse li {
        padding: 15px !important;
        border-top: 1px solid #ff4500;
    }
    .navbar-collapse li a{
        color: #cdcdce ;
    }
    hgroup{
        padding-top: 20px;
        margin-left: 20px;
        float: none;
    }
    body{
        width: 100vw;
    }
    .header-up{
        border-bottom: 5px solid #ff4500;
        margin-top: 20px;
    }
    hgroup h1 a, hgroup{ 
        background-size: contain;
        width: 200px;
    }

    .navbar-toggler i{
        font-size: 20px;
    }
    .leng{
        display: block;
        position: relative;
        margin-bottom: 10px;
        text-align: right;
    }
    .leng li{
        display: inline-block;
        margin-right: 10px;

    }
    .leng a{
        color: #cdcdce;
        text-decoration: none;
    }
    ul{
        margin-bottom: 0px !important;
    }
    .viewport, #scrollbar1, section{
        overflow: initial !important;
        width: 100vw !important;    
        height: initial !important;
        overflow:auto;
        position: relative !important;
    }
    .overview, #scrollbar1{
        position: relative !important;
    }
    #scrollbar1{
        padding-top: 50px;
    }
    div.vid{
        margin-top: 100px;
    }
    div.video{
        margin-top: 50px;
        position: relative;
    }
    
    input[type=submit]{
        -webkit-appearance: none;
        border-radius: 0;
        font-size: 16px;
        padding: 10px;
        background: #ff4500;
        border-radius: 0px;
    }
    h2{
        font-size: 18px;
    }
    section{
        float: none !important;
        margin-bottom: 30px;
    }
    footer{
        height: initial;
        margin-top: 50px !important;
        position: relative;
        padding: 0px !important;
    }
    .scrollbar{
        display:none
    }
    .pika-thumbs li {
        width: 40px;
        height: 40px;
    }
}