@import url('https://fonts.googleapis.com/css2?family=Commissioner:wght@400;500;600;700&display=swap');

:root {
   --doplnkove-base:    #f7931d;
   --hlavni-100:        #0F172A;
   --sede-200:          #E2E8F0;
   --buffer:            90px;
   --transition:        .3s;

 }

 * {
   box-sizing: border-box;
   padding: 0;
   margin: 0;
}

body {
   font-family: 'Commissioner', sans-serif;
   color: var(--hlavni-75);
   font-size: 18px;
   line-height: 140%;
   font-style: normal;
}

/* TYPO*/ 

h1, h2, h3, h4, h5, h6 {
   font-weight: 700;
   font-style: normal;
}
h1 {
   font-size: 42px;
   font-weight: 700;
   line-height: 110%; /* 63.8px */
   margin-bottom: 30px;
}
h2 {
   font-size: 40px;
   font-style: normal;
   font-weight: 700;
   line-height: 110%;
   margin-bottom: calc(var(--buffer)/2);
}

h3, h4 {
   font-size: 24px;
   font-style: normal;
   font-weight: 700;
   line-height: 120%; /* 28.8px */
}
h4 {margin-bottom: 1rem;
font-weight: normal;}

.center {
   text-align: center;
}

ul { margin: 30px 0 60px 1rem;}

.text {
	padding: 60px;
	border-radius: 30px;
	margin-bottom: 30px;
	background-color: var(--sede-200);
}

a {
   text-decoration: none;
   color: var(--doplnkove-base);
   transition: var(--transition);
}

.btn {
   padding: 19px 60px;
   border-radius: 30px;
   background-color: var(--sede-500);
   color: #FFF;
   display: inline-block;
   text-transform: uppercase;
   font-size: 16px;
   font-style: normal;
   font-weight: 700;
   line-height: 140%; /* 22.4px */
   letter-spacing: 0.2px;
   cursor: pointer;
   transition: var(--transition);

   &:hover {
      background-color: var(--doplnkove-base);
   }
}

.btn a { color: #FFF;}


.container {
	width: 100vw;
	min-height: 100vh;
	display: flex;
	 align-items: center;
    justify-content: center;
	 padding: 2rem;
}

.container img {
	width: 250px;
	display: inline-block;
}
.logo {
	display: flex;
	flex-direction: column;
	align-items: center;
}

img { margin-bottom: 3rem;}

body {
	padding:0;
	margin: 0;
	overflow-x: hidden;
	overflow-y: auto;
	width: 100%;
	box-sizing: border-box;
}