﻿@media screen and (max-width:1000px)
{
header{width:94%; margin:0 auto; padding:20px 0 0 0; position:relative;}
#middle{ width:96%; padding:2%;}
#menu{ display:none;}
.logo{width:auto; height:auto; float:left; padding:0; text-align:center; padding:0 3% 0 0;}
.callus{ display:none;}
.callus1{width:auto; position:absolute; font-size:16px; text-shadow:1px 1px 1px #000; text-align:center; color:#FFFFFF; font-weight:bold;display:block; padding:10px 0; float:left; right:25px; top:35px;}
.callus1 span{ display:block; color:#fff; font-size:26px;}
.deformed-bar{ width:25%; float:left;}
.deformed-bar img{ width:100%; height:auto;}
.inground{ width:25%; float:left;}
.inground img{ width:100%; height:auto;}
.rubber-speed{ width:27%; float:left; padding:24px 0;}
.rubber-speed img{ width:100%; height:auto;}
.banner{ height:auto; width:94%;}
.banner img{ width:100%; height:auto;}
.mid{width:94%; margin:0 auto; position:relative;clear:both;}
.middle_left{ width:68%}
.middle_right{ width:28%;}
.qc{ float:left; width:100%; margin:20px 0;}
.box1{ display:none;}
.footerin{ width:96%; padding:0 2%;}
.footerin .left{ width:27%;}
.footerin .right {
    padding: 35px 12% 0 0;
    width:23%;
}

/* ___________________ Quick Contact Form ______________________ */
.qc_main {width:100%}
.qc_main {width:100%}
.qc_head {width:100%}
#contactform {
    background: none repeat scroll 0 0 #FFFFFF;
    border-radius: 15px 15px 15px 15px;
    display: none;
    margin: 0 0 15px;
    padding: 0;
	padding:10px 10px 0;
}
#contactform h1, #contactform h2 {
   	color: #000000;
    font-size: 23px;
    font-weight: normal;
    text-align: left;
}
#contactform h1, #contactform p {
   color: #000000;
}
#contactform form .left {
    float: left;
    width:100%;
}
#contactform form * .form-row {
    display: block;
    float: left;
    width: 100%;
}
#contactform form * .form-row label {
    font-size: 12px;
    font-weight: bold;
    padding: 10px 0;
}
#contactform form * .form-row label .required {
    /*color: #CCCC77;*/
    padding: 0 0 0 5px;
	color:#FF0000;
}
#contactform form * .form-row input,  #contactform form * .form-row textarea,  #contactform form * .form-row select {
    background: none repeat scroll 0 0 transparent;
    border: 1px solid #CCCCCC;
    font-size: 12px;
    margin: 5px 0;
    padding:1%;
    width:98%;
}
#contactform form .right {
    float: left;
    height: auto;
    text-align: left;
    width: 100%;
	margin:15px 0 0 0;
}
#contactform form .right .left,  #contactform form .right .right {
    width: 100%;
}
#contactform form * .form-row {
    display: block;
    float: left;
    width: 100%;
}
#contactform form * .form-row label {
    font-size: 12px;
    font-weight: bold;
    padding: 10px 0;
}
#contactform form * .form-row textarea { height: 122px;}
#contactform form * .form-row input,  #contactform form * .form-row textarea, #contactform form * .form-row select {
    background: none repeat scroll 0 0 transparent;
    border: 1px solid #CCCCCC;
    font-size: 12px;
    margin: 5px 0;
    padding: 1%;
    width: 97%;
}
#contactform form * .form-row select{height:35px; -webkit-appearance:none;}
#contactform form * .form-row input, #contactform form * .form-row textarea, #contactform form* .form-row select{ width:100%;}
#contactform form .right .left, #contactform form .right .right { width: 100%;}
#contactform form * .form-row {
    display: block;
    float: left;
    width: 48%;
	margin: 0 1%;
}
#contactform form * .form-row label {
    font-size: 12px;
    font-weight: bold;
    padding: 10px 0; color:#000000;
}
#contactform form * .form-row .checkbox-group {
    font-size: 12px;
    margin: 5px 0;
    padding: 1%;
    width: 100%;
}
#contactform form * .form-row .checkbox-group label {
    font-weight: normal;
}
#contactform form * .form-row .checkbox-group label input {
    margin: 0 0 5px;
    width: auto;
}
#contactform form .submit-btn {
    margin: 5px 0;
    text-align: right;
}
#contactform form .submit-btn button {
    background: none repeat scroll 0 0 #FFFFFF;
    border: medium none;
    border-radius: 5px 5px 5px 5px;
    color: #000000;
    cursor: pointer;
    font-size: 16px;
    font-weight: bold;
    padding: 10px;
    text-decoration: none;
}
#contactform p.button {
    text-align: right;
}
#contactform p.button a.quote-btn {
    background: none repeat scroll 0 0 #000000;
    border-radius: 5px 5px 5px 5px;
    color: #FFFFFF;
    font-size: 16px;
    font-weight: bold;
    padding: 10px 10px 5px;
    text-decoration: none;
}
#contactform div.wpcf7-response-output{float: left; font-size: 12px; margin: -3.5em 0 1em !important; width: 70%;}
#lightbox-container-image-box{ height:auto !important; min-height:250px !important;}
#lightbox-container-image img{ width:100% !important; height:auto !important;}
#lightbox-nav-btnPrev, #lightbox-nav-btnNext{
     height: 50% !important;
    position: absolute;
    top: 28%;
    width: 50% !important;}
#lightbox-loading-link img{ width:auto !important; height:auto !important;}

/*nidhi*/
.contactleft{width:100%; float:left;}
.contactleft li{ width:100%;}
.contactleft input[type="text"], [type="email"],[type="tel"]{width:98%; border-radius:none;-webkit-appearance: none;}
.contactleft  select{  width:100%;  border-radius:none;-webkit-appearance: none; height:34px;}
.contactleft input[type="submit"]{width:100px;  border-radius:none;-webkit-appearance: none; padding:5px 0;}
.contactright{ width:48%; float:right;}
.contactright img{ width:100%; height:auto;}
.contactright iframe{width:100%}
}

@media screen and (max-width:768px)
{
.logo{width:100%; height:auto; float:left; padding:0; text-align:center; padding:10px 0 0 0;}
.callus{ display:none;}
.callus1{width:100%; position:relative; font-size:16px; text-shadow:1px 1px 1px #000; text-align:center; color:#FFFFFF; font-weight:bold;display:block; padding:10px 0; float:left; right:0; top:0;}
.callus1 span{ display:block; color:#fff; font-size:26px;}
.rubber-speed{ padding:28px 0 27px;}
.footerin .right {
    padding: 35px 14% 0 0;
    width:27%;
}
.middle_left,.middle_right{ width:100%;}
.deformed-bar{ width:33%; float:left;}
.deformed-bar img{ width:100%; height:auto;}
.inground{ width:33%; float:left;}
.inground img{ width:100%; height:auto;}
.rubber-speed{ width:33%; float:left; padding:28px 0 27px 0;}
.rubber-speed img{ width:100%; height:auto;}
.contactleft{width:100%; float:left;}
.contactright{ width:100%; float:right; margin:10px 0 0 0;}
.contactright img{ width:100%; height:auto;}
}

@media screen and (max-width:600px)
{
.logo{width:100%; height:auto; float:left; padding:0; text-align:center; padding:10px 0 0 0;}
.callus{ display:none;}
.callus1{width:100%; position:relative; font-size:16px; text-shadow:1px 1px 1px #000; text-align:center; color:#FFFFFF; font-weight:bold;display:block; padding:10px 0; float:left; right:0; top:0;}
.callus1 span{ display:block; color:#fff; font-size:26px;}
.rubber-speed{ padding:22px 0 21px;}
.footerin .right{ padding: 35px 20% 0 0;
    width:39%;}
.footerin .left{width:22%}
.footerin .right {
    padding: 35px 20% 0 0;
    width: 17%;
}
.middle_left{ width:100%; float:left;}
.middle_right{ width:100%; float:left;}




/* ___________________ Quick Contact Form ______________________ */
#contactform h1, #contactform h2 {
   color: #000000;
    font-size: 23px;
    font-weight: normal;
    text-align: left;
}
#contactform h1, #contactform p { color: #000000;}
#contactform form .left {
    float: left;
    width:100%;
}
#contactform form * .form-row {
    display: block;
    float: left;
    width: 100%;
}
#contactform form * .form-row label {
    font-size: 12px;
    font-weight: bold;
    padding: 10px 0;
}
#contactform form * .form-row label .required {
    /*color: #CCCC77;*/
    padding: 0 0 0 5px;
	color:#FF0000;
}
#contactform form .right {
    float: left;
    height: auto;
    text-align: left;
    width: 100%;
	margin:15px 0 0 0;
}
#contactform form .right .left, #contactform form .right .right {
    width: 100%;
}
#contactform form * .form-row {
    display: block;
    float: left;
    width: 100%;
}
#contactform form * .form-row label {
    font-size: 12px;
    font-weight: bold;
    padding: 10px 0;
}
#contactform form * .form-row textarea {
    height: 122px;
}
#contactform form * .form-row input,  #contactform form * .form-row textarea, #contactform form * .form-row select {
    background: none repeat scroll 0 0 transparent;
    border: 1px solid #CCCCCC;
    font-size: 12px;
    margin: 5px 0;
    padding:1%;
    width:98%;
}
#contactform form * .form-row select{ width:100%; line-height:21px; -webkit-appearance:none;}
#contactform form .right .left, #contactform form .right .right {width: 100%;}
#contactform form * .form-row {
    display: block;
    float: left;
    width: 100%;
	margin:0;
}
#contactform form * .form-row label {
    font-size: 12px;
    font-weight: bold;
    padding: 10px 0; color:#000000;
}
#contactform form * .form-row .checkbox-group {
    font-size: 12px;
    margin: 5px 0;
    padding: 1%;
    width: 100%;
}
#contactform form * .form-row .checkbox-group label {font-weight: normal;}
#contactform form * .form-row .checkbox-group label input {margin: 0 0 5px; width: auto;}
#contactform form .submit-btn {margin: 5px 0; text-align: right;}
#contactform form .submit-btn .wpcf7-submit{width:25%;}
#contactform form .submit-btn button {
    background: none repeat scroll 0 0 #FFFFFF;
    border: medium none;
    border-radius: 5px 5px 5px 5px;
    color: #000000;
    cursor: pointer;
    font-size: 16px;
    font-weight: bold;
    padding: 10px;
    text-decoration: none;
}
#contactform p.button {text-align: right; padding-right:5px;}
#contactform p.button a.quote-btn {
    background: none repeat scroll 0 0 #000000;
    border-radius: 5px 5px 5px 5px;
    color: #FFFFFF;
    font-size: 16px;
    font-weight: bold;
    padding: 10px 10px 5px;
    text-decoration: none;
}
#contactform div.wpcf7-response-output{margin:-5em 0 1em !important; width:59%;}
/* ___________________ Contact Form ______________________ */
.form_outer {
    float: left;
    margin: 0 0 10px;
    width: 100%;
}
#recaptcha_widget_div{width:100% !important;}
#recaptcha_area, #recaptcha_table{width:267px !important;}
#recaptcha_area .recaptchatable .recaptcha_r1_c1{width:100% !important;}
.contactleft{width:100%; float:left;}

}

@media screen and (max-width:480px)
{
.logo{width:100%; height:auto; float:left; padding:0; text-align:center; padding:10px 0 0 0;}
.callus{ display:none;}
.callus1{width:100%; position:relative; font-size:16px; text-shadow:1px 1px 1px #000; text-align:center; color:#FFFFFF; font-weight:bold;display:block; padding:10px 0; float:left; right:0; top:0;}
.callus1 span{ display:block; color:#fff; font-size:26px;}
.footerin .right{ width:41%; padding:35px 19% 0 0;}
.sitemap{ width:28%;}
.footerin .left {
    width:38%;
}
.rubber-speed {
    padding: 21px 0;
}
.middle_left{ width:100%;}
.middle_right{ width:100%;float:left;}
.contactleft{width:100%;float:left;}

/*nidhi*/
.contactleft input[type="text"], [type="email"],[type="tel"]{width:95%!important; border-radius:none;-webkit-appearance: none; float:left; }
.contactleft  select{  width:99%!important;  border-radius:none;-webkit-appearance: none; float:left;}
.contactleft input[type="submit"]{width:100px;  border-radius:none;-webkit-appearance: none; padding:5px 0; float:left;}
/*span.wpcf7-not-valid-tip {
    background: none repeat scroll 0 0 #FFFFFF;
    border: 1px solid #FF0000;
    font-size: 10pt;

   margin-top: -44px;


    position: relative;
	float:left;
	clear:both;
    width: 87%;
    z-index: 100;
}*/
.wpcf7-not-valid-tip{ float:left!important; width:94%!important; clear:both!important; position:relative !important; top:0!important; }
}


@media screen and (max-width:320px)
{
.logo{width:100%; height:auto; float:left; padding:0; text-align:center; padding:10px 0 0 0;}
.callus{ display:none;}
.callus1{width:100%; position:relative; font-size:16px; text-shadow:1px 1px 1px #000; text-align:center; color:#FFFFFF; font-weight:bold;display:block; padding:10px 0; float:left; right:0; top:0;}
.callus1 span{ display:block; color:#fff; font-size:26px;}
.footerin .right{ width:71%; padding:35px 29% 0 0;}
.footerin .left {
    width: 42%;
}
.rubber-speed {
    padding: 14px 0;
}
.middle_left{ width:100%;}
.middle_right{ width:100%;}
.sitemap{ width:37%;}
.contactleft{width:100%; float:left;}


}