@charset "utf-8";
@font-face {
    font-family: 'sukhumvit';
    src: url('/css/fonts/sukhumvitset-webfont.eot');
    src: url('/css/fonts/sukhumvitset-webfont.eot?#iefix') format('embedded-opentype'),
        url('/css/fonts/sukhumvitset-webfont.woff2') format('woff2'),
        url('/css/fonts/sukhumvitset-webfont.woff') format('woff'),
        url('/css/fonts/sukhumvitset-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'thaisans_neuebold';
    src: url('/css/fonts/ThaiSansNeue-Bold-webfont.eot');
    src: url('/css/fonts/ThaiSansNeue-Bold-webfont.eot?#iefix') format('embedded-opentype'),
        url('/css/fonts/ThaiSansNeue-Bold-webfont.woff2') format('woff2'),
        url('/css/fonts/ThaiSansNeue-Bold-webfont.woff') format('woff'),
        url('/css/fonts/ThaiSansNeue-Bold-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
 #register-page .logo{
    background-image:url(/images/thegiftlogo.png);
    background-repeat:no-repeat;
    background-position:center;
    width:350px;
    height:100px;
    display:block;
    margin: 0px auto;
    margin-bottom:0px;
   /*  margin-top:5px;float:left; display:inline; */
}

.navbar-header .logo,.modal-header .logo{
    background-image:url(/images/thegiftlogo.png);
    background-repeat:no-repeat;
    background-position:left;
    width:350px;
    height:45px;
    margin-top:5px;float:left; display:inline;
}
body {
    -webkit-backface-visibility: hidden;
    font-family:Tahoma, Geneva, sans-serif;
    font-size:16px;
}
h1,h2,h3,h4,h5,h6,.btn{
    font-family:'sukhumvit',Tahoma, Geneva, sans-serif;
    font-weight: bold;

}
h4,.h4{
    font-size:16px;
}
h3,.h3{
    font-size:18px;
}
h2,.h2{
    font-size:20px;
}
ol li{
    margin-top:10px;
}

.content p{
    font-family:'Tahoma', Geneva, sans-serif;
    font-size:16px;
}
.bg-black{
    background:#000;
}
.bg-space{
	background: url(/images/space_bg.jpg) #000  top right fixed  repeat-x;
}
.formal-font{
    font-family:Tahoma, "MS Sans Serif",  "Microsoft Sans Serif";
    font-size: 14px;
    color: #000;
}
.animated {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both; }
.animated.infinite {
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite; }
.animated.hinge {
    -webkit-animation-duration: 2s;
    animation-duration: 2s; }
.animated.bounceIn, .animated.bounceOut {
    -webkit-animation-duration: 0.75s;
    animation-duration: 0.75s; }
.animated.flipOutX, .animated.flipOutY {
    -webkit-animation-duration: 0.75s;
    animation-duration: 0.75s; }

td {
    font-family:Tahoma, "MS Sans Serif",  "Microsoft Sans Serif";
    font-size: 14px;
    color: #333333;
    text-align:left;
}
thead td{
    font-size:16px;
    font-weight: 600;
    color:#fff;
}
th {
    font-family: sukhumvit;
    font-size: 16px;
    font-weight: bold;
    background-color: #DEDEDE;
}
a{text-decoration:none; cursor:pointer;}
blockquote{float:left; clear:both; color:#777; font-style:italic; margin:20px 0px 20px 0px; padding-left:64px; padding-right:5px;min-height:50px;background:url(/theme/default/images/quote.gif) no-repeat top left;}
pre{ line-height:20px; margin-bottom:20px; max-width:100%;}
/* fix for browsers that don't need the hack */



/* MAIN MENU */
#nav{
    background:#000;
    max-height:57px;
    /*clear:both; */

    /*background: url(/theme/default/images/bg-menu-highlight.gif) repeat-x 0px 1px;*/
    border-bottom:1px solid #4a4a4a;
    background-color: #000;
    /*position:relative;*/
    margin-left:0px;
    /*display:block;*/
    /*position: fixed;*/
    top:0;
    z-Index:500;


}
#nav fixed{
    /*position: fixed;*/
    top:0;
    z-Index:500;
}
/* BREADCRUMB */
#breadcrumb{width:100%; height:1px;clear:both; display:inline; background:url(/theme/default/images/bg-chromeline-full.jpg) no-repeat bottom left; padding:0px 0px 0px 0px;}
#breadcrumb ul{margin:0; padding:0; list-style:none; float:left; width:880px;}
#breadcrumb ul li{margin:0px 5px 0px 0px; float:left; display:block; width:auto; clear:none;}
#breadcrumb ul li a {margin:0px 5px 0px 0px; float:left; display:block; width:auto;}
/* FEATURE SLIDESHOW */
#feature{
    width:100%;
    height:auto;
    /*background:url(/theme/default/images/lightblue/bg-feature.jpg) left top;*/
}
#trackupgrade{
    clear: both;
    width: 100%;
    text-align:center;
    margin:0 auto;
    overflow:hidden;
}

#trackupgrade ul{
    margin:0px 0px  10px;
    padding:0px;
    list-style:none;

}
#trackupgrade ul li.icon{
    width:100%; height:60px;
    clear:both; float:left;
    background:url(/theme/default/images/bulb.jpg)  center 1px  no-repeat;
    text-align:center;
    padding-top:15px;
}
#trackupgrade ul li.icon h2 {margin:0px; color:#FFF}
#trackupgrade ul li.title{
    color:#efefef;
    text-align:center;
    line-height:60px;
    font-size:24px;
    text-transform:uppercase;
    font-weight:bold;
    clear:both;
    padding:2px 0px 15px;
}
#trackupgrade ul li.pic{color:#efefef;text-align:center;  clear:both; }
#trackupgrade ul li.piclist{color:#efefef;text-align:center; width:100%;float:left; clear:both; margin:0px 0px 2px;}
#trackupgrade  ul li.exerpt p{
    color:#fff;
    float:left;
    padding:0px 5px 0px 10px;
    clear:both;
    text-align:left;

    font-family:Tahoma, Geneva, sans-serif;
    font-size:11px;
}
/* Background-images*/
#DynamicBG1{ width:100%; text-align:center;}
/* MAIN STRUCTURE */
#wrapper{ margin:0px; padding:0px; width:100%; }
#pager li a:hover{background-color:#222; color:#fff;}
#headerContainer {
    margin: 5px 0 0 0;
    position:relative;
}
#mainContainer {

    padding: 0;
    clear:both;
}
#viewContainer{
    margin: 0px;
    top: auto;
    width:650px;
    float: right;
}

#myguests2 li{
    display: inline;
    margin: 1px;
}
#topmenu li{
    display:inline;
}
#float {
    border: 2px solid #5F7F7B;
    background-color: #D1EFEC;
    height: 30px;
    width: 350px;
    color: #4F4F4F;
    position: relative;
    left: 500px;
}
#step ul { list-style:none}
#step ul li{
    display:inline-block;
    float:left;
    padding-left:10px;
    width:120px;
    color: #999;
}
#inner-wrap{margin:0 auto; clear:both;}
#inner{margin-top:60px; text-align:center}
.tableborder {
    font-family: Tahoma, "MS Sans Serif", "Microsoft Sans Serif";
    border: 1px solid #CCCCCC;
    background-color:#FFFFFF;
    background-repeat: repeat-x;
    background-position: left top;
}
.fontthaibold {
    font-family:'sukhumvit_setthin',Tahoma, Geneva, sans-serif;
    font-size: 14px;
    color: #222222;
    font-weight: bold;

}
.fontthai {
    font-family:Tahoma,"MS Sans Serif","Microsoft Sans Serif";
    font-size: 14px;
    color: #222222;
}
.fontthai:hover {
    font-family: Tahoma,"MS Sans Serif", "Microsoft Sans Serif";
    font-size: 14px;
    color: #000000;
}
.grayfont {
    font-family: Tahoma,"MS Sans Serif", "Microsoft Sans Serif";
    font-size: 14px;
    color: #cccccc;
}
.headerfont {
    font-family:'sukhumvit_setthin',Tahoma, Geneva, sans-serif;
    font-size: 16px;
    font-weight: bold;
    color: #FF0000;
}
.headerblackfont1{
    font-family:'sukhumvit_setthin',Tahoma, Geneva, sans-serif;
    font-size: 18px;
    font-weight: bold;
    color: #000000;
}
.headerblackfont{
    font-family:'sukhumvit_setthin',Tahoma, Geneva, sans-serif;
    font-size: 18px;
    font-weight: bold;
    color: #000000;
}
.headergrayfont2{
    font-family:'sukhumvit_setthin',Tahoma, Geneva, sans-serif;
    font-size: 16px;
    font-weight: bold;
    color: #666666;
}
.headerredfont1{
    font-family:'sukhumvit_setthin',Tahoma, Geneva, sans-serif;
    font-size: 18px;
    font-weight: bold;
    color: #18BC9C;
    /*#FF0000;*/

}
.headerredfont1:hover{
    font-family:'sukhumvit_setthin',Tahoma, Geneva, sans-serif;
    font-size: 18px;
    font-weight: bold;
    color: #F90;
}
.headerbluefont1{
    font-family:'sukhumvit_setthin',Tahoma, Geneva, sans-serif;
    font-size: 18px;
    font-weight: bold;
    color: #06C;
}
.headerbluefont1:hover{
    font-family:'sukhumvit_setthin',Tahoma, Geneva, sans-serif;
    font-size: 18px;
    font-weight: bold;
    color: #06F;
}
.headerwhitefont1{
    font-family:'sukhumvit_setthin',Tahoma, Geneva, sans-serif;
    font-size: 18px;
    font-weight: bold;
    color: #FFFFFF;
}
.headerwhitefont{
    font-family:'sukhumvit_setthin',Tahoma, Geneva, sans-serif;
    font-size: 18px;
    font-weight: bold;
    color: #FFFFFF;
}
.headerwhitefont2{
    font-family:'sukhumvit_setthin',Tahoma, Geneva, sans-serif;
    font-size: 20px;
    font-weight: bold;
    color: #FFFFFF;
}
.headerredfont{
    font-family:'sukhumvit_setthin',Tahoma, Geneva, sans-serif;
    font-size: 18px;
    font-weight: bold;
    color:#18BC9C;
    /* #FF0000;*/
}
.normalfont {
    font-family:  Tahoma,"Microsoft Sans Serif", AngsanaUPC;
    font-size: 12px;
    color: #666666;
    font-weight: normal;
}
.normalfont:hover {
    font-family:  Tahoma,"Microsoft Sans Serif", AngsanaUPC;
    font-size: 12px;
    color: #000000;
    font-weight: normal;
}
.smallfont {
    font-family:  Tahoma,"Microsoft Sans Serif", AngsanaUPC;
    font-size: 11px;
    color: #333333;
}
.smallfont:hover {
    font-family:  Tahoma,"Microsoft Sans Serif", AngsanaUPC;
    font-size: 11px;
    color: #111111;
}
.prviewfont {
    font-family:  Tahoma,"Microsoft Sans Serif", AngsanaUPC;
    font-size: 10px;
    color: #222222;
    font-weight: normal;
}
.highlightfont {
    font-family: Tahoma, "Microsoft Sans Serif", AngsanaUPC;
    font-size: 12px;
    color: #FFFFFF;
    font-weight: bold;
}
.topic1font {
    font-family:'sukhumvit_setthin',Tahoma, Geneva, sans-serif;
    font-size: 50px;
    font-weight: bold;
    color: #FFFFFF;
    text-decoration: none;
}
.topic1fontwhite {
    font-family:'sukhumvit_setthin',Tahoma, Geneva, sans-serif;
    font-size: 50px;
    font-weight: bold;
    color: #FFFFFF;
    text-decoration: none;
}
.topic1fontblack {
    font-family:'sukhumvit_setthin',Tahoma, Geneva, sans-serif;
    font-size: 50px;
    font-weight: bold;
    color: #000000;
    text-decoration: none;
}
.menutopfont {
    font-family:'sukhumvit_setthin',Tahoma, Geneva, sans-serif;
    font-size: 14px;
    color: #003399;
    text-decoration: none;
    font-weight: bold;
}
.topic1whitefont {
    font-family:'sukhumvit_setthin',Tahoma, Geneva, sans-serif;
    font-size: 16px;
    color: #FFFFFF;
    font-weight: bold;
}
.menusmallfont {
    font-family:  "Tahoma","Microsoft Sans Serif", AngsanaUPC;
    font-size: 12px;
    color: #FFFFFF;
}
.menusmallfont:visited{
    font-family:  "Tahoma","Microsoft Sans Serif", AngsanaUPC;
    font-size: 12px;
    color: #FFFFFF;
}
.menusmallfont:hover {
    font-family:  "Tahoma","Microsoft Sans Serif", AngsanaUPC;
    font-size: 12px;
    color: #FFFF00;
    background-color: #000033;
}
.menusmallfont:link {
    font-family:  "Tahoma","Microsoft Sans Serif", AngsanaUPC;
    font-size: 12px;
    color: #FFFFFF;
}
.underlinelist {
    font-family: "Tahoma","Microsoft Sans Serif",  AngsanaUPC;
    font-size: 12px;
    border-bottom-style: solid;
    border-bottom-color: #CCCCCC;
    padding-bottom: 1px;
    border-bottom-width: 1px;
    border-top-width: 1px;
    border-right-width: 1px;
    border-left-width: 1px;
}
.topiclistfont {
    font-family: "Tahoma", "Microsoft Sans Serif", AngsanaUPC;
    font-size: 12px;
    color: #0099CC;
}
.adminsystemfor {
    font-family: Tahoma, Arial, Helvetica, sans-serif;
    font-size: 11px;
    font-weight: bold;
    color: #336699;
}
.adminsysfortop {
    font-family: Tahoma, Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
    color: #CCCCCC;
}

/*********** .relatedLinks styles ***********/
.pagename {
    font-family: Tahoma, Arial, Helvetica, sans-serif;
    font-size: 18px;
    color: #FFFFFF;
    font-weight: normal;
    background-color: #000000;
    padding-top: 5px;
    padding-right: 2px;
    padding-bottom: 2px;
    padding-left: 5px;

}
.header {
    font-family: Tahoma, Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-weight: bold;
    color: #333333;
}
.headerbg {
    font-family: Tahoma, Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-weight: bold;
    color: #006600;
}
.content {
    font-family: Tahoma;
    font-size: 16px;
    line-height: 1.5;
    color: #333333;
}
.footer-text {
    font-family: Tahoma, Arial, Helvetica, sans-serif;
    font-size: 10px;
    color: #666666;
}

.submit-bt{
    font-size: 24px;
    cursor:pointer;
    cursor:hand;
    width:auto;
    text-align:center;
}
.submit-bt:hover{

    font-size: 24px;
    cursor:pointer;
    cursor:hand;
    width:auto;
    text-align:center;
}

.powerline {
    font-family: Tahoma,"Microsoft Sans Serif", AngsanaUPC;
    font-size: 10px;
    font-weight: normal;
    color: #990000;
}
.tablebgpline {
    font-family:  Tahoma, "Microsoft Sans Serif", AngsanaUPC;
    font-size: 10px;
    border: thin solid #CC0000;
    font-weight: normal;
    color: #000066;

}
.notice {
    font-family:  Tahoma, "Microsoft Sans Serif", AngsanaUPC;
    font-size: 9px;
    color: #333333;
}
.topmenufont{
    font-family:'sukhumvit_setthin',Tahoma, Geneva, sans-serif;
    font-size: 12px;
    color: #000000;
    font-weight: bold;
}
.topmenufont:hover {
    font-family:'sukhumvit_setthin',Tahoma, Geneva, sans-serif;
    font-size: 12px;
    color: #FF0000;
    font-weight: bold;
}
.topmenufont:link {

}

.firststep {
    background-repeat: no-repeat;
    background-position: left top;
    font-family:'sukhumvit_setthin',Tahoma, Geneva, sans-serif;
    font-size: 12px;
    color: #000066;
    background-image: url(/images/left-back.gif);
}
.mainrightbg {
    background-image: url(/images/mainrightbg.gif);
    background-repeat: repeat-y;
    background-position: right;
}
.focusmark {
    font-family: Tahoma, "Tahoma", Thonburi, DBThaiText;
    font-size: 10px;
    color: #FF0000;
    background-image: url(/images/focus.jpg);
    background-repeat: no-repeat;
    background-position: left bottom;
}
.tableformat {
    font-family: "Tahoma", "Microsoft Sans Serif", AngsanaUPC;
    font-size: 12px;
    border: 1px solid #999999;
    margin: auto;
    padding: 1px;
}
.highlightfont:link {

    font-family: Tahoma, "Microsoft Sans Serif", AngsanaUPC;
    font-size: 12px;
    color: #FFFFFF;
    font-weight: bold;
}
.highlightfont:visited {
    font-family: Tahoma, "Microsoft Sans Serif", AngsanaUPC;
    font-size: 12px;
    color: #FFFFFF;
    font-weight: bold;
}
.bgfont{
    font-family: Tahoma, "Microsoft Sans Serif", AngsanaUPC;
    font-size: 12px;
    color: #E6F3FB
}
.bannerbg {
    background-repeat: no-repeat;
    background-position: right top;
    font-family:  Tahoma, "Microsoft Sans Serif", AngsanaUPC;
    font-size: 12px;
    color: #000000;

}
.fontgreen{
    font-family: Tahoma, "MS Sans Serif", "Microsoft Sans Serif";
    font-size: 12px;
    color: #66CC00;
    font-weight: bold;
}
.fontmenu {
    font-family:'sukhumvit_setthin',Tahoma, Geneva, sans-serif;
    font-size: 14px;
    color: #0066FF;
    font-weight: bold;
}
.fontmenu:link {
    font-family:'sukhumvit_setthin',Tahoma, Geneva, sans-serif;
    font-size: 14px;
    color:  #0066FF;
    font-weight: bold;
}
.fontmenu:visited {
    font-family:'sukhumvit_setthin',Tahoma, Geneva, sans-serif;
    font-size: 14px;
    color:  #0066FF;
    font-weight: bold;
}
.fontmenu:hover {
    font-family:'sukhumvit_setthin',Tahoma, Geneva, sans-serif;
    font-size: 14px;
    color: #222;
    font-weight: bold;
}
.fontwhite {
    font-family: Tahoma, "MS Sans Serif", "Microsoft Sans Serif";
    font-size: 14px;
    color: #FFFFFF;
    font-weight: normal;
    text-decoration: none;
}
.fontwhite:link {
    font-family: Tahoma, "MS Sans Serif", "Microsoft Sans Serif";
    font-size: 14px;
    color: #FFFFFF;
    font-weight: normal;
    text-decoration: none;
}
.smallfontwhite {
    font-family: Tahoma, "MS Sans Serif", "Microsoft Sans Serif";
    font-size: 10px;
    color: #FFFFFF;
    font-weight: normal;
}
.smallfontgray {
    font-family: Tahoma, "MS Sans Serif", "Microsoft Sans Serif";
    font-size: 10px;
    color: #CCC;
    font-weight: normal;
}
.fontorangenormal {
    font-family: Tahoma, "MS Sans Serif", "Microsoft Sans Serif";
    color: #FF6600;
}
.fontgreennormal,.text-success {
    font-family: Tahoma, "MS Sans Serif", "Microsoft Sans Serif";
    font-size: 12px;
    color: #66CC00;
    font-weight: bold;
}
.fontrednormal {
    font-family: Tahoma, "MS Sans Serif", "Microsoft Sans Serif";
    font-size: 12px;
    color: #18BC9C; /*#ff0000;*/
    font-weight: bold;
}
.fontdarkbluenormal,.text-info {
    font-family: Tahoma, "MS Sans Serif", "Microsoft Sans Serif";
    font-size: 12px;
    color: #003399;
    font-weight: bold;
}
.fontskybluenormal {
    font-family: Tahoma, "MS Sans Serif", "Microsoft Sans Serif";
    font-size: 12px;
    color: #0099ff;
    font-weight: bold;
}
.highlightbg {
    background-image: url(/images/bghighlight.gif);
    background-repeat: repeat-x;
}
.excelbutton{
    BORDER-RIGHT: #fdfed1 1px solid;
    BORDER-TOP: #fdfed1 1px solid;
    BORDER-LEFT: #fdfed1 1px solid;
    COLOR: #999999;
    BORDER-BOTTOM: #fdfed1 1px solid;
    HEIGHT: 20px;
    width:22px;
    cursor:hand;
    font-size: 11px;
    border-style : solid;
    border-width : 1px;
    background-image: url(/images/mime_excel.gif);
}
.title_h2 {
    width:300px;
    padding:12px 0 0 14px;
    font-family:'sukhumvit_setthin',Tahoma, Geneva, sans-serif;
    font-size: 12px;
}
.border_preview{
    z-index:100;
    position:absolute;
    border: 1px solid #fff;
}
.preview_temp_load {
    vertical-align:middle;
    text-align:center;
    padding: 10px;
}
.preview_temp_load img{
    vertical-align:middle;
    text-align:center;
}
.bannerbgpic {
    background:#000
}
.mainshadowtowhite{

    background-repeat: repeat-x;
    background-position: left top;
}
.mainshadowtogray{

    background-repeat: repeat-x;
    background-position: left top;
}
.fontviolet {
    font-family: Tahoma, "MS Sans Serif", "Microsoft Sans Serif";
    font-size: 12px;
    color: #660099;
    font-weight: bold;
}
.fontpink {
    font-family: Tahoma, "MS Sans Serif", "Microsoft Sans Serif";
    font-size: 12px;
    color: #18BC9C; /*#ff0099;*/
    font-weight: bold;
}
.fontorange {
    font-family: Tahoma, "MS Sans Serif", "Microsoft Sans Serif";
    font-size: 12px;
    color: #18BC9C; /*#F90;*/
    font-weight: bold;
}
.shadow_bottom{

    background-position:bottom;
    background-repeat:repeat-x;
}
.shadow_bottom_todark{

    background-position:bottom;
    background-repeat:repeat-x;
}
.shadow_top{

    background-position:top;
    background-repeat:repeat-x;
}
.shadow_top_right{

    background-position:right;
    background-repeat:no-repeat;
}
.shadow_right{

    background-repeat:repeat-y;
    background-position:right;
    clear:both;
}
.darktopic_bg{
    background-image:url(/images/rightcolumnbg.jpg);
    background-position:top;
    background-repeat:repeat-x;
}
.widget_bg{
    background-repeat: no-repeat;
}
/* GLOBAL STYLES*/

.tableborder tr td table tr .headerfont table {
    color: #000;
}
.inputbox.disabled {
    border: 1px solid #F2F2F2;
    background-color: #F2F2F2;
}
.inputbox.required, textarea.required {
    border: 1px solid #00A8E6;
}
.inputbox.validation-failed, textarea.validation-failed {
    border: 1px solid #FF3300;
    color : #FF3300;
}
.inputbox.validation-passed, textarea.validation-passed {
    border: 1px solid #00CC00;
    color : #000;
}
.validation-advice {
    margin: 5px 0;
    padding: 5px;
    background-color: #FF3300;
    color : #FFF;
    font-weight: bold;
}
.custom-advice {
    margin: 5px 0;
    padding: 5px;
    background-color: #C8AA00;
    color : #FFF;
    font-weight: bold;
}
.form-row {
    clear: both;
    padding: 0.5em;
}
#navigation li {
    display: inline;
    float: left;
    height: 30px;
    position: relative;
    list-style: none;
    margin:0 2px;
}
#navigation ul {
    display: block;
    position: absolute;
    left: -20px;
    top: 25px;
    padding-top:5px;
    width:auto;
}
#navigation ul li {
    float: left; /*For Gecko*/
    display: block !important;
    display: inline; /*For IE*/
    margin: 0px;
    padding: 0px;
    line-height: normal;
    height: 30px;
    width: 110;
}
#navigation ul li a {
    display: block;
    margin-top: 0px;
    padding-top: 5px;
    font-weight: normal;
    text-align: left;
    height:30px;
    line-height: normal;
    width: 110px;
}
#navigation ul li a:hover {
    display: block;
    color:#F00;
    margin: 0;
    padding-top: 5px;
    font-weight: normal;
    height:30px;
    text-align: left;
    line-height: normal;
    width: 110px;

}
#feature #intro #overlay{
    position:absolute;
    top:0px;
    right:0px;
    height:240px;
    width:400px;
    z-index:2000;
    background:url(/theme/default/images/bg-feature-image-gloss.png) no-repeat;
    background-size:contain;
    background-position:300px;
}
#feature #intro #overlay1{
    position:absolute;
    top:0px;
    right:0px;
    height:330px;
    width:377px;
    z-index:2000;
    background:url(/theme/default/images/bg-feature-image-gloss.png) no-repeat;
    background-position:280px;
}
#feature #intro #overlay2{
    position:absolute;
    top:300px;
    right:0px;
    height:30px;
    width:377px;
    z-index:2000;
    background:url(/theme/default/images/bg-feature-image-gloss.png) no-repeat;
    background-position:280px;
}

#tabs {
    list-style: none;
}
#tabs li {
    float: left;
}
#tabs a {
    float: left;
    padding: 5px 8px;
    margin-left: 6px;
    background-color: #F2F2F2;
    text-decoration: none;
    color: #999999;
}
#tabs a.active-tab {
    background-color: #CCC;
    border-top: 3px solid #999;
    padding-top: 3px;
    color: #000;
}
.inputbox.disabled {
    border: 1px solid #F2F2F2;
    background-color: #F2F2F2;
}
.inputbox.required, textarea.required {
    border: 1px solid #00A8E6;
}

.validation-advice {
    margin: 5px 0;
    padding: 5px;
    background-color: #FF3300;
    color : #FFF;
    font-weight: bold;
}
.custom-advice {
    margin: 5px 0;
    padding: 5px;
    background-color: #222;
    color : #FFF;
    font-weight: bold;
}

.form-row {
    clear: both;
    padding: 0.5em;
}
.autocomplete-w1 {  position:absolute; top:4px; left:3px; /* IE6 fix: */ _background:none; _top:1px; }
.autocomplete-w2 { padding:0 6px 6px 0; }
.autocomplete { width:300px; border:1px solid #999; background:#FFF; cursor:default; text-align:left; max-height:350px; overflow:auto; margin:-6px 6px 6px -6px; /* IE specific: */ _height:350px;  _margin:0px 6px 6px 0; overflow-x:hidden; }
.autocomplete .selected { background:#F0F0F0; }
.autocomplete div { padding:2px 5px; white-space:nowrap; }
.autocomplete strong { font-weight:normal; color:#3399FF; }
#solutions p{
    line-height:normal;
}

/*Original Code: http://www.howtocreate.co.uk/fixedPosition.html
Snippet With Example: http://code.dreamincode.net/snippet370.htm
CSS with support for IE
*/
div#catfish {
    z-index: 100;
    white-space: nowrap;
    display:none;   /* Stops catfish appearing before the page is fully loaded */
    text-align: center;
    border-top: 0px solid black;
}


ul.rightmenu  {height: 33px; float: right; }
ul.rightmenu > li {
    margin: -1px 0 0 0;
    padding: 6px 5px 8px 5px;
    display: inline-block;
    width: 66px;
    text-align: center;
    border-top: 1px solid transparent;
    border-left: 1px solid transparent;
    border-right: 1px solid transparent;
}
ul.rightmenu > li:hover {
    background-color: #627BBE;
    border-top: 1px solid #1D4088;
}
ul.fb-simple-class {
    background-color: #FFF;
    min-height: 74px;
    border-bottom: 1px solid #000;
    border-left: 1px solid #000;
    border-right: 1px solid #000;
    width: 204px;
}
ul.rightmenu > li.selected {
    background-color: #FFF;
    border-top: 1px solid #000;
    border-left: 1px solid #000;
    border-right: 1px solid #000;
}
ul.rightmenu > li.selected a { color: #000; }
ul.rightmenu > li a {
    display: block;
    font-size: 12px;
    text-decoration: none;
    font-weight: bold;
    padding-top: 3px;
    padding-right: 10px;
    color: white;
}
a.ico-down {
    background: url(../images/ico_menu_down.gif) no-repeat scroll 57px 9px transparent;
}
li.userinfo { margin: 0 2px 0 2px; border-bottom: 1px solid #c1c1c1; overflow: hidden;}
li.userinfo span { padding: 2px; }
li.userinfo span.title { font-size: 1.3em; color: #3C528E; font-weight: bold; }
li.userinfo:hover { text-decoration: underline; background-color:#C00; color:#FFF}
li.userinfo span a:hover { text-decoration: underline; background-color:#C00; color:#FFF}
/*3a579a*/
li.link {
    display:inline-block;
    margin-top: 10px;
    margin-bottom: 10px;
    font-size: 1.2em;
    color: #3C528E;
    height: 20px;
    border-top: 1px solid #FFF;
    border-bottom: 1px solid #FFF;
    padding:0;
}
li.link:hover {
    background-color: #6D84B4;
    border-top: 1px solid #3b5998;
    border-bottom: 1px solid #3b5998;
}
li > span {
    line-height: 20px;
}
li > span a {
    color: #3C528E;
    text-decoration: none;
    padding-left: 3px;
}

/**
LEFT MENU
*/
ul.leftmenu  {
    height: 33px;
    float: left;
    display: block;
    padding-left:10px;
}
ul.leftmenu > li {
    width: 33px;
    height: 33px;
    margin: -10px 0 0 0;
    padding: 0;
    display: inline-block;
    border-top: 1px solid transparent;
    border-left: 1px solid transparent;
    border-right: 1px solid transparent;
}
ul.leftmenu > li:hover {
    background-color:#222;
    color:#FFF;
}
ul.leftmenu > li.selected {
    background-color: #FFF;
    border-top: 1px solid #000;
    border-left: 1px solid #000;
    border-right: 1px solid #000;
}
ul.left-fb-simple-class {
    background-color: #FFF;
    min-height: 74px;
    margin-top:-5px;
    border-bottom: 1px solid #000;
    border-left: 1px solid #000;
    border-right: 1px solid #000;
    padding:0;
    width: 300px;

}

.pitem {
    width: 140px;
    height: 80px;
    /*border:1px solid #222;*/
    margin: 3px;
    /* required to hide the image after resized */
    overflow: hidden;
    /* for child absolute position */
    position: relative;
    /* display div in line */
    float: left;
    text-align: center;
}
.zitem {
    /*width:142px;*/
    height:98px;
    border:#09F  thin solid;
    padding:3px;

    /* required to hide the image after resized */
    overflow:hidden;
    /* for child absolute position */
    position:relative;
    /* display div in line */
    float:left;
    text-align:center;
}
.zitem .caption1 {
    width:100%;
    height:100%;
    background:#000;
    background-image:url(images/icons/lock32x32.png); background-repeat:no-repeat; background-position:top right;
    color:#FFF;
    font-weight:bold;
    text-align:center;
    padding-top:30px;
    /* fix it at the bottom */
    position:absolute;
    /*bottom:-1px; *//* fix IE issue */
    left:0;
    /* hide it by default */
    display:block;
    /* opacity setting */
    filter:alpha(opacity=70);    /* ie  */
    -moz-opacity:0.7;    /* old mozilla browser like netscape  */
    -khtml-opacity: 0.7;    /* for really really old safari */
    opacity: 0.7;    /* css standard, currently it works in most modern browsers like firefox,  */
}
.zitem .caption {
    width:100%;
    height:20px;
    background:#000;
    color:#0C0;
    font-weight:bold;
    text-align:center;
    /* fix it at the bottom */
    position:absolute;
    padding-top:3px;
    bottom:-1px; /* fix IE issue */
    left:0;

    /* hide it by default */
    display:block;
    /* opacity setting */
    filter:alpha(opacity=70);    /* ie  */
    -moz-opacity:0.7;    /* old mozilla browser like netscape  */
    -khtml-opacity: 0.7;    /* for really really old safari */
    opacity: 0.7;    /* css standard, currently it works in most modern browsers like firefox,  */
}
.zitem .caption a {
    text-decoration:none;
    color:#fff;
    font-size:12px;
    text-align:center;

    /* add spacing and make the whole row clickable*/
    padding:5px;
    display:block;

}
.zitem .first{
    clear: left;
    margin-left: 2px;
}
.zitem img{
    width:100%;
    height:auto;
}
.mpic {
    /*border:1px solid #222;*/
    margin:2px;

    /* required to hide the image after resized */
    overflow:hidden;

    /* for child absolute position */
    position:relative;

    /* display div in line */
    display:inline-block;
    text-align:center;
    border:1px;
    /* allow javascript moves the img position*/
    opacity:0.8; /* css standard */
    filter:alpha(opacity=80); /* internet explorer */
    -moz-opacity:0.8;    /* old mozilla browser like netscape  */
    -khtml-opacity:0.8;    /* for really really old safari */
}
.mpic:hover{
    opacity:1; /* css standard */
    filter:alpha(opacity=100); /* internet explorer */
    -moz-opacity:1;    /* old mozilla browser like netscape  */
    -khtml-opacity:1;    /* for really really old safari */
}
.mpic .first{
    clear: left;
    margin-left: 2px;
}
.mpic .caption {
    width:80px;
    height:25px;
    background:#000;
    color:#fff;
    font-size:9px;
    font-weight:normal;
    text-align:center;
    /* fix it at the bottom */
    position:absolute;
    bottom:-1px; /* fix IE issue */
    left:0;
    /* hide it by default */
    display:block;
    /* opacity setting */
    filter:alpha(opacity=50);    /* ie  */
    -moz-opacity:0.7;    /* old mozilla browser like netscape  */
    -khtml-opacity: 0.7;    /* for really really old safari */
    opacity: 0.7;    /* css standard, currently it works in most modern browsers like firefox,  */
}
.mpic .caption a {
    text-decoration:none;
    color:#fff;
    font-size:10px;
    text-align:center;
    /* add spacing and make the whole row clickable*/
    padding:2px;
    display:block;

}

#othermpiclist img {
    border:1;
    /* allow javascript moves the img position*/
    position:absolute;
    left:0;
    top:0;

}
#piclist img {
    border:1;
    /* allow javascript moves the img position*/
    position:absolute;
    left:0;
    top:0;

}
#clipthumb{
    position:relative;
    min-height:220px;
}
#clipthumb img {
    border:5;
    /* allow javascript moves the img position*/
    position:absolute;
    left:0;

}
.clear {
    clear:both;
}
.fb_share_button{
    background:url(images/icons/fb_share_bt_bg.gif) no-repeat 0 0;
    font-size:11px;
    font-weight:normal;
    color:#039;
    padding:2px 1px 2px 20px;
    margin-left:2px;
}

.orange:hover { color: #fff; background: #ff801f !important;  background: -moz-linear-gradient(top, #ffa432 0%, #ff781c 100%)!important; background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffa432), color-stop(100%,#ff781c));  background: -o-linear-gradient(top, #ffa432 0%,#ff781c 100%) !important; }
.facebookbutton{
    border:1px solid #4870bc; -webkit-border-radius: 3px; -moz-border-radius: 3px;border-radius: 3px; font-family:arial, helvetica, sans-serif; padding: 4px 5px 7px 0px; text-shadow: -1px -1px 0 rgba(0,0,0,0.3);font-weight:bold; text-align: center; color: #FFFFFF; background-color: #6D8DCA;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #6D8DCA), color-stop(100%, #3A599C));
    background-image: -webkit-linear-gradient(top, #6D8DCA, #3A599C);
    background-image: -moz-linear-gradient(top, #6D8DCA, #3A599C);
    background-image: -ms-linear-gradient(top, #6D8DCA, #3A599C);
    background-image: -o-linear-gradient(top, #6D8DCA, #3A599C);
    background-image: linear-gradient(top, #6D8DCA, #3A599C);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#6D8DCA, endColorstr=#3A599C);
    cursor:pointer;
}
.facebookbutton:hover {
    border:1px solid #4870bc; background-color: #4870bc;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4870bc), color-stop(100%, #2c4477));
    background-image: -webkit-linear-gradient(top, #4870bc, #2c4477);
    background-image: -moz-linear-gradient(top, #4870bc, #2c4477);
    background-image: -ms-linear-gradient(top, #4870bc, #2c4477);
    background-image: -o-linear-gradient(top, #4870bc, #2c4477);
    background-image: linear-gradient(top, #4870bc, #2c4477);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#4870bc, endColorstr=#2c4477);
    cursor:pointer;
}
.facebookicon{
    background:url(/images/icons/icon_facebook.png)  no-repeat;
    padding:5px 0 5px 26px;
    height:26px;
    font-size:12px;
}
.submit{
    height:30px; width:150px; padding-top:4px;  font-size:18px; color:#FFF; cursor:pointer
}
.inputbox{ height: 25px; font-size: 1.1em; padding: 0 0 0 5px; line-height: 1em; color: #555; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; border:1px solid #09F; }

/* footer elements */

.facebook-ico { background-position: 0 -711px; width: 16px; height: 16px; }
.twitter-ico { background-position: 0 -777px; width: 16px; height: 16px; }
.linkedin-ico { background-position: 0 -843px; width: 16px; height: 16px; }
.blog-ico { background-position: 0 -909px; width: 16px; height: 16px; }
.copyright { float: left; left: 50%; position: relative; margin: 0 0 40px 0;}
.copyright > div { float: left; position: relative; right: 50%; line-height: 2em; }
.implix-logo { background-position: 0 -1107px; width: 66px; height: 24px; display: block; text-indent: -999em; margin: 0 10px 0 0; }
.copyright { float: left; left: 50%; margin: 35px 0 0 0; position: relative; }
.copyright > div { float: left; line-height: 2em; position: relative; right: 50%; }



.closebutton
{
    float: right;
    text-decoration: none;
}
#pageloading .caption {
    height:1900px;
    width:100%;
    background:#000;
    color:#fff;
    text-align:center;
    vertical-align:middle;
    /* fix it at the bottom */
    position:absolute;
    z-index:2500;
    left:0;
    top:0;
    /* hide it by default */
    display:block;
    /* opacity setting */
    filter:alpha(opacity=50);    /* ie  */
    -moz-opacity:0.7;    /* old mozilla browser like netscape  */
    -khtml-opacity: 0.7;    /* for really really old safari */
    opacity: 0.7;    /* css standard, currently it works in most modern browsers like firefox,  */
    padding-top:400px;
}
#focuspage .caption {
    height:3800px;
    width:100%;
    background:#000;
    color:#fff;
    text-align:center;
    /*vertical-align:middle;*/
    /* fix it at the bottom */
    position:absolute;
    z-index:3500;
    left:0;
    top:0;
    /* hide it by default */
    display:block;
    /* opacity setting */
    filter:alpha(opacity=50);    /* ie  */
    -moz-opacity:0.7;    /* old mozilla browser like netscape  */
    -khtml-opacity: 0.7;    /* for really really old safari */
    opacity: 0.7;    /* css standard, currently it works in most modern browsers like firefox,  */
    padding-top:400px;
}
#displayfocus{
    position:absolute;
    z-index:5001;
    text-align:center;
    width:100%;
    display:block;
    top:0;
}
#focuscontent{
    text-align:center;
    width:100%;
    margin:160px auto;
    clear:both;
    display:block;
}
.fileinput-button {
    position: relative;
    overflow: hidden;
    margin-right: 4px;
}
.fileinput-button input {
    position: absolute;
    top: 0;
    right: 0;
    margin: 0;
    border: solid transparent;
    border-width: 0 0 2px 2px;
    opacity: 0;
    filter: alpha(opacity=0);
    -moz-transform: translate(-300px, 0) scale(4);
    direction: ltr;
    cursor: pointer;
}
.fileupload-buttonbar .btn,
.fileupload-buttonbar .toggle {
    margin-bottom: 5px;
}
.files .progress {
    width: 200px;
}
.progress-animated .bar {
    background: url(/images/icons/loader.gif) !important;
    filter: none;
}
.fileupload-loading {
    position: absolute;
    left: 50%;
    width: 128px;
    height: 30px;
    background: url(images/icons/loading.gif) center no-repeat;
    display: none;
}
.fileupload-processing .fileupload-loading {
    display: block;
}
/* Fix for IE 6: */
*+html .fileinput-button {
    line-height: 22px;
    margin: 1px -3px 0 0;
}
/* Fix for IE 7: */
*+html .fileinput-button {
    margin: 1px 0 0 0;
}
@media (max-width: 480px) {
    .files .button span {
        display: none;
    }
    .files .preview * {
        width: 40px;
    }
    .files .name * {
        width: 80px;
        display: inline-block;
        word-wrap: break-word;
    }
    .files .progress {
        width: 20px;
    }
    .files .delete {
        width: 60px;
    }
}
.mprofilepicture_icon {
    height:40px;
    position:absolute !important;
    z-index:1000;
    width:150px;
    right:0;
    left:0;
    margin-left:auto;
    margin-right:auto;
    bottom:0;
    margin-top:20px;
    font-size:16px;
    opacity: 0.7;

}
.mprofilepicture_icon .fa{
    font-size: 20px;
    opacity: 0.6;
    filter: alpha(opacity=0.6);
}
.mprofilepicture_icon input {
    position: absolute;
    top: 0;
    right: 0;
    margin-left:30px;
    border: solid transparent;
    border-width: 0 0 0px 2px;
    opacity: 0;
    filter: alpha(opacity=0);
    -moz-transform: translate(-300px, 0) scale(4);
    direction: ltr;
    cursor: pointer;
}
.whitepencil
{
    background-position:right bottom;
}
.hidden
{
    display:none;
}
.show{
    display:block;
}
.rate{
    height:30px;
    width:170px;
    background:url(images/icons/rate_star_icons.png) no-repeat;
}
.fivestar{
    background-position:0 -140px ;
}
.commentbox{
    float:left;
    background-color:rgba(255,255,255,0.9);
    padding:5px;
    width:100%;
}
.commentform{
    -moz-box-shadow: inset 0 0 5px #888;
    -webkit-box-shadow: inset 0 0 5px#888;
    box-shadow: inner 0 0 5px #888;
}
.widget{
    -moz-border-radius: 4px;
    border-radius: 4px;
    overflow:hidden;
    display:block;
    color:#333;
    background-image: -ms-radial-gradient(center, circle farthest-corner, #FFFFFF 0%, #F5F5F5 100%);

    /* Mozilla Firefox */
    background-image: -moz-radial-gradient(center, circle farthest-corner, #FFFFFF 0%, #F5F5F5 100%);

    /* Opera */
    background-image: -o-radial-gradient(center, circle farthest-corner, #FFFFFF 0%, #F5F5F5 100%);

    /* Webkit (Safari/Chrome 10) */
    background-image: -webkit-gradient(radial, center center, 0, center center, 506, color-stop(0, #FFFFFF), color-stop(1, #F5F5F5));

    /* Webkit (Chrome 11+) */
    background-image: -webkit-radial-gradient(center, circle farthest-corner, #FFFFFF 0%, #F5F5F5 100%);

    /* W3C Markup, IE10 Release Preview */
    background-image: radial-gradient(circle farthest-corner at center, #FFFFFF 0%, #F5F5F5 100%);
    /* SVG as background image (IE9/Chrome/Safari/Opera) */
    background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8cmFkaWFsR3JhZGllbnQgaWQ9Imc0NDQiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiBjeD0iNTAlIiBjeT0iNTAlIiByPSIxMDAlIj4KPHN0b3Agc3RvcC1jb2xvcj0iI0ZGRkZGRiIgb2Zmc2V0PSIwIi8+PHN0b3Agc3RvcC1jb2xvcj0iI0Q5RDlEOSIgb2Zmc2V0PSIxIi8+CjwvcmFkaWFsR3JhZGllbnQ+CjxyZWN0IHg9Ii01MCIgeT0iLTUwIiB3aWR0aD0iMTAxIiBoZWlnaHQ9IjEwMSIgZmlsbD0idXJsKCNnNDQ0KSIgLz4KPC9zdmc+);

}
.widget-bottom-curve{
    -moz-border-bottom-left-radius: 4px;
    -moz-border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    overflow:hidden;
    font-size:12px;
    display:block;
    color:#333;
    background-image: -ms-radial-gradient(center, circle farthest-corner, #FFFFFF 0%, #F5F5F5 100%);

    /* Mozilla Firefox */
    background-image: -moz-radial-gradient(center, circle farthest-corner, #FFFFFF 0%, #F5F5F5 100%);

    /* Opera */
    background-image: -o-radial-gradient(center, circle farthest-corner, #FFFFFF 0%, #F5F5F5 100%);

    /* Webkit (Safari/Chrome 10) */
    background-image: -webkit-gradient(radial, center center, 0, center center, 506, color-stop(0, #FFFFFF), color-stop(1, #F5F5F5));

    /* Webkit (Chrome 11+) */
    background-image: -webkit-radial-gradient(center, circle farthest-corner, #FFFFFF 0%, #F5F5F5 100%);

    /* W3C Markup, IE10 Release Preview */
    background-image: radial-gradient(circle farthest-corner at center, #FFFFFF 0%, #F5F5F5 100%);
    /* SVG as background image (IE9/Chrome/Safari/Opera) */
    background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8cmFkaWFsR3JhZGllbnQgaWQ9Imc0NDQiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiBjeD0iNTAlIiBjeT0iNTAlIiByPSIxMDAlIj4KPHN0b3Agc3RvcC1jb2xvcj0iI0ZGRkZGRiIgb2Zmc2V0PSIwIi8+PHN0b3Agc3RvcC1jb2xvcj0iI0Q5RDlEOSIgb2Zmc2V0PSIxIi8+CjwvcmFkaWFsR3JhZGllbnQ+CjxyZWN0IHg9Ii01MCIgeT0iLTUwIiB3aWR0aD0iMTAxIiBoZWlnaHQ9IjEwMSIgZmlsbD0idXJsKCNnNDQ0KSIgLz4KPC9zdmc+);

}
.fb_login{
    cursor:pointer;
}
.ppiclist {
    text-align:center;
}
#preview_div {
    display: none;
    position: absolute;
    z-index:110;
}
#tooltip{
    position:absolute; visibility:hidden; z-index:5002
}
#step_bar{
    background:url(/images/steps_bar_v2.png) no-repeat left;
    width:100%;
    height:162px;
    display:inline-inline;
    margin:0 auto;
}
.capturebanner{
    position: relative;
    height: 420px;
    background-size: cover;
}
#sideContainer2 {
    width: 30%;
    max-width: 250px;
    float: left;
    overflow: hidden;

}
#fixedSidebar{
    margin-left:0px;
    display:block;
    position:absolute;
}
#fixedSidebar.fixed{
    position: fixed;
    top:150px;
}
#sidebarmenu{
    margin-right:3px;
    padding-right:5px;
}
#sidebarmenu ul li{
    font-size:12px;
    font-weight:bold;
    color:#06C;
    text-align:left;
}
#sidebarmenu ul li:hover{
    font-size:12px;
    font-weight:bold;
    color:#003;
    background-color:#9CF;
}
.productcontent,.mainview{
    margin:0 0 2px 4px;
    text-align:left;
    padding:4px;
    background-color:#FFF;
    /* IE10 Consumer Preview */
    /* SVG as background image (IE9/Chrome/Safari/Opera) */
    background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8cmFkaWFsR3JhZGllbnQgaWQ9Imc0NDQiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiBjeD0iNTAlIiBjeT0iNTAlIiByPSIxMDAlIj4KPHN0b3Agc3RvcC1jb2xvcj0iI0ZGRkZGRiIgb2Zmc2V0PSIwIi8+PHN0b3Agc3RvcC1jb2xvcj0iI0Q5RDlEOSIgb2Zmc2V0PSIxIi8+CjwvcmFkaWFsR3JhZGllbnQ+CjxyZWN0IHg9Ii01MCIgeT0iLTUwIiB3aWR0aD0iMTAxIiBoZWlnaHQ9IjEwMSIgZmlsbD0idXJsKCNnNDQ0KSIgLz4KPC9zdmc+);
    background-image: -ms-radial-gradient(center, circle farthest-corner, #FFFFFF 0%, #F5F5F5 100%);
    /* Mozilla Firefox */
    background-image: -moz-radial-gradient(center, circle farthest-corner, #FFFFFF 0%, #F5F5F5 100%);
    /* Opera */
    background-image: -o-radial-gradient(center, circle farthest-corner, #FFFFFF 0%, #F5F5F5 100%);
    /* Webkit (Safari/Chrome 10) */
    background-image: -webkit-gradient(radial, center center, 0, center center, 506, color-stop(0, #FFFFFF), color-stop(1, #F5F5F5));
    /* Webkit (Chrome 11+) */
    background-image: -webkit-radial-gradient(center, circle farthest-corner, #FFFFFF 0%, #F5F5F5 100%);
    /* W3C Markup, IE10 Release Preview */
    background-image: radial-gradient(circle farthest-corner at center, #FFFFFF 0%, #F5F5F5 100%);
}

/* for sale page editor*/
#top_menu{
    background:#000;
    position:absolute;
    filter:alpha(opacity=60);    /* ie  */
    -moz-opacity:0.6;    /* old mozilla browser like netscape  */
    -khtml-opacity: 0.6;    /* for really really old safari */
    opacity: 0.6;    /* css standard, currently it works in most modern browsers like firefox,  */
    padding:5px;
}
#top_menu ul {
    margin:0px;
}
#top_menu ul li {
    list-style:none;
}

#footerAdv{
    overflow:visible; clear:both; display:inline" align="center" class="fontwhite;
}
#featurecontainer{
    position:relative;
}
.featurecontainer{
    margin-left:auto;
    margin-right:auto;
}
#formRegbg {
    height:350px;
    margin-top:10px;
    position:relative;
    overflow:hidden;
    background-color:#FFF;
    background-image:url(/images/optin.gif);
    background-repeat:no-repeat;
    background-position:center;
    padding: 0 10px 10px 10px;
    text-align:center;
}
#formRegbg .topic1fontblack{
    font-size:22px !important;
}
.navbar-collapse.in{
    overflow:visible;
}
@media (min-width: 768px){
    .featurecontainer {
        max-width: 750px;
    }
}
@media (min-width: 992px){

    .featurecontainer {
        max-width: 970px;
    }
    .start-button{
        z-index: 1000; position: absolute; width: 119px; height: 117px; left: 46%; top: 60%;
    }
}
@media (min-width: 1200px){
    .featurecontainer {
        max-width: 1170px;
    }
}
@media (max-width: 992px){ /* tablet view*/

   .navbar-header .logo,.modal-header .logo{
        /*background-image:url(/images/logoonly50x50.png); */
        background-image:url(/images/thegiftlogo.png);
        background-size:contain;
        background-repeat:no-repeat;
        background-position:left;
        width:120px;
        height:45px;
        margin-top:5px;
        float:left; display:inline;
    }
}
@media (max-width: 768px){
    .start-button{
        position:fixed;
        bottom:0;
        left:0;
        right:0;
        margin-left:auto;
        margin-right:auto;
        z-index:100;
    }
    section{
        padding:20px;
    }
}
.otherfriends-list{
    position:relative;
    height:110px;
    overflow:hidden;
    padding-bottom:20px;
    background-color:#FFF;  text-align:center; -moz-border-radius: 0px; -webkit-border-radius: 0px; border-radius: 0px; margin: auto;
}
.otherfriendcontainer{
    padding-bottom:20px;
    background:#fff;
}
/* Login Form */
#loginForm, #regForm {

    border: 1px solid #899caa;
    border-radius: 3px 0 3px 3px;
    -moz-border-radius: 3px 0 3px 3px;
    margin-top: -1px;
    background: #d2e0ea;
    padding: 6px;
}
#loginForm fieldset, #regForm fieldset {
    margin: 0 0 5px 0;
    display: block;
    border: 0;
    padding: 0;
}
fieldset.body {
    background: #fff;
    border-radius: 3px;
    -moz-border-radius: 3px;
    padding: 10px 13px !important;
}
fieldset.body fieldset{
    margin: 0px auto;

}
#loginForm #checkbox {
    width: auto;
    margin: 1px 9px 0 0;
    float: left;
    padding: 0;
    border: 0;
    margin:-3px 9px 0 0; /* IE7 Fix */
}
.body label {
    color: #3a454d;
    margin: 9px 0 0 0;
    display: block;
    float: left;
}
#loginForm .body fieldset label, #regForm .body fieldset label {
    display: block;
    float: none;
    margin: 0 0 6px 0;
}
/* Default Input */

/* Sign In Button */
#loginForm #Signin {
    width: auto;
    float: left;
    background: #339cdf;
    color: #fff;
    padding: 7px 10px 8px 10px;
    text-shadow: 0px -1px #278db8;
    border: 1px solid #339cdf;
    box-shadow: none;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    margin: 0 12px 0 0;
    cursor: pointer;
    *padding:7px 2px 8px 2px; /* IE7 Fix */
}
/* Forgot your password */

#loginForm span a {
    color: #3a454d;
    text-shadow: 1px 1px #fff;
    font-size: 12px;
    cursor: pointer;
}
#loginForm label.error, label.error {
    /* remove the next line when you have trouble in IE6 with labels in list */
    color: red;
    font-style: italic;
    font-weight: normal;
    font-size: 9px;
}
div.error {
    display: none;
}
#fb_login, #fb_reg, #fb_login2 {
    cursor: pointer;
}
#feature.step-clips{
    position:relative;
    background: url(/images/capture_unlock_bg2_1170.png) no-repeat;
    background-size:cover cover;
    min-height:420px;
    padding:5px 5px 5px 10px;
}
.social-icons{
    text-align:center;
}
.convas-light{
    background:url(/theme/default/images/bg-canvas-light.png) repeat center;
}
.dark-transparent{
    background-image:url(/theme/default/images/bg-canvas.png) repeat center;
}

.upline-box{
    width:100%; overflow:hidden;
}
ul.minfo-list{
    padding-left:5px;
}
ul.minfo-list li {
    display:block;
    list-style:none;
    padding:2px;
}
.gray-light-bg{
    background:#999;
}


.table-reg-training-list{
    margin: 2px auto;
}
.training-header{
    padding-bottom:100px;
}
#regtraining{
    padding: 20px auto;

}
.register-training-widget{
    background:#FFF;
    position:relative;
    padding-bottom:20px;
}
#regtraining .header{
    text-align:center;
    padding:5px;
}
.embed-container {
    position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100% ;
}
.embed-container iframe, .embed-container object, .embed-container embed {
    position: absolute; top: 0; left: 0; width: 100%; height: 100%;
}
input,select,option{
    padding:6px 6px;
    color:#222;
    border:#ccc 1px solid;
}
.with-recaptcha input {
    padding:8px 12px;
}
.register-training-widget  i {
    width:25px;
}
.stick-bottom {
    bottom: 0;
}
.stick-left {
    left: 0;
}
.black-ribbon {
    width: auto;
}
.black-ribbon {
    position: fixed;
    z-index: 9999;
    width: 70px;
}
.embed-container-fix { position: relative; padding-bottom: 56.25%; height: 0; ;overflow: hidden; max-width: 100%;  }
.embed-container-fix iframe, .embed-container-fix object,.embed-container-fix embed {
    position: absolute;width: 95%; height: 95%;
    top: 50%;  /* position the top  edge of the element at the middle of the parent */
    left: 50%; /* position the left edge of the element at the middle of the parent */
    transform: translate(-50%, -50%); /* This is a shorthand of */
}
@media (max-width: 768px){
    .embed-container-fix iframe, .embed-container-fix object,.embed-container-fix embed {
        position: absolute; top: 0; left:0; width: 100%; height: 100%;
        transform: translate(0); /* This is a shorthand of */
    }
}

ul.footer-icon i{
    font-size: 28px;
    margin: 2px 20px;
}
ul.footer-icon {
    padding-left: 2px !important;
}
ul.footer-icon li{
    display:inline-block;
}
ul.footer-icon li.first{
    font-size: 28px;
    margin-left: 2px !important;
}
ul.footer-icon li.last{
    font-size: 28px;
    margin-right: 2px !important;
}

/*Login*

/* Login Button Text */
#loginButton span,#regButton span {
    font-size: 16px;
    font-weight: bold;
    padding: 2px 10px 0px 10px;
    /*background: url(/images/icons/loginArrow.png) no-repeat 53px 1px;*/
    display: block
}
#regButton .arrowupdown {
}
#regButton .arrowupdown span {
    font-size: 16px;
    font-weight: bold;
    padding: 2px 23px 0px 10px;
    /*background: url(/images/icons/loginArrow.png) no-repeat 65px 1px;*/
    display: block
}
/* If the Login Button has been clicked */
#loginButton.active, #regButton.active {
    border-radius: 3px 3px 0 0;
    -moz-border-radius: 3px 3px 0 0;
    background: #d2e0ea;
    border: 1px solid #899caa;
}
#loginButton.active span {
    background-position: 53px -82px;
}
#regButton.active span {
    background-position: 65px -82px;
}
/* A Line added to overlap the border */
#loginButton.active em, #regButton.active em {
    position: absolute;
    width: 100%;
    height: 6px;
    background: #d2e0ea;
    bottom: -1px;
    right: 0;
}
.highlight-box{
    margin-top: 20px !important;
    margin-bottom: 50px !important;
}
.highlight-box img{
    max-height: 420px !important;
}
.blackbg{
    background-color:#000;
    color:#fff;
    padding:10px;

}
#step2work ul{
    list-style-type: decimal !important;
    text-align: left !important;


}
#step2work ul lo{
    display:block;
    list-style-type: decimal;
}
header{
    background:rgba(0,133,160,0.7) !important
}
.affix {
    position:fixed;
    width: 100%;
    z-index:1030;
    top: 0;
}

.navbar-custom .navbar-collapse{
    max-height: 340px;
}

.input-group{
    /*width:100%;*/
    padding:5px;
}
.input-group-addon, .input-group-btn{
    width:40px;
    padding:0px;
    color:#333;
}
#reg_button{
    margin-top:100px;
}

.mcontact-info{
    text-align:left;
}

.notification{
    width:250px;
    background: #fff;
    color:#000;
    display:inline-block;
}
.notification .ctext{
    color:#000;
    margin:5px;
}

.navbar-main .navbar-nav{
    margin: 2px 15px 0 0 !important;
    font-family: 'sukhumvit';
}

.navbar-nav .dropdown-menu{
    background: #444;
}
.navbar-nav .dropdown-menu li a{
    color:#fff !important;
}
.navbar-nav .dropdown-menu li a:hover,.navbar-nav .dropdown-menu li a:active,.navbar-nav .dropdown-menu li a:focus{
    color:#222 !important;
}
.navbar-nav .dropdown-menu li:hover,.navbar-nav .dropdown-menu li:active,.navbar-nav .dropdown-menu li:focus{
    color:#fff;
    background:#000066;
}

.navbar-fixed-top{
    z-index: 1040;
}
.navbar-nav .open .dropdown-menu{
    position: absolute;
    right:0;
    left:auto;

}
.navbar-nav ul{
    margin:2px !important;
}
.navbar-nav ul li{
    display:inline-block;
    /*background: #222;*/
    color:#fff;

}
.navbar-nav ul li a{
    color:#fff;
}

.navbar-nav ul li:hover{
    /*background: #222;*/
    color:#fff;

}
.navbar-nav > li > a.btn-primary:focus, .navbar-nav > li > a.btn-primary:hover{
    background:#333; /*orange theme */
}
ul.dropdown-menu li{
    display:block;
    /*background: #222;*/
    color:#fff;
}

/* -- v5 10/7/64
.side-container{
    background:#222;
}*/
.vcenter {
    display: inline-block;
    vertical-align: middle;
    float: none;
}
.minfo-list ul{
    padding-left:5px;
}
iframe{
    -webkit-overflow-scrolling: touch;
}
.btn-social>:first-child {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 32px;
    line-height: 34px;
    font-size: 1.6em;
    text-align: center;
    border-right: 1px solid rgba(0,0,0,0.2);
}
.btn-facebook {
    color: #fff;
    background-color: #3b5998;
    border-color: rgba(0,0,0,0.2);
}
a.btn-social:hover{
    color:#fff;
}
.btn-social {
    position: relative;
    padding-left: 44px;
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.btn-block {
    display: block;
    width: 100%;
}
.btn-social.btn-lg>:first-child {
    line-height: 45px;
    width: 45px;
    font-size: 1.8em;
}
.fixed-bottom{
    z-index:1080 !important;
    position:absolute;
}
.alert{
    z-index:2000 !important;
    top:70px;
}
#alertlist{
    width:250px;
    padding-right:10px;
}

#bottomnav{
    background-color: rgba(255, 255, 255, 0.7);
}

.btn-pink-500 {
    color: #ffffff;
    background-color: #e91e63;
    border-color: #e91e63;
}
.call-to-action{
    padding: 5px 10px;
}

.call-to-action a{
    font-family: sukhumvit;
    font-size: 24px;
}

.max-width-700 {
    max-width: 700px;
    margin: 0 auto;
}
/* footer style
*/
.modal-open .modal{
    overflow-y:hidden;
}
   .modal.fade.in .modal-content {
        bottom: 0;
        opacity: 1;
    }
    .modal-content{
        position: relative;
        padding:2px 2px 10px;
        margin: 0px auto;
        height:auto;
        max-height: 99%;
        overflow-y:hidden;
        background-color: rgb(248, 250, 247);
        border: 1px solid #BEBEBE;
        /*opacity: 0;*/
        -webkit-transition: opacity 0.3s ease-out, bottom 0.3s ease-out;
        -moz-transition: opacity 0.3s ease-out, bottom 0.3s ease-out;
        -o-transition: opacity 0.3s ease-out, bottom 0.3s ease-out;
        transition: opacity 0.3s ease-out, bottom 0.3s ease-out;

    }
    .modal-xlg {
        width: 100%;
        height:100%;
    }
    .modal-header .close{
        font-size:40px;
        float: left;

    }
    #media-modal .modal-header .close{
        font-size:40px;
        float: left;
        color: #fff;
        opacity:1.0;
    }
    .modal-header{
        padding:2px !important;
        height:50px;
        overflow: hidden;
    }
    .modal-header .logo{
        padding-left:5px !important;
        margin-top:0px !important;
    }
    .modal.modal-wide .modal-dialog {
        width: 100%;
    }

    .modal-wide .modal-body {
        overflow-y: auto;
        padding-bottom:80px;
    }
    .btn-social>:first-child {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 32px;
    line-height: 34px;
    font-size: 1.6em;
    text-align: center;
    border-right: 1px solid rgba(0,0,0,0.2);
}

#media-modal .modal-header{
    border-bottom: none;
}
.btn-facebook {
    color: #fff;
    background-color: #3b5998;
    border-color: rgba(0,0,0,0.2);
}
a.btn-social:hover{
    color:#fff;
}
.btn-social {
    position: relative;
    padding-left: 44px;
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.btn-block {
    display: block;
    width: 100%;
}
.btn-social.btn-lg>:first-child {
    line-height: 45px;
    width: 45px;
    font-size: 1.8em;
}
.form-control{
    border:1px solid #ccc;
}
.text-white{
    color:#fff;
}
.text-small{
    font-size:10px;
}
.mpic-circle50 {
    width: 50px;
    height: 50px;
    position: relative;
    overflow: hidden;
    border-radius: 50%;
    margin:0 auto;
}

.mpic img {
    display: inline;
    margin: 0 auto;
    height: auto;
    width: 100%;
}
.mpic-small-circle {
    display:block;
    width: 40px;
    height: 40px;
    position: relative;
    overflow: hidden;
    border-radius: 50%;
    margin:0 auto;
}

.mpic-small-circle img {
    display: inline;
    margin: 0 auto;
    height: auto;
    width: 100%;
}
.mpic-medium-circle.avatar{
        opacity:1; /* css standard */
        filter:alpha(opacity=100); /* internet explorer */
        -moz-opacity:1;    /* old mozilla browser like netscape  */
        -khtml-opacity:1;    /* for really really old safari */
}
#pw_container{
    width:250px;
    height:530px;
    position:fixed;
    left:60px;
    bottom:0px;
    border:0px;
    z-index:100;
    overflow:hidden;
}
.pw-show-hide{
    position:fixed;
    bottom:0px;
    left:60px;
    z-index:100;
    color:#fff;
    font-size:30px;
    padding-top:100px;
    margin-left:1px;
    background: transparent;

}
.pw-show-hide span{
    display:block;
    position:absolute;
    bottom: 0px;
}
.ls-bottom-footer .st-container > .sidebar{
    bottom:0px;
}
html.st-layout .st-container{
    height:99%;
    overflow-y:hidden;
}
    .media-body.name{
        width:auto;
    }
.modal-sm {
    max-width: 96%;
}
.check-list li {
    display: block;
    padding: 5px 0;
    font-size: 18px;
    font-family:'sukhumvit',Tahoma, Geneva, sans-serif;
    font-weight: bold;
}
.text-warning {
    color: #C28A41;
    font-weight: bold;
}
.text-danger {
    color: #fa0e0e;
    font-weight: bold;
}
.text-normal{
    font-size:14px;
}
.btn-danger{
    /* background-color: #F90; */
    border-color: #B8860B;
    background-image: linear-gradient(to right, #FFD700, #DAA520, #B8860B); /* Gold gradient */
}
.btn-danger:hover, .btn-danger:focus, .btn-danger:active {
    /* background-color: #ffa432; */
    background-image: linear-gradient(to right, #B8860B,#FFD700, #DAA520 );
    border-color: #DAA520;
}
.container > .navbar-header{
    margin-left:-10px;
}
@media (max-width: 667px){
      .modal-header .logo{
          margin-left:10px;
      }
      .input-group{
          width:100%;
      }
      .container-fluid{
          padding-left:5px;
          padding-right:5px;
          overflow-x: hidden;
      }
      #footer-container{
         padding-left:10px;
         padding-right:10px;
         font-size:13px;
         color:#666;
      }
}
.modal .modal-dialog{
    display:block;

}
.modal {
    background: rgba(0,0,0,0.4);
}
/* end of footer style */

@media (min-width: 768px) {
    .affix{
        border-radius: 0;
    }
    .navbar-custom .navbar-collapse{
        padding-right: 0;
        padding-left: 0;
    }

    #vplayer{
        min-height:300px;
    }
    .ls-bottom-footer .st-container{
        padding-bottom:0px; /*desktop no footer*/
    }
}
@media (max-device-width: 480px) and (orientation: landscape) {
    .navbar-custom  .navbar-collapse{
        max-height: 200px;
    }

}
@media(max-width:768px){
    #alertlist{
        width:100% !important;
        padding-right:10px;
    }
    .container{
        padding-left:10px;
        padding-right:10px;
    }
    ul{
        padding-inline-start: 5px;
    }
    .minfo-list{
        font-size:16px;
    }
    .referrer,.supervisor{
        font-size:14px;
        padding:10px;
    }
    .navbar-nav ul li{
        margin-top:8px;
    }
    .navbar-nav ul li a i{
        font-size:22px;
    }

     .mpic{
        opacity:1; /* css standard */
        filter:alpha(opacity=100); /* internet explorer */
        -moz-opacity:1;    /* old mozilla browser like netscape  */
        -khtml-opacity:1;    /* for really really old safari */
    }
    ol{
        padding-left:5px;
    }
    .modal-body{
        padding:5px;
    }
    [class*="ls-top-navbar"] .st-container .st-content-inner{
        padding-top:10px;
    }
}

