﻿
.hosting { }
.hosting .slogan{ font-size:1.4rem; color:var(--color03); margin:15px 0 15px 15px; position:relative; }
.hosting .slogan::before {
  content: "„";
  margin-right: 5px;
}

.hosting .slogan::after {
  content: "“";
  margin-left: 5px;
}

.hosting .box1 { max-width:1000px }
.hosting .box1 h1{ margin-bottom:0; margin-top:50px; margin-bottom:30px; }
.hosting .box1 .image-content .ico{ width:340px; height:340px; display:block; border-radius:170px; border:10px solid var(--color10);
                                   box-shadow: 0px 10px 15px -3px rgba(0,0,0,0.1);
overflow:hidden;
transition: transform 0.8s ease;
  transform-origin: center; margin-top:5px; margin-left:60px; background-image:url(/images/servers-lg.webp); background-repeat:no-repeat; background-size:cover; }

.hosting .box1 .slogan { margin-top:30px; }
.hosting .box2 { margin-top:60px; background-color:var(--color04); padding:30px 0; }
.boxes { display:flex; flex-wrap:nowrap; justify-content:center;  }
.boxes .box{ width:300px; margin:25px; }
    .boxes .box .content { border-radius:30px; background-color:var(--color10); padding:15px; text-align:center; }
.boxes .box .ico{ width:100px; height:100px; display:block; margin:15px auto; border-radius: 50px; background-color:var(--color01); text-align:center; }
.boxes .box .ico i{ font-size:30px; line-height:100px; color:var(--color10); }
.hosting .box3 { padding:60px 0; background-color:var(--color04); margin-top:60px; }
.hosting .box4 { padding:60px 0; }
.hosting .buttons { justify-content:flex-start; padding:30px 0; }
.hosting .buttons .button { margin:0 15px; }
.hosting .box5 { background-color:var(--color04); padding:60px 0; }
.hosting .box5 .buttons { margin-top:30px; }
.hosting .box6 { padding:60px 0; padding-bottom:0;  }
.hosting .box6 .text2{  }
.hosting .box6 .text2 .ring{ 
    width: 180px;
    height: 180px;
    display: block;
    border-radius: 90px;
    border: 10px solid var(--color10);
    box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    transition: transform 0.8s ease;
    transform-origin: center;
    margin-top: 5px;
    margin-left: 10px; margin-right:30px;
    background-image: url(/images/michal-greif.webp);
    background-repeat: no-repeat;
    background-size: cover;
}
.hosting .box6 .text2 .flex{ vertical-align:middle; }
.hosting .box5 h2 { margin-bottom:60px; }


    
