@charset "utf-8";

/* CSS Document */


/*
* {
    box-sizing: border-box;
}
 .row::after {
    content: "";
    clear: both;
    display: block;
}

[class*="col-"] {
    float: left;
    padding: 15px;
}
*/

.left {
    float: left;
}

.right {
    float: right;
}

.clear {
    clear: both;
}

body {
    /* position: relative; */
    font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
}

.content {
    margin: auto;
    border: 0px solid #60F;
    padding-top: 20px;
    /*padding-bottom:20px; */
    height: 100%;
    width: 78%;
}

.content ul,
li {
    list-style: none;
}

.content_left {
    border: 0px solid #39F;
    float: left;
    /* margin-top:20px; padding-left:20px; padding-right:20px; */
    width: 25%;
    margin: auto;
}

.readCorn {
    width: 287px;
    margin: auto;
    border: 1px solid #CCC;
    border-radius: 6px;
    padding: 20px;
    /* margin-bottom:40px; */
    margin-top: 20px;
}

.readCorn h4 {
    color: #069e2d;
    font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
    font-weight: bold;
}

.content_left img {}

.readCorn ul {
    border: 0px solid #0F0;
    margin: 0 auto;
    padding: 0;
}

.readCorn ul li {
    background-repeat: no-repeat;
    display: block;
    height: 80px;
    width: 247px;
    border: 0px solid #F09;
    margin: 20px auto;
    padding: 0;
    /**/
}

.readCorn .b1 {
    background-image: url(../img/button/rcButton1.png);
}

.readCorn .b1:hover,
active {
    background-image: url(../img/button/rcButton1h.png);
}

.readCorn .b2 {
    background-image: url(../img/button/rcButton2.png);
}

.readCorn .b2:hover,
active {
    background-image: url(../img/button/rcButton2h.png);
}

.readCorn .b3 {
    background-image: url(../img/button/rcButton3.png);
}

.readCorn .b3:hover,
active {
    background-image: url(../img/button/rcButton3h.png);
}

.content_right {
    margin: auto;
    border: 0px solid #00F;
    float: left;
    width: 75%
}

.matType ul {
    border: 0px solid #39F;
    margin: 0 auto;
    padding: 0;
}

.matType ul .CR_li {
    background-repeat: no-repeat;
    display: block;
    height: 100px;
    width: 100px;
    border: 0px solid #F09;
    margin: 0 auto;
    padding: 0;
    float: left;
}

.matType .b1 {
    background-image: url(../img/button/g-button1.png);
}

.matType .b1:hover {
    background-image: url(../img/button/g-button1h.png);
}

.matType .b1.active {
    background-image: url(../img/button/c-button1ha.png);
}

.matType .b2 {
    background-image: url(../img/button/g-button2.png);
}

.matType .b2:hover {
    background-image: url(../img/button/g-button2h.png);
}

.matType .b2.active {
    background-image: url(../img/button/c-button2ha.png);
}

.matType .b3 {
    background-image: url(../img/button/g-button3.png);
}

.matType .b3:hover,
active {
    background-image: url(../img/button/g-button3h.png);
}

.matType .b3.active {
    background-image: url(../img/button/c-button3ha.png);
}

.matType .b4 {
    background-image: url(../img/button/g-button4.png);
}

.matType .b4:hover,
active {
    background-image: url(../img/button/g-button4h.png);
}

.matType .b4.active {
    background-image: url(../img/button/c-button4ha.png);
}

.matType .b5 {
    background-image: url(../img/button/g-button5.png);
}

.matType .b5:hover,
active {
    background-image: url(../img/button/g-button5h.png);
}

.matType .b5.active {
    background-image: url(../img/button/c-button5ha.png);
}

.matType .b6 {
    background-image: url(../img/button/g-button6.png);
}

.matType .b6:hover,
active {
    background-image: url(../img/button/g-button6h.png);
}

.matType .b6.active {
    background-image: url(../img/button/c-button6ha.png);
}

.matType .b7 {
    background-image: url(../img/button/g-button7.png);
}

.matType .b7:hover,
active {
    background-image: url(../img/button/g-button7h.png);
}

.matType .b7.active {
    background-image: url(../img/button/c-button7ha.png);
}

.matType .b8 {
    background-image: url(../img/button/g-button8.png);
}

.matType .b8:hover,
active {
    background-image: url(../img/button/g-button8h.png);
}

.matType .b8.active {
    background-image: url(../img/button/c-button8ha.png);
}

.matType .b9 {
    background-image: url(../img/button/g-button9.png);
}

.matType .b9:hover,
active {
    background-image: url(../img/button/g-button9h.png);
}

.matType .b9.active {
    background-image: url(../img/button/c-button9ha.png);
}

.matType {
    margin: auto;
    border: 0px solid #60F;
    width: 910px;
}

.rowMat {
    float: left;
    margin: 0 auto;
    padding: 0;
    border: 0px solid #F06;
}


/****************************** SEARCH ******************************/

.bscsrch {
    border: 1px solid #CCC;
    border-radius: 6px;
    padding: 20px;
    margin: 0 auto;
    width: 100%;
    margin-top: 20px;
    display: none;
    /* */
}

.bscsrch table tr td {
    height: 20;
    padding-left: 5px;
    padding-right: 5px;
    padding-bottom: 5px;
    padding-top: 0px;
    color: #069e2d;
}

.bscsrch table {
    margin: auto;
}


/* .bscSearch {
    height: 34px;
} */

.adv_btn {
    margin-left: 10px;
    font-weight: bold;
}

.advsrch {
    border: 1px solid #CCC;
    border-radius: 6px;
    padding: 20px;
    margin: 0 auto;
    width: 100%;
    margin-top: 20px;
    /*display:none; /* */
}

.advancesrch {
    /* background-color:#FFF;  #F7F7F7 */
    margin: auto;
    margin-top: 50px;
}

.advancesrch tbody tr td {
    padding-left: 5px;
    padding-right: 5px;
    padding-bottom: 5px;
    padding-top: 0px;
    color: #245ca6;
    font-size: 16px;
}

.advancesrch tbody tr td select,
input {
    font-size: 14px;
    height: auto;
    height: 30px;
}

.advancesrch tbody tr td input {
    width: 500px;
}

form input {
    border: 1px solid #CCC;
    border-radius: 4px;
    width: 300px;
    height: 30px;
    font-size: 14px;
    color: #505050;
}

form select {
    border: 1px solid #CCC;
    border-radius: 4px;
    height: 25px;
    font-size: 14px;
    color: #505050;
}

.srch_btn {
    border-radius: 6px;
    border: none;
    color: white;
    padding: 7px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 14px;
    margin: 4px 2px;
    cursor: pointer;
    width: 80px;
    background-color: #245ca6;
}

.srch_btn:hover,
active {
    background-color: #069e2d;
}


/*************************** END OF SEARCH **************************/


/****************************** FOOTER ******************************/

.footer {
    width: 100%;
    background-color: #069e2d;
    margin: 0 auto;
    padding: 10px;
}

.footer p {
    padding: 0;
    margin: 0 auto;
    color: #FFF;
    text-align: center;
}

.footer_cont {
    width: 100%;
    margin: auto;
    float: left;
    position: static;
    left: 0;
    bottom: 0;
    background-color: #DEDEDE;
    padding-top: 20px;
    box-shadow: inset 0em 0.5em 1em #666;
}

.footer_cont div {
    width: 25%;
    float: left;
    text-align: left;
    padding: 20px;
    color: #666;
}

.footer_cont div ul {
    margin: auto;
    width: 90%;
}

.footer_cont div li {
    text-decoration: none;
    list-style: none;
    margin: 0;
    padding: 0;
}

.footer_cont div img {
    margin: auto;
}

.footer_cont div p {
    /*margin:20px;*/
    margin: 0;
    padding: 0;
}

.footer_cont div h4 {
    color: #666;
    /*margin:20px;*/
}


/*************************** END OF FOOTER **************************/


/************************** SMALLER SCREEN **************************/

@media only screen and (max-width: 1600px) {
    .matType {
        width: 675px
    }
    .matType ul .CR_li {
        background-repeat: no-repeat;
        display: block;
        height: 75px;
        width: 75px;
        border: 0px solid #F09;
        margin: 0 auto;
        padding: 0;
        float: left;
    }
    .matType .b1 {
        background-image: url(../img/button/g-button1-m.png);
    }
    .matType .b1:hover {
        background-image: url(../img/button/g-button1h-m.png);
    }
    .matType .b1.active {
        background-image: url(../img/button/c-button1ha-m.png);
    }
    .matType .b2 {
        background-image: url(../img/button/g-button2-m.png);
    }
    .matType .b2:hover {
        background-image: url(../img/button/g-button2h-m.png);
    }
    .matType .b2.active {
        background-image: url(../img/button/c-button2ha-m.png);
    }
    .matType .b3 {
        background-image: url(../img/button/g-button3-m.png);
    }
    .matType .b3:hover,
    active {
        background-image: url(../img/button/g-button3h-m.png);
    }
    .matType .b3.active {
        background-image: url(../img/button/c-button3ha-m.png);
    }
    .matType .b4 {
        background-image: url(../img/button/g-button4-m.png);
    }
    .matType .b4:hover,
    active {
        background-image: url(../img/button/g-button4h-m.png);
    }
    .matType .b4.active {
        background-image: url(../img/button/c-button4ha-m.png);
    }
    .matType .b5 {
        background-image: url(../img/button/g-button5-m.png);
    }
    .matType .b5:hover,
    active {
        background-image: url(../img/button/g-button5h-m.png);
    }
    .matType .b5.active {
        background-image: url(../img/button/c-button5ha-m.png);
    }
    .matType .b6 {
        background-image: url(../img/button/g-button6-m.png);
    }
    .matType .b6:hover,
    active {
        background-image: url(../img/button/g-button6h-m.png);
    }
    .matType .b6.active {
        background-image: url(../img/button/c-button6ha-m.png);
    }
    .matType .b7 {
        background-image: url(../img/button/g-button7-m.png);
    }
    .matType .b7:hover,
    active {
        background-image: url(../img/button/g-button7h-m.png);
    }
    .matType .b7.active {
        background-image: url(../img/button/c-button7ha-m.png);
    }
    .matType .b8 {
        background-image: url(../img/button/g-button8-m.png);
    }
    .matType .b8:hover,
    active {
        background-image: url(../img/button/g-button8h-m.png);
    }
    .matType .b8.active {
        background-image: url(../img/button/c-button8ha-m.png);
    }
    .matType .b9 {
        background-image: url(../img/button/g-button9-m.png);
    }
    .matType .b9:hover,
    active {
        background-image: url(../img/button/g-button9h-m.png);
    }
    .matType .b9.active {
        background-image: url(../img/button/c-button9ha-m.png);
    }
    .readCorn ul li {
        background-repeat: no-repeat;
        display: block;
        height: 65px;
        width: 199px;
        border: 0px solid #F09;
        margin: 10px auto;
        padding: 0;
        /**/
    }
    .readCorn {
        width: 229px;
        padding: 15px;
    }
    .readCorn .b1 {
        background-image: url(../img/button/rcButton1-m.png);
    }
    .readCorn .b1:hover,
    active {
        background-image: url(../img/button/rcButton1h-m.png);
    }
    .readCorn .b2 {
        background-image: url(../img/button/rcButton2-m.png);
    }
    .readCorn .b2:hover,
    active {
        background-image: url(../img/button/rcButton2h-m.png);
    }
    .readCorn .b3 {
        background-image: url(../img/button/rcButton3-m.png);
    }
    .readCorn .b3:hover,
    active {
        background-image: url(../img/button/rcButton3h-m.png);
    }
}

@media only screen and (max-width: 1400px) {
    .matType {
        width: 450px
    }
    .matType ul .CR_li {
        background-repeat: no-repeat;
        display: block;
        height: 50px;
        width: 50px;
        border: 0px solid #F09;
        margin: 0 auto;
        padding: 0;
        float: left;
    }
    .matType .b1 {
        background-image: url(../img/button/g-button1-xs.png);
    }
    .matType .b1:hover {
        background-image: url(../img/button/g-button1h-xs.png);
    }
    .matType .b1.active {
        background-image: url(../img/button/c-button1ha-xs.png);
    }
    .matType .b2 {
        background-image: url(../img/button/g-button2-xs.png);
    }
    .matType .b2:hover {
        background-image: url(../img/button/g-button2h-xs.png);
    }
    .matType .b2.active {
        background-image: url(../img/button/c-button2ha-xs.png);
    }
    .matType .b3 {
        background-image: url(../img/button/g-button3-xs.png);
    }
    .matType .b3:hover,
    active {
        background-image: url(../img/button/g-button3h-xs.png);
    }
    .matType .b3.active {
        background-image: url(../img/button/c-button3ha-xs.png);
    }
    .matType .b4 {
        background-image: url(../img/button/g-button4-xs.png);
    }
    .matType .b4:hover,
    active {
        background-image: url(../img/button/g-button4h-xs.png);
    }
    .matType .b4.active {
        background-image: url(../img/button/c-button4ha-xs.png);
    }
    .matType .b5 {
        background-image: url(../img/button/g-button5-xs.png);
    }
    .matType .b5:hover,
    active {
        background-image: url(../img/button/g-button5h-xs.png);
    }
    .matType .b5.active {
        background-image: url(../img/button/c-button5ha-xs.png);
    }
    .matType .b6 {
        background-image: url(../img/button/g-button6-xs.png);
    }
    .matType .b6:hover,
    active {
        background-image: url(../img/button/g-button6h-xs.png);
    }
    .matType .b6.active {
        background-image: url(../img/button/c-button6ha-xs.png);
    }
    .matType .b7 {
        background-image: url(../img/button/g-button7-xs.png);
    }
    .matType .b7:hover,
    active {
        background-image: url(../img/button/g-button7h-xs.png);
    }
    .matType .b7.active {
        background-image: url(../img/button/c-button7ha-xs.png);
    }
    .matType .b8 {
        background-image: url(../img/button/g-button8-xs.png);
    }
    .matType .b8:hover,
    active {
        background-image: url(../img/button/g-button8h-xs.png);
    }
    .matType .b8.active {
        background-image: url(../img/button/c-button8ha-xs.png);
    }
    .matType .b9 {
        background-image: url(../img/button/g-button9-xs.png);
    }
    .matType .b9:hover,
    active {
        background-image: url(../img/button/g-button9h-xs.png);
    }
    .matType .b9.active {
        background-image: url(../img/button/c-button9ha-xs.png);
    }
    .readCorn {
        width: 20%
    }
    .readCorn ul li {
        background-repeat: no-repeat;
        display: block;
        height: 50px;
        width: 153px;
        border: 0px solid #F09;
        margin: 10px auto;
        padding: 0;
        /**/
    }
    .readCorn {
        width: 173px;
        padding: 10px;
    }
    .readCorn .b1 {
        background-image: url(../img/button/rcButton1-xs.png);
    }
    .readCorn .b1:hover,
    active {
        background-image: url(../img/button/rcButton1h-xs.png);
    }
    .readCorn .b2 {
        background-image: url(../img/button/rcButton2-xs.png);
    }
    .readCorn .b2:hover,
    active {
        background-image: url(../img/button/rcButton2h-xs.png);
    }
    .readCorn .b3 {
        background-image: url(../img/button/rcButton3-xs.png);
    }
    .readCorn .b3:hover,
    active {
        background-image: url(../img/button/rcButton3h-xs.png);
    }
    .readCorn h4 {
        font-size: 14px;
    }
    .advsrch {
        border: 0px;
    }
    .bscsrch {
        border: 0px;
    }
}

@media only screen and (max-width:1120px) {
    .content {
        float: none;
        width: 90%;
        margin: auto;
    }
    .content_left {
        float: none;
        width: 100%;
    }
    .readCorn {
        width: 560px;
    }
    .readCorn h4 {
        text-align: center;
    }
    .readCorn ul {
        margin: auto;
        width: 519px;
    }
    .readCorn ul li {
        display: inline-block;
        margin: auto;
        margin-left: 10px;
        margin-right: 5px;
    }
    .matType {
        clear: both;
    }
}

@media only screen and (max-width: 1050px) {
    .advancesrch tbody tr td input {
        width: 300px;
    }
}

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

@media only screen and (max-width: 900px) {
    .readCornt h4 {
        font-size: 12px;
    }
    .advancesrch tbody tr td input {
        width: 250px;
    }
}

@media only screen and (max-width: 840px) {
    .readCorn h4 {
        font-size: 16px;
    }
    .content_left {
        float: none;
        margin: auto;
        width: 100%;
    }
    .content_right {
        float: none;
        margin: auto;
        width: 100%;
    }
    /*
.rowMat{padding:0; margin:0 auto; width:156px; float:none; clear:both;   }
.advsrch{ padding-left:0px; padding-right:0px; border:1px solid #CCC;}
.bscsrch{ padding-left:0px; padding-right:0px; border:1px solid #CCC;}
.advancesrch tbody tr td input{width:370px;}
*/
    /*
	/* For desktop: *
	.col-1 {width: 8.33%;}
	.col-2 {width: 16.66%;}
	.col-3 {width: 25%;}
	.col-4 {width: 33.33%;}
	.col-5 {width: 41.66%;}
	.col-6 {width: 50%;}
	.col-7 {width: 58.33%;}
	.col-8 {width: 66.66%;}
	.col-9 {width: 75%;}
	.col-10 {width: 83.33%;}
	.col-11 {width: 91.66%;}
	.col-12 {width: 100%;}

	 /* For mobile phones: *
		[class*="col-"] {
			width: 100%;
		}
*/
}

@media only screen and (max-width: 650px) {
    .rowMat {
        padding: 0;
        margin: 0 auto;
    }
    /* */
    .advancesrch tbody tr td input {
        width: 250px;
    }
    .advsrch {
        border: 0px;
    }
    .bscsrch {
        border: 0px;
    }
}

@media only screen and (max-width: 600px) {
    .rowMat {
        padding: 0;
        margin: 0 auto;
        width: 156px;
        float: none;
        clear: both;
    }
    .readCorn {
        width: 173px;
        padding: 10px;
    }
    .readCorn h4 {}
    .readCorn ul {
        width: 153px;
    }
    .readCorn ul li {
        display: block;
        height: 50px;
        width: 153px;
        margin: 10px auto;
        padding: 0;
        /**/
    }
}

@media only screen and (max-width: 500px) {
    .matType {
        width: 100%;
    }
}


/********************* END OF SMALLER SCREEN **********************/