@import url("https://fonts.googleapis.com/css2?family=Kanit:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");
/*
Šablona pro testovací účely v kapitole Webdesign
*/

html{overflow-y:scroll;} 

body{margin:0; padding:0; font-size:13px; font-family: "Kanit"; color:#919191; background-color:#232323;}

.clear:after{content:"."; display:block; height:0; clear:both; visibility:hidden; line-height:0;}
.clear{display:block; clear:both;}
html[xmlns] .clear{display:block;}
* html .clear{height:1%;}

a{outline:none; text-decoration:none;}

code{font-weight:normal; font-style:normal; font-family:Georgia, "Times New Roman", Times, serif;}

.fl_left{float:left;}
.fl_right{float:right;}

img{margin:0; padding:0; border:none; line-height:normal; vertical-align:middle;}
.imgholder, .imgl, .imgr{padding:4px; border:1px solid #D6D6D6; text-align:center;}
.imgl{float:left; margin:0 15px 15px 0; clear:left;}
.imgr{float:right; margin:0 0 15px 15px; clear:right;}

/*----------------------------------------------HTML 5 přepisy - na toto se nezaměřujte-------------------------------------*/

address, article, aside, figcaption, figure, footer, header, nav, section{display:block; margin:0; padding:0;}
q{display:block; padding:0 10px 8px 10px; color:#979797; background-color:#ECECEC; font-style:italic; line-height:normal;}
q:before{content:'� '; font-size:26px;}
q:after{content:' �'; font-size:26px; line-height:0;}

/* ----------------------------------------------Obal-------------------------------------*/

div.wrapper{display:block; width:100%; margin:0; padding:0; text-align:left;}

.row1, .row1 a{color:#c0b6b6; background-color:#3c4d65;}
.row2{color:#595959; background-color:rgb(232, 232, 232);}
.row2 a{color:#5eba00; background-color:rgb(232, 232, 232);}
.row3, .row3 a{color:#919191; background-color:#232323;}

/*----------------------------------------------Základní nastavení prvků na webu-------------------------------------*/

#header, #container, #footer{display:block; width:960px; margin:0 auto}
#header {font-size:17px;}
nav ul{margin:0; padding:0; list-style:none;}

.headermenu ul{display: flex; justify-content: space-around;}
h1, h2, h3, h4, h5, h6{margin:0; padding:0; font-size:22px; font-weight:normal; font-style:italic; line-height:normal;}

address{font-style:normal;}

blockquote, q{display:block; padding:8px 10px; color:#979797; background-color:#ECECEC; font-style:italic; line-height:normal;}
blockquote:before, q:before{content:'� '; font-size:26px;}
blockquote:after, q:after{content:' �'; font-size:26px; line-height:0;}

form, fieldset, legend{margin:0; padding:0; border:none;}
legend{display:none;}
input, textarea, select{font-size:12px; font-family:Georgia,"Times New Roman",Times,serif;}

.one_quarter, .two_quarter, .three_quarter, .four_quarter{display:block; float:left; margin:0 20px 0 0;}
.one_quarter{width:225px;}
.two_quarter{width:470px;}
.three_quarter{width:715px;}
.four_quarter{width:960px; float:none; margin-right:0; clear:both;}

.one_third, .two_third, .three_third{display:block; float:left; margin:0 30px 0 0;}
.one_third{width:300px;}
.two_third{width:630px;}
.three_third{width:960px; float:none; margin-right:0; clear:both;}

.lastbox{margin-right:0;}

/*----------------------------------------------Hlavička-------------------------------------*/

#header{padding:15px;}

#header #hgroup{float:left; margin:0 0 10px 0;}


#header form{display:block; width:300px; float:right; margin:25px 0; padding:0;}
#header form input{display:block; float:left; width:200px; margin:0; padding:7px; font-weight: bold; color:#e8e8e8; background-color:rgb(59, 59, 59); border:1px solid rgb(60, 59, 59);}
#header form #sf_submit{display:block; float:right; width:77px; font-size:12px; text-transform:uppercase; color:#FFFFFF; background-color:#e90000; border:none; cursor:pointer;}
#header form #sf_submit:hover{transition: transform 0.2s ease-in-out; transform: scale(1.05);}
#header nav{display:block; width:100%; margin:0; padding:20px 0; background-color:#222222; clear:both; border-radius: 5px;}
#header nav ul{padding:0 20px;}
#header nav li{display:inline; margin-right:30px;}
#header nav li.last{margin-right:0;}
#header nav li a{color:rgb(234, 234, 234); background-color:#222222; font-weight: 400;}
#header nav li a:hover{color:#ffffff; background-color:#222222;}

/*----------------------------------------------Obsah-------------------------------------*/

#container{padding:30px 0;}
#container section{display:block; margin-bottom:30px; padding:0;}
#container .last{margin:0;}
#container .more{text-align:right;}

/* ------Slider-----*/

#container #slider{width:100%;}
#container #slider figure{}
#container #slider figure img{float:right; width:630px; height:300px;}
#container #slider figure figcaption{display:block; float:left; width:290px; height:260px; padding:20px; overflow:hidden; color:#cbcbcb; background-color:#414141; line-height:1.7em; font-size: 14px;}
#container #slider figure figcaption a{color:#5eba00; background-color:#414141; font-weight: 400; font-size: 16px; font-style: italic;}
#container #slider figure h2{font-size:39px; font-weight: 500; font-style:oblique; text-transform:none; color: rgb(238, 239, 238);}
#container #slider figure footer{}

/* ------Hlavní obsah-----*/

#container #intro{width:100%; margin-bottom:30px; padding-bottom:15px; border-bottom:1px solid #7c7c7c;}
#container #intro section{width:100%;}
#container #intro section article{display: flex; justify-content: center;}
.prvnicast {background-color: #a3a3a3; padding: 13px; border-radius: 10px;}
#container #intro section article h2{margin-bottom:15px; font-weight: 500; font-size: 29px; color: #f4f4f4;}
#container #intro section article p{color: rgb(70, 70, 70); font-size: 16px;}
#container #intro section article figure ul{display:block; width:100%; margin:55px 0 0 0; padding:0; list-style:none;}
#container #intro section article figure ul li{display:inline; float:left; margin:0 25px 5px 0;}
#container #intro section article figure ul li.last{margin:0;}
#container #intro section article figure ul li img{width:130px; height:130px; margin:0; border: 2px solid #d0d0d0; border-radius: 3px;}
#container #intro section article figure figcaption{display:block; width:100%; margin-top:20px; clear:both; text-align:center; text-transform:uppercase; font-weight:bold;}
.two_quarter figcaption a {background-color: #414141; padding: 10px; border-radius: 5px; font-size: 14px; font-weight: 450;}
#container #homepage{display:block; width:100%; line-height:1.6em;}
#container #homepage section{margin-bottom:0;}
#container #homepage section h2.title{margin:0 0 18px 0; padding:0 0 8px 0; font-size:17px; font-weight:bold; text-transform:uppercase;}
#container #homepage section footer{clear:both;}

/* ------Blog-----*/

#container #homepage section article header h2{font-size:14px; font-weight:bold;}
#container #homepage section article address, #container #homepage section article time{font-size:11px; font-style:normal;}
#container #homepage section article footer{text-align:left;}

/* ------Odkazy-----*/

#container #homepage section nav li{margin:0 0 8px 0; padding:0 0 5px 0; border-bottom:1px solid #cacaca;}
#container #homepage section nav li.last{margin:0;}
#container #homepage section nav a{padding:0 0 0 10px; background:url("../images/arrow.gif") left center no-repeat; color: rgb(82, 82, 82);}
.imgl{border: 2px solid rgb(208, 208, 208); border-radius: 1px; padding: 0;}
/*----------------------------------------------Patička-------------------------------------*/

#footer{padding:23px 0;}
#footer p{margin:0; padding:0; font-size: 14px;}