/* inspired by */
/*!
 * LEGEND - Free Responsive One Page Template
 *
 * Copyright 2013
 * Created by: Inbetwin Network
 * URL: http://inbetw.in
 * Designed and built based on Twitter Bootstrap. */

/*
===========================
CONTENTS:

01 Sensible defaults
02 Typography
03 Non-semantic
04 Navbar
05 Single-Page Sections
06 Footer
07 Media queries 
===========================
*/

/* ---------------------------------------------------------------------------------------------------------- 
01 Sensible defaults ----------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------- */

div, article, section, header, footer, nav, li {
	position:relative;
}

body {
	background:#f0f0f0;
	color: #312A1E;
	font-size: 1em;
	font-family: 'titilliumregular', sans-serif;
}

/* ---------------------------------------------------------------------------------------------------------- 
02 Typography -----------------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------- */
/*

14 / 16	= 		0.875em 		(14px equivalent)
16 / 16	= 		1em 			(16px equivalent)
18 / 16 = 		1.125em 		(18px equivalent)
21 / 16 = 		1.3125em 		(21px equivalent)
24 / 16 = 		1.5em 			(24px equivalent)
30 / 16 = 		1.875em 		(30px equivalent)

*/

@font-face {
    font-family: 'titilliumregular';
    src: url('/files/nic/ietf93/TitilliumWeb-Regular.eot');
    src: url('/files/nic/ietf93/TitilliumWeb-Regular.eot?#iefix') format('embedded-opentype'),
         url('/files/nic/ietf93/TitilliumWeb-Regular.woff') format('woff'),
         url('/files/nic/ietf93/TitilliumWeb-Regular.ttf') format('truetype'),
         url('/files/nic/ietf93/TitilliumWeb-Regular.svg#titilliumregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'titilliumbold';
    src: url('/files/nic/ietf93/TitilliumWeb-Bold.eot');
    src: url('/files/nic/ietf93/TitilliumWeb-Bold.eot?#iefix') format('embedded-opentype'),
         url('/files/nic/ietf93/TitilliumWeb-Bold.woff') format('woff'),
         url('/files/nic/ietf93/TitilliumWeb-Bold.ttf') format('truetype'),
         url('/files/nic/ietf93/TitilliumWeb-Bold.svg#titilliumregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'titilliumthin';
    src: url('/files/nic/ietf93/TitilliumWeb-Thin.eot');
    src: url('/files/nic/ietf93/TitilliumWeb-Thin.eot?#iefix') format('embedded-opentype'),
         url('/files/nic/ietf93/TitilliumWeb-Thin.woff') format('woff'),
         url('/files/nic/ietf93/TitilliumWeb-Thin.ttf') format('truetype'),
         url('/files/nic/ietf93/TitilliumWeb-Thin.svg#titilliumregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

p {
	font-size: 1em; /* 16px */
	line-height: 1.5; /* 24px */
	margin: 0 0 1.5em 0;
}
ul, ol {
	font-size: 1em; /* 16px */
	line-height: 1.5; /* 24px */
	margin: 0 0 1.5em 0;
}
body, input, textarea {
}
a:link, a:visited {
	color: #901a71;
}
a:hover, a:active {
	color: #94141a;
	text-decoration: underline;
}
h1, h2, h3, h4, h5, h6 {
	font-weight: normal; /* reset default browser weight for our webfonts */
	font-family: 'titilliumregular', Arial, Helvetica, sans-serif;
}
h1 {
	font-size: 1.5em; /* 24px */
	line-height: 1; /* 24px */
	margin-top: 1.42em;
	margin-bottom: 0em;
}
h2 {
	font-size: 1.3125em; /* 21px */
	line-height: 1.1429; /* 24px */
	margin-top: 1.1429em;
	margin-bottom: 0em;
}
h3 {
	font-size: 1.125em; /* 18px */
	line-height: 1.3333; /* 24px */
	margin-top: 1.3333em;
	margin-bottom: 0em;
}
h4 {
	font-size: 1em; /* 16px */
	line-height: 1.5; /* 24px */
	margin-top: 1.5em;
	margin-bottom: 0em;
}
h5 {
	font-size: 0.875em; /* 14px */
	line-height: 1.7143; /* 24px */
	margin-top: 1.7143em;
	margin-bottom: 0em;
}
strong {
	font-weight:normal;
	font-family: 'titilliumregular', Arial, Helvetica, sans-serif;
}
small {
	font-size: 0.75em; /* 12px */
	line-height: 2; /* 24px */
	margin-top: 2em;
	margin-bottom: 0em;
}
em {
	font-style: normal;
	font-family: 'titilliumregular', Arial, Helvetica, sans-serif;
	text-decoration: strike;
}
line {
    white-space: nowrap;
}
.muted {
	color: #A5A5A2;
	font-family: 'titilliumregular', Arial, Helvetica, sans-serif;
}
.impressed {
	text-shadow:
 -1px -1px 0 rgba(0, 0, 0, 0.5), /* shadow */  1px 1px 0 rgba(255, 255, 255, 0.9); /* highlight */
}
.more-link {
	font-size: .875em; /* 14px */
	margin-top: 1.5em;
	font-family: 'titilliumregular', Arial, Helvetica, sans-serif;
}
.more-link:link, .more-link:visited {
	color: #f0bf00;
	text-transform: uppercase;
}
/* ---------------------------------------------------------------------------------------------------------- 
03 Non-semantic ------------------------------------------------------------
---------------------------------------------------------------------------------------------------------- */
/* New Image Replacement Hack */

.alignright {
	text-align: right;
}
.alignleft {
	text-align: left;
}
.aligncenter {
	text-align: center;
}
.medium {
	font-weight: normal;
	font-family: 'titilliumregular', Arial, Helvetica, sans-serif;
}
.big {
	font-family: 'titilliumbold', Arial, Helvetica, sans-serif;
	font-size: 2em;
}
.clear { 
    clear: both; 
}
.zinzolin {
    color: #901a71;
}
.bordeaux {
    color: #94141a;
}
.cerise {
    color: #cc101c;
}
.brique {
    color: #e85c1a;
}
.orange {
    color: #f4a11a;
}
.moutarde {
    color: #e8cc01;
}
.topaze {
    color: #feed70;
}
.menthe {
    color: #5bb062;
}
.turquoise {
    color: #37b3ac;
}
.sarcelle {
    color: #21a3c1;
}

/* ---------------------------------------------------------------------------------------------------------- 
04 Navbar ------------------------------------------------------------
---------------------------------------------------------------------------------------------------------- */

.navbar-fixed-top .container {
/* Uncomment to make nav expand full width */
 /*	width: auto; */
}
.navbar .btn-tweet {
    display: none;;
}

.navbar .brand {
    margin-left:0;
    padding: 0;
    margin: 1em 0;
    width: 25%;
    white-space: nowrap;
}
.navbar .brand img {
    height: auto;
}
.navbar .brand a {
    padding: 0;
    color: #333;
    font-size: 1.75em;
    margin-left: 0;
    font-weight: normal;
    font-family: 'titilliumregular', Arial, Helvetica, sans-serif;
}
.navbar .brand a:hover {
	text-decoration: none;
	color:#f0bf00;
	transition: color .15s linear;
	-webkit-transition: color .15s linear;
	-moz-transition: color .15s linear;
}
.navbar .brand a:focus {
	outline: none;
}
.navbar-inner {
	min-height: 6.75em;
}
.navbar-inverse .navbar-inner {
	background-repeat: repeat;
	background-color: #fff;
	border-bottom: 2px solid rgba(120, 120, 120, .45);
}
.navbar-wrapper {
	overflow:hidden;/* No fixed height, will break collapsible nav */
}
#menu-main {
	margin-top: 2.125em;
}
ul#menu-main > li > a {
	background-color: #fff;
	font-family: 'titilliumregular', Arial, Helvetica, sans-serif;
	font-weight: normal;
	font-size: 1.2em;
	color: #901a71;
}
ul#menu-main > li > a:hover {
	background-color: #901a71;
	background-color: #94141a;
	color: #feed70;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	text-decoration: none;
}

ul#menu-main > li.tweet > a {
    border: 0;
    background: none;
    padding: 0;
    margin: -5px 0 0 20px;
}
ul#menu-main > li.tweet > a > img {
    width: 48px;
    height: 48px;
}
.navbar-inverse .brand, .navbar-inverse .nav > li > a {
	text-shadow: none;
}
/* ---------------------------------------------------------------------------------------------------------- 
05 Single-Page Sections ------------------------------------------------------------
---------------------------------------------------------------------------------------------------------- */

#headerwrap {
    height: 0;
    padding-bottom: 64.5%;
    position: relative;
    margin-top: 108px;
    width: 100%;
/*
    min-height: 724px;
    width: 100%;
    border: 3px solid orange;
*/
}

#headerwrap > header {
    position: absolute;
    top: 0; bottom: 0; left: 0; right: 0;
}

header .frame1 {
    background: #fff;
    margin: -25em auto auto;
    width: 600px;
    text-align: center;
    display: block;
    padding: 2em;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    border-bottom: 4px solid rgba(120, 120, 120, .85);
}

header .frame1:hover {
    background: none repeat scroll 0 0 rgba(255, 255, 255, 0.75);
    border-bottom: 4px solid rgba(120, 120, 120, .9);
}

header h1 {
 	color: #333;
	font-family: 'titilliumregular', Arial, Helvetica, sans-serif;
	font-size: 2.5em;
	margin: 0;
	opacity: 1;
}
header h2 {
	color: #333;
	font-family: 'titilliumthin', Arial, Helvetica, sans-serif;
	font-size: 2.5em;
	margin: 5px 0;
	opacity: 1;
}
header p {
    margin: 2em 0 0;
    font-size: 1.25em;
}

header .polygon {
    background: url("/files/nic/ietf93/polygons01.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
    width:100%;
    height: 20%;
    margin: -139px 0 0 10%;
}

/* sections */

section {
    background-color: #fff;
    padding: 3.75em 0; /* 76px */
    margin: 3em 0 -3em 0;
}

section.grey {
    background-color: #e3e3e3;
}

section h1 {
	font-family: 'titilliumthin', Arial, Helvetica, sans-serif;
	font-size: 3em;
	margin: 1em 0;
	text-align: center;
}

#feature {
	z-index: 500;
	box-shadow: 0 5px 16px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: 0 5px 16px rgba(0, 0, 0, 0.3);
	-webkit-box-shadow: 0 5px 16px rgba(0, 0, 0, 0.3);
}

#welcome headline {
    display:block;
    font-family: 'titilliumregular', Arial, Helvetica, sans-serif;
    font-size: 3em;
    font-weight: 100;
    margin: 1em 0 0 0;
    line-height: 1.35;
    color: #333;
}
#welcome headline span {
	color: #901a71;
}

#welcome h2 {
    color: #333;
    font-family: 'titilliumthin', Arial, Helvetica, sans-serif;
    font-size: 2em;
    font-weight: 100;
    margin: 1em 0;
}

section#feature {
    margin-top: 0;
}
#feature article {
    text-align: center;
    max-width: 1170px;
}
#feature article p {
    font-family: 'titilliumthin', Arial, Helvetica, sans-serif;
    font-size: 2.4em;
    font-weight: normal;
    color: #333;
    margin-bottom: 3%; /* 39px */
    margin-top: -.25em;
    height: auto;
    padding: 1em 0;
    background-size: 100% auto;
}

#feature article a {
    color: #94141a;
}

/* Services */

section#practical {
    padding-bottom: 3.5em;
    box-shadow: 0 5px 16px rgba(0, 0, 0, 0.3);
}
section#transport {
    padding-bottom: 3.5em;
}
section h2 {
	font-size: 22px;
	margin-bottom: 15px;
	margin-top: 10px;
	text-align:center;
}
section p {
	margin:2em;
}
section .align {
	text-align:center;
	margin-top:1px;
}

section .sev_icon {
    margin-top: 60px;
}
section .align i.sev_icon {
    text-align:center;
    margin: -60px auto auto;
    font-size: 0.6em;
    color:#F0BF00;
    background-size: contain;
    background-repeat:  no-repeat;
    display: block;
    width: 94px;
    height: 94px;
}

.icon-car {
    background: url("/files/nic/ietf93/pic-car.png");
}
.icon-climate {
    background: url("/files/nic/ietf93/pic-climate.png");
}
.icon-currency {
    background: url("/files/nic/ietf93/pic-currency.png");
}
.icon-electricity {
    background: url("/files/nic/ietf93/pic-electricity.png");
}
.icon-emergency {
    background: url("/files/nic/ietf93/pic-emergency.png");
}
.icon-plane {
    background: url("/files/nic/ietf93/pic-plane.png");
}
.icon-public_transport {
    background: url("/files/nic/ietf93/pic-public_transport.png");
}
.icon-telephone {
    background: url("/files/nic/ietf93/pic-telephone.png");
}
.icon-time {
    background: url("/files/nic/ietf93/pic-time.png");
}
.icon-train {
    background: url("/files/nic/ietf93/pic-train.png");
}

section .post {
	background:#e9e9e9;
	padding: 20px 0;
	border-bottom: 4px solid rgba(120, 120, 120, .45);
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
	display: block;
	float: left;
	font-size: 1.35em;
}
section .post.postwhite, section .post.postwhite:hover {
	background:#fff;
	border: 0;
}
section .span.post.postwhite p {
    margin: 0 6em;
    text-align: center;
}

section .post p {
    font-size: 0.85em;
    text-align: center;
}
section .post h2 {
    font-size: 1.1em;
}
section .span.post p {
    margin: 0 6em;
    text-align:left;
}
section .span.post p span.fleft {
    display:inline-block;
    float: left;
    margin: 15px 15px 0 0;
}

section .span.post p span.fleft.boulette {
    width: 38em;
}

section .span.post .briqueblock {
	background: none repeat scroll 0 0 rgba(232, 92, 26, 0.5);
	padding: 20px 0;
}
section#transport .post {
	background: none repeat scroll 0 0 rgba(255, 255, 255, 0.8);
	padding-bottom: 0;
}
section .post:hover {
	border-bottom: 4px solid rgba(120, 120, 120, .85);
	background-color: #e3e3e3;
}
section#transport .post:hover {
	background: none repeat scroll 0 0 rgba(255, 255, 255, 1);
}
section#transport .post img.skyteam {
    width: 75%;
    height: auto;
}

/* Testimonials */

section#where {
	padding-bottom: 0;
	color: #e4e5e2;
	z-index: 500;
	box-shadow: 0 0 16px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: 0 0 16px rgba(0, 0, 0, 0.3);
	-webkit-box-shadow: 0 0 16px rgba(0, 0, 0, 0.3);
}
section#where {
	color:#312A1E;
	font-family: 'titilliumregular', Arial, Helvetica, sans-serif;
}
section#where .blockquote-wrapper {
    margin: 0 12%;
}
section#where .iframe img {
    width: 100%;
    height: auto;
}
blockquote.mega {
	color:#312A1E;
	font-family: 'titilliumregular', Arial, Helvetica, sans-serif;
}
blockquote.mega p {
	font-size: 45px;
	line-height: 50px;
	text-align: left;
	font-weight:bold;
	color:#312A1E;
}
blockquote.mega .cite {
	font-size: 22px;
	text-align: left;
	font-weight:300;
}

/* Team and Contact */

section#team, section#contact {
	color: #333;
	background:#fff;
}
section#team .align, section#contact .align {
	font-size: 6em;
	text-align: center;
}
#team h1, #contact h1 {
	font-size: 3em;
	margin-bottom: 1em;
	margin-top: 0.5em;
}
#contact, #team {
    padding: 4.75em 0;
    margin-bottom: 0;
}

/* team */

#team h3 {
	font-size: 26px;
	margin-top: 24px;
	margin-bottom: 0px;
}
#team h3, .role {
	text-align: center;
}
#team .featurette {
	text-align: center;
	font-size: 21px;
}
#team h2.featurette-heading {
	margin-bottom: 24px;
}
.teamalign {
	text-align:center
}

#team .offset3 {
    margin-right: 30px;
}

section#transport .polygon {
    background: url("/files/nic/ietf93/polygons02.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
    width:100%;
    height: 185px;
    margin: -60px 0 0 53%;
    position: absolute;
}
section#transport .polygon2 {
    background: url("/files/nic/ietf93/polygons03.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
    width:100%;
    height: 185px;
    margin: -129px 0 0 52%;
    position: absolute;
}

section#socialevent .polygonl {
    background: url("/files/nic/ietf93/polygons07.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
    height: 75px;
    margin: -19px 0 0;
    position: absolute;
    width: 223px;
}

section#socialevent .polygonr {
    background: url("/files/nic/ietf93/polygons06.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
    height: 189px;
    position: absolute;
    width: 209px;
    bottom: 0;
    right: 0;
}

section#where .polygonh {
    background: url("/files/nic/ietf93/polygons04h.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
    width:100%;
    height: 130px;
    margin: -60px 0 0 3%;
    position: absolute;
}
section#where .polygonl {
    background: url("/files/nic/ietf93/polygons04l.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
    width:100%;
    height: 130px;
    margin: -110px 0 0;
    position: absolute;
}


/* ---------------------------------------------------------------------------------------------------------- 
06 Footer ------------------------------------------------------------
---------------------------------------------------------------------------------------------------------- */

#map-wrapper {
	margin-top: 20px;
}
footer {
	text-align: center;
	color: #1a1a1a;
}
footer .polygon {
    background: url("/files/nic/ietf93/polygons05.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
    width:100%;
    height: 117px;
    margin: -24px 0 0 27%;
}

footer p {
/*	margin-top: -130px; */
}
.footer-wrapper {
	background-color: #e3e3e3;
}

/* ---------------------------------------------------------------------------------------------------------- 
07 Media queries --------------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------- */


/* RESPONSIVE 
-------------------------------------------------- */

@media (max-width: 1186px) {
    section#practical .span4 p {
	font-size: 0.9em;
    }

    section#socialevent .polygonr {
	display: none;
    }
}
 @media (max-width: 979px) {
     .navbar-fixed-top {
	 margin-bottom: 0;
     }

     .navbar .container {
	 width: 100%;
     }

     .navbar .btn-navbar {
	 margin-top: 1em;
     }

     .navbar .btn-tweet {
	 float: right;
	 margin-top: 0.7em;
	 display: block;
     }

     .navbar .btn-tweet img {
	 width: 32px;
	 height: 32px;
     }

     ul#menu-main > li.tweet {
	 display: none;
     }

     .navbar-fixed-top .navbar-inner {
	 padding: 0 1em;
     }

     #menu-main {
	 margin-top: 0;
     }

     #headerwrap {
	 margin-top: 0;
     }

     header .polygon {
	 margin: -123px 0 0 10%;
     }

     #feature, #welcome {
	font-size: 0.95em; /* 19px */
	height: auto;
     }

     #feature article {
	margin:1em;
     }

     section .span.post p span.fleft.boulette {
         width: 100%;
     }

 }
 @media (min-width: 768px) and (max-width: 979px) {
     header .frame1 {
	 margin: -25em auto auto;
	 width: 80%;
	 font-size: 0.8em; /* 19px */    
     }

     #feature {
	font-size: 0.92em; /* 19px */
     }

 }
 @media (max-width: 767px) {
     .container {
	 padding-right: 5px;
	 padding-left: 5px;
     }

     .navbar-fixed-top,  .navbar-fixed-bottom,  .navbar-static-top {
	 margin-right: 0px;
	 margin-left: 0px;
	 margin-bottom:0px;
	 padding-bottom:0px;
     }

     .navbar-inner {
	 margin: 0;
     }

     .navbar .brand img {
	 height: 50px;
	 max-width: none;
	 width: auto;
     }

     header .frame1 {
	 margin: -23em auto auto;
	 width: 80%;
	 font-size: 0.63em; /* 19px */    
     }

     header .polygon {
	display: none;
     }

     #feature {
	font-size: 0.76em; /* 19px */
     }
    
     section .span.post p {
        margin: 0 2em;
        text-align: left;
     }

     br.gap {
         display: none;
     }
}
    
    /* Smaller screens ----------- */
 @media (max-width : 480px) {
     body {
	 padding: 0 5px;
     }
     .navbar .brand img {
	 height: 39px;
     }
     .polygon, .polygon2, .polygonh, .polygonl {
	 display:none;
     }
    #feature, #welcome {
	font-size: 0.65em; /* 19px */
    }
     #headerwrap {
	 padding-top:0;
     }
     header .frame1 {
	 margin: -15em auto auto;
     }
     header .frame1 p {	 
	 display: none;
     }
     #team .team-thumb {
	 margin-right: auto;
	 margin-left: auto;
	 width: 150px;
	 display: block;
	 text-align:center;
     }
     #feature article p {
	 font-size: 14px; /* font-size: 26px; */
	 padding: 0;
	 line-height: 30px;
     }
     section#practical .span4 p {
	 font-size: 1.1em;
     }
 }
    
    /* Smartphones (portrait and landscape) ----------- */
 @media only screen  and (min-device-width : 320px)  and (max-device-width : 480px) {
     #feature-headline {
	 background: transparent;
	 text-indent: 0;
	 overflow: visible;
	 margin-top: 1.5em;
     }
     #navbar-inner {
	 margin:	0;
     }
     #banner { /*display: none;*/
     }
     section.single-page {
	 padding: 1em 0;
     }
          
     /* Services */
     
     #practical h1 {
	 background: transparent;
     }
     #practical h1 span {
	 background: transparent;
	 padding: 0;
     }
     section#practical h2 {
	 margin-bottom: 0.25em;
     }
     section#practical h2, section#practical ul {
	 text-align: center;
     }
     

     
     /* team */
     
     .navbar-fixed-top, .navbar-fixed-bottom, .navbar-static-top {
	 margin-left: auto;
	 margin-right: auto;
     }     
 }

/* Smartphones (landscape) ----------- */
@media only screen  and (min-width : 321px) {
    #feature #welcome {
	font-size: 1.1875em; /* 19px */
    }
}
	
/* Smartphones (portrait) ----------- */
@media only screen  and (max-width : 320px) {
    #feature #welcome {
	font-size: 1.1875em; /* 19px */
    }
    .navbar .brand img {
	height: 25px;
    }
    header .frame1 {
	margin: -12em auto auto;
	font-size: 0.45em;
    }
}
	
/* iPads (portrait and landscape) ----------- */
@media only screen  and (min-device-width : 768px)  and (max-device-width : 1024px) {
/* Styles */
}
	
	/* iPads (landscape) ----------- */
	@media only screen  and (min-device-width : 768px)  and (max-device-width : 1024px)  and (orientation : landscape) {
/* Styles */
	}
	
	/* iPads (portrait) ----------- */
	@media only screen  and (min-device-width : 768px)  and (max-device-width : 1024px)  and (orientation : portrait) {
/* Styles */
	}
	
	/* Desktops and laptops ----------- */
	@media only screen  and (min-width : 1224px) {
/* Styles */
	}
