/*

	01. Key Frames & Font Face
	02. Generals Settings
	03. Navigation
	04. Header Section Settings
	05. Works Section Settings
	06. Intersection Section Settings
	07. Services Section Settings
	08. whatwedo Section Settings
	09. Get The Template Interection Settings
	10. Footer lablog Section Settings
	11. Footer Intersection Settings
	12. Footer lablog Info Settings
	13. Media Queries for Mobile Settings
	14. Media Queries for iPad/Tablet Settings
			
*/


/* 01. KEY FRAMES FADE IN & FONT FACE ================================================== */


@font-face {
    font-family: 'Arvo';
    src: url('../fonts/arvo/arvo-regular-webfont.eot');
    src: url('../fonts/arvo/arvo-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/arvo/arvo-regular-webfont.woff') format('woff'),
         url('../fonts/arvo/arvo-regular-webfont.ttf') format('truetype'),
         url('../fonts/arvo/arvo-regular-webfont.svg#arvoregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@-webkit-keyframes Anim { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes Anim { from { opacity:0; } to { opacity:1; } }
@keyframes Anim { from { opacity:0; } to { opacity:1; } }
 
.fade-it {
    -webkit-animation:Anim ease-in 1;
    -moz-animation:Anim ease-in 1;
    animation:Anim ease-in 1;
    opacity: 0;
    filter: alpha(opacity=70);
    -webkit-animation-fill-mode:forwards;
    -moz-animation-fill-mode:forwards;
    animation-fill-mode:forwards;
    -webkit-animation-duration:3s;
    -moz-animation-duration:3s;
    animation-duration:3s;}
 
.fade-it {
	-webkit-animation-delay: 0.2s;
	-moz-animation-delay: 0.2s;
	animation-delay: 0.2s;}
	
@-webkit-keyframes Anim2 { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes Anim2 { from { opacity:0; } to { opacity:1; } }
@keyframes Anim2 { from { opacity:0; } to { opacity:1; } }
 
.fade-it2 {
    -webkit-animation:Anim2 ease-in 1;
    -moz-animation:Anim2 ease-in 1;
    animation:Anim2 ease-in 1;
    opacity: 0;
    filter: alpha(opacity=70);
    -webkit-animation-fill-mode:forwards;
    -moz-animation-fill-mode:forwards;
    animation-fill-mode:forwards;
    -webkit-animation-duration:1s;
    -moz-animation-duration:1s;
    animation-duration:1s;}
 
.fade-it2 {
	-webkit-animation-delay: 0.2s;
	-moz-animation-delay: 0.2s;
	animation-delay: 0.2s;}


	
/* 02. GENERALS SETTINGS ================================================== */



/* Selected text Color */

::-moz-selection{background:#6ec5e2;color:white}
::selection{background:#6ec5e2;color:white}

h1, h2, h3, h4, h5, h6 , h8 ,h9, h10, h11{ line-height: 1.15538em; padding-bottom: 0.273em; }
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { color: #aaa; }

body { 
	background:url("../img/ftl_top_banner.jpg") ;
	background-repeat:no-repeat;
	background-position:center;
	background-position:center 0px ;
	width:100%;
	height:100%;
	font-size:14px;
	font-family: 'Arvo', serif; }

.img{
	resize: none;
	height: 100%;
	width: 100%;
}

.centered {
	text-align: center;}

.clear {
	padding: 20px;}

h1 {
  	font-family: 'Arvo', sans-serif;
  	text-transform: uppercase;
  	margin: 0.75em 0.75em 0.25em;}

h2 {
  	font-family: 'Arvo', sans-serif;
	font-size: 56px;
	font-weight: 900, bold;
  	text-transform: uppercase;
  	margin-top: -14px;}
  
h3 {    
	background: url("../img/line.gif") no-repeat scroll center 55px transparent;
	color: #4D4C4C;
	font:16px 'Arvo', serif;
	letter-spacing: 2px;
	padding-bottom: 35px;
	padding-top: 25px;
	text-align: center;}

h4 {    
    color: #4D4C4C;
    font: 14px 'arvolight', sans-serif;
    letter-spacing: 2px;}


.lead {
	color:#686868;}
	
/* Link */

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

a:hover {
	color: #e5e5e5;}  
	
/* Paragrah */

p a {
	font-family: 'Arvo', sans-serif;
	color:#aaa;
	border-bottom: 1px dotted #888;
	-webkit-transition: all 0.5s ease-out;
  	-moz-transition: all 0.5s ease-out;
  	-o-transition: all 0.5s ease-out;
  	transition: all 0.5s ease-out;}

p a:hover {
	color:#333;}

/* Button */

.buttom {
	margin-top: 200px;
	background: #a0cac0;
    border-bottom: 4px solid #68a697;
    color: #FFFFFF;
    font-family: 'arvolight', sans-serif;
    text-transform: uppercase;
    padding:15px 20px;
    font-size: 16px;
    line-height: 50px;
    min-width: 150px;
    text-align: center;
    -webkit-transition: all 0.2s ease-out;
  	-moz-transition: all 0.2s ease-out;
  	-o-transition: all 0.2s ease-out;
  	transition: all 0.2s ease-out;}

.buttom:hover {
	background: #93b7ae;
	color:#FFF;}



/* 03. NAVIGATION ================================================== */



nav #logo {
	float:left;
	z-index: 99999;
	}
	
nav {
	z-index: 999;
	width: 100%;
	height: 68px;
	background-color:#000000;
	opacity:0.6;
	filter:alpha(opacity=60);
}


/* Some stylesheet reset */
#nav, #nav ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

/* The main navigation bar */
#nav {
	width: 100%; /* The menu will take the width of its container */}

#nav>li {
	float: right;
	position: relative;
	padding: 0px 0;}

/* The main navigation links */
#nav>li>a {
	/* Layout */
	display: block;
	padding: 0px 0px 0 30px;

	/* Typography */
	font-family: 'Arvo', sans-serif;
	font-size: 16px;
	color: #FFFFFF;
	text-decoration: none;
	
	/* Transitions */
	-webkit-transition: color .2s ease-in, border-top-color .2s ease-in;
	-ms-transition: color .2s ease-in, border-top-color .2s ease-in;
	-moz-transition: color .2s ease-in, border-top-color .2s ease-in;
	-o-transition: color .2s ease-in, border-top-color .2s ease-in;
	transition: color .2s ease-in, border-top-color .2s ease-in;}

/* The hover state of the links */
#nav li:hover a, #nav li .selected {
	color: #E95855;}

#nav>li.dropdown>a {
	padding-right: 28px;}

/* The arrow indicating a dropdown menu */
.dropdown>a::after {
	position: absolute;
	display: block;
	content: "";
	height: 0;
	width: 0;
	border: 4px solid transparent;
	border-top-color: inherit;
	right: 11px;
	top: 21px;}

/*  The submenus */
#nav ul {
	display: block;
	position: absolute;
	top: 43px;
	left: -9999px;
	opacity: 0;
	background: #272727;
	cursor: pointer;
	border-bottom-left-radius: 3px;
	border-bottom-right-radius: 3px;
	-webkit-transition: opacity .22s ease-in;
	-ms-transition: opacity .22s ease-in;
	-moz-transition: opacity .22s ease-in;
	-o-transition: opacity .22s ease-in;
	transition: opacity .22s ease-in;}

#nav ul li {
	display: block;
	position: absolute;
	height: 0px;
	-webkit-transition: height .15s ease-in;
	-ms-transition: height .15s ease-in;
	-moz-transition: height .15s ease-in;
	-o-transition: height .15s ease-in;
	transition: height .15s ease-in;}

/* The submenu appears when its parent is hovered */
#nav>li:hover>ul {
	left: 0px;
	opacity: 1;}

#nav li:hover>ul>li {
	position: relative;
	height: 31px;}

/* The submenu links */
#nav ul li a {
	/* Layout */
	display: block;
	padding: 7px 12px 7px 22px;
	width: 130px;

	/* Typography */
	font-family: 'arvolight', sans-serif;
	font-size: 16px;
	text-decoration: none;
	color: #aaa;
	
	/* Background & effects */
	background: #FFF;
	-webkit-transition: color .2s ease-in, border-left-color .2s ease-in;;
	-ms-transition: color .2s ease-in, border-left-color .2s ease-in;;
	-moz-transition: color .2s ease-in, border-left-color .2s ease-in;;
	-o-transition: color .2s ease-in, border-left-color .2s ease-in;;
	transition: color .2s ease-in, border-left-color .2s ease-in;;}

/* Rounded corners for the last submenu link */
#nav ul>li:last-child>a {
	border-bottom-left-radius: 3px;
	border-bottom-right-radius: 3px;}

/* Changing the link color on hover */
#nav ul li:hover>a {
	color: #fff;}
 
.cbp-af-header {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 10000;
	height: 70px;
	overflow: hidden;
	-webkit-transition: height 0.3s;
	-moz-transition: height 0.3s;
	transition: height 0.3s;}

/* FOR REDUCING THE HEIGHT OF THE NAVIGATION */

.cbp-af-header #logo {
	padding:23px 0px 0px 0px; 
	width:270px;}

.cbp-af-header #nav a {
	line-height: 100px;}

.cbp-af-header.cbp-af-header-shrink #logo { 
	padding:0px 20px 0px 0px; 
	}

/* Transitions and class for reduced height */

.cbp-af-header #logo,
.cbp-af-header #nav a {
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;}

.cbp-af-header.cbp-af-header-shrink {
	height: 50px;}

.cbp-af-header.cbp-af-header-shrink #nav a {
	line-height: 50px;}


    
/* 04. HEADER SETTINGS ================================================== */



#header {
	background: url('../img/ftl_head_banner.png') no-repeat;/* COLOR ON MOBILE DEVICE ON LINE 980 */
	background-position:center;
	background-repeat:no-repeat;
	-webkit-background-size: 1126px 497px;
	-moz-background-size: fixed;
	-o-background-size: fixed;
	padding:88px 0 180px 0;
	margin-top:38px;
	font-family: 'Arvo', sans-serif;
}

#header h2 {
	color:#FFF;
	font-family: 'Arvo', sans-serif;
	margin-top: -14px;
	margin-bottom: -10px;
}

#header h9 {
	font-family: 'Arvo', sans-serif;
	font-size: 56px;
	font-weight: 900, bold;
  	text-transform: uppercase;
  	margin-top: -26px;
	color: 494949;
}

#header h10 {
	color:777777;
	font-family: 'Arvo', sans-serif;
	font-size: 56px;
	font-weight: 900, bold;
  	text-transform: uppercase;
  	margin-top: -14px;
}

#header h11 {
	color:#a0a0a0;
	font-family: 'Arvo', sans-serif;
	font-size: 56px;
	font-weight: 900, bold;
  	text-transform: uppercase;
  	margin-top: -14px;
}

#title_experiment {
	background: #f1f1f1; 
	background: url('../img/title_experiments.png');
	background-position:center;
	background-repeat:no-repeat;
	padding: 142px;
	margin-top: -50px;
}

#title_whatwedo {
	padding: 100px;
	background: url('../img/title_whatwedo.png');
	background-position:center;
	background-repeat:no-repeat;
	margin-top: 0px;
	margin-bottom: -50px;
}



#header .lead {
	font: 35px 'Arvo', serif;
	font-size:2rem;
	color:#FFF;}  



/* 05.experiments SETTINGS ================================================== */



/* Section */

#icon_experiment4{
	background: url('../img/icon/experiment/icon_experiment_1.png') no-repeat scroll center 0px transparent;
	padding:55px;
	margin-top: -200px;

}	

#icon_experiment3{
	background: url('../img/icon/experiment/icon_experiment_2.png') no-repeat scroll center 0px transparent;
	padding:100px;
	margin-top: -110px;


}	

#icon_experiment2{
	background: url('../img/icon/experiment/icon_experiment_3.png') no-repeat scroll center 0px transparent;
	padding: 55px;
	margin-top: -110px;
}	

#icon_experiment1{
	background: url('../img/icon/experiment/icon_experiment_4.png') no-repeat scroll center 0px transparent;
	padding:55px;
	margin-top: 6px;
}


#experiments {
	background: url('../img/bg_grey.jpg');
	background-repeat: repeat-y;
	background-position:0px 750px;
	background-position: center;
	padding: 0px 0;
	padding-bottom: 80px;}

/* Projects Grid */

#projects_grid {
    overflow: hidden;}

.items {
    clear: both;
			
}

.item {width:100%; height:100%;}

.items img {
    display: block;
	padding-bottom: 15px;
	}
    
.items:after {
    content: '';
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;}
    
.items a,
.items a img {
    display: block;
    position: relative;
	}
    
.items a {
    overflow: hidden;}
    
.items a div {
    position: absolute;
    background: rgba(0, 0, 0, 0.4);
    width: 100%;
    height: 100%;
    cursor: pointer;}
    
.items a div h5 {
    display: block;
    margin: 40% 20px 0px 20px;
    text-transform: uppercase;
    color: #FFF;
    font-size: 16px;
    letter-spacing: 2px;
	font-family: 'Arvo', serif;
    text-align: center;}
    
.items  h6 {
    display: block;
    margin: 0px 20px 0px 20px;
    color: #318aa7;
    font-size: 17px;
	font-family: 'Arvo', serif;
    text-align: center;}
	
.items  h7 {
    display: block;
    margin: 10px 20px 0px 0px;
    color: #727171;
    font-size: 12px;
	font-family: 'Arvo', serif;
	line-height: 15px;
    text-align: center;}
	
hr {
	padding: 0px, 12px, 0px,0px;
	margin: 10px 0px 2px 0px;
	border-width:1px;
	width: 100%;
	text-align:center;
	border-left: 50px;
	align: center;
}

.items a div  span {
    font-size: 14px;
    display: block
    color: #ddd;
    text-transform: uppercase;
    letter-spacing: 2px;}
	
	

/* Expander of the works Settings */

.slide_portfolio {
	text-align:center;
	display:none;
	padding:10px 0;}

/* Space between img */

.slide_portfolio img{
	padding: 20px 0;}

/* Title of the Work */

.slide_portfolio h3 {    
	background: url("../img/line.gif") no-repeat scroll center 30px transparent;
	color: #318aa7;
	font: 16px 'Arvo', sans-serif;
	letter-spacing: 2px;
	padding-bottom: 35px;
    padding-top: 0px;
	text-align: center;
}

.slide_portfolio p{
	font: 12px 'Arvo', sans-serif;
	color: #727171;
}

/* Close Icon */

.slide_portfolio .closeit {
	cursor: pointer;
	margin-top:100px;
	margin-bottom:0px;}

/* ISOTOP OF WORKS ITEMS DONT TOUCH ! */

@-moz-document url-prefix() { 

}
.isotope-item {
    z-index: 2;
    display: block !important;
}
.isotope-hidden.isotope-item {
    pointer-events: none;
    z-index: 1;
}
.isotope,
.isotope .isotope-item {
    -webkit-transition-duration: 1s;
    -moz-transition-duration: 1s;
    -ms-transition-duration: 1s;
    -o-transition-duration: 1s;
    transition-duration: 1s;
}
.isotope {
    -webkit-transition-property: height, width;
    -moz-transition-property: height, width;
    -ms-transition-property: height, width;
    -o-transition-property: height, width;
    transition-property: height, width;
}
.isotope .isotope-item {
    -webkit-transition-property: -webkit-transform, opacity;
    -moz-transition-property: -moz-transform, opacity;
    -ms-transition-property: -ms-transform, opacity;
    -o-transition-property: top, left, opacity;
    transition-property: transform, opacity;
}
.isotope.no-transition,
.isotope.no-transition .isotope-item,
.isotope .isotope-item.no-transition {
    -webkit-transition-duration: 0s;
    -moz-transition-duration: 0s;
    -ms-transition-duration: 0s;
    -o-transition-duration: 0s;
    transition-duration: 0s;
}



/* 06. INTERSECTION SETTINGS ================================================== */



/* Section */

#interblock {
	width: 100%; 
	height: auto; 
	background: #de5d40;
	padding:120px 0;
	visibility: hidden;
	font-family: 'Arvo', sans-serif;
	}

/* Blockquote */

#interblock h2 {
	font-size:3rem; 
	font-family: 'Arvo', sans-serif;
	color:#FFF;}

/* Text under the Blockquote */

#interblock p {
	color:#FFF; 
	font-size:1.3rem; 
	font-family: 'Arvo', serif;
	font-family: 'Arvo', sans-serif;
	}

/* Icon button */

#interblock .buttongo {
	font-size:50px; 
	padding:30px 0; 
	text-align: right;}

#interblock .buttongo a {	
	cursor: pointer;
	-webkit-transition:all .25s cubic-bezier(0.25,0.46,0.45,0.94);
	-moz-transition:all  .25s cubic-bezier(0.25,0.46,0.45,0.94);
	-o-transition:all  .25s cubic-bezier(0.25,0.46,0.45,0.94);
	transition:all  .25s cubic-bezier(0.25,0.46,0.45,0.94); }

/* Hover Icon button */
	
#interblock .buttongo a:hover {
	opacity: 0.7;}



/* 07. SERVICES SETTINGS ================================================== */

#icon_whatwedo4{
	background: url('../img/icon/whatwedo/icon_whatwedo_1.png') no-repeat scroll center 0px transparent;
	padding:55px;
	margin-top: -200px;
	visibility: hidden;
}	

#icon_whatwedo3{
	background: url('../img/icon/whatwedo/icon_whatwedo_2.png') no-repeat scroll center 0px transparent;
	padding:100px;
	margin-top: -110px;
	visibility: hidden;
}	

#icon_whatwedo2{
	background: url('../img/icon/whatwedo/icon_whatwedo_3.png') no-repeat scroll center 0px transparent;
	padding: 55px;
	margin-top: -110px;
}	

#icon_whatwedo1{
	background: url('../img/icon/whatwedo/icon_whatwedo_4.png') no-repeat scroll center 0px transparent;
	padding:55px;
	margin-top: -69px;
}

/* Section */

#whatwedo {
	padding:0px 0px 100px 0; 
	margin-bottom: 50px;
	}

/* The Title of the service */

#whatwedo h3{
	background: none; 	
	padding-bottom: 10px;
	padding-top: 0px; 
	text-align: left;}

/* Make the img 100% */

#whatwedo img {
	width: 100%; 
	padding:5px;}
	
/* Style of each service */

#whatwedo .service {
	background: #FFF;
	border-bottom: 4px solid #e5e5e5;
	margin-bottom: 20px;
	padding:20px;}



/* 08. whatwedo SETTINGS ================================================== */



/* About the annimation on hover of each member please refer to the hoverex-all.css file */

/* Section */

#whatwedo {
	padding:0px 15px 40px -0px; 
	margin-top: -50px;
	}

/* Make the Picture 100% */

#whatwedo img {
	height: 280px;
	width: 280px;
	}

/* Style of each member block */

#whatwedo .member {
	width: 280px;
	margin:20px 15px 20px 15px; 
	padding-bottom:20px; 
}

/* Name of the member */

#whatwedo .member h3 {
  	background: none;
	letter-spacing: 0px;
	color: #c13121;
	font-size: 17px;
	font-family: 'Arvo', sans-serif;
	padding-bottom: 0px;
	padding-top: 10px;
	text-align: left;
}

/* Job in the studio */

#whatwedo .member h4 {
	letter-spacing: 0px;
	text-align:justify;
	font-family: 'Arvo', sans-serif;
	font-size: 14px;
	color: #727171;
	text-align: left;}



/* 09. GET THE TEMPLATE INTERSECTION SETTINGS ================================================== */



/* Section */

#getit {
	width: 100%; 
	height: auto; 
	background: #363B48;
	padding:120px 0; }

/* Quote align Center */

#getit h2 {
	text-align: center;
	font-size:1.75rem; 
	margin-bottom: 25px; 
	color:#FFF;}



/* 10. lablog SETTINGS ================================================== */


/* Section */

#lablog {
	padding:32px 0; 
	background: url("../img/bg_lablog.jpg") no-repeat scroll center 0px transparent;
	height: 612px;
	line-height: 14px;
	font-family: 'Arvo', sans-serif;
}

#icon_lablog1{
	background: url('../img/icon/contact/icon_contact_1.png') no-repeat scroll center 0px transparent;
	padding: 55px;
	margin-top: -140px;
	visibility: hidden;
	font-family: 'Arvo', sans-serif;
}	

#icon_lablog2{
	background: url('../img/icon/contact/icon_contact_2.png') no-repeat scroll center 0px transparent;
	padding:70px;
	visibility: hidden;
	font-family: 'Arvo', sans-serif;
}	

#icon_lablog3{
	background: url('../img/icon/contact/icon_contact_3.png') no-repeat scroll center 0px transparent;
	padding:55px;
	margin: -110px;
	font-family: 'Arvo', sans-serif;
}	

#icon_lablog4{
	background: url('../img/icon/contact/icon_contact_4.png') no-repeat scroll center 0px transparent;
	padding:55px;
	margin: -100px;
	font-family: 'Arvo', sans-serif;
}


#lablog .title_lablog{
	background: url('../img/title_lablog.png') no-repeat scroll center 0px transparent;
	padding-top: 50px;
	padding-bottom: 25px;
	top: 0;
	left: 0;
	font-family: 'Arvo', sans-serif;
}
#lablog img{
	padding:7px 0; 
	padding-left: 16px;
	padding-top: 29px;
	resize: none;
	font-family: 'Arvo', sans-serif;
}

#lablog p{
	padding: 5px;
	padding-top: 100px;
	font-size: 18px;
	color: #c13121;
	line-height: 18px;
	font-family: 'Arvo', sans-serif;
}

#lablog hr{
	margin-left: 6px;
	width: 80%;
	border-color: #727171;
	padding-top: 3px;
	padding: 0px;

	
}

#lablog .btn{
	alignment-adjust: middle;
	text-align: left;
	margin-top: -20px;
	margin-left: -20px;
}

#lablog h8{
	padding: 0px;
	padding-left: 20px;
	background: url("../img/lablog_tag.png") no-repeat scroll left -2px;
	background-position: 7px;
	color: #c13121;
	font-size: 12px;
	text-transform: uppercase;
	line-height: 0px;
	margin-top: -1px;
	font-family: 'Arvo', sans-serif;
}

#lablog h9{
	margin-top: 0px;
	line-height: 13px;
	color: #727171;
	font-size: 13px;
	padding: 3px 10px 0px 8px;
	letter-spacing: 0px;
	text-align: left;
	display: block;
	font-family: 'Arvo', sans-serif;
}

#lablog .more{
	margin-left: -35px;
	margin-top: 12px;
	padding:0px;
	padding-top: 80px;
}

#lablog .more hr{
	width:100%;
	margin-top: -13px;
	padding: 0px;
	
}

#lablog .more h9{
	display: block;
	padding-top: 15px;
	padding-bottom: 20px;
}

/* label *form {overflow:hidden}

.lablog form label {
	float:left; 
	padding-bottom: 5px;}
		
.lablog form label span {
	color:#D1D1D1;}
	


/* 11. INTERBLOCK FOOTER SETTINGS ================================================== */



/* Section */

#interblock_footer { 
	padding: 20px 0; 
	padding-left: 0px;
	padding-top: 50px;
	background: #FFF; 
	color:#FFF;
	font-family: 'Arvo', sans-serif;
	}

/* Blockquote */

#interblock_footer h2 {
	font-size:20px;  
	color: #c13121;
	text-transform:lowercase;
	font-family: 'Arvo', sans-serif;
	}
	
#interblock_footer .copy{
	margin-left: -20px;
	margin-top: -10px;
	font-family: 'Arvo', sans-serif;
}
/* Text under blockquote */

#interblock_footer p {
	color:#727171; 
	font-size:12px; 
	line-height: 16px;
	font-family: 'Arvo', sans-serif;
	}



/* Padding top for well displayed Icon */

#interblock_footer ul {
	padding:10px 0 0 0;
	margin-right: -53px;
	font-family: 'Arvo', sans-serif;
	}
	
	
/* Display inline the icon */

#interblock_footer li{
	display:inline;}





/* Styling Icon */

#interblock_footer .icon{ 
	color:#FFF;
	display:inline-block;
	padding:10px  10px ;
	font-style: normal; 
	-webkit-transition:all .25s cubic-bezier(0.25,0.46,0.45,0.94);
	-moz-transition:all  .25s cubic-bezier(0.25,0.46,0.45,0.94);
	-o-transition:all  .25s cubic-bezier(0.25,0.46,0.45,0.94);
	transition:all  .25s cubic-bezier(0.25,0.46,0.45,0.94); 
	font-size: 50px; }

/* Icon Hover */

#interblock_footer .icon:hover {
	opacity:0.7;}



/* 12. FOOTER lablog INFO SETTINGS ================================================== */



/* Section */

#contact_info {
	font-family: 'Arvo', sans-serif;
	background: url("../img/bg_contact.jpg") no-repeat scroll center 0px transparent;
	padding:0px;
	color: #FFF;
	text-transform: uppercase;
	border-bottom: none;}


	
/* 13. MEDIA QUERIES FOR MOBILE SETTINGS ================================================== */

.mobile-menu {
	display:none;
	background: #FFF;
	width:100%;
	z-index: 99999999;
	position: absolute;
	top:0;
	border-bottom: 1px solid #BBB;}
	

.mobile-menu .row {
	background: #F5F5F5;
	padding-top:10px;
	padding-bottom: 10px;}
	

.mobile-menu-inner .nav-mobile li {
	color: #4D4C4C;
	display: block;
	width: 100%;
	cursor: pointer;
	margin-top: 2%;
	background-color: #fFF;
	border-bottom: 4px solid #e5e5e5;
	padding: 6px 20px 5px;
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-ms-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;	}
	

.mobile-menu-inner .nav-mobile li:hover {
	background-color: #F17C71;
	border-bottom: 4px solid #E95855;	}
	

.mobile-menu-inner .nav-mobile li:hover a {
	color: #fFF;	}
	

.mobile-menu-inner .nav-mobile li a {
	display: block;
	width:100%;
	color: #4D4C4C;
	text-transform:uppercase;
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-ms-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;	}
	

#collapse {
	display:none;}


.mobile-menu h3 {
	background: url("../img/line.gif") no-repeat scroll center 55px transparent;
	color: #4D4C4C;
	font: 16px 'arvo', sans-serif;
	letter-spacing: 2px;
	font-weight: 700;
	padding-bottom: 35px;
	padding-top: 25px;
	text-align: center;
	text-transform: uppercase;}


/* Styling for mobile devices */


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

	/* Display the mobile menu */
	
	.mobile-menu {display:block;}	

	form  { overflow:hidden; }
	
	/* Header Lower height & Color*/
	
	#header { margin-top: 0px; padding:150px 0 100px 0; background-color: #353847; }
	
	/* Not Showing the Navigation */

	.cbp-af-header {display: none;}
	
	/* Align Center the interblock Text & Button */
	
	.container .interblock_footer , .container .interblock_footer .buttongo {text-align: center;}
	
	/* Lower height of the interblock footer */
	
	.container .interblock_footer {padding:0px 0 20px 0 ;}
	
	/* Not Showing the text on the interblock Footer */
	
	.container .interblock_footer p, .interblock_footer h2 {display: none;}
	
	/* Bigger Social Icon */
	
	.interblock_footer .icon { font-size: 40px; text-align: center; }
	
    .interblock_footer ul {text-align: center;}
    
    /* Align center the lablog Info footer text */
    
    #lablog_info p {text-align: center;}
    
    /* 100% Width of works Items & IMG */
    
    #projects_grid .items .item {width: 100%; margin-left:0;}
    
    #projects_grid .items .item img {width:100%;}
    
    /* Lower margin-top for better scrolling */
    
    .slide_portfolio .closeit { cursor: pointer; margin-top:10px; margin-bottom:0px;}
    
    /* Padding on Portfolio Detail Text */
    
    #portfolio_detail p {padding: 0 20px;}
    
    /* Filter Function takes all the width */
    
    #projects_grid .filter li a { width: 100%; margin-top: 2%;}
    
    /* whatwedo Row takes all the width */
    
    #whatwedo .row {width:100%;}
    
    /* 100% of the Member Pictures */
    
    .row .member img { width: 100%; height:auto; }
    
    /* Not Showing the interblock button Go To ( useless with iphone ) */
                
    .buttongo {display: none;}

    /* Service Settings */
    
    .service .service {width:100%; margin-bottom: 2%; margin-top: 2%;}
    
    /* Align center the Title of each Service */
    
    .service .service h3 {text-align: center;}
    
    /* Don't show the Text of each Service ( too much for scrolling ) */
    
    .service .service p {display: none;}
    
    /* 100% Width of Each Service Picture */
    
    .service .service img {width:100%; }
       
}



/* 14. MEDIA QUERIES FOR TABLET SETTINGS ================================================== */



@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px)
and (-webkit-min-device-pixel-ratio: 1)  {
	

	#projects_grid .items .item  {width:48%;}
	
	.service .service p {display: block;}
	
	.buttongo {display: block; cursor: pointer;}
	
	.interblock  {text-align: left;}
	
	/* Lower height of the interblock footer */
	
	.interblock_footer {padding:0px 0 20px 0 ;}
	
	/* Not Showing the text on the interblock Footer */
		
	.interblock_footer .eight.columns {display: none;}
	
	/* Bigger Social Icon & Align Center the Icon*/
	
	.interblock_footer .four.columns {width:100%; text-align: center;}
	
	.interblock_footer .icon { font-size: 40px;}
		
}

.hidden {
	display:none;
}