body{
    font-family: 'Karla',Helvetica,Arial,Lucida,sans-serif;

    font-weight: 400;
	font-size: 17px;
    line-height: 26px;
    text-transform: none;
    color: #20272e;	
	overflow-x:hidden;
}

@font-face {
    font-family: ShadowsIntoLight;
    src: url(/css/ShadowsIntoLight-Regular.ttf);
}

table{
	width:100%;
	table-collapse:collapse;
}

.table>:not(:first-child) {
    border-top: 0px solid currentColor !important;
}

h1, h2, h3, h4, h5, h6 {
    font-family: Roboto;
	color: rgb(180,180,180)!important;
}

h1{
	font-size: 48px;
	line-height: 70px;
	font-weight: 300;
	letter-spacing: 0px;
	color: #1E1E1E;	
}

h2{
	font-family: ShadowsIntoLight,handwriting;
	font-size: 34px;
	color: #1E1E1E;	
	font-weight: 300;
	color: #555!important;
}

h3 {
	font-family: ShadowsIntoLight,handwriting;
    font-size: 34px;
    line-height: 40px;
    text-transform: none;
    letter-spacing: 0px;
    color: #555!important;
	font-weight:300;
}

h4 {
	font-family: ShadowsIntoLight,handwriting;
    font-size: 18px;
    text-transform: none;
    letter-spacing: 3px;
	color: #555!important;
	font-weight: 300;
}

h5 {
 font-size: 20px;
	color: #555!important;
}

a {
    text-decoration: none;
	color: rgb(68,74,103);
}

a:hover {
	color: rgb(68,74,103);
}

.subpage p a:not(.button){
	font-weight:bold!important;
	color: rgb(14 146 0)!important;
}

.navbar-brand{
	font-family: ShadowsIntoLight,handwriting;
	font-size: 30px;
    letter-spacing: 2px;
}

.nav-link{
	color:black!important;
	font-size: 16px;
	text-transform: uppercase;
}

.nav-link:hover, .nav-link:active{
	color:#045d7f!important;
}

img{
    -webkit-transition: all .25s ease;
    -moz-transition: all .25s ease;
    transition: all .25s ease;	
}

img:hover{
	
}

.button{
	border-width: 2px;
    border-style: solid;
    border-color: hsl(0,0%,25%);
    border-radius: 0.2em;
    background-color: hsla(0,0%,100%,0.63);
    box-shadow: 0em 0em 0em 0em rgb(0 0 0 / 25%);
	padding:10px 20px;
	letter-spacing: 0.5px;
    font-size: 14px;
    font-weight: 500!important;
    text-transform: uppercase!important;
	color: hsl(0,0%,0%)!important;
white-space: nowrap;
    -webkit-transition: all .25s ease;
    -moz-transition: all .25s ease;
    transition: all .25s ease;		
}

.button:hover{
	background-color: #bababa88;
	color: hsl(0,0%,0%);
	text-decoration: none;	
    box-shadow: 0 7px 14px rgba(50, 50, 93, 0.08), 0 3px 6px rgba(0, 0, 0, 0.04);
    -webkit-box-shadow: 0 7px 14px rgba(50, 50, 93, 0.08), 0 3px 6px rgba(0, 0, 0, 0.04);
    -moz-box-shadow: 0 7px 14px rgba(50, 50, 93, 0.08), 0 3px 6px rgba(0, 0, 0, 0.04);
    -webkit-transform: translateY(-2px);
    -moz-transform: translateY(-2px);
    transform: translateY(-2px);	
}

.button.transparent{
	background:transparent!important;
	color:white !important;
	border-color:white !important;
}

.button.transparent:hover{
	background-color: #bababa55!important;
}

button{
	height:40px!important;
	    padding: 6px 20px!important;
}

#top-info{
	height: 40px;
	background:rgba(255, 255, 255, 0.54);
	padding-top: 8px;
	border-bottom:1px solid rgba(221,221,221,0.54);
}

#top-nav{
	transition: all .6s ease 0s;
	background:rgba(255, 255, 255, 0.74);
	border-bottom:1px solid rgba(221,221,221,0.54);
	z-index:2100;
	position:relative;
	min-height: 75px;
    line-height: 45px;
}

.pos-abs{
	position:fixed !important;
    top: -500px;
    right: 0;
    left: 0;
    z-index: 1030;	
}

.pos-abs-visible{
	 top: 0;
	 background:rgba(255, 255, 255, 0.9)!important;
}

/**/

.nav-tabs .active{
	border-top-color: #c3c4c6;
    border-top-style: solid;
    border-top-width: 1px;
    border-right-color: #c3c4c6;
    border-right-style: solid;
    border-right-width: 1px;
    border-left-color: #c3c4c6;
    border-left-style: solid;
    border-left-width: 1px;
    border-image-source: initial;
    border-image-slice: initial;
    border-image-width: initial;
    border-image-outset: initial;
    border-image-repeat: initial;
}

/**/

@media all and (min-width: 992px) {
	.navbar .nav-item .dropdown-menu{ display: none; }
	.navbar .nav-item:hover .nav-link{ color: #fff;  }
	.navbar .nav-item:hover .dropdown-menu{ display: block; }
	.navbar .nav-item .dropdown-menu{ margin-top:0; }
	
	.dropdown-menu{min-width:300px;}
}

.dropdown-menu .nav-item .nav-link{padding-left:20px!important;}

/**/

.dropdown-menu.show{
	z-index: 10000;	
}


/**/

#hero{
	position:relative;
	display: -moz-flex;
    display: -ms-flexbox;
    display: -webkit-box;
    display: flex;
    -ms-flex-flow: row;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    flex-flow: row;
	
	
	background:url(/images/hero.jpg);
	background-size: cover;
    background-position: center center;
	min-height:800px
}

#hero #mousewheel{
	position:absolute;left:0;bottom:10px;text-align:center;width:100%;
	cursor:pointer;
}

#hero .center{
	-webkit-align-self: center;
    -ms-align-self: center;
    -ms-flex-item-align: center;
    align-self: center;
	padding-left:20%;
}

#hero h1{
	color:white !important;
	font-family: ShadowsIntoLight,handwriting;
    font-size: 60px;
    letter-spacing: -1px;	
}

#hero h4{
	color:white !important;
}

#hero p{
	margin:25px 0;
	color:white !important;
	font-size: 25px;
}

/**/

#info{
	padding:50px 0;
	background-color: hsl(0,0%,93%);
	color:black;
}

#info h2{
	color:black !important;
	 text-transform: uppercase!important;
}

#info i{
	font-size: 30px;
	padding:20px;
	border-radius:50%;
	background-color: #bababa;
	color: hsl(0,0%,0%);
}

/**/

#welcome{
	margin:100px 0;
}
#welcome h2{
	font-weight:700;
}


/**/

#books{
	background: #f2eada80;
	padding:50px 0;
}

#books .book{
	background:white;
	padding:20px 10px;
	box-shadow: 8px 8px 10px 0px rgb(0 0 0 / 6%);
}

#books h2{
	font-weight:700;
	margin:0 auto;
	width:250px;
	border-bottom:2px solid lightgray
}

#books h3{
}


/**/

#blog{
	background: url(/images/blog_bg.jpg);
	padding:50px 0;
	color:white!important;
}

#blog .button{
	border-color:white!important;
}

#blog h2{
	color:white!important;
}

#blog h4{
	color:white!important;
	font-size:32px!important;
}

/**/

#testi h2{
	font-weight:700;
	margin:0 auto;
	width:200px;
	border-bottom:2px solid lightgray
}

#testi{
	background-color: hsl(0,0%,89%);
	padding:50px 0;
	font-size:16px;
}


#testi img{
	border-radius:50%;
	width:60%;
	margin:0 auto;
}

/**/

#contact{
	background: url(/images/contact_bg.jpg);
	background-size: cover;
    background-position: top center;
    background-attachment: fixed;
	padding:50px 0;
	color:white!important;
}

#contact h2{
	color:white!important;
}



#contact div{
	-webkit-align-self: center;
    -ms-align-self: center;
    -ms-flex-item-align: center;
    align-self: center;
}

/**/

#footer-info-line{
	background-color: #f2eada!important;
}

#footer-info-line i{
font-size: 18px;
    padding: 12px;
    border-radius: 50%;
    background-color: #fff;
    color: black;
    width: 42px;
}

#footer-line{
	font-size:14px;
}

/****/

.owl-nav {
  position: absolute;
  width:100%;
  top: 50%;
}

.owl-nav button{
	background-color:transparent !important;
	color:#06043ae6!important;
}

.owl-nav button:hover{
	background-color:transparent !important;
	color:#2d62d7dd!important;
}

.owl-prev {
	left: 0;
	position: absolute;
	margin-top: -50px!important;
}

.owl-next {
	right: 0;
	position: absolute;
	margin-top: -50px!important;
}

.owl-dots {
    margin-top: 40px;
}

/*******/

.dizzy {
  /* Start the shake animation and make the animation last for 0.5 seconds */
  animation: shake 0.5s;

  /* When the animation is finished, start again */
  animation-iteration-count: infinite;
}

@keyframes shake {
  0% { transform: translate(1px, 1px) rotate(0deg); }
  10% { transform: translate(-1px, -2px) rotate(-1deg); }
  20% { transform: translate(-3px, 0px) rotate(1deg); }
  30% { transform: translate(3px, 2px) rotate(0deg); }
  40% { transform: translate(1px, -1px) rotate(1deg); }
  50% { transform: translate(-1px, 2px) rotate(-1deg); }
  60% { transform: translate(-3px, 1px) rotate(0deg); }
  70% { transform: translate(3px, 1px) rotate(-1deg); }
  80% { transform: translate(-1px, -1px) rotate(1deg); }
  90% { transform: translate(1px, 2px) rotate(0deg); }
  100% { transform: translate(1px, -2px) rotate(-1deg); }
}

.form-floating label {
    left: 0.875rem;
}

input[type=text], input[type=email], textarea {
  -webkit-transition: all 0.30s ease-in-out;
  -moz-transition: all 0.30s ease-in-out;
  -ms-transition: all 0.30s ease-in-out;
  -o-transition: all 0.30s ease-in-out;
  outline: none;
  padding: 3px 0px 3px 3px;
  margin: 5px 1px 3px 0px;
  border: 1px solid #DDDDDD!important;
}
 
input[type=text]:focus,input[type=email]:focus,textarea:focus {
  box-shadow: 0 0 5px #41464b!important;
  padding: 3px 0px 3px 3px;
  margin: 5px 1px 3px 0px;
  border: 1px solid #41464b!important;
}

/**/

#megjelen{
	padding:120px 0 100px 0;
}

#megjelenCarousel {
  .owl-nav {
    padding-top: .4em;
    font-family: sans-serif;
    font-size: .8em;
    > div {
      padding: .4em 1.4em;
      border: 1px solid #333;
      background: #000;
      color: white;
      border-radius: .4em;
      background-image: linear-gradient(rgba(255, 255, 255, .3), rgba(0, 0, 0, .2));
      box-shadow: .1em .1em .4em rgba(0, 0, 0, .5);
      &:hover {
        background-color: #333;
      }
    }
    .owl-prev {
      float: left;
    }
    .owl-next {
      float: right;
    }
  }
}

/**/

.grayNotHover{
	-webkit-transition: all .3s ease 0s;
	-moz-transition: all .3s ease 0s;
	transition: all .3s ease 0s;
	filter: grayscale(100%);
}

.grayNotHover:hover{
	filter: grayscale(0%);
}

/**/

.innerSection1{
	background-color: #ededed!important;
	min-height:200px;
	padding:32px 0;
}
.innerSection2{
	background-color: #f2eada!important;
	min-height:200px;
	padding:32px 0;
}