/* CSS Document */

a.css3dbutton {
    background: darkred; /* background color of button */
    color: white;
    text-decoration: none;
    font: bold 28px Arial; /* font size and style */
    position: relative;
		top: 0; /* anchor main button's position */
    bottom: -12px; /* Depth of 3D effect. :after pseudo element inherits this value so it's animated in Chrome. See: kizu.ru/en/pseudos */
		margin-bottom: 12px;
    -moz-box-shadow: 0 -15px 5px darkred inset;
    -webkit-box-shadow: 0 -15px 5px darkred inset;
    box-shadow: 0 -15px 5px darkred inset;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

a.css3dbutton, a.css3dbutton:after {
    display: inline-block;
    padding: 10px 15px; /* vertical and horizontal padding of button */
    -moz-border-radius: 8px/15px;
    -webkit-border-radius: 8px/15px;
    border-radius: 8px/15px;
    outline: none;
}

a.css3dbutton:after { /* pseudo element to construct 3D side of button */
    content: "";
    position: absolute;
    padding: 0;
    z-index: -1;
    bottom: inherit; /* Inherit main button bottom value to animate it. See: kizu.ru/en/pseudos */
    left: 0;
    width: 100%;
    height: 100%;
    background: #6e0e0c; /* background color of 3D effect */
    -moz-box-shadow: 1px 0 3px gray;
    -webkit-box-shadow: 1px 0 3px gray;
    box-shadow: 1px 0 3px gray;
}

a.css3dbutton:hover {
    -moz-box-shadow: 0 25px 5px rgba(182, 64, 61, 0.7) inset;
    -webkit-box-shadow: 0 25px 5px rgba(182, 64, 61, 0.7) inset;
    box-shadow: 0 25px 5px rgba(182, 64, 61, 0.7) inset;
    background: #bc3835; /* background color when mouse rolls over button */
}

a.css3dbutton:active {
    top: 12px; /* shift button down 12px when depressed. Change 12px to match button's "bottom" property above */
    bottom: 0;
    -moz-box-shadow: 0 -20px 5px darkred inset, 1px 1px 2px #eee;
    -webkit-box-shadow: 0 -20px 5px darkred inset, 1px 1px 2px #eee;
    box-shadow: 0 -20px 5px darkred inset, 1px 1px 2px #eee;
}


@font-face {  
	font-family: "abel";  
	src: url(../fonts/Abel-Regular.ttf) format("truetype");  
    font-weight: normal;
    font-style: normal;}

body { font-size:12px;
	font-family: Arial, Helvetica, sans-serif, Helvetica, sans-serif;
	color:#333; margin:0px; background:url(../images/bg.png) repeat-x; line-height:1.4em;}

.clear { clear: both; height:5px;}
h1 { font-family: abel; text-transform:uppercase; font-weight:lighter; font-size:40px; margin: 20px 0px;}
h3 { margin-bottom: 10px; margin-top: 10px;}
p { text-align:justify;}

p1 {text-align: center}

#wrapper {
	width: 980px;
	height: auto;
	margin: 20px auto 0px auto; 
	padding: 0px 5px;
	}

#header {
	height:110px;
	margin:0px;
	padding: 0px;
	background:url(../images/heade-logo.png) no-repeat left;
	text-align:right;}
	
#header img { margin: 5px;}
	
#mainmenu {
	margin:0px;
	padding:0px;
	height: 60px;
	background:url(../images/bgmenu.png);}
	
	#mainmenu ul { padding-left: 50px; height: 60px;}
	#mainmenu li { float:left; list-style:none;}
	#mainmenu a { color:#FFF; text-decoration:none; font-family: "abel"; font-size:20px; display:block; height:20px; padding:20px;}
	#mainmenu a.current { background:#999999;}

#timezone { background:#000; padding:15px; height:30px; color:#FFC; font-size:13px;}
	#timezone .snetworks { float:right;}
	
#slide { height: 350px; background:#333;}
#formbook { height: 50px; background:#CCC; margin: 2px 0px 2px 0px; padding: 15px 15px 15px 25px;}
	#formbook h3{ margin: 0px 0px 10px 0px;}
#content-1 {
    float:left;
    width:306px;
    padding:10px;
    background:#ffffff;
}
#content-2-1 {
    float:left;
    width:306px;
    padding:10px;
    background:#ffffff;
}
#content-2-2 {
    float:right;
    width:306px;
    padding:10px;
    background:#ffffff;
}
#side-bar{
    float: left;
	margin-left:300px;
	margin-top:50px;
	width: 250px;
}
#main-content{
    margin:0;
    margin-right: 320px;  /*Change to the width of your sidebar */
}

#content { padding: 30px;}

#footer { text-align: right; padding:8px 20px; background:#eee;clear:both;
    padding:10px;
    background:#eee;}
	#footer li { list-style:none; float: left; padding: 0px 5px;}
	#footer li a { font-size:11px; text-decoration:none; color:#333;}
	
