@charset "utf-8";
/* CSS Document */
/* A Website By: Afghan Graphics
/* Author Website: www.afghangraphics.com
/* Designer: Abdul Motaal Mosleh
/* Client Name: Nawi Azim Rasooly CO .Ltd 
/* Client Website: nartc.af
/* Role: Identity, Branding, Consulting, Website, Hosting
/* Date of Creation: 10.November.2018 */

body, html{background:#fff;margin:0px;padding:0px;font-family: 'Roboto', sans-serif;}
h1,h2,h3,h4,h5,h6{margin:0px;padding:0px;font-weight:normal;font-family: 'Roboto', sans-serif; font-weight:100;}
p{margin:0px 0px 30px;padding:0px;line-height:33px;font-size:17px; font-weight:100; color:#393939;}
p:last-child{
	margin-bottom:0px;
}
a{}
a:hover{text-decoration:none!important;}
*{box-sizing:border-box;-webkit-box-sizing:border-box;-o-box-sizing:border-box;}

h4{
	font-size:36px; color:#1c3b4d; font-weight:300; text-align:center; margin-bottom:40px;
}
.blue-bg-section{
	background:#1c3b4d;
}

.blue-bg-section p a { color:#ccc; text-decoration:none;
}
.main-container{
	max-width:1170px; margin:0px auto;
}
.main-container.main-container-in{
	max-width:864px;
}

.main-container.main-container-in .justified-text p {
	max-width:864px; text-align: justify;
}

.main-container.val-container{
	max-width:868px;
}


.home_top_banner {
	width: 100%;
	float: left;
	position: relative;
}

.home_top_banner_img {
	width: 100%;
	float: left;
}
.home_top_banner_img img {
	width: 100%;
	float: left;
	height: auto;
}
.home_top_banner .bx-default-pager {
	width: 100%;
	float: left;
	position: absolute;
	bottom: 40px;
	left: 0px;
	text-align: center;
	z-index: 60;
}
.home_top_banner .bx-default-pager .bx-pager-item {
	display: inline-block;
	float: none;
	margin: 0px 3px;
}
.home_top_banner .bx-default-pager .bx-pager-item a {
	width: 13px;
	height: 13px;
	background: url(../images/circle.png) no-repeat;
	text-decoration: none;
	float: left;
	text-indent: -9999px;
}
.home_top_banner .bx-default-pager .bx-pager-item a:hover {
	background: url(../images/active_circle.png) no-repeat;
}
.home_top_banner .bx-default-pager .bx-pager-item a.active {
	background: url(../images/active_circle.png) no-repeat;
}



/*======header======*/

.home-banner{
	width:100%; float:left; position:relative;
}
.home-banner img{
	width:100%; float:left; height:auto;
}
header{
	width:100%; float:left; margin:50px 0px;
}
header.home_hdr{
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 99;
}
.logo{
	width:auto; float:left; position:relative; width:240px; height:67px;

}

.logo img{
	float:left; position:relative; width:240px; height:67px;

}
nav{
	float:right; margin:30px 0px 0px;
}
nav ul{
	margin:0px; padding:0px;
}
nav ul li{
	list-style:none; float:left; font-size:18.5px; font-weight:600; font-family: 'Rajdhani', sans-serif; position:relative; letter-spacing:0.6px;
}
nav ul li:hover > .subnav{display:block}
nav ul li a{
	color:#1c3b4d; text-decoration:none; display:block; padding:22px 10px 35px;
}
nav ul li a.active_nav{
	background: url(../images/subnav_down_arrow.png) no-repeat center 56px;
}
nav ul li a:hover{
	color:#000;
}
nav ul li .subnav{
	    background: #1c3b4d;
    width: 340px;
    position: absolute;
    left: -100px;
    top: 100%;
    display: none;
	z-index:1;
}
nav ul li .subnav li{
	font-size:15px; font-weight:600; font-family: 'Roboto', sans-serif; width:50%; text-align:center; background:url(../images/subnav_divider.jpg) no-repeat right center;
}
nav ul li .subnav li:hover > .subdropdown{display:block}
.sec_sub_menu{    left: -100%;}
nav ul li .subnav li:last-child{
	background:none;
}
nav ul li .subnav li a{
	padding:30px 30px 34px 30px; display:block; color:#fff;
}
nav ul li .subnav li a.active_subnav{
	background:url(../images/subnav_down_white_arrow.png) no-repeat center 75px
}

nav ul li .subdropdown{
	    background: #1c3b4d;
    width: 340px;
    position: absolute;
    padding: 30px 40px;
    border-top: 1px solid #fff;
	display:none;

}
nav ul li .subdropdown li{
	font-size:14.4px; font-weight:300; background:none; width:100%; text-align:left; letter-spacing:0px; padding-bottom: 5px;
}
nav ul li .subdropdown li a{
	padding:2px; display:block; color:#e0e0e0;
}
.banner_col{width:100%; float:left; position:relative;}
.banner-btm-desc{
	width:100%; float:left; text-align:center; position:absolute; left:0px; bottom:60px;
}
.banner-btm-desc h2{
	font-size:48px; color:#fff; font-weight:800;
}
.banner-btm-desc p{
	font-size:36px; color:#fff; font-weight:300; line-height:40px;
}
.banner-btm-desc a.learn-more{
	font-size:27px; color:#fff; font-family: 'Rajdhani', sans-serif; background:url(../images/learn_down_arrow.png) no-repeat center bottom; padding-bottom:20px;
	text-decoration:none;
}
.banner-btm-desc a.learn-more:hover{
	color:#ccc;
}

.banner-team-desc{
	width:60%; float:left; text-align:center; position:absolute; left:20%; right: 20%; top: 60%; bottom:60px;
}
.banner-team-desc h2{
	font-size:42px; color:#fff; font-family: 'Rajdhani', sans-serif; font-weight:800;
}
.banner-team-desc p{
 font-size:27px; color:#fff; font-family: 'Rajdhani', sans-serif; font-weight:300; line-height:40px;
}
.banner-team-desc a.learn-more{
	font-size:27px; color:#fff; font-family: 'Rajdhani', sans-serif; background:url(../images/learn_down_arrow.png) no-repeat center bottom; padding-bottom:20px;
	text-decoration:none;
}
.banner-team-desc a.learn-more:hover{
	color:#ccc;
}

/*======header end======*/

/*======home page start======*/

/*======bornout-section======*/

.born-out-section{
	width:100%; float:left; padding:73px 0px;
}
.born-out-section p{
	font-size:21px; text-align:center; line-height:25px;
}

/*======bornout-section end======*/

/*======nartc-section======*/

.nartc-section{
	width:100%; float:left; background:#e2e4ea; padding:78px 0px;
}
.nartc-section .nartc-img{
	width:55.7%; float:right;
}
.nartc-section .nartc-img img{
	width:100%; float:left; height:auto;
}
.nartc-section h3{
	font-size:29.4px; color:#1c3b4d; width:30%; float:left; margin:110px 0px 0px;
}

/*======nartc-section end======*/


/*======ourvalue-section======*/

.ourvalues-section{
	width:100%; float:left; background: url(../images/gxr_bg.jpg) no-repeat center top; background-size:cover;
}
.ourvalues-section h2{
	font-size:94px; color:#fff; font-weight:100; width:30%; float:left; line-height:86px; margin:30% 0px 0px;
}
.ourvalues-section .right-desc{
	width:45%; float:right; background:rgba(28,59,77,.5); padding:52px 76px;
}
.ourvalues-section .right-desc ul{
	margin:0px; padding:0px; width:100%; float:left;
}
.ourvalues-section .right-desc ul li{
	list-style:none; float:left; width:100%; margin:19px 0px;
}
.ourvalues-section .right-desc ul li h3{
	font-size:23px; color:#fff; line-height:26px; margin-bottom:20px; font-weight:300;
}
.ourvalues-section .right-desc ul li h3 span{
	font-size:64px; font-weight:100; margin:15px 10px 0px 0px; float:left;
}
.ourvalues-section .right-desc ul li p{
	font-size:15px; color:#999; line-height:18px;
}

/*======ourvalue-section end======*/

/*======client-section======*/

.client-section{
	width:100%; float:left;
}
.client-section h3{
	font-size:39px;  color:#1c3b4d; margin-bottom:20px;
}
.logo-section{
	width:50%; float: left; padding:90px 0px; padding-left: 0px;
}
.logo-section ul{
	margin:0px; padding:0px; padding-top: 30px;
}
.logo-section ul li{
	list-style:none; float:left; width:33%; margin:20px 0px;
}
.logo-section ul li img{
position:relative;
top:-20px;
width:auto;
height:77px;
}
.client-gettouch{
	width:45%; float:right; padding:115px 130px;
}
.ftr-logo{
	width:100%; float:left; margin-bottom:60px;
}

.ftr-logo img{
	position:relative;
top:-20px;
width:240;
height:67px;
}
.client-gettouch h6{
	font-size:18px; color:#fff; font-weight:300; margin-bottom:10px;
}
.client-gettouch p{
	color:#ccc; font-size:13px; font-weight:100; line-height:20px;
}
.client-gettouch p a{ color:#ccc; text-decoration:none;}
.client-gettouch p a:hover{text-decoration:underline;}
.gettouch-social{
	width:100%; float:left;
}
.gettouch-social a{
	width:30px; height:30px; float:left; border:2px solid #9eabb3; margin-right:6px; text-align:center; line-height:30px;
}
.gettouch-social a i{
	font-size:18px; color:#fff;
}
.gettouch-social a:hover{
	border:2px solid #fff;
}

/*======client-section end======*/

/*======home page end======*/



/*=======Vehicle Detail start=======*/


.vehicle-detail{
	width:100%; float:left; padding:100px 0px; border-top:1px solid #fff;
}
.vehicle-detail h6{
	font-size:20px; color:#fff; font-weight:400; margin-bottom:50px;
}
.vehicle-detail ul{
	margin:0px 95px 0px 0px; padding:0px; width:28%; float:left;
}
.vehicle-detail ul li{
	list-style:none; float:left; width:100%; font-size:13px; color:#fff; margin:2px 0px; 
}
.vehicle-detail ul li .detail-left{
	width:50%; float:left;
}
.vehicle-detail ul li .detail-rght{
	width:50%; float:right; font-weight:300; color:#dbdfe2;
}
a.order-vehicle{
	font-size:17px; color:#fff; background:url(../images/order-arrow.png) no-repeat 18px 25px; border:1px solid #b6c0c6; border-radius:2px; padding:24px 13px 24px 40px; display:block; float:right; text-decoration:none;
	margin:25px 0px 0px;
}
a.order-vehicle:hover{
	background:url(../images/order-arrow.png) no-repeat 18px 25px #002a42;
}

/*=======Vehicle Detail end=======*/

/*=======About Page start=======*/


.blue-section{
	width:100%; float:left; background:url(../images/vision-bg.jpg) no-repeat center top; text-align:center; padding:80px 0px 169px; margin:130px 0px 0px; position:relative;
}
.vision-img{
	position:absolute; right:-20px; bottom:-45px; width:55.2%;
}
.vision-img img{
	width:100%; float:left; height:auto;
}
.blue-section h3{
	font-size:42px; color:#fff; font-family: 'Rajdhani', sans-serif; font-weight:600; margin-bottom:10px;
}
.blue-section p{
	font-size:26px; color:#fff; font-weight:300; font-family: 'Rajdhani', sans-serif; line-height:30px; text-align: none;
}

/*=======About Page end=======*/

/*=======ourvalue Page start=======*/

.blue-section.value-section{
	padding:0px 100px 85px; margin-bottom:53px; min-height:425px;     background-size: cover !important;
}
.blue-section.value-section.quality-bg{
	background:url(../images/our-values-1-nartc.jpg) no-repeat center top;
}
.blue-section.value-section.customersatis-bg{
	background:url(../images/our-values-3-nartc.jpg) no-repeat center top;
}
.blue-section.value-section.createemployee-bg{
	background:url(../images/our-values-2-nartc.jpg) no-repeat center top; margin-bottom:0px;
}
.values-icons{
	width:195px; height:195px; display:inline-block; margin:-99px 0px 30px;
}

.values-icons img{width:100%; height:auto}
/*=======ourvalue Page end=======*/

/*=======Service Page start=======*/

.service-type{
	width:100%; float:left; margin:50px 0px 0px;
}
.service-type ul{
	margin:0px; padding:0px 0px 120px; width:50%; float:left; text-align:center; background:url(../images/service-type-divider.jpg) no-repeat right center;
}
.service-type ul li{
	list-style:none; float:left; width:100%; font-size:14px; text-align:left; margin:3px 0px; padding:0px 0px 0px 100px;
}
.service-type ul li a{
	color:#393939; text-decoration:none;
}
.service-type ul:last-child{
	background:none;
}
.client-gettouch.ourvalue-footer{
	width:100%; float:left; text-align:center;
}
.value-footer-in{
	display:inline-block; width:243px;
}
.value-footer-in h6{
	text-align:left;
}
.value-footer-in p{
	text-align:left;
}

/*=======Service Page end=======*/

/*=======Logistics Page Starts=====*/
.equipments-type{
	width:100%; float:left; margin:50px 0px 0px;
}
.equipments-type ul{
	margin:0px; padding:0px 0px 10px; width:50%; float:left; text-align:center; background:url(../images/service-type-divider.jpg) no-repeat right center;
}
.equipments-type ul li{
	list-style:none; float:left; width:100%; font-size:14px; text-align:center; margin:3px 0px; padding:0px 0px 0px 0px;
}
.equipments-type ul li a{
	color:#393939; text-decoration:none;
}
.equipments-type ul:last-child{
	background:none;
}
/*========Logistic Page Ends*/

/*=======Ourreach Page start=======*/

.reach-map-cl{
	width:100%; float:left; position:relative; margin:100px 0px;
}
.reach-map-cl img{
	width:100%; height:auto; float:left;
}
.reach-map-cl ul{
	position:absolute; right:0px; bottom:0px; margin:0px; padding:0px; width:25%;
} 
.reach-map-cl ul li{
	list-style:none; float:left; font-size:18px; color:#1c3b4d; font-weight:300; width:100%;
}

/*=======Ourreach Page end=======*/

/*=======client Page start=======*/

.client-logo-div {
	width:100%; float:left; text-align:center;
}
.logo-section.client-logo{
	width:80%; display:inline-block; float:none;
}
.logo-section.client-logo li{
	text-align:left;
}

.logo-section.client-logo img{
position:relative;
top:-20px;
width:auto;
height:77px;
}
/*=======client Page end=======*/


.contact-left{
	width:30%; float:left;
}
.contact-left ul{
	margin:0px; padding:0px; width:100%; float:left;
}
.contact-left ul li{
	list-style:none; float:left; width:100%; margin-bottom:50px;
}
.contact-left h6{
	font-size: 16px;
    color: #fff;
    font-weight: 400;
    margin-bottom: 5px;
}
.contact-left p{
	color: #ccc;
    font-size: 15px;
    font-weight: 100;
    line-height: 20px;
}


.contact-right{
	width:70%; float:right;
}
.contact-form-field{
	width:100%; float:left; margin-bottom:10px;
}
.contact-form-field.cnt-field1{
	width:48%;
}
.contact-form-field.cnt-field1.cnt-marrght{
	float:right;
}
.contact-form-field label{
	    font-size: 20px;
    color: #fff;
    font-weight: 300;
    font-family: 'Rajdhani', sans-serif;
    margin-bottom: 9px;
    float: left;
}
.contact-form-field .contact-form-input, .contact-form-field .contact-form-message{
	font-family:  'Rajdhani', sans-serif; font-size: 18px;  width:100%; float:left; color:#ccc; border:1px solid #687d89; padding:16px; outline:none; background:none; border-radius:3px;
}
.contact-form-field .contact-form-message{height:120px;}
.contact-send-btn{
    font-family: 'Rajdhani', sans-serif;
	float: right;
    font-size: 20px;
    color: #fff;
    font-weight: 300;
    border: 0px;
	cursor:pointer;
	outline:none;
    background: none;
}

.second-footer{
	width:100%; float:left; text-align:center; padding:21px 0px; padding-top: 30px;
}
.second-footer .ftr-logo1{
	display:inline-block; margin-bottom:20px;
}
.second-footer .ftr-logo1 img{
	position:relative; width:65px; height:60px;
}
.second-footer p{
	color: #ccc;
    font-size: 13px;
    font-weight: 100;
    line-height: 20px;
}
.mobile_menu_icon {
    width: 40px;
    height: 40px;
    position: absolute;
    right: 16px;
    background: url(../images/mobile_bar_icon.png) no-repeat center center #ccc;
    top: 23px;
	text-indent:-9999px;
	display:none;
}

@media only screen and (min-width:960px) and (max-width:1169px) {
	.main-container {

    padding: 0 15px;
}
.main-container.val-container {
    max-width: 948px;
}
}
@media only screen and (min-width:761px) and (max-width:959px) {
	.logo {
    width: 200px;

}
.vehicle-detail ul {
    margin: 0px 20px 0px 0px;

    width: 46%;
 
}
.main-container.val-container {
    max-width: 948px;
}
header.home_hdr {
 margin: 15px 0;
    padding: 0 15px;
}
	nav {
    float: right;
    margin: 0px 0px 0px;
}
nav ul li {

    font-size: 15.5px;
}
nav ul li a {
  
    padding: 22px 6px 35px;
}
.main-container {

    padding: 0 15px;
}
.nartc-section h3 {
  
    margin: 10px 0px 0px;
}
.ourvalues-section .right-desc {
  
    padding: 52px 36px;
}
.client-gettouch {
    width: 45%;
    float: right;
    padding: 95px 40px;
}
.contact-left ul {

    width: 100% !important;
}
}
@media only screen and (min-width:267px) and (max-width:760px) {
.logo {
    width: 200px;

}
header {

    margin: 15px 0px;
}
.blue-section {
    padding: 40px 15px 39px;
    margin: 20px 0px 0px;
}
.vision-img {

    right: -1px;
}
.banner_dis_mob{position: absolute;
bottom: 30px;
width: 100%;}
header.home_hdr {
    position: static;
margin: 15px 0;
}
.mobile_menu_icon{display:block}
nav ul{display:none; background: #fff;
width: 100%;
position: absolute;
 z-index: 99;

left: 0;
box-shadow: 0 4px 2px rgba(0,0,0,.3);
top: 82px;}
nav ul li {
   
    font-size: 16px;
    width: 100%;
    border-top: 1px solid #ccc;
}
nav ul li a {
   
    padding: 12px 10px 12px;
}
nav ul li .subnav {   
width: 100%;
position: static;
display: block;
float: left;
}
nav ul li .subnav li{width:100%; text-align: left;}
nav ul li .subnav li a {
    padding: 15px;

}
nav ul li .subnav li a.active_subnav {
    background: url(../images/subnav_down_white_arrow.png) no-repeat 98% center;
}
nav ul li .subdropdown {
    background: #1c3b4d;
    width: 100%;
    position: static;
    padding: 0 30px;
	border-top: 0;
   
}
nav ul li a.active_nav {
    background: url(../images/subnav_down_arrow.png) no-repeat 98% center;
}
nav ul li .subdropdown li a {
    padding: 10px 0;

}
.banner-btm-desc:before{background:rgba(0,0,0,.2); content:''; width:100%; height:100%; left:0; top:0; position:absolute;}
.main-container {

    padding: 0 15px;
}
.banner-btm-desc {
height: 100%;
padding-top: 12px;
    bottom: 0;
}
.banner-btm-desc h2 {
    font-size: 28px;
 
    position: relative;
}
.banner-btm-desc p {
    font-size: 24px;

    line-height: 30px;
    position: relative;
}
.banner-btm-desc a.learn-more {
    font-size: 19px;
	position: relative;
}
.born-out-section {
  
    padding: 30px 0px;
}
.born-out-section p {
    font-size: 18px;
}
.main-container.main-container-in {
    padding: 0 15px;
}
.nartc-section {
    width: 100%;
 
    padding: 38px 15px;
    text-align: center;
}
.nartc-section .nartc-img {
    width: 100%;
}
.nartc-section h3 {
  font-size: 24px;
    width: 100%;
    margin: 40px 0px 0px;
}
.ourvalues-section h2 {
    font-size: 45px;
 
    width: 100%;

    margin: 15px 0 0 0;
}
.ourvalues-section .right-desc ul li p {

    color: #fff;
}
.logo-section {
    width: 100%;

    padding: 30px 0px;
}
.ourvalues-section .right-desc {
    width: 100%;
    padding: 22px 15px;
}
.client-gettouch {
    width: 100%;
    padding: 45px 15px;
}
.logo-section ul {

    text-align: center;
}
.logo-section ul li {

    float: none;
    width: 49%;
    margin: 20px 0px;

    display: inline-block;
}
.ftr-logo {

    margin-bottom: 30px;
}
.vehicle-detail {

    padding: 50px 0px;
}
.vehicle-detail h6 {
 
    margin-bottom: 20px;
}
.vehicle-detail ul {
    margin: 0;

    width: 100%;

}
a.order-vehicle {
  
    float: none;

    display: inline-block;
}
.main-container.val-container {

    text-align: center;
}
.vehicle-detail ul {

    text-align: left;
}
.values-icons {
    width: 115px;
    height: 115px;

    margin: -69px 0px 30px;
}
.blue-section.value-section {
   padding: 0px 10px 35px;
    margin-top: 70px;
}
.blue-section h3 {
    font-size: 32px;
}
.blue-section p {
    font-size: 20px;
}
.service-type {

    margin: 10px 0px 0px;
}
.service-type ul {

    width: 100%;
}
.service-type h4 {
    font-size: 30px;
}
    
    .equipments-type {

    margin: 10px 0px 0px;
}
.equipments-type ul {

    width: 100%;
}
.equipments-type h4 {
    font-size: 30px;
}
.reach-map-cl {

    margin: 0px 0px;
}
.reach-map-cl ul {
    position: static;
  
    width: 100%;
    margin-top: 30px;
    float: left;
}
.contact-left {
    width: 100%;
}
.contact-left ul li {

    margin-bottom: 20px;
}
.contact-right {
    width: 100%;
 
}
.contact-left ul {

    width: 100% !important;
}
}
/*=== Home Moto New ===*/

.moto_col{
	width:100%; float:left; border:1px solid #1c3b4d; padding:67px 51px 70px; position:relative; margin:70px 0px 0px;
	margin-bottom: 50px;
}

.moto_col p{
	font-size: 30px;
    font-family: 'Rajdhani';
    line-height: 35px;
    
}
.moto_col h3{
	    width: 47%;
    float: left;
    background: #fff;
    text-align: center;
    position: absolute;
    left: 25%;
    top: -30px;
    right: 25%;
}
/*=== Home Moto New  Ends ===*/



/*=== Vehicles Lease ===*/
.vehicles-lease-type{
	width:100%; float:left; margin:50px 0px 0px;
}
.vehicles-lease ul{
	margin:0px; padding:50px 0px 120px; width:100%; float:left; text-align:center; background:url(../images/service-type-divider.jpg) no-repeat right center;
}
.vehicles-lease ul li{
	list-style:none; float:left; width:100%; font-size:14px; text-align:center; margin:3px 0px; padding:0px 0px 0px 0px;
}
.vehicles-lease ul li a{
	color:#393939; text-decoration:none;
}
.vehicles-lease ul:last-child{
	background:none;
}

/*=== Vehicles Lease  Ends ===*/ 