@charset "utf-8";
/* CSS Document */
@media only screen and (min-width:1450px) and (max-width:1670px) 
{
	.bannerCar{width:82%;}
}
@media only screen and (min-width:1672px) and (max-width:1780px) 
{
	.bannerCar{width:80%;}
}
@media only screen and (min-width:1781px)
{
	.bannerCar{width:72%;}
}
@media only screen and (min-width:1440px)
{
	article.bannerSignUp{margin-top:120px;}
}

@media only screen and (min-width:320px) and (max-width:700px) 
{
    body {background:#fff;    }
    .mobileLanding {display:block;  background:#fff;  }
    .mobileLanding h1 {font-size:20px;    }
    .desktopLanding {display:none;    }
    .mob-top {
	    float:left;
	    width:100%;
	  
	      background: #35a6fa; /* Old browsers */
    background: -moz-linear-gradient(top, #84698f 0%, #35a6fa 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#84698f), color-stop(100%,#35a6fa)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #84698f 0%,#35a6fa 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #84698f 0%,#35a6fa 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #84698f 0%,#35a6fa 100%); /* IE10+ */
    background: linear-gradient(to bottom, #84698f 0%,#35a6fa 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#84698f', endColorstr='#35a6fa',GradientType=0 ); /* IE6-9 */
    }
    .mob-features {
        position:relative;
    }
    .mob-features h1 {
    text-align:left;
    }
    .feature-1 .mobfeature-img {
        width:100%;text-align:right; padding:25px 0;
    }
    .feature-1 .mobfeature-img img {
        width:68%;
    }
   .feature-1 p {
      position: absolute;
      width: 40%;
      top: 24%;
      left: 5%;
    }
    .mob-headerbg {
	    float:left;
	    height:100px;
	    width:100%;
    }
    .mob-header {
	    float:left;
	    width:100%;text-align:center;
        padding-top:20px;
    }
    .mob-header img {
	    display:block;
	    margin:auto;
	    width:220px;
    }
    .mob-headertext {
	    float:left;
	    width:100%;
    }
    .mob-headertext h1 {
	    text-align: center;
      color: #fff;
      font-size: 15px;
    
      margin-bottom: 15px;
      width:94%;
      margin:0 3% ;
    }
    .mob-headertext p {
	    color: #bdf0ff;
      font-size: 14px;
       
      margin: 20px 5%;
      text-align: center;
      width: 90%;
    }
    .mob-top .mob-carimg img {
	    width:100%;
	    height:auto;	
	
    }
    .call-us span {
        float: left;
        width: 40px;
    }
    .call-us span img {
        height:20px;
        width:auto;
    }
    .call-us {
	    background-color:#f7f5f2;
	     
	    width:100%;
	    float:left;
    }
    .call-us h1 { color: #2c3e50;    font-size: 20px;    text-align: center; line-height:34px;}
    .call-us p { color:#19c1ff; font-size:14px; width:80%; margin:0 10%; float:left; padding:8px 0;}
    .shoot-save { 
	    width:100%;
        text-align:center;
	    float:left;
        margin:10px 0;
    }
    .phoneLanding {
    border-bottom: solid 1px #ededed;
    }
    .call-us a:link, call-us a:visited {
        color:#19c1ff;
    }
    .shoot-save h1 {
	    color:#2c3e50;
    }
    .shoot-save .shoot-img {
	    width:96%;
        margin:0 2%;
	    float:left;
    }
    .shoot-img img {
    width:100%;
    }
    .mob-features {
	    width:100%;
	     margin:10px 0;
	    float:left;
    }
    .mob-features h1 {
	    color:#2c3e50;margin:20px 0;
    }
    .mob-features p {
	    color:#2c3e50;
    }
    .mobfeature-img {
	    width:100%;
	    height:auto;
	    }

    .mob-footer {
	font-family: 'proxima_novasemibold';
    text-align:center;
	       width: 90%;
             padding: 20px 5% ;
	    
	    float:left;
	    background-color:#f7f5f2;
	    box-shadow:0 3px 10px rgba(0, 0, 0, 0.3);
	    -moz-box-shadow: 0 3px 10px rgba(0, 0, 0, 0.3);
	    -ms-box-shadow:0 3px 10px rgba(0, 0, 0, 0.3);
	    -webkit-box-shadow: 0 3px 10px rgba(0, 0, 0, 0.3);
	    -o-box-shadow:0 3px 10px rgba(0, 0, 0, 0.3);
    }

    .mob-footer p {
	    color:#19c1ff;
	
    }
    .inline_table {
        display:table; width:100%;
    }
    .feature-2 .mobfeature-img{
        width:48%; display:table-cell;padding-left:2%;vertical-align:middle;
    }
    .feature-2 .mobfeature-img img , .feature-3 .mobfeature-img img{
        width:100%;
    }
    .feature-2 p {
         width:48%; display:table-cell; padding-right:2%;vertical-align:middle;
    }

    .feature-3 p ,.feature-5 p{display:table-cell; width:35%; padding:0 5%;   vertical-align:middle; }
     .feature-3 .mobfeature-img ,.feature-5 .mobfeature-img{display:table-cell; width:30%;   vertical-align:middle;    }

    .feature-4 .mobfeature-img {width:100%; float:left;    }
    .feature-4 .mobfeature-img img,.feature-5 .mobfeature-img img {width:98%;    }
    .feature-4 {position:relative;    }
    .feature-4 p {top:19%;    position: absolute;    right: 4%;    width: 41%;  }
    .goTop {right:4px; bottom:8px;    }

}
@media only screen and (min-width:760px) and (max-width:960px) {
    #landingHeader .accountBtn {display:none;    }
    .leftCol {
        width: 29%;
    }

    .rightCol {
        width: 68%;
    }

    .mid_wrapper {
        width: 88%;
        padding: 0 6%;
    }

    .logo a {
        display: block;
        height: 70px;
    }

    .logo img {
        width: auto;
        height: 100%;
    }

    header, nav ul li, .logo, .acountHdr {
        height: 70px;
    }

    nav ul li {
        line-height: 70px;
    }

    .acountHdr, nav ul li {
        font-size: 13px;
    }

    .accountBtn {
        height: 44px;
        line-height: 44px;
        margin-top: 13px;
        width: 115px;
    }

    nav {
        margin-right: 35px;
    }

    .vehicle_snaps > ul > li {
        margin: 0 3% 3% 0;
        width: 30%;
    }

    h2 {
        font-size: 18px;
    }

    ul.vehicl_details_list li p, ul.vehicl_details_list li h3 {
        font-size: 14px;
        word-wrap: break-word;
    }

    .vehicle_snaps > ul > li:nth-child(4n) {
        margin-right: 3% !important;
    }

    .vehicle_snaps > ul > li:nth-child(2n) {
        margin-right: 3% !important;
    }

    .uploadImg, #searchTxt {
        font-size: 17px;
    }

    .edit_vehicle_details a:link, .edit_vehicle_details a:visited {
        font-size: 18px;
    }

    .grid_snap > ul > li {
        width: 96px !important;
    }


    #landingHeader .logo {width:auto;    }
    .logo a {height:22px; margin-top:14px;   }
    .landingBanner {padding-top:110px; }
    article.bannerTxt h1 {font-size:38px;    }
    article.bannerTxt p {font-size:22px;}
    .leftTopCloud, .rightTopCloud {width:42%;}
    .bannerCar {width:100%; }
    .setupMap li figure {height:384px !important;    }
    .setupLeft li figure img ,.setupRight li figure img{height:100%;}
    .setupMid img {height:160px;  margin-top:24px;  }
    .setupDesc li:nth-child(2) {font-size:20px;    }
    .numbCircle { font-size: 25px;    height: 40px;    line-height: 40px;      width: 40px;    }
    .setupInstruction {padding-top:45px;    }
    .feature_section {    padding: 70px 0 0;}
    .feature6 {padding-bottom:32px !important; }
    .price_plan > ul > li h1 {font-size:17px !important;    }
    .price_plan > ul > li {min-height:650px !important;    }
    ul.plan_inner_list li {margin-bottom:14px !important;    }
    .working_desc {font-size:30px;    }
    .contact_pop {width:600px;    }
    .contact_left li input[type="text"], .contact_left textarea {width:177px;    }
    .contact_big_icons {display:none !important;    }
}

@media only screen and (min-width:961px) and (max-width:1300px) {
    .logo {
        width: 22%;
    }

    .uploadImg {
        font-size: 18px;
    }
}

@media only screen and (min-width:1050px) and (max-width:1300px) {
    p.guide_description {width:68% !important;
    }
}

/* May 28 2014 updated */
@media only screen and (min-width:768px) and (max-width:1100px) {
    .setupPlanList {
        width: 45%;
        margin-bottom: 20px;
    }

    .setupPlanCont .setupPlanList:nth-child(2) {
        margin-right: 0 !important;
    }

    .price_plan > ul > li h1 {
        font-size: 24px;
    }


    .feature_head {
        font-size: 20px;
        color: #2c3e50;
        font-family: 'proxima_novabold';
    }

    .feat_p {
        font-size: 18px;
        color: #2c3e50;
        font-family: 'proxima_novalight';
        margin-top: 12px;
        line-height: 24px;
    }

    .feature_section {
        padding: 110px 0 0;
    }
}



/* Aug 7 2014 updated */
@media only screen and (min-width:960px) and (max-width:1260px) {
    #layer_srch {
        width: 40%;
    }

    .layer_ul li {
        font-size: 13px;
    }

    #layer_srch .sharBtn a, #layer_srch .searchBarRed #searchTxt {
        font-size: 14px;
    }
}


@media only screen and (min-width:768px) and (max-width:1050px) {
    .mid_wrapper {
        width: 88% !important;
        padding: 0 6% !important;
    }

    #layer_srch {
        width: 46% !important;
    }

    nav ul li, .layer_ul li ,.accountBtnInner{
        font-size: 11px !important;
    }

     .add_guide_btn {right: 10px !important;    top: 40px !important;  width:20px !important; height:20px !important;  background-size:100% !important;}
      .drag_guide {
        height: 14px !important;
        right: 10px !important;
        top: 42px !important;
        width: 18px !important;
        background-size: 100% !important;
    }
    #layer_srch .sharBtn a, #layer_srch .searchBarRed #searchTxt {
        font-size: 14px !important;
    }
    .guide_description,.guide_add p.guide_description span .labeldesc {
        font-size:19px !important;
    }
    p.guide_description {width:68% !important;
    }
    nav ul li {
        margin:0 8px !important;
    }
}


@media only screen and (min-width:768px) and (max-width:968px) {
    .layer_ul > li {
        padding: 0 8px;
    }
}


/* 25 Sep 2014 */
@media only screen (min-width:1000px) and (max-width:1400px) {
    .price_plan > ul > li {
        width: 20%;
        border-bottom: solid 1px #e1e1e1;
    }

    .price_plan {
        border: none;
    }
        /*.price_plan > ul > li:first-child { border-left:solid 1px #e1e1e1;}
    .price_plan > ul > li:last-child { border-right:solid 1px #e1e1e1;}*/
        .price_plan > ul > li h1 {
            font-size: 24px !important;
        }
}


@media only screen and (min-width:1201px) and (max-width:1290px) {
    .leftTopCloud, .rightTopCloud {
        top: -20% !important;
    }
}

@media only screen and (min-width:1100px) and (max-width:1200px) {
    .leftTopCloud, .rightTopCloud {
        top: -10% !important;
    }
}


@media only screen and (min-width:1070px) and (max-width:1100px) {
    .leftTopCloud, .rightTopCloud {
        top: -4% !important;
    }
}


@media only screen and (min-width:1020px) and (max-width:1069px) {
    .leftTopCloud, .rightTopCloud {
        top: -2% !important;
    }
}




@media only screen and (min-width:960px) and (max-width:1019px) {
    .leftTopCloud, .rightTopCloud {
        top: 4% !important;
    }
}



@media only screen and (max-width:959px) {
    .leftTopCloud, .rightTopCloud {
        top: 10% !important;
    }
}




@media only screen and (min-width:1160px) and (max-width:1240px) {
    .bannerCar {
        width: 78%;
    }
}



@media only screen and (min-width:1100px) and (max-width:1159px) {
    .bannerCar {
        width: 82%;
    }

    p.guide_description {
        width: 63% !important;
        padding-top: 30px;
    }

    p.guide_description, #input#Description {
        font-size: 22px !important;
    }

    .add_guide_btn {
        right: 10px !important;
        top: 40px !important;
        width: 20px !important;
        height: 20px !important;
        background-size: 100% !important;
    }

    .drag_guide {
        height: 14px;
        right: 10px;
        top: 42px;
        width: 18px;
        background-size: 100%;
    }

    @media only screen and (min-width:1000px) and (max-width:1099px) {
        .bannerCar {
            width: 96%;
        }
    }


    @media only screen and (max-width:999px) {
        .bannerCar {
            width: 90%;
        }
    }

    @media only screen and (max-width:960px) {
        #landingHeader .logo {
            width: 250px;
        }

        header.overlayedHeader .logo img {
            height: auto !important;
            width: 100%;
            margin-top: 10px;
        }
    }


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

        #footnav {
            margin-right: 0;
            width: 100%;
            float: left;
            text-align: center;
        }

            #footnav ul {
                display: inline-block;
                float: none;
            }

                #footnav ul li {
                    margin: 0 52px !important;
                }

        footer {
            height: auto !important;
        }

        .footRight {
            float: left;
            width: 100%;
        }
    }


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

        nav#footnav li {
            margin: 0 25px 0 0 !important;
        }

        .toc {
            margin-right: 10px;
            font-size: 15px;
        }

        #footnav {
            margin-right: 10px;
        }

        nav#footnav li {
            font-size: 14px;
        }

        p.guide_description {
            font-size: 22px;
        }
    }


    @media only screen and (min-width:1077px) and (max-width:1120px) {
        p.guide_description {
            padding-top: 30px !important;
            font-size: 19px !important;
        }
    }


    @media only screen and (min-width:960px) and (max-width:1000px) {
        p.guide_description {
            width: 63% !important;
        }
    }

    
    @media only screen and (min-width:300px) and (max-width:700px) 
    {
        .moibleBuild {display:inline-block;  }
        .webBuild {display:none;  }
    }
      @media only screen and (min-width:900px) 
    {
        .moibleBuild {display:none;  }
        .webBuild {display:inline-block;  }
    }
    


    @media only screen and (min-width:970px) and (max-width:1320px) {
        nav ul li {            font-size: 13px !important;            margin: 0 6px !important;        }
    }