.bredcrumbPan { width: 100%; background-color: #f2f2f2; padding: 13px 0 6px; margin-bottom: 28px; }
.breadcrumb { color: #fff; text-align: right; padding: 5px 0; }
.breadcrumb li { float: right; }
.breadcrumb a, .breadcrumb span { color: #646464; padding: 0 9px 0 15px; position: relative; font-size: 12px; }
.breadcrumb a:after, .breadcrumb span:after { content: ""; position: absolute; width: 5px; height: 10px; left: 0; top: 9px; background: url(/images/bred.png) no-repeat; }
.breadcrumb span.cur { color: #bd0839; }
.breadcrumb span.cur:after { display: none; }
.breadcrumb a:hover { color: #bd0839; }
.breadcrumb { margin: 0 auto; }
/*PopUp Body*/
.popup { position: fixed; width: 100%; top: 0; right: 0; height: 100%; background: rgba(0,0,0,0.6); z-index: 10000; padding-top: 150px; transition: all 0.7s; -moz-transform: rotateX(-90deg); -webkit-transform: rotateX(-90deg); -o-transform: rotateX(-90deg); transform: rotateX(-90deg); -moz-transform-origin: 0px 0px; -webkit-transform-origin: 0px 0px; -o-transform-origin: 0px 0px; transform-origin: 0px 0px; -moz-backface-visibility: hidden; -webkit-backface-visibility: hidden; -o-backface-visibility: hidden; backface-visibility: hidden; transition: all 0.6s; }
.popup .popup-body { width: 500px; background: #fff; padding: 10px 75px; position: relative; min-height: 245px; text-align: center; }
.popup.showing { -moz-transform: rotateX(0deg); -webkit-transform: rotateX(0deg); -o-transform: rotateX(0deg); transform: rotateX(0deg); }
.popup-close { position: absolute; background: url(/images/close.png) no-repeat; width: 27px; height: 27px; left: -36px; top: -27px; margin-top: 0; margin-left: 0; }
.popup .popup-body li { margin-bottom: 15px; }
.popup .popup-body .txt { margin-right: 0; margin-left: auto; width: 380px; height: 40px; }
.popup .popup-body .txtarea { width: 380px; }
.popup .popup-body .btn { width: 100px; height: 40px; color: #fff; background-color: #002157; }
.popup h3 { font-size: 19px; margin: 20px auto; font-weight: inherit; color: #002157; }

/*All*/
h1 { color: #071235; padding-bottom: 19px; font-size: 18px; font-weight: inherit; border-bottom: 2px solid #b60303; width: 100%; text-align: right; margin-bottom: 45px; }
footer { margin-top: 100px; }
/*Slider*/
.slider-contain { width: 100%; height: 392px; }
.slider { overflow: hidden; }
.slider, .slider a, .slider img { width: 100%; height: 392px; }
.slider-caption { top: 157px; }

/*About*/
.about { color: #697d99; text-align: right; font-size: 14px; line-height: 32px; }
.about figure { width: 621px; height: 289px; float: left; margin: 0 23px 20px 0; position: relative; }
.about figure img { width: 100%; height: 100%; }
.about figure:after { content: ""; position: absolute; width: 95%; height: 90%; border: 1px dashed #fff; left: 0; right: 0; margin: 0 auto; top: 15px; }

.about-list { list-style: decimal; padding-right: 15px; }
.about-list h3, .about-list h2 { color: #000; font-size: 14px; font-weight: inherit; padding-bottom: 5px; }
.about-list li { padding-right: 10px; margin-top: 10px; }

/*product*/
.product-in { width: 100%; text-align: right;font-size: 0; }
.product-in li { display: inline-block; padding: 0 0 40px 22px; padding-left: 22px; position: relative; width: 380px; margin-left: 25px; }
.product-in li:nth-child(3n) { padding-left: 0; margin-left: 0; }
.product-in li:after { content: ""; position: absolute; width: 1px; height: 100%; background-color: #d7d7d7; left: 0; top: 0; }
.product-in li:nth-child(3n):after { display: none; }
.product-in li > a.prod-img { width: 348px; height: 247px; position: relative; }
.product-in li > a.prod-img img { width: 100%; height: 100%; object-fit:cover}
.product-in li > a.prod-img:after { content: ""; position: absolute; width: 100%; height: 100%; background: rgba(0,33,87,0.43); top: 0; right: 0; -moz-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); -webkit-transform: scale(0); transform: scale(0); -moz-transition: all 0.6s; -o-transition: all 0.6s; -webkit-transition: all 0.6s; transition: all 0.6s; }
.product-in li > a.prod-img:hover:after { -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); -webkit-transform: scale(1); transform: scale(1); }
.product-in li > a.prod-name { width: 348px; padding: 15px 10px; font-size: 14px; color: #697d99; text-align: center; }
.product-in li > a.prod-name:hover { color: #bd0839; }
/*product detail*/
.product-in-slid { width: 428px; float: left; margin: 0 72px 50px 0; height:333px;}
.slider-prod-for figure { width: 428px !important; height: 333px !important; position: relative; }
.slider-prod-for figure img { width: 100%; height: 100%; object-fit:cover;}

.slider-prod-nav { width: 250px; margin-top: 10px; }
.slider-prod-nav figure { width: 77px; height: 60px; /*border: 1px solid #002157;*/ position: relative; cursor: pointer; }
.slider-prod-nav figure img { width: 100%; height: 100%; }
.slider-prod-nav figure:hover { border-color: #bd0839; }
.slider-prod-nav .slick-current figure { border-color: #bd0839; }

.slider-prod-nav .slick-prev { width: 12px; height: 21px; background: url(../images/prod-prev.png) no-repeat; color: transparent; border: none; outline: none; cursor: pointer; z-index: 9; position: absolute; left: -37px; top: 28%; }
.slider-prod-nav .slick-next { width: 12px; height: 21px; background: url(../images/prod-next.png) no-repeat; color: transparent; border: none; outline: none; cursor: pointer; z-index: 9; position: absolute; right: -43px; top: 28%; }

.product-desc { width: 700px; float: right; font-size: 12px; color: #697d99; text-align: right; }
.product-desc h3, .product-desc h2 { font-size: 14px; color: #002157; padding: 20px 0; font-weight: inherit; }
.product-desc p { color: #697d99; font-size: 12px; }

.product-tbl { border-collapse: collapse; margin-top: 60px; }
.product-tbl tr td { border: 1px solid #030e31; padding: 7px 15px; font-size: 14px; width: 50%; }
.product-tbl tr:nth-child(2n+1) td:first-child, .product-tbl tr:nth-child(2n) td:nth-child(2) { background-color: #01175a; color: #fff; }
.product-tbl tr:nth-child(2n+1) td:nth-child(2), .product-tbl tr:nth-child(2n) td:first-child { color: #002157; }
.product-tbl tr td:nth-child(2) { text-align: center; }

/*Contact Us*/
.addres-contain { width: 650px; float: right; }
.mrg-btm50 { margin-bottom: 60px; }
.addres > li { margin-bottom: 8px; }
.addres-box { width: 635px; background-color: #f5f6f7; padding: 10px 0 25px; }
.addres-box > ul { padding: 10px 20px 0 0; display: none; }
.addres-box > ul li { width: 50%; float: right; }
.addres-box > ul li:first-child { width: 100%; color: #697d99; margin-bottom: 11px; }
.addres li img { display: inline-block; margin-left: 8px; }
.addres li span:nth-child(2) { font-size: 12px; color: #0d183a; }
.addres li span:nth-child(3) { font-size: 12px; color: #697d99; padding-right: 5px; }
.addres-box > p:first-child { color: #0d183a; font-size: 12px; cursor: pointer; position: relative; text-align: right; padding: 0 23px 5px 0; }
.addres-box > p:first-child .plus { width: 15px; height: 15px; float: left; background: url(/images/plus.png) no-repeat; margin: 10px 0 0 20px; }
.addres-box > p:first-child:after { content: ""; position: absolute; width: 178px; height: 2px; background-color: #af0305; right: 4px; bottom: 0; }
.addres-box > p:first-child.open .plus { background: url(/images/mines.png) no-repeat; }


.form-contact { width: 525px; float: left; border: 1px solid #002157; padding: 10px 32px 30px; }
.form-contact h2 { font-size: 18px; padding-bottom: 50px; color: #071235; font-weight: inherit; text-align: center; }
.form-list li { margin-bottom: 18px; width: 100%; }
.form-list li .txt, .form-list li .txtarea { background-color: #fbfafa; width: 100%; font-family: DroidArabicKufi; border: 1px solid #c9c9c9; font-size: 12px; color: #697d99; padding-right: 10px; height: 32px; }
.form-list li .txtarea { height: 114px; }
.form-list li .btn { display: block; margin: 0 auto; }

.googlemap { width: 100%; box-shadow: 0 0 5px #ededed; height: 440px; margin-top: 50px; border: 6px solid #fff; border-radius: 5px; }

/*News*/
.news-in > li { width: 100%; padding-bottom: 14px; border-bottom: 1px solid #d7d7d7; margin-bottom: 14px; }
.news-in > li figure { width: 229px; height: 178px; float: right; margin-left: 38px; position: relative; border: 2px solid transparent; -moz-transition: all 0.5s; -o-transition: all 0.5s; -webkit-transition: all 0.5s; transition: all 0.5s; }
.news-in > li figure:hover { border-color: #002157; }
.news-in > li figure a, .news-in li figure a img { width: 100%; height: 100%; }
.news-in > li figure figcaption { width: 60px; height: 60px; border: 5px solid #fff; background-color: #002157; position: absolute; left: -31px; top: 48px; text-align: center; }
.news-in figure figcaption p { padding: 0; color: #fff; font-size: 11px; height: 15px; }

.news-in .news-in-desc { width: 925px; float: right; text-align: right; }
.news-in .news-in-desc > a { font-size: 14px; color: #002157; padding: 15px 0; }
.news-in .news-in-desc > a:hover { color: #697d99; }
.news-in .news-in-desc > p { color: #697d99; font-size: 12px; }

.share { float: left; }
.share li { float: left; margin-right: 10px; }
.news-in .news-in-desc > .share > li { float: right; margin-right: 20px; position: relative; }
.news-in .news-in-desc > .share > li img { vertical-align: middle; }

.share li.share-menu { position: relative; }
.share li.share-menu > a { padding-bottom: 10px; }
.share-submenu { position: absolute; background-color: #f9f9f9; display: none; min-width: 223px; box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); z-index: 1; top: 34px; left: 0; border-radius: 5px; }
.share-submenu li { float: left; margin: 5px 7px; }
.share-submenu li a img { transition: all 0.3s; }
.share-submenu li:nth-child(2n+1) a:hover img { transform: rotate(30deg); }
.share-submenu li:nth-child(2n) a:hover img { transform: rotate(-30deg); }

.pager { text-align: right; margin: 30px 0px 0 0; width: 100%; }
.pager span a, .pager span .pcur { text-align: center; line-height: 21px; margin: 0 4px; color: #171717; font-size: 14px; width: 24px; height: 24px; border: 2px solid #d7d7d7; display: inline-block; }
.pager span a:hover { border-color: #030e31; background-color: #030e31; color: #fff; }
.pager span .pcur { border-color: #030e31; background-color: #030e31; color: #fff; }
.pager span .pback { width: 8px; height: 14px; background: url(/images/next-pager.png) top no-repeat; border: none; margin: 5px 2px; }
.pager span .pnext { width: 8px; height: 14px; background: url(/images/prev-pager.png) top no-repeat; border: none; margin: 5px 2px; }
.pager span .pnext:hover, .pager span .pback:hover { background-position: bottom; background-color: #fff; }
/*News Detail*/
.news-detail { width: 100%; color: #697d99; font-size: 12px; text-align: right; line-height: 32px; }

.news-in-slid { width: 428px; float: left; margin: 0 72px 50px 0; }
.slider-news-for figure { width: 428px; height: 333px; position: relative; /*border: 1px solid #002157;*/ }
.slider-news-for figure img { width: 100%; height: 100%;object-fit:cover; }

.slider-products figure { width: 428px; height: 333px; }

.slider-news-nav { width: 250px; margin-top: 10px; }
.slider-news-nav figure { width: 77px; height: 60px; /*border: 1px solid #002157;*/ position: relative; cursor: pointer; }
.slider-news-nav figure img { width: 100%; height: 100%; }
.slider-news-nav figure:hover { border-color: #bd0839; }
.slider-news-nav .slick-current figure { border-color: #bd0839; }

.slider-news-nav .slick-prev { width: 12px; height: 21px; background: url(../images/prod-prev.png) no-repeat; color: transparent; border: none; outline: none; cursor: pointer; z-index: 9; position: absolute; left: -37px; top: 28%; }
.slider-news-nav .slick-next { width: 12px; height: 21px; background: url(../images/prod-next.png) no-repeat; color: transparent; border: none; outline: none; cursor: pointer; z-index: 9; position: absolute; right: -43px; top: 28%; }

.news-option { width: 100%; margin-top: 50px; background-color: #f1efef; border-top: 1px solid #d7d7d7; border-bottom: 1px solid #d7d7d7; text-align: right; height: 50px; padding-top: 11px; position: relative; }
.news-option > li { display: inline-block; padding: 0 50px; }
.news-option > li:first-child, .news-option > li:last-child { padding: 0 15px; }
.news-option > li > img { display: inline-block; margin-left: 5px; vertical-align: middle; }
.news-option > li span:nth-child(2), .news-option li a { color: #6a6868; font-size: 12px; display: inline-block; padding-right: 5px; }
.news-option > li span:first-child { font-size: 12px; color: #030e31; }

/*Project*/
.project-in { width: 100%; text-align: right; }
.project-in li { display: inline-block; width: 388px; /*border: 2px solid #030e31;*/ margin: 0 0 39px 13px; padding: 19px;height:370px;
overflow: hidden; }
.project-in li:nth-child(3n) { margin-left: 0; }
.project-in li figure { width: 348px;
height: 247px; }
.project-in li figure a, .project-in li figure a img { width: 100%; height: 100%; }
.project-in li figure a { position: relative; }
.project-in li figure a:after { content: ""; position: absolute; width: 100%; height: 100%; background: rgba(5,20,69,0.5); left: 0; top: 0; -moz-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); -webkit-transform: scale(0); transform: scale(0); -moz-transition: all 0.6s; -o-transition: all 0.6s; -webkit-transition: all 0.6s; transition: all 0.6s; }
.project-in li figure a:hover:after { -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); -webkit-transform: scale(1); transform: scale(1); }
.project-in li > a { width: 100%; padding:10px 10px 15px; font-size: 16px; color: #002157; text-align: center;overflow: hidden;
height: 65px;
line-height: 26px; }
.project-in li > a:hover { color: #697d99; }

/*Downloads*/
.downlod-sech { width: 538px; margin: 0 auto 30px; }
.downlod-sech span { float: right; padding-right: 15px; }
.downloads li { float: right; width: 28%; margin: 30px 25px; border: 1px solid #002157; padding: 5px 10px 5px 0; transition: all 0.5s; }
.downloads li:hover { border-color: #000; }
.downloads li:hover a p { color: #0a4dd0; }
.downloads li a { width: 100%; }
.downloads li a img { width: 40px; height: 40px; float: right; margin-left: 15px; }
.downloads li a p { font-size: 14px; color: #000; transition: all 0.5s; padding: 5px 6px; }

/*Comment*/
.comment .txtarea { width: 40%; float: right; }
.comment li { margin: 0 0 20px; font-size: 13px; }
.comment li img { float: right; margin: 0 0 5px 5px; }
.comment li p { padding: 0px 10px; }
.comment li span { padding-right: 40px; }
.comment li label { padding-right: 5px; }

.form-list li:first-child p { height: auto; padding-bottom: 16px; position: relative; font-size: 16px; color: #282828; font-weight: inherit; margin: 36px 0; }
.form-list li:first-child p:after { content: ""; position: absolute; width: 59px; height: 5px; background-color: #051445; bottom: 0; right: 0; }
.form-list li .txt { margin-bottom: 17px; width: 100%; height: 33px; border-color: #c9c9c9; font-size: 12px; color: #05367a; background-color: #fbfafa; }
.form-list li .txtarea { margin-bottom: 17px; width: 100%; height: 120px; border-color: #c9c9c9; font-size: 12px; color: #05367a; background-color: #fbfafa; }
.form-list li .btn { color: #fff; float: left; }
.form-list li .btn:hover { color: #000; }
.form-list li.code-sec .txt { float: right; }
.form-list li.code-sec img { float: left; }
.wid-res-form { width: 31%; float: right; }
/*links*/
.col-link { width: 100%;text-align: right; }
.col-link a { padding: 18px 5px; width: 192px; position: relative; margin: 27px 22px; outline: none; color: #575555; text-decoration: none; text-transform: uppercase; letter-spacing: 1px; display: inline-block; }
.col-link a::before, .col-link a::after { position: absolute; left: 0; width: 100%; height: 1px; background: #071255; content: ''; opacity: .2; -webkit-transition: opacity .3s,height .3s; -moz-transition: opacity .3s,height .3s; transition: opacity .3s,height .3s; }
.col-link a::after { top: 100%; opacity: 0; -webkit-transition: -webkit-transform .3s,opacity .3s; -moz-transition: -moz-transform .3s,opacity .3s; transition: transform .3s,opacity .3s; -webkit-transform: translateY(-10px); -moz-transform: translateY(-10px); transform: translateY(-10px); }
.col-link a span:last-child { z-index: 1; padding: 8px 0 0px 0; display: block; color: #000; text-shadow: none; text-transform: none; font-style: italic; font-size: 12px; font-family: arial; opacity: 0; -webkit-transition: -webkit-transform .3s,opacity .3s; -moz-transition: -moz-transform .3s,opacity .3s; transition: transform .3s,opacity .3s; -webkit-transform: translateY(-100%); -moz-transform: translateY(-100%); transform: translateY(-100%); }
.col-link a:hover::before, .col-link a:focus::before { height: 6px; }
.col-link a:hover::before, .col-link a:hover::after, .col-link a:focus::before, .col-link a:focus::after { opacity: 1; -webkit-transform: translateY(0); -moz-transform: translateY(0); transform: translateY(0); }
.col-link a:hover span:last-child, .col-link a:focus span:last-child { opacity: 1; -webkit-transform: translateY(0%); -moz-transform: translateY(0%); transform: translateY(0%); }

/*Gallery*/
.pic-gallery { width: 300px; height: 300px; float: left; position: relative; margin: 50px 0 65px 100px; text-align: center; }
.pic-gallery figure img { width: 300px; height: 300px; -moz-transition: 500ms; -o-transition: 500ms; -webkit-transition: 500ms; transition: 500ms; }
.pic-gallery figcaption { display: none; position: absolute; text-align: center; width: 100%; padding: 20px 0px; -moz-transition: 300ms; -o-transition: 300ms; -webkit-transition: 300ms; transition: 300ms; }
.pic-gallery figcaption p { font-size: 25px; font-weight: bold; }
.pic-gallery a:hover figure img { transform: rotate(360deg); }
.pic-gallery a:hover figcaption { display: block; }
.video-gallery { width: 300px; height: 300px; float: right; position: relative; margin: 50px 100px 65px 0; text-align: center; }
.video-gallery figure img { width: 300px; height: 300px; -moz-transition: 500ms; -o-transition: 500ms; -webkit-transition: 500ms; transition: 500ms; }
.video-gallery figcaption { display: none; position: absolute; text-align: center; width: 100%; padding: 20px 0px; -moz-transition: 300ms; -o-transition: 300ms; -webkit-transition: 300ms; transition: 300ms; }
.video-gallery figcaption p { font-size: 25px; font-weight: bold; }
.video-gallery a:hover figure img { transform: rotate(-360deg); }
.video-gallery a:hover figcaption { display: block; }
/*video gallery*/
.slider-gallery-for { padding-top: 50px; }
.slider-gallery-for video { width: 700px; height: 100%; margin: 0 auto; }
.slider-gallery-nav { width: 605px; margin: 25px auto 0; }
.slider-gallery-nav figure { width: 130px; height: 130px; border: 1px solid #e5e5e5; position: relative; }
.slider-gallery-nav figure img { width: 100%; height: 100%; }
.slider-gallery-nav figure:hover { border-color: #0689cd; cursor: pointer; }
.slider-gallery-nav .slick-current figrue { border-color: #ffba00; }
.slider-gallery-nav figcaption { opacity: 0.8; top: 37px; left: 39px; z-index: 20; position: absolute; width: 50px; height: 50px; }

.slider-gallery-nav .slick-prev { width: 50px; height: 50px; background: url(/images/prev-slid.png) no-repeat; color: transparent; border: none; outline: none; cursor: pointer; z-index: 9; position: absolute; left: -43px; top: 33%; }
.slider-gallery-nav .slick-next { width: 50px; height: 50px; background: url(/images/next-slid.png) no-repeat; color: transparent; border: none; outline: none; cursor: pointer; z-index: 9; position: absolute; right: -62px; top: 33%; }
/*Picture Gallery*/
#results li { display: inline-block; width: 200px; height: 200px; float: right; margin: 14px; background: #000; position: relative; overflow: hidden; }
#results li figure { width: 200px; height: 200px; }
#results li figure img { width: 100%; height: 100%; }
#results li a:hover .summary { opacity: 1; }
#results li figcaption { transition: top 0.4s; position: absolute; width: 100%; height: 100%; padding: 45% 0 0; top: 250px; left: 0; right: 0; background: rgba(0,0,0, 0.6); text-align: center; font-size: 20px; color: #fff; }
#results li a:hover figcaption { top: 0; }

.otherform .ddl { padding: 0 12px; width: 308px; }
.otherform .txtarea { width: 308px !important; display: inline-block; }
.otherform .btn { padding: 5px 34px; float: right !important; }

.list-style li { list-style: disc; padding-right: 5px; }
/* ------------------------- Search ------------------------- */
#tabs { overflow: hidden; width: 100%; margin: 0; padding: 0; list-style: none; }
#tabs li { float: right; margin: 0 -15px 0 0; }
#tabs a { float: left; position: relative; padding: 0 21.9px; height: 0; line-height: 30px; text-transform: uppercase; text-decoration: none; color: #fff; border-left: 30px solid transparent; border-bottom: 30px solid #3D3D3D; border-bottom-color: #777\9; opacity: .3; filter: alpha(opacity=30); }
#tabs a:hover, #tabs a:focus { border-bottom-color: #a57131; opacity: 1; filter: alpha(opacity=100); }
#tabs a:focus { outline: 0; }
#tabs #current { z-index: 3; border-bottom-color: #3d3d3d; opacity: 1; filter: alpha(opacity=100); }
#content {; border-top: 2px solid #3d3d3d; padding-top: 10px; }
#content h2, #content h3, #content p { margin: 0 0 15px 0; }

/* ------------------------- Sitemap ------------------------- */
.sitemap { }
.sitemap li { margin-right: 20px; margin-bottom: 10px; }
.sitemap li h2 { color: #114abd; font-weight: bold; font-size: 14px; }
.sitemap li a { padding-right: 32px; background: url(../images/sitemap.png) right 0 no-repeat; color: #000; }
.sitemap li a:hover { color: #01afeb; }
.sitemap li ul { margin: 20px 20px; }


.gal_vid_back { position: fixed; top: 0; right: 0; left: 0; bottom: 0; background: rgba(0,0,0,.4); z-index: 1000; display: none; }
.gal_vid_holder { width: 80%; height: 50%; position: absolute; right: 10%; top: 10%; }
.closevid { position: absolute; top: -2px; left: -20px; color: #fff; font-size: 20px; }

.talab-menu li a { position: relative; padding-right: 15px; line-height: 30px; }
.talab-menu li a::before { position: absolute; right: 0px; top: calc((30px - 5px) /2 ); content: ""; width: 5px; height: 5px; border-radius: 50%; background: #aba36c; }
