/* Designer's Ink Styles */
/* Seema Jani */ 

/* Universal Elements */  

* {
	margin: 0;
	padding:0;
}


html,body{width:100%;}


body { 
	text-align:center;
	background-color: #8e8c86; 
	background-image:url(../images/bg.gif);
	font:normal 11px Helvetica, Arial, sans-serif;
	margin-top:50px;}



 
#container { 
	width:900px;
	text-align:left;
	margin: 0 auto;
	font:normal 11px Helvetica, Aria, sans-serif;
	position: relative;
	height: 500px;
}  

#container_home {
	width:1200px;
	text-align:left;
	margin: 0 auto;
	margin-top:0px;
	font:normal 11px Arial, Helvetica, sans-serif;
	position: relative;
	height: 800px;
	background-image: url(../images/background.jpg);
}    

#floater {
	position:relative; float:left;
	height:50%;	
	margin-bottom:-200px;
	width:1px;
}
 
#centered {
	position:relative; clear:left;
	height:400px; width:80%; max-width:900px; min-width:400px;
	margin:0 auto;
	background:#fff;
	border:4px solid #666;
}


img {
	border:0;
}

p {
	margin:12px 35px 10px 25px;
	color:#101D33;
}

h1 {
	margin:188px 0 0 24px;
	font-size:18px;
	font-weight:normal;
	color:#C11423;
	letter-spacing:1px;
}

hr {
	width:500px;
	text-align:center;
	height:1px;
	color:#101D33;
	margin:10px 35px 10px 25px;
}

a {
	color:#000;
	text-decoration:none;
}

a:hover {
	text-decoration:none;
}
/* --------------------------------------------------------------------- */

/* Header Elements */ 
#header {
	position:absolute;
	top:23px;
	left:300px;
	height:150px;
	width: 300px;
	z-index:1000;
}


#header_logo {
	position:absolute;
	top:23px;
	left:200px;
	height:50px;
	width: 300px;
	z-index:1000;
} 

/* --------------------------------------------------------------------- */

/* Global Navigation */


/* style the table so that it takes no part in the layout - required for IE to work */

/* Main Column Elements */
#maincol	{
	position: absolute;
	width:650px;
	margin-bottom:15px;
	top: 130px;
	height:325px;
	left:250px;
	line-height:20px;
}

#maincol_logo	{
	position: absolute; 
	width:650px; 
	margin-bottom:15px;
	top: 130px;
	height:325px;
	left:230px;
	}

#maincol_home	{
	position: absolute;
	width:800px;
	margin-bottom:0px;
	top: 100px;
	height:650px;
	left:200px;
}

#maincol_project{
	position: absolute;
	width:800px;
	margin-bottom:0px;
	top: 100px;
	height:700px;
	left:200px;
}

#flash {
	height:550px;
	left: 225px;
	top: 218px;
}
#home_content {
	left: 225px;
	top: 700px;
	font-size:18px;
	font-family:"myriad Pro", "Myriad Pro Cond", "Myriad Pro Light", "Myriad Web Pro";
	width: 750px;
	padding-right: 30px;
	padding-left: 15px;

}

/* --------------------------------------------------------------------- */

#copyright {
	padding:25px 0 0 0;
}
/* --------------------------------------------------------------------- */

/* OT Tag */ 
#ot_tag { 
	padding:10px 5px 10px 5px;
	text-align:center;
	background: #1A3259;
	color:#fff;
	font-size:10px;
}

#ot_tag a {
	color:#fff;
	text-decoration:none;
}
/* --------------------------------------------------------------------- */
  
/* Float Containers */ 
#wrapper:after {
	content: "."; 
	display: block; 
	height: 0px; 
	clear: both; 
	visibility: hidden;
}

#wrapper {display: inline-table;} 

/* Hides from IE-mac \*/
* html #wrapper{height: 1%;}
#wrapper {display: block;}
/* End hide from IE-mac */  


clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

.clearfix {display: inline-table;} 


/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
/* End hide from IE-mac */

/* --------------------------------------------------------------------- */


/* Navbar container */
.navbar {
  overflow: hidden;
  background-color: #ffffff;
  font-family: Arial, Helvetica, sans-serif;
}

/* Links inside the navbar */
.navbar a {
  float: left;
  font-size: 10px;
  color: #04757c;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-style:normal;
}

/* The dropdown container */
.dropdown {
  float: left;
  overflow: hidden;
}

/* Dropdown button */
.dropdown .dropbtn {
  font-size: 10px; 
  border: none;
  outline: none;
  color: #04757c;
  padding: 14px 16px;
  background-color: inherit;
  font-family: inherit; /* Important for vertical align on mobile phones */
  margin: 0; /* Important for vertical align on mobile phones */
}

/* Add a red background color to navbar links on hover */
.navbar a:hover, .dropdown:hover .dropbtn {
  background-color: white;
}

/* Dropdown content (hidden by default) */
.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

/* Links inside the dropdown */
.dropdown-content a {
  float: none;
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  text-align: left;
}

/* Add a grey background color to dropdown links on hover */
.dropdown-content a:hover {
  background-color: #ddd;
}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {
  display: block;
}

/* Footer Elements */  
#footer {
	height:25px;
	/*font-family:"myriad Pro", "Myriad Pro Cond", "Myriad Pro Light", "Myriad Web Pro";*/
	font-family:Arial, Helvetica, sans-serif;
	clear:both;
	color: #ffffff;
	font-size:10px;
	text-align:center;
	position:relative;
	top: 120px;
	left: 0px;
	width: 800px;
} 

#footer a{
	color: #ffffff;
	font-size:10px;
} 

#footer a:hover{
	color:#04757c;
	text-decoration:none;
}

#footer_project {
	height:25px;
	/*font-family:"myriad Pro", "Myriad Pro Cond", "Myriad Pro Light", "Myriad Web Pro";*/
	font-family:Arial, Helvetica, sans-serif;
	clear:both;
	color: #ffffff;
	font-size:10px;
	text-align:center;
	position:relative;
	left: 0px;
	width: 800px;
	top: 120px;
} 

#footer_project a{
	color: #ffffff;
	font-size:10px;
} 

#footer_project a:hover{
	color:#04757c;
	text-decoration:none;
}


#copyright {
	padding-right: 0;
	padding-bottom: 0;
	padding-left: 0px;
}
/* --------------------------------------------------------------------- */

/* OT Tag */ 
#ot_tag { 
	padding:10px 5px 10px 5px;
	text-align:center;
	background: #1A3259;
	color:#fff;
	font-size:10px;
}

#ot_tag a {
	color:#fff;
	text-decoration:none;
}



/* --------------------------------------------------------------------- */
 /* gallery css */
#gallery{
	margin: 0 auto;
}

#gallery img {
	width: 120px;
	height: 100px;
	padding: 10px;
	filter: grayscale (100%);
	transition: 1s;
	border: thin;
}

#gallery img:hover{
	filter: grayscale(0);
	transform: scale(1.1);
}