/*
 * Lightning Multimedia Solutions
 *
 * Created by Luca Farini
 * https://www.lightning-multimedia.it
 */

html {
    width: 100%;
    height: 100%;
    height: auto;
}

body {
    overflow: scroll;
}

.container {
    margin: 0;
    width: 100%;
    padding: 0;
}

h1, h2, h3, h4, h5, h6, p, .btn, .list-inline, small, .lead {
	font-family: 'Arial', sans-serif;
}

h1 {
    font-size: 46px;
    line-height: 32px;
    color: #333;
    font-weight: 300;
	margin: 2%;
}

p {
    font-size: 16px;
    line-height: 20px;
    color: #333;
    font-weight: 300;
}

.logo {
    display: block;
    margin: 2% auto 2%;
    max-width:40%; 
    height:auto;
    width: auto;
}

.main {
	text-align: center;
	margin: 6% auto 0;
}

.main p {
	font-size: 30px;
	margin: 10% auto 0;
}




/* ==========================================================================
   Responsive
   ========================================================================== */


/* Landscape phones and down */
@media (max-width: 480px) { 

.logo-container img {
    margin: 10% auto 4%;
    max-width: 60%; 
    height:auto;
    width: auto;
    
}

h1 {
	font-size: 35px;
	line-height: 35px;
	font-weight: 300;
}

.main {
	margin: 80px 0 0 0;
}

.main p {
	font-size: 24px;
	margin: 20% auto 0;
}

}



/* Landscape phone to portrait tablet */
@media (min-width: 481px) and (max-width: 767px) { 

.logo-container img {
    margin: 6% auto 4%;
    max-width: 20%; 
    height:auto;
    width: auto;
    
}

h1 {
	font-size: 26px;
	line-height: 20px;
	font-weight: 300;
}

.main {
	margin: 0;
}

.main p {
	font-size: 24px;
	margin: 8% auto 0;
}

}



/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 991px) {

.logo-container img {
	margin: 10% auto 10%;
	max-width: 45%; 
	height:auto;
	width: auto;
    
}

h1 {
	font-size: 30px;
	line-height: 24px;
	font-weight: 300;
}

.main {
	margin: 0;
}

.main p {
	font-size: 30px;
	margin: 25% auto 0;
}
    
}



/* Desktops and laptops ----------- */
@media (min-width: 992px) and (max-width: 1200px) {

.logo-container img {
	margin: 10% auto 6%;
	max-width: 30%; 
	height:auto;
	width: auto;
    
}

h1 {
	font-size: 40px;
	line-height: 30px;
	font-weight: 300;
}

.main {
	margin: 0;
}

.main p {
	font-size: 30px;
	margin: 15% auto 0;
}

}  

.gal-img{
	width: 100%;
	margin-bottom:20px;
}