@charset "utf-8";
/* Intono CSS */

@font-face {
    font-family: 'geomanistregular';
    src: url('../fonts/geomanist-regular-webfont.eot');
    src: url('../fonts/geomanist-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/geomanist-regular-webfont.woff2') format('woff2'),
         url('../fonts/geomanist-regular-webfont.woff') format('woff'),
         url('../fonts/geomanist-regular-webfont.ttf') format('truetype'),
         url('../fonts/geomanist-regular-webfont.svg#geomanistregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'geomanistlight';
    src: url('../fonts/geomanist-light-webfont.eot');
    src: url('../fonts/geomanist-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/geomanist-light-webfont.woff2') format('woff2'),
         url('../fonts/geomanist-light-webfont.woff') format('woff'),
         url('../fonts/geomanist-light-webfont.ttf') format('truetype'),
         url('../fonts/geomanist-light-webfont.svg#geomanistregular') format('svg');
    font-weight: normal;
    font-style: normal;

}


/* GENERAL */

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,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}

img {
  margin: 0;
  padding: 0;
}

body {
  font-family: 'geomanistregular', 'Open Sans', sans-serif;
  font-size: 16px;
  color: #575757;
  background-color: #ffffff;
  background-image:url("../img/intono_bg_top.png");
  background-position: right top;
  background-repeat: no-repeat;
}

#content {
	width: 100%;
	height: 100%;
}

a {
	color: #58595b;
	font-size: 1em;
	text-decoration: underline;
	font-weight: 400;
}

a:hover {
	text-decoration: none;
}

p {
	line-height: 1.42857143;
	font-size: 1em;
}

h1 {
	color: #1d1d1d;
	font-size: 40px;
	font-weight: 400;
	display: inline-block;
	vertical-align: middle;
	line-height: normal;   
}

h2 {
	font-family: 'geomanistlight', 'Open Sans', sans-serif;
	line-height: 25px;
	font-size: 21px;
	font-weight: thin;
	margin-bottom: 5px;
	margin-top: 57px;
}

ul {
	margin: 30px;
}


ul li{
	display: inline;
	list-style-type: none;
	padding-right: 70px;
}

ul li:last-child{
	padding: 0;
}



/* Header */

header {
	width: 1400px;
	height: 269px;
	margin-top: 20px;
	margin-left: auto;
	margin-right: auto;
	clear: both;
}

.logo {
	position: relative;
	float: left;
	margin: 86px 30px 116px 30px;
	width: 300px;
    height: 76px;
}

.he-txt {
	position: relative;
	float: left;
	left: 140px;
	height: 232px;
	line-height: 232px;
	text-align: center;
}

.flagg {
	position: relative;
	float: right;
}

.flagg img{
	width: 25px;
	height: 25px;
	padding-left: 14px;
}


/* Section */

section {
	width: 1400px;
	margin-left: auto;
	margin-right: auto;
	clear: both;
}

.col-left {
	margin: 0;
	padding: 0;
	width: 352px;
	height: auto;
	display: box;
	float: left;
}

.col-right {
	margin: 0;
	padding: 0;
	width: 352px;
	height: auto;
	display: box;
	float: right;
}

.col-left img, .col-right img {
	display: block;
	width: 352px;
	height: 228px;
	margin: 0;
	padding: 0;
}

.col-left p,
.col-right p,
.col-left h2,
.col-right h2  {
	padding:0 20px 0 20px;
}

.col-left img:first-child,
.col-right img:first-child {
	padding:0 0 15px 0;
	margin: 0;
	width: 352px;
	height: 227px !important;
}

.col-mid {
	margin: 0;
	padding: 0;
	width: 664px;
	height: auto;
	display: box;
	float: left;
	margin-left: 15px;
}

.midbg {
	width: 664px !important;
	height: 470px !important;
	background-color: #e2e2e2;
}

.col-mid p,
.col-mid h2 {
	padding:0 140px 0 140px;
}


/* Footer */

footer {
	margin: 0 auto;
	padding: 65px 0;
	clear: both;
}

footer p {
	text-align: center;
}

.table {
	display: table;  
	margin: 0 auto;
}


/* ----------- Responsiv - 1000 - 1400px ----------- */
@media only screen and (min-width: 1000px) and (max-width: 1400px){
	
/* Header */

header {
	width: 1000px;
	height: 187px;
	margin-top: 20px;
	margin-left: auto;
	margin-right: auto;
	clear: both;
}

.logo {
	position: relative;
	float: left;
	margin: 48px 20px 68px 20px;
	width: 280px;
    height: 71px;
}

.he-txt {
	position: relative;
	float: left;
	left: 55px;
	height: 170px;
	line-height: 170px;
	text-align: center;
}


/* Section */

section {
	width: 1000px;
	margin-left: auto;
	margin-right: auto;
	clear: both;
}

.col-left {
	width: 270px;
	height: auto;
}

.col-right {
	width: 270px;
	height: auto;
}

.col-left img, .col-right img {
	width: 270px;
	height: auto !important;
}


.col-left img:first-child,
.col-right img:first-child {
	padding:0 0 10px 0;
	width: 270px;
	height: auto !important;
}

.col-mid {
	width: 440px;
	height: auto;
	margin-left: 10px;
}

.midbg {
	width: 440px !important;
	height: 311px !important;
	padding: 24px 0 25px 0 !important;
	margin: 0 !important;
}


.col-left h2,
.col-right h2 {
	padding: 0 15px 0 15px !important;
	margin: 20px 0 4px 0 !important;
	font-size: 16px !important;
}

.col-left p,
.col-right p {
	padding: 0 15px 0 15px !important;
	margin: 0 !important;
	font-size: 13px !important;
}

.col-mid h2 {
	padding: 0 80px 0 80px !important;
	margin: 20px 0 4px 0 !important;
	font-size: 16px !important;
}

.col-mid p {
	padding: 0 80px 0 80px !important;
	margin: 0 !important;
	font-size: 13px !important;
}



/* Footer */

footer {
	padding: 50px 0;
}

footer p,
footer a {
	text-align: center;
	font-size: 13px !important;
}


footer ul {
	margin: 20px;
}


ul li{
	display: inline;
	list-style-type: none;
	padding-right: 60px;
}

}

/* ----------- Responsiv under 1000px----------- */
@media only screen and (max-width: 999px){
	
			
/*------- Header ----------*/


header {
	width: 100% !important;
    height: 100% !important;
	text-align: center important;
	clear: both !important;
}

.logo {
	position: static !important;
	float: none !important;
	margin: 60px 12.5% 50px 12.5% !important;
    width: 75% !important;
	height: 100% !important;
}


.he-txt {
	position: static !important;
	float: none !important;
	margin: 0 auto 50px auto !important;
    width: 80% !important;
	height: 100% !important;
	line-height: 100% !important;
}


.flagg {
	position: absolute;
	top:15px;
	right:15px;
}


.flagg img{
	width: 17px;
	height: 17px;
	padding-left: 7px;
}

/* Section */

section {
	width: 100% !important;
    height: 100% !important;
	text-align: center important;
	clear: both !important;
}

.col-left, .col-mid, .col-right {
	position: static !important;
	float: none !important;
	margin: 0 auto !important;
    width: 80% !important;
	height: auto !important;
}


.midbg {
	position: static !important;
	float: none !important;
	margin: 0 auto !important;
    width: 100% !important;
	height: auto !important;
	background-color: #e2e2e2;
}

.col-left img, .col-right img {
	width: 100% !important;
	height: auto !important;
	margin: 0 !important;
	padding:0 !important;
}

.col-mid img {
	width: 80% !important;
	height: auto !important;
	margin: 0 !important;
	padding:10% !important;
}

.col-left h2,
.col-right h2,
.col-mid h2  {
	padding: 15px 0 5px 0 !important;
	margin: 0 !important;
}

.col-left p,
.col-right p,
.col-mid p {
	padding: 0 0 40px 0 !important;
	margin: 0 !important;
}

.col-left img:first-child,
.col-right img:first-child {
	display: none !important;
}



/* Footer */


footer {
	width: 80% !important;
    height: auto !important;
	text-align: center important;
	clear: both !important;
	padding: 20px 0 65px 0 !important;
}

footer p {
	text-align: center !important;
}

.table {
	display: table !important;
	margin: 0 auto !important;
}

ul {
	margin: 0 !important;
}


ul li{
	display: inline;
	list-style-type: none;
	padding-right: 20px;
}

ul li:last-child{
	padding: 0;
}

}