@charset "utf-8";
/* CSS Document */
html, h1, h2, h3, h4, h5, h6, p, ol, ul, li, pre, code, address, variable, form, fieldset, blockquote {
 padding: 0;
 margin: 0;
 font-size: 100%;
 font-weight: normal;
}
table { border-collapse: collapse; border-spacing: 0; }
td, th, caption { font-weight: normal; text-align: left; }
img, fieldset { border: 0; }
ol { padding-left: 1.4em; list-style: decimal; }
ul { padding-left: 1.4em; list-style:square; }
q:before, q:after { content:''; }
body { 
	margin: 0px 0px 0px 0px;
	background-color:#ffffff;
	min-width:320px;
	}
/* CSS Reset Finished */

#menubox {
	width:100%;
	height:100%;
	position:fixed;
	overflow: auto;
	top:0px;
	right:0px;
	z-index:2072;
	vertical-align:middle;
	background-color: #e6e6e6;
 	visibility:hidden;
	text-align:center;
	}

.button1 {
    border: none;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 20px;
    font-family: 'Open Sans', sans-serif;
    width: 100%;
    padding: 20px;
    color:#333333;
    background-color:#e6e6e6;
    border-bottom: 2px solid #dbdbdb;
}

.button1:hover {
	background-color: #333333;
	color: #FFFFFF;
	}
	
.button1:active {
	background-color: #e6e6e6;
	color: #333333;
}

.topheader {
    max-width: 1650px;
    min-height: 130px;
    margin: 0 auto;
    background-color: #ffffff;
    overflow: visible;
}



.linkimg {
    margin-left: 15px;
}

.logoleft {
    width: 250px;
    height: auto;
    float: left;
    padding-left: 20px;
    padding-top: 0px;
    padding-bottom: 0px;
    padding-right: 0px;
    }

.navi {
    width: 65%;
    height: auto;
    float: right;
    text-align: right;
    padding-left: 0px;
    padding-top: 48px;
    padding-bottom: 0px;
    padding-right: 20px;
    font-size: 18px;
	font-family: 'Open Sans', sans-serif;
	color: #333333;
}

.navi a {
    padding-left: 40px;
    text-decoration: none;
    color: #000000;
}

.navi a:hover {
    text-decoration: underline;
    color:#666666;
}

.navi2 {
    display: none;
}

.topimg{
    width: 100%;
    max-height:auto;
    text-align: center;
    background-color: #4c4c4c;
    margin-bottom: 30px;
}

.topimgstyle {
    max-width: 1650px;
    height: auto;
}

.topimgstyle2 {
    display: none;
}

.hp_3colcontainer {
    max-width: 1650px;
    height: auto;
    margin: 0 auto;
}

.hp_3col {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: 1fr;
    grid-column-gap: 26px;
    grid-row-gap: 26px;
    }


.hp_3col2 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: 1fr;
    grid-column-gap: 26px;
    grid-row-gap: 26px;
    }

.hp_3col h1 {
	font-family: 'Open Sans', sans-serif;
    font-size: 26px;
    color: #ffffff;
    background-color: #4c4c4c;
    padding: 15px;
}

.hp_3col2 h1 {
	font-family: 'Open Sans', sans-serif;
    font-size: 26px;
    color: #ffffff;
    background-color: #4c4c4c;
    padding: 15px;
}

.colimg {
    width: 100%;
    height: auto;
}

.hp_3col p {
    font-family: 'Open Sans', sans-serif;
    font-size: 17px;
    color: #000000;
    text-align: justify;
    line-height: 150%;
}

.hp_3col2 p {
    font-family: 'Open Sans', sans-serif;
    font-size: 17px;
    color: #000000;
    text-align: justify;
    line-height: 150%;
}

.hp_3col a {
    color: #000000;
    text-decoration: none;
}

.hp_3col2 a {
    color: #000000;
    text-decoration: none;
}

.hp_3col a:hover {
    text-decoration: underline;
    color:#666666;
}

.hp_3col2 a:hover {
    text-decoration: underline;
    color:#666666;
}


.colimg2 {
    float: left;
    padding-bottom: 20px;
    padding-right: 20px;
}

.colimg3 {
    float: left;
    padding-bottom: 20px;
    padding-right: 20px;
}

.blank {
    width: 100%;
    min-height: 50px;
    display: inline-block;
}

.h1banner {
    max-width: 1650px;
    min-height: 50px;
    background-color: #4c4c4c;
    margin: 0 auto;
}

.h1banner h1 {
	font-family: 'Open Sans', sans-serif;
    font-size: 26px;
    color: #ffffff;
    padding: 15px;
}

.contactbot {
    max-width: 1650px;
    height: auto;
    margin: 0 auto;
    background-color: #ffffff;
}

.contactbotgrd {
    display: grid;
    grid-template-columns: repeat(2, 1fr) 2fr;
    grid-template-rows: 1fr;
    grid-column-gap: 26px;
    grid-row-gap: 26px;
    padding-left: 20px;
    padding-top: 20px;
    padding-right: 20px;
    padding-bottom: 30px;
}

.contactbotgrd  p {
    font-family: 'Open Sans', sans-serif;
    font-size: 17px;
    color: #000000;
    text-align: left;
    line-height: 150%;
}

.contactbotgrd a {
    color: #000000;
    text-decoration: none;
}

.contactbotgrd a:hover {
    text-decoration: underline;
    color:#666666;
}

.botlogos {
    float: right;
}

.footerinfo {
    width: 100%;
    height: auto;
    border-top: #000000 1px solid;
    border-bottom: #4c4c4c 28px solid;
}

.footerinfoinner {
    max-width: 1650px;
    height: auto;
    margin: 0 auto;
}

.footerinfoinner p {
    font-family: 'Open Sans', sans-serif;
    font-size: 14px;
    color: #000000;
    text-align: left;
    line-height: 150%;
    padding: 10px;
}

.footerinfoinner a {
    color: #000000;
    text-decoration: none;
}

.footerinfoinner a:hover {
    text-decoration: underline;
    color:#666666;
}


.toolsp1_maincont {
    max-width: 1650px;
    height: auto;
    margin: 0 auto;
    background-color: #ffffff;
}

.toolsp1_maincont p {
    font-family: 'Open Sans', sans-serif;
    font-size: 17px;
    color: #000000;
    text-align: justify;
    line-height: 150%;
}

.toolsp1_maincont  a {
    color: #000000;
    text-decoration: none;
}

.toolsp1_maincont a:hover {
    text-decoration: underline;
    color:#666666;
}

.toolsp1_maincont h2 {
    font-family: 'Open Sans', sans-serif;
    font-size: 18px;
    color: #000000;
    font-weight: bold;
    margin-bottom: 10px;
}

.tools1img {
    float: left;
    margin-right: 30px;
    margin-bottom: 30px;
}

.toolsp2_maincont {
    max-width: 1650px;
    height: auto;
    margin: 0 auto;
    background-color: #ffffff;
}

.toolsp2_maincont_grd1 {
    display: grid;
    grid-template-columns: repeat(2, 1fr) 2fr;
    grid-template-rows: 1fr;
    grid-column-gap: 26px;
    grid-row-gap: 26px;
}

.toolimg {
    border: #000000 1px solid;
}

.toolsp2_maincont h2 {
    font-family: 'Open Sans', sans-serif;
    font-size: 18px;
    font-weight: bold;
    color: #000000;
    margin-top: 15px;
}

.toolsp2_maincont h3 {
    font-family: 'Open Sans', sans-serif;
    font-size: 17px;
    font-weight: bold;
    color: #000000;
    margin-top: 15px;
}

.toolsp2_maincont p {
    font-family: 'Open Sans', sans-serif;
    font-size: 17px;
    color: #000000;
    text-align: justify;
    line-height: 150%;
}

.toolsp2_maincont_grd2 {
    display: grid;
    grid-template-columns: repeat(2, 1fr) 3fr;
    grid-template-rows: 1fr;
    grid-column-gap: 26px;
    grid-row-gap: 26px;
}

.toolsp2_maincont_grd3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr) /*2fr*/;
    grid-template-rows: 1fr;
    grid-column-gap: 26px;
    grid-row-gap: 26px;
}

.toolsp3_maincont {
    max-width: 1650px;
    height: auto;
    margin: 0 auto;
    background-color: #ffffff;
}

.toolimgp3 {
    border: #000000 1px solid;
    float: left;
    margin-bottom: 30px;
    margin-right: 30px;
}

.toolsp3_maincont h2 {
    font-family: 'Open Sans', sans-serif;
    font-size: 18px;
    font-weight: bold;
    color: #000000;
    margin-top: 15px;
}

.toolsp3_maincont h3 {
    font-family: 'Open Sans', sans-serif;
    font-size: 17px;
    font-weight: bold;
    color: #000000;
    margin-top: 15px;
}

.toolsp3_maincont p {
    font-family: 'Open Sans', sans-serif;
    font-size: 17px;
    color: #000000;
    text-align: justify;
    line-height: 150%;
}

.toolsp3_maincont_grd1 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(3, 1fr);
    grid-column-gap: 26px;
    grid-row-gap: 26px;
}


.partsp_maincont_grd1 {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(3, 1fr);
    grid-column-gap: 26px;
    grid-row-gap: 26px;
}



.partsp_maincont_grd1 a {
    color: #000000;
    text-decoration: none;
}

.partsp_maincont_grd1 a:hover {
    text-decoration: underline;
    color:#666666;
}

 

.toolsp3_maincont a {
    color: #000000;
    text-decoration: none;
}

.toolsp3_maincont a:hover {
    text-decoration: underline;
    color:#666666;
}


.contactp_grd1 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-auto-rows: repeat(2, 1fr);
    grid-column-gap: 26px;
    grid-row-gap: 26px;
}


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

    .topimgstyle {
        width: 100%;
        height: auto;
    }


.hp_3colcontainer {
    max-width: 1650px;
    height: auto;
    margin-top: 0;
    margin-left: 26px;
    margin-bottom: 0;
    margin-right: 26px;
}

.toolsp1_maincont {
    max-width: 1650px;
    height: auto;
    background-color: #ffffff;
    margin-left: 20px;
    margin-right: 20px;
}

.toolsp2_maincont {
    max-width: 1650px;
    height: auto;
    background-color: #ffffff;
    margin-left: 20px;
    margin-right: 20px;
}


.toolsp2_maincont_grd3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: 1fr;
    grid-column-gap: 26px;
    grid-row-gap: 26px;
}

.toolsp3_maincont {
    max-width: 1650px;
    height: auto;
    background-color: #ffffff;
    margin-left: 20px;
    margin-right: 20px;
}

}

@media screen and (max-width: 1271px) {
    
    .toolsp2_maincont_grd3 .toolimg {
        border: #000000 1px solid;
        width: 100%;
        height: auto; 
    }

    .toolsp3_maincont_grd1 {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: repeat(4, 1fr);
        grid-column-gap: 26px;
        grid-row-gap: 26px;
    }

    .partsp_maincont_grd1 {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        grid-template-rows: repeat(6, 1fr);
        grid-column-gap: 26px;
        grid-row-gap: 26px;
    }

}


@media screen and (max-width: 1081px) {
 
 
    .navi {
    display:none;
    }


    .navi2 {
        display: initial;
        width: 25%;
        height: auto;
        float: right;
        text-align: right;
        padding-left: 0px;
        padding-top: 55px;
        padding-bottom: 0px;
        padding-right: 20px;
    }



    .hp_3col h1 {
        font-family: 'Open Sans', sans-serif;
        font-size: 20px;
        color: #ffffff;
        background-color: #4c4c4c;
        padding: 15px;
    }


    .hp_3col2 h1 {
        font-family: 'Open Sans', sans-serif;
        font-size: 20px;
        color: #ffffff;
        background-color: #4c4c4c;
        padding: 15px;
    }


    .colimg2 {
        width: 100%;
        height: auto;
        float: none;
        padding-bottom: 20px;
        padding-right: 0px;
    }

    .hp_3col2 {
        display: grid;
        grid-template-columns: 1fr;
        grid-auto-rows: repeat(3, 1fr);
        grid-column-gap: 26px;
        grid-row-gap: 26px;
        } 


    .contactbotgrd {
        display: grid;
        grid-template-columns: 1fr;
        grid-auto-rows: repeat(3, 1fr);
        grid-column-gap: 26px;
        grid-row-gap: 26px;
        padding-left: 20px;
        padding-top: 20px;
        padding-right: 20px;
        padding-bottom: 30px;
    }

    .botlogos {
        float: none;
    }

}

@media screen and (max-width: 860px) {
    
    .toolsp2_maincont_grd1 {
        display: grid;
        grid-template-columns: 1fr;
        grid-auto-rows: repeat(2, 1fr);
        grid-column-gap: 26px;
        grid-row-gap: 26px;
    }


    .toolsp2_maincont_grd2 {
        display: grid;
        grid-template-columns: 1fr;
        grid-auto-rows: repeat(2, 1fr);
        grid-column-gap: 26px;
        grid-row-gap: 26px;
    }
    
    .toolsp2_maincont_grd3 {
        display: grid;
        grid-template-columns: 1fr;
        grid-auto-rows: repeat(3, 1fr);
        grid-column-gap: 26px;
        grid-row-gap: 26px;
    }

    .toolimg {
        width: 100%;
        height: auto;
        border: #000000 1px solid;
    }


    .toolsp3_maincont_grd1 {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: repeat(7, 1fr);
        grid-column-gap: 26px;
        grid-row-gap: 26px;
    }

    .partsp_maincont_grd1 {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: repeat(7, 1fr);
        grid-column-gap: 26px;
        grid-row-gap: 26px;
    }

    .contactp_grd1 {
        display: grid;
        grid-template-columns: 1fr;
        grid-auto-rows: repeat(4, 1fr);
        grid-column-gap: 26px;
        grid-row-gap: 26px;
    }


 }



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

    .logostyle {
        width: 95%;
        height: auto;
    }


    .logoleft {
        width: 90%;
        height: auto;
        float: none;
        padding-left: 20px;
        padding-top: 0px;
        padding-bottom: 0px;
        padding-right: 20px;
        text-align: center;
        }

        .navi2 {
            display: inline-block;
            width: 90%;
            height: auto;
            float: none;
            text-align: center;
            padding-left: 20px;
            padding-top: 0px;
            padding-bottom: 20px;
            padding-right: 20px;
        }

        .topimgstyle {
           display: none;
        }

        .topimgstyle2 {
            display: inline-block;
            width: 100%;
            height: auto;
        }

    .hp_3col {
        display: grid;
        grid-template-columns: 1fr;
        grid-auto-rows: repeat(3, 1fr);
        grid-column-gap: 26px;
        grid-row-gap: 26px;
        } 
        

    .hp_3col p {
        font-family: 'Open Sans', sans-serif;
        font-size: 16px;
        color: #000000;
        text-align: justify;
        line-height: 150%;
    }


    .tools1img {
        width: 95%;
        height: auto;
        float: none;
        margin-right: 0px;
        margin-bottom: 20px;
    }

}

@media screen and (max-width: 480px) { 
    
    .botlogos {
        width: 90%;
        height: auto;
        float: none;
    }

    .toolimgp3 {
        width: 100%;
        height: auto;
        border: #000000 1px solid;
        float: none;
        margin-bottom: 30px;
        margin-right: 0px;
    }

}


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

    .logoleft {
        width: 87%;
        height: auto;
        float: none;
        padding-left: 20px;
        padding-top: 0px;
        padding-bottom: 0px;
        padding-right: 20px;
        text-align: center;
        }

    .navi2 {
        display: inline-block;
        width: 87%;
        height: auto;
        float: none;
        text-align: center;
        padding-left: 20px;
        padding-top: 0px;
        padding-bottom: 20px;
        padding-right: 20px;
    }

    .colimg3 {
        width: 100%;
        height: auto;
        float: none;
        padding-bottom: 20px;
        padding-right: 0px;
    }

}