@font-face{
	font-family:'headings';
    src:url(../fonts/dolce_vita/dolce_vita.ttf);
}
@font-face{
	font-family:'headings';
    src:url(../fonts/dolce_vita/dolce_vita_heavy_bold.ttf);
    font-weight:bold;
}

@font-face{
	font-family:'main_font';
    src:url(../fonts/avenir/AvenirNextLTPro-Regular.otf);
}
@font-face{
	font-family:'main_font';
    src:url(../fonts/avenir/AvenirNextLTPro-Bold.otf);
    font-weight:bold;
}

*{font-family: 'main_font';}

img {
    max-width: 100%;
    height: auto;
    width: auto\9; /* ie8 */
}

.push{
	margin-top:20px;
}

.dw{
	font-family: 'headings';
    font-weight:bold;
    margin-left: 12%;
}

header{
	
}

.nav-bar{
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
  list-style-type: none;
  margin: 0;
  padding: 0; 
}

.nav-bar li{ 
    padding:0;
    list-style: none; 
    display:inline-block; 
 	flex: 1;
  	text-align: center;
  	padding: 24px;
}

.nav-bar a {
	color:#2d3d50;
    font-family:'Avenir Next', sans-serif;
    font-size:150%;
    margin-left:30px;
    
}

.nav-bar a:hover{
	text-decoration:none;
}

@media (min-width: 768px)
.forced {
    display: inline-block!important;
    height: auto!important;
    padding-bottom: 0;
    overflow: visible!important;
}

.certification{
	float:right;
    margin:14px 10px 0 0;
    
}
.white{
	color:#ffffff;
}

#display{
    width:100%;
    text-align: center;
    z-index:1;
    
 
  /*  background-image:url(../images/main2.png); */
}

#display img{ 
    vertical-align: top;  
    padding:0px;
    margin:0px 0 0 16px; /* forced alignment until find bug */
	display:flex;
    justify-content:center;
    }

#about{
	margin:100px 0 100px 0;
} 


.line{
	border-right:medium #4DB9C1 solid; 
    height:200px;
}
#about img{
	margin-bottom: 30px;
}

#about h3 {
	max-width: 400px;
}

#about p{display:block;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
	max-width: 300px;}

.divider{
    background-color:#2D3D50;
    padding:100px 0 100px 0;
}

.white{
	color:#ffffff;
    border-top:2px solid #4DB9C1;
    border-bottom: 2px solid #4DB9C1;
    padding:20px 0 20px 0;
}

#services{
	margin:60px 0 60px 0;
}

#services img {
    display:inline-block;
    vertical-align: middle;
    margin-top:40px;   
}

#services h3{
	text-align: left;
}

#services p{
	font-size:1em;
    text-align: left; 
    max-width: 300px;
    display:inline-block;
}

#contact{
	padding:100px 0 100px 0;
}

#contact p{
    font-size:1em;
    text-align: center; 
    max-width: 400px;
    display:block;}

#contact h3{
	text-align: center;
    padding-bottom: 20px;
    margin-bottom: 20px;
    border-bottom:2px solid #4DB9C1;
}

h1{
	font-family: 'headings';
    font-size: 5em;
    color:#2D3D50;
    position:absolute;
 	text-align: center;
  	width:100%
}

h2{
	font-family: 'headings';
    font-size:250%;
    color:#2D3D50;
    text-align: center; 
}

.highlight{
	color:#4DB9C1;
	font-family: 'headings'; /* forced: double check why span changed font-family */
}


h3{
    font-size:150%;
    color:#2D3D50;
    font-weight:bold;
}

.center{
	display:block;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

b{
	color:#2D3D50;
}

form label{
	color:#2D3D50;
}

button{ 
background-color:#2D3D50 !important;
}


.footer{
	background:#2D3D50;
    text-align: center;
    color:#fff;
    height:100px;
   	padding-top:40px;
}


.thankyou{
	width:300px;
    height:200px;
    background: #2d3d50;
    color:#ffffff;
    font-size:150%;

}

@media only screen and (max-width : 767px) { /* mobile up to 767px wide --------------------- */
    
    .logo{width:30%; height:auto; display: block; margin:0 auto; margin-top:10px;}
    .nav-bar li{padding: 14px;}
    .nav-bar a { margin-left:0px;font-size:100%;}

	#about{margin:30px 0 30px 0;}
    #about div{margin-bottom:30px;}
    #about div:nth-of-type(2){display:none;}
    #about img, #services img{ width:20%; height:auto;}
    #services, #services h3, #services p.description {text-align:center;}
    img.certification{display:none;}
} 