﻿@media ( max-width:1600px ) {

/* CONTACT BAR */

#contact-bar-center {

 position:relative;
 width:1366px;
 height:35px;
 margin:0px auto;
 z-index:5;
 border-bottom:1px solid #4a4a4a;

}

/* CONTACT BAR END */

/* MENU */

#menu-bg {

 position:fixed;
 background-color:#111111;
 top:35px;
 height:89px;
 width:100%;
 z-index:5;

}

#center {

 position:relative;
 width:1366px;
 margin:0px auto;
 z-index:5;
  
}

#header {

 top:35px;
 position:fixed;
 width:1366px;
 background-color:#111111;
 
}


#menu {

 position:absolute;
 top:-15px;
 left:200px;

}

#menu li {
 
 float:left;
 margin:30px 30px 30px 0px;
 
}

#responsive, #responsive-icon, #responsive-menu {

 display:none;

}

/* MENU END */

/* PRACOVNE PC VIDEO */

#pracovne-pc-video h1 {

 text-align:center;
 color:#eeeeee;
 font-size:50px;
 margin-top:150px;

}

#pracovne-pc-video h2 {

 text-align:center;
 color:#eeeeee;
 font-size:40px;
 font-weight:300;
 
}

#pracovne-pc-center {

 position:absolute;
 left:50%;
 margin-left:-683px;
 height:700px;
 width:1366px;

}

/* PRACOVNE PC VIDEO END */

/* PRACOVNE PC POPIS */

#pracovne-pc-tvorca {

 position:relative;
 margin:0px auto;
 width:1366px;
 height:571px;
 background-size:100%;
 background-image:url('images/pracovny-pc.webp');
 border: 1px solid #111111;

}

#pracovne-pc-tvorca div {

 position:relative;
 width:580px;
 height:500px;
 left:100px;
 top:90px; 

}

#pracovne-pc-grafika {

 position:relative;
 margin:0px auto;
 width:1366px;
 height:495px;
 background-size:100%;
 background-image:url('images/rtx-quadro.webp');
 border:1px solid #111111;

}

#pracovne-pc-grafika div {

 position:relative;
 width:520px;
 height:500px;
 left:100px;
 top:40px;

}

#pracovne-pc-cpu {

 position:relative;
 margin:0px auto;
 width:1366px;
 height:469px;
 background-size:100%;
 background-image:url('images/threadripper.webp');
 border: 1px solid #111111;

}

#pracovne-pc-cpu div {

 position:relative;
 width:700px;
 height:500px;
 left:100px;
 top:10px;

}

/* PRACOVNE PC POPIS */

/* AKO PREBIEHA STAVBA PC */

#ako-prebieha-stavba {

 position:relative; 
 margin:0px auto; 
 width:1366px; 
 height:1300px;

}

#stavba-tabulka{

 position:relative; 
 width:1366px; 
 height:900px;  
 color:white;
 margin:50px 0px 0px 0px; 
 padding:50px 0px 0px 0px; 
 box-shadow: 80px 80px 80px -80px #DC4A4A; 
 border: 1px solid #222222;
 background:#080808;

}

.stavba-tabulka {

 width:300px; 
 height:400px; 
 float:left; 
 padding:10px;
 margin-right:183px;

}

.stavba-margin-right {

 margin-right:0px;

}

.stavba-margin-left {

 margin-left:50px;

}

/* AKO PREBIEHA STAVBA PC END */

/* NASE SLUZBY PC */

#nase-sluzby-pc {

 position:relative;
 margin:0px auto;
 width:1300px;
 height:500px;
 margin-top:120px;
 margin-bottom:100px;
 
 
}

#tabulka-herne-pc, #tabulka-pracovne-pc  {

 margin-right:102px;

}

#windows {

 background-image: url('images/windows-11.webp');
 height:600px;
 background-size:cover;
 background-position:50% 50%;
 background-attachment: scroll;
 min-width: 1366px;

}

#windows-center {

 position:relative;
 margin:0px auto;
 width:1366px;

}

/* NASE SLUZBY PC END */

/* KONTAKT */

.background4 {

 background:linear-gradient(+25deg, #000000, #434343);
 background:-moz-linear-gradient(+25deg, #000000, #434343);
 background:-webkit-linear-gradient(+25deg, #000000, #434343);
 min-width:1366px;

}

#kontakt {

 position:relative;
 width:1366px;
 height:580px;
 margin:0px auto;
 color:#ffffff;
 font-weight:300;
 padding-top:50px;
  
}

#border {

 border-bottom:1px solid #5f5f5f;
 width:1366px;
 
}

#copyright {

 position:relative;
 width:1366px;
 margin:0px auto;
 text-align:right;
 color:#eee;
 padding-top:20px;
 padding-right:20px;

}

#mapa {

 width:100%;
 height:450px;
   
}

}

/* KONTAKT END */

@media ( max-width:1366px ) {

/* CONTACT BAR */

#contact-bar-center {

 position:relative;
 width:1280px;
 height:35px;
 margin:0px auto;
 z-index:5;
 border-bottom:1px solid #4a4a4a;

}

/* CONTACT BAR END*/

/* MENU */

#menu-bg {

 position:fixed;
 background-color:#111111;
 top:35px;
 height:89px;
 width:100%;
 z-index:5;

}

#center {

 position:relative;
 width:1280px;
 margin:0px auto;
 z-index:5;
  
}

#header {

 top:35px;
 position:fixed;
 width:1280px;
 background-color:#111111;
 
}

#menu {

 position:absolute;
 top:-10px;
 left:200px;
 font-size:18px;

}

#menu li {
 
 float:left;
 margin:30px 19px 30px 0px;
 
}

#responsive, #responsive-icon, #responsive-menu {

 display:none;

}

/* MENU END */

/* PRACOVNE PC VIDEO */

#pracovne-pc-center {

 position:absolute;
 left:50%;
 margin-left:-640px;
 height:700px;
 width:1280px;

}

#pracovne-pc-video h1 {

 text-align:center;
 color:#eeeeee;
 font-size:50px;
 margin-top:150px;

}

/* PRACOVNE PC VIDEO END */

/* PRACOVNE PC POPIS */

#pracovne-pc-tvorca {

 position:relative;
 margin:0px auto;
 width:1280px;
 height:535px;
 background-image:url('images/pracovny-pc.webp');
 border: 1px solid #111111;

}

#pracovne-pc-tvorca div {

 position:relative;
 width:580px;
 height:500px;
 left:50px;
 top:130px; 

}

#pracovne-pc-tvorca h2 {

 text-transform:uppercase;
 color:#ffffff;
 font-size:40px;

}

#pracovne-pc-tvorca p {

 font-size:18px;
 font-weight:300;
 text-align:justify;
 color:#ffffff;

}

#pracovne-pc-grafika {

 position:relative;
 margin:0px auto;
 width:1280px;
 height:463px;
 background-image:url('images/rtx-quadro.webp');
 border:1px solid #111111;

}

#pracovne-pc-grafika div {

 position:relative;
 width:500px;
 height:500px;
 left:50px;
 top:80px;

}

#pracovne-pc-grafika h2 {

 text-transform:uppercase;
 color:#ffffff;
 font-size:40px;

}

#pracovne-pc-grafika p {

 font-size:18px; 
 font-weight:300; 
 text-align:justify; 
 color:#ffffff;

}

#pracovne-pc-cpu {

 position:relative;
 margin:0px auto;
 width:1280px;
 height:440px;
 background-image:url('images/threadripper.webp');
 border: 1px solid #111111;

}

#pracovne-pc-cpu div {

 position:relative;
 width:700px;
 height:500px;
 left:50px;
 top:40px;

}

#pracovne-pc-cpu h2 {

 text-transform:uppercase;
 color:#ffffff;
 font-size:40px;

}

#pracovne-pc-cpu p {

 font-size:18px;
 font-weight:300;
 text-align:justify;
 color:#ffffff;

}

#windows {

 background-image: url('images/windows-11.webp');
 height:600px;
 background-size:cover;
 background-position:50% 50%;
 background-attachment: scroll;
 min-width: 1280px;

}

#windows-center {

 position:relative;
 margin:0px auto;
 width:1280px;

}

#windows-tabulka {

 position:relative;
 margin-left:200px;
 width:800px;
 padding-top:200px;
 color:#ffffff;
 text-align:justify;
 
}

/* PRACOVNE PC POPIS END */

/* AKO PREBIEHA STAVBA PC */

#ako-prebieha-stavba {

 position:relative; 
 margin:0px auto; 
 width:1280px; 
 height:1300px;

}

#stavba-tabulka{

 position:relative; 
 width:1280px; 
 height:900px;  
 color:white;
 margin:50px 0px 0px 0px; 
 padding:50px 0px 0px 0px; 
 box-shadow: 80px 80px 80px -80px #DC4A4A; 
 border: 1px solid #222222;
 background:#080808;

}

.stavba-tabulka {

 width:300px; 
 height:400px; 
 float:left; 
 padding:10px;
 margin-right:140px;

}

.stavba-margin-right {

 margin-right:0px;

}

.stavba-margin-left {

 margin-left:50px;

}

/* AKO PREBIEHA STAVBA PC END */

/* NASE SLUZBY PC */

#nase-sluzby-pc {

 position:relative;
 margin:0px auto;
 width:1200px;
 height:500px;
 margin-top:120px;
 margin-bottom:100px;
 
}

#tabulka-herne-pc {

 position:relative;
 width:356px;
 height:500px;
 float:left;

}

#tabulka-pracovne-pc {

 position:relative;
 width:292px;
 height:500px;
 float:left;
 background-repeat:no-repeat;

}

#tabulka-mini-pc {

 position:relative;
 width:314px;
 height:500px;
 float:left;
 
}

#tabulka-herne-pc, #tabulka-pracovne-pc  {

 margin-right:119px;

}

#herne-pc-img {

 position:absolute;
 top:50px;
 width:356px;
 height:300px;
 background-size:100%;
 background-image:url('images/herne-pc.webp');
 
}

#pracovne-pc-img {

 position:absolute;
 top:50px;
 width:292px;
 height:300px;
 background-size:100%;
 background-image:url('images/pracovne-pc.webp');

}

#mini-pc-img {

 position:absolute;
 top:150px;
 width:314px;
 height:200px;
 background-size:100%;
 background-image:url('images/mini-pc.webp');

}

/* NASE SLUZBY PC END*/

/* KONTAKT */

.background4 {

 background:linear-gradient(+25deg, #000000, #434343);
 background:-moz-linear-gradient(+25deg, #000000, #434343);
 background:-webkit-linear-gradient(+25deg, #000000, #434343);
 min-width:1280px;

}

#kontakt {

 position:relative;
 width:1280px;
 height:625px;
 margin:0px auto;
 color:#ffffff;
 font-weight:300;
 padding-top:50px;
  
}

#mapa-1366 {

 position:absolute;
 top:70px;
 right:20px;
 background-image:url('images/mapa2.webp');
 width:900px;
 height:360px;
 box-shadow:20px 20px #DC4A4A;
 -moz-transition:all 0.5s ease;
 -webkit-transition:all 0.5s ease;
 -ms-transition:all 0.5s ease;
 -os-transition:all 0.5s ease;
 display:block;

}

#mapa-1366:hover {

 opacity:0.8;
 cursor:pointer;

}

#mapa-1600, #mapa-1024, #mapa-768 {

 display:none;

}

#border {

 border-bottom:1px solid #5f5f5f;
 width:1280px;
 
}

#copyright {

 position:relative;
 width:1280px;
 margin:0px auto;
 text-align:right;
 color:#eee;
 padding-top:20px;
 padding-right:20px;

}

#copyright-span {

 float:left;
 padding:20px 20px 0px 20px;
  
}

#mapa {

 width:100%;
 height:450px;
   
}

}

/* KONTAKT END */

@media ( max-width:1280px ) {

/* CONTACT BAR */

#contact-bar-center {

 position:relative;
 width:1024px;
 height:35px;
 margin:0px auto;
 z-index:5;
 border-bottom:1px solid #4a4a4a;

}

.delete {

 display:none;

}

/* CONTACT BAR END*/

/* MENU */

#menu-bg {

 position:fixed;
 background-color:#111111;
 top:35px;
 height:89px;
 width:100%;
 z-index:5;
 
}

#center {

 position:relative;
 width:1024px;
 margin:0px auto;
 z-index:5;
  
}

#header {

 top:35px;
 position:fixed;
 width:1024px;
 background-color:#111111;
 
}

#menu {

 display:none;

}

#responsive {

 position:absolute;
 color:#909090;
 right:10px;
 top:23px;
 font-size:30px;
 font-weight:600;

}

#responsive-icon {

 margin-left:20px;
 font-weight:600;

}

#responsive, #responsive-icon {

 display:inline-block;

}

#responsive-menu {

 position:fixed;
 width:1024px;
 margin:0px auto;
 background-color:rgba(0,0,0,0.9);
 border:1px solid #4a4a4a;
 display:none;
 top:124px;

}

#responsive-menu li {

 color:#878787;
 margin-bottom:13px;
 font-weight:bold;
 width:225px;
 margin-left:400px;

}

#responsive-menu li:first-child {

margin-top:10px;

}

#nase-sluzby-tabulka {

 position:relative; 
 margin-top:10px; 
 width:205px; 
 border:1px solid #4a4a4a; 
 display:none;

}

#nase-sluzby-odkazy {

 position:relative; 
 margin-left:-420px;

}

/* MENU END */

/* PRACOVNE PC VIDEO */

#pracovne-pc-center {

 position:absolute;
 left:50%;
 margin-left:-512px;
 height:700px;
 width:1024px;

}

#pracovne-pc-video h1 {

 text-align:center;
 color:#eeeeee;
 font-size:50px;
 margin-top:150px;

}

/* PRACOVNE PC VIDEO END */

/* PRACOVNE PC POPIS */

#pracovne-pc-tvorca {

 position:relative;
 margin:0px auto;
 width:1024px;
 height:428px;
 background-image:url('images/pracovny-pc.webp');
 border: 1px solid #111111;

}

#pracovne-pc-tvorca div {

 position:relative;
 width:430px;
 height:500px;
 left:65px;
 top:65px; 

}

#pracovne-pc-tvorca h2 {

 text-transform:uppercase;
 color:#ffffff;
 font-size:35px;

}

#pracovne-pc-tvorca p {

 font-size:18px;
 font-weight:300;
 text-align:justify;
 color:#ffffff;

}

#pracovne-pc-grafika {

 position:relative;
 margin:0px auto;
 width:1024px;
 height:371px;
 background-image:url('images/rtx-quadro.webp');
 border:1px solid #111111;

}

#pracovne-pc-grafika div {

 position:relative;
 width:400px;
 height:500px;
 left:65px;
 top:20px;

}

#pracovne-pc-grafika h2 {

 text-transform:uppercase;
 color:#ffffff;
 font-size:35px;

}

#pracovne-pc-grafika p {

 font-size:18px; 
 font-weight:300; 
 text-align:justify; 
 color:#ffffff;

}

#pracovne-pc-cpu {

 position:relative;
 margin:0px auto;
 width:1024px;
 height:352px;
 background-image:url('images/threadripper.webp');
 border: 1px solid #111111;

}

#pracovne-pc-cpu div {

 position:relative;
 width:550px;
 height:500px;
 left:65px;
 top:30px;

}

#pracovne-pc-cpu h2 {

 text-transform:uppercase;
 color:#ffffff;
 font-size:35px;
 margin:0px 0px 35px 0px;
 
}

#pracovne-pc-cpu p {

 font-size:18px;
 font-weight:300;
 text-align:justify;
 color:#ffffff;

}

#windows {

 background-image: url('images/windows-11.webp');
 height:600px;
 background-size:cover;
 background-position:50% 50%;
 background-attachment: scroll;
 min-width: 1024px;

}

#windows-center {

 position:relative;
 margin:0px auto;
 width:1024px;

}

#windows-tabulka {

 position:relative;
 margin-left:65px;
 width:800px;
 padding-top:180px;
 color:#ffffff;
 text-align:justify;
 
}

/* PRACOVNE PC POPIS END */

/* AKO PREBIEHA STAVBA PC */

#ako-prebieha-stavba {

 position:relative; 
 margin:0px auto; 
 width:1024px; 
 height:1300px;

}

#stavba-tabulka{

 position:relative; 
 width:1024px; 
 height:900px;  
 color:white;
 margin:50px 0px 0px 0px; 
 padding:50px 0px 0px 0px; 
 box-shadow: 80px 80px 80px -80px #DC4A4A; 
 border: 1px solid #222222;
 background:#080808;

}

.stavba-tabulka {

 width:300px; 
 height:400px; 
 float:left; 
 padding:10px;
 margin-right:10px;

}

.stavba-margin-right {

 margin-right:0px;

}

.stavba-margin-left {

 margin-left:50px;

}

/* AKO PREBIEHA STAVBA PC END */

/* NASE SLUZBY PC */

#nase-sluzby-pc {

 position:relative;
 margin:0px auto;
 width:356px;
 height:1330px;
 margin-top:100px;
 margin-bottom:100px;
  
}

#tabulka-herne-pc {

 position:relative;
 width:356px;
 height:500px;
 
}

#tabulka-pracovne-pc {

 position:relative;
 width:356px;
 height:500px;
 
}

#tabulka-mini-pc {

 position:relative;
 width:356px;
 height:500px;
  
}

#herne-pc-img {

 position:absolute;
 top:50px;
 width:356px;
 height:300px;
 background-size:100%;
 background-image:url('images/herne-pc.webp');
 
}

#pracovne-pc-img {

 position:absolute;
 left:32px;
 top:50px;
 width:292px;
 height:300px;
 background-size:100%;
 background-image:url('images/pracovne-pc.webp');

}

#mini-pc-img {

 position:absolute;
 left:21px;
 top:50px;
 width:314px;
 height:200px;
 background-size:100%;
 background-image:url('images/mini-pc.webp');

}

.nase-sluzby-popis {

 position:relative;
 text-align:center;
 font-weight:bold;
 font-size:30px;
 top:385px;
 padding:0px;
 margin:0px;

}

.nase-sluzby-popis-top {

 top:270px;

}

/* NASE SLUZBY PC END */

/* KONTAKT */

.background4 {

 background:linear-gradient(+25deg, #000000, #434343);
 background:-moz-linear-gradient(+25deg, #000000, #434343);
 background:-webkit-linear-gradient(+25deg, #000000, #434343);
 min-width:1024px;

}

#kontakt {

 position:relative;
 width:1024px;
 height:1200px;
 margin:0px auto;
 color:#ffffff;
 font-weight:300;
 padding-top:50px;
  
}

#kontakt h3 {

 font-size:25px;
 text-align:center;
 margin-left:-120px;

}

#call {

 background-image:url('images/call.webp');
 width:24px;
 height:24px;
 display:inline-block;
 margin-right:15px;
 margin-left:-39px;

}

#email {

 background-image:url('images/email.webp');
 width:24px;
 height:20px;
 display:inline-block;
 margin-right:15px;
 margin-left:-39px;

}

#location {

 background-image:url('images/location.webp');
 width:24px;
 height:24px;
 display:inline-block;
 margin-right:15px;
 margin-left:-39px;

}

#kontakt ul {

 padding-top:0px;
 padding-left:50px;
 width:308px;
 margin:0px auto;

}

#kontakt li {

 padding-bottom:9px;

}

#kontakt li a {

 color:#eee;
 text-decoration:none;
 -moz-transition:all 0.5s ease;
 -webkit-transition:all 0.5s ease;
 -ms-transition:all 0.5s ease;
 -os-transition:all 0.5s ease;

}

#kontakt li a:hover {

 color:#6b6b6b;

}

#kontakt ul li span {

 font-weight:100;
 font-size:18px;
 
}

#kontakt ul li b {

 background-color:#4267b2;
 padding:0px 5px 0px 10px;
 border-radius:2px;
 font-weight:bold;
 font-size:23px;
 color:#eee;
 margin-right:10px;

}

#facebook {

 position:relative;
 top:50px;
 background-image:url('images/fb.webp');
 width:295px;
 height:123px;
 opacity:0.8;
 margin:0px auto;
 -moz-transition:all 0.5s ease;
 -webkit-transition:all 0.5s ease;
 -ms-transition:all 0.5s ease;
 -os-transition:all 0.5s ease;
 text-align:center;
 color:#eee;
 
}

#facebook:hover {

 opacity:1;

}

#facebook span {

 position:relative;
 top:130px;

}

#mapa-1600 {

 position:relative;
 top:150px;
 right:20px;
 background-image:url('images/mapa.webp');
 width:1000px;
 height:400px;
 box-shadow:20px 20px #DC4A4A;
 -moz-transition:all 0.5s ease;
 -webkit-transition:all 0.5s ease;
 -ms-transition:all 0.5s ease;
 -os-transition:all 0.5s ease;
 margin:0px auto;
 display:block;

}

#mapa-1600:hover {

 opacity:0.8;
 cursor:pointer;

}

#mapa-1366, #mapa-1024, #mapa-768 {

 display:none;

}

.red {

 color:#d66f6f;

}

.red-2 {

 color:#DC4A4A;

}

.green {

 color:#74d66f;

}

.blue {

 color:#80a4e6;

}

#border {

 border-bottom:1px solid #5f5f5f;
 width:1024px;
 margin-top:200px;
 
}

#copyright {

 position:relative;
 width:1024px;
 margin:0px auto;
 text-align:right;
 color:#eee;
 padding-top:20px;
 padding-right:20px;
 
}

#copyright-span {

 float:left;
 padding:20px 20px 0px 20px;
  
}

#mapa {

 width:100%;
 height:450px;
    
}

}

/* KONTAKT END */

@media ( max-width:1024px ) {

/* CONTACT BAR */

#contact-bar-center {

 position:relative;
 width:768px;
 height:35px;
 margin:0px auto;
 z-index:5;
 border-bottom:1px solid #4a4a4a;

}

#contact-bar-info {

 display:none;

}

.delete {

 display:none;

}

/* CONTACT BAR END */

/* MENU */

#menu-bg {

 position:fixed;
 background-color:#111111;
 top:35px;
 height:89px;
 width:100%;
 z-index:5;
 
}

#center {

 position:relative;
 width:768px;
 margin:0px auto;
 z-index:5;
  
}

#header {

 top:35px;
 position:fixed;
 width:768px;
 background-color:#111111;
 
}

#menu {

 display:none;

}

#responsive {

 position:absolute;
 color:#909090;
 right:10px;
 top:23px;
 font-size:30px;
 font-weight:600;

}

#responsive-icon {

 margin-left:20px;
 font-weight:600;

}

#responsive, #responsive-icon {

 display:inline-block;

}

#responsive-menu {

 position:fixed;
 width:768px;
 margin:0px auto;
 background-color:rgba(0,0,0,0.9);
 border:1px solid #4a4a4a;
 display:none;
 top:124px;

}

#responsive-menu li {

 color:#878787;
 margin-bottom:13px;
 font-weight:bold;
 width:225px;
 margin-left:271.5px;

}

#responsive-menu li:first-child {

margin-top:10px;

}

#nase-sluzby-tabulka {

 position:relative; 
 margin-top:10px; 
 width:205px; 
 border:1px solid #4a4a4a; 
 display:none;

}

#nase-sluzby-odkazy {

 position:relative; 
 margin-left:-292px;

}

/* MENU END */

/* PRACOVNE PC VIDEO */

#pracovne-pc-center {

 position:absolute;
 left:50%;
 margin-left:-384px;
 height:700px;
 width:768px;

}

/* PRACOVNE PC VIDEO END */

/* PRACOVNE PC POPIS */

#pracovne-pc-tvorca {

 position:relative;
 margin:0px auto;
 width:768px;
 height:428px;
 background-size: cover;
 background-position: 100% 50%;
 background-repeat:no-repeat;
 background-image:url('images/pracovny-pc.webp');
 border: 1px solid #111111;

}

#pracovne-pc-tvorca div {

 display:none;

}

#pracovne-pc-tvorca-responsive {

 position:relative;
 margin:0px auto;
 width:768px;
 background-color:#111111;
 padding:50px 30px 70px 30px;
 text-align:center;
 color:#ffffff;
 display:block;
}

#pracovne-pc-tvorca-responsive h2 {

 text-transform:uppercase;
 color:#ffffff;
 font-size:35px;

}

#pracovne-pc-tvorca-responsive div {

 position:relative;
 margin:0px auto;
 background:#cc181e;
 width:200px;
 height:3px;

}

#pracovne-pc-tvorca-responsive p {

 font-size:18px;
 font-weight:300;
 text-align:justify;

}

#pracovne-pc-grafika {

 position:relative;
 margin:0px auto;
 width:768px;
 height:371px;
 background-size: cover;
 background-position: 100% 50%;
 background-repeat:no-repeat;
 background-image:url('images/rtx-quadro.webp');
 border:1px solid #111111;

}

#pracovne-pc-grafika div {

 display:none;

}

#pracovne-pc-grafika-responsive {

 position:relative;
 margin:0px auto;
 width:768px;
 background-color:#111111;
 padding:50px 30px 40px 30px;
 text-align:center;
 color:#ffffff;
 display:block;

}

#pracovne-pc-grafika-responsive h2 {

 text-transform:uppercase;
 font-size:35px;

}

#pracovne-pc-grafika-responsive div {

 position:relative;
 margin:0px auto;
 background: #cc181e;
 width:200px;
 height:3px;

}

#pracovne-pc-grafika-responsive p {

 font-size:18px;
 font-weight:300;
 text-align:justify;
 padding:30px;

}

#pracovne-pc-cpu {

 position:relative;
 margin:0px auto;
 width:768px;
 height:352px;
 background-size: cover;
 background-position: 100% 50%;
 background-repeat:no-repeat;
 background-image:url('images/threadripper.webp');
 border: 1px solid #111111;

}

#pracovne-pc-cpu div {

 display:none;

}

#pracovne-pc-cpu-responsive {

 position:relative;
 margin:0px auto;
 width:768px;
 background-color:#111111;
 padding:50px 0px 50px 0px;
 text-align:center;
 color:#ffffff;
 padding:30px;
 display:block;

}

#pracovne-pc-cpu-responsive h2 {

 text-transform:uppercase;
 font-size:35px;

}

#pracovne-pc-cpu-responsive div {

 position:relative;
 margin:0px auto;
 background: #cc181e;
 width:200px;
 height:3px;

}

#pracovne-pc-cpu-responsive p {

 font-size:18px;
 font-weight:300;
 text-align:justify;
 padding:30px;

}

#windows {

 background-image: url('images/windows-11.webp');
 height:600px;
 background-size:cover;
 background-position:50% 50%;
 background-attachment: scroll;
 min-width: 768px;

}

#windows-center {

 position:relative;
 margin:0px auto;
 width:768px;

}

#windows-tabulka {

 position:relative;
 margin-left:65px;
 width:600px;
 padding-top:180px;
 color:#ffffff;
 text-align:justify;
 font-size:18px;
 
}

/* PRACOVNE PC POPIS END */

/* AKO PREBIEHA STAVBA PC */

#ako-prebieha-stavba {

 position:relative; 
 margin:0px auto; 
 width:768px; 
 height:2850px;

}

#stavba-tabulka{

 position:relative; 
 margin:0px auto;
 top:50px;
 width:375px; 
 height:2500px;  
 color:white;
 padding:50px 0px 0px 0px; 
 box-shadow: 80px 100px 80px -80px #DC4A4A; 
 border: 1px solid #222222;
 background:#080808;

}

.stavba-tabulka {

 position:relative;
 margin:0px auto;
 width:375px; 
 height:400px; 
 float:none; 
 padding:10px;
 
}

.stavba-margin-right {

 margin-right:0px;

}

.stavba-margin-left {

 margin-left:0px;

}

.stavba-tabulka ul li:before {
  
 content:'■';
 color: #DC4A4A;
 margin-right:20px;
 margin-left:20px;
  
}

/* AKO PREBIEHA STAVBA PC END */

/* KONTAKT */

.background4 {

 background:linear-gradient(+25deg, #000000, #434343);
 background:-moz-linear-gradient(+25deg, #000000, #434343);
 background:-webkit-linear-gradient(+25deg, #000000, #434343);
 min-width:768px;

}

#kontakt {

 position:relative;
 width:768px;
 height:1200px;
 margin:0px auto;
 color:#ffffff;
 font-weight:300;
 padding-top:50px;
  
}

#kontakt h3 {

 font-size:25px;

}

#call {

 background-image:url('images/call.webp');
 width:24px;
 height:24px;
 display:inline-block;
 margin-right:15px;
 margin-left:-39px;

}

#email {

 background-image:url('images/email.webp');
 width:24px;
 height:20px;
 display:inline-block;
 margin-right:15px;
 margin-left:-39px;

}

#location {

 background-image:url('images/location.webp');
 width:24px;
 height:24px;
 display:inline-block;
 margin-right:15px;
 margin-left:-39px;

}

#kontakt ul {

 padding-top:0px;
 padding-left:50px;
 width:308px;
 margin:0px auto;

}

#kontakt li {

 padding-bottom:9px;

}

#kontakt li a {

 color:#eee;
 text-decoration:none;
 -moz-transition:all 0.5s ease;
 -webkit-transition:all 0.5s ease;
 -ms-transition:all 0.5s ease;
 -os-transition:all 0.5s ease;

}

#kontakt li a:hover {

 color:#6b6b6b;

}

#kontakt ul li span {

 font-weight:100;
 font-size:18px;
 
}

#kontakt ul li b {

 background-color:#4267b2;
 padding:0px 5px 0px 10px;
 border-radius:2px;
 font-weight:bold;
 font-size:23px;
 color:#eee;
 margin-right:10px;

}

#facebook {

 position:relative;
 top:50px;
 background-image:url('images/fb.webp');
 width:295px;
 height:123px;
 opacity:0.8;
 margin:0px auto;
 -moz-transition:all 0.5s ease;
 -webkit-transition:all 0.5s ease;
 -ms-transition:all 0.5s ease;
 -os-transition:all 0.5s ease;
 text-align:center;
 color:#eee;
 
}

#facebook:hover {

 opacity:1;

}

#facebook span {

 position:relative;
 top:130px;

}

#mapa-1024 {

 position:relative;
 top:150px;
 right:20px;
 background-image:url('images/mapa-responsive.webp');
 width:768px;
 height:360px;
 box-shadow:20px 20px #DC4A4A;
 -moz-transition:all 0.5s ease;
 -webkit-transition:all 0.5s ease;
 -ms-transition:all 0.5s ease;
 -os-transition:all 0.5s ease;
 margin:0px auto;
 display:block;

}

#mapa-1024:hover {

 opacity:0.8;
 cursor:pointer;

}

#mapa-1600, #mapa-1366, #mapa-768 {

 display:none;

}

.red {

 color:#d66f6f;

}

.red-2 {

 color:#DC4A4A;

}

.green {

 color:#74d66f;

}

.blue {

 color:#80a4e6;

}

#border {

 border-bottom:1px solid #5f5f5f;
 width:768px;
 margin-top:200px;
 
}

#copyright {

 position:relative;
 width:768px;
 margin:0px auto;
 text-align:right;
 color:#eee;
 padding-top:20px;
 padding-right:20px;
 
}

#copyright-span {

 float:left;
 padding:20px 0px 0px 20px;
  
}

#mapa {

 width:100%;
 height:450px;
    
}

}

/* KONTAKT END */

@media ( max-width:768px ) {

/* CONTACT BAR */

#contact-bar-center {

 position:relative;
 width:375px;
 height:35px;
 margin:0px auto;
 z-index:5;
 border-bottom:1px solid #4a4a4a;

}

#contact-bar-info {

 display:none;

}

.delete {

 display:none;

}

#contact-bar ul {

 margin:0px;
 padding:0px;
 color:#878787;
 height:35px;

}

#contact-bar ul li {
  
 float:right;
 margin:-2px 12px 0px 0px;
 font-size:14px; 

}

#contact-mail {

 display:inline-block; 
 position:relative; 
 top:7px; background-image:url('images/contact-mail.png'); 
 width:24px; 
 height:24px; 
 margin-right:4px;

}

#contact-call {

 display:inline-block; 
 position:relative; 
 top:7px; 
 background-image:url('images/contact-call.png'); 
 width:24px; 
 height:24px; 
 margin-right:4px;

}

#contact-instagram {

 display:inline-block; 
 position:relative; 
 top:7px; 
 background-image:url('images/contact-instagram.png'); 
 width:24px; 
 height:24px; 
 margin-right:0px;

}

#contact-facebook {

 display:inline-block; 
 position:relative; 
 top:7px; 
 background-image:url('images/contact-facebook.png'); 
 width:24px; 
 height:24px; 
 margin-right:0px;

}

#contact-youtube {

 display:inline-block; 
 position:relative; 
 top:7px; 
 background-image:url('images/contact-youtube.png'); 
 width:24px; 
 height:24px; 
 margin-right:0px;

}

/* CONTACT BAR END */

/* MENU */

#menu-bg {

 position:fixed;
 background-color:#111111;
 top:35px;
 height:70px;
 width:100%;
 z-index:5;
 
}

#center {

 position:relative;
 width:375px;
 margin:0px auto;
 z-index:5;
  
}

#header {

 top:28px;
 position:fixed;
 height:70px;
 width:375px;
 background-color:#111111;
 transform:scale(0.8);
 
}

#logo-home {

 position:relative;
 left:-20px; 
 width:196px;
 height:63px;
 margin:12px 10px 12px 10px;
 
}

#logo {

 position:relative;
 background-image:url('images/logo.svg');
 width:196px;
 height:63px;
  
}

#menu {

 display:none;

}

#responsive {

 position:absolute;
 color:#909090;
 right:-10px;
 top:21px;
 font-size:30px;
 font-weight:600;

}

#responsive-icon {

 margin-left:20px;
 font-weight:600;

}

#responsive, #responsive-icon {

 display:inline-block;

}

#responsive-menu {

 position:fixed;
 width:375px;
 margin:0px auto;
 background-color:rgba(0,0,0,0.9);
 border:1px solid #4a4a4a;
 display:none;
 top:105px;

}

#responsive-menu li {

 color:#878787;
 margin-bottom:13px;
 font-weight:bold;
 width:225px;
 margin-left:50px;

}

#responsive-menu li:first-child {

margin-top:10px;

}

#nase-sluzby-tabulka {

 position:relative; 
 margin-top:10px; 
 width:205px; 
 border:1px solid #4a4a4a; 
 display:none;

}

#nase-sluzby-odkazy {

 position:relative; 
 margin-left:-70px;

}

/* MENU END */

/* PRACOVNE PC VIDEO */

#pracovne-pc-video {

 position:relative;
 height:700px;
 margin-top:105px;
 
}

#pracovne-pc-center {

 position:absolute;
 left:50%;
 margin-left:-187.5px;
 height:700px;
 width:375px;

}

#pracovne-pc-video h1 {

 text-align:center;
 color:#eeeeee;
 font-size:40px;
 margin-top:120px;

}

#pracovne-pc-video h2 {

 text-align:center;
 color:#eeeeee;
 font-size:35px;
 font-weight:300;
 
}

/* PRACOVNE PC VIDEO END */

/* PRACOVNE PC POPIS*/

#pracovne-pc-tvorca {

 position:relative;
 margin:0px auto;
 width:375px;
 height:428px;
 background-size: cover;
 background-position: 84% 50%;
 background-repeat:no-repeat;
 background-image:url('images/pracovny-pc.webp');
 border: 1px solid #111111;

}

#pracovne-pc-tvorca-responsive {

 position:relative;
 margin:0px auto;
 width:375px;
 background-color:#111111;
 padding:30px 30px 50px 30px;
 text-align:center;
 color:#ffffff;
 display:block;

}

#pracovne-pc-tvorca-responsive h2 {

 text-transform:uppercase;
 color:#ffffff;
 font-size:35px;

}

#pracovne-pc-tvorca-responsive div {

 position:relative;
 margin:0px auto;
 background:#cc181e;
 width:200px;
 height:3px;

}

#pracovne-pc-tvorca-responsive p {

 font-size:18px;
 font-weight:300;
 text-align:justify;

}

#pracovne-pc-grafika {

 position:relative;
 margin:0px auto;
 width:375px;
 height:371px;
 background-size: cover;
 background-position: 73% 50%;
 background-repeat:no-repeat;
 background-image:url('images/rtx-quadro.webp');
 border:1px solid #111111;

}

#pracovne-pc-grafika-responsive {

 position:relative;
 margin:0px auto;
 width:375px;
 background-color:#111111;
 padding:30px 0px 30px 0px;
 text-align:center;
 color:#ffffff;
 display:block;

}

#pracovne-pc-grafika-responsive h2 {

 text-transform:uppercase;
 font-size:35px;

}

#pracovne-pc-grafika-responsive div {

 position:relative;
 margin:0px auto;
 background: #cc181e;
 width:200px;
 height:3px;

}

#pracovne-pc-grafika-responsive p {

 font-size:18px;
 font-weight:300;
 text-align:justify;
 padding:30px;

}

#pracovne-pc-cpu {

 position:relative;
 margin:0px auto;
 width:375px;
 height:352px;
 background-size: cover;
 background-position: 96% 50%;
 background-repeat:no-repeat;
 background-image:url('images/threadripper.webp');
 border: 1px solid #111111;

}

#pracovne-pc-cpu-responsive {

 position:relative;
 margin:0px auto;
 width:375px;
 background-color:#111111;
 padding:30px 0px 30px 0px;
 text-align:center;
 color:#ffffff;
 display:block;

}

#pracovne-pc-cpu-responsive h2 {

 text-transform:uppercase;
 font-size:35px;

}

#pracovne-pc-cpu-responsive div {

 position:relative;
 margin:0px auto;
 background: #cc181e;
 width:200px;
 height:3px;

}

#pracovne-pc-cpu-responsive p {

 font-size:18px;
 font-weight:300;
 text-align:justify;
 padding:30px;

}

#windows {

 background-image: url('images/windows-11.webp');
 height:600px;
 background-size:cover;
 background-position:50% 50%;
 background-attachment: scroll;
 min-width: 375px;

}

#windows-center {

 position:relative;
 margin:0px auto;
 width:375px;

}

#windows-tabulka {

 position:relative;
 margin-left:0px;
 width:375px;
 padding-top:120px;
 color:#ffffff;
 text-align:justify;
 font-size:18px;
  
}

/* PRACOVNE PC POPIS END */

/* AKO PREBIEHA STAVBA PC */

#ako-prebieha-stavba {

 position:relative; 
 margin:0px auto; 
 width:375px; 
 height:2900px;

}

#ako-prebieha-stavba h2 {

 margin:0px;
 color:#ffffff;
 padding:100px 0px 0px 0px;
 text-align:center;
 font-size:40px;

}

#stavba-tabulka{

 position:relative; 
 margin:0px auto;
 top:50px;
 width:375px; 
 height:2500px;  
 color:white;
 padding:50px 0px 0px 0px; 
 box-shadow: 0px 0px 80px 0px #DC4A4A; 
 border: 1px solid #222222;
 background:#080808;

}

.stavba-tabulka {

 position:relative;
 margin:0px auto;
 width:375px; 
 height:400px; 
 float:none; 
 padding:30px;
 
}

.stavba-margin-right {

 margin-right:0px;

}

.stavba-margin-left {

 margin-left:0px;

}

.stavba-tabulka ul li:before {
  
 content:'■';
 color: #DC4A4A;
 margin-right:20px;
 margin-left:20px;
  
}

/* AKO PREBIEHA STAVBA PC END */

/* TEMY */

.blog-panel{
 
 position:relative;
 margin:0px auto;
 width:375px;
 overflow:hidden;
 background:rgba(255,255,255,0.04);
 border:1px solid rgba(255,255,255,0.06);
 border-radius:28px;
 box-shadow:
    0 20px 60px rgba(0,0,0,0.55),
    0 0 40px rgba(220,38,38,0.08);
}

.topics{

 padding:24px;
 display:flex;
 flex-direction:column;
 gap:18px;
 min-width:375px;
 background-color:#111111;

}

.topic-top{
    
 display:block;
 margin:14px 0px 14px 0px;

}

.tag {

 margin-top:15px;
 padding:7px 14px;
 text-align:center;
 width:100px;
  

}

/* TEMY END */

/* KONTAKT */

.background4 {

 background:linear-gradient(+25deg, #000000, #434343);
 background:-moz-linear-gradient(+25deg, #000000, #434343);
 background:-webkit-linear-gradient(+25deg, #000000, #434343);
 min-width:375px;

}

#kontakt {

 position:relative;
 width:375px;
 height:1300px;
 margin:0px auto;
 color:#ffffff;
 font-weight:300;
 padding-top:90px;
  
}

#call {

 background-image:url('images/call.webp');
 width:24px;
 height:24px;
 display:inline-block;
 margin-right:15px;
 margin-left:-39px;

}

#email {

 background-image:url('images/email.webp');
 width:24px;
 height:20px;
 display:inline-block;
 margin-right:15px;
 margin-left:-39px;

}

#location {

 background-image:url('images/location.webp');
 width:24px;
 height:24px;
 display:inline-block;
 margin-right:15px;
 margin-left:-39px;

}

#kontakt ul {

 padding-top:0px;
 padding-bottom:30px;
 padding-left:50px;
 width:308px;
 margin:0px auto;

}

#kontakt li {

 padding-bottom:9px;

}

#kontakt li a {

 color:#eee;
 text-decoration:none;
 -moz-transition:all 0.5s ease;
 -webkit-transition:all 0.5s ease;
 -ms-transition:all 0.5s ease;
 -os-transition:all 0.5s ease;

}

#kontakt li a:hover {

 color:#6b6b6b;

}

#kontakt ul li span {

 font-weight:100;
 font-size:18px;
 
}

#kontakt ul li b {

 background-color:#4267b2;
 padding:0px 5px 0px 10px;
 border-radius:2px;
 font-weight:bold;
 font-size:23px;
 color:#eee;
 margin-right:10px;

}

#facebook {

 position:relative;
 top:50px;
 background-image:url('images/fb.webp');
 width:295px;
 height:123px;
 opacity:0.8;
 margin:0px auto;
 -moz-transition:all 0.5s ease;
 -webkit-transition:all 0.5s ease;
 -ms-transition:all 0.5s ease;
 -os-transition:all 0.5s ease;
 text-align:center;
 color:#eee;
 
}

#facebook:hover {

 opacity:1;

}

#facebook span {

 position:relative;
 top:130px;

}

#mapa-768 {

 position:relative;
 top:150px;
 right:20px;
 background-image:url('images/mapa-responsive2.webp');
 width:375px;
 height:360px;
 box-shadow:20px 20px #DC4A4A;
 -moz-transition:all 0.5s ease;
 -webkit-transition:all 0.5s ease;
 -ms-transition:all 0.5s ease;
 -os-transition:all 0.5s ease;
 margin:0px auto;
 display:block;

}

#mapa-768:hover {

 opacity:0.8;
 cursor:pointer;

}

#mapa-1600, #mapa-1366, #mapa-1024 {

 display:none;

}

.red {

 color:#d66f6f;

}

.red-2 {

 color:#DC4A4A;

}

.green {

 color:#74d66f;

}

.blue {

 color:#80a4e6;

}

#border {

 border-bottom:1px solid #5f5f5f;
 width:375px;
 margin-top:200px;
 
}

#copyright {

 position:relative;
 width:375px;
 margin:0px auto;
 text-align:right;
 color:#eee;
 padding-top:20px;
 padding-right:20px;
 font-size:16px;
 
}

#copyright-span {

 float:left;
 padding:20px 20px 0px 0px;
 font-size:15px;
 width:375px;
  
}

#mapa {

 width:100%;
 height:450px;
    
}

/* KONTAKT END */

/* Pop up window */

.popup {

 display: none;
 position: fixed;
 top: 65%;
 left: 50%;
 transform: translate(-50%, -70%);
 background: rgba(255,255,255,0.9);
 padding: 10px;
 box-shadow: 0 0 15px rgba(0,0,0,0.3);
 border-radius: 10px;
 z-index: 1000;
 text-align: center;
 width:375px;
  
}

.popup button {

 margin-top: 15px;
 padding: 10px 20px 10px 20px;
 cursor: pointer;
 background-color:#DC4A4A;
 font-size:20px;
 margin-bottom:20px;
 border-radius:10px;
 color:#ffffff;
 border:0px;
 -moz-transition:all 0.5s ease;
 -webkit-transition:all 0.5s ease;
 -ms-transition:all 0.5s ease;
 -o-transition:all 0.5s ease;
 
}
  
.popup button:hover {
    
 background-color:#ae3939;
	
}
  
.overlay {

 display: none;
 position: fixed;
 top: 0; left: 0; right: 0; bottom: 0;
 background: rgba(0,0,0,0.5);
 z-index: 999;
 
}
  
.popup p:first-child {

 text-align:center;
 font-size:25px;
 color:#DC4A4A;
 font-weight:bold;

}
	
.popup p {

 text-align:justify;
 font-size:18px;

}
	
.popup span{

 display:block;
 font-size:18px;
 text-align:center;
 margin-bottom:30px;

}
	
.popup span:first-of-type{
	
 font-size:20px;
	
}
	
.darcek-bg {

 color:#DC4A4A;
 font-size:25px;
	
}

}
