@charset "utf-8";
/* CSS Document for Go-Jamaica Serices Page */
@font-face { 
font-family: Jenna Sue; 
src: url('../fonts/JennaSue.ttf');
}
@font-face { 
font-family: Helvetica LT; 
src: url('../fonts/Helvetica LT Light.ttf');
}

html, body {
	margin: 0px;
	padding: 0px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 15px;
}

div {
	box-sizing: border-box;
}

a {
	text-decoration: none;
	color: #000;
}

a:hover {
	text-decoration: underline;
}

/* remember to define focus styles! */
:focus {
outline: 0;
}

img {
	width: 100%;
	height: auto;
}

input {
	outline: none;
}

h1, h2, h3, h4, h5, h6 {
	text-transform: uppercase;
	font-family: 'Arial Black', Helvetica, sans-serif;
	font-weight: 900; /*firefox fix*/
	margin: 0px;
}

h1 {
	font-size: 90px;
	margin: 0px;
}

h3 {
	font-size: 40px;
	margin: 0px;
}

h4 {
	font-size: 30px;
}

h6 {
    width: 25%;
    margin: -24px auto 60px auto;
    font-size: 20px;
    text-transform: capitalize;
    font-family: 'Arial Bold', Helvetica, sans-serif;
    background: #fff;
    /* border: 1px solid; */
}

h6.gsuite {
	width: 35%;
}

hr {width:50%;height:1px;border-width:0;}

p {
	line-height: 1.5;
}

div.row {
	width: 100%;
	max-width: 1440px;
	height: auto;
	position: relative;
	overflow: hidden;
	padding: 0px 40px;
	margin: 20px auto;
}

.full {
	max-width: 100% !important;
	padding: 0px !important;
}

div.left {
	float: left;
}

div.right {
	float: right;
}

div.col-3.hidden a{
	display:none;
} 

div.col-3 {
	width: 33.3%;
	height: auto;
	float: left;
	padding: 5%;
	text-align: center;
	border: px solid #000;
	box-sizing: border-box;
}

div.col-3 a {
	display: block;
	font-family: "Arial", Helvetica, sans-serif;
	font-size: 13px;
	font-weight: bold;
	text-transform: uppercase;
    letter-spacing: 3px;
    margin: 0px auto;
    border: 1px solid #000;
    padding: 20px;
}


div.wrapper {
	width: 100%;
	height: auto;
	overflow: hidden;
	position: relative;
	margin: 0px auto;
	border: px solid #000;
}

/* top menu styles */

div.mini-nav {
	width: 100%;
	height: auto;
	color: #fff;
	float: left;
	position: relative;
	background: #000;
	padding: 3px 12px;
}

div.mini-nav div.row {
	margin: 0px auto;
}

div.mini-nav div.left {
	width: 50%;
	height: auto;
	float: left;
	font-size: 20px;
}

div.mini-nav div.right {
	width: 50%;
	height: auto;
	float: right;
	font-size: 13px;
	text-align: right;
	line-height: 1.8;
}

div.mini-nav a {
	color: #fff;
}


/* main menu styles */

div.nav {
	width: 100%;
	height: auto;
	color: #000;
	float: left;
	position: relative;
}

div.nav div.left {
	width: 25%;
	height: auto;
	float: left;
	font-size: 16px;
	padding-left: 4%;
}
div.nav div.left a img {
	max-width: 250px;
}

div.nav div.right {
	width: 75%;
	height: auto;
	float: right;
	text-align: right;
	padding: 3% 0px;
	padding-right: 4%;
}

div.nav div.right a {
	color: #000;
	padding: 5px 0px;
	/*font-weight: bold;*/
	text-align: center;
	text-transform: uppercase;
	text-decoration: none;
	margin: 0px 30px;
	font-family: 'Arial Black', Helvetica, sans-serif;
	font-weight: 900; /*firefox fix*/
}

div.nav div.right.desktop div.dropdown a {margin-right: 0px !important;}

div.nav div.right a:last-child {
	margin-right: 0px;
}

div.nav div.right a.specials {
	font-size: 33px;
	font-weight: bold;
	text-transform: capitalize;
	font-family: Jenna Sue;
}

div.nav div.right a.active {
	border-bottom: 3px solid #000;
}

div.nav div.right a:hover, div.nav div.right a.active {
	border-bottom: 3px solid #000;
}

i.fa.fa-sort-desc {
    vertical-align: top;
    margin: 0px 30px 0px 5px;
}

.dropdown {
    position: relative;
    display: inline-block;
}

.dropdown-content {
    display: none;
	min-width: 200px;
    position: absolute;
    /*background-color: #000;*/
	background-color: rgba(0, 0, 0, 0.8);
	z-index: 99999;
	overflow: hidden;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    padding: 12px 16px;
}

.dropdown-content ul {
	list-style: none;
	margin: 0px;
	padding: 0px;
}

.dropdown-content ul li {
	display: block;
	text-align: left;
	margin: 8px 0px 8px 10px;
}

.dropdown-content ul li a {
	font-size: 15px !important;
	text-align: left !important;
	margin: 0px !important;
	color: #fff !important;
	border: none !important;
	text-transform: capitalize !important;
	font-family: 'Arial Black', Helvetica, sans-serif !important;
}

.dropdown-content ul li a:hover {text-decoration: underline !important;}

.dropdown:hover .dropdown-content {
    display: block;
}

/* slider styles */

div.slider-main {
	width: 100%;
	height: auto;
	color: #000;
	float: left;
	position: relative;
	border: px solid;
}

.slider{
	position:relative;
	width:100%; 
/*	height:400px; when responsive, comment this out */
	margin:0 auto;
}

.heading {
	font-size: 100px;
	text-transform: uppercase;
	font-family: 'Arial Black', Helvetica, sans-serif;
	font-weight: 900; /*firefox fix*/
}

.heading-sub {
	font-size: 67px;
	text-transform: uppercase;
	font-family: 'Arial Black', Helvetica, sans-serif;
	font-weight: 900; /*firefox fix*/
}

.sub-text {
	padding-bottom: 7px;
	border-bottom: 2px solid #000;
}

.blurb {
	font-size: 18px !important;
    font: bold;
    width: 600px;
    line-height: 1.6 !important;
}

.sub-text a {
	color: #000;
}

.sub-text a:hover {
	text-decoration: none;
}

div.scrolling-livechat-box {
    display: block;
    position: fixed;
    z-index: 9999;
    /* top: 660px; */
    bottom: 50px;
    right: 15px;
    width: 90px;
    height: 90px;
    text-align: center;
}

div.livechat-box {
	display:block;
	float: left;
	width: 100%;
	max-width: 151px;
	height: auto;
}

/* About us styles */

div.about {
	width: 100%;
	height: auto;
	color: #fff;
	float: left;
	position: relative;
	background: #000;
}

div.about span {
	width: 25%;
	height: auto;
	float: left;
	padding: px;
	margin: 0px 4%;
	border: px solid #fff;
}

div.about span:first-child {
	text-align: justify;
}

div.about span:first-child a {
	color: #fff;
	padding-bottom: 5px;
	border-bottom: 1px solid #fff;
}

div.about span:first-child a:hover {
	text-decoration: none;
}

div.about span:nth-child(2) p {
	text-align: center;
	line-height: 1;
	margin-top: 0px;
}

div.about span:nth-child(3) p {
	text-align: center;
	margin-top: 214px;
}

div.about span:nth-child(3) p a {
	color: #ffb400;
	font-size: 45px;
	font-family: Jenna Sue;
	vertical-align: middle;
	text-decoration: none;
	padding-bottom: 6px;
	border-bottom: 3px solid #fff;
}

/* web development styles*/

div.web {
	width: 100%;
	height: auto;
	color: #fff;
	float: left;
	position: relative;
	text-align: center;
	background: url('../images/web-bg.jpg') #fff no-repeat top center;
	background-size: cover;
	 
}
div.web p {
	max-width: 700px;
	text-align: justify;
	line-height: 2;
	margin: 0px auto 80px;
	color: #000;
}


div.web h1 {
	color: #000;
	font-size: 90px;
	margin: 0px;
}

div.web hr {
	color: #000;
	background: #000;
}

div.web div.left {
	width: 50%;
	height: auto;
	color: #000;
	text-align: left;
	padding-left: 9%;
}

div.web div.left h2 {
	text-align: left;
	text-transform: capitalize;
	clear: both;
	margin-top: 40px;
}

div.web div.left p {
	/*margin: 0px 0px 40px;*/
}

div.web div.right {
	width: 50%;
	height: auto;
	color: #000;
	text-align: right;
	padding-right: 9%;
}

div.web div.right p {
	margin: 40px 0px 20px;
}

div.web div.right p a {
	color: #2599f8;
	text-decoration: none;
	padding-bottom: 5px;
	border-bottom: 3px solid #000;
}

div.web h6 {
    color: #2599f8;
}

div.web span img {
	max-width: 1114px;
}

/*graphic styles*/

div.graphic {
	width: 100%;
	height: auto;
	color: #fff;
	float: left;
	position: relative;
	text-align: center;
	/*background: url('../images/graphic-bg.jpg') #fff no-repeat top center;
	background-size: cover;*/
	
	background: rgb(122,120,119);
	background: -moz-linear-gradient(left,  rgb(122,120,119) 0%, rgb(183,183,183) 50%, rgb(122,120,119) 100%);
	background: -webkit-linear-gradient(left,  rgb(122,120,119) 0%,rgb(183,183,183) 50%,rgb(122,120,119) 100%);
	background: linear-gradient(to right,  rgb(122,120,119) 0%,rgb(183,183,183) 50%,rgb(122,120,119) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7a7877', endColorstr='#7a7877',GradientType=1 );
 
}

div.graphic  h1 {
	color: #000;
	font-size: 90px;
	margin: 0px;
}

div.graphic  hr {
	width: 45%;
	color: #000;
	background: #000;
}

div.graphic  div.left {
	width: 71%;
	height: auto;
	color: #000;
	text-align: left;
	/*padding-left: 9%;*/
	/*padding-left: 20%;*/
	border: px solid #000;
	background: url('../images/graphic-social-links-bg.png') no-repeat -11px 90px;
}

div.graphic div.tablet-holder {
	width: 100%;
	max-width: 522px;
	height: auto;
	float: right;
	position: relative;
	padding-bottom: 60px;
	border: px solid #000;
	background: url('../images/tablet-bg.png') no-repeat top center;
	background-size: contain;
}

/*div.graphic div.tablet-holder img {
	width: 100%;
	max-width: 536px;
	height: auto;
}*/

div.graphic div.tablet-slider {
    width: 100%;
    max-width: 483px;
    height: auto;
    /* border: 1px solid #000; */
    padding: 32px 0px 84px 58px;
    background: url('../images/tablet.png') no-repeat top center;
    background-size: contain;
    margin: 35px 32px 0px auto;
}

div.graphic div.tablet-slider img {
	width: 100%;
	max-width: 368px;
	height: auto;
	cursor: pointer !important;
}

div.graphic  div.right {
	width: 29%;
	height: auto;
	color: #000;
	text-align: right;
	margin-top: 155px;
	/*padding-right: 9%;*/
	border: px solid #000;
}

div.graphic  div.right p {
	margin: 40px 0px 20px;
}

div.graphic  div.right p:first-child {
	text-align: justify;
	line-height: 1.8;
	font-weight: 500;
}

div.graphic  div.right p:last-child {
	max-width: 112px;
    color: #fff;
    border: px solid;
    text-align: left;
    float: right;
}

div.graphic  div.right p:last-child img {max-width: 61px;vertical-align: middle;float: left;}
div.graphic  div.right p:last-child span {margin-top: 5px;padding: 12px 0px;display: flex;}

div.graphic  div.right p a {
	color: #dcfb07;
	text-decoration: none;
	padding-bottom: 5px;
	border-bottom: 3px solid #000;
}

div.graphic  h6 {
    color: #dcfb07;
	margin-bottom: 40px;
	/*background: #b1b1b1;*/
	background: #a8a8a8;
background: -moz-linear-gradient(left,  #a8a8a8 0%, #B7B7B7 50%, #a8a8a8 100%);
background: -webkit-linear-gradient(left,  #a8a8a8 0%,#B7B7B7 50%,#a8a8a8 100%);
background: linear-gradient(to right,  #a8a8a8 0%,#B7B7B7 50%,#a8a8a8 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a8a8a8', endColorstr='#a8a8a8',GradientType=1 );

}

div.graphic  span img {
	max-width: 1114px;
}

/*advertising styles*/

div.advert {
  width: 100%;
  height: auto;
  float: left;
  position: relative;
  text-align: center;
  background: url('../images/advert-bg.png') #fff no-repeat top center;
  background-size: cover;
}
div.advert div.row,  div.advert span{
	margin-bottom: -3px;
	padding-bottom: 0px;
}

div.advert hr {
	color: #000;
	background: #000;
}

div.advert h6 {
	background: #ffaf00;
}

div.advert p {
	max-width: 700px;
	text-align: justify;
	line-height: 2;
	margin: 0px auto 80px;
}

div.advert span img {
	max-width: 1014px;
}

/*web hosting styles*/

div.web-h {
	width: 100%;
  	height: auto;
  	float: left;
 	position: relative;
  	text-align: center;
  	background: url('../images/web-h-bg.jpg') #fff no-repeat top center;
  	background-size: cover;
}

div.web-h hr {
	color: #000;
	background: #000;
}

div.web-h h6 {
	color: #ff0000;
	background: #fff;
}

div.web-h div.left {
	width: 50%;
	float: left;
	text-align: center;
	padding-left: 15%;
}

div.web-h div.left img {
	max-width: 372px;
}

div.web-h div.right {
	width: 50%;
	float: right;
	padding-right: 15%;
}

div.web-h div.right p {
	text-align: justify;
	line-height: 2;
}

div.web-h div.web-h-links {
	width: 100%;
	height: auto;
	float: left;
	padding: 10px 15%;
}

div.s-email {
	background:url('../images/email-img.png') no-repeat center 80px, #febb24;
	background-size: contain;
	width: 100%;
	height: auto;
	display: block;
	float:left;
	overflow: hidden;
}

div.e-email {
	background:url('../images/email-img.png') no-repeat center 95px, #3e8ae8;
	background-size: contain;
	width: 100%;
	height: auto;
	display: block;
	float:left;
	overflow: hidden;
}

div.e-email.gsuite {
	background:url('../images/g-email-img.png') no-repeat center 95px, #fff;
}

div.s-email h2{font-size:44px;text-align:center;margin-bottom:300px;}
div.e-email h2{font-size:44px;color:#fff;text-align:center;}
div.e-email.gsuite h2{color: #3e8ae8;}
div.e-email p{font-size:25px;text-align:center;margin-bottom:300px;margin-top:0px;font-weight:bold;text-transform:uppercase;letter-spacing:2px;}
div.e-email p.gsuite{margin-bottom: 350px;}

ul.grey-bar {
	width: 100%;
    background: #424242;
    padding: 15px 20px;
    margin-bottom: 0px;
    color: #fff;
	float: left;
    list-style: none;
}

ul.grey-bar li {
    display: inline-block;
    width: 33%;
    text-align: center;
    font-size: 22px;
	box-sizing: border-box;
}


ul.email-details {
	padding: 15px 20px;
	list-style: none;
	padding: 15px 20px;
    list-style: none;
    margin: 10px 0px;
    float: left;
}

ul.email-details li {
    display: inline-block;
    width: 33%;
	padding: 10px 20px;
	box-sizing: border-box;
    text-align: center;
}
ul.email-details li img {width:100%;max-width:76px;text-align:center;}
ul.email-details li h6 {font-size:14px;margin:5px auto;}

div.master div.left ul li {margin:10px 0px;}
div.master div.left ul li a {font-size:14px;font-weight:900;}

div.master div.web-h-links {
	width: 100%;
	height: auto;
	float: left;
	padding: 10px 20%;
}

div.web-h div.web-h-links ul, div.master div.web-h-links ul {
	margin: 0px;
	padding: 0px;
	list-style: none;
}

div.web-h div.web-h-links ul li, div.master div.web-h-links ul li {
	display: inline-block;
	text-transform: uppercase;
	margin: 0px 0px;
	padding: 3px 30px;
	border-right: 1px solid #000;
}

div.web-h div.web-h-links ul li:last-child, div.master div.web-h-links ul li:last-child {
	border: none;
}

div.web-h div.web-h-links ul li a {color:#000;}

/*other professional services styles*/

div.others {
	width: 100%;
	height: auto;
	float: left;
	position: relative;
  	text-align: center;
  	background: url('../images/other-bg.jpg') #fff no-repeat top center;
  	background-size: cover;
}

div.others div.row {
	padding-top: 20px;
	padding-bottom: 20px;
}

div.others div.right {
	width: 60%;
	height: auto;
	text-align: center;
}

div.others div.right hr {
	color: #fff;
	background: #fff;
}

div.others div.right h3 {
	color: #fff;
}

div.others div.right h6 {
	margin-bottom: 10px;
	margin-top: 40px;
	background: none;
	color: #fff;
}

div.others div.right p {
	color: #fff;
	margin-bottom: 40px;
}

div.others div.right p a {
	color: #fff;
	text-decoration: none;
	text-transform: uppercase;
	vertical-align: bottom;
}

div#container2 {
	overflow: hidden;
	overflow-y: scroll;
	max-height: 500px;
}

div#container2.print-gleaner {
	overflow: auto !important;
	max-height: 100%;
}

/*contact styles*/

div.contact {
	width: 100%;
	height: auto;
	float: left;
	position: relative;
  	text-align: center;
  	background: url('../images/con-bg.jpg') #ccc no-repeat top center;
  	background-size: cover;
}

div.contactMsg {
    width: 100%;
    height: auto;
    float: left;
}

div.contact div.left {
	width: 60%;
	padding: 0px 10%;
	padding-top: 45px;
	border: px solid #000;
}

div.contact div.left hr {
	color: #fff;
	background: #fff;
}

div.contact div.left h6 {
	color: #fff;
	/*background: url('../images/contact-hr-bg.png') repeat-x 22px 3px;*/
	background: transparent;
	margin-top: 5px;
	text-shadow: 1px 1px #000;
	width: 100%;
}

div.contact div.left input[type='text'], div.master.other div.left input[type='text']{
	width: 45%;
	color: #000;
	padding: 5px;
	background: none;
	float: left;
	margin: 0px 0px 10px 0px;
	border: 2px solid #000;
}

div.contact div.left input[type='email'], div.master.other div.left input[type='email'] {
	width: 45%;
	color: #000;
	padding: 5px;
	background: none;
	float: right;
	margin: 0px 0px 10px 0px;
	border: 2px solid #000;
}
::-webkit-input-placeholder {
   color: #000;
}

:-moz-placeholder { /* Firefox 18- */
   color: #000;  
}

::-moz-placeholder {  /* Firefox 19+ */
   color: #000;  
}

:-ms-input-placeholder {  
   color: #000;  
}

div.contact div.left select, div.master.other div.left select {
	width: 100%;
	color: #000;
	padding: 5px;
	float: left;
	background: none;
	margin: 10px 0px;
	border: 2px solid #000;
}

div.contact div.left textarea, div.master.other div.left textarea {
	width: 99%;
	color: #000;
	/*float: left;*/
	/*padding: 5px;*/
	resize: none;
	background: none;
	margin: 10px 0px;
	border: 2px solid #000;
}

div.contact div.left input[type='submit'], div.master.other div.left input[type='submit']{
	width: 100%;
	max-width: 60px;
	height: auto;
	padding: 5px;
	cursor: pointer;
	float: right;
	margin: 10px 0px;
	background: none;
	border: 2px solid #000;
}

div.contact div.left input[type='reset'], div.master.other div.left input[type='reset'] {
	width: 100%;
	max-width: 60px;
	height: auto;
	padding: 5px;
	cursor: pointer;
	float: right;
	margin: 10px 0px;
	margin-left: 20px;
	background: none;
	border: 2px solid #000;
}

div.contact div.right {
	width: 40%;
	padding-top: 30px;
	padding-bottom: 50px;
	background: url('../images/map-shadow.png') no-repeat bottom center;
}

.map-holder {
	width: 100%;
	max-width: 436px;
	height: 436px;
	margin: 0px auto;
	position:relative;
	border: 11px solid #fff;
	border-radius: 50%;
	overflow: hidden;
}

div.contact div.right img {
	max-width: 436px;
}

/*newsletter styles*/

div.newsletter {
	width: 100%;
	height: auto;
	float: left;
	position: relative;
  	background: #fff;
}

div.newsletter div.left {
	width: 85%;
	height: auto;
}

div.newsletter div.left p {
	font-weight: bold;
}

div.newsletter div.left input {
	background: #ccc;
	border-radius: 5px;
	padding: 10px 15px;
	border: 1px solid #fff;
}

div.newsletter div.left input::-webkit-input-placeholder {
   color: #868585;
}

div.newsletter div.left input:-moz-placeholder { /* Firefox 18- */
   color: #868585;  
}

div.newsletter div.left input::-moz-placeholder {  /* Firefox 19+ */
   color: #868585;  
}

div.newsletter div.left input:-ms-input-placeholder {  
   color: #868585;  
}

div.newsletter div.left input[type='email'] {
	width: 100%;
	max-width: 400px;
}

div.newsletter div.left input[type='submit'] {
	color: #fff;
	background: url('../images/btn-bg.png') repeat-x;
}

div.newsletter div.right {
	width: 15%;
	height: auto;
}

div.newsletter div.right img {
	max-width: 150px;
}
/*footer styles*/
div.top-footer {
	width: 100%;
	height: auto;
	overflow: hidden;
	margin: 0px auto;
	background: #000;
}

div.top-footer a {
	color: #fff;
	line-height: 1.5;
	text-decoration: none;
}

div.top-footer a:hover {
	text-decoration: underline;
}

div.top-footer div.left {
	float: left;
	color: #fff;
	font-family: Arial, Helvetica, sans-serif;
	margin: 10px 0px 0px 80px;
}

div.top-footer div.right {
	float: right;
	font-family: Arial, Helvetica, sans-serif;
}

div.top-footer div.right ul {
	display: block;
	float: left;
	font-size: 14px;
	border-left: 1px solid #fff;
	padding-left: 7px;
	margin-right: 90px;
}

div.bottom-footer {
	width: 100%;
	height: auto;
	overflow: hidden;
	margin: 0px auto;
	background: #000;
}

div.bottom-footer p {
	color: #fff;
	font-size: 14px;
}

div.bottom-footer p:nth-child(1) {
	float: left;
}

div.bottom-footer p span {
	float: right;
}

div.bottom-footer p a{
	color: #ffb400;
	text-decoration: none;
}

div.bottom-footer p a:hover {
	text-decoration: underline;
}

.mobile {
	display: none !important;
}

/*mobile menus*/

ul.mobile-menu-sub {
	width: 100%;
	height: auto;
	margin: 0px;
	padding: 0px;
	list-style: none;
	text-align: center;
	text-transform: capitalize;
	font-weight: bold;
	border-bottom: 1px solid #000;
}

ul.mobile-menu-sub li {
	margin: 10px 0px;
}

ul.mobile-menu-sub li a {
	color: #000;
	text-decoration: none;
}

ul.mobile-menu-main {
	width: 100%;
	height: auto;
	margin: 0px;
	padding: 0px;
	list-style: none;
	font-size: 18px;
	text-align: center;
	text-transform: capitalize;
	font-weight: bold;
	background: #000;
	border-bottom: 1px solid #000;
}

ul.mobile-menu-main li {
	margin: 10px 0px;
	padding-bottom: 10px;
    border-bottom: 1px solid #171717;
}

ul.mobile-menu-main li:last-child {
	padding-bottom: 0px;
	border-bottom: none;
}

ul.mobile-menu-main li a {
	color: #fff;
	text-decoration: none;
}

/* master page layout */

/*default colors*/
.service-default {
	color: #fff;
	background: #000;
	padding: 25px 0;
	margin: 40px 0 0 0;
}

.arrow-default {
	background: url('../images/black-arrow-bg.png') no-repeat top center;
}

.button-default {
	float: right;
	padding: 15px 55px;
	margin-top: 40px;
	border: 2px solid #000;
}

/*web design colors*/
.service-web {
	color: #fff;
	background: #0061ba;
	padding: 25px 0;
	margin: 40px 0 0 0;
}

.arrow-web {
	background: url('../images/blue-arrow-bg.png') no-repeat top center;
}

.button-web {
	float: right;
	padding: 15px 55px;
	margin-top: 100px;
	border: 2px solid #0061ba;
}
/*hosting colors*/
.service-host {
	color: #fff;
	background: #2d3c51;
	padding: 25px 0;
	margin: 40px 0 0 0;
}

.arrow-host {
	background: url('../images/darkblue-arrow-bg.png') no-repeat top center;
}

.button-host {
	float: right;
	padding: 15px 55px;
	margin-top: 100px;
	border: 2px solid #2d3c51;
}

.host {
	background: url('../images/master-bg-host.png') no-repeat right;
}

.other {
    background: url(../images/master-bg-host.png) no-repeat right;
}

/*star colors*/
.star {
	background: #ee1c25 !important;
}

.arrow-star {
	background: url('../images/red-arrow-bg.png') no-repeat top center !important;
}

/*gleaner colors*/
.gleaner {
	background: #0270ba !important;
}

.arrow-gleaner {
	background: url('../images/gleaner-arrow-bg.png') no-repeat top center !important;
}

/*advertising colors*/
.service-advertise {
	color: #fff;
	background: #ffa800;
	padding: 25px 0;
	margin: 40px 0 0 0;
}

.arrow-advertise {
	background: url('../images/yellow-arrow-bg.png') no-repeat top center;
}

.button-advertise {
	float: right;
	padding: 15px 55px;
	margin-top: 180px;
	border: 2px solid #ffa800;
}

/*graphic colors*/
.service-graphic {
	color: #dcfb07;
	background: #000;
	padding: 25px 0;
	margin: 40px 0 0 0;
}

.arrow-graphic {
	background: url('../images/black-arrow-bg.png') no-repeat top center !important;
}

.button-graphic {
	float: right;
	padding: 15px 55px;
	margin-top: 100px;
	border: 2px solid #a09f9f;
}

div.master-title {
	width: 100%;
	height: auto;
	float: left;
}

div.master-title h2 {
	font-size: 28px;
	padding-top: 10px;
}

div.master-title p.master-title-link {
	float: right;
	font-size: 14px;
	/*font-weight: bold;*/
	margin-top: 0px;
	padding-top: 10px;
	letter-spacing: 2px;
}

div.master-title p.master-title-link a.title-link {
	float: right;
	margin-top: -26px;
    margin-left: 5px;
}

div.master-title p.master-title-link a.title-link img {
	width: 100%;
	max-width: 54px;
	height: auto;
}

.service-graphic p.master-title-link {color: #fff;}

 p.master-title-link {color: #fff;font-size:16px;font-weight:bold;}
 p.master-title-link a {
 	color: #000;
    font-size: 16px;
    font-weight: bold;
    text-transform: capitalize;
    background: #fff;
    padding: 3px 5px;
    text-decoration: none;
    border-radius: 4px;
	-webkit-box-shadow: -1px 11px 4px -10px rgba(153,153,153,1);
	-moz-box-shadow: -1px 11px 4px -10px rgba(153,153,153,1);
	box-shadow: -1px 11px 4px -10px rgba(153,153,153,1);
}

div.master-title p.master-title-link a.title-link {
	background: none !important;
}

div.master {
	width: 100%;
	height: auto;
	float: left;
	padding-bottom: 100px;
	overflow: hidden;
}

div.master.web, div.master.graphic {background:none !important;}

div.master div.left {
	width: 40%;
	height: auto;
	padding: 60px 0 0 40px;
}

div.master div.left p {
	text-align: justify;
}

div.master div.left h2 {margin-top: 40px; margin-bottom: 0px;}

p.after-h2 {margin-top:0px; margin-bottom:10px;}

div.master div.left a {text-transform: uppercase; text-align: center; text-decoration: underline; font-size: 13px; color: #f70;} /*color: #000*/

div.master div.right {
	width: 65%;
	max-width: 760px;
	height: auto;
	padding: 30px 0 0 0;
	/*margin-right: -40px;*/
	border: px solid #000;
}

div.master-title.service-graphic {z-index: 1;}
div.master.graphic div.right {max-width:713px !important; margin-top: -70px; z-index:2;}
div.master.graphic div.left {width: 45%;} 
div.master.graphic, div.master.graphic div.row.full {overflow: auto;}

div.master div.right img {
	width: 100%;
	max-width: 759px;
	height: auto;
	/*float: right;*/
	
}

div.master div.right ul {list-style: none;}
div.master div.right ul li img {margin: 5px; float:left;}
h5 {background: none !important; font-size: 16px; margin: 0px;}


/*web portfolio page style*/
div.breadcrumb {
	color: #000;
	width: 100%;
	height: auto;
	float: left;
	font-size: 17px;
	font-weight: 500;
	text-transform: capitalize;
}

div.breadcrumb a {color: #000; }

div.page {
	width: 100%;
	height: auto;
	float: left;
	overflow: hidden;
}

div.page ul.top5 {
	width: 100%;
    height: auto;
    float: left;
	list-style: none;
	padding: 0px;
	margin: 50px 0px 80px 8%;
}

div.page ul.top5 li {float: left; width: 100%; max-width: 1034px; height: auto; margin: 100px auto 60px auto;}

div.page ul.top5 li h1 {
	color: #e5e5e5;
	font-size: 45px;
	float: left;
}

div.page ul.top5 li h2 {
    color: #000;
    font-size: 30px;
    float: left;
    margin-top: 35px;
    margin-bottom: 33px;
    margin-left: -30px;
}

div.page ul.top5 li hr {
	color: #000; background: #000; height: 1px; margin: 0px; width: 100%; max-width: 106px; float: left;
	margin-top: 52px;
    margin-left: -51px;
	-ms-transform: rotate(-45deg); /* IE 9 */
    -webkit-transform: rotate(-45deg); /* Chrome, Safari, Opera */
    transform: rotate(-45deg);
}

div.page ul.top5 li a.caselink {
	color: #000;
	float: right;
	padding: 15px 20px;
}

div.page ul.top5 li div.img-box { /*:first-child*/
	width: 100%;
	max-width: 1034px;
	height: auto;
	float: left;
	margin: 40px 0 0 75px;
	border: 1px solid #000;
	z-index: 2;
}

div.page ul.top5 li img {width: 100%; max-width: 1034px; height: auto; margin: -40px 0 0 25px; z-index:1; border: 1px solid #eee;}
div.page ul.top5 li:nth-child(2) img {max-width: 1072px; height: auto; margin: -40px 0 0 25px; z-index:1;}
/*case study page style*/

div.case-header {
	width: 100%;
	height: auto;
	float: left;
}

div.case-laptop {
	width: 100%;
	max-width: 1119px;
	height: auto;
	float: left;
    margin: -29.16666666666667% 9% 0px 9%;
	padding: 44px 158px 150px 167px;
	/*padding: 3.932082216264522% 14.11974977658624% 13.40482573726542% 14.92403932082216%;*/
	/*padding: 3.055555555555556% 10.97222222222222% 10.41666666666667% 11.59722222222222%;*/
	
	background: url('../images/case-laptop.png') no-repeat top center;
	background-size: contain;
}

div.case-laptop img {width: 100%; max-width: 794px; height: auto;}

div.page div.right.case-desc {
	width: 60%;
	height: auto;
	color: #000;
	padding-right: 15%;
	text-align: justify;
	font-size: 18px;
	font-weight: bold;
}

div.page div.right {width: 60%; font-size: 17px; color: #666; padding-right: 15%;}
div.page div.left {width: 38%; font-size: 17px; text-align: right;}
div.page div.left em {color: #333;}

div.web-layout {
	width: 100%;
	height: auto;
	float: left;
	margin-top: 30px;
	padding-bottom: 20px;
	background: #f8f9fb;
}

div.web-layout div.row {padding: 20px 10% 0px 10%;}
div.web-layout h2 {font-size: 40px; text-transform: capitalize !important;}

div.web-layout-slider {
	width: 100%;
	max-width: 1136px;
	height: auto;
	/*float: left;*/
	margin: 40px auto 60px auto;
}

div.web-layout-slider img {max-width: 1136px;}
div.web-layout-slider ul.slick-dots {text-align: right; top: -79px;}

div.mobile-layout {
	width: 100%;
	height: auto;
	float: left;
}

div.mobile-layout div.row {overflow: visible; padding: 10px 10% 0px 10%;}

div.mobile-layout div.left {
	width: 40%;
}

div.mobile-layout div.phone {
	width: 100%;
	max-width: 371px;
	height: auto;
	padding: 23.45013477088949% 12.66846361185984% 30.18867924528302% 7.008086253369272%; /*87px 47px 112px 26px*/
	background: url('../images/phone.jpg') no-repeat top left;
	background-size: contain;
}

div.mobile-layout div.phone img {width: 100%; max-width: 298px; height: auto;}

div.mobile-layout div.right {
	width: 60%;
	padding: 0px;
}

div.mobile-layout div.white-tablet {
	width: 100%;
	max-width: 659px;
	height: auto;
	float: right;
	margin-top: -135px;
	margin-right: -27px;
	padding: 13.2073% 0 18.816388% 6.1021548%; /*padding: 89px 0px 124px 41px;*/
	background: url('../images/white-tablet.png') no-repeat top right;
	background-size: contain;
	z-index: 5;
}

div.mobile-layout div.white-tablet img {width: 100%; max-width: 554px; height: auto;}

div.case-nav {
	width: 100%;
	height: auto;
	float: left;
}

div.col-3 a.prev {
	background: url('../images/arw-left.png') no-repeat 10% center;
}
div.col-3 a.next {
	background: url('../images/arw-right.png') no-repeat 90% center;
}
div.col-3 a.back {
	width: 100%;
	max-width: 133px;
	min-height: 133px;
	background: url('../images/folder-blk.png') no-repeat center;
	font-size: 0;
	margin-top: -60px;
	border-radius: 50%;
	-webkit-border-radius: 50%;
}
/*div.col-3 a.back:hover {font-size: 13px;background:none;}*/

/*clients page style*/
div.clients {
	width: 100%;
	height: auto;
	float: left;
}

div.clients ul {
	margin: 40px 0px 0px 0px;
	padding: 0px;
	list-style: none;
	overflow: hidden;
}
div.clients ul li {  /* 2,3,6,7,10,11,14,15,18,19 */
	width: 100%;
	max-width: 234px;
	height: auto;
	min-height: 270px;
	float: left;
	margin: 0px 3.5%;
	margin-bottom: 20px;
}

div.clients ul li h5 {
	margin-bottom: 0px;
}

div.clients ul li p {
	margin: 0px;
}

div.clients ul li a {
	width: 100%;
	height: auto;
	display: block;
}

div.clients ul li a img {
	width: 100%;
	height: auto;
	border: 1px solid #000;
}

.specialdiscount{
    color:#CCCCCC;
}

/*media queries*/

/*DESKTOPS*/
@media screen and (min-width: 1024px), screen and (min-device-width: 1024px) {

}

/*TABLETS*/
@media screen and (max-width: 1024px), screen and (max-device-width: 1024px) {

	.desktop {
		display: none !important;
	}
	
	div.right.mobile {
		display: block !important;
		text-align: right !important;
		font-size: 26px;
	}
	
	div.master div.right, div.master div.left {width:50%;}

	h1{font-size: 30px !important;}
	h6{font-size: 12px !important; width: 30%; margin-top: -17px;}
	hr {width: 50%;}
	
	div.case-laptop {margin-left: 0px !important; /*margin-top: -380px;*/}
	div.case-laptop {
	/*padding: 44px 158px 150px 167px;*/
	padding: 3.932082216264522% 14.11974977658624% 5.987488829311886% 14.92403932082216%;
}

}

/*TABLETS PROTRAIT 800*/
@media screen and (max-width: 800px), screen and (max-device-width: 800px) {

		div.nav div.row {
			margin-bottom: 0px;
		}
		
		div.nav div.left {padding: 0px !important;}
		div.nav div.right {padding-right: 0px !important;}
		
		div.row {
			padding: 0px 20px;
		}
		
		.sub-text.mobile {display: block !important;}
		
		.sub-text a {
			font-size: 16px !important;
		}
		
		div.master > div.row.full div.left {
			padding: 0px 20px !important;
		}
		
		p.master-title-link a {padding: 2px !important; margin-bottom: 5px !important;}
		
		div.master.web div.right {
			padding-top: 45px !important;
			padding-left: 20px !important;
    		background: url('../images/blue-arrow-bg.png') no-repeat top center;
		}
		
		div.master.host div.right {
			padding-top: 45px !important;
			padding-left: 20px !important;
    		background: url('../images/darkblue-arrow-bg.png') no-repeat top center;
		}
		
		div.master.other div.right {
			padding-top: 45px !important;
			padding-left: 20px !important;
    		background: url('../images/black-arrow-bg.png') no-repeat top center;
		}
		
		div.master.advertise div.right {
			padding-top: 45px !important;
			padding-left: 20px !important;
    		/*background: url('../images/yellow-arrow-bg.png') no-repeat top center;*/
			background: none !important;
		}
		
		div.master.web, div.master.web div.left {background: none !important;}
		div.master.host, div.master.host div.left {background: none !important;}
		div.master.other div.left {background: none !important;}
		div.master.advertise, div.master.advertise div.left {background: none !important;}
		
		div.master.graphic div.left {width: 100%; background: none !important;}
		
		div.master-title {margin-top: 5px;}
	
		h6{font-size: 12px !important; width: 25%; margin-top: -17px; padding: 0px 5px;}
		hr {width: 50%;}
		
		div.about span:first-child {
    		width: 100%;
			margin: 0px;
		}
		
		div.about span:nth-child(2), div.about span:nth-child(3) {
    		width: 50%;
			margin: 0px;
		}
		
		div.web div.left {
			padding-left: 0px;
		}
		
		div.web div.right {
			padding-right: 0px;
		}
		
		div.graphic div.right {
			margin-top: 0px !important;
		}
		
		div.web-h {
    		background: url('../images/web-h-bg.jpg') #fff no-repeat top right;
    		background-size: cover;
		}
		
		div.web-h div.left {
			width: 65%;
			padding-left: 0px;
		}
		
		div.web-h div.left img {
    		max-width: 172px;
		}
		
		div.web-h div.right {
			width: 70%;
			float: left;
			padding-right: 20px;
		}
		
		div.web-h div.web-h-links {
			 padding: 0px; 
		}
		
		div.web-h div.web-h-links ul li {
			padding: 3px 10px;
		}
		
		div.newsletter div.left {
			width: 100%;
			height: auto;
		}
		
		div.newsletter div.left input[type='email'] {
			width: 100%;
			max-width: 200px;
		}
		
		div.newsletter div.right {
			width: 100%;
			height: auto;
			text-align: center;
		}
		
		div.master div.left, div.master div.right {
			width: 100%;
			height: auto;
		}
		
		div.graphic div.tablet-holder {
			margin: 0px auto !important;
			float: none !important;
		}
		
		ul.top5 {margin: 0px !important;}
		ul.top5 li:first-child {margin-top: 5px !important;}
		ul.top5 li {margin-top: 10px !important;}
		ul.top5 li h2 {font-size: 20px !important;}
		
		div.page ul.top5 li div.img-box {margin-left: 0px; margin-top: 60px;}
		div.page ul.top5 li img {margin-left: 10px !important;}
		
		div.case-laptop {/*margin-top: -300px !important;*/}
		
		div.page div.right.case-desc {width: 100% !important; text-align: left; padding-right: 0px !important;}
		
		div.page div.left {width: 100%; text-align: left;}
		div.page div.right {width: 100%; padding-right: 0px !important;}
		
		div.web-layout h2 {font-size: 22px;}
		
		div.clients ul {margin-top: 0px;}
		div.clients ul li {  /* 2,3,6,7,10,11,14,15,18,19 */
			width: 32%;
			margin: 0px 0.5%;
		}
		
		ul.grey-bar {
			padding: 15px 0px;
			margin-bottom: 0px;
			float: left;
		}
		
		ul.grey-bar li {
			width: 33%;
			font-size: 16px;
			float:left;
		}
		
		ul.email-details li {
			width: 50%;
			/*height: 300px;*/
			height: auto;
			float: left;
			padding: 10px 20px;
		}
		
		@media screen and (orientation: landscape), screen and (max-width: 760px){
		div.clients ul li {  /* 2,3,6,7,10,11,14,15,18,19 */
			width: 30%;
			margin: 0px 1.5%;
		}
		
		.map-holder {border-radius: 0px !important;}
		}
		
		div.graphic div.left {background: none;}
		div.contact div.left {padding:0px 5%;}
		@media screen and (orientation: portrait){
		div.mobile-layout div.white-tablet {
			margin-top: 0px;
			margin-right: 0px;
			padding: 13.2073% 9.8% 18.816388% 6.1021548%;
		}
		.map-holder {border-radius: 0px !important;}
		}
}

/*PHONES*/
@media screen and (max-width: 720px), screen and (max-device-width: 720px) {
	
	.desktop {
		display: none !important;
	}
	
	div.right.mobile {
		display: block !important;
		text-align: right !important;
		font-size: 26px;
	}
	
	div.mini-nav div.right.mobile {display:none!important;}
	
	h1{font-size: 30px !important;}
	h6{font-size: 12px !important; /*width: 30%;*/ margin-top: -17px;}
	div.master-title h2 {font-size: 19px !important;}
	hr {width: 50% !important;}
	
	div.master-title {padding: 0px !important;}
	
	div.web-h {
    background-size: contain !important;
}
	
	@media screen and (orientation: portrait){
		div.nav div.left {width: 40% !important;}
		div.nav div.right.mobile {width: 40% !important; margin-top: 15px !important;}
		
		h6{font-size: 12px !important; width: 40%; margin-top: -17px; padding: 0px 5px;}
		hr {width: 80% !important;}
		
		div.contact div.left input[type='email'], div.contact div.left input[type='text']{
    		width: 40% !important;
		}
		
		div.master-title div.left, div.master-title div.right {
			width: 50%;
		}
		
		div.service-host div.left, div.service-host div.right {width:100%; float:left;}
		div.service-host p.master-title-link {
    		float: left;
		}
		div.service-advertise div.left, div.service-advertise div.right {width:100%; float:left;}
		div.service-advertise p.master-title-link {
    		float: left;
		}
		/*div.service-web div.left, div.service-web div.right {width:100%; float:left;}
		div.service-web p.master-title-link {
    		float: left;
		}*/
		
		div.graphic div.tablet-holder {
			padding-bottom: 0px !important;
		}
		
		div.graphic div.tablet-slider {
			padding-top: 15px !important;
   			padding-bottom: 21px !important;
    		padding-left: 30px;
    		padding-right: 30px;
		}
		
		div.mobile-layout div.phone {/*width: 60%;*/}
		
		div.clients ul li {  /* 2,3,6,7,10,11,14,15,18,19 */
			width: 45%;
			margin: 0px 2%;
		}
		
		ul.grey-bar li {
			font-size: 15px;
		}
		
		div.e-email h2, div.s-email h2 {
    		font-size: 25px;
		}
		
		div.s-email h2 {
			margin-bottom: 150px !important;
		}
		
		div.e-email p {
    		font-size: 18px;
			margin-bottom: 150px;
		}
		
		ul.email-details li {
			width: 100%;
			padding: 10px 20px;
		}
		
		div.mobile-layout div.phone {
			padding: 23.45013477088949% 12.66846361185984% 30.18867924528302% 7.008086253369272%;
		}
		
		/*div.case-laptop {margin-top: -140px !important; padding: 11px 14.11974977658624% 67px 14.92403932082216%;}*/
	}
	
	 /* 1119 padding: 13px 45px 67px 48px;  padding: 44px 158px 150px 167px; */
	
	@media screen and (orientation: landscape){
		div.graphic h6 {
			background: #a8a7a7 !important;
			background: -moz-linear-gradient(left,  #a8a7a7 0%, #B7B7B7 50%, #a8a7a7 100%) !important;
			background: -webkit-linear-gradient(left,  #a8a7a7 0%,#B7B7B7 50%,#a8a7a7 100%) !important;
			background: linear-gradient(to right,  #a8a7a7 0%,#B7B7B7 50%,#a8a7a7 100%) !important;
			filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a8a7a7', endColorstr='#a8a7a7',GradientType=1 ) !important;
		}
		
		/*div.case-laptop {margin-top: -270px !important; padding: 26px 14.11974977658624% 67px 14.92403932082216%;}*/
		
		div.mobile-layout div.phone {/*width: 50%;*/}
		
		div.clients ul li {  /* 2,3,6,7,10,11,14,15,18,19 */
			width: 30%;
			margin: 0px 1.5%;
		}
		
		ul.grey-bar li {
			font-size: 16px;
		}
		
		ul.email-details li {
			width: 50%;
			height: 300px;
			padding: 10px 20px;
			border:px solid;
		}
	}
	div.about span {
		width: 100% !important;
		margin: 0px;
	}
	
	div.about span:nth-child(3) p {
		margin-top: 5px;
	}
	
	div.web div.left {
		width: 100%;
		padding-left: 0px;
	}
	
	div.master div.left {
		width: 100%;
		padding-left: 0px;
	}
	
	div.web div.right {
		width: 100%;
		padding-right: 0px;
	}
	
	div.graphic h6 {
		background: #a09f9f;
		background: -moz-linear-gradient(left,  #a09f9f 0%, #B7B7B7 50%, #a09f9f 100%);
		background: -webkit-linear-gradient(left,  #a09f9f 0%,#B7B7B7 50%,#a09f9f 100%);
		background: linear-gradient(to right,  #a09f9f 0%,#B7B7B7 50%,#a09f9f 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a09f9f', endColorstr='#a09f9f',GradientType=1 );
	}
	
	div.graphic div.left {
		width: 100%;
		padding-left: 0px;
		background: none;
	}
	
	div.graphic div.right {
		width: 100%;
		padding-right: 0px;
	}
	
	div.web div.right p {
		margin-top: 0px;
	}
	
	div.web-h div.left {
		width: 100%;
		float: left;
		text-align: center;
		padding-left: 0px;
	}
	
	div.web-h div.right {
		width: 100%;
		padding-right: 0px;
	}
	
	div.web-h div.left img {
    	max-width: 172px;
	}
	
	div.web-h div.web-h-links, div.master div.web-h-links {
		width: 100%;
		height: auto;
		float: left;
		padding: 10px 0px;
	}
	
	div.web-h div.web-h-links ul li, div.master div.web-h-links ul li {
		display: inline-block;
		text-transform: capitalize;
		margin: 0px 0px;
		padding: 3px 10px;
		 border: none; 
	}
	
	
	div.others div.right {
		width: 100% !important;
	}
	
	div.others div.right h3 {
    	font-size: 25px;
	}
	
	div.contact div.left {
		width: 100%;
		padding-top: 0px;
	}
	
	div.contact div.right {
		width: 100%;
		padding-top: 0px;
	}
	
	div.newsletter div.left input {
		width: 100px;
		margin: 5px 0px;
	}
	
	div.newsletter div.left input[type='submit'] {
		width: 60px;
	}
	
	div.top-footer div.left {
    	margin-left: 60px;
	}

}
