
* { margin: 0;  padding: 0; outline: none; position : relative; }
body, html{overflow-x: hidden;}
section,article,header,footer,nav,aside,hgroup {display: block;}
body{height:100vh; font-family: 'Montserrat', sans-serif; background: url("../images/bg_body.jpg") no-repeat center center; background-size: cover;  }

body::before{content: ''; background-color: rgba(42,47,56,.8); position: absolute; top:0; left:0; width: 100%; height: 100%; z-index: 1;}

.container{width:100%; max-width: 100%; display: flex; flex-direction: column; justify-content: space-between; height: 100%; align-items: center; z-index: 2;}

 img{ max-width: 100%; width: 100% ;}
#logo{ max-width: 500px;transition: opacity 1s, top 1s; width: 90%;}
.legende{ font-size: 12px; text-transform: uppercase; letter-spacing: 3px; color: #FFF; display: inline-block; width: 100%; margin-bottom: 1em; opacity: .7;}

.row{ width: 100%; margin: 0 auto; }
.row1{ padding-top:6em;text-align: center;} 
.row2, .row3{text-align: center;}
.row3{padding-bottom: 6em;}

.baseline{   font-size: 36px;color: #FFF; }
.bold{   font-weight: bold; }

.columns{ float: left;width: 33.33333%}
.row3 .columns{ display: flex; flex-direction: column;}
.row3 img{display: inline-block;width: auto; height:80px; margin-bottom:1em; transition: all .2s linear; }
.columns a{ display: inline-block;font-size: 16px; color: #FFF; text-decoration: none; transition: all .2s linear;}
.row3 .columns a:hover { transform: translateY(-5px); cursor: pointer;}

@media screen and (min-width: 768px) { 
	.container {max-width: 1320px; margin: 0 auto; }
}

@media screen and (max-width: 767.98px) { 
	.row3 img{height:50px; }
	.container {max-width: 100%; }
	.columns a{ font-size: 14px; }
}

@media screen and (max-width: 575px) { 
	.baseline{   font-size: 32px; }
}

@media screen and (max-width: 479px) { 
	.baseline{  padding: 0 1em; }
	.columns{ float: left;width: 100%; padding-bottom: 1em;}
	.row1{padding-top: 4em;}
	.row3{padding-bottom: 2em;}
	.baseline{   font-size: 26px; }
}

@media screen and (max-width: 389px) { 
	.columns a{ font-size: 12px; }
}


