Není vybrána žádná položka

Přeskočit na obsah
Jak používat Gymnázium, Praha 4, Na Vítězné pláni 1160 Mail se čtečkou obrazovky

Konverzace
Využíváte 1,4 GB
Spravovat
Programové zásady
Používá technologii Google
Poslední aktivita účtu: před 13 hodinami
Podrobnosti

/* Global*/
*{
    margin: 0;
    padding: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: trasparent;
    line-height: 1.2em;

}

html, body{
    font-family: sofia-pro, sans-serif;
    overflow-x: hidden;
}

header {
    max-width: 1088px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 120px;
}


.picture{
    background-image: url(../img/glass.png);
    background-repeat: no-repeat;
    background-position: bottom;
    background-size: cover;
    width: 100%;
    min-height: 620px;
    position: absolute;
    left: 0;
    top: 0;
    z-index: -2;
}

.title{
    font-size: 65pt;
    font-weight: bold;
    text-align: left;
    padding-left: 10px;
    display: block;
    color: white;
    float: left;
}

.info{
    font-size: 32pt;
    color: white;
    text-align: right;
    display: block;
    float: right;
    padding-right: 10px;
    margin-top: 20px;
}

.nav{
    list-style: none;
    margin: 0;
    padding: 0;
    margin-top: 530px;
    text-align: center;
    
}

.nav li{
    display: inline;
    font-weight: 400;
}

.nav a{
    display: inline-block;
    margin: 0 30px;
    margin-bottom: 15px;
    color: black;
    text-decoration: none;
    font-weight: 400;
    transition: 0.3s;
}

.nav #active{
    color: white;
    border-radius: 15px;
    background-color: #55b559;
    padding: 7px 20px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
    font-weight: 700
}

.nav #active:hover{
    opacity: 1;
}


.nav a:hover{
    opacity: 0.5;
}


/*------------------Content----------------*/
.time{
    margin-top: 10px;
    font-size: 45pt;
    font-weight: 500;
    text-align: center;
}

.content{
    max-width: 1088px;
    height: auto;
    margin-top: 40px;
    margin-left: auto;
    margin-right: auto;
}

.column{
    column-count: 2;
    column-gap: 30px;
    height: auto;
    break-inside: column;
    overflow: visible;
    margin-right: 15px;
}

.item{
    background-color: white;
    width: calc(100% - 15px);
    height: auto;
    border-radius: 20px;
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.2);
    margin: 5px 15px 40px 15px;
    position: relative;
    display: inline-block;
    transition: 0.8s ease;
}

.item:hover{
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.4);
}

.item-header{
    padding: 25px 30px 40px 30px;
    background-color: #55b559;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    color: white;
    box-shadow: 0 6px 10px rgba(0, 0, 0, 0.16);
}

h2{
    font-size: 16pt;
    font-weight: 700;
    margin-bottom: 10px;
}

h3{
    opacity: 0.8;
    font-weight: 400;
    margin-bottom: 10px;
}

.number{
    display: block;
    float: left
}

.ucebna{
    display: block;
    float: right;
}

.popis{
    padding: 20px 30px 25px 30px;
    font-weight: 300;
    color: black;
    line-height: 1.3em;
    text-align: justify;
}


/*Footer*/

footer{
    padding: 30px 0 50px 0;
    display: block;
    text-align: center;
    line-height: 20px;
    font-weight: 300;
    opacity: 0.6;
}


/*Responsive*/

@media only screen and (max-width: 770px){
    body{
        width: 100%;
    }
    
    .header{
        padding-top: 50px;
        width: 100%;
    }
    
    .title{
        padding-left: 20px;
        font-size: 40pt;
        display: block;
        width: 100%;
    }
    
    .picture{
        min-height: 430px
    }
    
    .info{
        display: block;
        float: left;
        text-align: left;
        font-size: 22pt;
        margin: 10px 0 0 20px;
        padding: 0;
    }
    
    .nav{
        margin-top: 400px;
    }
    
    .nav li{
        margin-bottom: 5px;
    }
    
    .content{
        width: 100%;
    }
    
    .column{
        column-count: 1;
        margin-right: 0;
        column-gap: 0;
    }
    
    .item{
        margin-bottom: 20px;
        column-gap: 0px;
        width: calc(100% - 20px);
        margin-left: 10px;
        margin-right: 10px;
    }
}

@media only screen and (max-width: 700px){
    .nav li{
        display: block;
        margin-bottom: 5px;
    }
}



















2.blok.css
Zobrazování položky 2.blok.css.