@charset "UTF-8";
/* CSS Document */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, caption {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

#samples {
	width: 100%;
  display:inline-block;
	margin-top: 2em;
  background-color: #e81158;
	}

.client:hover {
	opacity: .8;
	}


.client img {
	height: 25%;
	position: relative;
 	top: 50%;
 	transform: translateY(-50%);
	}


.client.unread {
  background-image:  url(images/UnreadImg.jpg);
  background-repeat: no-repeat;
  background-size: cover;
    }

.client.credithuman {
  background-image:  url(images/CreditHumanImg.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  }

.client.hid {
  background-image:  url(images/HIDImg.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  }

.client.edgezone {
  background-image:  url(images/EdgeZoneImg.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  }

.client.take {
  background-image:  url(images/TakeImg.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  }

.client.expressscripts {
  background-image:  url(images/ExpressScriptImg.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  }

.client.picpocket {
  background-image:  url(images/PicPocketImg.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  }

.client.cityhapps {
	background-image:  url(images/CityHappsImg.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	}

.client.trovarr {
	background-image:  url(images/TrovarrImg.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	}

.client.gymboree {
	background-image:  url(images/GymboreeImg.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	}

.client.solarwinds {
	background-image:  url(images/SolarWindsImg.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	}

.client.portico {
	background-image:  url(images/PorticoImg.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	}


@media screen and (max-width: 600px) {

body {
	font-family: "effra",sans-serif;
	color:#4b2501;
	font-size: 1.125em;
	line-height:1.5em;
	font-weight:300;
	font-style:regular;
	}

H1 {
	font-family: "lust-script-display",serif;
	color:#fff;
	font-size: 4em;
	line-height:2em;
	font-weight:300;
	font-style:regular;
	}

H2 {
  	font-family: "lust-script-display",serif;
  	color:#fff;
  	font-size: 2em;
  	line-height:1em;
  	font-weight:300;
  	font-style:regular;
    margin-top: 1em;
  	}

H3 {
	font-family: "lust-script-display",serif;
	color:#4b2501;
	font-size: 2em;
	line-height:0px;
	font-weight:300;
	font-style:regular;
	}

H4 {
	font-family: "lust",serif;
	color:#4b2501;
	font-size: 1.5em;
	line-height:1em;
	margin-bottom:.3em;
	font-weight:300;
	font-style:regular;
	}

H5 {
	font-family: "effra",sans-serif;
	color:#fff;
	font-size: 1.2em;
	line-height:1.4em;

	font-weight:300;
	font-style:regular;
	padding-top: 1em;
	}

  H6 {
    font-family: "lust",serif;
    color:#4b2501;
    font-size: 2em;
    line-height:1em;
    font-weight:300;
    font-style:regular;
    margin-bottom: .5em;
    }




#wrapper {
	text-align: center;
	width:100%;
	height:100%;
	padding-top:0px;
	}

#header {
	text-align: center;
	width:100%;
	height: 580px;
	background-image:  url(images/sequelheader2.jpg) , url(images/sequelheaderBG2.jpg);
	background-repeat: no-repeat, repeat;
	background-position: center;
	}




#logo {
	background-image:  url(images/SequelLogo.png);
	background-repeat: no-repeat;
	background-size: 120px;
	background-position: center;
	width:100%;
	height:100px;
	}

#intro {
	text-align: center;
	width:80%;
	padding:1em 10% 0em 10%;
	}

#services {
	text-align: center;
	width:100%;
	margin-top: 4em;

}

#service {
	text-align: center;
	width:80%;
	padding:3em 10% 0em 10%;
	float:left;
}

#icon {

	}

#icon img{
	height: 110px;
	padding-bottom: 20px;
	}

#title {
	width: 100%;
	padding-top:70em;
	}

#bio {
  text-align: center;
  display:inline-block;
  width:100%;
  height: 540px;
  margin: -10px;
  background-image: url(images/sequelheaderBG4.jpg);
  background-repeat: repeat;
  background-size: auto;
  }

  #social {
    width: 100%;
    height: 60px;
    padding-top: 6em;
    background-image:  url(images/linkedin.png);
    background-repeat: no-repeat;
    background-size: 50px;
    background-position: center;
    }


.client {
	width:100%;
	height: 15em;
	float:left;
	}


#LWT {
	font-family: "effra",sans-serif;
	font-size: 1.4em;
	color:#e81158;
	height: 3em;
	padding-top:1.7em;
	background-color:#1f000a;
	width:100%;
	float:left;
	text-align:center;
	}

#LWT img {
	height: 25px;
	}

div#LWT:hover {
	background-color:#e81158;
	color:#1f000a;
	}

div#LWT:active {
	background-color:#e81158;
	color:#1f000a;
	}

}


@media screen and (min-width: 601px) and (max-width: 900px) {

body {
	font-family: "effra",sans-serif;
	color:#4b2501;
	font-size: 1.125em;
	line-height:1.5em;
	font-weight:300;
	font-style:regular;
	}

H1 {
	font-family: "lust-script-display",serif;
	color:#fff;
	font-size: 4.625em;
	line-height:2em;
	font-weight:300;
	font-style:regular;
	}

  H2 {
  	font-family: "lust-script-display",serif;
  	color:#fff;
  	font-size: 2.4em;
  	line-height:1em;
  	font-weight:300;
  	font-style:regular;
  	margin-top: 1em;
  	}

H3 {
	font-family: "lust-script-display",serif;
	color:#4b2501;
	font-size: 2em;
	line-height:0px;
	font-weight:300;
	font-style:regular;
	}

H4 {
	font-family: "lust",serif;
	color:#4b2501;
	font-size: 1.5em;
	line-height:1em;
	margin-bottom:.3em;
	font-weight:300;
	font-style:regular;
	}

H5 {
	font-family: "effra",sans-serif;
	color:#fff;
	font-size: 1.3em;
	line-height:1.3em;
	margin-bottom: -.5em;
	font-weight:300;
	font-style:regular;
	padding-top: 1.5em;
	}

  H6 {
  	font-family: "lust",serif;
  	color:#4b2501;
  	font-size: 2em;
  	line-height:1em;
  	font-weight:300;
  	font-style:regular;
  	margin-bottom: .5em;
  	}

#wrapper {
	text-align: center;
	width:100%;
	height:100%;
	padding-top:0px;
	}

#header {
	text-align: center;
	width:100%;
	height: 580px;
	background-image:  url(images/sequelheader2.jpg) , url(images/sequelheaderBG2.jpg);
	background-repeat: no-repeat, repeat;
	background-position: center;
	}




#logo {
	background-image:  url(images/SequelLogo.png);
	background-repeat: no-repeat;
	background-size: 120px;
	background-position: center;
	width:100%;
	height:100px;
	}

#intro {
	text-align: center;
	width:70%;
	padding:1em 15% 0em 15%;

	}

#services {
	text-align: center;
	width:100%;
	margin-top: 3em;
}

#service {
	text-align: center;
	width:30%;
	padding:3em 10% 0em 10%;
	float:left;
}

#icon {

	}

#icon img{
	height: 110px;
	padding-bottom: 20px;
	}

#title {
	width: 100%;
	padding-top:40em;
	}

  #bio {
    width: 100%;
    display:inline-block;
    margin: -10px;
    height: 500px;
    background-image:  url(images/sequelheaderBG4.jpg);
    background-repeat: repeat;
    background-size: auto;
    background-position: right;
    }

    #social {
      width: 100%;
      height: 60px;
      padding-top: 6em;
      background-image:  url(images/linkedin.png);
      background-repeat: no-repeat;
      background-size: 50px;
      background-position: center;
      }

.client {
	width:50%;
	height: 20em;
	float:left;
	}



#LWT {
	font-family: "effra",sans-serif;
	font-size: 2em;
	color:#e81158;
	height: 3em;
	padding-top:2em;
	background-color:#1f000a;
	width:100%;
	float:left;
	text-align:center;
	}

#LWT img {
	height: 25px;
	}

div#LWT:hover {
	background-color:#e81158;
	color:#1f000a;
	}

}

@media screen and (min-width: 901px) and (max-width: 1440px) {

body {
	font-family: "effra",sans-serif;
	color:#4b2501;
	font-size: 1.125em;
	line-height:1.5em;
	font-weight:300;
	font-style:regular;
	}

H1 {
	font-family: "lust-script-display",serif;
	color:#fff;
	font-size: 5.625em;
	line-height:2em;
	font-weight:300;
	font-style:regular;
	}

  H2 {
  	font-family: "lust-script-display",serif;
  	color:#fff;
  	font-size: 3em;
  	line-height:1em;
  	font-weight:300;
  	font-style:regular;
  	margin-top: 1em;
  	}

H3 {
	font-family: "lust-script-display",serif;
	color:#4b2501;
	font-size: 2em;
	line-height:0px;
	font-weight:300;
	font-style:regular;
	}

H4 {
	font-family: "lust",serif;
	color:#4b2501;
	font-size: 1.5em;
	line-height:1em;
	margin-bottom:.3em;
	font-weight:300;
	font-style:regular;
	}

H5 {
	font-family: "effra",sans-serif;
	color:#fff;
	font-size: 1.5em;
	line-height:1.3em;
	margin-bottom: -.5em;
	font-weight:300;
	font-style:regular;
	padding-top: 1.5em;
	}

  H6 {
  	font-family: "lust",serif;
  	color:#4b2501;
  	font-size: 2.5em;
  	line-height:1em;
  	font-weight:300;
  	font-style:regular;
  	margin-bottom: .5em;
  	}

#wrapper {
	text-align: center;
	width:100%;
	height:100%;
	padding-top:0px;
	}

#header {
	text-align: center;
	width:100%;
	height: 580px;
	background-image:  url(images/sequelheader2.jpg) , url(images/sequelheaderBG2.jpg);
	background-repeat: no-repeat, repeat;
	background-position: center;
	}




#logo {
	background-image:  url(images/SequelLogo.png);
	background-repeat: no-repeat;
	background-size: 120px;
	background-position: center;
	width:100%;
	height:100px;
	}

#intro {
	text-align: center;
	width:50%;
	padding:1em 25% 0em 25%;
	}

#services {
	text-align: center;
	width:100%;
	margin-top: 4em;
}

#service {
	text-align: center;
	width:30%;
	padding:3em 10% 1em 10%;
	float:left;
}

#icon {

	}

#icon img {
	height: 110px;
	padding-bottom: 20px;
	}

#title {
	width: 100%;
	padding-top:40em;
	}


#bio {
  width: 100%;
  display:inline-block;
  margin: -10px;
  height: 600px;
  background-image: url(images/sequelheaderBG4.jpg);
  background-repeat: repeat;
  background-size: auto;
  background-position: right;
  }

  #social {
    width: 100%;
    height: 100px;
    padding-top: 6em;
    background-image:  url(images/linkedin.png);
    background-repeat: no-repeat;
    background-size: 60px;
    background-position: center;
    }

.client {
	width:33.333333%;
	height: 20em;
	float:left;
	background-color:#1f000a;
	}




#LWT {
	font-family: "effra",sans-serif;
	font-size: 2em;
	color:#e81158;
	height: 3em;
	padding-top:2em;
	background-color:#1f000a;
	width:100%;
	float:left;
	text-align:center;
	}

#LWT img {
	height: 25px;
	}

div#LWT:hover {
	background-color:#e81158;
	color:#1f000a;
	}

}

@media screen and (min-width: 1441px){

body {
	font-family: "effra",sans-serif;
	color:#4b2501;
	font-size: 1.5em;
	line-height:1.5em;
	font-weight:300;
	font-style:regular;
	}

H1 {
	font-family: "lust-script-display",serif;
	color:#fff;
	font-size: 7em;
	line-height:2em;
	font-weight:300;
	font-style:regular;
	}

  H2 {
  	font-family: "lust-script-display",serif;
  	color:#fff;
  	font-size: 3em;
  	line-height:1em;
  	font-weight:300;
  	font-style:regular;
  	margin-top: 1em;
  	}

H3 {
	font-family: "lust-script-display",serif;
	color:#4b2501;
	font-size: 2em;
	line-height:0px;
	font-weight:300;
	font-style:regular;
	}

H4 {
	font-family: "lust",serif;
	color:#4b2501;
	font-size: 1.5em;
	line-height:1em;
	margin-bottom:.3em;
	font-weight:300;
	font-style:regular;
	}

H5 {
	font-family: "effra",sans-serif;
	color:#fff;
	font-size: 1.7em;
	line-height:1.3em;
	margin-bottom: -.5em;
	font-weight:300;
	font-style:regular;
	padding-top: 1em;
	}

  H6 {
  	font-family: "lust",serif;
  	color:#4b2501;
  	font-size: 3em;
  	line-height:1em;
  	font-weight:300;
  	font-style:regular;
  	margin-bottom: .5em;
  	}

#wrapper {
	text-align: center;
	width:100%;
	height:100%;
	padding-top:0px;
	}

#header {
	text-align: center;
	width:100%;
	height: 900px;
	background-image:  url(images/sequelheader3.jpg) , url(images/sequelheaderBG3.jpg);
	background-repeat: no-repeat, repeat;
	background-position: center;
	}




#logo {
	background-image:  url(images/SequelLogo.png);
	background-repeat: no-repeat;
	background-size: 120px;
	background-position: center;
	width:100%;
	height:100px;
	}

#intro {
	text-align: center;
	width:50%;
	padding:1em 25% 0em 25%;

	}

#services {
	text-align: center;
	width: 1000px;
  margin-left: auto;
  margin-right: auto;
	margin-top: 4em;
}

#service {
	text-align: center;
  font-size: .85em;
	width:20%;
	padding:3em 2.5% 0em 2.5%;

	float:left;
}

#icon {

	}

#icon img{
	height: 110px;
	padding-bottom: 20px;
	}

#title {
	width: 100%;
	padding-top:23em;
	}


#bio {
  width: 100%;
  display:inline-block;
  margin: -10px;
  height: 800px;
  background-image:  url(images/sequelheaderBG4.jpg);
  background-repeat: repeat;
  background-size: cover;
  background-position: right;
  }

  #social {
    width: 100%;
    height: 100px;
    padding-top: 6em;
    background-image:  url(images/linkedin.png);
    background-repeat: no-repeat;
    background-size: 70px;
    background-position: center;
    }

.client {
	width:33.333333%;
	height: 20em;
	float:left;
	}

#LWT {
	font-family: "effra",sans-serif;
	font-size: 2em;
	color:#e81158;
	height: 3em;
	padding-top:2em;
	background-color:#1f000a;
	width:100%;
	float:left;
	text-align:center;
	}

#LWT img {
	height: 25px;
	}

#LWT:hover {
	background-color:#e81158;
	color:#1f000a;
	}


}