/*
Zerotheme.com | Free Html5 Responsive Templates
Zerogrid - A Single Grid System for Responsive Design
Author: Kimmy
Version : 2.1
Author URI: http://www.zerotheme.com/
*/
/* -------------------------------------------- */
/* ------------------Grid System--------------- */
.zerogrid{ width: 960px; position: relative; margin: 0 auto; padding: 0px;}
.zerogrid:after { content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; }
.zerogrid .row{}
.zerogrid .row:before,.row:after { content: '\0020'; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0; }
.zerogrid .row:after{clear: both; }
.zerogrid .row{zoom: 1;}
.about-content img.navigate{padding:0}
.zerogrid .wrap-col{/*margin:10px;*/}
.zerogrid .col-1-2, .zerogrid .col-1-3, .zerogrid .col-2-3, .zerogrid .col-1-4, .zerogrid .col-2-4, .zerogrid .col-3-4, .zerogrid .col-1-5, .zerogrid .col-2-5, .zerogrid .col-3-5, .zerogrid .col-4-5, .zerogrid .col-1-6, .zerogrid .col-2-6, .zerogrid .col-3-6, .zerogrid .col-4-6, .zerogrid .col-5-6{float:left; display: inline-block;}
.zerogrid .col-full{width:100%;}
.zerogrid .col-1-2{width:50%;}
.zerogrid .col-1-3{width:33.33%;}
.zerogrid .col-2-3{width:66.66%;}
.zerogrid .col-1-4{width:25%; font-size:14px;}
.zerogrid .col-2-4{width:50%;}
.zerogrid .col-3-4{width:75%;}
.zerogrid .col-1-5{width:20%;}
.zerogrid .col-2-5{width:40%;}
.zerogrid .col-3-5{width:60%;}
.zerogrid .col-4-5{width:80%;}
.zerogrid .col-1-6{width:16.66%;}
.zerogrid .col-2-6{width:33.33%; font-size:14px;}
.zerogrid .col-3-6{width:50%;}
.zerogrid .col-4-6{width:66.66%;}
.zerogrid .col-5-6{width:83.33%;}
@media only screen and (min-width: 768px) and (max-width: 959px) {
.zerogrid{width:768px;}
}
@media only screen and (max-width: 767px) {
.zerogrid{width:100%;}
}
@media only screen and (min-width: 620px) and (max-width: 767px) {
.zerogrid{width:100%;}
}
@media only screen and (max-width: 619px) {
.zerogrid, .zerogrid .col-1-2, .zerogrid .col-1-3, .zerogrid .col-2-3, .zerogrid .col-1-4, .zerogrid .col-2-4, .zerogrid .col-3-4, .zerogrid .col-1-5, .zerogrid .col-2-5, .zerogrid .col-3-5, .zerogrid .col-4-5, .zerogrid .col-1-6, .zerogrid .col-2-6, .zerogrid .col-3-6, .zerogrid .col-4-6, .zerogrid .col-5-6{width:100%;}
}
@media only screen and (min-width:1024px) and (max-width: 1279px)
{
.contact-list li.lead {width: 365px;}
.faq{width:95%}
.feedback-list li{width:160px;}
.feedback-list li.big{width:355px}
}
/* < 1024px Layout */
@media only screen
and (max-width : 1023px) {
.width-container {
width: 90%;
}
.faq{width:95%}
.social-list li{width:180px;margin:0px}
.feedback-list li{width:330px;margin:10px 22px}
.feedback-list li.big{width:330px}
.contact-list li {width: 190px;}
.contact-list li.lead {width: 260px;}
#row3,#row5,#row7{padding-bottom:40px}
#row6{min-height:530px}
#row7 h1{font-size:30px}
.menu-content{width:100%}
#row4 h1{font-size:42px}
#row4 .menu-list li{margin:25px 4px 0}
#row4 p{font-size:16px}
header {
text-align: center;
}
header.iconic {
height: 114px;
}
header .width-container {
width: 100%;
height: 114px;
overflow: hidden;
}
.logo {
float: none;
}
#main-nav {
float: none;
font-size:19px
}
#main-nav ul {
width: 100%;
}
#main-nav li {
margin:0 7.5px;
}
header.iconic #main-nav a {
padding: 0 !important;
}
header.simple #main-nav a {
padding: 0px 0 !important;
}
#options-panel .container {
top: 32px;
}
#main-slider-container {
padding: 85px 0px 0px 0px;
}
#main-slider-container .flexslider {
height: 480px !important;
}
#main-slider-container .slides > li {
height: 480px !important;
}
#main-slider-container .slides #grassy-lady{
background-position: 36% 50%!important;
}
#main-slider-container .slides > li#dandelion {
background-position: 100% center !important;
}
#main-slider-container .main-headings h1,
#main-slider-container .main-headings h2 {
font-size: 22px;
}
#main-slider-container .main-headings h1, #main-slider-container .main-headings h2 {
width: 430px;
padding: 9px 10px;
line-height: normal;
}
#main-slider-container .heading-connector1 {
background-size: 391px 459px;
background-repeat: no-repeat;
}
#main-slider-container .heading-connector2 {
background-size: 377px 459px;
background-repeat: no-repeat;
float: none;
margin-left: 22px;
}
#main-slider-container .main-headings {
left: 40px;
}
#main-slider-container .sub-headings {
top: 237px;
left: 62px;
}
#main-slider-container .sub-headings h2 {
width: 310px;
margin: 0px 0px 10px 0px;
font-size: 15px;
padding: 11px 15px 10px 24px !important;
}
#main-slider-container .sub-headings span i {
line-height: 20px;
margin-right: 8px;
}
#main-slider-container button {
top: 400px;
left: 150px;
font-size: 16px;
}
#main-slider-container .flexslider .slides img {
width: 25% !important;
}
#main-slider-container .flexslider .slides img#slide5-element {
top: 68px;
right: -270px;
width: 650px !important;
}
#row1 .content-container .container:first-child {
width: 100%;
}
.row .heading-container h1 {
font: 900 43px 'Core Sans N 95 Black', 'serif';
}
.row .heading-container h2 {
font: 400 22px/27px 'Source Sans Pro', 'serif';
padding: 3% 2% 3% 5%;
}
.row .content-container h3 {
font: 900 22px 'Source Sans Pro', 'serif';
margin: 0px 0px 30px 0px !important;
}
.row .heading-container,
#row2 .heading-container {
margin: 0px 0px 40px 0px;
}
#row1 .content-container .left.last {
width: 100%;
}
#newsletter {
font-size: 18px;
}
#newsletter span:first-child {
font-size: 19px;
}
#newsletter input {
font-size: 16px;
}
#row2 .content-container .container:first-child {
width: 100%;
}
#row2 .content-container .left:first-child p {
margin: 0px 0px 30px 8px;
}
#row2 .content-container .container.last h3 {
margin: 0px 0px 20px 0px;
}
#row2 .content-container .container.last {
width: 100%;
}
#row5 .content-container h3:first-child {
margin-bottom: -15px !important;
}
#row6 .content-container .container:first-child {
width: 100%;
}
#row6 .content-container .left:first-child p {
width: 60%;
float: left;
margin: 0px 0px 0px 1.2%;
}
#row6 .contact-details {
float: right;
margin: -8px 0px 0px 0px;
width: 35%;
}
#row6 .contact-details ul {
margin: 0px 0px 0px 0px;
}
#row6 form {
margin: 50px 0px 0px 0px;
}
#row6 .left.last {
width: 100%;
}
#newsletter {
width: 60%;
height: 130px;
margin: 5% auto 3%;
padding: 20px 10px 0px 10px;
}
#newsletter input {
width: 65%;
}
.button-container {
width: 668px;
margin: 7px auto 0px;
}
#notched-line {
margin: 50px auto 0px;
}
#service-description-container {
margin: 0px auto 35px;
}
.parallax-container {
background-position: 50% 36%;
}
.parallax1 .testimonial-container p {
font-size: 20px;
}
#process-container {
width: 100%;
margin: 20px 0px 50px 0px;
background: none;
height: 100%;
}
.process-grid {
text-align: justify;
}
.process-grid li {
width: 25%;
display: inline-block;
float: left;
text-align: center;
position: static;
}
.process {
margin: 0 auto;
}
#skills-container {
margin: 0px 0px 60px 0px;
}
.collapsable-items-container {
margin: 0px 0px 0px 0px;
}
.collapsable-items-container .collapsable-item .hidden-container p {
margin: 20px 0px 0px 15px;
}
#team-container .team-member {
width: 23.125%;
margin: 2.539% 0px 130px 2.5%;
}
footer #upper-footer .info {
width: 100%;
margin: 0px 0px 20px 0px;
}
footer #upper-footer .news {
width: 50%;
padding: 0px 0px 0px 0%;
margin: 30px 0px 0px 0px;
}
footer #upper-footer .tweets {
width: 50%;
margin: 30px 0px 0px 0px;
}
footer #bottom-footer {
height: auto;
padding: 32px 0px 20px 0px;
}
footer #bottom-footer .width-container {
text-align: center;
}
footer #bottom-footer .social-links {
margin: 10px auto;
height: 30px;
width: 250px;
float: none;
}
footer #bottom-footer span {
float: none;
margin: 0 auto;
}
footer #upper-footer .news h3 {
margin: 0px 0px 0px 0px;
}
footer #upper-footer .news ul li {
padding: 22px 10px 20px 0px;
}
.bx-wrapper {
width: 565px !important;
margin: 0 auto;
}
.bx-wrapper .bx-viewport {
margin: 0px 0px 0px 0px !important;
}
.bx-wrapper .bx-prev {
left: -45px !important;
}
.bx-wrapper .bx-next {
right: -45px !important;
}
}
/* 768px < x < 1024px Layout */
/* < 768px Layout */
@media only screen
and (max-width : 767px) {
#main-nav{font-size:16px}
#main-nav ul {
}
.faq{width:95%}
.social-list li{width:180px;margin:0px}
.feedback-list li{width:330px;margin:10px 22px}
.feedback-list li.big{width:330px}
.contact-list{text-align:center}
.contact-list li {width: 100%;display:block;margin:30px auto 30px;clear:both; position:relative; top:20px;}
.contact-list li.lead {width: 100%;}
.contact-list li .building{margin:0 0 20px}
#row6,#row4{padding-bottom:40px}
header.page1{background:none;}
.home-content p{ font-size:18px;}
.about-content span{font-size:23px; }
.about-content img { padding:10px;}
.slogan h3{font-size:23px;}
.btn-dwld{top:-10px;}
footer{font-size:14px; text-align:center;}
#page4 h1{ margin:0 38px 20px;}
.social-list li{width:140px}
#row4 .menu-list li {margin: 25px 3px 0px;display:inline-block;float:none;width:145px;vertical-align:top}
#row4 h1 {font-size: 30px;}
.button-container {
width: 430px;
}
.button-container button {
width: 74px;
height: 74px;
-webkit-border-radius: 37px;
-moz-border-radius: 37px;
border-radius: 37px;
font-size: 34px;
}
.button-container .button1 button {
margin: 50px 15px 0px 0px;
padding: 0px 0px 0px 10px;
}
.button-container .button1 span {
bottom: -22px;
left: 41px;
}
.button-container .button2 button {
margin: 25px 15px 0px 0px;
padding: 2px 0px 0px 0px;
}
.button-container .button2 span {
bottom: -24px;
left: 30px;
}
.button-container .button3 button {
margin: 9px 15px 0px 0px;
padding: 1px 0px 0px 2px;
}
.button-container .button3 span {
bottom: -28px;
left: 23px;
}
.button-container .button4 button {
margin: 25px 15px 0px 0px;
padding: 2px 0px 0px 0px;
font-size: 34px;
}
.button-container .button4 span {
bottom: -26px;
left: 11px;
}
.button-container .button5 button {
margin: 50px 0px 0px 0px;
padding: 0px 0px 10px 2px;
font-size: 34px;
}
.button-container .button5 span {
bottom: -23px;
left: 2px;
}
#notched-line {
width: 426px;
background-size: 426px 494px;
}
#service-description-container {
width: 100%;
}
.row .content-container .service-description.default {
margin-left: 0px;
}
.row .content-container .service-description.default p {
width: auto;
padding: 0px;
}
.row .content-container .service-description.default span {
display: none;
}
.row .heading-container {
border-bottom: none;
}
.row .heading-container h1 {
border-bottom: 1px solid;
width: 100%;
text-align: center;
}
.row .heading-container .container{
width: 100%;
position: static;
}
.row .heading-container table {
width: 100%;
}
.row .heading-container h2 {
border-left: none;
width: 93%;
margin: 0px;
text-align: center;
}
#newsletter {
width: 80%;
}
.process {
width: 90px;
height: 90px;
}
.process-wrap, .process-info {
width: 70.5px;
height: 70.5px;
}
.process-wrap {
top: 10px;
left: 10px;
}
.process-grid li {
width: 25%;
height: auto;
}
.process-info-front p {
line-height: 70.5px !important;
font-size: 14px !important;
}
.process-info-back p {
font: 600 9px/10px 'Source Sans Pro', 'serif' !important;
width: 90%;
}
.process-info-back p.threelines {
padding-top: 20px;
}
.process-info-back p.fourlines {
padding-top: 15px;
}
.parallax1 .testimonial-container {
width: 455px;
padding: 0px 0px 0px 15px;
}
.parallax1 .testimonial-container .quote-mark {
font-size: 60px;
}
.parallax1 .testimonial-container p {
width: 90%;
line-height: 28px;
font-size: 18px;
}
.parallax1 .testimonial-by-container {
width: 23%;
right: 10px;
}
.parallax1 .testimonial-by-container .testimonial-by {
font-size: 18px;
}
.parallax1 .testimonial-by-container span {
margin-left: 10px;
}
#gallery-container .two-cols .plus-button {
width: 50px;
height: 50px;
background-size: 50px 50px;
top: 25%;
margin: 0px 0px 0px -25px !important;
}
.portfolio-modal {
padding: 0px;
}
.portfolio-modal .image-area {
width: 90%;
margin: 20px auto 0px;
float: none;
}
.portfolio-modal .details {
width: 90%;
margin: 0 auto;
float: none;
}
.portfolio-modal .collapsable-items-container {
width: 90%;
clear: both;
margin: 0 auto;
float: none;
}
footer #upper-footer .news {
width: 100%;
}
footer #upper-footer .news ul {
width: 100%;
}
footer #upper-footer .news ul li.last button {
margin: 0px 46px 0px 0px;
}
footer #upper-footer .news h3 {
margin: 0px 0px 0px 0px;
}
footer #upper-footer .tweets {
width: 100%;
}
footer #upper-footer .news ul li {
padding: 22px 10px 40px 0px;
}
}
/* < 600px Layout */
@media only screen
and (max-width : 600px) {
#gallery-container .two-cols .plus-button {
top: 10%;
}
}
/* < 480px Layout */
@media only screen
and (max-width : 479px) {
#main-body-container{max-width:360px}
.btn-div{position:relative;width:300px;margin:0 auto;top:-133px}
.feedback-list li,.feedback-list li.big {
width: 250px;
margin: 10px 22px;
}
}
.pop-main{width:540px;margin:0 auto;padding:30px 0 0;text-align:center}
ul.tabs-pop {list-style: none;text-align:center;margin:0 auto 45px;color:#1D214E}
ul.tabs-pop li {display:inline-block;margin:0 22px;color:#1D214E}
ul.tabs-pop li a {font-size: 21px;font-family:'Rockwell Std';color:#1d214e;padding-bottom:12px}
ul.tabs-pop li a:hover,ul.tabs-pop li.active a { color: #333;border-bottom:2px solid #685a45 }
.tab_container{margin:0 0 35px;width:540px}
.tab_container small{text-align:left;display:block;font-family:'NeutraText-Demi';font-size:10px;line-height:20px;color:#1D214E}
.home-content{margin-top:22px}