/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 21 Αυγ 2020, 7:20:05 πμ
    Author     : EIRINI
*/
h1, h2{
    font-family: 'Open Sans Condensed', sans-serif;
    font-weight: 300;
    color: black;
}
h2{
    font-size:x-large;   
}
a {
    text-decoration: none;
}
.main-search{
    height:76vh;
    background-image: url("../Images/main_search_image_mobile.jpg") ;
    background-size: cover;
}
.title_to_bottom{
    position: absolute;
    bottom: 3.8em;
}
.availability-search{
   background-image: url("../Images/shutterstock_744768853_tab.jpg") ;
}
.real_wed_search {
   padding-top: 15px;
   background-image: url("../Images/shutterstock_565429669 small.jpg") ;  
}
.availability-search, .real_wed_search {
    height:38vh;
    background-size: cover; 
    background-repeat: no-repeat;
    background-origin: content-box;
}
.availability-search h2, .real_wed_search h2{
	font-size:large; 
}
.button-main {
  padding: 0.6em 0.6em;
  text-align: center;
  background-color: white;
  color: #9fa6a1;
  font-family: 'Open Sans Condensed', sans-serif;
  font-size: 16px;
  border-radius: 22px;
  border: 2px solid lightgrey;
  transition-duration: 0.3s;
}
.button-main:hover {
    background-color: lightgrey;
    color: white;
    border-color: white;
}
.button-container {
    position: absolute;
    bottom: 1.3em;
}
.input_search_box {
    box-sizing: border-box;
    border: 0;
    border-radius: 22px 0 0 22px;
    color: gray;
    font-size: 16px;
    line-height: normal;
    height: 100%;
    padding: 10px 5px 10px 20px;
    margin-right: -5px;
    width:80%;
}
.input_search_box:active,
.input_search_box:focus { 
    -moz-outline-style: none;
	outline:none;
	outline:0;
}
.search_svg {
    justify-content: center;
    -ms-flex-align: center;
    align-items: center;
    height: 100%;
    background-color: hsl(0, 0%, 100%);
    color: hsl(0, 0%, 60%);
    border-radius: 0px 22px 22px 0px;
    padding: 5px 1%;
    border: 0;
    cursor: pointer;
    padding: 10px 20px 10px 20px;
    margin-top: 8px;
    margin-right: 16px;
    font-size: 16px;
}
.search_svg:hover {
    background-color: lightgrey;
    color: white;
}
.dropdown {
  position: relative;
  display: inline-block;
  width: 55%
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  padding: 12px 16px;
  z-index: 1001;
  bottom: 5px;	
  padding-bottom: 40px;	
  width:88%;
  left: 12px;
  column-count: 3;
}

.dropdown:hover .dropdown-content {
  display: block;
}
.dropdown-content a {
  color: black;
  text-decoration: none;
  display: block;
  width: 100%;
  margin-bottom: 10px;	
}
.the_titles:hover {
  background-color: #cbdbdb;
}

.scrollable-menu {
    height: auto;
    max-height: 200px;
    overflow-x: hidden;
}
.copyright {
	height: 2vh;
	text-align: right;
	font-size: x-small;
}

@media only screen and (max-width: 1278px) {
  .search_svg{
      display: none;
  }  
  .input_search_box{
      padding: 10px;
      width: 100%;
      border-radius: 22px;
  }
  .dropdown{
      width:85%;
  }
  .dropdown-content {
width: 88%;
}

	
}

@media only screen and (max-width: 991.98px) {
  .main-search{
      height:55vh;
      margin-bottom: 15px;
	  background-image: url("../Images/main_search_image_mobile.jpg") ;
  }
  .button-main{
	  display: block;
	  margin-bottom: 1vh;
  }
	  .button-container{
	  margin-left: -15px;
  }
  .title_to_bottom{
  position: relative;
  bottom: auto;
  }
  .availability-search, .real_wed_search{
      height: 40vh;
      padding-left: 0;
      padding-right: 0;
	  min-height:275px;
  }
	.availability-search h2, .real_wed_search h2{
	font-size:x-large; 
}
	.availability-search{
		background-image: url("../Images/shutterstock_744768853_small.jpg") ;
	}
}