@font-face {font-family: 'RalewayRegular';src: url('/images/TNT_202/RalewayRegular.eot');src: url('/images/TNT_202/RalewayRegular.eot') format('embedded-opentype'), url('') format('woff2'), url('') format('woff'), url('') format('truetype'), url('/images/TNT_202/RalewayRegular.svg') format('svg');} @font-face {font-family: 'RalewayMedium';src: url('/images/TNT_202/RalewayMedium.eot');src: url('/images/TNT_202/RalewayMedium.eot') format('embedded-opentype'), url('') format('woff2'), url('/images/TNT_202/RalewayMedium.woff') format('woff'), url('') format('truetype'), url('/images/TNT_202/RalewayMedium.svg') format('svg');} body {font-size: 14px;line-height: 22px;margin: 0;padding: 0;} .navbar-inverse {background: none;border:none;} .navbar {margin: 0px;} .navbar-inverse .navbar-toggle .icon-bar {background-color: #f8b71f;} .navbar-nav > li > a {padding:0px;} .navbar-header {display: block;} .navbar-inverse .navbar-brand {display: none;} .navbar {min-height: auto;} .navbar-collapse {border-top: none;} a:active, a:hover {outline: none !important;} .fa.fa-check-square-o {padding-right: 3px;} .logo img {display: inline;padding-bottom: 5px;padding-top: 10px;width: 34%;} .menuH ul li a {color: #fff !important;} .headercontainer {float: left;width: 100%;background:url('/images/TNT_202/Header.jpg');} .menucontainer {float: left;width: 100%;background: #2d2d2d;} .menuH {float: left;width: 100%;} .modal-dialog {line-height: 40px;margin: 30px auto;width: 1043px;} .procontant ul li {list-style: none !important;width: 100%;float: left;text-align: left;} .procontant ul {float: left;padding: 0px !important;min-height: 93px;} .procontant ul li {list-style: none !important;} .procontant ul li a {float: left !important;color: #000 !important;} .menuH ul{margin: 0px;padding: 0px;display: table;margin: 0px auto;float: none;} .bottomlinks a {color: white;} a {text-decoration: none !important;} .menuH ul li {list-style: none;float: left;text-decoration: none;padding: 0px 0px;} .menuH ul li a {float: right;font-size: 18px;padding: 14px 21px 27px;text-transform: uppercase;margin-bottom: -14px;text-align: center;font-family: 'RalewayRegular';margin-left: 4px;} .menuH ul li.selected a {background: url("/images/TNT_202/menuselect.png");background-repeat: no-repeat;background-size: 100% 100%;background-position: center top;} .menuH ul li a:hover{background: url("/images/TNT_202/menuselect.png");background-repeat: no-repeat;background-size: 100% 100%;background-position: center top;} .maindiv {float: left;width: 100%;background: #fff;} .logo {font-size: 42px;text-align: center;} .banner{float:left;width:100%;} .banner img{float:left;width:100%;} .servicecontainer {float: left;width: 100%;padding-bottom: 75px;} .services {float: left;width: 100%;} .servicehead {float: left;width: 100%;text-align: center;text-transform: uppercase;font-size: 35px;} .servicecap {float: left;width: 100%;text-align: center;font-size: 18px;padding-bottom: 50px;} hr {margin-top: 20px;margin-bottom: 3px;border: 0;border-top: 1px solid #eee;width: 89px;display: inline-block;} .service {float: left;width: 100%;} .ser {border: 10px solid #f6b61e;border-radius: 50%;text-align: center;width: 260px;height: 250px;padding: 15px;display: block;margin: auto;} .serin {float: left;border: 2px solid #f6b61e;border-radius: 50%;text-align: center;width: 210px;height: 200px;align-items: center;} .serimg {float: left;width: 100%;padding-top: 60px;} .serimg img {height: 50px;width: 50px;} .bottomlinks {margin: 0 auto;text-align: center;width: 100%;} .middle {background-color:#6A3231;margin: 0 auto;} .link {float: left;width: 100%;} .serhead {float: left;width: 100%;padding-top: 12px;font-size: 18px;} .welcomecontainer {float: left;width: 100%;background-color: #bb3131 !important;padding: 50px 0px;background: url("/images/TNT_202/Background.jpg") no-repeat;background-size: 100% 100%;background-attachment: fixed;} .welcome {float: left;width: 100%;padding: 35px;color: #fff;background: rgba(47, 58, 103, 0.73);} .welhead {float: left;width: 100%;text-align: center;font-size: 30px;text-transform: uppercase;margin-bottom: 20px;} td, th {border: 1px solid;padding: 0;text-align: center;} th {text-align: center;} .welhead span {float: left;width: 100%;padding-top: 15px;font-size: 45px;} .welicon {float: left;width: 100%;text-align: center;padding-top: 15px;display: none;} .welcontant {float: left;width: 100%;text-align: center;padding: 15px 0px 30px 0px;} .readmore {float: left;width: 100%;text-align: center;padding: 15px 0px;} .readmore a {text-align: center;background: #ffbc00;padding: 8px 24px;border-radius: 20px;text-decoration: none;color: #fff;text-transform: capitalize;} .projectcontainer {float: left;width: 100%;padding: 30px 0px;} .project {float: left;width: 100%;padding-top: 15px;} .prohead {float: left;width: 100%;text-align: center;font-size: 35px;text-transform: uppercase;padding-bottom: 30px;} .pro:hover {border: 3px solid #2d2d2d;} .ser:hover .sername {color: #fff;} .ser:hover .serread a {background: #0298bd;} .proicon {float: left;width: 100%;text-align: center;font-size: 18px;padding-bottom: 45px;} .pro {float: left;width: 100%;border: 3px solid #fff;} .proimg {float: left;width: 100%;} .proimg img {float: left;width: 100%;} .prod {float: left;width: 100%;background: #f3eded;height: 182px;} .prodetails {float: left;position: relative;background: #fff;top: -68px;margin: 12px;padding: 15px;} .prodhead {float: left;width: 100%;text-align: left;text-transform: uppercase;font-size: 20px;padding: 15px 0px;} .procontant:hover ul li a {color: #fff !important;text-decoration: none !important;} .knowmore {float: left;width: 100%;text-align: center;text-align: right;} .knowmore a {color: #fff;background: #2d2d2d;padding: 7px 16px;} .procontant {float: left;width: 100%;padding: 0px 19px 15px 19px;min-height: 158px;} .pro:hover .prodetails {background: #2d2d2d;color: #fff;} .footer {float: left;width: 100%;text-align: center;color: #fff;padding: 16px 0px;background: #000;} .footer a{text-decoration: none;font-size: 15px;padding: 0px 5px;color: #fff;} @media(min-width:320px) and (max-width:399px){.menuH ul li {float: right;padding: 0px 3px;margin-bottom: 2px;width: 100%;} .menuH ul li.selected a {background: #f8b71f;width: 100%;text-align: right;} .menuH ul li a:hover {background: #f8b71f !important;width: 100%;text-align: right;} .menuH ul li a {font-size: 14px;padding: 14px 21px 10px;margin-bottom: 0px;} .logo img {padding: 15px;width: 100%;} .pro:hover {border: 3px solid #FFBC00;} .pro {float: left;width: 100%;margin-bottom: 15px;} .servicehead {font-size: 22px;} .prod {height: auto;margin-bottom: 25px;margin-bottom: 0px;} .servicecap {font-size: 16px;padding-bottom: 40px;} hr {width: 50px;} .service {margin-bottom: 30px;} .welhead span {font-size: 30px;} .welhead {font-size: 20px;} .prodetails {position: initial;} .welicon {padding-top: 10px;} .welcome {padding: 0px;} .procontant {text-align: justify;padding: 0px;} .welcontant {text-align: justify;padding: 15px 0px;}} @media(min-width:400px) and (max-width:480px){.menuH ul li {float: right;padding: 0px 3px;margin-bottom: 2px;width: 100%;} .menuH ul li.selected a {background: #f8b71f;width: 100%;text-align: right;} .menuH ul li a:hover {background: #f8b71f !important;width: 100%;text-align: right;} .menuH ul li a {font-size: 14px;padding: 14px 21px 10px;margin-bottom: 0px;} .pro:hover {border: 3px solid #FFBC00;} .pro {float: left;width: 100%;margin-bottom: 15px;} .prod {height: auto;} .prodetails {position: initial;} .menuH ul li a {padding: 16px 0px;margin-bottom: 5px;width: 131px;height: auto;} .menuH ul li.selected a {background: #f8b71f;} .menuH ul li a:hover {background: #f8b71f !important;} .logo img {padding: 15px;width: 100%;} .servicehead {font-size: 22px;} .servicecap {font-size: 16px;padding-bottom: 40px;} hr {width: 50px;} .service {margin-bottom: 30px;} .welhead span {font-size: 30px;} .welhead {font-size: 20px;} .welicon {padding-top: 10px;} .welcome {padding: 0px;} .welcontant {text-align: justify;padding: 15px 0px;}} @media(min-width:481px) and (max-width:639px){.menuH ul li a {margin-bottom: 5px;}} @media(min-width:640px) and (max-width:767px){.menuH ul {float: right;width: 110px;} .logo img {width: 250px;} .menuH ul li {float: right;padding: 0px 3px;margin-bottom: 2px;width: 100%;} .menuH ul li.selected a {background: #f8b71f;width: 100%;text-align: right;} .menuH ul li a:hover {background: #f8b71f !important;width: 100%;text-align: right;} .menuH ul li a {font-size: 14px;padding: 14px 21px 10px;margin-bottom: 0px;} .prod {} .menuH ul li.selected a {background: #f8b71f;} .menuH ul li a:hover {background: #f8b71f !important;} .logo img {padding: 15px;} .servicehead {font-size: 22px;} .servicecap {font-size: 16px;padding-bottom: 40px;} hr {width: 50px;} .service {margin-bottom: 30px;} .welhead span {font-size: 30px;} .welhead {font-size: 20px;} .welicon {padding-top: 10px;} .welcome {padding: 0px;} .welcontant {text-align: justify;padding: 15px 0px;}} @media(min-width:768px) and (max-width:991px){.menuH ul li a {font-size: 14px;padding: 21px 0px;width: 110px;} .service {margin-bottom: 35px;} .servicecontainer {padding-bottom: 35px;} .menuH ul li {padding: 0px 2px;} .procontant {text-align: justify;padding: 0px;} .prodhead {font-size: 18px;padding: 15px 0px;} .menuH ul {float: right;} .pro:hover {border: 3px solid #FFBC00;} .pro {float: left;width: 100%;margin-bottom: 15px;} .prod {height: auto;margin-bottom: 25px;margin-bottom: 0px;} .prodetails {position: initial;} .logo img {padding: 15px;width: 294px;}} @media(min-width:992px) and (max-width:1200px){.menuH ul li a {font-size: 16px;padding: 22px 0px;width: 145px;} .prod {height: 218px;} .procontant {padding: 0px;} .service {margin-bottom: 35px;} .servicecontainer {padding-bottom: 35px;} .menuH ul li {padding: 0px 2px;} .pro:hover .prodetails {padding: 14px;} .menuH ul {float: right;} .logo img {padding: 15px;width: 294px;}} Below one is optional @media (min-width:1201px) and (max-width:1650px){}img{border:0px;padding:0px;}p {margin: 0px 0px 3px 0px;padding: 0px 0px 0px 0px;}a.footline{color: #808080;text-decoration: none;font-size:11px;color: #808080;} a.footline:hover{color: #808080;text-decoration: underline;font-size:11px;color: #808080;}