@charset "UTF-8";
/*
Theme Name: Port8.
Theme URI: https://dientweb.net/
Author: the DientWeb team
Author URI: https://dientweb.net/
*/

html, body 	{float:left;width:100%;margin:0;padding:0;height: 100%;background: #fff;overflow-x:hidden;}
body 		{font-family: 'Poppins',sans-serif;color:#000;}
ul 			{margin:0;padding:0;}
a 			{text-decoration:none;color: inherit;}
p 			{float: left;margin: 11px 0;width: 100%;font-size: 16px;line-height: 28px;letter-spacing: 0px;}
h1          {font-size: 30px;line-height: 30px;font-weight: 400;text-transform:capitalize;margin-bottom: 9px;letter-spacing: 1px;}
h2          {font-size: 35px;text-transform: capitalize;margin: 47px 0 0;font-weight: bold;}
h3          {font-size: 22px;font-weight: 700;letter-spacing: 0px;margin-bottom: 0px;}
h1,h2,h3    {float: left;width: 100%;}
#container 	{float: left;width: 100%;}

#wrapper 	{width: 1100px;float: none;margin:0 auto;}
#wrapper2 	{width: 1150px;float: none;margin:0 auto;}
#page-wrapper {width:742px;float: none;margin:0 auto;}

#page-header, .ph-image, .ph-text {float: left;width:100%;color:#fff;}
#page-header        {min-height: 357px;margin-top: 0;position: relative;}
.pagehe             {position: absolute;width:100%;top: 30%;}
#page-header h1, #post-header h1     {text-align: center;line-height: 57px;font-weight: bold;margin: 0 0 8px;padding: 0 0 20px;font-size: 50px; color:#fff;
width: 100%;font-family: "Poppins", sans-serif;background: url('img/gl.png') no-repeat bottom center;}
.ph-image img       {float: left;width:100%;}
.ph-img {color:#ccc; font-size:12px;}
.ph-img a {color:#fff;}
.big-text p {font-size: 22px;line-height: 33px;margin: 10px 0 !important;}
.ph-img {float: left;width: 100%;text-align: center;margin-top: 230px;}

#pref-foot {margin-top:40px;float: left;width: 100%;}
.home #pref-foot {margin-top:0;}
.page-template-newpage #page-box {float: left;width: 100%;padding: 0;background: #fff;}
#bottom-box {float: left;width:102%;margin-top: 40px;display:none;}
.bbox-left, .bbox-right {width: 100%;position:relative;height: 380px;overflow: hidden;}
.bbox-left img, .bbox-right img {width:100%;}

.bbox-left p, .bbox-right p {padding:0;}
.bbox-left {float:left;}
.bbox-right {float:right;}
.bbox-text {position: absolute;bottom: 10%;color: #fff;text-align: center;box-sizing: border-box;width: 100%;padding: 0 18%;}
.bbox-text p {font-size:12px;line-height: 18px !important;}
.pp-btn {float: left;width: 100%;margin-top: 20px;}
.pp-btn a {padding: 10px 20px;background: #ab449d url(img/wtr-img.png) no-repeat top 13px right 18px;color: #fff;border-radius: 20px;float: left;width: 100%;text-align: left !important;font-size: 13px;}
.pp-btn a:hover  {background:#177966 url('img/wtr-img.png') no-repeat top 13px right 18px;}

.bbox-left .pp-btn, .bbox-right .pp-btn {display:none;}
.bbox-left:hover .pp-btn, .bbox-right:hover .pp-btn {display:block;}

.process-box, .process-box ul {float:left; width:100%;margin:0 !important;padding:0;}
.process-box li {float:left;list-style:none;width:30.5%;}
.process-box li {display:inline-block;background:#f2f2f2;box-sizing: border-box;padding: 13px 15px;border-radius: 5px;line-height: 18px;font-size: 14px;min-height: 65px;margin: 13px 0;}
.process-box li:hover, .process-box li:first-child {background:#18765C;color:#fff;}
.process-box li:nth-child(2), .process-box li:nth-child(5) {margin:13px 4%;}

.product-right {float:left;width:100%;padding-top:40px;}
.product-right ul {float:left;margin-left:20px;}

#rmth3 h3 {margin-top:0;}

.page_content h2 {font-size: 20px;margin: 10px 0 10px;}
.page_content ul {float: left;width: 100%;margin-left: 20px;}
.page_content ul li {margin-bottom: 13px;line-height: 24px;font-size: 14px;}
.page_content p {line-height: 24px;font-size: 14px;}

.process-box h3 {margin-top: 40px;}
.double-s-t {float:left;width:100%;}
.dst-l {float:left;}
.dst-r {float:right;}
.dst-l, .dst-r {width:48%;}
.dst-l p, .dst-r p {font-size: 14px;line-height: 25px;margin: 7px 0;}
.dst-l h4, .dst-r h4 {margin: 25px 0 0;font-size: 14px;}
.dst-inner, .dst-inner2, .dst-inner3 {float: left;width: 100%;}
.dst-inner  {min-height: 230px;}
.dst-inner2  {min-height: 170px;}
.dst-inner3  {min-height: 160px;}

.dst-inner img {float:left;width:100%;margin:15px 0 40px !important;height:auto;}

.sprofile-pic, .sprofile-pic img {float:left;width:100%;height:auto;}

#pagination-in {float: left;width: 100%;text-align: center;}
#pagination-in .page-numbers {border: 1px solid #18765C;padding: 1px 10px;background: #18765C;color: #fff;margin: 10px 3px; border-radius: 4px;}
#pagination-in .current {border: 1px solid #ccc;color: #000;background:#fff;}

/*header*/
#head 		{float: left;width: 100%;padding:27px 0 0;background:#fff;}
.ghead      {float: left;width: 100%;}
.hlogo 	    {float: left;width:auto;margin-top:-9px;}
.hlogo img 	{float: left;width:150px;}

.hcontact 	{float: right;width: auto;}

.hcontact ul li {border-radius: 6px;list-style: none;width: 40px;display: inline-block;padding: 10px 5px;background: #177966;color: #fff;height: 40px;margin-left: 10px;box-sizing: border-box;}
.hcontact ul li {float: left;}
.hcontact ul li:hover 		{background: #ab449d;}
.hcontact ul li img 		{float:left; width: 100%;}
.hcontact ul li:last-child 	{width: 90px;text-align: center;}
.big-req 					{font-size: 14px;font-weight: bold;width: 100%;float: left;line-height: 9px;}
.small-req 					{font-size: 12px;width: 100%;float: left;}

#hmenu 		{float: left;width: 100%;background:#fff;}

#head, #hmenu {position:relative;z-index: 99999999;}

#hmenu-desktop {display:block;}
#hmenu-mobile {display:none;}
#hmenu-desktop, #hmenu-mobile {float:right;margin-top: -22px;}

/*home slider*/
#bigslider 	{float: left;width: 100%;z-index: 222;height:auto;background:#18765C;}
#home-box 	{float: left;width: 100%; margin: 50px 0 70px;}
.home-box-left {float: left;padding-right: 10%;border-right: 1px solid #9a9a9a;}
.home-box-right {float: right;padding-left: 10%;}
.home-box-left, .home-box-right {width: 50%;box-sizing: border-box;}
.home-box-left p, .home-box-right p {font-size: 14px;border-radius: 4px;}
.btn-purple {float: left;width: auto;padding: 10px 30px;color: #fff;margin-top: 30px;background: #177966;}
.btn-purple:hover {background: #ab449d;}
/*home content*/

#content-container-ohm {float:left;width:100%;padding: 80px 0 80px;margin-top: -35px;background:url('img/grey-bg.png') no-repeat top left;background-size: cover;}
.vc_column_container>.vc_column-inner {padding: 0 !important;}
.left-content-box {float:left;width:100%;box-sizing: border-box;padding-right:5%;}
.right-content-box {float: right;width:100%;box-sizing: border-box;padding-left:5%;}
.left-content-box img, .right-content-box img {float:left;width:100%;}
.left-content-box a, .right-content-box a {float: left;width:100%;box-sizing: border-box;padding:10px 0;background: url('img/ppr-img.png') no-repeat top 15px right;border-radius: 20px; color:#ab449d;}
.left-content-box a:hover, .right-content-box:hover a {padding:10px 20px;background:#ab449d url('img/wtr-img.png') no-repeat top 15px right 18px;color:#fff;}

#paage-content {margin-top:60px;}
#paage-content p, #paage-content li {font-size:14px; line-height: 25px;}
#paage-content li {margin-left:12px;}

#content-container-thm {float:left;width:100%;padding: 80px 0 80px;}
#content-container-trhm {float:left;width:100%;margin-top: -35px;padding: 80px 0 80px;background:url('img/grey-bg2.png') no-repeat top left;background-size: cover;}

.service-cc 	{float: left;width:100%;position: relative;}
.service-cc img {float: left;width:100%;height: auto;position: relative;}
.service-cc img:hover {opacity: 0.9;}
.scc-content    {position: absolute;width:100%;box-sizing: border-box;padding: 0 5%; bottom: 0;color:#fff;}
.scc-content h3
.scc-content p  {font-size: 13px !important; line-height: 18px !important; margin-bottom: 20px !important;}
.scc-content a  {float: left;width:100%;box-sizing: border-box;padding:10px 20px;background:#ab449d url('img/wtr-img.png') no-repeat top 15px right 18px;color:#fff;border-radius: 20px;}
.scc-content a:hover  {background:#177966 url('img/wtr-img.png') no-repeat top 15px right 18px;}

/*inner pages*/
#page-box {float: left;width: 100%;padding: 50px 0;}
#page-content {float: left;width: 100%;}
.page-content-left {float: left;padding-right: 5%;box-sizing: border-box;width:45%;}
.page-content-left img {width: 100%;height: auto;border-radius: 4px;}
.page-content-right {float: right;width: 55%;}

.post-template-single-blog .ph-image img {float: left;width: 140%;}
.post-template-single-blog #page-header h1 {box-sizing: border-box;padding: 0 10% 20px 10%;font-size: 36px;line-height: 42px;}
.post-template-single-blog .ph-img {margin-top: 30px;}
.postbox-inner {float:left;width:100%;}
.postbox-info  {float:left;width:100%;margin-bottom: 30px;}
.postbox-info-inner, .postbox-pic, .postbox-pic img {float:left;width:100%;}
.postbox-pic {height: 200px;overflow: hidden;margin-bottom: 20px;border-radius: 10px;}
.postbox-pic img {height:auto;}
.postbox-info-inner h4 {font-size: 20px;margin: 0;line-height: 27px;display: -webkit-box;max-width: 100%;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;}
li.postbox a {color:#18765C;}
li.postbox a:hover {color: #932A7C;}
.postbox-info-inner p {font-size:14px;}
.news-post img {float: left;padding:0 28px 28px 0;}

#page-header figure {margin:0;}
li.postbox {list-style:none;display:inline-block;width:47%;}
li.postbox:nth-child(2n) {float:right;}

#post-header {float:left;width:100%;position:relative;height:300px;
background: rgb(24,118,92);
background: -moz-linear-gradient(90deg, rgba(24,118,92,1) 0%, rgba(0,0,0,1) 100%);
background: -webkit-linear-gradient(90deg, rgba(24,118,92,1) 0%, rgba(0,0,0,1) 100%);
background: linear-gradient(90deg, rgba(24,118,92,1) 0%, rgba(0,0,0,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#18765c",endColorstr="#000000",GradientType=1);}

#post-header .ph-img {margin-top: 30px;}
.pft-box, .pft-img {float:left;width:100%;position:relative;height:333px;}
.pft-img img {float:left;width:100%;}
.pft-txt {position:absolute;top: 10%;width:100%;}
.pft-txt h2 {font-size: 32px;text-align: center;font-weight: normal;line-height: 40px;margin-bottom: 40px;}
.pft-btns {float:left;width:100%;}
.pftbl {float:left;}
.pftbr {float:right;}
.pftbl, .pftbr {width:45%;}
.pftbl a, .pftbr a {border-radius:20px;color:#fff;float: left;width:100%;box-sizing: border-box;padding:10px 20px;}
.pftbl a {background:#ab449d url('img/wtr-img.png') no-repeat top 15px right 18px;}
.pftbr a {background:#177966 url('img/wtr-img.png') no-repeat top 15px right 18px;}
.pftbl a:hover {background:#7B0662 url('img/wtr-img.png') no-repeat top 15px right 18px;}
.pftbr a:hover {background:#004A36 url('img/wtr-img.png') no-repeat top 15px right 18px;}

/*Footer*/
#footer {float: left;width:100%;padding:50px 0;}
.ft-one {float: left;width:30%;}
.ft-one p {font-size: 13px;line-height: 20px;}
.ft-one ul {float: left;width:100%;}
.ft-one ul li {float: left;width:100%;box-sizing: border-box;list-style: none;line-height: 30px;padding-left:34px;font-size: 14px;}
.ft-one ul li:first-child {background: url('img/email-icon.png') no-repeat top 5px left;}
.ft-one ul li:last-child {background: url('img/ephone-icon.png') no-repeat top 5px left;}

.ft-two {float: left;width:50%;box-sizing: border-box;padding: 0 10%;}
.ft-two ul {float: left;width:100%;padding: 0;margin: 0;}
.ft-two ul li {float: left;width: 50%;box-sizing: border-box;}
.ft-two ul li {display: inline-block;background: url('img/dark-dot.png') no-repeat top 12px left; padding-left: 16px;line-height: 30px;}
.ft-three  {float: right;width:20%}
.ft-three li {float: left;list-style: none;background: url('img/linkedin.png') no-repeat top 2px left;padding-left: 30px;}
.ft-three p  {margin-top: 38px;}
.ft-three p a {border: 1px solid #ccc;border-radius: 20px;padding: 6px 114px 6px 14px;background: url('img/gr-img.png') no-repeat top 11px right 14px;background-size: auto;}
.ft-three p a:hover {border: 1px solid #ab449d;background: #ab449d url('img/wtr-img.png') no-repeat top 11px right 14px;color:#fff;}

#post-footer {float: left;padding:10px 0;width: 100%;color:#868686;background:#EAEAEA;font-size: 12px;}
#post-footer a {color:#868686;}
#post-footer a:hover {color:#ab449d;}
.pf-left, .pf-right {padding:8px 0 4px;}
.pf-left   {float: left;width: auto;}
.pf-right  {float: right;width: auto;}



/*==========================================================================================================================
CONTACT FORM
============================================================================================================================*/

.wpcf7-form-control-wrap input[type="text"]  {float: left;width: 100%;box-sizing: border-box;padding: 10px 20px;border: 1px solid #b2b2b2;outline: none;margin-bottom: 10px;border-radius: 20px;}
.wpcf7-form-control-wrap input[type="email"] {float: left;width: 100%;box-sizing: border-box;padding: 10px 20px;border: 1px solid #b2b2b2;outline: none;margin-bottom: 10px;border-radius: 20px;}
.wpcf7-form-control-wrap input[type="tel"] {float: left;width: 100%;box-sizing: border-box;padding: 10px 20px;border: 1px solid #b2b2b2;outline: none;margin-bottom: 10px;border-radius: 20px;}
.wpcf7-textarea {float: left;width: 100%;box-sizing: border-box;padding: 10px 20px;font-family: 'Poppins',sans-serif;height:122px;border: 1px solid #b2b2b2;outline: none;margin-bottom: 10px;border-radius: 20px;}
.wpcf7-submit {margin-top:20px;float: left;width:100%;padding: 12px 20px;border: 0;background:#932A7C;cursor:pointer;color: #fff;font-family: 'Poppins';font-weight: 900;outline: none;border-radius: 20px;}
.wpcf7-submit:hover {background:#177966;}

/*===========================================================================================================================
mobile styles
===========================================================================================================================*/

@media (max-width:1024px) {
	#wrapper {width: 90%;}
	#wrapper2 {width: 95%;}
	h2 {font-size: 28px;}
	p {font-size: 13px;line-height: 20px;}
	#hmenu-desktop, #hmenu-mobile {margin-top: -6px;}
	.ft-three p a {padding: 7px 14px;float: left;width: 100%;box-sizing: border-box;}
	.scc-content a {font-size: 13px;}
	.ph-img {margin-top: 130px;}
	.bbox-left img, .bbox-right img {width: 200%;max-width: 200%;float: left;height: 400px;}
	.bbox-left .pp-btn, .bbox-right .pp-btn {width:90%;}
	.single .ph-image img {width: 125%;max-width: 200% !important;}
	.pft-box, .pft-img {height: 340px;overflow: hidden;}
	.pft-img {max-width:200%;width:150%;}
}
@media (max-width:1000px) {
	.ft-three {float: right;width: 21%;}
	.ft-two {width: 49%;padding: 0 5%;}
}

@media(max-width:800px){
   h2 {margin-top: 0;} 
   #page-wrapper {width: 86%;}
   .ph-img {margin-top: 100px;}
   #page-header {min-height: auto;}
   .bbox-left, .bbox-right {height:auto;}
    p {font-size: 16px;line-height: 24px;}
    .process-box li {font-size: 12px;height: 85px;margin-bottom: 8px !important;}
    .pft-img img {width: 120%;max-width: 250%;}
    .pft-txt {top: 25%;}
    .single .ph-image img {width: 160%;}
}



@media(max-width:768px){
    .ph-img {margin-top: 90px;}
    .big-text p {font-size: 18px;line-height: 30px;margin-bottom: 26px !important;}
}

@media(max-width:736px){
	#for-desk, .ph-img {display: none;}
	.category .ph-img, .single .ph-img {display: block !important;margin-top: 20px;}
	.left-content-box, .right-content-box {padding: 0;float:left;}
	#bottom-box {float: left;width: 90%;margin: 5%;}
	.bbox-left img, .bbox-right img {width: 100%;max-width: 200%;float: left;height: 300px;}
	.single .ph-image img {width: 170%;}
}

@media (max-width:600px) {
	.ft-one, .ft-two, .ft-three {float: left;width:100%;padding: 0; margin-bottom: 10px;}
	.page-content-left {display: none;}
	.page-content-right {float: left; width:100%;}
	.pft-img img {width: 160%;max-width: 300%;}
	.pft-txt h2 {font-size: 26px;line-height: 35px;}
	.pftbl a, .pftbr a {font-size: 13px;padding: 13px 20px;}
	.single .ph-image img {width: 212%;max-width: 300% !important;}
	.postbox-pic {height: 140px;}
	.postbox-info-inner h4 {font-size: 13px;line-height: 20px;}
	.postbox-info {margin-bottom: 20px;}
}

@media (max-width:450px) {
    #page-wrapper {width: 84%;}
	.hlogo img {width: 125px;height: auto;}
    .pf-right {float: left;padding-top: 0;width: auto;} 
    #page-header h1 {font-size: 28px;line-height: 30px;}
    .big-text p {font-size: 16px;line-height: 24px;}
    .bbox-left img, .bbox-right img {height: 320px;width: 120%;}
    .pft-img img {width: 220%;}
    .pft-txt {top: 15%;}
    .pft-txt h2 {font-size: 20px;line-height: 30px;font-weight: bold;margin-bottom: 30px;}
    .pftbl, .pftbr {width: 100%;float: left;}
    .pftbl {margin-bottom: 20px;}
    .sprofile-info-inner h4 {font-weight:normal;font-size: 14px;}
    li.postbox {height: 158px;margin-bottom: 20px;}
    #pagination {float: left;width: 100%;margin-top: 30px;}
    .single .ph-image img {width: 300%;max-width: 300% !important;}
    .postbox-pic {height: 100px;margin-bottom: 10px;}
    .news-post img {float: left;padding: 0 0 30px 0;width: 100%;}
    .post-template-single-blog .pagehe {top: 20%;}
}

@media(max-width:414px){
    .process-box li {width: 47%;font-size:13px;}
    .process-box li:nth-child(2), .process-box li:nth-child(5) {margin: 13px 0;}
    .process-box li:nth-child(2n) {float:right;}
    p {font-size: 14px;}
    .dst-l, .dst-r {width: 100%;float: left;}
    .dst-inner, .dst-inner2, .dst-inner3 {min-height:100px;}
    .bbox-left img, .bbox-right img {width:200%;border-radius: 0;}
}

@media (max-width:360px) {
    p {font-size: 13px;line-height: 18px;}
    .big-text p {font-size: 14px;line-height: 24px;}
    p {font-size: 13px;line-height: 22px;}
    .process-box li {width: 100%;height: auto;font-size: 14px;min-height: auto;margin-bottom: 0 !important;}
    .pft-img img {width: 260%;}
    .pft-txt h2 {font-size: 18px;line-height: 22px;margin-top: 12px;}
    .bbox-left .pp-btn, .bbox-right .pp-btn {width: 76%;}
    .single .ph-image img {width: 400%;max-width: 400% !important;}
}

@media(max-width:320px){
    .hlogo img {width: 86px;margin-top: 7px;}
    .ph-image img {width: 125%;max-width: 200%;}
}
