*{font-size:4vw; line-height:4vw;}
body{margin:0;font-family:arial;padding:0;}
body{background-color: #012f22;}
.winner{background:#88c97e;}
.loser{background:#ce0000;}
a{color:#50b53d;}
a:hover{color:#016f54;}
.center{text-align:center;}

input{font-family:bebas-neue-bold, bebas-neue;font-size:18px;border:1px solid #c8c8c8;}

h1,h2,h3{font-family:bebas-neue, bebas-neue-bold, arial;color:#016f54;}
h1 a,h2 a,h3 a{text-decoration:none;}
h1 a:hover,h2 a:hover,h3 a:hover{text-decoration:underline;}
h1{margin:0;font-size:6vw;line-height:6vw;}
h2{margin:0;font-size:5vw;}

.link{font-family:bebas-neue-bold, bebas-neue;position:relative;font-size:5vw;text-decoration:underline;display:inline-block;}

.arrow:hover{border-color:#50b53d;}
table{margin-bottom:20px;border-collapse:collapse;width:100%;}
table th{text-align:left;}
table td{padding:3px 5px;vertical-align:top;}
.outerContainer{width:95%;position:relative;top:14vw;display:flex;flex-direction:column; margin: 0 auto;}
header{overflow:visible;border-top:1px solid #0b9a77;height:69px;background:#067f62;background:-moz-linear-gradient(top, #067f62 0%, #016f54 100%);background:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #067f62), color-stop(100%, #016f54));background:-webkit-linear-gradient(top, #067f62 0%, #016f54 100%);background:-o-linear-gradient(top, #067f62 0%, #016f54 100%);background:-ms-linear-gradient(top, #067f62 0%, #016f54 100%);background:linear-gradient(to bottom, #067f62 0%, #016f54 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#067f62', endColorstr='#016f54', GradientType=0);}
header #logo{position:absolute;top:-55px;left:35px;float:left;display:block;}
header #logo img{display:block;float:left;}
header nav{width:685px;height:69px;left:205px;position:relative;float:left;}
header nav ul{margin:14px 0;padding:0;list-style-type:none;position:relative;float:left;}
header nav ul li{position:relative;float:left;padding:10px 15px;list-style-type:none;font-family:bebas-neue-bold, bebas-neue;font-size:20px;border-right:1px solid #005d46;text-shadow:1px 1px 1px #515151;cursor:pointer;}
header nav ul li:before{height:100%;width:1px;position:absolute;content:'';top:0;right:-2px;background:#098D6D;}
header nav ul li:hover{cursor:pointer;transition:0.3s background;}
header nav ul li:hover:after{content:'';position:absolute;bottom:-14px;width:0;height:0;margin-left:-9px;left:50%;border-style:solid;border-width:0 9px 9px 9px;border-color:transparent transparent #004635 transparent;}
header nav ul li:hover li{list-style-type:none;position:relative;display:block;font-family:arial;box-sizing:border-box;width:140px;margin:0 10px;padding:0 10px;font-size:16px;line-height:normal;border:0;font-family:bebas-neue, bebas-neue-bold;border-bottom:1px solid #003C2A;}
header nav ul li:hover li:after{display:none;}
header nav ul li:hover li:before{height:1px;width:100%;position:absolute;content:'';top:auto;bottom:-2px;right:0;background:#01543b;}
header nav ul li:hover li a{padding:10px 0px;display:inline-block;width:100%;color:white;box-sizing:border-box;transition:.4s background;}
header nav ul li:hover li a:hover{color:#7eb5a8;transition:.4s background;}
header nav ul li,header nav ul li a{color:white;text-decoration:none;}
header nav ul li:hover ul{display:block;position:absolute;top:41px;left:50%;margin-left:-80px;padding:5px 0 10px 0;width:160px;z-index:9;background:#004635;}
header nav ul li:hover ul:before{content:'';position:absolute;top:-15px;left:0;width:100%;height:40px;}
header nav ul li ul{display:none;color:white;}
header .searchButton{float:right;position:relative;top:27px;right:40px;cursor:pointer;}
header .searchButton:hover:after{content:'';position:absolute;top:33px;width:0;height:0;margin-left:-9px;left:50%;border-style:solid;border-width:0 9px 9px 9px;border-color:transparent transparent #2B2F2E transparent;}
header .search{position:absolute;display:none;background:#2B2F2E;z-index:1000;right:10px;width:415px;top:70px;z-index:1;padding:0 10px;}
header .search .inner{width:415px;margin:0 auto;position:relative;}
header .search .inner form{padding:0;}
header .search .inner form ::-webkit-input-placeholder{padding-left:10px;}
header .search .inner form ::-moz-placeholder{padding-left:10px;}
header .search .inner form :-ms-input-placeholder{padding-left:10px;}
header .search .inner form input:-moz-placeholder{padding-left:10px;}
header .search .inner form input[type=text]{width:80%;box-sizing:border-box;background:transparent;padding:0px 30px 0 15px;margin:0;color:#A9A9A9;font-size:25px;line-height:90px;border:0;height:90px;outline:0;}
header .search .inner form input[type=submit]{background:url(/img/icons/searchBig.png) no-repeat center;float:left;width:20%;height:50px;top:20px;position:relative;vertical-align:center;cursor:pointer;border:0;}
header .search .inner:before{content:'';position:absolute;top:-9px;width:0;height:0;right:19px;border-style:solid;border-width:0 9px 9px 9px;border-color:transparent transparent #2B2F2E transparent;}

main
{
    background:white;padding:20px;width:100%;box-sizing:border-box;float:left;border-left:10px solid #016f54;border-right:10px solid #016f54;
    display: flex;
    flex-direction: column;  
}
main > div.news         {order:2;}
main > article          {order:1;}
main > div.articleList  {order:3;}
main > div.youtube      {order:4;}
main > div.standings    {order:5;}/*tabulka*/
main > div.facebook     {order:6;}
main > div.partners     {order:7;}

footer{float:left;width:100%;background:#016f54;padding:30px 10px;color:white;text-shadow:1px 1px 1px #515151;}
footer a{color:#88c97e;}
footer a:hover{color:#7eb5a8;}
footer .menu{text-align:center;padding-bottom:30px;border-bottom:1px solid #005d46;position:relative;z-index:10;width:100%;}
footer .menu:after{content:"";display:block;position:absolute;z-index:-1;top:0px;left:0px;right:0px;bottom:-2px;border-bottom:1px solid #098d6d;}
footer .menu .item{font-size:20px;padding:0 10px 0 8px;font-family:bebas-neue-bold, bebas-neue;position:relative;z-index:10;}
footer .menu .item a{color:white;text-decoration:none;font-size: 5vw;}
footer .menu .item a:hover{text-decoration:underline;}
footer .menu .item:not(:last-child){border-right:1px solid #005d46;}
footer .menu .item:not(:last-child):after{content:"";display:block;position:absolute;z-index:-1;top:0px;left:0px;right:-3px;bottom:0px;border-right:1px solid #098d6d;}
footer .copyright{padding:0 20px;padding-top:30px;}
.articleInfo
{font-size:2vw;line-height: 2vw;font-family:bebas-neue, bebas-neue-bold;color:#7eb5a8;margin:20px 0 15px 0;}

main .seasons-list,
main .box{margin:15px 0 15px 0px;padding:20px;border:5px solid #d6e7e3;position:relative;}
main > div.facebook > div.box, 
main > div.youtube > div.box
{overflow:hidden;}
main .box h2{padding-left:5px;margin-bottom:15px;}
main .box:before{display:block;float:left;position:absolute;left:0px;top:0;width:20px;height:20px;font-size:18px;background:#d6e7e3;font-family:bebas-neue-bold;margin-right:50px;content:'';}

main #f1_container{position:relative;margin:0px auto;height:270px;z-index:1;}
main #f1_card{width:100%;height:100%;transform-style:preserve-3d;moz-transform-style:preserve-3d;ms-transform-style:preserve-3d;transition:all 0.3s linear;}
main .face{position:absolute;width:100%;height:100%;backface-visibility:hidden;ms-backface-visibility:hidden;moz-backface-visibility:hidden;webkit-backface-visibility:hidden;}
main .face.back{display:block;transform:rotateY(180deg);moz-transform:rotateY(180deg);ms-transform:rotateY(180deg);box-sizing:border-box;width:100%;height:100%;}
main .youtube #mainVideo{background:white;float:left;transition:all 0.3s linear;margin-bottom:10px;}
main .youtube #mainVideo iframe{width:460px;transition:.3s opacity;margin:0;padding:0;display:block;}
main .youtube #mainVideo iframe:hover{transition:.3s opacity;}
main .youtube #mainVideo iframe.stopped{opacity:1;}
main .youtube #mainVideo iframe.stopped:hover{opacity:1;}
main .youtube #youtubeList{float:left;width:100%;overflow:auto;transition:all 0.3s linear;z-index:99999999999999999!important;}
main .youtube #youtubeList .youtube{float:left;position:relative;height:125px;width:225px;overflow:hidden;margin-right:10px;margin-bottom:10px;box-shadow:0 0 1px darkgrey;display:none;}
main .youtube #youtubeList .youtube:nth-child(even){margin-right:0;}
main .youtube #youtubeList .youtube .title{position:absolute;bottom:7px;width:197px;left:7px;padding:7px;font-size:19px;color:white;font-family:bebas-neue-bold;text-align:center;background:rgba(0, 0, 0, 0.5);display:none;transition:background 0.3s;}
main .youtube #youtubeList .youtube:hover .title{transition:background 0.3s;background:rgba(1, 111, 84, 0.8);color:white;}
main .youtube #youtubeList .youtube img{position:absolute;top:-9999px;bottom:-9999px;left:-9999px;right:-9999px;margin:auto;width:235px;background:black;opacity:0.83;transition:all 0.3s;}
main .youtube #youtubeList .youtube:hover img{position:absolute;top:-9999px;bottom:-9999px;left:-9999px;right:-9999px;margin:auto;opacity:1;width:290px;transition:all 0.3s;}
main .youtube .buttons{padding-top:10px;padding-bottom:10px;float:left;width:100%;}
main .youtube .buttons .arrow{width:20px;height:20px;display:inline-block;}
main .youtube .buttons .arrow img{transition:transform 0.3s ease-in-out;}
main .youtube,main .facebook,main .standings{float:left;width:100%;}
main .partners{float:left;width:100%;height:251px;}
main .partners .partnersPage h2{display:none;}
main .partners .line
{
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    justify-content: space-around;
}
main .partners .line div
{
    display:none;
    overflow:hidden;
    width:20%;
}
main .partners .line div a{color:#7eb5a8;text-decoration:none;}
main .partners .line div a:hover{color:#016f54;text-decoration:underline;}
main .partners .line div img{width:100%; height: auto;}
main .partners .line div h3{margin:0;line-height:25px;padding:0;}
main .partners .line img{float:left;}
main .youtube,main .facebook,main .partners{width:100%;margin-left:0px;}
main > div.partners
{
    height:300px;
    overflow: hidden;
}
main > div.partners > div
{
    height:70%;
    overflow: hidden;
}
main .facebook .box .fb-wrap
{
    width: 400px;
    height: 430px;
    transform: scale(2);
    transform-origin: left top;
    overflow: hidden;
    margin-left: 10px;
}
main > div.youtube > div > div.yt-wrap
{
    width: 560px;
    height: 315px;
    transform: scale(1.4);
    transform-origin: left top;
    overflow: hidden;
    margin-left: 10px;
    margin-bottom: 140px;
}
main > div.youtube > div > div.yt-panel
{
    display: flex;
    align-items: center;
    justify-content: center;
}
#arrow > img
{
    border: 20px solid green;
    border-radius: 50px;
    background: green;
    margin-right: 30px;
    width: 30px;
}
main > div.youtube > div > div.yt-panel > a.link
{
        font-size: 5vw;
}
@font-face{font-family:bebas-neue-bold;src:url(/inc/fonts/BebasNeue_Bold.ttf);}
@font-face{font-family:bebas-neue;src:url(/inc/fonts/BebasNeue_Regular.ttf);}

main .articleList{float:left;width:100%;}
main .articleList .article{padding-bottom:10px;border-bottom:5px solid #d6e7e3;}
main .articleList .article h2 a{color:#016f54;}
main .articleList .article p{line-height:4vw;text-align: justify;}

main article{float:left;position:relative;margin-top:50px;text-align: justify;}

body > div.outerContainer > main > article > iframe
{
    width:100% !important;
}
main article h1{margin-bottom:20px;}

main article a:hover{color:#016f54;border-bottom:1px dotted #016f54;}
main > article > div.fb-like-wrap
{
    transform: scale(2);
    transform-origin: left top;
    width: 10%;
    margin: -4vw 0 4vw 0;
}
main .articleList{position:relative;margin-top:50px;}
main .articleList .article{border-bottom:1px solid #dde2ed;float:left;overflow:visible;padding-bottom:15px;margin-bottom:15px;margin-top:15px;width:100%;}

main .articleList .article .image{float:left;width:120px;height:120px;border-radius:50%;overflow:hidden;margin-right:40px;}
main .articleList .article .image img{height:120px;max-width:none;}
main .articleList .article .details{float:left;width:80%;}
main .articleList .article .details a{text-decoration:none;}
main .articleList .article .details h2{margin-top:10px;margin-bottom:0;font-family:bebas-neue-bold, bebas-neue;}
main .articleList .article .details a h2{margin-top:10px;color:#016f54;transition:0.3s all;}
main .articleList .article .details a h2:hover{text-decoration:underline;transition:0.3s all;}
main .articleList .article .details .author{font-family:bebas-neue, bebas-neue-bold;color:#7eb5a8;margin:20px 0 15px 0;}
main .otherContent{float:left;width:580px;position:relative;color:#686a69;margin-top:20px;}
main .otherContent h2{margin-bottom:10px;}
main .box{margin:15px 0;padding:20px;border:5px solid #d6e7e3;position:relative;overflow:auto;}
main .box h2{padding-left:5px;margin-bottom:15px;}
main .box:before{display:block;float:left;position:absolute;left:0px;top:0;width:20px;height:20px;font-size:18px;background:#d6e7e3;font-family:bebas-neue-bold, bebas-neue;margin-right:50px;content:'';}
main .box.noSquare:before{display:none;}
main .box.leagueTable table{width:100%;font-family:bebas-neue, bebas-neue-bold;font-size:16px;}
main .box.leagueTable table th{padding:0 5px 10px 5px;}
main .box.leagueTable table th:nth-child(4),main .box.leagueTable table th:nth-child(6){text-align:center;}
main .box.leagueTable table th:nth-child(1),main .box.leagueTable table td:nth-child(1){text-align:center;}
main .box.leagueTable table tr th:nth-child(2),main .box.leagueTable table tr td:nth-child(2){display:none;}
main .box.leagueTable table tr th:nth-child(5),main .box.leagueTable table tr td:nth-child(5){display:none;}
main .box.leagueTable table tr.TRU{font-family:bebas-neue, bebas-neue-bold;background:#d6e7e3;}
main .box.leagueTable table tr.TRU td{padding:5px;}
main > article > table > tbody > tr > td
{
    padding: 10px;
    border: 1px solid grey;
    font-size: 3vw;
    width:10%;
}
main > article > p> img{width:100%;height: auto;}


.roster{margin-bottom:20px;background:transparent;}
.roster th{padding:5px 10px 5px 10px;color:black;border-bottom:2px solid #016f54;font-weight:normal;font-weight:bold;text-align:left;font-family:bebas-neue, bebas-neue;letter-spacing:1px;}
.roster tr:hover td{background:#ededed;}
.roster td{padding:5px 0 5px 10px;border-bottom:1px solid lightgrey;vertical-align:middle;font-size:3vw;}
.fullWidth table,.roster{width:100%;}
.roster th,table.sort th{cursor:pointer;}
.roster th.header,table.sort th.header{background:url(http://www.hctrutnov.cz/img/icons/sortableTable/bg.gif) no-repeat center right;}
.roster th.headerSortDown,table.sort th.headerSortDown{background:url(http://www.hctrutnov.cz/img/icons/sortableTable/desc.gif) no-repeat center right;}


main > div.seasons-list > section > div > ul 
{
    list-style-type: none;
    columns: 2;
    -webkit-columns: 2;
    -moz-columns: 2;
}
main > div.seasons-list > section > div > ul > li > a 
{
    font-family: bebas-neue-bold, bebas-neue;
    font-weight: bold;
    color: black;
    text-decoration: none;
}
.value{display:inline-block;padding:2px 5px;border-radius:6px 3px;color:white;font-weight:bold;font-family:bebas-neue, bebas-neue-bold;    white-space: nowrap;}
.value:hover{text-decoration:underline;}
main > div.seasons-list > section > div.sectionContent {    width: 100%;    display: block;}

main .news{width:90%;margin-left:15px;height:50vh;}
main .news .content{overflow:auto;height:0;}
body > div > main > div.news.box > div {height: 95%;}
main .news .content .item{width:90%;padding:0 5px 5px 5px;margin-bottom:15px;border-bottom:1px solid #d6e7e3;}
main .news .content .item h3{margin-top:0;font-family:arial;font-size:3vw;}
main .news .content .item p
{
    font-size:4vw;
    line-height:4vw;
    text-align: justify;
}
main .news .content .item p .date{color:#88c97e;}

main > article > div > div.header > img {width:100%}
main > article > div > div.header > p {    margin: 0 0 0 0;}

article .content img{max-width:100%;}
article .info{color:#7e8c9a;}
article .gameStats{border-radius:5px;padding:10px;width:100%;box-sizing:border-box;margin:0 auto;overflow:auto;margin-bottom:15px;}
article .gameStats .mainInfo{overflow:auto;padding-bottom:25px;margin-bottom:25px;border-bottom:1px solid #dde2ed;}
article .gameStats .team{width:30%;float:left;text-align:center;font-family:'bebas-neue', bebas-neue-bold;color:black;}
article .gameStats .team img{width:100%;}
article .gameStats .info{width:40%;float:left;text-align:center;color:black;}
article .gameStats .info .result{line-height:initial;font-family:'bebas-neue', bebas-neue-bold;font-size:8vw;font-weight:bold;display:inline-block;text-shadow:0 0 2px white;margin:5px;}
article .gameStats .info .periods{font-family:'bebas-neue', bebas-neue-bold;}
article .gameStats .info .overtime{font-size:30px;}
article .gameStats .teamName{text-align:center;width:100%;line-height:initial;float:left;font-weight:bold;font-size:6vw;}

main > article > div > div.socialNetworks 
{
        display: flex;
    transform: scale(3);
    width: 20%;
    transform-origin: left top;
    margin: 0 0 10vw 0;
}
#twitter-widget-0{    margin: 1.9vw; }
main > article > div > div.content > div.socialNetworksBottom
{
    width: 49%;
    transform: scale(2);
    transform-origin: left center;
    margin: 22vw 0 12vw 0;
}
article .content .container ul li a{color:#50b53d;}
article .content .container ul li a:hover{color:#016f54;}
article ul{list-style:none;padding-left:0;}
article li{margin-bottom:7px;}
article li:before{content:"• ";font-size:20px;font-weight:bold;color:#016f54;}
article a{color:#88c97e;text-decoration:none;border-bottom:1px dotted #88c97e;}

.tags{zoom:1;list-type-style:none;}
.tags:before,.tags:after{content:'';display:table;}
.tags:after{clear:both;}
ul.tags{float:left;margin:0 0 0 0;}
.tags li{position:relative;float:left;}
.tags li:after{content:'';z-index:2;position:absolute;top:10px;right:-2px;width:5px;height:6px;opacity:.95;background:#eb6b22;border-radius:3px 0 0 3px;-webkit-box-shadow:inset 1px 0 #99400e;box-shadow:inset 1px 0 #99400e;}
.tags li:before{display:none;}
.tags a,.tags span{display:block;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
.tags a{padding:0 9px 0 8px;color:#555!important;text-decoration:none;text-shadow:0 1px white;background:#fafafa;border-width:1px 0 1px 1px!important;border-style:solid!important;border-color:#dadada #d2d2d2 #c5c5c5!important;border-radius:3px 0 0 3px!important;background-image:-webkit-linear-gradient(top, #fcfcfc, #f0f0f0);background-image:-moz-linear-gradient(top, #fcfcfc, #f0f0f0);background-image:-o-linear-gradient(top, #fcfcfc, #f0f0f0);background-image:linear-gradient(to bottom, #fcfcfc, #f0f0f0);-webkit-box-shadow:inset 0 0 0 1px rgba(255, 255, 255, 0.7), 0 1px 2px rgba(0, 0, 0, 0.05);box-shadow:inset 0 0 0 1px rgba(255, 255, 255, 0.7), 0 1px 2px rgba(0, 0, 0, 0.05);}
.tags a span{padding:0 7px 0 6px;-webkit-box-shadow:inset 0 0 0 1px rgba(255, 255, 255, 0.15), 1px 1px 2px rgba(0, 0, 0, 0.2);box-shadow:inset 0 0 0 1px rgba(255, 255, 255, 0.15), 1px 1px 2px rgba(0, 0, 0, 0.2);}
.tags span{position:absolute;top:0px;left:100%;z-index:2;overflow:hidden;padding:0 0 0 2px;color:white;text-shadow:0 -1px rgba(0, 0, 0, 0.3);background:#eb6b22;border:1px solid;border-color:#d15813 #c85412 #bf5011;border-radius:0 2px 2px 0;opacity:.95;background-image:-webkit-linear-gradient(top, #ed7b39, #df5e14);background-image:-moz-linear-gradient(top, #ed7b39, #df5e14);background-image:-o-linear-gradient(top, #ed7b39, #df5e14);background-image:linear-gradient(to bottom, #ed7b39, #df5e14);-webkit-transition:0.3s ease-out;-moz-transition:0.3s ease-out;-o-transition:0.3s ease-out;transition:0.3s ease-out;-webkit-transition-property:padding, max-width;-moz-transition-property:padding, max-width;-o-transition-property:padding, max-width;transition-property:padding, max-width;}
.green li:after{background:#016f54;-webkit-box-shadow:inset 1px 0 #016f54;box-shadow:inset 1px 0 #016f54;}
.green span{background:#0f7f5b;background:-moz-linear-gradient(top, #0f7f5b 0%, #00513b 99%);background:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #0f7f5b), color-stop(99%, #00513b));background:-webkit-linear-gradient(top, #0f7f5b 0%, #00513b 99%);background:-o-linear-gradient(top, #0f7f5b 0%, #00513b 99%);background:-ms-linear-gradient(top, #0f7f5b 0%, #00513b 99%);background:linear-gradient(to bottom, #0f7f5b 0%, #00513b 99%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#0f7f5b', endColorstr='#00513b', GradientType=0);border-color:#016f54;}