/***************************** Global Resets ******************************/
*{margin:0; padding:0; outline:0 !important; border:0}

/***************************** Globals ******************************/
html{overflow-y:scroll}
body{background:#6d6e71; color:#FFFFFF; font:14px 'Century Gothic', Arial}
.container{width:620px; margin:0 auto}

.g-recaptcha {
    background: none repeat scroll 0 0 #111;
    border-radius: 3px;
    float: right;
    margin-bottom: 10px;
    max-width: 505px;
    padding: 2%;
    width: 98%;
}

/***************************** Headings/Paragraphs ******************************/
h1{font:bold 18px 'Century Gothic', Arial; margin:0 0 30px}
h2{font:bold 16px 'Century Gothic', Arial; margin:0 0 15px; color:#00c0ff; text-transform:uppercase}
ul.services li p{font:normal 11.5px/16px 'Century Gothic', Arial; margin:0 0 20px} 
p{font:normal 14px/20px 'Century Gothic', Arial; margin:0 0 20px}
strong{width:90px; display:block; float:left}
a{color:#00c0ff; text-decoration:none}
a:hover{text-decoration:underline}
.st-open .contact a, .st-open .contact a:hover{background:none}
.st-content{display:none}

/***************************** Logo ******************************/
#logo{background:url(images/kahan-logo-new.png) top center no-repeat; width:620px; height:136px; margin:180px auto 60px; text-indent:-9999px}

/***************************** New Menu ******************************/
a.navitem{background:#5E5E5E; color:#FFFFFF; height:60px; line-height:60px; text-transform:uppercase; text-decoration:none; letter-spacing:1px; display:block; font-size:20px; margin:0 auto 1px; cursor:pointer; width:620px}
a.navitem span{padding:0 10px}
a.navitem:hover{background:#444 url(images/menu-expand.png) 580px 20px no-repeat}
.st-open a, .st-open a:hover{background:#505050 url(images/menu-close.png) 580px 20px no-repeat}
.st-accordion ul{list-style:none}
.st-accordion ul li{margin-bottom:1px}

/***************************** Content ******************************/
.content{background:url(images/black-linen-new.png) top left repeat; width:100%}
.content-top{background:url(images/top-shadow.png) top left repeat-x; width:100%; height:60px}
.content-bottom{background:url(images/bottom-shadow.png) bottom left repeat-x; width:100%; height:60px; clear:both}
.left{width:290px; float:left}
.right{width:290px; float:right}
.right img{margin:-50px 0 0}

/***************************** Services ******************************/
ul.services{list-style:none; margin:50px 0 0; background:url(images/diagram-arrows.png) center 50px no-repeat; height:372px}
ul.services li{float:left; width:123px; padding:140px 0 0; text-align:center; margin:0 39px 0 2px; color:#888888; cursor:pointer}
ul.services li:last-child, ul.services li.operate{margin:0}
ul.services li:hover{color:#FFFFFF}

ul.services .research{background:url(images/research-icon.png) top left no-repeat}
ul.services .research:hover{background:url(images/research-icon.png) top right no-repeat}
ul.services .design{background:url(images/design-icon.png) top left no-repeat}
ul.services .design:hover{background:url(images/design-icon.png) top right no-repeat}
ul.services .build{background:url(images/build-icon.png) top left no-repeat}
ul.services .build:hover{background:url(images/build-icon.png) top right no-repeat}
ul.services .operate{background:url(images/operate-icon.png) top left no-repeat}
ul.services .operate:hover{background:url(images/operate-icon.png) top right no-repeat}

/***************************** Form ******************************/
#enquiry{clear:both; padding:20px 0 0}
#enquiry label{font-size:13px; width:90px; height:40px; line-height:40px; display:block; float:left}
#enquiry input{width:178px; height:38px; background:#000; color:#FFF; padding:0 10px; font:bold 13px 'Century Gothic', Arial; float:left; margin:0 0 10px 0; -moz-border-radius:4px; border-radius:4px; border:1px solid #000000}
#enquiry textarea{background:#000; color:#FFF; padding:10px; font:bold 13px 'Century Gothic', Arial; height:100px; width:508px; -moz-border-radius:4px; border-radius:4px; margin:0 0 10px; border:1px solid #000000}
#enquiry .first{margin-right:40px}
#enquiry .note{font-size:11px; height:40px; line-height:40px; float:left; margin:0 0 0 90px}
#enquiry .submit{background:#00c0ff; color:#000; font:bold 16px 'Century Gothic', Arial; cursor:pointer; float:right; text-shadow:#4dd3ff 1px 1px 1px; width:130px; border:0}
#enquiry label.error{display:none !important}
#enquiry .highlight, #enquiry .hightlight{background:#e49498; border:1px solid #bc0101}
.done {background:#FFFDE1; border:2px solid #DFD1A0; color:#000000; display:none; float:left; margin:60px 0 180px; padding:20px; text-align:center; width:580px}

/********************* iPhone - Portrait *********************/
@media only screen and (max-width: 767px) {
	body{min-height:400px}
	.container, .menu {width:300px}
	a.navitem{width:300px; background:#5E5E5E url(images/menu-expand.png) 260px 20px no-repeat}
	a.navitem:hover{background:#444444 url(images/menu-expand.png) 260px 20px no-repeat}
	#logo {width:300px; background-size:300px; margin:50px auto 0}
	.right{float:left}
	.st-open a, .st-open a:hover{background:#505050 url(images/menu-close.png) 260px 20px no-repeat}
	ul.services{background:none}
	ul.services .design{margin:0}
	.right img{margin:0}
	#enquiry .first{margin-right:0}
	#enquiry textarea{width:178px}
	#enquiry .note{margin-top:-10px}
	#enquiry .submit{margin:0 80px 0 0}
	.right{margin-top:-20px}
.g-recaptcha {
    background: none;
    border-radius: 3px;
    float: right;
    margin-bottom: 10px;
    max-width: 505px;
    padding: 2%;
    width: 98%;
}
}

/********************* iPhone - Landscape *********************/
@media only screen and (min-width: 480px) and (max-width: 767px) {
	
}