body{
	margin:0;
	font-family: 'Raleway', sans-serif;
}
body a{
	transition: 0.5s all ease;
	-webkit-transition: 0.5s all ease;
	-moz-transition: 0.5s all ease;
	-o-transition: 0.5s all ease;
	-ms-transition: 0.5s all ease;
}
h1,h2,h3,h4,h5,h6{
	margin:0;			   
}
p{
	margin:0;
}
ul,label{
	margin:0;
	padding:0;
}
body a:hover{
	text-decoration:none;
}
/*--header-menu--*/
button#showRightPush {
	background: none;
	border: none;
	color: #ffffff;
	
}
button#showRightPush img {
	padding-left: 8px;
}

/*--header--*/
.logo {
  float: left;
}
.top-nav{
	float:right;
	margin-top: 15px;
}
.top-header{
margin-top:50px;
}
.right_bt span{
	width: 37px;
    height: 25px;
	display: block;
	margin-right: 20px;
	background: url(../images/menu.png) no-repeat 0px 0px;
}
.box{
	position:absolute;
	top:-1200px;
	width:100%;
	margin:auto;
	padding:0px;
	z-index:999999;
	text-align:center;
	left:0px;
 }
.box_content_center{
	background:rgba(0, 0, 0, 0.22);
}
a.boxclose{
	cursor: pointer;
	text-align: center;
	display: block;
	position: absolute;
	top: 19px;
	right: 290px;
 }
 #activator {
}
.menu_box_list{
	display: inline-block;
	padding:30px 0;
}
.menu_box_list ul li {
	display:inline-block;
	  margin: 0 10px;
}
.menu_box_list li a{
	color: #FFF;
	font-size: 16px;
	text-transform: uppercase;
	font-family: 'Lato', sans-serif;
	-webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
	font-weight: 600;
}
.menu_box_list li a:hover{
	color:#000000;
	text-decoration: none;
}
.menu_box_list li a > i > img{
	vertical-align:middle;
}
.boxclose span{
	width:58px;
	height:73px;
	display:inline-block;
	background: url(../images/into.png) no-repeat 0px 0px;
}
/*--/header--*/

/*--banner--*/
.banner{
	background: url(../images/HXafrica-bg.png) no-repeat 0px 0px;
	background-size: cover;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	text-align: center;
	min-height:750px;
}
.banner-info{
width:65%;
margin: 141px auto 0 auto;
padding-top: 70px;
}

.border {
  background: #000000;
  width: 70%;
  margin: 0 auto;
  padding: 1px;
}
/*--//banner--*/

/*--about--*/
.about{
padding:60px 0 25px 0;
background: #eeeeee;
}
.about h3{
margin:0;
color:#00563B;
font-size:36px;
font-weight:600;
letter-spacing: 5px;
}
.strip{
  margin: 28px 0 0px 0;
}

.about p{
margin:45px 0 0 0;
color:#000000;
font-size:16px;
font-family: 'Lato', sans-serif;
line-height:1.2em;
padding-left: 20px;
 padding-right: 20px;
}

.about ul li{
list-style-type:none;
display:inline;
}

.about ul li img{
	display: inline-block;
	height: 120px;
	width:150px;
	margin-bottom: 10px;
	margin-right:10px;
}
/*--//about--*/

/* Container for the gallery */
        .gallery {
            max-width: 1200px;
            margin: 0 auto;
            padding: 20px;
            display: flex;
            flex-wrap: wrap;
            gap: 20px;
            justify-content: center;
        }

        /* Individual image items */
        .gallery-item {
            flex: 1 0 22%; /* Desktop: 4 per row */
            max-width: 22%;
            box-sizing: border-box;
            position: relative; /* For overlay positioning */
        }

        /* Image styling */
        .gallery-item img {
            width: 100%;
            height: auto;
            display: block;
            object-fit: cover;
            border-radius: 5px;
        }

        /* Overlay styling */
        .gallery-item .overlay {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 128, 0, 0.9); /* Green with 70% opacity */
            color: white;
            display: flex;
            align-items: center;
            justify-content: center;
            opacity: 0;
            transition: opacity 0.3s ease;
            border-radius: 5px; /* Matches image border-radius */
        }

        /* Overlay link styling */
        .gallery-item .overlay a {
            color: white;
            text-decoration: none;
            font-size: 1em;
            padding: 10px 10px; /* Adds clickable area around text */
        }

        /* Show overlay on hover */
        .gallery-item:hover .overlay {
            opacity: 1;
        }

        /* Optional: Hover effect for the link text */
        .gallery-item .overlay a:hover {
            text-decoration: underline;
        }

        /* Mobile responsiveness */
        @media screen and (max-width: 932px) {
            .gallery-item {
                flex: 1 0 45%; /* 2 per row on mobile */
                max-width: 45%;
            }
        }



/* Container for the team section */
        .team-gallery {
            max-width: 100%;
            margin: 0 auto;
            margin-top: 50px;
            margin-bottom: 50px;
            padding: 0px;
            display: flex;
            flex-wrap: wrap;
            gap: 10px;
            justify-content: left;
        }

        /* Individual team member items */
        .team-member {
            flex: 1 0 30%; /* Desktop: 3 per row */
            max-width: 30%;
            box-sizing: border-box;
            text-align: center;
        }

        /* Image styling */
        .team-member img {
            width: 100%;
            height: auto;
            max-width: 200px; /* Limits image size */
            border-radius: 0; /* Square images */
            object-fit: cover;
            margin-bottom: 5px;
        }

        /* Name styling */
        .team-member .name {
            font-size: 1em;
            font-weight: bold;
            margin: 2px 0;
            color: #333;
        }

        /* Designation styling */
        .team-member .designation {
            font-size: 0.8em;
            color: #666;
            margin: 0;
        }

        /* Mobile view - 1 item per row */
        @media screen and (max-width: 932px) {
            .team-member {
                flex: 1 0 45%; /* 2 per row on mobile */
                max-width: 45%;
            }
        }

         @media screen and (max-width: 932px) {
            .team-gallery {
                justify-content: center;
            }
        }

/*.........................*/

        .additional-team{
        	margin-top: 70px;
        	margin-bottom: 30px;

        }

        /* Individual team member items */
        .additional-team .team-member {
            flex: 1 0 23%; /* Desktop: 3 per row */
            max-width: 33%;
            box-sizing: border-box;
            text-align: center;
        }

        /* Mobile view - 1 item per row */
        @media screen and (max-width: 932px) {
            .additional-team .team-member {
                flex: 1 0 100%; /* 2 per row on mobile */
                max-width: 100%;
            }
        }

         @media screen and (max-width: 932px) {
            .team-gallery {
                justify-content: center;
            }
        }

/*--education--*/
.education{
padding:60px 0;
background:   #ffffff;
}
.edu-info h3{
margin:0;
color:#00563B;
font-size:36px;
font-weight:600;
letter-spacing: 2px;
}

.edu-grid p{
margin:0px auto;
color:#ffffff;
font-size:18px;
font-family: 'Lato', sans-serif;
background:#000000;
width: 36%;
padding: 3px 0;
}
.edu-grid span{
margin:0px auto;
display:block;
color:#ffffff;
font-size:18px;
font-family: 'Lato', sans-serif;
background:#8b0000;
width: 36%;
padding: 0px 0;
}
.edu-grid-master{

background:#000000;
padding: 15px 0;
}
.edu-grid-master h3{
font-family: 'Lato', sans-serif;
margin:0;
font-size:18px;
color:    #E1E1E1;
font-weight:700;
line-height:1.8em;
}
.edu-grid-master h4{
font-family: 'Lato', sans-serif;
margin:10px 0 0 0;
font-size:18px;
color:#ffffff;
font-weight: 600;
}
.edu-grid-info{
background:#ffffff;
padding: 25px 30px;
}
.edu-grid-info h5{
font-family: 'Lato', sans-serif;
line-height:1.8em;
margin:0;
font-size:18px;
color:#545454;
font-weight:300;
}
.edu-border{
border:1px solid #e2e2e2;
margin-top:50px;
border-radius: 6px;
border-bottom: 2px solid #c3c3c3;
}
.edu-grids {
  margin-top: 50px;
}
.edu-grid{
position:relative;
}
.edu-grid img{
position:absolute;
top: 25%;
left: 40%;
}
/*--//education--*/


 /* Footer container */
        footer {
            background-color: #00563B; /* Dark blue background */
            color: #ffffff;
            padding: 40px 20px;
            font-family: Arial, sans-serif;
        }

        .footer-container {
            max-width: 1200px;
            margin: 0 auto;
            display: flex;
            flex-wrap: wrap;
            justify-content: space-between;
            gap: 20px;
        }

        /* Column styling */
        .footer-column {
            flex: 1;
            min-width: 200px; /* Minimum width before stacking */
            margin-bottom: 20px;
        }

        /* Column 1 - Logo */
        .footer-column.logo-column {
            display: flex;
            align-items: center;
        }

        .footer-column img {
            max-width: 150px; /* Adjust logo size */
            height: auto;
        }

        /* Column 2 - Address */
        .footer-column.address-column h3,
        .footer-column.contact-column h3 {
            margin-bottom: 15px;
            font-size: 1.2em;
            color: #ecf0f1;
        }

        .footer-column p {
            margin: 5px 0;
            line-height: 1.5;
            color: #bdc3c7;
        }

        /* Column 3 - Contact */
        .footer-column.contact-column a {
            color: #bdc3c7;
            text-decoration: none;
            display: block;
            margin: 5px 0;
            transition: color 0.3s ease;
        }

        .footer-column.contact-column a:hover {
            color: #3498db; /* Light blue on hover */
        }

         /* Copyright section */
        .footer-copyright {
            max-width: 1200px;
            margin: 20px auto 0;
            padding: 20px 0;
            text-align: center;
            border-top: 1px solid rgba(255, 255, 255, 0.1);
            color: #bdc3c7;
            font-size: 0.9em;
        }

        /* Responsive adjustments */
        @media screen and (max-width: 768px) {
            .footer-column {
                flex: 1 0 100%; /* Stack columns on mobile */
                text-align: center;
            }

            .footer-column.logo-column {
                justify-content: center;
            }
        }



/*-- responsive media queries --*/
@media(max-width:1440px){
.comment-icons ul li {
  margin: 12px 15px 12px 0;
  }
	.top-header {
	  margin-top: 30px;
	}
	.banner.page-head {
	  min-height: 115px;
	}
	.banner {
	  min-height: 659px;
	}
	.about-back {
	  min-height: 92px;
	}
	.footer-top {
	  min-height: 167px;
	}
	.contact-back {
	  min-height: 77px;
	}
	.client-back {
	  min-height: 84px;
	}
	.process-back {
	  min-height: 78px;
	}
	.gallery-section {
	  min-height: 1319px;
	  padding: 115px 0 0px 0;
	}
	.services-back {
	  min-height: 77px;
	}
	.my-skill-back {
	  min-height: 82px;
	}

}
@media(max-width:1366px){
	.about-back {
	  min-height: 85px;
	}
	.my-skill-back {
	  min-height: 77px;
	}
	.services-back {
	  min-height: 71px;
	}
	.process-back {
	  min-height: 74px;
	}
	.client-back {
	  min-height: 78px;
	}
	.contact-back {
	  min-height: 69px;
	}
	.footer-top {
	  min-height: 159px;
	}
	a.boxclose {
	  right: 250px;
	}

}
@media(max-width:1280px){
	a.boxclose {
	  right: 160px;
	}
	.logo {
	  float: left;
	  width: 13%;
	}
	.logo img{
	 width:100%;
	}
	.about-back {
	  min-height: 79px;
	}
	.services-back {
	  min-height: 66px;
	}
	.gallery-section {
	  min-height: 1294px;
	  }
	.process-back {
	  min-height: 69px;
	}
	.client-back {
	  min-height: 70px;
	}
	.contact-back {
	  min-height: 65px;
	}
	.footer-top {
	  min-height: 147px;
	}
}
@media(max-width:1024px){
	.top-nav {
	  margin-top: 8px;
	}
	.banner.page-head {
	  min-height: 90px;
	}
	.boxclose span {
	  width: 49px;
	  height: 47px;
	  }
	a.boxclose {
	  right: 92px;
	}
	.sam-head h3 {
	  font-size: 32px;
	  }
	.category ul li {
	  font-size: 14px;
	  background: url(../images/mark.png) no-repeat 0px 6px;
	  }
	.category h4 {
	  font-size: 16px;
	  }
	.sample-page-info h5 {
	  margin: 20px 0 10px 0;
	  }
	.sample-page-info h5 {
	  font-size: 16px;
	  }
	.sample-page-info p {
	  font-size: 16px;
	  }
	.recent-posts h4 {
	  font-size: 16px;
	  }
	.posts-right h5 {
	  font-size: 14px;
	  margin: 4px 0;
	  }
	.posts-right label {
	  font-size: 14px;
	}
	.response h4 {
	  font-size: 16px;
	  }
	.comments h4 {
	  font-size: 16px;
	  }
	.coment-form h4 {
	  font-size: 16px;
	  }
	.coment-form input[type="text"] {
	  width: 47.2%;
	  }
	.coment-form input[type="text"] {
	  width: 47.2%;
	  padding: 10px;
	  font-size: 16px;
	  }
	.coment-form textarea {
	  height: 175px;
	  font-size: 16px;
	  padding: 10px;
	}
	.coment-form input[type="submit"] {
	  background: url(../images/mess.png) no-repeat 69px 14px;
	  width: 46%;
	  }
	.footer {
	  padding: 35px 0;
	}
	.footer p {
	  font-size: 16px;
	  }
	.admin-text-right p, .response-text-right p {
	  font-size: 13px;
	}
	.admin-text-right p, .response-text-right p {
	  margin: 0 0 10px 0;
	  }
	.sample-page-left {
	  margin-top: 45px;
	}
	.sample-page-right {
	  margin-top: 45px;
	}
	.strip {
	  margin: 15px 0 0px 0;
	}
	.banner-info {
	  width: 78%;
	  margin: 100px auto 0 auto;
	}

	.banner {
	  min-height: 575px;
	} 
	.about h3 {
	  font-size: 32px;
	}  
	.about p {
	  margin: 40px 0 0 0;
	  font-size: 16px;
	}  
	.about ul {
	  margin: 40px 0 0 0;
	} 
	.about-back {
	  min-height: 64px;
	} 
	.my-skills {
	  padding: 45px 0;
	} 
	.skill-grids {
	  margin-top: 40px;
	} 
	.skills-grid {
	  width: 33.3% !important;
	  float: left;
	} 
	.skills-grid:nth-child(1) ,.skills-grid:nth-child(2) ,.skills-grid:nth-child(3)  {
	margin-bottom:30px;
	}
	.about ul li {
	  margin-right: 15px;
	} 
	.my-skill-back {
	  min-height: 59px;
	} 
	.my-skills h3 {
	  font-size: 32px;
	}  
	.edu-info h3 {
	  font-size: 32px;
	}  
	.edu-grids {
	  margin-top: 40px;
	} 
	.edu-grid p {
	  font-size: 16px;
	}  
	.edu-grid span {
	  font-size: 16px;
	  }
	.edu-grid p,.edu-grid span {
	  width: 38%;
	}  
	.edu-grid img {
	  top: 25%;
	  left: 39%;
	} 
	.edu-grid-master h3 {
	  font-size: 16px;
	  }
	.edu-grid-master h4 {
	  font-size: 16px;
	  }
	.edu-grid-info h5 {
	  font-size: 16px;
	  }
	.edu-grid-info {
	  padding: 25px 22px;
	}
	.education {
	  padding: 45px 0;
	  }
	.work-info h3 {
	  font-size: 32px;
	  }
	.work-grids {
	  margin-top: 40px;
	}
	.work-grid h3 {
	  padding: 11px 0;
	  font-size: 16px;
	  }
	.work-grid-info h4 {
	  font-size: 18px;
	  }
	.work-grid-info h5 {
	  font-size: 16px;
	  margin: 12px 0 12px 0;
	  }
	.work-grid-info p {
	  font-size: 16px;
	  }
	.services-back {
	  min-height: 53px;
	}
	.ser-info h3 {
	  font-size: 32px;
	  }
	.ser-grids {
	  margin-top: 40px;
	}
	.ser-grid h3 {
	  margin: 20px 0 11px 0;
	  font-size: 18px;
	  }
	.ser-grid p {
	  font-size: 16px;
	  }
	.gallery-section {
	  padding: 92px 0 0px 0;
	}
	.gallery-section h3 {
	  font-size: 32px;
	  }
	#portfolio p {
	  font-size: 16px;
	  }
	.gallery-grids {
	  margin-top: 40px;
	}
	.textbox h4 {
	  margin-top: 89px;
	}
	.button {
	  padding: 7px;
	  }
	.button a {
	  font-size: 16px;
	  }
	.gallery-section {
	  min-height: 1068px;
	}
	.process h3 {
	  font-size: 32px;
	  }
	.process-pad {
	  padding: 0 12px;
	}
	.process-gird p {
	  font-size: 16px;
	  margin: 8px 0 0 0;
	}  
	.process-gird {
	  height: 131px;
	  padding: 16px 0 0 0;
	}  
	.process-gird img {
	  left: 101.5%;
	} 
	.process-back {
	  min-height: 55px;
	} 
	.process-girds {
	  margin-top: 40px;
	}  
	.services {
	  padding: 45px 0;
	}  
	.process {
	  padding: 45px 0;
	}  
	.testimonials {
	  padding: 45px 0;
	}  
	.test-right p {
	  margin: 9px 0 12px 0;
	}  
	.test-banner {
	  width: 57%;
	  margin: 45px auto 0 auto;
	  padding: 71px 45px;
	}  
	.test-right {
	  float: right;
	  width: 54%;
	}  
	.client-grids {
	  margin-top: 45px;
	} 
	.client-back {
	  min-height: 58px;
	}
	.testimonials h3 {
	  font-size: 32px;
	  }
	.blog {
	  padding: 45px 0;
	}
	.blog-grids {
	  margin-top: 45px;
	}
	.blog-grid a {
	  font-size: 16px;
	  }
	.blog-text {
	  padding: 35px 20px 20px 20px;
	}
	.blog-pos p {
	  font-size: 18px;
	  }
	.blog-pos p span {
	  font-size: 14px;
	  margin: -7px 0 0 0;
	}
	.blog-pos {
	  top: 39.3%;
	  left: 14%;
	  width: 18.2%;
	  }
	.stripa {
	  margin: 10px 0 3px 0;
	  }
	.contact-back {
	  min-height: 53px;
	}
	.blog-info h3 {
	  font-size: 32px;
	  }
	.contact {
	  padding: 45px 0 0 0;
	}
	.contact-grids {
	  margin-top: 45px;
	}
	.contact-grids h3 {
	  font-size: 16px;
	  margin: 0 0 15px 0;
	}
	.stripb {
	  margin: 0 0 30px 0;
	}
	.contact-left ul li {
	  font-size: 16px;
	  }
	.contact-info h3 {
	  font-size: 32px;
	  }
	.contact-right input[type="text"] {
	  width: 47.2%;
	  padding: 10px;
	  font-size: 16px;
	  }
	.contact-right textarea {
	  height: 145px;
	  font-size: 16px;
	  padding: 10px;
	  }
	.contact-left ul li:nth-child(4) {
	  font-size: 16px;
	  margin: 20px 0;
	}
	.contact-left ul li:nth-child(6) {
	  margin: 20px 0 0 0;
	  }
	.contact-right form input[type="submit"] {
	  background: url(../images/mess.png) no-repeat 60px 14px;
	  width: 46%;
	  }
	.footer-top {
	  min-height: 120px;
	} 
	.resume a {
	  font-size: 16px;
	}  
	.clients {
	  padding: 0 0 45px 0;
	  }
}
@media(max-width:768px){
	.recent-posts-info {
	  margin-bottom: 30px;
	  float: left;
	  width: 50%;
	}
	.comments-info {
	  margin: 0px 18px 0px 0;
	  float: left;
	  width: 31.5%;
	}
	.cmnt-icon-right {
	  float: right;
	  width: 62%;
	}
	.comments-info:nth-child(4) {
	  margin-right: 0;
	}
	.coment-form input[type="text"] {
	  width: 47.6%;
	  }
	.sample-page-info h5 {
	  margin: 10px 0 0px 0;
	}
	.admin-text h5{
	margin-bottom:15px;
	}
	.banner.page-head {
	  min-height: 87px;
	}
	.top-nav {
	  margin-top: 3px;
	}
	.comment-icons ul li {
	  margin: 12px 8px 12px 0;
	  }
	.menu_box_list li a {
	  font-size: 14px;
	  }
	.menu_box_list ul li {
	  margin: 0 5px;
	}
	.boxclose span {
	  width: 30px;
	  height: 30px;
	  background-size: 100% !important;
	}
	a.boxclose {
	  top: 25px;
	  right: 68px;
	}
	.banner-info {
	  width: 96%;
	  }
	.banner-left img {
	  width: 60%;
	}
	.banner-left {
	  width: 100%;
	}
	.banner-right {
	  float: right;
	  width: 65%;
	}
	.logo {
	  float: left;
	  width: 14%;
	}
	.banner-info {
	  margin: 80px auto 0 auto;
	}
	.banner {
	  min-height: 467px;
	}
	.banner-right h1 {
	  font-size: 28px;
	  }
	.border {
	  width: 58%;
	  }
	.banner-right h2 {
	  font-size: 40px;
	}
	.banner-right h2 {
	  margin: 15px 0 35px 0;
	}
	.about h3 {
	  font-size: 30px;
	}
	.about p {
	  margin: 30px 0 0 0;
	  font-size: 14px;
	}
	.about ul {
	  margin: 30px 0 0 0;
	}
	.about-back {
	  min-height: 48px;
	}
	.about {
	  padding: 40px 0 15px 0;
	}
	.my-skills {
	  padding: 40px 0;
	}
	.my-skills h3 {
	  font-size: 30px;
	}
	.my-skill-back {
	  min-height: 43px;
	}
	.edu-info h3 {
	  font-size: 30px;
	}
	.edu-grid {
	  float: left;
	  width: 33.3% !important;
	}
	.skills-grid p {
	  margin: 3px 0 0 0;
	  font-size: 14px;
	  }
	.education {
	  padding: 40px 0;
	}
	.edu-grid p, .edu-grid span {
	  width: 51%;
	}
	.edu-border {
	  margin-top: 38px;
	  }
	.edu-grid p ,.edu-grid span{
	  font-size: 14px;
	}
	.edu-grid-master h3,.edu-grid-master h4 {
	  font-size: 14px;
	}
	.edu-grid-info {
	  padding: 12px 10px;
	}
	.edu-grid-info h5 {
	  font-size: 14px;
	}
	.work-experience {
	  padding: 40px 0;
	  }
	.work-info h3 {
	  font-size: 30px;
	}
	.w-grid {
	  float: left;
	  width: 31.4%;
	  padding: 0;
	  margin-right: 20px;
	}
	.w-grid:nth-child(3) {
	margin-right:0;
	}
	.work-grid-info h4 {
	  font-size: 16px;
	}
	.work-grid-info h5 {
	  font-size: 14px;
	  margin: 10px 0 10px 0;
	}
	.work-grid-info p {
	  font-size: 14px;
	}
	.work-grid-info {
	  padding: 16px 10px;
	}
	.services-back {
	  min-height: 40px;
	}
	.ser-info h3 {
	  font-size: 30px;
	}
	.services {
	  padding: 40px 0;
	}
	.col-md-3.ser-grid {
	  float: left;
	  width: 25%;
	}
	.ser-grid h3 {
	  font-size: 16px;
	}
	.ser-grid p {
	  font-size: 14px;
	}
	.ser-imagea {
	  background: url(../images/icons.png) no-repeat 0px -231px;
	  width: 130px;
	  height: 130px;
	  display: block;
	  margin: 0 auto;
	  background-size: 319% !important;
	}
	.ser-imageb {
	  background: url(../images/icons.png) no-repeat -266px -103px;
	  width: 130px;
	  height: 130px;
	  display: block;
	  margin: 0 auto;
	  background-size: 319% !important;
	}
	.ser-imagec {
	  background: url(../images/icons.png) no-repeat -133px -101px;
	  width: 130px;
	  height: 130px;
	  display: block;
	  margin: 0 auto;
	  background-size: 319% !important;
	}
	.ser-imaged {
	  background: url(../images/icons.png) no-repeat -1px -98px;
	  width: 130px;
	  height: 130px;
	  display: block;
	  margin: 0 auto;
	  background-size: 319% !important;
	}
	.edu-grid img {
	  top: 23%;
	  left: 36%;
	}
	.gallery-section {
	  padding: 68px 0 0px 0;
	}
	.gallery-section h3 {
	  font-size: 30px;
	}
	#portfolio p {
	  font-size: 14px;
	}
	.gallery-grid {
	  float: left;
	  width: 33.3%;
	}
	.gallery-section {
	  min-height: 893px;
	}
	.textbox h4 {
	  margin-top: 55px;
	}
	.process h3 {
	  font-size: 30px;
	}
	.process-pad {
	  width: 33.3% !important;
	  float: left;
	}
	.process-pad {
	  padding: 0 33px;
	}
	.process-gird {
	  height: 165px;
	  padding: 36px 0 0 0;
	}
	img.pro-img {
	  display: none;
	}

	.process-pad:nth-child(1),.process-pad:nth-child(2),.process-pad:nth-child(3) {
	  margin-bottom: 30px;
	}
	.process-gird img {
	  left: 113.5%;
	}
	.process-back {
	  min-height: 42px;
	}
	.process {
	  padding: 40px 0;
	}
	.testimonials {
	  padding: 40px 0;
	}
	.testimonials h3 {
	  font-size: 30px;
	}
	.test-banner {
	  width: 77%;
	  margin: 45px auto 0 auto;
	  padding: 54px 45px;
	}
	.test-right p {
	  margin: 27px 0 12px 0;
	}
	.callbacks_nav {
	  top: 73%;
	  }
	.callbacks_nav.next{
	  left: 92%;
	}
	a.callbacks_nav.callbacks1_nav.prev {
	  left: 5%;
	}
	.client-grids {
	  margin-top: 40px;
	}
	.cl-grid{
	  float: left;
	  width: 33.3%;
	}
	.client-grid img {
	  width: 100%;
	}
	.client-back {
	  min-height: 45px;
	}
	.clients {
	  padding: 0 0 40px 0;
	  }
	.blog-info h3 {
	  font-size: 30px;
	}
	.test-right p {
	  font-size: 14px;
	  }
	.blog {
	  padding: 40px 0;
	}
	.blog-text-info {
	  float: left;
	  width: 32%;
	  padding: 0;
	  margin-right: 14px;
	}
	.blog-text-info:nth-child(3),.blog-text-info:nth-child(6) {
	  margin-right: 0;
	}
	.blog-grid a {
	  font-size: 14px;
	}
	.blog-grid p {
	  font-size: 14px;
	  }
	.blog-text {
	  padding: 35px 10px 12px 10px;
	}
	.blog-pos {
	  top: 37.3%;
	  left: 14%;
	  width: 18.7%;
	}
	.contact-back {
	  min-height: 40px;
	}
	.contact-info h3 {
	  font-size: 30px;
	}
	.contact {
	  padding: 40px 0 0 0;
	}
	.contact-left {
	  float: left;
	  width: 34% !important;
	}
	.contact-right {
	  float: right;
	  width: 66% !important;
	}
	.contact-left ul li {
	  font-size: 14px;
	}
	.contact-left ul li:nth-child(4) {
	  margin: 10px 0;
	}
	.contact-left ul li:nth-child(6) {
	  margin: 10px 0 0 0;
	}
	.contact-right input[type="text"] {
	  width: 46.7%;
	  padding: 6px 10px;
	  font-size: 14px;
	}
	.contact-right textarea {
	  height: 130px;
	  font-size: 14px;
	  padding: 6px 10px;
	}
	.contact-right form input[type="submit"] {
	  background: url(../images/mess.png) no-repeat 37px 14px;
	  font-size: 16px;
	  }
	.footer-top {
	  min-height: 90px;
	}
	.resume a {
	  font-size: 14px;
	  padding: 13px 18px;
	}
	.footer p {
	  font-size: 14px;
	}
	.footer {
	  padding: 25px 0;
	}
	.sam-head h3 {
	  font-size: 30px;
	}
	.sample-page-info p {
	  font-size: 14px;
	}
	.sample-page-info h5 {
	  font-size: 14px;
	}
}
@media(max-width:640px){
.contact-left {
  float: left;
  width: 39% !important;
}
.contact-right {
  float: right;
  width: 61% !important;
}
	.menu_box_list ul li {
	  display: block;
	  padding: 10px 0;
	  }
	.logo {
	  float: left;
	  width: 17%;
	}
	.banner-right h1 {
	  font-size: 26px;
	}
	.banner-right h2 {
	  font-size: 25px;
	}
	.banner-right a {
	  padding: 9px 15px;
	}
	.banner-info {
	  margin: 60px auto 0 auto;
	}
	.banner {
	  min-height: 393px;
	}
	.about-back {
	  min-height: 39px;
	}
	.my-skill-back {
	  min-height: 35px;
	}
	.edu-grid {
	  float: left;
	  width: 32.3% !important;
	  padding: 0;
	  margin-right: 9px;
	}
	.edu-grid:nth-child(3) {
	  margin: 0;
	}
	.w-grid {
	  float: left;
	  width: 32.3%;
	  padding: 0;
	  margin-right: 9px;
	}
	.services-back {
	  min-height: 33px;
	}
	.ser-grid {
	  float: left;
	  width: 50% !important;
	}
	.ser-grid:nth-child(1) ,.ser-grid:nth-child(3),.ser-grid:nth-child(2){
	margin-bottom:30px;
	}
	.gallery-section {
	  min-height: 805px;
	}
	.process-gird {
	  height: 134px;
	  padding: 20px 0 0 0;
	}
	.process-back {
	  min-height: 33px;
	}
	.test-right p {
	  margin: 6px 0 12px 0;
	}
	.client-back {
	  min-height: 35px;
	}
	.blog-text-info:nth-child(1), .blog-text-info:nth-child(2), .blog-text-info:nth-child(3), .blog-text-info:nth-child(4){
	  margin-bottom: 30px;
	}
	.blog-text-info {
	  float: left;
	  width: 48.2%;
	  }
	.blog-text-info:nth-child(6),.blog-text-info:nth-child(4),.blog-text-info:nth-child(2){
	  margin-right: 0;
	}
	.blog-text-info:nth-child(3){
	  margin-right: 14px;
	}
	.blog-pos {
	  top: 43.3%;
	  left: 14%;
	  width: 15.5%;
	}
	.contact-right input[type="text"] {
	  width: 100%;
	  padding: 6px 10px;
	  font-size: 14px;
	}
	.contact-left ul li:nth-child(4) {
	  margin: 3px 0;
	}
	.contact-left ul li:nth-child(6) {
	  margin: 3px 0 0 0;
	}
	.contact-right form input[type="submit"] {
	  height: 45px;
	  width: 41%;
	  background: url(../images/mess.png) no-repeat 26px 11px;
	  }
	.footer-top {
	  min-height: 75px;
	}
	.admin-text-right {
	  float: right;
	  width: 85%;
	}
	.admin-text-left {
	  float: left;
	  width: 13%;
	}
	.admin-text-right p, .response-text-right p {
	  margin: 0 0 3px 0;
	}
	.response-info {
	  padding: 24px 15px;
	  }
	.admin-text {
	  padding: 25px 22px;
	}
	.coment-form input[type="text"] {
	  width: 46.8%;
	}
	.coment-form textarea {
	  height: 153px;
	  font-size: 14px;
	  }
	.coment-form input[type="text"] {
	  font-size: 14px;
	}
	.coment-form input[type="submit"] {
	  background: url(../images/mess.png) no-repeat 38px 14px;
	  width: 34%;
	}
	.recent-posts-info {
	  float: left;
	  width: 48%;
	  margin-right: 20px;
	}
	.recent-posts-info:nth-child(3) {
	  margin-right: 0px;
	}
	.comments-info {
	  margin: 0px 15px 0px 0;
	  }
}
@media(max-width:480px){
	.logo {
	  float: left;
	  width: 23%;
	}
	.sam-head h3 {
	  font-size: 28px;
	}
	.sample-page {
	  padding: 40px 0;
	}
	.sample-page-info h5 {
	  font-size: 13px;
	}
	.sample-page-info p {
	  font-size: 13px;
	}
	.comment-icons ul li {
	  font-size: 13px;
	  }
	.admin-text-right span {
	  font-size: 13px;
	}
	.response-text-right ul li {
	  font-size: 13px;
	}
	.response-text-right {
	  float: right;
	  width: 75%;
	}
	.response-text-left {
	  float: left;
	  width: 22%;
	}
	.response-text-right ul li a {
	  font-size: 13px;
	}
	.coment-form h4 {
	  font-size: 13px;
	}
	.coment-form h4 {
	  margin: 23px 0;
	  }
	.response h4 {
	  font-size: 13px;
	}
	.response h4 {
	  margin: 23px 0;
	  }
	.coment-form input[type="text"] {
	  margin: 0 21px 21px 0;
	}
	.coment-form input[type="submit"] {
	background: url(../images/mess.png) no-repeat 23px 10px;
	  width: 36%;
	  height: 45px;
	  font-size: 14px;
	  }
	.recent-posts-info {
	  float: left;
	  width: 100%;
	  margin-right: 0;
	}
	.posts-right h5 {
	  font-size: 13px;
	  margin: 8px 0;
	}
	.posts-right label {
	  font-size: 13px;
	}
	.comments-info {
	  margin: 0px 0px 20px 0;
	  float: left;
	  width: 100%;
	}
	.cmnt-icon-left {
	  float: left;
	  width: 18%;
	}
	.cmnt-icon-right {
	  float: right;
	  width: 76%;
	}
	.category h4 {
	  font-size: 13px;
	}
	.sample-page-right {
	  margin-top: 30px;
	}
	.category ul li {
	  font-size: 13px;
	  }
	.category ul {
	  margin: 15px 0 15px 0;
	  }
	.recent-posts h4 {
	  font-size: 13px;
	}
	.comments h4 {
	  font-size: 14px;
	}
	.admin-text-right {
	  float: right;
	  width: 75%;
	}
	.admin-text-left {
	  float: left;
	  width: 22%;
	}
	.admin-text {
	  padding: 12px 15px;
	}
	.comments h4 {
	  font-size: 13px;
	}
	.banner-info {
	  width: 100%;
	}
	.banner-left {
	  width: 100%;
	}
	.banner-right {
	  float: right;
	  width: 65%;
	}
	.banner-right h1 {
	  font-size: 20px;
		letter-spacing: 10px;
	}
	.banner-right h2 {
	  font-size: 22px;
	}
	.banner-right h2 {
	  margin: 10px 0 28px 0;
	}
	.banner {
	  min-height: 352px;
	}
	.about h3 {
	  letter-spacing: 2px;
	  font-size: 28px;
	}
	.about p {
	  margin: 22px 0 0 0;
	  font-size: 13px;
	}
	.about ul li {
	  margin-right: 6px;
	}
	.about ul li a.drib {
	  background: url(../images/icons.png) no-repeat -207px 1px;
	  width: 50px;
	  height: 50px;
	  display: block;
	  background-size: 839% !important;
	}
	.about ul li a.drib:hover {
	  background: url(../images/icons.png) no-repeat -207px -49px;
		  background-size: 839% !important;
	  }
	.about ul li a.fb {
	  background: url(../images/icons.png) no-repeat -0px 0px;
	  width: 50px;
	  height: 50px;
	  display: block;
	  background-size: 839% !important;
	}
	.about ul li a.fb:hover {
	  background: url(../images/icons.png) no-repeat -0px -49px;
		  background-size: 839% !important;
	  }
	.about ul li a.pin {
	  background: url(../images/icons.png) no-repeat -346px 0px;
	  width: 50px;
	  height: 50px;
	  display: block;
	  background-size: 839% !important;
	}
	.about ul li a.pin:hover {
	  background: url(../images/icons.png) no-repeat -346px -49px;
		  background-size: 839% !important;
	  }
	.about ul li a.twit {
	  background: url(../images/icons.png) no-repeat -69px 1px;
	  width: 50px;
	  height: 50px;
	  display: block;
	  background-size: 839% !important;
	}
	.about ul li a.goog {
	  background: url(../images/icons.png) no-repeat -278px 0px;
	  width: 50px;
	  height: 50px;
	  display: block;
	  background-size: 839% !important;
	}
	.about ul li a.goog:hover {
	  background: url(../images/icons.png) no-repeat -278px -49px;
		  background-size: 839% !important;
	  }
	.about ul li a.in {
	  background: url(../images/icons.png) no-repeat -139px 1px;
	  width: 50px;
	  height: 50px;
	  display: block;
	  background-size: 839% !important;
	}
	.about ul li a.in:hover{
	  background: url(../images/icons.png) no-repeat -139px -49px;
		  background-size: 839% !important;
	  }
	.banner-right h1 {
	  margin: 8px 0 15px 0;
	}
	.about ul li a.twit:hover {
	  background: url(../images/icons.png) no-repeat -69px -49px;
		background-size: 839% !important;
	  }
	.my-skills h3 {
	  letter-spacing: 11px;
	  font-size: 28px;
	}
	.skills-grid {
	  width: 50% !important;
	  float: left;
	}
	.skills-grid p {
	  font-size: 13px;
	}
	.skills-grid:nth-child(1), .skills-grid:nth-child(2), .skills-grid:nth-child(3), .skills-grid:nth-child(4) {
	  margin-bottom: 30px;
	}
	.my-skill-back {
	  min-height: 27px;
	}
	.edu-info h3 {
	  font-size: 28px;
		letter-spacing: 2px;
	}
	.edu-grid {
	  float: left;
	  width: 100% !important;
	  padding: 0;
	  margin-right: 0px;
	  margin-bottom: 30px;
	}
	.edu-grid img {
	  top: 30%;
	  left: 42%;
	}
	.work-info h3,.ser-info h3,.gallery-section h3,.process h3,.testimonials h3 ,.blog-info h3,.contact-info h3,.sam-head h3{
	  font-size: 28px;
		letter-spacing: 11px;
	}
	.w-grid {
	  float: left;
	  width: 100%;
	  padding: 0;
	  margin-right: 0;
	  margin-bottom: 30px;
	}
	.edu-grid p, .edu-grid span {
	  font-size: 13px;
	}
	.edu-grid-master h3, .edu-grid-master h4 {
	  font-size: 13px;
	}
	.edu-grid-info h5 {
	  font-size: 13px;
	}
	.work-grid h3 {
	  font-size: 13px;
	}
	.work-grid-info h4 {
	  font-size: 13px;
	}
	.work-grid-info h5 {
	  font-size: 13px;
	  }
	.work-grid-info p {
	  font-size: 13px;
	}
	.services-back {
	  min-height: 24px;
	}
	.ser-grid p {
	  font-size: 13px;
	}
	.ser-grid h3 {
	  font-size: 13px;
	}
	.gallery-section {
	  padding: 54px 0 0px 0;
	}
	#portfolio p {
	  font-size: 13px;
	}
	.gallery-grid {
	  float: left;
	  width: 50%;
	}
	.gallery-section {
	  min-height: 1073px;
	}
	.textbox h4 {
	  font-size: 16px;
	  }
	.button a {
	  font-size: 13px;
	}
	.process-pad {
	  padding: 0 15px;
	}
	.process-gird {
	  height: 116px;
	  padding: 9px 0 0 0;
	}
	.process-gird p {
	  font-size: 13px;
	  }
	.process-gird img {
	  left: 104.5%;
	}
	.process-back {
	  min-height: 25px;
	}
	.test-banner {
	  width: 90%;
	  margin: 27px auto 0 auto;
	  padding: 54px 27px;
	}
	.test-right p {
	  font-size: 13px;
	}
	.test-right p {
	  margin: 6px 0 4px 0;
	}
	.test-right h4 {
	  font-size: 13px;
	  }
	.callbacks_nav.next {
	  left: 97%;
	}
	a.callbacks_nav.callbacks1_nav.prev {
	  left: -2%;
	}
	.client-grids {
	  margin-top: 23px;
	}
	.client-back {
	  min-height: 27px;
	}
	.clients {
	  padding: 0 0 29px 0;
	}
	.blog-grid a {
	  font-size: 13px;
	}
	.blog-grid p {
	  font-size: 13px;
	}
	.blog-text {
	  padding: 29px 7px 7px 7px;
	}
	.blog-pos {
	  top: 36.3%;
	  left: 14%;
	  padding: 3px 0;
	  width: 22.4%;
	}
	.blog-grid ul li {
	  padding-right: 15px;
	}
	.contact-back {
	  min-height: 26px;
	}
	.contact-left ul li {
	  font-size: 13px;
	}
	.col-md-5.contact-left {
	  padding-left: 0;
	}
	.col-md-7.contact-right {
	  padding-right: 0;
	}
	.contact-left {
	  float: left;
	  width: 46% !important;
	}
	.contact-right {
	  float: right;
	  width: 54% !important;
	}
	.contact-right form input[type="submit"] {
	  width: 55%;
	  background: url(../images/mess.png) no-repeat 14px 11px;
	}
	.footer-top {
	  min-height: 55px;
	}
	.contact-left ul li:nth-child(4) {
	  font-size: 13px;
	  }
	.contact-right textarea {
	  height: 120px;
	  }
	.resume {
	  padding: 22px 0 50px 0;
	}
}
@media(max-width:320px){
.col-md-4.sample-page-right {
  padding: 0;
}
.logo {
  float: left;
  width: 35%;
}
.top-header {
  margin-top: 18px;
}
.banner.page-head {
  min-height: 66px;
}
.work-info h3, .ser-info h3, .gallery-section h3, .process h3, .testimonials h3, .blog-info h3, .contact-info h3, .sam-head h3 {
  font-size: 21px;
  letter-spacing: 5px;
}
.col-md-8.sample-page-left {
  padding: 0;
}
.sample-page-left {
  margin-top: 30px;
}
.admin-text-left {
  float: left;
  width: 29%;
}
.admin-text-right {
  float: right;
  width: 68%;
  margin-top: 15px;
}
.response-text-left {
  float: left;
  width: 29%;
}
.response-text-right {
  float: right;
  width: 68%;
}
.response-text-right ul {
  text-align: left;
  }
.coment-form input[type="text"] {
  margin: 0 0px 21px 0;
    width: 100%;
}
.coment-form input[type="submit"] {
  background: url(../images/mess.png) no-repeat 79px 12px;
  width: 100%;
  }
.category ul li {
  padding-left: 20px;
  }
.category ul li {
  font-size: 12px;
}
.category ul li {
  background: url(../images/mark.png) no-repeat 0px 3px;
  }
.posts-left {
  width: 100%;
  float: left;
}
.posts-right {
  width: 100%;
  float: right;
  margin-top: 10px;
}
.comments-info p {
  margin: 2px 0 0 0;
  }
.footer p {
  font-size: 13px;
}
.banner-right h1 {
  font-size: 16px;
  letter-spacing: 5px;
}
.banner-right h2 {
  font-size: 18px;
}
.banner-right a {
  font-size: 13px;
  }
.banner-right a {
  padding: 5px 4px;
}
.banner-right h2 {
  margin: 6px 0 14px 0;
}
.banner-right h1 {
  margin: 8px 0 8px 0;
}
.banner-info {
  margin: 38px auto 0 auto;
}
.banner {
  min-height: 231px;
}
.about-back {
  min-height: 19px;
}
.skills-grid {
  width: 100% !important;
  }
.skills-grid:nth-child(1), .skills-grid:nth-child(2), .skills-grid:nth-child(3), .skills-grid:nth-child(4), .skills-grid:nth-child(5)  {
  margin-bottom: 30px;
}
.my-skill-back {
  min-height: 17px;
}
.edu-grid img {
  top: 27%;
  left: 38%;
}
.services-back {
  min-height: 18px;
}
.ser-grid {
  float: left;
  width: 100% !important;
}
.gallery-grid {
  float: left;
  width: 50%;
}
.button {
  padding: 5px;
  width: 46%;
  margin: 5px auto 0 auto;
}
.textbox h4 {
  margin-top: 22px;
}
.gallery-section {
  min-height: 904px;
}
.process-pad {
  width: 50% !important;
  float: left;
}
.process-pad:nth-child(1), .process-pad:nth-child(2), .process-pad:nth-child(3),.process-pad:nth-child(4)  {
  margin-bottom: 30px;
}
.process-gird {
  height: 105px;
  }
img.pro-img {
  display: block;
}
.menu_box_list ul li {
  display: block;
  padding: 4px 0;
}
img.pro-imga, img.pro-imgb {
  display: none;
}
.process-back {
  min-height: 16px;
}
.test-left {
  float: left;
  width: 100%;
}
.test-right {
  float: right;
  width: 100%;
}
.test-right p {
  margin: 22px 0 16px 0;
}
.test-banner img.quoa {
  position: absolute;
  top: 55%;
  left: 9%;
}
.test-banner img.quo {
  position: absolute;
  top: 79%;
  left: 37%;
}
.test-banner {
  width: 90%;
  margin: 27px auto 0 auto;
  padding: 30px 27px;
}
a.callbacks_nav.callbacks1_nav.prev {
  left: -5%;
}
.cl-grid {
  float: left;
  width: 100%;
  margin-top: 30px;
}
.client-grids {
  margin-top: 0;
}
.blog-text-info {
  float: left;
  width: 100%;
}
.blog-pos {
  top: 46.3%;
  left: 14%;
  padding: 3px 0;
  width: 16.4%;
}
.blog-text-info:nth-child(1), .blog-text-info:nth-child(2), .blog-text-info:nth-child(3), .blog-text-info:nth-child(4) , .blog-text-info:nth-child(5){
  margin-bottom: 30px;
}
.contact-back {
  min-height: 15px;
}
.contact-grids {
  margin-top: 25px;
}
.contact-left {
  float: left;
  width: 100% !important;
}
.contact-right {
  float: right;
  width: 100% !important;
  padding: 0;
}
.footer-top {
  min-height: 36px;
}
.contact-right input[type="text"] {
  margin: 0 0px 21px 0;
}
.contact-right form input[type="submit"] {
  width: 100%;
  background: url(../images/mess.png) no-repeat 81px 11px;
}
.contact {
  padding: 40px 0;
}
.col-md-7.contact-right {
  margin-top: 30px;
}
.about ul li a.drib {
	  background: url(../images/icons.png) no-repeat -137px 1px;
	  width: 33px;
	  height: 33px;
	  display: block;
	  background-size: 839% !important;
	}
.about ul li a.drib:hover {
	  background: url(../images/icons.png) no-repeat -137px -33px;
	  }
	.about ul li a.fb {
	  background: url(../images/icons.png) no-repeat -0px 1px;
	  width: 33px;
	  height: 33px;
	  display: block;
	  background-size: 839% !important;
	}
	.about ul li a.fb:hover {
	  background: url(../images/icons.png) no-repeat -0px -33px;
}	  
	.about ul li a.pin {
	  background: url(../images/icons.png) no-repeat -229px 0px;
	  width: 33px;
	  height: 33px;
	  display: block;
	  background-size: 839% !important;
	}
	.about ul li a.pin:hover {
	  background: url(../images/icons.png) no-repeat -229px -33px;
	  }
	.about ul li a.twit {
	  background: url(../images/icons.png) no-repeat -46px 1px;
	  width: 33px;
	  height: 33px;
	  display: block;
	  background-size: 839% !important;
	}
	.about ul li a.twit:hover {
	  background: url(../images/icons.png) no-repeat -46px -32px;
	  }
	.about ul li a.goog {
	  background: url(../images/icons.png) no-repeat -183px 0px;
	  width: 33px;
	  height: 33px;
	  display: block;
	  background-size: 839% !important;
	}
	.about ul li a.goog:hover {
	  background: url(../images/icons.png) no-repeat -183px -33px;
}	  
	.about ul li a.in {
	  background: url(../images/icons.png) no-repeat -92px 1px;
	  width: 33px;
	  height: 33px;
	  display: block;
	  background-size: 839% !important;
	}
	.about ul li a.in:hover {
	  background: url(../images/icons.png) no-repeat -92px -33px;
	  }
}


/*-- responsive media queries --*/