
<link href="https://fonts.googleapis.com/css?family=Droid+Serif:400,400i,700,700i" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">

/*************************
*******Typography******
**************************/
html,
body {
  height: 100%;
}
body {
	background-color:#fff !important;
	font-family: 'Droid Serif', serif; font-size: 18px;
  color:#333!important;
  line-height: 26px;
background-color:#fff; margin: 50px}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 700; 
font-family: 'Droid Serif', serif;
  color:#333;
}

h1{
	 font-size: 42px; line-height: 1;
  color:#53565a; padding: 0; margin: 0; margin-bottom: 5px; text-transform: uppercase; color:#000;
}

h2{
  font-size: 14px; line-height: 21px; letter-spacing: 2px;
  color: #53565a; font-family: 'Open Sans', sans-serif; font-weight: 400; 
  text-transform:uppercase; margin: 0; padding: 0; margin-bottom: 20px; color:#333;
}

h3{
  font-size: 16px;
  color: #000;
  font-weight: 400;
  line-height: 21px;
	color: #53565a;
}

h4{
  font-size: 16px;
}

a {
  color: #333;
  -webkit-transition: color 300ms, background-color 300ms;
  -moz-transition: color 300ms, background-color 300ms;
  -o-transition:  color 300ms, background-color 300ms;
  transition:  color 300ms, background-color 300ms;
  text-decoration:underline;
}

a:hover, a:focus {
   color: #000;
	text-decoration: none;
}






a:hover,
a:focus {
  
  text-decoration: none;
  outline: none;
}



.center h2{
  font-size: 36px;
  margin-top: 0;
  margin-bottom: 20px;
}

.media>.pull-left{
  margin-right: 20px;
}

.media>.pull-right{
  margin-left: 20px;
}

body > section {
  padding: 20px 0;
}




/*************************
*******Header******
**************************/





.no-margin {
  margin: 0;
  padding: 0;
}




ul.social_icons,
ul.tag {
  list-style: none;
  padding: 0;
  margin: 10px 0;
  display: block;
}

ul.social_icons li,
ul.tag li {
  display: inline-block;
  margin-right: 5px;
}

ul.social_icons li  a i{
  border-radius: 50%;
  color: #FFFFFF;
  height: 25px;
  line-height: 25px;
  font-size: 12px;
  padding: 0;
  text-align: center;
  width: 25px;
	opacity:.8;}


ul.social-buttons{margin-bottom:0;}
ul.social-buttons li{margin-left:0 !important}
ul.social-buttons li a{display:block;width:40px;height:40px;border-radius:100%;text-align: center; font-size:20px;line-height:40px;outline:0;color:#666 !important;background-color:#fff;-webkit-transition:all .3s;-moz-transition:all .3s;transition:all .3s;}
ul.social-buttons li a:hover,
ul.social-buttons li a:focus,
ul.social-buttons li a:active{background-color:#000; color:#fff !important}

#wrap {
  min-height: 100%;
  height: 100%;
  /* Negative indent footer by its height */
  margin: 0 auto 0 0;
  /* Pad bottom by footer height */
  padding: 0 0 0 0;
}

/* Set the fixed height of the footer here */
#footer {
  height: 80px;
  background-color: #f5f5f5;
}


#wrap > .center-container {
  padding: 0 0 0 0;
  margin:0;
}

#footer > .container {
  padding-top:5px;
  padding-left:15px;
  padding-right:15px;
}

.center-container {
  height:100%;
  display: table;
  width:100%;
  margin:0;
}

.center-row {
  height:50%;
  width:100%;
  display: table-row;
}
  
.center-row > div {
  height:100%;
  width:50%;
  display: table-cell;
  border:0 solid #eee;
  vertical-align:middle;
}

.leftphoto {
  background:#efefef url(../images/Bruno-Gremez.jpg); background-attachment: scroll; background-size: cover; background-repeat: no-repeat; background-position: right top}
.righttext {
  background:#fff; text-align: left; padding: 5% 8% 5% 8%;
}


a.twitter, a.linkedin, a.medm, a.fb, a.ysng, a.wp, a.vimeo, a.youtube, a.pin, a.strava, a.gr, a.fs{width: 30px; height: 30px; background: url(../images/sm-icons.png) no-repeat; display: block; float: left; margin-right: 15px; margin-bottom: 20px;}

a.twitter{background-position: 0 0; }
a.twitter:hover{background-position: 0 -30px; }

a.linkedin{background-position: -60px 0; }
a.linkedin:hover{background-position: -60px -30px; }

a.medm{background-position: -30px 0; }
a.medm:hover{background-position: -30px -30px; }

a.fb{background-position: -90px 0; margin-right: 10px; }
a.fb:hover{background-position: -90px -30px; }

a.ysng{background-position: -120px 0; }
a.ysng:hover{background-position: -120px -30px; }


a.wp{background-position: -150px 0; }
a.wp:hover{background-position: -150px -30px; }

a.vimeo{background-position: -180px 0; }
a.vimeo:hover{background-position: -180px -30px; }


a.youtube{background-position: -210px 0; }
a.youtube:hover{background-position: -210px -30px; }

a.pin{background-position: -240px 0; }
a.pin:hover{background-position: -240px -30px; }


a.strava{background-position: -270px 0; }
a.strava:hover{background-position: -270px -30px; }

a.gr{background-position: -300px 0; }
a.gr:hover{background-position: -300px -30px; }

a.fs{background-position: -330px 0; }
a.fs:hover{background-position: -330px -30px; }