/* --------------------------------------------------- FRONT PAGE -----------------------------------------------------*/

/* ------------ HEADER -------------*/

.header-container {
    background-color: #1b1b1d;
}

.logo {
    width: 74%;
    height: auto;
    margin-left: 202%;
    margin-top: 20%;
}

.main-heading h1 {
    font-family: 'Kaushan Script', cursive;
    font-size: 50px;
    margin-left: -80%;
    margin-top: 30%;
    letter-spacing: 1px;
    color: #ebebeb;
    text-shadow: 0 1px 0 #ccc,
    0 2px 0 #c9c9c9,
    0 3px 0 #bbb,
    0 4px 0 #b9b9b9,
    0 5px 0 #aaa,
    0 6px 1px rgba(0, 0, 0, .1),
    0 0 5px rgba(0, 0, 0, .1),
    0 1px 3px rgba(0, 0, 0, .3),
    0 3px 5px rgba(0, 0, 0, .2),
    0 5px 10px rgba(0, 0, 0, .25),
    0 10px 10px rgba(0, 0, 0, .2),
    0 20px 20px rgba(0, 0, 0, .15);
}

.main-heading h6 {
    margin-left: -58%;
    font-size: 18px;
    color: #ebebeb;
    font-family: 'Kaushan Script', cursive;
}

/* ------------ NAV BAR -------------*/

.nav-bar-container {
    margin-top: 4.7%;
    padding-left: 14%;
}

.btn3d {
    transition: all .08s linear;
    position: relative;
    outline: medium none;
    -moz-outline-style: none;
    border: 0px;
    margin-right: 10px;
    margin-top: 15px;
}

.btn3d:focus {
    outline: medium none;
    -moz-outline-style: none;
}

.btn3d:active {
    top: 9px;
}

.toggle {
    width: 100%;
    padding: 10px 20px;
    text-align: right;
    box-sizing: border-box;
    font-size: 30px;
    display: none;
}

/*YELLOW*/

.btn-default {
    box-shadow: 0 0 0 1px #fef200 inset, 0 0 0 2px rgba(255, 255, 255, 0.50) inset, 0 8px 0 0 #ffda00, 0 8px 0 1px rgba(0, 0, 0, 0.4), 0 8px 8px 1px rgba(0, 0, 0, 0.5);
    background-color: #fef200;
}

.btn-default:visited {
    background-color: #fef200;
}

.btn-default:hover {
    background-color: #ffda00;
}

/*BLACK*/

.btn-info {
    box-shadow: 0 0 0 1px #1f2227 inset, 0 0 0 2px rgba(255, 255, 255, 0.050) inset, 0 8px 0 0 #1f2227, 0 8px 0 1px rgba(0, 0, 0, 0.4), 0 8px 8px 1px rgba(0, 0, 0, 0.5);
    background-color: #1f2227;
}

.btn-info:visited {
    background-color: #1f2227;
}

.btn-info:hover {
    background-color: #171b20;
}

/*MAGENTA*/

.btn-danger {
    box-shadow: 0 0 0 1px #eb008b inset, 0 0 0 2px rgba(255, 255, 255, 0.20) inset, 0 8px 0 0 #eb008b, 0 8px 0 1px rgba(0, 0, 0, 0.4), 0 8px 8px 1px rgba(0, 0, 0, 0.5);
    background-color: #eb0087;
}

.btn-danger:visited {
    background-color: #eb0087;
}

.btn-danger:hover {
    background-color: #eb0061;
}

/*CYAN*/

.btn-primary {
    box-shadow: 0 0 0 1px #01aef0 inset, 0 0 0 2px rgba(255, 255, 255, 0.2) inset, 0 8px 0 0 #0290f0, 0 8px 0 1px rgba(0, 0, 0, 0.4), 0 8px 8px 1px rgba(0, 0, 0, 0.5);
    background-color: #01aef0;
}

.btn-primary:visited {
    background-color: #01aef0;
}

.btn-primary:hover {
    background-color: #0290f0;
}

.disable {
    cursor: not-allowed;
}

/*!* ------------ PROFILE -------------*!*/

.profile-container {
    background-color: #1b1b1d;
    padding-top: 2%;
    padding-right: 5%;
}

.profile-container h1 {
    font-family: 'Patua One', sans-serif;
    letter-spacing: 1px;
    font-size: 46px;
    text-align: center;
    word-spacing: 2px;
    letter-spacing: 1px;
    padding-top: 6%;
    color: #ebebeb;
}

.who-we-are {
    float: left;
    width: 30%;
    height: auto;
    padding-right: 2%;
    padding-bottom: 2%;
}

.profile-image-and-content p {
    text-align: justify;
    padding: 4% 0% 4% 4%;
    font-family: 'Lato', sans-serif;
    font-weight: 300;
    font-size: 18px;
    word-spacing: 2px;
    line-height: 1.5;
    color: #ebebeb;
}

/*!* --- PROFILE ANIMATION --- *!*/

#js-section-profile {
    animation-duration: 2s;
}

/*!* ------------ IMAGE SLIDER -------------*!*/

.image-behind-slider-2 {
    display: none !important;
}

.device-parent {
    margin-top: -3%;
}

.device {
    height: 100%;
    width: 100%;
}

.screen {
    overflow: hidden;
    position: relative;
    width: 100%;
    height: 100%;
}

.screen img {
    z-index: 4;

}

.app-shot {
    position: absolute;
    animation: round 16s infinite;
    opacity: 0;
    z-index: -1;
    margin-left: auto;
    margin-right: auto;
    display: block;
    min-width: 100%;
    min-height: 100%;
}

@keyframes round {
    25% {
        opacity: 1;
    }
    40% {
        opacity: 0;
    }
}

.screen img:nth-child(5) {
    animation-delay: 0s;
}

.screen img:nth-child(4) {
    animation-delay: 3s;
}

.screen img:nth-child(3) {
    animation-delay: 6s;
}

.screen img:nth-child(2) {
    animation-delay: 9s;
}

.screen img:nth-child(1) {
    animation-delay: 12s;
}

/*!* ------------ CLIENTS -------------*!*/

.client-container {
    background-color: #18181a;
}

.clients-heading-container h1 {
    font-family: 'Lato', sans-serif;
    letter-spacing: 1px;
    font-size: 36px;
    word-spacing: 2px;
    letter-spacing: 1px;
    padding-top: 4%;
    padding-left: 4%;
    color: #ebebeb;
}

.clients-heading-container h1:after {
    position: absolute;
    content: "";
    height: 2px;
    display: block;
    background-color: #ebebeb;
    margin-top: 2.5%;
    margin-left: 21%;
    width: 6%;
}

.client-logo-container {
    margin-top: 3%;
    margin-bottom: 2%;
}

.pepsi img {
    margin-top: 35%;
}

.seven-up img {
    width: 90%;
    margin-top: 10%;
}

.mountain-dew img {
    margin-top: 18%;
    margin-left: -15%;
}

.sting img {
    margin-left: -40%;
}

.slice img {
    width: 150%;
    margin-top: -20%;
    margin-left: -94%;
}

.aquafina img {
    margin-top: 12%;
    margin-left: -85%;
}

.ufone img {
    margin-top: 30%;
    margin-left: -104%;
}

.jazz img {
    margin-top: 10%;
    margin-left: -127%;
}

.zong img {
    margin-top: 40%;
    margin-left: -132%;
}

.fauji-cereal img {
    margin-top: 16%;
    margin-left: -155%;
}

.united-snacks img {
    margin-top: 34%;
    margin-left: -180%;
}

.oye-hoye img {
    margin-top: 10%;
    margin-left: -195%;
}

.mayfair img {
    margin-top: 5%;
    margin-left: -232%;
    width: 160%;
}

.mitchells img {
    width: 200%;
    margin-top: 15%;
    margin-left: -212%;
}

.bunnys img {
    margin-left: -132%;
}

.dunkin-donuts img {
    margin-top: 25%;
    margin-left: -140%;
}

.rupali img {
    margin-top: 26%;
    margin-left: -140%;
}

.yummy img {
    margin-top: 10%;
    margin-left: -140%;
}

.hico img {
    margin-left: -140%;
    margin-top: 10%;
}

.ffc img {
    margin-left: -144%;
    margin-top: 32%;
}

.fwo img {
    margin-left: -144%;
    margin-top: 10%;
}

/*!* ------------ SERVICES -------------*!*/

.services-container {
    background-color: #01aef0;
    padding-bottom: 4%;
}

.services-heading-container h1 {
    font-family: 'Lato', sans-serif;
    letter-spacing: 1px;
    font-size: 42px;
    word-spacing: 2px;
    letter-spacing: 1px;
    padding-top: 4%;
    color: #ebebeb;
    padding-bottom: 4%;
    position: relative;
}

.services-heading-container h1:after {
    position: absolute;
    content: "";
    height: 2px;
    display: block;
    background-color: #ebebeb;
    margin-top: 1%;
    margin-left: 2%;
    width: 5%;
}

/*!* ------------ PRE PRESS -------------*!*/

.pre-press {
    background-color: #00a2f0;
}

.pre-press h1 {
    padding-left: 2%;
    font-size: 28px;
    color: #ebebeb;
}

.pre-press-icon {
    width: 18%;
    height: auto;
    float: left;
    padding-left: 2%;
    padding-right: 5%;
}

.pre-press p {
    color: #ebebeb;
    text-align: justify;
    font-family: 'Lato', sans-serif;
    font-weight: 400;
    font-size: 16px;
    word-spacing: 2px;
    line-height: 1.5;
}

.pre-press a:link,
.pre-press a:visited {
    text-decoration: none;
    color: #ebebeb;
}

.pre-press a:active,
.pre-press a:hover {
    color: #0f0f0f;
}

/*!* ------------ PRINTING -------------*!*/

.printing {
    /* margin-left: 0.2%; */
    background-color: #00a2f0;
    margin: 30px 0px;
}

.printing h1 {
    padding-left: 2%;
    font-size: 28px;
    color: #ebebeb;
}

.printing-icon {
    width: 18%;
    height: auto;
    float: left;
    padding-left: 2%;
    padding-right: 5%;
}

.printing p {
    color: #ebebeb;
    text-align: justify;
    font-family: 'Lato', sans-serif;
    font-weight: 400;
    font-size: 16px;
    word-spacing: 2px;
    line-height: 1.5;
}

.printing a:link,
.printing a:visited {
    text-decoration: none;
    color: #ebebeb;
}

.printing a:active,
.printing a:hover {
    color: #0f0f0f;
}

/*!* ------------ BINDING -------------*!*/

ul {
    color: #ebebeb;
    text-align: justify;
    font-family: 'Lato', sans-serif;
    font-weight: 400;
    font-size: 16px;
    word-spacing: 2px;
    line-height: 1.5;
    float:left;
}



.binding {
    /* margin-top: 1%; */
    background-color: #00a2f0;
}

.binding h1 {
    padding-left: 2%;
    font-size: 28px;
    color: #ebebeb;
}

.binding-icon {
    width: 18%;
    height: auto;
    float: left;
    padding-left: 2%;
    padding-right: 5%;
}

.binding p {
    color: #ebebeb;
    text-align: justify;
    font-family: 'Lato', sans-serif;
    font-weight: 400;
    font-size: 16px;
    word-spacing: 2px;
    line-height: 1.5;
}

.binding a:link,
.binding a:visited {
    text-decoration: none;
    color: #ebebeb;
}

.binding a:active,
.binding a:hover {
    color: #0f0f0f;
}

/*!* ------------ PACKAGING AND FINISHING -------------*!*/

.packaging-and-finishing {
    /* margin-left: 0.2%; */
    /* margin-top: 1%; */
    background-color: #00a2f0;
    margin: 30px 0;
}

.packaging-and-finishing h1 {
    padding-left: 2%;
    font-size: 28px;
    color: #ebebeb;
}

.packaging-and-finishing-icon {
    width: 18%;
    height: auto;
    float: left;
    padding-left: 2%;
    padding-right: 5%;
}

.packaging-and-finishing p {
    color: #ebebeb;
    text-align: justify;
    font-family: 'Lato', sans-serif;
    font-weight: 400;
    font-size: 16px;
    word-spacing: 2px;
    line-height: 1.5;
}

.packaging-and-finishing a:link,
.packaging-and-finishing a:visited {
    text-decoration: none;
    color: #ebebeb;
}

.packaging-and-finishing a:active,
.packaging-and-finishing a:hover {
    color: #0f0f0f;
}

/*!* ------------ VISION -------------*!*/

.vision-main-container {
    background-color: #ec248f;
}

.vision-heading-container h1 {
    font-family: 'Lato', sans-serif;
    letter-spacing: 1px;
    font-size: 42px;
    word-spacing: 2px;
    letter-spacing: 1px;
    padding-top: 4%;
    color: #ebebeb;
    padding-bottom: 4%;
    position: relative;
}

.vision-heading-container h1:after {
    position: absolute;
    content: "";
    height: 2px;
    display: block;
    background-color: #ebebeb;
    margin-top: 1%;
    margin-left: 22%;
    width: 5%;
}

.vision-content-container p {
    color: #ebebeb;
    text-align: justify;
    font-family: 'Lato', sans-serif;
    font-weight: 300;
    font-size: 20px;
    word-spacing: 2px;
    line-height: 1.5;
    padding-bottom: 8%;
}

/*!* ------------ VALUES -------------*!*/

.values-main-container {
    background-color: #feed01;
    padding-bottom: 5%;
}

.values-heading-container h1 {
    font-family: 'Lato', sans-serif;
    letter-spacing: 1px;
    font-size: 42px;
    word-spacing: 2px;
    letter-spacing: 1px;
    padding-top: 4%;
    color: #fffff9;
    padding-bottom: 4%;
    position: relative;
}

.values-heading-container h1:after {
    position: absolute;
    content: "";
    height: 2px;
    display: block;
    background-color: #ebebeb;
    margin-top: 1%;
    margin-left: 22%;
    width: 5%;
}

.values-image-container {
    margin-top: 2%;
    padding-left: 2%;
}

.values-image-container img {
    width: 80%;
}

/* --------------------------------------------------- PRE-PRESS PAGE -----------------------------------------------------*/

.pre-press-card-container {
    margin-top: -3%;
    margin-left: 13%;
    border-radius: 10px;
    font-family: 'Lato', cursive;
    background: rgba(223, 223, 223, 0.8);
    padding: 2% 5% 2% 5%;
    animation-duration: 2s;
}

.pre-press-main-image {
    height: 65vh;
    padding-top: 5%;
}

.pre-press-card-container h1 {
    color: #1b1b1d;
    font-size: 30px;
}

.pre-press-card-container hr {
    border-color: #1b1b1d;;
}

.pre-press-card-container p {
    color: #1b1b1d;
    text-align: justify;
    font-family: 'Lato', sans-serif;
    font-weight: 400;
    font-size: 16px;
    word-spacing: 2px;
    line-height: 1.5;
    padding-bottom: 1%;
}

/* ---------------------------------------------------- PRESS PAGE --------------------------------------------------------*/

.press-card-container {
    margin-top: -3%;
    margin-left: 13%;
    border-radius: 10px;
    font-family: 'Lato', cursive;
    background: rgba(223, 223, 223, 0.8);
    padding: 2% 5% 2% 5%;
    animation-duration: 2s;
}

.press-main-image {
    height: 50vh;
    padding-top: 5%;
}

.press-card-container h1 {
    color: #1b1b1d;
    font-size: 30px;
}

.press-card-container hr {
    border-color: #1b1b1d;;
}

.press-card-container p {
    color: #1b1b1d;
    text-align: justify;
    font-family: 'Lato', sans-serif;
    font-weight: 400;
    font-size: 16px;
    word-spacing: 2px;
    line-height: 1.5;
    padding-bottom: 1%;
}

/* --------------------------------------------------- POST-PRESS PAGE -----------------------------------------------------*/

.post-press-card-container {
    margin-top: -3%;
    margin-left: 13%;
    border-radius: 10px;
    font-family: 'Lato', cursive;
    background: rgba(223, 223, 223, 0.8);
    padding: 2% 5% 2% 5%;
    animation-duration: 2s;
}

.post-press-main-image {
    height: 60vh;
    padding-top: 5%;
}

.post-press-card-container h1 {
    color: #1b1b1d;
    font-size: 30px;
}

.post-press-card-container hr {
    border-color: #1b1b1d;;
}

.post-press-card-container p {
    color: #1b1b1d;
    text-align: justify;
    font-family: 'Lato', sans-serif;
    font-weight: 400;
    font-size: 16px;
    word-spacing: 2px;
    line-height: 1.5;
    padding-bottom: 1%;
}

.post-press-card-container ul li {
    color: #1b1b1d;
    text-align: justify;
    font-family: 'Lato', sans-serif;
    font-weight: 400;
    font-size: 16px;
    word-spacing: 2px;
    line-height: 1.5;
}

/* ------------------------------------------- MAILING AND FULFILLMENT PAGE ------------------------------------------------*/

.mailing-and-fulfillment-card-container {
    margin-top: -3%;
    margin-left: 13%;
    border-radius: 10px;
    font-family: 'Lato', cursive;
    background: rgba(223, 223, 223, 0.8);
    padding: 2% 5% 2% 5%;
    animation-duration: 2s;
}

.mailing-and-fulfillment-main-image {
    height: 50vh;
    padding-top: 5%;
}

.mailing-and-fulfillment-card-container h1 {
    color: #1b1b1d;
    font-size: 30px;
}

.mailing-and-fulfillment-card-container hr {
    border-color: #1b1b1d;;
}

.mailing-and-fulfillment-card-container p {
    color: #1b1b1d;
    text-align: justify;
    font-family: 'Lato', sans-serif;
    font-weight: 400;
    font-size: 16px;
    word-spacing: 2px;
    line-height: 1.5;
    padding-bottom: 1%;
}

/* --------------------------------------------------- QUOTE PAGE -----------------------------------------------------------*/

.quote-container {
    margin-left: 13%;
    margin-top: -3%;
}

.quote-main-image {
    height: 80vh;
    padding-top: 5%;
}

.form-container {
    padding: 4% 4% 4% 4%;
    background: rgba(223, 223, 223, 0.7);
}

.quote-container h2 {
    text-align: center;
    padding-top: 2%;
}

.quote-container hr {
    border-color: #1b1b1d;
}

form-container input {
    color: red;
}

.received-message-container {
    padding: 1% 2% 1% 2%;
    background: rgba(223, 223, 223, 0.7);
    border-radius: 5px;
    margin-top: 3%;
}

.received-message-container p {
    color: #000;
    text-align: justify;
    font-family: 'Lato', sans-serif;
    font-weight: 400;
    font-size: 16px;
    word-spacing: 2px;
    line-height: 1.5;
}

/* --------------------------------------------------- FOOTER PAGE ---------------------------------------------------------*/

.footer-main-container {
    background-color: #18181a;
    padding-top: 5%;
}

.footer {
    position: relative;
    background-color: #1b1b1d;
    color: #7d7975;
    padding: 95px 0 50px;
    font-size: 16px;
}

.footer p {
    color: #ebebeb;
    text-align: justify;
    font-family: 'Lato', sans-serif;
    font-weight: 400;
    font-size: 16px;
    word-spacing: 2px;
    line-height: 1.5;
}

.footer h5 {
    font-size: 26px;
    font-weight: 400;
    color: #ebebeb;
    position: relative;
    padding-bottom: 16px;
}

.footer h5:after {
    content: '';
    display: block;
    margin: 5px 0 0;
    width: 40%;
    height: 1px;
    background-color: #1b1b1d;;
}

.footer ul {
    list-style: none;
    line-height: 35px;
    margin: 0px;
    color: #ebebeb;
    width: 120%;
}

.footer ul li {
    font-family: 'Lato', sans-serif;
}

.main-container-inside-footer-section {
    margin-top: -3%;
}

.foot-logo {
    margin: 0px 0px 18px 0px;
    padding: 0;
}

.footer-quote-button-container {
    padding-bottom: 4%;
}

.foot-logo img {
    width: 80%;
    padding-bottom: 6%;
}

.foot-logo p {
    padding-bottom: 2%;
}

.contact-us-container {
    margin-top: 6%;
}

.google-maps {
    margin-top: 6%;
}

.google-maps iframe {
    width: 100%;
    height: 30vh;
}

i {
    font-size: 12px;
    padding-right: 10px;
    /*color: #060608;*/
    color: #ebebeb;
}

.footer-bottom {
    padding-top: 10px;
    padding-bottom: 25px;
    border-top: 1px solid #2f2f33;
    background: #1e1d22;

}

.copyright-text p {
    color: #7d7975;
    margin-top: 18px;
    margin-bottom: 0;
    font-size: 15px;
}

.social-icons {

    margin: 0;
    padding: 0;
    font-size: 10px;
}

.social {
    margin: 7px 7px 7px 0px;
    color: #fff;
}

#social-fb:hover {
    color: #3B5998;
    transition: all .25s;
}

#social-tw:hover {
    color: #4099FF;
    transition: all .25s;
}

#social-gp:hover {
    color: #d34836;
    transition: all .25s;
}

#social-in:hover {
    color: #125688;
    transition: all .25s;
}

#social-li:hover {
    color: #0077b5;
    transition: all .25s;
}





.flaoting_menu_button {
    position: fixed;
    bottom: 40px;
    right: 40px;
    z-index: 10000;
}