#art-ban{background: url(../images/art-ban.jpg) top center no-repeat; height: 270px; }
#main{ padding-bottom: 30px; }
#crumbs{ color: #9f9f9f; padding: 8px 0; text-transform: capitalize; margin-bottom: 30px;background: #efefef; font-size: 12px;}
#crumbs a{color: #9f9f9f;}
#crumbs a:hover{color: #28a7e6;}
#crumbs i{color: #28a7e6; padding-right: 7px;}
#main img{ max-width:100%; height:auto;}
#main h1{ font-size: 24px; color: #28a7e6; font-weight:normal;  margin: 0; padding: 0 0 25px; text-transform: uppercase; position: relative; }
#main .typename{background: #dedede; color: #000; padding:7px 15px; text-transform: capitalize; margin-bottom: 20px; display: block;}
#main .prolist:hover .box-img::before { opacity: 1;transform: translate(-50%, -50%) rotate(90deg);}
#main .prolist .box-img::before {color:#01b1ec;z-index: 3;content:"\f055";font-family: "FontAwesome";font-size: 4rem;left: 50%;opacity: 0;position: absolute;top: 50%;transform: translate(-50%, -50%);transition: all 0.3s ease 0s;}
#main .prolist .box-img::after{ opacity: 0;transition: all 0.3s ease 0s;content: ""; background: rgba(0,0,0,0.5); position: absolute;  width: 100%; height: 100%; top: 0; left: 0; display: block;}
#main .prolist:hover .box-img::after{opacity: 1;}
#main .prolist .box-img{ overflow: hidden;display: block; position: relative;}
#main .prolist .box-img img{ transition:all 0.3s ease;}
#main .prolist:hover .box-img img{ transform: scale(1.2); } 
#main .prolist .title{ color: #000;  display: block; padding: 12px 0; text-align: center; line-height: 18px; }
#main .prolist:hover .title{background: #01b1ec; color: #fff;}
#main .prolist{text-decoration: none; margin-bottom: 20px; display: block;}
#main .nlist{border-bottom: 1px solid #e8e8e8; padding: 15px 0; line-height: 18px;}
#main .nlist:last-child{border-bottom: none;}
#main .nlist .title{color: #4b4948; font-weight: bold; font-size: 18px;}
#main .nlist a:hover.title{ color: #01b1ec; text-decoration: none; }
#main .nlist p{color: #7d838c; font-size: 12px; margin-top:15px; }
#main .nlist .more{color: #333333;}
#main .lnrow{ margin-left: -5px; margin-right: -5px; }
#main .lnrow .col-md-3,#main .lnrow .col-sm-4,#main .lnrow .col-sm-8{padding-left: 5px; padding-right: 5px;}
@media (max-width:767px) {
	#main .lnrow img{ margin-bottom: 10px; }
}
#main .artform{margin-top: 6.2%;}
#main .mailtop{background: #01b1ec; text-align: center;color: #fff;padding: 22px 15px 10px;}
#main .mailtop p{line-height: 18px; font-size: 12px;}
#main .mailtop p em{font-weight:bold;}
#main .artform .mailbody{border: 1px solid #dadee4; background: #f5f5f5; padding:3.6% 6.68%; border-top: none;}
#main .artform .mailtit{  font-size: 24px; font-weight: bold; border-radius: 3px 3px 0 0; margin-bottom: 8px; text-transform: uppercase; }
#main .artform .form-group{ margin-bottom: 15px;}
#main .artform .form-control{background:#fff; color: #9e9e9e; font-size: 16px; border:1px solid #dadee4; font-size: 12px;}
#main .artform  input.form-control{   height:46px;}
#main .artform .mailbtn{ border-radius: 3px; width:100%; font-weight: bold; height: 46px; background-color: #4d4d4d; color: #fff; font-size: 18px; margin: 27px auto 0; border: none; display: block;  text-transform: uppercase;transition:all 0.3s ease;}
#main .artform .mailbtn:hover{ background:#01b1ec; }
@media (min-width:992px) {
#main .mailtop p{width: 80%;margin-left: auto; margin-right: auto;}
}
#main .page{ margin:50px 0 80px; list-style:none; text-align: center; }
#main .page  a{  color:#01b1ec; text-decoration:none;border: 1px solid #01b1ec; width: 100%;padding:6px 12px;margin-right:5px;}
#main .page  a:hover,#main .page .crrent{background:#01b1ec;color: #fff;}
#main .sidebar .sidetit,#main .sidebar .blogtit{background: #01b1ec; color: #fff; display: block; padding:10px 15px;font-size: 18px; text-transform: uppercase; border-radius: 5px 5px 0 0; text-decoration: none;}
#main .sidebar a:hover.sidetit{background: #15263e;}
#main .sidebar .blogtit{background: #4d4d4d;}
#main .sidebar .prlist{margin: 0 0 30px; padding: 0; list-style: none; background: #efefef;}
#main .sidebar ul li{   text-transform: capitalize; }
#main .sidebar ul li a{color: #4e5359; text-decoration: none; display: block;border-bottom: 1px solid #dedede;padding:10px 20px; line-height: 18px; }
#main .sidebar ul li a:hover,#main .sidebar ul li a:hover i,#main .sidebar a:hover.catename{color: #01b1ec;}
#main .sidebar ul li a i{color: #333333; padding-right: 5px;transition: 0.3s all ease;  vertical-align: 1px;}
#main .sidebar ul li ul{margin: 0; padding: 0; list-style: none;}
#main .sidebar ul li ul li i{font-size: 6px; vertical-align: middle;}
#main .sidebar ul li ul li a{padding-left: 50px;}
#main .sidebar ul li ul li a::before{content:"\f0da";font-family: FontAwesome; position: absolute;  font-size: 12px; color: #333; margin-left: -14px;}
#main .sidebar .download{margin-top: 40px; text-align: center;}
#main .sidebar .nlist .title {font-size: 14px;}
#main .sidebar .nlist p{margin-top: 5px;}
#main .sidebar .download img{cursor: pointer;}
#main .sidebar .sidebtn{width: 100%; display: block; border-radius: 10px; background: #01b1ec; color: #fff; font-size: 18px; font-weight: bold; padding: 15px 0; text-align: center; margin: 30px 0;}
#main .sidebar a:hover.sidebtn{text-decoration: none; background: #404040;}
/*contact.htm*/
.co-name{ color: #525252; font-weight: bold; font-size: 18px; margin-bottom: 30px;}
#main .adds,#main .pc,#main .tel,#main .fax,#main .mail{ color: #596267; padding-left: 40px; margin-bottom: 20px; line-height: 20px; }
#main .adds b,#main .pc b,#main .tel b,#main .fax b,#main .mail b{ color: #373737; text-transform: uppercase; }
#main .adds::before,#main .pc::before,#main .tel::before,#main .fax::before,#main .mail::before{font-family: FontAwesome; position: absolute; margin-left: -40px; color: #596267; font-size: 20px; padding-top: 10px; }
#main .tel::before{content:"\f095";}
#main .mail::before{content:"\f003"}
#main .adds::before{content:"\f041"}
#main .pc::before{content:"\f02c"}
#main .fax::before{content:"\f02f"}
#main .mail a{ color: #01b1ec; }
#main .matop{margin-top: 2.8%;}
#main  .contact .col-sm-4{margin-top: 4.6%;}
#main  .loctit{text-align: center; font-size: 24px; color: #28a7e6; margin-top:4.6%; margin-bottom: 30px;}
/*about.htm*/
#main .a-tit{ background: #dedede; text-align: center; color: #000000; font-size: 18px; padding: 7px 10px; border-radius: 5px;}
#main .a-desc{padding-top: 3.82%; padding-bottom: 3.82%; }
#main .a-desc p{color: #7f7f7f; line-height: 24px;}
#main .a-desc ul{color: #7f7f7f; list-style:square; margin-left: 0; padding-left: 15px;}
#main .a-desc ul li span{font-style: italic; color: #01b1ec;}
#main .col-md-9 h2{font-size: 20px;}
#main .col-md-9 table{text-align: center;}
#main .col-md-9 table th{background: #ededed; text-align: center; vertical-align: middle;}
#main .col-md-9 table td{vertical-align: middle;}
#main .col-md-9 h2{background: #eee; border-left: 5px solid #28a7e6; padding: 12px 5px 12px 15px; font-size: 18px; }
#main .col-md-9 h3{font-size: 16px; font-weight: bold;}
#main .col-md-9 h4,#main .col-md-9 h5{font-size: 14px; font-weight: bold;}
#main .col-md-9 .diyrow{margin-left: -7px; margin-right: -7px;}
#main .col-md-9 .diyrow .col-md-3,#main .col-md-9 .diyrow .col-md-4,#main .col-md-9 .diyrow .col-md-6{padding: 7px; }
/*#main .col-md-9  ul{margin: 0; padding: 0; list-style: none;}
#main .col-md-9  ul li{ padding-left: 30px; }
#main .col-md-9  ul li::before{}position: absolute;font-family: FontAwesome; content:"\f005"; font-size: 17px; margin-left: -30px; margin-top: 2px; color: #69a22c;}*/
.cont404{ padding:7.95% 7.9% 7% 7.9%; color: #8a8a8a; }
.cont404 .nottit{ font-size: 24px; color: #4b4948;  margin-bottom:8px;}
.error{ font-size:64px; text-align: center; margin-bottom: 30px; color: #01b1ec; font-weight: bold;}
.cont404 .option404{ margin-top: 50px; text-align: left;} 
.cont404 .option404 .opt-tit{ font-size:16px; color: #4b4948; font-weight: bold; }
.cont404 .option404 ul{ margin: 0; padding: 0; list-style: none; }
#main .col-sm-8 .cont404 .option404 ul li{ padding: 5px 0;  }
#main .col-sm-8 .cont404 .option404 ul li::before{content: "";}
.cont404 .option404 ul li i{ padding-right: 10px; }
.cont404 .option404 ul li a{color: #01b1ec;}
.cont404 .option404 ul li a:hover{ color: #429bf7; }
.cont404 .option404 ul li::after{ content: "" !important ;}
.cont404 .option404 .search{ background: #36baff url( ../images/search.jpg) no-repeat; border: none; width: 32px; height: 32px; }
.cont404 .option404 input.text{ border: 1px solid #e0dfdf; width: 261px; height: 32px;}
.cont404 .option404 form{ display: inline-block; }
@media (max-width:600px){
.error{ font-size: 32px; margin-bottom: 20px; }
}
@media (max-width:767px){
.sidebar .sidetit,.sidebar .prlist,.sidebar .blogtit,.sidebar .nlist{ display: none !important;}
}
#main .call{background: #01b1ec; color: #fff; font-weight: bold; font-size: 18px; border-radius: 5px; padding:12px 20px; text-decoration: none; display: block; width: max-content;margin: 0 auto;}
#main a:hover.call{background: #404040;}