﻿@import url("//hello.myfonts.net/count/3021fc");
@font-face {font-family: 'FuturaBT-Light'; src: url('fonts/3021FC_0_0.eot');src: url('fonts/3021FC_0_0.eot?#iefix') format('embedded-opentype'),url('fonts/3021FC_0_0.woff2') format('woff2'),url('fonts/3021FC_0_0.woff') format('woff'), url('fonts/3021FC_0_0.ttf') format('truetype');           }
@font-face {font-family: 'FuturaBT-Book'; src: url('fonts/3021FC_1_0.eot');src: url('fonts/3021FC_1_0.eot?#iefix') format('embedded-opentype'), url('fonts/3021FC_1_0.woff2') format('woff2'), url('fonts/3021FC_1_0.woff') format('woff'), url('fonts/3021FC_1_0.ttf') format('truetype');}
@font-face {font-family: 'FuturaBT-Bold'; src: url('fonts/3021FC_2_0.eot');src: url('fonts/3021FC_2_0.eot?#iefix') format('embedded-opentype'), url('fonts/3021FC_2_0.woff2') format('woff2'), url('fonts/3021FC_2_0.woff') format('woff'), url('fonts/3021FC_2_0.ttf') format('truetype');}
.futuraLight {font-family: 'FuturaBT-Light';}
.futuraBook {font-family: 'FuturaBT-Book';}
.futuraBold {font-family: 'FuturaBT-Bold';}
.Roboto  {font-family: 'Roboto', sans-serif;}
body {font:normal 14px Source Sans Pro;color:#000;}
.bkgGray{background-color:#E0E0E0;}
a {color:Black; text-decoration: none; }
a:link, a:visited {color:Black; text-decoration: none; }
a:hover, a:active {color:Gray; text-decoration: none;  }
.clear {clear:both;}
.right {float:right;}
.left {float:left;}
.margin-t15 {margin-top:15px;}
.margin-b15 {margin-bottom:15px;}
.margin-r20 {margin-right:20px;}
.margin-l20 {margin-left:20px;}
.t10 {margin-top:10px;}
.t20 {margin-top:20px;}
.r-10 {margin-right:-10px;}
.r10  {margin-right:10px;}
.l-10 {margin-left:-10px;}
.l10  {margin-left:10px;}
.r20  {margin-right:20px;}
.l20  {margin-left:20px;}
.b10  {margin-bottom:10px;}
.b25  {margin-bottom:25px;}
.b40  {margin-bottom:40px;}
.b60  {margin-bottom:60px;}

.bottone {  background-color: #efecec; /* Green 4CAF50 */
  border: none;
  color: white;
  padding: 16px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 4px 2px;
  -webkit-transition-duration: 0.4s; /* Safari */
  transition-duration: 0.4s;
  cursor: pointer;
  }
  
.button1 {
  background-color: #efecec; 
  color: black; 
  border: 2px solid #efecec; /* Green 4CAF50 */
  margin-bottom: 40px;
}

.button1:hover {
  background-color: #999;
  
}

.bottone p {margin:0!important;}
.bottone a:hover {color: #FFF;}

/* ----- COOKIES ----- */
#cookieChoiceInfo 
{ background-color: #000!important;
  padding:30px!important;
  color:#FFF!important;
  text-align:left!important;
  opacity: 0.85;
   letter-spacing: 0.5px;
     }
     
#cookieChoiceInfo a:link, 
#cookieChoiceInfo a:visited 
{
    color:#FFF!important;
    font-weight: 200;
    letter-spacing: 1px;
    word-spacing: 2px;
    border-bottom: 1px solid #FFF;
    transition: border-bottom 0.2s, color 0.2s;
    }
    
#cookieChoiceInfo a:hover, 
#cookieChoiceInfo a:active {
    color:#008b3a!important; 
   font-weight: 200;
    border-bottom: 1px solid #008b3a;
    }    

#cookieChoiceDismiss {
    margin-left: 16px!important;
    }    
     
/* ----- END COOKIES ----- */


.col-half-offset{
    margin-left:4.166666667%
}

li { margin-bottom:10px; font-size:16px;}

h1, h2, h6 {margin-top:0px;color: #000;}
.banner {margin-left:auto; margin-right:auto;}
h1 {font-size:26pt;}
h3 {font-size:23pt; font-weight:200; }
p {font-size:12pt;}

#logindisplay p {color:#FFF;}
#logindisplay a:link, #logindisplay a:visited {color:White;}
#logindisplay a:hover {color:#008b3a;} 

#cookieChoiceInfo {top:auto!important;bottom:0%!important;} /**/

#NewsContent a:link {text-decoration:underline!important;}
#NewsContent h2  {font-size: 20px;font-style:italic;margin-bottom: 20px;}

.centroimg {margin: 0, auto}

.link a						{  color:#000; text-decoration: none; font-weight: bold; }
a.link:link, a.link:visited {  color:#000; text-decoration: none; font-weight: bold;}
a.link:hover, a.link:active {  color:Gray; text-decoration: none; font-weight: bold;}

.linkGreen a						{  color:#008b3a; text-decoration: none; font-weight: bold; }
a.linkGreen:link, a.linkGreen:visited {  color:#008b3a; text-decoration: none; font-weight: bold;}
a.linkGreen:hover, a.linkGreen:active {  color:Gray; text-decoration: none; font-weight: bold;}

.titolo {min-height:20px; background-color:white;} /*e nel responsive centrato*/
.titoloSol1 {min-height:56px;}
.titoloSol2 {min-height:45px;}

.titoloSolDec {} /* solo nel responsive */
.descr {max-width:168px;} /*per descr texture in subsoluzioni*/

.boxSpazi p {min-height:150px;}

.descrFoto {min-height:80px;} /*in rassegna stampa: per corretta visual descrizioni foto di diversa lunghezza */

.highlightsSX {color:#000;font-size:22px;float:left;line-height:30px;}/*OK*/
.highlightsDX {font-size:20px; font-weight:500;float:right;line-height:30px;}/*OK*/

.highlightsBOX {margin-bottom:10px;padding:20px;min-height:70px;border: 1px solid #008b3a;}
.highlightsBOXGray {margin-bottom:10px;padding:10px 10px 25px 10px;background-color:#f2f2f2;}

.highlightsBOXForm {background-color:#008b3a;min-height:50px;color:#FFF;font-size:22px; padding:10px; border: 1px solid #008b3a;}
.highlightsBOXForm .highlightsSX {color:black;font-size:22px;float:left;line-height:30px;}/*OK*/
.highlightsBOXForm .highlightsDX {color:black;font-size:20px; font-weight:500;float:right;line-height:30px; font-weight:bold;}/*OK*/
.highlightsCompila {background-color:#CCCCCC; min-height:50px;color:#FFF;font-size:22px; padding:10px;}

.pinterestRef p {min-height:50px;font-weight:bold!important;}
 
/*per layout a 5 colonne e padding minimo anche per quelle a 6 */
.paddingMinimo .col-sm-2 {padding-right: 3px!important;padding-left: 3px!important;} /*pagina Salone, poco spazio fra i box di img*/
.paddingMinimo { margin-left: -18px!important; margin-right: -18px!important;}
#demo-12-col, #demo-12-col-2riga {width:auto; margin-left: -18px!important; margin-right: -18px!important;}
.col-xs-2 { background: white; height:100%;}
.col-xs-15{ width:20%;}
.paddingMinimo .col-xs-12, 
.paddingMinimo .col-xs-2,
.paddingMinimo .col-xs-15 { padding-right: 3px!important;padding-left: 3px!important;}

.elenco h6 {font-weight:bold!important;padding-top:5px; font-size:16px!important; max-width:260px!important;min-height:80px; }
.elenco .col-sm-4  {padding-bottom:40px;}
.elenco h5 {margin:10px 0 20px 0px;} /*messo 0 SX per rassegna stampa. verificare se presente in altre parti*/
.separator {margin-top:10px;margin-bottom:10px;}
.separator hr {margin-left:15px; margin-right:15px;}

/*15.01*/
.filtro {width:100%; border:1px solid #ddd; border-radius: 4px; padding:8px;}
.ispirazioni .btn-default { border-color:transparent;}
.grid-item { width: 200px; }
.grid-item--width2 { width: 400px;}

/*fine 15.01*/
/*      background-size: 100%;         }*/
  
 .buttonform  {background-color:#339933;padding:10px;margin-bottom:10px;}
 a.buttonform:hover {color:White;}
    
.bgimage-inside {
padding-top: 112.93%; /* this is actually (262*100)/202) */
}
#box1, #box5{
/*max-width: 100%;*/
min-height: 262px;
background-size: contain;
}
#box2, #box7 {
/*max-width: 100%;*/
min-height: 262px;
background-size: contain;
}
#box3, #box6 {
/*max-width: 100%;*/
min-height: 262px;
background-size: contain;
}
#box4, #box8 {
/*max-width: 100%;*/
min-height: 262px;
background-size: contain;
}

.boxNews 
{
    min-height: 262px;
background-size: contain;}

.boxGreen {min-height: 320px;
background-size: contain;}

.box h3 { color:White; font-size:20px;            
              padding: 10px 5px 10px 10px;
              margin:0 0 10px 0;
            }    
.box p  { color:White;
              padding:0 5px;
              margin:10px 0 10px 5px;
              max-width:360px;
            } 

.boxGreen h4  { text-transform:uppercase; 
     color:#008b3a;font-size:34px;text-align:center;
     line-height:48px;
     padding: 30px 10px 10px 10px;margin:0;
     }

.boxNews h4    { text-transform:uppercase;
     color:White;font-size:16px;
     padding: 10px 0 10px 10px;margin:0;
     }
     
     
 .boxNews h4 a:link, .boxNews h4 a:visited  { color:White;  }  
 
 .fuorisalone h4     
 {
     font-size:16px;
     min-height:30pt;
     
     } 
     
.biennale h4     
 {
     font-size:16pt;
    
     
     }  

.boxNews h3 { color:White; font-size:20px;            
              padding: 10px 5px 10px 10px;
              margin:0 0 10px 0;
            }    
.boxNews p  { color:White;
              padding:0 5px;
              margin:10px 0 10px 5px;
              max-width:262px;
            }     
.date {color:White;font-size:14px;padding:20px 0 0 10px!important;margin:0!important;}    
 
div.ok-target{
    height:110px;/*105*/
    width:110px;
    overflow:hidden;
    border-radius:50%;
    border-width: 5px;
    border-style: solid;
    border-color: white;
    text-align:center;
    vertical-align:middle;
    display: inline-block;
    font-size:15px;
    line-height:18px;
    font-family: Source Sans Pro;
    margin:20px 60px 20px 0;
    color:White;
    }
    
div.ok-target-selected{
    color:#000;
    font-weight:bold;  
    background-color: #FFF; 	
    filter: alpha(opacity=75); -moz-opacity:.75; opacity:.75;
}

/*a.menu-link:link, a.menu-link:visited {color:white;} */
div.ok-target:hover{ 
    color:Black;
    font-weight:bold;  
    background-color: #FFF; 	
    filter: alpha(opacity=75); -moz-opacity:.75; opacity:.75;
}
div.ok-target:hover a:visited{color:black!important; }

div.ok-target a:link{color:white;}
div.ok-target a:visited{color:white;}
div.ok-target a:hover{color:black!important;}
div.ok-target-selected a:link, div.ok-target-selected a:visited{color:black!important;}


div.ok-target div 
{
  display: table-cell;
  vertical-align: middle;  
  text-align: center;
  height:96px; /*metto 96 per centrare allineamento*/
  width:110px;
}
#oikos-targets 
{
    position:absolute;
    z-index:900;       
    margin-left:-24.5%;
    left:50%;
    bottom:15px;
    
}
.bkg-menu {background-color: rgba(0,0,0,0.75);
           color:White!important;
           font-size:16px;
           font-family: Source Sans Pro;
           }

.nav li {vertical-align: bottom; }
.nav>li>a {padding:10px 10px;}

.footer {background:black; margin-top:100px;padding-top:40px;}
.col {width:12.5%;float:left; COLOR:White;border:0px solid red;}
.col-sub {width:12.5%;float:left; COLOR:#7d7d8b; font-size:11px;margin-top:15px;line-height:20px;}
.footer h4 {COLOR:#FFF;font-size:18px; line-height: 30.6px;  }

.banner-caption {
position: absolute;
z-index: 10;
top: 100px;/*bottom:50%; originale*/
width:100%; 
text-align: center;
text-shadow: 0 1px 2px rgba(0,0,0,.6);
opacity: 0.9;
background-color:transparent;/*yellow*/
 
}


/* override stili*/
.carousel-caption {top:82%;} 
.navbar-wrapper .navbar .container {width:auto;                 
    
    }
    a.dropdown-toggle
    {color:White;        }
    
    .nav .open>a, .nav .open>a:focus, .nav .open>a:hover {
    background-color: #000;
    border-color: #000;
}
.nav>li>a:focus, .nav>li>a:hover {
    text-decoration: none;
    background-color: #000;
 
}

.navbar-brand {padding: 60px 0 0 0;
               margin-top:-8px;} /*x allineamento logo*/
               
.navbar-brand-resty {padding: 60px 0 0 0;
               margin-top:-8px;}           
 
.dropdown-menu {background-color:black;border-width:0px;min-width:0;font-family: Source Sans Pro;text-align:center;
                padding:0px 0px; /*anziche 5 0 -  bordino finale dropdownmenu*/
                 /*per larghezza giusta tendina anche nelle lingue diverse da IT*/
                }
.dropdown-menu>li>a {color:#FFF; text-align:center;line-height:30px;font-size:14.5px;}/*15 anziche 16 per fare stare su 1 riga menu*/


.navbar-nav a {color:white; text-align:center;}
.navbar-nav a.green {color:#008b3a;}
.navbar-nav>li>a {font-family: FuturaBT-Book, Source Sans Pro; font-weight:normal;} 

.menurestyling>li>a { margin:0 15px;} 

.dropdown>button:hover {background-color:red;}

.lang .dropdown-menu>li>a {background-color:black;color:#c7c7d6;text-align:center;}
.lang .dropdown-menu>li>a:hover {background-color:white;color:#000;}

.footer .dropdown-menu>li>a {background-color:black;color:#FFF;text-align:left;}

.footer {font-size:16px;}
.footer ul li {list-style:none; margin:0;}
.footer ul {margin:10px 5px 0 0; padding:0;}
.footer-submenu>li>a, .footer-submenu {color:#7d7d8b!important; font-size:11px;line-height:20px;}

 /*font */
 .f16 {font-size:16px;} 
 .f18 {font-size:18px;} 
 .f20 {font-size:20px;} 
 .f22 {font-size:22px;} 
 .f24 {font-size:24px;} 
 .f34 {font-size:34px;} 
 .f30 {font-size:30px;}   
 .f42 {font-size:42px;}    
 .f100 {font-size:100px;}   
 .lh34 {line-height:34px;}
 
 .container h5  {font-family: 'Source Sans Pro' !important;font-weight:700; font-size:22px;color:#222; }
 .container h6 {font:normal 18px Source Sans Pro;color:#000000;line-height:20.9px;}
 .container h7 {font:normal 11pt Source Sans Pro;color:#a2a2b5; line-height: 1.2; min-height: 45px;} /*dida CC*/
  .level4 h6 {font:normal 18px Source Sans Pro;color:#a2a2b5;line-height:20.9px; font-weight:bold;}
 /*.container i {color:#8d8d96;} */
 
 .col i {margin-right:20px;float:left;margin-top:10px;} /*lente del footer*/
 .footer .col h4, .footer .dropdown {font:normal 18px Source Sans Pro;color:#FFF;line-height:21.6px;}

.row { /*per filo dei margini delle righe sotto, dentro container con lo slider -ex 15/15- */
    margin-right: -30px;
    margin-left: -30px;
}
 
.tag {color: #999;}
a.linkGray:link {color:#999;}
a.linkGray:visited {color:#999;}
a.linkGray:hover {color:#999;}

.spallaDXdett     { padding-left: 100px;} 


.social-maestridecoratori {width:100%;list-style:none;margin:30px 0 10px 0;padding:0 0 10px 0;}
.social-maestridecoratori>li>a {float:left; margin-right:15px;margin-bottom:15px;}
 
#cerca h6 {min-height: 100px;} 
.inputCerca {width:40%;}

#elencoNews h6 {min-height:80px;}

/* per parallasse  */
#slide1 {
 
	background-image:url('img/sfondoR.png');
	background-color:#fff;
	background-repeat: no-repeat;
	-webkit-background-size: cover;
	background-size: cover;
	background-attachment: fixed;
	height: 100%;
	width: 100%;
}
 
 
.sharethis-inline-share-buttons { margin-bottom:40px;}

/*3 box spot video home page*/
.box1-3 {padding-left:0px!important;padding-right:5px!important;}
.box2-3 {padding-left:5px!important;padding-right:5px!important;}
.box3-3 {padding-left:10px!important;padding-right:0px!important;}


.titoliformat {min-height:65px; }


/* Small devices  */
@media (max-width: 768px)     {
    
     }
     
@media (min-width:768px)    
{	/*sistemare questa classe, vedi /it/target/maestrodecoratore bottom:520px;*/
	/*.banner-caption {right: 20%;left: 20%; }*/
	
     .container { max-width: 1140px;  
                 /* height: 100px;no altezza fissa*/
                /*   padding-top:49px; per alzare menu header*/
                 }
     
.navbar-nav>li>a {margin-top: 30px;
padding-bottom:0;

line-height:30px;
padding:5px
}/*allineamento in basso menu Header. centrato vertical. sarebbe stato padding-top:0;line-height:40px */

                        
   .footer { max-width  :1920px;
             margin:auto;
             padding-bottom:40px;}
             
    .navbar-nav { /*max-height:100px; per fare menu a filo del logo*/
                  margin-left:15px;/*per allineamento dopo restyling*/
                  }         
     
     }
   
   .

   
/*
    MODIFICA IL MENU IN ALTO: Apertura sull'hover e non al click
    */
ul.nav li.dropdown:hover > ul.dropdown-menu {
    display: block;    
}


/*  PINTEREST LAYOUT */
#wrapper {
	width: 90%;
	max-width: 1100px;
	min-width: 800px;
	margin: 50px auto;
}

#columns {
	-webkit-column-count: 3;
	-webkit-column-gap: 10px;
	-webkit-column-fill: auto;
	-moz-column-count: 3;
	-moz-column-gap: 10px;
	-moz-column-fill: auto;
	column-count: 3;
	column-gap: 15px;
	column-fill: auto;
}

.pin {
       display: inline-block;
       background: #FEFEFE;
       /*border: 2px solid #FAFAFA;
       box-shadow: 0 1px 2px rgba(34, 25, 25, 0.4);
       margin: 0 2px 15px;
       -webkit-column-break-inside: avoid;
       -moz-column-break-inside: avoid;*/
       column-break-inside: avoid;
       padding: 5px;
       padding-bottom: 5px;
       background: -webkit-linear-gradient(45deg, #FFF, #F9F9F9);
       opacity: 1;
       -webkit-transition: all .2s ease;
       -moz-transition: all .2s ease;
       -o-transition: all .2s ease;
       transition: all .2s ease;
         cursor: hand;
}

.pin img {
       width: 100%;
       border-bottom: 0px solid #ccc;
       padding-bottom: 5px;
       margin-bottom: 0px;
       /*padding-bottom: 15px;
       margin-bottom: 5px;*/
       cursor: hand;
}

.pin p {
       font: normal 14px Source Sans Pro; 
       color: #000;
       margin: 0;
} 


@media (min-width: 960px) {
	#columns {
		-webkit-column-count: 3;
		-moz-column-count: 3;
		column-count: 3;
	}
.pinterestRef #columns {
		-webkit-column-count: 5;
		-moz-column-count: 5;
		column-count: 5;
	}	
	
}

@media (min-width: 1100px) {
	.pinterestRef #columns {
		-webkit-column-count: 5;
		-moz-column-count: 5;
		column-count: 5;
	}
	
	#columns {
		-webkit-column-count: 4;
		-moz-column-count: 4;
		column-count: 4;
	}	
}

#columns:hover .pin:not(:hover) {
	opacity: 0.4;
}

.input-validation-error {border:1px solid red;}
.field-validation-error {color:#ff0000;}


/* RESPONSIVE: il menu sui dispositivi stretti usa il click e non l'hover*/
@media (min-width: 979px) 
{
      
  ul.nav li.dropdown:hover > ul.dropdown-menu {
    display: block;
  }
}


/* MULTICOLUMN */
@media (min-width: 979px) {
    .multicolumn {
      -webkit-column-count: 3;
      -moz-column-count: 3;
      column-count: 3;
      -webkit-column-gap: 3em;
      -moz-column-gap: 3em;
      column-gap: 3em;
    }
  }

@media (max-width: 979px) {
  .multicolumn {
    -webkit-column-count: 1;
    -moz-column-count: 1;
    column-count: 1;
    -webkit-column-gap: 3em;
    -moz-column-gap: 3em;
    column-gap: 3em;
  }
  


  
}


/* Modifiche per layout responsive*/


.dropdown-menu > li > a {
    padding: 3px 10px;
}

.carousel-inner > .item {
    max-width: 100%;
}

.boxes h6 {
   margin-top:10px;
   font-weight:bold; 
           
}

.oikos {
    left: -2px;
     width: 194px;
}

.cosafacciamo {
    left: -2px;
     width: 190px;
}

.dovesiamo {
    left: -0px;
    width: 134px;
}

.socialmenu {
    left: -0px;
}

.loginmenu {
    left: -0px;
    width: 120px; /*se c'è il cerca login width -> 112px*/
}

.languagemenu {
    left: 0px;
     width: 52px;
}

.profilomenu {
    left: 0px;
     width: 164px;
}

.menu_azienda {
    width: 134px;    
}
.menu_prodotti {
    width: 134px;    
}
.menu_cosafacciamo {
    width: 163px;
}

.menu_dovesiamo {
    width: 134px;
}

.menu_language {
    width: 52px;
}

.menu_login {
    width: 102px;
}
 

.menu_oikos {
    width: 134px; /*.194*/
}
.menu_profilo {
    width: 134px; /*.174*/
}



.newsletter .box {
    max-width: 360px;
    max-height: 320px;
    min-height: 320px;
}

/*.banner-caption h2 {
    position: absolute;
    bottom: 15px;
    left:calc(50% - 450px)
}*/

/*retyling*/



@media only screen and (max-width: 1200px) and (min-width: 768px) /*media ris tipo IPAD*/
{
.biennale h4  {font-size:12pt;}
.titoliformat {margin-bottom:0px; color:black;font-size:25px;}   
.titolo {min-height:38px;margin-bottom:0px;} /*titoli location salone in home*/
#oikos-targets {margin-left: -32.5%; /*background-color:purple;*/ } 
.descr {font-size: 17px!important; max-width:98px;}  
.txt {font-size: 16px!important;}
.highlightsSX, .highlightsDX {font-size:16px!important;line-height:26px;}/*OK*/     
.container h5 {font-size:15pt; min-height:16pt; /* risolto problema scalino titoli home nella visualizzazione media */ }
.container h6 {font-size:12pt;}  /* risolto problema scalino titoli qui it/home/milanodesignweek  */ 
.navbar-nav>li>a {margin:10px 7px!important;font-size:10pt;line-height:15px;}
.navbar-nav>li {margin-bottom:0px!important;}
}


@media only screen and (max-width: 991px) and (min-width: 768px) { /*medio piccola tipo Ipad*/
.titoliformat {margin-bottom:0px; color:black;font-size:18px;} 
.container h5 {font-size:14px!important;}
.container h6 {font-size:16px!important;}
.navbar-brand {margin-top:0px!important;padding-top:0px!important;border: 0px solid red;} 
.navbar-brand-resty {margin-top:0px!important;padding-top:0px!important;border: 0px solid red;}   
#IframeCromatici {width:750px; border:0px solid red; background:black;}

.titoloSol1 {font-size:22px!important; min-height:49px;}
.titoloSol2 {font-size:16px!important; min-height:49px;}
.newsletter .box {
    max-height: 206px;
    max-width: 360px;
    min-height: 201px;
}

.boxes h3 {
padding-top: 0 !important;
 
}

.box h3 {
color: White;
font-size: 20px;
height: 126px;
margin: 0 0 10px;
padding: 14px 5px 10px 10px;
}

.banner-caption {
bottom: 25%;
 
}

.banner-caption h2 {
font-size: 20px;
}
         
.profilomenu {
left: 0px;
}
 
.menu_profilo {
width: 174px;
}
.menu_login {
width: 120px; 
}

}

@media only screen and (max-width: 1399px) and (min-width: 1200px) 
{
#oikos-targets {margin-left: -32.5%; }
}


@media only screen and (max-width: 1199px) and (min-width: 992px) { /*media*/
#oikos-targets { margin-left: -32.5%; }
div.ok-target {
margin: 20px 40px 20px 0;
border-width: 4px;
}
#IframeCromatici {width:970px; border:0px solid green;}
.newsletter .box {
    max-height: 270px;
    max-width: 360px;
    min-height: 270px;
}

.oikos {
    left: -55px;
}

.banner-caption {
   bottom: 50%;
    }

   .banner-caption h2 {
     font-size: 25px;
     background-color:transparent;/*violet*/
     top:80px;
     max-width: 100%!important;
   }


    
.profilomenu {
    left: -30px;
}
    
.menu_oikos {
    width: 88px;
}
.menu_profilo {
    width: 120px;
}

}

@media only screen and (max-width: 767px) { /*solo nel piccolo*/

.descrFoto {min-height: 0;}                             
                                            
.box1-3 {padding-left:0px!important;padding-right:5px!important;}
.box2-3 {padding-left:0px!important;padding-right:5px!important;}
.box3-3 {padding-left:0px!important;padding-right:5px!important;}
                                           
                                             
.titoliformat {min-height:62px!important;margin-bottom:0px; color:black;font-size:14px;text-align:left;font-weight:bold; text-transform:uppercase;} 
.carousel-caption h2 {font-size: 14px;}

.carousel-caption .futuraBold {font-size: 6px!important;}
  
#demo-12-col, #demo-12-col-2riga {margin: 0 auto!important;}
.spallaDXdett     { padding-left: 0px!important;}
                                            
.pinterestRef #columns {
		-webkit-column-count: 2;
		-moz-column-count: 2;
		column-count: 2;
	}	
	
.highlightsBOXGray  {
    /*margin: auto;*/ padding: 0 10px;
    float:left;
    width: 100%;}
    
.boxes #highlightsBOX, .boxes #highlightsBOXGray {  padding-bottom: 0px!important;}	
.highlightsBOX, highlightsBOXGray {
 min-height: 100px;
 padding:10px;
 border: 0px solid #008b3a!important;	
}
.highlightsSX { margin: 5px auto;   font-size: 18px; }


.highlightsBOXForm {background:#eaeaea;color:#FFF;font-size:12pt;padding:7px;float:left; border: 0px solid black;}
.highlightsBOXForm .highlightsSX {color:black;font-size:25px;float:left;line-height:25px;padding:0 10px 5px 10px;word-spacing:1px;letter-spacing:1px;}/*OK*/
.highlightsBOXForm .highlightsDX {color:black;font-size:18px;float:left;line-height:20px; padding:0 10px 10px 10px;}/*OK*/
.highlightsCompila {background:#c4e7d3;color:#000000;font-size:12pt;padding:10px 0 10px 10px;margin:0;min-height:40px;}
 .iconaTxtRientrante {display: block;
  float: left;
  font-weight: bold;
  font-size: 1.3em;
  line-height: 1.0em;
  color: black;
  margin: 0px 5px 0 0;
  }

.highlightsDX {
margin-left: auto;
margin-right: auto;
font-size: 16px;   
float: left;
}
    
.inputForm, .text-area, .container2field   {width:100%!important;}  
fieldset { margin: 0 0 10px 0} 

                                              
#oikos-targets {margin-left: -32.5%; background-color:blue;}
h5, h2 {max-width:360px; text-align:center;margin:auto!important;}
.boxSpazi p {min-height:150px;}
.titoloSolDec, .titolo  {text-align:center;} /*titolo centrato resp*/
.titoloSol1 {min-height:0; margin-top:20px;}
.titoloSol2 {min-height:0; margin-top:20px;}
  
  
.elenco .col-xs-12 {margin:auto!important;float:none!important;padding-bottom:10px;max-width:260px;}       
.boxes h5 { text-align: center;padding-bottom:5px;padding-top: 20px; font-size: 14pt;}
.boxes .newsletter h3:nth-child(1) {padding-top: 88px !important;}

.boxes .col-xs-12 {
    float: none;
   /*padding-bottom: 50px;*/
    margin: 0 auto;
    max-width: 360px;
    width: 100%;
    
 
}

.boxes .col-xs-12.banner {
        padding-bottom: 0px!important;
        
    }
.boxes .col-xs-12.pageNews {
        padding-bottom: 20px;
    }
 
.lavoraconnoi h2 { padding-bottom:5px;padding-top: 20px; font-size: 20pt;text-align:left;} 
    
.menu_cosafacciamo {
    width: 100%;
}

.menu_dovesiamo {
   width: 100%;
}

.menu_language {
   width: 100%;
}

.menu_login {
   width: 100%;
}

.menu_social {
    width: 100%;
}

.menu_oikos {
    width: 100%;
}
.menu_profilo {
  width: 100%;
}

.boxNews {
    background-size: contain;
    margin: 0 auto;
    min-height: 262px;
   /* width: 250px;*/
}
.boxGreen {
    background-size: contain;
    margin: 0 auto;
    min-height: 320px;
    width: 360px;
}

#NewsContent h2  
{
    text-align:left;}

    .footer .row {
        text-align: center;
    }

   .footer p {
        padding: 0 !important;
    }

   .footer img {
        margin-left: -477px !important;
   }
   
   .footer ul li {
       display: inline;
   }

    .boxes .newsletter {
        display: block;
        max-width: 360px;
        margin: 0 auto;
        float: none;
        min-height: auto;
    }

   .newsletter .box {
    height: 320px;
    max-height: 360px;
    max-width: 328px;
  /*  min-width: 344px; ele commento per mobile sbordo*/
}

   .banner-caption {
       display: none;
   }

   .banner-caption h2 {
       font-size: 20px;
   }
.carousel-caption {top:75%;} /*75*/
.descr {max-width:100%;}
.boxes h6 {
    color: #000000;
    
    float: none; /*none messo left per descrizioni sotto img a filo a SX esempio in reference*/
    font: bold 18px/20.9px Source Sans Pro;
    /*width: calc(100% - 40px); da usare con text align center*/
    margin: 0 auto 20px auto; 
    text-align:center;
   
   }

.boxes img {
    margin: 0 auto;
    display: block;
}
.boxes .container-fluid img {/*per immagini delle nuove gallery in reference e news*/
    margin: 0 auto 20px auto;
    display: block;
}

.boxes .row {
        padding: 0px 30px;
    }

.oikos,.cosafacciamo,.dovesiamo,.socialmenu,.loginmenu,.languagemenu,.profilomenu {
    left: 0px;
}


.navbar-brand {
        padding: 5px 0 0 20px;
    }
   
    .navbar-brand-resty {
        padding: 5px 0 0 0px;
       border: 5px solid pink;
    }

    #navbar {
        width: 100%;
    }


.dropdown-menu {
        position: static;
        float: none !important;
        width: 100% !important;
    }

.dropdown-toggle {
        margin-right: 25px;
    }

.navbar-fixed-bottom .navbar-collapse, .navbar-fixed-top .navbar-collapse {
        max-height: 20000px !important;
    }
   
.bottone {
    display:block;
    margin:10px auto;} 
    
    
    
    
}

@media screen and (min-width: 768px) {
    .dropdown:hover > .dropdown-menu {
        display: block;
    }
}

.navbar-toggle2 {
    float: right;
    margin-right: 0;
    padding-top: 69px;
    margin-bottom: -2px !important;
}

    .navbar-toggle2:hover {
        background-color: transparent !important;
    }

.inputForm, .container2field {width:65%;}
.text-area {width:65%; height:80px;}    

 .banner-caption h2 {
     max-width: 96%;
     padding-left: 2%;
   }
   


@media (min-width: 768px) {
    
    .navbar > .container .navbar-brand, .navbar > .container-fluid .navbar-brand {
       /* margin-left: 0px;*/
        margin-right: -15px;
    }  
    
     .navbar > .container .navbar-brand-resty, .navbar > .container-fluid .navbar-brand-resty {
         margin-left: -15px;
        margin-right: -15px;
    }  
    
}

.navbar-brand-resty {
    float: left;
    padding-top:38px;
}

.navbar-brand {
    float: right;
    padding-top:38px;
}

@media only screen and (max-width: 767px) {

    .footer img {
        margin-left: -450px !important;
        margin-bottom: 20px;
    }

    .footer .row {
        text-align: left;
        padding-left: 20px;

    }
    p.footer-submenu {
        color:#bbb !important;
    }
}

#layout-international p 
{  
  max-width:1044px;
  margin:10px auto 20px auto ;
  text-align:center;
   font-size: 13pt;
    }
    
 