/*
Theme Name: Gordio Networks Theme
Author: Krisztian Panyik
Version: 1.0
*/

/******************************************************

					CSS RESET
			Resets browser defaults
					
******************************************************/	

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{background:transparent;border:0;margin:0;padding:0}
body{line-height:1;font-size:14px;position:relative;z-index:0}
h1,h2,h3,h4,h5,h6{line-height:130%}
ol,ul{list-style:none}
blockquote{quotes:none}
blockquote:before,blockquote:after{content:none}
del{text-decoration:line-through}
table{border-collapse:collapse;border-spacing:0}
a,#featured-container a:hover{outline:none;text-decoration:none}
a:hover{text-decoration:underline}
a:active{text-decoration:blink}
a img{border:none}
textarea{resize:none}
input::-moz-focus-inner{border:0;padding:0}
a,button{cursor:pointer}
input[type=submit],a:hover,a:focus,input{outline:none}



/******************************************************

					   GENERAL			
						
******************************************************/	


body {
	position: relative;
}

/*------------------ Typography ------------------*/

body {
	font-family: 'dn-light', Arial, Helvetica, sans-serif;
	font-size: 15px;
	color: #6a747c;
}
a, a:visited, a:active {
  color: #b5894a;
	font-size: 15px;
  font-weight: 400;
	line-height: 130%;
  font-size: 21px;
}
a:hover {
  text-decoration: none;
}
h1, 
h2, 
h3, 
h4,
h5,
h6 {
	font-weight: 400;
	line-height: 130%;
	color: #b5894a;
}
h2 {
	font-size: 48px;
	margin-right: -50px;
}
h3,
#home h2 {
	font-family: 'dn-regular', Arial, Helvetica, sans-serif;	
	font-size: 21px;
	text-transform: uppercase;
	margin: 28px 0 20px;
}
h3:first-child {
	margin-top: 0;
}
.nodot { background: #ffffff; }
.content-body p,
.content-body ul,
.content-body ol {
	margin-bottom: 15px; 
	font-size: 15px;
	line-height: 20px;
}
.content-body li {
	padding-left: 17px;
  margin: 0 0 5px 0;
	list-style: none;
	background: url(images/bulletpoint.png) no-repeat 2px 7px;
}
.content-body em,
.content-body strong,
.content-body b {
font-weight: 400;
font-style: normal;
color: #B5894A;
}
.content-body em {
font-size: 20px;
line-height: 24px;
}
.content-page {
  float: left;
  width: 460px;
  margin: 0 16px 0 0;
}
.content-pageset {
  position: relative;
  top: 0;
  left: 0;
  width: 920px;
}
.pageset-1 { width: 476px; }
.pageset-2 { width: 952px; }
.pageset-3 { width: 1428px; }
.pageset-4 { width: 1904px; }
.pageset-5 { width: 2380px; }
.pageset-6 { width: 2856px; }
.pageset-7 { width: 3332px; }
.pageset-8 { width: 3808px; }

/*------------------ Structure ------------------*/

.page-wrapper,
.content-wrapper {
	position: absolute;
}
.page-wrapper {
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	height: 100%;
	width: 100%;
	min-width: 980px;
	min-height: 560px;
	background-repeat: no-repeat;
	overflow: hidden;
}
.content-wrapper {
	width: 460px;
  padding: 0 0 0 3px;
}
.content-head {
	margin-bottom: 22px;
}


/* page-wrapper positions */

.page-wrapper.left.top {
	background-position: right bottom;
}
.page-wrapper.left.bottom {
	background-position: right top;
}
.page-wrapper.right.top {
	background-position: left bottom;
}
.page-wrapper.right.bottom {
	background-position: left top;
}

.page-wrapper.left.top .inner-mainnav {
	right: 2%;
	top: 2%;
}
.page-wrapper.left.bottom .inner-mainnav {
	right: 2%;
	bottom: 2.5%;
}
.page-wrapper.right.top .inner-mainnav {
	left: 2%;
	top: 2%;
}
.page-wrapper.right.bottom .inner-mainnav {
	left: 2%;
	bottom: 2.5%;
}

.page-wrapper.left .content-wrapper {
	left: 2%;
}
.page-wrapper.right .content-wrapper {
	right: 2%;
}
.page-wrapper.top .content-wrapper {
	top: 2%;
}
.page-wrapper.bottom .content-wrapper {
	bottom: 2%;
}

/*------------------ Navigation ------------------*/

/* Pager */

.pager {
	list-style: none;
}
.pager li {
	float: left;
	display: block;
	width: 21px;
	height: 21px;
	margin-right: 5px;
	text-indent: -999em;
	background: url(images/pager.png) no-repeat;
}
.pager li:hover,
.pager li.active {
	background-position: 0 -21px;
	cursor: pointer;
}

/* Nav - temp */
.mainnav,
.inner-mainnav {
	position: absolute;
	display: block;
  z-index: 80;
}
.mainnav {
	width: 700px;
	height: 356px;
}
.inner-mainnav {
	width: 255px;
	height: 195px;
}


/*--------------------- Misc ---------------------*/

.logo {
	display: block;
	height: 90px;
	margin-left: -3px;
	background: url(images/logo.png) no-repeat;
	text-indent: -999em;
}

.clearfix:after,
.pager:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
.clearfix,
.pager {
	zoom: 1;
}

/******************************************************

					   PAGES			
						
******************************************************/

#home {
	background: url(images/illust_home.jpg) no-repeat left bottom;	
}
#home .page-head {
	margin: 18px 25px 25px;
	height: 82px;
}
#home .logo {
	position: absolute;
	top: 22px;
	right: 25px;
	width: 231px;	
}

#our-approach-0 {
	background-image: url(images/illust_our_approach_0.jpg);
}
#our-approach-1 {
	background-image: url(images/illust_our_approach_0.jpg);
}
#our-approach-2 {
	background-image: url(images/illust_our_approach_2.jpg);
}
#case-studies-0 {
	background-image: url(images/illust_case_studies_0.jpg);
}
#case-studies-1 {
	background-image: url(images/illust_case_studies_1.jpg);
}
#case-studies-2 {
	background-image: url(images/illust_case_studies_2.jpg);
}
#case-studies-3 {
	background-image: url(images/illust_case_studies_3.jpg);
}
#case-studies-4 {
	background-image: url(images/illust_case_studies_4.jpg);
}
#case-studies-5 {
	background-image: url(images/illust_case_studies_5.jpg);
}
#case-studies-6 {
	background-image: url(images/illust_case_studies_6.jpg);
}
#case-studies-7 {
	background-image: url(images/illust_case_studies_7.jpg);
}
#what-is-new-0 {
	background-image: url(images/illust_what_is_new_0.jpg);
}
#what-is-new-1 {
	background-image: url(images/illust_what_is_new_0.jpg);
}
#what-is-new-2 {
	background-image: url(images/illust_what_is_new_0.jpg);
}
#for-whom {
	background-image: url(images/illust_for_whom.jpg);
}
#cockpit-information {
	background-image: url(images/illust_cockpit_information.jpg);
}
#references {
	background-image: url(images/illust_references.jpg);
}
#about-us {
	background-image: url(images/illust_about_us.jpg);
}


#what-we-do.graph-sample {
	background-image: url(images/illust_graph_sample.jpg);
}


/*----------------- Hi Res ------------------*/

@media (min-width: 1500px) {


#home {
	background-image: url(images/illust_home_hires.jpg);	
}
#our-approach-0 {
	background-image: url(images/illust_our_approach_0_hires.jpg);
}
#our-approach-1 {
	background-image: url(images/illust_our_approach_0_hires.jpg);
}
#our-approach-2 {
	background-image: url(images/illust_our_approach_2_hires.jpg);
}
#case-studies-0 {
	background-image: url(images/illust_case_studies_0_hires.jpg);
}
#case-studies-1 {
	background-image: url(images/illust_case_studies_1_hires.jpg);
}
#case-studies-2 {
	background-image: url(images/illust_case_studies_2_hires.jpg);
}
#case-studies-3 {
	background-image: url(images/illust_case_studies_3_hires.jpg);
}
#case-studies-4 {
	background-image: url(images/illust_case_studies_4_hires.jpg);
}
#case-studies-5 {
	background-image: url(images/illust_case_studies_5_hires.jpg);
}
#case-studies-6 {
	background-image: url(images/illust_case_studies_6_hires.jpg);
}
#case-studies-7 {
	background-image: url(images/illust_case_studies_7_hires.jpg);
}
#what-is-new-0 {
	background-image: url(images/illust_what_is_new_0_hires.jpg);
}
#what-is-new-1 {
	background-image: url(images/illust_what_is_new_0_hires.jpg);
}
#what-is-new-2 {
	background-image: url(images/illust_what_is_new_0_hires.jpg);
}
#for-whom {
	background-image: url(images/illust_for_whom_hires.jpg);
}
#cockpit-information {
	background-image: url(images/illust_cockpit_information_hires.jpg);
}
#references {
	background-image: url(images/illust_references_hires.jpg);
}
#about-us {
	background-image: url(images/illust_about_us_hires.jpg);
}


#what-we-do.graph-sample {
	background-image: url(images/illust_graph_sample_hires.jpg);
}

	
}



/* -----------  Raphael style  ------------- */

#base_menu {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 60;
}
#base_container {
  position: fixed;
  z-index: 70;
}
#email {
  position: fixed;
  right: 25px;
  bottom: 25px;
  z-index: 200;
}
#base_content {
  position: fixed;
  z-index: 100;
  visibility: hidden;
  padding: 0 0 0 3px;
  overflow: hidden;
}
#content-hider {
  position: fixed;
  z-index: 140;
  visibility: hidden;
  overflow: hidden;
}
#new-page {
  background-color: #ff0000;
  z-index: 200;
}
#content-wrapper {
  overflow: hidden;
}
.lang {
  cursor: pointer;
}
.mail-icon {
  position: absolute;
  bottom: 10px;
  right: 20px;
  width: 42px;
  height: 42px;
}
#reference-container {
  width: 470px;
  background: #ff0000;
}
#reference-container img {
  float: left;
  padding: 0;
  border: 0;
  margin: 0;
}

/* -------- SVG format -------- */
circle { cursor: pointer; }
text { cursor: pointer; }

/* -------- Note points -------- */
div.np {
  width: 20px;
  height: 20px;
}
div.np circle {
  cursor: default;
}

#about-us #np-0 {
  position: absolute;
  top: 47px;
  left: 186px;
}
#about-us #np-1 {
  position: absolute;
  top: 43px;
  left: 431px;
}
#about-us #np-2 {
  position: absolute;
  top: 176px;
  left: 343px;
}

#our-approach-0 #np-0,#our-approach-1 #np-0, #our-approach-2 #np-0 {
  position: absolute;
  top: 73px;
  right: 232px;
}
#our-approach-0 #np-1,#our-approach-1 #np-1, #our-approach-2 #np-1 {
  position: absolute;
  top: 178px;
  right: 283px;
}
#our-approach-0 #np-2,#our-approach-1 #np-2, #our-approach-2 #np-2 {
  position: absolute;
  top: 219px;
  right: 141px;
}

#for-whom #np-0 {
  position: absolute;
  top: 47px;
  right: 126px;
}
#for-whom #np-1 {
  position: absolute;
  top: 123px;
  right: 428px;
}
#for-whom #np-2 {
  position: absolute;
  top: 205px;
  right: 234px;
}

#references #np-0 {
  position: absolute;
  bottom: 221px;
  left: 250px;
}
#references #np-1 {
  position: absolute;
  bottom: 184px;
  left: 161px;
}
#references #np-2 {
  position: absolute;
  bottom: 86px;
  left: 332px;
}

#what-is-new-0 #np-0, #what-is-new-1 #np-0, #what-is-new-2 #np-0 {
  position: absolute;
  bottom: 295px;
  right: 248px;
}
#what-is-new-0 #np-1, #what-is-new-1 #np-1, #what-is-new-2 #np-1 {
  position: absolute;
  bottom: 158px;
  right: 452px;
}
#what-is-new-0 #np-2, #what-is-new-1 #np-2, #what-is-new-2 #np-2 {
  position: absolute;
  bottom: 101px;
  right: 314px;
}



@media (min-width: 1500px) {

#about-us #np-0 {
  position: absolute;
  top: 64px;
  left: 244px;
}
#about-us #np-1 {
  position: absolute;
  top: 59px;
  left: 563px;
}
#about-us #np-2 {
  position: absolute;
  top: 231px;
  left: 448px;
}


#our-approach-0 #np-0,#our-approach-1 #np-0, #our-approach-2 #np-0 {
  position: absolute;
  top: 97px;
  right: 304px;
}
#our-approach-0 #np-1,#our-approach-1 #np-1, #our-approach-2 #np-1 {
  position: absolute;
  top: 234px;
  right: 370px;
}
#our-approach-0 #np-2,#our-approach-1 #np-2, #our-approach-2 #np-2 {
  position: absolute;
  top: 287px;
  right: 186px;
}

#for-whom #np-0 {
  position: absolute;
  top: 64px;
  right: 166px;
}
#for-whom #np-1 {
  position: absolute;
  top: 163px;
  right: 559px;
}
#for-whom #np-2 {
  position: absolute;
  top: 269px;
  right: 307px;
}

#references #np-0 {
  position: absolute;
  bottom: 290px;
  left: 328px;
}
#references #np-1 {
  position: absolute;
  bottom: 242px;
  left: 212px;
}
#references #np-2 {
  position: absolute;
  bottom: 114px;
  left: 434px;
}

#what-is-new-0 #np-0, #what-is-new-1 #np-0, #what-is-new-2 #np-0 {
  position: absolute;
  bottom: 378px;
  right: 318px;
}
#what-is-new-0 #np-1, #what-is-new-1 #np-1, #what-is-new-2 #np-1 {
  position: absolute;
  bottom: 204px;
  right: 579px;
}
#what-is-new-0 #np-2, #what-is-new-1 #np-2, #what-is-new-2 #np-2 {
  position: absolute;
  bottom: 133px;
  right: 403px;
}



}

div.right div.tooltip {
  width: 314px;
  height: 71px;
  background: url(images/tooltip_left.png) no-repeat;
  padding: 17px 24px 21px 25px;
  overflow: hidden;
  display: none;
}

div.tooltip table {
  border: 0;
  margin: 0;
  padding: 0;
  width: 314px;
  height: 71px;
  table-layout: fixed;
  overflow: hidden;
}
div.tooltip tr {
  margin: 0;
  padding: 0;
  border: 0;
}
div.tooltip td {
  margin: 0;
  padding: 0;
  border: 0;
  width: 314px;
  height: 71px;
  font-size: 18px;
  line-height: 24px;
  color: #b0813e;
  vertical-align: middle;
  overflow: hidden;
}