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

.one-two,
.one-third,
.one-four,
.one-five,
.three-three{
	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;}

/* #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{position: relative; background: url('../images/bg/header-right-bg.png');}
        #header #right{width: 700px;}
        .header .wrapper{width: 100%; background: url('../images/bg/header-right-bg.png'); height: auto !important;}
        .header{display: block;}
        .scroll{ padding-bottom: 300px; padding-top: 0px;}
        .page-title.single{margin-top: 0;}
    }                
    
    
	@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 li{width: 167px;}
        .p-single .scale{width: 728px;}
        .p-left{
            float: none;
            width: 768px;
        }
        .p-right{
            float: none;
            width: 768px;
        }
        
        .new-post .scale{width: 350px;}
        
        .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;
        }
        
        #menu li{ margin-right: 20px;}
        
        .ei-slider{height: 400px;}
        
        #commentform textarea{
            width:728px!important;
        }
        
        #commentform .left{width: 230px;}
        #commentform .left input{width: 218px;}
        
        #flickr img{width: 42px;}
        
        
         #right{
            width: 100%;
            margin: 0 !important;
            padding: 0 !important;
        }
        
        #header{
            position: relative;
            background: url('../images/bg/header-right-bg.png');
        }
        #header #right{width: 582px;}
        
        
        .header .wrapper{
            width: 100%;
            background: url('../images/bg/header-right-bg.png');
            height: auto !important;
        }
        
        .header{display: block;}
        
        .scroll{
            padding-bottom: 300px;
            padding-top: 0px;
        }
        
        .clients{width: 365px;}
        .clients img{width: 82px;}
        
        .skill{margin-bottom: 8px;}
        
        .page-title.single{margin-top: 0;}

	}

	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 767px) {
	   
       .wrapper{width: 300px;}
       
       .clients{width: 300px;}
       .clients img{width: 68px !important;}
    
       #header{
            text-align: center;
            height: auto;
            position: relative;
        }
        
        #logo{float: none;}
        
        #menu{
            float: none;
            padding: 20px 0 0px 0;
        }
        
        #menu span{display: none;}
        #menu li{ margin: 0 10px 10px 0;}
    
        .scroll{
            padding-bottom: 300px;
            padding-top: 0px;
        }
       
        .one-two,
        .one-third,
        .one-four,
        .one-five,
        .three-three,
        #flickr{
            width: 300px;
            margin-bottom: 30px;
        }
        
        .portfolio{width: 308px;}
        .portfolio li{
            width: 132px;

        }
        
        .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('../images/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-slider{height: 250px;}
        .ei-title h2{
        	font-size: 20px;
        	line-height: 20px;
        }
        .ei-title h3{
        	font-size: 11px;
        	line-height: 15px;
        }
        .ei-title{
        	top: 25%;
        }
        
        #commentform textarea{
            width:278px!important;
            margin-top: 15px;
        }
        
        .blog-single{padding-top: 0px;}
        
        .page-title.single{margin-top: 0;}
       
	}

	/* 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;
            position: relative;
        }
        
        #logo{float: none;}
        
        #menu{
            float: none;
            padding: 20px 0 0px 0;
        }
        #menu span{display: none;}
        #menu li{ margin:0 10px 10px 0;}
        
        .scroll{
            padding-bottom: 300px;
            padding-top: 0px;
        }
       
        .one-two,
        .one-third,
        .one-four,
        .one-five,
        .three-three,
        #flickr{
            width: 420px;
            margin-bottom: 30px;
        }
        
        .portfolio{width: 428px;}
        .portfolio li{
            width: 194px;

        }
        
        .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('../images/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;
        }
        .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-slider{height: 250px;}
        .ei-title h2{
        	font-size: 20px;
        	line-height: 20px;
        }
        .ei-title h3{
        	font-size: 11px;
        	line-height: 15px;
        }
        .ei-title{
        	top: 35%;
        }
        
        #commentform textarea{
            width:408px!important;
            margin-top: 15px;
        }
        
        .page-title.single{margin-top: 0;}
        
        
        .clients{width: 430px;}
        .clients img{width: 98px !important;}

   
	}
