﻿body,td,th {
    font-family: Arial, Helvetica, sans-serif;
    color: #000000;
	background-color: #FFFFFF;
    font-size: 16px;
}
.style16 {
    color: #0000FF;
    font-weight: bold;
    font-style: italic;
    font-size: 24px;
}
.style22 {font-size: 16px}

div.gallery {
     margin: 30px;
     border: 0px solid #ccc;
     float: left;
     width: 200px;
}

 div.gallery:hover {
     border: 0px solid #777;
}

 div.gallery img {
     width: 100%;
     height: auto;
}

 div.desc {
     padding: 15px;
     text-align: center;
}
	.thick-green-border {
    border-color: green;
    border-width: 10px;
    border-style: solid;
    border-radius: 50%;
  }
	.blue-backgound {
    background-color: blue;
  }

/* Links */

a:link {
    text-decoration: none;
}
a:visited {
    text-decoration: none;
}
a:hover {
    text-decoration: underline;
    color: #FF0000;
}
a:active {
    text-decoration: none;
}

/* Request form */
/* Style inputs, select elements and textareas */

input[type=text], select, textarea{
  width: 100%;
 padding: 12px;
  border: 1px solid #ccc;
  border-radius: 4px;
 box-sizing: border-box;
  resize: vertical;
}

/* Style thelabel to display next to the inputs */

label {
  padding: 12px 12px 12px 0;
 display: inline-block;
}

/* Style the submit button */
input[type=submit] {
 background-color: #4CAF50;
  color: white;
  padding: 20px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  float: left;
}

/* Style the container */
.container {
  border-radius: 5px;
  background-color: #FFFFFF;
  padding: 20px;
}

/* Floating column for labels:25% width */
.col-25 {
  float: left;
  width: 25%;
 margin-top: 6px;
}
.col-50 {
  float: left;
  width: 50%;
 margin-top: 6px;
}

/* Floating column for inputs: 75% width */
.col-75 {
  float: left;
  width: 75%;
 margin-top: 6px;
}
.col-100 {
  float: left;
  width: 500px;
 margin-top: 6px;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}

/* align left */
.w3-left-align{text-align:left!important}
.w3-leftbar{border-left:6px solid #ccc!important}
.w3-left{float:left!important}

/* align center */
.w3-centered tr th,.w3-centered tr td{text-align:center}
.w3-center .w3-bar{display:inline-block;width:auto}
.w3-center .w3-bar-item{text-align:center}
.w3-center{text-align:center!important}

/*align right */
.w3-right{float:right!important}

/* float image on the right with text wrapped around it */
#hp_right  {
float: right;    
 margin: 0 0 0 15px;
}

/* float image on the left with text wrapped around it */
#hp_left  {
float: left;    
 margin: 0 15px 0 0;
}

/* multiple images with the text below the image */
#members_hz {
    overflow:hidden;
}

#members_hz img {
    position:relative;
    left:30px;
    display:inline;
    margin: 0 15px;
}
#hp_left_service_design  {
float: left;    
 margin: 0 45px 0 0;
}
#hp_left_service_illustration  {
float: left;    
 margin: 0 45px 0 0;
}
#hp_left_service_cartooning  {
float: left;    
 margin: 0 45px 0 0;
}
#hp_left_contact  {
float: left;    
 margin: 0 30px 0 0;
}

/*images side by side */
 /* Three image containers (use 25% for four, and 50% for two, etc) */
.column {
  float: left;
  width: 33.33%;
  padding: 5px;
}

/* Clear floats after image containers */
.row::after {
  content: "";
  clear: both;
  display: table;
} 

figure {
    display: inline-block;
	margin: 25px;
}
figure_portfolio {
    display: inline-block;
	margin: 25px;
}
figcaption {
	text-align: center;
}
.border {  
	border-width: 3px;   
	border-color: black;   
	border-style: solid; 
}
.main-body{
	background:white;
    margin-top:110px;
	
}
.main-body-header{
	background:white;
    margin-top:90px;
	font-size: 25px;
	
}
.bio-footer{
	text-align: center;
	background:white;
	padding:350px 0px;
	color:black;
	
}
.services-footer{
	text-align: center;
	background:white;
	padding:500px 0px 0px 0px;
	color:black;
	
}
.logo {
  position: absolute;
  margin-top: 30px;
  z-index: 999;
}
