/* Made by Ian Nobody */

/* Úprava základních objektů */
a{text-decoration: none;color: rgb(154,155,157);}
/* Deklarace Fontu */
@font-face {
          font-family: menu;
          src: url("fonts/TitilliumWeb-SemiBold_0.ttf");
           }
@font-face {
           font-family: slider;
           src: url("fonts/TitilliumWeb-Regular_0.ttf");
           }
/* Nastavení společného HeadLinu */
#headline{font-family: slider;font-size: x-large;color: rgb(65,180,228);border: 1px solid rgb(65,180,228);max-width: 230px;position: relative;top: 50px;}
#secondary-headline{color: rgb(65,180,228);font-size: large;font-family: slider;}
/* Header */
header{position: fixed;top: 0;left: 0;width: 100%;z-index: 1;background-color: white;height: 80px;}
/* Logo */
a.logo{background-image: url(icons/logo.png);background-size: 100%;position: absolute;left: 230px;top: 20px;width: 150px;height: 50px;background-repeat: no-repeat;}
#logo-eu{background-image: url(pics/eu-banner.png);background-size: 300px;width: 300px;height: 70px;position: absolute;left: 5px;top: 588px;background-repeat: no-repeat;}
/* Menu */
#menu{font-family: menu;width: 100%;color: rgb(154,155,157);position: fixed;left: 0;top: 0;height: 80px;border-bottom: 2px solid rgb(37,170,225);}

#ban{position: fixed;width: 100%;height: 100%;z-index: 1000;color: white;font-size: xx-large;background-color: rgb(65,180,228);display: none;font-family: slider;}
@media only screen and (max-width: 1249px) {
  #ban {display: block;}
}

#about{position: absolute;left: 420px;top: 30px;transition: 0.5s;width: 60px;text-align: center;border: 1px solid rgb(37,170,225);}
#about:hover{color: rgb(37,170,225);}
#AIO{position: absolute;left: 500px;top: 30px;transition: 0.5s;width: 100px;text-align: center;}
#AIO:hover{color: rgb(37,170,225);}
#implantat{position: absolute;left: 520px;top: 30px;transition: 0.5s;width: 100px;text-align: center;}
#implantat:hover{color: rgb(37,170,225);}
#instrument{position: absolute;left: 670px;top: 30px;transition: 0.5s;width: 150px;text-align: center;}
#instrument:hover{color: rgb(37,170,225);}
#eshop{position: absolute;left: 875px;top: 30px;transition: 0.5s;width: 70px;text-align: center;}
#eshop:hover{color: rgb(37,170,225);}
#contact{position: absolute;left: 990px;top: 30px;transition: 0.5s;width: 80px;text-align: center;}
#contact:hover{color: rgb(37,170,225);}
/* Jazyky */
#languages{font-family: menu;position: absolute;top: 10px;left: 1150px;color: rgb(154,155,157);}
#cz{background-color: rgb(37,170,225);width: 24px;height: 24px;color: white;}
a.cz{color: white;}
#eng{width: 24px;height: 24px;position: relative;left: 19px;top: -12px;transition: 0.5s;}
#eng:hover{color: rgb(37,170,225);}
a.eng{color: color: rgb(154,155,157);}
/* Oddělovač 1/2 */
#separator1{position: absolute;left: 0;width: 100%;top: 580px;height: 25px;background-color: white;opacity: 0.5;}
#separator2{position: absolute;left: 0;width: 100%;top: 980px;height: 25px;background-color: white;opacity: 0.5;}
/* Náhled implantátu */
#view{background-image: url(pics/view_wallpaper.jpg);height: 1000px;background-size: 100% 1000px;position: absolute;top: -500px;width: 100%;left: 0;z-index: auto;}
#view-complet{background-image: url(pics/view-complet.png);width: 100px;height: 250px;position: absolute;top: 650px;background-size: 100%;left: 500px;}
#slider-separator-1{background-color: rgb(37,170,225);position: absolute;height: 1px;width: 200px;top: 670px;left: 650px;}
#slider-separator-2{background-color: rgb(37,170,225);position: absolute;height: 1px;width: 200px;top: 885px;left: 650px;}
#slider-txt{font-family: slider;color: rgb(9,184,157);position: absolute;top: 680px;font-size: xx-large;left: 650px;}
/* Úvod stránky */
#main{background-color: rgb(247,247,248);width: 100%;height: 740px;position: absolute;left: 0;top: 505px;border-bottom: 2px solid rgb(37,170,225);}
#us{font-family: slider;font-size: x-large;color: rgb(65,180,228);border: 1px solid rgb(65,180,228);width: 90px;position: relative;top: 50px;}

#who{font-family: slider;font-size: x-large;color: rgb(65,180,228);position: relative;top: 80px;}
#who-txt{font-family: slider;color: rgb(137,138,141);position: relative;top: 80px;}

#why{font-family: slider;font-size: x-large;color: rgb(65,180,228);position: relative;top: 120px;}
#why-txt{font-family: slider;color: rgb(137,138,141);position: relative;top: 120px;}

#what{font-family: slider;font-size: x-large;color: rgb(65,180,228);position: relative;top: 160px;}
#what-txt{font-family: slider;color: rgb(137,138,141);position: relative;top: 160px;}

#txt-separator-1{background-color: rgb(37,170,225);position: relative;height: 1px;width: 300px;top: 205px;}
#txt-separator-2{background-color: rgb(37,170,225);position: relative;height: 1px;width: 300px;top: 390px;}
/* Sada ALL-IN-ONE */
#all-in-one{background-color: white;left: 0;height: 865px;position: absolute;width: 100%;top: 1247px;border-bottom: 2px solid rgb(37,170,225);}
#all-in-one-headline{font-family: slider;font-size: x-large;color: rgb(65,180,228);border: 1px solid rgb(65,180,228);width: 180px;position: relative;top: 50px;}
#all-in-one-schema{background-image: url(pics/all-in-one.png);width: 200px;height: 465px;background-size: 200px;position: relative;top: 75px;left: -23%;}
#all-in-one-labels{font-family: slider;position: relative;top: -245px;left: 35%;width: 200px;color: rgb(129,130,133);}
#all-in-one-txt{font-family: slider;position: absolute;top: 140px;left: 55%;color: rgb(129,130,133);width: 300px;}
/* Push-IN modely */
#push-in{background-color: rgb(247,247,248);left: 0;height: 500px;position: absolute;width: 100%;top: 867px;}
#push-in-headline{font-family: slider;font-size: x-large;color: rgb(65,180,228);border: 1px solid rgb(65,180,228);width: 180px;position: relative;top: 50px;}

/*#ctyrlistek{background-image: url(pics/starfish.png);height: 185px;width: 70px;position: absolute;background-size: 70px 185px;top: 150px;left: 250px;}
#ctyrlistek-headline{font-family: slider;position: absolute;width: 100px;color: rgb(129,130,133);top: 370px;left: 235px;}*/

#ctyrlistek{background-image: url(pics/starfish.png);height: 185px;width: 70px;position: absolute;background-size: 70px 185px;top: 150px;left: 525px;}
#ctyrlistek-headline{font-family: slider;position: absolute;width: 100px;color: rgb(129,130,133);top: 370px;left: 510px;}

#kuzel-zebrovany{background-image: url(pics/kuzel-zebrovany.png);height: 185px;width: 70px;position: absolute;background-size: 70px 185px;top: 150px;left: 450px;}
#kuzel-zebrovany-headline{font-family: slider;position: absolute;width: 100px;color: rgb(129,130,133);top: 370px;left: 435px;}

#valcovy-zebrovany{background-image: url(pics/valcovy-zebrovany.png);height: 185px;width: 70px;position: absolute;background-size: 70px 185px;top: 150px;left: 650px;}
#valcovy-zebrovany-headline{font-family: slider;position: absolute;width: 100px;color: rgb(129,130,133);top: 370px;left: 635px;}

#valcovy{background-image: url(pics/valcovy.png);height: 185px;width: 70px;position: absolute;background-size: 70px 185px;top: 150px;left: 850px;}
#valcovy-headline{font-family: slider;position: absolute;width: 100px;color: rgb(129,130,133);top: 370px;left: 835px;}

/*#sroubovy{background-image: url(pics/sroubovy.png);height: 185px;width: 70px;position: absolute;background-size: 70px 185px;top: 150px;left: 1050px;}
#sroubovy-headline{font-family: slider;position: absolute;width: 100px;color: rgb(129,130,133);top: 370px;left: 1035px;}*/

#sroubovy{background-image: url(pics/sroubovy.png);height: 185px;width: 70px;position: absolute;background-size: 70px 185px;top: 150px;left: 725px;}
#sroubovy-headline{font-family: slider;position: absolute;width: 100px;color: rgb(129,130,133);top: 370px;left: 710px;}

#arrow-down {border: solid rgb(65,180,228); border-width: 0 1.5px 1.5px 0; display: inline-block; padding: 20px; transform: rotate(45deg);-webkit-transform: rotate(45deg);position: absolute;top: 430px;left: 540px;transition: 1s;}
/* 1. (top: 430px;left: 285px;) 2. (top: 430px;left: 463px;) 3. (top: 430px;left: 665px;) 4. (top: 430px;left: 864px;) 5. (top: 430px;left: 1065px;) */

/* Ukázka implantátů */
#sample{background-color: white;left: 0;height: 760px;position: absolute;width: 100%;top: 1370px;border-bottom: 2px solid rgb(37,170,225);}
#sample-headline{font-family: slider;font-size: x-large;color: rgb(65,180,228);border: 1px solid rgb(65,180,228);max-width: 330px;position: relative;top: 50px;}

center.sample-1{transition: 1s;width: 100%;height: 100%;opacity: 1;position: absolute;}
center.sample-2{transition: 1s;background-color: green;width: 100%;height: 100%;opacity: 0;position: absolute;}
center.sample-3{transition: 1s;background-color: blue;width: 100%;height: 100%;opacity: 0;position: absolute;}
center.sample-4{transition: 1s;background-color: black;width: 100%;height: 100%;opacity: 0;position: absolute;}
center.sample-5{transition: 1s;background-color: yellow;width: 100%;height: 100%;opacity: 0;position: absolute;}

/* Implantaty - společné */
center.implantats{height: 700px;}
#implants{height: 760px;background-color: white;position: absolute;width: 100%;/*top: 1822px;*/}
#implants-headline{font-family: slider;font-size: x-large;color: rgb(65,180,228);border: 1px solid rgb(65,180,228);width: 180px;position: relative;top: 50px;}

/* Struktura implantátů */
#implants-icon{width: 150px;height: 410px;background-size: 150px 410px;position: relative;left: -300px;top: 100px;}
#implants-icon.starfish{background-image: url(pics/starfish.png);}
#implants-icon.kuzelovy-zebrovany{background-image: url(pics/kuzel-zebrovany.png);}
#implants-icon.valcovy-zebrovany{background-image: url(pics/valcovy-zebrovany.png);}
#implants-icon.valcovy{background-image: url(pics/valcovy.png);}
#implants-icon.sroubovy{background-image: url(pics/sroubovy.png);}

#implants-structure{width: 80px;height: 345px;background-size: 80px;position: relative;top: -280px;left: -100px;}
#implants-structure.starfish{background-image: url(pics/structure-starfish.png);}
#implants-structure.kuzelovy-zebrovany{background-image: url(pics/structure-kuzelovy-zebrovany.png);}
#implants-structure.valcovy-zebrovany{background-image: url(pics/structure-valcovy-zebrovany.png);}
#implants-structure.valcovy{background-image: url(pics/structure-valcovy.png);}
#implants-structure.sroubovy{background-image: url(pics/structure-sroubovy.png);}

#implants-structure-labels{font-family: slider;color: rgb(129,130,133);position: relative;top: -620px;font-size: 12px;left: 15%;max-width: 300px;text-align: left;}
#implants-structure-labels-headline{font-family: slider;font-size: 15px;color: rgb(65,180,228);}

/* Mikrostruktura */
center.microstructure{top: 2132px;height: 510px;background-color: rgb(247,247,248);position: absolute;width: 100%;}
#microstructure-headline{font-family: slider;font-size: x-large;color: rgb(65,180,228);border: 1px solid rgb(65,180,228);width: 180px;position: relative;top: 50px;}

#microstructure-txt{font-family: slider;color: rgb(129,130,133);position: relative;top: 90px;}

#microstructure-structure-1{background-image: url(pics/structure-1.png);background-size: 150px;width: 150px;height: 150px;position: relative;top: 10px;left: -125px;}
#microstructure-structure-2{background-image: url(pics/structure-2.png);background-size: 150px;width: 150px;height: 150px;position: relative;top: -140px;left: 125px;}
#microstructure-structure-3{background-image: url(pics/structure-3.png);background-size: 150px;width: 150px;height: 150px;position: relative;top: -300px;left: 350px;}

#microstructure-structure-txt-1{position: relative;top: 30px;left: -125px;max-width: 300px;}
#microstructure-structure-txt-2{position: relative;top: 5px;left: 124px;max-width: 300px;}
#microstructure-structure-txt-3{position: relative;top: -10px;left: 350px;max-width: 300px;}
/* Instrumentárium */
center.instrumentarium{}
#instrumentarium{height: 450px;background-color: white;position: absolute;width: 100%;top: 2642px;border-top: 2px solid rgb(37,170,225);}

#instrumentarium-txt{font-family: slider;color: rgb(129,130,133);position: relative;top: 160px;left: -200px;text-align: left;max-width: 300px;}
#instrumentarium-view{background-image: url(pics/instrumentarium.png);background-size: 400px;width: 400px;height: 220px;position: relative;top: -30px;left: 200px;}

/* "Doslov" */
center.epilogue{top: 3072px;height: 300px;background-color: rgb(247,247,248);position: absolute;width: 100%;}
#epilogue-package-txt{font-family: slider;color: rgb(129,130,133);max-width: 700px;}
#epilogue-help-txt{font-family: slider;color: rgb(129,130,133);max-width: 700px;}

/* Footer */
center.footer{height: 250px;background-color: rgb(42,169,244);position: absolute;width: 100%;top: 3075px;font-family: menu;color: white;}
#footer-headline{font-family: slider;font-size: x-large;border: 1px solid white;max-width: 230px;position: relative;top: 30px;}

#footer-address{position: relative;top: 80px;left: -10%;max-width: 300px;}
#footer-contact{position: relative;top: 10px;left: 10%;max-width: 300px;}
