/*====================================================================*/
/* MEDIA QUERIES */
/*====================================================================*/


/*====================================================================*/
/* Smaller than standard 1040 (devices and browsers) */
/*====================================================================*/
@media only screen and (max-width: 1040px) {

/*----------------------------------------------*/
/* SITE STRUCTURE */
/*----------------------------------------------*/
#page-wrap.boxed {
width: 100%;
margin: 0;
}

}

/*====================================================================*/
/* Tablet Portrait (devices and browsers) */
/*====================================================================*/
@media only screen and (max-width: 959px) and (min-width: 768px) {

/*----------------------------------------------*/
/* SITE STRUCTURE */
/*----------------------------------------------*/
#page-wrap.boxed {
width: 100%;
margin: 0;
}

.container { width: 748px; }

/* Sidebars
---------------------------------------------------------- */
.right-sidebar #main-content,
.left-sidebar #main-content { width: 480px; }

/* Content
---------------------------------------------------------- */
/* Content Slider Section */
.content-slider .slides_container { width: 748px; }

.content-slider .intro {
margin: 0;
padding: 0;
width: 100%;
}

.content-slider .slide > ul { width: 776px; }

.content-slider .slide > ul > li {
margin: 0 28px 0 0;
width: 166px;
}

/* Clients Section */
.clients-wrap .clients-list a { margin: 0 10px 20px; }

.section-wrap .clients-wrap .clients-list a {
margin: 5px 6px;
width: 110px;
height: 110px;
}

/* Contact Form */
.contact-form .text-input { width: 85%; }

.contact-form .textarea {
width: 95%;
height: 150px;
}

/*----------------------------------------------*/
/* PORTFOLIO STYLES */
/*----------------------------------------------*/
/* Portfolio Two Columns
---------------------------------------------------------- */
.portfolio-two-columns .portfolio-item { width: 359px; }

/* Portfolio Three Columns
---------------------------------------------------------- */
.portfolio-three-columns .portfolio-item { width: 229px; }

/* Portfolio Four Columns
---------------------------------------------------------- */
.portfolio-four-columns .portfolio-item { width: 164px; }

/* Portfolio Single
---------------------------------------------------------- */
#portfolio-single .post-content {
float: left;
width: 480px;
}

#portfolio-single .post-details {
float: right;
margin: 0 0 20px 0 ;
width: 220px;
}

/*----------------------------------------------*/
/* WIDGET STYLES */
/*----------------------------------------------*/
/* Flickr Widget
---------------------------------------------------------- */
.flickr-wrap li a {
width: 46px;
height: 46px;
}

/* Google Map Widget
---------------------------------------------------------- */
.google-map { height: 340px; }

/*----------------------------------------------*/
/* BLOG STYLES */
/*----------------------------------------------*/
.blog-post .post-content {
float: right;
padding: 0 10px 0 0;
width: 320px;
}

.blog-post .post-meta {
float: left;
margin: 0 20px 20px 0;
padding: 0 0 0 10px;
width: 120px;
}

/* Comments Form
---------------------------------------------------------- */
.respond-note {float: left; }

#respond p {margin-bottom: 20px; }

#respond input {width: 83%; }

#respond label {margin-bottom: 3px; }

#respond textarea {
margin: 0;
width: 93%;
height: 144px;
}

/*----------------------------------------------*/
/* EXTENDED TYPOGRAPHY & SHORTCODES */
/*----------------------------------------------*/
/* Icon Boxes
---------------------------------------------------------- */
.icon-box.framed-box { padding: 20px 15px; }

}

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

/*----------------------------------------------*/
/* GENERAL TYPOGRAPHY */
/*----------------------------------------------*/
/* Columns Styles
---------------------------------------------------------- */
.one-fourth2{width: 100%;}
.one-half, .one-third, .two-third, .one-fourth, .three-fourth, .one-fifth, .two-fifth, .three-fifth, .four-fifth {
float: none;
margin-right: 0;
width: 100%;
}

/* Pricing Tables
---------------------------------------------------------- */
.column-6 .column, .column-5 .column, .column-4 .column, .column-3 .column, .column-2 .column {
float: none;
border-left: 1px solid #e5e5e5;
border-right: 1px solid #e5e5e5;
margin-bottom: 20px;
width: 100%;
}

.column.features { display: none; }

.features-list li .label { display: block; }

.pricing-table .featured { margin-top: 12px; }

/*----------------------------------------------*/
/* SITE STRUCTURE */
/*----------------------------------------------*/
#page-wrap.boxed {
width: 100%;
margin: 0;
}

.container { width: 300px; }

/* Header
---------------------------------------------------------- */
/* Logo */
#logo {
display: block;
float: none;
margin: 0px auto;
text-align: center;
width: 180px;
}

#logo a img {display: inline-block;}

/* Navigation
---------------------------------------------------------- */
#navigation { float: none; }

#main-menu {
visibility: hidden;
display: none;
}

/* Tiny Navigation
---------------------------------------------------------- */
.tinynav { display: block; }

/* FlexSlider
---------------------------------------------------------- */
/* Direction Navigation */
.flex-direction-nav .flex-next { right: 20px; }
.flex-direction-nav .flex-prev { left: 20px; }

/* Control Navigation */
.flex-control-nav { display: none; }

/* Slider Caption */
.slider-caption { display: none; }

/* Content
---------------------------------------------------------- */
/* Section General */
.section-wrap .container > .one-half, .section-wrap .container > .one-third, .section-wrap .container > .two-third, .section-wrap .container > .one-fourth, .section-wrap .container > .three-fourth, .section-wrap .container > .one-fifth, .section-wrap .container > .two-fifth-fifth, .section-wrap .container > .three-fifth, .section-wrap .container > .four-fifth { margin-bottom: 55px; }

.section-wrap .container > .one-half.last, .section-wrap .container > .one-third.last, .section-wrap .container > .one-fourth.last, .section-wrap .container > .three-fourth.last, .section-wrap .container > .one-fifth.last, .section-wrap .container > .two-fifth-fifth.last, .section-wrap .container > .three-fifth.last, .section-wrap .container > .four-fifth.last, .section-wrap .container > .one-half:last-child, .section-wrap .container > .one-third:last-child, .section-wrap .container > .one-fourth:last-child, .section-wrap .container > .three-fourth:last-child, .section-wrap .container > .one-fifth:last-child, .section-wrap .container > .two-fifth-fifth:last-child, .section-wrap .container > .three-fifth:last-child, .section-wrap .container > .four-fifth:last-child { margin-bottom: 0; }

.section-wrap .icon-box { margin: 0 0 20px; }

.section-wrap .ib-container .icon-box { margin: 0 0 30px; }

/* Custom Blocks Section */
.custom-blocks { background: none; }

.custom-blocks .block { float: none; }

.block-col-4 .block, .block-col-3 .block {
width: 100%;
margin-bottom: 1px;
}

.custom-blocks .block a { margin: 0; }

/* Content Slider Section */
/* Content Slider Navigation */
#content-slider-nav { margin-bottom: 10px; }

.tab-slider-wrapper, .tab-slider-inner-wrapper { height: auto; }

#content-slider-nav .pagination {
background: none;
border: none;
height: auto;
box-shadow: none;
}

#content-slider-nav .pagination li {
float: left;
display: inline-block;
border: none;
padding: 0 3px 5px;
width: auto;
height: auto;
}

#content-slider-nav .pagination a {
background: none;
display: inline-block;
padding: 2px 5px;
text-shadow: none;
}

#content-slider-nav .pagination a:hover {
background: none;
color: #1fb4dd;
}

#content-slider-nav .pagination li.current a {
background-color: #101010;
background-image: none;
}

#content-slider-nav .pagination li.current a::before {
content: '';
position: absolute;
width: 0;
height: 0;
bottom: -8px;
left: 50%;
margin-left: -4px;
border: 4px solid #101010;
border-width: 4px;
border-bottom: 4px solid #101010;
border-left-color: transparent;
border-right-color: transparent;
border-bottom-color: transparent;
}

#content-slider-nav .pagination li strong {
font-size: 13px;
font-weight: 700;
}

#content-slider-nav .pagination li.current a strong { color: #fff; }

#content-slider-nav .pagination a small { display: none; }

#active-indicator { display: none; }

/* Content Slides Container */
.content-slider .slides_container {
width: 100%;
margin: 0;
padding: 0;
}

.content-slider .slide > ul {
display: inline-block;
float: none;
margin: 0;
width: 300px;
height: auto;
text-align: left;
}

.content-slider .slide > ul > li {
float: none;
display: inline-block;
width: 300px;
margin: 5px 0 25px;
}

.content-slider .slide > ul > li:last-child { margin-bottom: 5px; }

.content-slider .blog-item {
border-bottom: 1px dotted #e5e5e5;
padding-bottom: 25px;
}

.content-slider .blog-item:last-child {
border-bottom: 0;
padding-bottom: 0px;
}

/* Call To Action */
.call-to-action h1, .call-to-action h2, .call-to-action h3, .call-to-action h4, .call-to-action h5, .call-to-action p { text-align: center; }

/* Clients Section */
.clients-wrap .clients-list { margin: 0 0 20px; }
.clients-wrap .clients-list a { margin: 5px; }

/* Related Works Section */
.related-work-wrap .portfolio-item { margin-bottom: 30px; }
.related-work-wrap .portfolio-item:last-child { margin-bottom: 0; }

/* 404 Error page */
.error-404 span.text-404 { font-size: 150px; }

/* Contact Form */
.contact-form p { display: block; }

.contact-form .text-input { width: 92%; }

.contact-form .textarea {
width: 92%;
height: 150px;
}

/* Sidebars
---------------------------------------------------------- */
.right-sidebar #main-content, .left-sidebar #main-content {
float: none;
border-bottom: 1px solid #e5e5e5;
padding-bottom: 20px;
width: 100%;
}

.right-sidebar #sidebar, .left-sidebar #sidebar {
float: none;
margin-top: 40px;
width: 100%;
}

/* Footer Bottom
---------------------------------------------------------- */
#footer-bottom { text-align: center; }

/* Copyright */
.copyright {
float: none;
display: block;
margin: 0 0 10px 0;
}

/* Footer Menu */
.footer-menu {
float: none;
display: block;
margin: 0 0 10px;
text-align: center;
}

.footer-menu ul { display: inline-block; }

.footer-menu li:first-child {
margin-left: 0;
border-left: 0;
}

/*----------------------------------------------*/
/* PORTFOLIO STYLES */
/*----------------------------------------------*/
.portfolio-container { margin: 0; }

/* Portfolio Two, Three, Four Columns
---------------------------------------------------------- */
.portfolio-two-columns .portfolio-item, .portfolio-three-columns .portfolio-item, .portfolio-four-columns .portfolio-item {
width: 300px;
margin-right: 0;
}

/* Portfolio Single
---------------------------------------------------------- */
#portfolio-single .post-content {
float: none;
border-bottom: 1px solid #e5e5e5;
margin-bottom: 40px;
padding-bottom: 20px;
width: 100%;
}

#portfolio-single .post-details {
float: none;
margin: 0 0 20px 0 ;
width: 100%;
}

/*----------------------------------------------*/
/* WIDGET STYLES */
/*----------------------------------------------*/
/* Search Form Widget
---------------------------------------------------------- */
input.search-input { width: 86%; }

/* Twitter Widget
---------------------------------------------------------- */
#content .section-wrap .twitter-wrap .tweet_list {
padding: 60px 0 0 0;
background: transparent url('../images/icons/twitter.png') no-repeat scroll 50% 5px;
}

/* Flickr Widget
---------------------------------------------------------- */
.flickr-wrap li a, #sidebar .flickr-wrap li a {
width: 42px;
height: 42px;
}

/* Social Media Widget
---------------------------------------------------------- */
#footer-bottom .social {
float: none;
display: block;
margin: 0;
border-top: 1px dashed #313131;
padding: 15px 0 0 0;
}

/* Google Map Widget
---------------------------------------------------------- */
.google-map { height: 150px; }

/*----------------------------------------------*/
/* BLOG STYLES */
/*----------------------------------------------*/
.blog-post { padding-bottom: 10px; }

.blog-post .post-content {
float: none;
margin: 0;
padding: 0 10px;
width: auto;
}

.blog-post .post-meta {
float: none;
margin: 0;
padding: 0 10px;
width: auto;
}

.meta-list {
background: #f3f3f3;
float: none;
}

.meta-list li { padding: 0 0 0 10px; }

/* Blog Slider */
.blog-slider .flex-next { right: 0px; }

.blog-slider .flex-prev { left: 0px; }

/* Post Navigation
---------------------------------------------------------- */
.post-nav .nav {
float: right;
display: inline-block;
margin: 10px 20px 0 0;
}

/* Comments List
---------------------------------------------------------- */
.comment-list .framed-box { margin: 0 0 20px 50px }

.gravatar {
width: 40px;
height: 40px;
}

.comment-info {
background: none;
padding-left: 0;
overflow: hidden;
}

.children {
list-style-type: none;
margin: 0 0 0 20px;
}

/* Comments Form
---------------------------------------------------------- */
.respond-note { float: left; }

#respond p { margin-bottom: 20px; }

#respond input { width: 93%; }

#respond label { margin-bottom: 3px; }

#respond textarea {
margin: 0;
width: 93%;
height: 150px;
}

/*----------------------------------------------*/
/* EXTENDED TYPOGRAPHY & SHORTCODES */
/*----------------------------------------------*/
/* Icon Boxes
---------------------------------------------------------- */
.one-half:last-child .icon-box, .one-third:last-child .icon-box, .one-fourth:last-child .icon-box, .one-fifth:last-child .icon-box { margin-bottom: 5px; }


div.tel_topo {text-align: center!important;font-size: 17px!important;}

}

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

/*----------------------------------------------*/
/* GENERAL TYPOGRAPHY */
/*----------------------------------------------*/
/* Pricing Tables
---------------------------------------------------------- */
.column-6 .column, .column-5 .column, .column-4 .column, .column-3 .column, .column-2 .column {
float: left;
width: 50%;
border: 0;
}

.pricing-table .featured { margin-top: -12px; }

/*----------------------------------------------*/
/* SITE STRUCTURE */
/*----------------------------------------------*/
#page-wrap.boxed {
width: 100%;
margin: 0;
}

.container { width: 420px; }

/* Content
---------------------------------------------------------- */
/* Custom Blocks Section */
.custom-blocks .block { float: left; }

.custom-blocks .block a { margin-right: 1px; }

.block-col-4 .block {
width: 50%;
margin-bottom: 1px;
}

/* Content Slider Section */
/* Content Slider Navigation */
#content-slider-nav .pagination li { padding: 0 5px 5px; }

#content-slider-nav .pagination a { padding: 2px 8px; }

/* Content Slides Container */
.content-slider .slide > ul { width: 420px; }
.content-slider .slide > ul > li { width: 420px; }

/* Clients Section */
.clients-wrap .clients-list a {
width: 128px;
height: 128px;
}

.section-wrap .clients-wrap .clients-list a:nth-child(3n) { margin-right: 0; }

/* 404 Error page */
.error-404 span.text-404 { font-size: 250px; }

/*----------------------------------------------*/
/* PORTFOLIO STYLES */
/*----------------------------------------------*/
/* Portfolio Two, Three, Four Columns
---------------------------------------------------------- */
.portfolio-two-columns .portfolio-item, .portfolio-three-columns .portfolio-item, .portfolio-four-columns .portfolio-item { width: 420px; }

/*----------------------------------------------*/
/* WIDGET STYLES */
/*----------------------------------------------*/
/* Search Form Widget
---------------------------------------------------------- */
input.search-input { width: 90%; }

/* Flickr Widget
---------------------------------------------------------- */
.flickr-wrap li a,
#sidebar .flickr-wrap li a {
width: 62px;
height: 62px;
}

/* Google Map Widget
---------------------------------------------------------- */
.google-map { height: 200px; }

/*----------------------------------------------*/
/* BLOG STYLES */
/*----------------------------------------------*/
/* Post Navigation
---------------------------------------------------------- */
.post-nav .nav { margin: 0 20px 0 0; }

}

/*====================================================================*/
/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
/*====================================================================*/
@media only screen and (max-width: 479px) {

/*----------------------------------------------*/
/* SITE STRUCTURE */
/*----------------------------------------------*/
#page-wrap.boxed {
width: 100%;
margin: 0;
}

}

/*====================================================================*/
/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
/*====================================================================*/
@media only screen and (max-width: 320px){

/*----------------------------------------------*/
/* SITE STRUCTURE */
/*----------------------------------------------*/
.container {
width: 100%;
margin: 0;
}

/*----------------------------------------------*/
/* PORTFOLIO STYLES */
/*----------------------------------------------*/
/* Portfolio Two, Three, Four Columns
---------------------------------------------------------- */
.portfolio-two-columns .portfolio-item, .portfolio-three-columns .portfolio-item, .portfolio-four-columns .portfolio-item { width: 100%; }

/*----------------------------------------------*/
/* WIDGET STYLES */
/*----------------------------------------------*/
/* Search Form Widget
---------------------------------------------------------- */
input.search-input { width: 83%; }

/*----------------------------------------------*/
/* BLOG STYLES */
/*----------------------------------------------*/
/* Comments Form
---------------------------------------------------------- */
#respond input, #respond textarea { width: 90%; }

}