
/* #Page Styles
================================================== */
.wrapper{
    width: 960px;
    position: relative;
    margin: 0 auto;
}

.one-two,
.one-third,
.one-four,
.one-five,
.three-three{
	/*margin-top:30px;*/
	margin-right: 30px;
	float: left;
    position: relative;
}

.one-two{width:465px;}
.one-third{width:300px;}
.one-four{width:217px;}
.one-five{width:168px;}
.one-six{width:135px;}
.three-three{width: 713px;}



/* #Mobile assets 
================================================== */
#banner .slides img.mob {
  display: none;
}

/* #Media Queries
================================================== */


	/* Tablet Portrait size to standard 960 (devices and browsers) */

    @media only screen and (min-width: 958px) and (max-width: 1025px) {

        #right{width: 100%; margin: 0 !important; padding: 0 !important;}
        #header{background: url('../img/bg/header-right-bg.png');}
        #header #right{width: 700px;}
        .header .wrapper{width: 100%; background: url('../img/bg/header-right-bg.png'); height: auto !important;}
        .header{display: block;}
        /* .scroll{ padding-top: 0px;} */
        .page-title.single{margin-top: 0;}

		/*New*/
		 #menu{
         float: none;
         margin:0 auto;
		 max-width:960px;
        }

    }


	@media only screen and (min-width: 768px) and (max-width: 958px) {
	   .wrapper{width: 740px;}

       .one-two{width:355px;}
       .one-third{width:226px;}
       .one-four, #flickr{width:162px;}
       .one-five{width:124px;}
       .three-three{width: 548px;}
       .one-third.team{width: 220px;}

       .services .alignleft{width: 60px;}
       .services .alignright{width: 102px;}

        #left{width: 158px;}
        #right{width: 582px;}

        .portfolio{width: 748px;}
        .portfolio img{width: 83px;}
        .p-single .scale{width: 728px;}
        .p-left{
            float: none;
            width: 768px;
        }
        .p-right{
            float: none;
            width: 768px;
        }


       /* .new-post .scale{width: 350px;}*/
	    .new-post .scale{width: 450px;}

		.new-post .segment-anchor{
			position:absolute;
			margin-top:-40px;}

        .team .team-info{width: 206px;}
        .team .team-info h4{margin-bottom: 10px;}
        .team .team-info p{
            font-size: 11px;
            height: 75px;
            overflow: hidden;
        }


        #contact-form textarea{
            width: 528px;
        }
        #contact-form p.alignleft{
            width: 172px;
        }
        #contact-form p.alignleft input{
            width: 152px;
            float: none;
        }
        .ei-title {
          width:40%;
    }

      .title-holder {
        top: 22%;
      }

		/*New*/
    #header #left,
    #header #right{
        width: 100%;
        margin: 0 !important;
        padding: 0 !important;
    }
		 #menu{
         float: none;
         margin:0 auto;
		 max-width:740px;
        }

		.left-fix{
			padding-left:0px;
			}/*end new*/

        #menu li{ margin-right: 20px;}

        .ei-slider{height: 400px;}
        .ei-title h2{
            font-size: 40px;
            line-height: 30px;
        }
        .ei-title h3{
            font-size: 18px;
            line-height: 24px;
        }

        #commentform textarea{
            width:728px!important;
        }

        #commentform .left{width: 230px;}
        #commentform .left input{width: 218px;}

        #flickr img{width: 42px;}



        #header{
            background: url('../img/bg/header-right-bg.png');
            height:auto;
            text-align:center;
            position:relative;
        }
        #header .wrapper {
          width:100%;
          text-align:left;
        }
        /* #header #right{width: 582px;} */


        .header .wrapper{
            width: 100%;
            background: url('../img/bg/header-right-bg.png');
            height: auto !important;
        }

        .header{display: block;}

        .scroll { 
          padding-top: 0px;
          padding-bottom:100px;
        }
        #logo{float: none;}

        /* .scroll{ */
        /*     padding-bottom: 100px; */
        /* } */



    /*    .clients{width: 365px;}*/
        .clients img{width: 82px;}

        .capabilities{width: 365px;}
        .capabilities img{width: 116px;}

        .skill{margin-bottom: 8px;}

        .page-title.single{margin-top: 0;}

        #too-big-logo{
          float: none;
          height:inherit;
          width:inherit;
          margin:0;
          padding:0;
          background: url('../img/lpi-logo-no-grad.png') no-repeat top center;
        }
	}

	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 767px) {

       .wrapper{width: 300px;}

      /* .clients{width: 300px;}*/
       .clients img{width: 68px !important;}

	    .capabilities{width: 300px;}
        .capabilities img{width: 93px !important;}

       #header{
            position:relative;
            text-align: center;
            height: auto;
        }
        .scroll { 
          padding-top: 0px;
          padding-bottom:100px;
        }
        #logo{float: none;}

		#too-big-logo{
		float: none;
	    height:inherit;
    	width:inherit;
		margin:0;
		padding:0;
		background: url('../img/lpi-logo-no-grad.png') no-repeat top center;
		}

        #menu{
            float: none;

            /*padding: 20px 0 0px 0; Original*/
            padding: 20px 42px 0;
        }

        #menu span{display: none;}
        #menu li{ margin: 0 10px 10px 0;}

        /* .scroll{ */
        /*     padding-bottom: 100px; */
        /*     padding-top: 0px; */
        /* } */

        .one-two,
        .one-third,
        .one-four,
        .one-five,
        .three-three,
        #flickr{
            width: 300px;
            margin-bottom: 30px;
        }

        .portfolio{width: 308px;}
		 .portfolio img{
            width: 68px;

        }

        .p-left{
            float: none;
            width: 300px;
        }
        .p-right{
            float: none;
            width: 300px;
        }

        .ptitle,
        .pcategories{float: none;}

        .services .alignright{width: 240px;}

         .blog-post{float: none;}
        .blog-post.last{margin-bottom: 30px !important;}

        #left,
        #right{
            width: 100%;
            margin: 0 !important;
            padding: 0 !important;
        }
        /* #right{width: 300px;} */
        #header .wrapper,
        .header .wrapper{
            width: 100%;
            background: url('../img/bg/header-right-bg.png');
            height: auto;
        }

        .header{display: block;}

        .new-post .image{margin-bottom: 10px;}

        .paginate{margin-top: 30px;}

        .scale{
            margin-bottom: 15px;
            width: 288px;
        }
        .scale.icon{
            width: 178px;
            margin-bottom: 15px;
        }
        .team .team-info{width: 270px;}

        .p-single .scale{width: 288px;}


        #contact-form textarea{
            width: 280px;
            margin-top: 15px;
        }
        #contact-form p.alignleft{
            width: 300px;
            margin-right: 0px;
        }
        #contact-form p.alignleft input{
            width: 280px;
            float: none;
        }

        .ei-title {
          width:40%;
    }

        .ei-title h2{
        	font-size: 20px;
        	line-height: 20px;
        }
        .ei-title h3{
        	font-size: 13px;
        	line-height: 16px;
        }
        .title-holder {
        	top: 16%;
        }
        .title-holder .wrapper {
          width:92%;
        }
        #commentform textarea{
            width:278px!important;
            margin-top: 15px;
        }

        .blog-single{padding-top: 0px;}

        .page-title.single{margin-top: 0;}

		.new-post .segment-anchor{
			position:absolute;
			margin-top:-40px;}

		/* Pretty Photo*/
		.brand-overlay{
		width:280px !important;
		min-height:300px !important
		}

		.brand-overlay-img{
		width:280px;
		}


		.brand-overlay-info{
			width:250px;
			padding:5px 0 0 20px;
			float:left;
			}

		.brand-overlay-info h5, .brand-overlay-info p{
			margin-bottom:12px;
			}

	}

	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
	@media only screen and (min-width: 480px) and (max-width: 767px) {
        .wrapper{width: 420px;}

        #header{
            text-align: center;
            height: auto;
        }

        #logo{float: none;}

		#too-big-logo{
      float: none;
      height:inherit;
      width:inherit;
      margin:0;
      padding:0;
      background: url('../img/lpi-logo-no-grad.png') no-repeat top center;
		}

        #menu{
            float: none;

            /*padding: 20px 0 0px 0; Original*/
			padding: 20px 0 0px 32px;
        }
        #menu span{display: none;}
        #menu li{ margin:0 10px 10px 0;}

        /* .scroll{ */
        /*     padding-bottom: 100px; */
        /*     padding-top: 180px; */
        /* } */

        .one-two,
        .one-third,
        .one-four,
        .one-five,
        .three-three,
        #flickr{
            width: 420px;
            margin-bottom: 30px;
        }

        .portfolio{width: 428px;}
        .portfolio img{width: 83px;}


        .p-left{
            float: none;
            width: 420px;
        }
        .p-right{
            float: none;
            width: 420px;
        }

        .ptitle,
        .pcategories{float: none;}

        .services .alignright{width: 360px;}

        .scale{margin-bottom: 15px;}

        .p-single .scale{width: 408px;}

        .blog-post img{width: 170px;}
        .blog-single-post img{width: 408px;}
        .blog-post{float: none;}
        .blog-post.last{margin-bottom: 30px !important;}

        #left{
            width: 100%;
            margin: 0 !important;
            padding: 0 !important;
        }

        #right{
            /* width: 420px; */
            margin: 0 !important;
            padding: 0 !important;
        }

        #right ul{float: none;
		}

        #header .wrapper,
        .header .wrapper{
            width: 100%;
            background: url('../img/bg/header-right-bg.png');
            height: auto !important;
        }

        .header{display: block;}

        .new-post .image{
            margin-bottom: 10px;
            width: 417px;
        }

        .paginate{margin-top: 30px;}

        .team img{
            width: 155px;
            float: left;
            margin-right: 10px;
			margin-bottom:10px;
        }
        .team .team-info{width: 378px;}


        #contact-form textarea{
            width: 400px;
            margin-top: 15px;
        }
        #contact-form p.alignleft{
            width: 420px;
            margin-right: 0px;
        }
        #contact-form p.alignleft input{
            width: 400px;
            float: none;
        }

        .ei-title h2{
        	font-size: 36px;
        	line-height: 30px;
        }
        .ei-title h3{
        	font-size: 14px;
        	line-height: 18px;
        }
        .title-holder{
        	top: 16%;
        }

        #commentform textarea{
            width:408px!important;
            margin-top: 20px;
        }

        .page-title.single{margin-top: 0;}


        /*.clients{width: 430px;}*/
        .clients img{width: 98px !important;}

		.capabilities{width: 430px;}
        .capabilities img{width: 132px !important;}


		/* Pretty Photo*/
		.brand-overlay{
		width:400px !important;
		}

		.brand-overlay-img{
		width:400px;
		}


		.brand-overlay-info{
			width:300px;
			padding:10px 0 0 20px;
			float:left;
			}


	}

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

    /* .scroll { */
    /*   padding-top:188px;  */
    /* } */
    #banner {
      background:#000;
    }
    #banner .slides img.desk {
      display:none;
    }
    #banner .slides img {
      min-width:initial;
    }
    .title-holder {
      position:relative;
      padding-top:15px;
    }
    
    .title-holder .ei-title {
      width:100%; 
    }
    #banner .slides img.mob {
      display: block;
    }

    .ei-slider-large {
      height: 250px;
      overflow:initial;
    }

    .ei-slider {
      overflow:hidden;
      height:250px;
      padding-bottom:150px; 
    }

    .ei-slider-large li {
      overflow:initial;
    }

    .ei-slider-large li img {
      margin-left:0 !important;
      position:absolute;
      right: -10%;
    }

    .ei-title h2 {
      color:#e0e0e0;
      margin-bottom:5px;
    }
    .ei-title h3,
    .ei-title h3 a {
      color:#c0c0c0;
    }
    .ei-title h3 a:hover {
      color:#fff;
    }
  }
