﻿@font-face {
    font-family: gillsans;
    src: url('fonts/gillsansmt.eot');
    src: url('fonts/gillsansmt.eot?#iefix') format('embedded-opentype'), url('fonts/gillsansmt.woff') format('woff'), url('fonts/gillsansmt.ttf') format('truetype');
}

@font-face {
    font-family: gillsansmtbold;
    src: url('fonts/gillsansmt.eot');
    src: url('fonts/gillsansmtbold.eot?#iefix') format('embedded-opentype'), url('fonts/gillsansmtbold.woff') format('woff'), url('fonts/gillsansmtbold.ttf') format('truetype');
}

.gillsans {
    font-family: gillsans;
}

.gillsansmtbold {
    font-family: gillsansmtbold;
}

body {
    /*background-image: linear-gradient(rgb(240, 234, 234), white, white);
    background-repeat: no-repeat;
    font-family:'MyriadPro-Regular' !important;*/
    font-family: 'gillsans';
}

.msnryBox {
    margin: 5px !important;
        margin-bottom:40px !important;
}

.main_header {
    font-size: 12px;
    display: block;
    font-weight: 100;
    width: 100%;
    height: 110px;
}

 #ImgSign {
         margin-left: 130px;
    }
#signAnchor {
    margin-left:130px;
}
 .row {
margin-left: -15px;
margin-right: -15px;
}

@media only screen and (max-width: 1480px) and (min-width: 1281px) {
    #container {
        width: 90%;
        height: auto;
        margin: 0 auto;
        padding: 0;
    }
}

@media only screen and (max-width: 1280px) and (min-width: 1026px) {
    body {
        width: 100%;/*1260px;*/
        height: auto;
        margin: 0 auto;
        padding: 0;
    }

    #divMainContent {
        width:100%;
    }

    #container{
        /*top: 140px;*/ margin-top:80px; margin-bottom: 60px; position: relative;  /*margin-left: 50px;*/ width:100%;
    }

    #headerTxt {
        width: 745px;
        font-size: 15px;
    }
    
    #headerMainTxt {
        font-size:35px;
        padding-top: 10px;
    }
    #ImgNamo {
        float: right;
    }
    .col-md-2 {
        /*width:17.7%;*/
    }
}

@media only screen and (min-width: 1025px) and (max-width:1279px) {
    body {
        width: 99%;
        height: auto;
        margin: 0 auto;
        padding: 0;
        background-color: #e6e7e8;
    }

    #divMainContent {
        width:92%;
    }

    #container{
        /*top: 140px;*/ margin-top:80px; margin-bottom: 60px; position: relative;  margin-left: auto; width:100%;
    }
    
    #headerTxt {
        width:70%;
        font-size: 15px;
    }
    
    #headerMainTxt {
        font-size:35px;
        padding-top: 10px;
    }
    #ImgNamo {
        float: right;
    }
    .col-md-2 {
        width:17.7%;
    }
}


@media only screen and (min-width: 981px) and (max-width:1024px) {
    body {
        width: 99%;
        height: auto;
        margin: 0 auto;
        padding: 0;
        background-color: #e6e7e8;
    }

    #divMainContent {
        width:90%;
    }

    #container{
       /*top: 140px;*/ margin-top:80px; margin-bottom: 60px; position: relative;  margin-left: auto; width:100%;
    }
    
    #headerTxt {
        width:60%;
        font-size: 15px;
    }

    #headerMainTxt {
        font-size:35px;
        padding-top: 5px;
    }
    #ImgNamo {
        float: right;
    }
    /*.col-md-2 {
        width:17.7%;
    }*/
}

@media only screen and (min-width:769px) and (max-width:980px) {
    body {
        width: 99%;
        height: auto;
        margin: 0 auto;
        padding: 0;
        background-color: #e6e7e8;
    }

    #divMainContent {
        width:88%;
    }

    #container{
        top: 140px; margin-bottom: 60px; position: relative;  margin-left: auto; width:100%;
    }
    
    #headerTxt {
        width:60%;
        font-size:14px;
    }

    #headerMainTxt {
        font-size:30px;
        padding-top:0px;
    }
    #ImgNamo {
        float: right;
    }
    .col-md-2 {
        width:100%;
    }
}

@media only screen and (min-width:481px) and (max-width:768px) {
    body {
        width: 99%;
        height: auto;
        margin: 0 auto;
        padding: 0;
        background-color: #e6e7e8;
    }

    #divMainContent {
        width:85%;
    }

    #container{
        top: 140px; margin-bottom: 60px; position: relative;  margin-left: auto; width:100%;
    }
    
    #headerTxt {
        width:100%;
        font-size:13px;
    }

    #headerMainTxt {
        font-size:20px;
        padding-top:0px;
    }
    .main_header {
        margin-top:0px;
    }
    #ImgNamo {
        float:none;
    }
    .col-md-2 {
        width:100%;
    }
}

@media only screen and (min-width:320px) and (max-width:480px)
{
    body {
        width: 100%;
        height: auto;
        margin: 0 auto;
        padding: 0;
        background-color: #e6e7e8;
    }

    #divMainContent {
        width:82%;
    }

    #container{
        top: 140px; margin-bottom: 60px; position: relative;  width:100%; margin-left: -16px !important;
    }
    #headerTxt {
        width:100%;
        font-size:12px;
        font-family: gillsans !important;
    }

    #headerMainTxt {
        font-size:15px;
        padding-top:3px;
    }
    #ImgNamo {
        float:none;
        left:-6px;
    }
    .main_header {
        margin-top:0px;
    }
    #ImgSign {
        margin-left:32px;
    }
    .col-md-2 {
        width:100%;
    }
        #divHeaderContent {
        height:164px;
    }
    #container2 {
        top:88px !important;
    }

    #jpreSlide {
        left:10px !important;
    }
    .contDiv{
 width:50%;
}
}


@media only screen and (max-width:319px)
{
    body {
        width: 99%;
        height: auto;
        margin: 0 auto;
        padding: 0;
        background-color: #e6e7e8;
    }

    #divMainContent {
        width:82%;
    }

    #container{
        top: 140px; margin-bottom: 60px; position: relative;  margin-left: auto; width:100%;
    }
    #headerTxt {
        width:100%;
        font-size:13px;
    }

    #headerMainTxt {
        font-size:15px;
        padding-top:0px;
    }
    #ImgNamo {
        float:none;
        left:-16px;
    }
    .main_header {
        margin-top:0px;
    }
    #ImgSign {
        margin-left:32px;
    }
    .col-md-2 {
        width:100%;
    }
    #divHeaderContent {
        height:164px;
    }
}



/*.line-clamp {
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;  
  -moz-line-clamp:6;
  -moz-box-orient: vertical;  
}*/

.bottom_shadow {
	position:relative;
	-webkit-box-shadow:0 1px 4px #8f8e7e;
    box-shadow:0 1px 4px #8f8e7e;
}

.bottom_shadow:after{
	content:"";
    position:absolute;
    z-index:-1;
    top:100%;
    bottom:0;
	width:100%;
	height:40px;
	left:0%;
	right:-50%;
	background: -webkit-radial-gradient(50% -3%, ellipse cover, rgba(00, 00, 00, 0.5), rgba(143, 142, 126, 0.0) 40%);
	background: radial-gradient(ellipse at 50% -3%, rgba(00, 00, 00, 0.5), rgba(143, 142, 126, 0.0) 40%);
}

input[type="text"] {
    background-color: #d0d1d2;
    border: 0;
    height: 30px;
    padding-left: 5px;
    width: 200px;
    font-family: gillsans;
    font-size: 15px;
}


.TipsCss {
    width: 287px;
    height: 250px;
    background-image: url("/images/box_bg.jpg");
    background-size: contain;
}


    .main_header div {
        /*height: 33px;
        float: right;*/
        /*margin: 33px 14px;
    min-height: 100%;*/
        /*margin: 13px;*/
        /*height: 25px;*/
    }




.content_header {
    background-color: #EFEFEF;
    width: 20%;
    height: 100%;
}

.content_sidepanel {
    background-color: #EFEFEF;
    width: 80%;
    height: 100%;
}

.nav {
    color: #4e5766; /* padding: 8px 0px 0px 0px; */ /* margin: 0px auto; */
    text-align: center;
    line-height: normal;
    min-height: 3em;
    background: red;
    width: 960px;
    margin-left: -3px;
}

    .nav div {
        width: 120px; /* background: yellow; */
        float: left;
        margin: 0px 5px; /* min-height: 1.9em; */
        padding-top: 7px;
        font-size: 11px;
    }

    .nav span {
        /* background: yellow; */
        float: right;
        margin: 0px 20px; /* min-height: 1.9em; */
        padding-top: 7px;
        font-size: 11px;
    }

.header_sort select {
    background-color: #D4D4D4 !important;
}


.footer1 {
    color: #4e5766;
    padding: 8px 0px 0px 0px;
    margin: 0px auto;
    text-align: center;
    line-height: normal;
    min-height: 3em;
    /*background: red;*/
    width: 1024px;
    z-index: 9999;
    position: fixed;
    bottom: 0;
    background: rgba(255, 255, 255, 0.5);
    border: solid 1px #F6931E;
    border-left: 0px;
    border-right: 0px;
    border-bottom: 1px;
}

    .footer1 div {
        /*width: 100px;*/
        /*width: 382px;*/
        /*background: rgba(153, 163, 168, 0.5);*/
        float: left;
        /*margin: 5px;*/
        min-height: 100%;
    }

.footerTable {
    float: right;
    font-size: 10px;
}

    .footerTable tr td {
        margin: 5px;
        padding-right: 10px;
    }
/*form Tips PAge*/
select {
    -webkit-appearance: menulist;
    box-sizing: content-box;
    align-items: center;
    border: 1px solid;
    border-image-slice: initial;
    border-image-width: initial;
    border-image-outset: initial;
    border-image-repeat: initial;
    white-space: pre;
    -webkit-rtl-ordering: logical;
    color: black;
    background-color: white;
    cursor: default;
    width: 100px;
}

menulist > dropmarker {
    -moz-appearance: none;
    border-style: none;
    list-style-image: url(http://www.clker.com/cliparts/A/J/p/A/d/3/red-box-md.png);
}

select {
    background-image: url(Images/Red_Box.png);
    background-position-x: 100px;
    background-position-y: 0px;
    background-repeat: no-repeat;
}
/*.current
{
    
    
            
}*/

.current a {
    text-decoration: none;
    font-size: 13px;
    color: White !important;
}

.RedBac {
    background-image: url(/images/nav_bg2.png);
    height: 32px;
    width: 215px;
    background-repeat: no-repeat;
    font-size: 12px;
    color: #ffffff;
    padding-top: 6px;
    margin-top: 7px !important;
}

.activeHome {
    background: url(/images/arrow.png) center;
    height: 32px;
    width: 57px;
    background-repeat: no-repeat;
    font-size: 12px;
    color: #ffffff !important;
    padding-top: 6px;
    margin-top: 7px !important;
}

a:hover {
    color: red;
}

.HeaderText {
    text-align: left;
    font-family: 'MyriadPro-Regular';
    font-size: 23px;
    font-weight: 700;
}

/*.tabletext {
    margin-left: 20px;
    text-align: left;
    font-family: 'MyriadPro-Regular';
    font-size: 14px;
    
    width: 346px;
}*/

.tabletext {
    margin-left: 15px;
    text-align: left;
    font-family: 'MyriadPro-Regular';
    font-size: 15px;
    /*width: 206px;*/
    /*width: 210px;*/
    width: 295px;
}

.sidetextbox {
    color: #211f20;
    background: #fded8f;
    border: solid 0px #ccc;
    height: 23px;
    font-family: 'MyriadPro-Regular';
    font-size: 12px;
    width: 217px;
    margin: 4px;
    margin-bottom: 0px;
}

#txtConditionTip {
    height: 75px;
}

.btnsubmit {
    color: #211f20;
    background: #ffffff;
    border: solid 0px #ccc;
    height: 23px;
    font-size: 12px;
    font-family: sans-serif;
    font-weight: bold;
    width: 200px;
    text-align: left;
}

.logo_Hanes {
    float: left;
    position: relative;
    bottom: 20px;
    height: 89px;
    margin-top: 14px;
    margin-left: 0px;
}

.scrollup {
    width: 55px;
    height: 55px;
    bottom: 38px;
    right: 40px;
    position: fixed;
    display: none;
    text-indent: -9999px;
    background: url('icon-top.png') no-repeat;
    /*background-color: red;*/
}



.shadow {
    -moz-box-shadow: 0 5px 10px #ccc;
    -webkit-box-shadow: 0 5px 10px #ccc;
    box-shadow: 0 5px 10px #ccc;
    zoom: 1;
    filter: progid:DXImageTransform.Microsoft.Shadow(color=#dddddd,direction=0,strength=1), progid:DXImageTransform.Microsoft.Shadow(color=#dddddd,direction=45,strength=1), progid:DXImageTransform.Microsoft.Shadow(color=#dddddd,direction=90,strength=2), progid:DXImageTransform.Microsoft.Shadow(color=#dddddd,direction=135,strength=3), progid:DXImageTransform.Microsoft.Shadow(color=#cccccc,direction=180,strength=10), progid:DXImageTransform.Microsoft.Shadow(color=#dddddd,direction=225,strength=3), progid:DXImageTransform.Microsoft.Shadow(color=#dddddd,direction=270,strength=2), progid:DXImageTransform.Microsoft.Shadow(color=#dddddd,direction=315,strength=1);
}




/*!
 * Bootstrap v3.1.1 (http://getbootstrap.com)
 * Copyright 2011-2014 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 */

/*! normalize.css v3.0.0 | MIT License | git.io/normalize */


.active, .active span, #allsort, #websitesort, #postersort, #socialmediasort, #avdesignsort, #brandingsort, #presentationsort, #bannersort, #appsort, #brochuresort, #mailersort, #packagingsort {
    /*border-bottom: 3px solid;*/
    color: #dae8f8; /*#a89f8c;*/
}

    .Activewebsitesort, #websitesort:hover {
        color: #68fafd !important; /*#0AA6BC*/
    }
    .Activepostersort, #postersort:hover {
        color: #78fbfd !important; /*#05A88D*/
    }
.Activesocialmediasort, #socialmediasort:hover  {
     color: #F0972F !important;
}
    .Activeavdesignsort, #avdesignsort:hover {
        color: #d92f20 !important; /*#EE5653*/
    }
    .Activebrandingsort, #brandingsort:hover {
        color: #bfea5c !important; /*#8DB94A*/
    }
.Activepresentationsort, #presentationsort:hover  {
     color: #FA9B2D !important;
}
    .Activebannersort, #bannersort:hover {
        color: #aa4fab !important; /*#B876B6*/
    }
    .Activeappsort, #appsort:hover {
        color: #b22e4a !important; /*#E86D9C*/
    }
    .Activebrochuresort, #brochuresort:hover {
        color: #68fafd !important; /*#0BA3BB*/
    }
    .Activemailersort, #mailersort:hover {
        color: #9e6232 !important; /*#D1AB7E*/
    }
    .Activepackagingsort, #packagingsort:hover {
        color: #742928 !important; /*#E59491*/
    }
.Activelandingpagesort, #landingpagesort:hover {
    color: #337943 !important; /*#91e5af*/
}

/*.active, #allsort:hover, #websitesort:hover, #postersort:hover, #socialmediasort:hover, #avdesignsort:hover, #brandingsort:hover, #presentationsort:hover, #bannersort:hover, #appsort:hover, #brochuresort:hover, #mailersort:hover, #packagingsort:hover {
     color:inherit !important;
}*/

.contDiv{
    position: fixed;
    left: 0;
    bottom: 1%; display:none;
}