﻿
@media screen and (max-width: 400px) {
@-ms-viewport { width: 320px; }
/* CSS for 320px layout goes here */
}

@media screen and (min-width: 400px) and (max-width: 640px) {
@-ms-viewport { width: 400px; }
/* CSS for 400px layout goes here */
}

@media screen and (min-width: 640px) and (max-width: 1024px) {

/* CSS for 640px layout goes here */
}

@media screen and (min-width: 1024px) and (max-width: 1366px) {
body {width:1366px;}
/* CSS for 1024px layout goes here */
}

@media screen and (min-width: 1366px) 
{
    body {width:1366px;}
/* CSS for 1366px layout goes here */
}

html {
  background-color: #f1f4f5;
  font: 14px/28px 'Open Sans', sans-serif;
  height: 100%;
  width: 100%;
}

#header1
{
    background: #2473f2;
    margin: 0;
    padding: 4% 15% 3% ;	
    color: white;
    text-align: right;   
    clip-path: polygon(
    0 0,
    200% -350%,
    80% 100%,
    0 30%
  );
}
#header2
{
    background: #2473f2;
    margin: 0;
    padding: 4% 15% 3% ;	
    color: white;
    text-align: right;   
    clip-path: polygon(
    0 0,
    200% -350%,
    80% 100%,
    0 30%
  );
}
#logo
{
    background-position: left bottom;
    background: url('Images/logo_final.gif');
    background-repeat: no-repeat;
    padding: 15px;
}
#header {
  position: relative;
  width: 100%;
  display: block;
  text-align: center;
  z-index: -1;
  height: 150px;
  background: url('~/Inauguration/images/Images-03.jpg');
}

#h-inner {
  width: 100%;
  height: 100%;
  color: #fff;
  line-height: 150px;
  font-size: 20px;
}

.show {
  left: 0;
}

.hide {
  left: -100%;
}

#main-nav {
  float: left;
  z-index: 2;
}

#nav-holder {
  position: relative;
}

.nav-item {
  width: 110%;
  height: 320%;
  text-decoration: none;
  background-color: orange;
  display: block;
  text-align: center;
  line-height: 320%;
  cursor: pointer;  
}

.nav-item a:hover i {
  -webkit-transition: all .4s ease-in-out;
  -moz-transition: all .4s ease-in-out;
  -o-transition: all .4s ease-in-out;
  transition: all .4s ease-in-out;
  -webkit-transform: rotate(360deg);
  transform: rotate(360deg);
}

.nav-item a {
  text-decoration: none;
  color: #fff;
  width: 100%;
  height: 100%;
  display:inline-block
}

.nav-item i {
  font-size: 20px;
}

.animate {
  -webkit-transition: all .8s ease-in-out;
  -moz-transition: all .8s ease-in-out;
  -o-transition: all .8s ease-in-out;
  transition: all .8s ease-in-out;
}

.cred {
  color: #969696;
  font-size: 7pt;
  text-align: center;
  margin-top: 20px;
  text-decoration: none;
  width: 100%;
  display: block;
}

#page {
	width: 980px;
	margin: 0 auto;
	padding: 5px 0 0 0;	
	background: #FFFFFF;
    }
#midsection
{ 
 padding-top: 1em;
 height:700px; 
}

#sidebar
{
 float: left;
 box-sizing: border-box;
 width: 18%;
 padding-top: 1em;
 padding-left: 5px;
 -moz-border-radius-topleft: 10px;
    -webkit-border-top-left-radius: 10px;
    
}

#sidebar ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

#sidebar li {
	margin-bottom: 10px;
}

#sidebar li ul {
	padding: 5px;
	border: 1px solid #0AAAFD;
	border-top: none;
}

#sidebar li li {
	margin: 0;
	padding: 3px 0;
	background: url(images/img09.gif) repeat-x;
}

#sidebar li li.first {
	background: none;
}

#sidebar li h2 {
	height: 15px;
	margin: 0;
	padding: 5px 0 0 10px;
	background: url(images/img10.jpg) no-repeat;
	letter-spacing: -1px;
	color: #327EBE;
}

#sidebar a:link {
	text-decoration: none;
}

#sidebar a:hover {
	text-decoration: underline;
}

#sidebar li a {
	padding-left: 5px;
	background: url(images/img11.gif) no-repeat left center;
}

/* Content */

#content {
	float: right;
	width: 80%;
   box-sizing: border-box;
}
#contentfull {
	width: 980px;		
}

/* Footer */

#footer {
	clear: both;
	height: 10px;
	background: #2473f2;
	border-bottom : 3px solid #999999;
	text-align: center;
	font-size: 8px;
}

#footer p {
	margin: 0;
	color: #999999;
}

#footer a {
	color: #999999;
}

#footer a:hover {
	color: #FFFFFF;
}

#prefooter {
	width: 980px;
	height: 100px;
	padding-top: 1em;
	overflow: hidden;	
}

.post {
	margin-bottom: 20px;
}

.post .title {
	padding: 0 20px;
	background: #D3D3D3;
}

.post .story {
	padding: 0 10px;
	background: #FFFFFF;
}

.post .meta {
	padding: 5px 20px;
	background: url(images/img09.gif) repeat-x;
}

.post .meta p {
	margin: 0;
	font-size: 87%;
}

.boxed .title {
	height: 32px;
	margin: 0;
	padding: 8px 0 0 20px;
	background: #D3D3D3 url(images/img08.jpg) no-repeat;
	letter-spacing: -1px;
	color: #FF3300;
}

.boxed .story {
	padding: 20px;
	border: 1px solid #FF8D17;
}

.boxed .meta {
	padding: 5px 10px;
	background: #FF8D17;
	color: #FFFFFF;
}

.boxed .meta a {
	color: #FFFFFF;
}
#slider_container_2 { float: left; margin: 0; padding: 2px; width: 800px; background: url(../images/gallery/bg.png) no-repeat 0 0; }

.SliderName_2 {
	float: left;
	width: 800px;
	height: 420px;
	overflow: hidden;
}

.SliderNamePrev_2 {
	background: url(../images/gallery/left.png) no-repeat left center;
	width: 50px;
	height: 300px;
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	text-decoration: none;
}

.SliderNameNext_2 {
	background: url(../images/gallery/right.png) no-repeat right center;
	width: 50px;
	height: 300px;
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	text-decoration: none;
}

.SliderName_2Description {
	padding: 3px;
	font-family: Tahoma,Arial,Helvetica;
	font-size: 14px;
	line-height: 30px;
	letter-spacing: 1px;
	text-align: center;
	color: #ffffff;
	text-shadow: 0 1px 3px #000000;
}

#SliderNameNavigation_2 { margin: 0; height: 10px; text-align: center; overflow-y: hidden; }

#SliderNameNavigation_2 a:link, #SliderNameNavigation_2 a:active, #SliderNameNavigation_2 a:visited, #SliderNameNavigation_2 a:hover{
	margin: 0;
	padding: 0;
	font-size: 0;
	line-height: 0;
	text-decoration: none;
}

#SliderNameNavigation_2 a img
{
	border: none;
	width: 10px;
	height: 10px;
	background: url(../images/gallery/bullet.png) no-repeat center center;
}

#SliderNameNavigation_2 a.active img
{
	background: url(../images/gallery/bullet_active.png) no-repeat center center;
}
.c { clear: both; }

ol#toc { height: 2em; list-style: none; margin: 0; padding: 0; }
ol#toc a { background: #bdf url(../images/slice.jpg); color: #008; display: block; float: left; height: 2em; padding-left: 10px; text-decoration: none; }
ol#toc a:hover { background-color: #3af; background-position: 0 -56px; }
ol#toc a:hover span { background-position: 100% -56px; }
ol#toc li { float: left; margin: 0 1px 0 0; }
ol#toc li.current a { background-color: #48f; background-position: 0 -28px; color: #fff; font-weight: bold; }
ol#toc li.current span { background-position: 100% -28px; }
ol#toc span { background: url("../images/slice.jpg") 100% 0; display: block; line-height: 2em; padding-right: 10px; }


.divHeaderTable
{
            width: 100%;
            padding-bottom:5px;
            display:block;
}
.divHeaderRow
{
            width: 100%; /* add extra that you want to for header column */
            display:block;
            height:105px;
}
.divHeaderColumn
{
            float: left;
            width: 33%;
            display:block;
}
.divLHeaderColumn
{
            float: left;
            width: 100%;
            display:block;
}
.divTable
{
            width: 100%;
            display:block;
            padding-top:10px;
            padding-bottom:10px;
            padding-right:10px;
            padding-left:10px; 
}
.divRow
{
         width: 99%; 
         display:block;
         padding-bottom:5px;
}
.divColumn
{
         float: left;
         width: 24%;
         display:block;
}

fieldset {
    font-family: sans-serif;
    border: 2px solid #1F497D;
    background: #ffdc70;
    -moz-border-radius:5px;	
    border-radius: 5px;
    padding: 9px;
}

fieldset legend {
    background: #1F497D;
    color: #fff;
    padding: 1px 2px ;
    font-size: 12px;
    -moz-border-radius:5px;	
    border-radius: 5px;
    box-shadow: 0 0 0 2px #ddd;
    margin-left: 1px;
}
.legend1
{
  height:190px;
  margin-bottom:3px;
  margin-left:2px;
}
.legendUser1
{
  margin-bottom:1px;
  margin-left:2px;
}
t;
}