/* Responsive CSS Document */


/* #Tablet (Landscape) 1177px
----------------------------------------------------------------------*/
@media only screen and (min-width: 959px) and (max-width: 1177px) {
	body {overflow-x: hidden}
	.boxed, .blocked {width: 98% }
	.row { width: 94%; }
	.showcase li, .showcase a { width: 235px; height: 140px }
	.showcase a:hover h3 { bottom: 60px }
	.showcase a p { bottom: -120px }
	.jcarousel-clip { width: 100.7% }
	#clients .jcarousel-item-horizontal { margin-right: 10px }
	.first-head .grid_3 {width:25%}
	.first-head .grid_6 {width: 44.0%}
	.modern-slider {width: auto;height: 300px;}
	.modern-slider img {width: auto;height: 100%;}
	.myslicebox, .shadow {width: 800px;}
	.nav-arrows a {left: -8%;}
	.nav-arrows a:first-child {right: -8%;}
	.rm_container {width: 960px;}
	.slides-navigation a.next {left: 13%}
	#slides .slides-container li h3 {left: 18%; bottom: 5.1%; }
	div.jp-audio div.jp-type-single div.jp-progress, div.jp-audio div.jp-type-single div.jp-time-holder {width: 430px !important}
	.second-head .sf-menu li {margin-left: 6px;}
	.landing #iview {height: 600px !important;}
	.sticky {position: relative}
	.first-head {margin-bottom: 0 !important}
}

/* #Tablet (Portrait) 768px
----------------------------------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
	body {overflow-x: hidden}
	.boxed, .blocked {width: 97% }
	.row { width: 91%; }
	.info, .big-slider p, .grid_9 .showcase a h3, .grid_9 .showcase a p, .pxs_navigation, .head-social { display: none !important }
	.first-head .grid_3 { float: right }
	.sticky {position: relative}
	.first-head {margin-bottom: 0 !important}
	.big-slider h3 { bottom: 4%; left: 2%; z-index: 999 }
	.stunning-box .btn { margin-top: 30px }
	.showcase li, .showcase a { width: 225px; height: 140px }
	.showcase a p { bottom: -120px }
	.showcase a:hover h3 { bottom: 62px }
	.date { padding: 16px }
	.jcarousel-clip { width: 100.7% }
	#clients .jcarousel-item-horizontal { margin-right: 10px }
	.second-head .sf-menu li {margin-left: 2px}
	.smalltt {padding: 6px 20px}
	.mediumtt {padding: 10px 20px }
	.btn {padding: 14px 20px }
	.modern-slider {width: auto;height: 280px;}
	.modern-slider img {width: auto;height: 100%;}
	.myslicebox, .shadow {width: 545px}
	.nav-arrows a {left: -12%}
	.nav-arrows a:first-child {right: -12%}
	.roundabout ul {width: 58%}
	.liteAccordion.light {width: 90% !important}
	.rm_container {width: 600px}
	.slides-navigation a.next {left: 15%}
	#slides .slides-container li h3 {left: 22%; bottom: 5% }
	.single-pager .live-version > span, .single-pager .live-version > a {display: inline-block}
	div.jp-audio div.jp-type-single div.jp-progress, div.jp-audio div.jp-type-single div.jp-time-holder {width: 240px !important}
	.services h4 {margin: 8px 0 20px; float: none;}
	.services {text-align: center}
	.services .clearfix {text-align: left !important}
	.services img {float: none;margin: 0 auto 20px;}
	.widget-title h4 {margin: 2px 0 0 0}
	.widget-title img {width: 40px}
	.testimonial-s .testimonial-details {margin: 30px 0px 8px 20px}
	.blog-three-columns .post-title {margin: 0px 0 10px 20px;width: 63%}
	.author p, .author h3 {width: 60%}
	.single-pager .live-version > span, .single-pager .live-version > a {width: auto}
	.single-pager .previous > span, .single-pager .previous > a, .single-pager .next > span, .single-pager .next > a {width: 40px}
	.grid_3 .single-pager .previous > span, .grid_3 .single-pager .previous > a, .grid_3 .single-pager .next > span, .grid_3 .single-pager .next > a {width: 30px}
	.landing #iview {height: 500px !important;}
}

/* #Mobile (Landscape) 480px
----------------------------------------------------------------------*/
@media only screen and (min-width: 480px) and (max-width: 767px) {
	body {overflow-x: hidden}
	.boxed, .blocked {width: 96% }
	.blocked {margin: 8px auto;}
	.row { width: 94%; }
	.sticky {position: relative}
	.first-head {margin-bottom: 0 !important}
	.grid_2, .grid_3, .grid_4, .grid_5, .grid_6, .grid_7, .grid_8, .grid_9,.grid_1.alpha,.grid_1.omega,.grid_2.alpha,.grid_2.omega,.grid_3.alpha,.grid_3.omega,.grid_4.alpha,.grid_4.omega,.grid_5.alpha,.grid_5.omega,.grid_6.alpha,.grid_6.omega,.grid_7.alpha,.grid_7.omega,.grid_8.alpha,.grid_8.omega,.grid_9.alpha,.grid_9.omega,.grid_10.alpha,.grid_10.omega,.grid_11.alpha,.grid_11.omega,.grid_12.alpha,.grid_12.omega,.grid_1_5.alpha,.grid_1_5.omega,.grid_2_5.alpha,.grid_2_5.omega,.grid_3_5.alpha,.grid_3_5.omega,.grid_4_5.alpha,.grid_4_5.omega {width: 98%; margin-bottom: 40px;margin-left: 0;margin-right: 0;}
	.first-head .grid_3 {width: 30%; margin-bottom: 0;float:right}
	.first-head .grid_6 {width: 70%; margin-bottom: 0;}
	.second-head .grid_3, .second-head .grid_6 {width: auto; margin-bottom: 0;}
	.row { padding: 0 }
	.info, .big-slider p, .grid_9 .showcase a h3, .grid_9 .showcase a p, .pxs_navigation, #toTop, .galleri4 p, .labele, .galleri4 h3, .sb-slider h3 { display: none !important }
	.big-slider h3 { bottom: 4%; left: 2%; z-index: 999 }
	.second-head .sf-menu a { color: #333 !important; background: #fff !important; border-radius: 3px }
	.second-head .sf-menu a:hover { color: #fff !important; background: #2C3E50 !important }
	#mobilepro { display: block; }
	.second-head .sf-menu {width: 100%!important;display: none; margin: 4px 0 !important }
	.second-head .sf-menu li li, .second-head .sfHover { background: none }
	.second-head .sf-menu li { margin-bottom: 10px; margin-left: 0 }
	.second-head .sf-menu.xactive { display: block !important; }
	.second-head .sf-menu ul:before { content: ""; border-width: 0 0 0 0 !important }
	.second-head .second-head .sf-menu > li.sfHover:before {color: #000;background: none;width: 0;height: 0px;}
	.second-head .sf-menu li:hover ul, .second-head .sf-menu li.sfHover ul { padding: 0 !important }
	.second-head ul.sf-menu li:hover ul, .second-head ul.sf-menu li.sfHover ul, .second-head ul.sf-menu li ul { margin-top: 4px }
	.second-head .sf-menu li { float: none !important; display: block !important; width: 100% !important;overflow: hidden; }
	.second-head .sf-menu li a, .second-head  li:first-child a, .second-head .sf-menu ul li, .second-menu li.current { float: none !important; border: 0; }
	.second-head .sf-menu li:hover ul, .second-head .sf-menu li.sfHover ul {box-shadow: none;-webkit-animation: initial;animation: initial;-moz-animation: initial;-o-animation: initial; }
	.second-head .sf-menu li li {left: 10px;}
	.second-head .sf-menu ul {position:static !important; display: none !important; width: 100%; }
	.second-head .xpopdrop ul {display: block !important; visibility: inherit !important }
	.stunning-box .btn { margin-top: 30px }
	#clients .jcarousel-item-horizontal { margin-right: 10px }
	#clients img {height: auto}
	.showcase li, .showcase a, .galleri1 a, .galleri1 li { width: 433px; height: 273px !important }
	.galleri3 a, .galleri3 li { width: 140px !important; height: 88px !important }
	.galleri2 a, .galleri2 li { width: 218px !important; height: 136px !important }
	.galleri4 li, .galleri4 a {width: 109px !important;height: 68px !important }
	.showcase a:hover img {top: 0}
	.showcase a p { bottom: -120px }
	.showcase a:hover h3 { bottom: 46px }
	.showcase a p {height: 44px;width: 394px;}
	.breadcrumb ul li {font-size: 12px}
	.tabs li a {padding: 10px 12px;}
	.blockquote.left, .blockquote.right {width: 100%;margin-right: 0;float: none;}
	.breadcrumb ul li {padding: 0 10px 0}
	.breadcrumb ul li:first-child {padding: 0 10px 0 0;}
	.modern-slider {width: auto;height: 200px;}
	.modern-slider img {width: auto;height: 100%;}
	.myslicebox {width: 400px;}
	.shadow {width: 400px; height: 80px; margin: -70px auto 0;}
	.nav-arrows a {left: -16%;}
	.nav-arrows a:first-child {right: -16%;}
	.roundabout li {max-width: 100% !important}
	.liteAccordion.light {width: 90% !important;}
	ul.pxs_thumbnails {bottom: 20%;top: auto;}
	.pxs_container, ul.pxs_slider  {height: 300px}
	.rm_container {width:470px;}
	.slides-navigation a.next {left: 18%}
	#slides .slides-container li h3 {left: 28%; bottom: 3.5%; }
	div.jp-audio div.jp-type-single div.jp-progress, div.jp-audio div.jp-type-single div.jp-time-holder {width: 170px !important}
	.post-title-row .post-title {width: 80%}
	.meta-more {padding: 0 0 0 14px}
	.author, .author p {border: 0px solid #EAEAEA;width: 100%;}
	ul.showcomments li.child {margin: 0 0px 32px 30px;}
	.zoom {right: 0; width: auto !important }
	.sticky {position: relative }
	.fb-blog .grid_2 {width: 14.667%}
	.landing #iview {height: 320px !important;}
}

/*  #Mobile (Portrait) 320px
----------------------------------------------------------------------*/
@media only screen and (min-width: 100px) and (max-width: 479px) {
	body {overflow-x: hidden}
	.boxed, .blocked {width: 94% }
	.blocked {margin: 8px auto;}
	.row { width: 94%; }
	.sticky {position: relative}
	.first-head {margin-bottom: 0 !important}
	.grid_2, .grid_3, .grid_4, .grid_5, .grid_6, .grid_7, .grid_8, .grid_9,.grid_1.alpha,.grid_1.omega,.grid_2.alpha,.grid_2.omega,.grid_3.alpha,.grid_3.omega,.grid_4.alpha,.grid_4.omega,.grid_5.alpha,.grid_5.omega,.grid_6.alpha,.grid_6.omega,.grid_7.alpha,.grid_7.omega,.grid_8.alpha,.grid_8.omega,.grid_9.alpha,.grid_9.omega,.grid_10.alpha,.grid_10.omega,.grid_11.alpha,.grid_11.omega,.grid_12.alpha,.grid_12.omega,.grid_1_5.alpha,.grid_1_5.omega,.grid_2_5.alpha,.grid_2_5.omega,.grid_3_5.alpha,.grid_3_5.omega,.grid_4_5.alpha,.grid_4_5.omega {width: 98%; margin-bottom: 40px;margin-left: 0;margin-right: 0;}
	.first-head {min-height: 32px}
	.first-head .grid_3 {width: 70%;position: absolute;top: 0;right: 28px;}
	.first-head .grid_6 {width: 100%; margin-bottom: 0}
	.second-head .grid_3, .second-head .grid_6 {width: auto; margin-bottom: 0}
	.row { padding: 0 }
	.info, .big-slider p, .big-slider h3, .head-social, div.jp-audio div.jp-type-single a.jp-mute, div.jp-audio div.jp-type-single a.jp-unmute, .sb-slider h3, .grid_9 .showcase a h3, .grid_9 .showcase a p, div.jp-audio div.jp-volume-bar, .labele, .pxs_navigation, #slides .slides-container li h3, #toTop { display: none !important }
	.sf-menu a { color: #333 !important; background: #fff !important; border-radius: 3px }
	.sf-menu a:hover { color: #fff !important; background: #2C3E50 !important }
	#mobilepro { display: block; margin: 40px 10px 40px 0 }
	#firstmobilepro { display: block }
	.sf-menu {width: 100%!important;display: none; margin: 4px 0 !important }
	.second-head .sf-menu li li, .second-head .sfHover { background: none }
	.second-head .sf-menu li { margin-bottom: 10px; margin-left: 0 }
	.sf-menu.xactive { display: block !important }
	.sf-menu ul:before { content: ""; border-width: 0 0 0 0 !important }
	.sf-menu > li:before {background: none !important }
	.sf-menu > li.sfHover:before {color: #000;background: none;width: 0;height: 0px}
	.sf-menu li:hover ul, .sf-menu li.sfHover ul { padding: 0 !important }
	ul.sf-menu li:hover ul, ul.sf-menu li.sfHover ul, ul.sf-menu li ul { margin-top: 4px }
	.sf-menu li { float: none !important; display: block !important; width: 100% !important;overflow: hidden }
	.sf-menu li a, li:first-child a, .sf-menu ul li, .second-menu li.current { float: none !important; border: 0}
	.sf-menu li:hover ul, .sf-menu li.sfHover ul {box-shadow: none;-webkit-animation: initial;animation: initial;-moz-animation: initial;-o-animation: initial}
	.sf-menu li li {left: 10px}
	.sf-menu ul {position:static !important; display: none !important; width: 100% }
	.xpopdrop ul {display: block !important; visibility: inherit !important }
	.first-head .sf-menu li {margin-right: 0;margin-bottom: 4px;}
	.first-head .sf-menu li a {padding: 0 8px}
	.first-head .sf-menu li li {background: none;}
	.stunning-box .btn { margin-top: 30px }
	#clients .jcarousel-item-horizontal { margin-right: 10px }
	#clients img {height: auto}
	.breadcrumb ul li {font-size: 12px}
	.tabs li a {padding: 10px 12px}
	.blockquote.left, .blockquote.right {width: 100%;margin-right: 0;float: none}
	.breadcrumb ul li {padding: 0 10px 0}
	.breadcrumb ul li:first-child {padding: 0 10px 0 0}
	.modern-slider {width: auto;height: 120px}
	.modern-slider img {width: auto;height: 100%}
	.myslicebox {width: 200px}
	.shadow {width: 200px; height: 80px; margin: -70px auto 0}
	.nav-arrows a {left: -24%}
	.nav-arrows a:first-child {right: -24%}
	.liteAccordion.light {width: 90% !important}
	ul.pxs_thumbnails {bottom: 40%}
	.rm_container {width: 300px}
	.slides-navigation a.next {left: 24%}
	div.jp-audio div.jp-type-single div.jp-progress, div.jp-audio div.jp-type-single div.jp-time-holder {width: 140px !important}
	.showcase li, .showcase a { width: 282px; height: 182px }
	.galleri3 a, .galleri3 li { width: 136px !important; height: 86px !important }
	.galleri2 a, .galleri2 li { width: 134px !important; height: 84px !important }
	.galleri4 li, .galleri4 a { width: 68px !important;height: 42px !important }
	.showcase a:hover img {top: 0}
	.showcase a p {height: 60px;width: 242px}
	.post-title-row .post-title {width: 70%}
	.meta-more {padding: 20px 0 0 0}
	div.jp-audio ul.jp-controls {width: 238px}
	.author, .author p {border: 0px solid #EAEAEA;width: 100%}
	ul.showcomments li.child {margin: 0 0px 32px 30px}
	.zoom {right: 0}
	.sticky {position: relative }
	ul.pxs_thumbnails {bottom: 20%;top: auto}
	.pxs_container, ul.pxs_slider  {height: 270px}
	.rm_container {width:370px}
	.mslider-arrow i {padding: 2px 0 0 17px;font-size: 16px}
	.mslider-arrow {width: 40px;height: 20px}
	.mslider-controls {right: 4%}
	.ca-menu {padding: 0 0 0 36px;width: 86%}
	.fb-blog .grid_2 {width: 14.667%}
	.date {padding: 12px}
	.landing #iview {height: 200px !important;}
}


/* Flexslider */
@media screen and (max-width: 860px) {
	.flex-direction-nav .flex-prev {opacity: 1; left: 0;}
	.flex-direction-nav .flex-next {opacity: 1; right: 0;}
}