/********************** grid from pure **********************/ /*! Pure v0.6.2 Copyright 2013 Yahoo! Licensed under the BSD License. https://github.com/yahoo/pure/blob/master/LICENSE.md */ /*! normalize.css v^3.0 | MIT License | git.io/normalize Copyright (c) Nicolas Gallagher and Jonathan Neal */ /*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */img,legend{border:0}legend,td,th{padding:0}html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,optgroup,strong{font-weight:700}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{box-sizing:content-box;height:0}pre,textarea{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]{-webkit-appearance:textfield;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}table{border-collapse:collapse;border-spacing:0}.hidden,[hidden]{display:none!important}.pure-img{max-width:100%;height:auto;display:block} /*! Pure v0.6.2 Copyright 2013 Yahoo! Licensed under the BSD License. https://github.com/yahoo/pure/blob/master/LICENSE.md */ .pure-g{letter-spacing:-.31em;text-rendering:optimizespeed;font-family:FreeSans,Arimo,"Droid Sans",Helvetica,Arial,sans-serif;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-flow:row wrap;-ms-flex-flow:row wrap;flex-flow:row wrap;-webkit-align-content:flex-start;-ms-flex-line-pack:start;align-content:flex-start}@media all and (-ms-high-contrast:none),(-ms-high-contrast:active){table .pure-g{display:block}}.opera-only :-o-prefocus,.pure-g{word-spacing:-.43em}.pure-u,.pure-u-1,.pure-u-1-1,.pure-u-1-12,.pure-u-1-2,.pure-u-1-24,.pure-u-1-3,.pure-u-1-4,.pure-u-1-5,.pure-u-1-6,.pure-u-1-8,.pure-u-10-24,.pure-u-11-12,.pure-u-11-24,.pure-u-12-24,.pure-u-13-24,.pure-u-14-24,.pure-u-15-24,.pure-u-16-24,.pure-u-17-24,.pure-u-18-24,.pure-u-19-24,.pure-u-2-24,.pure-u-2-3,.pure-u-2-5,.pure-u-20-24,.pure-u-21-24,.pure-u-22-24,.pure-u-23-24,.pure-u-24-24,.pure-u-3-24,.pure-u-3-4,.pure-u-3-5,.pure-u-3-8,.pure-u-4-24,.pure-u-4-5,.pure-u-5-12,.pure-u-5-24,.pure-u-5-5,.pure-u-5-6,.pure-u-5-8,.pure-u-6-24,.pure-u-7-12,.pure-u-7-24,.pure-u-7-8,.pure-u-8-24,.pure-u-9-24{display:inline-block;zoom:1;letter-spacing:normal;word-spacing:normal;vertical-align:top;text-rendering:auto}.pure-g [class*=pure-u]{font-family:sans-serif}.pure-u-1-24{width:4.1667%}.pure-u-1-12,.pure-u-2-24{width:8.3333%}.pure-u-1-8,.pure-u-3-24{width:12.5%}.pure-u-1-6,.pure-u-4-24{width:16.6667%}.pure-u-1-5{width:20%}.pure-u-5-24{width:20.8333%}.pure-u-1-4,.pure-u-6-24{width:25%}.pure-u-7-24{width:29.1667%}.pure-u-1-3,.pure-u-8-24{width:33.3333%}.pure-u-3-8,.pure-u-9-24{width:37.5%}.pure-u-2-5{width:40%}.pure-u-10-24,.pure-u-5-12{width:41.6667%}.pure-u-11-24{width:45.8333%}.pure-u-1-2,.pure-u-12-24{width:50%}.pure-u-13-24{width:54.1667%}.pure-u-14-24,.pure-u-7-12{width:58.3333%}.pure-u-3-5{width:60%}.pure-u-15-24,.pure-u-5-8{width:62.5%}.pure-u-16-24,.pure-u-2-3{width:66.6667%}.pure-u-17-24{width:70.8333%}.pure-u-18-24,.pure-u-3-4{width:75%}.pure-u-19-24{width:79.1667%}.pure-u-4-5{width:80%}.pure-u-20-24,.pure-u-5-6{width:83.3333%}.pure-u-21-24,.pure-u-7-8{width:87.5%}.pure-u-11-12,.pure-u-22-24{width:91.6667%}.pure-u-23-24{width:95.8333%}.pure-u-1,.pure-u-1-1,.pure-u-24-24,.pure-u-5-5{width:100%} /*! Pure v0.6.2 Copyright 2013 Yahoo! Licensed under the BSD License. https://github.com/yahoo/pure/blob/master/LICENSE.md */ @media screen and (min-width: 35.5em) { .pure-u-sm-1, .pure-u-sm-1-1, .pure-u-sm-1-2, .pure-u-sm-1-3, .pure-u-sm-2-3, .pure-u-sm-1-4, .pure-u-sm-3-4, .pure-u-sm-1-5, .pure-u-sm-2-5, .pure-u-sm-3-5, .pure-u-sm-4-5, .pure-u-sm-5-5, .pure-u-sm-1-6, .pure-u-sm-5-6, .pure-u-sm-1-8, .pure-u-sm-3-8, .pure-u-sm-5-8, .pure-u-sm-7-8, .pure-u-sm-1-12, .pure-u-sm-5-12, .pure-u-sm-7-12, .pure-u-sm-11-12, .pure-u-sm-1-24, .pure-u-sm-2-24, .pure-u-sm-3-24, .pure-u-sm-4-24, .pure-u-sm-5-24, .pure-u-sm-6-24, .pure-u-sm-7-24, .pure-u-sm-8-24, .pure-u-sm-9-24, .pure-u-sm-10-24, .pure-u-sm-11-24, .pure-u-sm-12-24, .pure-u-sm-13-24, .pure-u-sm-14-24, .pure-u-sm-15-24, .pure-u-sm-16-24, .pure-u-sm-17-24, .pure-u-sm-18-24, .pure-u-sm-19-24, .pure-u-sm-20-24, .pure-u-sm-21-24, .pure-u-sm-22-24, .pure-u-sm-23-24, .pure-u-sm-24-24 { display: inline-block; *display: inline; zoom: 1; letter-spacing: normal; word-spacing: normal; vertical-align: top; text-rendering: auto; } .pure-u-sm-1-24 { width: 4.1667%; *width: 4.1357%; } .pure-u-sm-1-12, .pure-u-sm-2-24 { width: 8.3333%; *width: 8.3023%; } .pure-u-sm-1-8, .pure-u-sm-3-24 { width: 12.5000%; *width: 12.4690%; } .pure-u-sm-1-6, .pure-u-sm-4-24 { width: 16.6667%; *width: 16.6357%; } .pure-u-sm-1-5 { width: 20%; *width: 19.9690%; } .pure-u-sm-5-24 { width: 20.8333%; *width: 20.8023%; } .pure-u-sm-1-4, .pure-u-sm-6-24 { width: 25%; *width: 24.9690%; } .pure-u-sm-7-24 { width: 29.1667%; *width: 29.1357%; } .pure-u-sm-1-3, .pure-u-sm-8-24 { width: 33.3333%; *width: 33.3023%; } .pure-u-sm-3-8, .pure-u-sm-9-24 { width: 37.5000%; *width: 37.4690%; } .pure-u-sm-2-5 { width: 40%; *width: 39.9690%; } .pure-u-sm-5-12, .pure-u-sm-10-24 { width: 41.6667%; *width: 41.6357%; } .pure-u-sm-11-24 { width: 45.8333%; *width: 45.8023%; } .pure-u-sm-1-2, .pure-u-sm-12-24 { width: 50%; *width: 49.9690%; } .pure-u-sm-13-24 { width: 54.1667%; *width: 54.1357%; } .pure-u-sm-7-12, .pure-u-sm-14-24 { width: 58.3333%; *width: 58.3023%; } .pure-u-sm-3-5 { width: 60%; *width: 59.9690%; } .pure-u-sm-5-8, .pure-u-sm-15-24 { width: 62.5000%; *width: 62.4690%; } .pure-u-sm-2-3, .pure-u-sm-16-24 { width: 66.6667%; *width: 66.6357%; } .pure-u-sm-17-24 { width: 70.8333%; *width: 70.8023%; } .pure-u-sm-3-4, .pure-u-sm-18-24 { width: 75%; *width: 74.9690%; } .pure-u-sm-19-24 { width: 79.1667%; *width: 79.1357%; } .pure-u-sm-4-5 { width: 80%; *width: 79.9690%; } .pure-u-sm-5-6, .pure-u-sm-20-24 { width: 83.3333%; *width: 83.3023%; } .pure-u-sm-7-8, .pure-u-sm-21-24 { width: 87.5000%; *width: 87.4690%; } .pure-u-sm-11-12, .pure-u-sm-22-24 { width: 91.6667%; *width: 91.6357%; } .pure-u-sm-23-24 { width: 95.8333%; *width: 95.8023%; } .pure-u-sm-1, .pure-u-sm-1-1, .pure-u-sm-5-5, .pure-u-sm-24-24 { width: 100%; } } @media screen and (min-width: 48em) { .pure-u-md-1, .pure-u-md-1-1, .pure-u-md-1-2, .pure-u-md-1-3, .pure-u-md-2-3, .pure-u-md-1-4, .pure-u-md-3-4, .pure-u-md-1-5, .pure-u-md-2-5, .pure-u-md-3-5, .pure-u-md-4-5, .pure-u-md-5-5, .pure-u-md-1-6, .pure-u-md-5-6, .pure-u-md-1-8, .pure-u-md-3-8, .pure-u-md-5-8, .pure-u-md-7-8, .pure-u-md-1-12, .pure-u-md-5-12, .pure-u-md-7-12, .pure-u-md-11-12, .pure-u-md-1-24, .pure-u-md-2-24, .pure-u-md-3-24, .pure-u-md-4-24, .pure-u-md-5-24, .pure-u-md-6-24, .pure-u-md-7-24, .pure-u-md-8-24, .pure-u-md-9-24, .pure-u-md-10-24, .pure-u-md-11-24, .pure-u-md-12-24, .pure-u-md-13-24, .pure-u-md-14-24, .pure-u-md-15-24, .pure-u-md-16-24, .pure-u-md-17-24, .pure-u-md-18-24, .pure-u-md-19-24, .pure-u-md-20-24, .pure-u-md-21-24, .pure-u-md-22-24, .pure-u-md-23-24, .pure-u-md-24-24 { display: inline-block; *display: inline; zoom: 1; letter-spacing: normal; word-spacing: normal; vertical-align: top; text-rendering: auto; } .pure-u-md-1-24 { width: 4.1667%; *width: 4.1357%; } .pure-u-md-1-12, .pure-u-md-2-24 { width: 8.3333%; *width: 8.3023%; } .pure-u-md-1-8, .pure-u-md-3-24 { width: 12.5000%; *width: 12.4690%; } .pure-u-md-1-6, .pure-u-md-4-24 { width: 16.6667%; *width: 16.6357%; } .pure-u-md-1-5 { width: 20%; *width: 19.9690%; } .pure-u-md-5-24 { width: 20.8333%; *width: 20.8023%; } .pure-u-md-1-4, .pure-u-md-6-24 { width: 25%; *width: 24.9690%; } .pure-u-md-7-24 { width: 29.1667%; *width: 29.1357%; } .pure-u-md-1-3, .pure-u-md-8-24 { width: 33.3333%; *width: 33.3023%; } .pure-u-md-3-8, .pure-u-md-9-24 { width: 37.5000%; *width: 37.4690%; } .pure-u-md-2-5 { width: 40%; *width: 39.9690%; } .pure-u-md-5-12, .pure-u-md-10-24 { width: 41.6667%; *width: 41.6357%; } .pure-u-md-11-24 { width: 45.8333%; *width: 45.8023%; } .pure-u-md-1-2, .pure-u-md-12-24 { width: 50%; *width: 49.9690%; } .pure-u-md-13-24 { width: 54.1667%; *width: 54.1357%; } .pure-u-md-7-12, .pure-u-md-14-24 { width: 58.3333%; *width: 58.3023%; } .pure-u-md-3-5 { width: 60%; *width: 59.9690%; } .pure-u-md-5-8, .pure-u-md-15-24 { width: 62.5000%; *width: 62.4690%; } .pure-u-md-2-3, .pure-u-md-16-24 { width: 66.6667%; *width: 66.6357%; } .pure-u-md-17-24 { width: 70.8333%; *width: 70.8023%; } .pure-u-md-3-4, .pure-u-md-18-24 { width: 75%; *width: 74.9690%; } .pure-u-md-19-24 { width: 79.1667%; *width: 79.1357%; } .pure-u-md-4-5 { width: 80%; *width: 79.9690%; } .pure-u-md-5-6, .pure-u-md-20-24 { width: 83.3333%; *width: 83.3023%; } .pure-u-md-7-8, .pure-u-md-21-24 { width: 87.5000%; *width: 87.4690%; } .pure-u-md-11-12, .pure-u-md-22-24 { width: 91.6667%; *width: 91.6357%; } .pure-u-md-23-24 { width: 95.8333%; *width: 95.8023%; } .pure-u-md-1, .pure-u-md-1-1, .pure-u-md-5-5, .pure-u-md-24-24 { width: 100%; } } @media screen and (min-width: 64em) { .pure-u-lg-1, .pure-u-lg-1-1, .pure-u-lg-1-2, .pure-u-lg-1-3, .pure-u-lg-2-3, .pure-u-lg-1-4, .pure-u-lg-3-4, .pure-u-lg-1-5, .pure-u-lg-2-5, .pure-u-lg-3-5, .pure-u-lg-4-5, .pure-u-lg-5-5, .pure-u-lg-1-6, .pure-u-lg-5-6, .pure-u-lg-1-8, .pure-u-lg-3-8, .pure-u-lg-5-8, .pure-u-lg-7-8, .pure-u-lg-1-12, .pure-u-lg-5-12, .pure-u-lg-7-12, .pure-u-lg-11-12, .pure-u-lg-1-24, .pure-u-lg-2-24, .pure-u-lg-3-24, .pure-u-lg-4-24, .pure-u-lg-5-24, .pure-u-lg-6-24, .pure-u-lg-7-24, .pure-u-lg-8-24, .pure-u-lg-9-24, .pure-u-lg-10-24, .pure-u-lg-11-24, .pure-u-lg-12-24, .pure-u-lg-13-24, .pure-u-lg-14-24, .pure-u-lg-15-24, .pure-u-lg-16-24, .pure-u-lg-17-24, .pure-u-lg-18-24, .pure-u-lg-19-24, .pure-u-lg-20-24, .pure-u-lg-21-24, .pure-u-lg-22-24, .pure-u-lg-23-24, .pure-u-lg-24-24 { display: inline-block; *display: inline; zoom: 1; letter-spacing: normal; word-spacing: normal; vertical-align: top; text-rendering: auto; } .pure-u-lg-1-24 { width: 4.1667%; *width: 4.1357%; } .pure-u-lg-1-12, .pure-u-lg-2-24 { width: 8.3333%; *width: 8.3023%; } .pure-u-lg-1-8, .pure-u-lg-3-24 { width: 12.5000%; *width: 12.4690%; } .pure-u-lg-1-6, .pure-u-lg-4-24 { width: 16.6667%; *width: 16.6357%; } .pure-u-lg-1-5 { width: 20%; *width: 19.9690%; } .pure-u-lg-5-24 { width: 20.8333%; *width: 20.8023%; } .pure-u-lg-1-4, .pure-u-lg-6-24 { width: 25%; *width: 24.9690%; } .pure-u-lg-7-24 { width: 29.1667%; *width: 29.1357%; } .pure-u-lg-1-3, .pure-u-lg-8-24 { width: 33.3333%; *width: 33.3023%; } .pure-u-lg-3-8, .pure-u-lg-9-24 { width: 37.5000%; *width: 37.4690%; } .pure-u-lg-2-5 { width: 40%; *width: 39.9690%; } .pure-u-lg-5-12, .pure-u-lg-10-24 { width: 41.6667%; *width: 41.6357%; } .pure-u-lg-11-24 { width: 45.8333%; *width: 45.8023%; } .pure-u-lg-1-2, .pure-u-lg-12-24 { width: 50%; *width: 49.9690%; } .pure-u-lg-13-24 { width: 54.1667%; *width: 54.1357%; } .pure-u-lg-7-12, .pure-u-lg-14-24 { width: 58.3333%; *width: 58.3023%; } .pure-u-lg-3-5 { width: 60%; *width: 59.9690%; } .pure-u-lg-5-8, .pure-u-lg-15-24 { width: 62.5000%; *width: 62.4690%; } .pure-u-lg-2-3, .pure-u-lg-16-24 { width: 66.6667%; *width: 66.6357%; } .pure-u-lg-17-24 { width: 70.8333%; *width: 70.8023%; } .pure-u-lg-3-4, .pure-u-lg-18-24 { width: 75%; *width: 74.9690%; } .pure-u-lg-19-24 { width: 79.1667%; *width: 79.1357%; } .pure-u-lg-4-5 { width: 80%; *width: 79.9690%; } .pure-u-lg-5-6, .pure-u-lg-20-24 { width: 83.3333%; *width: 83.3023%; } .pure-u-lg-7-8, .pure-u-lg-21-24 { width: 87.5000%; *width: 87.4690%; } .pure-u-lg-11-12, .pure-u-lg-22-24 { width: 91.6667%; *width: 91.6357%; } .pure-u-lg-23-24 { width: 95.8333%; *width: 95.8023%; } .pure-u-lg-1, .pure-u-lg-1-1, .pure-u-lg-5-5, .pure-u-lg-24-24 { width: 100%; } } @media screen and (min-width: 75em) { .pure-u-xl-1, .pure-u-xl-1-1, .pure-u-xl-1-2, .pure-u-xl-1-3, .pure-u-xl-2-3, .pure-u-xl-1-4, .pure-u-xl-3-4, .pure-u-xl-1-5, .pure-u-xl-2-5, .pure-u-xl-3-5, .pure-u-xl-4-5, .pure-u-xl-5-5, .pure-u-xl-1-6, .pure-u-xl-5-6, .pure-u-xl-1-8, .pure-u-xl-3-8, .pure-u-xl-5-8, .pure-u-xl-7-8, .pure-u-xl-1-12, .pure-u-xl-5-12, .pure-u-xl-7-12, .pure-u-xl-11-12, .pure-u-xl-1-24, .pure-u-xl-2-24, .pure-u-xl-3-24, .pure-u-xl-4-24, .pure-u-xl-5-24, .pure-u-xl-6-24, .pure-u-xl-7-24, .pure-u-xl-8-24, .pure-u-xl-9-24, .pure-u-xl-10-24, .pure-u-xl-11-24, .pure-u-xl-12-24, .pure-u-xl-13-24, .pure-u-xl-14-24, .pure-u-xl-15-24, .pure-u-xl-16-24, .pure-u-xl-17-24, .pure-u-xl-18-24, .pure-u-xl-19-24, .pure-u-xl-20-24, .pure-u-xl-21-24, .pure-u-xl-22-24, .pure-u-xl-23-24, .pure-u-xl-24-24 { display: inline-block; *display: inline; zoom: 1; letter-spacing: normal; word-spacing: normal; vertical-align: top; text-rendering: auto; } .pure-u-xl-1-24 { width: 4.1667%; *width: 4.1357%; } .pure-u-xl-1-12, .pure-u-xl-2-24 { width: 8.3333%; *width: 8.3023%; } .pure-u-xl-1-8, .pure-u-xl-3-24 { width: 12.5000%; *width: 12.4690%; } .pure-u-xl-1-6, .pure-u-xl-4-24 { width: 16.6667%; *width: 16.6357%; } .pure-u-xl-1-5 { width: 20%; *width: 19.9690%; } .pure-u-xl-5-24 { width: 20.8333%; *width: 20.8023%; } .pure-u-xl-1-4, .pure-u-xl-6-24 { width: 25%; *width: 24.9690%; } .pure-u-xl-7-24 { width: 29.1667%; *width: 29.1357%; } .pure-u-xl-1-3, .pure-u-xl-8-24 { width: 33.3333%; *width: 33.3023%; } .pure-u-xl-3-8, .pure-u-xl-9-24 { width: 37.5000%; *width: 37.4690%; } .pure-u-xl-2-5 { width: 40%; *width: 39.9690%; } .pure-u-xl-5-12, .pure-u-xl-10-24 { width: 41.6667%; *width: 41.6357%; } .pure-u-xl-11-24 { width: 45.8333%; *width: 45.8023%; } .pure-u-xl-1-2, .pure-u-xl-12-24 { width: 50%; *width: 49.9690%; } .pure-u-xl-13-24 { width: 54.1667%; *width: 54.1357%; } .pure-u-xl-7-12, .pure-u-xl-14-24 { width: 58.3333%; *width: 58.3023%; } .pure-u-xl-3-5 { width: 60%; *width: 59.9690%; } .pure-u-xl-5-8, .pure-u-xl-15-24 { width: 62.5000%; *width: 62.4690%; } .pure-u-xl-2-3, .pure-u-xl-16-24 { width: 66.6667%; *width: 66.6357%; } .pure-u-xl-17-24 { width: 70.8333%; *width: 70.8023%; } .pure-u-xl-3-4, .pure-u-xl-18-24 { width: 75%; *width: 74.9690%; } .pure-u-xl-19-24 { width: 79.1667%; *width: 79.1357%; } .pure-u-xl-4-5 { width: 80%; *width: 79.9690%; } .pure-u-xl-5-6, .pure-u-xl-20-24 { width: 83.3333%; *width: 83.3023%; } .pure-u-xl-7-8, .pure-u-xl-21-24 { width: 87.5000%; *width: 87.4690%; } .pure-u-xl-11-12, .pure-u-xl-22-24 { width: 91.6667%; *width: 91.6357%; } .pure-u-xl-23-24 { width: 95.8333%; *width: 95.8023%; } .pure-u-xl-1, .pure-u-xl-1-1, .pure-u-xl-5-5, .pure-u-xl-24-24 { width: 100%; } } /********************** default style **********************/ body { background-color: #161e25; font-family: Arial; font-size: 15px; font-weight: normal; min-width: 270px; } body, ul, li /*, p, h1, h2, h3, h4*/ { margin: 0; padding: 0; } h1, h2, h3, h4 { font-weight: normal; margin-top: 0; } ul { list-style: none; } button { padding: 0; border: none; } .container { box-sizing: border-box; width: 100%; padding-right: 10px; padding-left: 10px; } a { /* cursor: pointer; */ text-decoration: none; } p, ul { line-height: 1.5em; } strong.info { color: #CC0000; } .group:before, .group:after { content: ""; display: table; } .group:after { clear: both; } .group { zoom: 1; /* For IE 6/7 (trigger hasLayout) */ } /********************** link style **********************/ .english-icon, .germany-icon, .download-btn, .plugin-btn, .register-support { transition: opacity 0.25s linear; } .english-icon:hover, .germany-icon:hover, .download-btn:hover, .plugin-btn:hover { opacity: 0.75; } #download-desc a:hover, .download-bottom-link a:hover { text-decoration: underline; } /********************** image sprites **********************/ .home-icon { width: 12px; height: 12px; background: url(images/icons.png) 0 0 no-repeat; } .email-icon { width: 12px; height: 12px; background: url(images/icons.png) 0 -50px no-repeat; } .mirror-icon { width: 12px; height: 12px; background: url(images/icons.png) 0 -100px no-repeat; } .home-icon, .email-icon, .mirror-icon { padding-left: 20px; } .english-icon { display: inline-block; width: 24px; height: 18px; background: url(images/icons.png) 0 -200px no-repeat; } .germany-icon { display: inline-block; margin-left: 10px; width: 24px; height: 18px; background: url(images/icons.png) 0 -240px no-repeat; } .caret:after { display: inline-block; width: 14px; height: 14px; background: url(images/icons.png) 0 -148px no-repeat; content:''; margin-left: 3px; } .features-view:before { width: 36px; height: 36px; background: url(images/features.png) 0 0 no-repeat; content:''; display: block; margin: 0 auto; margin-bottom: 12px; } .features-convert:before { width: 36px; height: 36px; background: url(images/features.png) 0 -42px no-repeat; content:''; display: block; margin: 0 auto; margin-bottom: 12px; } .features-optimize:before { width: 36px; height: 36px; background: url(images/features.png) 0 -80px no-repeat; content:''; display: block; margin: 0 auto; margin-bottom: 12px; } .features-scan:before { width: 36px; height: 36px; background: url(images/features.png) 0 -120px no-repeat; content:''; display: block; margin: 0 auto; margin-bottom: 12px; } .features-slideshow:before { width: 36px; height: 36px; background: url(images/features.png) 0 -160px no-repeat; content:''; display: block; margin: 0 auto; margin-bottom: 12px; } .features-batch:before { width: 36px; height: 36px; background: url(images/features.png) 0 -200px no-repeat; content:''; display: block; margin: 0 auto; margin-bottom: 12px; } .features-multimedia:before { width: 36px; height: 36px; background: url(images/features.png) 0 -240px no-repeat; content:''; display: block; margin: 0 auto; margin-bottom: 12px; } .features-more:before { width: 36px; height: 36px; background: url(images/features.png) 0 -280px no-repeat; content:''; display: block; margin: 0 auto; margin-bottom: 12px; } /********************** header style **********************/ #top-navigation { background-color: #313131; font-size: 12px; color: #a99c9d; text-transform: uppercase; min-height: 32px; border-bottom: solid 1px #222222; } #top-navigation .container { position: relative; } #top-navigation .logo { margin-bottom: 35px; } #top-navigation .logo a { display: block; text-align: center; } #top-navigation .logo img { z-index: 0; } #top-navigation .logo span { background: #c80000; font-size: 11px; color: #fff; padding: 3px 10px; border-radius: 5px; box-shadow: -1px 1px #000; white-space: nowrap; position: absolute; top: 56px; left: 50%; transform: translateX(-40%); } #top-navigation ul { text-align: center; line-height: 32px; padding-top: 15px; padding-bottom: 15px; } #top-navigation li { display: inline-block; margin: 0 10px; } #top-navigation li:last-child { margin-right: 0; } #top-navigation li a { color: #a99c9d; vertical-align: middle; } #top-navigation li a:hover { color: #fff; } #top-navigation select { width: 112px; border-radius: 3px; margin-left: 10px; } #main-navigation { background: #424242 url("images/main-menu-bg.png") repeat-x; font-size: 14px; color: #ffffff; text-transform: uppercase; min-height: 44px; } #main-navigation ul { text-align: center; line-height: 43px; /* padding: 9px 0; */ } #main-navigation li { display: inline; } #main-navigation a { color: #ffffff; display: block; /* margin: 0; */ transition: background 0.1s linear; } #main-navigation a:hover { background-color: rgba(0, 0, 0, 0.25) } #banner { background: #100b18 url("images/banner-bg.jpg") no-repeat center; color: #e5e3d6; padding-top:3px; } #fixed-menu:after { content: ''; height: 8px; background-color: #cf0000; width: 100%; display: block; background-image: -moz-linear-gradient(top, #a20000 5%, #d10000); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #a20000), color-stop(1.0, #d10000)); position: relative; /* top: -10px; */ z-index: -1; } #banner p { font-size: 18px; text-align: center; margin: 10px; } #banner img { width: auto; height: auto; max-width: 100%; display: block; margin: 0 auto; box-shadow: 0px 0px 150px -19px rgba(255, 255, 255, 0.5); } .inner-header { background-color: #cf0000; background-image: -moz-linear-gradient(top, #d10000 5%, #a20000); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #d10000), color-stop(1.0, #a20000)); margin-bottom: 20px; } .inner-header h2 { padding-top: 20px; padding-bottom: 20px; color: #fff; text-align: center; } .dropbtn { /* padding: 16px; */ border: none; } .dropdown-content { background-color: rgba(255, 255, 255, 0.06); /* box-shadow: 0 9px 25px 0px rgba(0,0,0,0.3) inset; */ } /********************** main style:left **********************/ .main { background-color: #ffffff; color: #3e3e3e; } .home { padding-top: 26px; } .hero a, .partner-sites a { /* color: #df0024; */ text-decoration: underline; color:#414cc7; } .hero a:hover, .partner-sites a:hover { text-decoration: none; } .hero { margin-bottom: 20px; } .description h1 { font-size: 26px; color: #636057; text-transform: uppercase; } .description p { margin: 20px 0; } .description ul li { list-style: none; padding-left: 15px; background:url(images/bullet2.png) no-repeat 3px 6px; } .about { color: #3e3e3e; overflow: auto; margin-top: 18px; } .about img { margin-right: 4%; float: left; } .about-profile { /* padding: 20px; border: solid 1px #dddddd; background-color: #efeff0; */ } .about-profile p { margin-top: 0px; margin-left: 90px } .about-profile p:last-child { margin-bottom: 0; } /********************** main style: center **********************/ .download { text-align: center; } .download .l-box { background-color: #efeff0; } .download img { margin-right: 20px; } .download-img-desc{ padding: 10px; } #download-desc { display: inline-block; max-width: 290px; } #download-desc p { margin: 0; } .download h2 { font-size: 16px; color: #828078; text-transform: uppercase; } .download a { text-decoration: none; } #download-options { border-top: solid 1px #ffffff; border-bottom: solid 1px #ffffff; margin-top: 18px; height: 199px; } .download-option { width: 50%; height: 199px; display: inline; float: left; background-color: #dfe0e2; position: relative; z-index: 0; /* overflow: auto; */ } .download-option:first-child:after{ display: inline-block; position: absolute; top: 0; right: 0; height: 199px; bottom:0; width: 2px; content: ""; background-color: #f5f5f6; } .download-style-box { max-width: 127px; height: 26px; margin: 12px auto; line-height: 36px; background-color: #efeff0; font-weight: bold; color: #989899 !important; border-top-left-radius: 5px; border-top-right-radius: 5px; } .btn-group { background-color: #efeff0; padding: 23px 2px; margin-top: -12px; } .download-btn:before{ width: 32px; height: 30px; background: url("images/download-icon-white.png") no-repeat center right; content: ''; display: inline-block; float: left; } .download-btn { display: block; margin: 0 auto; margin-bottom: 25px; background: #c80000; max-width: 162px; min-height: 40px; padding-top: 9px; border-radius: 5px; border-top: solid 1px #fc4a4a; border-bottom: solid 1px #555556; color: #ffffff; } .download-btn span{ font-size: 11px; } .download-btn, .plugin-btn, .register-support{ transition: opacity 0.25s linear; } .download-btn:hover, .plugin-btn:hover { opacity:0.75; } .plugin-btn:before{ width: 32px; height: 26px; background: url("images/download-icon-black.png") no-repeat center right; content: ''; display: inline-block; float: left; margin-top: -7px; } .plugin-btn { display: block; margin: 0 auto; background-color: #918e85; max-width: 162px; min-height: 25px; padding-top: 12px; border-radius: 5px; border-top: solid 1px #d7d0bb; border-bottom: solid 1px #555556; color: #ffffff; } .download-bottom-link { text-transform: uppercase; padding: 12px; border-bottom: solid 16px #ffffff; } .register-support { display: block; width: 100%; height: 31px; padding-top: 15px; margin-bottom: 15px; background-color: #e1dcd7; text-transform: uppercase; font-weight: bold; color: #73706e; border: solid 1px #cccccc; } .register-support:hover{ opacity: 0.75; } /********************** main style: right **********************/ .partner-sites { /* margin-bottom: 20px; */ } .partner-sites .l-box { background-color: #f6f6f7; padding: 18px 26px; } .partner-sites li { margin-bottom: 10px; } .partner-sites h4 { font-size: 16px; color: #7e735f; text-align: center; text-transform: uppercase; margin-bottom: 24px; } .partner-sites a { display: block; } /********************** main style: features **********************/ .features { background-color: #e2e2e3; margin: 32px 24px 24px 24px; display: none; } .features .container { padding: 0; } .features h3 { display: inline-block; float: left; width: 200px; height: 21px; background-color: #e2e2e3; color: #616162; text-transform: uppercase; margin-top: -34px; margin-bottom: 0; padding-left: 40px; padding-top: 14px; } .features ul { clear: both; } .features li>img{ display: block; margin: 0 auto; } .features li { display: block; float: left; width: 12.3%; text-align: center; text-transform: uppercase; color: #616162; font-size: 9px; padding: 12px 0; border-left: solid 1px #ceccc9; } .features li:last-child { border-right: solid 1px #ceccc9; } .features li p { margin: 0 auto; text-align: center; } /********************** main style:inner content **********************/ .inner-content { padding-bottom: 20px; } .inner-content h3 { /* text-align: center; */ font-weight: bold; } .inner-content p { margin: 10px 0; vertical-align: center; } .inner-content hr { margin-bottom: 20px; margin-top: 20px; border: solid 1px #dedede; clear: both; } .inner-content ul { margin-bottom: 15px; } .inner-content ul li { list-style: none; padding-left: 15px; background:url(images/bullet2.png) no-repeat 3px 6px; } .inner-content a { /* color: #df0024; */ text-decoration: underline; color:#414cc7; } .inner-content a:hover { text-decoration: none; } .screenshot{ display: inline-block; text-align: center; } .screenshot img { margin: 20px; } .skins li { margin-bottom: 20px; } .skins img{ max-width: 100%; } .support { text-align: center; } table{ width: 100%; max-width: 100%; } table.formats { border-collapse: collapse; width: 100%; } .table-formats th{ border: 1px solid #dddddd; background-color: #dddddd; padding: 16px; text-align: left; } .table-formats td{ border: 1px solid #dddddd; text-align: left; padding: 8px; } .table-formats tr:nth-child(odd) { background-color: #ffffff; } .table-formats tr:nth-child(even) { background-color: #fafafa; } .table-formats p{ margin: 0; text-align: center; } /********************** footer style **********************/ .footer-line { background-color: #424141; height: 32px; } .footer-content { background-color: #161e25; color: #ffffff; height: 50px; } .footer-content img { float: left; margin-top: -14px; } .footer-text { display: inline-block; float: left; margin: 20px; } .playmain { display: inline-block; float: right; margin: 8px; background-color: #22282d; padding: 8px 10px; border-radius: 8px; } .playmain:hover { background-color: #323232; } .footer-content{ color: #b7b7b7; } .footer-text a, .playmain a { color: #ffffff; } .footer-text a:hover, .playmain a:hover{ text-decoration: underline; } /********************** temp for menu **********************/ #main-navigation { /* position:absolute; */ width: 100%; top: 300px; } #main-navigation ul { line-height: 2.5em; margin-left: -10px; margin-right: -10px; overflow: hidden; } #main-navigation ul li { border-bottom: solid 1px #3a3939; } #main-navigation ul ul li:last-child { border-bottom: none; } #top-navigation ul { margin: 0 15px; } #main-navigation li { display: block; } .nav-trigger { position: absolute; clip: rect(0, 0, 0, 0); } label[for="nav-trigger"] {} label[for="nav-trigger"] { position: absolute; top: 85px; z-index: 2; width: 100%; height: 30px; cursor: pointer; text-align: center; color: #ababab; border-top: solid 1px #454545; line-height: 30px; text-transform: uppercase; box-shadow: 0px 5px 12px rgba(0, 0, 0, 0.36); } #nav-trigger ~ #main-navigation, #nav-trigger ~ #top-navigation ul { display: none; } #nav-trigger:checked ~ #main-navigation, #nav-trigger:checked ~ #top-navigation ul { display: block; } /**/ .l-box { margin-left: 10px; margin-right: 10px; } .g-box { padding: 20px; border: solid 1px #dddddd; background-color: #efeff0; } .download-links { overflow:auto; } .inner-content .download-links li { background:none; padding:0; background:#fff; border:solid 1px #dedede; box-sizing:border-box; overflow:auto; display:table; width:100%; margin-bottom:15px; border-bottom:solid 2px #d8d8d8; } .download-links .logo { display:table-cell; padding:12px; width:200px; text-align:center; } .download-links .logo img{ max-width: 100%; } .download-links .links { display:table-cell; background:#f3f3f3; padding:12px; vertical-align:middle; padding-left:18px; } .download-links img, .download-links strong { /* display:block; margin:0 auto; text-align:center; */ } .alt-download { background:url(images/mini56.gif) no-repeat left center; padding-left:20px; } /********************** responsive style **********************/ @media screen and /*(min-width: 750px)*/ (min-width: 48em) { /* ≥ 768px */ .container { margin-right: 0px; margin-left: 0px; } #banner { /* z-index: -1; */ } #top-navigation .container .logo { position: absolute; } #top-navigation .logo span { left: 72px; transform: translateX(0); } #top-navigation ul { padding-top: 0px; padding-bottom: 0; text-align: right; } #main-navigation ul { text-align: right; margin-left: 230px; /* margin: 0 24px; */ } #main-navigation a { display: inline-block; padding: 10px; } #nav-trigger ~ #main-navigation, #nav-trigger ~ #top-navigation ul { display: block; } label[for="nav-trigger"] { display: none; } #main-navigation ul { line-height: 1.9em; overflow: visible; } #main-navigation li { display: inline; } /* dropdown */ .dropdown { position: relative; } .dropdown-content { display: none; /* display:block; */ position: absolute; top: 31px; left: 0; background-color: #4c4c4c; min-width: 200px; box-shadow: 0 0 16px 0px rgba(0, 0, 0, 0.5); transform: translate3d( 0, 0, 1px); z-index: 1; } #main-navigation .dropdown-content { margin-left: 0; padding: 0; text-align: left; } ul.dropdown-content { line-height: 10px !important; } .dropdown-content li {} #main-navigation ul li { border-bottom: none; } .dropdown-content a {} #main-navigation .dropdown-content a { box-sizing: border-box; transform: translate3d( 0, 0, 1px); display: block; width: 100%; padding: 16px 16px; border-bottom: solid 1px #404040; } .dropdown-content a:hover { background-color: #313131 } .dropdown:hover .dropdown-content { display: block; } .dropdown:hover .dropbtn { background: rgba(0, 0, 0, 0.25); } .nav-tablet-break:before { content: "\A"; white-space: pre; } #banner img { padding: 0; } .features { display: block; margin: 52px 0 0 0; width: 100%; } .about { margin-top: 0px; } .about-profile { margin-left: 10px; } .inner-header h2 { text-align: left; } } /********************** DESKTOP **********************/ @media screen and /*(min-width: 992px)*/ (min-width: 64em) { /* ≥ 1024px */ .container { width: 860px; margin: 0 auto; } #top-navigation ul { margin-left: 220px; padding-top: 0; margin-right: 0; } #main-navigation ul { margin-right: 0; } .about { margin-top: 18px; } .pure-u-1 .p-box { margin-right: 20px; } .pure-u-1:last-child .p-box { margin-right: 0; } .inner-partner-sites .l-box { margin-left: 20px; } .nav-tablet-break:before { content: ""; white-space: normal; } } @media screen and /*(min-width: 1170px)*/ (min-width: 75em) { /* ≥ 1280px = 1200px */ .container { width: 1200px; margin: 0 auto; } #fixed-menu { position: fixed; top: 0; width: 100%; z-index: 1; } #top-navigation li:last-child { margin-left: 50px; } .inner-content { margin-top: 159px; padding-top: 20px; } #main-navigation { padding-top: 0; } #banner { margin-top: 90px; /* z-index: -1; */ } #banner p { float: left; max-width: 270px; margin: 0 0 0 70px; font-size: 29px; text-align: right; line-height: 1.2em; } #banner img { height: auto; margin-left: 370px; margin-top: 27px; } .features { margin-top: 36px; } .features li { font-size: 12px; } .about { margin-top: 36px; } .about-profile { margin-left: 0; } .footer-text, .playmain { margin-left: 120px; } .inner-header { position: fixed; top: 80px; width: 100%; z-index: -1; } .inner-content { margin-top: 143px; } } @media screen and (max-width: 25em) { .download-btn:before { background-image: none; width: 5px; } .plugin-btn:before { background-image: none; width: 5px; } }