@CHARSET "ISO-8859-1";
/*
@t81-skyblue: #23abdd;
@t81-blue: #0e3b83;
@t81-yellow: #fdd243;
@t81-gray: #c3c3c3;

@brand-primary: #0e3b83;
@brand-success: #5cb85c;
@brand-info:    #23abdd;
@brand-warning: #fdd243;
@brand-danger:  #d9534f;
*/
/* Font */
@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,400italic,600italic,600,700,700italic,300,300italic);
@import url('https://fonts.cdnfonts.com/css/satoshi');
body {
	font-family: 'Satoshi', sans-serif;/*'Source Sans Pro', Lato, sans-serif;*/
}

/* columns of same height styles */
.container-xs-height {
    display:table;
    padding-left:0px;
    padding-right:0px;
}
.row-xs-height {
    display:table-row;
}
.col-xs-height {
    display:table-cell;
    float:none;
}


/* ---- sticky footer ---- */

.sticky-wrap {
	height: 100%;
}

.sticky-main {
	padding-bottom: 150px; /* la stessa altezza del footer */
}

.sticky-footer {
	position: relative;
	margin-top: -150px; /* valore negativo dell'altezza del footer */
	height: 150px;
	clear:both;
}

@media (min-width: 768px) {
    .container-sm-height {
        display:table;
        padding-left:0px;
        padding-right:0px;
    }
    .row-sm-height {
        display:table-row;
    }
    .col-sm-height {
        display:table-cell;
        float:none;
    }
}
@media (min-width: 992px) {
    .container-md-height {
        display:table;
        padding-left:0px;
        padding-right:0px;
    }
    .row-md-height {
        display:table-row;
    }
    .col-md-height {
        display:table-cell;
        float:none;
    }
}
@media (min-width: 1200px) {
    .container-lg-height {
        display:table;
        padding-left:0px;
        padding-right:0px;
    }
    .row-lg-height {
        display:table-row;
    }
    .col-lg-height {
        display:table-cell;
        float:none;
    }
}

/* vertical alignment styles */
.col-top {
    vertical-align:top;
}
.col-middle {
    vertical-align:middle;
}
.col-bottom {
    vertical-align:bottom;
}

/* --- color --- */

body {
	color: #1C1C1C;
}

.white-bg {
	color: #000;
	background-color: #FFF;
}

.grey-bg {
	background-color: #EFF1F2;
}

.gray-bg {
	background-color: #EFF1F2;
}

.black-bg {
	color: #FFF;
	background-color: #1C1C1C;
}

.skyblue-bg {
	color: #fff;
	background-color: #2C98F0;
}

.blue-bg {
	color: #fff;
	background-color: #0e3b83;
}

.yellow-bg {
    color: #000;
    background-color: #FFD110;
}

.redAdecco-bg {
	color: #fff;
	background-color: #e1001a;
}

.libellula-pri-bg {
    color: #FFF;
    background-color: #DB4949;
}

.libellula-sec-bg {
    color: #FFF;
    background-color: #FD765D;
}

.libellula-page-color {
    color: #000;
    background-color: #F7EFE4;
}

.lightredAdecco-bg {
	color: #fff;
	background-color: #fa7b6d;
}

a {
/*	color: #23abdd;*/
    color: #000;
}

a:focus, a:hover {
/*	color: #2C98F0;*/
    color: #000;
    font-weight: bold;
}

.btn-primary {
	background-color: #2C98F0;
	border-color: #2C98F0;
}

.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open .dropdown-toggle.btn-primary {
	background-color: #0A2E68;
	border-color: #0A2E68;
}

.progress-bar-gray{
	background-color: #c3c3c3;
}

.progress-bar{
    background-color: #2C98F0;
}

.progress-bar-success{
    background-color: #4CA58E;
}

.progress-bar-danger{
    background-color: #FC5D4E;
}

footer {
	padding: 50px 0;
	text-align: center;
	background-color: #8B8E92;
	color: #FFF;
}

.navbar {
	min-height: 80px;
	margin-bottom: 0;
	border: none;
}

.nav > li > a {
	color: #FFF!important;
	font-weight: bold;
	text-shadow: 0 0 0 rgba(0, 0, 0, 0);
	font-size: 15px;
	padding-top: 10px;
	text-transform: uppercase;
}

.nav>li>a:hover, .nav>li>a:focus {
	background-color: transparent;
}
.nav > li > a.brand {
	background: url(../img/logo2bgskyblue.png) no-repeat left center;
	text-indent: -99999px;
	width: 245px;
	height: 50px
}

.nav {
	height: 50px;
	margin: 15px 0;
}

.nav img {
	height: 40px;
}

.skyblue {
	background-color: #23abdd;
}

.skyblue, .skyblue a  {
	color: #fff;
}

.skyblue:hover, .skyblue:focus, .skyblue:hover a, .skyblue:focus a {
	color: #fff;
}

.skyblue small{
	color: #fff;
}

.jumbotron {
	min-height: 500px; 
	margin-bottom: 0;
}

.jumbotron h1 {
	padding: 75px 0 0 0;
}

.jumbotron a {
	margin-bottom: 25px;
}

.videoWrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	height: 0;
}
.videoWrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/* header */
#header {
	border-radius: 0;
}

/* sign-up-bar */

.sign-up-bar {
	background-color: #23abdd;
	width: 100%;
	padding-bottom: 24px;
}

.sign-up-bar h3 {
	color: #fff;
}

.sign-up-bar input{
    position: relative;
    padding: 24px 20px;
    font-size: 16px;
    line-height: 20px;
    color: #555;
    font-weight: 400;
    border: 1px solid #4CCFFF;
    background-color: rgba(255, 255, 255, 1);
}

.sign-up-bar button{
    padding: 24px 20px;
    font-size: 16px;
    line-height: 0px;
}

.sign-up-bar .alert-success {
    margin: 10px 0;
    padding: 5px;
    right: 15px;
    background-color: rgba(0, 255, 0, 0.25);
}

.sign-up-bar .alert-warning {
    margin: 10px 0;
    padding: 5px;
    right: 15px;
    background-color: rgba(255, 0, 0, 0.25);
}

/* products */

#products {
	text-align: center;
	padding: 25px 0;
}


/* circles */

#circles{
	padding:26px 0;
}

#circles .col-md-4{
	padding-top:40px;
}

#circles h3{
	font-size:32px;
	line-height:32px;
	color:#393b3e;
	font-weight:normal;
}

#circles p{
	font-size:18px;
	color:#96989b;
}

ul.trials{
	margin:0; padding:0;
	float:right;  
	position:relative;
}

	ul.trials::after{
		content:'';
		position:absolute;
		left:-70px;
		top:50%;
		margin-top:-22px;
		width:45px; height:45px;
		display:block;
		background:url(../img/icons.png) no-repeat -14px -357px;
	}

	ul.trials li{
		float:left; display:block;
		margin-right:16px;
		list-style:none;
	}

		ul.trials li a{
			width:174px;
			height:174px;
			line-height:174px;
			display:block;
			text-align:center;
			font-size:21px;
			color:#fff;
			text-transform:uppercase;
			background:#23abdd;
			-webkit-border-radius:90px;
			-moz-border-radius:90px;
			border-radius:90px;
			-webkit-backface-visibility:hidden;
			-webkit-transition: box-shadow linear 0.3s;
			-moz-transition:box-shadow linear 0.3s;
			-o-transition: box-shadow linear 0.3s;
			transition: box-shadow linear 0.3s;     
		}
	
			ul.trials li a:hover{
				text-decoration:none;
			}

			ul.trials li.blue a{
				background:#0e3b83;
			}

			ul.trials li.yellow a{
				background:#fdd243;
			}

			ul.trials li.gray a{
				background:#c3c3c3;
			}

			ul.trials li.orange a:hover{
				-webkit-box-shadow:0 0 30px #e1603a;
				-moz-box-shadow:0 0 30px #e1603a;
				box-shadow:0 0 30px #e1603a;
			}

			ul.trials li.blue a:hover{
				-webkit-box-shadow:0 0 30px #0e3b83;
				-moz-box-shadow:0 0 30px #0e3b83;
				box-shadow:0 0 30px #0e3b83;
			}

			ul.trials li.yellow a:hover{
				-webkit-box-shadow:0 0 30px #fdd243;
				-moz-box-shadow:0 0 30px #fdd243;
				box-shadow:0 0 30px #fdd243;
			}

			ul.trials li.gray a:hover{
				-webkit-box-shadow:0 0 15px #c3c3c3;
				-moz-box-shadow:0 0 15px #c3c3c3;
				box-shadow:0 0 15px #c3c3c3;
			}

.separator{
	border-top:1px solid #d9dee1;
}

/* formazione */

#formazione{
	padding:60px 0;
}

#formazione .container{
	position:relative;
}

#formazione h2{
	font-size:40px;
	font-weight:normal;
	text-align:center;
	color:#fff;
	padding-right: 0px;
}

#formazione img{
	position:absolute;
	right:-86px;
	top:-122px;
	z-index:20;
}

/* monitor-box */

iframe.monitor {
	position: absolute;
	top: 7%;
	left: 4%;
	width: 92%;
	height: 93%;
}

#monitor-box{
	padding:50px 0 300px 0;
	text-align: center;
}

	.monitor-title{
		font-size:28px;
		color:#6d6f72;
		line-height:60px;   
	}

	.hightlight{
		line-height:50px;
		padding:10px;
		background:#7cc9dd;
		color:#fff;
		-webkit-border-radius:5px;
		-moz-border-radius:5px;
		border-radius:5px;
	}

	.monitor-tooltips{
		padding:88px 0 50px 0;
		position:relative;
	}

		.monitor-tooltips .tooltip{
			opacity:1;
			background:#696d71;
			color:#fff;
			display:block;
			padding:15px 20px 15px 15px;
			font-size:18px;
			font-family: 'Apercu Bold', Helvetica, sans-serif;
			-webkit-border-radius:8px;
			-moz-border-radius:8px;
			border-radius:8px;
		}

			.monitor-tooltips .tooltip:hover{
				text-decoration:none;
			}

			.monitor-tooltips .tooltip.right::after{
				content:'';
				position:absolute;
				border-top: 16px solid transparent;
				border-bottom: 16px solid transparent;        
				border-right:16px solid #696d71; 
				left:-8px; top:50%;
				margin-top:-15px;   
				width:0px; height:0px;
			}

			.monitor-tooltips .tooltip.left::after{
				content:'';
				position:absolute;
				right:-8px; top:50%;
				margin-top:-15px; 
				border-top: 16px solid transparent;
				border-bottom: 16px solid transparent;        
				border-left:12px solid #696d71; 
				width:0px; height:0px;
			}

		#tooltip-1{
			width:182px;
			left:12%;
			top:388px;
		}

		#tooltip-2{
			width:182px;
			right:-1%;
			top:274px;
		}

		#tooltip-3{
			width:182px;
			right:-4%;
			top:508px;
		}

	#monitor-box img{
		width:100%;
		margin-left:0px;
	}

	.arrow-bottom{
		width:52px; height:50px;
		display:block;
		position:absolute;
		top:30px; left:46%; margin-left:-25px;
		background:url(../img/icons.png) no-repeat -9px -297px;
	}

/* features */

#features{
	padding:60px 0 130px 0;
	border-top:1px solid #d8dbde;
	box-shadow:inset 0 5px 5px -3px rgba(0,0,0,0.1);
	background:#f3f5f7;
}

	#main-features{
		margin:0; padding:0;
	}

		#main-features li{
			float:left; display:block;
			text-align:center;
		}

		#main-features li strong{
			width:100%;
			display:block;
			font-size:27px;
			line-height:27px;
			color:#727272;
			font-weight:normal;
			font-family: 'Apercu Bold', Helvetica, sans-serif;
			padding:20px 0 6px;
		}

		#main-features li p{
			width:100%;
			display:block;
			color:#727272;
			font-size:15px;
			margin:0;
		}

	#list-features{
		background:#fff;
		border:1px solid #dbdcdf;
		-webkit-border-radius:10px;
		-moz-border-radius:10px;
		border-radius:10px;
		margin:80px 0 0 0;
		padding: 0px;
		width: auto;
	}

		.feature{
			border-bottom:1px solid #dbdcdf;
			padding:60px 76px 56px 262px;
			position:relative;
		}

			.feature::after{
				content:'';
				position:absolute;
				border-top: 18px solid #fff;
				border-right: 18px solid transparent;         
				border-left:18px solid transparent; 
				left:50%; bottom:-18px;
				margin-left:-19px;    
			}

			.feature::before{
				content:'';
				position:absolute;
				border-top: 19px solid #dbdcdf;
				border-right: 19px solid transparent;         
				border-left:19px solid transparent; 
				left:50%; bottom:-19px;
				margin-left:-20px;  
			}

			.feature.last{
				border-bottom:none;
			}

				.feature.last::after{
					display:none;
				}

				.feature.last::before{
					display:none;
				}

			.feature img{
				position:absolute;
				top:50px; left:60px;
			}

			.feature h3{
				font-size:32px;
				color:#6d6f72;
				font-family: 'Apercu Bold', Helvetica, sans-serif;
				font-weight:normal;
			}

			.feature p{
				font-size:21px;
				line-height:24px;
				color:#6d6f72;
			}

			.feature p a, .feature a{
				color:#5bbcd5;
				text-decoration:underline;
			}

				.feature a:hover{
					color:#2189A4;
				}

@media (max-width: 979px) and (min-width: 768px) {

	.container {
		width: 100%;
		padding-left: 15px;
		padding-right: 15px;
	}
	
	#header .container {
		padding-left: 0;
		padding-right: 0;
	}
	
	.jumbotron h1 {
		padding: 0;
	}

	.navbar.header_navbar .nav.navbar-left {
		border-right: 0 none;
		background: #139BCD;
		padding: 10px 0 10px 5% !important;
		float: none !important;
	}
	.navbar.header_navbar .nav.navbar-left > li:first-child {
		float: none;
	}
	
	.navbar.header_navbar .nav.navbar-right {
		margin-right: 0;
		background: #33BBED;
		position: initial;
		padding: 10px 0 10px 5% !important;
		float: none !important;
	}
	
	.navbar.header_navbar .nav {
		height: auto;
		width: 100%;
		margin: 0;
	}
}

@media (max-width: 767px) {

	.container {
		width: 100%;
		padding-left: 0px;
		padding-right: 0px;
	}
	
	.jumbotron h1 {
		padding: 0;
	}

	.navbar.header_navbar .nav.navbar-left {
		border-right: 0 none;
		background: #139BCD;
		padding: 10px 0 10px 5% !important;
		float: none !important;
	}
	.navbar.header_navbar .nav.navbar-left > li:first-child {
		float: none;
	}
	
	.navbar.header_navbar .nav.navbar-right {
		margin-right: 0;
		background: #33BBED;
		position: initial;
		padding: 10px 0 10px 5% !important;
		float: none !important;
	}
	
	.navbar.header_navbar .nav {
		height: auto;
		width: 100%;
		margin: 0;
	}
}