/* 
-- Copyright 2017 red plan design studio
-- http://www.redplan.it
--
*/


/*BASE - MOBILE*/
html, body{
	font-family: 'Roboto Condensed', sans-serif;
  font-size:15px;
  -webkit-font-smoothing: subpixel-antialiased!important;
  text-rendering: optimizelegibility;
  color:black;
  font-weight:400;
  background-color:#1b1b1b;
}
body {
    width: 100%;
    height: 100%;
}

html {
    width: 100%;
    height: 100%;
}

a{
  text-decoration:none;
  outline:none;
  font-size:14px; color:#FFF;
}

a:active, a:hover{
outline:none;
text-decoration:none;
color:#39F
}



a:focus{
text-decoration:none;
}
h1{
  font-family: 'Roboto Condensed', sans-serif;
	font-size:30px;
	color:#000;
	text-transform:uppercase;
font-size: 36px;/*MOBILE*/
font-weight: 100;
line-height: 0.83em;
margin-bottom:15px;
}

@media screen and (min-width: 768px) {
h1 {font-size:108px }
}

p{
font-family:'Roboto',sans-serif;
  font-size:13px;
  color:white;
  font-weight:300;
  letter-spacing:0.08em;
  line-height:20px;
  margin-top:40px;
}


h1 span{
  color:#2fa68e;
}


::selection {
  background: #ada074;
  color:white;
}

::-moz-selection {
  background: #ada074;
  color:white;
}




/*EFFETTI */
a,a:visited,a:hover,a:active{
  -webkit-backface-visibility:hidden;
          backface-visibility:hidden;
	position:relative;
  transition:0.5s color ease;
  color:#FFF;

}


.animated { 
    -webkit-animation-duration: 4s; 
    animation-duration: 4s; 
    -webkit-animation-fill-mode: both; 
    animation-fill-mode: both; 
} 

/**********
* Fade In *
**********/ 
@-webkit-keyframes fadeIn { 
    0% {opacity: 0;} 
    100% {opacity: 1;
        display:block;} 
} 
@keyframes fadeIn { 
    0% {opacity: 0;} 
    100% {opacity: 1;
        display:block;} 
}
.fadeIn{
    opacity:0;
}
.fadeIn.go { 
    -webkit-animation-name: fadeIn; 
    animation-name: fadeIn; 
}

/***********
* bounceIn *
************/
@-webkit-keyframes bounceIn { 
    0% { 
        opacity: 0; 
        -webkit-transform: scale(.3); 
    } 

    50% { 
        opacity: 1; 
        -webkit-transform: scale(1.05); 
    } 

    70% { 
        -webkit-transform: scale(.9); 
    } 

    100% { 
         -webkit-transform: scale(1); 
    } 
} 

@keyframes bounceIn { 
    0% { 
        opacity: 0; 
        transform: scale(.3); 
    } 

    50% { 
        opacity: 1; 
        transform: scale(1.05); 
    } 

    70% { 
        transform: scale(.9); 
    } 

    100% { 
        transform: scale(1); 
    } 
} 
.bounceIn.go { 
    -webkit-animation-name: bounceIn; 
    animation-name: bounceIn; 
}




.container{
/*  position:absolute;*/
  width:100%;
  height:100%;
  padding:0px;
  margin:0px;
}

.container a{outline:none;}

.row{ margin:0px; padding:0px;}
.col-lg-12{ margin:0px; padding:0px;}



/*------------- MENU--------------------------*/

.navbar-nav > li.logoNav {
	width: 14%;
    display:none;
}
@media screen and (min-width: 768px) {

.navbar-brand{ display:none;}
.navbar-nav > li.logoNav {
    display:block;
}
}





.navcontainer{
	max-width:1400px;
	margin:0 auto;
/*	background-color:#FF0;*/
    }
.navbar-nav {
    margin: 0;
    text-align: center;
    max-width: 1400px;
    margin: 0 auto;
/*    background-color: #ccc;*/
	float:none;
}
.navbar-nav > li {
    width: 120px;
	text-transform:uppercase;
}

@media screen and (min-width: 669px) {
.navbar-nav > li {
    width: 10.75%;
	
}
}

.navbar-nav > li a{
	font-size:12px; 
	min-width:60px;
	 -webkit-transition: background .4s linear;
        -moz-transition: background .4s linear;
	 transition: background 0.4s linear;
}
.navbar-default .navbar-nav > li > a {
    color: #fff;
}
.navbar-nav > li > a:hover, .navbar-nav > li > a:focus {
    color: #fff !important; background-color:#00ccff !important;
}
.navbar-nav > li > a:focus {
 background-color:#1b1b1b;
}

.navbar-nav > .active > a:hover,
navbar-nav > .active > a:focus {
  color: #fff;
}


.navbar-fixed-top {
	background-color: #1b1b1b;
}

@media screen and (min-width: 768px) {
.navbar-fixed-top {
	background-color:transparent;
}

    }



.navbar-nav > li > a.active{
 background-color:#00ccff;
}

@media(min-width:767px) {
    .navbar {
        padding: 20px 0;
        -webkit-transition: background .5s ease-in-out,padding .5s ease-in-out;
        -moz-transition: background .5s ease-in-out,padding .5s ease-in-out;
        transition: background .5s ease-in-out,padding .5s ease-in-out;
    }

    .top-nav-collapse {
       /* padding: 0;*/
	   padding:6px 0px 6px 0px;
		border:none;
    }
}

@media screen and (min-width: 768px) {
.top-nav-collapse {
	background-color:#1b1b1b;
    }

    }


.navbar-fixed-top li.logoNav span{
	display:none;  
}
.navbar-fixed-top li.logoNav{
 background-image:url(../images/logo_pos.svg);
    background-repeat: no-repeat;
	background-position:center;
	height:auto;
	width:auto;
	min-width:14%;
	min-height: 50px;
	/*transform: scale(1.2);*/transform: scale(1);
   transition: all ease-in .25s;

}


.navbar-fixed-top li.logoNav.neg{
 background-image:url(../images/logo_neg.svg);
    background-repeat: no-repeat;
	background-position:center;
	height:auto;
	width:auto;
	min-width:14%;
	min-height: 50px;
	/*transform: scale(1.2);*/transform: scale(1);
   transition: all ease-in .25s;
  
}

.navbar-fixed-top.top-nav-collapse li.logoNav.neg, .navbar-fixed-top.top-nav-collapse li.logoNav{
 background-image:url(../images/logo_neg.svg);
    background-repeat: no-repeat;
	background-position:center;
	height:auto;
	width:auto;
	min-width:14%;
	min-height: 50px;
	transform: scale(1);
   transition: all ease-in .25s;
	  
}


@media screen and (min-width: 1280px) {
.navbar-fixed-top li.logoNav{
	transform: scale(1.5);
   transition: all ease-in .25s;

}
.navbar-fixed-top li.logoNav.neg{
	transform: scale(1.5);
   transition: all ease-in .25s;  
}

}

.navbar-fixed-top li.logoNav a{
/*	padding:20.8px;*/
	}



/*@media screen and (min-width: 1280px) {
.navbar-fixed-top li.logoNav a{padding:26px;}
}

@media screen and (min-width: 1366px) {
.navbar-fixed-top li.logoNav a{padding:27.5px;}
}

@media screen and (min-width: 1920px) {
.navbar-fixed-top li.logoNav a{padding:28px;}
}*/

.navbar-nav > li.logoNav > a:hover, .navbar-nav > li.logoNav > a:focus {
   background-color: transparent !important;
}

/*-----------------------------------------------------HEADER*/
.header-overlay{
width:100%; height:100%;  position:absolute; top:0; z-index:910;
    }
/****************
SOCIAL BAR
*****************/	
#socialbar-container {
	position: fixed;
	top:120px; 
	width: 240px;
	height: 40px;
	z-index:999;
	background-color:#1d1d1d;
	transition:0.25s all ease;
	}
#socialbar-container.close { 
	left:-200px;
	transition:0.25s all ease;
	}

#socialbar-container.open { 
	left:0%;
	transition:0.25s all ease;
	}
.socialbar-btn {
	position:relative;
	float:right;
	-webkit-transition: background .4s linear;
     -moz-transition: background .4s linear;
	 transition: background 0.4s linear;
	}
.socialbar-close {
	position:relative;
	float:right;
	display:none;
	-webkit-transition: background .4s linear;
     -moz-transition: background .4s linear;
	 transition: background 0.4s linear;
	}
.socialbar-btnsocial{
	position:relative;
	float:left;
	-webkit-transition: background .4s linear;
     -moz-transition: background .4s linear;
	 transition: background 0.4s linear;
	}
	
.socialbar-btn:hover, .socialbar-close:hover, .socialbar-btnsocial:hover{ background-color:#00ccff;}	

/****************
LINE DX FIX
*****************/	


.container-linefix {
overflow: hidden;
  height: 100%;
  position: fixed;
  right:0px;
  top:0;
  width:68px;
  border-left:1px solid #CCC;
 
  z-index:800;
  -webkit-transition:0.4s linear;
	-moz-transition:0.4s linear;
	-o-transition:0.4s linear;
	transition:0.4s linear;
	display:none;
}


@media screen and (min-width: 1280px) {
.container-linefix {
	display:block;
}
}



.container-linefix.open {
overflow: hidden;
  height: 100%;
  position:fixed;
  right:0px;
  top:0;
  width:268px;
  z-index:800 !important;
  -webkit-transition:0.4s linear;
	-moz-transition:0.4s linear;
	-o-transition:0.4s linear;
	transition:0.4s linear;	
	 background-color:#1b1b1b;
	 border:none;
	 
}
.xohub-btn {
	position: fixed;
	right:-10px;
	top:50%; 
	z-index:800;
	 font-family:'Roboto Condensed', sans serif;
	 font-weight:100;
	 font-size:12px;
 color: #ccc;
	-webkit-transition:0.4s linear;
	-moz-transition:0.4s linear;
	-o-transition:0.4s linear;
	transition:0.4s linear;	
	
    -moz-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    filter: progid:DXImageTransform.Microsoft.Matrix( M11=$m11, M12=$m12, M21=$m21, M22=$m22, sizingMethod='auto expand');
    zoom: 1;
    -webkit-transform-origin: 0 100%;
    -ms-transform-origin: 0 100%;
    transform-origin: 0 100%;
   
    -webkit-transition: color 0.4s ease;
    -moz-transition: color 0.4s ease;
    -o-transition: color 0.4s ease;
    transition: color 0.4s ease;
    letter-spacing: 2px;
	cursor:pointer;

	}

.xohub-btnclose {
	position: fixed;
	cursor:pointer;
	right:18px;
	top:35%; 
	z-index:800;
	 font-family:'Roboto Condensed', sans serif;
	 font-weight:400;
	 font-size:24px;
 color: #00ccff;
	-webkit-transition:0.4s linear;
	-moz-transition:0.4s linear;
	-o-transition:0.4s linear;
	transition:0.4s linear;	
	
    letter-spacing: 2px;
	display:none;

	}
	
	
.content-linefix{
	    display:none;
		position:fixed;
		top:40%;
		padding:0 15px 0 15px;
		color:#FFF;
		text-align:center;
		width:268px;
		
}
.content-linefix h1{
	    font-size: 40px;
		line-height: 46px;
		color:#FFF;		
}
.content-linefix h1 span{
	font-weight:400;
	color:#FFF;
	font-size:46px;
	line-height: 48px;
}
.content-linefix h2{
color:#FFF;	
font-family: 'Roboto Condensed', sans-serif;
font-size: 22px;
font-weight: 100;
}

.container-linefix.open .content-linefix{
	    display: block;	
}

.folio.folio-traslate {
	margin-left:-300px;
	 -webkit-transition:0.4s linear;
	-moz-transition:0.4s linear;
	-o-transition:0.4s linear;
	transition:0.4s linear;	
}



/*section.module.parallax {
  padding: 240px 0;
  background-position: 0 0;
}
section.module.parallax h1 {
  color: #1e1e1e;
  font-size: 48px;
  line-height: 1;
  font-weight: 700;
  text-align: center;
  text-transform: uppercase;
  text-shadow: 0 0 10px white;
}*/



/*-------------HOME  SLIDER--------------------------*/
#intro { z-index:900;}
.carousel, .item,.active {height: 100%;}
.carousel-inner {height: 100%;}
.carousel .img-responsive {
    display: block;
    width: 100%;
    height: auto;
	 }
.imageslide1 {
background-image:url('../images/home/slide_home1.jpg');
}
	
.imageslide2 {
background-image:url('../images/home/slide_home2.jpg');
}
.imageslide3 {
background-image:url('../images/home/slide_home3.jpg');
}
.imageslide4 {
background-image:url('../images/home/slide_home4.jpg');
}			
/* Carousel Fading slide */
.carousel-fade .carousel-inner { background: #000; }
.carousel-fade .carousel-control { z-index: 2; }  
.carousel-fade .item {
  opacity: 0;
  -webkit-transition-property: opacity;
  -moz-transition-property: opacity;
  -o-transition-property: opacity;
  transition-property: opacity;
  }

  .carousel-fade .next.left, .carousel-fade .prev.right,
  .carousel-fade .item.active { opacity: 1; }

  .carousel-fade .active.left, .carousel-fade .active.right {
    left: 0;
    opacity: 0;
    z-index: 1;
    }
	

/* Carousel Fading slide Safari Fix */
@media all and (transform-3d), (-webkit-transform-3d) {
    .carousel-fade .carousel-inner > .item.next,
    .carousel-fade .carousel-inner > .item.active.right {
      opacity: 0;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .item.prev,
    .carousel-fade .carousel-inner > .item.active.left {
      opacity: 0;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .item.next.left,
    .carousel-fade .carousel-inner > .item.prev.right,
    .carousel-fade .carousel-inner > .item.active {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
}
/* zoom slide */
.moving {
  margin:0;
  padding:0; 
  display: block;
  width: 100%;
  height: 100%;
  position: relative;
  clear: both;
  background-position: center center;
  background-size: cover;
   -webkit-animation: moving 10s infinite; /* Chrome, Safari, Opera */
    -webkit-animation-direction: alternate; /* Chrome, Safari, Opera */
    animation: moving 10s infinite;
    animation-direction: alternate;
}
@-webkit-keyframes moving {
from { -webkit-transform: rotate(0deg) scale(1.0) skew(0deg) translate(0px); }
to { -webkit-transform: rotate(1deg) scale(1.2) skew(0deg) translate(0px); }
}
@-moz-keyframes moving {
from { -moz-transform: rotate(0deg) scale(1.0) skew(0deg) translate(0px); }
to { -moz-transform: rotate(1deg) scale(1.2) skew(0deg) translate(0px); }
}
@-o-keyframes moving {
from { -o-transform: rotate(0deg) scale(1.0) skew(0deg) translate(0px); }
to { -o-transform: rotate(1deg) scale(1.2) skew(0deg) translate(0px); }
}
	

	
.fill {
	position:relative;
    width: 100%;
    height: 100%;
    background-position: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}
/**/

/* * * * * * * * * * * * * * * * * * * SVG HELLO* * * * * * * * * * * * * * * * * * * */
#svg-container {
			position: absolute;
			top:40%; 
			left:50%;
			width: 180px; margin-left:-90px;
			height: 80px; margin-top:-40px;
			z-index:910; 
			/*background-color:#F00;*/
		}
@media (min-width: 768px) and (max-width: 1023px) {
	#svg-container {top:51%;}

}

#Hello {
position: relative;
transform: scale(2.2);
width: 180px; margin-left:84px;
height: 80px; margin-top:20px;
transition: transform 0.5s;
/*display:none;*/
		}
		
@media screen and (min-width: 768px) {
#Hello {
	transform: scale(3.5); 
	transition: transform 0.5s;
	left:25%;
	}
}
		
		
		.title {
		stroke-dasharray: 500;
		stroke-dashoffset: 500;
		animation: draw 5s linear forwards;
		-webkit-animation: draw 5s linear forwards;
		-moz-animation: draw 5s linear forwards;
		-o-animation: draw 5s linear forwards;
		}
	
		
		@keyframes draw {
		 from { fill-opacity: 0; stroke-width:1.5; }
		
		to {
			stroke-dashoffset: 0;fill-opacity: 1;stroke-width:1.0;
			}
  
		}
		
		@-webkit-keyframes draw {
		from { fill-opacity: 0; stroke-width:1.5;}
		
		to {stroke-dashoffset: 0;fill-opacity: 1; stroke-width:0;}
		}
		
		@-moz-keyframes draw {
		from { fill-opacity: 0; stroke-width:1.5;  }
		
		to {stroke-dashoffset: 0;fill-opacity: 1; stroke-width:0; }
		
		}
		@-o-keyframes draw {
		from { fill-opacity: 0; stroke-width:1.5; }
		
		to {stroke-dashoffset: 0;fill-opacity: 1; stroke-width:0;}
		}


/* * * * * * * * * * * * * * * * * * * /SVG * * * * * * * * * * * * * * * * * * * */

.titletwo-container {
			position: absolute;
			top:51%; 
			left:50%;
			width: 184px; margin-left:-92px;
			height: 30px; margin-top:0px;
			z-index:910; 
		}
		
@media screen and (min-width: 1024px) {
	
	.titletwo-container {
	  top:51%;
	  width:378px; margin-left:-189px;
	}
}
		
@media screen and (min-width: 768px) {
	
	.titletwo-container {
	  top:58%;
	  width:378px; margin-left:-189px;
	}
}
		
		
		
.titletwo {
	position:relative;
	font-family: 'Roboto Condensed', sans-serif;
	font-size:16px;
	text-transform:uppercase;
	color:#FFF;
	/*display:none;*/
	}
@media screen and (min-width: 768px) {		
	.titletwo {
	font-size:34px;
	}
	
	}

/*btn LINK*/	
.btnlink-container {
	position: absolute;
	top:70%; 
	left:50%;
	width: 250px; margin-left:-125px;
	height: 50px; margin-top:-25px;
	z-index:910; 
	}
	
@media screen and (min-width: 768px) {	
.btnlink-container {
	width: 250px; margin-left:-125px;
	height: 50px; margin-top:-25px;
	z-index:910; 
	}
}	
	
.btnlink {
	position:relative;
	font-family: 'Roboto Condensed', sans-serif;
	text-transform:uppercase;
	}	
.btnlink a{
	font-size:18px;
	border:1px solid #fff;
	padding:8px 50px 8px 50px;
	-webkit-transition: background .4s linear;
    -moz-transition: background .4s linear;
	 transition: background 0.4s linear;
	}	

.btnlink a:hover{
	border-color: #00ccff; 
	background-color:#00ccff;	
	}

	
	
/*ARROW*/
	.arrows {
	width: 60px;
	height: 40px;
	position: absolute;
	left: 50%;
	margin-left: -30px;
	bottom: 0;
	z-index:999;
	display:none; 
}
@media screen and (min-width: 640px) {
	.arrows {display:block;}
	}

.arrows path {
	stroke: #fff;
	fill: transparent;
	stroke-width: 3px;	
	animation: arrow 1s infinite;
	-webkit-animation: arrow 1s infinite; 
}
.arrows path:hover {
	stroke: #000;

}

@keyframes arrow
{
0% {opacity:0}
100% {opacity:1;}
}

@-webkit-keyframes arrow 
{
0% {opacity:0}
100% {opacity:1;}
}

.arrows path.a1 {
	animation-delay:3s;
	-webkit-animation-delay:3s;
}


/*---------- HOME CONTENT FOLIO --------------*/
.folio{
/*  height:100%;*/
  z-index:99;
  position:relative;
/*margin-bottom:600px;*/
   -webkit-transition:0.4s linear;
	-moz-transition:0.4s linear;
	-o-transition:0.4s linear;
	transition:0.4s linear;
	background-color:#FFF;
}





/*--------------------------
        HOME INTRO
--------------------------*/
/*.intro-section {
    height: 100%;
    padding-top:0px;
    text-align: center;
    background: #1b1b1b;
	color:#FFF;
	position:relative;
	transform:translate3d(0px 0px 0px);
	display:table;
	z-index:900;
}*/











/*------------------------------------------------------ABOUT SECTION MAIN--------------------------------------------*/

.section-main {
    height: 100%;
    padding-top: 50px;
    background:rgb(255,255,255);
	z-index:5;
	transition:1s all linear;
	position:relative;
	font-family: 'Roboto Condensed', sans-serif;
}

.section-main[mainAttr="0"]{ background:rgb(255,255,255); }
.section-main[mainAttr="1"]{ background:rgb(255,255,255);}

.container-main{ 
max-width:1600px; 
margin:0 auto;
padding-right:35px;}

.left-mainBox{
padding-left:0px;
min-height:350px;
position:relative;}
@media screen and (min-width: 768px) {
.left-mainBox {
    min-height: 550px;
}

}

#box1-svg {
position:relative;
left:0px;
width: 250px; 
height:380px;
}

@media screen and (min-width: 768px) {
	#box1-svg {
position:relative;
left: 80px; left:0px;
width: 250px; 
height:380px;
}

}	

#box1-svg rect{
stroke-width:4; fill-color="#FFFFFF";
width:250px; height:380px;
}


.title-container{
    position:absolute; 
	width:250px; 
	height:378px; 
	left:60px; 
	top:100px; 
  
}

@media screen and (min-width: 768px) {
	.title-container {
    width: 250px;
    height: 378px;
    left: 80px;
    top: 100px;
}

}

.title-container .line-bottom i {
	bottom:-0.3em;
}

/*HOVER LINE*/
.title-container:hover .line-top i{
	-webkit-transition:width 0.4s ease-out;
	-moz-transition:width 0.4s ease-out;
	-o-transition:width 0.4s ease-out;
	transition:width 0.4s ease-out;
	width:100%;
}
.title-container:hover .line-right i {
	-webkit-transition:height 0.4s ease-out;
	-webkit-transition-delay:0.4s;
	-moz-transition:height 0.4s ease-out 0.4s;
	-o-transition:height 0.4s ease-out 0.4s;
	transition:height 0.4s ease-out 0.4s;
	height:100%;
}

.title-container:hover .line-bottom i {
	-webkit-transition:width 0.4s ease-out;
	-webkit-transition-delay:0.8s;
	-moz-transition:width 0.4s ease-out 0.8s;
	-o-transition:width 0.4s ease-out 0.8s;
	transition:width 0.4s ease-out 0.8s;
	width:100%;
}
.title-container:hover .line-left i {
	-webkit-transition:height 0.4s ease-out;
	-webkit-transition-delay:1.2s;
	-moz-transition:height 0.4s ease-out 1.2s;
	-o-transition:height 0.4s ease-out 1.2s;
	transition:height 0.4s ease-out 1.2s;
	height:100%;
}
/*ROLLOUT +script*/
.title-container.rollOut .line-left i {
	-webkit-transition:height 0.4s ease-out;
	-webkit-transition-delay:0s;
	-moz-transition:height 0.4s ease-out 0s;
	-o-transition:height 0.4s ease-out 0s;
	transition:height 0.4s ease-out 0s;
	height:0%;
}

.title-container.rollOut .line-bottom i {
	-webkit-transition:width 0.4s ease-out;
	-webkit-transition-delay:0.4s;
	-moz-transition:width 0.4s ease-out 0.4s;
	-o-transition:width 0.4s ease-out 0.4s;
	transition:width 0.4s ease-out 0.4s;
	width:0%;
}

.title-container.rollOut .line-right i {
	-webkit-transition:height 0.4s ease-out;
	-webkit-transition-delay:0.8s;
	-moz-transition:height 0.4s ease-out 0.8s;
	-o-transition:height 0.4s ease-out 0.8s;
	transition:height 0.4s ease-out 0.8s;
	height:0%;
}
.title-container.rollOut .line-top i {
	-webkit-transition:width 0.4s ease-out;
	-webkit-transition-delay:1.2s;
	-moz-transition:width 0.4s ease-out 1.2s;
	-o-transition:width 0.4s ease-out 1.2s;
	transition:width 0.4s ease-out 1.2s;
	width:0%;
	/*height:100%;*/
}


/*ANIMATION SCROLL LINE*/
.title-container.animatedLine .line-top i{
	-webkit-transition:width 0.4s ease-out;
	-moz-transition:width 0.4s ease-out;
	-o-transition:width 0.4s ease-out;
	transition:width 0.4s ease-out;
	width:100%;
}
.title-container.animatedLine .line-right i {
	-webkit-transition:height 0.4s ease-out;
	-webkit-transition-delay:0.4s;
	-moz-transition:height 0.4s ease-out 0.4s;
	-o-transition:height 0.4s ease-out 0.4s;
	transition:height 0.4s ease-out 0.4s;
	height:100%;
}

.title-container.animatedLine .line-bottom i {
	-webkit-transition:width 0.4s ease-out;
	-webkit-transition-delay:0.8s;
	-moz-transition:width 0.4s ease-out 0.8s;
	-o-transition:width 0.4s ease-out 0.8s;
	transition:width 0.4s ease-out 0.8s;
	width:100%;
}
.title-container.animatedLine .line-left i {
	-webkit-transition:height 0.4s ease-out;
	-webkit-transition-delay:1.2s;
	-moz-transition:height 0.4s ease-out 1.2s;
	-o-transition:height 0.4s ease-out 1.2s;
	transition:height 0.4s ease-out 1.2s;
	height:100%;
}





/*********/

.section-main a {
    position: initial;
   
}

.section-main .titleone {
    position: absolute;
    left: 15px;
    bottom: 0px;
    font-size: 60px;
    line-height: 70px;
    color: #000;
    font-family:'Roboto', sans-serif;
	font-weight:bold;
	letter-spacing:-5px;
}


.titleVertical {
    position: absolute;
    left: 15px;
    top: 80px;
    font-size: 10px;
	font-family: 'Roboto Condensed', sans-serif;
    line-height: 12px;
    text-transform: uppercase;
    font-weight: normal;
    -moz-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    filter: progid:DXImageTransform.Microsoft.Matrix( M11=$m11, M12=$m12, M21=$m21, M22=$m22, sizingMethod='auto expand');
    zoom: 1;
    -webkit-transform-origin: 0 100%;
    -ms-transform-origin: 0 100%;
    transform-origin: 0 100%;
    color: #000;
    -webkit-transition: color 0.4s ease;
    -moz-transition: color 0.4s ease;
    -o-transition: color 0.4s ease;
    transition: color 0.4s ease;
    letter-spacing: 2px;
}

@media screen and (min-width: 768px) {
	.section-main .titleone {
    left: 15px;
    bottom: 0px;
    font-size: 80px;
    line-height: 90px;
}
 .titleVertical {
    left: 40px;
    top: 120px; 
}

}	

.section-main p {
	position:absolute;
	left:70px;
    font-size: 12px;
    color: #000;
	letter-spacing:normal;
    line-height: 16px;
    max-width: 350px;
    padding-top: 0px;
	top:450px;
}

@media screen and (min-width: 768px) {
	.section-main p {
	position:absolute;
	left:110px;
    font-size: 13px;
    color: #080808;
	letter-spacing:normal;
    line-height: 20px;
    max-width: 350px;
    padding-top: 0px;
	top:450px;
}
	}
	

/*----RIGHT-----*/
.right-mainBox{
	min-height:650px;
	margin-top:200px;
}


@media screen and (min-width: 768px) {
	.right-mainBox{
	min-height:650px;
	margin-top:0px;
}
}
.right-mainBox h1{
	font-family:'Roboto Condensed', sans-serif;
	font-size:20px;
	color:#333;
	text-transform:uppercase;
	font-weight:100;
	padding-top:20px;
	padding-bottom:10px;
	font-style:normal;
}


@media screen and (min-width: 768px) {
	.right-mainBox h1 {font-size: 24px; padding-top: 50px;}
}


.right-mainBox div.toptxt{
	margin-bottom:20px;
}

.right-mainBox hr{
	color:#333;
	width:50px;
	height:2px; 
	background-color:#333;
	float:left;
}


.right-mainBox span{
	color:#333;
	text-transform:uppercase;
	padding:3px;
	font-size:12px; 
	line-height:18px;
}

.right-mainBox span.shr{
	padding:18px 0px 0px 0px;
}

.xo-container{
	position:absolute; 
	top:350px;
	left:-15px;
	z-index:999;
	
}
.xo-container.mob2{
	top:0px;
	
}
.xo-container #XO {
    width:150px;
	height:150px;
	display:none;
}

@media screen and (min-width: 768px) {
.xo-container #XO {
    width: 200px;
    height: 200px;
	display: block;
}

}


.xo-container #XO g{
	 -webkit-transform: scale(3.2);
    -moz-transform: scale(3.2);
    transform: scale(3.2);
}
	
.xo-container:hover .xopath{
fill: #00ccff;
}

.xo-container .xopath{
-webkit-transition: fill .4s linear;
-moz-transition: fill .4s linear;
transition: fill 0.4s linear;	 
}


/*HOVER IMG*/
.link-box-1 {
	position:relative;
	max-width:603px;
}
.linkbtn{
	padding:0px;
	text-align:center;
	transition:0.25s all ease;
	
}
.line-top i{	
top: 0px;
}
.line-left i {
 bottom:0;
}
.line-right i {
	top:0px; right:0;
}
.line-bottom i {
	right:0;
}


.line-top i,.line-bottom i {
	display:block;
	position:absolute;
	width:0%;
	height:4px;
	background:#00ccff;

}


.line-right i,.line-left i {
	display:block;
	position:absolute;
	width:4px;;
	height:0;
	background:#00ccff;
}


.link-box-1:hover .line-top i {
	-webkit-transition:width 0.4s ease-out;
	-moz-transition:width 0.4s ease-out;
	-o-transition:width 0.4s ease-out;
	transition:width 0.4s ease-out;
	width:100%;
	/*height:100%;*/
}

.link-box-1:hover .line-right i {
	-webkit-transition:height 0.4s ease-out;
	-webkit-transition-delay:0.4s;
	-moz-transition:height 0.4s ease-out 0.4s;
	-o-transition:height 0.4s ease-out 0.4s;
	transition:height 0.4s ease-out 0.4s;
	height:100%;
}

.link-box-1:hover .line-bottom i {
	-webkit-transition:width 0.4s ease-out;
	-webkit-transition-delay:0.8s;
	-moz-transition:width 0.4s ease-out 0.8s;
	-o-transition:width 0.4s ease-out 0.8s;
	transition:width 0.4s ease-out 0.8s;
	width:100%;
}
.link-box-1:hover .line-left i {
	-webkit-transition:height 0.4s ease-out;
	-webkit-transition-delay:1.2s;
	-moz-transition:height 0.4s ease-out 1.2s;
	-o-transition:height 0.4s ease-out 1.2s;
	transition:height 0.4s ease-out 1.2s;
	height:100%;
}
/*ROLLOUT +script*/
.link-box-1.rollOut .line-left i {
	-webkit-transition:height 0.4s ease-out;
	-webkit-transition-delay:0s;
	-moz-transition:height 0.4s ease-out 0s;
	-o-transition:height 0.4s ease-out 0s;
	transition:height 0.4s ease-out 0s;
	height:0%;
}

.link-box-1.rollOut .line-bottom i {
	-webkit-transition:width 0.4s ease-out;
	-webkit-transition-delay:0.4s;
	-moz-transition:width 0.4s ease-out 0.4s;
	-o-transition:width 0.4s ease-out 0.4s;
	transition:width 0.4s ease-out 0.4s;
	width:0%;
}

.link-box-1.rollOut .line-right i {
	-webkit-transition:height 0.4s ease-out;
	-webkit-transition-delay:0.8s;
	-moz-transition:height 0.4s ease-out 0.8s;
	-o-transition:height 0.4s ease-out 0.8s;
	transition:height 0.4s ease-out 0.8s;
	height:0%;
}
.link-box-1.rollOut .line-top i {
	-webkit-transition:width 0.4s ease-out;
	-webkit-transition-delay:1.2s;
	-moz-transition:width 0.4s ease-out 1.2s;
	-o-transition:width 0.4s ease-out 1.2s;
	transition:width 0.4s ease-out 1.2s;
	width:0%;
	/*height:100%;*/
}

		 
/*------------------------*/

.center-mainBox{
	position: absolute;
	left:50px;
	top:550px;
	z-index:100;
	font-family: 'Roboto Condensed', sans-serif;			
}

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

.center-mainBox{left:260px;}
}

@media screen and (min-width: 1024px) {

.center-mainBox{top:600px;}
}


@media screen and (min-width: 1280px) {

.center-mainBox{left:460px;}
}

.center-mainBox .txt h1{
	font-size:25px;
	color:#000;
	line-height:30px;
	display:none;		
}

@media screen and (min-width: 1024px) {
.center-mainBox .txt h1{display: block;}
}

.center-mainBox .txt h1 strong{
font-weight:bold;
		
}

.center-mainBox .btnlink-container{
	position:relative;
	margin-top:250px;
	width:300px;
}



@media screen and (min-width: 768px) {
.center-mainBox .btnlink-container{
	margin-top:220px;
}
}

@media screen and (min-width: 1024px) {
.center-mainBox .btnlink-container{
	margin-top:50px;
}
}

.linkmob-1{
width:260px; 
margin-left:0px;
}

.txt-container .btnlink.linkmob-1 a {
	font-size:14px;
padding-left:10px; 
padding-right:10px
}

.txt-container .btnlink.linkmob-1 a:hover {
	font-size:14px;
padding-left:10px; 
padding-right:10px
}

@media screen and (min-width: 768px) {
.linkmob-1{
width:350px; 
margin-left:0px;

}
.txt-container .btnlink.linkmob-1 a{
	font-size:18px;
padding-left:15px; 
padding-right:15px
}
.txt-container .btnlink.linkmob-1 a:hover{
	font-size:18px;
padding-left:15px; 
padding-right:15px
}

}


.center-mainBox .btnlink a{
	border:2px solid #000;
	color:#000;		
}

.center-mainBox .btnlink a:hover{
color:#fff;		
}

/*-------------------HOME SERVICES SECTION---------------------------------------------------------*/
.services-section {
    height: 100%;
    padding-top: 50px;
    background: #fff;
	z-index:4;
}
.services-section .container-main { padding-right:0;}

.services-color {
position:relative; 
min-height:600px; 
width:100%;
color:#FFF;
padding-top:50px;
font-family:'Roboto Condensed', sans-serif;
transition:2s all linear;
background-color:#1b1b1b;

}

.services-color[leftAttr="0"]{ background:rgb(27,27,27);}
.services-color[leftAttr="1"]{ background:rgb(27,27,27);}

.text-fix {
/*	margin-bottom:15px;*/
	float:right;
	padding-right:50px;
}

.text-fix span{
	text-transform:uppercase;
	padding:15px;
	font-size:16px; 
	line-height:35px;
}

.text-fix span.shr{
	padding:18px 0px 0px 0px;
}

.center-mainBox2{
	position:relative;
	width:100%; 
	min-height:400px;	
	padding-right:50px;
	color:#FFF;	
}

.center-mainBox2 .txt-container{
	clear:both;
	max-width:500px; 
	float:right;
}
.center-mainBox2 h1{
	font-size:45px;
	color:#fff;
	line-height:51px;
	margin-bottom:60px;
			
}
.center-mainBox2 h1 strong{
font-weight:bold;
		
}
.txt-container .btnlink {
	clear:both;	
}
.txt-container .btnlink a{
padding: 8px 30px 8px 30px;		
}
.txt-container .btnlink a:hover{
padding: 10px 32px 10px 32px;		
}

.what-txt{
font-family: 'Oswald', sans-serif;
font-size:140px; 
text-transform:uppercase; 
margin:120px 0 40px 20px;	
}


@media screen and (min-width: 768px) {
.what-txt{margin:60px 0 0px 20px;	}
}

@media screen and (min-width: 1280px) {
.what-txt{margin:90px 0 40px 20px;	}
}
@media screen and (min-width: 1400px) {
.what-txt{margin:90px 0 90px 20px;	}
}

/**/
.box2 {
	position:absolute;
	bottom:170px;
	left:20px; 
	width:310px; 
	height:152px; 

}

@media screen and (min-width: 768px) {
.box2 {
	left:20px;
	bottom:120px;
	width:480px; 
	height:230px;
}
}

@media screen and (min-width: 1280px) {
.box2 {
	left:80px; 
	bottom:200px;
	width:480px; 
	height:230px;
}
}

#box2-svg {
position:relative;
width: 380px; 
height:230px;
margin-top:-21px;
}

@media screen and (min-width: 768px) {
#box2-svg {
    position: relative;
    width: 480px;
    height: 230px;
    margin-top: 0;
}
}


#box2-svg rect{
stroke-width:4; 
width: 380px;
height:230px;
}
@media screen and (min-width: 768px) {
#box2-svg rect{
width: 480px; 
height:230px;
}
}

.box2 .line-bottom, .box2 .line-top, .box2 .line-right, .box2 .line-left  {
	display:none;
}

@media screen and (min-width: 768px) {
.box2 .line-bottom, .box2 .line-top, .box2 .line-right, .box2 .line-left  {
	display:block;
}
}

.box2 .line-bottom i {
    bottom: 0.01em;
}
.box2:hover .line-top i {
	-webkit-transition:width 0.4s ease-out;
	-moz-transition:width 0.4s ease-out;
	-o-transition:width 0.4s ease-out;
	transition:width 0.4s ease-out;
	width:100%;
}

.box2:hover .line-right i {
	-webkit-transition:height 0.4s ease-out;
	-webkit-transition-delay:0.4s;
	-moz-transition:height 0.4s ease-out 0.4s;
	-o-transition:height 0.4s ease-out 0.4s;
	transition:height 0.4s ease-out 0.4s;
	height:100%;
}

.box2:hover .line-bottom i {
	-webkit-transition:width 0.4s ease-out;
	-webkit-transition-delay:0.8s;
	-moz-transition:width 0.4s ease-out 0.8s;
	-o-transition:width 0.4s ease-out 0.8s;
	transition:width 0.4s ease-out 0.8s;
	width:100%;
}
.box2:hover .line-left i {
	-webkit-transition:height 0.4s ease-out;
	-webkit-transition-delay:1.2s;
	-moz-transition:height 0.4s ease-out 1.2s;
	-o-transition:height 0.4s ease-out 1.2s;
	transition:height 0.4s ease-out 1.2s;
	height:100%;
}
/*ROLLOUT +script*/
.box2.rollOut .line-left i {
	-webkit-transition:height 0.4s ease-out;
	-webkit-transition-delay:0s;
	-moz-transition:height 0.4s ease-out 0s;
	-o-transition:height 0.4s ease-out 0s;
	transition:height 0.4s ease-out 0s;
	height:0%;
}

.box2.rollOut .line-bottom i {
	-webkit-transition:width 0.4s ease-out;
	-webkit-transition-delay:0.4s;
	-moz-transition:width 0.4s ease-out 0.4s;
	-o-transition:width 0.4s ease-out 0.4s;
	transition:width 0.4s ease-out 0.4s;
	width:0%;
}

.box2.rollOut .line-right i {
	-webkit-transition:height 0.4s ease-out;
	-webkit-transition-delay:0.8s;
	-moz-transition:height 0.4s ease-out 0.8s;
	-o-transition:height 0.4s ease-out 0.8s;
	transition:height 0.4s ease-out 0.8s;
	height:0%;
}
.box2.rollOut .line-top i {
	-webkit-transition:width 0.4s ease-out;
	-webkit-transition-delay:1.2s;
	-moz-transition:width 0.4s ease-out 1.2s;
	-o-transition:width 0.4s ease-out 1.2s;
	transition:width 0.4s ease-out 1.2s;
	width:0%;
	/*height:100%;*/
}
.box2-txt{ 
   position: absolute; 
   top:0px; bottom:0; 
   padding:20px;
}

@media screen and (min-width: 768px) {
.box2-txt {
    padding: 40px;
}
}

.box2-txt h3{
color: #000;
text-transform: uppercase;
padding: 0px;
line-height: 20px;
font-family:'Roboto Condensed', san serif;
font-size: 18px;
margin-bottom:10px;
}

@media screen and (min-width: 768px) {
	.box2-txt h3 {
    line-height: 30px;
    font-size: 26px;
    margin-bottom: 20px;
}
}

.box2 p {
    position: relative;
    font-size: 12px;
    color: #000;
    letter-spacing: normal;
    line-height: 18px;
    padding: 0px;
	margin:0px;
	font-weight:100;
	text-align:justify;
}


@media screen and (min-width: 768px) {
	.box2 p {
    font-size: 14px;
    line-height: 22px;   
}
}

.box2 span.colorhover{
	color:#00ccff;
	-webkit-transition:0.4s linear;
	-moz-transition:0.4s linear;
	-o-transition:0.4s linear;
	transition:0.4s linear;
}
.linepic.colorhover{
	background:#00ccff;
}
.linepic{
	height:1px;
	width:40px;
	background:#000;
	margin-right:20px;
	
}
.box2 p span.linepic{
	position:absolute;
	margin-top:10px;

}

@media screen and (min-width: 768px) {
.box2 p span.linepic{
	margin-top:25px;
}
}


.box2 p span.lineright{
	margin-left:50px;
	line-height:20px;
	text-transform:uppercase;

}

@media screen and (min-width: 768px) {
.box2 p span.lineright{
line-height:45px;
}
}



/*-----------HOME VIDEO SECTION------------------------------------------------------------------------------------------------*/
.video-section {
    height: 100%;
    padding-top: 50px;
	background: #ffff;
	z-index:3;
}
.video-box {
position:relative; 
display:block; 
height:0px; 
width:100%; 
padding:300px; 
overflow:hidden;
}

.video {
  position: absolute;
  display:block;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.video-boxtxt {
position:absolute; 
left:0%; 
top:0; 
width:100%; 
height:100%; 
z-index:100;
color:#FFF;
}

.left-boxtxt {
color:#FFF; 
padding-left:90px;

}

@media screen and (min-width: 768px) {
.left-boxtxt {padding-left:170px;}
}


.left-boxtxt h1{
font:"Roboto", Arial, sans-serif;
font-size: 45px;
color: #fff;
line-height: 51px;
margin-top:120px;
-webkit-transition:0.4s linear;
	-moz-transition:0.4s linear;
	-o-transition:0.4s linear;
	transition:0.4s linear;
}

.left-boxtxt h1 strong{
	font-weight:bold;
}

.linepic-w{
	height:1px;
	width:40px;
	background:#fff;
	position:absolute;	
}
.left-boxtxt a h1:hover {
color:#00ccff; 
}

.right-boxtxt{
font-family: 'Roboto Condensed', sans-serif;
padding: 120px 0px 0px 15px;
font-size: 16px;
line-height: 35px;
color:#FFF;
display:none;
}

@media screen and (min-width: 768px) {
.right-boxtxt{display: block;
}
}


.V-txt {
color:#fff; 
font-family: 'Oswald', sans-serif;
font-size: 140px;
line-height:150px;
text-transform: uppercase;
margin: 0px 0 0px 0px;
}

.right-boxtxt span{
	padding-left:27px;
	text-transform: uppercase;
}
.right-boxtxt p {
    position: relative;
    font-size: 15px;
    color: #fff;
    letter-spacing: normal;
    line-height: 24px;
    padding: 0px;
    margin: 0px;
    font-weight: 100;
	padding-left:27px;
	max-width:360px;
	text-align:justify;
}


/*-----------HOME WORK SECTION------------------------------------------------------------------------------------------------*/
.work-section {
    height: 100%;
    padding-top: 100px;
	position:relative;
	z-index:4;
	background-color:#1b1b1b;
}
.work-section .container-main {
	padding:0;
}
.work-section .left-mainBox{ z-index:999;
}

.work-section .title-container{
	top:0px;
}
.work-section .titleone {
    position: absolute;
    left: 15px;
    bottom: 0px;
    font-size: 60px;
    line-height: 70px;
    color: #fff;
    font-family: 'Roboto', sans-serif;
    font-weight: bold;
    letter-spacing: -5px;

}

@media screen and (min-width: 768px) {
.work-section .titleone {  
    left: 12px;
    font-size: 100px;
    line-height: 112px; 
}
}

.work-section .titleVertical{
    color: #fff;
}


.work-section h3 {
	position:absolute;
	left:80px;
	bottom:-140px;
    color: #fff;
    text-transform: uppercase;
    padding: 0px;
    line-height: 30px;
    font-family: 'Roboto Condensed' san serif;
    font-size: 26px;
	padding-top:44px;
	max-width:320px;
	font-weight:100;
}

@media screen and (min-width: 768px) {
.work-section h3 {
	left:110px;
	bottom:50px;
}
}


.work-section h3 strong{
	font-weight:bold;
}

.work-section .right-mainBox{
	min-height:350px;
}

.right-worktxt{
	position:absolute; 
	top:100px;
	left:90px;
}

.right-worktxt h1{
	color:#FFF;
	font-size:26px;
}

.btn-work{
	margin-top:50px;
	margin-left:90px;
}

@media screen and (min-width: 768px) {
.btn-work{
	margin-top:30px;
	margin-left:90px;
}
}

.btn-work .linkmob-2 a{
	font-size:14px;
	padding: 8px 15px 8px 15px;
}

@media screen and (min-width: 768px) {
.btn-work .linkmob-2 a{
	font-size:18px;
	padding: 8px 50px 8px 50px;
}
}

.work-box2{
	 max-width:1000px; margin:0 auto; margin-top:30px
}


.work-box3 {
	margin-top:0px;
	padding-left:50px;
}

.work-box3 h1 {
	font-family: 'Oswald', sans-serif;
    font-size: 30px;
    color: #fff;
    line-height: 36px;
    margin-bottom: 40px;
	color:#000;
}

@media screen and (min-width: 768px) {
.work-box3 {
	margin-top:80px;
	padding-left:110px;
}

.work-box3 h1{
	font-size: 42px;
	line-height:50px;
}
}

@media screen and (min-width: 1280px) {
.work-box3 h1{
	font-size: 48px;
	line-height:60px;
}

}

@media screen and (min-width: 1900px) {
.work-box3 h1{
	font-size: 52px;
	line-height:66px;
}

}
.work-box3 h2 {
    font-family: 'Roboto Condensed', sans-serif;
    font-size: 24px;
    color: #333;
    text-transform: uppercase;
    font-weight: 100;
    padding-top: 50px;
    padding-bottom: 10px;
    font-style: normal;
}





.work-box4 {
	margin-top:50px;
	padding-left:50px;
	z-index:999;
	min-height:100px;	
}

@media screen and (min-width: 1024px) {
.work-box4 {
	margin-top:200px;
	padding-left:100px;
	z-index:999;
	min-height:250px;	
}

}

.work-box4 span.linepic {
	position:absolute; 
	margin-top:8px;
	-webkit-transition:0.4s linear;
	-moz-transition:0.4s linear;
	-o-transition:0.4s linear;
	transition:0.4s linear;
	left:0;
	display:none;	
}

.work-box4 span.lineright {
	color:#000;
	font-family:'Roboto Condensed' san serif;
	font-size:15px;
	letter-spacing:normal;
	font-weight:100;
	text-transform:uppercase;
	margin-left:60px;
	-webkit-transition:0.4s linear;
	-moz-transition:0.4s linear;
	-o-transition:0.4s linear;
	transition:0.4s linear;	
}

.work-box4 span.lineright.colorhover {
	color:#00ccff;
}

.work-box4 span.linepic.colorhover {
	color:#00ccff;	
}

/*------------------------------------------BOTTOM SECTION*/
.section-bottom {
	padding-top:100px;
	z-index:999;
	background-color:#FFF;
	z-index:5;
	display:none;
}

.section-bottom .boxbottom {
	padding-left:110px;
	padding-bottom:100px;

}

.section-bottom h2 {
    font-family: 'Roboto Condensed', sans-serif;
    font-size: 24px;
	line-height:28px;
    color: #333;
    text-transform: uppercase;
    font-weight: 100;
	padding:0 0 40px 0px;
    font-style: normal;
}

.section-bottom li {
    float: left;
   /* margin-right: 50px;*/
    width: 23%;
	height: 50px;
	margin-right:1%;
	position: relative;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
	display: block;
	line-height: 50px;
	border-top: 1px solid #000;
	border-bottom: 1px solid #000;
	font-family: 'Roboto Condensed', sans-serif;
	color: #000;
	font-size: 12px;
	font-weight:200;
	text-transform: uppercase;
	text-align: center;
	letter-spacing: 2px;

}


/* ---- particles.js container ---- */

#particles-js{
  width: 100%;
  height: 100%;
  background-color: transparent;
  background-image: url('');
  background-size: cover;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  position:absolute;
  top:0;
  z-index:1;
}
/*----------------------------------------------------*/


/*------------------------------------------FOOTER SECTION*/
.section-footer {
	color: #fff; 
	background-color: #1b1b1b; 
	min-height: 250px; 
	width: 100%;
	font-size:12px;
	z-index: 90;
}
.section-footer a{
-webkit-transition:0.4s linear;
	-moz-transition:0.4s linear;
	-o-transition:0.4s linear;
	transition:0.4s linear;	
	
}
.section-footer a:hover{
	color:#00ccff;	
}

.section-footer .container-main{
	padding:60px 20px 20px 20px;
	font-family:'Roboto', sans serif;
}

.section-footer .footer-box1{
	width:100%;
	padding-left:0px;
}



@media screen and (min-width: 1024px) {
.section-footer .footer-box1{
	width:40%;
	padding-left:0px;
}

}


.section-footer .footer-box2, .section-footer .footer-box3, .section-footer .footer-box4{
	width:100%;
	padding-top:25px;
}

@media screen and (min-width: 1024px) {
.section-footer .footer-box2, .section-footer .footer-box3, .section-footer .footer-box4{
	width:20%;
	padding-top:20px;
}

}


.section-footer .footer-box1 p{
	text-transform:uppercase;
	padding:0px 0px 0px 10px;
	font-size:12px;
	line-height:18px;
	margin-top:25px;
	width:100%;
}
.section-footer .footer-box1 p a{
	font-size:12px;	
-webkit-transition:0.4s linear;
	-moz-transition:0.4s linear;
	-o-transition:0.4s linear;
	transition:0.4s linear;	
	
}
.section-footer .footer-box1 p a:hover{
	color:#00ccff;
	
}

.section-footer svg .xopath{
-webkit-transition: fill .4s linear;
-moz-transition: fill .4s linear;
transition: fill 0.4s linear;	 
}
.section-footer svg:hover .xopath{
fill: #00ccff;
}
.section-footer span.linepic {
	position:absolute; 
	margin-top:7px;
	color:#FFF;
	background-color:#FFF;
	margin-right:25px;
	width:36px;
}
.section-footer .footer-box2 span.footitle, .section-footer .footer-box3 span.footitle, .section-footer .footer-box4 span.footitle, .section-footer .footer-bottom-box2 span.footitle{
	text-transform:uppercase;
	padding-left:54px;
}

.footer-box-txt{
	line-height:20px;
	margin-top:5px;
	margin-left:5px;	
}

.section-footer .footer-bottom{
	clear:both; 
	padding:25px 0px 0 0px;
    font-family:'Roboto Condensed', san serif;
	font-weight:100;
	font-style:normal;
	
}
.section-footer .footer-bottom a{
	font-size:12px;
	line-height:16px;
	
}
.footer-bottom-box1{
	width:100%;
	padding-left:10px;
	padding-bottom:20px;
	margin-top:15px;
}
.footer-bottom-box2, .footer-bottom-box3{
	width:100%;
}

.footer-bottom-box2{

}
.footer-bottom-box3{
	padding-bottom:20px;
	margin-top:15px;
	clear:both;
}

.footer-bottom-box1 span{
	padding:0 8px 0 8px;
}

/*-------/FOOTER SECTION*/


/*-----------------------------
            PAGINA  AZIENDA
-------------------------------*/



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

.navbar-nav.nav-pages > li > a {
    color: #333;
}

.navbar-nav.nav-pages > li > a.active {
    color: #fff;
}
.top-nav-collapse .nav-pages > li > a{
   color: #fff;
}

.navbar-default.bordercolor {
   border-color: #999;
}


}



header.azienda {
	position:relative;
    width: 100%;	
	overflox-x: hidden;
    z-index:200;
	min-height:200px;
}

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

header.azienda {
    height: 100%;
}
}

.over-header{
	position:absolute; 
	top:0;
	/*z-index:999; */
	width:100%;
	background-image:url(../images/azienda/xo_azienda-bg.jpg);
  /*  background-attachment: fixed;*/
    background-repeat: no-repeat;	
    background-position: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
	
}

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

.over-header{
height:100%;
}

}


header.azienda col-md-6, header.azienda col-xs-6{ padding:0}

header.azienda h1 {
    font: 'Roboto', sans-serif;
    font-size: 45px;
    color: #000;
    line-height: 50px;
    margin-top: 0px;
	padding-top:30px;
    -webkit-transition: 0.4s linear;
    -moz-transition: 0.4s linear;
    -o-transition: 0.4s linear;
    transition: 0.4s linear;
}
header.azienda h1 strong{
	font-weight:bold;
}

header.azienda .linepic {
    height: 1px;
    width: 40px;
    background: #000;
    position: absolute;
}


.rect-title{
	width:265px; 
	height:50px; 
	position:absolute; 
	top:160px;
	clear:both;
	border:2px solid #000;
	text-align:center;
	padding: 11px 30px 8px 30px;
	text-transform:uppercase;
	font-size:18px;
}


.rect-title-line{
	width:265px; 
	height:50px; 
	position:absolute; 
	top:160px;
}
.rect-title-line .line-top i, .rect-title-line .line-bottom i, .rect-title-line .line-left i, .rect-title-line .line-right i  {}

/*ANIMATION SCROLL LINE*/
.rect-title-line.animatedLine .line-top i{
	-webkit-transition:width 0.4s ease-out;
	-moz-transition:width 0.4s ease-out;
	-o-transition:width 0.4s ease-out;
	transition:width 0.4s ease-out;
	width:100%;
}
.rect-title-line.animatedLine .line-right i {
	-webkit-transition:height 0.4s ease-out;
	-webkit-transition-delay:0.4s;
	-moz-transition:height 0.4s ease-out 0.4s;
	-o-transition:height 0.4s ease-out 0.4s;
	transition:height 0.4s ease-out 0.4s;
	height:100%;
}

.rect-title-line.animatedLine .line-bottom i {
	-webkit-transition:width 0.4s ease-out;
	-webkit-transition-delay:0.8s;
	-moz-transition:width 0.4s ease-out 0.8s;
	-o-transition:width 0.4s ease-out 0.8s;
	transition:width 0.4s ease-out 0.8s;
	width:100%;
}
.rect-title-line.animatedLine .line-left i {
	-webkit-transition:height 0.4s ease-out;
	-webkit-transition-delay:1.2s;
	-moz-transition:height 0.4s ease-out 1.2s;
	-o-transition:height 0.4s ease-out 1.2s;
	transition:height 0.4s ease-out 1.2s;
	height:100%;
}

/*OUT Animation*/
.rect-title-line.animatedLineOut .line-top i{
	-webkit-transition:width 0.4s ease-out;
	webkit-transition-delay:1.2s;
	-moz-transition:width 0.4s ease-out 1.2s;
	-o-transition:width 0.4s ease-out 1.2s;
	transition:width 0.4s ease-out 1.2s;
	width:0%;
}
.rect-title-line.animatedLineOut .line-right i {
	-webkit-transition:height 0.4s ease-out;
	-webkit-transition-delay:0.8s;
	-moz-transition:height 0.4s ease-out 0.8s;
	-o-transition:height 0.4s ease-out 0.8s;
	transition:height 0.4s ease-out 0.8s;
	height:0%;
}

.rect-title-line.animatedLineOut .line-bottom i {
	-webkit-transition:width 0.4s ease-out;
	-webkit-transition-delay:0.4s;
	-moz-transition:width 0.4s ease-out 0.4s;
	-o-transition:width 0.4s ease-out 0.4s;
	transition:width 0.4s ease-out 0.4s;
	width:0%;
}
.rect-title-line.animatedLineOut .line-left i {
	-webkit-transition:height 0.4s ease-out;
	-webkit-transition-delay:0s;
	-moz-transition:height 0.4s ease-out 0s;
	-o-transition:height 0.4s ease-out 0s;
	transition:height 0.4s ease-out 0s;
	height:0%;
}

/**/

.rect-title-2{
clear:both; position:relative; padding-top:75px; height:70px;
}

.rect-title-2 h2{
	font-size:16px;
	text-transform:uppercase;
}

.headerCenterTxt{
	padding-bottom:25px; 
	margin-top:0px; 
	padding-left:10px;
	clear:both;
}


header.azienda p{
	color:#000;
	padding:0 20px 10px 20px;
	margin-top:25px;
	text-align:justify;
	}
	
header.azienda p span{
	font-weight:bold;
	}
	
/**/
.folio.pages{
/*height:100%; */
z-index:100; 
margin-top:500px;
}

@media screen and (min-width: 768px) {
.folio.pages{margin-top:0px; z-index:200; }

.headerCenterTxt{
	padding-left:105px;

	}
   
header.azienda p{margin-top:20px;}
}

/*-------MISSION----------*/
section#mission{
	width:100%;
	height:100%;
	padding-top:0px;
	position:relative;
	transition: 1s all linear;
	z-index:200;
	background-color:#FFF;
	min-height:700px;

	}

.mission-left{
	width:100%; 
	position:relative; 
	clear:both;
	min-height:500px;
	background-image:url(../images/azienda/xo_azienda-bg2.jpg);
	 background-repeat: no-repeat;	
	  /* background-attachment: fixed;*/
	background-position: center;
	 -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
	}
	
.mission-right{
	width:100%; 
	position:relative;
	float:none;
	min-height:300px;
	padding:0px 20px 40px 20px;
	text-align:justify;
	}
.mission-right p{
		color:#000;
		margin-top:0px;
	}
	
@media screen and (min-width: 768px) {
	.mission-right p{
		margin-top:40px;
	}
}
	
	
	

.letter{
	font-family:'Oswald', san-serif; 
	font-size:140px; 
	text-transform:uppercase;
	width:140px;
	height:150px;
	margin:100px 0px 0px 200px;
	}
	
.letter-txt{
	font-size:18px; 
	position:relative; clear:both;
	text-transform:uppercase;
	margin:100px 0px 0px 30px;
	}	
		
.box-title{
position: absolute;
top: 100px;
left: 30px;
width: 300px;
height: 50px; 
}

.box-title.missionlink{
	margin-top:45px;
}
@media screen and (min-width: 768px) {
.box-title.missionlink{
	margin-top:15px;
	left:80px;
	
} 
}




.box-title h3{
	font-size:18px;
	position:absolute;
	top:15px;
	left: 120px;
	
}

#BOX-svg{
position: relative;
width: 300px;
height: 50px; 

}
#BOX-svg rect {
    stroke-width: 4;
    width: 300px;
height: 50px; 
}



@media screen and (min-width: 768px) {
	.box-title{
position: absolute;
top: 150px;
left: 115px;
width: 300px;
height: 50px; 
}

.letter{margin:20px 0px 0px 80px;}
.letter-txt{margin:90px 0px 0px 115px;}
}
	
@media screen and (min-width: 769px) {
	.mission-left{
	width:60%; 
	min-height:700px;
	float:left; 
	background-size:contain;
	background-position: -50px 0px;
	 }
	 
@media screen and (min-width: 1366px) {
	.mission-left{
	width:60%; 
	min-height:700px;
	float:left; 
	background-size:contain;
	background-position: 25% 0px;
	 }
 }
.mission-right{
	width:28%; 
	position:relative; 
	float:left;
	min-height:700px;
	padding:140px 20px 40px 20px;
	}

}	

.line-bottom i {
	bottom:0em;
}
/*HOVER LINE*/
.box-title:hover .line-top i{
	-webkit-transition:width 0.4s ease-out;
	-moz-transition:width 0.4s ease-out;
	-o-transition:width 0.4s ease-out;
	transition:width 0.4s ease-out;
	width:100%;
}
.box-title:hover .line-right i {
	-webkit-transition:height 0.4s ease-out;
	-webkit-transition-delay:0.4s;
	-moz-transition:height 0.4s ease-out 0.4s;
	-o-transition:height 0.4s ease-out 0.4s;
	transition:height 0.4s ease-out 0.4s;
	height:100%;
}

.box-title:hover .line-bottom i {
	-webkit-transition:width 0.4s ease-out;
	-webkit-transition-delay:0.8s;
	-moz-transition:width 0.4s ease-out 0.8s;
	-o-transition:width 0.4s ease-out 0.8s;
	transition:width 0.4s ease-out 0.8s;
	width:100%;
}
.box-title:hover .line-left i {
	-webkit-transition:height 0.4s ease-out;
	-webkit-transition-delay:1.2s;
	-moz-transition:height 0.4s ease-out 1.2s;
	-o-transition:height 0.4s ease-out 1.2s;
	transition:height 0.4s ease-out 1.2s;
	height:100%;
}

/*ROLLOUT +script*/
.box-title.rollOut .line-left i {
	-webkit-transition:height 0.4s ease-out;
	-webkit-transition-delay:0s;
	-moz-transition:height 0.4s ease-out 0s;
	-o-transition:height 0.4s ease-out 0s;
	transition:height 0.4s ease-out 0s;
	height:0%;
}

.box-title.rollOut .line-bottom i {
	-webkit-transition:width 0.4s ease-out;
	-webkit-transition-delay:0.4s;
	-moz-transition:width 0.4s ease-out 0.4s;
	-o-transition:width 0.4s ease-out 0.4s;
	transition:width 0.4s ease-out 0.4s;
	width:0%;
}

.box-title.rollOut .line-right i {
	-webkit-transition:height 0.4s ease-out;
	-webkit-transition-delay:0.8s;
	-moz-transition:height 0.4s ease-out 0.8s;
	-o-transition:height 0.4s ease-out 0.8s;
	transition:height 0.4s ease-out 0.8s;
	height:0%;
}
.box-title.rollOut .line-top i {
	-webkit-transition:width 0.4s ease-out;
	-webkit-transition-delay:1.2s;
	-moz-transition:width 0.4s ease-out 1.2s;
	-o-transition:width 0.4s ease-out 1.2s;
	transition:width 0.4s ease-out 1.2s;
	width:0%;
}


/*-------PARTNER----------*/
section#partner{
	width:100%;
	height:100%;
	padding-top:0px;
	position:relative;
	transition: 1s all linear;
	z-index:300;
	background-color:#FFF;
	min-height:600px;

	}
	
	
.left-mainBox.leftmainBoxPartner{
		min-height: 350px;
	}
	
@media screen and (min-width: 768px) {

.left-mainBox.leftmainBoxPartner{
		min-height: 350px;
	}
}
	
	
	

section#partner .title-container {
    position: absolute;
    width: 250px;
    height: 380px;
    left: 45px;
    top: 30px;
}

section#partner .title-container .line-bottom i {
    bottom: 0em;
}

section#partner #box1-svg {
    position: relative;
    left: 80px;
    left: 0px;
    width: 250px;
    height: 380px;
}
section#partner .titleone {
    position: absolute;
    left: 12px;
    bottom: 0px;
    font-size: 55px;
    line-height: 75px;
    color: #000;
    font-family: 'Roboto', sans-serif;
    font-weight: bold;
    letter-spacing: -3px;
	text-transform:uppercase;
}

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

section#partner .title-container {
    top: 0px;
	left:115px;}
}

@media screen and (min-width: 1024px) {

section#partner .title-container {top: 50px;}
}
	
section#partner .titleVertical {
    position: absolute;
    left: 15px;
    top: 30px;
    font-size: 16px;
    font-family: 'Roboto Condensed', sans-serif;
    line-height: 18px;
    text-transform: uppercase;
    font-weight: normal;
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
    color: #000;
    -webkit-transition: color 0.4s ease;
    -moz-transition: color 0.4s ease;
    -o-transition: color 0.4s ease;
    transition: color 0.4s ease;
    letter-spacing: 2px;
}

.left-partner p {
	color:#000;
padding-top:50px;
max-width:800px;
text-align:justify;}

.img-partner  {
	margin-top:40px;
	margin-bottom:60px;
	}
	
@media screen and (min-width: 768px) {
.img-partner  {
	margin-top:40px;
	margin-bottom:0px;
	}

}

.img-partner ul li  {
	width:30%; 
	margin:0 0 20px 0;
	display:inline-block;
	}

/*-------NEWSLETTER----------*/
section#newsletter-1{
	width:100%;
	height:100%;
	padding-top:0px;
	position:relative;
	transition: 2s all linear;
	z-index:400;
/*	background-color:#000;*/
	/*min-height:700px;*/
	color:#FFF;
	}

.color-bg{ 
min-height:400px;
background:rgb(0,0,0);
background-color:#000;
transition:1.5s all linear;
}


@media screen and (min-width: 768px) {
.color-bg{ 
min-height:500px;
}

}



.color-bg[leftAttr="0"]{ background:rgb(255,255,255);}
.color-bg[leftAttr="1"]{ background:rgb(0,0,0);}


section#newsletter-1 h2{
	font-size:30px;
	line-height:40px;
	margin-top:50px;
	}
section#newsletter-1 .fade-img {
	margin-top:105px; 
}	
	
section#newsletter-1 .aos-animate[data-aos^="fade"][data-aos^="fade"] {
    opacity: 1;
    transform: translate(0);
    transition-delay: 2s;
}

.form-container{
	max-width:550px;  
	margin:0 auto; 	
	margin-top:50px;
	}	
.input-mail-container{
width:65%; 
margin-right:5%; 
height:50px; 
float:left;
	}
.input-submit-container{
width:30%; 
height:50px; 
float:left;
	}
.imputmail{
width: 100%;
height: 100%;
color: #fff;
background-color: #363636;
border: none;
padding: 15px;
font-size: 18px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
	}	
.inputsubmit{
width:100%; 
height:100%; 
color:#000;
border: none;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
transition:0.5s all linear;

	}
.inputsubmit:hover{
background-color:#00ccff;
color:#FFF;
}


/**
 * Set default style for invalid elements.
 */
:not(output):-moz-ui-invalid {
  box-shadow: 0 0 0px 4px rgb(0, 204, 255, 1);
}

:not(output):-moz-ui-invalid:-moz-focusring {
  box-shadow: 0 0 0px 4px rgba(0, 204, 255, 1);
}


/*-------------------------------
---------------------------------
            PAGINA  SERVIZI
----------------------------------
-------------------------------*/

header.servizi {
	position:relative;
    width: 100%;
    height: 100%;	
	overflox-x: hidden;
    z-index:200;
	background-color:#FFF;
}

.over-header-2{
	position:absolute; 
	top:0;
	/*z-index:999; */
	width:100%;
	min-height:700px;
	background-image:url(../images/servizi/xo_servizi-bg.jpg);
   /* background-attachment: fixed;*/
    background-repeat: no-repeat;	
    background-position: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;	
}

@media screen and (min-width: 768px) {
.over-header-2{height:100%;}
}

header.servizi col-md-6, header.servizi col-xs-6{ padding:0}

header.servizi .header-txtRight{ 
max-width:280px; 
position:relative
}

header.servizi .V-txt { 
color:#000;
float:right;
margin: 120px 0 0px 0px;
}


header.servizi .V-txt span{ 
font-size:20px;
font-weight:bold;
margin-left:-6px;}

header.servizi .title-container {
    position: absolute;
    width: 250px;
    height: 380px;
    left: 45px;
    top: 0px;
}

header.servizi .title-container .line-bottom i {
    bottom: 0em;
}

header.servizi #box1-svg {
    position: relative;
    left: 0px;
    width: 250px;
    height: 380px;
}
header.servizi .titleone {
    position: absolute;
    left: 12px;
    bottom: 15px;
    font-size: 70px;
    line-height: 70px;
    color: #000;
    font-family: 'Roboto', sans-serif;
    font-weight: bold;
    letter-spacing: -2px;
	/*text-transform:uppercase;*/
}

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

header.servizi .title-container {
    top: 0px;
	left:150px;}
}
	
header.servizi .titleVertical {
    position: absolute;
    left: 15px;
    top: 30px;
    font-size: 15px;
    font-family: 'Roboto Condensed', sans-serif;
    line-height: 22px;
    text-transform: uppercase;
    font-weight: normal;
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
    color: #000;
    -webkit-transition: color 0.4s ease;
    -moz-transition: color 0.4s ease;
    -o-transition: color 0.4s ease;
    transition: color 0.4s ease;
    letter-spacing: 2px;
}

header.servizi .titleVertical span{
 font-size: 12px;
    font-family: 'Roboto Condensed', sans-serif;
    line-height: 16px;
    text-transform: none;
	padding-right:5px;
}


.folio.pages.service{
/*height:100%; */
z-index:300; 
margin-top:250px;
}

@media screen and (min-width: 768px) {
.folio.pages.service{z-index:300; margin-top:0px;}
}

/*-------FOCUS----------*/
section#focus{
	width:100%;
	height:100%;
	padding-top:0px;
	position:relative;
	transition: 1s all linear;
/*	z-index:200;*/
	/*background-color:#FFF;*/
	min-height:1200px;
    -webkit-transition: 0.4s linear;
    -moz-transition: 0.4s linear;
    -o-transition: 0.4s linear;
    transition: 0.4s linear;

}

section#focus .center-mainBox {
    position: relative;
    left: 100px;
    top: -240px;
    z-index: 500;
    font-family: 'Roboto Condensed', sans-serif;
	max-width:200px;
}
section#focus .center-mainBox span { display:none}

@media screen and (min-width: 768px) {
section#focus .center-mainBox {left: 230px; max-width:300px;}
section#focus .center-mainBox span { display:block}
}

/*section#focus .center-mainBox .txt h1 {
	color:#FFF;
}*/

section#focus .container-main{ 
padding:0; 
margin-top:0px; 
}

.container-color{
	padding:0; 
	margin-top:0px;
	/*min-height:500px;*/
	background-color:transparent;
	padding-bottom:100px;
	z-index:300;
   -webkit-transition: 0.4s linear;
    -moz-transition: 0.4s linear;
    -o-transition: 0.4s linear;
    transition: 0.4s linear;
}

.container-color[colorAttr="0"]{ background:rgb(255,255,255, 0);}
.container-color[colorAttr="1"]{ background:rgb(77,85,98, 0.85); background-color:#4D5562;}

.focus-title{
	clear:both; 
	position:relative; 
/*	margin-top:-150px; */
	z-index:400;
	margin-bottom:70px;
}

.focus-title h2{
	text-align:center;
	text-transform: uppercase;
	color:#FFF;
	font-family:'Roboto Condensed', sans-serif;
	font-size:50px;
}
.focus-title h2 span{
	font-weight:100;
}
.focusbox-container{
	margin-top:60px; 
	position:relative; 
	z-index:400;
	padding:0px 10px 10px 10px;
	color:#FFF;
	 /*-webkit-transition: 0.4s linear;
    -moz-transition: 0.4s linear;
    -o-transition: 0.4s linear;
    transition: 0.4s linear;*/
}
.focusbox{
	padding:20px 0px 40px 0px;	
}

.focusbox p{
	margin-top:0px;
	margin-bottom:0px;
	z-index:400;
	text-align:justify;
}
.focusbox-title{
	width:75%; float:left;
}

.focusbox h3{
	font-size:18px;
	line-height:22px;
	text-transform:uppercase;
}

@media screen and (min-width: 768px) {
.focusbox-container{
	padding:0px 170px 10px 170px;
}
.focusbox{
	padding:20px 0px 40px 25px;	
}
}

span.linepic.b{
	position:absolute;
	background:#00ccff;
	left:0px;
	top:7px;
}
.read-more-1, .read-more-2, .read-more-3, .read-more-1-Closed, .read-more-2-Closed, .read-more-3-Closed{
	width:200px; 
	margin-top:50px;
	position:relative;
	color:#00ccff;
	padding-left:60px;
	text-transform: uppercase;
	font-family:'Roboto Condensed', sans-serif;
	font-size:13px;
	font-weight:100;
-webkit-transition: 0.4s linear;
-moz-transition: 0.4s linear;
-o-transition: 0.4s linear;
transition: 1s linear;
cursor:pointer;
z-index:400;
}

.read-more-1:hover, .read-more-2:hover, .read-more-3:hover, .read-more-1-Closed:hover, .read-more-2-Closed:hover, .read-more-3-Closed:hover{
	color:#FFF;
}

.dilatation, .dilatation-2, .dilatation-3{
-webkit-transition:0.4s linear;
	-moz-transition:0.4s linear;
	-o-transition:0.4s linear;
	transition:0.4s linear;
	z-index:400;
}

/*-------FOCUS NEW----------*/

section#focus .center-mainBox {
  max-height: 100px;
  display:none;
}

section#focus strong{
	font-weight:400;
}
section#focus p strong{
	color:#fff;
}

section#focus p {
	font-size:16px;
	line-height:28px;
	/*text-transform:uppercase;*/
	font-family:'Roboto', sans-serif;
	font-weight:400;
	margin-bottom:15px;

}

/*FOCUS BOX*/
section#focus .box2 {
	position:relative;
	left:0;
	bottom:0;
	width:100%;
	height:350px;	
}

@media screen and (min-width: 768px) {
section#focus .box2 {	
height:210px;
	/*width:420px;*/	
}

}


section#focus .box2 #box2-svg {
width: 420px;
height: 280px;
display:none;	
}

section#focus .box2 #box2-svg rect {
     stroke-width: 4; 
     width: 420px; 
     height: 280px;
	 display:none;
}
/**/
section#focus .box2.box2-focus {
	position:relative;
	left:0;
	bottom:0;
	width:100%;
	height:350px;	
}

@media screen and (min-width: 768px) {
section#focus .box2.box2-focus {
	height:280px;	
}

}

@media screen and (min-width: 1024px) {
section#focus .box2.box2-focus {
	width:570px;
	height:350px;	
}

}
section#focus .box2.box2-focus #box2-svg{
width: 570px;
height: 350px;
display:none;	
}

section#focus .box2.box2-focus #box2-svg rect {
     stroke-width: 4; 
     width: 570px; 
     height: 350px;
	 display:none;
}


section#focus .line-top, section#focus .line-bottom, section#focus .line-left, section#focus .line-right{display:none;}


@media screen and (min-width: 1280px) {
section#focus .line-top, section#focus .line-bottom, section#focus .line-left, section#focus .line-right{display:block;}

section#focus .box2 {
	width:520px;
	height:280px;
	
}
section#focus .box2 #box2-svg {
	display:block;
width: 520px;
height: 280px;
	
}

section#focus .box2 #box2-svg rect {
	display:block;
     width: 520px; 
     height: 280px; 
}

section#focus .box2.box2-focus, section#focus .box2.box2-focus #box2-svg, section#focus .box2.box2-focus #box2-svg rect {
display:block;	
}

section#focus .box2.box2-focus {
left:50px;
}

}


/*/FOCUS BOX*/

.focus-1bg{
background-image:url(../images/servizi/xo-servizi-focus1.jpg);
    background-attachment: fixed;
    background-repeat: no-repeat;	
    background-position: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
	padding-bottom:60px;
}
.focus-1 span{
	color:#000;
	margin:40px 0 0px 100px;
}

.focus-1 h1{
	font-size:40px;
	line-height:43px;
	margin-left:50px;
	margin-top:30px;
	color:#fff;
}

@media screen and (min-width: 768px) {
.focus-1 h1{
	margin-left:130px;
	margin-top:30px;
	color:#fff;
}

}


.focus-2 {
	z-index:400;
	
}

.focus-2 p{
	font-family:'Roboto Condensed', sans-serif;
	line-height:32px;
	font-weight:100;
	margin:0 0px 20px 0;
	text-align:justify;
	color:#000;
	
}

@media screen and (min-width: 768px) {
.focus-2 p{
margin:0 0px 20px 0;
}

}

@media screen and (min-width: 1024px) {
.focus-2 p{
margin:0 40px 20px 0;
}

}

.focus-2 h1{
	font-size:40px;
	line-height:43px;
	margin-left:180px;
	margin-top:30px;
	color:#fff;
}
.focus-3{
	margin-top:0px;
	margin-bottom:60px;
	z-index:400;


}
.focus-3 span{
	color:#000;
	margin:50px 0 0px 100px;

}
.focus-3 h1{
	font-size:40px;
	line-height:43px;
	margin-left:50px;
	margin-top:30px;
	margin-bottom:30px;
	color:#fff;
}

@media screen and (min-width: 768px) {
.focus-3 h1{
	margin-left:130px;
}

}


.focus-3 p{
	color:#000;
	font-family:'Roboto Condensed', sans-serif;
	font-weight:100;
	margin:0px 0px 20px 0px;
	text-align:justify;
}

@media screen and (min-width: 768px) {
.focus-3 p{
	margin:0px 40px 20px 100px;
}

}


.focus-4 {
	margin-top:90px;
	z-index:400;
	padding-top:40px;
}


@media screen and (min-width: 768px) {
.focus-4 {
padding-top:0px;
}

}



.focus-4 span{
	color:#000;
	margin:40px 0 0px 0px;

}
.focus-4 h1{
	font-size:40px;
	line-height:43px;
	margin-top:30px;
	margin-left:30px;
	margin-bottom:30px;
	color:#FFF;
}

.focus-4 p{
	color:#000;
	font-family:'Roboto Condensed', sans-serif;
	font-size:22px;
	line-height:32px;
	font-weight:100;
	margin:0px 0px 20px 0;
	text-align:justify;
	
}

@media screen and (min-width: 768px) {
.focus-4 p{
	margin:0px 40px 20px 0;
	
}

}

/*-------SERVIZI ABOUT----------*/
section#aboutservice{
	width:100%;
	height:100%;
	padding-top:0px;
	position:relative;
	transition: 1s all linear;
	z-index:200;
	background-color:#FFF;
	min-height:450px;

	}
@media screen and (min-width: 768px) {
section#aboutservice{
	min-height:550px;
	}	

}	

	
.aboutservice-left{
	width:100%; 
	position:relative;
	clear:both;
	min-height:450px;
	margin-left:0px;
	margin-top:0px;
	/*background-image:url(../images/servizi/xo-servizi.jpg);
	 background-repeat: no-repeat;	
	background-position: center;
	 -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;*/
	}
@media screen and (min-width: 768px) {
	.aboutservice-left{
	width:50%; 
	position:relative;
	float:left;
	min-height:500px;
	margin-left:0px;
	margin-top:0px;
	background-image:url(../images/servizi/xo-servizi.jpg);
	 background-repeat: no-repeat;	
	background-position:0px 0px;
	 -webkit-background-size: contain;
    -moz-background-size: contain;
    background-size: contain;
    -o-background-size: contain;
	}

}


.aboutservice-txt {
  position:absolute; 
  top:110px; 
  left:30px;
  max-width:320px;
  z-index:400;
}

@media screen and (min-width: 768px) {
.aboutservice-txt {
  position:absolute; 
  top:20px; 
  left:44%;
  max-width:600px;
  z-index:400;  
}	

}

.aboutservice-txt h2{
	font-family: 'Roboto Condensed', sans-serif;
font-size: 24px;
color: #333;
text-transform: uppercase;
font-weight: 100;
padding-top: 0px;
padding-bottom: 10px;
font-style: normal;
 
}


.aboutservice-txt h1{
	font-family: 'Oswald', sans-serif;
    font-size: 30px;
    line-height: 36px;
    margin-bottom: 30px;
    color: #000;
}
 

@media screen and (min-width: 768px) {
.aboutservice-txt h1{
    font-size: 45px;
    line-height: 60px;
    margin-bottom: 60px;
}
}



/*----------------------------------
            PAGINA  PRODOTTI
-------------------------------------*/

header.prodotti {
	position:relative;
    width: 100%;
    height: 100%;	
	overflox-x: hidden;
    z-index:100;
	background-color:#FFF;
	min-height:700px;
}

.over-header2{
	position:absolute; 
	top:0;
	/*z-index:999; */
	width:100%;
	background-image:url(../images/prodotti/xo-prodotti-bg.jpg);
  /*  background-attachment: fixed;*/
    background-repeat: no-repeat;	
    background-position: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
	min-height:700px;;
	
}

@media screen and (min-width: 768px) {
.over-header2{height:100%;}
header.prodotti {height: 100%; z-index:200;}
}


header.prodotti col-md-6, header.prodotti col-xs-6{ padding:0}

.header-txtLeft{ 
padding-left:20px;
}

@media screen and (min-width: 768px) {
.header-txtLeft{ padding-left:110px;}
}

header.prodotti h1 {
    font: 'Roboto', sans-serif;
    font-size: 45px;
    color: #000;
    line-height: 48px;
    margin-top: 0px;
	padding-top:30px;
    -webkit-transition: 0.4s linear;
    -moz-transition: 0.4s linear;
    -o-transition: 0.4s linear;
    transition: 0.4s linear;
}
header.prodotti h1 strong{
	font-weight:bold;
}

header.prodotti .linepic {
    height: 1px;
    width: 40px;
    background: #000;
    position: absolute;
}

header.prodotti p {
  font-weight: 300;
margin-top: 20px;
max-width:340px;
color:#000;
}


.headerTop{
clear:both;
position: relative; 
width:250px;
left:10px;
top:50px;
display:none;
}

@media screen and (min-width: 768px) {
.headerTop{
	display:block;
width:350px; 
margin-left:115px;
top:70px;

}
}

@media screen and (min-width: 1280px) {
.headerTop{
left:27%;
}
}

.rect-title2{
width: 350px;
top: 0;
padding: 14px 25px 0px 25px;
}
a .rect-title2 {
	color:#000;
	-webkit-transition: background .4s linear;
    -moz-transition: background .4s linear;
	 transition: background 0.4s linear;
}
a:hover .rect-title2 {
	color:#fff;
	background-color:#00ccff;
	border-color:#00ccff;
}
.rect-title-line2 {
    width: 350px;
    top: 0;
}

.folio.pages.pages2 {
    margin-top: 0px;
}

/*-----SECTION PRODOTTI------*/
.sectionProduct{
	z-index:200;
	background-color:#FFF;
	
}

.color-bg2[leftAttr="0"] {
    background: rgb(255,255,255);
}
.color-bg2[leftAttr="1"]{ background:rgb(0,0,0);}
.color-bg2 {
    background: rgb(27,27,27);
    transition: 1.5s all linear;
}


.over-xo {
   position:absolute; 
   top:-85px; 
   left:100px;
   font-family:'Oswald', sans-serif;
   font-size:160px;
   cursor:default;
    -webkit-transition: 0.4s linear;
    -moz-transition: 0.4s linear;
    -o-transition: 0.4s linear;
    transition: 0.4s linear;
	z-index:300;
}

@media screen and (min-width: 768px) {
.over-xo {
   top:-140px; 
   left:40%;
}

}


.over-xo:hover {
	color:#00ccff;
}

.galleryProduct{
	color:#00ccff;
	margin:0px auto;
	margin-top:100px;
	z-index:200;
	max-width:1240px; 
}

.slideProduct{
	padding-left:0px;
	padding-right:0px;
}
@media screen and (min-width: 768px) {
.slideProduct{
	padding-left:60px;
	padding-right:60px;
}
}

.slideProduct .carousel-control-prev {
top: 110%;
position: absolute;
display: block;
width: 37px;
height: 65px;
left: 30%;
background-image:url(../images/lavori/arrow-prev.png);
background-repeat: no-repeat;	
}

@media screen and (min-width: 768px) {
.slideProduct .carousel-control-prev {
top: 50%;
left: 0px;	
}
}

.slideProduct .carousel-control-next {
top: 110%;
position: absolute;
display: block;
width: 37px;
height: 65px;
right: 30%;
background-image:url(../images/lavori/arrow-next.png);
background-repeat: no-repeat;
z-index:9999;
}

@media screen and (min-width: 768px) {
.slideProduct .carousel-control-next {
top: 50%;
right: 0px;
}
}

/* zoom slide */
.moving2 {
   -webkit-animation: moving2 8s infinite; /* Chrome, Safari, Opera */
    -webkit-animation-direction: alternate; /* Chrome, Safari, Opera */
    animation: moving2 8s infinite;
    animation-direction: alternate;
}
@-webkit-keyframes moving2 {
from { -webkit-transform: rotate(0deg) scale(1.0) skew(0deg) translate(0px); }
to { -webkit-transform: rotate(0deg) scale(1.05) skew(0deg) translate(0px); }
}
@-moz-keyframes moving2 {
from { -moz-transform: rotate(0deg) scale(1.0) skew(0deg) translate(0px); }
to { -moz-transform: rotate(0deg) scale(1.05) skew(0deg) translate(0px); }
}
@-o-keyframes moving2 {
from { -o-transform: rotate(0deg) scale(1.0) skew(0deg) translate(0px); }
to { -o-transform: rotate(0deg) scale(1.05) skew(0deg) translate(0px); }
}
	


.roundBtn{
	z-index:300;
opacity:1; 
position:absolute; 
width:40px; 
height:40px; 
border-radius:24px; 
border:2px solid #fff; 
cursor:pointer; 
left:88%; 
 bottom:10px; 
 -webkit-transition: 0.3s linear;
    -moz-transition: 0.3s linear;
    -o-transition:  0.3s linear;
    transition: 0.3s linear;
	
	-webkit-animation: colorUp3 2s infinite; /* Chrome, Safari, Opera */
    -webkit-animation-direction: alternate; /* Chrome, Safari, Opera */
    animation: colorUp3 2s infinite;
    animation-direction: alternate;
}



@-webkit-keyframes colorUp3 {
0% { background: none; }
80% { background: none; }
100% { background:rgb(0,204,255, 0.8) }
}
@-moz-keyframes colorUp3 {
0% {background: none; }
80% { background: none; }
100% { background:rgb(0,204,255, 0.8) }
}
@-o-keyframes colorUp3 {
0% { background: none; }
80% { background: none; }
100% { background:rgb(0,204,255, 0.8) }
}



.roundBtn-closed{
	display:none;
background-color: #00ccff;
z-index:300;
opacity:1; 
position:absolute; 
width:40px; 
height:40px; 
border-radius:24px; 
border:2px solid #fff; 
cursor:pointer; 
left:88%; 
 bottom:10px; 
 -webkit-transition: 0.3s linear;
    -moz-transition: 0.3s linear;
    -o-transition: 0.3s linear;
    transition: 0.3s linear;
}


@media screen and (min-width: 768px) {
.roundBtn{ bottom:10%; left:45%; }
.roundBtn-closed{ bottom:10%; left:45%;}

}


.roundBtn:hover{
background-color: #00ccff !important;
border:2px solid #00ccff; 
}

.roundBtn-closed:hover{
border:2px solid #00ccff; 
}

.roundBtn .cross, .roundBtn-closed .cross{
position: absolute;
left: 19px;
top: 19px;
}

.roundBtn .cross .a, .roundBtn-closed .cross .a  {
    position: absolute;
    width: 14px;
    height: 2px;
    background-color: #FFF;
    left: -8px;
    top: -2px;
}
.roundBtn .cross .b{
    position: absolute;
    width: 2px;
    height: 14px;
    background-color: #FFF;
    left: -2px;
    top: -8px;
}



.over-caption{
width: 0%;
background-color: #000;
top: 0;
left:150%;
height: 100%;
font-family:'Roboto Condensed', sans-serif;
color:#333;
text-shadow:none;
padding:30px;
overflow:auto;
 -webkit-transition:0.5s linear;
	-moz-transition:0.5s linear;
	-o-transition:0.5s linear;
	transition:0.5s linear;
	opacity:0;
}

.over-caption.open{
background-color: #ebebeb;
width: 100%;
left:0%;
 -webkit-transition:0.5s linear;
	-moz-transition:0.5s linear;
	-o-transition:0.5s linear;
	transition:0.5s linear;
	opacity:1;
}

@media screen and (min-width: 768px) {
.over-caption.open{
width: 45%;
left:48%;
}

}


.over-caption.open::-webkit-scrollbar {
	width:14px;
	background-color:#ccc;

}
.over-caption.open::-webkit-scrollbar-thumb {
	background-color:#00cccff;

}
.container-relative{
	position:relative;
}
.over-caption h2{
	font-size:24px;
	text-transform:uppercase;
	font-weight:100;
	margin:2px 0px 5px 0px;
}

.over-caption .linepic{
	position:absolute;
	height:1px;
	width:50px;
	left:50%;
	margin-left:-25px;
	background:#000;
}


.over-caption p{
	color:#000;
	margin-top:20px;
	margin-bottom:10px;
	text-align:justify;
	line-height:18px;
}

.caption-icon{
	width:64px; 
	height:64px; 
	margin:0 auto
}

.col12-over{
	margin-top:100px;
	}
@media screen and (min-width: 768px) {
.col12-over{
	margin-top:0px;
	}
}

.containerBlack-0 {
    position: relative;
	width:42%; 
	text-align:right;
    margin: 60px 60px 0px 0px;
    color: #FFF;
	float:left;

}

@media screen and (min-width: 1280px) {
.containerBlack-0 { margin: 60px 90px 0px 0px;  
}
}



.containerBlack-0 h1{ 
font-family:'Oswald', sans-serif;
	font-size:60px;
	color:#FFF;
	margin-bottom:35px;

}

@media screen and (min-width: 768px) {
.containerBlack-0 h1{ 
	font-size:90px;
}
}
@media screen and (min-width: 1024px) {
.containerBlack-0 h1{ 
	font-size:108px;
}
}
.containerBlack-0 .linepic-w {
	right:350px;
	bottom:8px;
}

.containerBlack-0 h3 {
	display:none;
    text-transform: uppercase;   
    font-size: 17px;
    font-weight: 200; 
	margin-right: 0px;
}
@media screen and (min-width: 768px) {
.containerBlack-0 h3 {
	display:block;
	
}
}

@media screen and (min-width: 1024px) {
.containerBlack-0 h3 {
	 margin-right: 80px;
}
}
.rightProduct{
	/*margin-top:8%;*/
	margin-bottom:40px;
	padding-left:0px;
	color:#FFF;
float:left;
}
.container-rightProduct{
	padding:30px 0px 0px 0px; 
}

.container-rightProduct h2{
	font-family:'Roboto Condensed', sans-serif;
	font-weight:200;
font-size: 52px;
line-height: 54px;
text-transform:uppercase;
margin-top: 0px;
}

.container-rightProduct h2 span{font-weight: bold;}

.dealer{
	padding:0; 
	clear:both; 
	padding-bottom:90px;

}


.dealer .title-container {
    left: 40px;
	top:60px;
}


@media screen and (min-width: 1280px) {
.dealer .title-container {
    left: 150px;
}
}


.dealer .titleone {
    position: absolute;
    left: 12px;
    bottom: 0px;
    font-size: 55px;
    line-height: 75px;
    color: #000;
    font-family: 'Roboto', sans-serif;
    font-weight: bold;
    letter-spacing: -3px;
	text-transform:uppercase;
}

.dealer .titleVertical {
    left: 15px;
    top: 30px;
    font-size: 16px;
    line-height: 18px;
    text-transform: uppercase;
    font-weight: normal;
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: color 0.4s ease;
    -moz-transition: color 0.4s ease;
    -o-transition: color 0.4s ease;
    transition: color 0.4s ease;

}
.img-dealer {
    margin-top: 80px;
	max-width:779px;
}

.img-dealer ul li {
	width:30%;
	display:inline-block;
	margin:0 0 20px 0;
}

/*newsletter-2*/
#newsletter-2{
	width:100%;
	color:#FFF;
	min-height:400px;
	position:relative;
	background-image:url(../images/prodotti/xo-contact.jpg);
    background-repeat: no-repeat;	
    background-position: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}
.container-new{
	max-width:1600px;
	margin: 0 auto;
	display:block;
}

#newsletter-2 h2 {
    font-size: 30px;
    line-height: 40px;
	padding-top:80px;
}
#newsletter-2 .imputmail {
 background-color: rgb(255,255,255,0.5);
 
}



/*----------------------------------
            PAGINA  LAVORI -PROGETTI
-------------------------------------*/

header.lavori {
	position:relative;
    width: 100%;
    height: 100%;	
	overflox-x: hidden;
    z-index:100;
	background-color:#FFF;
	min-height:650px;
}

header.lavori .container-main{margin-top:0px;}

.over-header3{
	position:absolute; 
	top:0;
	/*z-index:999; */
	width:100%;
	background-image:url(../images/lavori/xo_lavori-bg.jpg);
 /*   background-attachment: fixed;*/
    background-repeat: no-repeat;	
    background-position: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
	min-height:650px;
	
}

@media screen and (min-width: 768px) {
.over-header3{height:100%;}
header.lavori {height: 100%; z-index:200;}
header.lavori .container-main{margin-top:150px;}
}

header.lavori .title-container {
    width: 250px;
    height: 380px;
	top:100px;
}

@media screen and (min-width: 768px) {
header.lavori .title-container {
    top: 0px;
	left:80px;}
}

@media screen and (min-width: 1280px) {
header.lavori .title-container {
    top: 0px;
	left:150px;}
}

header.lavori #box1-svg {
    position: relative;
    left: 0px;
    width: 250px;
    height: 380px;
}

header.lavori .title-container .line-bottom i {
    bottom: -0.1em;
}

header.lavori .titleone {
    position: absolute;
    left: 12px;
    bottom: 15px;
    font-size: 90px;
/*    line-height: 70px;*/
    color: #000;
    font-family: 'Roboto', sans-serif;
    font-weight: bold;
    letter-spacing: -2px;
}


header.lavori h1 {
    font-family: 'Roboto Condensed', sans-serif;
    font-size: 30px;
	font-weight:100;
    color: #000;
    line-height: 35px;
    margin-top: 500px;
    margin-left: 20px;
    -webkit-transition: 0.4s linear;
    -moz-transition: 0.4s linear;
    -o-transition: 0.4s linear;
    transition: 0.4s linear;
}

header.lavori h1 span {
	font-weight:bold;
	color:#000;
}

@media screen and (min-width: 768px) {
header.lavori h1 {
    font-size: 34px;
	font-weight:100;
    line-height: 40px;
    margin-top: 120px;
    margin-left: 380px;
}
}

@media screen and (min-width: 1280px) {
header.lavori h1 {
    font-size: 34px;
	font-weight:100;
    line-height: 40px;
    margin-top: 320px;
    margin-left: 440px;
}
}

/*SECTION WORK*/
.sectionWork{
	z-index:200;
	background-color:#FFF;

}
.galleryWork{
	color:#00ccff;
	margin:0px auto;
	margin-top:100px;
	z-index:400;
	max-width:1029px; /*959+70*/
	min-height:700px;
}

.slideWork{
	padding-left:0px;
	padding-right:0px;
}

@media screen and (min-width: 768px) {
.slideWork{
	padding-left:70px;
	padding-right:70px;
}
}

.slideWork .carousel-control-prev {
top: 110%;
position: absolute;
display: block;
width: 37px;
height: 65px;
left: 30%;
background-image:url(../images/lavori/arrow-prev.png);
background-repeat: no-repeat;	
}

@media screen and (min-width: 768px) {
.slideWork .carousel-control-prev {
top: 50%;
left: 0px;	
}
}

.slideWork .carousel-control-next {
top: 110%;
position: absolute;
display: block;
width: 37px;
height: 65px;
right: 30%;
background-image:url(../images/lavori/arrow-next.png);
background-repeat: no-repeat;	
}

@media screen and (min-width: 768px) {
.slideWork .carousel-control-next {
top: 50%;
right: 0px;
}
}

.captionWork {
 top: -180px;
right: auto;
left: 0;
padding: 0 20px 10px 20px;
bottom: 0;
text-shadow: 0px 0px 0px;
color:#000;
}

@media screen and (min-width: 768px) {
.captionWork {
 top: -170px;
padding: 0 0px 10px 0px;
}
}

@media screen and (min-width: 1024px) {
.captionWork {
 top: -40px;
 padding: 0;
}
}

.carousel-inner .itemspace {
	margin-top:180px;
}

@media screen and (min-width: 768px) {
.carousel-inner .itemspace {
	margin-top:170px;
}
}

@media screen and (min-width: 1024px) {
.carousel-inner .itemspace {
	margin-top:40px;
}
}


.captionWork .box-title {
top: 0px;
left: 20px;
}

@media screen and (min-width: 768px) {
.captionWork .box-title {
left: 0px;
}
}

.captionWork .box-title h3 {
	font-family:'Roboto Condensed', sans-serif;
	font-size:16px;
	font-weight:normal;
	left:80px;
	top:17px;
	text-transform:uppercase;
		

}

.captionWork .box-title.box400 {
	width:400px;
}
.captionWork .box-title.box400 h3{
	left:18px;
}

.box-title.box400 #BOX-svg {
 width: 400px;
}

.box-title.box400 #BOX-svg rect {
    width: 400px;
}

.caption-txt{
	color:#000;
	text-align:justify;
	max-width:380px;
	font-family: 'Roboto',sans-serif;
	font-size:14px;
	line-height:22px;
	font-weight:100;
	letter-spacing:normal;
	margin-top:60px;
   
}

.col-m6-45{ width: 100%;}
@media screen and (min-width: 1024px) {
.col-m6-45{ width: 47%;}
}

.containerBlack{ 
position:relative; 
margin:70px 0px 70px 10px;
color:#FFF;
float: none;
}

@media screen and (min-width: 1024px) {
.containerBlack{ 
margin:70px 90px 70px 0px;
float:right;
}
}


.containerBlack h2{ 
font-family: 'Roboto Condensed', sans-serif;
font-weight: 200;
font-size: 52px;
line-height: 54px;
text-transform: uppercase;
margin-top: 0px;
}
.containerBlack h2 span{ 
font-weight: bold;
}

.rightWork{
	margin-top:-5%;
	padding-left:0px;
z-index:500;
}
.container-rightWork{
	padding:30px 15px 50px 15px; 
}
@media screen and (min-width: 1024px) {
.container-rightWork{
	padding:30px 0px 0px 45px; 
}
}

.container-rightWork h2{
	font-family: 'Oswald', sans-serif;
	font-size:90px;
	text-transform:uppercase;
	margin-bottom:30px;
}
@media screen and (min-width: 768px) {
.container-rightWork h2{
	font-size:150px;
}
}
@media screen and (min-width: 1024px) {
.container-rightWork h2{
	font-size:180px;
}
}


.box768 {
	border:solid 2px #000;
	padding:20px;
}

.box768 h3 {
    color: #000;
    text-transform: uppercase;
    padding: 0px;
    line-height: 20px;
    font-family: 'Roboto Condensed', san serif;
    font-size: 18px;
    margin-bottom: 10px;
}

@media screen and (min-width: 768px) {
.box768 h3 {
    line-height: 30px;
    font-size: 26px;
    margin-bottom: 20px;
}
}

.box768 p {
position: relative;
font-size: 12px;
color: #000;
letter-spacing: normal;
line-height: 18px;
padding: 0px;
margin: 0px;
font-weight: 100;
text-align: justify;
}

@media screen and (min-width: 768px) {
.box768 p {
font-size: 14px;
line-height: 22px;
}
}


#box2-svg.projectwork {
    width: 330px;
}

@media screen and (min-width: 768px) {
#box2-svg.projectwork {
    width: 480px;
}
}


.clientWork{
	padding:0; 
	clear:both; 
	padding-bottom:90px;

}


.clientWork .title-container {
    left: 0px;
	top:30px;
}

@media screen and (min-width: 1024px) {
.clientWork .title-container {
    left: 100px;
}
}


.clientWork  .titleone {
    position: absolute;
    left: 30px;
    bottom: 10px;
    font-size: 50px;
    line-height: 55px;
    color: #000;
    font-family: 'Roboto', sans-serif;
    font-weight: bold;
    letter-spacing: -2px;
}

.clientWork  .titleVertical {
    left: 30px;
	right:25px;
    top: 40px;
    font-size: 12px;
    line-height: 20px;
    text-transform: uppercase;
    font-weight: normal;
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: color 0.4s ease;
    -moz-transition: color 0.4s ease;
    -o-transition: color 0.4s ease;
    transition: color 0.4s ease;

}

.colWorkright{
  margin-top:0px;
  padding: 0 15px 0 15px;
}


@media screen and (min-width: 1024px) {
.colWorkright{
  margin-top:110px;
  padding:0;
}
}
.colWorkright p{
	color:#000;
	margin:0;
	max-width:550px;
}
.colWorkright h3{
	text-transform:uppercase;
	font-family:'Roboto Condensed', sans-serif;
	font-size:26px;
	line-height:34px;
	color:#000;
	margin:0;
	text-align:justify;
	width:100%;
}
@media screen and (min-width: 1024px) {
.colWorkright h3{
	max-width:450px;
}
}

/*----------------------------------
            PAGINA  CONTATTI
-------------------------------------*/

header.contatti {
	position:relative;
    width: 100%;
   /* height: 100%;*/	
	overflox-x: hidden;
    z-index:100;
	background-color:#FFF;
	min-height:980px;
}

@media screen and (min-width: 768px) {
header.contatti {height: 100%;	}
}

header.contatti .container-main{margin-top:0px;}

.over-header4{
	position:absolute; 
	top:0;
	width:100%;
	background-image:url(../images/contact/xo_contatti-bg.jpg);
  /*  background-attachment: fixed;*/
    background-repeat: no-repeat;	
    background-position: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
	min-height:980px;
	
}

@media screen and (min-width: 768px) {
.over-header4{height:100%;}
header.contatti .container-main{margin-top:150px;}
}

header.contatti .title-container {
    width: 250px;
    height: 380px;
	top:100px;
}
header.contatti.grazie .title-container {
    width: 280px;
}

@media screen and (min-width: 768px) {
header.contatti .title-container {
	 top: 0px;
	left:150px;}
}


header.contatti #box1-svg {
    position: relative;
    left: 0px;
    width: 250px;
    height: 380px;
}

header.contatti .titleone {
    position: absolute;
    left: 12px;
    bottom: 15px;
    font-size: 90px;
    color: #fff;
    font-family: 'Roboto', sans-serif;
    /*font-weight: bold;*/
    letter-spacing: -2px;
}

header.contatti h1 {
    font-family: 'Roboto Condensed', sans-serif;
    font-size: 30px;
	font-weight:100;
    color: #fff;
    line-height: 35px;
    margin-top: 520px;
    margin-left: 0px;
	text-transform:uppercase;
    -webkit-transition: 0.4s linear;
    -moz-transition: 0.4s linear;
    -o-transition: 0.4s linear;
    transition: 0.4s linear;
}

@media screen and (min-width: 768px) {
header.contatti h1 {
    margin-top: 430px;
    margin-left: 170px;
}
}



header.contatti h1 span {
	font-weight:bold;
	color:#fff;
}

.rect-contact-container{
	position:relative;
	margin-bottom:35px;
	margin-left:0px;
	height:50px;
}

@media screen and (min-width: 768px) {
.rect-contact-container{
	margin-left:60px;
}
}

.rect-contact-container a{ display:block;}

.rect-title-contact{
width: 350px;
color:#FFF;
top: 0;
padding: 5px 15px 0px 15px;
border-color:#FFF;
text-align:right;
font-size:16px;
}

.rect-title-contact.rectmail > ul> li {
	float:left;
	padding:10px 5px 0px 14px;
}

.rect-title-contact.rectmail > ul> li >a {
	font-size:16px;
	z-index:300;
	text-transform:none;
	 -webkit-transition: 0.4s linear;
    -moz-transition: 0.4s linear;
    -o-transition: 0.4s linear;
    transition: 0.4s linear;
}

.rect-title-contact.rectmail >  ul> li >a:hover {
	color:#00ccff;
}

a .rect-title-contact {
	color:#fff;
	-webkit-transition: background .4s linear;
    -moz-transition: background .4s linear;
	 transition: background 0.4s linear;
}
a:hover .rect-title-contact {
	color:#fff;
	background-color:#00ccff;
	border-color:#00ccff;
}

/*SECTION CONTACT*/
.sectionContact{
	z-index:200;
	background-color:#fff;
	/*margin-bottom:250px;*/
}



.form-contact{
	min-height:750px;
	position:relative;
	/*background:#f2f2f2 url('../images/contact/o.png') top left;*/
	background:#E1E1E1 url(../images/contact/o.png) no-repeat left top;
	/*background-color:#E1E1E1*/
}
.container-contact{
	max-width:650px;
	margin:0 auto;
	text-align:center;
	padding: 80px 15px 0 15px;
	color:#000;
}

@media screen and (min-width: 768px) {
.container-contact{
	padding: 80px 0 0 0;
}
}

.container-contact h2 {
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: 200;
    font-size: 52px;
    line-height: 54px;
    text-transform: uppercase;
    margin-top: 0px;
}

.container-contact h2 span { font-weight:bold;}

.container-contact p {
	color:#000;
	padding-bottom:50px;
	padding-left:15px;
	padding-right:15px;
	font-size:14px;
	font-weight:400;
	text-transform:uppercase;
	
}


@media screen and (min-width: 768px) {
.container-contact p {
	padding-left:0px;
	padding-right:0px;	
}
}



.container-form .input-name-container, .container-form .input-mail-container{
	width:48.46%;
	float:left;
	margin:0 20px 30px 0;
}
.container-form .input-mail-container{
	margin:0 0px 30px 0;
}
.container-form .input-message-container, .container-form .input-submit-container{
	width:100%;
	float:left;
	margin-bottom:30px;
}

.container-form input{
	width:100%;
	height:45px;
	border:1px solid #000;
	border-radius:0;
	padding:5px 10px 5px 10px;	
	font-family:'Roboto Condensed', sans-serif;
	font-size:18px;
	color:#000;
	background-color: transparent;
}
.container-form input.inputsubmit{
	color:#fff;
	background-color:#000;
	-webkit-transition: background .4s linear;
    -moz-transition: background .4s linear;
	 transition: background 0.4s linear;
}
.container-form input.inputsubmit:hover{
	color:#fff;
	background-color:#00ccff;
	border-color:#00ccff;
	-webkit-transition: background .4s linear;
    -moz-transition: background .4s linear;
	 transition: background 0.4s linear;
}
.container-form textarea{
	width:100%;
	height:100px;
	border:1px solid #000;
	border-radius:0;
	padding:5px;	
	font-family:'Roboto Condensed', sans-serif;
	font-size:18px;
	line-height:25px;
	font-weight:200;
	color:#000;
	background-color: transparent;
}

/*INFO*/
.container-info{ padding:0;}
.container-info .title-container{
	top:-50px;
	left:15px;}


@media screen and (min-width: 768px) {
.container-info .title-container{
	top:-50px;
	left:150px;}
}
	
.container-info .titleone {
	position:absolute;
	font-family: 'Roboto', sans-serif;
font-weight: 500;
letter-spacing: -5px;
    left: 25px;
    bottom: 0px;
    font-size: 100px;
    line-height: 112px;
}	

.container-info .title-info	 {
	margin-top:360px;
	margin-left:15px;
	max-width:300px;
}


@media screen and (min-width: 768px) {
.container-info .title-info	 {
	margin-top:360px;
	margin-left:150px;
	max-width:400px;
}	
}


.container-info .title-info	p{
	color:#000;
	text-align:justify;
	font-weight:400;
}

.box-relative{
	position:relative;
	float:none;
	margin:80px 0 0 15px;
}

@media screen and (min-width: 768px) {
.box-relative{
	position:relative;
	float:right;
	margin:80px 100px 0 0px;
}	
}

@media screen and (min-width: 1024px) {
.box-relative{
	position:relative;
	float:right;
	margin:80px 0 0 0px;
}	
}


.box-relative .txt h1 {
    font-size: 46px;
    color: #000;
    line-height: 52px;
	padding-top:30px;
}
.box-relative .txt h1 span{
	font-weight:bold;
	color:#000;
}
.btn-mail{
	position:relative;
	padding: 50px 0 80px 0px;
	margin-right:-60px;
	z-index:200;
}

.btn-mail .btnlink a {
	border-color:#000;
	color:#000;
}
.btn-mail .btnlink a:hover {
	color:#fff;
}

.right-info {
	margin-top:150px;
	margin-bottom:30px;
	z-index:100;
	padding:0;
}

.right-info .over-xo{
	left:20px;
	font-size:190px;

}


/*Mappa*/
.sectionMap{
	background-color:#fff;
	z-index:999;
}

#container-map{
width: 100%; 
height:500px;
top:0px; 
left:0;
position: relative;
z-index:999}

#map{
	width: 100%; 
	height:100%; 
	position:relative;
	z-index:999;}

/**/

.folioOnlyTraslate{
	margin-left:0px;
	 -webkit-transition:0.4s linear;
	-moz-transition:0.4s linear;
	-o-transition:0.4s linear;
	transition:0.4s linear;	
}

.folioOnlyTraslate.folio-traslate {
	margin-left:-300px;
	 -webkit-transition:0.4s linear;
	-moz-transition:0.4s linear;
	-o-transition:0.4s linear;
	transition:0.4s linear;	
}

/*-------------------------------
              VIDEO
---------------------------------*/
.header-video {
background-image: url(../images/video/video-bg.jpg);
background-position:top;
}

.headerTop-video{
	top:35%;
	left:25%
}

@media screen and (min-width: 1024px) {
.headerTop-video{
	top:25%;
	
}	
}





.sectionVideo {
width: 100%;
height:100%;
padding-top:70px;
/*background-image: url(../images/video/video-bg.jpg);
background-attachment: fixed;
background-repeat: no-repeat;
background-position: top;
-webkit-background-size: cover;
-moz-background-size: cover;
background-size: cover;
-o-background-size: cover;*/
}
.txtVideo h1 {
font-size:22px; 
margin:80px 0 0 0; 
font-weight:400;
}

.black-video {
padding:0px 0px 0px 0px;
 margin-bottom:120px; 
 margin-top:0px;
}

.linkyoutube {
	text-align:center;
	padding-bottom:90px;
}

.linkyoutube a{
	font-size:24px;
	color:#000;
	 -webkit-transition:0.4s linear;
	-moz-transition:0.4s linear;
	-o-transition:0.4s linear;
	transition:0.4s linear;	

}
.linkyoutube a:hover{
	color:#00ccff;
}
/**/
.bodyvideo {
	background-color:#000;
}

#video-container {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
/*  z-index: 10;*/
  overflow: hidden;
  background-color:1b1b1b;
}


video.videoV {
  width: 100%;
  height: 100%;
  margin:0;
  padding:0;
  
}



.videoFull {
	position:relative;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.img-dragger-small .slide #video-container{
/*width:12.5%;*/
position: absolute;
width: 100%;
height: 100%;
overflow: hidden;


}
.img-dragger-small .slide .videoFull{
position: absolute;
display: block;
width: calc(100% + 0.2px);
height: auto;

}

.video-title {
    font-size: 45px;
    line-height: 50px;
    font-weight: 100;
    margin-top: 140px;
    margin-left: 180px;
	color:#FFF;
}
.video-title span {
	font-weight:bold;
	color:#fff;
}

.btnYoutube{
	position:relative;
	float:right;
	margin-top:30px;
	margin-right:20px;	
	pointer-events:auto;
	z-index:999;
	display:none;
}

.btnYoutube a{
	padding:10px;
	background-color:#00ccff;
	-webkit-transition:0.4s linear;
	-moz-transition:0.4s linear;
	-o-transition:0.4s linear;
	transition:0.4s linear;	
}
.btnYoutube a:hover{
	-webkit-transition:0.4s linear;
	-moz-transition:0.4s linear;
	-o-transition:0.4s linear;
	transition:0.4s linear;	
	background-color:#000;
	
}
.slide.current .btnYoutube{
	display:block;
	position: absolute;
display: block;
left: 15%;
top: 54%;

}


.img-dragger-small .slide.current .btnYoutube{
	display:block;
	position:relative;
	float:right;
	margin-top:30px;
	margin-right:20px;	
	pointer-events:auto;
	left:0;
	top:0;
	z-index:999;

	
}
.videoYoutube{
	display:none
}

.videoYoutube.show{
	display: block;
}


/*VIDEO#2*/

.slick-slide h2 {
    font-size: 14px;
	text-transform:uppercase;
    padding-top: 1em;
    text-align: center;
    color: #000;
   -webkit-transition: color 0.3s, opacity 0.3s;
    transition: color 0.3s, opacity 0.3s;
}
.slick-slide h2:hover {
    color: #fff;
-webkit-animation-delay: 0s;
animation-delay: 0s;
-webkit-transition: color 0.3s, opacity 0.3s;
transition: color 0.3s, opacity 0.3s;
}
.slick-slide img {

}
.slick-slide img:hover {
	filter: grayscale(100%) contrast(1);
	-webkit-filter: grayscale(100%);
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
   mix-blend-mode: multiply;
}
.view {
    /*width: 300px;
    height: 200px;
    margin: 10px;*/
    float: left;
  /*  border: 10px solid #fff;*/
    overflow: hidden;
    position: relative;
    text-align: center;
  /*  box-shadow: 1px 1px 2px #e6e6e6;*/
    cursor: default;
   /* background: #fff url(../images/bgimg.jpg) no-repeat center center*/
   background-color:#00ccff;
}
.view .mask {
  /*  width: 400px;*/
   /* height: 200px;*/
   width:100%;
   height:100%;
    position: absolute;
    overflow: hidden;
    top: 0;
    left: 0;
	transition: all 0.5s linear;
    opacity: 0;
	
	
}
	
.view img {
    display: block;
    position: relative;
	transform: scaleY(1);
	transition: all 0.7s ease-in-out;
}
.view h2 { 
    position: relative;
    padding-bottom: 10px;
/*	border-bottom: 1px solid rgba(0, 0, 0, 0.3);*/
    background: transparent;
    margin: 20px 20px 0px 20px;
    transform: scale(0);
    color: #333;
    transition: all 0.5s linear;
    opacity: 0;
}

@media screen and (min-width: 768px) {
.view h2 { 
    padding-bottom: 0px;
    margin: 0px 20px 0px 20px;
}

}





.view p {  
    font-size: 12px;
    position: relative;   
    padding: 5px 20px 5px 20px;
	margin-top:0px;
    text-align: center;
	color: #000;
    opacity: 0;
    transform: scale(0);
    transition: all 0.5s linear;
}
.view a.info {
    display: inline-block;
    text-decoration: none;
    padding: 7px 14px;
    background: #000;
    color: #fff;
    text-transform: uppercase;
  /*  box-shadow: 0 0 1px #000;*/
	
	opacity: 0;
    transform: scale(0);
    transition: all 0.5s linear;
}
.view a.info:hover {
  /*  box-shadow: 0 0 5px #000*/

}


.view:hover img { 
	transform: scale(10);
    opacity: 0;
}
.view:hover .mask { 
	opacity: 1;
}																			 
.view:hover h2,
.view:hover p,
.view:hover a.info{ 
    transform: scale(1);
    opacity: 1;
}




/*.slick-slide .btnYoutube {
    display: block;
    position: relative;
    float: right;
    margin-top: 30px;
    margin-right: 20px;
    pointer-events: auto;
    left: 0;
    top: 0;
    z-index: 999;
}*/


/*MODAL VIDEO*/
.video-holder {
	position: relative;
/*	padding-bottom: 56.25%;*/
	padding-bottom: 80%;
 padding-top: 0px;
	height: 0;
	overflow: hidden;
	display: block;
}

.video-holder iframe, .video-holder object, .video-holder embed {
	position: absolute;	
	top: 0;	
	left: 0;
	width: 100%; 
	height: 100%;
}

.video-holder p { margin:0px !important; width:100% !important;}



.modal-body {
  position: relative;
  padding: 0px;
}

.modal-content {
	margin-top:20%;
  position: relative;
  background-color: #000; 
  color:#FFF; 
  font-size:10px;
  background-clip: padding-box;
  border:none;
  border-radius:0px;
  outline: none;
  -webkit-box-shadow: none;
          box-shadow: none;
}


.modal.fade .modal-dialog {
  -webkit-transition: -webkit-transform 0.3s ease-out;
     -moz-transition: -moz-transform 0.3s ease-out;
       -o-transition: -o-transform 0.3s ease-out;
          transition: transform 0.3s ease-out;
}

.modal.in .modal-dialog {

}

.modal-header {
  min-height: 16.428571429px;
  padding: 8px;
  border-bottom: none;
 
}

.modal-title {
  margin: 0;
font-size:28px; 
color:#00ccff;
}


.close {
  float: right;
  font-size: 50px;
  font-weight: 100;
  line-height: 1;
  color: #fff;
  text-shadow:none;
  filter: alpha(opacity=20);
  opacity: 0.8;
}
.close:hover {
  color: #00ccff;
  opacity: 1;
}	
	.modal-backdrop {
    opacity: 1 !important;
    filter: Alpha(opacity=100); /* IE8 and earlier */
   
   
}
/*---------------------------------------
             BLOG UNDER COSTRUCTION
----------------------------------------*/
#blog{ 
background-color:#fff;  
height:100%;   
}


.blogsection{
position:relative;
background-color:#FFF;
margin-bottom:550px;
height:100%;
z-index:400;
background-image:url(../images/blog/blog-bg.jpg);
 background-repeat: no-repeat;
 background-attachment: fixed;	
    background-position: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}
@media screen and (min-width: 768px) {
.blogsection{ margin-bottom:250px;}
}


.blogcontainer{ 
padding:0;
}

.middle {
    position: absolute;
    top: 32%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
	color:#000;
}

hr {
    margin: auto;
    width: 40%;
	margin-top:50px;
	border-top: 1px solid #000;
}

.middle h1{ 
font-size: 48px;
line-height: 50px;
}

.middle p{
	font-size:24px;
	color:#000;
}



/*---------------------------------------
            PRESS
----------------------------------------*/
#press{ 
background-color:#fff;  
/*height:100%; */  
}


.press-section{
position:relative;
background-color:#FFF;
/*margin-bottom:550px;*/
/*height:100%;*/
z-index:400;
background-image:url(../images/press/press-bg.jpg);
 background-repeat: no-repeat;
 background-attachment: fixed;	
    background-position: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}
@media screen and (min-width: 768px) {
/*.press-section{ margin-bottom:250px;}*/
}


.presscontainer{
	max-width:1400px;
	padding:0;
}

.press-container{
	margin-top:120px;
}

@media screen and (min-width: 768px) {
.press-container{margin-top:160px;}
}


.press-container h1{font-size:40px;}
.press-container h2{margin-bottom:25px;}

.press-container h2 a{ 
color:#000;
 -webkit-transition:0.4s linear;
	-moz-transition:0.4s linear;
	-o-transition:0.4s linear;
	transition:0.4s linear;	
}
.press-container h2 a:hover{ 
color:#fff;
 -webkit-transition:0.4s linear;
	-moz-transition:0.4s linear;
	-o-transition:0.4s linear;
	transition:0.4s linear;	
}

.presscell{ padding:2px 2px 50px 2px; }

@media screen and (min-width: 1024px) {
.presscell{ padding:2px; }
}

.presscell .box2{
	position:relative;
	left:0;
	bottom:0;
	width:auto;
	height:auto;
}

/*---------------------------------------
            PRIVACY
----------------------------------------*/
#privacy{ 
background-color:#fff;  
/*height:100%;*/   
}


.privacy-section{
position:relative;
background-color:#FFF;

/*height:100%;*/
z-index:400;
background-image:url(../images/video/video-bg.jpg);
 background-repeat: no-repeat;
 background-attachment: fixed;	
    background-position: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}
@media screen and (min-width: 768px) {

}


.container-privacy{
	max-width:1400px;
	padding:0;
}

.privacy-container{
	margin-top:80px;
	padding:20px 30px 30px 30px;
}

@media screen and (min-width: 768px) {
.privacy-container{margin-top:140px;}
}

.privacy-container h2{
	font-size:26px; 
	margin-bottom:20px;
	margin-top:10px;}
.privacy-container p{
	color:#000;
	line-height:24px;
	margin:0 0 15px 0px;
	}

.privacy-container strong{
	font-weight:600;
	}
	
	.privacy-container a{
		font-size:13px;
		color:#000;
	}
	.privacy-container a:hover{
		color:#00ccff;
	}

/*----------------------------------------------*/


.clearfix::after, .clearfix::before {
    content: "\0020";
    display: block;
    height: 0;
    visibility: hidden;
}
/*.section-main */.section-wrap {
    padding-left: 220px;
    padding-top: 100px;
    padding-bottom: 140px; background-color:#0F0;
}






/**/


* {
  box-sizing: border-box;
}

.boxabout {
  width: 200px;
  height: 200px;
  margin: 50px auto;
  padding-top: 75px;
  background: #ccc;
  text-align: center;
  color: #FFF;
  font-size: 3em;
}



















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