.navbar-toggler{ z-index: 1; }    
@media (max-width: 576px){
	nav > .container {width: 100%;} 
}

h2.section-heading span.title{
	color:#7eddd3;
}


p span{
	font-weight: bold;
	color: #5fc2b8; 
}

#mainNav.navbar-shrink .outer-menu .hamburger{
	border: 1px solid #222;
}

.outer-menu .menu > div > div.lingua{position:absolute; top:40%;}
.outer-menu .menu > div > div.lingua > ul > li {display:inline-block; font-size:14px; padding:0.5em 1em; border:2px solid #0ED2F7;}
.outer-menu .menu > div > div > ul > li > a:hover{border-color:#e5e5e5;}

#bgvid { 
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: -100;
    transform: translateX(-50%) translateY(-50%);
	background-size: cover;
	transition: 1s opacity;
}

#title-sx{
	width: 45%;
	float: left;
	text-align: right;
}

#title-dx{
	width: 52%;
	float: right;
	text-align: left;
}

section .intro-lead-in {	
	color: #7eddd3;
    font-size: 26px;
    line-height: 26px;
    font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	margin:2em 0;
}
section a:hover{
	text-decoration:none;
}


header.masthead {
	background-image: url('../img/header-bg.jpg');
	background-repeat: no-repeat;
	background-attachment: scroll;
	background-position: center center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}

.intro-text h2{
	font-size: 24px;
	margin-top: 3em;
}

.intro-text p{	
	margin:0 auto;
	font-size:20px; 
	line-height:28px; 
	padding:10px 0 0 0;
}

section p{
	font-size: 17px;
}


a.servizio-box{
	width: 100%;
	color:inherit;
}
a.servizio-box:hover > .servizio-box-caption{
	opacity: 1;
}
.servizio-box-list{
	min-height: 390px;
	border: 1px solid #eceeef;
	background: #fff;
	position: relative;
	padding: 50px 0;
	box-shadow: 0px 0px 2px #d2d2d2;
}
.servizio-box-list h2{
	margin-bottom:20px;
	font-weight: 400;
}

.servizio-box-list h2 span{
	font-weight: 200;
}
.servizio-box-list hr{
	max-width: 50px;
    border-width: 3px;
    border-color: #7b4397;	
}

.servizio-box-list ul{
	list-style: none;
    padding: 0;
    margin: 0;
}

.servizio-box-list ul li{
	line-height:20px;
	margin-bottom:15px;
}

.servizio-box-caption{
	background: #B2FEFA;  
	background: -webkit-linear-gradient(to right, #7eddd3, #B2FEFA);  
	background: linear-gradient(to right, #7eddd3, #B2FEFA); 
	position: absolute;
    bottom: 0;
    display: block;
    width: 95%;
    height: 100%;
    text-align: center;
    opacity: 0;
    color: #fff;
}

.servizio-box-content{
	position:absolute;
	top: 50%;
    width: 100%;
    transform: translateY(-50%);
    text-align: center;
}
.servizio-box-content h2{
	font-weight: 300;
	text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
}
.servizio-box-content h2 span{
	font-family:'Kaushan Script', 'Helvetica Neue', Helvetica, Arial, cursive;
	text-transform: none;
	font-size: 60px;
	font-weight: 700;
	text-shadow:0px 5px 8px rgba(0, 0, 0, 0.3);
}

/* shadow box */
.effect-shadow:before, .effect-shadow:after{
  z-index: -1;
  position: absolute;
  content: "";
  bottom: 15px;
  left: 10px;
  width: 50%;
  top: 80%;
  max-width:300px;
  background: #222;
  -webkit-box-shadow: 0 15px 10px #222;
  -moz-box-shadow: 0 15px 10px #222;
  box-shadow: 0 15px 10px #222;
  -webkit-transform: rotate(-3deg);
  -moz-transform: rotate(-3deg);
  -o-transform: rotate(-3deg);
  -ms-transform: rotate(-3deg);
  transform: rotate(-3deg);
}
.effect-shadow:after{
  -webkit-transform: rotate(3deg);
  -moz-transform: rotate(3deg);
  -o-transform: rotate(3deg);
  -ms-transform: rotate(3deg);
  transform: rotate(3deg);
  right: 10px;
  left: auto;
}

/* background-fill */
.background-fill{
	transform: translateX(-50%);
    left: 50%;
    position: absolute;
    bottom: -250px;
    width: 1200px;
    height: 400px;
	z-index:-10;
	background-size: cover;
} 

.style2{
	position: relative;
}

.style2 #bg-col{
	background: -webkit-linear-gradient(to right, rgba(126, 221, 211, 1), rgba(178, 254, 250, 0.9));  
	background: linear-gradient(to right, rgba(126, 221, 211, 1), rgba(178, 254, 250, 0.9));
	
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	width: 50%;
}

.style2 #bg-col-right{
	background: -webkit-linear-gradient(to right, rgba(126, 221, 211, 1), rgba(178, 254, 250, 0.9));  
	background: linear-gradient(to right, rgba(126, 221, 211, 1), rgba(178, 254, 250, 0.9));
	height: 100%;
	position: absolute;
	top: 0;
	right: 0;
	width: 50%;
}


.style2 hr{
	max-width: 50%;
    border-width: 3px;
    border-color: #fff;
    text-align: left;
    margin: 0 0 15px 0;
}

.style2 .benefit{
	background:rgba(255, 255, 255, 0.9);
	padding:2em 2em;
}

.style2 .benefit hr{
	max-width: 50px;
    border-width: 3px;
    border-color: #7b4397;
    text-align: left;
    margin: 0 0 15px 0;
}

.style2 h1{
	font-family: 'Kaushan Script', 'Helvetica Neue', Helvetica, Arial, cursive;
    text-transform: none;
	font-size: 6em;
	color:rgba(0, 0, 0, 0.8);
}

.style2 h2{	font-weight: 400; }
.style2 h2 span{ font-weight: 700; }
.style2 p{ font-size:14px;}

/* mockup */
#mockup .feature-item i,
#about .feature-item i{
	background: -webkit-linear-gradient(to right, rgba(126, 221, 211, 0.9), #7eddd3);  
	background: linear-gradient(to right, rgba(126, 221, 211, 0.9), #7eddd3);	
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;	
}
#mockup .feature-item span{
	position: absolute;
    top: 0px;
    left: 60px;
}
#about .feature-item span{
	position: absolute;
    top: 0px;
	left: 0px;
}

#mockup .feature-item span i.fa-inverse,
#about .feature-item span i.fa-inverse{
	/*-webkit-text-fill-color: #fff; */
	font-family:'Kaushan Script', 'Helvetica Neue', Helvetica, Arial, cursive;
}

/*#mockup .feature-item span .text-primary { color: #fed136 !important;}*/

#mockup .feature-item{
	padding:2em 0;
}

#about .feature-item{
	padding:4em 0 2em;
}

#mockup .feature-item p{
	font-size: 20px;
    line-height: 26px;
    margin-top: 14px;
}
#about .feature-item p{
	font-size: 18px;
    line-height: 20px;
	margin-top: 14px;
}

#mockup .btn.center-block,
#about .btn.center-block{
	margin: 0 auto;
}

/* mockup device */
.device-mockup{
	position:relative;
	width:100%;
	padding-bottom:61.775701%;
}
.device-mockup>.device{
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	right:0;
	width:100%;
	height:100%;
	background-size:100% 100%;
	background-repeat:no-repeat;
}

.device-mockup>.device>.screen{
	position:absolute;
	top:11.0438729%;
	bottom:14.6747352%;
	left:13.364486%;
	right:13.364486%;
	overflow:hidden;
}

.device-mockup>.device>.screen > img{
	display: block; 
	max-width: 100%; 
	height: auto;
}
	
section.features .device-container,
section.features .feature-item {
  max-width: 300px;
  margin: 0 auto;
}
section.features .device-container {
  margin-bottom: 100px;
}
@media (min-width: 992px) {
  section.features .device-container {
    margin-bottom: 0;
  }
}

@media (min-width: 992px) {
  section.features .device-container,
  section.features .feature-item {
    max-width: none;
  }
}

.device-mockup.iphone6_plus,
.device-mockup.iphone6_plus.portrait {
	padding-bottom: 201.76%;
}

.device-mockup.iphone6_plus.landscape {
	padding-bottom: 49.56%;
}

.device-mockup.iphone6_plus > .device,
.device-mockup.iphone6_plus.black > .device,
.device-mockup.iphone6_plus.portrait.black > .device {
	background-image: url("../img/iphone_6_plus/iphone_6_plus_black_port.png");
}

.device-mockup.iphone6_plus.landscape > .device,
.device-mockup.iphone6_plus.landscape.black > .device {
	background-image: url("../img/iphone_6_plus/iphone_6_plus_black_land.png");
}

.device-mockup.iphone6_plus.white > .device,
.device-mockup.iphone6_plus.portrait.white > .device {
	background-image: url("../img/iphone_6_plus/iphone_6_plus_white_port.png");
}

.device-mockup.iphone6_plus.landscape.white > .device {
	background-image: url("../img/iphone_6_plus/iphone_6_plus_white_land.png");
}

.device-mockup.iphone6_plus.gold > .device,
.device-mockup.iphone6_plus.portrait.gold > .device {
	background-image: url("../img/iphone_6_plus/iphone_6_plus_gold_port.png");
}

.device-mockup.iphone6_plus.landscape.gold > .device {
	background-image: url("../img/iphone_6_plus/iphone_6_plus_gold_land.png");
}

.device-mockup.iphone6_plus > .device > .screen,
.device-mockup.iphone6_plus.portrait > .device > .screen {
    top: 11.58%; bottom: 11.58%; left: 5.97%; right: 5.97%;
}

.device-mockup.iphone6_plus.landscape > .device > .screen {
    top: 5.97%; bottom: 5.97%; left: 11.38%; right: 11.58%;
}

.device-mockup.iphone6_plus > .device > .button,
.device-mockup.iphone6_plus.portrait > .device > .button {
	display: block;
    top: 89.9%; bottom: 3.2%; left: 43%; right: 43%;
}

.device-mockup.iphone6_plus.landscape > .device > .button {
	display: block;
	top: 43%; bottom: 43%; left: 89.9%; right: 3.2%;
}

/* PREZZI */
#price .servizio-box-list{
	z-index: 1;
}

#price .background-fill{
	z-index: 0;
}

.servizio-box-list ul.prezzi li{
	padding: 1em;
	margin:0;
}

.servizio-box-list ul.prezzi li:nth-of-type(2n+1) {
    background-color: rgba(23, 61, 80, 0.06);
  }

.cd-currency, .cd-value {
  font-size: 3rem;
  font-weight: 700;
}

@media only screen and (min-width: 768px) {
  .cd-value { 
	  font-size: 6rem;
	  font-weight: 700; 
	  font-family:'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	}
	
	.cd-value.min { 
	  font-size: 3rem;
	  font-weight: 400; 
	  font-family:'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	}
 }
 
/* contact */
#contactForm h2, #contactForm p{
	color: #fff;
}

#contactForm{
	width: 100%;
}

.form-control{
	color: #eeeeee;
	background-color: rgba(41, 43, 44, 0.5);
	border-radius: 0;
	border: 0;
	border-bottom: 1px solid #ffffff;
}

.form-control:focus{
	color: #fff;
    background-color: rgba(41, 43, 44, 0.5);
}

/* cosa vuoi certificare? */
.no-gutter>[class*=col-]{
	padding-right: 0;
    padding-left: 0;
}
.portfolio-box {
	position: relative;
	display: block;
	/*max-width: 650px;*/
	margin: 0 auto;
}

.portfolio-box img{
	width:100%;
	-webkit-filter: brightness(75%); 
	filter: brightness(75%); 
}
.portfolio-box .portfolio-box-caption {
    position: absolute;
    bottom: 0;
    display: block;
    width: 100%;
    height: 100%;
    text-align: center;
    opacity: 0;
    color: white;
	background: rgba(0, 0, 0, 0.7);
    /*background: url(../img/bg-pattern.png),linear-gradient(to right,#7eddd3, #7b4397);*/
    -webkit-transition: all .2s;
    -moz-transition: all .2s;
    transition: all .2s;
}

.portfolio-box .project-category{
	color:#fff;
	opacity:1;
	position: absolute;
	top: 50%;
    width: 100%;
    transform: translateY(-50%);
    text-align: center;
}
.portfolio-box .portfolio-box-caption .portfolio-box-caption-content {
    position: absolute;
	top: 50%;
    width: 100%;
    transform: translateY(-50%);
    text-align: center;
	padding: 0 3em;
	
	}
.portfolio-box-caption-content p{
	line-height:22px;
}
	
.portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-category,
.portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-name {
    padding: 0 15px;
    font-family:'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	}
.portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-category {
    font-size: 14px;
	font-weight: 600;
    text-transform: uppercase;
	}
.portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-name {
	font-family:'Kaushan Script', 'Helvetica Neue', Helvetica, Arial, cursive;
    font-size: 18px;
	}
.portfolio-box:hover .portfolio-box-caption {
    opacity: 1;
	}
.portfolio-box:hover .project-category {
    opacity: 0;
	}
.portfolio-box:focus{
    outline: none;
	}

@media (min-width: 768px) {
.portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-category {
    font-size: 16px;
	}
.portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-name {
    font-size: 22px; 
	} 
}





/* MENU */
.outer-menu {
  position: absolute;
  top: 0;
  right: 60px;
  z-index: 1;
}
.outer-menu .checkbox-toggle {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  cursor: pointer;
  width: 60px;
  height: 60px;
  opacity: 0;
}
.outer-menu .checkbox-toggle:checked + .hamburger > div {
  -webkit-transform: rotate(135deg);
          transform: rotate(135deg);
}
.outer-menu .checkbox-toggle:checked + .hamburger > div:before,
.outer-menu .checkbox-toggle:checked + .hamburger > div:after {
  top: 0;
  -webkit-transform: rotate(90deg);
          transform: rotate(90deg);
}
.outer-menu .checkbox-toggle:checked + .hamburger > div:after {
  opacity: 0;
}
.outer-menu .checkbox-toggle:checked ~ .menu {
  pointer-events: auto;
  visibility: visible;
}
.outer-menu .checkbox-toggle:checked ~ .menu > div {
  -webkit-transform: scale(1);
          transform: scale(1);
  -webkit-transition-duration: .75s;
          transition-duration: .75s;
}
.outer-menu .checkbox-toggle:checked ~ .menu > div > div {
  opacity: 1;
  -webkit-transition: opacity 0.4s ease 0.4s;
  transition: opacity 0.4s ease 0.4s;
}
.outer-menu .checkbox-toggle:hover + .hamburger {
  box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.1);
}
.outer-menu .checkbox-toggle:checked:hover + .hamburger > div {
  -webkit-transform: rotate(225deg);
          transform: rotate(225deg);
}
.outer-menu .hamburger {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 60px;
  height: 60px;
  padding: .5em 1em;
  border: 1px solid #fff;
  /*background: rgba(33, 150, 243, 0.75);*/
  /*border-radius: 0 0.12em 0.12em 0;*/
  cursor: pointer;
  -webkit-transition: box-shadow 0.4s ease;
  transition: box-shadow 0.4s ease;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.outer-menu .hamburger > div {
  position: relative;
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  width: 100%;
  height: 2px;
  background: #FEFEFE;
  -webkit-transition: all 0.4s ease;
  transition: all 0.4s ease;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.outer-menu .hamburger > div:before,
.outer-menu .hamburger > div:after {
  content: '';
  position: absolute;
  z-index: 1;
  top: -10px;
  left: 0;
  width: 100%;
  height: 2px;
  background: inherit;
  -webkit-transition: all 0.4s ease;
  transition: all 0.4s ease;
}
.outer-menu .hamburger > div:after {
  top: 10px;
}
.outer-menu .menu {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  visibility: hidden;
  overflow: hidden;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  outline: 1px solid transparent;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.outer-menu .menu > div {
	width: 200vw;
	height: 200vw;
	color: #FEFEFE;
	background: rgba(34, 34, 34, 0.90);
	/*background: #007991;
	background: -webkit-linear-gradient(to left, #78ffd6, #007991);  
	background: linear-gradient(to left, #78ffd6, #007991); */

	border-radius: 50%;
	-webkit-transition: all 0.4s ease;
	transition: all 0.4s ease;
	-webkit-box-flex: 0;
	-ms-flex: none;
	flex: none;
	-webkit-transform: scale(0);
	transform: scale(0);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	overflow: hidden;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}
.outer-menu .menu > div > div {
  text-align: center;
  max-width: 90vw;
  max-height: 100vh;
  opacity: 0;
  -webkit-transition: opacity 0.4s ease;
  transition: opacity 0.4s ease;
  overflow-y: auto;
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.outer-menu .menu > div > div > ul {
  list-style: none;
  padding: 0 1em;
  margin: 0;
  display: block;
  max-height: 100vh;
}
.outer-menu .menu > div > div > ul > li {
  padding: 0;
  margin: 1em;
  font-size: 24px;
  display: block;
}
.outer-menu .menu > div > div > ul > li > a {
	font-family:'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	text-transform: uppercase;
	text-decoration: none;
	position: relative;
	display: inline;
	cursor: pointer;
	-webkit-transition: color 0.4s ease;
	transition: color 0.4s ease;
}
.outer-menu .menu > div > div > ul > li > a:hover {
  color: #e5e5e5;
}
.outer-menu .menu > div > div > ul > li > a:hover:after {
  width: 100%;
}
.outer-menu .menu > div > div > ul > li > a:after {
  content: '';
  position: absolute;
  z-index: 1;
  bottom: -0.15em;
  left: 0;
  width: 0;
  height: 2px;
  background: #e5e5e5;
  -webkit-transition: width 0.4s ease;
  transition: width 0.4s ease;
}

#on-top{
	background:rgba(95, 194, 184, 0.9);
	position:fixed;
	bottom: 0;
	left: 0;
	z-index: 1100;
	background: 
}

#on-top a{
	display: block;
	width: 60px;
	text-align: center;
	font-size: 2em;
	line-height:60px;
	color: #fff;
}

#to-down{
	font-size: 3em;
    color: #fff;
}





@media only screen and (max-width: 768px) {
	
	.outer-menu .menu > div > div.lingua{
		top:25%;
	}
	
	#mainNav{
		background-color: transparent;
	}
	
	#mainNav.navbar-shrink{
		background-color: #222;
		height: 75px;
	}
	
	#mainNav.navbar-shrink .outer-menu .hamburger{
		border-color: #fff;
	}
	
	section{
		padding: 200px 0;
	}
	
	header.masthead .intro-text{
		padding-top: 160px;
	}
	
	.intro-text p{
		width:100%;
	}
	
	#bgvid{
		display: none;
	}
	
	.style2 .benefit{
		background:rgba(255, 255, 255, 1);
	}
	
	.servizio-box-list{
		margin: 1em 0;
	}
	
	.background-fill{
		bottom: -200px;
	}
	
	.style2 #bg-col{
		width: 100%;
		opacity; 0.9;
	}
	
	.style2 .benefit{
		margin-top: 2em;
	}
	
	#contact #contactForm h2{
		margin-top: 2em;
	}
	
	.background-fill,
	#on-top{
		display: none;
	}	
	
	#mockup .btn.center-block{
		font-size: 1em;
		padding: 1em .5em;
	}
	
	#about h2.section-heading{
		color: #fff;
		text-align: center;
	}
	
	

}

@media only screen and (max-width: 767px) {	
	header.masthead .intro-text .intro-heading{
		font-size: 85px;
	}
}

/* pagina tutela creatività */
h3.heading-subtitle{
	font-weight: 400;
    font-size: 24px;
    text-align: inherit;
}

h4.titolo-corsivo{
	text-transform: none;
	font-family: 'Kaushan Script', 'Helvetica Neue', Helvetica, Arial, cursive;
	font-size: 30px;
    margin: 1em 0;
   
}