/*!
 * Psicogeografia.com 
 *
 * Copyright 2014 Accademia di Architettura di Mendrisio
 *
 * Designed and built by Francesco Mussi
 * www.francescomussi.com
 *
 */

/* ==========================================================================
   Reset components to improve browser compatibility
   ========================================================================== */

html,body,div,span,h1,h2,h3,h4,h5,h6,p,blockquote,
a,em,img,strong,b,i,dl,dt,dd,ol,ul,li,
fieldset,form,label,
article,aside,canvas,details,figcaption,figure,
footer,header,hgroup,menu,nav,section,summary,
time,mark,audio,video{
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    font:inherit;
    vertical-align:baseline;
}


/* HTML5 display-role reset for older browsers */
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section{
    display:block;
}




 /* ==========================================================================
   General styling
   ========================================================================== */
   
html,body{
	
	color:#000;
	margin:0;
	text-decoration:none;
	font-size: 12px;
	letter-spacing: 1px;
	font-family: sans-serif;
	background: url('../img/dots.png');


}

*{
	margin:0;
	padding:0;
}


a{
 	color:#666;
	text-decoration:none;	
}

a:focus, a:hover {

	text-decoration:none;

}



ul,li {

	list-style:none;
}


h1 {

	font-size: 3em;
}

p {

	color: rgb(102, 102, 102);
	letter-spacing: 1px;
}


/* Barra di navigazione */

::-webkit-scrollbar-thumb:vertical{height:10px;background-color:white;}
::-webkit-scrollbar{width:10px;height:0;background:#cbc;}




#wrapper {

	background-attachment: scroll;
	background-clip: border-box;
	background-image: none;
	background-origin: padding-box;
	background-position: 0 0;
	background-repeat: repeat;
	background-size: auto auto;
	min-height: 2200px;
	max-height:100%;
	overflow:hidden;
	margin: auto;

}





.content {
	/*background-color:#ddd;*/


	
}

.col-xs-9 {

	padding-left: 40px;
	/*margin-top: 80px;*/


}



.slicknav_menu {
	display:none;
	
}


/*
#content-wrapper {

	margin-top: 100px;
}
*/

.section {

	/*padding-top: 60px;
	padding-left: 50px;*/
}



 /* ==========================================================================
   Main 4 div
   ========================================================================== */


   #home {
             
       padding-top: 12%;   
       margin-bottom: 39%;  /* fix for tablet */

       

   }

      #home h1 {
             
       font-size: 4.5em; 
       font-family: "HelveticaNeue-Light", sans-serif;

      }


      #home h2 {
             
       font-size: 2em;    

      }




        .the2boxes {

        	margin-top: 7%;
        }

		.box1Inizio {

			width: 35%;
			float: left;
			margin-right: 5%;
		}


		.box2Inizio {

			width: 35%;
			float: left;
			clear: right;
		}



   #second {

   	clear:both;
   	margin-top: 640px;

   }


   #third {

      clear:both;
      margin-top: 10px;
      margin-bottom: 300px;
   	  
   }


    #thirdB {

      clear:both;
      margin-top: 10px;
      margin-bottom: 300px;
   	  
   }


    #fourth {
    
    padding-top: 6%;   
    padding-left: 6%;
    margin-bottom: 39%;  /* fix for tablet */
    clear:both;
   	  
   }



   #fifth {

    padding-top: 7%;
    margin-top: 600px;
    margin-bottom: 500px;
    clear:both;
   	  
   }





 /* ==========================================================================
   Navigation
   ========================================================================== */



.navigation {
	
	position:fixed;
	border-right: 1px solid #efefef;
    color:black;
    padding: 15px;	
	height:100%;
	background:white;
	text-align:right;
	float:left;
	z-index:99999;

}



.navigation ul {
    margin-top:25%;	
}


.navigation li {


	padding-top: 10px;
	padding-bottom: 10px;
	cursor:pointer;
	font-size: 12px;
	text-transform: uppercase;

}


.navigation li.active {

	color: #cbc!important;
}


#menuid1{
	color:#cbc;	
}


.menu-style{
	text-decoration:none;
	-webkit-transition: all 0.25s ease-in-out;
    -moz-transition: all 0.75s ease-in-out;
    -o-transition: all 0.75s ease-in-out;
    -ms-transition: all 0.75s ease-in-out;
	padding:5px;
}


.menu-style:hover{
	color:#fff!important;
	background:#cbc;
}


.menu-contact{
	font-size:10px;
	letter-spacing: 3px;
	padding-right: 20px;
	color:#555;
	position:absolute;
	bottom:30px;
	margin-bottom: -15px;
	line-height: 13px;
}

.menu-contact p {

	margin-top: 4px;
	margin-bottom: -6px;
	text-align: center;
	margin-right: 15px;
}


.menu-contact img:hover{

	opacity: 0.7;
	
}

.menu-contact a:hover{

	color:black;
	
}



.general-link{
	color:white!important;
	background:#cbc;
	padding:0px 3px 0px 3px;
	cursor:pointer;	


}




.general-link:hover{
	background:none;
	color:#cbc!important;	
}


.linkCorso {

   text-decoration:underline;

}

.downloadButton {

	opacity: .8;
	margin-left: 20px;
}

.downloadButton:hover {

	opacity: 1;
	
}

.linkPdf {

	color:#666666;
   font-family: sans-serif;
   font-style: italic;
}

.linkPdf:hover {

	color:#222;
   
}

.linkHoverPress2 {

   color:#666666;
   font-family: sans-serif;
}

.linkHoverPress2:hover {

   color:#222;
}

.title{
	letter-spacing: 0px;
	float: right;
	right: 10px;
	line-height: 0.9;
	text-transform: uppercase;
	font-size: 2.1em;
	margin-top: 5px;
	margin-bottom: 0px;
}

.title2{

	margin-right: 0px;
	letter-spacing:0.1em;
	opacity: 0.6;
	clear:both;
	font: sans-serif;

}


 /* ==========================================================================
   Map
   ========================================================================== */


       #map_canvas {

        height: 760px;
       



      }


        /* --- Sizer --- */

		#sizer      { 
			/*width: 370px;*/
			margin: 0 auto; 
   
			}


		#sizer2      { 
			width: 370px;
			margin: 0 auto; 
   
			}



		/* Riquadro blu  */	
		form   { 
			width: 240px; 
			padding: 18px 20px 0; 
			margin-bottom: 18px; 
			background: rgb(139, 133, 137);
			border-radius: 5px; 
			-webkit-border-radius: 5px; 
			-moz-border-radius: 5px; 
			-khtml-border-radius: 5px; 
			box-shadow: 0 5px 12px rgba(0,0,0,.4); 
			-webkit-box-shadow: 0 5px 12px rgba(0,0,0,.4); 
			-moz-box-shadow: 0 5px 12px rgba(0,0,0,.4); 
			-khtml-box-shadow: 0 5px 12px rgba(0,0,0,.4); 
		}
		fieldset    { border: 0; padding-bottom: 9px; }
		label       { 
			/*display: block; */	
			cursor: pointer; 
			line-height: 20px; 
			padding-bottom: 9px; 
			text-shadow: 0 -1px 0 rgba(0,0,0,.2); 
		}
		.radios     { padding-top: 18px; background: url(../img/divider.png) repeat-x 0 0; }
		.label_check input,
		.label_radio input  { margin-right: 5px; }
		#footer     { width: 100%; text-align: center; font-size: 12px; }
		#footer a   { padding: 2px 10px; margin: 0 2px; color: #999; background: #ddd; text-decoration: none; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -khtml-border-radius: 10px; }
		#footer a:hover,
		#footer a:focus { color: #fff; background: #333; background: rgba(0,0,0,.3); }
         
         /* Scritte Gruppo 1 Gruppo 2 in box */
		.has-js .label_check,
		.has-js .label_radio    { 
			padding-left: 24px;
			color:white; 
			margin-right: 1.4em;
		}
		.has-js .label_radio    { background: url(../img/radio-off.png) no-repeat;  font-size: 1em; font-weight: 500;}
		.has-js .label_check    { 
			background: url(../img/check-off.png) no-repeat;
			/*float:left; */
		}
		.has-js label.c_on      { background: url(../img/check-on.png) no-repeat; }
		.has-js label.r_on      { background: url(../img/radio-on.png) no-repeat; font-size: 1em;font-weight: 500;}
		.has-js .label_check input,
		.has-js .label_radio input  { position: absolute; left: -9999px; }




       /* Order radio buttons */
/*
		.check1 {

			float:left;
		}


		.check2 {

			float:left;
		}


		.check3 {

			float:left;
		}


		#radio-04 {
            
            float:left;

		}

*/






 /* ==========================================================================
   Narrazioni
   ========================================================================== */

.port-container-main{
	width:1000px;
	margin-bottom: -500px;

}


.section-title {       /* Responsive */

    font-size: 3em;
}

.main-content-area {   /* Responsive */

	padding-left: 6%;
	padding-top: 2.5%;
}

.display-id {    /* Responsive */

	/*padding-left: 7%;*/
}


#tumblelog .col1 { width: 250px; height: 237px; }
#tumblelog .col2 { width: 500px; }
#tumblelog .col3 { width: 700px; }

#tumblelog .awardcol{ width:199px; }

/*  Responsive
#tumblelog{
	width: 810px;
}*/


#tumblelog2{
	width: 100%;
}



#container-5{
	padding-top: 100px;
	margin-top: -100px;
	padding-bottom:160px;
	background:url('../images/pattern7.png');
	/*min-height: 1200px;*/
	
}

.port-container{
	width:420px;
	height:400px;
	float:left;	
	cursor:pointer;
}



.portfolio-item{
	width:250px;
	height:250px;		
	overflow:hidden;
	float:left;	
	background:#efefef;
	margin-right:10px;
	margin-top:10px;
}

.port-desc{
	/*font-family: BebasNeueRegular;*/
	font-size: 1.6em;
	opacity:1!important;	
	/*padding-top: 5em;*/
}


.port-desc-tesina{
	
	font-size: 2em;
	opacity:1!important;
	margin-bottom: .1em;	

}



.port-desc-mini{
	font-size: 0.65em;
	/*font-family: Constantia, Palatino, "Palatino Linotype", "Palatino LT STD", Georgia, serif;*/
	font-style: italic;
	letter-spacing: 0px;
	opacity: 0.5;
}


.port-desc-mini-tesina{
	font-size: 1em;
	font-style: italic;
	letter-spacing: 0px;
	opacity: 0.5;
}

.linkPdf {
    font-size: 1.10em;
	font-style: italic;
	letter-spacing: 0px;
	opacity: 0.75;

}



.youtube{
    font-size: 0.75em;
	font-style: italic;
	letter-spacing: 0px;
	opacity: 0.5;
	clear:both;
	float:left;
	line-height: 1.37em;

}


.youtubeImg:hover {

    opacity: 0.7;
}



.port-desc-mini-press {

    font-size: 1.1em;
	/*font-family: Constantia, Palatino, "Palatino Linotype", "Palatino LT STD", Georgia, serif;*/
	font-style: italic;
	letter-spacing: 0px;


	

}



.read-more{
	background: #CBC;
	color: white;
	font-family: museo-300;
	font-size: 16px;
	width: 122px;
	position: absolute;
	z-index: 9;
	margin-top: 10px;
	opacity:0;
	text-transform:uppercase;
}



.closebtn{
	position:fixed;
	float:right;
	right:0px;
	height:40px;
	overflow:hidden;	
	background:url("../img/closebtn.png");
	background-position:top;
	width:40px;
	top:160px;
	cursor:pointer;
	z-index:99999999999999;
		
}

.closebtn:hover{
	background-position:bottom;

}



.port-box.who-service{
	padding-right:25px;
	border-right:1px solid #efefef;		
}


.port-box.what-service{
	padding-left:25px;
	border-right:1px solid #efefef;
	padding-right:25px;	
}

/* Contenuto box - testo - Responsive
.port-box.how-service{
	padding-left:25px;	
}
*/

/* Contenuto box - image - responsive 
.port-images{
	margin-top:20px;
	margin-right:45px;
}
*/
.port-mini-header-thick{
	font-size: 26px;
/*	font-family: Constantia, Palatino, "Palatino Linotype", "Palatino LT STD", Georgia, serif;*/
	font-style: italic;
	letter-spacing: 0px;

}
.port-mini-header2{
	font-family: museo-500;
	font-size: 20px;
	letter-spacing: 0px;
	float: left;
	width: 400px;
	padding-top:30px;
}

.port-section-content{
/*	font-family: Constantia, Palatino, "Palatino Linotype", "Palatino LT STD", Georgia, serif;*/
	/*font-style: italic;*/
	font-size: 13px;
	letter-spacing: 0px;
	color: #666;	
	clear:both;
	margin-left: -4px;
}







 /* ==========================================================================
   Press
   ========================================================================== */

#wrapperPress {

	background-attachment: scroll;
	background-clip: border-box;
	background-image: none;
	background-origin: padding-box;
	background-position: 0 0;
	background-repeat: repeat;
	background-size: auto auto;
	min-height: 1200px;
	max-height:100%;
	overflow:hidden;
	margin: auto;

}


.pressTitle {

	margin-bottom: 10px;
}

.pressImage {

	border: 1px solid #111;
	
}


.homePress {

	padding-left: 100px;
}





 /* ==========================================================================
   Affinità
   ========================================================================== */


.fifthContent {

	padding-left: 10%;
	
}

#fifth h1 {

	margin-bottom: 30px;
}

#fifth a:focus, #fifth a:hover {
   
     color: #cbc;;
}

#fifth li {

	line-height: 1.5em;
}






 /* ==========================================================================
   Crespi
   ========================================================================== */


 .bold {

	font-weight: bold!important;
}

.crespi_content {

	margin-top: 0.5em;
}

.crespi_title {

	font-weight: bold;
	font-style: italic;
	font-size: 2.6em;
	font-family: Tahoma, Verdana, Segoe, sans-serif;
}


.crespi_sottotitolo1 {

	font-size: 1.3em;
	font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
	
}

.crespi_sottotitolo2 {

	font-size: 1em;
	font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
	
}

.crespi_subtitle {

	font-weight: bold;
	font-size: 1.4em;
	font-family: Tahoma, Verdana, Segoe, sans-serif;
	margin-bottom: 0.3em;

}


.crespi_image_margin {

	margin-top: 0px!important;
	margin-bottom: 0.7em;
}