/*


Theme Name: WebDeveloped


Theme URI: 


Description: 


Author: Web Developed Inc.

Author URI: 

Tags: responsivefoo

*/



/* Global */

/*
font-family: 'Oswald', sans-serif;
font-family: 'Open Sans Condensed', sans-serif;
font-family: 'Open Sans', sans-serif;
font-family: 'Marcellus', serif;
*/

* { margin: 0; padding: 0; }

body { font-size: 14px; font-family: 'texgyreherosregular', 'Open Sans', Arial, sans-serif; margin: 0; color: #737373; }
.load_fade { display: block; background: #2d343e; position: fixed; width: 100%; height: 100%; z-index: 99999; top:0; left:0; }
#logo-anim { width: 350px; height: 197px; display: block; margin: -100px 0 0 -175px; background-image: url(images/wd-logo-animation.png); position: absolute; top: 50%; left: 50%; z-index: 99999; }


.alignright {float:right; padding:0; max-width: 45%; margin: 2.5%; }
.alignleft {float:left; padding:0; max-width: 45%; margin: 2.5%; }
.aligncenter {display: block; margin: 0 auto;  }
img.alignright {float:right; margin:0; width: 49.7%; }
img.alignleft {float:left; margin:0; width: 49.7%; }
img.aligncenter, img.alignnone {float:left; display: block; margin: 0 auto; }



h1, h2, h3, h4, h5 { font-weight: normal; }

h1 {
    color: #9094a0;
    font-size: 36px;
    font-weight: 300;
    line-height: 1;
    margin: 0;
}

h2 {
    color: #2d343e;
    font-size: 25px;
    margin: 0 0 10px 0;
	
}

h4, h4 a {
    color: #333333;
    font-size: 14px;
    line-height: 20px;
    margin: 0 0 5px 0;
    font-weight: 600;
}

h4 a:hover { color: #000000; text-decoration: none; }

h5 {
    color: #2d343e;
    font-size: 18px;
    line-height: 30px;
    margin: 0 0 20px 0;
}

p { line-height: 26px; }

img { border: none; }
.left { float: left; }
.right { float: right; }
.clear { clear: both; }
a { color: #0997cb; text-decoration: none; outline: 0; }
a:hover { color: #00bbff; }
.website_title { color: #757472; font-size: 20px; }


.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}
 
.clearfix {
	display: inline-block;
}
 
html[xmlns] .clearfix {
	display: block;
}
 
* html .clearfix {
	height: 1%;
}


/* Header */

#head-wrapper { margin: 0 auto; padding: 0; width: 100%; height: auto; background: #fff; position: fixed; top: 0; z-index: 999; border-bottom: 1px solid #f1f1f1;
 -webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}

.head-normal { overflow: visible; }
.head-small { }

#nav-wrapper { height: 80px; position: relative; float: right; background-image: url(images/menu.png); background-repeat: no-repeat; background-position: right 20px top 80px; background-position: 90% 180%;
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}

.default { height: 90px; }
.small { height: 70px; margin-top:-20px !important; }
.small-menu { height: 90px !important; margin-top:-50px !important; padding:0 0 20px 0; background-position: 90% 95% !important; }
.small-menu:hover { height: 70px !important; margin-top:0px !important; padding:0 !important; background-position: 90% 180% !important; }
.click-menu { height: 70px !important; margin-top:0px !important; padding:0 !important; background-position: 90% 180% !important; }


#header { margin: 0 auto; padding: 0; max-width: 1500px; position: relative;
 -webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
#logo_cont { padding: 0; margin: 0; float: left; max-width: 100%; 
 -webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
#logo_cont img { padding: 0; margin: 0; float: left; max-width: 100%; }
.logo-default { background: url(images/logo-1.png) 0 0 !important; width: 350px; height: 89px; }
.logo-small { background: url(images/logo-1.png) 0px -70px !important; width: 380px; height: 70px; }

#wprmenu_bar {
	position:fixed !important;
	top:0 !important;;
        left: inherit !important;
	right:0px !important;
	background: transparent !important;
	padding:35px !important;
	width:50px !important;
	display: none;
	cursor: pointer;
	z-index: 99998 !important;
	overflow: hidden;
	height:30px !important;
	display: none;
	-moz-transition: all 0.4s ease; /* FF3.7+ */
	-o-transition: all 0.4s ease; /* Opera 10.5 */
	-webkit-transition: all 0.4s ease; /* Saf3.2+, Chrome */
	transition: all 0.4s ease;
}

#wprmenu_menu.top { position: absolute !important; top: 0px !important; z-index: 11 !important; }
#wprmenu_menu ul li a { width: 100% !important; }

#menu_container { margin: 0; padding: 36px 0 0 0; height: 30px; float: right;
 -webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
#menu_container ul { list-style-type: none; margin: 0 125px 0 10px; padding: 0; height: auto; float: left; letter-spacing: 0; }
#menu_container ul li { font-size: 12px; float: left; padding: 0; text-transform: uppercase; }
#menu_container ul li a { padding: 10px 15px; color: #2d343e; border-bottom: 1px solid #fff;
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
#menu_container ul li a:hover { border-bottom: 1px solid #00bbff; }
#menu_container ul li.current-menu-item a, #menu_container ul li.current_page_item a, #menu_container ul li.current-menu-parent a, #menu_container ul li.current-post-ancestor a { border-bottom: 1px solid #737373; color: #00bbff; }


.sub-menu { display: none !important; }

#test { background-image: url(images/main-nav.png); background-position: -20px 0px; height: 100px; width: 70px; float: left; text-indent: -10000px; position: relative; }
#test:hover { background-position: -20px -100px; height: 85px; }

.home a { background-image: url(images/main-nav.png); background-position: -20px 0px; height: 85px; width: 70px; float: left; text-indent: -10000px; position: relative; }
.home a:hover { background-position: -20px -100px; height: 85px; }
.home.current-menu-item a, .home.current_page_item a, .home.current-menu-parent a, .home.current-post-ancestor a {background-position: -20px -100px !important; height: 100px; }

.service a { background-image: url(images/main-nav.png); background-position: -90px 0px; height: 85px; width: 90px; float: left; text-indent: -10000px; position: relative; }
.service a:hover {background-position: -90px -100px; height: 85px; }
.service.current-menu-item a, .service.current_page_item a, .service.current-menu-parent a, .service.current-post-ancestor a {background-position: -90px -100px !important; height: 100px;  }

.portfolio a { background-image: url(images/main-nav.png); background-position: -180px 0px; height: 85px; width: 90px; float: left; text-indent: -10000px; position: relative; }
.portfolio a:hover {background-position: -180px -100px; height: 85px; }
.portfolio.current-menu-item a, .portfolio.current_page_item a, .portfolio.current-menu-parent a, .portfolio.current-post-ancestor a {background-position: -180px -100px !important; height: 100px; }

.about a { background-image: url(images/main-nav.png); background-position: -270px 0px; height: 85px; width: 90px; float: left; text-indent: -10000px; position: relative; }
.about a:hover {background-position: -270px -100px; height: 85px; }
.about.current-menu-item a, .about.current_page_item a, .about.current-menu-parent a, .about.current-post-ancestor a {background-position: -270px -100px !important; height: 100px; }

.contact a { background-image: url(images/main-nav.png); background-position: -360px 0px; height: 85px; width: 90px; float: left; text-indent: -10000px; position: relative; }
.contact a:hover {background-position: -360px -100px; height: 85px; }
.contact.current-menu-item a, .contact.current_page_item a, .contact.current-menu-parent a, .contact.current-post-ancestor a {background-position: -360px -100px !important; height: 100px; }

.blog a { background-image: url(images/main-nav.png); background-position: -660px 0px; height: 85px; width: 70px; float: left; text-indent: -10000px; position: relative; }
.blog a:hover { background-position: -660px -100px; height: 85px; }
.blog.current-menu-item a, .blog.current_page_item a, .blog.current-menu-parent a, .blog.current-post-ancestor a {background-position: -660px -100px !important; height: 100px; }




#menu_container ul li.current-post-ancestor a {background-image: url(images/main-nav.png); background-position: 400px 100px; }




/* Content */

.about { height: 660px !important; background-size: auto !important; }
.banner { height: auto; width: 100%; margin: 89px auto 20px auto; position: relative;  background-size: cover; }
.banner-ios { padding: 20%; background-size: auto 100%;  background: url(http://webdeveloped.com/wp-content/uploads/2013/04/home-8.jpg) center topr no-repeat; }
.banner .play { margin: 0 0 0 -43px; height: 86px; width: 86px; display: block; position: absolute; bottom: -46px; left: 50%; background: url(images/play.png) center center no-repeat #fff; background-size: 100% 100%; z-index: 5;
  -webkit-border-radius: 43px; 
  -moz-border-radius: 43px; 
  border-radius: 43px; 
 -webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}
.banner .play:hover { background-size: 90% 90%; }
.banner h1 { color: #fff; font-size: 50px; text-align: center; padding: 12% 0 1% 0; font-family: 'texgyreherosbold', 'Open Sans', Arial, sans-serif; text-shadow: 0 0 1px rgba(80, 120, 150, 0.9); }
.banner h2 { color: #fff; font-size: 22px; text-align: center; text-transform: uppercase; font-family: 'texgyreherosregular', 'Open Sans', Arial, sans-serif; letter-spacing: 1px; text-shadow: 0 0 1px rgba(80, 120, 150, 0.9); }
.banner-box { height: auto; max-width: 1500px; z-index: 5; margin: 0 auto; padding: 0; color: #fff; position: relative; overflow: hidden; }
.banner-box img { display: none; }
.banner-text {  max-width: 1500px; height: auto; padding: 130px 20px 0 20px; color: #fff; z-index: 5; }
.banner-text h2 { color: #fff; font-weight: 300; font-size: 56px; }
.banner-text h3 { color: #fff; font-weight: 300; font-size: 40px; }

canvas { width: 100% !important; height: auto !important; }
video { width: 100% !important; height: 100% !important;  position: absolute; left: 0; top: 0; }

#changetext { position: absolute; z-index: 9; width: 1200px; margin-left: -600px; left: 50%; top: 0; display: none; }

.button { width: 120px; margin: 40px auto 20px auto; display: block; padding: 15px; border: 2px solid #00bbff; text-align: center; color: #fff; text-transform: uppercase; font-size: 14px; background: #00bbff;
  -webkit-border-radius: 5px; 
  -moz-border-radius: 5px; 
  border-radius: 5px; 
 -webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}

.button:hover { border: 2px solid #00bbff; background: #fff; color: #00bbfff; }

.banner .button { margin: 10px 0; display: block; padding: 10px; border: 2px solid #fff; width: 100px; text-align: center; color: #fff; text-transform: uppercase;
  -webkit-border-radius: 5px; 
  -moz-border-radius: 5px; 
  border-radius: 5px; 
 -webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}

.banner .button:hover { border: 2px solid #00bbff; }

.work { padding: 15px 0; margin: 0 auto 30px auto; text-align: center; border-bottom: 1px solid #e0e1e2; font-size: 24px; text-transform: uppercase; }


#social-box { position: relative; }

.side_social_list { list-style-type: none; width: auto; height: auto; margin: 0; position: absolute; top: 16px; right: 10px; }
.side_social_list p { color:#666; float: left; padding: 10px; }
.side_social_list li { display: inline-block; margin: 2px; width: 32px; height: 32px; }
.side_social_list li a { display: block; margin: 0; width: 32px; height: 32px; border-bottom: 1px solid #fff; 
	-moz-transition: all 0.4s ease; /* FF3.7+ */
	-o-transition: all 0.4s ease; /* Opera 10.5 */
	-webkit-transition: all 0.4s ease; /* Saf3.2+, Chrome */
	transition: all 0.4s ease;
}
.side_social_list li a:hover { border-bottom: 1px solid #00bbff; }
.youtube {background: url(images/social-icons.png) 0px 0px;
	-moz-transition: all 0.4s ease; /* FF3.7+ */
	-o-transition: all 0.4s ease; /* Opera 10.5 */
	-webkit-transition: all 0.4s ease; /* Saf3.2+, Chrome */
	transition: all 0.4s ease;
}
.youtube:hover {}
.facebook {background: url(images/social-icons.png) -32px 0px no-repeat; position: relative;
	-moz-transition: all 0.4s ease; /* FF3.7+ */
	-o-transition: all 0.4s ease; /* Opera 10.5 */
	-webkit-transition: all 0.4s ease; /* Saf3.2+, Chrome */
	transition: all 0.4s ease;
}
.facebook:hover {}
.linkedin {background: url(images/social-icons.png) -64px 0px;
	-moz-transition: all 0.4s ease; /* FF3.7+ */
	-o-transition: all 0.4s ease; /* Opera 10.5 */
	-webkit-transition: all 0.4s ease; /* Saf3.2+, Chrome */
	transition: all 0.4s ease;
}
.linkedin:hover {}
.twitter {background: url(images/social-icons.png) -96px 0px;
	-moz-transition: all 0.4s ease; /* FF3.7+ */
	-o-transition: all 0.4s ease; /* Opera 10.5 */
	-webkit-transition: all 0.4s ease; /* Saf3.2+, Chrome */
	transition: all 0.4s ease;
}
.twitter:hover {}
.google {background: url(images/social-icons.png) -128px 0px;
	-moz-transition: all 0.4s ease; /* FF3.7+ */
	-o-transition: all 0.4s ease; /* Opera 10.5 */
	-webkit-transition: all 0.4s ease; /* Saf3.2+, Chrome */
	transition: all 0.4s ease;
}
.google:hover {}




#container {max-width: 1500px; height:auto; margin: 0 auto; padding: 30px 2%; }
#container ul { list-style-type: none; }
.portfolio-content { margin-top: 90px !important; }
#container-1 { color: #737373; max-width: 1000px; height:auto; min-height: 700px; margin: 0 auto; padding: 2%; position: relative; }
#container-1 p {margin: 10px 0; display: block; }
#container-1 .s-icon img { float: left; margin: -10px 10px 0 0; }
#container-1 img { max-width: 48%; height: auto; width: auto; margin: 2.5% auto; }

.logo-content { margin-top: 90px !important; }
.logo-content .post_box { width: 32.4%; max-height: 340px; }
.logo-content .content_box { top: 35%; }


/* ---------------------- PP Litebox ----------------------- */

div.dark_square .pp_left, div.dark_square .pp_middle, div.dark_square .pp_right, div.dark_square .pp_content { background: none !important; }
div.dark_square .pp_details {
    position: absolute !important;
    right: 30px;
    top: 0;
}

div.dark_square .pp_close {
    background: url(images/close.png) no-repeat scroll 0 0 rgba(0, 0, 0, 0) !important;
    height: 30px !important;
    width: 30px !important;
}

div.dark_square .pp_description { display: none !important; }
a.pp_expand, a.pp_contract { left: 30px !important; }

#left_content { padding:30px; z-index:99; }
#left_content-page { margin:0; padding:40px; max-width: 60%; height:auto; }
#left_content-single { max-width: 100%; margin:0 auto; padding:0; z-index:99; }
#left_content h1 { font-size: 21px; font-weight: bold; margin:0; }


#title { max-width: 100%; margin:0 40px; padding:0; border-bottom: 1px dashed #bbbbbb; }
#title h1 { font-size: 70px; font-weight: 800; text-transform:uppercase; color:#fff; line-height:1; }

a.medium_img img { width: 500px; height:auto; margin:0; padding:0; }
a.small_img img { width: 500px; height: auto; }

.blog_post_box img { width: 100%; height: auto; }

.post_box { float: left; padding: 0; margin: 0.3%; width: 49.4%; height: auto; vertical-align: baseline; position: relative; background: #000; overflow: hidden; max-height: 500px; }
.post_box a { height:0; }
.post_box_last { float: left; padding: 0; margin:0 0 10px 0; width: 500px; height: auto; }

.post_box img { display: block; background-color: #000; padding: 0; width: 100%; height: auto;
 -webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
opacity:1.0;
filter:alpha(opacity=100); /* For IE8 and earlier */

 }
.post_box:hover img { 
opacity:0.3;
filter:alpha(opacity=50); /* For IE8 and earlier */
}

.content_box { width: 100%; padding: 100px 0 0 0; height: auto; text-align: center; margin: 0;  position: absolute; top: 40%; left: 0; display: none; background: url(images/plus.png) no-repeat top center; }
.post_box:hover .content_box { display: block; }
.content_box h1 { padding: 0; margin: 0 0 25px 0; font-weight: bold; color: #fff; }
.content_box h3 { font-size: 26px; padding: 0; margin:0; line-height:1; text-transform: uppercase; color: #fff; }
.content_box h3 a { color: #fff; text-decoration: none; }
.content_box h3 a:hover { color: #0997cb; }
.content_box p { color: #6d6d6d; font-size: 13px; margin: 0; }
.content_box a:hover { color: #66daff; }

#container-blog { color: #737373; max-width: 990px; height:auto; margin: 0 auto; padding: 2%; position: relative; }
.blog-content { padding: 0; height: auto; margin: 10px 0; float: left; width: 75%; }

.blog_box { padding: 0 2%; margin: 10px auto; max-width: 46%; height: auto; position: relative; display: block; float: left; }
.blog_box h1 { padding: 0; margin: 10px 0; font-size: 24px; font-weight: 100; color: #000; text-transform: none;
 -webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
.blog_box h1:hover { color: #0997cb; }
.time { font-style: italic; margin: 0 !important; }
.blog_box img { padding: 0; margin: 0 0 10px 0; max-width: 100%; height: auto; }
.blog-content_box { padding: 0 0 0 5%; height: auto; margin: 0; float: left; width: 60%; }

.blog-single { padding: 0 3% 0 0; height: auto; margin: 10px 0; float: left; width: 73%; }
.blog-single img { max-width: 100% !important; margin: 20px auto !important; }
.blog-single .date { top: 30px; }
.blog-single h1 { font-weight: 100 !important; text-transform: none; }
.blog-single .author { color: #0997cb; margin: 0; padding:0; display: inline !important; }

.services_box { width: 94%; padding: 3%; height: auto;  background-size: 100% ; float: left; }
.services_box h4 { font-size: 22px; margin: 5px 0 0 0; padding: 0 0 0 75px; text-transform: uppercase; }
.services_box h4 a { text-decoration: none; }
.services_box h4 a:hover { color: #0997cb; }
#container-1 .services_box img { float: left; margin: -9px 10px 0 0; height: 45px; width:45px; }

.more a {
float: right;
border: 1px solid #d1d1d1;
display: block;
padding: 0 15px;
margin: 0 0 0 20px;
min-width: 58px;
height: 24px;
line-height: 24px;
text-align: center;
text-transform: uppercase;
text-decoration: none;
color: #888;
text-shadow: 0 1px 0px rgba(255,255,255,0.5);
font-size: 10px;
border-radius: 3px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
background-color: #fdfdfd;
background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(253, 253, 253)), to(rgb(236, 236, 236)));
background-image: -webkit-linear-gradient(top, rgb(253, 253, 253), rgb(236, 236, 236));
background-image: -moz-linear-gradient(top, rgb(253, 253, 253), rgb(236, 236, 236));
background-image: -o-linear-gradient(top, rgb(253, 253, 253), rgb(236, 236, 236));
background-image: -ms-linear-gradient(top, rgb(253, 253, 253), rgb(236, 236, 236));
background-image: linear-gradient(top, rgb(253, 253, 253), rgb(236, 236, 236));
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#fdfdfd', EndColorStr='#ececec');
	-moz-transition: all 0.4s ease; /* FF3.7+ */
	-o-transition: all 0.4s ease; /* Opera 10.5 */
	-webkit-transition: all 0.4s ease; /* Saf3.2+, Chrome */
	transition: all 0.4s ease;
}

.more a:hover { 
color: #0997cb;
box-shadow: 0 0 5px rgba(9,151,203,0.5);
-webkit-box-shadow: 0 0 5px rgba(9,151,203,0.5);
-moz-box-shadow: 0 0 5px rgba(9,151,203,0.5);
}

.blog_post_box { width: 347px; margin-right: 55px; }
.post_box a.medium_img, .post_box_last a.medium_img, .blog_post_box img { display: block; background-color: #fff; padding: 0;
 -webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}


/* .date { background: url(images/date.png); width: 90px; height: 60px; position: absolute; left: 0px; top: 20px; margin: 0; padding: 0; } */
.date { background: #000; width: 80px; height: 40px; float: left; margin: 0; padding: 0; }
.d { float: left; color: #fff; font-size: 28px; padding: 4px 5px 0 10px; font-family:'BebasNeueRegular',Arial,sans-serif; }
.m { color: #c6c6c6; text-transform: uppercase; margin: 0; padding: 4px 0 0 0; }
.y { float: left; color: #0997cb; padding: 0; margin: -4px 0 0 0; font-size: 11px; }

.post_meta { font-size: 11px; }
.post_meta a { color: #3d3d3d; text-decoration: none; }
.post_meta a:hover { color: #F07057; }

#latest_work { float: left; padding:10px; width: 180px; height:auto; background:transparent; margin: 0; }
#latest_work h2 {border-bottom: 1px solid #bbbbbb; padding: 0 0 5px 0; font-weight: 500;}

.testimonials { min-height: 70px; margin: 4% 0.3%; padding: 6% ; clear: both; background: #edeff3; width: 87.4%; }
.testimonials img { width: 64px; height: auto; margin: 0 20px 0 0; padding: 10px; background: #fff; }
.testimonials h3 { margin: 0 45px; float: right; font-size: 16px; }
.testimonials-widget-testimonials { min-height: 70px; color: #747579; font-style: italic; font-size: 16px; padding: 0; margin: 0 !important; }
.testimonials-widget-testimonials cite { color: #00bbff; font-size: 15px; margin: 20px 0 0 0 !important; }

.single-testimonials { max-width: 92%; min-height: 70px; background: #edeff3; font-style: italic; text-align: left; padding: 4%; margin: 10px 0; }
.single-testimonials h4 { padding: 0 !important; }
.single-testimonials p { padding: 10px 0 0 0 !important; }

.single-wrapper { width: 100%; height: 100%; margin: 90px 0 0 0; padding: 0; background: #fff; }

.single_content { margin:0 auto; display:block; padding: 30px 2%; max-width: 1500px; min-height: 500px; position: relative;
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
.single_content ul { padding: 0; list-style: none; }
.single_content ul li { padding: 4px 0; }
.single_content ul li:before {
    color: #00bbff;
    content: '✔  ';
    font-size: 14px;
}
.single_content img { max-width: 100%; height: auto; margin: 0.3% 0; }
.single-images { float: right; max-width: 35%; }
.single-text { float: left; padding: 10px 3% 30px 0; width: 47%; height: auto; min-height: 300px;  }
.single-text h2 { padding: 0; font-size: 25px; font-weight: 300; color: #2d343e; }
.single-text p { padding: 10px 0; }
.single-text .external { font-size: 17px; }
hr { margin: 20px 0; border: none; border-top: 1px solid #eeeff3; }
.single_video { max-width: 1080px; height: inherit; margin: -50px auto 20px auto; display:block; padding:0 0 30px 0; }

.popup_category { width: auto; padding: 7px 10px; position: absolute; left: 0px; top: 10px; background: #3d3d3d; }
.popup_category p, .popup_category p a { margin: 0; color: #fff; }

.home_divider { width: 100%;  margin: 0; clear: both; }
.home_divider_last { margin-bottom: 0; }


/* single post nav styles */ 

.post-prev a  { float: left; margin: 0; background: url(images/arrow_left.png) no-repeat scroll 0 -46px transparent; z-index: 999; width: 50px !important; height: 50px !important; display: block; text-indent:-10000px; 
 -webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
opacity:0.3;
filter:alpha(opacity=30); /* For IE8 and earlier */
}

.post-prev a:hover { opacity:1.0; filter:alpha(opacity=100); /* For IE8 and earlier */ }

.post-next a { float: left; margin: 0; background: url(images/arrow_right.png) no-repeat scroll 0 -46px transparent; z-index: 999; width: 50px !important; height: 50px !important; display: block; text-indent:-10000px;
 -webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
opacity:0.3;
filter:alpha(opacity=30); /* For IE8 and earlier */
}
.post-next a:hover { opacity:1.0; filter:alpha(opacity=100); /* For IE8 and earlier */ }

.post-nav { width: 100px; margin: 20px 0 0 0;
 -webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}



/****************
pagination
****************/

.wp-pagenavi {
background: url(images/pagenavi-back.png) center top no-repeat ;
clear: both;
height: 30px;
max-width: 960px;
padding: 20px 0 5px 0;
margin: 0;
text-align: center;
}

.wp-pagenavi a, .wp-pagenavi span {
text-decoration: none;
padding: 12px 8px;
margin: 2px;
color: #434343;
display: inline-block;
}

.wp-pagenavi a:hover, .wp-pagenavi span.current {
color: #0997CB;
}

.wp-pagenavi span.current {
background: url(images/pagenavi-active.png) center top no-repeat ;
}

.previouspostslink { width: 22px; height: 20px; background: url(images/small-arows.png) 0px -40px no-repeat; text-indent: -10000px; }
.previouspostslink:hover { background: url(images/small-arows.png) -40px -40px no-repeat; }

.nextpostslink { width: 22px; height: 20px; background: url(images/small-arows.png) -0px 0px no-repeat; text-indent: -10000px; }
.nextpostslink:hover { background: url(images/small-arows.png) -40px 0px no-repeat; }


/****************
advanced comment styles
****************/

.comments { height: 16px; padding: 0; float: left; margin: 5px 140px 5px 0; width: 120px; }
.comments img { width: 16px; height: 16px; margin: 0 8px 0 0; padding: 0; float: left; }
.comments-container { margin:0 auto; padding:0 20px 20px 20px; max-width:700px; }
#comments { list-style:none; margin:20px auto 0 auto; padding:5%; text-indent:0; max-width:700px; background: #f1f1f1; }
#respond { list-style:none; margin:20px auto 0 auto; padding:5%; text-indent:0; max-width:700px; background: #f1f1f1; }

ol.commentlist { list-style:none; margin:0 auto; padding:0; text-indent:0; max-width:700px; color:#3d3d3d; }
ol.commentlist li { border-top: 1px solid #fff; }
ol.commentlist li.alt { }
ol.commentlist li.bypostauthor {}
ol.commentlist li.byuser {}
ol.commentlist li.comment-author-admin {}
ol.commentlist li.comment { padding:10px; }
ol.commentlist li.comment div.comment-author {}
ol.commentlist li.comment div.vcard {}
ol.commentlist li.comment div.vcard cite.fn { font-style: normal;font-size:13px; font-weight:700;text-transform:capitalize; color:#3d3d3d; }
ol.commentlist li.comment div.vcard cite.fn a.url {}
ol.commentlist li.comment div.vcard img.avatar { margin:0 10px 0 0; float:left; }
ol.commentlist li.comment div.vcard img.avatar-32 {}
ol.commentlist li.comment div.vcard img.photo {}
ol.commentlist li.comment div.vcard span.says {display:none;}
ol.commentlist li.comment div.commentmetadata {}
ol.commentlist li.comment div.comment-meta { font-size:10px; font-style:italic; }
ol.commentlist li.comment div.comment-meta a { color:#bbbbbb; }
ol.commentlist li.comment p { font-size:11px; padding: 0 60px 0 75px; }
ol.commentlist li.comment ul { font-size:11px; list-style:square; margin:0; }
ol.commentlist li.comment div.reply {  background: none repeat scroll 0 0; margin-top: -26px; padding: 4px 8px; float:right; 
	-moz-transition: all 0.4s ease; /* FF3.7+ */
	-o-transition: all 0.4s ease; /* Opera 10.5 */
	-webkit-transition: all 0.4s ease; /* Saf3.2+, Chrome */
	transition: all 0.4s ease;
}
ol.commentlist li.comment div.reply:hover {  background: none repeat scroll 0 0 #F07057; }
ol.commentlist li.comment div.reply a { font-weight:bold; color:#3d3d3d; }
ol.commentlist li.comment div.reply a:hover { font-weight:bold; color:#fff; }
ol.commentlist li.comment ul.children { list-style:none; margin:20px 0 0;padding:0 0 0 20px; text-indent:0; }
ol.commentlist li.comment ul.children li {}
ol.commentlist li.comment ul.children li.alt {}
ol.commentlist li.comment ul.children li.bypostauthor {}
ol.commentlist li.comment ul.children li.byuser {}
ol.commentlist li.comment ul.children li.comment {background: none repeat scroll 0 0 #ededed;}
ol.commentlist li.comment ul.children li.comment-author-admin {}
ol.commentlist li.comment ul.children li.depth-2 {}
ol.commentlist li.comment ul.children li.depth-3 {background:#fff;}
ol.commentlist li.comment ul.children li.depth-4 {}
ol.commentlist li.comment ul.children li.depth-5 {background:#fff;}
ol.commentlist li.comment ul.children li.odd {}
ol.commentlist li.even { background:#fff; 
	-moz-transition: all 0.4s ease; /* FF3.7+ */
	-o-transition: all 0.4s ease; /* Opera 10.5 */
	-webkit-transition: all 0.4s ease; /* Saf3.2+, Chrome */
	transition: all 0.4s ease;
}
ol.commentlist li.even:hover {}
ol.commentlist li.odd { background:#ededed; 
	-moz-transition: all 0.4s ease; /* FF3.7+ */
	-o-transition: all 0.4s ease; /* Opera 10.5 */
	-webkit-transition: all 0.4s ease; /* Saf3.2+, Chrome */
	transition: all 0.4s ease;
}
ol.commentlist li.odd:hover {}
ol.commentlist li.parent {}
ol.commentlist li.thread-alt { }
ol.commentlist li.thread-even {}
ol.commentlist li.thread-odd {}


/****************
Contact form styles
****************/


.map { height: 500px; width: 100%; margin: 0 auto; position: relative;  background-size:auto 100% !important; }
.address {float: right; }

.contact-banner { max-width: 1500px; margin: 90px auto 0 auto; position: relative; padding: 10px 0; }
.contact-banner h1 { color: #fff; font-size: 50px; text-align: center; padding: 3% 0; font-family: 'texgyreherosbold', 'Open Sans', Arial, sans-serif; }

.contact-left { width: 37%; margin-right: 3%; float:left; }
.contact-right { width: 60%; float:left; }

input,textarea { outline:none; font-size:14px; font-family: 'texgyreherosregular', 'Open Sans', Arial, sans-serif; padding: 5px 10px; margin:8px 0; font-weight:normal; border: 1px solid #ccc; background: #fff;	-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box; width: 100%;
}
input:focus,textarea:focus{ outline:none; border: 1px solid #00bbff; background: #fff; font-family: 'texgyreherosregular', 'Open Sans', Arial, sans-serif;
	-moz-transition: all 0.4s ease; /* FF3.7+ */
	-o-transition: all 0.4s ease; /* Opera 10.5 */
	-webkit-transition: all 0.4s ease; /* Saf3.2+, Chrome */
	transition: all 0.4s ease;
}
textarea{height:250px;}
input{height:50px;}
label{display:inline-block;margin: 0;}
button {padding: 2px 10px;cursor: pointer;}
select {border: 1px solid #ccc;}

input[type="submit"] { margin: 10px 0; display: block; float: right; padding: 0; border: 2px solid #00bbff; width: 120px; text-align: center; color: #fff; text-transform: uppercase; background: #00bbff; cursor: pointer;
  -webkit-border-radius: 5px; 
  -moz-border-radius: 5px; 
  border-radius: 5px; 
 -webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}

input[type="submit"]:hover { border: 2px solid #00bbff; color: #00bbff; background: #fff; }

input[type="checkbox"] {
box-sizing: border-box;
height: auto;
width: auto;
vertical-align: middle;
margin: 5px 5px 5px 0;
  -webkit-border-radius: 5px; 
  -moz-border-radius: 5px; 
  border-radius: 5px;
}

div.wpcf7 { float: none; max-width: 100%; }

div.wpcf7-mail-sent-ok {
background: #0997cb;
border: 2px solid #0997cb !important;
color: #fff;
margin: -40px 0 0 0 !important;
}

div.wpcf7-mail-sent-ng {
background: #ff0000;
border: 2px solid #ff0000;
margin: -40px 0 0 0 !important;
}

div.wpcf7-spam-blocked {
background: #ffa500;
border: 2px solid #ffa500;
margin: -40px 0 0 0 !important;
}

div.wpcf7-validation-errors {
background: #f7e700;
border: 2px solid #f7e700;
}

.wpcf7-not-valid-tip {
background: #fff;
border: 1px solid #0997cb !important;
font-size: 12px;
width: auto !important;
padding: 3px 10px !important;
margin-top: -10px;
box-shadow: 0 1px 4px rgba(0,0,0,0.2);
-webkit-box-shadow: 0 1px 4px rgba(0,0,0,0.2);
-moz-box-shadow: 0 1px 4px rgba(0,0,0,0.2);
}

.captcha { position: absolute; right: 10px; top: 20px; z-index: 5; }


/* Sidebar */


#sidebar { width: 20%; height:100%; margin: 10px 0; padding: 0 0 0 3%;  z-index:99;  background: url(images/diver.png) top left no-repeat; background-size: 30px 100%; float: right; line-height: 20px; font-size: 13px; }
#sidebar ul { text-decoration: none; list-style-type: none; }
#sidebar ul li { text-decoration: none; list-style-type: none; border-bottom: 1px solid #f1f1f1; padding: 10px 0; }
#sidebar h3 { margin:10px 0; padding: 0; text-transform: uppercase; font-size: 15px; }
.sidebaritem { padding: 0; margin: 0 0 30px 0; }
#sidebar img { padding: 0; margin: 0 10px 0 0; float: left; width: 50px; height: auto; }



/* Footer */

#footer-wrapper { padding: 0; margin: 0; height:auto; width: 100%; background: #edeff3; font-size: 13px; }

.footer { padding: 100px 20px; margin: 0 auto; height:auto; max-width: 1500px; }
.footer h3 { font-size: 14px; margin: 0 0 10px 0; padding: 0 0 10px 0; line-height: 2.2; color: #4a5c62; border-bottom: 1px solid #cdcfd3; text-transform: uppercase; font-weight: normal; }
.footer p { color: #fff; }
.footer-items { width: 97%; max-width: 1020px; padding: 0 0 0 3%; margin: 0 auto; }
.footer-item { float: left; margin:0 9% 0 0; min-width: 170px;}
.footer-item img { margin: 0 auto; display: block; }
.copyright { padding: 20px; margin: 0 auto; height: auto; text-align: center; color: #86969b; background: #dfe2e7; font-size: 13px; }
.copyright p { display: inline-block; margin: 5px 0; font-size: 13px; }

.footer-logo { position: absolute; margin: 0 0 0 30px; width: 200px; text-align: center; }
.footer-logo img { margin: 0 auto; display: block; padding: 70px 0 10px 0; }

#footer-wrapper ul {  list-style-type: none; margin: 0; padding: 0; }
#footer-wrapper ul li { margin: 0; padding: 0; display: block; color: #86969b; text-decoration: none; line-height: 2; font-size: 13px; }
#footer-wrapper ul li a { margin: 0; padding: 0; display: block; color: #86969b; text-decoration: none; line-height: 2; font-size: 13px; }
#footer-wrapper ul li a:hover { color: #063e4d;  }
#footer-wrapper ul li.current-menu-item a, #footer-wrapper ul li.current_page_item a { }

#footer-wrapper .side_social_list li { margin: -8px; }
#footer-wrapper .side_social_list li a { background: none; padding: 0; margin: 0; }
#footer-wrapper .side_social_list li a:hover { background: none; }
#footer-wrapper .side_social_list { height: auto; width: 120px; }
#footer-wrapper .side_social_list p { font-style: none; padding: 10px 0; margin: 0; line-height: 1; }

#footer-wrapper .youtube {background: url(images/social-icons.png) 0px -100px;}
#footer-wrapper .youtube:hover {background: url(images/social-icons.png) 0px -50px;}
#footer-wrapper .facebook {background: url(images/social-icons.png) -50px -100px;}
#footer-wrapper .facebook:hover {background: url(images/social-icons.png) -50px -50px;}
#footer-wrapper .linkedin {background: url(images/social-icons.png) -100px -100px;}
#footer-wrapper .linkedin:hover {background: url(images/social-icons.png) -100px -50px;}
#footer-wrapper .twitter {background: url(images/social-icons.png) -150px -100px;}
#footer-wrapper .twitter:hover {background: url(images/social-icons.png) -150px -50px;}

#footer-wrapper .client-login { display: none; }


.widget_wysija_cont { width: 150px; margin: 0 0 0 5px; }

.widget_wysija_cont .updated, .widget_wysija_cont .login .message { margin: 0; padding: 0; background: transparent; border: none; }

.formError .formErrorContent {
    border: none;
    margin: -8px 0 0 -160px;
    padding: 5px !important;
}

.widget_wysija_cont input[type="text"], .widget_wysija_cont input[type="password"], .widget_wysija_cont input[type="email"], .widget_wysija_cont textarea, .widget_wysija_cont select {
    margin: 0 auto 5px auto;
    outline: medium none;
    padding: 3px;
    border: none;
}

.widget_wysija_cont input[type="text"]:focus, .widget_wysija_cont input[type="password"]:focus, .widget_wysija_cont input[type="email"]:focus, .widget_wysija_cont textarea:focus {
    margin: 0 auto 5px auto;
    outline: medium none;
    padding: 3px;
    border: none;
}


.widget_wysija_cont .wysija-submit {
    height: 30px;
    display: block;
    margin: 10px auto !important;
    width: 150px;
    outline: medium none;
    padding: 3px;
    border: none;
    font-size: 11px;
    cursor:pointer;
    border-radius: 3px;
     -moz-border-radius: 3px;
      -webkit-border-radius: 3px;
}


.widget_wysija_cont .wysija-submit:hover {
    color: #0997cb;
box-shadow: inset 0 0 8px rgba(9,151,203,0.8);
-webkit-box-shadow: inset 0 0 8px rgba(9,151,203,0.8);
-moz-box-shadow: inset 0 0 8px rgba(9,151,203,0.8);
}





/* Slideshow */

#single-slider .slides img { max-width: 100%; width: 100%; float: none; margin: 0 auto; max-height: 1900px; border: medium none; box-shadow: none; }

#single-slider { min-height: 100px; border: 1px solid #ccc; margin: 0 2%;
box-shadow: 0 0 20px rgba(9,151,203,0.2);
-webkit-box-shadow: 0 0 20px rgba(9,151,203,0.2);
-moz-box-shadow: 0 0 20px rgba(9,151,203,0.2);
}


.slideshow-wrapper { max-width: 100%; background: url(images/white-stripe.png) bottom center repeat-x #f4f4f4; overflow: hidden; heigh: auto; min-height: 60px; margin-top: 100px; }
.slides .slide-text { color: #000; padding: 7% 1% 3% 1%; margin: 0 auto; text-align: center; width: 460px; float: left; }
.slides .slide-text p, .slide-text a { line-height: 1; text-decoration: none;}

.video { padding: 40px 50px 40px 30px; margin: 0 auto; float: left; max-width: 400px; width: 40%; height: auto; background: url(images/video-ipad.png) no-repeat 0 0 ;
background-size: cover;
-moz-background-size: cover;  /* Firefox 3.6 */
background-position: center;  /* Internet Explorer 7/8 */
}

#play img { width: 450px; height: auto; padding: 10px 15px; 
	-moz-transition: all 0.4s ease; /* FF3.7+ */
	-o-transition: all 0.4s ease; /* Opera 10.5 */
	-webkit-transition: all 0.4s ease; /* Saf3.2+, Chrome */
	transition: all 0.4s ease;
}
#play img:hover { width: 480px; height: auto; padding: 0; }

.banner-wrapper { max-width: 100%; background: #f4f4f4; margin-top: 90px; }

#banner {max-width: 960px; height: auto; margin: 0 auto; padding: 0; background-image: url(images/banners-back.png); 
background-size: cover;
-moz-background-size: cover;  /* Firefox 3.6 */
background-position: center;  /* Internet Explorer 7/8 */
}
#banner img {max-width: 50%; height:auto; margin: 0 auto; padding: 0; float: left; display: block; }
#banner .slide-text { color: #000; padding: 10% 3% 0 0; margin: 0 auto; text-align: center; width: 46%; float: right; }
#banner h3 { margin: 0 auto;  max-width: 990px; padding: 10px 0 0 0; font-size: 20px; color: #666; }

#portfolio-filter { max-width: 960px; padding: 10px; list-style: none outside none; margin: 0 auto; text-align: center; }

#portfolio-filter li { width: auto; display: inline-block; padding: 5px; margin: 0 auto; vertical-align: baseline; }

#portfolio-filter li a {
float: none;
border: 1px solid #d1d1d1;
display: inline-block;
padding: 0 15px;
margin: 0;
min-width: 58px;
height: 24px;
line-height: 24px;
text-align: center;
text-transform: uppercase;
text-decoration: none;
color: #888;
text-shadow: 0 1px 0px rgba(255,255,255,0.5);
font-size: 10px;
border-radius: 3px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
background-color: #fdfdfd;
background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(253, 253, 253)), to(rgb(236, 236, 236)));
background-image: -webkit-linear-gradient(top, rgb(253, 253, 253), rgb(236, 236, 236));
background-image: -moz-linear-gradient(top, rgb(253, 253, 253), rgb(236, 236, 236));
background-image: -o-linear-gradient(top, rgb(253, 253, 253), rgb(236, 236, 236));
background-image: -ms-linear-gradient(top, rgb(253, 253, 253), rgb(236, 236, 236));
background-image: linear-gradient(top, rgb(253, 253, 253), rgb(236, 236, 236));
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#fdfdfd', EndColorStr='#ececec');
	-moz-transition: all 0.4s ease; /* FF3.7+ */
	-o-transition: all 0.4s ease; /* Opera 10.5 */
	-webkit-transition: all 0.4s ease; /* Saf3.2+, Chrome */
	transition: all 0.4s ease;
}

ul#portfolio-list {
    list-style: none outside none;
    margin: 0;
    padding: 0;
}


ul#portfolio-list li {

}


#portfolio-filter li a:hover { 
border: 1px solid #ccc;
color: #0997cb;
box-shadow: 0 0 5px rgba(9,151,203,0.5);
-webkit-box-shadow: 0 0 5px rgba(9,151,203,0.5);
-moz-box-shadow: 0 0 5px rgba(9,151,203,0.5);
}
ul#portfolio-filter a.current { 
color: #0997cb;
box-shadow: 0 0 6px rgba(9,151,203,0.5);
-webkit-box-shadow: 0 0 6px rgba(9,151,203,0.5);
-moz-box-shadow: 0 0 6px rgba(9,151,203,0.5);
}

#player-wrapper { width: 100%; background: #000; height: auto; }
.video-banner { max-width: 960px; height: auto; margin: 0 auto; padding: 0; color: #000; overflow: hidden; }
.video-margin { margin: -50px 0; }
#video-control { width: 100px; height: 25px; padding: 15px 0 0 0; margin: 0 auto -40px auto; }

#video_wrapper { width: 100% !important; height: 500px !important;}
#video { width: 100% !important; height: 500px !important;}


.video-button { margin: 10px auto 0 auto; padding: 21px 5px 0 5px; background-image: url(images/video-button.png); background-repeat:no-repeat; background-position: 0 0; width: 160px; height: 40px; color: #fff; font-size: 16px; text-decoration: none; font-weight: bold; position: relative; }
.video-button:hover { background-position: 0 -60px ; }


#portfolio-banner {max-width: 960px; height:auto; margin: 0 auto; padding: 0; background-image: url(images/banners-back.png); 
background-size: cover;
-moz-background-size: cover;  /* Firefox 3.6 */
background-position: center;  /* Internet Explorer 7/8 */
}

#portfolio-banner img {max-width: 100%; height:auto; margin: 0 auto; padding: 0;}

#portfolio-icons {max-width: 745px; height: auto; margin: -20px auto 0 auto; padding: 0 0 40px 15px; font-size: 20px; }
#portfolio-icons a {color: #000; font-size: 20px; line-height: 24; }
#portfolio-icons a:hover { color: #0089bb; text-decoration: none;}

.two-icons { max-width: 500px; margin: 0 auto; display: block; float: left; }

.brand-design11 { float: left; height: 230px; width: 190px; background: url(images/PortfolioIcons.png) 0px 0px no-repeat; text-align: center; margin: 0; }
.brand-design11:hover { background: url(images/PortfolioIcons.png) 0px -230px no-repeat; position: relative; z-index: 888; }

.web-development11 { float: left; height: 230px; width: 340px; background: url(images/PortfolioIcons.png) -190px -230px no-repeat; text-align: center; margin: 0 -20px 0 0; }
.web-development11:hover { background: url(images/PortfolioIcons.png) -190px -230px no-repeat; }

.creative-work11 { float: left; height: 230px; width: 220px; background: url(images/PortfolioIcons.png) -525px 0px no-repeat; text-align: center; margin: 0; padding: 0 0 0 13px; }
.creative-work11:hover { background: url(images/PortfolioIcons.png) -525px -230px no-repeat; }



#banner .logout { margin: 10px auto 0 auto; padding: 15px 5px 0 5px; background-image: url(images/video-button.png); background-repeat:no-repeat; background-position: 0 0; width: 160px; height: 40px; color: #fff; font-size: 16px; text-decoration: none; font-weight: bold; position: relative; }
#banner .logout:hover { background-position: 0 -60px ; }


.clientcontent { margin: 0 auto; padding: 0 10px; }
.clientcontent img { margin: 20px auto; max-width: 100% !important; height: auto; display: block; }
.clientcontent img:hover { cursor:default; }

#client-login { margin: 0; padding: 0; width: 125px; position: absolute; z-index: 80; text-transform: uppercase; font-size: 12px; color: #2d343e; top: 36px; right: 0;
	-moz-transition: all 0.4s ease; /* FF3.7+ */
	-o-transition: all 0.4s ease; /* Opera 10.5 */
	-webkit-transition: all 0.4s ease; /* Saf3.2+, Chrome */
	transition: all 0.4s ease;
}
#client-login:hover { }

#login { height: auto; float: right; cursor:pointer; position: relative; margin: 0 20px 0 0; padding: 0 10px 10px 10px; border-bottom: 1px solid #fff; 
	-moz-transition: all 0.4s ease; /* FF3.7+ */
	-o-transition: all 0.4s ease; /* Opera 10.5 */
	-webkit-transition: all 0.4s ease; /* Saf3.2+, Chrome */
	transition: all 0.4s ease;
}
#login:hover { border-bottom: 1px solid #00bbff; }

.log-active { border-bottom: 1px solid #00bbff !important; color: #00bbff; }
.log-inactive {  }


#client-login .user { height: 27px; position: relative; border-bottom: 1px solid #fff; padding: 0 10px; text-align: center;
	-moz-transition: all 0.4s ease; /* FF3.7+ */
	-o-transition: all 0.4s ease; /* Opera 10.5 */
	-webkit-transition: all 0.4s ease; /* Saf3.2+, Chrome */
	transition: all 0.4s ease;
}
#client-login .user-active { }
#client-login:hover .user { border-bottom: 1px solid #00bbff !important; }

#client-login .login-box { display: none; background: #fff; width: 240px; padding: 20px; margin: 20px 0 0 -65px; list-style: none; color: #ccc; position: absolute;
-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;
border-radius: 3px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
}

#client-login:hover .login-box { display: block; }

#login-box input { height: 35px; margin: 0 0 10px 0; }

#login-box { background: #fff; width: 240px; padding: 20px; margin: 29px 0 0 -120px; list-style: none; color: #86969b; position: relative; text-transform: none;
-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;
border-radius: 3px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
}
.hide-box { display: none; }
.show-box { display: block;}

#client-login .login-box { margin: 0 0 0 -120px; }

.close {
float: right;
display: block;
width: 20px;
height: 20px;
padding: 0;
margin: 0;
text-align: center;
text-transform: uppercase;
text-decoration: none;
color: #999;
font-size: 15px;
line-height: 18px;
font-weight: 300;
border: 1px solid #999;
border-radius: 50%;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
background: none;
cursor: pointer;
	-moz-transition: all 0.4s ease; /* FF3.7+ */
	-o-transition: all 0.4s ease; /* Opera 10.5 */
	-webkit-transition: all 0.4s ease; /* Saf3.2+, Chrome */
	transition: all 0.4s ease;
}

.close:hover { 
color: #DD4B39;
border: 1px solid #DD4B39;
}


#login-box input[type="submit"] { float: none; margin: 20px 0; width: 100%; height: 30px; }

#login-box label { float: left; }




/* for tablet */


@media screen and (max-width: 1120px) {

.about { height: 400px !important; background-size: auto 500px !important; }
#changetext { width: 800px; margin-left: -400px; }
.banner h1 { font-size: 36px; }
.banner h2 { font-size: 16px; }

img.alignright, img.alignleft, img.aligncenter, img.alignnone { float:none; width: 100%; margin: 3px 0; }

.single-images img { }
.single-text { padding: 10px 2% 30px 2%; width: 96%; float: none; }
.single-testimonials { max-width: 90%; margin: 5px 1%; }

.footer-item { float: left; margin:0 4% 0 0; min-width: 18%; }

}

@media screen and (max-width: 1000px) {


.banner-box { height: 300px; }
.banner-text { padding: 80px 20px 0 30px; }
.banner-box img { margin: 0 0 0 -77px; position: absolute; bottom: 0; left: 50%; max-height: 450px; }

.contact-banner { padding-top: 10px; }
.contact-banner h1 { padding: 0 0 20px 0; }
.contact-banner .side_social_list { display: block; position: static; margin: 0 auto; text-align: center;  }
.contact-info h5 { font-size: 16px; }

.map { height: 300px !important; }

.post_box img { width: 100%; height: auto; }

.logo-content .post_box { width: 49.4%; }
.content_box { top: 30%; }
.content_box h3 { font-size: 20px; }

.single_content { min-height: 300px; }

.slides .slide-text { width: 40%;}
.flexslider .slides img { width: 55%; }

#play img { width: 410px; }
#play img:hover { width: 440px; }

#logo_cont img { float: none; margin: 0 auto; display: block; }

#container-1 {max-width: 100%; margin: 0; }

.blog-content_box { padding: 0 0 0 5%; height: auto; margin: 0; float: left; width: 45%; }

.services_box { width: 90%; padding: 5%; }


.ourwork { margin: -55px auto 0 auto; }

}


@media screen and (max-width: 800px) {


.about { height: 300px !important; background-size: auto 400px !important; }
#changetext { width: 580px; margin-left: -290px; }
.banner h1 { font-size: 26px; }
.banner h2 { font-size: 11px; margin: 5px 0; }
.banner-text { max-width: 350px; }

.contact-banner h1 { font-size: 40px; }
.address { float: none; }
.contact-info h5 { text-align: center; }

.alignright, .alignleft {float:none; padding:0; max-width: 95%; margin: 2.5%; }

#portfolio-icons { max-width: 640px; }
.web-development11 { margin: 0 -75px 0 -50px; }


#container-1 img { max-width: 100%; display: block; float: none !important; }
#container-1 .services_box img { float: left !important; }

h1 { font-size: 30px; }
h2 { font-size: 25px; }

.footer-item { min-width: 10%; }


}


@media screen and (max-width: 680px) {


.banner-box img { margin: 0 0 0 -180px; position: absolute; bottom: 0; left: 50%; max-height: 80%; }
.banner-text { padding: 5%; max-width: 90%; width: 90%; text-align: center; }
.banner-text p { display: none; }

.content_box { top: 20%; }

#social-box .side_social_list { display: none; }

#portfolio-icons { width: 620px; }
#portfolio-icons a {  }

.web-development11 { margin: 0 -85px 0 -60px; }
.two-icons { max-width: 385px; margin: 0 auto; display: block; float: none; min-height: 250px; padding: 0 0 0 20px; }


#logo_cont img { float: none; margin: 0 auto; display: block; }

.post_box_last { margin: 10px auto; float: none; }

.contact-form { float: none; margin: 5px 0 15px 0; width: 100%; padding: 0; border-right: none; background: none; height: auto; width: auto; position: relative; text-align: center; }
.phone-text { padding-top: 20px; margin-top: 20px; border-top: 1px solid #ccc; }
div.wpcf7 { width: 100%; float: none; margin: 0 !important;}


#banner .slide-text {}

.blog-single { padding: 0 2%; margin: 0; width: 96%; background: none; }
#sidebar { display: none; }
.blog-content { width: 100%; }


}



/* for mobile-landscape */


@media screen and (max-width: 600px) {

video { display: none; }

.about { height: 250px !important; }
.banner { height: 250px; margin: 0 0 10px 0; background-size: auto 350px !important; }
#changetext { width: 320px; margin-left: -160px; }
.banner h1 { font-size: 20px; padding: 28% 0 1%; }
.banner h2 { font-size: 9px; }

.contact-banner { margin: 0 auto;}
.contact-banner h1 { font-size: 30px; }

#portfolio-icons { width: 100%; margin: -40px 0 0 0; padding: 0; }
#portfolio-banner { background-image: none; } 
.web-development11 { margin: 0 auto; display: block; float: none; }
.brand-design11 { margin: 0 auto; display: block; float: none; line-height: 21; }
.creative-work11 { margin: 0 auto; display: block; float: none; line-height: 21; }
.two-icons { max-width: 100%; padding: 0; }

#main_container { width: 100%; margin: 0; padding: 0; }
#left_content { display: none; }
#left_content-page { display: none; }
#left_content-single { display: none; }

#slider_outer_container { display: none; }
#head-wrapper { position: relative; }
.default { height: 90px; }
.small { height: 90px; margin-top: 0px !important; }
#wprmenu_bar { position:absolute !important; }
#wprmenu_menu ul { padding-top: 91px !important; }

.logo-default { width: 229px; }
#logo_cont { background: url(images/logo.png) center center no-repeat !important; background-size: 100% auto !important; max-width: 80%; margin: 0; }
#logo_cont img { max-width: 100%; height: auto; }
.logo-small { background: url(images/logo.png) center center !important; height: 90px; }
#menu_container ul { display: none; }
#client-login { }
#menu_container { max-width: 90%; }

.slideshow-wrapper, .banner-wrapper, .single-wrapper { margin-top: 0px; }

.portfolio-content, .logo-content { margin-top: 0 !important; width: 96% !important; }

#container-1 img { margin: 10% auto; }
#container-1 .services_box img { margin: -9px 10px 0 0; }

.content_box { top: 35%; }
.content_box h3 { font-size: 20px; }

.blog_box img { max-width: 100%; }
.blog-content_box { padding: 5% 0; width: 100%; }
.blog_box { max-width: 96%; }

.contact-left, .contact-right { width: 100%; margin: 0; float:none; }

.wpcf7-form { max-width: 100%; }
.wpcf7-form-control { max-width: 100%; }
.wpcf7-text { max-width: 100%; }
.wpcf7-validates-as-required { max-width: 100%; }

.post_box, .logo-content .post_box {
width: 98%;
max-width: 486px;
margin: 1% auto;
float: none;
}

.post_box_last { margin: 10px auto; float: none; }

.footer-item { width: 100%; margin: 20px 0; min-height: 10px; }
.footer-logo { float: left; margin: 10px 0 0 0; width: 100%; position: relative; display: block; }
.footer-logo img { padding: 0; }

.side_search_cont { display: none; }
.side_widgets { display: none; }
.single_left_content img { max-width: 100%; height: inherit; margin: 0; padding: 15px 0; }
.single_left_content {padding: 0; }
.single_video { margin: 0 auto; padding: 0; max-width:100%; }

.single-web { display: block; }
#single-slider { display: none; }

.side_random_box { display: block; }
#comments { margin: 0 0 10px 0; }
ol.commentlist li.comment { min-height: 65px; }

.services_box { padding: 8% 5% 5% 5%; }

#banner img { max-width: 100%; width: 100%; }

#banner .slide-text { width: 90%; padding: 5% ; }

#social-box { position: relative; }

#video { height: 330px !important; }
#video_wrapper { height: 330px !important; }

.footer { padding: 20px; }

}


@media screen and (max-width: 350px) {

.web-development { margin: 0 0 0 -15px; }

.banner h1 { font-size: 20px; }
.banner h2 { font-size: 9px; letter-spacing: 1px; }

.banner-box img { margin: 0 0 0 -145px; position: absolute; bottom: 0; left: 50%; max-height: 65%; }

.content_box { top: 20%; }
.content_box h3 { font-size: 20px; }

#video { height: 280px !important; }
#video_wrapper { height: 280px !important; }

#portfolio-filter li { display: block; }

#container-1 .services_box img { margin: 0 10px 20px 0; }
.services_box { padding: 10% 5% 5% 5%; }


}