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

    0.  Reset & Clearfix
    1.  General
    2.  Wrap
    3.  Header
    4.  Content
    5.  Homepage
    6.  About Us
    7.  Pricing Tables
    8.  Shortcodes
    9.  News
    10. Portfolio
    11. Contact
    12. Widgets
    13. Footer
    14. Media Queries
	
*/




/* ------------------------------------------------------------------------------- */
/*  0.  Reset & Clearfix 
/* ------------------------------------------------------------------------------- */

html,body,div,span,h1,h2,h3,h4,h5,h6,p,blockquote,a,img,small,sub,b,dl,ul,li,label,article,details,footer,header,menu,nav,input,textarea,select{background:transparent;border:0;font-size:100%;margin:0;outline:0;padding:0;vertical-align:baseline}

article,details,footer,header,menu,nav{display:block}

body{line-height:1}

blockquote,q{quotes:none}

blockquote:before,blockquote:after,q:before,q:after{content:none}

hr{background:transparent;border:0;clear:both;color:transparent;height:1px;margin:0;padding:0}

input,select{vertical-align:middle}

ul{list-style:none}

.clear{clear:both;display:block;height:0;overflow:hidden;visibility:hidden;width:0}

.clearfix:after{clear:both;content:' ';display:block;font-size:0;height:0;line-height:0;visibility:hidden;width:0}

* html .clearfix,:first-child+html .clearfix{zoom:1}


/* ------------------------------------------------------------------------------- */
/*  1.  General
/* ------------------------------------------------------------------------------- */
    

	

    body {
        background: #fbfbfb;
        color: #757B7F;
        font: 12px 'Helvetica', 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;
        overflow-y: auto;
        overflow-x: hidden;
        -webkit-font-smoothing: antialiased; 
        -webkit-text-size-adjust: 100%;
		line-height:18px;
    }
    a, a > * {
        color: #2b2b2b;
        text-decoration: none;
        -webkit-transition: background-color .2s ease, border .2s ease, color .2s ease, opacity .2s ease-in-out, outline .2s ease;
           -moz-transition: background-color .2s ease, border .2s ease, color .2s ease, opacity .2s ease-in-out, outline .2s ease;
            -ms-transition: background-color .2s ease, border .2s ease, color .2s ease, opacity .2s ease-in-out, outline .2s ease;
             -o-transition: background-color .2s ease, border .2s ease, color .2s ease, opacity .2s ease-in-out, outline .2s ease;
                transition: background-color .2s ease, border .2s ease, color .2s ease, opacity .2s ease-in-out, outline .2s ease;
    }
    a:hover, a > *:hover {
        color: #555555;
    }

    ::-moz-selection { background: #23abf1; color: #fff; text-shadow: none; }
    ::selection { background: #333; color: #fff; text-shadow: none; }

    h1 { font-size: 30px; font-weight:lighter }
    h2 { font-size: 24px; font-weight:lighter}
    h3 { font-size: 18px; font-weight: 400; }
    h4 { font-size: 12px; font-weight: 400; }
    h5 { font-size: 16px; font-weight:lighter }
    h6 { font-size: 11px; }

    h1, h2, h3, h4, h5, h6 {
        color: #333;
        font-family: 'TitilliumText22LMedium', 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;
        line-height: 1.25;        
    }
    h1.capitalize {
        text-transform: capitalize;
    }
    hr,h1,h2,h3,h4,h5,h6,table,blockquote,p {
        margin-bottom: 10px;
    }
    hr.h50 {
        margin: 25px 0;
    }
	
	/*  Fonts  --------------------------------*/
	
	@font-face {
    font-family: 'TitilliumText22LThin';
    src: url('TitilliumText22L001-webfont.eot');
    src: url('TitilliumText22L001-webfont.eot?#iefix') format('embedded-opentype'),
         url('TitilliumText22L001-webfont.woff') format('woff'),
         url('TitilliumText22L001-webfont.ttf') format('truetype'),
         url('TitilliumText22L001-webfont.svg#TitilliumText22LThin') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'TitilliumText22LLight';
    src: url('TitilliumText22L002-webfont.eot');
    src: url('TitilliumText22L002-webfont.eot?#iefix') format('embedded-opentype'),
         url('TitilliumText22L002-webfont.woff') format('woff'),
         url('TitilliumText22L002-webfont.ttf') format('truetype'),
         url('TitilliumText22L002-webfont.svg#TitilliumText22LLight') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'TitilliumText22LRegular';
    src: url('TitilliumText22L003-webfont.eot');
    src: url('TitilliumText22L003-webfont.eot?#iefix') format('embedded-opentype'),
         url('TitilliumText22L003-webfont.woff') format('woff'),
         url('TitilliumText22L003-webfont.ttf') format('truetype'),
         url('TitilliumText22L003-webfont.svg#TitilliumText22LRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'TitilliumText22LMedium';
    src: url('TitilliumText22L004-webfont.eot');
    src: url('TitilliumText22L004-webfont.eot?#iefix') format('embedded-opentype'),
         url('TitilliumText22L004-webfont.woff') format('woff'),
         url('TitilliumText22L004-webfont.ttf') format('truetype'),
         url('TitilliumText22L004-webfont.svg#TitilliumText22LMedium') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'TitilliumText22LBold';
    src: url('TitilliumText22L005-webfont.eot');
    src: url('TitilliumText22L005-webfont.eot?#iefix') format('embedded-opentype'),
         url('TitilliumText22L005-webfont.woff') format('woff'),
         url('TitilliumText22L005-webfont.ttf') format('truetype'),
         url('TitilliumText22L005-webfont.svg#TitilliumText22LBold') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'TitilliumText22LXBold';
    src: url('TitilliumText22L006-webfont.eot');
    src: url('TitilliumText22L006-webfont.eot?#iefix') format('embedded-opentype'),
         url('TitilliumText22L006-webfont.woff') format('woff'),
         url('TitilliumText22L006-webfont.ttf') format('truetype'),
         url('TitilliumText22L006-webfont.svg#TitilliumText22LXBold') format('svg');
    font-weight: normal;
    font-style: normal;

}



    /*  Forms  --------------------------------*/
	
	
	input {
		-webkit-transition: background 0.3s ease-in-out 0s;
		-moz-transition: background 0.3s ease-in-out 0s;
		-o-transition:background 0.3s ease-in-out 0s;
		-ms-transition:background 0.3s ease-in-out 0s;
		background: none repeat scroll 0 0 #fff;
		border: 1px solid #f2f2f2;
		color: #8c8c8c;
		float: left;
		font-size: 11px;
		height: 12px;		
		padding: 10px;
		width:100%;
		float:left;
		font:12px 'Helvetica','Lucida Sans Unicode','Lucida Grande',sans-serif;
	}

	input:focus {
		background: none repeat scroll 0 0 #f6f6f6;
		outline: 0 none;
	}
	
	
	textarea {
		-webkit-transition: background 0.3s ease-in-out 0s;
		-moz-transition: background 0.3s ease-in-out 0s;
		-o-transition:background 0.3s ease-in-out 0s;
		-ms-transition:background 0.3s ease-in-out 0s;
		background: none repeat scroll 0 0 #fff;
		border: 1px solid #f2f2f2;
		color: #8c8c8c;
		float: left;
		font-size: 11px;
		height: 12px;		
		padding: 10px;
		width:715px;
		float:left;
		resize: none;
		margin-top:20px;
		margin-bottom:20px;
		font:12px 'Helvetica','Lucida Sans Unicode','Lucida Grande',sans-serif;
		height:100px
	}

	textarea:focus {
		background: none repeat scroll 0 0 #f6f6f6;
		outline: 0 none;
	}
   




/* ------------------------------------------------------------------------------- */
/*  2.  Wrap
/* ------------------------------------------------------------------------------- */

    #body-wrapper {
        left: 50%;
        margin-left: -520px;
        position: relative;
        width: 1040px;
    }
    .container {
        margin: 0 20px;
        position: relative;
		
    }


    /*  Columns  --------------------------------*/

    .one-fourth, .three-fourth, .one-third, .two-third, .one-half {
        float: left;
        margin-right: 20px !important;
        position: relative;
    }
    .one-fourth.last, .three-fourth.last, .one-third.last, .two-third.last, .one-half.last {
        margin-right: 0 !important;
    }
    .one-fourth      { width: 235px; }
    .three-fourth    { width: 745px; }
    .one-third       { width: 320px; }
    .two-third       { width: 660px; }
    .one-half        { width: 490px; }





/* ------------------------------------------------------------------------------- */
/*  3.  Header
/* ------------------------------------------------------------------------------- */

    #header-bg { 
		background-color:#2b2b2b;
		height:72px;
		width:100%;
		position:absolute;
	}
	
	#sub-header-bg {
		background-color:#f6f6f6;
		height:142px;
		width:100%;
		position:absolute;
		z-index:-1;
		border-bottom:#eee 1px solid;		
	}
	
	#header {
        background:#2b2b2b repeat-x 0 100%;
        height: 72px;
    }
    #logo {
        float: left;
        height: 24px;
		margin:24px;
    }


    /*  Navigation  --------------------------------*/
	
	
	
    #navigation {
        float: right;
		margin-right:20px;
		background: url(../images/nav-border.png) repeat-y left 100%;
    }
	
    #navigation li {
        float: left;
        position: relative;
		width:160px;
		background: url(../images/nav-border.png) repeat-y right 100%;		
    }
	
	
	
	#navigation span {
		float:left;
		padding-top:25px;
	}
	
    #navigation a {
        color: #7a8186;		
        display: block;
        font-family: 'Helvetica', 'Arial', 'Lucida Grande', sans-serif;		
        font-size: 13px;
		line-height:20px;
        font-weight:400;
		padding: 26px 10px 26px 20px;        
        position: relative;       
    }
	
    #navigation a:hover, #navigation .hover > a, #navigation .current > a {
        background: url(../images/menu_active_item.png) repeat-x 0 100%;
        color: #fff;
    }


    /*  Dropdown  --------------------------------*/

    #navigation ul {
		position:absolute;
		opacity: 0;		
		background:#23abf1;
		width:160px;	
		-webkit-transition: opacity .25s ease .1s;
		-moz-transition: opacity .25s ease .1s;
		-o-transition: opacity .25s ease .1s;
		-ms-transition: opacity .25s ease .1s;
		transition: opacity .25s ease .1s;
		-webkit-border-radius: 0 0 3px 3px;
		-moz-border-radius: 0 0 3px 3px;
		border-radius: 0 0 3px 3px;
		z-index:9999;		
	}

	#navigation li:hover > ul { 
		opacity:5;
		 
		}
	
	#navigation ul li {
		height: 0;
		overflow: hidden;
		padding: 0;
		background:none;
		-webkit-transition: height .25s ease .1s;
		-moz-transition: height .25s ease .1s;
		-o-transition: height .25s ease .1s;
		-ms-transition: height .25s ease .1s;
		transition: height .25s ease .1s;
	}
	
	#navigation li:hover > ul li {
		height: 42px;
		overflow: visible;
		padding: 0;
		
	}
	
	#navigation ul li a {
		width: 130px;
		padding: 10px 10px 10px 20px;
		margin: 0;
		font-size: 12px;
		font-weight:bold;
		color: #caedff;
		border: none;
		border-top: 1px solid #43b4ee;
	}
	
	#navigation ul li a:hover {
		background:#24aff6;
	}


    /*  Responsive Nav  --------------------------------*/

    .selectnav { display: none; }





/* ------------------------------------------------------------------------------- */
/*  4.  Content
/* ------------------------------------------------------------------------------- */
	
	
	#sidebar {
        float: right;
        width: 220px;
    }
	
	#main {
        float: left;
        margin: 0 40px 0 0;
        width: 740px;
    }
	
	.search {
        margin-bottom:40px !important;
        margin-top: 10px;
		margin-left:-2px
    }
	
	#back-top {
		position: fixed;
		bottom: 2%;
		Right: 2%;
		z-index:9999;
	}
	
	#back-top a {
		width: 50pxpx;
		display: block;
		text-align: center;
		font: 11px/100% Arial, Helvetica, sans-serif;
		text-transform: uppercase;
		text-decoration: none;
		color: #bbb;
	
		/* transition */
		-webkit-transition: 1s;
		-moz-transition: 1s;
		transition: 1s;
	}
	
	#back-top a:hover {
		color: #000;
	}
	
	/* arrow icon (span tag) */
	#back-top span {
		width: 50px;
		height: 50px;
		display: block;
		background: #333 url(../images/up-arrow.png) no-repeat center center;
	
		/* rounded corners */
		-webkit-border-radius: 3px;
		-moz-border-radius: 3px;
		border-radius: 3px;
	
		/* transition */
		-webkit-transition: 1s;
		-moz-transition: 1s;
		transition: 1s;
	}
	#back-top a:hover span {
		background-color:#777;
	}
    

    /*  Page Title  --------------------------------*/
	
	
	#page-title h1 {	
		font-weight:lighter;
		font-family: 'TitilliumText22LThin', 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;
		margin-bottom: 55px;
		width: 100%;
		text-align:left;
		padding-top:14px;
		color:#8a8e90;
		text-transform:lowercase;
		font-size:30px;
		margin-bottom:70px;
	}
	
	
	#page-title p {
		margin:0;	
	}
	
	#page-title a {
		float:right; 
		margin-top:20px; 
		height:30px; 
		width:30px; 
		background-color:#bbb; 	
	}
	
	#page-title a:hover {
		background-color:#2b2b2b;
	}
	
	
    
    




/* ------------------------------------------------------------------------------- */
/*  5.  Homepage
/* ------------------------------------------------------------------------------- */



	#slider {
		width:100%;
		height:auto;
		margin-bottom:50px;
		margin-top:50px;
	}
	
	
	#features {
		margin-bottom:25px;
		float:left;
	}
	

    .feature-icon {
        background: #2b2b2b;
        -webkit-border-radius:3px;
        -moz-border-radius:3px;
        border-radius:3px;
        display: inline-block;
        float: left;
        height: 36px;
        margin-top: -9px;
		margin-right:15px;
        text-align: center;
        width: 36px;
    }
	
	.feature p {
		margin-top:20px;
	}
	
	
	.gray-box {
		width:957px;		
		background-color:#2b2b2b;
		float:left;
		border: none;
		border-left:4px solid #23abf1;
		padding:20px 20px 10px 20px;
		margin-bottom:50px;
	}
	
	.gray-box h3 {
		margin:0;
		color:#FFF;
	}
	
	.graybox-right {
		float:right;
	}
		
	.graybox-left {
		float:left;
	}		
	
	
	.last-work {
		float:left;
		margin-bottom:50px;
	}
    

  
    

/* ------------------------------------------------------------------------------- */
/*  6.  About Us
/* ------------------------------------------------------------------------------- */

	h1.about {
		font-size:48px;
		color:#23abf1;
		font-family: 'TitilliumText22LThin', 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;
	}
	
	p.about{ 
		padding-top:10px
	}
	
	.one-half.last.about {
		padding-left:30px;
		width:460px;
	}
	
	.one-half.last.about h5 {
		padding-left:26px;
	}
	
	.one-fourth.about {
		padding-left:30px;
		width:180px;
	}
	
	.one-fourth.last.about {
		padding-left:30px;
		width:180px;
	}
	
	
	
	
	/*  Our team  --------------------------------*/
	
	#team{
		width:100%;
		height:100%;
		position:relative;
		float:left;
	}
	
	.user-item {
		width: 100%;
		height: 100%;
		
		position: relative;
		box-shadow: 0 1px 2px rgba(0,0,0,0.1);
		cursor: default;
	}
	
	.user-info-wrap{
		position: absolute;
		width: 200px;
		height: 200px;
		
	
		-webkit-perspective: 800px;
		-moz-perspective: 800px;
		-o-perspective: 800px;
		-ms-perspective: 800px;
		perspective: 800px;
	
		-webkit-transition: all 0.4s ease-in-out;
		-moz-transition: all 0.4s ease-in-out;
		-o-transition: all 0.4s ease-in-out;
		-ms-transition: all 0.4s ease-in-out;
		transition: all 0.4s ease-in-out;
	
		top: 10px;
		left: 10px;
		background: #f9f9f9 url(../images/bg.jpg);
		box-shadow: 
			0 0 0 20px rgba(255,255,255,0.2), 
			inset 0 0 3px rgba(115,114, 23, 0.8);
	
	}
	
	.user-info{
		position: absolute;
		width: 200px;
		height: 200px;
		cursor:pointer;
				
	
		-webkit-transition: all 0.6s ease-in-out;
		-moz-transition: all 0.6s ease-in-out;
		-o-transition: all 0.6s ease-in-out;
		-ms-transition: all 0.6s ease-in-out;
		transition: all 0.6s ease-in-out;
			
		-webkit-transform-style: preserve-3d;
		-moz-transform-style: preserve-3d;
		-o-transform-style: preserve-3d;
		-ms-transform-style: preserve-3d;
		transform-style: preserve-3d;
	
	}
	
	.user-info > div {
		display: block;
		position: absolute;
		width: 100%;
		height: 100%;
		
		background-position: center center;	
		-webkit-backface-visibility: hidden;
		-moz-backface-visibility: hidden;
		-o-backface-visibility: hidden;
		-ms-backface-visibility: hidden;
		backface-visibility: hidden;
	}
	
	.user-info .user-info-back {
		-webkit-transform: rotate3d(0,1,0,180deg);
		-moz-transform: rotate3d(0,1,0,180deg);
		-o-transform: rotate3d(0,1,0,180deg);
		-ms-transform: rotate3d(0,1,0,180deg);
		transform: rotate3d(0,1,0,180deg);
		
		background: #23abf1;
	}
	
	.user-img-1 { 
		background-image: url(../images/user.jpg);
	}
	
	.user-img-2 { 
		background-image: url(../images/user.jpg);
	}
	
	.user-img-3 { 
		background-image: url(../images/user.jpg);
	}
	
	.user-img-4 { 
		background-image: url(../images/user.jpg);
	}
	
	.user-info h3 {
		color: #fff;
		text-transform: uppercase;
		font-size: 14px;
		font-weight:bolder;
		margin: 0 15px;
		padding: 40px 0 0 0;
		height: 40px;
	}
	
	.user-info p {
		color: #fff;
		padding: 20px 5px;
		font-weight:bold;
		margin: 0 30px;
		font-size: 12px;
		border-top: 1px solid rgba(255,255,255,0.5);
	}
	
	.user-info p a {
		display: block;
		color: #fff;
		color: rgba(255,255,255,0.7);
		font-style: normal;
		font-weight: 700;
		text-transform: uppercase;
		font-size: 9px;
		letter-spacing: 1px;
		padding-top: 4px;
	}
	
	.user-info p a:hover {
		color: #2b2b2b;
		
	}
	
	.user-item:hover .user-info-wrap {
		box-shadow: 
			0 0 0 0 rgba(255,255,255,0.8), 
			inset 0 0 3px rgba(115,114, 23, 0.8);
	}
	
	.user-item:hover .user-info {
		-webkit-transform: rotate3d(0,1,0,-180deg);
		-moz-transform: rotate3d(0,1,0,-180deg);
		-o-transform: rotate3d(0,1,0,-180deg);
		-ms-transform: rotate3d(0,1,0,-180deg);
		transform: rotate3d(0,1,0,-180deg);
	}
	
	.user-grid {
	margin:0;
	padding: 0;
	list-style: none;
	display: block;
	text-align: center;
	width: 100%;
	}
	
	.user-grid:after,
	.user-item:before {
		content: '';
		display: table;
	}
	
	.user-grid:after {
		clear: both;
	}
	
	.user-grid li {
		width: 220px;
		height: 220px;
		display: inline-block;
		margin-right: 35px;
	}
	
	.user-grid li.last {
		margin-right:0;
	}     






	
    


/* ------------------------------------------------------------------------------- */
/*  7.  Pricing Tables
/* ------------------------------------------------------------------------------- */
	
	
	.pricing-table-second .column, .pricing-table .column {
        float: left;
        margin: 0;
        padding: 0;
        position: relative;
        text-align: center;
    }
    .pricing-table-second ul li, .pricing-table ul li {
        display: block;
        margin: 0;
        position: relative
    }
    .pricing-table-second .footer, .pricing-table .footer {
        padding: 24px 20px;
    }


    

    /*  First Pricing Table  --------------------------------*/

    .pricing-table .column {
        background: #fff;
		border: #eaeaea 1px solid;        
        width: 190px;
		padding-top:25px;
		
    }

	
	.pricing-table .column:last-child {
        border-top: #eaeaea 1px solid;
		border-bottom: #eaeaea 1px solid;
		border-right: #eaeaea 1px solid;
		border-left:none;
		
    }
	
	.pricing-table .column:first-child {
        border-top: #eaeaea 1px solid;
		border-bottom: #eaeaea 1px solid;
		border-left: #eaeaea 1px solid;
		border-right:none;
    }
	
    .pricing-table .level-max {
        background: #fff;
        border: none;
        -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
           -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
                box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
        margin: -20px 0;
        width: 230px;
        z-index: 999;
		border: #eaeaea 1px solid;
		padding-top:35px 
    }
    .pricing-table .header {
        padding: 26px 20px 23px;
		background:#f8f8f8;
		border-top: #eaeaea 1px solid;
		margin-top:25px;
    }

    .pricing-table h1 {
        color: #636363;
        font-size: 20px;
        font-weight:lighter ;
        margin: 0 0 7px;
    }
    .pricing-table h2 {
        color: #333;
        font-size: 18px;
        font-weight: 200;
        margin: 0 0 3px;
    }
	
	.pricing-table .level-max h1 {
        color: #23abf1;
		margin-bottom:30px;
		font-size:24px;
    }
	
    .pricing-table h2 span {
        color: #333;
        font-weight: 600;
    }
    .pricing-table .level-max h2, .pricing-table .level-max h2 span {
        color: #333;
    }
    .pricing-table .level-max h6 {
        color: #23abf1;
    }
    .pricing-table h6 {
        color: #23abf1;
        font-size: 11px;
        margin: 0;
        font-weight: 200;
        text-transform: capitalize;
    }

    .pricing-table ul li {
        border-top: 1px solid #eaeaea;
        padding: 8px 0;
    }

    .pricing-table .footer {
		background:#f8f8f8;
		border-top: #eaeaea 1px solid;
    }
	
	.pricing-table .level-max .footer {
		background:#fff;
		border-top: #eaeaea 1px solid;
		padding-top:35px;
		padding-bottom:35px;
    }




/*  Second Pricing Table  --------------------------------*/

.pricing-table-second .column {
        background: #fff;
		border: #eaeaea 1px solid;        
        width: 318px;
		margin-right:20px;
		margin-top:130px;
		margin-bottom:20px;
    }
		

	
	.pricing-table-second .column:last-child {        
		margin-right:0;		
    }
	
    
    .pricing-table-second .header {
        padding: 26px 20px 23px;
		background:#f8f8f8;
		border-top: #eaeaea 1px solid;
    }
	
	.pricing-table-second .table-title {
        padding: 15px 20px 10px;
		background:#2b2b2b;
		border-top: #eaeaea 1px solid;
    }

    .pricing-table-second h1 {
        color: #fff;
        font-size: 20px;
        font-weight:lighter ;
        margin: 0 0 7px;
    }
    .pricing-table-second h2 {
        color: #333;
        font-size: 18px;
        font-weight: 200;
        margin: 0 0 3px;
    }	
	
	
    .pricing-table-second h2 span {
        color: #23abf1;
        font-weight: 600;
		font-size:40px;
		vertical-align:top;
		line-height:35px;
    }
    
    
    .pricing-table-second h6 {
        color: #23abf1;
        font-size: 11px;
        margin: 0;
        font-weight: 200;
        text-transform: capitalize;
    }

    .pricing-table-second ul li {
        border-top: 1px solid #eaeaea;
        padding: 8px 0;
    }

    .pricing-table-second .footer {
		background:#f8f8f8;
		border-top: #eaeaea 1px solid;
    }
	
	

/* ------------------------------------------------------------------------------- */
/*  8.  Shortcodes
/* ------------------------------------------------------------------------------- */

    

    /*  Buttons  --------------------------------*/
	
	.btn-image {
		padding:12px 15px 12px 45px;
		background: url(../images/link.png) no-repeat 15px 10px #23abf1;
		color: #fff;
		font-size:12px;
		border-radius: 3px;
		-moz-border-radius: 3px;
		-webkit-border-radius: 3px;
		line-height:38px;
	}
		
	.btn-image:hover {
		text-decoration: none;
		background: url(../images/link.png) no-repeat 15px 10px #757575;
		color: #fff;
	}
	
	
	
	.btn {
		padding:12px 15px 12px 15px;
		background: #23abf1;
		color: #fff;
		font-size:12px;
		border-radius: 3px;
		-moz-border-radius: 3px;
		-webkit-border-radius: 3px;
		line-height:38px;
	}
		
	.btn:hover {
		text-decoration: none;
		background: #757575;
		color: #fff;
	}
	
	.btn.black {
		padding:12px 15px 12px 15px;
		background: #2b2b2b;
		color: #fff;
		font-size:12px;
		border-radius: 3px;
		-moz-border-radius: 3px;
		-webkit-border-radius: 3px;
		line-height:38px;
	}
		
	.btn.black:hover {
		text-decoration: none;
		background: #23abf1;
		color: #fff;
	}
	
	.btn-image.black {
		text-decoration: none;
		background: url(../images/link.png) no-repeat 15px 10px #2b2b2b;
		color: #fff;
	}
	
	.btn-image.black:hover {
		text-decoration: none;
		background: url(../images/link.png) no-repeat 15px 10px #23abf1;
		color: #fff;
	}
	
	

    


    /*  Accordion  --------------------------------*/
	
	
	.ac-container{
	width: 100%;
	margin: 20px auto 30px auto;
	text-align: left;
	}
	
	.ac-container label{		
		padding: 10px 25px;
		position: relative;
		z-index: 20;
		display: block;
		height: 30px;
		cursor: pointer;
		color: #2b2b2b;
		text-shadow: 1px 1px 1px rgba(255,255,255,0.8);
		line-height: 30px;
		font-size: 12px;
		font-weight:bold;
		background: url(../images/accordion-plus.png) no-repeat 0 14px;
		border-bottom:#eeeeee 1px solid;
		border-top:#eeeeee 1px solid;	
	}
	
	.ac-container input:checked + label,
	.ac-container input:checked + label:hover{
		background: url(../images/accordion-minus.png) no-repeat 0 14px;
		color: #2b2b2b;		
	}
	
	.ac-container input{
		display: none;
	}
	
	.ac-container article{		
		margin-top: -1px;
		overflow: hidden;
		height: 0px;
		position: relative;
		z-index: 10;
		-webkit-transition: height 0.3s ease-in-out, box-shadow 0.6s linear;
		-moz-transition: height 0.3s ease-in-out, box-shadow 0.6s linear;
		-o-transition: height 0.3s ease-in-out, box-shadow 0.6s linear;
		-ms-transition: height 0.3s ease-in-out, box-shadow 0.6s linear;
		transition: height 0.3s ease-in-out, box-shadow 0.6s linear;
	}
	
	.ac-container article p{
		color: #757B7F;
		line-height: 18px;
		font-size: 12px;
		padding:20px  25px;
	}
	
	.ac-container input:checked ~ article{
		-webkit-transition: height 0.5s ease-in-out, box-shadow 0.1s linear;
		-moz-transition: height 0.5s ease-in-out, box-shadow 0.1s linear;
		-o-transition: height 0.5s ease-in-out, box-shadow 0.1s linear;
		-ms-transition: height 0.5s ease-in-out, box-shadow 0.1s linear;
		transition: height 0.5s ease-in-out, box-shadow 0.1s linear;		
	}
	
	.ac-container input:checked ~ article.ac-height{
		height:95px;
	}
	
	

    

    /*  Tabs  --------------------------------*/
	
	

	ul.simpleTabsNavigation { 
		margin:2px; 
		padding:0; 
		text-align:left; 
		height:20px;
	}
	
	ul.simpleTabsNavigation li { 
		list-style:none; 
		display:inline; 
		margin:-2px; 
		padding:0;
	}
	
	ul.simpleTabsNavigation li a { 
		border:1px solid #E0E0E0; 
		padding:8px 20px; 
		background:#f6f6f6; 
		font-size:12px; 
		text-decoration:none; 
		color:#757b7f;
		line-height:15px;		  
	}
	
	ul.simpleTabsNavigation li a:hover { 
		background-color:#fff; 
		color:#23abf1;
	}
	
	ul.simpleTabsNavigation li a.current { 
		background:#fff; 
		color:#23abf1; 
	}
	
	div.simpleTabsContent { 
		background:#fff;
		border:1px solid #E0E0E0; 
		padding:20px 20px 15px; 
		margin-top:3px; 
		display:none; 
	}
	
	div.simpleTabsContent.currentTab { 
		display:block; 
	}

    


    /*  Alert Boxes  --------------------------------*/
	
	
	
	.notification {
		font-size: 12px;
		line-height: 18px;
		margin-bottom: 15px;
		padding: 14px 40px 7px 18px;
		position: relative;		
	}
	
	.notification.success {
		background-color: #EBF6E0;
		border: 1px solid #B3DC82;
		border-left:5px solid #B3DC82;
		color: #5F9025;
	}
	
	.notification.error {
		background-color: #FFE9E9;
		border: 1px solid #FBC4C4;
		border-left:5px solid #FBC4C4;
		color: #DE5959;
	}
	
	.notification.warning {
		background-color: #FBFADD;
		border: 1px solid #DED58A;
		border-left:5px solid #DED58A;
		color: #8F872E;
	}
	
	.notification.notice {
		background-color: #E9F7FE;
		border: 1px solid #B6D7E8;
		border-left:5px solid #B6D7E8;
		color: #5091B2;
	}
	
	    

    /*  Blockquote  --------------------------------*/
	
	
	blockquote {
		border-left: 4px solid #E7E7E7;
		color: #888888;
		line-height: 20px;
		margin: 5px 0 20px;
		padding-left: 20px;
	}
	
	.large-notice {
		background-color: #fff;
		border: 1px solid #E0E0E0;
		padding: 30px;
	}
	
	.small-notice {
		background-color: #fff;
		border: 1px solid #E0E0E0;
		padding: 15px 15px 5px 15px;
	}
	
	
	
	
	/*  Carousel  --------------------------------*/
			
	.slidecontrols li  {
		display:inline;
		float:right;
		height:20px;
		width:20px;
		background-color:#d9d9d9;
		margin-left:4px;
		border-radius: 2px;
		-moz-border-radius: 2px;
		-webkit-border-radius: 2px;
	}
	
	.slidecontrols li:hover  {
		display:inline;
		float:right;
		height:20px;
		width:20px;
		background-color:#c2c2c2;
		margin-left:4px;
		border-radius: 2px;
		-moz-border-radius: 2px;
		-webkit-border-radius: 2px;
	}
	
	ul.slidecontrols-blog  {
		position:absolute;
		top:34px;
		right:0px;
		height:inherit;
		width:auto;
		}
	
	.slidecontrols-blog li  {
		display:inline;
		float:right;
		height:31px;
		width:30px;
		background-color:#23ABF1;
		margin-left:0px;
		z-index:9000;
	}
	
	.slidecontrols-blog li:hover  {
		display:inline;
		float:right;
		height:31px;
		width:30px;
		background-color:#2B2B2B;		
	}
	
		
	.slidewrap h5 {
		float:left;
		margin-left:1px;
	}
	
	#sliderName {
		margin-top:4px;
	}
    
    


    /*  Lists  --------------------------------*/
	
	
	.widget .lists li {
        background: url(../images/news-list-ico.png) no-repeat 0 14px;
        display: block;
        padding: 10px 0 10px 13px;
    }
    .widget .lists li:last-child {
        border: none;
    }
    .widget .lists li a {
        color: #757B7F;
    }
    .widget .lists li a:hover {
        color: #23abf1;
    }

    





/* ------------------------------------------------------------------------------- */
/*  9.  News
/* ------------------------------------------------------------------------------- */


	.post {
        margin-bottom:50px;
        padding-bottom:30px;
		border-bottom:#f2f2f2 1px solid;
    }
    
	.post h2 {
        line-height: 1.4;
        margin: 0;
		margin-bottom:10px;
    }
	
	.post h2:hover {
        color:#23abf1;
    }
    
    .post-details .author, .post-details .date, .post-details .tag, .post-details .comment {
        color: #a2a2a2;
        display: inline-block;
        margin-right: 10px;
        padding: 12px 0 27px 0;
    }
    
	.post-details .author a, .post-details .date a, .post-details .tag a, .post-details .comment a {
        color: #a2a2a2;
    }
    
	.post-details .author a:hover, .post-details .date a:hover, .post-details .tag a:hover, .post-details .comment a:hover {
        color: #23abf1;
    }
	
	.post-details .author {
		padding:4px 10px 4px 30px;
        background: url(../images/blog_icon_admin.png) no-repeat 8px 4px #f2f2f2;		
		border-radius: 2px;
		-moz-border-radius: 2px;
		-webkit-border-radius: 2px;		        
    }    
	
    .post-details .date {
        padding:4px 10px 4px 30px;
        background: url(../images/blog_icon_date.png) no-repeat 8px 5px #f2f2f2;		
		border-radius: 2px;
		-moz-border-radius: 2px;
		-webkit-border-radius: 2px;
    }
    
	.post-details .tag {
        padding:4px 10px 4px 30px;
        background: url(../images/blog_icon_tags.png) no-repeat 8px 5px #f2f2f2;		
		border-radius: 2px;
		-moz-border-radius: 2px;
		-webkit-border-radius: 2px;
		margin-top:10px;
    }
    
	.post-details .comment {
        padding:4px 10px 4px 28px;
        background: url(../images/blog_icon_comments.png) no-repeat 8px 5px #f2f2f2;		
		border-radius: 2px;
		-moz-border-radius: 2px;
		-webkit-border-radius: 2px;
    }
    
	.post-content {
        display: block;
        position: relative;
    }
	
	.post-content .image {
        display: block;
        margin:30px 0px 20px 0px;
        max-width: 100%;
		
    }
	
    .post-content p {
        display: block;
        font-size: 12px;
		color:#757b7f;
    }
    
	.post-content a {
        color: #23abf1;
		padding-top:10px;
		font-size:12px
    }
    
	.post-content a:hover {
        color: #0082c5;
    }
	
	.post-content h1 {
		color:#23abf1;
		margin:25px 0px
	}

   
    

    /*  News Pagination  --------------------------------*/

    
	.pagination {
        margin: 0;
    }
    .pagination li {
        display: inline-block;
        list-style: none;
        margin: 0;
		background: #f2f2f2;
		border-radius: 2px;
		-moz-border-radius: 2px;
		-webkit-border-radius: 2px;
		margin-right:5px;
		font-size:12px;
		font-weight:bold;
    }
    .pagination li:last-child {
        margin-right: 0;
    }
    .pagination .current {
        background: #2b2b2b;
        color: #fff !important;
		border-radius: 2px;
		-moz-border-radius: 2px;
		-webkit-border-radius: 2px;
    }
    .pagination a, .pagination .current {
        color: #606060;
        display: inline-block;
        padding: 5px 10px;
    }
    .pagination a:hover {
        color: #fff;
		background: #23abf1;
		border-radius: 2px;
		-moz-border-radius: 2px;
		-webkit-border-radius: 2px;
    }
    .pagination .prev a {
        padding: 5px 15px;
    }
    .pagination .prev a:hover {
        color: #fff;
		background: #23abf1;
		border-radius: 2px;
		-moz-border-radius: 2px;
		-webkit-border-radius: 2px;
    }
    .pagination .next a  {
        padding: 5px 15px;
    }
    .pagination .next a:hover  {
        color: #fff;
		background: #23abf1;
		border-radius: 2px;
		-moz-border-radius: 2px;
		-webkit-border-radius: 2px;
    }


    
    /*  News comments  --------------------------------*/
	
	
	.comments-list {
        border-bottom: 1px solid #f2f2f2;
        margin: 35px 0 70px;
        padding: 0 0 10px;
    }
    .comment {
        border-top: 1px solid #f2f2f2;
        display: inline-block;
        margin-top: 10px;
        padding-top: 30px;
    }
    .comment .children .comment {
        margin-top: 10px;
        padding-top: 30px;
    }
	
	.comment .children .two .comment {
		width:620px
	}
	
    .comment:first-child {
        border-top: none;
        margin: 0;
        padding: 0;
    }
    
    .comment .avatar {
        display: block;
        float: left;
        position: relative;
        width: 60px;
        z-index: 1;
    }
    .comment .comment-text, .comment .comment-meta {
        float: right;
        width: 660px;
    }
    .comment .comment-meta {
        margin-top: -4px;
    }
    .comment .author {
        font-size: 12px;
		padding-top:4px;
		padding-bottom:10px;
        margin: 0;
        text-transform: capitalize;
    }
    .comment .author .reply {
        color: #939393;
        font-size: 11px;
        text-transform: capitalize;
		float:right;
    }
    .comment .author .reply:hover {
        color: #23abf1;
        font-size: 11px;
    }
    .comment .date {
        color: #cccccc;
        margin: 1px 0 8px;
		font-size:11px;
		font-style:italic;
    }
    .comment .children {
        padding-left: 60px;
    }
    .comment .children .comment {
        border-top: 1px solid #f2f2f2;
        position: relative;
    }
    .comment .children .comment-text, .comment .children .comment-meta {
        width: 600px;
    }
    .comment .children .children .comment-text, .comment .children .children .comment-meta {
        width: 540px;
    }

    

    
    /*  Comments Form  --------------------------------*/
	
	
	#comments input {		
		width:210px;
		float:left;
		margin-right:20px;
	}
	
	#comments input.last {		
		margin-right:0px;
	}

	
	

   






/* ------------------------------------------------------------------------------- */
/*  10.  Portfolio
/* ------------------------------------------------------------------------------- */

    /*  Projects Filter  --------------------------------*/
	
	
#filter {
	background: #f6f6f6;
	display: block;
	height: 70px;
	margin-bottom: 50px;
	position: relative;
	width: 1000px;
	text-align:center;
	color:#666;
	text-transform:lowercase;	
}




#filter a{	
	display: inline-block;
	font-size:16px;
	height: 70px;
	line-height: 70px;
	width:25%;
	color: #8a8e90;!important
}

#filter a:hover{
	text-decoration:none;
	background:#23abf1;
	color:#FFF;!important
	font-weight:lighter;
}

#filter a.active{
	background:#23abf1;
	width:25%;
	color:#FFF;!important
}


#projects, #projects3{
	display:block;
	overflow:hidden;
	width:100%;
	margin:0 auto;
}

.slider {margin-right:20px}


#projects li{
	float: left;
	height: 170px;
	list-style: none outside none;
	margin-right:20px;
	position: relative;
	width: 235px;
	margin-bottom:20px;	
}

#projects3 li{
	float: left;
	height: 230px;
	list-style: none outside none;
	margin-right:20px;
	position: relative;
	width: 320px;
	margin-bottom:20px;	
}

#projects2 li{
	float: left;
	height: 330px;
	list-style: none outside none;
	margin-right:20px;
	position: relative;
	width: 490px;
	margin-bottom:20px;	
}

#projects, #projects3, #projects2 ul{
	overflow:hidden;
	width:1020px
}

#projects ul.hidden{
	display:none;
}

    
    


    


    /*  Project Item Overlay  --------------------------------*/
	
		
   .view {
	   width: 100%;
	   height: 100%;   
	   float: left;   
	   overflow: hidden;
	   position: relative;
	   text-align: center;   
	   cursor: pointer;
	   /*margin-right:20px;
	   margin-top:20px;*/
	}
	
	#projects3 .view {
		width: 100%;
	   height: 100%;
		margin:0;
		}
		
	#projects2 .view {
		width: 100%;
	   height: 100%;
		margin:0;
		}			
	
	.view.last {
	   margin-right:0px;
	}
	
	.view .mask, .view .content {
	   width: 100%;
	   height: 100%;
	   position: absolute;
	   overflow: hidden;
	   top: 0;
	   left: 0;
	}

	.view .mask h1, .mask h3   {	
 		height:170px;
		top:20px;
		left:20px;
		color:#FFF;
		position:absolute;
	}
	
	.view .mask p  {	
		height:170px;
		top:60px;
		left:20px;
		color:#FFF;
		position:absolute;
		text-align:left;
	}

	.view img {
	   display: block;
	   position: relative;
	}
	
	.info {
	   background:url(../images/link.png) left no-repeat;
	   display: inline-block;
	   text-decoration: none;
	   text-indent:-9999px;
	   width:20px;
	   height:20px;
	   position:absolute;
	   bottom:20px;
	   left:20px;
	   float:left;
	}
	
	.video {
	   background:url(../images/video.png) left no-repeat;
	   display: inline-block;
	   text-decoration: none;
	   text-indent:-9999px;
	   width:20px;
	   height:20px;
	   position:absolute;
	   bottom:20px;
	   left:20px;
	   float:left;
	}
	
	.overlay .mask {
	   opacity: 0;
	   overflow:visible;
	   background: #23abf1;	   
	   -webkit-transition: all 0.4s ease-in-out;
	   -moz-transition: all 0.4s ease-in-out;
	   -o-transition: all 0.4s ease-in-out;
	   -ms-transition: all 0.4s ease-in-out;
	   transition: all 0.4s ease-in-out;
	}
	
	.overlay:hover .mask {
	   opacity: 1;
	   background: #23abf1;
	}
	.overlay:hover a.info {
		opacity:5;
		-moz-transition-delay: 0.3s;
		-webkit-transition-delay: 0.3s;
		-o-transition-delay: 0.3s;
		-ms-transition-delay: 0.3s;
		transition-delay: 0.3s;
	}


 

    /*  Project Details  --------------------------------*/

    .project-image{
		display: block;
    	position: relative;
	}
	
	.project-image .image {
		width:100%;
		opacity:0.9;
	}
	
	.image:hover {
		width:100%;
		opacity:1;
	}


    



/* ------------------------------------------------------------------------------- */
/*  11.  Contact
/* ------------------------------------------------------------------------------- */

	#contact-map{
		height:800px;
		width:100%;
		margin-top:-51px;
		margin-bottom:-50px;		
	}
	
	#contact-info {
		width:1000px;
		height:auto;
		top:550px;
		left:50%;
		margin-left:-500px;
		background-color:#fbfbfb;
		z-index:1000;
		position:absolute;
		border-radius: 3px;
		-moz-border-radius: 3px;
		-webkit-border-radius: 3px;
		-webkit-box-shadow: 0 0px 10px rgba(0, 0, 0, .2);
           -moz-box-shadow: 0 0px 10px rgba(0, 0, 0, .2);
                box-shadow: 0 0px 10px rgba(0, 0, 0, .2);		
	}
	
	#contact-details {
		margin-top:20px;
		margin-left:20px;
		line-height:22px
	}
	
	
	#contact-form {
		margin-top:20px;
	}
	
	#contact-form input {		
		width:205px;
		float:left;
		margin-right:20px;
	}
	
	#contact-form .btn-image {		
		width:auto;
		float:left;
		margin-right:20px;
		border:none;
		height:40px;
		margin-bottom:20px;
		cursor:pointer;
		line-height:18px;
	}
	
	#contact-form input.last {		
		margin-right:0px;
	}
	
	#contact-form textarea {
		width:700px;
	}
	
	input:focus.btn-image {
		background: url(../images/link.png) no-repeat 15px 10px #23abf1;
	}
	
	#message { 
		margin: 10px 0; 
		padding: 0; 
	}

	.error_message { 
		display: block; 
		height: 22px; 
		line-height: 22px; 
		background: #FBE3E4; 
		padding: 3px 10px 3px 8px; 
		color:#8a1f11;
		border: 1px solid #FBC2C4; 
		border-left:5px solid #FBC2C4; 
		width:696px;
	}



	fieldset {
		background-color: #EBF6E0;
		border: 1px solid #B3DC82;
		border-left:5px solid #B3DC82;
		color: #5F9025;
		padding:20px;
		margin-right:25px;
		}
			
	fieldset h1 {
		color: #516547;
		font-size:24px;
		}		



/* ------------------------------------------------------------------------------- */
/*  12.  Widgets
/* ------------------------------------------------------------------------------- */
	
   	.widget {
        margin: 0 0 50px;
    }

    /*  Categories  --------------------------------*/
	
	
	.widget .categories li {
        background: url(../images/news-list-ico.png) no-repeat 0 14px;
        border-bottom: 1px solid #f2f2f2;
        display: block;
        padding: 10px 0 10px 13px;
    }
    .widget .categories li:last-child {
        border: none;
    }
    .widget .categories li a {
        color: #757B7F;
    }
    .widget .categories li a:hover {
        color: #23abf1;
    }


     


    /*  Twitter Feed  --------------------------------*/
	
	#sidebar .twitter-post p {
        background: url(../images/icon_twitter_feed.png) no-repeat -2px 0px;
        color: #757B7F;
        padding-left: 25px;
    }
    #sidebar .twitter-post {
        color: #757B7F;
		margin-top:20px
    }
    #sidebar .twitter-post a {
        color: #23abf1;
    }
	
    #sidebar .twitter-post a:hover {
        color: #23abf1;
    }

   



 


/* ------------------------------------------------------------------------------- */
/*  13.  Footer
/* ------------------------------------------------------------------------------- */
	
	
	#footer {
        background: #2b2b2b;
        margin: 50px 0 0;
        padding: 20px 0 0;
    }
	
	#footer-center {        
		width:1000px;
		left:50%;
		margin-left:-500px;
		min-height:80px; 
		
    }
	
	#footer-center-bottom {        
		width:1000px;
		left:50%;
		margin-left:-500px;
		min-height:20px; 		
    }
	
	#footer-bottom {
        background: #1e1e1e;
        margin: 10px 0 0 0;
        padding: 20px;
    }
	
	.footer-left {		
		width:765px;
		float:left;		
	}
	
	.footer-right {
		height:auto;
		float:left;		
	}
	
	.footer-menu {
        float: left;
		margin-left:-25px;
		width:100%;		
    }
    
	.footer-menu li {
        float: left;
        position: relative;
		width:auto;		
    }
	

    .footer-menu a {
        color: #8c8c8c;		
        display: block;
        font-size: 12px;
        padding-right:25px;
		padding-left:25px;		
        position: relative;        
    }
	
    .footer-menu a:hover, .footer-menu .hover > a, .footer-menu .current > a {
       color: #fff;
    }
	
	.footer-address li {
		display:block;
		float:left;
		position:relative;
		margin-top:25px;
		margin-right:25px;
		padding-left:25px;
	}
	
	.footer-address img {
		margin-right:10px;
		position:absolute;
		margin-top:-2px;
		margin-left:-25px;}
	

 


    /*  Footer Newsletter  --------------------------------*/
	
	
	#footer-newsletter input {
		-webkit-transition: background 0.3s ease-in-out 0s;
		-moz-transition: background 0.3s ease-in-out 0s;
		-o-transition:background 0.3s ease-in-out 0s;
		-ms-transition:background 0.3s ease-in-out 0s;
		background: none repeat scroll 0 0 #3a3a3a;
		border: 0 none;
		color: #8c8c8c;
		float: left;
		font: 12px 'Helvetica', 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;
		height: 15px;
		margin: 0;
		padding: 10px;
		width: 175px;
		float:left;
	}

	#footer-newsletter input:focus {
		background: none repeat scroll 0 0 #1e1e1e;
		outline: 0 none;
	}



	#footer-newsletter button {
		-webkit-transition: background 0.3s ease-in-out 0s;
		-moz-transition: background 0.3s ease-in-out 0s;
		-o-transition:background 0.3s ease-in-out 0s;
		-ms-transition:background 0.3s ease-in-out 0s;
		background: url("../images/newsletter-icon.png") no-repeat scroll center center #3a3a3a;
		margin-left:5px;
		cursor:pointer;    
		height: 35px;
		text-indent: -99999em;
		width: 35px;
		border:0;
	}
	
	#footer-newsletter button:hover {
		background-color:#1e1e1e;
	}
    
  

    /*  Copyright & Social Links  --------------------------------*/
	

    .copyright li {
        display: block;
        float: left;
        margin-right: 30px;
    }
    .social-links {
        float: right;
    }
    .social-links li {
        display: block;
        float: left;
        height: 21px;
        margin: 0 0 0 8px;
        position: relative;
        text-indent: -9999px;
        width: 21px;
    }
    .social-links li a {
        position: absolute;
        -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
        filter: alpha(opacity=0);
        opacity: 0;
        top: 0; left: 0; bottom: 0; right: 0;
    }
    .social-links li a:hover {
        -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
        filter: alpha(opacity=100);
        opacity: 1;
    }
    .social-links .twitter {
        background: url(../images/icon_twitter.png) no-repeat;
        background-position: 0 -21px;
    }
    .social-links .twitter a {
        background: url(../images/icon_twitter.png) no-repeat;
    }
    .social-links .facebook {
        background: url(../images/icon_facebook.png) no-repeat;
        background-position: 0 -21px;
    }
    .social-links .facebook a {
        background: url(../images/icon_facebook.png) no-repeat;
    }
    .social-links .linkedin {
        background: url(../images/icon_linkedin.png) no-repeat;
        background-position: 0 -21px;
    }
    .social-links .linkedin a {
        background: url(../images/icon_linkedin.png) no-repeat;
    }

    .social-links .vimeo {
        background: url(../images/icon_vimeo.png) no-repeat;
        background-position: 0 -21px;
    }
    .social-links .vimeo a {
        background: url(../images/icon_vimeo.png) no-repeat;
    }









/* Tablet Portrait size to standard 960 (devices and browsers) */
    @media only screen and (min-width: 768px) and (max-width: 1020px) {
	
	body {
        overflow-x: hidden;
		
    }
		
	#body-wrapper {
		left: 50%;
		margin-left: -384px;
		position: relative;
		width: 768px;
		margin-right:0px
	}
	
	.container {
		margin: 0 18px;
		position: relative;
	}
	
	#navigation li {
		float: left;
		position: relative;
		width: 110px;
	}
	
	.feature-description h5 {
		font-size:12px;
		font-weight:bold;
	}
	
	.gray-box {
		width:684px;
		padding:20px;
	}
	
	.graybox-right {
		float: left;
	}
	
	#footer-center {
		left: 50%;
		margin-left: -364px;
		min-height: 160px;
		width: 728px;
	}
	
	.footer-left {		
		width:735px;
		float:left;		
	}
	
	.footer-right {
		margin-top:25px;
	}
	
	#footer-center-bottom {
		left: 50%;
		margin-left: -364px;
		min-height: 20px;
		width: 728px;
	}
	

	
	
/* About Us */
	
	
	.one-half.last.about {
		width: 460px;
		padding:0;
	}
	
	.one-half.last.about {    
		width: 354px;
	}

	.one-fourth.about {
		padding-left: 28px;
		width: 150px;
	}

	.one-fourth.last.about {
		padding-left: 0;
		width: 150px;
	}
	
	.user-grid li {
		display: inline-block;
		height: 220px;
		margin-right: 35px;
		margin-bottom: 35px;
		width: 220px;
	}
	
	#team {
		
		margin-top:30px;
		height: 100%;
		position: relative;
		width: 100%;
	}
	

/* Columns */


	.one-half {
		width: 354px;
	}
	
	.one-third {
		width: 229px;
	}

	.two-third {
		width: 479px;
	}
	
	.one-fourth {
		width: 167px;
	}
	
	.three-fourth {
		width: 540px;
	}


	
/* Pricing tables */	
	
	
	
	.pricing-table .column {
		width: 142px;
	}

	.pricing-table .level-max {
		width: 145px;
	}
	
	.pricing-table-second .column {
		width: 225px;
	}
	
	
	
/* Portfolio */	
	
	
	
	#filter {
		width: 728px;
	}
	
	#projects, #projects3, #projects2 ul {
		overflow: hidden;
		width: 750px;
	}
	
	#projects li {
		
		height: 167px;		
		margin-right: 20px;
		position: relative;
		width: 167px;
	}
	
	#projects3 li {
		width: 230px;
	}
	
	#projects2 li {
		width: 355px;
	}
	
	#main {
		width: 468px;
	}
	
	
	
/* News */		
	
	
	
	.comments-list {
		border-bottom: 1px dotted #E5E5E5;
		margin: 36px 0 70px;
		padding: 0 0 10px;
	}
	
	#comment {
		width: 468px;
	}
	
	.comment {
		display: inline-block;
		margin-top: 10px;
		padding-top: 30px;
	}
	
	.comment > div {
		display: inline-block;
		width: 100%;
	}
	
	.comment .children {
		padding-left: 80px;
	}
	
	.comment .comment-text, .comment .comment-meta {
		float: right;
		width: 390px;
	}
	
	.comment .children .comment {
		width:388px
	}
	
	.comment .children .comment {
		width:388px
	}
	
	.comment .children .comment-text, .comment .children .comment-meta {
		width: 310px;
	}
	
	.comment .children .children .comment-text, .comment .children .children .comment-meta {
		width: 228px;
	}
	
	#comments input {
		margin-bottom: 10px;
		width: 448px;
	}
	
	textarea {
		width: 448px;
	}
	
	
	
/* Contact */		
	
	
	
	#contact-info {
		margin-left: -364px;
		width: 728px;
	}
	
	#contact-form input {
		width: 138px;
	}
	
	#contact-form textarea {
		width: 500px;
	}
	
	.error_message {  
		width:495px; 
	}	
			
		
}







/* All Mobile Sizes (devices and browser) */
    @media only screen and (max-width: 767px) { 
	
	body {
        overflow-x: hidden;
		
    }
		
		
	#body-wrapper {
		left: 50%;
		margin-left: -260px;
		position: relative;
		width: 520px;
		margin-right:0px
	}
	
	.container {
		margin: 0 18px;
		position: relative;
	}
	
	#header-bg {
		height: 145px;
	}
	
	#header {
		height: 145px;
	}
	
	#sub-header-bg {
		height: 214px;
	}
	
	#logo {
		margin-left: 233px;
	}
	
	#navigation li {
		float: left;
		position: relative;
		width: 102px;
	}
	
	#navigation {
		float: left;
		margin-right:0px;
		border-top:#333 1px solid;
	}
	
	#features {
		width:520px;
	}
	
	.feature-description h5 {
		font-size:12px;
		font-weight:bold;
	}
	
	.one-fourth.second {
		margin-right:0px!important
	}
	
	.gray-box {
		width:440px;
		padding:20px;
	}
	
	.graybox-right {
		float: left;
	}
	
	#footer-center {
		left: 50%;
		margin-left: -245px;
		min-height: 200px;
		width: 490px;
	}
	
	.footer-left {		
		width:490px;
		float:left;		
	}
	
	.footer-right {
		margin-top:25px;
	}
	
	#footer-center-bottom {
		left: 50%;
		margin-left: -245px;
		min-height: 20px;
		width: 490px;
	}
	
	#back-top span {
		display: none;
	}


/* About Us */
	
	
	.one-half.last.about {
		width: 460px;
		padding:0;
	}
	
	.one-half.last.about {    
		width: 484px;
	}
	
	.one-half.last.about h5 {
		padding-left: 0px;
		padding-top: 20px;
	}

	.one-fourth.about {
		padding-left: 0px;
		width: 250px;
	}

	.one-fourth.last.about {
		padding-left: 0;
		width: 150px;
	}
	
	.user-grid li {
		margin-right: 0px;
		margin-bottom: 0px;
		width: 220px;
	}
	
	#team {
		
		margin-top:30px;
		height: 100%;
		position: relative;
		width: 100%;
	}	
	
	
/* Columns */


	.one-half {
		width: 484px;
		margin-bottom:20px;
	}
	
	.one-third {
		width: 484px;
		margin-bottom:20px;
	}

	.two-third {
		width: 484px;
		margin-bottom:20px;
	}
	
	.one-fourth {
		width: 484px;
		margin-bottom:20px;
	}
	
	.three-fourth {
		width: 484px;
		margin-bottom:20px;
	}
	
	
	
	
	
/* Pricing tables */		
	
	.pricing-table .column {
		width: 240px;
	}
	
	.pricing-table .level-max {
		width: 480px;
		margin-top:40px;
		margin-bottom:40px
	}
	
	.pricing-table-second .column {
		margin-bottom: 10px;
		margin-right: 20px;
		margin-top: 30px;
		width: 480px;
	}

	
	
	
	
/* Portfolio */
	
	#projects, #projects3, #projects2 ul {
		overflow: hidden;
		width: 520px;
		float:left;
	}
	
	#projects3 ul {
		padding-left:80px;
	}
	
	#projects li {
		margin-bottom: 14px;
		margin-right: 14px;
	
	}
	
	#filter {
		width: 480px;
	}
	
	
	
/* News */

	#main {
		width: 480px;
	}
	
	#sidebar {
		display:none;
	}
	
	.comments-list {
		border-bottom: 1px dotted #E5E5E5;
		margin: 36px 0 70px;
		padding: 0 0 10px;
	}
	
	#comment {
		width: 468px;
	}
	
	.comment {
		display: inline-block;
		margin-top: 10px;
		padding-top: 30px;
	}
	
	.comment > div {
		display: inline-block;
		width: 100%;
	}
	
	.comment .children {
		padding-left: 80px;
	}
	
	.comment .comment-text, .comment .comment-meta {
		float: right;
		width: 390px;
	}
	
	.comment .children .comment {
		width:388px
	}
	
	.comment .children .comment {
		width:400px
	}
	
	.comment .children .comment-text, .comment .children .comment-meta {
		width: 310px;
	}
	
	.comment .children .children .comment-text, .comment .children .children .comment-meta {
		width: 228px;
	}
	
	#comments input {
		margin-bottom: 10px;
		width: 448px;
	}
	
	textarea {
		width: 448px;
	}
	
/* Contact */		
	
	
	
	#contact-info {
		margin-left: -242px;
		width: 484px;
	}
	
	#contact-info .one-fourth {
		display:none;
	}
	
	#contact-form {
		margin-left: 20px;
	}
	
	#contact-form input {
		width: 112px;
	}
	
	#contact-form textarea {
		width: 422px;
	}
	
	.error_message {  
		width:418px; 
	}	
	
	
}



@media only screen and (max-width: 479px) {
	
	
	body {
        overflow-x: hidden;		
    }
		
		
	#body-wrapper {
		left: 50%;
		margin-left: -180px;
		position: relative;
		width: 360px;
		margin-right:0px
	}
	
	.container {
		margin: 0 10px;
		position: relative;
	}
	
	#header-bg {
		height: 145px;
	}
	
	#header {
		height: 145px;
		z-index:9999;
	}
	
	#sub-header-bg {
		height: 214px;
	}
	
	#logo {
		margin-left: 127px;
	}
	
	#navigation { display: none; }
		
		

    .js .selectnav {
		background-color:#3c3c3c;
        background-position: center right, top left;
        color: #959595;
        display: inline-block;
        font-size: 12px;
        padding: 10px 10px;
        width: 100%;
		z-index:999;
		cursor:pointer;
	`	margin: 0 0 30px;
    }
	
	#features {
		width:300px;
	}
	
	.feature-description h5 {
		font-size:12px;
		font-weight:bold;
	}
	
	.one-fourth.second {
		margin-right:0px!important
	}
	
	.gray-box {
		width:296px;
		padding:20px;
	}
	
	.graybox-right {
		float: left;
	}
	
	#footer-center {
		left: 50%;
		margin-left: -180px;
		min-height: 200px;
		width: 360px;
	}
	
	.footer-left {		
		width:360px;
		float:left;		
	}
	
	.footer-menu a {
    padding-right: 5px;
}
	
	.footer-right {
		margin-top:25px;
	}
	
	#footer-center-bottom {
		left: 50%;
		margin-left: -180px;
		min-height: 20px;
		width: 360px;
	}
	
	#back-top span {
		display: none;
	}
	
	
	
/* About Us */
	
	
	.one-half.last.about {
		width: 340px;
		padding:0;
	}
	
	.one-half.last.about {    
		width: 340px;
	}
	
	.one-half.last.about h5 {
		padding-left: 0px;
		padding-top: 20px;
	}

	.one-fourth.about {
		padding-left: 0px;
		width: 165px;
	}

	.one-fourth.last.about {
		padding-left: 0;
		width: 150px;
	}
	
	.user-grid li {
		margin-right: 0px;
		margin-bottom: 20px;
		width: 220px;
	}
	
	#team {
		
		margin-top:30px;
		height: 100%;
		position: relative;
		width: 100%;
	}	
	
	
	
	
/* Columns */


	.one-half {
		width: 340px;
		margin-bottom:20px;
	}
	
	.one-third {
		width: 340px;
		margin-bottom:20px;
	}

	.two-third {
		width: 340px;
		margin-bottom:20px;
	}
	
	.one-fourth {
		width: 340px;
		margin-bottom:20px;
	}
	
	.three-fourth {
		width: 340px;
		margin-bottom:20px;
	}
	
	
	
/* Pricing tables */		
	
	.pricing-table .column {
		width: 168px;
	}
	
	.pricing-table .level-max {
		width: 340px;
		margin-top:40px;
		margin-bottom:40px
	}
	
	.pricing-table-second .column {
		margin-bottom: 10px;
		margin-right: 20px;
		margin-top: 30px;
		width: 340px;
	}
	
	
	
/* Portfolio */
	
	#projects, #projects3, #projects2 ul {
		overflow: hidden;
		width: 340px;
		float:left;
	}
	
	#projects h5 {
		text-align:center;
		font-size:24px;
		margin-bottom:20px}
	
	#projects3 ul {
		padding-left:20px;
	}
	
	#projects li {
		margin-bottom: 20px;
		margin-right: 0px;
		margin-left:52px	
	}
	
	#projects2 li {
    height: 280px;
    width: 340px;
}
	
	#filter {
		width: 340px;
	}
	
	#filter a {
		font-size:12px;
	}
	


/* News */

	#main {
		width: 340px;
	}
	
	#sidebar {
		display:none;
	}
	
		.comments-list {
		border-bottom: 1px dotted #E5E5E5;
		margin: 36px 0 70px;
		padding: 0 0 10px;
	}
	
	#comment {
		width: 340px;
	}
	
	.comment {
		display: inline-block;
		margin-top: 10px;
		padding-top: 30px;
	}
	
	.comment > div {
		display: inline-block;
		width: 100%;
	}
	
	.comment .children {
		padding-left: 0px;
	}
	
	.comment .comment-text, .comment .comment-meta {
		float: right;
		width: 260px;
	}
	
	.comment .children .comment {
		width:388px
	}
	
	.comment .children .comment {
		width:340px
	}
	
	.comment .children .comment-text, .comment .children .comment-meta {
		width: 260px;
	}
	
	
	#comments input {
		margin-bottom: 10px;
		width: 320px;
	}
	
	textarea {
		width: 320px;
	}
	
	
/* Contact */		
	
	
	
	#contact-info {
		margin-left: -180px;
		width: 360px;
		height:auto;
	}
	
	#contact-info .one-fourth {
		display:none;
	}
	
	#contact-form {
		margin-left: 20px;
	}
	
	#contact-form input {
		width: 300px;
		margin-bottom:10px
	}
	
	#contact-form textarea {
		width: 300px;
	}
	
	fieldset {
		margin-right:0px;
		}
		
	.error_message {  
		width: 296px; 
	}			

		
		
	
	
	
	
	
}