@font-face { font-family: 'Mulish';
             src: url("Mulish.ttf") format("truetype"); }
			 
@font-face { font-family: 'Montserrat';
             src: url("Montserrat.ttf") format("truetype"); }	

@font-face { font-family: 'Open Sans';
             src: url("OpenSans.ttf") format("truetype"); }			  

body { margin: 0;
       padding: 0;
       overflow-x: hidden;
       box-sizing: border-box }
	   
header { width: 100%;
         height: 50px;
		     padding: 0 11px;
		     background-color: #fff;
         display: flex;
         flex-direction: row;
         flex-wrap: nowrap;
         align-items: center;
         align-content: center;
         justify-content: space-between;
         box-sizing: border-box }
	
  header div { font: normal 15px 'Mulish', sans-serif;
			         color: #222;
               box-sizing: border-box }
	
h1 { font: normal 24px 'Montserrat', sans-serif;
	   color: #333; 
	   padding: 0 15px; 
	   width: 100%; 
	   text-align: center;
     margin: 30px 0 0 0;
     box-sizing: border-box	 }
	 
img { border: 0 }

table { border: 0; 
        border-spacing: 0;
        border-collapse: collapse }

.about_content { width: 100%; padding: 0 10px;
                 color: #222;
                 box-sizing: border-box }

.about_content article { width: 100%; 
                         margin-top: 30px;
		  				           border: 1px solid #ccc;
				                 border-radius: 11px;
						             padding: 15px;
						             font: normal 17px 'Open Sans', sans-serif;
                         box-sizing: border-box }
								
  .about_content article table th { font: bold 20px 'Open Sans', sans-serif;
                                    text-align: left }	
  .about_content article table img { width: 60px;
                                     margin-right: 15px;
                                     vertical-align: middle }					  
						  
.contacts { margin: 0 10px;
            margin-bottom: 15px;
            box-sizing: border-box }

  .contacts h2 { font: bold 21px 'Montserrat', sans-serif;
	               color: #333;
                 margin: 60px 0 20px 0 }		   
						  
  .contacts table { width: 100% }
	  .contacts table th { padding-bottom: 15px;
	                       width: 50%;
                         font: normal 24px 'Open Sans', sans-serif;
	                       text-align: left;
					  	           vertical-align: top }		
    .contacts table td { padding-bottom: 15px;
	                       font: normal 18px 'Open Sans', sans-serif;
						             vertical-align: top }
      .contacts table td.per { width: 70px }

    .contacts table td a { color: #216fbc;
                           text-decoration: none }
      .contacts table td a:visited { color: #216fbc }  

footer { width: 100%;
         margin-top: 20px;
		     height: 30px;
		     font: normal 14px 'Mulish', sans-serif;
		     color: #ccc;
		     background-color: #42474a;  
         display: flex;
         flex-direction: row;
         flex-wrap: nowrap;
         align-items: center;
         align-content: center;
         justify-content: center;		 
         box-sizing: border-box }
 
@media screen and (max-width: 330px)
 { h1 { font-size: 20px }
   .about_content article { font-size: 14px }
     .about_content article table th { font-size: 15px }
     .about_content article table img { margin-right: 10px; width: 35px }	
 }		 
		 
@media screen and (min-width: 331px) and (max-width: 380px)
 { h1 { font-size: 21px }
   .about_content article table th { font-size: 17px }
   .about_content article table img { margin-right: 10px; width: 35px } 
 }