/*
Šablona pro testovací účely v kapitole Webdesign
*/

@font-face {
    font-family: Halenoir;
    src: url('../Font/Halenoi-family/HalenoirCompact-Regular.otf');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: Halenoir;
    src: url('../Font/Halenoi-family/HalenoirCompact-Bold.otf');
    font-weight: bold;
    font-style: normal;
}
@font-face {
    font-family: Halenoir;
    src: url('../Font/Halenoi-family/HalenoirCompact-RegularObl.otf');
    font-weight: normal;
    font-style: italic;
}

html{overflow-y:scroll;} 

body{margin:0; padding:0; font-size:13px; font-family:'Halenoir'; color:#2A422E; background-color: #EBF2EC; background-image:url(/Šablona-layout/images/background.gif); height: 100%;}

.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; border-top-left-radius: 10px;border-bottom-left-radius: 10px;}

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:#2A422E; position: relative;}
.row2{color:#2A422E;}
.row2 a{color:#2A422E; background-color:ebf2ecd3;}
.row3, .row3 a{color:#919191; }

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

#header, #container, #footer{display:block; width:960px; margin:0 auto; padding: 20px;}

nav ul{margin:0; padding:0; list-style:none;}

h1, h2, h3, h4, h5{margin:0; padding:0; font-size:22px; line-height:normal; font-style: bold; font-family: Halenoir;}

h6 {font-family: 'Halenoir'; font-size: 20px ;margin:0; padding:0;}

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-top:10px; 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:25px 100px 0 100px;  background-color:#ebf2ecea; backdrop-filter: blur(9px);;transition: 0.5s;}
#header:hover{transform: scale(1.01);transition: 0.5s;}
#header #hgroup{float:left; margin:0 0 20px 0;}
#header #hgroup h1, #header #hgroup h2{font-weight:normal; font-style:normal; text-transform:none;}
#header #hgroup h1{font-size:50px; font-style: bold;}
#header #hgroup img{height: 100px; width: 300px;}
#header #hgroup img.ani {position: absolute; height: 100px; width: 300px; top:25px; left: 100px; opacity: 1;}
#header #hgroup h2{font-size:15px; padding-top: 5px; font-style: italic; padding-left: 20px; padding-bottom: 5px;}

/*search*/#header form{display:block; width:290px; float:right; margin:36px 0; padding:0;}
/*search*/#header form input{display:block; float:left; width:200px; margin:0; padding:5px; color:#2A422E; background-color:#D9DDD5; border: none; border-radius: 5px;}
/*search button*/#header form #sf_submit{display:block; float:right; width:70px; font-size:12px; font-weight:bold; text-transform:uppercase; color:#EBF2EC; background-color:#2A422E; border:none; cursor:pointer; font-family: 'Halenoir'; transition: 0.5s;}
#header form #sf_submit:hover{color: #2A422E; background-color: #D6D6D6;}
/*link list box*/#header nav{display:block; width:100%; margin:0; padding:20px 0; color:#2A422E; background-color:#2A422E; clear:both; border-radius: 5px; font-family: Halenoir; font-style: bold; font-size: 15px;}
/*link list*/#header nav ul{padding:0 20px;}
/*link list*/#header nav li{display:inline; margin-right:25px; text-transform:uppercase;}
/*link list*/#header nav li.last{margin-right:0;}
/*link list text*/#header nav li a{transition: 0.5s; color:#EBF2EC; background-color:#2A422E; border-radius: 5px;} 
/*link list hover*/#header nav li a:hover{color:#2A422E; transition: 0.5s;background-color:#D9DDD5; padding:9px ; border-radius: 5px;}

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

#container{padding:30px 100px; background-color: #ebf2ecea;backdrop-filter: blur(9px);}
#container section{display:block; margin-bottom:30px; }
#container .last{margin:0;}
#container .more{text-align:right;}

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

#container #slider{width:100%; border-radius: 25px;}
#container #slider figure{transition: 0.5s;}
#container #slider figure:hover{transform: scale(1.01); transition: 0.5s;}
#container #slider figure img{float:right; width:630px; height:300px;transition: 0.5; border-top-right-radius:15px;border-bottom-right-radius:15px;}
#container #slider figure figcaption{display:block; float:left; width:290px; height:260px; padding:20px; overflow:hidden; color:#2A422E; background-color:#D9DDD5; line-height:1.6em;}
#container #slider figure figcaption a{color:#D9DDD5; background-color:#2A422E; padding: 10px; border-radius: 5px;transition: 0.5s;}
#container #slider figure figcaption a:hover{color:#D9DDD5; background-color:#2A422E; padding: 12px; border-radius: 5px; transition: 0.5s;}
#container #slider figure h2{font-size:42px; font-weight:normal; font-style:italic; text-transform:none;}

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

#container #intro{width:100%; margin-bottom:60px; padding-bottom:5px; border-bottom:1px solid #D6D6D6; transition: 0.5s;}
#container #intro:hover{transform: scale(1.01); transition: 0.5s;}
.top3{padding: 3px; border-radius: 5px;transition:0.5s}
.top3:hover{background-color: #d9ddd573; padding: 3px; border-radius: 5px;}
#container #intro section{width:100%;}
#container #intro section article h2{margin-bottom:15px;}
#container #intro section article figure ul{display:block; width:100%; margin:0; padding:0; list-style:none;}
#container #intro section article figure ul li{display:inline-block; margin:0 35px 0 0;border-radius: 5px;}
#container #intro section article figure ul li.obr1 {background-image: url(/Šablona-layout/images/plants/Begonia-Masoniana-Bubble-pot.jpg); max-width: 130px; max-height: 130px;}
#container #intro section article figure ul li.obr2 {background-image: url(/Šablona-layout/images/plants/Alocasia-Silver-Dragon-S-Broadway-Sea-Spray.jpg); max-width: 130px; max-height: 130px;}  
#container #intro section article figure ul li.last{margin:0; background-image: url(/Šablona-layout/images/plants/Peperomia-Watermelon-S--Regent.jpg); max-width: 130px; max-height: 130px;}
#container #intro section article figure ul li div p {line-height: 13px; font-family:'Halenoir';padding-top: 3px;padding-left: 3px; padding-right: 3px; padding-bottom: 0px;}
#container #intro section article figure ul li div p.cena{font-weight: bold}
#container #intro section article figure ul li div h6 {padding-top:3px ;}
#container #intro section article figure ul li div {width:130px; height:130px; margin:0; background-color: #2A422E; opacity: 0; border-radius: 5px; transition: 0.3s; color:#D9DDD5; align-content: center; text-align: center;}
#container #intro section article figure ul li div:hover{transition: 0.3s;opacity: 1; border-radius: 5px;}
#container #intro section article figure figcaption a{display:block; width:42%; margin:30px 0 0 132px; clear:both; text-align:center; text-transform:uppercase; font-weight:bold; padding: 5px; border-radius: 5px; transition: 0.5s ease;}
#container #intro section article figure figcaption a:hover{background-color: #2A422E; color: #EBF2EC;}
#container #homepage{display:block; width:100%; line-height:1.6em;}
#container #homepage section{margin-bottom:0;}
#container #homepage section h2.title{margin:-10px 0 20px 0; padding:0 0 8px 0; font-size:30px; text-transform:uppercase;}
#container #homepage section footer{clear:both;}
#container #homepage section img.imgl {border:none; border-radius: 10px; transition: border-radius 0.5s ease 2s, transform 2s ease;}
#container #homepage section img.imgl:hover {border-radius: 60px; transform: rotate(360deg);transition: border-radius 0.5s ease, transform 2s ease 0.1s;}
/* ------Blog-----*/
#container #homepage section { transition: 0.5s ease; }
#container #homepage section:hover{transform: scale(1.02);  .rm{background-color: #2A422E;padding: 5px;border-radius: 5px;color: #D9DDD5;}}
#container #homepage section article header h2{font-size:13px; font-weight:bold;}
#container #homepage section article address, #container #homepage section article time{font-size:10px; font-style:normal;}
#container #homepage section article footer{text-align:left; padding: 3px; transition: 0.5s;border-radius: 5px;}
.rm{padding: 5px; transition: 0.5s;border-radius: 5px;}

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

#container #homepage section nav li{margin:0 0 8px 0; padding:0 0 5px 0; border-bottom:1px solid #D6D6D6;}
#container #homepage section nav li.last{margin:0;}
#container #homepage section nav a{padding:0 0 0 10px; background:url("../images/icon/point.png") left center no-repeat ;transition: 0.5s;}
#container #homepage section nav a:hover{padding-left:15px;}

/*----------------------------------------------Patička-------------------------------------*/

#footer{padding:20px 100px;background-color:#ebf2ec;}
#footer p{margin:0; padding:0;}

.transition{transition: 0.5s;}
.transition:hover{transform: 1.01;transition: 0.5s;}