@font-face {
 	font-family: "Optima";
 	src:url("../_font/Optima-Regular.eot");
 	src:url('../_font/Optima-Regular.eot?#iefix') format('embedded-opentype'),
		url('../_font/Optima-Regular.woff2') format('woff2'),
		url('../_font/Optima-Regular.woff') format('woff'),
		url('../_font/Optima-Regular.ttf')  format('truetype'),
		url('../_font/Optima-Regular.svg#svgFontName') format('svg'); 
}

/*
@font-face
{
	font-family:FONT-FA1;
	src:url(BTraffic.ttf);  format(eot),    
	url(BTraffic.woff) format(woff),
	url(BTraffic.ttf) format(truetype); 
}*/


*{padding:0px;margin:0px;}

body
{
	direction:ltr;
	background:url(../_images/oilbackF-com.jpg) no-repeat top center;
	background-color:#FFCC11;
	margin:0 auto;
	font-family: "Optima";
	height: 100%;
}

.body-main
{
	direction:ltr;
	background:url(../_images/oilback-com.jpg) no-repeat top center;
	background-color:#FFCC11;
	margin:0 auto;
	font-family: "Optima";
}

li
{
	text-align: left;
}

.OMG li
{
	list-style:none;
	margin: 5px 10px;
	padding: 4px;
	transition-duration:1s;
	font-size:17px;
	color:white;
}

.OMG li:hover
{
	font-size:20px;
	color:red;
	box-shadow:25px 25px 25px black;
	background-color:#3CF;
	border-radius:7px;
	/*transform:rotate(2deg);*/
}

.li
{
	list-style:none;
	margin: 5px 10px;
	padding: 4px;
	font-size:17px;
	color:white;
}

#main{
	width:990;
	height:auto;
	background:linear-gradient();
	margin:0 auto;	
	}


/*.banner{
	width:100%;
	height:500px;
	margin:0px;
	border:3px solid red;
	border-radius:0px 0px 20px 20px;
	background-image:url(../_images/banner-h1-com.jpg);
	transition-duration:0.5s;	
	}

.banner:hover
{
	width:100%;
	height:500px;
	margin:0px;
	border:3px solid red;
	border-radius:0px 0px 20px 20px;
	background-image:url(../_images/banner-h2-com.jpg);
}
*/
#banner
{
	width:100%;
	height:500px;
	margin:0px;
	border:3px solid red;
	border-radius:0px 0px 20px 20px;
	background-image:url(../_images/banner-h1-com.jpg);
	transition-duration:0.5s;	
}

#banner:hover
{
	width:100%;
	height:500px;
	margin:0px;
	border:3px solid red;
	border-radius:0px 0px 20px 20px;
	background-image:url(../_images/banner-h2-com.jpg);
}


#right
{
	width:25%;
	height:auto;
	float:right;
	margin-left: -5px;
}

.menu
{
	width:90%;
	height:auto;
	margin:15 auto;
}


.bottom
{
	width:100%;
	height:auto;
	background-color:rgba(204,50,0,1);
	border-radius:0px 0px 10px 10px;
	font-size:19px;
	font-family:"Optima";
	padding-bottom: 5px;	
}

ul
{
	list-style:none;
	margin-left: 10px;
	padding: 2px;
	/*margin-bottom: 15px;*/
}

.NOTE1-history p, .NOTE2-history p
{
	padding: 10px;
}

.NOTE2-history ul
{
	list-style: disc;
	padding-left: 20px;
}
.top
{
	width:100%;
	height:auto;
	background-color:#121;
	border-radius:10px 10px 0px 0px;
	text-align:center;
	font-size:25px;
	color:yellow;
	padding:6px 0px;
	font-family:"Optima";
	
}

/*#left .menu .top
{
	padding: 10px 0px; 
}
*/
#top2
{
	width:100%;
	height:auto;
	background-color:#121;
	border-radius:10px 10px 0px 0px;
	text-align:center;
	font-size:25px;
	color:yellow;
	padding:10px 0px;
	margin-top:10px;
	font-family:"Optima";
}




#left
{
	width:74%;
	height:750px;
	float:right;
	background-color:none;
	border-radius:10px 0px 15px 15px;
}
	
#footer-main
{
	width:100%;
	height:500px;
	margin:0px 0px 0px 5px;
	background-image:url(../_images/ziresite-com.png);
}

#footer
{
	/*position: absolute;
	bottom: 0px;*/
	/*left: 0px;*/
	width:1000px;
	height:1000px;
	margin:220px 0px 0px -5px;
	background-image:url(../_images/oilflow-com.png);
}

.NOTE1-history, .NOTE1-article, .NOTE2-history, .NOTE2-article
{
	width:97%;
	height:auto;
	background-color:rgba(255,255,255,0.8);
	text-align:justify;
	font-family:"Optima";
	padding:0px 10px;
	font-size:20px;
}

.NOTE2-article li
{
	margin: 7px 0px;
}

.NOTE2-article
{
	padding: 10px;
}

.NOTE2-article p
{
	padding: 15px;
}

.NOTE2-history, .NOTE2-article
{	
	border-radius:0px 0px 10px 10px;	
}

.table
{
	width: 100%;
	text-align: center;
	margin: 20px 0px;
}

td
{
	width: 120px;
	text-align: center;
}

table {
	border-collapse: collapse;
	width: 100%;
	display: inline;
	text-align: center;
}

td, th {
	border: 1px solid #808080;
	border-width: 2px;
	text-align: left;
	padding: 8px;
	text-align: center;
}

tr:nth-child(even) {
    background-color: #cccccc;
}

.td
{
	padding: 0px 30px;
}

.upperBut
{
	width:94%;
	float:right;
	margin-bottom: 10px;
}

.upperBut-pic
{
	width:74%;
	float:left;
	margin-bottom: 10px;
}

.innerBut
{
	margin: 10px auto;
}

.KAD
{
	width:200px;
	padding:10px 0px;
	text-align:center;
	background-color:rgba(204,50,0,1);
	color:white;
	float:left;
	margin:10px 5px;
	font-family:"Optima";
	border-radius:50px 0px 50px 0px;
	border:3px solid rgba(255,150,0,0.7);
	font-size:15px;
	font-family:"Optima";
}

img
{
	width:200px;
	height:200px;
	border-radius:50px 0px 50px 0px;
	padding:10px 20px;
}

.KAD img
{
	float: left;
	padding: 0px;
	margin: 15px 0px;
}

/*img
{
	-webkit-transition:all 1s ease;
}

.KAD img:hover 
{
	transform:rotate( 4deg );
	-moz-transform:rotate( 4deg );
	-o-transform:rotate( 4deg );
	-ms-transform:rotate( 4deg );
	-webkit-transform:rotate( 15deg );
	-khtml-transform:rotate( 360deg );
 }

#picA
{
	width:200px;
	margin:0 auto;
	padding:10px;
}


*/
a
{
	color:white;
	text-decoration:none;
}

a:hover
{
	background-color:;
	color:yellow;
	font-weight:bold;
	display:block;
}



#picA-main
{
	width:730px;
	height:750px;
	padding:10px 20px;
}

#picA-history
{
	width:600px;
	height: auto;
	margin:0px auto 10px auto;
	padding:10px;
	border-radius: 0px;
	transition-duration:1s;
}

#picA-history:hover
{
	width:650;
	box-shadow:25px 25px 25px 15px black;
	border-radius:10px;
	transform:translate(200px,-200px);
	transform:rotate(2deg);
}

#picA-article  /*god knows what this is for...*/
{
	width:730px;
	height:750px;
	padding:10px 20px;
}


#picA-AF
{
	width:500px;
	height: auto;
	border-radius: 0px;
	margin:0 50px;
	padding:10px;
	float:center
}


#picA-contact
{
	width:97%;
	height:auto;
	padding:10px 10px;
	border-radius: 20px;
}

#right-cont
{
	height:auto;
	float:right;
	margin-left: -5px;
}

.menu-cont
{
	height:auto;
	margin:15 auto;
}

.KAD-POS
{
	width:200px;
	padding:10px 0px;
	text-align:center;
	background-color:rgba(204,50,0,1);
	color:white;
	float:left;
	margin:10px 1px;
	font-family:myfont;
	border-radius:50px 0px 50px 0px;
	border:3px solid rgba(255,150,0,0.7);
	font-size:20px;
	font-family:FONT-FA1;
	position:absolute;
	top:1755px;
	left:150px;
	position:fix;
}

#picB
{
	width:600px;
	height: auto;
	border-radius: 0px;
	margin:0 auto;
	padding:10px;
}

#picC
{
	width: 25px;
	height: auto;
	border-radius: 0px;
	margin:0 auto;
	padding:0px 20px;
}
