/*--------------------------------------------------------------------------
   
    * Css override for mobile viewports

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

/* #Tablet (Portrait)
================================================== */

    /* Note: Design for a width of 768px */

    @media only screen and (min-width: 768px) and (max-width: 959px) {
		#section-works .item .work-info {
			margin: 16px 20px 16px 0;
		}

			#section-works .item h4 {
				font-size: 14px;
				line-height: 23px;
				margin-bottom: 10px;
			}
    }


/*  #Mobile (Portrait)
================================================== */

    /* Note: Design for a width of 320px */

    @media only screen and (max-width: 767px) {

        /* Adjust the site logo top/bottom margins */
        #section-header {
        }

        	#section-profileImage {
        		height: 240px;
                        background: #222 url('carlocompagnoDark.jpg') no-repeat center center;
			background-size: cover;
        	}

        	#section-profileImage #box-name {
        		margin-top: 50px;
        	}

				#section-profileImage #box-name h2 {
					color: #fff;
				}

				#section-profileImage #box-name h2 {
					color: #fff;
				}


				#section-profileImage #box-name p {
					color: #fff;
				}

				#section-profileImage #box-name a {
					color: #fff;
				}

                p.intro {
                    font-size: 23px;
                    margin-bottom: 30px;
                }
                p.intro br {
                    display:none;
                }
                
                a.link-print {
                    padding-left:5px;
                }

		#progetti {
                    margin-top:30px; 
		}
                
                #section-contact {
                        padding-top: 40px;
                }
                
		#section-contact input, 
		#section-contact textarea, 
		#section-contact select { 
			width: 260px;
		}

		#section-contact label.placeholder {
			display: none;
		}

        /* Adjust footer social media menu */
        #section-footer ul#social {
            float: none;
        }

	        #section-footer p {
	            margin: 40px 0 39px 0;
	        }

            #section-footer ul#social li a {
                border-right: none;
                margin-right: 1px;
                padding: 15px;
                margin-top: 1px;
            }

            #section-footer ul#social li a img {
                width: 16px;
            }
    }



/* #Mobile (Landscape)
================================================== */

    /* Note: Design for a width of 480px */

    @media only screen and (min-width: 480px) and (max-width: 767px) {

    }