By default the logo height is limited to 70px which suits most websites. However, some may not find this design decision fit for their purposes. Here are three additional approaches:

Option 1:


large-logo-1.png 

Add the following code in the Custom CSS area in Vamtam Theme settings / General tab, then clear your browser cache:

.layout-max header.main-header { top: 120px }
.layout-max header.main-header .logo-wrapper .logo img { max-height: none !important }
.layout-max #sub-header, .layout-max #header-slider, .layout-max #header-slider-container { min-height: 250px !important }
@media (min-width: 960px) {
header.main-header { top: 120px }
header.main-header .logo-wrapper .logo img { max-height: none !important }
#sub-header, #header-slider, #header-slider-container { min-height: 250px !important }
}


You can adjust the numbers as you wish. 


Option 2: 

large-logo-2.png 

 
 Add the following code in the Custom CSS area in Vamtam Theme settings / General tab, then clear your browser cache:

.layout-max header.main-header .logo-wrapper .logo { top: -40px !important; height: 166px !important; }
.layout-max header.main-header .logo-wrapper .logo img { max-height: none !important }
.layout-max #sub-header, .layout-max #header-slider, .layout-max #header-slider-container { min-height: 250px !important }

@media (min-width: 960px) {
header.main-header .logo-wrapper .logo { top: -40px !important; height: 166px !important; }
header.main-header .logo-wrapper .logo img { max-height: none !important }
#sub-header, #header-slider, #header-slider-container { min-height: 250px !important }
}
 

You can adjust the numbers as you wish. 


Option 3: 

large-logo-3.png

 Add the following code in the Custom CSS area in Vamtam Theme settings / General tab, then clear your browser cache:

.layout-max header.main-header { top: 70px }
.layout-max header.main-header .logo-wrapper .logo { top: -50px !important; height: 130px !important; }
.layout-max header.main-header .logo-wrapper .logo img { max-height: none !important }
.layout-max #sub-header, .layout-max #header-slider, .layout-max #header-slider-container { min-height: 250px !important }

@media (min-width: 960px) {
header.main-header { top: 70px }
header.main-header .logo-wrapper .logo { top: -50px !important; height: 130px !important; }
header.main-header .logo-wrapper .logo img { max-height: none !important }
#sub-header, #header-slider, #header-slider-container { min-height: 250px !important }
}


You can adjust the numbers as you wish. 
  


 

Wide logo


This solution may not be optimal for every site and must be taken with caution, however you can use a piece of code similar to this in order to accommodate for a wider than 135px logo. Adjust the number as the suit you and combine with one of the previous options:

header.main-header .logo-wrapper { width: 210px }
header.main-header .logo-wrapper .logo img { max-width: 210px; max-height: 110px }