/*Template: Calliope
  Author: Towfiq I.
  website: www.towfiqi.com
*/

body,html {margin: 0px;border: 0px;font-family:Arial, Helvetica, sans-serif;background:#C5C7A2;color:#666;height:100%;}

/*Fonts*/
a { font-size:12px; color:#666;}
a:link{color:#999999; text-decoration:none;}
a:visited{color:#999999; text-decoration:none;}
h1 { font-size:20px; font-weight:bold; color:#333;}
h2 { font-size:24px; font-weight:bold; color:#222; margin:0px;}
h3 {font-size:14px; font-weight:bold; color:#333;}
/*Fonts END*/
#cont{min-height:100%;position:relative;display:block;height:100%;margin: 0 auto -35px;}

#header {
	background: url(images/backround1.png) no-repeat 100% 100%;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-origin: content-box;
	height:250px;
	width:100%;
	overflow: hidden;
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/backround1.png',sizingMethod='scale');
	-ms-filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/backround1.png',sizingMethod='scale');
	
}

#toprow {height:390px;background: url(images/bg.png) repeat-x; background-size:contain;}
.fadein{display:none;}
#midrow {width:960px;margin:0 auto;float:bottom;}
#bottomrow {width:960px;margin:0 auto;}
#mainbox{width:720px;background: url(images/bg.png) repeat-x; background-size:contain;margin:auto;margin-bottom:40px;padding:20px;padding-bottom:40px;}
#visionPic{background: url('images/Vision.png') no-repeat;float:left; display: block; padding-right:10px;width:258px;height:198px;}
#olivePic{background: url('images/kotinos.png') no-repeat;float:left; display: block; padding-right:10px;width:126px;height:198px;}
#hydraPic{background: url('images/hydra.png') no-repeat;float:right; display: block; margin-left:10px;width:268px;height:291px;}

#textbox{color:black;margin:20px;text-align:justify;font-size:11pt;padding-bottom:150px;}
#textbox h1{color:#5F501D;font-weight:bold;font-size:16pt;margin-top:20px;}
#textbox span{font-weight:bold;color:#8A6828;font-size:12pt;}
#textbox span:hover{font-weight:bold; color:#967E2E}
#textbox a{font-weight:bold;text-decoration:none;font-size:11pt;color:#8A6828;}
#textbox a:hover{font-weight:bold; color:#967E2E}


/*LOGO*/
#logo{padding-top:25px;width:207px;float:left;}
#logo a{background:url(images/logo.png) no-repeat;display:block;width:362.7px;height:260px;text-indent:-10000px;}
/*LOGO END*/

/*Menu Begin*/
#menu{float:right;text-align:center;background:#B1A17A;width:100%;}
#menu ul li{ display:inline; list-style-type:none;}
#menu ul li a{padding:0px 10px; font-size:14px; text-decoration:none; margin:0px 5px; font-weight:bold; vertical-align: middle; color:#5F501D;}
#menu ul li a.active{font-weight:bold; color:#967E2E}
#menu ul li a:hover{font-weight:bold; color:#967E2E}
/*Menu End*/

.center{width:960px;margin:0 auto;}

/*SlideShow Begin*/
#cu3er-container {margin:20px auto;padding-left:0px;padding-right:0px;width:950px;}
#cubershadow{width:960px;height:360px;}
/*SlideShow End*/

/*Homepage Boxs*/
#container {float:left;}
.box {padding-top:10px;width:310px;height:200px;float:left;background:url(images/border.jpg) no-repeat right;}
.box h1{padding-left:10px;}
.box p {margin:0px;width:310px;padding:15px 5px 70px 5px;float:left;}
#box-align{width:310px;height:160px;float:left;overflow:hidden;}

#buttonbox {margin:auto;display:block;}
#buttonbox img {border:none;}
.structurebox {padding-top:10px;width:226px;height:auto;float:left;background:url(images/border.jpg) no-repeat right;}
.structurebox h1{padding-left:10px;}
.structurebox p {margin:0px;width:200px;padding:15px 5px 70px 5px;float:left;}
.last{background:none;}

a.plan{float:left;display:block;width:83px;height:101px;background:url(images/plan.jpg) no-repeat 0px -101px;text-indent:-1000px;}
a.plan:hover{ background-position: 0px 1px;}
a.whyus{margin-top:10px;float:left;display:block;width:83px;height:87px;background:url(images/whyus.jpg) no-repeat 0px 0px;text-indent:-1000px;}
a.whyus:hover{ background-position: 0px -88px;}
a.support{margin-top:14px;float:left;display:block;width:83px;height:72px;background:url(images/support.jpg) no-repeat 0px 0px;text-indent:-1000px;}
a.support:hover{ background-position: 0px -70px;}

a.button{background:url(images/buttonr.gif) no-repeat right; padding:3px 0px; margin-left:2px; color:#5F501D; font-weight:bold; text-decoration:none;}
.button span{background:url(images/buttonl.gif) no-repeat left; padding:3px 5px;}
a.button:hover{background:url(images/buttonr2.gif) no-repeat right; padding:3px 0px; margin-left:2px; color:#5F501D; font-weight:bold; text-decoration:none; }
.button span:hover{background:url(images/buttonl2.gif) no-repeat left; padding:3px 5px;}
.button{padding-top:100px;}
/*Homepage Boxs END*/

/*Subpage Boxs*/
#box2holder{padding: 20px 30px;}
.box2{width:450px; float:left; padding:20px 0px;}
.box2 img{ border: solid 5px #F2F2F2; float:left;}
.box2 h3{margin:0px; padding:0px 5px; float:left;}
.box2 p{width:220px; float:left;padding:5px 5px; margin:0px;}
/*Subpage Boxs END*/


/*Footer*/
#footer{position:fixed;bottom:0;background:#554103;width:100%;height:35px;border-top:solid 1px #333333;line-height:35px;}
.foot{text-align:center;margin-left:30%;font-size:12px; }
.foot a:link{color:#C4B798;text-decoration:none;}
.foot a:hover{color:#A9986D;}
/*Footer END*/

.textbox{float:left;padding:50px 0px;width:700px;}

.textbox2{padding:10px 30px; background:url(images/textbox2bg.gif) repeat-x;}
.feed{width:auto; float:left;}
.feed img{ border: solid 0px; margin-top:120px; padding:0px 7px;}

/*
Contact Form by html-form-guide.com
You can customize all the aspects of the form in this style sheet
All the style elements use form id selector(notice the #contactus). So, including this
stylesheet does not affect the other elements at all!
*/

#contactus fieldset
{
   width:320px;
   padding:20px;
   border:1px solid #ccc;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-khtml-border-radius: 10px;
border-radius: 10px;   
}

#contactus legend, h2
{
   font-family : Arial, sans-serif;
   font-size: 1.3em;
   font-weight:bold;
   color:#333;
}

#contactus label
{
   font-family : Arial, sans-serif;
   font-size:0.8em;
   font-weight: bold;
}

#contactus input[type="text"],textarea
{
  font-family : Arial, Verdana, sans-serif;
  font-size: 0.8em;
  line-height:140%;
  color : #000; 
  padding : 3px; 
  border : 1px solid #999;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -khtml-border-radius: 5px;
    border-radius: 5px;

}

#contactus input[type="text"]
{
  height:18px;
  width:220px;
  
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
   border-radius: 5px;   
  
}

#contactus #scaptcha
{
  width:60px;
  height:18px;
}

#contactus input[type="submit"]
{
   width:100px;
   height:30px;
   padding-left:0px;
   
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
   border-radius: 5px;   
}

#contactus textarea
{
  height:120px;
  width:310px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
   border-radius: 8px;  
}

#contactus input[type="text"]:focus,textarea:focus
{
  color : #009;
  border : 1px solid #990000;
  background-color : #ffff99;
  font-weight:bold;
}

#contactus .container
{
   margin-top:8px;
   margin-bottom: 10px;
}

#contactus .error
{
   font-family: Verdana, Arial, sans-serif; 
   font-size: 0.7em;
   color: #900;
   background-color : #ffff00;
}

#contactus fieldset#antispam
{
   padding:2px;
   border-top:1px solid #EEE;
   border-left:0;
   border-right:0;
   border-bottom:0;
   width:350px;
}

#contactus fieldset#antispam legend
{
   font-family : Arial, sans-serif;
   font-size: 0.8em;
   font-weight:bold;
   color:#333;   
}

#contactus .short_explanation
{
   font-family : Arial, sans-serif;
   font-size: 0.6em;
   color:#333;   
}

/* spam_trap: This input is hidden. This is here to trick the spam bots*/
#contactus .spmhidip
{
   display:none;
   width:10px;
   height:3px;
}
#fg_crdiv
{
   font-family : Arial, sans-serif;
   font-size: 0.3em;
   opacity: .2;
   -moz-opacity: .2;
   filter: alpha(opacity=20);   
}
#fg_crdiv p
{
    display:none;
}

@media only screen and (max-device-width: 800px) {
#header{height:200px;}

#menu{height:200px;}
#menu ul li a{font-size:30pt;}
#logo{width:207px;float:left;}

#logo a{background:url(images/logoMobile.png) no-repeat;display:block;width:223,2px;height:160px;text-indent:-10000px;}
#cubershadow{display:none;}
#mainbox{height:1400px;width:920px;background: url(images/bg.png) repeat-x; background-size:contain;margin:auto;margin-bottom:40px;padding-bottom:100px;}
#toprow {height:300px;background: url(images/bg.png) repeat-x; background-size:contain;}
.fadein { display:block;position:relative;}
.fadein img { position:absolute; left:0; top:20; }
#clear{clear:both;}
#visionPic{background: url('images/Vision.png') no-repeat;background-size:contain;float:left; display: block; padding-right:10px;width:335.4px;height:257.4px;}
#olivePix{background: url('images/oil.png') no-repeat;float:left; display: block; padding-right:10px;width:335.4px;height:257.4px;}
#hydraPic{background: url('images/hydra.png') no-repeat;float:right; display: block; padding-right:10px;width:335.4px;height:257.4px;}

#midrow {width:960px;margin:0 auto;float:bottom;padding-top:50px;padding-bottom:50px;}
#textbox{color:black;margin:20px;text-align:justify;font-size:19pt;}
#textbox h1{color:#5F501D;font-weight:bold;font-size:25pt;margin-top:25px;}
#textbox span{font-weight:bold;color:#8A6828;font-size:17pt;}
#textbox span:hover{font-weight:bold; color:#967E2E}
#textbox a{font-weight:bold;text-decoration:none;font-size:16pt;color:#8A6828;}
#textbox a:hover{font-weight:bold; color:#967E2E}
#textbox span img{width:500px;}
#container{padding-bottom:50px;}

.box h1{font-size:25pt; padding-left:10px;}
.box p {font-size:18pt; margin:0px;width:310px;padding:15px 5px 70px 5px;float:left;}

#footer{position:fixed;bottom:0;background:#554103;width:100%;height:70px;border-top:solid 1px #333333;line-height:70px;}

.foot{}
.foot a:link{color:#C4B798;font-size:18pt;text-decoration:none;}
/*#textbox{color:black;margin:20px;text-align:justify;font-size:11pt;}
#textbox h1{color:#5F501D;font-weight:bold;font-size:16pt;margin-top:20px;}
#textbox span{font-weight:bold;color:#8A6828;font-size:12pt;}
#textbox span:hover{font-weight:bold; color:#967E2E}
#textbox a{font-weight:bold;text-decoration:none;font-size:11pt;color:#8A6828;}
#textbox a:hover{font-weight:bold; color:#967E2E}*/

}