html { scroll-behavior: smooth;}
body{ font-size: 15px; color: #666; font-family: 'Raleway', sans-serif;}
.clear{ clear: both; display: block}
.error{ border-color:#F00!important}
p{ font:16px; line-height: 25px}
a{ -webkit-column-rule: #000; -moz-column-rule: #000; -o-column-rule: #000; column-rule: #000; color: #000; font-weight: 500}
a:hover{ text-decoration: none; color: #000;}
ul{ list-style-type: none}

.main-menu{ float: right}
.main-menu ul{ margin-right: 60px; margin-top: 30px; margin-bottom:0}
.main-menu ul li{display: inline-block; margin: 0 30px; position: relative; padding-bottom: 27px}
.main-menu ul li a{ color:#333; padding: 4px 0;; font-size: 13px; letter-spacing: 1px}
.main-menu ul li:hover a{ border-bottom:2px solid #D7B262}
.main-menu ul li .sub-menu{ position: absolute; width: 650px; left:-250px; top: -200px; display: none; border-bottom: 1px solid #ccc; transition:0.1s}
.main-menu ul li:hover .sub-menu{ display:block; left:-250px; top: 32px;}
.main-menu ul li .sub-menu ul{ border-top:2px solid #D7B262; margin: 30px 0 0 0; padding: 40px 0 40px 30px; background: #fff; border-left: 1px solid #ddd; border-right: 1px solid #ddd; position: relative; min-height: 230px;}
.main-menu ul li .sub-menu ul li{ display: block; padding: 8px 0; margin: 0; }
.main-menu ul li .sub-menu ul li a{ color: #6E6E6E; font-size: 13px;}
.main-menu ul li:hover .sub-menu ul li a{ border:0}
.main-menu ul li .sub-menu ul li a:hover{ color: #012754}

.main-menu ul li .sub-menu ul li .m-comp{ position:absolute; right: 30px; top: 0px; display: none; background: #fff; width: 370px; min-height:163px; z-index: 1000}
.main-menu ul li .sub-menu ul li:hover a{ color:#012754; font-weight: 600 }
/*.main-menu ul li .sub-menu ul li:hover .m-comp{ display: block}*/
.main-menu ul li .sub-menu ul li .m-comp img{ margin-bottom: 15px;}
.main-menu ul li .sub-menu ul li .m-comp h6{ font-size:14px; line-height: 22px; letter-spacing: 1px;}

.main-menu ul li .sub-menu ul li.one .m-comp{ display: block}
.main-menu ul li .sub-menu ul li.two .m-comp{top: -38px;}
.main-menu ul li .sub-menu ul li.three .m-comp{top: -76px;}
.main-menu ul li .sub-menu ul li.four .m-comp{top: -114px;}
.main-menu ul li .sub-menu ul li.five .m-comp{top: -152px;}
.main-menu ul li .sub-menu ul li.six .m-comp{top: -190px;}
.main-menu ul li .sub-menu ul li.seven .m-comp{top: -228px;}
.main-menu ul li .sub-menu ul li.eight .m-comp{top: -266px;}
.main-menu ul li .sub-menu ul li.nine .m-comp{top: -304px;}


.main-menu ul li .sub-menu ul li.one:hover .m-comp,.main-menu ul li .sub-menu ul li.two:hover .m-comp,.main-menu ul li .sub-menu ul li.three:hover .m-comp,.main-menu ul li .sub-menu ul li.four:hover .m-comp,.main-menu ul li .sub-menu ul li.five:hover .m-comp,.main-menu ul li .sub-menu ul li.six:hover .m-comp,.main-menu ul li .sub-menu ul li.seven:hover .m-comp,.main-menu ul li .sub-menu ul li.eight:hover .m-comp,.main-menu ul li .sub-menu ul li.nine:hover .m-comp{ display: block}

.main-menu ul li .sub-menu ul li .m-comp span{ width: 183px; display:inline-block; vertical-align: top; line-height: 15px}
.main-menu ul li .sub-menu ul li .m-comp span a{ font-size: 11px; letter-spacing: 0; color: #333}
.main-menu ul li .sub-menu ul li .m-comp span a:hover{ color:#012754;}

.animate:hover svg{ margin-left: 15px; fill: red;}

.button_container { position: fixed; top: 38px; right: 50px; height: 35px; width: 20px; cursor: pointer; z-index: 100; transition: opacity .25s ease;}
.button_container:hover { opacity: .7;}
.button_container.active .top { transform: translateY(8px) translateX(0) rotate(45deg); background: #333;}
.button_container.active .middle { opacity: 0; background: #333; }
.button_container.active .bottom { transform: translateY(-8px) translateX(0) rotate(-45deg); background: #333;}
.button_container span { background:#333; border: none; height: 2px; width: 100%; position: absolute; top: 0; left: 0; transition: all .35s ease; cursor: pointer;}
.button_container span:nth-of-type(2) { top: 8px;}
.button_container span:nth-of-type(3) { top: 16px;}

.overlay { position:fixed; background: #fff; top: 0; left: 0; width: 100%; height: 0%; opacity: 0; visibility: hidden; transition: opacity .35s, visibility .35s, height .35s; overflow: hidden; padding-left: 4%; background-image: url("../images/mtr-bg.jpg"),url("../images/mbl-bg.jpg"); background-position: right top, left bottom; background-repeat: no-repeat, no-repeat;}

.overlay.open { opacity: 1; visibility: visible; height: 693px; border-bottom: 1px solid #ddd}
.overlay .open li { animation: fadeInRight .5s ease forwards; animation-delay: .35s;}
.overlay .open li:nth-of-type(2) { animation-delay: .4s;}
.overlay .open li:nth-of-type(3) { animation-delay: .45s;}
.overlay .open li:nth-of-type(4) { animation-delay: .50s;}

	
nav { position: relative; height: 80%; text-align: left; top: 54%; transform: translateY(-50%); font-weight: 400;}
nav h6{ text-align: left; padding-left: 20px;}
nav h6 small{ font-weight: 600; color:#000 }
nav ul{ display: block; list-style-type: none; border-left:1px solid #ccc; padding-left: 0; height: 328px; margin-top: 50px;}
nav ul li{ font-size: 14px; padding: 8px 0 8px 20px;}
nav ul li:hover{ border-left:3px solid #00469A; margin-left: -3px}
nav ul li a{ color: #6E6E6E}
nav ul li a:hover{ color: #012754}
nav ul li h6 small a{ font-weight: 600; color:#000 }

.m-info{ position: absolute; z-index: 1000; bottom: 0px; width: 96%; padding: 40px 0 0 0; border-top:1px solid #d8d8d8; font-size: 12px; color: #000; font-weight: 500; letter-spacing: 2px;}
.m-info a{ margin: 0 20px; color: #8B8B8B}
.m-info a:hover{ color: #012754}
.m-info samp{ margin-left: 20px;}


@keyframes fadeInRight {
  0% {
    opacity: 0;
    left: 20%;
  }
  100% {
    opacity: 1;
    left: 0;
  }
}


/*=======*/
a.intro-button{	position: relative;	display: inline-block; width: 13em;	height: 3.7em; overflow: hidden; vertical-align: middle; text-align: left; text-decoration: none; font-size: 13px; font-weight: 600; letter-spacing: 1px; line-height: 3.5em; margin-top: 10px;	color: #000; cursor: pointer; transform: translateZ(0);	transition: transform .5s;}

a.intro-button svg{	z-index: 1;	position: absolute;	top: -7px; left: 75px;}
a.intro-button svg line, polyline, circle{ fill: none; stroke: #000;}
a.intro-button svg line, polyline{ stroke-miterlimit: 10;}
a.intro-button svg circle{ display: block; stroke-linecap: round; stroke-linejoin: round; stroke-width: .066em; stroke-dasharray: 200; stroke-dashoffset: 0; transition: stroke-dashoffset ease-out .5s;}
a.intro-button:hover{ transform: translateZ(0) translateX(.5em);}
a.intro-button:hover svg circle{ stroke-dashoffset: 200;}

section{ padding: 130px 0;}

.container{ max-width: 97%}
.container.full{ max-width: 100%}

header{ width:100%;  background: #fff; -webkit-box-shadow: 0px 0px 9px 0px rgba(0,0,0,0.29); -moz-box-shadow: 0px 0px 9px 0px rgba(0,0,0,0.29); box-shadow: 0px 0px 9px 0px rgba(0,0,0,0.29); position: fixed; z-index: 16}

.banner{ padding: 100px 0 0 0}

.intro{ padding: 100px 0; background: url("../images/bg.jpg") no-repeat -90px 10px}

h1{ color:#012754; font-size: 28px; font-weight: 500; line-height: 40px;}

.testimonial{ background: #FAFAFA url("../images/quotes.png") no-repeat center;}
.testimonial h6{ color: #012754; font-weight: 500;}
.testimonial p{ font-size:17px}


.sq-crousal4 .carousel-indicators { bottom: -45px}
.sq-crousal4 li { width: 30px; background-color: #707070; margin: 0 5px}
.sq-crousal4 li.active {  background-color: #D7B262;}
.sq-crousal4 .fa-angle-left { font-size: 45px; color: #444; left: -30px; position: relative; top: -17px;}
.sq-crousal4 .fa-angle-right { font-size: 45px; color: #444; right: -30px; position: relative; top: -17px;}

.business-slide{ text-align: center;}
.business-slide h4{ text-transform: uppercase; font-weight: 500; color:#012754;}

.business-slide .card-header{ border: 1px solid #eee; text-transform: uppercase; height: 65px; color: #012754; background: #fff; font-weight: 600; font-size: 14px; padding-top: 18px}

a.b-scroll{ width: 45px; height: 45px; top: 43%}
a.b-scroll svg{ height: 45px}

.business-slide a .b-scroll-text{ position: relative; overflow: hidden}
.business-slide a .b-scroll-text .b-scroll-hover{ position: absolute; top: 450px; width: 100%; height: 100%; background: rgba(250,250,250,0.9); padding: 25px 15px; transition: 0.5s}
.business-slide a:hover .b-scroll-text .b-scroll-hover{ top:0; }

.business-slide a .b-scroll-text .b-scroll-hover ul { text-align: left!important; padding-left: 15px}
.business-slide a .b-scroll-text .b-scroll-hover ul li{ padding-bottom: 10px; font-weight: 400; font-size: 13px}


.news-list{ padding: 100px 0; background: url("../images/bg.jpg") no-repeat bottom left}
.news-list h6{ font-weight: 700;  color: #012754}
.news-list h6 small{ font-weight: 600;}
.news-list h5{ font-size: 18px; color:#111; line-height: 30px; padding-right: 30px}


footer{ padding: 80px 0; background: #FAFAFA url("../images/Group 104.png") no-repeat 380px 80px;}
footer h4{ font-weight: 400; color:#012754; font-size:27px; letter-spacing: 2px; line-height: 38px}
footer h6{ margin-bottom: 25px; color: #444; font-size: 12px; font-weight:600 }
footer p{ font-size:13px}
footer ul{ padding-left: 0}
footer ul li{ list-style: none; padding: 5px 0; font-size: 13px; font-weight: 500}
footer ul li a{ color: #333}

.f-base{ background: #1A1A1A; padding: 18px 0; font-size: 12px; color: #878787; font-weight: 600; letter-spacing: 1px}

.f-base a{ color: #767676; margin: 0 15px; font-weight: 600}
.f-base a:hover{ color: #D7B262}


.business-sub{ background: #464645; }
.business-sub a{ color: #fff; border-bottom: 5px solid #464645; font-size: 13px; padding: 25px 1.5%; display: inline-block; transition: 0.3s}
.business-sub a:hover{ border-bottom: 5px solid #D7B262; }
.business-sub a.active{ border-bottom: 5px solid #D7B262; }


.inner{ padding: 100px 0; background: url("../images/bg.jpg") no-repeat -90px 0px}
.inner.contact h4{ text-transform: uppercase; text-align: center; color: #000; font-size: 21px; font-weight: 600; letter-spacing: 3px; margin-bottom: 30px}

.inner a.download{ width: 74px; height: 74px; display: block; border-radius: 50%; overflow: hidden}

.inner ul.company-contct{ padding-top: 15px;}
.inner ul.company-contct li{ padding-top: 15px;}
.inner ul.company-contct li a{ color: #012754}


.inner.contact ul li{ margin-bottom: 15px; color: #000; font-weight: 500}

.contact-form h2{ font-size:40px; font-weight: 600; color: #000; width: 100%; letter-spacing: 3px}
.contact-form h6{ font-size:15px; font-weight: 600; color: #000; width: 100%; letter-spacing: 3px}

.contact-form .textbox{ height: 55px; border-radius:2px; background: #f7f7f7; border-color: #eee; font-size: 13px; padding: 15px 25px}
.contact-form .textarea{ height: 350px; border-radius:2px; background: #f7f7f7; border-color: #eee; font-size: 13px; padding: 15px 25px}
.contact-form .button{ background: #0F2239; color: #fff; border: 0; font-size: 11px; letter-spacing: 2px; text-transform: uppercase; padding: 15px 35px}


.inner.career{ padding: 100px 0; background: url("../images/bg2.png") no-repeat -130px 70px}
.inner.career h4{ text-transform: uppercase; color: #012754; font-size: 21px; font-weight: 500; letter-spacing: 3px; margin-bottom: 30px}
.inner.career h3{ font-size: 21px; font-weight: 600; letter-spacing: 3px; margin-bottom: 30px; line-height: 30px}
.inner.career h2{ font-size: 25px; font-weight: 300; letter-spacing: 3px; margin-bottom: 30px; line-height: 35px; padding-right: 80px}

.career-form .textbox{ height: 55px; border-radius:2px; border-color: #ddd; font-size: 13px; padding: 15px 25px}
.career-form .textarea{ height: 350px; border-radius:2px; border-color: #ddd; font-size: 13px; padding: 15px 25px}
.career-form .button{ background: #0F2239; color: #fff; border: 0; font-size: 11px;  text-transform: uppercase; padding: 15px 35px}

.inner.career ul.career-category{ padding: 0; border-bottom: 2px solid #D0D0D0; height: 32px;}
.inner.career ul.career-category li{ display: inline-block; margin: 0 55px 0 0;}
.inner.career ul.career-category li a{ padding: 10px 15px; color: #555}
.inner.career ul.career-category li a.active{ border-bottom: 2px solid #012754}


.inner.career .job-list{ border: 1px solid #ddd; border-right: 0; border-left: 0; display: block; float: left; width: 100%; margin: 20px 0}
.inner.career .job-list a{ display: block; height: 100%; background: url("../images/Group 220.png") no-repeat; background-position: right 40px; transition: .5s}
.inner.career .job-list:hover a{ background: url("../images/Group 221.png") no-repeat; background-position: right 40px;}
.inner.career .job-list .job-list-thumb{ width: 120px; height: 120px; background: #6E6E6E; float: left; text-align: center; line-height: 120px; margin-right: 30px; transition: .5s}
.inner.career .job-list:hover .job-list-thumb{ background: #012754;}
.inner.career .job-list h5{ padding: 13px 0; font-size: 17px}
.inner.career span{ border:1px solid #707070; border-radius:30px; min-width: 100px!important; display: inline-block; text-align: center; padding: 5px 8px; margin: 0 5px 5px 0; font-size: 12px;}


.inner.business{ padding: 100px 0; background: url("../images/bg2.png") no-repeat -130px 500px}
.inner.business h4{ text-transform: uppercase; color: #012754; font-size: 21px; font-weight: 500; letter-spacing: 3px; margin-bottom: 30px}
.inner.business h3{ font-size: 21px; font-weight: 600; letter-spacing: 3px; margin-bottom: 30px; line-height: 30px}
.inner.business h2{ font-size: 25px; font-weight: 300; letter-spacing: 3px; margin-bottom: 30px; line-height: 33px; padding-right: 20px}


.inner ul.left-menu{ padding: 0; text-transform: uppercase; margin-bottom: 60px;}
.inner ul.left-menu li{ padding: 15px 0}
.inner ul.left-menu li a{ color: #6E6E6E}
.inner ul.left-menu li a:hover{ color: #012754}
.inner ul.left-menu li a.active{ color: #012754; font-weight: 600}


.inner.sectors{ padding: 100px 0; background-image: url("../images/bg2.png"),url("../images/bg2.png"); background-position: right 1570px, -300px 550px; background-repeat: no-repeat, no-repeat;}
.inner.sectors h4{ text-transform: uppercase; color: #012754; font-size: 19px; font-weight: 500; letter-spacing: 2px; margin-bottom: 20px}
.inner.sectors h3{ font-size: 21px; font-weight: 600; letter-spacing: 3px; margin-bottom: 30px; line-height: 30px}
.inner.sectors h2{ font-size: 24px; font-weight: 300; letter-spacing: 3px; margin-bottom: 30px; line-height: 30px; padding-right: 20px}


.inner.about{ padding: 100px 0; background: url("../images/bg2.png") no-repeat; background-position: 1400px 300px}
.inner.about h4{ text-transform: uppercase; color: #012754; font-size: 21px; font-weight: 500; letter-spacing: 3px; margin-bottom: 30px}
.inner.about h3{ font-size: 25px; font-weight: 500; letter-spacing: 2px; margin-bottom: 30px; line-height: 40px; color: #012754;}
.inner.about h2{ font-size: 25px; font-weight: 300; letter-spacing: 3px; margin-bottom: 30px; line-height: 38px; padding-right: 20px}


.inner .about-growth{ background: url("../images/30.png") no-repeat 110px 100px; padding: 200px 0 150px 36%;}

.inner.about-section{ height: 820px; background: url("../images/about-section.png") center no-repeat; background-size: cover }


.inner.about-mv{ padding: 100px 0; background: url("../images/bg.jpg") no-repeat -180px 400px;}
.inner.about-mv h6{ font-size: 16px; font-weight: 500; letter-spacing: 3px; margin-bottom: 20px; line-height: 30px; padding-right: 20px; color: #222}
.inner.about-mv h3{ font-size: 25px; font-weight: 400; letter-spacing: 3px; margin-bottom: 20px; line-height: 40px; padding-right: 20px; color: #012754}
.inner.about-mv h2{ font-size: 32px; font-weight: 400; letter-spacing: 3px; margin-bottom: 20px; line-height: 45px; padding-right: 20px}
.inner.about-mv h2 span{ color: #012754}


.inner.about-pm{ padding: 100px 0; background: url("../images/bg2.png") no-repeat; background-position: 1300px -195px}
.inner.about-pm h6{ font-size: 16px; font-weight: 500; letter-spacing: 1px; margin-bottom: 20px; line-height: 30px; padding-right: 20px; color: #222}

.inner.about-mt{ padding: 100px 0; background: url("../images/bg2.png") no-repeat; background-position: -290px 320px}
.inner.about-mt h5{ font-size: 16px; font-weight: 500; letter-spacing: 2px; line-height: 30px; padding-right: 20px; color: #222}
.inner.about-mt h6{ font-size: 15px; font-weight: 500; letter-spacing: 2px; margin-bottom: 20px; line-height: 20px; padding-right: 20px; color: #222}
.inner.about-mt .team-list{ border: 1px solid #D1D1D1; background: #fff; margin-bottom: 50px; border-right: 0; transition: 0.2s}

.inner.about-mt a:hover .team-list{ background: #f9f9f9}

.newsletter{ background: url("../images/bg3.png") no-repeat center top; /*box-shadow:inset 0px -15px 30px -10px #eee;*/; padding: 60px 0 100px 0;}
.newsletter h4{ color: #012754; padding: 20px 0 0 0; font-size: 22px}
.newsletter h6{ padding: 0 0 35px 0; }
.newsletter input{ width: 350px; padding: 12px 5px 14px 15px; margin: 0; font-size: 12px; border-radius: 8px 0 0 8px; border:1px solid #fff; background: #fff; box-shadow: 0px 5px 40px 1px #bdd0e6;}
.newsletter button{ background: #0F2239; color: #fff; border: 0; font-size: 11px; letter-spacing: 2px; text-transform: uppercase; padding: 15px 25px}


a.gal-thumb{ cursor: pointer; background: #000; display: block; overflow: hidden; border: 3px solid #ddd}
a.gal-thumb img { transition:0.1s}
a.gal-thumb:hover img { opacity: 0.7; transform: scale(1.02,1.02);}

a.csr-thumb img{ transition:0.2s; border: 4px solid #fff;}
a.csr-thumb:hover img{ transition:0.2s; border: 4px solid #eee; opacity: 0.7}

.inner.media-ne{ padding: 100px 0; background: url("../images/bg.jpg") no-repeat -180px 400px;}
.inner.media-ne h4{ text-transform: uppercase; color: #012754; font-size: 21px; font-weight: 500; letter-spacing: 3px; margin-bottom: 30px}
.inner.media-ne h3{ font-size: 21px; font-weight: 600; letter-spacing: 3px; margin-bottom: 30px; line-height: 30px}
.inner.media-ne h2{ font-size: 30px; font-weight: 300; letter-spacing: 3px; margin-bottom: 30px; line-height: 40px; padding-right: 80px}
.inner.media-ne h5{ font-size: 20px; color:#111; line-height: 30px; padding-right: 30px}


.inner.media-csr h4{ text-transform: uppercase; color: #012754; font-size: 21px; font-weight: 500; letter-spacing: 3px; margin-bottom: 30px}
.inner.media-csr a{  display: block}
.inner.media-csr h5{ text-transform: uppercase; color: #012754; font-size: 15px; font-weight: 500; letter-spacing: 1px; margin:10px 0 30px 0; line-height: 25px}


.inner ul.news-events{ padding: 0; height: 32px;; margin-bottom: 70px}
.inner ul.news-events li{ display: inline-block; width: 50%; margin-right: -2px}
.inner ul.news-events li a{ padding: 10px 15px; font-size: 20px; color: #555; text-align: center; display: block; border-bottom: 2px solid #D0D0D0 }
.inner ul.news-events li a.active{ border-bottom: 3px solid #012754}
.inner ul.news-events li a:hover{ border-bottom: 3px solid #012754}


ul.content-list li{padding-bottom: 10px}

.modal-dialog {	max-width: 850px; margin-top: 13%;}



/*promotion*/
.promotion { padding: 0 0 50px 0}
.promotion h4 { text-transform: uppercase; font-weight: 500; color: #012754; text-align: center}
.space{ padding: 5px}
.promotion .prom1{ height: 700px; background: url("../images/promotions/prom1.jpg") no-repeat center; background-size: cover}
.promotion .prom2{ height: 345px; background: url("../images/promotions/prom2.jpg") no-repeat center; background-size: cover}
.promotion .prom3{ height: 345px; background: url("../images/promotions/prom3.jpg") no-repeat center; background-size: cover}
.promotion .prom4{ height: 700px; background: url("../images/promotions/prom4.jpg") no-repeat center; background-size: cover}

.promotion .prom{ text-transform: uppercase; position: relative; cursor: pointer; transition: ease 0.2s}
.promotion .prom:hover{ transform: scale(.99);}
.promotion .prom h3{ color: #fff; font-size: 16px; padding: 10px;}
.promotion .prom h3 span{ font-size: 30px; display: block; font-weight: 600;}
.promotion .prom h5{ position: absolute; bottom: 30px; left: 0; color: #000; font-size: 25px; font-weight: 700; padding: 5px 10px; background: #fff}
.promotion .prom .company{ position: absolute; top: 10px; right: 10px}


.figure { overflow: hidden; position: relative;/* background-color: blue; transition: background-color .5s;*/}
.figure .additional {position: absolute; top: 0; left: 0; bottom: 0; text-align: center; width: 100%; opacity: 0; padding: 40% 0 0 0; transform: scale(1.3); transition: all .5s; z-index: 1; background: rgba(7,27,54,.8);}
.figure .additional a{ background: #fff; font-size: 15px; font-weight: 600; border-radius: 2px; padding: 8px 12px; color: #000; margin: 20px 0}
.figure .additional a.mail{ font-size: 13px}
.figure .additional a img{ margin-right: 7px}
.figure:hover .additional { opacity: 1; transform: scale(1);}

.figure .additional .social { margin-top: 20px}
.figure .additional .social a{ background: none}
.figure .additional .social a img{ margin-right: 0}

#myBtnup { display: none; position: fixed; bottom: 20px; right: 30px; z-index: 99; border: 1px solid #ddd; border-radius: 50%; outline: none; background: #f7f7f7; cursor: pointer; padding: 10px; }

/* The Modal (background) */
.modal { display: none; position: fixed; padding-top: 5%; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgb(0,0,0); background-color: rgba(0,0,0,0.6);}

/* Modal Content */
.modal-content.pop { position: relative; margin: auto; padding: 5px; max-width: 400px; width: 100%; height: auto; box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19); -webkit-animation-name: animatetop; -webkit-animation-duration: 0.4s; animation-name: animatetop; animation-duration: 0.5s; border-radius: 0}

/* Add Animation */
@-webkit-keyframes animatetop { from {top:-300px; opacity:0} to {top:0; opacity:1}}
@keyframes animatetop { from {top:-300px; opacity:0} to {top:0; opacity:1}}

/* The Close Button */
.close { position: absolute; padding: 10px!important; right: 20px; top: 15px}
.close:hover,.close:focus { color: #000; text-decoration: none; cursor: pointer;}
.modal-header { padding:20px 10px; color: #152b54; border:1px solid #333; border-radius: 0}
.modal-header .container{width: 100%; max-width: 100%; padding: 0; margin: 0;}
.modal-header h4{ font-weight: 600;}
.modal-header h5{ font-size: 15px; font-weight: 600; text-transform: uppercase; margin: 0}
.modal-header span{ width: 80px; display: inline-block; border: 1px solid #d7b262; margin: 0; padding: 0}
.modal-header h6{ font-size: 13px; font-weight: 600; text-transform: uppercase; margin: 10px 0}
.modal-header a{ display: inline-block; margin-bottom: 5px; background: #f7f7f7; border: 1px solid #ccc; font-size: 13px; color: #152b54; font-weight: 600; padding:7px; transition: ease 0.2s}
.modal-header a:hover{ border: 1px solid #273F6E;}
.modal-body {padding: 2px 16px;}
.modal-footer { padding: 2px 16px; color: #152b54;}

/*promotion*/



@media screen and (max-width: 1500px){
	
	footer{ background:#FAFAFA url("../images/Group 104.png") no-repeat 200px 80px;}
	.inner.sectors h2{ font-size:20px}
	.inner.sectors h2 br{ display: none}
	.inner .about-growth{ background-size: 300px; padding: 100px 0 0 350px; }
	.inner.about h3{ font-size: 22px; line-height: 30px }
	.inner.about h3 br{ display: none}
	.inner.about-mv h2{ font-size: 28px;}
	.inner.about-mv h2 br{ display: none}
	
	.promotion .prom1,.promotion .prom4 { height: 600px;}
	.promotion .prom2,.promotion .prom3 { height: 295px}
	.promotion .prom h3 span { font-size: 26px;}
	
}

@media screen and (max-width: 1400px){
	.main-menu ul li{ margin: 0 14px}	
	.inner.business h2{ font-size: 20px;}
	.inner.about-mv h2{ font-size: 25px; line-height: 33px}
	.inner.about-mv h3{ font-size: 20px; line-height: 33px}
	.overlay.open {  height: 590px;}
	
	.promotion .prom1,.promotion .prom4 { height: 500px;}
	.promotion .prom2,.promotion .prom3 { height: 245px}
	.promotion .prom h3 span { font-size: 23px;}
}

@media screen and (max-width: 1300px){
	
	.business-slide .card-header{ font-size: 13px; }
	.contact-form h2{ font-size:35px; }
}
	

@media screen and (max-width: 1200px){
	
	.m-info a{ margin: 0 0 0 18px!important}
	.news-list h5{ font-size: 16px; line-height: 25px }
	footer{ background:#FAFAFA url("../images/Group 104.png") no-repeat 100px 80px;}
	.f-base a{ margin: 0 8px}
	.inner.about h2{ font-size: 20px; line-height: 30px }
	.inner.about-mv h2{ font-size: 20px; line-height: 30px }
	.business-sub a{ padding: 15px 3%;}
}

@media screen and (max-width: 1150px){
	.main-menu{ display: none;}
}

@media screen and (max-width: 1024px){
	.button_container{ right: 30px}
	
	.overlay.open{ height: 625px;}
	.m-info span{ display: block; width: 100%; padding-top: 15px;}
	.m-info samp{ margin: 0 15px 0 0}
	.inner.career ul.career-category li{ margin-right: 30px}
	.inner.career .career-left{ display: none}
	.inner.business .business-left{ display: none}
	.inner.about .about-left{ display: none}
	.inner .about-growth{ background: none; padding: 100px 100px 0 100px; }
	.inner.about h3.pl-5{ padding-left: 0!important}
	.inner.about-mv .about-left{ display: none}
	.inner.about-pm .about-left{ display: none}
	.inner.about-mt .about-left{ display: none}
	.inner.about-section{ height: 300px}
	.inner.business .about-left{ display: none}
	
	.inner.about-mt .team-list{border-left: 0;}
}

@media screen and (max-width: 991px){
	
	nav ul li{ font-size:13px}
	.business-slide .card-header{ padding: 15px 5px}
	footer{ background:#FAFAFA url("../images/Group 104.png") no-repeat 100% 80px;}
	footer h4{ font-size:22px; }
	.inner.media-ne .ne-left{ display: none}
	.inner.sectors h2{ padding-right: 0; font-size: 18px;}
	.inner .about-growth{ padding: 100px 20px 0 20px; }
	.copy{ text-align: left!important; padding-top: 10px}
}

@media screen and (max-width: 768px){
	
	.overlay.open{ height: 550px;}
	nav { top:49%}

	nav ul{ margin-top: 15px; height: auto;}
	nav ul li{ padding: 7px 0 7px 20px}
	
	.m-info{ display: none}
	
	footer{ background:#FAFAFA url("../images/Group 104.png") no-repeat 100% 101%;}
	footer h6{ margin:15px 0 10px 0; font-weight: 600}
	.contact-detail{ text-align: center}
	.contact-detail ul{ padding-left: 0;}
	.business-slide{ display: none}
	.contact-form h2{ font-size:30px; }
	.inner.about h2{ font-size: 18px; line-height: 25px }
	.inner.about h3{ font-size: 18px; line-height: 27px; }
	.inner.career .job-list{ margin: 10px 0}
	.inner.career .job-list .job-list-thumb{ width: 65px; height: 100px; line-height: 95px; margin-right: 15px;}
	.inner.career .job-list h5{ font-size: 16px; padding: 13px 0 5px 0}
	.inner.career .job-list .job-list-thumb img{ width: 30px}
	.inner.career span{ min-width:70px!important; margin: 0 3px 5px 0; padding: 2px 5px}
	.inner.career ul.career-category li{ margin-right: 10px}
	.tc,.f-social,.copy{ display: block!important; width: 100%!important; max-width: 100%!important; text-align:center!important; padding-top: 20px}
	
	.promotion .prom1,.promotion .prom4, .promotion .prom2,.promotion .prom3 { height: 300px;}
	.promotion .prom h3 span { font-size: 23px;}
}


@media screen and (max-width: 700px){
	.contact-form h2{ font-size:26px; }
	.inner.career h2{ padding-right: 0; font-size: 22px;}
}


@media screen and (max-width: 576px){
	.co-mob{ width: 50%; padding: 0 10px}
/*	nav { top:52%}*/
	nav ul{ margin: 5px 0 25px 0;}
	.inner.about h2{ font-size: 16px; line-height: 24px; letter-spacing: 1px }
	.inner.about-mv h2 { line-height: 26px; letter-spacing: 1px}
	footer{ background-size: 200px}
	
	.inner.about-mt .team-list{border-top: 0;}
}

@media screen and (max-width: 480px){
	footer{ background-size: 130px}
}


.stepwizard-step p {
    margin-top: 0px;
    color:#666;
}
.stepwizard-row {
    display: table-row;
}
.stepwizard {
    display: table;
    width: 100%;
    position: relative;
}
.stepwizard-step button[disabled] {
    /*opacity: 1 !important;
    filter: alpha(opacity=100) !important;*/
}
.stepwizard .btn.disabled, .stepwizard .btn[disabled], .stepwizard fieldset[disabled] .btn {
    opacity:1 !important;
    color:#bbb;
}
.stepwizard-row:before {
    top: 14px;
    bottom: 0;
    position: absolute;
    content:" ";
    width: 100%;
    height: 1px;
    background-color: #ccc;
    z-index: 0;
}
.stepwizard-step {
    display: table-cell;
    text-align: center;
    position: relative;
}
.btn-circle {
    width: 30px;
    height: 30px;
    text-align: center;
    padding: 6px 0;
    font-size: 12px;
    line-height: 1.428571429;
    border-radius: 15px;
}