* {margin: 0px; padding: 0px; -webkit-user-select: none;}

html {width: 100%;}
body {width: 100%; font-family: 'Open Sans', sans-serif; font-weight: 300;font-size: 16px; max-width: 840px; margin: 0px auto;}

#kontaktmain {width: 100%; max-width: 600px; margin: 0px auto; }
#logo {margin-top: 40px; width: 160px;}
.kontakt {float: right; margin-top: 66px;}
.kontakt div {margin-bottom: 15px;}
.name {font-weight: 600;}
.mailing {display: none;}
.calling {display: none;}

#navigation {clear: both;width: 740px;margin: 0px auto;padding: 28px 50px;list-style-type: none;border-bottom: 1px solid rgba(0, 0, 0, 0.1);height: 115px;}
#navigation li {float: left;}
#navigation li a div {height: 50px;width: 50px;margin: 0px auto 13px; border-radius: 21%;}
#navigation li a {display: block;text-decoration: none;padding: 25px 0px 18px;margin-right: 40px;}
#navigation li a:hover {background: url('img/arrowdown.svg') no-repeat;background-position: center bottom -5px;}

#navicon1 {background: url('img/chaptericonone.jpg');background-size: cover;background-repeat: no-repeat;}
#navicon2 {background: url('img/detskahriste.svg');background-size: cover;background-repeat: no-repeat;}
#navicon3 {background: url('img/mestskymobiliar.svg');background-size: cover;background-repeat: no-repeat;}
#navicon4 {background: url('img/reference.svg');background-size: cover;background-repeat: no-repeat;}                                                      

.chapter {padding: 50px; border-bottom: solid 1px rgba(0, 0, 0, 0.15);clear: both;}
.chapter h2 {font-weight: 300;float: left;margin-left: 31px;margin-top: 18px;}
.chapter h3 {font-weight: 300;margin: 2em 0 0.8em;}
.chapter h4 {font-weight: 300;margin: 1.5em 0 0.6em;}
.chapter p {clear: both; text-align: justify;}

.textlist {margin-top: 25px; list-style-position: inside;}
.textlist li {margin-bottom: 3px;}

.links {list-style-type: none; margin: 20px 0px;}
.links li {background: url(img/arrowout.svg) no-repeat right 15px top 10px; width: 320px;}
.links a {text-decoration: none; display: block; position: relative;padding: 13px 13px 10px 40px;font-weight: 600;}
.links a img {position: absolute; margin: -4px 0px 0px -40px; width: 29px; height: 29px;}

.chaptericon {float: left; width: 57px;height: 57px;margin-bottom: 34px;}
#chaptericonone {background: url('img/chaptericonone.jpg'); background-size: cover;}
#chaptericontwo {background: url('img/detskahriste.svg'); background-size: cover;}
#chaptericonthree {background: url('img/mestskymobiliar.svg'); background-size: cover;}
#chaptericonfour {background: url('img/reference.svg'); background-size: cover;}



#chapterimage2  {
width: 740px;
clear: both;
margin-bottom: 20px;
position: relative;
}

#footer img {display: block;
width: 66px;
margin: 10px auto;}


@media (max-width: 850px) {
#navigation {width: 100%; padding: 20px 0px;}
#navigation li a {margin: 0px 20px;}
#chapterimage2 {width: 100%;}

}

@media (max-width: 640px) {
#logo {margin: 29px auto 40px; width: 148px; display: block;}
#navigation {width:100%; padding: 0px; border: none; height: auto;}
#navigation li {float: inherit; background: url(img/arrowdown.svg) no-repeat right 15px top 10px;background-color: #f5f4fa;}
#navigation li a {margin: 0px 30px; padding: 13px 22px;font-weight: 600;}
#navigation li a:hover {background: none;}
#navigation li a div {height: 29px;
width: 29px;
border-radius: 21%;
margin-left: -37px;
margin-top: -4px;position: absolute;}
.kontakt {margin: 0px 0 0 15px; float: left;}
.chapter {padding: 30px;}
.chaptericon {margin: 0px auto; float: none;}
.chapter h2 {float: none;margin: 1em 0 0.5em; text-align: center;}
.links {margin: 22px 0px 0px}
.links li {width: 100%;}
.links a {}
}
