/* Less Framework 2, version 2.0 by Joni Korpi ----------------------------- http://lessframework.com */ /* reset.css + hlavni nastaveni */ html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}:focus{outline:0}ins{text-decoration:none}del{text-decoration:line-through}table{border-collapse:collapse;border-spacing:0} *{text-transform:lowercase;} a,a:hover{text-decoration:none;} a:active{position:relative;top:1px;} p,h2{margin-bottom:20px;} .clear{clear:both;} section,footer{margin-bottom:40px;padding-left:22px;clear:both;} h2{font-size:22px;font-family:"Museo 500", sans-serif;} li{width:33%;float:left;} p{line-height:21px;} header,section,footer{display:block;} /* font */ @font-face{font-family:"Museo 300";src:url("http://marekhrabe.eu/fonts/Museo300-Regular.eot");src:local("Museo 300"), local("Museo 300"),url("http://marekhrabe.eu/fonts/Museo300-Regular.otf") format("opentype"),url("http://marekhrabe.eu/fonts/Museo300-Regular.woff") format("woff"),url("http://marekhrabe.eu/fonts/Museo300-Regular.svg#Museo 300") format("svg");} @font-face {font-family:'Museo500';src:url('http://marekhrabe.eu/fonts/museo500-regular-webfont.eot');src:local('☺'), url('http://marekhrabe.eu/fonts/museo500-regular-webfont.woff') format('woff'), url('http://marekhrabe.eu/fonts/museo500-regular-webfont.ttf') format('truetype'), url('http://marekhrabe.eu/fonts/museo500-regular-webfont.svg#webfont7wfwWBNQ') format('svg');font-weight:normal;font-style:normal;} /* barvy */ .uvod a,.chyba a{color:#00c322;} .uvod a:hover,.chyba a:hover{color:#259238;} .projekty a,#projekty a{color:#ff8b00;} .projekty a:hover{color:#bf7e30;} .hudba a,#hudba a{color:#086ca2;} .hudba a:hover{color:#235b79;} .kontakt a,#kontakt a{color:#ff1300;} .kontakt a:hover{color: #bf3a30;} /*.uvod ::selection,.uvod ::moz-selection,.chyba ::selection,.chyba ::moz-selection{background-color:#259238;} .projekty ::selection,.projekty ::moz-selection{background-color:#bf7e30;} .hudba ::selection,.hudba ::moz-selection{background-color:#235b79;} .kontakt ::selection,.kontakt ::moz-selection{background-color: #bf3a30;}*/ /* Default 5-column, 768 px layout for iPads, netbooks, and IE (All other layouts inherit styles from this layout) ----------------------------------------------------------- 1 2 3 4 5 120px 264px 408px 552px 696px (24px gutters) */ body{padding:60px 36px 60px;width:696px;font-family:"Museo 300",sans-serif;text-shadow:rgba(255,255,255,0.03) 0px 1px 1px;} header{height:75px;} h1{display:inline;float:left;position:relative;top:-20px;} h1 a,h1 a:visited{text-indent:-10000px;display:block;width:324px;height:95px;background:url(images/logo.png) top left no-repeat;color:#00c322;} h1 a:hover{background-position:bottom left;} nav{float:right;} nav li{float:left;} nav a{display:block;background-position:top left;background-repeat:no-repeat;text-indent:-999999px;} nav a:hover{background-position:bottom left;} #projekty a{width:126px;height:79px;background-image:url(images/projekty.png);} #hudba a{width:117px;height:40px;background-image:url(images/hudba.png);} #kontakt a{width:127px;height:67px;background-image:url(images/kontakt.png);} section#ilustrace{background-repeat:no-repeat;} #mail span{display:inline-block;} .uvod #ilustrace{background-image:url(images/ahoj.png);min-height:151px;padding-left:330px;} .projekty #ilustrace{background-image:url(images/pc.png);min-height:152px;padding-left:210px;} .hudba #ilustrace{background-image:url(images/sluchatka.png);min-height:173px;padding-left:160px;} .kontakt #ilustrace{background-image:url(images/mobil.png);min-height:198px;padding-left:200px;} .chyba #ilustrace{background-image:url(images/plac.png);min-height:112px;padding-left:160px;} #seznam p{width:95%;} #seznam img{margin-top:10px;} footer{margin-bottom:20px;} #copy{float:right;position:relative;left:22px;background:url(images/copy.png) bottom right no-repeat;} #copy a{display:block;text-indent:-10000px;width:141px;height:23px;margin:7px 17px 0 0;} /* 2-column, 320 px layout for smartphones --------------------------------------- 1 2 120px 264px (24px gutters) */ @media only screen and (max-width: 767px) { body{padding:48px 10px 50px 20px;width:273px;} header,section,footer{margin-bottom:20px;padding-left:0;} h1{position:relative;left:-32px;top:-30px;} h1 a{width:315px;} h1 a,h1 a:visited{background:url(images/logo.png) top left no-repeat;} nav{position:relative;left:-28px;top:-40px;width:274px;} #projekty a{position:relative;left:0px;} #hudba a{position:relative;left:3px;top:5px;} #kontakt a{position:relative;left:7px;} #ilustrace{position:relative;top:-30px;} .uvod #ilustrace{background-position:-10px 10px;min-height:151px;padding-left:0;width:275px;} .uvod #ilustrace h2{margin-bottom:130px;} .projekty #ilustrace{background-position:90px -10px;padding-left:0;} .projekty #ilustrace p{width:120px;} .projekty #ilustrace p:last-child{width:auto;} .hudba #ilustrace{background-position:140px -5px;padding-left:0px;} .hudba #ilustrace p{width:160px;} .hudba #ilustrace p:last-child{width:270px;} .kontakt #ilustrace{background-position:112px -20px;padding:0;} .kontakt #ilustrace p{width:150px;} .kontakt #ilustrace li p{width:260px;} .chyba #ilustrace{min-height:112px;padding-left:160px;} section li{float:none;width:200px;margin-bottom:40px;} footer{width:260px;margin-top:-0px;} } /* 8-column, 1224 px layout for desktops and laptops ------------------------------------------------------------------------ 1 2 3 4 5 6 7 8 120px 264px 408px 552px 696px 840px 984px 1128px (24px gutters) */ @media only screen and (min-width: 1224px) { body{padding:72px 180px 60px;width:900px;} #hudba a,#projekty a{margin-right:80px;} } body{display: none;}html{height:100%;background:url(images/wait.jpg) no-repeat center center}