/*Variables */


/*Base Static Folder*/
@base: "https://www.subscribervoice.com/static/";

//Colors
@white: #ffffff;
@black: #000000;
@bgBlue: #6f90ab;
@bgBlue2: #334254;
@bgDark: rgba(42,56,74,0.85);
@blue1: #439dd7;
@blue2: #5e9ab7;
@darkBlue: rgb(42,119,220);
@darkBlue2: rgba(42,119,220,0.85);
@darkBlue3: rgba(42,119,220,0.45);
@blueDark: #2971ab;
@blueLight: #4e8eba;
@blueGrey1: #ccdde4;
@blueGrey2: #dadde3;
@blueGrey3: #ebedf0;
@blueGrey4: #8b95a8;
@blueGrey5: #7b8598;
@lightBg1: #8ba6bb;
@blueGreen: #4192b6;
@blueGreen0: rgba(65,146,182,0.9);
@blueGreen2: #659aa8;
@grey1: #fbfbfb;
@grey2: #f6f6f6;
@grey3: #e3e3e3;
@grey4: #dbe0e2;
@grey5: #a3a3a3;
@grey6: #636363;
@grey7: #4e4e40;
@darkGrey: #303030;
@headerGrey: #e3e7e9;
@lightGreen: #74b3c1;
@green: #378eab;
@green1: #4292b7;
@green2: #5e7c5e;
@green3: #96d34f;
@green4: #38a038;
@greenGrey1: #eaeff4;
@greenGrey2: #e1e8ed;
@greenGrey3: #dde5eb;
@greenGrey4: #c7dadf;
@greenGrey5: #f5f8fa;
@darkGreen: #3f7a92;
@lightGreen1: #a4cfe7;
@lightGreen2: rgba(164, 207, 231, 0.8);
@lightGreen3: rgba(164, 207, 231, 0.5);
@lightBlue1: #7eb5f2;
@lightBlue2: #44abf2;
@lightBlue3: #4089f1;
@lightBlue4: rgb(237, 243, 247);
@buttonBlue: rgb(54,142,174);
@buttonGreen: #58cc80;
@buttonGreen2: #84ab91;
@red: #ed4f32;
@red1: #db524b;
@newBlue: #0183b3;
@newBlueLight: #4ba6e9;
@brightGreen: #bed900;
@brightGreen2: #bedae7;
@bgBright: #7ebed5;
@bgDark: #aac8d9;
@bgDarker: #42646c;
@yellow: #FFF922;
@goodGreen: #38A038;
@badRed: #AD0B0B;
@footer: #414a56;
@darkGreen: #659aa8;
@newBG: rgb(241,242,243);
@newGreen: #7dbed4;
@greyButton: #b5b5b5;
@brightBlueNew: #24bce8;
@greenDarkNew: #3a83a4;

/* New React Styles */
@OBGrey1: #636363;
@OBLGrey1: #f2f4f6;
@OBLGrey2: #dbdcde;
@OBLGrey3: #eff0ee;
@OBLGrey4: #c3c3c3;
@OBLGrey5: #a3a3a3;
@OBDGrey: #162036;
@OBGreen: #4192b6;
@OBBlue: rgb(91,204,244);
@OBGreen1: #3882a8;
@OBBGreen: #58cc80;
@OBLGreen1: #c3d8e6;
@OBLGreen2: #79a9bc;
@OBRed: #db524b;


//Fonts

@font-face {
    font-family: 'museo_sans500';
    src: url('@{base}font/MuseoSans_500-webfont.eot');
    src: url('@{base}font/MuseoSans_500-webfont.eot?#iefix') format('embedded-opentype'),
         url('@{base}font/MuseoSans_500-webfont.woff') format('woff'),
         url('@{base}font/MuseoSans_500-webfont.ttf') format('truetype'),
         url('@{base}font/MuseoSans_500-webfont.svg#museo_sans500') format('svg');
    font-weight: normal;
    font-style: normal;
}


@font1: "Montserrat", sans-serif;
@font2: 'Droid Sans', sans-serif;
@font3: 'museo_sans500', sans-serif;
@font4: "PT Sans Narrow", sans-serif;
@font5: 'Open Sans','Lucida Grande','Segoe UI',Arial,Verdana,'Lucida Sans Unicode',Tahoma,'Sans Serif';
@font6: 'Muli', sans-serif;


/*My Mixins */

//Alphas


//Gradients

.gradientRedYellowGreen {
	background: #ad0b0b; /* Old browsers */
	background: -moz-linear-gradient(left, #ad0b0b 0%, #fff922 50%, #38a038 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,#ad0b0b), color-stop(50%,#fff922), color-stop(100%,#38a038)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(left, #ad0b0b 0%,#fff922 50%,#38a038 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(left, #ad0b0b 0%,#fff922 50%,#38a038 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(left, #ad0b0b 0%,#fff922 50%,#38a038 100%); /* IE10+ */
	background: linear-gradient(to right, #ad0b0b 0%,#fff922 50%,#38a038 100%); /* W3C */
}

.aboutPromptBG {
	background: #ffffff; /* Old browsers */
	background: -moz-linear-gradient(top, #ffffff 0%, #bedae7 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#bedae7)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #ffffff 0%,#bedae7 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #ffffff 0%,#bedae7 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #ffffff 0%,#bedae7 100%); /* IE10+ */
	background: linear-gradient(to bottom, #ffffff 0%,#bedae7 100%); /* W3C */
}

.gradientWhiteToGrey {
	background: rgb(240,240,240);
	background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(230,230,230,1) 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(100%,rgba(230,230,230,1)));
	background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(230,230,230,1) 100%); 
	background: -o-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(230,230,230,1) 100%);
	background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(230,230,230,1) 100%);
	background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(230,230,230,1) 100%); 
}

.gradientGreyToWhite {
	background: rgb(230,230,230); /* Old browsers */
	background: -moz-linear-gradient(top, rgb(230,230,230) 0%, rgb(255,255,255) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(230,230,230)), color-stop(100%,rgb(255,255,255))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, rgb(230,230,230) 0%,rgb(255,255,255) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, rgb(230,230,230) 0%,rgb(255,255,255) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, rgb(230,230,230) 0%,rgb(255,255,255) 100%); /* IE10+ */
	background: linear-gradient(to bottom, rgb(230,230,230) 0%,rgb(255,255,255) 100%); /* W3C */
}

.gradientOffWhite {
	background-color: #f7f9f9; /* Old browsers */
	background-color: -moz-linear-gradient(top, #f7f9f9 0%, #fcfdfb 100%); /* FF3.6+ */
	background-color: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f7f9f9), color-stop(100%,#fcfdfb)); /* Chrome,Safari4+ */
	background-color: -webkit-linear-gradient(top, #f7f9f9 0%,#fcfdfb 100%); /* Chrome10+,Safari5.1+ */
	background-color: -o-linear-gradient(top, #f7f9f9 0%,#fcfdfb 100%); /* Opera 11.10+ */
	background-color: -ms-linear-gradient(top, #f7f9f9 0%,#fcfdfb 100%); /* IE10+ */
	background-color: linear-gradient(to bottom, #f7f9f9 0%,#fcfdfb 100%); /* W3C */
}

.gradientOffWhiteToGrey {
	background: #fbfafc; /* Old browsers */
	background: -moz-linear-gradient(top, hsla(270,25%,98%,1) 0%, hsla(0,0%,90%,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,hsla(270,25%,98%,1)), color-stop(100%,hsla(0,0%,90%,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, hsla(270,25%,98%,1) 0%,hsla(0,0%,90%,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, hsla(270,25%,98%,1) 0%,hsla(0,0%,90%,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, hsla(270,25%,98%,1) 0%,hsla(0,0%,90%,1) 100%); /* IE10+ */
	background: linear-gradient(to bottom, hsla(270,25%,98%,1) 0%,hsla(0,0%,90%,1) 100%); /* W3C */
}

.gradientGrey1 {
	background: #eeeeee; /* Old browsers */
	background: -moz-linear-gradient(top, #eeeeee 0%, #cccccc 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eeeeee), color-stop(100%,#cccccc)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #eeeeee 0%,#cccccc 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #eeeeee 0%,#cccccc 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #eeeeee 0%,#cccccc 100%); /* IE10+ */
	background: linear-gradient(to bottom, #eeeeee 0%,#cccccc 100%); /* W3C */
}

.gradientGrey1Rev {
	background: #cccccc; /* Old browsers */
	background: -moz-linear-gradient(top, #cccccc 0%, #eeeeee 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#cccccc), color-stop(100%,#eeeeee)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #cccccc 0%,#eeeeee 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #cccccc 0%,#eeeeee 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #cccccc 0%,#eeeeee 100%); /* IE10+ */
	background: linear-gradient(to bottom, #cccccc 0%,#eeeeee 100%); /* W3C */
}

.gradientOffGrey1 {
	background: rgb(244,242,242); /* Old browsers */
	background: -moz-linear-gradient(top, rgb(244,242,242) 0%, rgb(243,244,235) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(244,242,242)), color-stop(100%,rgb(243,244,235))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, rgb(244,242,242) 0%,rgb(243,244,235) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, rgb(244,242,242) 0%,rgb(243,244,235) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, rgb(244,242,242) 0%,rgb(243,244,235) 100%); /* IE10+ */
	background: linear-gradient(to bottom, rgb(244,242,242) 0%,rgb(243,244,235) 100%); /* W3C */
}

.gradientOffGreyBlue {
	background: #f2f5f9; /* Old browsers */
	background: -moz-linear-gradient(top, #f2f5f9 0%, #d9dee0 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f2f5f9), color-stop(100%,#d9dee0)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #f2f5f9 0%,#d9dee0 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #f2f5f9 0%,#d9dee0 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #f2f5f9 0%,#d9dee0 100%); /* IE10+ */
	background: linear-gradient(to bottom, #f2f5f9 0%,#d9dee0 100%); /* W3C */
}

.gradientOffWhiteBlue {
	background: #f2f5f9; /* Old browsers */
	background: -moz-linear-gradient(top, #f2f5f9 0%, #fcfdfb 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f2f5f9), color-stop(100%,#fcfdfb)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #f2f5f9 0%,#fcfdfb 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #f2f5f9 0%,#fcfdfb 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #f2f5f9 0%,#fcfdfb 100%); /* IE10+ */
	background: linear-gradient(to bottom, #f2f5f9 0%,#fcfdfb 100%); /* W3C */
}

.gradientGrey2 {
	background: rgb(212,212,212); /* Old browsers */
	background: -moz-linear-gradient(top, rgb(212,212,212) 0%, rgb(237,232,227) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(212,212,212)), color-stop(100%,rgb(237,232,227))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, rgb(212,212,212) 0%,rgb(237,232,227) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, rgb(212,212,212) 0%,rgb(237,232,227) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, rgb(212,212,212) 0%,rgb(237,232,227) 100%); /* IE10+ */
	background: linear-gradient(to bottom, rgb(212,212,212) 0%,rgb(237,232,227) 100%); /* W3C */
}

.gradientBlue {
	background: #5785aa; /* Old browsers */
	background: -moz-linear-gradient(top, #5785aa 0%, #2971ab 100%); 
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#5785aa), color-stop(100%,#2971ab)); 
	background: -webkit-linear-gradient(top, #5785aa 0%,#2971ab 100%); 
	background: -o-linear-gradient(top, #5785aa 0%,#2971ab 100%); 
	background: -ms-linear-gradient(top, #5785aa 0%,#2971ab 100%); 
	background: linear-gradient(to bottom, #5785aa 0%,#2971ab 100%); 
}

.gradientBlueRev {
	background: #2971ab; /* Old browsers */
	background: -moz-linear-gradient(top, #2971ab 0%, #5785aa 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#2971ab), color-stop(100%,#5785aa)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #2971ab 0%,#5785aa 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #2971ab 0%,#5785aa 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #2971ab 0%,#5785aa 100%); /* IE10+ */
	background: linear-gradient(to bottom, #2971ab 0%,#5785aa 100%); /* W3C */
}

.gradientBlue2 {
	background-color: rgb(142,199,242); /* Old browsers */
	background-color: -moz-linear-gradient(top, rgb(142,199,242) 0%, rgb(119,183,239) 100%); /* FF3.6+ */
	background-color: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(142,199,242)), color-stop(100%,rgb(119,183,239))); /* Chrome,Safari4+ */
	background-color: -webkit-linear-gradient(top, rgb(142,199,242) 0%,rgb(119,183,239) 100%); /* Chrome10+,Safari5.1+ */
	background-color: -o-linear-gradient(top, rgb(142,199,242) 0%,rgb(119,183,239) 100%); /* Opera 11.10+ */
	background-color: -ms-linear-gradient(top, rgb(142,199,242) 0%,rgb(119,183,239) 100%); /* IE10+ */
	background-color: linear-gradient(to bottom, rgb(142,199,242) 0%,rgb(119,183,239) 100%); /* W3C */
}

.gradientBlueBright {
	background: #7db9e8; /* Old browsers */
	background: -moz-linear-gradient(top, #7db9e8 0%, #3d9ce5 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#7db9e8), color-stop(100%,#3d9ce5)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #7db9e8 0%,#3d9ce5 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #7db9e8 0%,#3d9ce5 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #7db9e8 0%,#3d9ce5 100%); /* IE10+ */
	background: linear-gradient(to bottom, #7db9e8 0%,#3d9ce5 100%); /* W3C */
}

.gradientBlueBright2 {
	background: #21beec; /* Old browsers */
	background: -moz-linear-gradient(top, #21beec 0%, #45a9e3 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#21beec), color-stop(100%,#45a9e3)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #21beec 0%,#45a9e3 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #21beec 0%,#45a9e3 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #21beec 0%,#45a9e3 100%); /* IE10+ */
	background: linear-gradient(to bottom, #21beec 0%,#45a9e3 100%); /* W3C */
}

.gradientBlueBright2Rev {
	background: #45a9e3; /* Old browsers */
	background: -moz-linear-gradient(top, #45a9e3 0%, #21beec 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#45a9e3), color-stop(100%,#21beec)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #45a9e3 0%,#21beec 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #45a9e3 0%,#21beec 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #45a9e3 0%,#21beec 100%); /* IE10+ */
	background: linear-gradient(to bottom, #45a9e3 0%,#21beec 100%); /* W3C */
}

.gradientBlueGrey {
	background: #638aaa; /* Old browsers */
	background: -moz-linear-gradient(top, #638aaa 0%, #6493ad 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#638aaa), color-stop(100%,#6493ad)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #638aaa 0%,#6493ad 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #638aaa 0%,#6493ad 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #638aaa 0%,#6493ad 100%); /* IE10+ */
	background: linear-gradient(to bottom, #638aaa 0%,#6493ad 100%); /* W3C */
}

.gradientBlueButton {
	background-color: #8399aa; /* Old browsers */
	background-color: -moz-linear-gradient(top, #8399aa 0%, #8ba7c1 100%); /* FF3.6+ */
	background-color: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#8399aa), color-stop(100%,#8ba7c1)); /* Chrome,Safari4+ */
	background-color: -webkit-linear-gradient(top, #8399aa 0%,#8ba7c1 100%); /* Chrome10+,Safari5.1+ */
	background-color: -o-linear-gradient(top, #8399aa 0%,#8ba7c1 100%); /* Opera 11.10+ */
	background-color: -ms-linear-gradient(top, #8399aa 0%,#8ba7c1 100%); /* IE10+ */
	background-color: linear-gradient(to bottom, #8399aa 0%,#8ba7c1 100%); /* W3C */
}

.gradientBlueButton2 {
	background-color: #5082a8; /* Old browsers */
	background-color: -moz-linear-gradient(top, #5082a8 0%, #8ba7c1 100%); /* FF3.6+ */
	background-color: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#5082a8), color-stop(100%,#8ba7c1)); /* Chrome,Safari4+ */
	background-color: -webkit-linear-gradient(top, #5082a8 0%,#8ba7c1 100%); /* Chrome10+,Safari5.1+ */
	background-color: -o-linear-gradient(top, #5082a8 0%,#8ba7c1 100%); /* Opera 11.10+ */
	background-color: -ms-linear-gradient(top, #5082a8 0%,#8ba7c1 100%); /* IE10+ */
	background-color: linear-gradient(to bottom, #5082a8 0%,#8ba7c1 100%); /* W3C */
}

.gradientBlueButton3 {
	background: #298bdf; /* Old browsers */
	background: -moz-linear-gradient(top, #298bdf 0%, #2378c2 96%, #298bdf 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#298bdf), color-stop(96%,#2378c2), color-stop(100%,#298bdf)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #298bdf 0%,#2378c2 96%,#298bdf 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #298bdf 0%,#2378c2 96%,#298bdf 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #298bdf 0%,#2378c2 96%,#298bdf 100%); /* IE10+ */
	background: linear-gradient(to bottom, #298bdf 0%,#2378c2 96%,#298bdf 100%); /* W3C */
}
.gradientBlueButton4 {
	background: #007add; /* Old browsers */
	background: -moz-linear-gradient(top, #007add 0%, #005ba5 96%, #298bdf 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#007add), color-stop(96%,#005ba5), color-stop(100%,#298bdf)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #007add 0%,#005ba5 96%,#298bdf 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #007add 0%,#005ba5 96%,#298bdf 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #007add 0%,#005ba5 96%,#298bdf 100%); /* IE10+ */
	background: linear-gradient(to bottom, #007add 0%,#005ba5 96%,#298bdf 100%); /* W3C */
}

.gradientGreenButton {
	background: #368eae; /* Old browsers */
	background: -moz-linear-gradient(top, #368eae 0%, #4b9ebc 23%, #52a9c4 52%, #1b97c4 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#368eae), color-stop(23%,#4b9ebc), color-stop(52%,#52a9c4), color-stop(100%,#1b97c4)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #368eae 0%,#4b9ebc 23%,#52a9c4 52%,#1b97c4 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #368eae 0%,#4b9ebc 23%,#52a9c4 52%,#1b97c4 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #368eae 0%,#4b9ebc 23%,#52a9c4 52%,#1b97c4 100%); /* IE10+ */
	background: linear-gradient(to bottom, #368eae 0%,#4b9ebc 23%,#52a9c4 52%,#1b97c4 100%); /* W3C */
}

.gradientYellow {
	background: #fcf18a; /* Old browsers */
	background: -moz-linear-gradient(top, #fcf18a 0%, #f1da36 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fcf18a), color-stop(100%,#f1da36)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #fcf18a 0%,#f1da36 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #fcf18a 0%,#f1da36 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #fcf18a 0%,#f1da36 100%); /* IE10+ */
	background: linear-gradient(to bottom, #fcf18a 0%,#f1da36 100%); /* W3C */
}

.gradientYellowToOrange {
	background: #f4ef61; /* Old browsers */
	background: -moz-linear-gradient(left, #f4ef61 0%, #f2c318 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,#f4ef61), color-stop(100%,#f2c318)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(left, #f4ef61 0%,#f2c318 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(left, #f4ef61 0%,#f2c318 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(left, #f4ef61 0%,#f2c318 100%); /* IE10+ */
	background: linear-gradient(to right, #f4ef61 0%,#f2c318 100%); /* W3C */
}

.gradientGreen {
	background: #8ab66b; /* Old browsers */
	background: -moz-linear-gradient(top, #8ab66b 0%, #398235 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#8ab66b), color-stop(100%,#398235)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #8ab66b 0%,#398235 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #8ab66b 0%,#398235 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #8ab66b 0%,#398235 100%); /* IE10+ */
	background: linear-gradient(to bottom, #8ab66b 0%,#398235 100%); /* W3C */
}

.gradientBGBlue {
	background: #668caa; /* Old browsers */
	background: -moz-linear-gradient(top, #668caa 0%, #8599aa 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#668caa), color-stop(100%,#8599aa)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #668caa 0%,#8599aa 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #668caa 0%,#8599aa 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #668caa 0%,#8599aa 100%); /* IE10+ */
	background: linear-gradient(to bottom, #668caa 0%,#8599aa 100%); /* W3C */
}

.blueBtn {
	background: #4791c1; /* Old browsers */
	background: -moz-linear-gradient(top, #4791c1 0%, #3e89ba 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4791c1), color-stop(100%,#3e89ba)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #4791c1 0%,#3e89ba 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #4791c1 0%,#3e89ba 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #4791c1 0%,#3e89ba 100%); /* IE10+ */
	background: linear-gradient(to bottom, #4791c1 0%,#3e89ba 100%); /* W3C */
}

//Size

.heightAndWidth (@h; @w) {
	height: @h;
	width: @w;
}

//Position

.marginAndPadding (@pixels:5px) {
	margin: @pixels;
	padding: @pixels;
}

.marginAndPadding (@margin; @padding) {
	margin: @margin;
	padding: @padding;
}

.floatLeftRelative {
	float: left;
	position: relative;
}

//Font Style

.fontStyle (@size:14px;@weight:500) {
	font-size: @size;
	font-weight: @weight;
}

.fontStyle (@color;@size:14px;@weight:500) {
	color: @color;
	font-size: @size;
	font-weight: @weight;
}

//Border Radius

.radius (@radius: 5px) {
	border-radius: @radius;
	-moz-border-radius: @radius;
	-webkit-border-radius: @radius;
}

.bottomRadius (@radius: 5px) {
	border-radius: 0 0 @radius @radius;
	-moz-border-radius: 0 0 @radius @radius;
	-webkit-border-radius: 0 0 @radius @radius;
}

.topRadius (@radius: 5px) {
	border-radius: @radius @radius 0 0;
	-moz-border-radius: @radius @radius 0 0;
	-webkit-border-radius: @radius @radius 0 0;
}

.leftRadius (@radius: 5px) {
	border-radius: @radius 0 0 @radius;
	-moz-border-radius: @radius 0 0 @radius;
	-webkit-border-radius: @radius 0 0 @radius;
}

.topLeftRadius (@radius: 5px) {
	border-radius: @radius 0 0 0;
	-moz-border-radius: @radius 0 0 0;
	-webkit-border-radius: @radius 0 0 0;
}

.topRightRadius (@radius: 5px) {
	border-radius: 0 @radius 0 0;
	-moz-border-radius: 0 @radius 0 0;
	-webkit-border-radius: 0 @radius 0 0;
}

.bottomLeftRadius (@radius: 5px) {
	border-radius: 0 0 0 @radius;
	-moz-border-radius: 0 0 0 @radius;
	-webkit-border-radius: 0 0 0 @radius;
}

.bottomRightRadius (@radius: 5px) {
	border-radius: 0 0 @radius 0;
	-moz-border-radius: 0 0 @radius 0;
	-webkit-border-radius: 0 0 @radius 0;
}

.rightRadius (@radius: 5px) {
	border-radius: 0 @radius @radius 0;
	-moz-border-radius: 0 @radius @radius 0;
	-webkit-border-radius: 0 @radius @radius 0;
}

//Box Shadow

.boxShadow (@x: 0; @y: 0; @blur: 1px; @color: #000) {
	  box-shadow: @arguments;
	  -moz-box-shadow: @arguments;
	  -webkit-box-shadow: @arguments;
}

.boxShadow (@x: 0; @y: 0; @blur: 1px; @spread: 1px; @color: #000) {
	  box-shadow: @arguments;
	  -moz-box-shadow: @arguments;
	  -webkit-box-shadow: @arguments;
}

.noBoxShadow {
	box-shadow: none;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
}

.insetShadow (@x: 0; @y: 0; @blur: 1px; @color: #000) {
	  box-shadow: inset @arguments;
	  -moz-box-shadow: inset @arguments;
	  -webkit-box-shadow: inset @arguments;
}

.insetShadow (@x: 0; @y: 0; @blur: 1px; @spread: 1px; @color: #000) {
	  box-shadow: inset @arguments;
	  -moz-box-shadow: inset @arguments;
	  -webkit-box-shadow: inset @arguments;
}

.insetShadows (@x: 0; @y: 0; @blur: 1px; @spread: 1px; @color: #000; @x2: 0; @y2: 0; @blur2: 1px; @spread2: 1px; @color2: #000) {
	  box-shadow: inset @x @y @blur @spread @color, inset @x2 @y2 @blur2 @spread2 @color2;
	  -moz-box-shadow: inset @x @y @blur @spread @color, inset @x2 @y2 @blur2 @spread2 @color2;
	  -webkit-box-shadow: inset @x @y @blur @spread @color, inset @x2 @y2 @blur2 @spread2 @color2;
}

.insetDrop (@x: 0; @y: 0; @blur: 1px; @color: #fff; @x2: 0; @y2: 0; @blur2: 1px; @color2: #555555) {
	  box-shadow: inset @x @y @blur @color, @x2 @y2 @blur2 @color2;
	  -moz-box-shadow: inset @x @y @blur @color, @x2 @y2 @blur2 @color2;
	  -webkit-box-shadow: inset @x @y @blur @color, @x2 @y2 @blur2 @color2;
}
.insetDrop (@x: 0; @y: 0; @blur: 1px; @spread: 1px; @color: #fff; @x2: 0; @y2: 0; @blur2: 1px; @spread2: 1px;@color2: #555555) {
	  box-shadow: inset @x @y @blur @spread @color, @x2 @y2 @blur2 @spread2  @color2;
	  -moz-box-shadow: inset @x @y @blur @spread  @color, @x2 @y2 @blur2 @spread2  @color2;
	  -webkit-box-shadow: inset @x @y @blur @spread  @color, @x2 @y2 @blur2 @spread2  @color2;
}

.textShadow (@x: 0; @y: 0; @blur: 1px; @color: #000) {
	  text-shadow: @arguments;
	  -moz-text-shadow: @arguments;
	  -webkit-text-shadow: @arguments;
}

.noTextShadow {
	text-shadow: none;
	-webkit-text-shadow: none;
	-moz-text-shadow: none;
}

.slide {
	-webkit-transition:all 1.5s ease-in-out;
  	-moz-transition:all 1.5s ease-in-out;
  	-o-transition:all 1.5s ease-in-out;
  	transition:all 1.5s ease-in-out;
}

.slideMed {
	-webkit-transition:all 0.5s ease-in-out;
  	-moz-transition:all 0.5s ease-in-out;
  	-o-transition:all 0.5s ease-in-out;
  	transition:all 0.5s ease-in-out;
}

.slideFast {
	-webkit-transition:all .25s ease-in-out;
  	-moz-transition:all .25s ease-in-out;
  	-o-transition:all .25s ease-in-out;
  	transition:all .25s ease-in-out;
}

.noSlide {
	-webkit-transition: none;
  	-moz-transition: none;
  	-o-transition: none;
  	transition: none;
}

.bgColorFast {
    -moz-transition: background .25s ease-in-out, color .25s ease-in-out, box-shadow .25s ease-in-out, border-color .25s ease-in-out;
    -o-transition: background .25s ease-in-out, color .25s ease-in-out, box-shadow .25s ease-in-out, border-color .25s ease-in-out;
    -webkit-transition: background .25s ease-in-out, color .25s ease-in-out, box-shadow .25s ease-in-out, border-color .25s ease-in-out;
    transition: background .25s ease-in-out, color .25s ease-in-out, box-shadow .25s ease-in-out, border-color .25s ease-in-out;
}

.fade {
	-o-transition: opacity .25s ease-in-out;
	transition: opacity .25s ease-in-out;
   -moz-transition: opacity .25s ease-in-out;
   -webkit-transition: opacity .25s ease-in-out;
}

.colorFade {
    -moz-transition: color .25s ease-in;
    -o-transition: color .25s ease-in;
    -webkit-transition: color .25s ease-in;
    transition: color .25s ease-in;
	
}

.backgroundFadeIn {
    -moz-transition: background .25s ease-in;
    -o-transition: background .25s ease-in;
    -webkit-transition: background .25s ease-in;
    transition: background .25s ease-in;
}

/*Account Page Layout */

//Basics

body {
	background-image: url("@{base}images/promptBG.png");
	background-color: lighten(@blueGrey2,3%);
}

body.validation {
	background: @newBG;
}

h2 {
	font-family: @font5;
	line-height: 40px;
	font-family: @font1;
	.fontStyle (#333);
}

h3 {
	font-family: @font5;
}

a {
	color: @green;
	font-weight: 500;
}

a:focus {
	text-decoration: none;
	outline: none;
}


.row {
	margin: 0px;
}

.container.mainContainer{
	position: relative;
	max-width: 1170px !important;
	width: 1170px !important
}


div#preview, div#previewSmall{
    img {
		display: block;
		margin: 0 auto;
    }
    h2 {
		width: 100%;
		font-size: 28px;
		text-align: center;
    }
}

.container.settings {
	width: 1170px !important;
	max-width: 1170px !important;
}

.container.settings.svAdmin {
	max-width: 1450px !important;
	width: 1450px !important;
	padding: 0px !important;
}

.container1 {
	width: 980px;
	margin: auto;
	padding: 0px;
}

.validationContainer {
	max-width: 992px;
	margin: auto;
	padding: 0px;
}

.container2 {
	max-width: 1024px;
	margin: 42px auto;
}
.container3 {
	width: 980px;
	margin-top: 42px;
	margin-left: 350px;
}

.sideBar {
	position: absolute;
	float: left;
	width: 300px;
	min-height: 1000px;
	height: inherit;
	z-index: -1;
}

header, section, footer, aside, nav, article, figure {
	display: block;
}

ul, ol, dl { 
	.marginAndPadding (0px);
	list-style: none;
}	

/*Buttons */

.btn {
	background: darken(@grey3,3%);
	padding: 10px 12px;
	.fontStyle(darken(@grey5,14%);12px;500);
	.insetShadows(0;2px;0;0;rgba(255,255,255,0.3);0;-3px;0;0;rgba(0,0,0,0.3));
	border: none;
	.backgroundFadeIn;
}

.btn:hover {
	.fontStyle(darken(@grey5,14%);12px;500);
	background: lighten(@grey3,3%);
}

.btn:focus {
	outline: none;
}

.btn.important {
	background: @blueGreen;
	.fontStyle(@white;12px;500);
	.insetShadow(0;-3px;0;0;rgba(0,0,0,0.3));
}

.btn.important:hover {
	background: lighten(@blueGreen,7%);
}

.btn.danger {
	.insetShadow(0;-3px;0;0;rgba(0,0,0,0.3));
	.fontStyle(@white;12px;500);
	background: @red1;
}

.btn.danger:hover {
	background: lighten(@red1,7%);
}

.bottomNav {
	position: relative;
	bottom: 15px;
	width: 60px;
	width: 100%;
	a, button { 
		float: right;
	}
	button {
		width: 60px;
	}
}

/*Bootstrap switch styles*/
.bootstrap-switch.bootstrap-switch-focused {
	border: 1px solid #ccc;
	.noBoxShadow;
}

/*Inputs*/
input[type="text"], input[type="password"], input[type="url"], input[type="email"], input[type="phone"], input[type="search"], textarea, select, span.selection {
	.fontStyle(@grey6;14px;600);
	.radius;
	padding: 3px 7px;
	border: 1px solid @grey5;
	.boxShadow(0;1px;0;rgba(0,0,0,0.25));
}

input[type="text"]:hover, input[type="password"]:hover, input[type="url"]:hover, input[type="email"]:hover, input[type="phone"]:hover, input[type="search"]:hover, textarea:hover, select:hover, span.selection:hover {
	border: 1px solid rgba(0,0,0,0.6);
}


input[type="text"]:focus, input[type="password"]:focus, input[type="url"]:focus, input[type="email"]:focus, input[type="phone"]:focus, input[type="search"]:focus, textarea:focus, select:focus, span.selection:focus {
	outline: none;
	border: 1px solid @bgBlue;
	.insetDrop(0;0;1px;@blueLight;0;1px;0;@blueLight;);
}

span:focus {
	outline: none;
}

input[type="checkbox"]:focus {
	outline: none;
}

/* Alpha Styling */
div.alpha {
	display: none;
}
div.alpha.active {
	display: block;
	width: 40%;
	z-index: 1000;
	position: absolute;
	margin: 0 20%;
	top: 25px;
	background: @white;
	padding: 30px 25px;
	border: 8px solid @blueGreen;
	div.confirmAlpha.alphaWrapper {
		padding: 5px;
		h4 {
			width: 100%;
			margin-top: 0;
			font-family: @font5;
			font-size: 20px;
		}
		form {
			margin-top: 15px;
			padding-bottom: 42px;
			position: relative;
			margin-bottom: 30px;
			.control-label {
				text-align: left;
			}
			label {
				clear: left;
				font-family: @font5;
				color: @grey6;
				margin-top: 16px;
				margin-right: 5px;
			}
			input{
				height: 40px;
				width: 100%;
				font-size: 14px;
				.insetShadow(0;0;3px;rgba(0,0,0,0.3));
				font-weight: 400;
			}
			button {
				position: relative;
				float: right;
				right: 5px;
				top: 5px;
				padding: 15px 27px;
				font-size: 16px;
				margin-top: 15px;
			}
		}
	}
}


/*Main Content Boxes */

.mainBox {
	float: right;
	width: 779px;
	min-height: 580px;
	background: #fff;
	h2 {
		margin-bottom: 20px;
		margin-left: 10px;
		span {
			.radius(10px);
		}
	}
}

.setupBox {
	float: right;
	width: 779px;
	border-left: 1px solid #e8e8e8;
	min-height: 200px;
	background: #fff;
	border-top: 1px solid #e8e8e8;
	.insetShadow(0;0;2px;@grey4);
	h2 {
		margin-left: 15px;
		font-size: 14px;
		line-height: 24px;
		margin-bottom: 5px;
		span {
			.radius(15px);
			margin-top: -5px;
			height: 20px;
			width: 20px;
			line-height: 20px;
		}
	}
	
	p {
		margin-left: 15px;
		.fontStyle(#687677;11px;400);
	}
	
	form {
		margin-left: 20px;
		textarea {
			width: 350px;
		}
	}

	label.control-label {
		margin-right: 10px !important;
	}

	.controls {
		margin-left: 50px;
		
		textarea {
			margin-top: 15px;
			margin-bottom: 25px;
			width: 670px !important;
		}

		#id_state {
			width: 160px;
		}
	}	
}

.promptBox {
	float: right;
	width: 767px;
	padding-right: 12px;
	min-height: 70px;
	background: @grey1;
	border-top: 1px solid #e8e8e8;
	border-left: 1px solid #e8e8e8;
	
	.progressInfo {
		margin-left: 5px;
		margin-top: 10px;
		.floatLeftRelative;
	}
	
	h2 {
		margin-left: 15px;
		font-family: @font2;
		.fontStyle(#0b78ab;20px;700) !important;
		line-height: 22px;
		p {
			.fontStyle(#333;14px;400) !important;
			display: inline;
			margin-left: 10px;
			line-height: 2px !important;
		}
	}
	
	.btn {
		font-size: 1.2em;
		font-weight: 700;
		padding-top: 7px;
		float: right;		
		margin-top: 15px;
		margin-right: 25px;
		.gradientYellow;
		color: #444;
		.textShadow(0,1px,1px,rgba(255,255,255,0.8));
		.insetShadow(0,1px,1px,@white);
	}
	
}

.dropdown {
	.btn {
		background: @blueLight !important;
		.fontStyle(@white;12px;500);
		.textShadow(0;0;1px;rgba(0,22,0,0.15));
		.insetDrop(0;2px;1px;rgba(200,200,200,0.4);0;0;2px;@grey4) !important;
		border: 1px solid rgba(0,0,0,0.2);
	
		i {
			font-size: 10px;
		}
	}
}
.dropdown-backdrop {
	z-index: 0;
}

.dropdown.open, .dropdown.stayOpen {
	position: relative;
	.btn {
		.topRadius(5px);
		border: 1px solid rgba(55,55,55,0.3) !important;
		color: @white;
		.textShadow(0;1px;1px;rgba(0,0,0,0.2));
		.insetDrop(0;0;1px;rgba(200,200,200,0.5);0;0;2px;rgba(0,0,0,0.3)) !important;
	}
	.dropdown-menu {
		padding: 0px;
		background: @greenGrey1;
		margin-top: -1px;
		position: absolute;
		left: 0px !important;
		min-width: 115px;
		.bottomRadius(5px);
		border: 1px solid rgba(55,55,55,0.3);
		.insetDrop(0;0;1px;@white;0;1px;1px;rgba(0,0,0,0.3));
		a {
			border-bottom: 1px solid rgba(55,77,66,0.5);
			.insetShadow(0;1px;1px;rgba(255,252,248,0.3));
			.fontStyle(rgba(0,0,0,0.6);12px;600);
			.textShadow(0;1px;0;rgba(255,255,255,0.8));
		}
		li:last-child a {
			border-bottom: none;
			.bottomRadius(4px);
		}
		a:hover {
			color: @white;
			.noTextShadow;
			background: @blueLight;
		}
	}
}

//The Header

header {
	position: fixed;
	top: 0px;
	height: 45px;
	width: 100%;
	.boxShadow(0,0,4px,#222);
	background-color: lighten(@grey3,7%);
	z-index: 1000;
	nav {
		position: relative;
	}
	
	#logo {
		margin-top: -1px;
		margin-left: 5px;
		.floatLeftRelative;
		font-family: @font4;
		.fontStyle(@blueGreen;31px;700);
		.textShadow(0,2px,3px,@white);
		img {
			height: 40px;
		}
	}
	#logo.mobile {
		display: none;
	}
	#logo:hover {
		text-decoration: none;
	}
	//product Feedback
	#productTour.btn.important {
		padding: 5px 12px;
		display: none;
		float: right;
		position:absolute;
		top: 10px;
		.noBoxShadow;
		.radius(20px);
	}

	div.username {
		position: relative;
	}
	a.username {
		height: 40px;
		padding: 11px 15px;
		float: right;
		position: relative;
		top: -3px;
		color: darken(@grey5, 10%);
		font-size: 12px;
		font-weight: 500;
		margin-top: 8px;
		display: inline;
		text-align: center;
		width: auto;
		min-width: 150px;
	}
		
	a.username:hover {
		text-decoration: none;
		color: #999999;;
	}
	
	.open a.username.dropdown-toggle {
		.topRadius;
		background: @blueGreen;
		.insetShadow(0;0;5px;rgba(22,22,22,0.1));
		border: 1px solid @grey5;
		border-bottom: none;
		text-decoration: none;
		height: 40px;
		position: relative;
		padding: 10px 15px;
		color: @white;
		a i{
			display: inline;
			margin-left: 4px;
		}
	}
	
	.dropdown-menu{
		position: static;
		float: right;
		clear: right;
		margin-top: -2px;
		opacity: 0.97;
		.boxShadow(0;1px;2px;rgba(22,22,22,0.3));
		.bottomRadius;
		padding: 0px;
		width: auto;
		min-width: 150px;
		border: 1px solid @grey5;
		border-top: none;
		li {
			font-family: @font5;
			border-top: 1px solid rgba(22,22,22,0.5);
			.insetShadow(0;1px;2px;rgba(255,255,255,0.4));
			a {
				padding: 5px 20px;
				.fontStyle(@grey7;12px;400);
			}
			a:hover {
				background: @greenGrey2;
				color: @grey7;
			}
		}
		li:first-child {
			border-top: none;
		}
		li:last-child {
			a {
				.bottomRadius;
			}
		}
	}
}

header.validation {
	background: @white;
	z-index: 1002;
	nav.container {
		#mobileMenu{
			float: right;
			display: none;
		}
	}
}

#mobile.mobileMenu{
	display: none;
}

header.loggedIn {
	.gradientBlueGrey;
	position: fixed;
	top: 0px;
	height: 41px;
	border-top: 1px solid rgba(255,255,255,.3);
	border-bottom: 1px solid @darkGrey;
	.boxShadow(0;0;1px;@grey6);
	z-index: 1000;

	#logo {
		margin-top: -4px;
		margin-left: 3px;
		display: block;
		.heightAndWidth(32px;190px);
	}

	//Username Link
	
	#signedIn {
		float: right;
		position: relative;
		top: 2px;
		
		a.username {
			height: 40px;
			padding: 5px 15px;
			.floatLeftRelative;
			top: -5px;
			color: darken(@white, 5%);
			font-size: 12px;
			font-weight: 500;
			margin-top: 8px;
			display: inline;
		}
		
		a.username:hover {
			text-decoration: none;
			color: #fbfbfb;
		}
		
		.open .username.dropdown-toggle {
			.topRadius;
			background: @blueLight;
			.insetShadow(0;0;5px;rgba(22,22,22,0.3));
			text-decoration: none;
			height: 35px;
			border: 
				1px solid rgba(22,22,22,0.5);
				a i{
				display: inline;
				margin-left: 4px;
			}
		}
		
		
		.username {
			position: relative;
		}
		.dropdown-menu{
			min-width: 88px;
			top: 41px;
			opacity: 0.97;
			right: 0px !important;
			margin-top: -4px;
			.boxShadow(0;1px;2px;rgba(22,22,22,0.3));
			.bottomRadius;
			padding: 0px;
			li {
				border-top: 1px solid rgba(22,22,22,0.5);
				.insetShadow(0;1px;2px;rgba(255,255,255,0.4));
				a {
					.fontStyle(@grey7;12px;600);
				}
			}
			li:first-child {
				border-top: none;
			}
		}
	}	
}

//Home Page

header.home {
	.noBoxShadow;
	background: @white;
	height: 50px;
	transition: all 0.3s ease-in-out 0s;
	#logo {
		margin-top: 1px;
		margin-left: 3px;
		display: block;
		.heightAndWidth(41px;260px);
	}
	ul.homeNav {
		float: right;
		margin-top: 17px;
		li {
			float: left;
			margin: 0 15px;
			a {
				font-family: @font5;
				font-size: 12px;
				text-transform: uppercase;
			}
		}
		a.btn {
			position: relative;
			top: -9px;
			padding: 10px 12px;
			.radius(0px);
			color: @white;
			border: none;
			background: @green;
			text-transform: uppercase;
		}
		a.btn:hover {
			background: lighten(@green, 16%); 
		}
	}
}

header.skrollable-before, header.skrollable-between {
	.noBoxShadow;
}

header.skrollable-after, header.wizard {
	.boxShadow(0,0,4px,#222);
	background: rgba(255,255,255,0.85);
	nav {
		a.btn {
			position: relative;
			opacity: 0.8;
			top: 11px;
			padding: 8px 16px;
			border: 1px solid @grey5;
			float: right;
			background: @grey4;
			color: @grey7;
			.noBoxShadow;
			font-weight: 600;
			i {
				margin-left: 3px;
			}
		}
	}
}

body.license {
	height: 800px;
	background-color: #e3e5ea;
	background-image: none;
	font-family: 'Open Sans', serif;
	footer.main {
		position: relative;
		bottom: -50px;
	}
}

body.signupTool {
	footer.main {
		position: relative;
		bottom: -12px;
	}
}

body.signupTool.validation {
  min-height: 800px;
  max-height: 1200px;
}

#domain {
	position: relative;
	top: 15px;
	max-width: 800px;
	label {
 		margin-top: 7px;
 		margin-left: 1%;
		.fontStyle(@white;18px;500);
	}
 	input[type="url"] {
 		margin-bottom: 7px;
 		width: 98%;
 		margin-left: 1%;
		font-family: @font5;
		.fontStyle(@grey6;18px;500);
 		padding: 10px 10px;
 		background: @grey2;
 		border: 2px solid @grey6;
 		.insetShadow(0;0;1px;@grey1);
 	}
 	input[type="url"]:hover {
 		.insetShadow(0;0;2px;lighten(@green,10%));
 	}
 	input[type="url"]:focus {
 		padding: 11px 11px;
 		border: 1px solid @grey6;
 		outline: none;
 		.insetShadow(0;0;1px;1px;lighten(@green,22%));
 	}
 	::-webkit-input-placeholder, :-moz-placeholder, ::-moz-placeholder, :-ms-input-placeholder { /* WebKit browsers */
	    color: @grey4;
	}
	:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
	    color: @grey4;
	}
	::-moz-placeholder { /* Mozilla Firefox 19+ */
	    color: @grey4;
	}
	:-ms-input-placeholder { /* Internet Explorer 10+ */
	    color: @grey4;
	}
	input[type="submit"] {
		margin-top: 50px;
		padding: 0 38px;
		width: 30%;
		margin-left: 35%;
		position: relative;
		top: -5px;
		background: @green;
		.fontStyle(@white;22px;500);
		height: 60px;
		border: none;
		.noTextShadow;
		opacity: 1;
	}
	input[type="submit"]:hover {
		background: lighten(@green,16%);
	}
}

body.home {
	font-family: @font5;
	/*background-image: url("@{base}images/bg2.png");*/
	background-image: none;
	background-color: @white;

	#mainWrapper {
		background: url("@{base}images/bgFade2.png");
		background-repeat: repeat-x;
		margin-top: 50px;
		width: 100%;
		height: 700px;
	}

	#mainPrompt {
		padding-top: 40px;
		background-color: rgba(55,118,176,0.4);
		width: 100%;
		height: 700px;
		p {
			width: 76%;
			margin-left: 12%;
			text-align: center;
			.fontStyle(@white;44px;600);
		}
		h2 {
			margin-top: 0;
			margin-left: 10%;
			width: 80%;
			line-height: 35px;
			text-align: center;
			font-family: @font5;
			.fontStyle(@white;24px;400);
		}
		#logo {
			position: relative;
			top: -30px;
			max-width: 400px;
			img {
				margin-left: 40px;
				width: 350px;
			}
		}
		.browser {
			width: 240px;
			margin: auto;
			margin-top: 25px;
			margin-bottom: 15px;

		}
	}
	#about {
		font-family: "Helvetica Neue", sans-serif;
		width: 100%;
		height: 500px;
		background: @white;
		.div {
			background: @bgBlue;
			h3 {
				text-align: center;
				.fontStyle(@white;28px;500);
				margin-bottom: none;
				position: relative;
				top: 28%;
			}
		}
		#div2 {
			background: @lightGreen;
			border-top: 1px solid rgba(255,255,255,0.4);
			width: 100%;
			height: 4px;
			.boxShadow(0;1px;1px;rgba(0,0,0,0.4));
		}
		ul.hiw {
			padding: 0 40px;
			padding-top: 40px;
			h3 {
				text-align: center;
				font-family: @font5;
				text-transform: uppercase;
				.fontStyle(darken(@grey7,10%);40px;400);
			}
			li {
				margin-top: 30px;
				float: left;
				display: block;
				width: 100%;
				height: 200px;
				margin: 2%;
				img {
					float: right;
					width: 210px;
					margin-top: 35px;
					margin-right: 100px;
				}

				span.badge {
					float: left;
					background: lighten(@green,20%);
					height: 75px;
					padding-top: 13px;
					width: 75px;
					font-family: @font5;
					font-size: 45px;
					margin-top: 95px;
					margin-left: 25px;
					margin-right: 25px;
				}
				p {
					margin-top: 112px;
					width: 60%;
					float: left;
					line-height: 22px;
					font-family: @font5;
					.fontStyle(@grey7;18px;400);
					b {
						line-height: 16px;
						.fontStyle(lighten(@green,20%);20px;600);
					}
				}
			}
			li.alt {
				img {
					float: left;
				}
				span.badge {
					background: @green;
				}
			}
		}
	}
}

body.wizard {
	background: @grey2;
}

//Headers and Numbers 

span {
	display: inline-block;
}


//Main Content

#mainContent {
	margin-top: 45px;
	background: @white;
	.bottomRadius(3px);
	.boxShadow(0;1px;2px;@blueGrey5);
	position: relative;
	min-height: 660px;
	#rightContent {
		position: absolute;
		left: 200px;
		float: left;
		width: 940px;
		background: @white;
		.bottomRightRadius;
	}
	h2 {
		font-family: @font5;
		.fontStyle(@grey7;22px;600);
	}
	p {
		.fontStyle(@grey7;14px;400);
		margin-right: 30px;
	}
	.topSelector {
		height: 50px;
		margin-left: -15px;
		margin-right: -15px;
		padding-left: 15px;
		padding-top: 15px;
		border-bottom: 1px solid @grey4;
		label {
			float: left;
			margin-right: 20px;
			.fontStyle(@blueGrey5;18px;500);
		}
		.dropdown {
			.floatLeftRelative;
			top: -3px;
			button {
				text-align: left;
				height: 30px;
				width: 115px;
				i {
					position: absolute;
					top: 9px;
					right: 8px;
				}
			}
		}
		select {
			position: relative;
			top: -3px;
			width: 200px;
			height: 25px;
		}
	}
	.section {
		margin: 15px 0;
		h3 {
			.fontStyle(@blueGrey5;18px;500);
			padding-bottom: 3px;
			border-bottom: 1px solid @grey4;
			i {
				margin: 0 3px;
			}
			span {
				margin-top: 3px;
				.fontStyle(@grey5;14px;500);
				position: absolute;
				left: 20%;
				width: 60%;
				text-align: center;
			}
			p {
				float: left;
				.fontStyle(@blueGrey5;18px;500);
				margin-bottom: 0px;
				margin-top: 7px;
			}
			.navButtons {
				margin-left: 365px;
				margin-top: -20px !important;
				a {
					color: @blueLight;
					margin-left: 50px;
					display: inline-block;
					font-size: 20px;
				}
				a:hover {
					color: lighten(@bgBlue,7%);
					text-decoration: none;
				}
				span {
					.fontStyle(@blueGrey5;14px;600);
					margin-top: 5px;
					margin-left: 260px;
					text-align: center;
					width: 50px;
				}
			}
		}
		p {
			.fontStyle(@grey6;14px;500);
		}
		a.add {
			margin-left: 5px;
			.fontStyle(@blueLight;16px;500);
			i {
				margin-right: 5px;
			}
		}
		a.add:hover {
			color: @blueDark;
			text-decoration: none;
		}
		.stats {
			margin-top: 10px;
			margin-bottom: 10px;
			padding: 0 5%;
			li {
				p {
					margin-bottom: 0px;
					.fontStyle(@grey6;45px;500);
				}
			}
		}
	}
}

#mainContent.plans {
	position: static;
	background: @white !important;
}

/*FOOTER*/

footer {
	#footerNav{
		margin-top: 15px;
		margin-bottom: 30px;
		float: right;
	
		li{
			padding: 5px 20px;
			float: left;
			a {
				font-family: @font5;
				.fontStyle(rgba(132,156,173,0.6);12px;400);
			}
			a:hover {
				text-decoration: none;
				color: rgba(132,156,173,0.8);
			}
		}
		li:first-child {
			padding-left: 0px;
		}
	}
}
/**END FOOTER**/

/*ACCOUNTBAR*/
#accountBar {
	width: 734px;
	margin-top: 30px;
	.topRadius;
	margin-left: 198px;
	padding-left: 5px;
	color: @grey5;
	background: lighten(@greenGrey1,3%);
	font-weight: 800;
	border: 1px solid @grey4;
	.boxShadow(0,0,1px,@grey3);

	#stepTitle, #progress{
		float: left;
		width: 321px;
		margin-top: 15px;
		height: 70px;
	}

	#navButtons  {
		margin-top: 15px;
		float: left; 
		width: 280px;
	}

	#progressLogo {
		float: left;
		height: 101px;
		padding-top: 20px;
		padding-left: 10px;
		padding-right: 10px;
		border-right: 1px solid @grey4;
		img {
			width: 170px;
		}
	}

	#accountProgress {
		width: 280px;
		.floatLeftRelative;
		left: 20px;

		h3 {
			.fontStyle(@bgBlue;17px;500);
			margin-left: 4px;
			margin-top: 10px;
			margin-bottom: 3px;
			span {
				font-size: 15px;
			}
		}

		#accountProgressBar {
			margin-left: 8px;
			.floatLeftRelative;
			top: 5px;
			width: 99%;
			height: 26px;
			border: 1px solid rgba(0,0,0,0.25);
			background: @greenGrey2;
			.insetShadow(0;3px;1px;rgba(0,0,0,0.05));
			overflow: visible;
	
			.progress {
				height: 24px;
				.radius(3px);
				float: left;
				.gradientGreenButton;
				.insetShadow(0;0;1px;@grey4);
				border-right: 1px solid lighten(@grey5,10%);
			}

		}
		a.url {
			margin-left: 8px;
			position: relative;
			top: -10px;
			.fontStyle(@blueGrey5;14px;600);
			cursor: default;
		}
		a.url:hover {
			text-decoration: none;
		}

	}

	#getStarted {
		border-left: 1px solid @grey4;
		height: 101px;
		.floatLeftRelative;
		width: 200px;
		left: 57px;
		
		a.btn.important {
			.insetDrop(0;-3px;0;0;rgba(0,0,0,0.3);0;2px;3px;-1px;rgba(0,0,0,0.2));
			background: @buttonGreen;
			padding-top: 7px;
			.heightAndWidth(36px;120px);
			margin-left: 39px;
			font-size: 14px;
		}
	}



	/*Steps in the Trust Process*/
	.stepInfo {
		.stepIcon {
			float: left;
			width: 80px;
			height: 80px;
			margin-top: 2px;
			margin-left: 10px;
			margin-right: 20px;
		}	
		

		span.prog {
			margin-left: 0 !important;
		}

		#stepTitle {
			margin-bottom: 20px;
			h2 {
				margin-top: 10px;
				line-height: 20px;
				.fontStyle(@grey6;18px;500);
			}
			span {
				i {
					margin-right: 3px;
					color: @bgBlue;
				}
				.fontStyle(lighten(@grey6,7%);12px;500);
			}
		}

		#progress {
			padding-top: 20px;
			.progress {
				float: left;
				width: 83%;
				margin-bottom: 3px;
				border: 1px solid rgba(0,0,0,0.4);
				.bar {
					height: 19px;
					.gradientGreenButton;
					.insetShadow(0;0;2px;rgba(255,255,245,0.75));
				}
			}
			span {
				margin-left: 7px;
				.fontStyle(darken(@bgBlue,1%);14px;700);
			}
			a.url {
				margin-left: 5%;
				color: @bgBlue;
			}
		}

		#navButtons {
			a.important {
				float: right;
				width: 90px;
				margin: 17px 17px;
			}
			p {
				.floatLeftRelative;
				top: -10px;
				left: 65px;
				clear: right;
				width: 70%;
				text-align: center;
				.fontStyle(@grey5;14px;600);
			}
		}
	}
}

#accountBar.account {
	.radius(0);
	margin: 0;
	width: 100%;
	height: 101px;
	border: none;
	border-bottom: 1px solid @grey4;
	#accountProgress {
		width: 420px;
	}
	div {
		border: none !important;
	}
	button.btn.important {
		margin-top: 30px;
		margin-left: 120px;
	}
}


/*SIDE NAV*/
#accountNavHolder {
	font-family: "Helvetica Neue", sans-serif;
	float: left;
	position: relative;
	padding: 0px;
	border: solid @grey4;
	border-width: 0 1px;
	background: @greenGrey1;
	.bottomLeftRadius(3px);
	height: 100%;
	width: 200px;
	letter-spacing: 0.095em;
	min-height: 660px;
	#accountNav {
		width: 200px;
		position: fixed;
		ul.navigation {
			width: 200px;
		}
		ul {
			margin-top: 0px;
			margin-left: 0px;
			.brandInfo {
				position: relative;
				top: 20px;
				height: 120px;
				margin: 0 10px;
				.boxShadow(0;1px;1px;@grey6);
				background: @white;
				margin-bottom: 30px;
				img.logo {
					margin: 10px 0;
					width: 175px;
					max-height: 100px;
					padding: 5px 7px;
					background: @white;
				}
				a.url {
					margin-top: 25px;
					display: block;
					width: 220px;
					text-align: center;
					font-size: 12px;
					padding-bottom: 10px;
				}
			}
		}
		
		li {
			height: 40px;
			i.seal {
				position: relative;
				left: -3px;
				margin-top: -1px;
				margin-right: 3px;
				float: left;
				display: inline-block;
				width: 17px;
				height: 17px;
				img {
					width: 17px;
				}
				img.notSelected {
					display: block;
				}
				img.selected {
					display: none;
				}
			}
			a.current {
				color: @white;
				font-weight: 600;
				i.seal {
					img.notSelected {
						display: none;
					}
					img.selected {
						display: block;
					}
				}
			}

			a.disabled {
				cursor: help;
			}
			
			span {
				text-align: center;
				background: #e3e3e3;
				float: right;
				margin-right: 10px;
				display: block;
				width: 30px;
				.radius(15px);
				text-shadow: none;
			}
			
			a {
				display: block;
				height: 100%;
				padding-top: 11px;
				padding-left: 20px;
				.fontStyle(@grey6;14px;500);
			}

			a.disabled {
				color: @grey5;
			}
			
			i {
				font-size: 1.3em;
				text-shadow: none;
				position: relative;
				margin-right: 5px;
			}
		}
		
		li:hover {
			background: @greenGrey2;
		}



		button.btn {
			width: 60%;
			margin: 18px 20%;
			i.addTeam {
				background: url("@{base}images/addTeamW.png");
				position: relative;
				right: 1px;
				top: 1px;
				float: right;
				background-size: 15px;
				height: 15px;
				width: 15px;
			}
			i.addFilter {
			    position: relative;
			    right: 1px;
			    top: 1px;
			    float: right;
			    background-size: 15px;
			    height: 15px;
			    width: 15px;
			}
		}

		li.subType {
			padding-top: 10px;
			p {
				margin-left: 20px;
				margin-right: 0;
				.fontStyle(@grey7;16px;500);
			}
		}

		li.subType:hover {
			background: none;
		}
		
		a:hover {
			text-decoration: none;
		}
		
		li.current {
			background: @bgBlue;
			border-bottom: 1px solid #d0d0d0;
			margin-bottom: 1px;
		
			span {
				background: #555;
				color: #fff;
			}
		}
		
		.subLinks {
		
			li {
				height: 42px;
			}
			
			li a {

				padding-top: 12px;
				padding-left: 25px;
				.fontStyle(12px; 400);
			}
		}
	}
	#accountNav.fixed {
		position: fixed;
	}
	#accountNav.relative {
		position: relative;
		bottom: 0px;
		left: 0 !important;
		ul.navigation {
			position: fixed;
		}
	}
}

.accountOptions {
	width: 198px;
	height: 30px;
	border-top: 1px solid #e3e3e3;
	.gradientWhiteToGrey;	

	ul {
		margin: 0px;
		height: 30px;
		border-bottom: 1px solid @grey3;
		li {
			float: left;
			width: 30px;
			height: 30px;
			border-right: 1px solid @grey4;
			a {
				display: block;
				font-size: 20px;
				color: @grey6;
				height: 100%;
				padding-left: 2px;
				padding-bottom: 0px;
				text-align: center;
			}
		}
		li.addTeam {
			float: right;
			border-right: none;
			width: 32px;
			a {
				padding: 0 1px;
			}
		}
	}
	
	
	
	
	
	li a i {
		position: relative;
	}
	
	li a:hover {
		text-decoration: none;
		background: @white;	
		opacity: 0.8;
	}
}



i.addTeam {
	display: block;
	height: 30px;
	width: 30px;
	background: url("@{base}images/addTeam.png");
}

.accountOptions.fixed {
	position: fixed;
	bottom: 0;
}

.accountOptions.relative {
	position: absolute;
	left: 0 !important;
	bottom: 1px;
	.bottomLeftRadius(3px);
	ul {
		.bottomLeftRadius(3px);
		li:first-child {
			.bottomLeftRadius(3px);
			a {
				.bottomLeftRadius(3px);
			}
		}
	}
}

/*Right Side of Setup Page Snapshot of your account's Status */


/*Setup Progress Bar */

#toDoListHolder {
	float: left;
	margin-left: 125px;
	padding-bottom: 40px;

	#toDoList {
		width: 734px;
		margin-left: 73px;

		li {
			border: solid @grey3;
			border-width: 0 1px 1px 1px;
			.heightAndWidth(104px;100%);
			margin-left: 0px;
			.boxShadow(0,0,1px,@grey3);
		
			a.row {
				margin-left: 0px;
				margin-right: 10px;
				padding: 14px 0;
				display: block;
				height: 100%;
				width: 100%;

				div.complete {
					float: right;
					height: 30px;
					width: 30px;
					margin-top: 15px;
					margin-right: 32px;
					i {
						color: @bgBlue;
						font-size: 30px;
					}
				}
		
				p.more {
					cursor: pointer;
					float: right;
					clear: right;
					margin-right: 10px;
					padding-left: 25px;
					.fontStyle(lighten(@bgBlue,5%);14px;600);
				}
				p.more:hover {
					text-decoration: underline;
				}
			}
			
			a:hover {
				text-decoration: none;
			}
		}
		li:last-child {
			.bottomRadius(5px);
		}
		
		li:hover { 
			background: lighten(@greenGrey1,5%);
		}
		
		li.complete { 
			padding: 0px;
			background: #f6f6f6;
			border: 2px solid #d0d0d0;
			box-shadow: 0 0 2px #e3e3e3;
		}
		
		.overviewIcon {
			float: left;
			width: 65px;
			height: 65px;
			margin: 0 20px;
			img {
				width: 75px;
				height: 75px;
			}
		}
		
		.overviewInfo {
			height: 100%;
			float: left;
			margin-left: 20px;
		
			h2 {
				margin: 0px;
				.fontStyle(@grey6;18px;500);
				.textShadow(1px;1px;0px;rgba(0,0,0,0.08));
			}
			span {
				margin-top: 3px;
				.fontStyle(lighten(@bgBlue,7%);12px;400);
				i{
					font-size:16px;
					margin-right: 5px;
					color: @bgBlue;
				}
			}
		}

	}
}

#toDoListHolder.account {
	margin-top: 50px;
	margin-left: 32px;
	#toDoList {
		li:first-child {
			border-top: 1px solid @grey4;
			.topRadius(5px);
		}
	}
}

/**END SETUP PAGE**/


.percentageBar {
	.floatLeftRelative;
	margin: 7px 0px;
	height: 100px;
	width: 19px;
	border: 1px solid #d0d0d0;
	background: #fcfdfb !important;
	border-radius: 30px !important;
	overflow: visible !important;
	
	.bar {
		position: absolute;
		bottom: 1px;
		left: 1px;
		width: 17px;
		.bottomRadius(30px);
		.insetShadow(1px;0;1px;rgba(255,255,255,0.3)) !important;
		border-top: 1px solid #e3e3e3;
		
		span{
			float: right;
			position: relative;
			top: -3px;
			left: -2px;
			.fontStyle(#fff;10px;600) !important;
		}
	}
	
	i.icon-ok {
		position: relative;
		top: 7px;
		left: 2px;
		.fontStyle(@white;14px;400);
		.textShadow(0;0;2px;#000);
	}
	
	.yellow {
		.gradientYellow;
	}
	
	.green {
		.gradientGreen;
	}
}


/*Main Overview Page*/
#overview {
	display: block;
	padding-bottom: 50px;
}

/* profile signup */

h4.licenseTitle {
	font-family: @font1;
	width: 100%; 
	text-align: center;
	margin-top: 30px;
	margin-bottom: 10px;
	.fontStyle(@blueDark;30px;500);
	span {
		.fontStyle(@darkBlue;30px;500);
	}
}
#reasons {
	float: left;
	width: 400px;
	margin-left: 30px;
	padding: 35px 0px;
	ul.reasons {
		li {
			margin: 5px 0;
			height: 70px;
			font-family: "Helvetica Neue", sans-serif;
			text-transform: uppercase;
			.fontStyle(@grey6;16px;600);
			span {
				display: block;
				width: 100%;
				text-transform: none;
				.fontStyle(@grey6;14px;400);
			}
			img {
				position: relative;
				top: -10px;
				float: left;
				width: 70px;
				margin-right: 10px;
			}
		}
	}
}

.alpha.license {
	overflow: scroll;
	z-index: 1000;
	display: none;
	.radius;
	background: @white;
	width: 60%;
	padding: 25px;
	position: absolute;
	border: 1px solid @grey3;
	top: 80px;
	height: 650px;
	left: 20%;
	.boxShadow(1px;1px;1px;rgba(0,0,0,0.5));
	h3 {
		.fontStyle(darken(@blueLight,5%);24px;600);
	}
	p {
		font-family: "Helvetica Neue", sans-serif;
		.fontStyle(darken(@grey7,2%);14px;400);
	}

}
.profile {
	width: 1002px;
	.radius(10px);
	margin-top: 130px;
	height: 600px;
	background: lighten(@grey3,6%);
	border: 1px solid rgba(0,0,0,0.3);
	.insetShadow(1px;0;0px;2px;rgba(0,0,0,0.15));

	#reasons {
		#seal {
			width: 60%;
			margin: 0 20%;
		}
		ul.reasons {
			margin-top: 20px;
			border-top: 1px solid @grey4;
			padding-top: 20px;
		}
		li {
			margin-bottom: 12px !important;
		}
	}
	#prompt {
		width: 480px;
		padding: 60px 55px;
		float: left;
		h3 {
			font-family: @font5;
			.fontStyle(darken(@blueGrey5,10%);24px;600);
			margin-left: 25px;
		}
		img {
			postion: relative;
			top: -15px;
			margin-left: 45px;
			width: 300px;
		}
	}
	
	#accountForm {
		width: 450px;
		float: left;
		padding: 0;
		form {
			width: 100%;
			font-family: "Helvetica Neue", sans-serif;
			.control-group {
				padding-left: 0 !important;
				margin: 7px 0;
				.controls {
					margin-left: 0;
					margin-bottom: 10px;
					input[type="input"], input[disabled] {
						height: 36px;
						width: 380px;
						border: 1px solid darken(@grey4,15%);
						.insetShadow(0;0;1px;@bgBlue);
						.radius(3px);
						padding: 3px;
					}
					input[disabled] {
						background: @grey3;
					}
					input[type="input"]:hover {
			 		.insetShadow(0;0;2px;@green);
				 	}
				 	input[type="input"]:focus {
				 		outline: none;
				 		.insetShadow(0;0;1px;1px;@green);
				 	}
				 	label {
				 		min-width: 200px;
				 		color: darken(@bgBlue,15%);
				 		margin-bottom: 0;
				 	}
				}
				button {
					height: 36px;
					width: 380px;
				}
			}

			#tos.control-group {
				margin: 2px 0;
				.controls {
					margin-bottom: 0;
					label {
						.fontStyle(lighten(@grey6,5%);11px;400);
						a:hover {
							color: @bgBlue;
							text-decoration: none;
						}
					}
				}
			}
		}
	}
}


/*Privacy */
.profile.privacy {
	.radius(10px);
	margin-top: 100px;
	background: lighten(@grey3,6%);
	border: 1px solid rgba(0,0,0,0.3);
	.noBoxShadow;
	height: 1355px;
	background: @white;
	padding: 0 25px;
	max-width: 1002px !important;
	margin-bottom: 60px;
	h4.licenseTitle {
		font-family: @font1;
		width: 100%; 
		text-align: center;
		margin-top: 30px;
		margin-bottom: 10px;
		.fontStyle(@blueDark;30px;500);
	}
	ul {
		padding-left: 30px;
		list-style: disc;	
		li {
			margin-bottom: 5px;
		}
	}
	h2 {
		font-size: 14px;
		line-height: 20px;
		color: @blueDark;
	}
}
.profile.privacy.terms {
	height: 4300px;
}
.profile.privacy.faq {
	height: 2240px;
	h2 {
		margin-top: 0;
		font-size: 18px;
		line-height: 24px;
		padding-top: 50px;

	}
	p {
		margin-top: 10px;
		margin-bottom: 0;
	}
	li.sub {
		margin-left: 35px;
		list-style-type: circle;
	}
	ul {
		margin-top: 10px;
	}
	ul.toc {
		margin-top: 55px;
		padding-left: 25px;
		li {
			margin: 8px 0;
			a:hover {
				text-decoration: none;
			}
		}
	}
}

.profile.privacy.license {
	height: 3262px;
}

/*Form with Basic company and account Information*/

#accountForm {
	padding: 0 15px;
	form  {
		.control-group {
			float: left;
			width: 100%;
			min-height: 30px;
			padding-left: 75px;
			.control-label {
			float: left;
			clear: left;
			.fontStyle(lighten(@blueGrey5,3%);15px;500);
			min-height: 40px;
			width: 180px;
			margin-bottom: 15px;
			}
			.controls {
				margin-left: 30px;
				float: left;
				line-height: 25px;
				select {
					margin-top: 8px;
					width: 100px;
				}
			}
			input[type="text"] {
				.fontStyle(lighten(@grey6,5%);14px;600);
				width: 350px;
				height: 35px;
				.radius;
				padding: 3px 7px;
				.boxShadow(0,1px,0,rgba(0,0,0,0.25));
			}
			#logo {
				margin-top: -5px;
				input#logo-clear_id, label[for="logo-clear_id"] {
				display: none;
				}
				input#id_logo {
					position: relative;
					top: 4px;
					right: 260px;
					float: right;
					line-height: 0px;
				}
			}
		}
		#state {
			float: left;
			width: 400px;
			.controls {
				width: 100px;
			}
		}
		#zip {
			float: left;
			width: 300px;
			padding-left: 15px;
			label {
				width: 30px;
				text-align: left;
			}
			input[type="text"] {
				width: 160px;
			}
		}

		input.logo, input#id_logo {
			.noBoxShadow;
		}

		input#logo-clear_id {

			.noBoxShadow;
			float: left;
			margin-top: 30px;
			width: 15px;
			clear: left;
		}

		label[for="logo-clear_id"] {
			float: left;
			margin-left: 3px;
			margin-top: 28px;
			font-size: 12px;
		}
	}
}
 
/*2. Requirements*/

#requirements {
	height: 950px;
	padding: 0 15px;
	#assessment {
		margin-bottom: 0px;
	}
	/* Old Reasons
	#reasons {
		width: 850px;
		padding-top: 12px;
		padding-bottom: 0px;
		li {
			margin: 5px 0;
			background: darken(@grey2,4%);
			height: 90px;
			width: 100%;
			.insetShadow(0;1px;0;@white);
			border: 1px solid rgba(0,0,0,0.05);
		}
		img {
			clear: left;
			float: left;
			margin-top: 18px;
			margin-left: 7px;
		}
		p {
			float: left;
			height: 100%;
			width: 45%;
			padding-top: 15px;
			padding-left: 10px;
			margin-bottom: 0px;
			border-left: 5px solid @white;
			.fontStyle(@blueLight;20px;500);
		}
		.status {
			float: left;
			padding-top: 11px;
			padding-left: 10px;
			height: 100%;
			border-left: 5px solid @white;
			.fontStyle(@grey7;12px;400);
			text-transform: none;
			span {
				text-transform: uppercase;
				clear: left;
				line-height: 28px;
				margin-right: 3px;
				display: inline;
				.fontStyle(@grey6;14px;500);
			}
		}
	} */
	#reasons {
		float: none;
		width: 634px;
		padding: 10px 0;
		margin-left: 50px;
		ul.reasons {
			li {
				font-family: @font5;
				padding: 0;
				height: 80px;
				border-bottom: 1px solid @grey4;
				img {
					margin-top: 15px;
					clear: left;
				}
				p {
					height: 100%;
					padding-top: 38px;
					margin-bottom: 0;
					float: left;
					width: 30%;
					border-right: 1px solid @grey4;
				}
				div.status {
					padding-left: 20px;
					margin-top: 22px;
					float: left;
					width: 34%;
				}
				span {
					display: inline;
				}
				.cbWrapper {
					float: left;
					margin-left: 10px;
					margin-top: 25px;
				}
			}
		}
	}
	.section {
		margin-bottom: 50px !important;
		ul.selfAssessment {
			position: relative;
			margin-top: 5px;
			height: 100px;
			li.question {
				width: 100%;
				position: absolute;
				.slide;
				display: none;
				opacity: 0;
				text-align: center;
				.fontStyle(@grey6;18px;500);
				.controls {
					margin-top: 40px;
					ul {
						width: 60%;
						height: 50px;
						margin: auto;
						li {
							float: left;
							width: 12%;
							margin: 0 4%;
							input {
								display: block;
								margin: auto;
							}
							label {
								text-align: center;
								.fontStyle(@grey7;12px;500);
							}
						}
					}
				}
			}

			#claims.question {
				display: block;
				left: 0px;
			}
			.question.active {
				opacity: 1;
			}
		}

	}

	#program {
		height: 395px;
	}

	h3 {
		margin-bottom: 0px;
	}

	table {
		margin-bottom: 10px;
		thead>tr>th {
			border-bottom: 1px solid @grey3;
			background: lighten(@greenGrey1,3%);
		}
		tbody>tr>td {
			border-top: none;
		}
		th.name {
			width: 180px;
		}
	}

	#lists {
		h3 {
			margin-bottom: 0px;
			span {
				a {
					position: relative;
					left: -10px;
				}
			}
		}
	}

	#privacy {
		padding-bottom: 20px;
	}

	#oldForm {
		display: none;
		ul {
			width: 630px;
			margin-left: 30px;
			li {
				font-family: @font1;
				.fontStyle(#655635;14px;400);
				padding: 5px;
			}
		}

		.controls {
			margin-left: 7px;
			margin-bottom: 10px;
			ul {
				float: left;
				margin: 5px;
				li {
					float: left;
					width: 305px;
					input {
						margin-top: -4px;
						margin-right: 2px;
					}
					label {
						padding-top: 8px;
						font-family: @font2;
						.fontStyle(#333;10px;400);
						line-height: 13px;
					}
				}
			}
		}
	}


	
	.bottomNav {
		position: absolute;
		left: -15px;
		bottom: 15px;
	}


}

/**Messages Monitoring**/

.alpha.updatePrompt {
	height: 500px;
	width: 80%;
	z-index: 1000;
	display: none;
	position: absolute;
	margin: auto;
	top: 200px;
	background: @white;
	.radius;
	padding: 25px;
	button {
		position: relative;
		bottom: 5px;
		width: 20%;
		margin: 0 40%;
	}
	h3 {
		.fontStyle(@green;22px;400);
	}
	p {
		.fontStyle(@grey7;12px;600);
	}
}

#messages {
	padding: 0 15px;
	.alpha.updatePrompt {
		margin-left: 50px;
	}
	#listSelector {
		.selectList {
			button.btn {
				padding: 0 12px;
			}
		}
		span.primary {
			float: right;
			margin-right: 100px;
			position: relative;
			top: 14px;
			.fontStyle(@blueGrey5;14px;600);
			text-align: right !important;
			input {
				position: relative;
				top: -1px;
				margin-right: 7px;
			}
		}
	}
	#stats {
		position: relative;
		p.updatePrompt {
			text-align: center;
			float: right;
			right: 2px;
			top: 65px;
			width: 280px;
			margin-right: 0;
			position: absolute;
		}
	}
	.messageStats {
		position: relative;
		left: -20px;
		top: -5px;
		li {
			float: left;
			width: 150px;
		}
		p {
			text-align: center;
			margin: 0px !important;
			font-size: 45px !important;
		}
		span {
			position: relative;
			top: -7px;
			width: 100%;
			padding: 0 15px;
			text-align: center;
			.fontStyle(@blueGrey5;14px;600);
		}
		.changed {
			p {
				color: @blueDark !important;
			}

		}
	}

	.primaryPrompt {
		float: right;
		position: relative;
		left: 70px;
		top: -10px;
		width: 220px;
		p {
			position: relative;
			top: 5px;
			margin-left: -2px !important;
			text-align: left;
			font-size: 14px !important;
		}
	}


	
	.bottomNav {
		padding-left: 100px;
		position: absolute;
		top: 175px;
		right: 120px;
		border-left: 1px solid @grey4;
		width: 180px;
		height: 130px;
		.btn {
			position: relative;
			top: 40px;
			left: 20px;
			width: 110px;
		}
	}
}



body.login {
  background: @greenDarkNew;
  height: 100%;
  min-height: 790px;
  div.logoStatic {
    position: relative;
    padding-top: 50px;
    max-width: 1000px;
    z-index: 1001;
    width: 30%;
    margin: 0 35%;
    margin-bottom: 20px;
    a {
      width: 100%;
      margin-top: 5px;
      .fontStyle(@grey6;16px;600);

			a.display {
				float: right;
				cursor: pointer;
				input.cb {
					display: none;
					cursor: pointer;
				}
				.cbox {
					.radius;
					float: left;
					margin-right: 10px;
					display: block;
					background: @grey3;
					.boxShadow(0;0;1px;rgba(0,0,0,0.6));
					position: relative;
					height: 20px;
					width: 20px;
					i {
						margin: 1px;
						.fontStyle(@green;18px;400);
						display: none;
					}
				}
				.cbox.active {
					i {
						display: inline;
					}
				}
			}
			a.display:hover {
				text-decoration: none;
				color: lighten(@green,7%);
				.cbox {
					i {
						color: lighten(@green,10%);
					}
				}
			}

			.cbox.disabled {
				background: @grey2 !important;
				.noBoxShadow() !important;
			}
		}
	}
	.itemBody {
		postion: relative;
		top: -65px;
		left: 85px;
		height: 508px;
		width: 767px;
		border: 4px solid @blueGrey4;
		.message {
			float: left;
			display: block;
			.heightAndWidth(500px;459px;);
			padding: 0 2px 0 1px;
			overflow: hidden;
			border: 1px solid @grey3;
			img {
				width: 455px;
				margin: auto;
			}
		}
		.tags {
			float: left;
			height: 500px;
			width: 300px;
			background: @greenGrey2;
			.insetShadow(1px;0;3px;@grey5);
			.inputArea {
				.boxShadow(0;1px;3px;@grey5);
				.insetShadow(1px;0;3px;@grey5);
				background: @greenGrey1;
				height: 70px;
				margin-bottom: 0px;
				input {
					width: 200px;
					margin-top: 20px;
					margin-left: 10px;
				}
				button {
					width: 70px;
					margin-top: -4px;
					margin-left: 2px;
				}

			}
			.tagList {
				margin: 0 10px;
				padding: 10px;
				border-top: 1px solid @grey4;
				span.tag {
					cursor: pointer;
					.fontStyle(darken(@bgBlue,3%);16px;600);
					i {
						position: relative;
						top: 1x;
						.fontStyle(darken(@bgBlue,6%);18px;600);
					}
					i:hover {
						.fontStyle(darken(@bgBlue,12%);18px;600);
					}
				}
				span.notTagged {
					.fontStyle(@grey7;14px;600);
				}
			}
		}
	}
}

/*Timeline of messages*/


#messageWrapper.validation {
	clear: both;
	padding: 10px 17px;
	overflow: hidden;
	/*Individual Item*/
	.item {
		background: @grey1;
		margin-bottom: 20px;
		border: 1px solid @grey4;
		.boxShadow(0,0,4px,@grey6);
		max-width: 461px;
		.itemHeader {
			min-height: 50px;
			border-bottom: 1px solid @grey3;
			background: @bgBlue;
			padding-left: 5px;
			line-height: 50px;
			.subject {
				padding: 20px 5px;
				p {
				.fontStyle(@white;12px;600);
				text-align: center;
				line-height: 18px;
				}
			}
		}
		.itemSub {
			float: left;
			margin-top: 2px;
			margin-left: 10px;
			height: 17px;
			font-size: .9em;
			color: #444;
			font-weight: 700;
			text-shadow: 1px 1px 1px #fff;
		}
		.message {
			z-index: 500;
			display: block;
			margin: 10px 0 0 0;
			
			img {
				max-width: 459px;
			}
		
		}
		/*Tagged/status stuff*/
		.tagStatus {
			height: 90px;
			width: 300px;
			margin-left: 10px;
			text-shadow: 1px 1px 1px #fff;
		
			p {
				float: left;
				width: 100%;
				font-weight: 300;
				color: #555;
				margin-top: 10px;
				margin-bottom: 0px;
				line-height: 14px;
			}

			.date {
				margin-bottom: 0px;
				margin-left: 8px;
				text-shadow: 1px 1px 1px #fff;
				.fontStyle(#555;14px;300);
			}
			
			span {
				font-weight: 600;
				color: #333;
				font-size: .8em;
			}
			
			span.tag {
				display: inline;
				margin-right: 2px;
				color: @white;
			}
			
			.tagList {
				margin-left: 15px;
				line-height: 14px;
				.fontStyle(@grey6;11px;300);
				position: relative;
				top: 7px;
				margin-bottom: 0px;
				line-height: 14px;
				li {
					margin-right: 3px;
					display: inline;
					list-style: none;
				}
			}
		
		}
		
		.addTags {
			height: 30px;
			width: 305px;
			margin-left: 10px;
			
			input {
				height: 16px;
				border: 1px solid #cccddb;
				.radius(0px);
				.fontStyle(#000;11px;400);
			}
			
			.btn {
				margin-left: 3px;
				margin-top: -8px;
				padding-top: 3px;
				.heightAndWidth(27px;70px);
				.fontStyle(#777;10px;600);
				border: 1px solid #cccddb;
				.gradientOffWhiteToGrey;
				.radius(3px);
			}
			
			.btn:hover {
				background: @grey3;
			}
		}
		
	
	}

}

/*Key Points Selection Page*/
#keyPoints {
	height: 700px;
	padding: 0 15px;
	margin-top: 10px;
	.updatePrompt {
		margin-left: 85px;
	}
	h3 {
		position: relative;
		span.required {
			position: absolute;
			margin-top: 4px !important;
			.fontStyle(@blueGrey5,12px,500) !important;
			top: 22px;
			left: -27px !important;
			width: 140px !important;
			float: left;
		}
		p {
			position: absolute;
			left: 490px;
			top: -7px;
		}
	}
	.addCustom {
		margin-bottom: 40px;
		textarea.addPoint {
			margin: 10px 15px;
			padding: 5px;
			border: 1px solid @grey5;
			.radius;
			width: 400px;
			height: 100px;
		}
		a.btn.important {
			width: 80px;
			float: right;
			margin-top: 5px;
			margin-right: 14px;
		}
	}
	#selectPoints {
		margin-bottom: 0px !important;
		margin-left: -15px !important;
		margin-right: -15px !important;
		padding: 0px;
		height: 47px !important;
		padding-bottom: 13px;
		
	}
	#pointsList {
		margin-top: 0px !important;
		float: left;
		padding-bottom: 20px;
		width: 45%;
		clear: left;
		ul.keyPoints {
			margin-top: 90px;
		}

		.pointsStats {
			margin-top: 15px !important;
			float: right;
			width: 100%;
			li:first-child {
				margin-left: 10px;
			}
			li {
				width: 110px;
				float: left;
				p {
					font-size: 30px !important;
					text-align: center;
					margin:0px;
				}
				span {
					position: relative;
					top: -5px;
					width: 100%;
					text-align: center;
					.fontStyle(@blueGrey5;12px;600) !important;
				}
				button {
					margin: 14px 34px;
				}
			}
		}

		.pointsList {
			li {
				p {
					display: inline;
				}
			}
		}
	}

	#preview {
		float: right;
		width: 50%;
		padding-left: 20px;
		height: 850px;
		border-left: 1px solid @grey4;
		h3.header {
			margin-top: 50px;
			.fontStyle(@blueGrey5;18px;500);
			padding-bottom: 3px;
			border-bottom: 1px solid @grey4;
			i {
				margin: 0 3px;
			}
		}
		#miniProfile {
			margin: 30px 15px;
			#points {
				display: block !important;
			}
		}
		
	}

	ul.keyPoints {
		li.points {
			font-family: @font2;
			.fontStyle(#444;16px;500);
			width: 100%;
			margin: 5px 15px;
			text-align: center;
			ul.pointsList {
				li {
					margin: 5px 0;
					text-align: left;
					.fontStyle(@grey6;14px;500);
				}	
			}
		}
	}
	.bottomNav {
		left: 0px;
		padding-right: 15px;
		bottom: 5px;
		position: absolute;
	}
}

/*Point Sort */
ul.pointSort {
	margin: 7px 5px;
	p {
		margin-bottom: 2px;
		.fontStyle(darken(@bgBlue,5%);14px;500);
	}
	li.option {
		margin: 10px;
		text-align: left;
		font-family: @font1;
		.fontStyle(@grey7;16px;500);
		width: 400px;
		height: 55px;
		background: @grey4;
		border: 1px solid @grey5;
		.position {
			cursor: pointer;
			height: 100%;
			width: 50px;
			padding-top: 8px;
			text-align: center;
			float: left;
			border-right: 1px solid @grey5;
			background: @white;
			span {
				font-size: 22px;
			}
		}
		p {
			width: 76%;
			.floatLeftRelative;
			top: 1px;
			left: 12px;
			.fontStyle(@grey7;12px;500);
		}
		a {
			float: right;
			margin-right: 3px;
			font-size: 12px;
			color: @grey7;
		}
		a:hover {
			text-decoration: none;
			opacity: 0.5;
		}
	}

	a.addField {
		float: right;
		margin-top: 15px;
		margin-right: 5px;
	}
}


/*Home Page */
#home {
	background: lighten(@blueGrey2,5%);
	padding-top: 40px;
	min-height: 1000px;
	.mainPrompt{
		background-image: url('@{base}images/promptBG.png');
		.gradientBlue2;
		height: 500px;
		h3 {
			padding-top: 30px;
			width: 100%;
			text-align: center;
			.fontStyle(@grey1;30px;300);
			.textShadow(0;1px;3px;@blueDark);
		}
		h2 {
			padding-top: 30px;
			line-height: 100px;
			width: 100%;
			text-align: center;
			font-family: @font1;
			.fontStyle(@grey1;55px;500);
			.textShadow(0;1px;7px;@blueLight);
		}
	}	
}



/*****VALIDATION PAGE  ****/


#alphaOverlay, #upgradeOverlay, #addTeamOverlay, #upgradeSettingsOverlay {
	z-index: 999;
	display: none;
	position: fixed;
	top: 0px;
	height: 100%;
	width: 100%;
	background: rgba(0,0,0,0.5);
}

#alphaOverlay.active, #upgradeOverlay.active, #addTeamOverlay.active, #upgradeSettingsOverlay.active {
	display: block;
}


#upgradeOverlay.feed, #addTeamOverlay {
	position: absolute;
	width: 940px;
	height: 1260px;
	.bottomRightRadius(4px);
}
#upgradeOverlay.reports, #addTeamOverlay.reports {
	position: absolute;
	width: 940px;
	height: 660px;
	.bottomRightRadius(4px);
}

/***StatusBar Stuff***/
	
#topBar {
	font-family: @font5;
	position: relative;
	top: 30px;
	margin-bottom: 10px;
	height: 900px;
	width: 100%;
	.boxShadow(0,2px,1px,rgba(0,0,0,0.3));
	.radius(10px);
	background: @white;
	
	.nav {
		background: lighten(@greenGrey1,3%);
		.floatLeftRelative;
		height: 100%;
		width: 240px;
		.leftRadius(10px);

		.brandInfo {
			height: 120px;
			margin: 20px 10px;
			.boxShadow(0;1px;1px;@grey6);
			background: @white;
			img.logo {
				margin: 10px 20px;
				width: 180px;
				padding: 5px 7px;
				background: @white;
			}

			a.url {
				margin-top: 25px;
				display: block;
				width: 220px;
				text-align: center;
				font-size: 12px;
				padding-bottom: 10px;
			}
		}
		
		
		li {
			background: lighten(@greenGrey1,2%);
			.fontStyle(lighten(@grey6,10%);14px;600);
			padding-top: 10px;
			padding-left: 20px;
			.heightAndWidth(40px;240px);
			cursor: pointer;
			border-bottom: 1px solid @grey3;
			i {
				display: none;
				font-size: 1.1em;
				float: right;
				margin-top: 3px;
				margin-right: 10px;
			}
		}
		
		li:hover {
			color: darken(@grey7,5%);
			background: lighten(@grey1,3%);
			i {
				display: block;
			}
		}

		li#about {
			border-top: 1px solid @grey3;
		}

		li.active {
			color: darken(@grey7,5%);
			border-bottom: 1px solid @grey4;
			background: @white;
			i {
				display: block;
			}
		}
		
	}	
	
	.approvedSeal {
		margin-top: 15px;
		float: right;
		.heightAndWidth(240px;220px);
		
		img.seal {
			width: 180px;
			margin-top: 30px;
			margin-left: 22px;
			margin-bottom: 10px;
		}
		
		p  {
			text-align: center;
			margin-left: 10px;
			.fontStyle(@grey6;12px;400);
		}

		a.btn.important {
			float: right;
			padding-top: 8px;
			margin-top: 30px;
			margin-right: 20px;
			.fontStyle(@white;16px;500);
			display: block;
			width: 180px;
			height: 40px;
			color: @white;
		}
		
		a.btn.important:hover {
		}
		
	}
	.content::-webkit-scrollbar {width: 0 !important;}
	.content {
		.fontStyle(@grey6;11px;400);
		padding: 5px 5px 5px 20px;
		height: 96%;
		width: 520px;
		.floatLeftRelative;
		overflow: scroll;
		
		h2 {
			line-height: 25px;
			margin-top: 6px;
			margin-bottom: 7px;
			padding-left: 3px;
			padding-bottom: 7px;
			.fontStyle(@grey6;24px;600);
			border-bottom: 1px solid @grey3;
			.navButtons {
				float: right;
				margin-top: 3px;
				margin-right: 6px;
				a {
					color: @green;
					float: left;
					cursor: pointer;
					i {
						font-size: 20px !important;
					}
				}
				a:hover {
					text-decoration: none;
					color: darken(@buttonBlue, 10%);
				}
				.tabPosition {
					float :left;
					li {
						margin: 10px 2px;
						float: left;
						i {
							display: block;
							font-size: 8px;
							color: @grey4;
						}
						i.active {
							color: @buttonBlue;
						}
					}
				}
			}
			i {
				font-size: 26px;
				margin-right: 10px;
			}
			select {
				float: right;
				.heightAndWidth(20px;120px);
				margin-top: 5px;
				margin-left: 10px;
			}

		}

		.approvedSeal.mobile {
			display: none;
		}


		p {
			margin-top: 5px;
		}
		
		
		.section {
			margin-bottom: 20px;
			height: auto;
			h3 {
				margin-top: 0px;
				.fontStyle(@grey7;16px;600);
				line-height: 30px;
				i {
					margin-right: 6px;
					font-size: 18px;
				}
			}
			ul {
				margin-left: 0px;
				.radius(5px);
				li {
					
				}
			}
		
		}
		
		#about {
			p {
				margin-top: 12px;
				font-size: 14px;
				margin-bottom: 0;
				b {
					font-size: 18px;
					color: @grey7;
					font-weight: 700;
				}
			}
		}
		
		#msgs {
			height: 230px;
			h3 {
				border-bottom: 1px solid @grey3;
			}
			
			ul.msgBreakdown {
				float: left;
				width: 255px;
				li {
					height: 45px;
					width: 184px;
					float: left;
					padding-bottom: 2px !important;
					margin-bottom: 2px !important;
					border-bottom: 1px solid @grey3 !important;
					label {
						width: 270px;
						float: left;
						margin-left: 2px;
						margin-bottom: 0px;
						.fontStyle(#555555;14px;500);
						span {
							margin-top: 3px;
							.fontStyle(#555555;10px;600);
						}
					}
					.progress {
						float: left;
						clear: left;
						margin-top: 2px;
						margin-bottom: 5px;
						margin-right: 2px;
						.heightAndWidth(15px;180px);
						.radius(2px);
						background: @grey4;
						
						.bar {
							height: 100%;
							.gradientGreenButton;
						}
						
					}
					span {
						margin-top: -1px;
						margin-left: 10px;
						float: left;
						.fontStyle(#555555;16px;500);
					}
				}
				li:last-child {
					display: none !important;
				}
			}
			
			.msgFreq{
				float: left;
				margin-top: 45px;
				margin-left: 34px;
				width: 160px;
				li {
					float: left;
					width: 80px;

					padding-top: 3px;
					height: 30px;
					p {
						cursor: pointer;
						text-align: center;
						.fontStyle(@grey5;18px;300);
					}
					p:hover {
						color: @blueGreen;
					}
					p.selected {
						cursor: default;
						color: @blueGreen;
						font-weight: 500;
					}
				}
				li.week{
					p {
						border-right: 1px solid @grey5;
					}
				}
				span.freq {
					padding-bottom: 5px;
					position: relative;
					top: -7px;
					line-height: 70px;
					.fontStyle(@grey6;70px;700);
					width: 100%;
					text-align: center;
					border-bottom: 1px solid @grey5;
					img {
						height: 61px;
						width: 100px;
					}
				}

				#month.freq {
					display: none;
				}
			}
			
			
			.pages {
				position: relative;
				top: -5px;
				width: 100px;
				margin-left: 155px;
				a {
					margin-right: 30px;
				}
				a:hover {
					cursor: pointer;
					text-decoration: none;
				}
				i {
					font-size: 18px;
				}
			}
		}
		
		#key {
			height: 180px;
			ul.keyPoints {
				.noBoxShadow;
				li {
					.fontStyle(#555555;14px;500);
					padding: 5px;
					p {

						margin-bottom: 0px;
					}
					i.check {
						float: left;
						display: block;
						height: 30px;
						width: 20px;
						position: relative;
						top: 3px;
						margin-right: 7px;	
						background: url('@{base}images/check.png') no-repeat;
					}
				}
			}
		}
		
		
		#feedback {
			height: 250px;
			margin-bottom: 600px;
			border-bottom: 1px solid @grey4;

			p.prompt {
				margin-top: 30px;
				.fontStyle(@grey6;15px;500);
			}
			
			a#giveFeedback {
				background: @blueLight;
				font-size: 14px;
				float: left;
				padding: 10px;
				margin: 30px 5px;
				color: @white;
				cursor: pointer;
				.textShadow(0;1px;0px;rgba(0,0,0,0.9));
				i {
					margin-left: 5px;
				}
			}
			a#giveFeedback:hover {
				opacity: 0.8;
			}	
			a#giveFeedback.btn-disabled {
				opacity: 0.5;
				cursor: default;
			}
		}
	}
}

#validation {
	padding-top: 50px;
	font-family: @font3;
	img.logo.mobile {
		display: none;
	}
}

/*unsubscribe Form */
#unsub.fbForm {
  display: none;
  position: absolute;
  margin-left: 16%;
  z-index: 1000;
  .other {
    p {
      top: 0px;
      left: 0px;
    }
  }
  p.email{
    margin-top: -10px;
  }
}

.fbForm {
  font-family: @font2;
  background: @white;
  border: 1px solid @grey3;
  .boxShadow(0;0;2px;@grey7);
  width: 588px;
  height: 580px;
  .radius(10px);
  margin-left: 12%;
  z-index: 1000;
  display: none;
  .fbHeader {
    float: left;
    width: 100%;
    height: 45px;
    .topRadius(10px);
    .boxShadow(0;1px;3px;-2px;rgba(0,0,0,0.8));
    background: @grey3;
    border-bottom: 1px solid @grey4;
  }
  .brandLogo {
    position: relative;
    top: 48px;
    height: 101px;
    background: @white;
    margin: 0;
    padding: 0;
    z-index: 1000;
    width: 100%;
    img {
      max-height: 101px;
      max-width: 260px;
      position: absolute;
      margin: auto;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
    }
  }
  form {
    height: 450px;
    float: left;
    margin-bottom: 0px;
    h3 {
      width: 100%px;
      text-align: center;
      font-family: @font2;
      .fontStyle(lighten(@green,5%);20px;600);
      margin-top: 0px;
      margin-bottom: 20px;
      line-height: 24px;
    }
    ul.fbOptions {
      position: relative;
      top: -8px;
      width: 486px;
      margin-bottom: 130px;
      z-index: 1001; 
      li.option {
        padding: 1px 0;
        margin: 0;
        width: 485px;
        button {
          text-align: left;
          font-family: @font1;
          .fontStyle(@grey7;16px;500);
          padding-left: 15px;
          padding-top: 0;
          width: 484px;
          height: 35px;
          border: none;
          .boxShadow(0;0;0;1px;@greenGrey4);
          .gradientWhiteToGrey;
          i {
            margin-top: 3px;
            font-size: 23px;
            margin-right: 8px;
          }
        }
        button:focus {
          outline: none;
        }
        button:hover {
          .boxShadow(0;0;0;1px;@blueGreen);
        }
        button.active {
          .boxShadow(0;0;0;1px;@greenGrey4);
          background: lighten(@blueGreen,5%);
          color: @white;
        }
        .optionBody {
          display: none;
        }
        #commentForm.optionBody {
          display: block;
        }
      }
      li.option:last-child {
        margin-bottom: 0;
        button {
          .bottomRadius(6px);
        }
        button.active {
          .bottomRadius(0);
        }
      }
      li#review.option.active.shift {
        margin: 0 !important;
        margin-bottom: 30px !important;
      }
    }

    /*3 Section/ Option Bodies*/
    #recommendScore {
      height: 190px;
      p {
        height: 76px;
        text-align: center;
        padding: 10px 0;
        margin-top: 0 !important;
        font-size: 24px;
        font-family: @font5;
        position: relative;
        top: 25px;
      }
      p.left {
        top: 30px;
        margin-left: 20px;
        margin-bottom: 7px;
        float: left;
        .fontStyle(@grey6;14px;600);
      }
      p.right {
        top: 30px;
        margin-right: 18px;
        margin-bottom: 7px;
        float: right;
        .fontStyle(@grey6;14px;600);
      }
      p.notLikely, p.veryLikely {
        display: none;
      }
      .selectScore {
        float: left;
        clear: both;
        margin-bottom: 30px;
      }
      p.prompt {
      	top: 6px;
      	padding: 10px 60px;
      }
    }

    p.emailError, p.fbError {
      width: 50%;
      display: none;
      position: absolute; 
      bottom: 30px;
      .fontStyle(@red1;12px;500);
      margin-bottom: 2px;
      line-height: 13px;
    }
    span.email {
      position: absolute;
      bottom: 20px;
      .fontStyle(darken(@grey5,10%);10px;500);
    }

    .btn.important {
      font-family: "Helvetica Neue","Arial",sans-serif;
      float: right;
      position: absolute;
      bottom: 60px;
      right: 13px;
      font-weight: 600;
      font-size: 16px;
      height: 40px;
      padding-top: 7px;
      background: @blueGreen;
      width: 250px;
    }

    .btn.important:hover {
      background: lighten(@blueGreen,10%);
    }
    div#reviewContainer {
      max-width: 442px;
      ul.reviewFaces {
        margin: 0 auto;
      }
    }
  }
  .seal {
    width: 174px;
    position: relative;
    right: -70px;
    margin-top: 17px;
    float: right;
    img {
      height: 27px;
    }
  }
  a.close {
    position: absolute;
    left: 562px;
    top: 5px;
  }
}

.fbForm.active {
  display: block;
}

.fbForm.unsub {
  form.review {
    ul.fbOptions {
      .optionBody {
        display: none;
      }
      #commentForm.optionBody {
        display: none;
      }
      #survey.optionBody {
        display: block;
      }
    }
  }
  .seal {
    margin-top: 68px;
  }
  h4.question {
    margin-top: 7px;
    line-height: 24px;
    .fontStyle(@grey7;14px;500);
    text-align: center;
    font-family: @font5;
  }
  ul.reasons {
    height: 235px;
    padding: 0 40px;
    li.ui-state-default {
      width: 392px;
      height: 29px !important;
      margin: 10px 0;
      padding: 3px 14px;
      background: @bgBlue;
      .boxShadow(1px;1px;1px;rgba(0,0,0,0.4));
      input {
        margin-right: 5px;
        float: left;
        .heightAndWidth(20px;20px);
      }
      p {
        font-family: @font5;
        margin-top: 2px;
        float: left;
        .fontStyle(@white;14px;400);
        .textShadow(1px;1px;1px;rgba(0,0,0,0.2));
        
      }

    }
  }
} 

div.popupHolder {
  position: absolute;
  top: 41px;
  left: 0;
  width: 100%;
}
.validationContainer {
  z-index: 1001;
  position: relative;
  top: 30px;
  margin: auto;
  width: 588px;
  .fbForm {
    background: @newBG;
    margin-left: 0;
    display: none;
    div.headerWrapper {
      p.mainPrompt {
        top: 37px;
      }
    }
    div.headerWrapper.logo {
      p.mainPrompt {
        top: 57px;
      }
    }
    form {
      .btn.important {
        margin-right: 155px;
      }
    }
    form#fbComment {
      position: relative;
      top: -30px;
      width: 486px;
      height: 400px;
      border: 1px solid @greenGrey4;
      border-top: none;
      .bottomRadius;
      background: @white;
      h3.complete {
        padding: 0 10px;
        margin-top: 30px;
        line-height: 30px;
        .fontStyle(@blueGreen;28px;400);
        margin-bottom: 10px;
        font-family: @font5;
      }
      textarea {
        padding: 10px 7px;
        width: 70%;
        min-height: 150px;
        .radius;
        color: darken(@grey5,10%);
        border: 1px solid darken(@grey4,10%);
        .insetShadow(0;0;3px;rgba(0,0,0,0.2));
        margin: 0 15%;
        margin-top: 25px;
        resize: none;
      }
      textarea:focus {
        outline: none !important;
        border: 1px solid @grey5;
        .insetShadow(0;0;3px;rgba(0,0,0,0.3));
      }
      p.email {
        margin-top: 30px;
        margin-left: 74px;
        input[type="email"] {
          width: 225px;
          padding: 7px 10px;
          margin-left: 5px;
          color: darken(@grey5,10%);
          border: 1px solid darken(@grey4,10%);
          .insetShadow(0;0;3px;rgba(0,0,0,0.2));
        }
        input[type="email"]:focus {
          border: 1px solid @grey5;
          .insetShadow(0;0;3px;rgba(0,0,0,0.3));
        }
        input[type="email"].error {
          border: 1px solid @red1;
        }
      }
      .btn.important {
        width: 250px;
          margin-top: 25px;
          margin-right: 103px !important;
          bottom: -75px !important;
      }
        p.emailError {
          right: 50px;
        width: 50%;
        display: none;
        position: absolute;
        bottom: 125px;
        .fontStyle(@red1;12px;500);
        margin-bottom: 2px;
        line-height: 13px;
        }
        span.email {
        position: absolute;
        bottom: 120px;
        .fontStyle(darken(@grey5,10%);10px;500);
        }
      button:focus {
        outline: none;
      }
      button.disabled {
        background: lighten(@blueGreen,15%);
        color: @grey3;
        cursor: default;
      }
    }
    .seal {
      height: 30px;
      position: absolute;
      right: 0;
      bottom: 9px;
      img {
        height: 30px;
      }
    }
  }
}
.validationContainer.nologo {
    .fbForm {
      height: 580px;
      min-height: 580px;
      form {
        height: 420px;
        padding-top: 65px;
        ul.fbOptions {
          .radius;
          li:first-child {
            button {
              .topRadius;
            }
          }
        }
      }
      form#fbComment {
      	top: 29px;
      	padding-top: 10px;
      	border-top: 1px solid #c7dadf;
      	.radius;
      }
    }
}

.validationContainer.active {
  display: block;
  .fbForm {
    display: block;
  }
}
ul.fbOptions {
  position: relative;
  li.option {
    width: 100%;
    button {
      text-align: left;
      font-family: @font1;
      .fontStyle(@grey7;16px;500);
      padding-left: 15px;
      padding-top: 0;
      width: 100%;
      height: 40px;
      border: none;
      .boxShadow(0;0;0;1px;@greenGrey4);
      .gradientWhiteToGrey;
      i {
        margin-top: 3px;
        font-size: 23px;
        margin-right: 8px;
      }
    }
    button:focus {
      outline: none;
    }
    button:hover {
      .boxShadow(0;0;0;1px;@blueGreen);
    }
    button.btn-disabled {
      background: @grey3;
      .boxShadow(0;0;0;1px;@greenGrey4);
      opacity: 0.8;
    }
    .optionBody {
      display: none;
    }
    #commentForm.optionBody {
      display: block;
    }
  }
}
ul.fbOptions.unsub {
  li.option {
    margin: 60px 0 !important;
  }
}

#validation.popup.new {
	position: relative;
	h2.thanks {
		width: 100%;
		position: absolute;
		top: 40px;
		padding-top: 20px;
		padding-bottom: 10px;
		font-size: 22px;
		margin: 0;
		text-align: center;
		background: @greenGrey1;
		border-bottom: 1px solid @blueGreen;
		color: darken(@blueGreen,15%);
	}
	.mainValidationContainer {
		max-width: 1050px;
		margin-top: 80px;
		height: 482px;
		.left {
			float: left;
			.radius(2px);
			background: @white;
			width: 26%;
			height: 100%;
			padding-top: 15px;
			position: relative;
			border: 1px solid @greenGrey4;
			.brandLogo {
				.boxShadow(1px;1px;2px;rgba(0,0,0,0.8));
				margin: 20px 28px;
				padding: 5px;
				min-height: 140px;
				position: relative;
				img {
					max-width: 196px;
					max-height: 130px;
					position: absolute;
					margin: auto;
					top: 0;
					bottom: 0;
					left: 0;
					right: 0;
				}
			}
      ul.fbOptions {
        li.option {
          button {
            width: 90%;
            margin: 0 5%;
          }
        }
      }
			a#giveFeedback {
				font-family: @font5;
				position: absolute;
				bottom: 30px;
				background: @blueGreen;
				font-size: 18px;
				float: left;
				padding: 12px;
				margin: 0 45px;
				color: @white;
				cursor: pointer;
				.textShadow(0;1px;0px;rgba(0,0,0,0.9));
				i {
					margin-left: 5px;
				}
			}
			a#giveFeedback:hover {
				opacity: 0.8;
			}	
			a#giveFeedback.btn-disabled {
				opacity: 0.5;
				cursor: default;
			}
		}
		.left.logo {
			ul.fbOptions {
				li.option {
					margin: 50px 0;
				}
			}
			ul.fbOptions.unsub {
				li.option {
					margin: 60px 0 !important;
				}
			}
		}
		.right {
			.radius(2px);
			background: @white;
			float: left;
			margin-left: 1%;
			width: 73%;
			font-family: @font5;
			border: 1px solid @greenGrey4;
			.headerContainer {
				width: 100%;
				height: 60px;
				border-bottom: 2px solid @blueGreen;
				background: lighten(@blueGreen,5%);
				.topRadius(2px);
				h2 {
					margin: 0;
					position: relative;
					top: 12px;
					left: 30px;
					font-size: 18px;
					color: @white;
				}
				h2.mobile.thanks {
					left: 0;
					display: none;
				}
			}
			.brandInfo {
				padding-left: 30px;
				height: 30px;
				padding-top: 10px;
				a.companyURL {
					float: left;
					color: @grey7;
					font-size: 18px;
				}
				span.activeDate {
					float: right;
					position: relative;
					top: 6px;
					right: 25px;
				}
			}
			ul.reasons {
				margin-top: 25px;
				padding-left: 50px;
				li {
					height: 65px;
					margin-bottom: 25px;
					div.imgHolder {
						float: left;
						padding: 0;
						width: 60px;
						height: 60px;
						background: @white;
						.radius(300px);
						border: 4px solid @blueGreen;
						img {
							width: 80%;
							margin: 10%;
						}
					}
					p {
						font-size: 16px;
						position: relative;
						top: 18px;
						left: 15px;
					}
				}
			}
			div.sealContainer {
				width: 100%;
				height: 95px;
				border-top: 1px solid @greenGrey4;
				padding-top: 15px;
				img.seal {
					float: left;
					width: 160px;
					margin: 0 20px;
				}
				p {
					float: left;
					margin: 0;
					width: 500px;
					padding-right: 5px;
					b {
						color: @grey7;
					}
				}
				p.mobile {
					display: none;
				}
			}
		}
	}
	.mainValidationContainer {
		.left.nologo {
			ul.fbOptions {
				li.option {
					margin: 83px 0;
				}
			}
		}
	}
	.validationFooter {
		margin-top: 90px;
		font-family: @font5;
		p {
			text-align: center;
			width: 60%;
			margin: 0 20%;
			margin-top: 4px;
			margin-bottom: 10px;
			padding-top: 4px;
			font-size: 12px;
			span {
				margin: 0 2px;
				a {
					color: @grey7;
				}
				a:hover {
					color: @grey7;
				}
			}
		}
	}
}
li#sentiment.option{
	max-height: 242px;
	overflow: hidden;
	#commentForm {
		height: 205px;
		position: relative;
		p {
			height: 54px;
			font-family: @font5;
			text-align: center;
			margin-top: 30px;
			margin-left: 30px;
			margin-right: 30px;
			margin-bottom: 20px;
			font-size: 19px;
		}
	}
}
li#ratings.option {
	padding-bottom: 0 !important;
}
ul.reviewFaces {
	margin-left: 20px;
	height: 85px;
	li {
		margin-right: 27px;
		height: 80px;
		float: left;
		a {
			cursor: pointer;
			height: 60px;
			img {
				width: 60px;
			}
		}
		a.hover {
			opacity: 0.9;
		}
		a.select {
			display: none;
		}
		p {
			line-height: 16px;
			display: none;
			width: 60px !important;
			margin: 0 !important;
			margin-top: 3px !important;
			text-align: center;
			.fontStyle(@grey6;14px;600) !important;
		}
	}
	li:last-child {
		margin-right: 0;
	}
	li.active {
		a{
			display: none;
		}
		a.select {
			display: block;
		}
		p {
			display: block;
		}
	}
}
ul.reviewFaces.selected {
	li {
		a {
			opacity: 0.5;
		}
		a.hover {
			opacity: 0.9;
		}
	}
	li.active {
		a {
			opacity: 1;
		}
	}
}

.fbForm {
	font-family: @font2;
	background: @white;
	border: 1px solid @grey3;
	.boxShadow(0;0;2px;@grey7);
	width: 588px;
	min-height: 640px;
	.radius(10px);
	position: relative;
	margin-left: 12%;
	display: none;
	z-index: 1000;
	p.mainPrompt {
		font-family: @font5;
		.fontStyle(@grey7;20px;400) !important;
		text-align: center;
		margin-bottom: 20px;
		position: relative;
		top: 57px;
		margin-top: 15px;
	}
	p.prompt {
		font-family: @font5;
		.fontStyle(@grey7;19px;400) !important;
		text-align: center;
		margin-bottom: 20px;
	}
	.fbHeader {
		float: left;
		width: 100%;
		height: 50px;
		.topRadius(10px);
		.boxShadow(0;1px;3px;-2px;rgba(0,0,0,0.8));
		background: @grey3;
		border-bottom: 1px solid @grey4;
	}
	.seal {
		width: 174px;
		margin-top: 30px;
		float: right;
		img {
			height: 30px;
		}
	}

	form {
		margin-top: 0;
		height: 83%;
		float: left;
		margin-bottom: 0px;

		h3 {
			width: 100%px;
			text-align: center;
			font-family: @font2;
			.fontStyle(lighten(@green,5%);20px;600);
			margin-top: 0px;
			margin-bottom: 20px;
			line-height: 24px;
		}

		ul.fbOptions {
			margin-bottom: 130px;
			li.option {
				button {
					z-index: 1001;
					text-align: left;
					font-family: @font1;
					.fontStyle(@grey7;16px;500);
					padding-left: 15px;
					height: 35px;

					i {
						margin-top: 3px;
						font-size: 23px;
						margin-right: 8px;
					}
				}
				button:focus {
					outline: none;
				}
				button.active {
					color: @white;
				}
				.optionBody {
					display: none;
				}
			}
		}	
		
		.btn.important {
			font-family: "Helvetica Neue","Arial",sans-serif;
			float: right;
			position: absolute;
			bottom: 60px;
			right: 15px;
			margin-top: 20px;
			height: 37px;
			padding-top: 7px;
		}
		
	}/*End Form */
	
	a.close {
		position: absolute;
		left: 562px;
		top: 5px;
	}
}

.fbForm {
  .radius;
  padding: 15px 50px;
  height: 680px;
  display: block;
  .headerWrapper {
    border: 1px solid @greenGrey4;
    .topRadius(10px);
    border-bottom: none;
    height: 160px;
    background: @white;
    .fbHeader {
      background: lighten(@blueGreen,5%);
      border-bottom: 1px solid @greenGrey4;
      .noBoxShadow;
      .topRadius(8px);
      height: 45px;
    }
  }
  ul.fbOptions {
    .bottomRadius;
    border: 1px solid @greenGrey4;
    border-top: none;
    background: @white;
  }
}
body.login {
  background: @greenDarkNew;
  height: 100%;
  min-height: 790px;
  div.logoStatic {
    position: relative;
    padding-top: 50px;
    max-width: 1000px;
    z-index: 1001;
    width: 30%;
    margin: 0 35%;
    a {
      width: 100%;
      display: block;
    }
    img {
      width: 100%;
    }
    p {
      margin-top: 15px;
      font-family: @font6;
      color: rgba(255,255,255,0.75);
      font-weight: 300;
      text-align: center;
      font-size: 24px;
      span {
        color: rgba(255,255,255,0.85);
        font-weight: 400;
        font-family: @font1;
      }
    }
    p.prompt.small {
      margin-top: 2px;
      font-size: 20px;
    }
    div.horizontalDiv {
      display: none;
      width: 62%;
      height: 0;
      margin: 0 19%;
      border-top: 3px solid rgba(255,255,255,0.25);
    }
    div.horizontalDiv.active {
      display: block;
    }
  }
  div.wrapper {
    max-height: 502px;
    padding-bottom: 20px;
    position: relative;
    background: rgba(0,0,0,0.3);
  }
  #login {
    position: relative;
    .radius();
    width: 420px;
    padding: 0;
    p {
      font-family: @font5;
      margin-top: 25px;
      margin-left: 30px;
      margin-right: 30px;
      color: rgba(255,255,255,0.8);
    }
    h2 {
      margin-left: 30px;
      font-size: 36px;
      color: rgba(255,255,255,0.9); 
    }
    h3 {
      margin-left: 30px;
      font-size: 24px;
      color: rgba(255,255,255,0.9);
    }
    a.btn.important {
      background: @brightBlueNew;
      font-family: @font5;
      padding: 15px 30px;
      font-size: 16px;
      font-weight: 600;
      .textShadow(1px;1px;0px;rgba(0,0,0,0.2));
      .insetDrop(0;-3px;0;0;rgba(0,0,0,0.3);0;2px;3px;-1px;rgba(0,0,0,0.2));
    }
    a.btn.important:hover {
      background: lighten(@brightBlueNew,8%);
    }
    form {
      float: left;
      position: relative;
      margin-left: 30px;
      width: 360px;
      margin-bottom: 30px;
      .control-label {
        text-align: left;
      }
      label {
        font-family: @font5;
        color: rgba(255,255,255,0.8);
        margin-top: 8px;
      }
      input[type="text"], input[type="password"], input[type="email"] {
        height: 40px;
        width: 360px;
        font-size: 14px;
        .insetShadow(0;0;3px;rgba(0,0,0,0.3));
        font-weight: 400;
      }
      div.remember {
        margin-top: 20px; 
        height: 20px;
        p {
          font-family: @font5;
          float:left;
          margin: 0;
          margin-right: 10px;
          color: @grey2;
          padding-right: 10px;
          input {
            position: relative;
            top: -2px;
            margin-right: 5px;
          }
          a {
            color: @grey2;
            font-weight: 400;
          }
          a:hover {
            color: @grey3;
            text-decoration: underline;
          }
        }
        p:first-child {
          border-right: 1px solid darken(@grey3,4%);
        }
      }
      .buttonHolder {
        margin-top: 30px;
        input.btn.important {
          background: @brightBlueNew;
          font-family: @font5;
          padding: 15px 30px;
          font-size: 16px;
          font-weight: 600;
          .textShadow(1px;1px;0px;rgba(0,0,0,0.2));
          .insetDrop(0;-3px;0;0;rgba(0,0,0,0.3);0;2px;3px;-1px;rgba(0,0,0,0.2));
        }
        input.btn.important:hover {
          background: lighten(@brightBlueNew,8%);
        }
      }
      div.error {
        width: 100%;
        padding: 14px 20px;
        margin-top: 6px;
        margin-bottom: 4px;
        .radius;
        p {
          font-family: @font5;
          margin: 0;
          color: rgba(255,255,255,0.9);
          font-weight: 600;
          a {
          color: rgba(255,255,255,0.9);
            text-decoration: underline;
            font-weight: 700;
          }
          a:hover {
            color: @grey3;
          }
        }
      }
    }
    p.inactive {
    	a {
    		color: rgba(255,255,255,0.9);
    		text-decoration: underline;
    	}
    	a:hover {
    		color: @white;
    	}
    }
  }
  #login.resetConfirm {
    width: 700px;
    div#pwReqs {
      float: left;
      width: 40%;
      margin-top: 84px;
      padding: 0 10%;
      font-family: @font5;
      h4 {
        font-family: @font5;
        .fontStyle(rgba(255,255,255,0.9);14px;600);
      }
      ul.pwReqs {
        margin-left: 10px;
        li {
          .fontStyle(@grey2;12px;400);
        }
      }
    }
    .control-group {
      .control-label {
        label {
          float: left;
        }
        i.fa-check-circle {
          float: left;
          position: relative;
          top: 6px;
          left: 5px;
          color: @buttonGreen;
          font-size: 20px;
        }
      }
      .controls {
        input.valid {
          border: 1px solid @buttonGreen;
        }
      }
    }
    form {
      float: left;
      p {
        margin-left: 0;
      }
    }
    h1 {
      width: 100%;
      text-align: center;
      font-family: @font5;
      color: @white;
      font-size: 18px;
    }
    h3 {
      font-size: 14px;
      padding: 0 20%;
    }
  }
  #login.logout, #login.resetDone {
    padding: 40px;
    height: 200px;
    font-family: @font5;
    p {
      color: rgba(255,255,255,0.9);
      margin-top: 15px;
      font-size: 20px;
    }
  }
  footer.main.big {
    border-top: 1px solid rgba(255,255,255,0.3);
      .insetShadow(0;2px;3px;rgba(255,255,255,0.1));

    .container {
      ul.social {
        right: -455px;
      }
    }
  }
}

.fbForm.active {
	display: block;
}


/*3 Section/ Option Bodies*/
#recommendScore {
	height: 160px;
	p {
		text-align: center;
		margin-top: 30px;
		margin-bottom: 20px;
		font-size: 16px;
	}
	p.left {
		margin-top: 2px;
		margin-left: 25px;
		margin-bottom: 7px;
		float: left;
		.fontStyle(@grey6;14px;600);
	}
	p.right {
		margin-top: 2px;
		margin-right: 25px;
		margin-bottom: 7px;
		float: right;
		.fontStyle(@grey6;14px;600);
	}
	.selectScore {
		float: left;
		clear: both;
		margin-top: 15px;
		margin-bottom: 30px;
	}
}

#fbMetrics {
	margin: 10px 0;
	padding: 0 10px;
	p.prompt {
		margin-top: 5px;
		margin-bottom: 8px;
	}	
	li, div.rating {
		padding-left: 60px;
		.heightAndWidth(54px;100%);
		padding-bottom: 10px;
		border-bottom: 1px solid @grey3;
		label {
			float: left;
			width: 100px;
			margin-top: 16px;
			margin-bottom: 0px;
			.fontStyle(@grey6;16px;600);
		}
		.rateit {
			float: left;
			position: relative;
			top: 7px;
		}
		.value {
			text-align: left;
			width: 120px;
			top: 22px;
			left: 5px;
			position: relative;
			float: left;
			.fontStyle(@grey6;14px;600);
			line-height: 10px;
		}
	}
	li:last-child {
		border-bottom: none;
	}
}

/*Rateit Stars */
div.rateit {
	div.rateit-range{
		background: url('@{base}images/stars.png');
	}
	div.rateit-selected{
		background: url('@{base}images/stars.png') left -34px;

	}
	div.rateit-hover{
		background: url('@{base}images/stars.png') left -34px;
	}
	div.rateit-reset {
		background: none;
		position: absolute;
		left: -34px;
		height: 34px;
		width: 34px;
		z-index: 1000;
	}
}





/*Net Promoter Score thing*/
#selectContainer {
	max-width: 519px;
	padding: 0;
	.selectScore {
		margin-left: 2px;
		margin-top: -92px !important;
		.heightAndWidth(35px;100%) !important;
		li, div {
			cursor: pointer;
			text-align: center;
			.fontStyle(@grey6;14px;600);
			float: left;
			width: 7%;
			height: 34px;
			padding-top: 5px;
			margin: 5px 1%;
			.radius(5px);
			background: @grey2;
			border: 1px solid @grey5; 
		}
		li:last-child {
			margin-right: 0;
		}
		li:hover, div:hover {
			background: @blueGreen;
			color: @white;
		}
		li.selected, div.selected {
			background: @blueGreen;
			color: @white;
		}
	}
}


i.smileDark, i.smileLight {
  position: relative;
  top: -1px;
  left: -1px;
  height: 23px;
  width: 23px;
  img {
    width: 23px;
  }
}


i.smileLight {
	display: none;
}

button.active {
	i.smileDark {
		display: none;
	}
	i.smileLight {
		display: inline;
	}
}

/*PopUp Styles*/
body.popUp {
	background-image: url("@{base}images/promptBG.png");
	background-color: lighten(@blueGrey2,3%);
	.popUp{
		border: 1px solid @grey5;
		.radius;
		background: @white;
		position: relative;
		margin: 32px auto;
		height: 446px;
		width: 535px;
		.brandLogo {
			float: left;
			position: relative;
			top: 20px;
			left: 20px;
			width: 95px;
			height: 95px;
			border: 1px solid @grey5;
			z-index: 999;
			img {
				width: 93px;
			}
		}
		.svInfo {
			height: 50px;
			float: left;
			margin-top: 25px;
			margin-left: 32px;
			border-left: 2px solid @grey3;
			h3 {
				margin-top: 18px;
				margin-bottom: 0;
				margin-left: 6px;
				font-size: 18px;
				font-weight: 700;
				color: @blueGreen;
			}
			button {
				height: 32px;
				width: 39px;
				position: absolute;
				top: 15px;
				right: 15px;
				background: @white;
				border: 1px solid @grey3;
				i {
					margin-top: 1px;
					font-size: 16px;
					color: @grey5;
				}
			}
			button:hover {
				border: 1px solid darken(@grey3,3%);
				.boxShadow(0;1px;1px;rgba(0,0,0,0.15));
			}
		}
		.brandInfo {
			position: relative;
			top: 80px;
			width: 100%;
			height: 48px;
			background: @newBlueLight;
			p.brandSite {
				float: left;
				position: absolute;
				left: 140px;
				top: 14px;
				.fontStyle(@bgBlue;16px;400);
			}
			span.ratedDate {
				position: absolute;
				right: 20px;
				top: 17px;
				float: right;
				.fontStyle(@bgBlue;14px;400);

			}
		}
		ul.keyPoints {
			width: 480px;
			height: 120px;
			clear: left;
			position: relative;
			margin-right: 0;
			top: 55px;
			left: 50px;
			li {
				font-family: @font3;
				.fontStyle(#555555;16px;500);
				padding: 5px;
				p {
					margin-bottom: 0px;
				}
				i.check {
					float: left;
					display: block;
					height: 30px;
					width: 20px;
					position: relative;
					top: 6px;
					margin-right: 7px;	
					background: url('@{base}images/check.png') no-repeat;
				}
			}
		}
		div.about {
			width: 96%;
			margin-left: 2%;
			margin-top: 82px;
			border-top: 1px solid @grey3;
			padding-top: 10px;
			.seal {
				height: 82px;
				border-right: 1px solid @grey3;
				float: left;
				margin-top: 7px;
				width: 159px;
				img {
					margin-top: 10px;
					width: 150px;
				}
			}
			p.aboutPrompt {
				margin-top: -1px;
				margin-left: 12px !important;
				width: 332px;
				float: left;
				font-size: 14px !important;
				font-family: @font3;
				b {
					display: inline;
					color: @blueGreen !important;
					font-size: 14px !important;
				}
			}
		}
		div.popUpFooter {
			width: 96%;
			margin-left: 2%;
			margin-top: 105px;
			border-top: 1px solid @grey3;
			padding-top: 6px;
			a {
				float: left;
				margin: 0 10px;
				.fontStyle(@grey5;12px;400);
			}
			a:hover {
				color: @grey5;
				text-decoration: underline; 
			}
			p.powered {
				float: right;
				margin: 0 !important;
				margin-top: -1px !important;
				margin-right: 6px !important;
				.fontStyle(darken(@grey5,10%);10px;300) !important;
				span.sv {
					font-family: @font1;
					.fontStyle(@grey7;12px;700);
					b {
						.fontStyle(@blueGreen;12px;500);
					}
				}
			}
		}
	}
}

#editSeal {
	p.reviews {
		position: relative;
		top: -2px;
	}
	h3 {
		.fontStyle(@blueGrey5;20px;600);
	}
	h3.header {
		margin-top: 3px;
		height: 80px;
		padding-bottom: 3px;
		border-bottom: 2px solid lighten(@blueGrey5,30%);
		width: 100%;
		a.seal {
			float: left;
			position: relative;
			top: 10px;
			left: 30px;
			display: block;
			.heightAndWidth(68px;159px);
			img {
				width: 159px;
			}
		}

		p.prompt {
			width: 70%;
			float: left;
			margin-left: 50px;
			margin-top: 15px;
			.fontStyle(@grey6;14px;400) !important;
		}	
	}
	.edit {
		height: 30px;
		display: none;
		width: 60px;
		float: right;
		margin-top: -3px;
		margin-right: 35px;
		background: @blueLight;
	}
	#Signup.edit {
		display: block;
	}
	background: @white;
	padding: 0 15px;
	min-height: 650px;
	margin-bottom: 10px;
	a.close {
		opacity: 0.6;
		margin-right: 37px;
		i.exit {
			display: block;
			.heightAndWidth(25px;25px);
			background: url('@{base}images/exits.png');
		}

	}
	a.close:hover {
		opacity: 1;
		i.exit {
			background-position: 0 -25px;
		}
	}
	.editHeader {
		margin-left: -15px;
		margin-right: -15px;
		height: 60px;
		padding-top: 15px;
		.gradientOffGreyBlue;
		.boxShadow(0;1px;1px;-1px;@bgBlue);
		h2 {
			margin-top: -5px;
			padding-left: 15px;
			.fontStyle(darken(@bgBlue,5%);24px;400) !important;
			.textShadow(0;0;2px;@white);
		}
	}

	#options {
		position: relative;
		height: 110px;
		clear: both;
		border-bottom: 2px solid @grey3;
		
		a.seal {
			display: block;
			position: absolute;
			bottom: 30px;
			left: 20px;
			.heightAndWidth(68px;159px);
			img {
				width: 159px;
			}
		}
		p.prompt {
			display: block;
			position: absolute;
			left: 33px;
			bottom: 10px; 
			.fontStyle(@grey7;14px;500) !important;
		}
		p.desc {
			margin-top: 30px;
			float: right;
			width: 72%;
			.fontStyle(@grey6;14px;500) !important;
		}
	}

	.setupContent {
		display: none;
	}

	ul.keyPoints {
		.noBoxShadow;
		clear: left;
		li {
			.fontStyle(#555555;14px;500);
			padding: 5px;
			p {
				margin-bottom: 0px;
			}
			i.check {
				float: left;
				display: block;
				height: 30px;
				width: 20px;
				position: relative;
				top: 6px;
				margin-right: 7px;	
				background: url('@{base}images/check.png') no-repeat;
			}
		}
	}

	#categories.setupContent {
		display: block;
		#setup.designOption {
			float: left;
			width: 450px;
		}
		#feedbackPreview {
			float: left;
			width: 450px;
			h3 {
				.fontStyle(@blueGrey5;20px;500);
			}
			.fbForm {
				left: -5px;
				margin-top: -60px;
				height: 640px;
				a.close {
					left: 425px;
				}
				position: relative;
				margin-left: 15px;
				width: 450px;
				display: block;
				form {
					margin-top: 0;
					#recommendScore {
						height: 160px;
					}
					.selectScore {
						position: relative;
						top: 35px;
						width: 365px;
						li {
							padding-top: 2px;
							width: 26px;
							height: 26px;
							margin: 4px 3px;
						}
					}
					p.left {
						margin-left: 0px;
					}
					p.right {
						margin-right: 0px;
					}
				}
				ul.fbOptions {
					margin-top: 40px;
					width: 402px;
					li.option {
						width: 395px;
						button {
							width: 390px;
						}
						#fbMetrics {
							li {
								position: relative;
								label {
									margin-top: 8px;
								}
								.rateit {
									top: 2px;
									position: absolute;
								}
								.value {
									position: absolute;
									top: 19px;
									left: 135px;
								}
							}
						}
						ul.reviewFaces {
							li {
								margin-right: 24px;
								img {
									width: 50px;
								}
							}
						}
					}

				}

			}
		}
	}

	#design.setupContent {
		label {
			width: 200px;
		}
	}

	#preview.setupContent {
		.previewBox {
			padding-left: 0px;
			padding-top: 5px;
			height: 355px;
			width: 440px;
			margin-left: 25px;
			background: url('@{base}images/widgetOutline1.png');
		}
	}

	.designOption {
		margin-bottom: 15px;



		h3 {
			.fontStyle(@blueGrey5;20px;500);
			margin-bottom: 15px;
		}

		h3.click {
			margin-top: 0px;
			width: 160px;
			float: left;
		}

		h3.preview {
			margin-left: 25px;
		}

		p.prompt {
			clear: both;
			margin-left: 40px;
			margin-right: 60px !important;
			.fontStyle(@grey6;14px;500) !important;
		}

		select {
			width: 200px;
			font-size: 20px;
		}

		div.option {
			width: 100%;
			min-height: 50px;
			margin-bottom: 15px;
			label.option {
				width: 200px !important;
				margin-left: 30px;
				float: left;
				.fontStyle(@blueGrey5;16px;500);
			}


			p.rb {
				clear: both;
				margin-left: 40px;
				.fontStyle(@grey6;12px;500) !important;
				input {
					margin-right: 7px;
				}
			}

			p.rb.inactive {
				opacity: 0.5;
			}

			.fbDisplayOptions {
				padding-left: 20px;
				opacity: 0.5;
			}

			.fbDisplayOptions.active {
				opacity: 1;
			}

			.ui-switchbutton {
				margin-left: 15px;

				.ui-switchbutton-handle {
					height: 20px;
					width: 40px;

				}


				span {
					position: relative;
					top: -3px;
					font-size: 12px;
				}
			}

			.category {
				padding-top: 10px;
				padding-left: 20px;
			}

			div.header{
				clear: both;
				width: 360px;
				height: 37px !important;
				font-family: @font1;
				.fontStyle(@grey7;16px;500);
				border: 1px solid @grey6;
				background: @grey3;
				.position {
					float: left;
					height: 35px;
					width: 35px;
					margin-right: 10px;
					border-right: 1px solid @grey6;
					background: @white;
					span {
						margin: 8px 10px;
					}
				}
				p {
					margin: 2px 7px !important;
					i {
						margin-top: 3px;
						font-size: 23px;
						margin-right: 8px;
					}
					a.show {
						float: right;
						color: @grey7;
						i.icon-plus-sign {
							display: none;
						}
					}
					a.show:hover {
						text-decoration: none;
					}
				}
			}


			li.disabled {
				opacity: 0.5;
			}

			ul.fbOptions {
				float: left;
				clear: both;
				margin-left: 30px;
				width: 475px;
				li.option {
					margin: 15px 20px;
					input {
						position: relative;
						left: 415px;
						top: -30px;

					}

					#fbMetrics {
						width: 400px;
						label {
							font-size: 11px;
						}
					}

				}
			}

			.selectScore {
				margin-top: 15px;
			}

			.reviewOptions {
				margin-top: 5px;
				margin-left: 15px;
				p {
					float: left;
					.fontStyle(@grey6;14px;600) !important;
				}
			}

			.subcategory {
				padding: 15px 40px;
				min-height: 100px;
				ul.subcategories {
					margin-left: 30px;
					padding: 3px;
					li {
						.fontStyle(@grey7;14px;500);
						a {
							font-weight: 600;
							i {
								margin-right: 4px;
								margin-top: 1px;
							}
							i.smileDark {
								height: 23px;
								width: 23px;
								display: block;
								img {
									width: 23px;
								}
							}
						}
						a:hover {
							text-decoration: none;
						}
					}
				}
			}
		}

		.option {
			float: left;
		}
		#fbOptions.option {
			margin-bottom: 60px;
		}
		#referral.option {
			position: relative;
			top: -40px;
		}
	}

	.bottomNav {
		position: absolute;
		left: -15px;
	}

}

/*Load Key Points Font */

#editSeal.signup {
	.editHeader {
		margin-bottom: 0px;
	}
	.setupContent {
		display: block;
	}
	#design {
		width: 400px;
		float: left;
	}
	#preview {
		width: 530px;
		float: left;
		padding-left: 15px;
		p {
			width: 65%;
			.fontStyle(@grey7;14px;500);
		}
			
	}
	ul.sealFormat {
		width: 100%;
		li {
			float: left;
			width: 20%;
			.seal {
				width: 130px;
				img {
					width: 130px;
				} 
			}
		}
	}
	ul.sealOptions {
		width: 100%;
		float: left;
		height: 300px;
		padding-top: 30px;
		li.sealOption {
			float: left;
			width: 50%;
			position: relative;
			h3 {
				font-size: 16px;
			}
		}
		li {
			float: left;
			width: 50%;
			p {
				margin-top: 135px;
				font-family: @font5;
				.fontStyle(@grey7;20px;400) !important;

			}
		}
		li.seal1 {
			height: 400px;
			a.seal1 {
				position: absolute;
				top: 370px;
				margin-left: 110px;
				width: 130px;
				img {
					width: 130px;
				}
			}
			.widget2 {
				width: 375px;
				height: 325px;
				position: relative;
				.brandLogo {
					display: none;
					float: left;
					position: relative;
					top: 10px;
					left: 10px;
					width: 65px;
					height: 65px;
					border: 1px solid @grey5;
					z-index: 999;
					img {
						width: 63px;
					}
				}
				.svInfo {
					position: relative;
					display: none;
					height: 30px;
					float: left;
					margin-top: 16px;
					margin-left: 20px;
					border-left: 2px solid @grey3;
					h3 {
						margin-top: 5px;
						margin-bottom: 0;
						margin-left: 6px;
						font-size: 16px;
						font-weight: 700;
						color: @blueGreen;
					}
					button {
						position: absolute;
						top: -7px;
						right: -50px;
						background: @white;
						border: 1px solid @grey3;
						i {
							margin-top: 1px;
							font-size: 16px;
							color: @grey5;
						}
					}
					button:hover {
						border: 1px solid darken(@grey3,3%);
						.boxShadow(0;1px;1px;rgba(0,0,0,0.15));
					}
				}
				.brandInfo {
					display: none;
					position: relative;
					top: 50px;
					width: 100%;
					height: 38px;
					background: @newBlueLight;
					p.brandSite {
						float: left;
						position: absolute;
						left: 88px;
						top: 9px;
						.fontStyle(@bgBlue;14px;400) !important;
					}
					span.ratedDate {
						position: absolute;
						right: 20px;
						top: 12px;
						float: right;
						.fontStyle(@bgBlue;12px;400);

					}
				}
				ul.keyPoints {
					display: none;
					width: 355px;
					height: 80px;
					clear: left;
					position: relative;
					margin-right: 0;
					top: 28px;
					left: 10px;
					li {
						font-family: @font3;
						padding: 5px;
						p {
							.fontStyle(#555555;14px;500) !important;
							margin-bottom: 0px;
							margin-right: 0 !important;
						}
						i.check {
							float: left;
							display: block;
							height: 30px;
							width: 20px;
							position: relative;
							top: 1px;
							margin-right: 7px;	
							background: url('@{base}images/check.png') no-repeat;
						}
					}
				}
				div.about {
					width: 96%;
					margin-left: 2%;
					margin-top: 70px;
					padding-top: 10px;
					font-family: @font3;
					.seal {
						position: absolute;
						top: 167px;
						left: 8px;
						height: 61px;
						float: left;
						margin-top: 1px;
						width: 140px;
						margin-right: 5px;
						img {
							margin-top: 4px;
							width: 135px;
						}
					}
					p.aboutPrompt {
						display: none;
						width: 205px;
						float: left;
						margin-top: 4px !important;
						margin-left: 4px !important;
						margin-right: 0 !important;
						margin-bottom: 0 !important;
						font-size: 12px !important;
						b {
							display: inline;
							color: @blueGreen !important;
							font-size: 14px !important;
						}
					}
				}
				div.about.right {
					p.aboutPrompt {
						width: 205px;
						float: left;
						margin-left: 2px !important;
						font-size: 12px !important;
					}
					.seal {
						cursor: pointer;
						position: absolute;
						left: 215px;
						float: left;
						margin-left: 3px;
						border-right: none;
						img {
							float: right;
							width: 135px;
						}
					}
				}
				div.popUpFooter {
					display: none;
					width: 96%;
					margin-left: 2%;
					margin-top: 72px;
					border-top: 1px solid @grey3;
					padding-top: 5px;
					a {
						float: left;
						margin: 0 5px;
						.fontStyle(@grey5;10px;400);
					}
					a:hover {
						color: @grey5;
						text-decoration: underline; 
					}
					p.powered {
						float: right;
						margin: 0 !important;
						margin-top: -2px !important;
						margin-right: 6px !important;
						.fontStyle(darken(@grey5,10%);10px;300) !important;
						span.sv {
							font-family: @font1;
							.fontStyle(@grey7;12px;700);
							b {
								.fontStyle(@blueGreen;12px;500);
							}
						}
					}
				}			
			}

			.widget2.active {
				.boxShadow(0;0;2px;rgba(0,0,0,0.3));
				border: 1px solid @grey5;
				.brandLogo {
					display: block;
				}
				.svInfo {
					display: block;
				}
				.brandInfo {
					display: block;
				}
				ul.keyPoints {
					display: block;
					li {
						font-family: @font3;
						padding: 5px;
						p {
							.fontStyle(#555555;14px;500) !important;
							margin-bottom: 0px;
							margin-right: 0 !important;
						}
						i.check {
							float: left;
							display: block;
							height: 30px;
							width: 20px;
							position: relative;
							top: 1px;
							margin-right: 7px;	
							background: url('@{base}images/check.png') no-repeat;
						}
					}
				}
				div.about {
					display: block;
					width: 96%;
					margin-left: 2%;
					margin-top: 70px;
					border-top: 1px solid @grey3;
					padding-top: 10px;
					font-family: @font3;
					.seal {
						position: relative;
						top: 0;
						left: 0;
						border-right: 1px solid @grey3;
						img {
							margin-top: 4px;
							width: 135px;
						}
					}
					p.aboutPrompt {
						display: block;
					}
				}
				div.about.right {
					p.aboutPrompt {
						width: 205px;
						float: left;
						margin-left: 2px !important;
						font-size: 12px !important;
					}
					.seal {
						cursor: default;
						float: left;
						margin-left: 3px;
						border-right: none;
						border-left: 1px solid @grey3;
						img {
							float: right;
							width: 135px;
						}
					}
				}
				div.popUpFooter {
					display: block;
					width: 96%;
					margin-left: 2%;
					margin-top: 72px;
					border-top: 1px solid @grey3;
					padding-top: 5px;
					a {
						float: left;
						margin: 0 5px;
						.fontStyle(@grey5;10px;400);
					}
					a:hover {
						color: @grey5;
						text-decoration: underline; 
					}
					p.powered {
						float: right;
						margin: 0 !important;
						margin-top: -2px !important;
						margin-right: 6px !important;
						.fontStyle(darken(@grey5,10%);10px;300) !important;
						span.sv {
							font-family: @font1;
							.fontStyle(@grey7;12px;700);
							b {
								.fontStyle(@blueGreen;12px;500);
							}
						}
					}
				}			
			}
			
			.widget {
				display: block;
				height: 245px;
				width: 380px;
				border: 1px solid @grey4;
				position: relative;
				.widgetHeader {
					height: 36px;
					width: 100%;
					background: @grey3;
					position: relative;
					.brandLogo {
						position: relative;
						top: 7px;
						left: 15px;
						width: 65px;
						height: 65px;
						border: 1px solid @grey5;
						img {
							width: 63px;
						}
					}
					button.closeWidget {
						position: absolute;
						float: right;
						top: 2px;
						right: 2px;
						.gradientOffWhiteToGrey;
						opacity: 0.5;
						i {
							position: relative;
							top: 1px;
							font-size: 16px;
						}
					}
				}
				.widgetInfo {
					float: right;
					margin-right: 10px;
					width: 255px;
					height: 35px;
					border-bottom: 1px solid @grey4;
					.brandInfo {
						width: 120px;
						float: left;
						p.brandSite {
							font-family: @font3;
							margin: 0 !important;
							.fontStyle(darken(@grey5,10%);14px;600) !important;
						}
						span.ratedDate {
							position: relative;
							top: -7px;
							font-size: 12px;
							i {
								position: relative;
								top: -4px;
								left: 2px;
								color: @blueDark;
								font-size: 20px;
							}
						}
					}
					.seal {
						float: right;
						width: 115px;
						left: -10px;
						position: relative;
						top: -8px;
						img {
							width: 115px;
						}
					}
				} 

				ul.keyPoints {
					width: 100%;
					position: relative;
					top: 12px;
					padding: 0 12px;
					li {
						padding: 3px;
						width: 100%;
						float: left;
						position: relative;
						p {
							font-family: @font3;
							color: @bgBlue !important;
							position: relative;
							margin-top: 1px;
							margin-right: 0 !important;
							font-size: 13px !important;
							i.check {
								position: relative;
								top: 1px;
								height: 20px;
							}
						}
					}
				}
				.widgetFooter {
					width: 96%;
					height: 30px;
					position: absolute;
					bottom: 0px;
					margin-left: 2%;
					border-top: 1px solid @grey3;
					a {
						float: left;
						margin-top: 6px;
						.fontStyle(darken(@grey5,10%);10px;300);
					}
					a.learn {
						margin-left: 2px;
					}
					a.verify {
						margin-left: 20px;
						float: left;
					}
					a:hover {
						color: darken(@grey5,10%);
						text-decoration: underline;
					}
					p.powered {
						float: right;
						margin: 0 !important;
						margin-top: 5px !important;
						margin-right: 6px !important;
						.fontStyle(darken(@grey5,10%);10px;300) !important;
						span.sv {
							font-family: @font1;
							.fontStyle(@grey7;12px;700);
							b {
								.fontStyle(@blueGreen;12px;500);
							}
						}
					}
				}
			}
		}
		#smallSeal.seal1{
			height: 400px;
			img {
				margin-left: 45px;
			}
			a.seal1.small {
				position: absolute;
				top: 340px;
				margin-left: 0px;
				width: 130px;
				img {
					width: 130px;
				}
			}
			.widget2.small {
				display: none;
				width: 330px;
				height: 300px;
				.svInfo {
					h3 {
						width: 150px;
						font-size: 14px;
						line-height: 17px;
						margin-top: -3px;
					}
					button {
						right: -75px;
					}
				}
				.brandInfo {
					span.ratedDate {
						right: 4px;
					}
				}
				ul.keyPoints {
					width: 315px;
					display: block;
					top: 34px;
					li {
						p {
							font-size: 12px !important;
							i {
								height: 20px !important;
							}
						}
					}
				}
				div.about {
					display: block;
					p.aboutPrompt {
						margin-top: -1px !important;
						width: 100% !important;
						b {
							display: inline !important;
						}
					}
				}
				div.popUpFooter {
					display: block;
					margin-top: 46px;
					p.powered {
						margin-right: 1px !important;
						margin-top: 1px !important;
						font-size: 9px !important;
						span {
							b {
								font-size: 10px !important;
							}
							font-size: 10px !important;
						}
					}
				}
			}
			.widget2.small.active {
				display: block;
			}
		}
		li.seal2 {
			clear: both;
			height: 70px;
			a.seal2 {
				position: absolute;
				top: 25px;
				margin-left: 110px;
				width: 80px;
				img {
					width: 130px;
				}
			}
		}	
		li.seal3 {
			p.prompt {
				width: 100%;
				margin: 0;
				text-align: center;
			}
			a.seal {
				position: relative;
				top: 165px;
				margin-left: 110px;
				width: 80px;
				img {
					width: 130px;

				}
			}
		}
	}
	div.validationPreview {
		width: 50%;
		float: left;
		#topBar {
			position: relative;
			top: -8px;
			left: -10px;
			border: none;
			background: none;
			.noBoxShadow;
			h2 {
				font-family: @font1;
				color: @grey6;
			}

			.content {
				.boxShadow(1px,1px,1px,@grey3);
				margin: 20px 10px;
				padding: 5px 25px;
				.radius;
				border: 1px solid @grey5;
				height: 720px;
			}
			.section {
				margin-bottom: 30px;
			}
			#msgs {
				ul.msgFreq {
					li {
						p {
							width: 70px;
						}
					}
				}
			}
		}	
	}
}


#unsub.fbForm {
	position: relative;
	top: -2px;
	margin-left: 40px;
	font-family: @font2;
	background: @white;
	border: 1px solid @grey3;
	.boxShadow(0;0;2px;@grey7);
	.heightAndWidth(670px;460px);
	.radius(10px);
	z-index: 4;
	display: block;
	.fbHeader {
		float: left;
		width: 100%;
		height: 60px;
		.topRadius(10px);
		.boxShadow(0;1px;3px;-2px;rgba(0,0,0,0.8));
		background: @grey3;
		border-bottom: 1px solid @grey4;
	}
	.seal {
		width: 174px;
		margin-top: 30px;
		margin-right: 7px;
		float: right;
		img {
			height: 30px;
		}
	}
	
	form {
		margin-top: 30px !important;
		padding: 23px;
		float: left;
		margin-bottom: 0px;
		position: relative;

		h4.question {
			margin-top: 7px;
			margin-left: 10px;
			line-height: 24px;
			.fontStyle(@grey7;14px;500);
		}

		ul.reasons {
			height: 300px;
			border-top: 1px solid @grey4;
			padding: 10px;
			li.ui-state-default {
				width: 392px;
				height: 40px !important;
				margin: 15px 0;
				padding: 9px 14px;
				background: @bgBlue;
				.boxShadow(1px;1px;1px;rgba(0,0,0,0.4));
				input {
					margin-right: 5px;
					float: left;
					.heightAndWidth(20px;20px);
				}
				p {
					margin-top: 1px;
					float: left;
					.fontStyle(@white;14px;600);
					.textShadow(1px;1px;1px;rgba(0,0,0,0.2));
					
				}

			}
		}

		.other {
			width: 392px !important;
			height: 150px !important;
			margin: 21px 10px;
			padding: 9px 14px;
			background: @bgBlue;
			.boxShadow(1px;1px;1px;rgba(0,0,0,0.4));
			input {
				margin-right: 5px;
				float: left;
				.heightAndWidth(20px;20px);
			}
			p {
				margin-top: 1px;
				float: left;
				.fontStyle(@white;14px;600) !important;
				.textShadow(1px;1px;1px;rgba(0,0,0,0.2));
				
			}
			p {
				position: relative;
				top: -23px;
				left: 25px;
				width: 310px;
				margin-right: 0px;
				textarea {
					margin-top: 15px;
					display: block;
					padding-left: 5px;
					.radius;
					border: 1px solid @grey5;
					height: 80px;
					width: 302px;
					color: @grey7;
				}
			}
		}
		
		.btn.important {
			float: right;
			position: absolute;
			bottom: 66px;
			right: 16px;
			margin-right: 88px;
			height: 35px;
			padding-top: 5px;
		}
		
	}
	a.close {
		opacity: 0.5;
		position: absolute;
		left: 432px;
		top: 5px;
	}

	a.close:hover {
		opacity: 0.7;
	}
}

/*Not Used Anymore */
#addPrivacyLink.addForm {
	height: 40px;
	width: 100%;
	background: none;
	.noBoxShadow;
	border: none;
	position: relative;
	left: -135px;
	top: 0px;
	button {
		background: @blueGrey4;
		border: none;
		.noTextShadow;
		.boxShadow(1px;0;1px;@grey3);
		.fontStyle(@white;14px;400);
		i {
			postion: relative;
			top: -1px;
		}
	}
	input {
		height: 32px;
		.radius;
		border: 1px solid @grey5;
		.insetDrop(0;1px;1px;1px;rgba(0,0,0,0.05);0;1px;1px;0;rgba(0,0,0,0.05));
		padding: 6px 8px;
		font-size: 12px;
		position: relative;
		top: -1px;
	}
	input:focus {
		outline: none;
		border: 1px solid @blueDark;
		.insetDrop(0;0;2px;0;lighten(@blueLight,10%);0;0;2px;0;lighten(@blueLight,5%));
	}
}
div.success {
	margin: 15px 0;
	width: 100%;
	padding: 10px;
	.radius;
	background: @buttonGreen;
	p {
		color: @white !important;
		margin-bottom: 0;
		font-family: @font5;
	}
}
div.error {
	margin: 15px 0;
	width: 100%;
	padding: 10px;
	.radius;
	background: @red1;
	color: @white;
	p {
		color: @white;
		margin-bottom: 0;
		font-family: @font5;
	}
}
#addFilterWrapper {
	display: none;
    width: 100%;
    z-index: -1;
    position: absolute;
    z-index: 1001;
    &.active {
    	display: block;
    }
}

#addTeamWrapper {
	display: none;
	width: 100%;
	z-index: -1;
	position: absolute;
	z-index: 1001;
	.addForm {
		z-index: 1001;
		width: 500px;
		font-family: @font2;
		background: @white;
		border: 1px solid @grey3;
		.boxShadow(0;0;2px;@grey7);
		.slide;
		margin: 180px auto;
		top: 25px;
		background: @white;
		padding: 30px 25px;
		border: 8px solid @blueGreen;
		position: relative;
		
		a.closeForm {
			float: right;
			position: absolute;
			top: -15px;
			right: -15px;
			border: 2px solid @blueGreen;
			.radius(50px);
			background: @white;
			opacity: 1;
			color: @grey5;
			display: block;
			height: 34px;
			width: 34px;
			text-align: center;
			padding-top: 4px;
		}
		.header {
			float: left;
			width: 100%;
			h3 {
				font-family: @font5;
				.fontStyle(@grey7;20px;500);
				margin-bottom: 10px;
				margin-top: 0;			
			}
		}
		form {
			padding: 15px 0;
			width: 430px;
			float: left;
			margin-bottom: 0px;
			label {
				float: left;
				clear: left;
				.fontStyle(@grey6;14px;700);
				line-height: 10px;
				margin-bottom: 8px;
			}
			input[type="email"] {
				margin-bottom: 10px;
				clear: both;
				height: 35px;
				width: 100%;
				font-size: 14px;
				.insetShadow(0;0;3px;rgba(0,0,0,0.3));
				.fontStyle(@grey6;12px;400);
			}
			.buttons {
				margin: 10px 0px;
				float: right;
				clear: both;
				.btn {
					padding-top: 10px;
					width: 70px;
					font-family: @font5;
					width: 80px;
					margin-bottom: 0;
				}
			}
			ul.team {
				font-family: @font5;
				width: 100%;
				float: left;
				label {
					width: 100%;
					.fontStyle(@blueGrey5;18px;600);
					padding-bottom: 7px;
					border-bottom: 1px solid @grey4;
				}
				li {
					.fontStyle(@grey6;16px;600);
				}
			}
		}	
	}
}
#addTeamWrapper.active {
	display: block;
}
/*Monitoring Messages Page*/
#monitoring {
	background: @white;
	padding: 0 15px;
	.section {
		h3 {
			margin-bottom: 30px;
			height:25px;
			select {
				display: inline;
				position: relative;
				top: -1px;
				margin-left: 10px;
				width: 200px;
			}
			span {
				left: 207px !important;
			}
		}
	}
	#sealMonitoring {
		min-height: 600px;
	}
	ul.stats{
		margin: 0px !important;
		float: left;
		clear: both;
		padding: 0 20px !important;
		width: 100%;
		h4 {
			.fontStyle(@blueGrey5;18px;500);
		}
		.sealStatus {
			float: left;
			img {
			}
			p {
				.fontStyle(@grey7;14px;700) !important;
				span {
					.fontStyle(@grey6;12px;500);
				}
			}
		}
		
		li {
			padding-top: 20px;
			margin: 0 25px;
			float: left;
			.fontStyle (@grey7;28px;600);
			span {
				display: block;
				.fontStyle(@grey6;14px;500);
			}
		}
		li.visits {
			margin-top: -40px;
			margin-left: 100px;
			padding: 60px 30px;
			border-right: 1px solid @grey3
		}
	}
}

/*Dashboard Page. Lengthy. Needs Organizing*/
#dashboard {
	min-height: 630px;
	padding-top: 15px;
	.bottomRightRadius(3px);
	position: relative;
	font-family: @font5;
	#noDataAlpha, #subscriptionAlpha {
		border: none;
		top: 233px;
		width: 820px;
		height: 330px;
		margin-left: 71px;
		background: rgba(0,0,0,0.5);
    	z-index: 999;
		.radius(5px);
		h4 {
			margin-top: 55px;
			width: 68%;
			margin-left: 16%;
			text-align: center;
			color: @grey1;
			line-height: 30px;
		}
		a.btn.important {
			width: 20%;
			margin: 15px 40%;
			height: 45px;
			padding-top: 8px;
			font-size: 18px;
		}
	}
	#subscriptionAlpha {
		top: 231px;
		.boxShadow(0;0;0;5px;@blueGreen);
		padding: 0;
		img.lockout-bg {
			position: absolute;
			top: 0;
			left: 0;
			.leftRadius;
		}
		.alphaWrapper.confirmAlpha {
			padding: 0;
			height: 330px;
			div.left {
				float: left;
				width: 590px;
			}
			div.right {
				position: absolute;
				right: 0;
				float: right;
				.rightRadius(4px);
				background: @blueGreen;
				.boxShadow(-6px;0;20px;-15px;rgba(0,0,0,0.7));
				width: 230px;
				height: 330px;
				padding: 0 18px;
				h3 {
					color: @white;
					font-size: 20px;
					line-height: 30px;
				}
				a.btn.important {
					position: absolute;
					margin: 0;
					width: 90%;
					left: 14px;
					bottom: 20px;
					padding-top: 10px;
					background: @white;
					color: @blueGreen;
					.boxShadow(0;3px;3px;-2px;rgba(0,0,0,0.4))
				}
			}
			div.left {
				height: 330px;
				position: relative;
				padding-top: 15px;
				div#image-icon {
					margin-left: 40px;
					float: left;
					height: 60px;
					width: 60px;
					img, i {
						height: 100%;
						width: 100%;
						display: none;
						font-size: 60px;
						color: @blueGreen;
					}
				}
				div#image-icon.sentiment {
					#sentiment {
						display: block;
					}
				}
				div#image-icon.satisfaction {
					#satisfaction {
						display: block;
					}
				}
				div#image-icon.ratings {
					#ratings {
						display: block;
					}
				}
				div#image-icon.survey {
					#survey {
						display: block;
					}
				}
				h3 {
					margin-top: 15px;
					margin-right: 30px;
					float: right;
					width: 452px;
					text-align: center;
					font-size: 26px;
					color: #333;
					font-weight: 300;
					span.sub-type {
						text-transform: capitalize;
						font-weight: 400;
						color: @blueGreen;
					}
				}
				p {
					float: right;
					width: 452px;
					margin-right: 30px;
					margin-top: 6px;
					text-align: center;
					color: #333;
					font-size: 18px;
					font-weight: 300;
					span.unseen-amount {
						font-weight: 600;
						color: @blueGreen;
					}
				}
			}
		}
	}
	.dash {
		display: none;
		width: 100%;
		.graphWrapper {
			margin-top: 5px;
			border-top: 1px solid @grey3;
			.boxShadow(0;3px;2px;-2px;@grey4);
			background: @greenGrey1;
			width: 100%;
			padding-bottom: 11px;
			h3 {
				float: left;
				width: 66%;
				margin-left: 58px;
				margin-bottom: 25px;
				.fontStyle(@grey7;34px;300);
			}
			.btn-group {
				float: right;
				margin-right: 35px;
				margin-top: 25px;
				z-index: 980;
				.btn {
					background: @grey4;
					font-weight: 700;
					border-left: 1px solid @grey5;
				}
				.btn:first-child {
					border: none;
				}
				.btn:hover {
					background: lighten(@grey4,5%);
				}
				.btn.active {
					background: @bgBlue;
					color: @white;
					.noTextShadow;
					cursor: default;
				}
				.btn.active:hover {
					opacity: 1;
				}
			}

			.graphHolder {
				position: relative;
				margin-top: 25px;
				margin-left: 10px;
				width: 920px;
				svg {
				}
				.toolTip {
					position:absolute;
					height: 160px;
					width: 200px;
					z-index: 1000;
					.tip {
						z-index: 950;
						height: 100%;
						width: 100%;	
						background: #fff;
						.radius;
						border: 1px solid darken(@grey4,10%);
						.boxShadow(0,1px,1px,1px,rgba(0,0,0,0.1));
						.dataValue {
							padding: 10px 5px;
							p {
								text-align: center;
								margin: 0;
								span {
									display: block;
									line-height: 16px;
									.fontStyle(@grey7;12px;400) !important;
								}
								span.value {
									line-height: 24px;
									margin-top: 5px;
									margin-bottom: 10px;
									.fontStyle(@grey7;24px;400) !important;
								}
							}
							span.date {
								text-align: left;
							}
						}
					}
				}
				.toolTip.satisfaction {
					height: 130px;
				}
				.toolTip.satisfaction.down {
					.tip:before {
						top: 129px;
					}
					.tip:after {
						top: 129px;
					}
				}
				.toolTip.unsub {
					height: 160px;
					width: 180px;
					.tip {
						.dataValue {
							padding: 15px;
						}
					}
				}
				.toolTip.sxi {
				    height: 175px;
				}
				.toolTip.unsub {
					height: 125px;
					width: 180px;
					.tip {
						.dataValue {
							padding: 15px;
						}
					}
				}
				.toolTip.down {
					.tip:before {
						z-index: 951;
						border-left: 10px solid transparent;
						border-top: 10px solid darken(@grey4,10%);
						border-right: 10px solid transparent;
						content: '';
						display: block;
						position: absolute;
						top: 159px;
						left: 17px;
					}
					.tip.sxi:before {
					    top: 200px;
					}
					.tip.sxi table {
					    margin: 0 auto;
					    td:first-child {
						text-align: right;
					    }
					    td:last-child {
						text-align: left;
					    }
					}
					.tip:after {
						z-index: 952;
						border-left: 9px solid transparent;
						border-top: 9px solid @white;
						border-right: 9px solid transparent;
						content: '';
						display: block;
						position: absolute;
						top: 159px;
						left: 18px;
					}
					.tip.sxi:after {
					    top: 199px;
					}
				}
				.toolTip.unsub.down {
					.tip:before {
						top: 124px;
					}
					.tip:after {
						top: 124px;
					}
				}
				.toolTip.up {
					.tip:before {
						z-index: 951;
						border-left: 10px solid transparent;
						border-bottom: 10px solid darken(@grey4,10%);
						border-right: 10px solid transparent;
						content: '';
						display: block;
						position: absolute;
						top: -9px;
						left: 17px;
					}
					.tip:after {
						z-index: 952;
						border-left: 9px solid transparent;
						border-bottom: 9px solid @white;
						border-right: 9px solid transparent;
						content: '';
						display: block;
						position: absolute;
						top: -8px;
						left: 18px;
					}
				}
				.toolTip.visible {
					visibility: visible;
					opacity: 1;
					transition: opacity 0.5s linear;
				}
				.toolTip.fade {
					visibility: hidden;
					opacity: 0;
					transition: visibility 0s 0.5s, opacity 0.5s linear;
					.tip {
						margin-top: -10000px;
  						transition: margin-top 0s 0.5s;
					}
				}
				.toolTip.show {
					visibility: visible;
					opacity: 1;
					.tip {
						margin-top: 0;
  						transition: margin-top 0s 0.5s;
					}
				}
				.toolTip.sxi.down {
					.tip:before {
						top: 174px;
					}
					.tip:after {
						top: 174px;
					}
				}
			}
		}
		.chart {
			img {
				margin-left: 45px;
				margin-bottom: 40px;
			}
		}
		.subCategories {
			width: 100%;
			ul.subs {
				padding: 10px 0;
				margin-bottom: 25px;
				width: 100%;
				li.sub {
					position: static !important;
					float: left;
					width: 278px;
					margin-left: 22px;
					margin-top: 5px;
					margin-bottom: 15px;
					margin-right: 9px;
					button {
						width: 100%;
						border: none;
						background: @greenGrey1;
						.boxShadow(0;1px;1px;1px;lighten(@bgBlue,35%));
						border-top: 2px solid lighten(@greenGrey1,20%);
						p {
							margin: 0 !important;
							float: left;
							display: inline;
							.fontStyle(@bgBlue;16px;400) !important;
						}
						span.weeklyTrend {
							position: relative;
							top: 2px;
							float: right;
							color: @green4; 
						}
						i {
							color: @bgBlue;
							position: relative;
							top: 6px;
							float: right;
							font-size: 14px;
						}
					}
					button.subSelector {
						cursor: pointer;
						padding: 10px 6px;
					}
					button.subSelector.btn-disabled {
						cursor: default;
					}
					button:focus {
						outline: none;
					}
					ul.subBreakdown {
						display: none;
						margin: 6px 0;
						li {
							margin: 12px 5%;
							width: 90%;
							button.breakdownSelector {
								padding: 6px 5px;
								p {
									font-size: 12px !important;
								}
								span {
									top: 2px;
									font-size: 10px;
								}
							}
						}
						li.active {
							button.breakdownSelector {
								background: @bgBlue;
								border-top: 2px solid lighten(@bgBlue,20%);
								.noBoxShadow;
								p {
									color: @white !important;
								}
							}
						}
					}
					ul.subBreakdown.active {
						display: block;
					}
					ul.sxiBreakdown {
						display:none;
						height: 144px;
						li {
							height: 30px;
							border-bottom: 1px solid @grey3;
							span {
								color: #586874;
								position: relative;
								top: 4px;
								float: right;
								font-size: 20px;
							}
							img {
								float: left;
								width: 130px;
							}
							img.review {
								float: left;
								width: 25px;
								margin-right: 10px;
							}
							p {
								position: relative;
								top: 3px;
								float: left;
								width: 130px;
								font-size: 18px;
								margin: 0;
							}
							p.review {
								width: 160px;
							}
							p.promoters {
								color: @green4;
							}
							p.passives {
								color: darken(@grey4,10%);
							}
							p.detractors {
								color: @red1;
							}
						}
					}
				}
				li#frequencyR.sub {
					clear: left;
				}
				li#relevancy.sub.shift {
					position: relative !important;
					top: -40px;
				}
				li.sub.shiftUp{
					position: relative !important;
					top: -144px;
				}
				li.sub.shiftUp.shift {
					top: -163px !important;
				}
				li#frequencyR.sub.shiftLeft {
					position: relative !important;
					top: 110px;
					left: -309px;
				}
				li#frequencyR.sub.shiftLeft {
					position: relative !important;
					top: 110px;
					left: -309px;
				}
				li.sub.active {
					button.subSelector {
						background: @bgBlue;
						border-top: 2px solid lighten(@bgBlue,20%);
						.noBoxShadow;
						p {
							color: @white !important;
						}
						span.weeklyTrend {
							color: @white;
						}
						i {
							color: @white;
						}
					}
					ul.sxiBreakdown {
						display: block;
					}
				}
			}
		}
	}
	#message.dash {
		display: block;
		div.subCategories {
			min-height: 140px;
		}
		.graphWrapper {
			.bottomRightRadius(4px);
		}
	}
	#VOS.dash {
		div.subCategories {
			min-height: 120px;
			li.sub {
				ul.sxiBreakdown {
					padding: 15px 0;
				}
			}

		}
	}
	h2 {
		height: 45px;
		margin: 0 10px;
		border-bottom: 1px solid @grey4;
		label {
			padding-top: 2px;
			margin-bottom: 0px;
			float: left;
			.fontStyle(@blueGrey5;16px;500) !important;
		}
		.dropdown {
			margin-top: 1px;
			margin-left: 20px;
			.floatLeftRelative;
			top: -1px;
			button {
				text-align: left;
				height: 30px;
				width: 115px;
				i {
					position: absolute;
					top: 14px;
					right: 8px;
				}
			}
			.dropdown-menu {
				margin-top: -3px !important;
			}
		}
	}
	.row {
		padding: 0 20px;
	}
	.dbWrapper {
		margin: 25px 0;
		padding: 0 7px;
		h3 {
			.fontStyle(@blueGrey5;14px;500);
			margin-top: 4px;
			margin-bottom: 3px;
			padding-left: 3px;
		}
	}
	.dbBox {
		height: 150px;
		border: 1px solid @grey4;
		.boxShadow(0;1px;1px;@grey3);
		ul.values:first-child {
			border-bottom: 2px solid @grey4;
		}
		ul.values {
			height: 50%;
			padding: 10px 10px;
			p {
				.fontStyle(@blueGrey4;12px;500) !important;
				margin: 0 3px;
			}
			li {
				float: left;
				display: block;
				width: 212px;
				meter {
					width: 93%;
				}
			}
			li.Approved {
				width: 35px;
				opacity: 0.25;
				img {
					position: relative;
					top: -1px;
					left: 6px;
					height: 35px;
					width: 100%;
				}
			}
			li.Approved.a {
				opacity: 1;
			}
			li.Approved.b {
				opacity: 0.75;
			}
			li.Approved.c {
				opacity: 0.5;
			}
		}
		
	}

	.rating {
		height: 55%;
		margin: 0 3px;
		p.score {
			width: 100%;
			text-align: center !important;
			.fontStyle(@grey7;60px;600) !important;
			margin-bottom: 0px;
		}
		span {
			position: relative;
			top: -20px;
			width: 100%;
			text-align: center;
			.fontStyle(@grey7;12px;500);
		}
		border-bottom: 2px solid @grey7;

	}

	.list {
		padding: 3px 15px;
		li {
			.fontStyle(@blueGrey5;12px;500);
			border-bottom: 1px dotted @blueGrey5;
			margin-top: 7px;
			i {
				.fontStyle(@grey6;12px;500);
				display: inline-block;
				width: 17px;
				text-align: center;
			}
			span {
				float: right;
				margin-right: 5px;
				.fontStyle(@grey6;12px;500);
			}
		}
	}

	#status {
		img {
			height: 165px;
			margin-top: 7px;
			margin-left: 7px;
		}
	}

	#sealStatus {
		ul.status {
			margin: 15px;
			li {
				margin: 20px 0;
				.fontStyle(@blueGrey5;14px;500);
				span {
					.fontStyle(@grey6;12px;500);
				}
			}
		}
	}

	#timeline {
		h3 {
			height: 18px;
			margin-top: 18px;
			margin-bottom: 0px;
			.dropdown {
				position: relative;
				top: -21px;
				left: 100px;
				button {
					text-align: left;
					padding-top: 2px;
					width: 100px;
					height: 22px;
					i {
						position: relative;
						top: 1px;
						float: right;
					}
				}
			}
		}
		.dbBox {
			img {
				padding: 5px 10px;
			}
		}
	}

	#satisfaction {
		.npsScore {
			height: 77%;
			padding: 15px 0;
			border-bottom: none;
		}
		.ratingDetails {
			margin-top: -14px;
		}
	}

	#reviews {
		.rating {
			height: 143px !important;
		}
		ul.reviews {
			.average {
				width: 100%;
				img {
					margin-top: 16px;
					margin-left: 94px;
					width: 100px;
				}
				p {
					width: 100%;
					text-align: center;
					.fontStyle(@grey7;12px;500);
					span {
						top: 0px;
						display: inline;
						.fontStyle(@blueLight;12px;600);
					}
				}
			}
		}

		.second {
			display: block;
			height: 90px;
			li {
				position: relative;
				top: 34px;
				float: left;
				margin: 0px 15px;
				padding-top: 10px;
				height: 100px;
				width: 36px;
				span {
					postion: relative;
					top: 2px;
					left: 5px;
					width: width: ;
					height: 10px;
					text-align: center;
					.fontStyle(@grey7;16px;600);
				}
				.progress {
					margin-left: 9px;
					position: relative;
					display: block;
					height: 80%;
					width: 20px;
					border: 1px solid rgba(0,0,0,0.4);
					.bar {
						width: 20px;
						.gradientGreenButton;
						position: absolute;
						bottom: 0px;
						.bottomRadius(3px);
					}
				}
				img {
					position: relative;
					top: 3px;
					left: 3px;
					width: 34px;
				}
			}
		}
		.first {
			display: none;
		}
		#sentiment.messageToggle {
			padding-top: 0px;
			position: relative;
			top: -4px;
		}
	}

	#ratings {
		position: relative;
		.fbBreakdown {
			height: 77%;
			float: left;
			padding: 7px 0;
			margin: 15px 3px;
			li {
				position: relative;
				float: left;
				height: 55px;
				width: 135px;
				margin-bottom: 3px;
				label {
					margin-bottom: 3px;
					margin-left: 10px;
					width: 100%;
					.fontStyle(@blueGrey5;12px;500);
					
				}
				.score {
					margin-left: 7px;
					.rateit {
						float: left;
						.rateit-range {
							background: url("@{base}images/stars.png");
						}

						.rateit-range{
							background: url('@{base}images/stars.png');

						}
						.rateit-preset{
							background: url('@{base}images/stars.png') left -22px;
						}
					}
					
					span {
						position: absolute;
						top: 25px;
						right: -4px;
						margin-left: 2px;
						width: 20px;
						.fontStyle(@grey6;12px;500);
					}
				}
			}
		}
	}

	#feedback {
		.rating {
			height: 77%;
			padding: 15px 0;
		}
		.average {
			padding: 12px 12px;
			p {
				float: left;
				.fontStyle(@blueGrey5;11px;500);
				margin-right: 0px;
			}
			p:first-child {
				margin-right: 30px;
			}
		}
	}

	#messages {
		.rating {
			height: 77%;
			padding: 7px 0;
		}

		.msgBreakdown {
			margin-left: 46px;
			display: none;
			li {
				height: 50px;
				width: 100%;
				label {
					color: @blueGrey4;
				}
				meter {
					height: 12px;
					width: 78%;
				}
			}
		}
		

		.msgFreq{
			display: none;
			float: left;
			margin-top: 45px;
			margin-left: 80px;
			width: 120px;
			li {
				.floatLeftRelative;
				top: -15px;
				width: 60px;
				padding-top: 3px;
				height: 30px;
				p {
					cursor: pointer;
					text-align: center;
					.fontStyle(@grey6;14px;500);
					margin-right: 0px;
				}
				p.selected {
					cursor: default;
					text-decoration: underline;
				}
				p:hover {
					text-decoration: underline;
				}
			}
			li.week{
				p {
					border-right: 1px solid @grey3;
				}
			}
			span.freq {
				position: relative;
				top: -12px;
				line-height: 35px;
				.fontStyle(@grey7;60px;700);
				width: 100%;
				text-align: center;
			}
		}

		ul.first {
			display: block;
		}
	}

	#seals {
		.list {
			li {
				margin-top: 23px;
			}
		}
	}
	.messageToggle {
		height: 40px;
		padding: 0 100px;
		a {
			margin-top: 2px;
			color: @blueLight;
			float: left;
			font-size: 20px;

		}
		a:hover {
			color: @lightBg1;
			text-decoration: none;
		}
		.tabPosition {
			float :left;
			li {
				margin: 11px 5px;
				float: left;
				i {
					margin-top: 2px;
					display: block;
					font-size: 8px;
					color: @grey4;
				}
				i.active {
					color: @buttonBlue;
				}
			}
		}
	}
}

/*tracker dashboard*/
#dashboard.tracker {
	min-height: 900px;
	div.companyOptions {
		margin-left: 60px;
		margin-bottom: 8px;
		height: 40px;
		p.companySelect {
			margin-top: 6px;
			float: left;
			font-size: 16px;
			select#selectCompany {
				margin-left: 20px;
			}
		}
		a#addCompany {
			margin-right: 35px;
			float: right;
		}
	}
	div.companyOptions.companyFeed {
		border-bottom: 1px solid @grey4;
		margin: 0;
		padding-left: 60px;
		height: 50px;
		padding-bottom: 20px;
	}
	#message.dash {
		display: block;
	}
	a.showHide {
		float: right;
		position: relative;
		width: 71px;
		top: 5px;
		.fontStyle(@white;14px;400);
		padding: 3px 8px;
		.radius;
		border: none;
		background: lighten(@blueGreen,7%);
		.textShadow(0;1px;0;rgba(0,0,0,0.2));
		margin-right: 35px;
		span.showBtn {
			display: none;
		}
		span.hideBtn {
			display: inline;
		}
		i {
			margin-left: 5px;
		}
	}
	a.showHide.active {
		span.showBtn {
			display: inline;
		}
		span.hideBtn {
			display: none;
		}
	}
	div.trackerFeed {
		width: 76%;
		margin: 10px 12%;
		padding-bottom: 30px;
		ul.feedItems {
			li {
				div.itemHeader {
					height: 80px;
					margin-bottom: 8px;
					width: 100%;
					div.brandLogo {
						width: 100px;
						float: left;
						margin-left: -5px;
						img {
							width: 100%;
						}
					}
					p.subject {
						float: left;
						width: 500px;
						font-size: 16px;
						margin-top: 35px;
						margin-left: 50px;
					}
				}
				div.messageBody:before {
					content: '';
					display: block;
					position: absolute;
					top: -14px;
					left: 25px;
					width: 0;
					height: 0;
					border-style: solid;
					border-width: 0 14px 14px 14px;
					border-color: transparent transparent lighten(@blueGreen, 7%) transparent;
				}
				div.messageBody:after {
					content: '';
					display: block;
					position: absolute;
					top: -11px;
					left: 27px;
					width: 0;
					height: 0;
					border-style: solid;
					border-width: 0 12px 12px 12px;
					border-color: transparent transparent @greenGrey1 transparent;
				}
				div.messageBody {
					position: relative;
					width: 100%;
					top: 25px;
					border: 2px solid lighten(@blueGreen, 7%);
					.radius;
					background: @greenGrey1;
					div.message {
						background: @white;
						width: 80%;
						margin: 10px 10%;
						img {
							width: 100%;
						}
					}
					div.dateWrapper {
						width: 100%;
						height: 34px;
						padding: 6px 8px;
						background: @greenGrey5;
						border-top: 1px solid @grey4;
						.bottomRadius(6px);
						p {
							float: right;
							margin: 0;
						}
					}
				}
			}
		}
	}
	div.snapshots {
		margin-top: 30px;
		h3 {
			margin-left: 25px;
		}
		ul.snapshotList {
			height: 300px;
			width: 96%;
			margin: 0 2%;
			margin-top: 25px;
			li {
				float: left;
				width: 50%;
				div.brandLogo {
					width: 60px;
					float: left;
					margin-left: 5px;
					img {
						width: 100%;
					}
				}
				p {
					font-size: 16px;
				}
				p.subject {
					float: left;
					margin-top: 20px;
					margin-left: 8px;
				}
				div.snapshotGraph {
					float: right;
					width: 350px;
					margin-right: 25px;
					img {
						width: 100%;
					}
				}
				p.caption {
					float: left;
					clear: left;
					margin-top: 4px;
					margin-left: 78px;
				}
			}
		}
	}
}

/*Dashboard/Report Columns*/
div.columns{
	height: 120px;
	.col {
		height: 100% !important;
		width: 278px;
		float: left;
		margin-left: 22px;
		margin-right: 9px;
		h2 {
			cursor: pointer;
			padding: 18px 10px;
			margin: 0;
			margin-top: 10px !important;
			margin-bottom: 15px !important;
			font-size: 20px !important;
			border: 1px solid @grey5 !important;
			height: 95px !important;
			background: @greenGrey1;
			position: relative;
			.radius(2px);
			i {
				font-size: 62px;
				color: @bgBlue;
				position: relative;
				top: -3px;
				left: 10px;
			}
			i.fa-edit {
				top: 1px;
			}
			span {
				height: 45px;
				font-family: @font5;
				float: right;
				.fontStyle(@bgBlue;50px;300);
				i {
					font-size: 35px;
					margin-right: 8px;
				}
			}
			p {
				position: absolute;
				right: 12px;
				top: 62px;
				font-family: @font5;
				.fontStyle(@bgBlue;12px;400) !important;
				margin: 6px 0 !important;
				line-height: 20px;
				height: 20px;
				float: right;
				clear: right;
			}
		}
		h2:hover, h2.active {
			border: 1px solid @grey1 !important;
			background: @bgBlue;
			i {
				color: @white;
			}
			span {
				.fontStyle(@white;50px;300) !important;
			}
			p {
				.fontStyle(@white;12px;400) !important;
			}
		}
		h2.active {
			.insetDrop(0;1px;0;1px;rgba(255,255,255,0.3);0;0;1px;1px;rgba(0,0,0,0.23));
		}
		ul.stats {
			margin: 6px 0;
			padding: 5px;
			h3 {
				margin-top: 1px;
				.fontStyle(@blueGrey5;16px;600);
				padding-bottom: 3px;
				border-bottom: 1px solid @grey4;
				nav {
					float: right;
					a {
						.fontStyle(@green;16px;400);
						margin: 0 5px;
					}

				}
			}
			li {
				label {
					margin-left: 3px;
					.fontStyle(lighten(@grey6,5%);14px;500);
					margin-bottom: 0px;
				}
			}
		}
		ul.stats:hover {
			padding: 4px;
			background: lighten(@greenGrey1,5%);
			border: 1px solid rgba(0,0,0,0.18);
		}
		ul.stats.active {
			padding: 4px;
			background: @greenGrey1;
			border: 1px solid @white;
			.boxShadow(0;0;0;1px;rgba(0,0,0,0.3));
		}
		ul#ratings {
			.page {
				display: none;
			}
			.page.active {
				display: block;
			}
		}
		ul.unsub {
			position: relative;
			top: -20px;
			padding: 0 5px !important;
			background: none !important;
			border: none !important;
			margin: 0;
			li {
				height: 60px;
				width: 105%;
				margin: 6px 0;
				padding: 3px 1px;
				label {
					font-size: 12px;
				}
				.meter {
					position: relative;
					top: -11px;
					height: 30px;
					span {
						font-size: 8px;
						top: 13px !important;
					}
				}
			}
			li:last-child {
				margin-bottom: 0;
			}
			li:hover {
				padding: 2px 0;
				background: lighten(@greenGrey1,5%);
				border: 1px solid rgba(0,0,0,0.18);
			}
			li.active {
				padding: 2px 0;
				background: @greenGrey1;
				border: 1px solid @white;
				.boxShadow(0;0;0;1px;rgba(0,0,0,0.3));
			}
		}
	}
}

button#review.active {
  i.smileDark {
    display: none;
  }
  i.smileLight {
    display: inline;
  }
}


html.landingPage, body.landingPage {
  position: relative;
  height: 100%;
  width: 100%;
  overflow: auto;
}
/*New Landing Page*/
body.landingPage {
  height: 100%;
  header.landingPage {
    height: 60px;
    background: rgba(255,255,255,0.85);
    nav.container {
      a#logo {
        width: 280px;
        margin-top: 3px;
        img {
          height: 100%;
          width: 100%;
        }
      }
      ul.navItems {
        float: right;
        margin-top: 12px;
        li {
          float: left;
          margin: 0 11px;
          p {
            font-family: @font6;
            margin-top: 10px;
            color: @grey6;
          }
          a {
            font-family: @font6;
            .colorFade;
            top: 8px;
            position: relative;
            color: @white;
          }
          a.login:hover {
            color: rgba(255,255,255,0.7);
            text-decoration: none;
          }
          a.btn.getStarted {
            top: 0;
            .bgColorFast;
            padding: 8px 14px;
            border: 2px solid @buttonGreen;
          }
          a.btn.getStarted.notScrolled {
            .noBoxShadow;
            color: @buttonGreen;
          }
          a.btn.getStarted.scrolled {
            background: @buttonGreen;
            color: @white;
            border-color: @white;
          }
          a.btn.getStarted.notScrolled:hover {
            background: @buttonGreen;
            color: @white;
          }
          a.btn.getStarted.scrolled:hover {
            .textShadow(1px;1px;0;rgba(0,0,0,0.4));
            background: lighten(@buttonGreen,10%);
          }
        }
      }
    }
    #mobileMenu {
      display: none;
    }
  }
  #mainWrapper {
    #mainContent {
      #mainPromptContainer {
        background-image: url('@{base}images/newBG.png');
        border-bottom: 1px solid rgba(0,0,0,0.2);
        z-index: 2;
        position: relative;
        .mainHolder {
          padding-top: 35px;
          padding-bottom: 85px;
          background: rgba(65,146,182,0.8);
        }
        .container {
          #validationWrapper {
            .promptWrapper {
              h2, h3, h4 {
                text-align: center;
                color: @white;
                .textShadow(1px;1px;0;rgba(0,0,0,0.6));
              }
              h3 {
                padding: 0 170px;
                margin-top: 90px;
                line-height: 50px;
                font-family: @font6;
                font-size: 42px;
                font-weight: 700;
              }
              h2 {
                font-family: @font1;
                font-size: 46px;
                font-weight: 700;
              }
              h4 {
                margin-top: 20px;
                font-family: @font6;
                font-size: 16px;
                font-weight: 300;
                padding: 0 420px;
                line-height: 28px;
              }
              div.btnContainer {
                width: 280px;
                margin: 30px auto;
                a#getStarted {
                  font-family: @font6;
                  width: 100%;
                  background: @buttonGreen;
                  color: @white;
                  text-transform: uppercase;
                  font-size: 16px;
                  padding: 24px 0;
                  .slideFast;
                  i {
                    margin-left: 8px;
                  }
                }
                a#getStarted:hover {
                  .textShadow(1px;1px;0;rgba(0,0,0,0.4));
                  background: lighten(@buttonGreen,10%);
                }
              }
            }
          }
        }
      }
      #threeBlocks {
        .insetDrop(0;2px;3px;rgba(0,0,0,0.1);0;2px;3px;rgba(0,0,0,0.1));
        height: 620px;
        background: #f9f9f6;
        position: relative;
        z-index: 2;
        .container {
          ul.hiw {
            height: 220px;
            margin-top: 40px;
            position:realtive;
            li {
              float: left;
              width: 150px;
              height: 220px;
              position: relative;
              a {
                img {
                  width: 100%;
                }
                img.min {
                  display: block;
                }
                img.sel {
                  display: none;
                }
                h3 {
                  font-family: @font1;
                  text-align: center;
                  font-size: 22px;
                  font-weight: 400;
                  color: @grey7;
                }
              }
              i {
                position: absolute;
                top: 65px;
                right: -90px;
                font-size: 30px;
                color: @bgBright;
              }
              a:hover, a.active {
                text-decoration: none;
                img.min {
                  display: none;
                }
                img.sel {
                  display: block;
                }
              }
            }
            li:first-child {
              margin: 0;
              left: 160px;
            }
            li:nth-child(2) {
              margin-left: 50%;
              left: -220px;
            }
            li:last-child {
              position: absolute;
              right: 305px;

            }
          }
          .block {
            display: none;
            width: 80%;
            height: 301px;
            margin: 5px 10%;
            border: 2px solid @grey3;
            background: @white;
            position: relative;
            div.left {
              padding: 25px;
              width: 50%;
              float: left;
              h4 {
                margin: 20px 0;
                font-size: 26px;
                font-weight: 400;
                font-family: @font6;
                color: @grey6;
              }
              p {
                margin-top: 40px;
                font-family: @font6;
                font-size: 20px;
                font-weight: 300;
                color: @grey6;

              }
            }
            div.right {
              float: right;
              position: relative;
              width: 50%;
              img {
                position: absolute;
                right: 0;
                bottom: -297px;
                width: 458px;
                border: solid @grey3;
                border-width: 2px 0 0 2px;
              }
            }
          }
          #listen.block {
            display: block;
          }
          .block:before {
            z-index: 951;
            border-left: 20px solid transparent;
            border-bottom: 20px solid @grey3;
            border-right: 20px solid transparent;
            content: '';
            display: block;
            position: absolute;
            top: -20px;
            left: 138px;
          }
          .block:after {
            z-index: 952;
            border-left: 17px solid transparent;
            border-bottom: 17px solid @white;
            border-right: 17px solid transparent;
            content: '';
            display: block;
            position: absolute;
            top: -17px;
            left: 141px;
          }
          #monitor.block:before {
            left: 439px;
          }
          #monitor.block:after {
            left: 442px;
          }
          #improve.block:before {
            left: 725px;
          }
          #improve.block:after {
            left: 728px;
          }
        }
      }
      #feed {
        height: 500px;
        overflow: hidden;
        background: @white;
        .container {
          width: 940px;
          height: 500px;
          padding: 0;
          overflow: hidden;
          #browserWindow {
            z-index: 1;
            position: relative;
            top: 68px;
            display: inline-block;
            width: 940px;
            background-image: url('@{base}images/feedBrowser.png');
            h2 {
              position: relative;
              top: -50px;
              font-family: @font6;
              text-align: center;
              font-size: 36px;
              color: @blueGreen;
              color: @blueGreen;
            }
            p {
              margin: 0;
              position: relative;
              top: -55px;
              font-family: @font6;
              text-align: center;
              font-size: 16px;
              color: @blueGreen;
            }
            img {
              width: 800px;
              position: relative;
              top: 28px;
              margin-left: 70px;
            }
          }
        }
      }
      #subscriberData {
        .insetShadow(0;2px;3px;rgba(0,0,0,0.1));
        height: 510px;
        background: #f9f9f6;
        .container {
          height: 500px;
          h2 {
            padding: 0 180px;
            line-height: 55px;
            margin-top: 35px;
            font-family: @font6;
            text-align: center;
            font-size: 36px;
            color: @blueGreen;
          }
          ul.data {
            margin-top: 0;
            height: 300px;
            li {
              float: left;
              width: 200px;
              height: 300px;
              position: relative;
              i {
                position: absolute;
                top: 85px;
                right: -45px;
                font-size: 30px;
                color: @blueGreen;
              }
              h3 {
                font-family: @font1;
                text-align: center;
                font-size: 22px;
                font-weight: 400;
                color: @grey7;
              }
              a.btn {
                width: 80%;
                margin: 20px 10%;
                color: @white;
                background: @blueGreen;
                border: 4px solid @blueGreen;
                font-family: @font6;
                font-size: 16px;
                .noBoxShadow;
                .radius(24px);
                .slideFast;
              }
              a.btn:hover {
                background: lighten(@blueGreen,18%);
                .textShadow(1px;1px;0px;rgba(0,0,0,0.2));
              }
            }
            li:first-child {
              margin: 0;
              left: 140px;
            }
            li:nth-child(2) {
              margin-left: 50%;
              left: -300px;
            }
            li:last-child {
              float: right;
              top: -300px;
              right: 140px;
            }
          }

        }
      }
      div#getStarted {
        padding-top: 50px;
        height: 420px;
        background: @blueGreen;
        .container {
          position: relative;
          padding: 0;
          h2 {
            width: 100%;
            top: -20px;
            position: absolute;
            font-family: @font6;
            font-size: 36px;
            color: @white;
            text-align: center;
          }
          div.btnContainer {
            width: 240px;
            margin: 0 auto;
            margin-top: 70px;
            a#getStarted {
              font-family: @font6;
              width: 100%;
              background: @buttonGreen;
              color: @white;
              text-transform: uppercase;
              font-size: 18px;
              padding: 18px 0;
              .slideFast;
              i {
                margin-left: 8px;
              }
            }
            a#getStarted:hover {
              .textShadow(1px;1px;0;rgba(0,0,0,0.4));
              background: lighten(@buttonGreen,10%);
            }
          }
        }
      }
    }
    #mainContent.vos {
      #mainPromptContainer {
        background: @grey2;
        padding-bottom: 50px;
        padding-top: 25px; 
        border-bottom: 1px solid rgba(0,0,0,0.2);
        z-index: 2;
        position: relative;
        height: 410px;
        .container {
          #validationWrapper {
            .promptWrapper {
              div.left {
                float: left; 
                width: 40%;
                img {
                  width: 90%;
                  margin: 0 5%;
                }
              }
              div.right {
                float: right;
                width: 60%;
                padding-top: 10px;
                padding-left: 50px;
                h2, h4 {
                  text-align: left;
                  color: @grey7;
                  .noTextShadow;
                }
                h2 {
                  margin-top: 80px;
                  font-family: @font1;
                  font-size: 34px;
                  line-height: 45px;
                  font-weight: 400;
                  padding-right: 240px;
                  b {
                    font-size: 40px;

                  }
                }
                h4 {
                  margin-top: 15px;
                  font-family: @font6;
                  font-size: 22px;
                  font-weight: 300;
                  line-height: 30px;
                  padding: 0;
                  padding-right: 160px;
                }
              }
            }
          }
        }
      }
      #VoS {
        background: @white;
        div.VoSHolder {
          .insetShadow(0;2px;3px;rgba(0,0,0,0.1));
          height: 115px;
          padding-top: 5px;
          background: @blueGreen;
          ul#VoSIcons {
            height: 110px;
            width: 90%;
            margin: 0 5%;
            li {
              float: left;
              width: 10%;
              margin: 0 5%;
              a {
                display: block;
                height: 100%;
                width: 100%;
                position: relative;
                i {

                  img {
                    width: 80%;
                    margin: 10%;
                  }
                }
              }
              a.active:before {
                z-index: 952;
                border-left: 25px solid transparent;
                border-bottom: 25px solid @white;
                border-right: 25px solid transparent;
                content: '';
                display: block;
                position: absolute;
                bottom: -14px;
                left: 27px;
              }
            }
          }
        }
        #listHolder.container {
          height: 375px;
          ul#VoSList {
            top: -50px;
            position: relative;
            width: 100%;
            div.carouselNav {
              .slide;
              opacity: 0;
              visibility: hidden;
              width: 100%;
              height: 40px;
              position: absolute;
              left: 0;
              top: 135px;
              a {
                position: absolute;
                i {
                  .slideFast;
                  font-size: 45px;
                  color: @bgBright;
                }
              }
              a.left {
                left: 0;
              }
              a.right {
                right: 0;
              }
              a:hover {
                i {
                  color: @blueGreen;
                }
              }
            }
            div.carouselNav.active {
              opacity: 1;
              visibility: visible;
            }
            li {
              display: none;
              margin: 100px 0; 
              padding: 0;
              width: 90%;
              height: 301px;
              margin: 75px 5%;
              background: @white;
              div.left {
                position: relative;
                width: 50%;
                float: left;
                img.image {
                  height: 261px;
                  position: absolute;
                  left: 0;
                  bottom: -297px;
                  width: 458px;
                }
              }
              div.prompt.left {
                padding-left: 10px;
              }
              div.right {
                float: right;
                position: relative;
                width: 50%;
                img.image {
                  height: 261px;
                  position: absolute;
                  right: 0;
                  bottom: -297px;
                  width: 458px;
                }
              }
              .prompt {
                width: 40%;
                h4 {
                  i {
                    position: relative;
                    top: -10px;
                    img {
                      width: 50px;
                      height: 50px;
                    }
                  }
                  font-family: @font6;
                  margin: 0;
                  text-align: left;
                  .fontStyle(@bgBright;24px;700);
                  line-height: 26px;
                }
                p {
                  padding-left: 15px;
                  font-family: @font6;
                  position: relative;
                  .fontStyle(@grey7;18px;300) !important;
                }
              }
            }
            li#recommend, li#review, li#survey {
              .prompt {
                margin-top: 65px;
              }
            }
            li#comments {
              .prompt {
                margin-top: 85px;
              }
            }
            li#rate {
              display: block;
              .prompt {
                margin-top: 45px;
              }
            }
          }
        }
      }
      div.ready{
        .insetShadow(0;2px;3px;rgba(0,0,0,0.1));
        background: @grey2;
        height: 1200px;
        h3 {
          margin-top: 50px;
          text-align: center;
          color: @grey7;
          font-family: @font6;
          font-size: 42px;
          line-height: 55px;
          font-weight: 400;
        }
        ul.howTo {
          width: 90%;
          margin: 0 5%;
          padding: 10px 10%;
          border: 2px solid @grey3;
          background: @white;
          margin-top: 30px;
          li {
            margin: 30px 0;
            height: 290px;
            padding-top: 15px;
            width: 100%;
            border-bottom: 2px dashed @grey3;
            h4 {
              margin-top: 25px;
              text-align: left;
              color: @grey7;
              font-family: @font6;
              font-weight: 300;
              font-size: 26px;
              span {
                position: relative;
                top: -5px;
                display: block;
                float: left;
                height: 35px;
                width: 35px;
                background: @blueGreen;
                .radius(100px);
                color: @white;
                margin-right: 8px;
                text-align: center;
                padding-top: 3px;
              }
            }
            p {
              font-family: @font6;
              color: @grey7;
              font-size: 18px;
              padding-left: 45px;
            }
            div.left {
              float: left;
              width: 50%;
            }
            div.right {
              float: right;
              width: 50%;
              h4 {
                padding-left: 15px;
              }
              p {
                padding-left: 60px;
              }
            }
            img {
              width: 100%;
              border: 2px solid @grey3;
            }
          }
        }
      }
    }
    #mainContent.IW {
      #mainPromptContainer {
        background: @grey2;
        padding-bottom: 50px;
        padding-top: 25px; 
        border-bottom: 1px solid rgba(0,0,0,0.2);
        z-index: 2;
        position: relative;
        height: 410px;
        .container {
          #validationWrapper {
            .promptWrapper {
              .left {
                float: left;
                width: 50%;
                padding-top: 10px;
                padding-left: 90px;
                h2, h4 {
                  text-align: left;
                  color: @grey7;
                  .noTextShadow;
                }
                h2 {
                  margin-top: 80px;
                  font-family: @font1;
                  font-size: 34px;
                  line-height: 45px;
                  font-weight: 400;
                  b {
                    font-size: 40px;

                  }
                }
                h4 {
                  margin-top: 15px;
                  font-family: @font6;
                  font-size: 22px;
                  font-weight: 300;
                  line-height: 30px;
                  padding: 0;
                }
              }
              .right {
                float: right; 
                width: 50%;
                img {
                  margin: 5px 10%;
                  width: 70%;
                }
                
              }
            }
          }
        }
      }
      #trust {
        div.trustHolder {
          .insetShadow(0;2px;3px;rgba(0,0,0,0.1));
          height: 135px;
          padding-top: 5px;
          background: @blueGreen;
          position: relative;
          h4 {
            margin-top: 15px;
            font-family: @font6;
            font-size: 30px;
            line-height: 45px;
            font-weight: 400;
            color: @white;
            text-align: center;
            padding: 0 250px;
          }
        }
        div.trustHolder:before {
          z-index: 952;
          border-left: 26px solid transparent;
          border-top: 26px solid @blueGreen;
          border-right: 26px solid transparent;
          content: '';
          display: block;
          position: absolute;
          bottom: -26px;
          left: -14px;
          margin-left: 50%;
        }
      }
      #cert {
        .insetShadow(0;2px;3px;rgba(0,0,0,0.2));
        height: 500px;
        background: @white;
        div.left {
          float: left; 
          width: 50%;
          img {
            width: 400px;
            margin: 0 15%;
            margin-top: 50px;
          }
        }
        div.right {
          float: right;
          width: 50%;
          padding-top: 10px;
          padding-left: 10px;
          h2, p {
            text-align: left;
            color: @grey7;
            .noTextShadow;
          }
          h2 {
            margin-top: 70px;
            font-family: @font1;
            font-size: 34px;
            line-height: 45px;
            font-weight: 400;
          }
          p {
            margin-top: 15px;
            font-family: @font6;
            font-size: 15px;
            font-weight: 300;
            line-height: 25px;
            padding: 0;
            padding-right: 30px;
          }
        }
      }
      #IWHIW {
        .insetShadow(0;2px;3px;rgba(0,0,0,0.1));
        background: @blueGreen;
        div.container {
          #HIW {
            position: relative;
            div.carouselNav {
              .slide;
              opacity: 0;
              visibility: hidden;
              width: 80%;
              margin: 0 10%;
              height: 40px;
              position: absolute;
              left: 0;
              top: 135px;
              a {
                position: absolute;
                i {
                  .slideFast;
                  font-size: 45px;
                  color: @white;
                }
              }
              a.left {
                left: 0;
              }
              a.right {
                right: 0;
              }
              a:hover {
                i {
                  .textShadow(1px;1px;2px;rgba(0,0,0,0.4));
                }
              }
            }
            div.carouselNav.active {
              opacity: 1;
              visibility: visible;
            }
            h3 {
              text-align: center;
              font-family: @font6;
              font-size: 40px;
              color: @white;
            }
            p.hiw {
              font-family: @font6;
              text-align: center;
              .fontStyle(@grey2;26px;500);
              margin: 0 15% !important;
              margin-top: 20px !important;
              height: 74px;
              width: 70%;
            }
            ul.hiw {
              margin: 25px 15%;
              height: 160px;
              width: 70%;
              li {
                margin: 20px 0; 
                padding: 0;
                width: 19%;
                margin: 0 3%;
                float: left;
                position: relative;
                img {
                  width: 90%;
                  margin: 0 5%;
                  cursor: pointer;
                }
              }
              li.active:before, li:hover:before {
                content: '';
                display: block;
                position: absolute;
                height: 6px;
                width: 60%;
                left: 20%;
                bottom: -15px;
                background: @white;
              }
            }
          }
        }
      }
      #REQS {
        .insetShadow(0;2px;3px;rgba(0,0,0,0.1));
        background: @grey2;
        div.container {
          h3 {
            margin-top: 30px;
            text-align: center;
            font-family: @font6;
            font-size: 40px;
            color: @grey7;
            padding: 0 200px;
          }
          ul.reqs {
            margin: 0 10%;
            margin-top: 40px;
            width: 80%;
            height: 460px;
            li {
              float: left;
              width: 50%;
              height: 230px;
              background: none;
              padding: 0;
              div.imgHolder {
                padding: 0;
                width: 100px;
                height: 100px;
                background: @white;
                .radius(300px);
                border: 4px solid @blueGreen;
                img {
                  width: 70%;
                  margin: 15%;
                }
              }
              h4 {
                text-transform: uppercase;
                font-family: @font6;
                color: @grey7;
                text-align: center;
                font-size: 24px;
              }
              p {
                font-family: @font6;
                color: @grey7;
                text-align: center;
                font-size: 15px;
                margin: 0;
                padding: 0 120px;
              }
            }
          }
        }
      }
    }
    #mainContent.datasheet {
      #mainPromptContainer {
        padding-bottom: 0;
        div.container {
          h3 {
            margin: 0 200px;
            margin-top: 50px;
            padding-top: 35px;
            height: 150px;
            text-align: center;
            font-size: 28px;
            line-height: 36px;
            color: @white;
            background: rgba(0,0,0,0.3);
          }
          h3.download {
            padding-top: 60px;
            font-size: 38px;
          }
        }
      }
      #mainContainer {
        .insetShadow(0;2px;3px;rgba(0,0,0,0.1));
        background: @white;
        height: 800px;
        padding-top: 40px;
        div.container {
          div.left {
            float: left;
            width: 70%;
            h4 {
              font-family: @font6;
              font-weight: 400;
              font-size: 26px;
              color: @grey7;
            }
            p {
              font-family: @font5;
              margin: 3px 0;
              font-size: 18px;
              color: @grey6;
            }
          }
          div.right {
            float: right;
            width: 30%;
            h3 {
              width: 80%;
              margin: 0 10%;
              font-family: @font6;
              color: @grey7;
              font-size: 20px;
            }
            div.downloadForm {
              height: 500px;
              width: 95%;
              margin-left: 5%;
              form {
                float: left;
                position: relative;
                width: 90%;
                margin: 0 5%;
                .control-label {
                  text-align: left;
                }
                label {
                  font-family: @font5;
                  color: @grey6;
                  margin-top: 8px;
                }
                input[type="text"],input[type="password"],input[type="email"], select {
                  font-family: @font5;
                  height: 40px;
                  width: 100%;
                  font-size: 14px;
                  .insetShadow(0;0;3px;rgba(0,0,0,0.3));
                  font-weight: 400;
                  background: @white;
                }
                textarea {
                  width: 100%;
                  height: 100px;
                  font-size: 14px;
                  .insetShadow(0;0;3px;rgba(0,0,0,0.3));
                  font-weight: 400;
                }
                .buttonHolder {
                  width: 50%;
                  margin: 0 25%;
                  margin-top: 30px;
                  a.btn.important {
                    background: @buttonGreen;
                    font-family: @font5;
                    padding: 15px 30px;
                    width: 100%;
                    font-size: 16px;
                    font-weight: 600;
                    .textShadow(1px;1px;0px;rgba(0,0,0,0.2));
                    .insetDrop(0;-3px;0;0;rgba(0,0,0,0.3);0;2px;3px;-1px;rgba(0,0,0,0.2));
                  }
                }
              }
            }
          }
          div.downloadPrompt {
            width: 80%;
            margin: 0 10%;
            p {
              font-family: @font5;
              margin: 3px 0;
              font-size: 18px;
              color: @grey6;
            }
            a.btn.important {
              background: @buttonGreen;
              font-family: @font5;
              padding: 15px 30px;
              margin: 20px 8px;
              font-size: 16px;
              font-weight: 600;
              .textShadow(1px;1px;0px;rgba(0,0,0,0.2));
              .insetDrop(0;-3px;0;0;rgba(0,0,0,0.3);0;2px;3px;-1px;rgba(0,0,0,0.2));
            }
          }
          ul.resource {
            height: 200px;
            width: 70%;
            margin: 25px 15%;
            li {
              font-family: @font5;
              margin: 0 6%;
              height: 225px;
              width: 36%;
              padding: 10px;
              border: 1px solid @grey3;
              background: @grey2;
              float: left;
              .radius;
              position: relative;
              p.type {
                float: left;
                width: 60%;
                font-size: 14px;
                text-transform: uppercase;
              }
              p.symbol {
                margin: 0;
                float: right;
              }
              h4 {
                margin-top: 30px;
              }
              a.next {
                position: absolute;
                bottom: 0;
                left: 0;
                padding: 4px 0;
                .bottomRadius;
                background: @buttonGreen;
                color: @white;
                text-align: center;
                width: 100%;
                display: block;

              }
            }
          }
        }
      }
    }
    #mainContent.contact {
      background: @grey2;
      height: 980px;
      div.contactForm {
        height: 800px;
        padding: 0 200px;
        margin-top: 60px;
        h2 {
          text-align: center;
          font-family: @font6;
          font-weight: 300;
          font-size: 34px;
          a {
            font-weight: 300;
          }
          a:hover {
            text-decoration: none;
          }
        }
        form {
          margin: 0 15%;
          width: 70%;
          margin-top: 5px;
          margin-bottom: 30px;
          .control-label {
            text-align: left;
          }
          label {
            font-family: @font5;
            color: @grey6;
            margin-top: 8px;
          }
          input[type="text"],input[type="password"],input[type="email"], select {
            font-family: @font5;
            height: 40px;
            width: 100%;
            font-size: 14px;
            .insetShadow(0;0;3px;rgba(0,0,0,0.3));
            font-weight: 400;
            background: @white;
          }
          textarea {
            width: 100%;
            height: 100px;
            font-size: 14px;
            .insetShadow(0;0;3px;rgba(0,0,0,0.3));
            font-weight: 400;
          }
          .buttonHolder {
            width: 50%;
            margin: 0 25%;
            margin-top: 30px;
            input.btn.important {
              background: @buttonGreen;
              font-family: @font5;
              padding: 15px 30px;
              width: 100%;
              font-size: 16px;
              font-weight: 600;
              .textShadow(1px;1px;0px;rgba(0,0,0,0.2));
              .insetDrop(0;-3px;0;0;rgba(0,0,0,0.3);0;2px;3px;-1px;rgba(0,0,0,0.2));
            }
          }
        }
      }
    }
  }
  div#videoHolder {
    height: 100%;
    position: relative;
    overflow: hidden;
    #backVideo, img {
      min-width: 100%;
      min-height: 100%;
      position: fixed;
      top: 0;
      left: 0;
    }
    #backVideoOverlay {
      min-width: 100%;
      min-height: 100%;
      position: fixed;
      top: 0;
      left: 0;
      background: @blueGreen0;
    }
  }
  div#landingPageAlpha {
    width: 100%;
    min-height: 100%;
    position: absolute;
    top: 0;
    div.logoStatic {
      position: relative;
      padding-top: 20px;
      max-width: 1000px;
      z-index: 1001;
      width: 30%;
      margin: 0 35%;
      a {
        width: 100%;
        display: block;
        margin-bottom: 15px;
      }
      img {
        width: 100%;
      }
      p {
        margin-top: 15px;
        font-family: @font6;
        color: rgba(255,255,255,0.75);
        font-weight: 300;
        text-align: center;
        font-size: 26px;
        span {
          color: rgba(255,255,255,0.85);
          font-weight: 400;
          font-family: @font1;
        }
      }
      p.prompt.small {
        margin-top: 2px;
        font-size: 20px;
      }
    }
    div.horizontalDiv.top {
      display: none;
      width: 62%;
      height: 0;
      margin: 0 19%;
      border-top: 3px solid rgba(255,255,255,0.25);
    }
    div.horizontalDiv.top.active {
      display: block;
    }
    div.horizontalDiv.bottom {
      display: none;
      width: 62%;
      height: 0;
      margin: 0 19%;
      margin-bottom: 10px;
      border-top: 3px solid rgba(255,255,255,0.25);
    }
    div.horizontalDiv.bottom.active {
      display: block;
    }

    div.alphaScreen {
      position: relative;
      width: 100%;
      max-width: none;
      opacity: 0;
      right: -200%;
      padding-top: 30px;
      display: none;
      img {
        width: 40%;
        margin: 0px 30%;
      }
      h2 {
        padding: 0 10%;
        margin-top: 30px;
        font-family: @font6;
        color: rgba(255,255,255,0.75);
        font-size: 50px;
        text-align: center;
        font-weight: 300;
        b {
          color: rgba(255,255,255,0.85);
          font-weight: 600;
          font-family: @font5;
        }
      }
      h2.question {
        margin-top: 36px;
        margin-bottom: 8px;
        font-size: 60px;
        line-height: 90px;
        color: @white;

        b {
          color: @white;
        }
      }
      h2.statement {
        text-transform: uppercase;
        padding: 0 10%;
        font-size: 50px;
        line-height: 90px;
        margin-top: 18px;
        margin-bottom: 12px;
        b {
          color: @white;
          font-weight: 600;
          font-family: @font5;
        }
      }
      h2.reservation {
        line-height: 72px;
        span {
          display: block;
          width: 100%;
          text-align: center;
          font-weight: 400;
          font-family: @font1;
          color: @white;
        }
      }
      p {
        margin-top: 8px;
        font-family: @font6;
        color: rgba(255,255,255,0.75);
        font-weight: 300;
        text-align: center;
        font-size: 27px;
        span {
          color: @white;
          font-weight: 400;
          font-family: @font1;
          border-bottom: 2px solid @white;
        }
      }
      p.prompt.enter {
        span {
          border: none;
        }
      }
      p.prompt.no {
        display: none;
      }
      p.prompt.no.active {
        display: block;
        margin: 0;
        font-size: 22px;
      }
      p.prompt.no.sorry {
        margin-top: 8px;
        a {
          font-size: 0.8em;
          color: @grey3;
        }
        a:hover {
          color: @grey4;
        }
      }
      div.buttonContainer {
        height: 200px;
      }
      div.buttonWrapper {
        float: left;
        margin: 50px 0;
        width: 27.5%;
        height: 170px;
        .radius(5px);
        background: rgba(0,0,0,0.3);
      }
      div.buttonWrapper.yes {
        margin-left: 20%;
        margin-right: 2.5%;
      }
      div.buttonWrapper.no {
        margin-left: 2.5%;
        margin-right: 20%;
      }
      button {
        .radius(5px);
        width: 90%;
        height: 81%;
        margin: 5%;
        border: none;
        color: @white;
        font-family: @font5;
        .insetDrop(0;1px;0;0;rgba(255,255,255,0.25);0;1px;1px;0;rgba(0,0,0,0.25));
        span {
          font-weight: 600;
          font-size: 22px;
        }
        span.big {
          width: 100%;
          font-size: 55px;
          line-height: 50px;
          font-family: @font1;
          text-transform: uppercase;
        }
        span.yes {
          width: 100%;
          position: relative;
          top: 3px;
        }
        span.no {
          width: 100%;
          position: relative;
          top: 3px;
        }
      }
      button:focus {
        outline: none;
      }
      button#yes {
        border: 1px solid darken(@brightBlueNew,12%);
        background: @brightBlueNew;
      }
      button#yes:hover {
        border: 1px solid lighten(@brightBlueNew,8%);
        background: lighten(@brightBlueNew,8%);
      }
      button#no {
        border: 1px solid darken(@grey5,4%);
        background: @greyButton;
      }
      button#no:hover {
        border: 1px solid lighten(@grey5,12%);
        background: lighten(@greyButton,8%);
      }
      form#reservationForm {
        width: 50%;
        margin: 30px 25%;
        margin-bottom: 0;
        div.inputWrapper {
          width: 100%;
          .radius;
          padding-top: 5px;
          padding-bottom: 10px;
          background: rgba(255,255,255,0.3);
          input[type="email"],input[type="text"] {
            text-align: center;
            margin: 5px 3%;
            width: 94%;
            font-family: @font6;
            padding: 12px 23px;
            height: 70px;
            border: none;
            font-size: 28px;
            color: @grey6;
            .radius();
            .insetShadow(0;2px;0;0;rgba(0,0,0,0.05));
          }
          button {
            margin: 0 3%;
            margin-top: 5px;
            font-family: @font6;
            width: 94%;
            .radius();
            height: 70px;
            padding: 7px 15px;
            font-size: 28px;
            text-transform: capitalize;
            background: @brightBlueNew;
            position: relative;
          }
          button:hover {
            background: lighten(@brightBlueNew,8%);
          }
          button.btn-disabled {
            background: darken(@brightBlueNew,12%);
            color: @grey3;
          }
        }
      }
      div.socialIcons {
        width: 100%;
        margin-top: 5px;
        padding-top: 20px;
        a, div.wrapper {
          float: left;
          display: block;
          width: 50px;
          height: 50px;
          .radius(64px);
          background: rgba(255,255,255,0.25);
        }
        a:first-child {
          margin-left: 425px;
          margin-right: 10px;
        }
        a:last-child {
          margin-left: 10px;
        }
        i {
          width: 100%;
          text-align: center;
          font-size: 24px;
          padding: 14px 0;
          color: @blueGrey1;
        }
        a:hover {
          background: rgba(0,0,0,0.5);
        }
      }
      div.socialIcons.share {
        border: none;
        max-width: 600px;
        a {
          margin: 0 2.65%;
          .radius(5px);
          height: 52px;
          color: @white;
          font-family: @font6;  
          font-size: 11px;
          text-align: left;
          width: 28%;
          background: @brightBlueNew;
          padding-bottom: 12px;
          div.wrapper {
            background: rgba(0,0,0,0.3);
            width: 30px;
            height: 30px;
            margin-right: 4px;
            i {
              padding: 6px 0;
              font-size: 20px;
            }
          }
          span {
            margin-top: 9px;
          }
          div.email {
            i {
              font-size: 17px;
              padding: 7px 0;
              padding-left: 1px;
            }
          }
        }
        a:hover {
          background: lighten(@brightBlueNew, 8%);
        }
      }
    }
    div.socialStatic {
      display: none;
      position: relative;
      max-width: 1000px;
      padding-bottom: 5px;
      div.horizontalDiv {
        width: 62%;
        height: 0;
        margin: 0 19%;
        margin-bottom: 10px;
        border-top: 3px solid rgba(255,255,255,0.25);
      }
      div.socialIcons {
        width: 100%;
        margin-top: 5px;
        padding-top: 20px;
        a, div.wrapper {
          float: left;
          display: block;
          width: 50px;
          height: 50px;
          .radius(64px);
          background: rgba(255,255,255,0.25);
        }
        a:first-child {
          margin-left: 425px;
          margin-right: 10px;
        }
        a:last-child {
          margin-left: 10px;
        }
        i {
          width: 100%;
          text-align: center;
          font-size: 24px;
          padding: 14px 0;
          color: @blueGrey1;
        }
        a:hover {
          background: rgba(0,0,0,0.5);
        }
      }
    }
    div.socialStatic.active {
      display: block;
    }
    div.alphaScreen.active {
      opacity: 1;
      right: 0;
      display: block;
    }
    div#alphaPage2.alphaScreen.active, div#alphaPage3.alphaScreen.active {
      background: rgba(0,0,0,0.3);
      height: 510px;
    }
    div#alphaPage2.alphaScreen.active {
      height: auto;
      padding-bottom: 50px;
    }
    div#alphaPage2 {
      .yes, .no {
        display: none;
      }
      .yes.active, .no.active {
        display: block;
      }
    }
    div#alphaPage3 {
      padding-top: 5%;
    }
  }
}
body.landingPage.new {
  background: @blueGreen;
  header.landingPage {
    .noBoxShadow;
    background: none;
    nav.container {
      ul.navItems {
        float: right;
        margin-top: 12px;
        li {
          float: left;
          margin: 0 11px;
          p {
            font-family: @font6;
            margin-top: 10px;
            color: @grey6;
          }
          a {
            font-family: @font6;
            .colorFade;
            top: 8px;
            font-size: 18px;
            position: relative;
            color: rgba(255,255,255,0.7);
          }
          a.login:hover {
            color: @white;
            text-decoration: none;
          }
          a.btn.getStarted {
            top: 0;
            .bgColorFast;
            padding: 8px 14px;
            border: 2px solid @white;
          }
          a.btn.getStarted.notScrolled {
            .noBoxShadow;
            color: @white;
          }
          a.btn.getStarted.scrolled {
            background: @buttonGreen;
            color: @white;
            border-color: @white;
          }
          a.btn.getStarted.notScrolled:hover {
            background: @buttonGreen;
            color: @white;
          }
          a.btn.getStarted.scrolled:hover {
            .textShadow(1px;1px;0;rgba(0,0,0,0.4));
            background: lighten(@buttonGreen,10%);
          }
        }
      }
    }
  }
}
footer.main {
  width: 100%;
  height: 55px;
  background: @footer;
  padding-top: 10px;
  font-family: @font5;
  position: fixed;
  bottom: 0;
  p.copyright {
    margin-top: 6px;
    margin-bottom: 0;
    width: 30%;
    float: left;
    font-size: 12px !important;
    color: rgba(255,255,255,0.7);
  }
  ul {
    float: right;
    li {
      float: left;
      padding: 5px 20px;
      a {
        color: rgba(255,255,255,0.7);
      }
      a:hover {
        text-decoration: none;
        color: rgba(255,255,255,0.85);
      }
    }
  }
}
footer.main.big {
  width: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
  background: @bgBlue2;
  height: 200px;
  .container {
    height: 200px;
    position: relative;
    ul.main {
      float: left;
      li.cat {
        width: 180px;
        font-size: 20px;
        color: @white;
        float: left;
        ul.sub {
          margin-top: 5px;
          width: 100%;
          clear: left;
          li {
            padding: 2px 0;
            font-size: 14px;
            width: 100%;
          }
        }
      }
    }
    p.getInTouch {
      width: 138px;
      margin-top: 8px;
      float: right;
      position: relative;
      color: @white !important;
      font-size: 20px !important; 
    }
    p.telephone {
      width: 138px;
      margin-top: 2px;
      float: right;
      clear: right;
      position: relative;
      color: @white !important;
      font-size: 20px !important; 
    }
    ul.social {
      float: none;
      position: relative;
      top: 50px;
      right: -425px;
      li {
        padding: 0;
        height: 40px;
        width: 40px;
        border: 1px solid @white;
        .radius(100px);
        margin: 0 5px;
        a {
          display: block;
          padding: 6px 12px;
          height: 100%;
          width: 100%;
          font-size: 18px;
        }
      }
      li:first-child {
        a {
          padding: 6px 15px;
        }
      }
      li:last-child {
        a {
          padding: 6px 10px;
        }
      }
    }
    ul.small {
      float: left;
      position: absolute;
      top: 160px;
      left: 0px;
      li {
        a {
          font-size: 12px;
        }
      }
      li:first-child {
        a:hover {
          color: rgba(255, 255, 255, 0.7);
        }
      }
    }
  }
}

/*Message Tag Bars*/
ul.msgBreakdown {
	float: left;
	margin-left: 35px;
	width: 230px;
	li {
		height: 30px;
		float: left;
		padding-bottom: 2px;
		margin-bottom: 5px;
		label {
			float: left;
			margin-left: 2px;
			margin-bottom: 0px;
			.fontStyle(@blueGrey5;12px;500);
			b {
				.fontStyle(@grey6;12px;500);
			}
		}
		.progress {
			float: left;
			clear: left;
			margin-top: 2px;
			margin-bottom: 0px;
			margin-right: 2px;
			.heightAndWidth(13px;190px);
			.radius(2px);
			background: @grey4;
			
			.bar {
				height: 100%;
				.gradientGreenButton;
			}
			
		}
		span {
			margin-top: 6px;
			margin-left: 93px;
			float: left;
			.fontStyle(@blueGrey5;12px;500);
			b {
			}
		}
	}
	li:last-child {
		border-bottom: none;
	}
}

/*Lengthy Engagement Section. Needs Cleaning up */
#engagement.feedHolder {
	font-family: @font5;
	min-height: 820px;
	position: relative;
	div.spinnerHolder {
		width: 40px;
		padding: 0;
        @keyframes spin {
            from {
                transform:rotate(0deg);
            }
            to {
                transform:rotate(360deg);
            }
        }
		img {
			width: 100%;
            animation-name: spin;
            animation-duration: 4000ms;
            animation-iteration-count: infinite;
            animation-timing-function: linear;
        }
	}
	div#feedEmpty {
		display: none;
	}
	div#feedEmpty.active {
		display: block;
		height: 50px;
		position: absolute;
		top: 70px;
		width: 720px;
		left: 20px;
		background: lighten(@red1,10%);
		p {
			color: @white;
			height: 40px;
			a {
				color: @white;
				font-weight: 600;
			}
		}
	}
	div.alpha {
		display: none;
		a.closeForm {
			float: right;
			position: absolute;
			top: -15px;
			right: -15px;
			border: 2px solid @blueGreen;
			.radius(50px);
			background: @white;
			opacity: 1;
			color: @grey5;
			display: block;
			height: 34px;
			width: 34px;
			text-align: center;
			padding-top: 4px;
		}
		a.closeForm:hover {
			color: @grey6;
		}
	}
	div.alpha.active {
		display: block;
	}
	div#replyToAlpha.alpha {
		width: 40%;
		z-index: 1000;
		position: absolute;
		margin-left: 180px
		top: 25px;
		background: @white;
		padding: 30px 25px;
		border: 8px solid @blueGreen;
		div.alphaWrapper {
			padding: 5px;
			h4 {
				margin-top: 0;
				font-family: @font5;
				font-size: 20px;
			}
			form {
				margin-top: 15px;
				padding-bottom: 42px;
				position: relative;
				margin-bottom: 30px;
				.control-label {
					text-align: left;
				}
				label {
					clear: left;
					font-family: @font5;
					color: @grey6;
					margin-top: 16px;
					margin-right: 5px;
				}
				input{
					height: 40px;
					width: 100%;
					font-size: 14px;
					.insetShadow(0;0;3px;rgba(0,0,0,0.3));
					font-weight: 400;
				}
				button {
					position: relative;
					float: right;
					right: 5px;
					top: 5px;
					padding: 15px 27px;
					font-size: 16px;
					margin-top: 15px;
				}
			}
		}
	}
	div#cannedAlpha.alpha {
		width: 80%;
		z-index: 1000;
		position: absolute;
		margin: auto;
		top: 25px;
		background: @white;
		padding: 30px 25px;
		border: 8px solid @blueGreen;		
		div.alphaWrapper {
			padding: 5px;
			div.cannedResponses {
				width: 100%;
				border: 1px solid @grey4;
				background: @greenGrey1;
				padding: 10px 20px;
				font-family: @font5;
				h4 {
					font-family: @font5;
					float: left;
				}
				select {
					margin-left: 15px;
					height: 40px;
					font-size: 14px;
					.insetShadow(0;0;3px;rgba(0,0,0,0.3));
					font-weight: 400;
					width: 300px;
				}
				button {
					float:right;
					position: relative;
					right: 3px;
					top: 2px;
				}
			}
			form {
				margin-top: 15px;
				padding-bottom: 42px;
				position: relative;
				margin-bottom: 30px;
			}
			form#replyForm {
				.control-label {
					text-align: left;
				}
				label {
					clear: left;
					font-family: @font5;
					color: @grey6;
					margin-top: 14px;
					margin-right: 5px;
					margin-bottom: 14px;
					float: left;
				}
				label.body {
					float: none;
					margin-bottom: 5px;
				}
				input[type="text"], textarea{
					height: 40px;
					font-size: 14px;
					.insetShadow(0;0;3px;rgba(0,0,0,0.3));
					font-weight: 400;
				}
				input.disabled {
					background: @grey2;
					border: 1px solid @grey5;
				}
				input.left {
					float: right;
					margin: 4px 0;
					position: relative;
					right: -1px;
					width: 614px;
				}
				textarea {
					height: 200px;
					width: 100%;
					resize: vertical;
				}
				span.save {
					float: left;
					position: relative;
					top: 4px;
					input {
						position: relative;
						top: -2px;
					}
				}
				button {
					position: absolute;
					top: 364px;
					right: 5px;
					padding: 15px 27px;
					font-size: 16px;
					margin-top: 15px;
				}
				p.recipients {
					position: relative;
					top: 60px;
					left: 370px;
				}
			}
			form#editForm {
				background: @greenGrey1;
				border: 1px solid @grey4;
				position: relative;
				height: 320px;
				a.closeEdit {
					position: absolute;
					top: 2px;
					right: 6px;
					font-size: 20px;
					color: darken(@grey4,5%);
				}
				a.closeEdit:hover {
					color: @grey5;
				}
				button.submit {
					float: right;
					position: relative;
					right: 90px;
					margin-bottom: 25px;
				}
				ul.editResponseList {
					width: 60%;
					margin: 20px 20%;
					li {
						width: 100%;
						height: 30px;
						margin: 8px 0;
						border-bottom: 1px solid darken(@grey4,5%);
						p {
							float: left;
							width: 70%;
							font-size: 18px;
							color: @blueGreen;
							margin: 0;
						}
						div.cbWrapper{
							position: relative;
							top: 4px;
							float: right;
							width: 20px;
							height: 20px;
							button {
								top: 3px;
								left: 3px;
								width: 14px;
								height: 14px;
								i {
									font-size: 14px;
									color: @red1;
								}
							}
							button:hover {
								i {
									display:block;
								}
							}
							button.active {
								background: @lightGreen2;
								i {
									display:block;
								}
							}
						}
					}
				}
			}
		}
	}
	div#saveAlpha.alpha, div#exportAlpha.alpha {
		width: 40%;
		z-index: 1000;
		position: absolute;
		margin-left: 180px;
		top: 25px;
		background: @white;
		padding: 30px 25px;
		border: 8px solid @blueGreen;
		div.alphaWrapper {
			padding: 5px;
			h4 {
				margin-top: 0;
				font-family: @font5;
				font-size: 16px;
			}
			form#responseName {
				display: none;
				margin-top: 15px;
				padding-bottom: 42px;
				position: relative;
				margin-bottom: 30px;
				.control-label {
					text-align: left;
				}
				label {
					clear: left;
					font-family: @font5;
					color: @grey6;
					margin-top: 14px;
					margin-right: 5px;
				}
				input{
					height: 40px;
					width: 100%;
					font-size: 14px;
					.insetShadow(0;0;3px;rgba(0,0,0,0.3));
					font-weight: 400;
				}
				input.active {
					border-color: @red1;
				}
				button {
					position: relative;
					float: right;
					right: 5px;
					top: 5px;
					padding: 15px 27px;
					font-size: 16px;
					margin-top: 15px;
				}
				p {
					display: none;
					width: 50%;
					position: absolute;
					top: 102px;
					font-size: 11px;
					color: @red1;
				}
				p.active {
					display: block;
				}
			}
			form#responseName.active{
				display:block;
			}
		}
	}
	div#exportAlpha.alpha {
		top: 80px;
	}
	div#duplicateAlpha.alpha {
		width: 40%;
		z-index: 1000;
		position: absolute;
		margin-left: 180px;
		top: 25px;
		background: @white;
		padding: 30px 25px;
		border: 8px solid @blueGreen;
		div.alphaWrapper {
			padding: 5px;
			h4 {
				margin-top: 0;
				font-family: @font5;
				font-size: 16px;
			}
		}
	}
	div.recipientAlpha.alpha {
		width: 40%;
		z-index: 1000;
		position: absolute;
		margin-left: 180px;
		top: 25px;
		background: @white;
		padding: 30px 25px;
		border: 8px solid @blueGreen;
		div.alphaWrapper {
			padding: 5px;
			h4 {
				margin-top: 0;
				font-family: @font5;
				font-size: 20px;
			}
			ul.recipientList {
				margin-left: 5px;
				li {
					width: 100%;
				}
			}
		}
	}
	div#recipientAlpha.alpha.active {
		display: block;
	}
	a:hover {
		text-decoration: none;
	}
	div#loadingHolder {
		position: absolute;
		bottom: 0;
		height: 50px;
		width: 72%;
		left: 85px;
		div.spinnerHolder {
			width: 40px;
		}
	}
	div#itemsLoadedHolder {
		position: absolute;
		bottom: 10px;
		left: 295px;
		height: 30px;
		div#allItemsLoaded {
			display: none;
		}
		div#allItemsLoaded.active {
			display: block;
		}
	}
	.divider2 {
		float: left;
		margin: 0 8px;
		position: relative;
		top: -1px;
		height: 19px;
		border-right: 1px solid darken(@greenGrey3,15%);
	}
	div.feedOptions {
		position: fixed;
		width: 940px;
		height: 50px;
		padding: 18px 15px;
		background: @grey2;
		border-bottom: 1px solid @grey4;
		.boxShadow(0;2px;1px;-1px;rgba(0,0,0,0.3));
		z-index: 999;
		.selectOptions {
			position: relative;
			top: -2px;
			width: 240px;
			margin-left: 20px;
			float: left;
			a {
				float: left;
			}
			a.selectAll {
				.fontStyle(@grey7;13px;400);
			}
			a.selectAll.disabled {
				color: @grey5;
				cursor: default;
			}
			a.replyAll {
				.fontStyle(@blueLight;13px;400);
				i {
					margin-right: 5px;
				}
			}
			a.replyAll.disabled {
				color: @grey5;
				cursor: default;
			}
		}
		.refreshHolder {
			float: right;
			position: relative;
			top: -11px;
			right: 20px;
			button#export {
				margin: 0 8px;
			}
		}
	}
	ul.feed {
		float: left;
		width: 72%;
		padding-top: 20px;
		margin: 0;
		position: relative;
		left: 22px;
		top: 32px;
		.slideMed;
		
		div.timeBreak {
			padding: 0 15px;
			width: 95%;
			margin-left: 5%;
			margin-bottom: 25px;
			.breakLeft {
				float: left;
				width: 38%;
				height: 4px;
				background: @grey4;
			}
			span {
				position: relative;
				top: -20px;
				float: left;
				width: 24%;
				text-align: center;
				.fontStyle(@grey5;16px;400);
			}
			.breakRight {
				float: right;
				width: 38%;
				height: 4px;
				background: @grey4;
			}
		}
		ul.batchRecipients {
			width: 80%;
			margin: 0 10%;
			margin-top: 45px;
			li.info {
				height: 25px;
				display: inline-block;
				p.responseEmail {
					margin-right: 0 !important;
					float: left;
					.fontStyle(@newBlueLight;16px;600) !important;
					i {
						margin-right: 10px;
					}
				}
				span.eventCount {
					position: relative;
					top: 2px;
					float: left;
					.fontStyle(@grey7;14px;700);
					margin-right: 10px;
				}
			}
		}
		li.response {
			margin-top: 10px;
			margin-bottom: 90px;
			width: 100%;
			position: relative;
			.cbWrapper.select {
				margin-left: 8px;
				padding: 3px;
				clear: left;
				float: left;
				width: 20px;
				height: 20px;
				position: relative;
				button {
					position: absolute; 
					top: 3px;
					left: 3px;
					width: 14px;
					height: 14px;
					i {
						font-size: 13px;
						margin-left: 1px;
					}
				}
			}
			div.info {
				position: absolute;
				left: 55px;
				p.responseEmail {
					margin-right: 0 !important;
					float: left;
					.fontStyle(@newBlueLight;16px;600) !important;
					i {
						margin-right: 10px;
					}
				}
				span.eventCount, span.recipientCount {
					position: relative;
					top: 2px;
					float: left;
					.fontStyle(@grey7;14px;700);
				}
				span.recipientCount {
					margin-left: 4px;
				}
			}
			a.reply {
				float: right;
				.fontStyle(@blueLight;14px;400);
				i {
					margin-right: 5px;
				}
			}
			a.reply:hover {
				color: lighten(@blueLight,5%);
			}
			a.reply.replied {
				cursor: default;
				color: @buttonGreen;
			}
			div.responseBody:before {
				content: '';
				display: block;
				position: absolute;
				top: -14px;
				left: 25px;
				width: 0;
				height: 0;
				border-style: solid;
				border-width: 0 14px 14px 14px;
				border-color: transparent transparent lighten(@blueGreen, 7%) transparent;
			}
			div.responseBody:after {
				content: '';
				display: block;
				position: absolute;
				top: -11px;
				left: 27px;
				width: 0;
				height: 0;
				border-style: solid;
				border-width: 0 12px 12px 12px;
				border-color: transparent transparent @greenGrey1 transparent;
			}

			div.responseBody {
				position: relative;
				top: 36px;
				width: 94%;
				margin-left: 6%;
				border: 2px solid lighten(@blueGreen, 7%);
				.radius;
				background: @greenGrey1;
				ul.responseList {
					width: 100%;
					padding-top: 25px;
					li.responseItem {
						width: 90%;
						margin: 5px 5%;
						margin-bottom: 30px;
						padding: 10px 0;
						position: relative;
						top: -20px;
						h4, h3 {
							padding-left: 10px;
							position: relative;
							top: 0;
							float: left;
							clear: left;
							width: 100%;
							margin-bottom: 2px;
							.fontStyle(@grey7;18px;300);
							text-transform: uppercase;
						}
						h4.response {
							text-transform: none;
							span {
								text-transform: none;
								color: @blueGreen;
							}
						}
						.responseDataWrapper {
							position: relative;
							top: 40px;
							width: 100%;
							background: @white;
							.radius;
							border: 5px solid @greenGrey4;
							.boxShadow(0;0;2px;rgba(0,0,0,0.2));
						}
						.responseDataWrapper.response {
							top: 24px;
						}
					}
					li#satResponse {
						.responseDataWrapper {
							height: 122px;
							position: relative;
							i.satResponseData {
								position: relative;
								top: 15px;
								left: 70px;
								display: block;
								height: 70px;
								width: 70px;
								.radius(35px);
								background: @blueGreen;
								text-align: center;
								.fontStyle(@white;42px;500);
								line-height: 17px;
								font-style: normal;
								border: 5px solid lighten(@blueGreen,20%);
							}
							label {
								position: relative;
								left: 65px;
								width: 80px;
								text-align: center;
								top: 15px;
								float: left;
								clear: left;
								text-transform: uppercase;
								.fontStyle(@grey7;14px;400);
							}
							p.result {
								width: 240px;
								position: absolute;
								left: 175px;
								top: 25px;
								text-transform: uppercase;
								.fontStyle(@blueGreen;40px;500);
							}
						}
					}
					li#rateResponse {
						.responseDataWrapper {
							min-height: 122px;
							position: relative;
						}
						div.ratingsResponseData {
							float: left;
							position: absolute;
							top: 10px;
							left: 59px;
							display: block;
							width: 90px;
							height: 90px;
							img {
								position: absolute;
								top: 0;
								left: 0;
								width: 100%;
								height: 100%;
							}
							span {
								width: 100%;
								text-align: center;
								float: left;
								top: 36px;
								margin: 0;
								position: absolute;
								font-style: normal;
								.fontStyle(@white;20px;500) !important;
							}
							p.result {
								width: 340px;
								position: absolute;
								left: 116px;
								top: 20px;
								text-transform: uppercase;
								.fontStyle(@blueGreen;40px;500);
							}
						}
						label.dataLabel {
							position: absolute;
							left: 65px;
							width: 80px;
							text-align: center;
							top: 136px;
							float: left;
							clear: left;
							text-transform: uppercase;
							.fontStyle(@grey7;14px;400);
						}
						ul#fbMetrics {
							position: relative;
							margin: 0;
							left: 175px;
							top: 35px;
							width: 400px;
							padding: 0;
							li {
								padding-left: 0;
								padding-bottom: 0;
								border: none;
								position: relative;
								height: 45px;
								label {
									position: absolute;
									top: 12px;
									left: -10px;
									margin-top: 0;
									font-size: 18px;
									color: @blueGreen;
									text-align: right;
								}
								.rateit {
									position: absolute;
									left: 100px;
									top: 5px;
								}
								.value {
									margin-top: 0;
									position: absolute;
									left: 270px;
									width: 120px;
								}
							}
						}
					}
					li#reviewResponse {
						.responseDataWrapper {
							height: 122px;
							i {
								position: relative;
								top: 10px;
								left: 65px;
								display: block;
								height: 80px;
								width: 80px;
								img {
									position: relative;
									top: -20px;
									height: 100%;
									width: 100%;
								}
							}
							p.result {
								width: 340px;
								position: relative;
								left: 175px;
								top: -52px;
								text-transform: uppercase;
								.fontStyle(@blueGreen;40px;500);
							}
						}
					}
					li#commentsResponse {
						.responseDataWrapper {
							padding: 20px;
						}
						p {
							.fontStyle(@grey7;14px;400) !important;
							line-height: 16px;
						}
					}
					li#surveyResponse {
						.responseDataWrapper {
							min-height: 185px;
						}
						.cbWrapper.big {
							position: relative;	
							width: 90px;
							height: 90px;
							top: 35px;
							left: 60px;
							padding: 10px;
							button.checkBox {
								width: 70px;
								height: 70px;
								position: relative;
								top: -16px;
								left: 0;
								font-size: 50px;
								cursor: default;
							}
						}
						label.dataLabel {
							position: relative;
							width: 90px;
							text-align: center;
							left: 60px;
							top: 40px;
							text-transform: uppercase;
							.fontStyle(@grey7;14px;400);
						}
						ul.surveyResults {
							width: 400px;
							position: relative;
							left: 175px;
							top: -76px;
							li {
								width: 133px;
								margin-bottom: 30px;
								float: left;
								.cbWrapper {
									float: left;
									width: 26px;
									height: 26px;
									margin-right: 6px;
									button.checkBox {
										position: relative;
										top: 3px;
										width: 16px;
										height: 16px;
										cursor: default;
										i {
											font-size: 14px;
										}
									}
								}
								label {
									margin-top: 6px;
									text-transform: uppercase;
									.fontStyle(@grey7;12px;400);
								}
							}
						}
					}
				}
				div.dateWrapper {
					width: 100%;
					height: 34px;
					padding: 6px 8px;
					background: @greenGrey5;
					border-top: 1px solid @grey4;
					.bottomRadius(6px);
					position: relative;
					a {
						position: absolute;
						left: 10px;	
					}
					p.date {
						float: right;
						margin: 0;
					}
					p.recipients {
						float: left;
						margin: 0;
						cursor: pointer;
						color: @blueGreen;
					}
					p.recipients:hover {
						color: darken(@blueGreen,10%);
					}
				}
			}
		}
		li.response.responded {
			top: 30px;
		}
		li.response.responded.batch {
			i.satData {
				text-align: center;
				display: inline-block;
				font-style: normal;
				padding: 8px 0;
				height: 34px;
				width: 34px;
				.radius(17px);
				background: @blueGreen;
				font-family: @font5;
				.fontStyle(@white;16px;400);
			}
			i.rateData {
				margin-top: 13px;
				margin-bottom: 6px;
				display: inline-block;
				height: 21px;
				width: 38px;
				img {
					height: 100%;
					width: 100%;
				}
			}
			i.reviewsData {
				display: inline-block;
				height: 34px;
				width: 34px;
				margin: 3px 6px;
				img {
					height: 100%;
					width: 100%;
				}
			}
			li.responseItem.batch {
				min-height: 120px;
				.responseDataWrapper {
					top: 0;
				}
				h4 {
					height: 42px;
					width: 50% !important;
					clear: none !important;
					p {
						display: inline-block;
					}
				}
			}
		}
		li.response.responded.first {
			top: 10px;
		}
	}
	ul.feed.responses {
		margin-top: -30px;
	}
	div.filterOptions {
		float: left;
		width: 198px;
		padding-bottom: 30px;
		right: -56px;
		top: 50px;
		position: relative;
		h3 {
			width: 160px;
			margin-top: 8px;
			margin-left: 18px;
			font-size: 18px;
		}
		.toggleList {
			position: relative;
			width: 100%;
			li {
				width: 80%;
				margin: 10px 10%;
				a {
					.radius;
					display: block;
					.fontStyle(@blueLight;16px;600);
				}
					a.active {
					text-decoration: none;
					padding: 5px 4px;
					border: 1px solid rgba(0,0,0,0.15);
					color: @grey7;
					cursor: default;
					background: lighten(@greenGrey1,2%);
					.insetDrop(0;0;1px;@white;0;1px;1px;rgba(0,0,0,0.3));
				}
			}
		}
		.dropdown {
			position: relative;
			width: 100%;
			margin: 15px 0;
			a.dropdown-toggle {
				.radius;
				background: @grey2;
				display: block;
				width: 151px;
				margin-left: 23px;
				padding: 6px 5px;
				text-align: left;
				.insetShadow(0;0;1px;rgba(0,0,0,0.3));
				span {
					text-transform: capitalize;
				}
				i {
					float: right;
					margin-right: 4px;
					margin-top: 3px;
				}
			}
			a:focus, a:hover {
				text-decoration: none;
				outline: none;
			}
			a.dropdown-toggle:hover {
				background: @greenGrey1;
				.insetShadow(0;0;1px;rgba(0,0,0,0.3));
			}
			.dropdown-menu {
				margin-left: 23px;
				width: 151px;
				background: @white;
				z-index: 998;
				li {
					a {
						padding: 8px;
						input {
							position: relative;
							top: -1px;
							margin-right: 6px;
						}
					}
					a:focus {
						background: @white;
					}
					a:hover {
						background: @white;
						cursor: default;
						color: rgba(0, 0, 0, 0.6);
					}
				}
			}
		}
		.dropdown.open, .dropdown.stayOpen {
			a.dropdown-toggle {
				.topRadius;
				text-decoration: none;
				padding: 5px 4px;
				border: 1px solid rgba(0,0,0,0.15);
				background: @greenGrey1;
				.insetDrop(0;0;1px;@white;0;1px;1px;rgba(0,0,0,0.3));
			}
			.dropdown-menu {
				display: block;
			}
		}
		a#applyFilters {
			display: block;
			margin-left: 23px;
			margin-right: 23px;
		}
		a.clear {
			clear: left;
			position: relative;
			top: 20px;
			margin-left: 55px;
		}
		a.clear:hover {
			text-decoration: underline;
		}
	}
	a.topButton {
		color: darken(@grey3,4%);
		bottom: 15px;
		left: 0;
		font-size: 36px;
		position: fixed;
		.fade;
		opacity: 1 !important;
	}
	a.topButton.absolute {
		position: absolute;
	}
	a.topButton.hidden {
		visibility: visible !important;
		opacity: 0 !important;
		display: block !important;
	}
}


/*REPLY UI*/

.groupWrapper {
	z-index: 1000;
	display: none;
	background: @lightGreen1;
	position: absolute;
	margin-left: 60px;
	top: 140px;
	h3 {
		margin-left: 10px;
		.fontStyle(@white;18px;500);
	}
}
#reply {
	float: right;
	margin: 15px 11px;
	.heightAndWidth(258px;589px);
	border: 1px solid @grey6;
	background: lighten(@greenGrey1,3%);

	h3 {
		padding-left: 10px;
		color: darken(@blueGrey5, 10%);
	}

	form {
		padding: 10px;

		.btn {
			background: @white !important;
			color: @grey7;
			.textShadow(0;0;1px;@grey3);
		}

		.dropdown-toggle {
			width: 130px;
		}

		i.fa-font, i.fa-caret-down {
			top: 0px;
		}

		iframe.wysihtml5-sandbox {
			width: 567px !important;
			height: 150px !important;
		}

		button.submit {
			margin: 15px 0;
			border-color: @grey7;
		}
	}

}

body.login {
	background: @greenDarkNew;
	height: 100%;
	min-height: 790px;
	div.logoStatic {
		position: relative;
		padding-top: 50px;
		max-width: 1000px;
		z-index: 1001;
    width: 30%;
    margin: 0 35%;
    margin-bottom: 20px;
		a {
      width: 100%;
			display: block;
		}
		img {
			width: 100%;
		}
		p {
			margin-top: 15px;
			font-family: @font6;
			color: rgba(255,255,255,0.75);
			font-weight: 300;
			text-align: center;
			font-size: 24px;
			span {
				color: rgba(255,255,255,0.85);
				font-weight: 400;
				font-family: @font1;
			}
		}
		p.prompt.small {
			margin-top: 2px;
			font-size: 20px;
		}
		div.horizontalDiv {
			display: none;
			width: 62%;
			height: 0;
			margin: 0 19%;
			border-top: 3px solid rgba(255,255,255,0.25);
		}
		div.horizontalDiv.active {
			display: block;
		}
	}
	div.wrapper {
		max-height: 502px;
		padding-bottom: 20px;
		position: relative;
		background: rgba(0,0,0,0.3);
	}
	#login {
		position: relative;
		.radius();
		width: 420px;
		padding: 0;
		p {
			font-family: @font5;
			margin-top: 25px;
			margin-left: 30px;
			margin-right: 30px;
			color: rgba(255,255,255,0.8);
		}
		h2 {
			margin-left: 30px;
			font-size: 36px;
			color: rgba(255,255,255,0.9);	
		}
		h3 {
			margin-left: 30px;
			font-size: 24px;
			color: rgba(255,255,255,0.9);
		}
		a.btn.important {
			background: @brightBlueNew;
			font-family: @font5;
			padding: 15px 30px;
			font-size: 16px;
			font-weight: 600;
			.textShadow(1px;1px;0px;rgba(0,0,0,0.2));
			.insetDrop(0;-3px;0;0;rgba(0,0,0,0.3);0;2px;3px;-1px;rgba(0,0,0,0.2));
		}
		a.btn.important:hover {
			background: lighten(@brightBlueNew,8%);
		}
		form {
			float: left;
			position: relative;
			margin-left: 30px;
			width: 360px;
			margin-bottom: 30px;
			.control-label {
				text-align: left;
			}
			label {
				font-family: @font5;
				color: rgba(255,255,255,0.8);
				margin-top: 8px;
			}
			input[type="text"], input[type="password"], input[type="email"] {
				height: 40px;
				width: 360px;
				font-size: 14px;
				.insetShadow(0;0;3px;rgba(0,0,0,0.3));
				font-weight: 400;
			}
			div.remember {
				margin-top: 20px; 
				height: 20px;
				p {
					font-family: @font5;
					float:left;
					margin: 0;
					margin-right: 10px;
					color: @grey2;
					padding-right: 10px;
					input {
						position: relative;
						top: -2px;
						margin-right: 5px;
					}
					a {
						color: @grey2;
						font-weight: 400;
					}
					a:hover {
						color: @grey3;
						text-decoration: underline;
					}
				}
				p:first-child {
					border-right: 1px solid darken(@grey3,4%);
				}
			}
			.buttonHolder {
				margin-top: 30px;
				input.btn.important {
					background: @brightBlueNew;
					font-family: @font5;
					padding: 15px 30px;
					font-size: 16px;
					font-weight: 600;
					.textShadow(1px;1px;0px;rgba(0,0,0,0.2));
					.insetDrop(0;-3px;0;0;rgba(0,0,0,0.3);0;2px;3px;-1px;rgba(0,0,0,0.2));
				}
				input.btn.important:hover {
					background: lighten(@brightBlueNew,8%);
				}
			}
			div.error {
				width: 100%;
				padding: 14px 20px;
				margin-top: 6px;
				margin-bottom: 4px;
				.radius;
				p {
					font-family: @font5;
					margin: 0;
					color: rgba(255,255,255,0.9);
					font-weight: 600;
					a {
					color: rgba(255,255,255,0.9);
						text-decoration: underline;
						font-weight: 700;
					}
					a:hover {
						color: @grey3;
					}
				}
			}
		}
	}
	#login.resetConfirm {
		width: 700px;
		div#pwReqs {
			float: left;
			width: 40%;
			margin-top: 84px;
			padding: 0 10%;
			font-family: @font5;
			h4 {
				font-family: @font5;
				.fontStyle(rgba(255,255,255,0.9);14px;600);
			}
			ul.pwReqs {
				margin-left: 10px;
				li {
					.fontStyle(@grey2;12px;400);
				}
			}
		}
		.control-group {
			.control-label {
				label {
					float: left;
				}
				i.fa-check-circle {
			 		float: left;
			 		position: relative;
			 		top: 6px;
			 		left: 5px;
			 		color: @buttonGreen;
			 		font-size: 20px;
			 	}
			}
			.controls {
				input.valid {
					border: 1px solid @buttonGreen;
				}
			}
		}
		form {
			float: left;
			p {
				margin-left: 0;
				font-size: 24px;
			}
		}
		h1 {
			width: 100%;
			text-align: center;
			font-family: @font5;
			color: @white;
			font-size: 18px;
		}
		h3 {
			font-size: 14px;
			padding: 0 20%;
		}
	}
	#login.logout, #login.resetDone {
		padding: 40px;
		height: 200px;
		font-family: @font5;
		p {
			color: rgba(255,255,255,0.9);
			margin-top: 15px;
			font-size: 20px;
		}
	}
	footer.main.big {
		border-top: 1px solid rgba(255,255,255,0.3);
			.insetShadow(0;2px;3px;rgba(255,255,255,0.1));

		.container {
			ul.social {
				right: -455px;
			}
		}
	}
}


/*Step Error Alpha Screen*/
.alpha.setupProgress {
	display: none;
	height: 500px;
	width: 80%;
	margin-left: 10%;
	z-index: 1000;
	position: absolute;
	top: 80px;
	background: @white;
	.radius;
	padding: 25px;
	button {
		position: relative;
		bottom: 5px;
		width: 20%;
		margin: 0 40%;
	}
	h3 {
		.fontStyle(@green;22px;400);
	}
	p.stepError {
		.fontStyle(@red1;12px;600);
	}
	
}

.alpha.setupProgress.active {
	display: block;
}



/*Self Assessment Alpha screen*/
.alpha.selfAssessment {
	z-index: 1000 !important;
	margin: 120px auto;
	border: 1px solid @grey3;
	width: 760px;
	padding: 10px 20px;
	.radius(7px);
	background: #fff;

	h3 {
		margin-top: 5px;
		text-align: center;
		font-family: @font1;
		padding-bottom: 5px;
		border-bottom: 2px solid @green;
		.fontStyle(@green;26px;600);
	}
	p.assessmentPrompt {
		margin: auto;
		width: 70%;
		margin-top: 5px;
		text-align: center;
		font-family: @font3;
		.fontStyle(@grey7;14px;600);
	}
	li.question {
		display: none;
		.slide;
		height: 70px;
		text-align: center;
		.fontStyle(@grey6;18px;500);
		margin-top: 40px;
		div.answer {
			margin: 40px 9px;
			width: 125px;
			float: left;
			input {
				display: block;
				margin: auto;
			}
			label {
				text-align: center;
				.fontStyle(@grey7;12px;500);
			}
		}
	}

	.navButtons {
		width: 185px;
		margin: auto;
		button {
			width: 80px;
			float: right;
		}
		.previous {
			opacity: 0.3;
			margin-right: 15px;
		}
		.previous.active {
			opacity: 1;
		}
		.submit {
			display: none;
		}
	}

}

#selfAssessmentOverlay{
	z-index: -1;
	position: fixed;
	top: 0px;
	height: 100%;
	width: 100%;
	background: rgba(0,0,0,0.5);
}



/*Pricing Page */
#pricing {
	position: relative;
	top: -35px;
	margin: auto;
	width: 1000px;
	padding: 0 20px;
	.pricing {
		font-family: @font3;
		width: 98%;
		margin-top: 195px;
		margin-left: 1%;
		height: 2000px;
		position: relative;
		h2 {
			.fontStyle(@grey7;26px;400);
			position: absolute;
			top: -22px;
			padding-left: 9px;
			margin-left: 6px;
			width: 280px;
			border-bottom: 3px solid @grey4;
		}
		ul {
			float: left;
			margin: 0 5px;
			li {
				padding: 15px 15px;
				margin: 2px 0;
				display: block;
				width: 100%;
				height: 50px;
				background: lighten(@grey3,3%);
			}
			li.alternate {
				background: lighten(@grey3,7%);
			}
			li.header {
				background: none;
			}
			li.events {
				padding: 5px 15px;
			}
			h4 {
				font-family: @font1;
				margin-top: 0px;
			}
		}
		ul.labels {
			width: 280px;
			.title {
				height: 40px;
				padding: 0px;
				background: none;
				h4 {
					border-bottom: 2px solid @grey7;
					position: relative;
					top: 5px;
					margin-left: 12px;
					.fontStyle(@green;30px;700);
				}
			}
			li.header {
				h4 {
					margin-top: 9px;
					.fontStyle(@grey7;16px;700);
				}
			}
		}
		ul.free, ul.basic, ul.advanced {
			text-align: center;
			width: 205px;
			position: relative;
			top: -8px;
			.title {
				height: 50px;
				position: relative;
				top: -112px;
				background: @bgBlue;
				color: @white;
				.topRadius;
				padding: 15px 0;
			}
			.header {
				padding: 3px 0;
				a.btn {
					position: relative;
					top: -2px;
					padding: 0 20px;
					width: 80%;
					margin: 1% 10%;
					line-height: 43px;
					height: 43px;
					.insetShadow(0;-4px;0;0;rgba(0,0,0,0.3));
					.radius;
				}
			}
			.price {
				height: 105px;
				position: absolute;
				top: -60px;
				background: @greenGrey1;
				padding: 0;
				span.amount {
					.fontStyle(@blueDark;16px;400);
					b {
						.fontStyle(@blueDark;45px;400);
					}
				}
				span.amount.subscriber {
					text-align: center;
					width: 60%;
					margin: 0 15%;
					border-bottom: 2px solid @grey4;
					position: relative;
					top: -12px;
					font-size: 12px;
				}
				span.amount.trial {
					position: relative;
					top: -6px;
				}
			}

		}
		.fa-check {
			margin-top: 1px;
			font-size: 20px;
			color: @green;
		}
	}
}
.pricing {
	margin: 60px;
	.plan {
		float: left;
		margin: 0px;
		border-top: 1px solid @grey6;
		li {
			height: 70px;
			width: 100px;
			padding: 10px;
			border: solid @grey6;
			border-width: 0 1px 1px 1px;
		}
	}
}


/*Signup Stuff*/

#signup {
	padding: 40px 0;
	padding-bottom: 20px;
	h1 {
		margin-top: -7px;
		text-align: center;
		.fontStyle(@green;32px;300);
		margin-bottom: 0;
		font-family: @font1;
	}
	h2 {
		margin-top: -3px;
		text-align: center;
		font-family: @font5;
		.fontStyle(@bgBlue;18px;500);
		span {
			.fontStyle(lighten(@green,10%);18px;300);
		}
	}
	h1.thanks {
		font-size: 32px;
		margin-top: 20%;
		font-weight: 500;
		padding: 0 60px;
		font-family: @font5;
	}

	h2.thanks {
		margin-top: 15px;
		font-size: 26px;
		color: @blueGreen;
	}

	.seal {
		margin-top: 55px;
		width: 30%;
		margin-left: 35%;
		img {
			width: 100%;
		}
	}

	form {
		margin: auto;
		margin-top: 40px;
		padding: 10px;
		width: 60%;
		.radius;
		ul.steps {
			width: 100%;	
			margin-top: 27px;
			margin-bottom: 78px;
			height: 9px;
			.insetShadow(0;0;1px;1px;lighten(@green,2%));
			.radius(3px);
			position: relative;
			li.step {
				position: absolute;
				top: -18px;
				padding: 2px;
				height: 46px;
				width: 46px;
				.radius(40px);
				background: @grey2;
				.insetShadow(0;0;1px;1px;lighten(@grey2,2%));
				border: 1px solid @green;
				.wrapper {
					height: 40px;
					width: 40px;
					background: @grey3;
					.radius(42px);
					p {
						text-align: center;
						padding: 8px;
						.fontStyle(@grey6;18px;600);
					}
					i {
						text-align: center;
						.fontStyle(@white;18px;600);
						display: none;
						padding-top: 11px;
						padding-left: 2px;
					}
				}
				span {
					text-transform: uppercase;
					text-align: center;
					width: 200px;
					position: relative;
					top: 8px;
					left: -80px;
					.fontStyle(darken(@bgBlue,15%);14px;600);
				}
			}
			li.complete {
				.insetShadow(0;0;1px;1px;lighten(@green,2%));
				.wrapper {
					background: lighten(@green,12%);
					p {
						display: none;
					}
					i {
						display: block;
					}
				}
			}
			li.active {
				.insetShadow(0;0;1px;1px;lighten(@green,2%));
				.wrapper {
					background: @green;
					p {
						.fontStyle(@white;18px;600);
					}
				}
				span {
					color: @green;
					font-size: 20px;
				}
			}
			li#step1 {
				float: left;
				left: -1px;
			}
			li#step2 {
				left: 47%;
			}
			li#step3 {
				float: right;
				right: -1px;
			}
			.progress {
				opacity: 0.5;
				display: block;
				position: absolute;
				height: 7px;
				background: @lightGreen1;
			}
		}
		.container.sealImg {
			width: 200px;
			img {
				width: 100%;
			}
		}
		h3.complete {
			padding: 0 30px;
			line-height: 45px;
			text-align: center;
			font-family: @font5;
			margin-top: 26%;
			.fontStyle(rgba(0,0,0,0.75);26px;600);
		}
		label.mobile {
			display: none;
		}
		table {
			margin-top: 0;
			margin-bottom: 50px;
			position: relative;
			tr {
				height: 55px;
				padding-bottom: 30px;
			}
			th {
				width: 100%;
				padding: 0;
				label {
					width: 330px;
					.fontStyle(@grey6;16px;700);
				}
			}
			td {
				margin-top: 55px;
				position: absolute;
				width: 98%;
				margin-left: 1%;
				left: 0px;
				float: none;
				input[type="text"], input[type="email"] {
					height: 40px;
					width: 98%;
					margin-left: 1%;
					.insetShadow(0;1px;2px;rgba(0,0,0,0.15));
				}
				input[type="text"]:hover, input[type="email"]:hover {
		 			.insetShadow(0;0;2px;lighten(@green,10%));
			 	}
			 	input[type="text"]:focus, input[type="email"]:focus {
			 		border: 1px solid @grey6;
			 		outline: none;
			 		.insetShadow(0;0;1px;2px;lighten(@green,22%));
			 	}
			}
		}


		table.basic {
			width: 100%;
			margin: 0 auto; 
			max-width: 430px;
			padding: 0 2%;
			tr {
				height: 84px;
				padding-bottom: 0px !important;
			}
			th {
				padding: 0px;
				label {
					margin-left: 2%;
				}
			}
			td {
				margin-top: 55px;
			}
			ul.errorlist {
				position: absolute;
				margin-bottom: 0px;
				padding: 0;
				top: -24px;
				left: 103px;
		 		border-bottom: none;
				li {
					padding: 1px 15px;
					.radius;
					height: 18px;
					background: rgba(0,0,0,0.6);
					text-align: center;
					color: @white;
					font-size: 11px;
				}
				li:before {
					z-index: 951;
					border-left: 5px solid transparent;
					border-top: 5px solid transparent;
					border-bottom: 5px solid transparent;
					border-right: 5px solid rgba(0,0,0,0.6);
					content: '';
					display: block;
					position: absolute;
					top: 4px;
					left: -10px;
				}
			}
			tr:nth-child(3) {
				td {
					ul.errorlist {
						left: 63px;
					}
				}
			}
			tr:nth-child(4) {
				td {
					ul.errorlist {
						left: 95px;
					}
				}
			}
		}

		table.requirements {
			width: 100%;
			height: 20px;
			display: none;
		}

		.btn {
			border: none;
			height: 50px;
			background: lighten(@green,20%);
			.fontStyle(@white;18px;400);
			.textShadow(0;1px;0px;rgba(0, 0, 0, 0.3));
			min-width: 160px;
			width: 90%;
		}
		.button.container {
			margin: 40px auto;
			max-width: 430px;
			padding: 0 1%;
			input[type="submit"] {
				width: 98%;
				margin-left: 1%;
				background: @green;
			}
		}
	}
	form.basic {
		margin-top: 55px;
	}
}

/*Checkboxes*/
.cbWrapper {
	position: relative;
	height: 35px;
	width: 35px;
	background: rgba(0,0,0,0.12);
	.insetShadow(0;0;1px;rgba(0,0,0,0.3));
}

.checkBox {	
	position: absolute;
	top: 5px;
	left: 5px;
	background: @lightGreen2;
	.insetShadow(0;0;1px;@lightGreen1);
	border: none;
	padding: 0;
	height: 25px;
	width: 25px;
	.fontStyle(rgba(255,255,255,0.95);26px;400);
	i {
		display: none;
	}
}

.checkBox.hover {
	background: @green;
	i {
		display: block;
		opacity: 0.85;
	}
}

.checkBox.deselected {	
	background: @lightGreen2;
	i {
		display: none;
	}
}

.checkBox.active {
	background: @green;
	i {
		opacity: 1;
		display: block;
	}
}

.checkBox:focus {
	outline: none;
}

/*Self Assessment */
#signup.selfAssessment {
	form {
		.container.sealImg {
		}
	}
	.navButtons {
		z-index: 1;
		width: 100%;
		height: 100px;
		position: relative;
		top: -5px;
		li {
			float: left;
			position: absolute;
			margin-bottom: 15px;
		}
		li.left {
			top: -72px;
			left: 0px;
		}
		li.right {
			top: -72px;
			right: 0px;
		}
		a {
			.fontStyle(@green;60px;400);
		}
		a#left {
			display: none;
		}
		a.disabled {
			opacity: 0.5;
			cursor: default;
		}
	}
	table.selfAssessment {
		width: 82%;
		margin: 0 9%;
		margin-top: 30px;
		tr {
			width: 100%;
			height: 120px;
		}
		td {
			margin-top: 20px;
		}
		th {
			margin-top: 20px;
			position: relative;
			float: left;
			label {
				text-align: center;
				width: 100%;
				font-size: 24px;
				padding: 0;
			}
		}
	 	ul {
	 		float: left;
	 		margin-bottom: 10px;
	 		padding-bottom: 6px;
	 		position: relative;
	 		width: 100%;
	 		top: 130px;
	 		li {
	 			float: left;
	 			margin: 0;
	 			width: 20%;
	 			label {
	 				position: relative;
	 				left: 10%;
	 				width: 80%;
	 				text-align: center;
	 				.fontStyle(@grey7;14px;400);
	 				input {
	 					display: none;
	 				}
	 			}
	 		}
	 	}
		ul.errorlist {
			background: rgba(255,74,74,0.35);
			width: 100%;
			height: 53px;
			position: absolute;
			left: 0;
			top: 45px;
			margin-bottom: 0px;
			padding-bottom: 0px;
	 		border-bottom: none;
			li {
				width: 100%;
				text-align: center;
				color: @grey6;
				font-size: 10px;
			}
		}
	}
	ul.cb {
		z-index: 1000;
		height: 40px;
		position: relative;
		top: -10px;
		width: 80%;
		margin-left: 10%;
		div.count {
			position: absolute;
			top: -130px;
			width: 100%;
			p {
				.fontStyle(@grey7;20px;600);
				width: 100%;
				text-align: center;
			}
		}
		li {
			float: left;
			width: 20%;
			.cbWrapper {
				margin: auto;
			}
		}
	}
	.button.container {
		margin-top: 0;
	}
}

#signup.requirements {
	#reasons {
		margin-top: 10px;
		width: 80%;
		margin-left: 10%;
		padding: 0;
		ul.reasons {
			height: 358px;
			li {
				margin: 10px 0;
				width: 100%;
				float: left;
				height: 60px !important;
				padding: 12px;
				.cbWrapper {
					float: left;
					position: relative;
					left: -15px;
					margin: 6px 1px;
				}
				p {
					width: 89%;
					float: left;
					.fontStyle(@grey7;18px;600);
					font-family: @font5;
					span {
						font-size: 16px;
					}
					img {
						position: relative;
						left: -15px;
						top: -10px;
						margin: 2px;
						width: 70px;
						float: left;
					}
				}
			}
		}
	}
}


/*home1 About*/
#about {
	.div {
			background: @bgBlue;
			h3 {
				text-align: center;
				.fontStyle(@white;28px;500);
				margin-bottom: none;
				position: relative;
				top: 28%;
			}
	}
	#div2 {
		background: @lightGreen;
		border-top: 1px solid rgba(255,255,255,0.4);
		width: 100%;
		height: 4px;
		.boxShadow(0;1px;1px;rgba(0,0,0,0.4));
	}
	ul.hiw {
		padding: 0 40px;
		padding-top: 40px;
		h3 {
			text-align: center;
			font-family: @font5;
			text-transform: uppercase;
			.fontStyle(darken(@grey7,10%);40px;400);
		}
		li {
			margin-top: 30px;
			float: left;
			display: block;
			width: 100%;
			height: 200px;
			margin: 2%;
			img {
				float: right;
				width: 210px;
				margin-top: 35px;
				margin-right: 100px;
			}

			span.badge {
				float: left;
				background: lighten(@green,20%);
				height: 75px;
				padding-top: 13px;
				width: 75px;
				font-family: @font5;
				font-size: 45px;
				margin-top: 95px;
				margin-left: 25px;
				margin-right: 25px;
			}
			p {
				margin-top: 112px;
				width: 60%;
				float: left;
				line-height: 22px;
				font-family: @font5;
				.fontStyle(@grey7;18px;400);
				b {
					line-height: 16px;
					.fontStyle(lighten(@green,20%);20px;600);
				}
			}
		}
		li.alt {
			img {
				float: left;
			}
			span.badge {
				background: @green;
			}
		}
	}
}

.home2 {
	#mainPrompt {
		background: url('@{base}/images/bgFade3.png');
		h1 {
			text-align: center;
			font-family: @font5 !important;
			.fontStyle(rgba(255,255,255,0.93);48px;300);
			.textShadow(0;1px;0;rgba(0,0,0,0.2));
			b {
				.fontStyle(rgba(255,255,255,0.99);48px;600);
			}
		}
		h2 {
			.fontStyle(rgba(255,255,255,0.96);24px;300) !important;
		}
		a#IW { 
			display: block;
			width: 320px;
			position: relative;
			top: 10px;
			margin: 30px auto;
			padding: 7px 14px;
			/*
			background: rgba(255,255,255,0.85);
			.insetShadow(0;1px;1px;@white);
			border: 1px solid rgba(255,255,255,0.9);
			*/
			.radius(10px);
			img.seal {
				width: 100%;
				opacity: 0.9;
			}

		}
		a#IW:hover {
			text-decoration: none;
		}
		a.btn {
			padding: 12px 0;
			border : none;
			.insetDrop(0;0;1px;rgba(255,255,255,0.85);0;1px;0;rgba(0,0,0,0.5));
			display: block;
			width: 320px;
			position: relative;
			top: -4px;
			margin: 0 auto;
			.radius(7px);
			.noTextShadow;
			background: @green;
			.fontStyle(darken(@blue1,55%);24px;600);
		}
		a.btn:hover {
			transition: all 0.75s ease;
			.fontStyle(rgba(255,255,255,0.98);24px;600);
			.textShadow(0;0;2px;rgba(255,255,255,0.4));
			background: lighten(@green,7%);
		}
	}

	
}

section#about.start {
	bottom : 170%;
}

section#about.end {
	bottom : -210%;
}


.div {
	background: @bgBlue;
	h3 {
		text-align: center;
		.fontStyle(@white;28px;500);
		margin-bottom: none;
		position: relative;
		top: 28%;
	}
}
.div2 {
	opacity: 0.4;
	background: @lightGreen;
	border-top: 1px solid rgba(255,255,255,0.4);
	width: 100%;
	height: 4px;
	.boxShadow(0;1px;1px;rgba(0,0,0,0.4));
}
.div2#div2 {	
	margin-top: 65px;
}
#divTri {
	position: relative;
	top: -4px;
	display: block;
	width: 133px;
	height: 66px;
	background: url('@{base}images/divTri.png');
	margin: 0 auto;
	z-index: 2;
}
div.main {
	width: 100%;
	background: @darkBlue3;
	height: 900px;

	h3 {
		text-align: center;
		font-family: @font5 !important;
		.fontStyle(rgba(0,0,0,0.58);38px;600);
	}

	#trust {
		position: relative;
		top: 40px;
		width: 100%;
		display: block;
		background: lighten(@lightGreen1,20%);
		h2 {
			position: relative;
			top: 25px;
			font-family: @font5 !important;
			text-align: center;
			.fontStyle(@blue2;36px;600) !important;
			margin-bottom: 45px;
		}

		h3 {
			font-family: @font5 !important;
			text-align: center;
			.fontStyle(@grey7;22px;400);
			margin-bottom: 15px;
		}
		ul.hiw {
			width: 100%;
			margin-top: 20px;
			height: 360px;
			li {
				float: left;
				width: 25%;
				img {
					margin-left: 20%;
					width: 60%;
				}
				h4 {
					font-family: @font5 !important;
					text-align: center;
					.fontStyle(lighten(@blue2,5%);24px;600);
				}
				p {
					font-family: @font5 !important;
					text-align: center;
					.fontStyle(rgba(0,0,0,0.55);14px;400);
					b {
						.fontStyle(rgba(0,0,0,0.75);14px;600);
					}

				}
			}
		}
		div#IWorthy {
			height: 750px;
			background: @blueDark;
			h2 {
				color: rgba(255,255,255,0.83) !important;
			}
			#reasons {
				display: block;
				padding: 0;
				width: 100%;
				margin-top: 40px;
				ul.reasons {
					width: 50%;
					margin-left: 25%;
					li {
						height: 150px;
						text-align: left;
						.fontStyle(rgba(255,255,255,0.85);36px;400);
						font-family: @font5 !important;
						img {
							position: relative;
							top: -27px;
							width: 140px;
							margin-right: 25px;
						}
						span {
							.fontStyle(rgba(255,255,255,255.75);18px;400);
						}
					}
				}
			}
		}
		div#VOS {
			height: 550px;
			background: lighten(@lightGreen1,20%);
			position: relative;
			.container {
				position: relative;
				h2 {
					width: 60%;
					margin: 0;
					margin-top: 170px;
				}
				p {
					width: 55%;
					margin: 40px 25px !important;
					line-height: 26px;
					height: 150px;
					text-align: left;
					.fontStyle(rgba(0,0,0,0.75);20px;400);
					font-family: @font5 !important;
				}
				img {
					width: 440px;
					position: relative;
					bottom: 358px;
					float: right;
					right: 0px;
				}
			}
		}
		div#benefits {
			height: 700px;
			background: @darkBlue3;
			position: relative;
			h2 {
				float: right;
				position: relative;
				top: -320px;
				color: rgba(255,255,255,0.83) !important;
			}
			ul.benefits {
				width: 50%;
				float: right;
				position: relative;
				top: -320px;
				margin-right: 15%;
				li {
					width: 100%;
					float: left;
					font-family: @font5 !important;
					.fontStyle(rgba(0,0,0,0.53);20px;400);
					margin: 12px 0;
					border-bottom: 2px solid rgba(255,255,255,0.2);
					padding-bottom: 22px;
					span {
						text-align: center;
						margin-right: 25px;
						margin-top: -4px;
						float: left;
						width: 60px;
						.radius(40px);
						height: 60px;
						background: @darkBlue3;
						line-height: 60px;
						.fontStyle(rgba(255,255,255,0.5);48px;600);
					}
				}
			}
		}
		div#getStarted {
			background: @white;
			height: 500px;
			h2 {
				text-align: center;
			}
			ul.getStarted {
				width: 70%;
				float: right;
				position: relative;
				top: -320px;
				margin-right: 15%;
				li {
					width: 100%;
					float: left;
					font-family: @font5 !important;
					.fontStyle(rgba(0,0,0,0.53);20px;400);
					margin: 12px 0;
					border-bottom: 2px solid rgba(255,255,255,0.2);
					padding-bottom: 22px;
					span {
						text-align: center;
						margin-right: 25px;
						margin-top: -4px;
						float: left;
						width: 60px;
						.radius(40px);
						height: 60px;
						background: @darkBlue3;
						line-height: 60px;
						.fontStyle(rgba(255,255,255,0.5);48px;600);
					}
				}
			}
		}
	}
}

/*The rateMessage Stuff */
div.rateMessage.container {
	width: 650px;
	height: 550px;
	position: relative;
	margin: 80px auto;
	background: @white;
	.boxShadow(0;0;1px;rgba(0,0,0,0.15));
}
div.rateMessage {
	h4 {
		.fontStyle(@grey7;16px;400);
	}
	.poweredBy {
		position: absolute;
		bottom: 3px;
		right: 4px;
		width: 200px;
	}
	.statusBar {
		width: 100%;
		height: 40px;
		background: @bgBlue;
		padding: 8px 5px;
		border: 1px solid darken(@bgBlue,5%);
		.insetShadow(0;0;1px;rgba(255,255,255,0.93));
		.fontStyle(@white;14px;400);
	}
	.messageWrapper {
		float: left;
		width: 399px;
		padding: 10px 0;
		margin: 5%;
		height: 399px;
		position: relative;
		.message {
			width: 100%;
			height: 399px;
			overflow: hidden;
			border: 5px solid @bgBlue;
			img {
				width: 100%;
			}
		}
		span.nav {
			display: none;
			position: absolute;
			top: 45%;
			font-size: 30px;
		}
		span.left {
			left: 5px;
		}
		span.right {
			right: 5px;
		}
	}
	.loyaltyPrompt {
		margin-top: 20px;
		float: left;
		width: 25%;
		h3 {
			.fontStyle(@grey7;18px;400);
		}
		.rating {
			width: 100%;
			span {
				text-align: center;
				width: 50%;
				float: left;
				font-size: 45px;
				i {
					cursor: pointer
				}
				i:hover {
					color: @green;
				}
			}
			span.selected {
				i {
					color: @green1;
				}
			}
		}
	}
}
/*The Loyalty Stuff */
body.loyalty {
	background-image: url("@{base}images/promptBG.png");
	background-color: lighten(@blueGrey2,3%);
}
div.loyalty {
	float: left;
	margin-top: 35px;
	margin-left: 60px;
	width: 300px;
	.radius;
	background: @grey2;
	border: 1px solid @white;
	.boxShadow(0;0;1px;rgba(0,0,0,0.4));
	h3 {
		margin-top: 0;
		padding-bottom: 3px;
		.fontStyle(@grey6;16px;400);
		border-bottom: 1px solid @grey4;
	}
	.nameCard {
		padding: 20px;
		width: 100%;
		height: 60px;
		.pic {
			width: 60px;
			height: 60px;
			float: left;
			margin-right: 20px;
			img {
				width: 60px;
			}
		}
		h4 {
			padding-top: 7px;
			.fontStyle(@blueDark;14px;400);
			margin-bottom: 0;
		}
		span {
			.fontStyle(@grey5;10px;400);
		}
	}
	div.total {
		padding: 20px;
		margin-top: 5px;
		width: 100%;
		float: none;
		height: 85px;
		margin-bottom: 10px;
		label {
			text-align: left;
			width: 100%;
			.fontStyle(@grey6;12px;400);
			margin-bottom: 0;
		}
		span.discount {
			margin-top: 10px;
			width: 100%;
			text-align: center;
			.fontStyle(@blueDark;50px;700);
			line-height: 35px;
			margin-bottom: 10px;
		}
		.meter {
			z-index: 999;
			position: relative;
			top: 19px;
			margin-top: 15px;
			margin-left: 0;
			width: 100%;
			.right {
				right: -4px;
			}
			.next {
				width: 100%;
				text-align: center;
				position: relative;
				top: 16px;
			}
		}
		#accountStats.stats {
			margin: 5px 0;
			margin-left: -3px;
			width: 110%;
			padding: 0;
			.socialAccounts {
				width: 100%;
				padding: 0;
				li {
					margin: 0 3px;
					float: left;
					width: 31px;
					height: 35px;
					a {
						color: @blueGreen;
						i {
							font-size: 33px;
						}
					}
				}
				li.sealSquare {
					margin-right: 4px;
					img {
						position: relative;
						top: 2px;
						width: 29px;
					}
				}
				li.add {
					a {
						position: relative;
						top: 6px;
						display: block;
						width: 22px;
						height: 22px;
						.radius(10px);
						background: @blueDark;
						color: @newBlueLight;
						i {
							font-size: 30px;
							position: relative;
							top: -4px;
							left: 0px;
							.textShadow(0;0;1px;@grey7);
						}
					}
					a:hover {
						color: @blueGreen;
						background: @white;
						i {
							.textShadow(0;0;1px;@grey3);
						}
					}
				}

			}
		}
	}
	div.divider {
		position: relative;
		top: 10px;
		width: 100%;
		height: 60px;
		background: @white;
		border-top: 1px solid rgba(0,0,0,0.15);
		border-bottom: 1px solid rgba(0,0,0,0.2);
	}
	div.stats {
		padding: 0 20px;
		margin-top: 30px;
		h3 {
			margin-bottom: 0;
		}
		p {
			margin-top: 10px;
			width: 100%;
			.fontStyle(@grey7;16px;700);
			button {
				float: right;
			}
		}
		span.expires {
			position: relative;
			top: -9px;
			.fontStyle(@grey7;12px;400);
		}
		ul.stats {
			li {
				height: 60px;
				border-top: 1px solid @grey3;
				line-height: 20px;
				float: left;
				width: 48%;
				margin-right: 2%;
				.fontStyle(@blueDark;40px;500);
				margin-bottom: 20px;
				label {
					position: relative;
					top: -10px;
					width: 100%;
					.fontStyle(@grey6;10px;400);
					margin-bottom: 0;
				}
			}
			li.left {
				border-right: 1px solid @grey3;
			}
		}
		div.feedback {
			.fontStyle(@blueDark;50px;400);
			line-height: 25px;
			label {
				position: relative;
				top: -10px;
				width: 100%;
				.fontStyle(@grey6;10px;400);
				margin-bottom: 0;
			}
			span {
				.fontStyle(@grey6;10px;400);
			}
		}
		div.feedback.signups {
			span {
				position: relative;
				margin-left: 4px;
				top: -10px;
				font-size: 14px;
			}
		}
	}
	#currentRewards.stats {
		margin-top: 30px;
	}
}
.mainLoyalty {
	float: left;
	margin: 15px 10px;
	width: 747px;
	padding: 20px;

	#brandLogo {
		position: relative;
		.radius;
		border: 1px solid @white;
		.boxShadow(0;0;1px;rgba(0,0,0,0.4));
		width: 100%;
		img.back {
			.radius;
			width: 100%;
		}
		#smallLogo {
			z-index: 999;
			.radius;
			position: absolute;
			left: 30px;
			top: 103px;
			height: 200px;
			width: 200px;
			background: @white;
			border: 1px solid @bgBlue;
			.insetShadow(0;0;1px;@grey7);
			img {
				margin: 15% 20%;
				margin-bottom: 5%;
				width: 60%;
			}

			h2 {				
				position: relative;
				.fontStyle(@grey7;20px;700);
				i {
					margin-left: 4px;
					color: @bgBlue;
				}
			}
		}
	}
	ul.nav {
		position: relative;
		top: -67px;
		float: right;	
		margin-top: 15px;
		border: 1px solid @white;
		.boxShadow(0;0;1px;rgba(0,0,0,0.4));
		width: 100%;
		background: @white;
		.bottomRadius;
		li {
			float: left;
			width: 16%;
			margin: 0 1%;
			a {
				position: relative;
				text-align: center;
				padding: 15px 0;
				i {
					display: none;
					text-align: center;
					color: @blueGreen;
					font-size: 30px;
					top: 39px;
					width: 20%;
					margin-left: 40%;
					position: absolute;
					.textShadow(0;1px;0;@white);
				}
				.selected {
					display: none;
					width: 100%;
					height: 3px;
					position: absolute;
					bottom: 0;
				}
			}
			a:hover {
				background: none;
				.selected {
					display: block;
					background: @bgBlue;
				}
			}
			a.active {
				color: @blueGreen;
				i {
					display: block;
				}
				.selected {
					display: block;
					background: @blueGreen;
				}
			}
		}
		li:first-child {
			margin-left: 33%;
		}
		li:last-child {
			a {
				.bottomRightRadius;
				.selected {
					.bottomRightRadius;
				}
			}
		}
	}
	.mainLoyaltyBox {
		margin-top: 15px;
		padding: 10px;
		.radius;
		border: 1px solid @white;
		.boxShadow(0;0;1px;rgba(0,0,0,0.4));
		width: 100%;
		background: @white;
		display: none;
		.innerBox {
			display: none;
			.breadcrumb {
				height: 35px;
				background: none;
				li {
					position: relative;
					top: -30px;
				}
				a.current {
					color: @grey7;
					cursor: default;
				}
				a.current:hover {
					text-decoration: none;
				}
			}
			p.prompt {
				float: left;
				width: 63%;
				margin-left: 2%;
					.fontStyle(@grey7,16px,400);
				span {
					.fontStyle(darken(@green,10%),16px,700);
				}
			}
			ul.shareStats {
				margin-top: -20px;
				float: right;
				width: 35%;
				li {
					float: left;
					width: 50%;
					text-align: center;
				}
				label {
					width: 100%;
					.fontStyle(@green;25px;500);
				}
				span {
					width: 100%;
					.fontStyle(@green;35px;500);
				}

			}
		}
		#allLoyalty.innerBox {
			display: block;
			ul.activityFeed {
				li {
					height: 137px;
					.activity {
						cursor: pointer;
					}
					.activity:hover {
						background: lighten(@newBlueLight,15%);
					}
				}
			}
		}
		#social.innerBox {
			display: none;
			.getSocial {
				width: 100%;
				ul.socialAccounts {
					margin-left: 2%;
					width: 96%;
					li.network {
						height: 120px;
						h3 {
							width: 62%;
							margin-top: 3px;
							.fontStyle(@green;20px;500);
							border-bottom: 1px solid @grey3;
							i {
								margin-right: 5px;
								font-size: 30px;
							}
						}
						ul.socialStats {
							width: 65%;
							li {
								float: left;
								width: 25%;
							}
							span {
								width: 100%;
								.fontStyle(@green;35px;500);
							}
						}
					}
				}
				ul.points {
					float: right;
					position: relative;
					top: -40px;
					width: 35%;
					height: 103%;
					padding: 5px 0;
					background: @newBlueLight;
					li {
						float: left;
						width: 50%;
						text-align: center;
						position: relative;
						label {
							background: @white;
							position: absolute;
							top: -11px;
							width: 100%;
							.fontStyle(@green;26px;500);
						}
						span {
							position: relative;
							top: 48px;
							left: 0;
							width: 100%;
							.fontStyle(@green;40px;500);
						}
					}
				}
				div.totalPoints {
					margin-top: 15px;
					height: 50px;
					width: 96%;
					margin-left: 2%;
					.label {
						float: left;
						width: 63%;
						span.total {
							float: right;
							.fontStyle(@green;40px;500);
						}
					}
					ul.total {
						position: relative;
						top: -40px;
						left: 15px;
						float: left;
						width: 35%;
						li {
							float: left;
							width: 50%;
							span {
								width: 100%;
								text-align: center;
								.fontStyle(@green;40px;500);
							}
						}
					}
				}
			}
		}
		#messagesLoyalty.innerBox {
			ul.messageShare {
				min-height: 530px;
				li {
					height: 450px;
					.message {
						margin-left: 30px;
						float: left;
						border: 5px solid @bgBlue;
						margin-top: 30px;
						width: 399px;
						height: 399px;
						overflow: hidden;
						img {
							width: 100%;
						}
					}
					button {
						width: 120px;
						font-size: 18px;
						border: none;
						float: left;
						margin-left: 50px;
						margin-top: 185px;
					}
				}
			}
		}
		#messagesRate.innerBox {
			min-height: 580px;
			.rateMessage {
				width: 100%;
				.loyaltyPrompt {
					position: relative;
					top: 180px;
				}
			}
		}
		#messagesFeedback.innerBox {
			form {
				margin-left: 2%;
				margin-top: 70px;
				width: 96%;
				padding: 0;
			}
			.fbOptions {
				margin-left: 0;
				li {
					h3 {
						width: 100%;
						margin-top: 3px;
						.fontStyle(@green;20px;500);
						border-bottom: 1px solid @grey3;
						i {
							margin-right: 5px;
							font-size: 25px;
						}
					}
				}
				#recommendScore {
					width: 90%;
					margin-left: 5%;
					height: 140px;
					padding: 0;
				.selectScore {
					margin-top: 2px !important;
					li {
						width: 33px;
						margin: 0 9px;
					}
				}
				}
				#fbMetrics {
					margin-left: 15px;
					width: 65%;
					.rateit {
						overflow: hidden;
					}
				}
				ul.reviewFaces {
					position: relative;
					left: 145px;
				}

			}
		}
		#signups.innerBox {
			ul.signups {
				margin-top: 150px;
				width: 100%;
				li {
					margin-left: 2%;
					width: 96%;
					height: 140px;
					position: relative;
					img.signup {
						float: left;
						margin-right: 20px;
						width: 70px;
						height: 70px;
					}
					img.wayfair {
						.radius(10px);
						padding: 5px;
						border: 2px solid @blueGreen;
					}
					p {
						float: left;
						width: 350px;
						.fontStyle(@green;14px;400);
						span {
							width: 100%;
							.fontStyle(@green;14px;600);
						}
					}
					img.seal {
						width: 140px;
						position: absolute;
						top: 40px;
						left: -75px;
					}
					img.seal.up {
						top: 0px;
					}
					button {
						width: 120px;
						font-size: 18px;
						border: none;
						float: left;
						margin-top: 15px;
						margin-left: 40px;
					}
				}
			}
		}
		#challenges.innerBox {
			display: none;
			ul.activityFeed {
				top: 60px;
				padding-bottom: 60px;
				li {
					position: relative;
					min-height: 110px;
					.activity {
						position: absolute; 
						top: 0;
						p {
							font-size: 18px;
							width: 100%;
							margin-top: 5px;

						}
					}
					button {
						top: 30px;
					}
				}
				li.big {
					height: 180px;
				}
			}
		}

		h2 {
			text-align: left !important;
			float: left;
			width: 60%;
			margin: 0;
			padding-left: 4px;
			padding-bottom: 3px;
			font-family: @font5;
			.fontStyle(@grey6;22px;300);
			span {
				margin-left: 4px;
				.fontStyle(@grey5;12px;600);
			}
		}
		.feedOptions {
			margin-right: 10px;
			position: relative;
			top: -30px;
			float: right;
			.dropdown {
				position: relative;
				a.dropdown-toggle {
					cursor: pointer;
					color: @green;
					i {
						margin-left: 2px;
						color: darken(@greenGrey1,30%)
					}
				}
				a.dropdown-toggle:hover {
					text-decoration: none;
					color: @green;
					i {
						color: @green;
					}
				}
				.dropdown-menu {
					position: absolute;;
					right: 100px !important;
					.radius;
					background: @white;
					.boxShadow(0;0;2px;rgba(0,0,0,0.3));
					border: none;
					li:first-child {
						a {
							.topRadius;
						}
					}
					li {
						a {
							border: none;
						}
					}
				}
			}
			.dropdown.filter {
				z-index: 999;
			}
		}
		ul.activityFeed {
			position: relative;
			top: -30px;
			padding-top: 20px;
			li {
				width: 100%;
				margin: 20px 0;
				padding: 0px;
				position: relative;
				.activity {
					margin-left: 5px;
					background: @grey2;
					padding: 10px;
					float: left;
					width: 70%;	
					.radius;
					border: 1px solid @white;
					.boxShadow(0;0;0;1px;rgba(0,0,0,0.3));
					h3 {
						margin-top: 0;
						.fontStyle(@green1;18px;400);
					}
					i {
						float: left;
						margin-top: 7px;
						margin-bottom: 3px;
						width: 30%;
						text-align: center;
						font-size: 66px;
					}
					p {
						text-align: center;
						margin-top: 22px;
						width: 70%;
						float: left;
						.fontStyle(@grey6;14px;500);

					}
				}
				button {
					border: none;
					height: 40px;
					font-size: 16px;
					position: absolute;
					top: 48px;
					left: 520px;
					width: 20%;
					background: @green1;
				}
			}
			li.featured {
				.activity {
					background: @newBlueLight;
				}
				h3 {
					color: @green;
					span.badge {
						float: right;
						position: relative;
						top: -3px;
						font-family: @font5;
						background: @green1;
						.fontStyle(@white;12px;400);
						.boxShadow(0;0;1px;@white);
					}
				}
				i {
					color: @green1;
				}
				p {
					color: @green1;
				}
			}
		}
		ul.messageIncentives {
			margin-top: 40px;
			padding-top: 30px;
			border-top: 1px solid @grey4;
			li {
				float: left;
				width: 48%;
				margin: 4px 1%;
				background: @grey2;
				border: 1px solid @white;
				.boxShadow(0;0;0;1px;rgba(0,0,0,0.3));
				position: relative;
				height: 200px;
				i {
					margin-top: 10px;
					margin-bottom: 15px;
					width: 100%;
					text-align: center;
					font-size: 80px;
				}
				p {
					text-align: center;
					width: 100%;
					.fontStyle(@grey6;16px;500);
				}
				button {
					position: absolute;
					bottom: 3px;
					width: 98%;
					margin-left: 1%;
				}
			}
		}
	}
	#activity.mainLoyaltyBox {
		display: none;
	}
	#timeline.mainLoyaltyBox {
		display: none;
	}
	#rewards.mainLoyaltyBox {
		display: block;
	}
	#timeline.mainLoyaltyBox, #rewards.mainLoyaltyBox {
		min-height: 500px;
		h2 {
			position: relative;
			top: -40px;
		}
		ul.activityFeed.timeline {
			border-top: 1px solid @grey3;
			position: relative;
			top: 40px;
			padding-top: 0;
			padding-bottom: 80px;
			.feedOptions {
				position: absolute;
				top: 10px;
				right: -1px;
				float: right;
				.timelineOptions {
					position: relative;
					a {
						i {
							font-size: 12px;
							color: lighten(@bgBlue, 15%);
						}
					}
					.dropdown-menu {
						position: absolute;
						left: -145px !important;
						li {
							margin: 0;
						}

					}
				}
			}
			ul.actionList {
				width: 22%;
				height: 40px;
				position: absolute;
				top: 12px;
				right: 25px;
				li {
					border: none;
					height: 20px;
					margin: 0;
					float: left;
					width: 50px;
					text-align: center;
					.fontStyle(lighten(@blueGreen,10%);16px;300);
					i {
						font-size: 20px;
						display: inline;
						width: 20px;
						margin: 0;
						margin-right: 4px;
					}
				}
			}
			li.feedItem {
				min-height: 120px;
				position: relative;
				background: none;
				margin: 10px 0;
				border-bottom: 1px solid @grey4;
				.activity {
					.noBoxShadow;
					background: none;	
					border: none;
					position: absolute;
					top: 0;
					margin-left: 2%;
					width: 94%;
					h3 {
						font-family: @font5;
						.fontStyle(darken(@grey7,10%);16px;600);
						i {
							color: @green1;
							font-size: 30px;
							display: inline;
							width: 30px;
							margin: 0 5px;
							position: relative;
							top: -5px;
						}
						span {
							margin-left: 2px;
							.fontStyle(@grey5;14px;500);
							i {
								color: lighten(@grey5,3%);
								font-size: 16px;
								width: 16px;
								position: relative;
								top: 2px;
								margin: 0 1px;
							}
						}
					}
					p {
						text-align: left;
						font-family: @font3;
						position: relative;
						top: -7px;
						margin: 0;
						.fontStyle(darken(@grey6,10%);16px;300);
					}
					ul.actions {
						width: 100%;
						height: 60px;
						clear: both;
						position: relative;
						li {
							position: relative;
							top: -95px;
							left: -180px;
							height: 60px;
							margin: 0 20px;
							width: 120px;
							float: left;
							button {
								width: 120px;
								.fontStyle(@white;16px;300);
								i {
									.fontStyle(@white;20px;300);
									margin: 0 1px;

								}
							}
						}
					}
				}
			}
			li.feedItem.message {
				height: 430px;
				div.message {
					margin: 10px 45px;
					.radius;
					.boxShadow(0;0;2px;rgba(0,0,0,0.5));
					border: 1px solid @grey1;
					height: 340px;
					width: 329px;
					overflow: hidden;
					position: relative;
					img {
						.topRadius;
						width: 329px;
					}
					div.prompt {
						height:  60px;
						width: 100%;
						background: @white;
						position: absolute;
						bottom: 0px;
						padding: 3px 10px;
						.bottomRadius;
						border-top: 1px solid rgba(0,0,0,0.1);
						h4 {
							.fontStyle(@grey7;16px;500);
						}
						p {
							width: 100%;
							.fontStyle(@grey5;12px;300);
						}
					}
				}
			}
		}
	}
}


/*Wayfair Distribution Styles*/
#seal.wayfairDist {
	overflow: auto;
	padding: 0;
	#accountNavHolder {
		width: 15%;
		#distNav {
			margin-top: 40px;
			height: 2634px;
			float: left;
			width: 100%;
			.bottomLeftRadius;
			ul {
				li {
					height: 50px;
					width: 100%;
					a {
						display: block;
						width: 100%;
						padding: 5px 10px;
					}
					a:hover {
						text-decoration: none;
						background: @greenGrey2;
					}
					a.current {
						color: @white;
						background: @bgBlue;
					}
				}
			}
		}
	}
	.content {
		width: 85%;
		display: none;
		float: left;
		padding: 0 30px;
	}
	#signupContent {
		display: block;
	}
	h2 {
		color: @blueGreen;
		font-size: 28px;
	}
	h3 {
		font-size: 24px;
		color: @grey7;
		border-bottom: 2px solid @grey6;
	}
	h4 {
		font-size: 20px;
		color: darken(@grey5,10%);
	}
	h4.seal {
		color: @blueGreen;
		border-bottom: 1px solid lighten(@grey6,15%);
	}
	p {
		font-size: 16px;
		margin-left: 10px;
	}
	div.test {
		margin-top: 30px;
	}
	div.preview {
		height: 90px;
		padding-top: 15px;
	}
	div.code {
		width: 100%;
		textarea {
			resize: none;
		}
	}
}


/*Wizard Fix */

body.home.wizard {
	table.selfAssessment {
		td {
			ul {
				li:first-child {
					display: none;
				}
			}
		}
	}
}

/*About Page*/
body.about {
	height: auto !important;
	font-family: @font5;
	background: @white;
	header.svAboutHeader {
		height: 55px;
		background: @white;
		#SVLogo {
			width: 225px;
			margin-top: 7px;
			img {
				width: 100%;
			}
		}
	}
	.left {
		float: left;
	}
	.right {
		float: left;
	}
	h2, h3, h4 {
		font-family: @font5;
		text-align: center;
		font-weight: 300;
	}
	#mainWrapper {
		#mainContent {
			.radius(0);
			margin-top: 5px;
			min-width: 1140px;
			a#getStarted {
				padding: 18px 15px;
				display: block;
				width: 250px;
				.radius;
				background: @blueGreen;
				.fontStyle(@white;22px;300);
				text-align: center;
				i {	
					position: relative;
					top: 7px;
					float: right;
				}
			}
			a#getStarted:hover {
				text-decoration: none;
				background: lighten(@blueGreen,10%);
			}
			#mainPromptContainer {
				background: @lightBlue4;
				position: relative;
				border-bottom: 1px solid @grey5;
				.mainPrompt {
					h2 {
						padding: 0 160px;
						margin-top: 50px;
						line-height: 50px;
						font-size: 40px !important;
						font-weight: 300;
					}
				}
				#expandedSealWrapper {
					margin-top: 10px;
					margin-left: 15px;
					width: 480px;
					height: 480px;
				}
				#validationWrapper {
					margin-left: 40px;
					width: 45%;
					.promptWrapper {
						margin-top: 90px;
						h3 {
							text-align: center;
							line-height: 58px;
							.fontStyle(@blueGreen;42px;700);
						}
						img#seal {
							width: 203px;
							margin: 5px 155px;
						}
						a#getStarted {
							padding: 14px 8px;
							font-size: 18px;
							width: 200px;
							margin: 10px 155px;
							.insetShadow(0;-3px;0;0;rgba(0,0,0,0.3));
							i {
								top: 5px;
							}
						}
						p.subPrompt {
							width: 80%;
							margin-top: 5px;
							.fontStyle(@grey7;22px;400) !important;
						}
					}
				}
			}
			.divider {
				width: 100%;
				height: 16px;
				background: url('@{base}images/divider1.png');
			}
			#programRequirements {
				h3 {
					margin-top: 5px;
					font-size: 36px;
					color: @blueGreen;
				}
				ul.programReqs {
					margin: 25px 15%;
					margin-left: 20%;
					height: 280px;
					width: 70%;
					li {
						margin: 5px 2%; 
						padding: 0;
						width: 45%;
						float: left;
						h4 {
							i {
								position: relative;
								top: -5px;
								img {
									width: 35px;
									height: 35px;
								}
							}
							margin: 0;
							text-align: left;
							.fontStyle(@bgBright;22px;700);
							line-height: 24px;
						}
						p {
							margin-left: 34px;
							position: relative;
							top: -5px;
							.fontStyle(@grey7;16px;300) !important;
						}
					}
				}
			}
			#HIW {
				h3 {
					font-size: 40px;
					color: @blueGreen;
				}
				p.hiw {
					text-align: center;
					.fontStyle(@grey7;26px;500);
					margin: 0 10% !important;
					margin-top: 20px !important;
					height: 74px;
					width: 80%;
				}
				ul.hiw {
					margin: 30px 10%;
					height: 270px;
					width: 80%;
					li {
						margin: 20px 39px; 
						padding: 0;
						width: 150px;
						float: left;
						position: relative;
					}
					li.active:before, li:hover:before {
						content: '';
						display: block;
						position: absolute;
						height: 4px;
						width: 120px;
						left: 15px;
						bottom: -10px;
						background: @bgBright;
					}
					img {
						cursor: pointer;
					}
				}
			}
			#SVtransition {
				width: 100%;
				height: 250px;
				background: @bgDark;
				position: relative;
				.container {
					padding: 20px 0;
					position: relative;
					h4 {
						padding: 0 130px;
						.fontStyle(@bgDarker;24px;400);
						line-height: 46px;
						letter-spacing: 0.065em;
					}
					#SVtri {
						width: 100%;
						height: 60px;
						position: absolute;
						bottom: -44px;
						i {
							display: block;
							width: 100%;
							text-align: center;
							.fontStyle(@bgDark;60px;400);
						}
					}
				}
			}
			#VoS {
				margin-top: 50px;
				h3 {
					padding: 0 180px;
					font-size: 40px;
					line-height: 50px;
				}
				p.subPrompt {
					margin-top: 25px;
					padding: 0 200px;
					text-align: center;
					.fontStyle(@grey7;20px;300) !important;
				}
				ul#VoSList {
					width: 90%;
					margin: 0 5%;
					li {
						margin: 50px 0; 
						padding: 0;
						width: 100%;
						float: left;
						.prompt {
							width: 40%;
							h4 {
								i {
									position: relative;
									top: -10px;
									img {
										width: 50px;
										height: 50px;
									}
								}
								margin: 0;
								text-align: left;
								.fontStyle(@bgBright;24px;700);
								line-height: 24px;
							}
							p {
								position: relative;
								.fontStyle(@grey7;20px;300) !important;
							}
						}
						.image {
							width: 55%;
							img {
								margin: 0 31px;
							}
						}
					}
					li#recommend, li#review, li#survey {
						.prompt {
							margin-top: 115px;
						}
					}
					li#rate {
						.prompt {
							margin-top: 45px;
						}
					}
					.divider {
						position: relative;
					}
					#secondDivider {
						top: 430px;
					}
					#thirdDivider {
						top: 850px;
					}
					#fourthDivider {
						top: 1270px;
					}
					#fifthDivider {
						top: 1700px;
					}
				}
			}
			#endPrompt {
				margin-top: 40px;
				background: @darkGrey;
				height: 430px;
				width: 100%;
				h3 {
					margin-top: 35px;
					.fontStyle(@white;34px;700);
				}

				h3 {
					margin-top: 35px;
					text-decoration: none;
				}
				a#getStarted {
					margin: 60px auto;
				}
				ul.footer {
					width: 20%;
					margin: 10px 40%; 
					margin-bottom: 0;
					height: 50px;
					padding-top: 15px;
					li {
						float: left;
						width: 33%;
						text-align: center;
						border-left: 1px solid rgba(255,255,255,0.6);
						a {
							font-size: 13px;
							color: rgba(255,255,255,0.6);
						}
						a:hover {
							text-decoration: none;
							color: rgba(255,255,255,0.4);
						}
					}
					li:first-child {
						border: none;
					}
				}
				p.copyright {
					width: 30%;
					margin: 5px 35%;
					font-size: 11px;
					color: rgba(255,255,255,0.6);
					text-align: center;
				}
				p.subPrompt {
					margin-top: 35px;
					padding: 0 280px;
					text-align: center;
					.fontStyle(@brightGreen2;20px;300) !important;
				}
			}
			#aboutTop {
				padding: 25px 0;
				margin-top: 50px;
				width: 100%;
				background: @blueGreen;
				h1 {
					width: 60%;
					margin: 40px 20%;
					line-height: 50px;
					font-family: @font5;
					text-align: center;
					.fontStyle(@white;34px;400);
				}
			}
			#aboutContainer {
				margin-top: 21px;
				.leftContainer {
					margin-left: 15px;
					float: left;
					width: 72%;
					h2 {
						margin-top: 0;
						text-align: left;
						.fontStyle(@grey7;26px;600);
					}
					p {
						font-size: 16px !important;
						line-height: 26px;
						margin-bottom: 30px;
					}
					p:last-child {
						margin-bottom: 24px;
					}
				}
				.rightContainer {
					border-left: 1px solid @grey3;
					float: right;
					width: 26%;
					padding-left: 20px;
					height: 380px;
					margin-top: 46px;
					padding-top: 4px;
					img#seal {
						width: 170px;
					}
					a#getStarted {
						margin-top: 35px;
						padding: 10px 10px;
						font-size: 18px;
						margin-left: 15px;
						width: 140px;
						.insetShadow(0;-3px;0;0;rgba(0,0,0,0.3));
						i {
							top: 5px;
						}
					}
				}
			}
		}
	}
}

/*About Page Old 
body.about {
	height: auto !important;
	font-family: @font5;
	background: @white;
	header.svAboutHeader {
		height: 55px;
		background: @white;
		#SVLogo {
			width: 225px;
			margin-top: 7px;
			img {
				width: 100%;
			}
		}
	}
	.left {
		float: left;
	}
	.right {
		float: left;
	}
	h2, h3, h4 {
		font-family: @font5;
		text-align: center;
		font-weight: 300;
	}
	#mainWrapper {
		#mainContent {
			.radius(0);
			margin-top: 5px;
			a#getStarted {
				padding: 18px 15px;
				display: block;
				width: 250px;
				.radius;
				background: @blueGreen;
				.fontStyle(@white;22px;300);
				text-align: center;
				i {	
					position: relative;
					top: 7px;
					float: right;
				}
			}
			a#getStarted:hover {
				text-decoration: none;
				background: lighten(@blueGreen,10%);
			}
			#mainPromptContainer {
				background: @lightBlue4;
				position: relative;
				border-bottom: 1px solid @grey5;
				.mainPrompt {
					h2 {
						padding: 0 160px;
						margin-top: 50px;
						line-height: 50px;
						font-size: 40px !important;
						font-weight: 300;
					}
				}
				#expandedSealWrapper {
					margin-top: 10px;
					margin-left: 15px;
					width: 480px;
					height: 480px;
				}
				#validationWrapper {
					margin-left: 40px;
					width: 45%;
					.promptWrapper {
						margin-top: 90px;
						h3 {
							text-align: center;
							line-height: 58px;
							.fontStyle(@blueGreen;42px;500);
						}
						img#seal {
							width: 203px;
							margin: 5px 155px;
						}
						a#getStarted {
							padding: 14px 8px;
							font-size: 18px;
							width: 200px;
							margin: 10px 155px;
							.insetShadow(0;-3px;0;0;rgba(0,0,0,0.3));
							i {
								top: 5px;
							}
						}
						p.subPrompt {
							width: 80%;
							margin-top: 5px;
							.fontStyle(@grey7;22px;400) !important;
						}
					}
				}
			}
			.divider {
				width: 100%;
				height: 16px;
				background: url('@{base}images/divider1.png');
			}
			#programRequirements {
				h3 {
					margin-top: 5px;
					font-size: 36px;
					color: @blueGreen;
				}
				ul.programReqs {
					margin: 25px 15%;
					margin-left: 20%;
					height: 280px;
					width: 70%;
					li {
						margin: 5px 2%; 
						padding: 0;
						width: 45%;
						float: left;
						h4 {
							i {
								position: relative;
								top: -5px;
								img {
									width: 35px;
									height: 35px;
								}
							}
							margin: 0;
							text-align: left;
							.fontStyle(@bgBright;22px;700);
							line-height: 24px;
						}
						p {
							margin-left: 34px;
							position: relative;
							top: -5px;
							.fontStyle(@grey7;16px;300) !important;
						}
					}
				}
			}
			#HIW {
				h3 {
					font-size: 40px;
					color: @blueGreen;
				}
				p.hiw {
					text-align: center;
					.fontStyle(@grey7;26px;500);
					margin: 0 10% !important;
					margin-top: 20px !important;
					height: 74px;
					width: 80%;
				}
				ul.hiw {
					margin: 30px 10%;
					height: 270px;
					width: 80%;
					li {
						margin: 20px 39px; 
						padding: 0;
						width: 150px;
						float: left;
						position: relative;
					}
					li.active:before, li:hover:before {
						content: '';
						display: block;
						position: absolute;
						height: 4px;
						width: 120px;
						left: 15px;
						bottom: -10px;
						background: @bgBright;
					}
					img {
						cursor: pointer;
					}
				}
			}
			#SVtransition {
				width: 100%;
				height: 250px;
				background: @bgDark;
				position: relative;
				.container {
					padding: 20px 0;
					position: relative;
					h4 {
						padding: 0 130px;
						.fontStyle(@bgDarker;24px;400);
						line-height: 46px;
						letter-spacing: 0.065em;
					}
					#SVtri {
						width: 100%;
						height: 60px;
						position: absolute;
						bottom: -44px;
						i {
							display: block;
							width: 100%;
							text-align: center;
							.fontStyle(@bgDark;60px;400);
						}
					}
				}
			}
			#VoS {
				margin-top: 50px;
				h3 {
					padding: 0 180px;
					font-size: 40px;
					line-height: 50px;
				}
				p.subPrompt {
					margin-top: 25px;
					padding: 0 200px;
					text-align: center;
					.fontStyle(@grey7;20px;300) !important;
				}
				ul#VoSList {
					width: 90%;
					margin: 0 5%;
					li {
						margin: 50px 0; 
						padding: 0;
						width: 100%;
						float: left;
						.prompt {
							width: 40%;
							h4 {
								i {
									position: relative;
									top: -10px;
									img {
										width: 50px;
										height: 50px;
									}
								}
								margin: 0;
								text-align: left;
								.fontStyle(@bgBright;24px;700);
								line-height: 24px;
							}
							p {
								position: relative;
								.fontStyle(@grey7;20px;300) !important;
							}
						}
						.image {
							width: 55%;
							img {
								margin: 0 31px;
							}
						}
					}
					li#recommend, li#review, li#survey {
						.prompt {
							margin-top: 115px;
						}
					}
					li#rate {
						.prompt {
							margin-top: 45px;
						}
					}
					.divider {
						position: relative;
					}
					#secondDivider {
						top: 430px;
					}
					#thirdDivider {
						top: 850px;
					}
					#fourthDivider {
						top: 1270px;
					}
					#fifthDivider {
						top: 1700px;
					}
				}
			}
			#endPrompt {
				margin-top: 40px;
				background: @darkGrey;
				height: 430px;
				width: 100%;
				h3 {
					margin-top: 35px;
					.fontStyle(@white;34px;700);
				}

				h3 {
					margin-top: 35px;
					text-decoration: none;
				}
				a#getStarted {
					margin: 60px auto;
				}
				ul.footer {
					width: 20%;
					margin: 10px 40%; 
					margin-bottom: 0;
					height: 50px;
					padding-top: 15px;
					li {
						float: left;
						width: 33%;
						text-align: center;
						border-left: 1px solid rgba(255,255,255,0.6);
						a {
							font-size: 13px;
							color: rgba(255,255,255,0.6);
						}
						a:hover {
							text-decoration: none;
							color: rgba(255,255,255,0.4);
						}
					}
					li:first-child {
						border: none;
					}
				}
				p.copyright {
					width: 30%;
					margin: 5px 35%;
					font-size: 11px;
					color: rgba(255,255,255,0.6);
					text-align: center;
				}
				p.subPrompt {
					margin-top: 35px;
					padding: 0 280px;
					text-align: center;
					.fontStyle(@brightGreen2;20px;300) !important;
				}
			}
			#aboutTop {
				padding: 25px 0;
				margin-top: 50px;
				width: 100%;
				min-width: 1170px !important;
				background: @blueGreen;
				h1 {
					width: 60%;
					margin: 40px 20%;
					line-height: 50px;
					font-family: @font5;
					text-align: center;
					.fontStyle(@white;34px;400);
				}
			}
			#aboutContainer {
				min-width: 1170px !important;
				margin-top: 21px;
				.leftContainer {
					margin-left: 15px;
					float: left;
					width: 72%;
					h2 {
						margin-top: 0;
						text-align: left;
						.fontStyle(@grey7;26px;600);
					}
					p {
						font-size: 16px !important;
						line-height: 26px;
						margin-bottom: 30px;
					}
					p:last-child {
						margin-bottom: 24px;
					}
				}
				.rightContainer {
					border-left: 1px solid @grey3;
					float: right;
					width: 26%;
					padding-left: 20px;
					height: 380px;
					margin-top: 46px;
					padding-top: 4px;
					img#seal {
						width: 170px;
						margin-left: 5px;
					}
					a#getStarted {
						margin-top: 35px;
						padding: 10px 10px;
						font-size: 18px;
						margin-left: 20px;
						width: 140px;
						.insetShadow(0;-3px;0;0;rgba(0,0,0,0.3));
						i {
							top: 5px;
						}
					}
				}
			}
		}
	}
}
*/

html.landingPage, body.landingPage {
  position: relative;
  height: 100%;
  width: 100%;
  overflow: auto;
}
/*New Landing Page*/
body.landingPage {
	height: 100%;
	header.landingPage {
		height: 60px;
		background: rgba(255,255,255,0.85);
		nav.container {
			a#logo {
				width: 280px;
				margin-top: 3px;
				img {
					height: 100%;
					width: 100%;
				}
			}
			ul.navItems {
				float: right;
				margin-top: 12px;
				li {
					float: left;
					margin: 0 11px;
					p {
						font-family: @font6;
						margin-top: 10px;
						color: @grey6;
					}
					a {
						font-family: @font6;
						.colorFade;
						top: 8px;
						position: relative;
						color: @white;
					}
					a.login:hover {
						color: rgba(255,255,255,0.7);
						text-decoration: none;
					}
					a.btn.getStarted {
						top: 0;
						.bgColorFast;
						padding: 8px 14px;
						border: 2px solid @buttonGreen;
					}
					a.btn.getStarted.notScrolled {
						.noBoxShadow;
						color: @buttonGreen;
					}
					a.btn.getStarted.scrolled {
						background: @buttonGreen;
						color: @white;
						border-color: @white;
					}
					a.btn.getStarted.notScrolled:hover {
						background: @buttonGreen;
						color: @white;
					}
					a.btn.getStarted.scrolled:hover {
						.textShadow(1px;1px;0;rgba(0,0,0,0.4));
						background: lighten(@buttonGreen,10%);
					}
				}
			}
		}
		#mobileMenu {
			display: none;
		}
	}
	#mainWrapper {
		#mainContent {
			#mainPromptContainer {
				background-image: url('@{base}images/newBG.png');
				border-bottom: 1px solid rgba(0,0,0,0.2);
				z-index: 2;
				position: relative;
				.mainHolder {
					padding-top: 35px;
					padding-bottom: 85px;
					background: rgba(65,146,182,0.8);
				}
				.container {
					#validationWrapper {
						.promptWrapper {
							h2, h3, h4 {
								text-align: center;
								color: @white;
								.textShadow(1px;1px;0;rgba(0,0,0,0.6));
							}
							h3 {
								padding: 0 170px;
								margin-top: 90px;
								line-height: 50px;
								font-family: @font6;
								font-size: 42px;
								font-weight: 700;
							}
							h2 {
								font-family: @font1;
								font-size: 46px;
								font-weight: 700;
							}
							h4 {
								margin-top: 20px;
								font-family: @font6;
								font-size: 16px;
								font-weight: 300;
								padding: 0 420px;
								line-height: 28px;
							}
							div.btnContainer {
								width: 280px;
								margin: 30px auto;
								a#getStarted {
									font-family: @font6;
									width: 100%;
									background: @buttonGreen;
									color: @white;
									text-transform: uppercase;
									font-size: 16px;
									padding: 24px 0;
									.slideFast;
									i {
										margin-left: 8px;
									}
								}
								a#getStarted:hover {
									.textShadow(1px;1px;0;rgba(0,0,0,0.4));
									background: lighten(@buttonGreen,10%);
								}
							}
						}
					}
				}
			}
			#threeBlocks {
				.insetDrop(0;2px;3px;rgba(0,0,0,0.1);0;2px;3px;rgba(0,0,0,0.1));
				height: 620px;
				background: #f9f9f6;
				position: relative;
				z-index: 2;
				.container {
					ul.hiw {
						height: 220px;
						margin-top: 40px;
						position:realtive;
						li {
							float: left;
							width: 150px;
							height: 220px;
							position: relative;
							a {
								img {
									width: 100%;
								}
								img.min {
									display: block;
								}
								img.sel {
									display: none;
								}
								h3 {
									font-family: @font1;
									text-align: center;
									font-size: 22px;
									font-weight: 400;
									color: @grey7;
								}
							}
							i {
								position: absolute;
								top: 65px;
								right: -90px;
								font-size: 30px;
								color: @bgBright;
							}
							a:hover, a.active {
								text-decoration: none;
								img.min {
									display: none;
								}
								img.sel {
									display: block;
								}
							}
						}
						li:first-child {
							margin: 0;
							left: 160px;
						}
						li:nth-child(2) {
							margin-left: 50%;
							left: -220px;
						}
						li:last-child {
							position: absolute;
							right: 305px;

						}
					}
					.block {
						display: none;
						width: 80%;
						height: 301px;
						margin: 5px 10%;
						border: 2px solid @grey3;
						background: @white;
						position: relative;
						div.left {
							padding: 25px;
							width: 50%;
							float: left;
							h4 {
								margin: 20px 0;
								font-size: 26px;
								font-weight: 400;
								font-family: @font6;
								color: @grey6;
							}
							p {
								margin-top: 40px;
								font-family: @font6;
								font-size: 20px;
								font-weight: 300;
								color: @grey6;

							}
						}
						div.right {
							float: right;
							position: relative;
							width: 50%;
							img {
								position: absolute;
								right: 0;
								bottom: -297px;
								width: 458px;
								border: solid @grey3;
								border-width: 2px 0 0 2px;
							}
						}
					}
					#listen.block {
						display: block;
					}
					.block:before {
						z-index: 951;
						border-left: 20px solid transparent;
						border-bottom: 20px solid @grey3;
						border-right: 20px solid transparent;
						content: '';
						display: block;
						position: absolute;
						top: -20px;
						left: 138px;
					}
					.block:after {
						z-index: 952;
						border-left: 17px solid transparent;
						border-bottom: 17px solid @white;
						border-right: 17px solid transparent;
						content: '';
						display: block;
						position: absolute;
						top: -17px;
						left: 141px;
					}
					#monitor.block:before {
						left: 439px;
					}
					#monitor.block:after {
						left: 442px;
					}
					#improve.block:before {
						left: 725px;
					}
					#improve.block:after {
						left: 728px;
					}
				}
			}
			#feed {
				height: 500px;
				overflow: hidden;
				background: @white;
				.container {
					width: 940px;
					height: 500px;
					padding: 0;
					overflow: hidden;
					#browserWindow {
						z-index: 1;
						position: relative;
						top: 68px;
						display: inline-block;
						width: 940px;
						background-image: url('@{base}images/feedBrowser.png');
						h2 {
							position: relative;
							top: -50px;
							font-family: @font6;
							text-align: center;
							font-size: 36px;
							color: @blueGreen;
							color: @blueGreen;
						}
						p {
							margin: 0;
							position: relative;
							top: -55px;
							font-family: @font6;
							text-align: center;
							font-size: 16px;
							color: @blueGreen;
						}
						img {
							width: 800px;
							position: relative;
							top: 28px;
							margin-left: 70px;
						}
					}
				}
			}
			#subscriberData {
				.insetShadow(0;2px;3px;rgba(0,0,0,0.1));
				height: 510px;
				background: #f9f9f6;
				.container {
					height: 500px;
					h2 {
						padding: 0 180px;
						line-height: 55px;
						margin-top: 35px;
						font-family: @font6;
						text-align: center;
						font-size: 36px;
						color: @blueGreen;
					}
					ul.data {
						margin-top: 0;
						height: 300px;
						li {
							float: left;
							width: 200px;
							height: 300px;
							position: relative;
							i {
								position: absolute;
								top: 85px;
								right: -45px;
								font-size: 30px;
								color: @blueGreen;
							}
							h3 {
								font-family: @font1;
								text-align: center;
								font-size: 22px;
								font-weight: 400;
								color: @grey7;
							}
							a.btn {
								width: 80%;
								margin: 20px 10%;
								color: @white;
								background: @blueGreen;
								border: 4px solid @blueGreen;
								font-family: @font6;
								font-size: 16px;
								.noBoxShadow;
								.radius(24px);
								.slideFast;
							}
							a.btn:hover {
								background: lighten(@blueGreen,18%);
								.textShadow(1px;1px;0px;rgba(0,0,0,0.2));
							}
						}
						li:first-child {
							margin: 0;
							left: 140px;
						}
						li:nth-child(2) {
							margin-left: 50%;
							left: -300px;
						}
						li:last-child {
							float: right;
							top: -300px;
							right: 140px;
						}
					}

				}
			}
			div#getStarted {
				padding-top: 50px;
				height: 420px;
				background: @blueGreen;
				.container {
					position: relative;
					padding: 0;
					h2 {
						width: 100%;
						top: -20px;
						position: absolute;
						font-family: @font6;
						font-size: 36px;
						color: @white;
						text-align: center;
					}
					div.btnContainer {
						width: 240px;
						margin: 0 auto;
						margin-top: 70px;
						a#getStarted {
							font-family: @font6;
							width: 100%;
							background: @buttonGreen;
							color: @white;
							text-transform: uppercase;
							font-size: 18px;
							padding: 18px 0;
							.slideFast;
							i {
								margin-left: 8px;
							}
						}
						a#getStarted:hover {
							.textShadow(1px;1px;0;rgba(0,0,0,0.4));
							background: lighten(@buttonGreen,10%);
						}
					}
				}
			}
		}
		#mainContent.vos {
			#mainPromptContainer {
				background: @grey2;
				padding-bottom: 50px;
				padding-top: 25px; 
				border-bottom: 1px solid rgba(0,0,0,0.2);
				z-index: 2;
				position: relative;
				height: 410px;
				.container {
					#validationWrapper {
						.promptWrapper {
							div.left {
								float: left; 
								width: 40%;
								img {
									width: 90%;
									margin: 0 5%;
								}
							}
							div.right {
								float: right;
								width: 60%;
								padding-top: 10px;
								padding-left: 50px;
								h2, h4 {
									text-align: left;
									color: @grey7;
									.noTextShadow;
								}
								h2 {
									margin-top: 80px;
									font-family: @font1;
									font-size: 34px;
									line-height: 45px;
									font-weight: 400;
									padding-right: 240px;
									b {
										font-size: 40px;

									}
								}
								h4 {
									margin-top: 15px;
									font-family: @font6;
									font-size: 22px;
									font-weight: 300;
									line-height: 30px;
									padding: 0;
									padding-right: 160px;
								}
							}
						}
					}
				}
			}
			#VoS {
				background: @white;
				div.VoSHolder {
					.insetShadow(0;2px;3px;rgba(0,0,0,0.1));
					height: 115px;
					padding-top: 5px;
					background: @blueGreen;
					ul#VoSIcons {
						height: 110px;
						width: 90%;
						margin: 0 5%;
						li {
							float: left;
							width: 10%;
							margin: 0 5%;
							a {
								display: block;
								height: 100%;
								width: 100%;
								position: relative;
								i {

									img {
										width: 80%;
										margin: 10%;
									}
								}
							}
							a.active:before {
								z-index: 952;
								border-left: 25px solid transparent;
								border-bottom: 25px solid @white;
								border-right: 25px solid transparent;
								content: '';
								display: block;
								position: absolute;
								bottom: -14px;
								left: 27px;
							}
						}
					}
				}
				#listHolder.container {
					height: 375px;
					ul#VoSList {
						top: -50px;
						position: relative;
						width: 100%;
						div.carouselNav {
							.slide;
							opacity: 0;
							visibility: hidden;
							width: 100%;
							height: 40px;
							position: absolute;
							left: 0;
							top: 135px;
							a {
								position: absolute;
								i {
									.slideFast;
									font-size: 45px;
									color: @bgBright;
								}
							}
							a.left {
								left: 0;
							}
							a.right {
								right: 0;
							}
							a:hover {
								i {
									color: @blueGreen;
								}
							}
						}
						div.carouselNav.active {
							opacity: 1;
							visibility: visible;
						}
						li {
							display: none;
							margin: 100px 0; 
							padding: 0;
							width: 90%;
							height: 301px;
							margin: 75px 5%;
							background: @white;
							div.left {
								position: relative;
								width: 50%;
								float: left;
								img.image {
									height: 261px;
									position: absolute;
									left: 0;
									bottom: -297px;
									width: 458px;
								}
							}
							div.prompt.left {
								padding-left: 10px;
							}
							div.right {
								float: right;
								position: relative;
								width: 50%;
								img.image {
									height: 261px;
									position: absolute;
									right: 0;
									bottom: -297px;
									width: 458px;
								}
							}
							.prompt {
								width: 40%;
								h4 {
									i {
										position: relative;
										top: -10px;
										img {
											width: 50px;
											height: 50px;
										}
									}
									font-family: @font6;
									margin: 0;
									text-align: left;
									.fontStyle(@bgBright;24px;700);
									line-height: 26px;
								}
								p {
									padding-left: 15px;
									font-family: @font6;
									position: relative;
									.fontStyle(@grey7;18px;300) !important;
								}
							}
						}
						li#recommend, li#review, li#survey {
							.prompt {
								margin-top: 65px;
							}
						}
						li#comments {
							.prompt {
								margin-top: 85px;
							}
						}
						li#rate {
							display: block;
							.prompt {
								margin-top: 45px;
							}
						}
					}
				}
			}
			div.ready{
				.insetShadow(0;2px;3px;rgba(0,0,0,0.1));
				background: @grey2;
				height: 1200px;
				h3 {
					margin-top: 50px;
					text-align: center;
					color: @grey7;
					font-family: @font6;
					font-size: 42px;
					line-height: 55px;
					font-weight: 400;
				}
				ul.howTo {
					width: 90%;
					margin: 0 5%;
					padding: 10px 10%;
					border: 2px solid @grey3;
					background: @white;
					margin-top: 30px;
					li {
						margin: 30px 0;
						height: 290px;
						padding-top: 15px;
						width: 100%;
						border-bottom: 2px dashed @grey3;
						h4 {
							margin-top: 25px;
							text-align: left;
							color: @grey7;
							font-family: @font6;
							font-weight: 300;
							font-size: 26px;
							span {
								position: relative;
								top: -5px;
								display: block;
								float: left;
								height: 35px;
								width: 35px;
								background: @blueGreen;
								.radius(100px);
								color: @white;
								margin-right: 8px;
								text-align: center;
								padding-top: 3px;
							}
						}
						p {
							font-family: @font6;
							color: @grey7;
							font-size: 18px;
							padding-left: 45px;
						}
						div.left {
							float: left;
							width: 50%;
						}
						div.right {
							float: right;
							width: 50%;
							h4 {
								padding-left: 15px;
							}
							p {
								padding-left: 60px;
							}
						}
						img {
							width: 100%;
							border: 2px solid @grey3;
						}
					}
				}
			}
		}
		#mainContent.IW {
			#mainPromptContainer {
				background: @grey2;
				padding-bottom: 50px;
				padding-top: 25px; 
				border-bottom: 1px solid rgba(0,0,0,0.2);
				z-index: 2;
				position: relative;
				height: 410px;
				.container {
					#validationWrapper {
						.promptWrapper {
							.left {
								float: left;
								width: 50%;
								padding-top: 10px;
								padding-left: 90px;
								h2, h4 {
									text-align: left;
									color: @grey7;
									.noTextShadow;
								}
								h2 {
									margin-top: 80px;
									font-family: @font1;
									font-size: 34px;
									line-height: 45px;
									font-weight: 400;
									b {
										font-size: 40px;

									}
								}
								h4 {
									margin-top: 15px;
									font-family: @font6;
									font-size: 22px;
									font-weight: 300;
									line-height: 30px;
									padding: 0;
								}
							}
							.right {
								float: right; 
								width: 50%;
								img {
									margin: 5px 10%;
									width: 70%;
								}
								
							}
						}
					}
				}
			}
			#trust {
				div.trustHolder {
					.insetShadow(0;2px;3px;rgba(0,0,0,0.1));
					height: 135px;
					padding-top: 5px;
					background: @blueGreen;
					position: relative;
					h4 {
						margin-top: 15px;
						font-family: @font6;
						font-size: 30px;
						line-height: 45px;
						font-weight: 400;
						color: @white;
						text-align: center;
						padding: 0 250px;
					}
				}
				div.trustHolder:before {
					z-index: 952;
					border-left: 26px solid transparent;
					border-top: 26px solid @blueGreen;
					border-right: 26px solid transparent;
					content: '';
					display: block;
					position: absolute;
					bottom: -26px;
					left: -14px;
					margin-left: 50%;
				}
			}
			#cert {
				.insetShadow(0;2px;3px;rgba(0,0,0,0.2));
				height: 500px;
				background: @white;
				div.left {
					float: left; 
					width: 50%;
					img {
						width: 400px;
						margin: 0 15%;
						margin-top: 50px;
					}
				}
				div.right {
					float: right;
					width: 50%;
					padding-top: 10px;
					padding-left: 10px;
					h2, p {
						text-align: left;
						color: @grey7;
						.noTextShadow;
					}
					h2 {
						margin-top: 70px;
						font-family: @font1;
						font-size: 34px;
						line-height: 45px;
						font-weight: 400;
					}
					p {
						margin-top: 15px;
						font-family: @font6;
						font-size: 15px;
						font-weight: 300;
						line-height: 25px;
						padding: 0;
						padding-right: 30px;
					}
				}
			}
			#IWHIW {
				.insetShadow(0;2px;3px;rgba(0,0,0,0.1));
				background: @blueGreen;
				div.container {
					#HIW {
						position: relative;
						div.carouselNav {
							.slide;
							opacity: 0;
							visibility: hidden;
							width: 80%;
							margin: 0 10%;
							height: 40px;
							position: absolute;
							left: 0;
							top: 135px;
							a {
								position: absolute;
								i {
									.slideFast;
									font-size: 45px;
									color: @white;
								}
							}
							a.left {
								left: 0;
							}
							a.right {
								right: 0;
							}
							a:hover {
								i {
									.textShadow(1px;1px;2px;rgba(0,0,0,0.4));
								}
							}
						}
						div.carouselNav.active {
							opacity: 1;
							visibility: visible;
						}
						h3 {
							text-align: center;
							font-family: @font6;
							font-size: 40px;
							color: @white;
						}
						p.hiw {
							font-family: @font6;
							text-align: center;
							.fontStyle(@grey2;26px;500);
							margin: 0 15% !important;
							margin-top: 20px !important;
							height: 74px;
							width: 70%;
						}
						ul.hiw {
							margin: 25px 15%;
							height: 160px;
							width: 70%;
							li {
								margin: 20px 0; 
								padding: 0;
								width: 19%;
								margin: 0 3%;
								float: left;
								position: relative;
								img {
									width: 90%;
									margin: 0 5%;
									cursor: pointer;
								}
							}
							li.active:before, li:hover:before {
								content: '';
								display: block;
								position: absolute;
								height: 6px;
								width: 60%;
								left: 20%;
								bottom: -15px;
								background: @white;
							}
						}
					}
				}
			}
			#REQS {
				.insetShadow(0;2px;3px;rgba(0,0,0,0.1));
				background: @grey2;
				div.container {
					h3 {
						margin-top: 30px;
						text-align: center;
						font-family: @font6;
						font-size: 40px;
						color: @grey7;
						padding: 0 200px;
					}
					ul.reqs {
						margin: 0 10%;
						margin-top: 40px;
						width: 80%;
						height: 460px;
						li {
							float: left;
							width: 50%;
							height: 230px;
							background: none;
							padding: 0;
							div.imgHolder {
								padding: 0;
								width: 100px;
								height: 100px;
								background: @white;
								.radius(300px);
								border: 4px solid @blueGreen;
								img {
									width: 70%;
									margin: 15%;
								}
							}
							h4 {
								text-transform: uppercase;
								font-family: @font6;
								color: @grey7;
								text-align: center;
								font-size: 24px;
							}
							p {
								font-family: @font6;
								color: @grey7;
								text-align: center;
								font-size: 15px;
								margin: 0;
								padding: 0 120px;
							}
						}
					}
				}
			}
		}
		#mainContent.datasheet {
			#mainPromptContainer {
				padding-bottom: 0;
				div.container {
					h3 {
						margin: 0 200px;
						margin-top: 50px;
						padding-top: 35px;
						height: 150px;
						text-align: center;
						font-size: 28px;
						line-height: 36px;
						color: @white;
						background: rgba(0,0,0,0.3);
					}
					h3.download {
						padding-top: 60px;
						font-size: 38px;
					}
				}
			}
			#mainContainer {
				.insetShadow(0;2px;3px;rgba(0,0,0,0.1));
				background: @white;
				height: 800px;
				padding-top: 40px;
				div.container {
					div.left {
						float: left;
						width: 70%;
						h4 {
							font-family: @font6;
							font-weight: 400;
							font-size: 26px;
							color: @grey7;
						}
						p {
							font-family: @font5;
							margin: 3px 0;
							font-size: 18px;
							color: @grey6;
						}
					}
					div.right {
						float: right;
						width: 30%;
						h3 {
							width: 80%;
							margin: 0 10%;
							font-family: @font6;
							color: @grey7;
							font-size: 20px;
						}
						div.downloadForm {
							height: 500px;
							width: 95%;
							margin-left: 5%;
							form {
								float: left;
								position: relative;
								width: 90%;
								margin: 0 5%;
								.control-label {
									text-align: left;
								}
								label {
									font-family: @font5;
									color: @grey6;
									margin-top: 8px;
								}
								input[type="text"],input[type="password"],input[type="email"], select {
									font-family: @font5;
									height: 40px;
									width: 100%;
									font-size: 14px;
									.insetShadow(0;0;3px;rgba(0,0,0,0.3));
									font-weight: 400;
									background: @white;
								}
								textarea {
									width: 100%;
									height: 100px;
									font-size: 14px;
									.insetShadow(0;0;3px;rgba(0,0,0,0.3));
									font-weight: 400;
								}
								.buttonHolder {
									width: 50%;
									margin: 0 25%;
									margin-top: 30px;
									a.btn.important {
										background: @buttonGreen;
										font-family: @font5;
										padding: 15px 30px;
										width: 100%;
										font-size: 16px;
										font-weight: 600;
										.textShadow(1px;1px;0px;rgba(0,0,0,0.2));
										.insetDrop(0;-3px;0;0;rgba(0,0,0,0.3);0;2px;3px;-1px;rgba(0,0,0,0.2));
									}
								}
							}
						}
					}
					div.downloadPrompt {
						width: 80%;
						margin: 0 10%;
						p {
							font-family: @font5;
							margin: 3px 0;
							font-size: 18px;
							color: @grey6;
						}
						a.btn.important {
							background: @buttonGreen;
							font-family: @font5;
							padding: 15px 30px;
							margin: 20px 8px;
							font-size: 16px;
							font-weight: 600;
							.textShadow(1px;1px;0px;rgba(0,0,0,0.2));
							.insetDrop(0;-3px;0;0;rgba(0,0,0,0.3);0;2px;3px;-1px;rgba(0,0,0,0.2));
						}
					}
					ul.resource {
						height: 200px;
						width: 70%;
						margin: 25px 15%;
						li {
							font-family: @font5;
							margin: 0 6%;
							height: 225px;
							width: 36%;
							padding: 10px;
							border: 1px solid @grey3;
							background: @grey2;
							float: left;
							.radius;
							position: relative;
							p.type {
								float: left;
								width: 60%;
								font-size: 14px;
								text-transform: uppercase;
							}
							p.symbol {
								margin: 0;
								float: right;
							}
							h4 {
								margin-top: 30px;
							}
							a.next {
								position: absolute;
								bottom: 0;
								left: 0;
								padding: 4px 0;
								.bottomRadius;
								background: @buttonGreen;
								color: @white;
								text-align: center;
								width: 100%;
								display: block;

							}
						}
					}
				}
			}
		}
		#mainContent.contact {
			background: @grey2;
			height: 980px;
			div.contactForm {
				height: 800px;
				padding: 0 200px;
				margin-top: 60px;
				h2 {
					text-align: center;
					font-family: @font6;
					font-weight: 300;
					font-size: 34px;
					a {
						font-weight: 300;
					}
					a:hover {
						text-decoration: none;
					}
				}
				form {
					margin: 0 15%;
					width: 70%;
					margin-top: 5px;
					margin-bottom: 30px;
					.control-label {
						text-align: left;
					}
					label {
						font-family: @font5;
						color: @grey6;
						margin-top: 8px;
					}
					input[type="text"],input[type="password"],input[type="email"], select {
						font-family: @font5;
						height: 40px;
						width: 100%;
						font-size: 14px;
						.insetShadow(0;0;3px;rgba(0,0,0,0.3));
						font-weight: 400;
						background: @white;
					}
					textarea {
						width: 100%;
						height: 100px;
						font-size: 14px;
						.insetShadow(0;0;3px;rgba(0,0,0,0.3));
						font-weight: 400;
					}
					.buttonHolder {
						width: 50%;
						margin: 0 25%;
						margin-top: 30px;
						input.btn.important {
							background: @buttonGreen;
							font-family: @font5;
							padding: 15px 30px;
							width: 100%;
							font-size: 16px;
							font-weight: 600;
							.textShadow(1px;1px;0px;rgba(0,0,0,0.2));
							.insetDrop(0;-3px;0;0;rgba(0,0,0,0.3);0;2px;3px;-1px;rgba(0,0,0,0.2));
						}
					}
				}
			}
		}
	}
	div#videoHolder {
		height: 100%;
		position: relative;
		overflow: hidden;
		#backVideo, img {
			min-width: 100%;
			min-height: 100%;
			position: fixed;
			top: 0;
			left: 0;
		}
		#backVideoOverlay {
			min-width: 100%;
			min-height: 100%;
			position: fixed;
			top: 0;
			left: 0;
			background: @blueGreen0;
		}
	}
	div#landingPageAlpha {
		width: 100%;
		min-height: 100%;
		position: absolute;
		top: 0;
		div.logoStatic {
			position: relative;
			padding-top: 20px;
			max-width: 1000px;
			z-index: 1001;
      width: 30%;
      margin: 0 35%;
			a {
        width: 100%;
				display: block;
        margin-bottom: 15px;
			}
			img {
				width: 100%;
			}
			p {
				margin-top: 15px;
				font-family: @font6;
				color: rgba(255,255,255,0.75);
				font-weight: 300;
				text-align: center;
				font-size: 26px;
				span {
					color: rgba(255,255,255,0.85);
					font-weight: 400;
					font-family: @font1;
				}
			}
			p.prompt.small {
				margin-top: 2px;
				font-size: 20px;
			}
		}
    div.horizontalDiv.top {
      display: none;
      width: 62%;
      height: 0;
      margin: 0 19%;
      border-top: 3px solid rgba(255,255,255,0.25);
    }
    div.horizontalDiv.top.active {
      display: block;
    }
    div.horizontalDiv.bottom {
      display: none;
      width: 62%;
      height: 0;
      margin: 0 19%;
      margin-bottom: 10px;
      border-top: 3px solid rgba(255,255,255,0.25);
    }
    div.horizontalDiv.bottom.active {
      display: block;
    }

		div.alphaScreen {
			position: relative;
			width: 100%;
			max-width: none;
			opacity: 0;
			right: -200%;
			padding-top: 30px;
			display: none;
			img {
				width: 40%;
				margin: 0px 30%;
			}
			h2 {
				padding: 0 10%;
				margin-top: 30px;
				font-family: @font6;
				color: rgba(255,255,255,0.75);
				font-size: 50px;
				text-align: center;
				font-weight: 300;
				b {
					color: rgba(255,255,255,0.85);
					font-weight: 600;
					font-family: @font5;
				}
			}
			h2.question {
				margin-top: 36px;
				margin-bottom: 8px;
				font-size: 60px;
				line-height: 90px;
				color: @white;

				b {
					color: @white;
				}
			}
			h2.statement {
				text-transform: uppercase;
				padding: 0 10%;
				font-size: 50px;
				line-height: 90px;
				margin-top: 18px;
				margin-bottom: 12px;
				b {
					color: @white;
					font-weight: 600;
					font-family: @font5;
				}
			}
			h2.reservation {
				line-height: 72px;
				span {
					display: block;
					width: 100%;
					text-align: center;
					font-weight: 400;
					font-family: @font1;
					color: @white;
				}
			}
			p {
				margin-top: 8px;
				font-family: @font6;
				color: rgba(255,255,255,0.75);
				font-weight: 300;
				text-align: center;
				font-size: 27px;
				span {
					color: @white;
					font-weight: 400;
					font-family: @font1;
					border-bottom: 2px solid @white;
				}
			}
			p.prompt.enter {
				span {
					border: none;
				}
			}
			p.prompt.no {
				display: none;
			}
			p.prompt.no.active {
				display: block;
				margin: 0;
				font-size: 22px;
			}
			p.prompt.no.sorry {
				margin-top: 8px;
				a {
					font-size: 0.8em;
					color: @grey3;
				}
				a:hover {
					color: @grey4;
				}
			}
			div.buttonContainer {
				height: 200px;
			}
			div.buttonWrapper {
				float: left;
				margin: 50px 0;
				width: 27.5%;
				height: 170px;
				.radius(5px);
				background: rgba(0,0,0,0.3);
			}
			div.buttonWrapper.yes {
				margin-left: 20%;
				margin-right: 2.5%;
			}
			div.buttonWrapper.no {
				margin-left: 2.5%;
				margin-right: 20%;
			}
			button {
				.radius(5px);
				width: 90%;
				height: 81%;
				margin: 5%;
				border: none;
				color: @white;
				font-family: @font5;
				.insetDrop(0;1px;0;0;rgba(255,255,255,0.25);0;1px;1px;0;rgba(0,0,0,0.25));
				span {
					font-weight: 600;
					font-size: 22px;
				}
				span.big {
					width: 100%;
					font-size: 55px;
					line-height: 50px;
					font-family: @font1;
					text-transform: uppercase;
				}
				span.yes {
					width: 100%;
					position: relative;
					top: 3px;
				}
				span.no {
					width: 100%;
					position: relative;
					top: 3px;
				}
			}
			button:focus {
				outline: none;
			}
			button#yes {
				border: 1px solid darken(@brightBlueNew,12%);
				background: @brightBlueNew;
			}
			button#yes:hover {
				border: 1px solid lighten(@brightBlueNew,8%);
				background: lighten(@brightBlueNew,8%);
			}
			button#no {
				border: 1px solid darken(@grey5,4%);
				background: @greyButton;
			}
			button#no:hover {
				border: 1px solid lighten(@grey5,12%);
				background: lighten(@greyButton,8%);
			}
			form#reservationForm {
				width: 50%;
				margin: 30px 25%;
				margin-bottom: 0;
				div.inputWrapper {
					width: 100%;
					.radius;
					padding-top: 5px;
					padding-bottom: 10px;
					background: rgba(255,255,255,0.3);
					input[type="email"],input[type="text"] {
						text-align: center;
						margin: 5px 3%;
						width: 94%;
						font-family: @font6;
						padding: 12px 23px;
						height: 70px;
						border: none;
						font-size: 28px;
						color: @grey6;
						.radius();
						.insetShadow(0;2px;0;0;rgba(0,0,0,0.05));
					}
					button {
						margin: 0 3%;
						margin-top: 5px;
						font-family: @font6;
						width: 94%;
						.radius();
						height: 70px;
						padding: 7px 15px;
						font-size: 28px;
						text-transform: capitalize;
						background: @brightBlueNew;
						position: relative;
					}
					button:hover {
						background: lighten(@brightBlueNew,8%);
					}
					button.btn-disabled {
						background: darken(@brightBlueNew,12%);
						color: @grey3;
					}
				}
			}
			div.socialIcons {
				width: 100%;
				margin-top: 5px;
				padding-top: 20px;
				a, div.wrapper {
					float: left;
					display: block;
					width: 50px;
					height: 50px;
					.radius(64px);
					background: rgba(255,255,255,0.25);
				}
				a:first-child {
					margin-left: 425px;
					margin-right: 10px;
				}
				a:last-child {
					margin-left: 10px;
				}
				i {
					width: 100%;
					text-align: center;
					font-size: 24px;
					padding: 14px 0;
					color: @blueGrey1;
				}
				a:hover {
					background: rgba(0,0,0,0.5);
				}
			}
			div.socialIcons.share {
				border: none;
				max-width: 600px;
				a {
					margin: 0 2.65%;
					.radius(5px);
					height: 52px;
					color: @white;
					font-family: @font6;	
					font-size: 11px;
					text-align: left;
					width: 28%;
					background: @brightBlueNew;
					padding-bottom: 12px;
					div.wrapper {
						background: rgba(0,0,0,0.3);
						width: 30px;
						height: 30px;
						margin-right: 4px;
						i {
							padding: 6px 0;
							font-size: 20px;
						}
					}
					span {
						margin-top: 9px;
					}
					div.email {
						i {
							font-size: 17px;
							padding: 7px 0;
							padding-left: 1px;
						}
					}
				}
				a:hover {
					background: lighten(@brightBlueNew, 8%);
				}
			}
		}
		div.socialStatic {
			display: none;
			position: relative;
			max-width: 1000px;
			padding-bottom: 5px;
			div.horizontalDiv {
				width: 62%;
				height: 0;
				margin: 0 19%;
				margin-bottom: 10px;
				border-top: 3px solid rgba(255,255,255,0.25);
			}
			div.socialIcons {
				width: 100%;
				margin-top: 5px;
				padding-top: 20px;
				a, div.wrapper {
					float: left;
					display: block;
					width: 50px;
					height: 50px;
					.radius(64px);
					background: rgba(255,255,255,0.25);
				}
				a:first-child {
					margin-left: 425px;
					margin-right: 10px;
				}
				a:last-child {
					margin-left: 10px;
				}
				i {
					width: 100%;
					text-align: center;
					font-size: 24px;
					padding: 14px 0;
					color: @blueGrey1;
				}
				a:hover {
					background: rgba(0,0,0,0.5);
				}
			}
		}
		div.socialStatic.active {
			display: block;
		}
		div.alphaScreen.active {
			opacity: 1;
			right: 0;
			display: block;
		}
		div#alphaPage2.alphaScreen.active, div#alphaPage3.alphaScreen.active {
			background: rgba(0,0,0,0.3);
			height: 510px;
		}
		div#alphaPage2.alphaScreen.active {
			height: auto;
			padding-bottom: 50px;
		}
		div#alphaPage2 {
			.yes, .no {
				display: none;
			}
			.yes.active, .no.active {
				display: block;
			}
		}
		div#alphaPage3 {
			padding-top: 5%;
		}
	}
}
body.landingPage.new {
	background: @blueGreen;
  div.fourohfour-image {
    float: left;
    width: 50%;
    img {
      width: 40%;
      margin: 55px 30%;
    }
  }
  div.fourohfour-prompt {
    float: left;
    width: 40%;
    h2 {
      margin-top: 30px;
      font-family: @font6;
      font-size: 50px;
      line-height: 65px;
      color: @white;
    }
    h2.fourohfour {
      margin-top: 97px;
    }
    p {
      font-family: @font6;
      font-size: 18px;
      color: rgba(255,255,255,0.8);
      a {
        color: @white;
      }
      a:hover {
        color: rgba(255,255,255,0.95);
        text-decoration: none;
      }
    }
    div.btn-holder {
      margin: 0 auto;
      margin-top: 25px;
      background: rgba(0, 0, 0, 0.3);
      padding: 10px;
      .radius;
      width: 180px;
      a.btn.important {
        border: 1px solid darken(@brightBlueNew,12%);
        background: @brightBlueNew;
        width: 160px;
        font-family: @font5;
        font-size: 18px;
        .insetDrop(0;1px;0;0;rgba(255,255,255,0.25);0;1px;1px;0;rgba(0,0,0,0.25));
      }
      a.btn.important:hover {
        border: 1px solid lighten(@brightBlueNew,8%);
        background: lighten(@brightBlueNew,8%);
      }
    }
  }
	header.landingPage {
		.noBoxShadow;
		background: none;
		nav.container {
			ul.navItems {
				float: right;
				margin-top: 12px;
				li {
					float: left;
					margin: 0 11px;
					p {
						font-family: @font6;
						margin-top: 10px;
						color: @grey6;
					}
					a {
						font-family: @font6;
						.colorFade;
						top: 8px;
						font-size: 18px;
						position: relative;
						color: rgba(255,255,255,0.7);
					}
					a.login:hover {
						color: @white;
						text-decoration: none;
					}
					a.btn.getStarted {
						top: 0;
						.bgColorFast;
						padding: 8px 14px;
						border: 2px solid @white;
					}
					a.btn.getStarted.notScrolled {
						.noBoxShadow;
						color: @white;
					}
					a.btn.getStarted.scrolled {
						background: @buttonGreen;
						color: @white;
						border-color: @white;
					}
					a.btn.getStarted.notScrolled:hover {
						background: @buttonGreen;
						color: @white;
					}
					a.btn.getStarted.scrolled:hover {
						.textShadow(1px;1px;0;rgba(0,0,0,0.4));
						background: lighten(@buttonGreen,10%);
					}
				}
			}
		}
	}
}
footer.main {
	width: 100%;
	height: 55px;
	background: @footer;
	padding-top: 10px;
	font-family: @font5;
	position: fixed;
	bottom: 0;
	p.copyright {
		margin-top: 6px;
		margin-bottom: 0;
		width: 30%;
		float: left;
		font-size: 12px !important;
		color: rgba(255,255,255,0.7);
	}
	ul {
		float: right;
		li {
			float: left;
			padding: 5px 20px;
			a {
				color: rgba(255,255,255,0.7);
			}
			a:hover {
				text-decoration: none;
				color: rgba(255,255,255,0.85);
			}
		}
	}
}
footer.main.big {
	width: 100%;
	position: absolute;
	bottom: 0;
	left: 0;
	background: @bgBlue2;
	height: 200px;
	.container {
		height: 200px;
		position: relative;
		ul.main {
			float: left;
			li.cat {
				width: 180px;
				font-size: 20px;
				color: @white;
				float: left;
				ul.sub {
					margin-top: 5px;
					width: 100%;
					clear: left;
					li {
						padding: 2px 0;
						font-size: 14px;
						width: 100%;
					}
				}
			}
		}
		p.getInTouch {
			width: 138px;
			margin-top: 8px;
			float: right;
			position: relative;
			color: @white !important;
			font-size: 20px !important; 
		}
		p.telephone {
			width: 138px;
			margin-top: 2px;
			float: right;
			clear: right;
			position: relative;
			color: @white !important;
			font-size: 20px !important; 
		}
		ul.social {
			float: none;
			position: relative;
			top: 50px;
			right: -425px;
			li {
				padding: 0;
				height: 40px;
				width: 40px;
				border: 1px solid @white;
				.radius(100px);
				margin: 0 5px;
				a {
					display: block;
					padding: 6px 12px;
					height: 100%;
					width: 100%;
					font-size: 18px;
				}
			}
			li:first-child {
				a {
					padding: 6px 15px;
				}
			}
			li:last-child {
				a {
					padding: 6px 10px;
				}
			}
		}
		ul.small {
			float: left;
			position: absolute;
			top: 160px;
			left: 0px;
			li {
				a {
					font-size: 12px;
				}
			}
			li:first-child {
				a:hover {
					color: rgba(255, 255, 255, 0.7);
				}
			}
		}
	}
}

form#fbComment {
	position: relative;
	h3.complete {
		padding: 0 160px;
		margin-top: 30px;
		.fontStyle(@blueGreen;28px;400);
		margin-bottom: 10px;
	}
  div.textarea-holder {
    position: relative;
    padding-bottom: 10px;
  }
	textarea {
		padding: 10px 7px;
		width: 70%;
		min-height: 200px;
		.radius;
		color: darken(@grey5,10%);
		border: 1px solid darken(@grey4,10%);
		.insetShadow(0;0;3px;rgba(0,0,0,0.2));
		margin: 25px 15%;
	}
	span#commentCounter {
		text-align: right;
		position: absolute;
		right: 16%;
		bottom: -5px;
		.fontStyle(@grey5;10px;400);
	}
	textarea:focus {
		outline: none !important;
		border: 1px solid @grey5;
		.insetShadow(0;0;3px;rgba(0,0,0,0.3));
	}
	p.email {
		margin-left: 102px;
		input[type="email"] {
			width: 400px;
			padding: 7px 10px;
			margin-left: 5px;
			color: darken(@grey5,10%);
			border: 1px solid darken(@grey4,10%);
			.insetShadow(0;0;3px;rgba(0,0,0,0.2));
		}
		input[type="email"]:focus {
			border: 1px solid @grey5;
			.insetShadow(0;0;3px;rgba(0,0,0,0.3));
		}
		input[type="email"].error {
			border: 1px solid @red1;

		}
	}
	button#submitComment {
		border: none;
		background: @blueGreen;
		.fontStyle(@white;20px;300);
		width: 24%;
		margin: 0 38%;
		padding: 12px 20px;
		text-align: center;
		.radius;
	}
    p.emailError {
    	right: 50px;
		width: 50%;
		display: none;
		position: absolute;
		bottom: 125px;
		.fontStyle(@red1;12px;500);
		margin-bottom: 2px;
		line-height: 13px;
    }
    span.email {
		position: absolute;
		bottom: 120px;
		.fontStyle(darken(@grey5,10%);10px;500);
    }
    button#submitComment {
    	margin-top: 25px;
    }
	button#submitComment:hover {
		background: lighten(@blueGreen,10%);
	}

	button#submitComment:focus {
		outline: none;
	}
	button#submitComment.disabled {
		background: lighten(@blueGreen,15%);
		color: @grey3;
		cursor: default;
	}
}


/*The Settings Page */
.settings #mainContent {
  background: @grey2;
}
div.settingsPage {
	font-family: @font5;
	div.settingsHeader {
		padding-top: 10px;
		background: @white;
		border-bottom: 2px solid @bgBlue;
		height: 60px;
		h2 {
			float: left;
			width: 250px;
			margin-top: 4px;
			margin-bottom: 4px;
			padding-left: 40px;
			.fontStyle(@grey7;28px;300) !important;
		}
		a.back {
			position: relative;
			top: 33px;
			i {
				margin-right: 3px;
				font-size: 12px;
			}
		}
		ul.settingsList {
			margin-top: 10px;
			float: right;
			width: 880px;
			padding-left: 20px;
			height: 40px;
			li {
				float: left;
				padding: 8px 24px;
				position: relative;
				a {
					font-family: @font5;
					.fontStyle(@blueLight;16px;600);
				}
				a:hover {
					text-decoration: none;
					color: darken(@blueLight,10%);
				}
				a.active {
					color: darken(@blueGreen,15%);
					cursor: default;
				}
				a#inboxworthy.active {
					cursor: pointer;
				}
			}
			li.active:after {
				content: '';
				display: block;
				position: absolute;
				bottom: 0;
				margin-left: 50%;
				left: -8px;
				height: 0;
				width: 0;
				border-style: solid;
				border-width: 0 8px 8px 8px;
				border-color: transparent transparent @bgBlue transparent;
			}
		}
		ul.settingsList.settings {
			height: 5px;
		}
	}
	div.settingsBody {
		min-height: 550px;
		div.nameCard {
			float: left;
			margin-top: 25px;
			margin-left: 10%;
			width: 20%;
			.brandInfo {
				position: relative;
				top: 20px;
				height: 120px;
				width: 175px;
				.boxShadow(0;0;2px;@grey6);
				background: @white;
				margin-bottom: 30px;
				img.logo {
					margin: 10px 0;
					width: 175px;
					max-height: 100px;
					padding: 5px 7px;
					background: @white;
				}
			}
		}
		div.accountSettings {
			float: left;
      		width: 100%;
			ul.subTabs {
				height: 50px;
				margin-left: 85px;
				li {
					float: left;
					margin: 0 5px;
					margin-top: 50px;
					.radius;
					border: 2px solid @bgBlue;
					a {
						padding: 4px 10px;
						display: block;
						height: 100%;
						width: 100%;
					}
					a:hover {
						text-decoration: none;
					}
					a:focus {
						text-decoration: none;
					}
				}
				li.active {
					background: @bgBlue;
					a {
						color: @white;
					}
				}
			}
		}
		div.settingsContent {
      		margin-left: 20px;
      		margin-right: 20px;
			padding: 10px 30px;
			input {
				.radius;
				border: 1px solid @grey5;
				.insetDrop(0;1px;1px;1px;rgba(0,0,0,0.05);0;1px;1px;0;rgba(0,0,0,0.05));
				padding: 10px 8px;
				font-size: 16px;
			}
			input:focus {
				outline: none;
				border: 1px solid @blueDark;
				.insetDrop(0;0;2px;0;lighten(@blueLight,10%);0;0;2px;0;lighten(@blueLight,5%));
			}
			input#id_logo {
				border: none;
				.noBoxShadow;
				margin-top: 40px;
				color: #ffffff;
			}
			input#id_zendesk_subdomain {
				padding-right: 120px;
			}
			span.zendesk_link {
				color: @grey5;
				font-size: 16px;
				font-weight: 600;
				position: relative;
				left: -120px;
			}
			form.form-horizontal {
				padding: 25px 0;
				width: 100%;
				h3 {
					margin-top: 0px;
          			font-size: 20px;
				}
				div.success {
					margin: 15px 0;
					width: 59%;
					padding: 10px;
					.radius;
					background: @buttonGreen;
					color: @white;
					text-align: center;
				}
				div.error {
					margin: 15px 0;
					width: 59%;
					padding: 10px;
					.radius;
					background: @red1;
					p {
						color: @white !important;
						margin-bottom: 0;
					}

				}
				div.errorHolder {
					height: 40px;
					width: 230px;
				    left: 202px;
				    top: 55px;
				    position: absolute;
				    padding: 2px 6px;
				    z-index: 951;
					background: @red1;
					.radius;
				    span.error {
				    	padding: 0 !important;
				    	margin: 0 !important;
						font-size: 11px !important;
						text-align: center;
						text-transform: uppercase;
						line-height: 12px;
						font-weight: 600;
						position: relative;
						top: 40%;
						transform: translateY(-50%);
						color: @white;
				    }
				}
				div.errorHolder:before {
		            border-left: 7px solid transparent;
		            border-bottom: 7px solid @red1;
		            border-right: 7px solid transparent;
		            content: '';
		            display: block;
		            position: absolute;
		            top: -7px;
		            left: 32px;
				}
				input {
					width: 66%;
					padding: 8px;
					font-size: 14px;
				}
				select {
					background: @white;
					.noBoxShadow !important;
					width: 66%;
					height: 36px;
					border-color: #a3a3a3 !important;
				}
				input.disabled {
					background: @grey2;
				}
				div.control-group {
					position: relative;
					float: left;
					width: 620px;
					margin: 15px 0;
					padding: 15px 0;
					ol {
						position: absolute;
						margin-bottom: 0px;
						padding: 0;
						top: 1px;
						left: 63px;
						border-bottom: none;
						li {
							padding: 1px 15px;
							.radius;
							height: 18px;
							background: rgba(0,0,0,0.6);
							text-align: center;
							color: @white;
							font-size: 11px;
						}
						li:before {
							z-index: 951;
							border-left: 5px solid transparent;
							border-top: 5px solid transparent;
							border-bottom: 5px solid transparent;
							border-right: 5px solid rgba(0,0,0,0.6);
							content: '';
							display: block;
							position: absolute;
							top: 4px;
							left: -10px;
						}
					}
					div.controls {
						p {
							margin-top: 9px !important;
							font-weight: 600 !important;
						}
					}
				}
				div.control-group.logo {
					height: 150px;
				    .logoWrapper {
				    	float: left;
						position: relative;
						height: 120px;
						width: 175px;
						.boxShadow(0;0;2px;@grey6);
						background: @white;
						margin-bottom: 20px;
						img.logo {
							max-width: 175px;
						    position: absolute;
						    margin: auto;
						    top: 0;
						    bottom: 0;
						    left: 0;
						    right: 0;
							max-height: 100px;
							padding: 5px 7px;
							background: @white;
						}
					}
					button.btn.uploadLogo {
						float: left;
						clear: none !important;
						padding: 10px 14px;
						margin-top: 40px;
						margin-left: 70px;
						font-size: 14px;
					}

				}
			}
			div.add-card-form {
				width: 60%;
				height: 120px;
				h4 {
					margin-top: 20px;
					margin-bottom: 0;
				}
				div.error {
					width: 100%;
				}
				div.control-group {
					float: left;
					padding: 0 1%;
					margin: 5px 0 !important;
					label {
						float: none;
						width: 98%;
					}
					input {
						width: 100%;
						padding: 8px;
						.insetDrop(0;1px;1px;1px;rgba(0,0,0,0.05);0;1px;1px;0;rgba(0,0,0,0.05));
					}
					input.invalid-input {
						border-color: @red;
					}
					select {
						width: 48%;
						margin-right: 4px;
						height: 38px;
						line-height: 38px;
						.insetDrop(0;1px;1px;1px;rgba(0,0,0,0.05);0;1px;1px;0;rgba(0,0,0,0.05));
					}
				}
				div.control-group.number {
					width: 45%;
				}
				div.control-group.security {
					width: 21%;
				}
				div.control-group.expiration {
					width: 34%;
				}
			}
			form#addUser.form-horizontal {
				.control-group {
					float: left;
					width: 565px;
					input {
						width: 100%;
					}
				}
				button.btn.invites {
					width: 150px;
					clear: none;
					margin-top: 24px;
					margin-left: 8px;
					float: left;
				}

			}
			form#updateUsers {
				button.btn.update {
					margin-top: 30px;
					margin-left: 575px;
				}
			}
			.control-group {
				margin: 30px 0;
		        label {
					float: left;
					margin-top: 9px;
					min-width: 200px;
					font-size: 14px;
					font-weight: 400;
					color: @grey7;
				}
				i.fa-check-circle {
			 		float: left;
			 		position: absolute;
			 		top: 24px;
			 		right: 18px;
			 		color: @buttonGreen;
			 		font-size: 20px;
			 	}
			 	i#pwCorrect {
			 		left: 108px;
			 	}
			 	i#confirmCorrect {
			 		left: 168px;
			 	}
			}
			button, a.btn {
				float: left;
				clear: left;
				padding: 14px 20px;
				background: @blueLight;
				.fontStyle(@white;16px;700);
				border: none;
				margin: 15px 0;
				margin-left: 461px;
				.textShadow(0;1px;0;rgba(0,0,0,0.15));
				.insetShadow(0;-3px;0;0;rgba(0,0,0,0.3));
			}
			button:hover, a.btn {
				.textShadow(0;1px;0;rgba(0,0,0,0.3));
			}
		}
		#account.settingsContent {
			display: block;
		}
		#billing.settingsContent {
			div.payment-wrapper {
				div#paymentPopup {
					margin: 0 245px;
				}
			}
			form#billing {
				position: relative;
				a.change-plan.btn {
					margin: 0;
					position: absolute;
					right: 422px;
					top: 20px;
				    font-size: 12px;
				    padding: 6px 8px;
				}
				fieldset#BillingInfo {
					div.plan-info, div.opens-info {
						width: 620px;
						float: left;
						clear: left;
						position: relative;
					    padding: 5px 10px;
						.insetDrop(0;1px;3px;1px;rgba(0,0,0,0.08);0;1px;1px;0;rgba(0,0,0,0.05));
						background: @white;
						.radius(3px);
						border: 1px solid #c3c3c3;
						div.control-group {
							margin: 0;
							top: 0;
							padding: 2px 0;
							width: 600px;
							border-top: 2px #E6ECEF solid;
							p {
								float: right;
								margin-right: 3px;
								span {
									display: inline;
								}
								span.edit-payment {
									margin-left: 15px;
									color: @OBGreen;
									cursor: pointer;
									font-size: 12px;
									font-weight: 400;
									i {
										color: #a3a3a3;
										font-size: 14px;
									}
								}
								span.edit-payment:hover {
									color: lighten(@OBGreen, 5%);
									i {
										color: lighten(#a3a3a3, 5%);
									}
								}
							}
							p.service-level {
								text-transform: capitalize;
							}
						}
						div.control-group.service-level {
							border-top: none;
						}
					}
					h4 {
						font-family: @font5;
						font-size: 16px;
					}
					div.control-group {
						margin: 5px 0;
						position: relative;
						top: 10px;
						clear: left;
						h4 {
							margin-bottom: 0;
						}
						div.radio {
							height: 30px;
							margin-left: 9px;
							input[type='radio'] {
								width: auto;
								float: left;
								clear: left;
								width: auto;
								position: relative;
								top: 4px;
							}
							label.radio {
								margin-top: 0;
								padding-left: 8px;
								cursor: default;
								span {
									display: inline;
								}
							}
						}
					}
					.add-card-form {
						float: left;
						position: relative;
						top: 10px;
						margin-bottom: 30px;
						height: auto;
						div.card-form {
							height: 100px;
							div.control-group {
								clear: none;
								label {
									margin-top: 0;
								}
							}
						}
					}
					p.cancel-prompt {
						clear: left;
					    float: left;
					    margin: 4px 0;
					    width:  620px;
					    text-align: right;
					    font-size: 10px;
					}
				}
			}
		}
		#password.settingsContent, #user.settingsContent, #billing.settingsContent {
			display: block;
			border-top: 1px solid @grey3;
		}
		div#credit.settingsContent {
			margin-left: 0;
			padding: 20px 30px;
			display: block;
			span {
				display: inline;
			}
	    	h2 {
	    		font-size: 34px;
	    		font-weight: 400;
	    		color: #333;
	    		text-align: center;
	    	}
	    	h3 {
	    		margin-top: 12px;
	    		font-size: 19px;
	    		font-weight: 400;
	    		color: @grey7;
	    		text-align: center;
				span.planType {
					text-transform: capitalize;
				}
	    	}
	    	p.wrong-plan {
	    		margin: 0;
	    		width: 100%;
	    		text-align: center;
	    	}
			.creditInfo {
				form {
					width: 70%;
					margin: 0 15%;
					fieldset {
						margin: 20px 0;
						h3 {
							font-size: 18px;
							text-align: left;
							margin-bottom: 0;
						}
					}
					fieldset#billing-period, fieldset#payment-method, fieldset#credit-info {
						div.control-group {
							margin: 5px 0;
							div.radio {
								height: 30px;
								margin-left: 9px;
								input[type='radio'] {
									float: left;
									clear: left;
									width: auto;
									position: relative;
									top: 4px;
								}
								label.radio {
									margin-top: 0;
									padding-left: 8px;
									cursor: default;
									span.planPrice {
										color: @grey5;
									}
									span.save {
										color: @green1;
									}
								}

							}
						}
					}
					fieldset#credit-info, div.enter-new-card {
						h4 {
							margin-top: 25px;
							font-size: 16px;
							font-family: @font5;
						}
						div.control-group {
							margin-bottom: 30px;
						}
						div.add-card-form {
							width: 100%;
						}
					}
					
					ul.total-price {
						margin-top: 30px;
						margin-left: 7px;
						float: left;
						width: 600px;
						border: 1px solid @grey5;
						.bottomRadius(4px);
						border-top: 4px solid #4192b6;
						background: @white;
						li {
							height: 50px;
							width: 96%;
							margin: 0 2%;
							border-bottom: 1px solid @grey4;
							span {
								float: left;
								line-height: 50px;
								display: inline;
							}
							span.price {
								float: right;
							}
						}
						li:last-child {
							border-bottom: none;
							font-weight: 700;
						}
					}
					button.btn {
						clear: none;
						float: right;
						margin-left: 0;
						margin-top: -95px;
						margin-right: 10px;
					}
				}
			}
		}
		#plans.settingsContent {
    		padding-top: 20px;
    		padding-bottom: 30px;
    		margin: 0;
    		background: @white;
	    	h2 {
	    		font-size: 34px;
	    		font-weight: 400;
	    		color: #333;
	    		text-align: center;
	    	}
	    	h3 {
	    		margin-top: 12px;
	    		font-size: 19px;
	    		font-weight: 400;
	    		color: @grey7;
	    		text-align: center;
	    		clear: both;
	    	}
	    	h3.bigger {
	    		position: relative;
	    		top: -11px;
	    		width: 733px;
	    		padding: 15px 0;
	    		border: 1px solid #e3e3e3;
	    		.radius(5px);
	    		margin: 0 173px;
	    	}
	    	h4 {
	    		position: relative;
	    		top: -30px;
	    		font-family: @font5;
	    		margin: 0;
	    		font-size: 15px;
	    		font-weight: 400;
	    		color: @grey7;
	    		text-align: center;
	    		clear: both;
	    	}
	    	div.annual-prompt {
	    		margin-top: 0px;
	    		width: 100%;
	    		height: 28px;
		    	h3.annual-prompt {
		    		margin: 0;
		    		font-size: 16px;
		    		color: #4e8eba;
		    	}
	    	}
	    	div.btn-toggle {
		    	height: 45px;
		    	width: 30%;
		    	margin: 8px 35% !important;
		    	margin-top: 18px !important;
		      button {
		      	float: left;
		      	clear: none;
		      	margin: 0;
		      	width: 50%;
			    text-align: center;
			    .radius;
			    display: block;
			    background: @white;
			    color: @OBLGrey5;
			    font-size: 14px;
			    font-weight: 500;
			    padding: 7px 0;
			    border: 1px solid @OBLGrey4;
			    .noBoxShadow;
			    .noTextShadow;
			    .slideFast;
		      }

				button:hover {
			      color: @OBGrey1;
			      border: 1px solid @OBLGrey4;
			      text-decoration: none;
			    	.noBoxShadow;
			      .noTextShadow;
			  }
			  button:focus,a.button:focus {
			    outline: none;
			  }
		      button.btn-left {
		      	.leftRadius;
		      }
		      button.btn-right {
		      	.rightRadius;
		      }
		      button.active {
		      	background: @blueGreen;
		      	color: @white;
		      }
		      button.active:hover {
		      	cursor: default;
		      }
		      button.btn-left.active {
		      	border-right: none;
		      }
		      button.btn-right.active {
		      	border-left: none;
		      }
		    }
	    	ul.planTypes {
	    		margin: 0 30px;
	    		margin-top: 7px;
	    		li.planType {
	    			float: left;
	    			width: 33.3%;
	    			padding: 0 20px;
	    			h2 {
	    				.topRadius(4px);
	    				width: 100%;
	    				background: @blueGreen;
	    				margin: 0;
	    				padding: 6px 0;
	    				text-align: center;
	    				color: @white;
	    				font-size: 26px;
	    				margin-bottom: 2px;
	    			}
	    			div.price-container {
	    				width: 100%;
	    				background: @blueGreen;
	    				padding-top: 40px;
	    				padding-bottom: 25px;
	    				margin-bottom: 2px;
	    				p.price {
	    					width: 100%;
	    					text-align: center;
	    					color: @white;
	    					font-size: 40px;
	    					line-height: 40px;
	    					font-weight: 600;
	    					margin-bottom: 5px;
	    					span.prefix {
	    						font-size: 26px;
	    						line-height: 26px;
	    						font-weight: 400;
	    						position: relative;
	    						top: -14px;
	    						margin-right: 3px;
	    					}
	    					span.suffix {
	    						font-size: 22px;
	    						line-height: 22px;
	    						font-weight: 400;
	    						margin-left: 0;
	    					}
	    				}
	    				p.annually {
	    					width: 100%;
	    					text-align: center;
	    					color: @white;
	    					font-size: 10px;
	    					padding-bottom: 0;
	    				}
	    				p.persona {
	    					width: 100%;
	    					text-align: center;
	    					color: @white;
	    					font-size: 16px;
	    					padding: 6px 40px;
	    				}
	    				button.btn.sign-up {
	    					float: none;
	    					width: 50%;
	    					margin: 0 25%;
	    					margin-top: 6px;
	    					margin-bottom: 17px;
	    					padding: 10px 0;
	    					background: @white;
	    					color: #4e8eba;
	    					.noTextShadow;
	    					.boxShadow(0;3px;3px;-2px;rgba(0,0,0,0.4))
	    				}
	    				button.btn.btn-disabled.sign-up {
	    					opacity: 1;
	    					.noBoxShadow;
	    					background: none;
	    					color: @white;
	    				}
	    			}
	    			div.opens-container {
	    				width: 100%;
	    				background: #6092b3;
	    				padding: 10px 0;
	    				height: 43px;
	    				p.opens, p.overages {
	    					width: 100%;
	    					text-align: center;
	    					color: @white;
	    					margin-bottom: 1px;
	    					font-size: 18px;
	    					font-weight: 700;
		    				span.opens {
		    					font-size: 14px;
		    					font-weight: 400;
		    				}
	    				}
	    				p.opens.free {
	    					margin-top: 13px;
	    				}
	    				span.overages {
	    					font-size: 12px;
	    					font-weight: 400;
	    					span.overage-amount {
	    						font-size: 16px;
	    						font-weight: 700;
	    					}
	    				}
	    			}
	    			div.opens-container.not-pro {
	    				padding: 10px 0;
	    			}
	    			ul.feature-list {
	    				margin-bottom: 50px;
	    				width: 100%;
	    				border: 1px solid #cfcfcf;
	    				background: #f8f8f8;
	    				padding: 0 7px;
	    				.bottomRadius(4px);
						.boxShadow(0;2px;3px;-2px;rgba(0,0,0,0.2));
	    				li {
	    					padding: 7px 0;
	    					width: 100%;
	    					color: #333;
	    					text-align: center;
	    					border-bottom: 1px solid #eaeaea;
	    				}
	    				li.disabled {
	    					color: #a3a3a3;
	    					text-decoration: line-through;
	    				}
	    				li.toggle {
	    					border-bottom: none;
	    					a:hover {
	    						text-decoration: none;
	    					}
	    				}
	    			}
	    		}
	    	}
	    	ul.free-features {
	    		margin-bottom: 15px;
	    		li {
	    			text-align: center;
	    		}
	    	}
		}
		#faq.settingsContent {
			background: @white;
			h2 {
				margin-top: 0;
				margin-bottom: 6px;
				font-size: 18px;
				line-height: 24px;
				padding-top: 25px;
			}
			p {
				margin-top: 6px;
				margin-bottom: 0;
			}
			h2.title {
				padding-top: 0;
	    		font-size: 34px;
	    		font-weight: 400;
	    		color: #333;
	    		text-align: center;
	    		margin-bottom: 15px;
			}
			div.left {
				padding: 0 2%;
				padding-bottom: 30px;
				width: 50%;
				float: left;
			}
			div.right {
				padding: 0 2%;
				padding-bottom: 30px;
				width: 50%;
				float: right;


				p.faq-contact {
				    float: left;
				    clear: both;
				    width: 50%;
				    font-size: 16px;
				    margin: 40px 25%;
				    text-align: center;
				}
			}
		}
		#people.settingsContent {
			padding: 10px 0;
			width: 80%;
			margin: 0 10%;
			h4 {
				font-family: @font5;
				width: 100%;
				.fontStyle(@grey7;24px;400);
				margin-top: 50px;
			}
			.alpha {
				h4 {
					margin-top: 5px;
					font-size: 20px;
					line-height: 24px;
				}
			}
			form#addUser {
				padding-top: 30px;
				margin-left: 0;
				fieldset {
					margin-left: 0;
				}
				div.success, div.error {
					width: 726px;
					p {
						width: 100%;
						text-align: center;
					}
				}
			}
			form#updateUsers {
				button {
					float: none;
				}
				div.success, div.error {
					width: 726px;
					p {
						width: 100%;
						text-align: center;
					}
				}
			}
			table {
				margin: 20px 0;
				width: 80%;
				padding: 0 10px;
				td {
					background: none !important;
					input.checkbox {
						margin-left: 15px;
					}
					i.fa-remove {
						margin-left: 24px;
						cursor: pointer;
						font-size: 18px;
						margin-top: 1px;	
					}
					i.fa-remove:hover {
						opacity: 0.8;
					}
					i.fa-remove.disabled {
						opacity: 0.5;
					}
				}
			}
			.btn.invites {
			}
		}
		div.accountSettings.autoReply {
			width: 100%;
		}
		#autoReply.settingsContent {
			div.autoReplySwitches {
				float: left;
				width: 55%;
				table {
					.radius();
					width: 95%;
					border-collapse: separate;
  					border-spacing: 0;
					thead {
						tr {	
							th {
								padding: 4px 10px;
								.gradientOffWhiteToGrey;
								border-top: 1px solid @grey3;
								border-bottom: 1px solid @grey5;
								color: @grey6;
							}
							th:first-child {
								border-left: 1px solid @grey3;
								.topLeftRadius(4px);
							}
							th:last-child {
								border-right: 1px solid @grey3;
								.topRightRadius(4px);
							}
						}	
					}
					tbody {
						tr {
							td {
								background: @grey2;
								padding: 10px;
								border-bottom: 1px solid darken(@grey4,5%);
								border-top: 1px solid @white;
							}
							&:hover {
							    cursor: pointer;
							}
						}
						tr.selected {
						    td {
							background-color: #4192b6;
							color: white;
						    }
						}
						tr:last-child td {
							border-bottom: 1px solid @grey3;
						}
					}
					tr {
						height: 30px;
						padding: 3px;
						td:first-child {
							border-left: 1px solid @grey3;
						}
						td:last-child {
							border-right: 1px solid @grey3;
						}
					}
					tr:last-child {
						td:first-child {
							.bottomLeftRadius();
						}
						td:last-child {
							.bottomRightRadius();
						}
					}
				}
			}
			div.autoReplyResponse {
				border-left: 2px solid @blueGreen;
				float: left;
				width: 45%;
				padding-left: 4px;
				form {
					label {
						width: 90%;
						margin: 4px 5%;
					}
					input[type="text"], textarea, select, button {
						width: 90%;
						margin: 0 5%;
					}
					button {
						margin-top: 15px;
					}
					textarea {
						resize: none;
					}
				}
			}
			div.buttonHolder {
				width: 10%;
				margin: 0 40%;
				button {
					margin-top: 40px;
					width: 100%;
					float: none;
				}
			}
		}
		#reports.settingsContent {
			border-top: 2px solid @grey4;
			padding: 10px 0;
			width: 80%;
			margin: 0 10%;
			h3 {
				float: left;
				width: 115px;
			}
			.dropdown {
				float: left;
				top: 18px;
				width: 140px;
				.btn {
					padding: 7px 20px;
					font-size: 14px;
				}
				.dropdown-menu {
					width: 100%;
				}
			}
			.dropdown.open {
				.btn {
					border: none !important;
				}
			}
			span.date {
				float: left;
				clear: left;
				font-size: 16px;
				margin-top: 15px;
			}
			ul.reportCategories {
				margin-top: 110px;
				width: 100%;
				li.category {
					clear: left;
					width: 100%;
					min-height: 120px;
					margin-bottom: 20px;
					h4 {
						min-width: 120px;
						float: left;
						font-size: 20px;
						font-family: @font5;
					}
					.categoryContent {
						width: 930px;
						float: right;
					}
				}
				li#satisfactionReport {
					.categoryContent {
						.col {
							width: 228px;
							margin-left: 12px;
							margin-right: 5px;
						}
					}
				}
				li#ratingsReport {
					height: 270px;
					div.rateit div.rateit-range {
						background: url('@{base}images/starsSmall.svg');
					}
					div.rateit div.rateit-selected {
						background: url('@{base}images/starsSmall.svg') left -24px;
					}
					div.rateit.overall {
						position: relative;
						top: -4px;
						float: left;
					}
					span.overallRating {
						margin-left: 5px;
						position: relative;
						top: -4px;
						.fontStyle(@grey7;20px;600);
					}
					.categoryContent {
						position: relative;
						left: 120px;
						top: -30px;
					}
					ul.ratingCategories {
						position: relative;
						left: -95px;
						margin-top: 25px;
						width: 95%;
						li.ratingCategory {
							width: 18%;
							margin-right: 2%;
							float: left;
							label {
								width: 100%;
								text-align: center;
								.fontStyle(@grey7;18px;600);
							}
							ul.ratings {
								li {
									div.rateit-range{
									background: none;
									}
									span {
										position: relative;
										top: -6px;
										font-size: 16px;
									}
								}
							}
							span.average {
								width: 96%;
								margin: 0 2%;
								border-top: 3px solid @grey7;
								text-align: center;
								font-size: 20px;
							}
						}
					}
				}
				li#reviewsReport {
					height: 320px;
					div.categoryContent {
						position: relative;
						top: -30px;
						left: 20px;
						width: 830px;
						div.overall {
							position: relative;
							top: -10px;
							float: left;
							width: 40px;
							height: 40px;
							img {
								width: 100%;
							}
						}
						span.overallRating {
							margin-top: -4px;
							margin-left: 5px;
							.fontStyle(@grey7;20px;600);
						}
						ul.reviewFaces {
							position: relative;
							top: 30px;
							left: -130px;
							li {
								width: 100px;
								height: 120px;
								a {
									display: block;
									margin-left: 20px;
									width: 60px;
									height: 60px;
									img {
										width: 100%;
									}
								}
								span {
									width: 100%;
									clear: left;
									text-align: center;
									font-size: 20px;
								}
								span.title {
									font-size: 14px;
								}
							}
						}
					}
				}
			}
		}
	}
}

#seals.settingsBody {
	padding: 0 5%;
	p {
	    padding-top: 20px;
	    padding-left: 60px;
	    margin-bottom: 25px;
	}
	div#seal-editor {
	    padding: 0;
	    width: 47%;
	    float: left;
		p#description {
			padding-left: 0;
			padding-top: 0;
			width: 100%;
		}
	}
	.selected {
	    border: 1px solid black;
	}
	a.seal {
		clear: left;
		float: left;
		width: 155px;
		display: block;
		margin-top: 10px;
		margin-bottom: 10px;
		img {
			width: 100%;
		}
	}
	table.sealList {
		tbody {
			tr {
				td {
					div.code {
						margin-left: 35px;
						width: 700px;
						textarea {
							width: 100%;
						}
					}
					a.btn {
						margin-left: 105px;
						margin-top: 30px;
						width: 80px;
					}
				}
			}
		}
	}
    div#options {
    	h3 {
    		float: none;
    		width: 100%;
    	}
    }
    div.fieldset {
    	.boxShadow(0;0;1px;1px;@grey5);
    	.radius;
		table.seal-customizer {
			width: 98%;
			margin: 5px 1%;
			tbody {
				tr {
					td {
						label {
							width: 100%;
						}
						input, select, div.sp-replacer, span.select2 {
							margin-bottom: 15px;
						}
						select {
							cursor: pointer;
						}
				    	input[type="text"], span.selection, select {
				    		width: 100%;
				    		height: 24px;
				    	}
				    	span.select2-container--open {
				    		span.selection:hover {
				    			border-color: @grey5;
				    		}
				    	}
				    	div.fontSelector {
				    		display: none;
				    	}
				    	option:first {
				    		color: @grey5;
				    	}
				    	span.selection {
				    		span {
				    			border: none;
				    		}
				    		span.select2-selection--single {
				    			background: none;
			    				.select2-selection__rendered {
			    					line-height: 15px;
			    					color: @grey6;
			    					padding: 0;
			    				}
				    		}
				    	}
				    	div.rangeslider {
				    		float: left;
				    		width: 85%;
				    		height: 10px;
				    		margin-top: 5px;
				    		margin-bottom: 20px;
				    		div.rangeslider__fill {
				    			height: 10px;
				    			background: @blueGreen;
				    		}
				    		div.rangeslider__handle {
				    			width: 20px;
				    			height: 20px;
				    			top: -5px;
				    		}
				    		div.rangeslider__handle:after {
				    			width: 9px;
				    			height: 9px;
				    		}
				    	}
				    	input.rangeText {
				    		position: relative;
				    		top: -4px;
				    		font-size: 16px;
				    		float: left;
				    		width: 15%;
				    		text-align: center;
				    		border: none;
				    		.noBoxShadow;
				    		background: none;
				    	}
					}
				}
			}
		}
    }
    div.fieldset.toggle {
    	overflow: hidden;
    	max-height: 0;
    	opacity: 0;
    	-webkit-transition: max-height 1.5s linear, opacity 2s linear 0.25s;
    	-moz-transition: max-height 1.5s linear, opacity 2s linear 0.25s;
    	transition: max-height 1.5s linear, opacity 2s linear 0.25s;
    }
    div.fieldset.toggle.active {
    	max-height: 800px;
    	opacity: 1;
    	-webkit-transition: max-height 1s linear 0.1s, opacity 0.5s linear;
    	-moz-transition: max-height 1s linear 0.1s, opacity 0.5s linear;
    	transition: max-height 1s linear 0.1s, opacity 0.5s linear;
    }
    div.fieldset.preview {
    	position: fixed;
    	left: 50%;
    	top: 20%;
    	width: 556px;
    	.noBoxShadow;
    	div.actualPreview {
    		position: relative;
    		h3 {
    			span {
    				font-size: 14px;
    			}
    		}
    		div#previewSmall {
    			border: 2px solid @grey6;
    			.radius;
    			padding-bottom: 2%;
    			background: @grey3;
    			width: 400px;
    			position: relative;
    			margin: 0 auto;
    			img#background {
    				position: absolute;
    				top: 0;
    				left: 1px;
    				width: 100%;
    			}
    			div#prevWrapperSmall {
    				h2 {
    					font-size: 4px;
    				}
    			}
    		}
    	}
    }
	h3 {
		width: 160px;
		float: left;
	}
	.codeWrapper {
		float: left;
		position: relative;
		margin-left: 30px;
		width: 650px;
		margin-bottom: 10px;
		p {
			margin-bottom: 20px;
			line-height: 20px;
			font-size: 16px !important;
		}
		.vosEnabled {
			span {
				float: left;
			}
			ul {
				position: relative;
				top: -15px;
				float: left;
				left: 5px;
				li {
					float: left;
					width: 40px;
					margin-right: 4px;
					img {
						width: 100%;
					}
				}
			}
		}
		.code {
			span {
				margin-top: 15px;
				margin-bottom: 4px;
				width: 85%;
			}
			textarea.code {
				width: 700px;
				.radius;
				border: 1px solid @grey5;
				padding: 5px;
			}
		}
		.code.restricted {
			textarea.code {
				background: @grey2;
			}
		}
	}

	div.preview {
	}
	a.preview:hover {
	    text-decoration: none;
	}

	#newSeal {
	    display: block;
	    margin-left: auto;
	    margin-right: auto;
	    margin-top: 40px;
	    margin-bottom: 10px;
	}
}



#emailPreview {
    width:180%;
    border:1px solid black;
    padding:5px;
    margin:5px;
}


div#seal-editor div#messageSealOptions table tbody tr td {
    padding-top: 10px;
}




.settingsBody {
	#accountBar {
		height: 102px;
		a.back {
			position: relative;
			top: 78px;
			right: 643px;
			float: right;
			font-size: 12px;
		}
		a.back:hover {
			text-decoration: none;
		}
		#stepTitle {
			margin-left: 30px;
			width: 60%;
			margin-top: 0;
			padding: 2px 0;
			img.stepIcon {
				width: 80px;
				height: 80px;
				margin-right: 5px;
				float: left;
			}
			h2 {
				margin-bottom: 5px;
				.fontStyle(@grey7;24px;400);
				line-height: 24px;
			}
		}
		a.btn {
			float: left;
			position: relative;
			top: 32px;
			width: 90px;
			text-align: center;
			margin-left: 130px;
		}
	}
}
.settingsBody.plans {
	background: @white;
}

ul.iwNav {
	float: left;
	margin-top: 35px;
	margin-left: 25px;
	width: 150px;
	li {
		margin: 14px 0;
		width: 100%;
		a {
			display: block;
			width: 100%;
			padding: 5px 8px;
			font-size: 14px;
			.radius(3px);
			position: relative;
		}
		a:hover {
			text-decoration: none;
		}
		a.active {
			border: 1px solid darken(@greenGrey1,3%);;
			background: darken(@greenGrey1,3%);;
			.insetShadow(0;1px;0;@grey2);
			color: darken(@blueGreen,15%);
		}
		a.active:hover {
			color: darken(@blueGreen,15%);
		}
		a.active:after {
			z-index: 952;
			border-top: 15px solid transparent;
			border-bottom: 15px solid transparent;
			border-left: 15px solid darken(@greenGrey1,3%);;
			content: '';
			display: block;
			position: absolute;
			top: 0;
			right: -15px;
		}
	}
}

.settingsBody.iw {
	float: left;
	#accountBar {
		margin-left: 35px;
	}
	.setupContainer {
		margin-left: 35px;
	}
	#toDoListHolder {
		margin-left: 35px;
		ul#toDoList {
			margin-left: 0;
		}
	}
}

.setupContainer {
	margin-left: 198px;
	margin-bottom: 30px;
	width: 734px;
	border: 1px solid @grey4;
	border-top: none;
	.bottomRadius;
	#reasons {
		float: none;
		width: 634px;
		padding: 10px 0;
		margin-left: 50px;
		ul.reasons {
			li {
				font-family: @font5;
				padding: 0;
				height: 80px;
				border-bottom: 1px solid @grey4;
				img {
					margin-top: 15px;
					clear: left;
				}
				p {
					height: 100%;
					padding-top: 38px;
					margin-bottom: 0;
					float: left;
					width: 30%;
					border-right: 1px solid @grey4;
				}
				div.status {
					padding-left: 20px;
					margin-top: 22px;
					float: left;
				}
				span {
					display: inline;
				}
				.cbWrapper {
					float: left;
					margin-left: 10px;
					margin-top: 25px;
				}
			}
		}
	}
}

#programReqs.setupContainer {
	#reasons {
		ul.reasons {
			li {
				p {
					padding-top: 24px;
					width: 40%;
				}
			}
			li.monitoring {
				p {
					padding-top: 7px;
				}
			}
		}
	}
}
#selfAssessment.setupContainer {
	#signup.selfAssessment {
		height: 350px;
		form {
			min-height: 250px;
			margin-top: 0;
			position: relative;
			table.selfAssessment {
				width: 100%;
				margin: 0;
				position: absolute;
				top: -10px;

				tr:nth-child(3), tr:nth-child(4), tr:last-child {
					th {
						label {
							position: relative;
							top: 20px;
						}
					}
				}
				th {
					top: -10px;
					width: 419px;
					margin-top: 60px;
					label {
						margin-left: 0;
					}
				}
				td {
					margin-top: 73px;
					width: 423px;
					margin-left: -2px;
					ul {
						li:first-child {
							display: none;
						}
					}
				}
			}
		}
		ul.cb {
			top: 140px;
			width: 100%;
			margin-left: 0;
			div.count {
				top: -145px;
			}
			button:hover {
				cursor: default;
			}
		}
		ul.navButtons {
			top: 150px;
			li.left {
				left: -55px;
			}
			li.right {
				right: -55px;
			}
		}
	}
}
#messages.setupContainer {
	#tags.section {
		h3{ 
			.navButtons {
				margin-left: 222px !important;
				span {
					margin-left: 342px !important;
				}
			}
		}
	}
	#messageWrapper.monitoring {
		.header .subject a.display {
			position: relative;
		}
		height: 700px;
		.itemBody {
			left: 0;
			width: 607px;
			height: 660px;
			.message {
				width: 599px;
				img {
					width: 596px;
				}
			}
			.tags {
				height: 152px;
				width: 100%;
			}
		}
	}
	#messages {
		.messageStats{
			padding: 0;
			left: 235px;
			li {
				width: 200px;
			}
		}
		#monitoring {
			.bottomNav {
				border-left: none;
				padding-left: 0;
				top: 240px;
				right: 260px;
			}
		}
	}
}
#points.setupContainer {
	margin-top: 0;
	position: relative;
	padding-top: 20px;
	h3 {
		margin-top: 0;
		width: 100%;
		text-align: center;
	}
	ul.pointSort {
		margin-top: 0 !important;
		position: relative;
		top: 10px;
		padding-bottom: 20px;
		margin-right: 35px;
		li:nth-child(1), li:nth-child(2), li:nth-child(3), li:nth-child(4) {
			div.position {
				background: @bgBlue;
				span {
					color: @white;
				}
			}
		}
	}
	div.updateWrapper {
		position: absolute;
		margin-top: 10px;
		width: 270px;
		top: 55px;
		right: 10px;
		ul {
			li {
				list-style-type: disc;
			}
		}
		button {
			width: 110px;
			position: relative;
			top: 20px;
			left: 55px;
		}
	}
}
#VOS.setupContainer {
	height: 380px;
	p.required {
		float: right;
		position: relative;
		right: -60px;
	}
}

div.alert-modal {
    position: fixed;
    top: 40%;
    width: 33%;
	z-index: 1000;
	margin: 0 33%;
	height: 180px;
	background: @blueGrey3;
	padding: 0;
	.boxShadow(0;1px;2px;2px;rgba(0,0,0,0.2));
	.radius;
	i.alertIcon {
		position: relative;
		top: 4px;
		font-size: 36px;
		color: rgba(0,0,0,0.7);
		float: left;
		margin-top: 10px;
		margin-left: 22px;
	}
	i.fa-times-circle {
		position: absolute;
		font-size: 16px;
		top: 10px;
		right: 10px;
		color: darken(@grey5,10%);
		cursor: pointer;
	}
	i.fa-times-circle:hover {
		color: darken(@grey5,20%);
	}
	h2 {
		float: left;
		width: 80%;
		margin-left: 15px;
		margin-top: 16px !important;
		border-bottom: none !important;
		margin-bottom: 7px;
		font-size: 22px;
		line-height: 20px;
		font-weight: 600;
		font-family: @font5;
	}
	p {
		font-family: @font5;
		color: #4e4e40;
		margin-left: 70px;
		font-size: 13px !important;
		font-weight: 400;
		padding-right: 10px;
	}
    div.buttonContainer {
    	border-top: 1px solid rgba(0,0,0,0.1);
    	.bottomRadius(4px);
    	width: 100%;
    	background: @grey2;
    	position: absolute;
    	bottom: 0;
    	padding: 14px;
    	div.buttonHolder {
    		width: 50%;
    		margin: 0 25%;
	    	button, a.btn {
	    		width: 40%;
	    		margin: 0 5%;
	    		float: right;
	    		margin: 0 8px;
	    		padding: 10px 20px;
	    	}
    	}
    }
}
div#deletePopup.alert-modal, div#upgradePopup.alert-modal, div#addTeamPopup.alert-modal, div#upgradeTeamPopup.alert-modal, div#noNamePopup.alert-modal {
	width: 470px;
	margin: 0 335px;
}

div#deletePopup.svAdmin, div#noNamePopup.svAdmin {
	margin: 0 40%;
	a.btn {
		margin-left: 20px;
		margin-right: 20px;
	}
}
div#unsubscribeSealPrompt {
	margin: 0 5%;
}

div#upgradePopup, div#addTeamPopup, div#upgradeTeamPopup, div#paymentPopup {
	height: 210px;
	top: 25%;
	background: rgba(0,0,0,0.2);
	border: solid rgba(0,0,0,0.2);
	border-width: 14px 10px;
	.boxShadow(0;0;7px;rgba(0,0,0,0.4));
	.radius;
	div.wrapper {
		height: 190px;
		position: relative;
    	top: -4px;
		background: @white;
		.radius;
		div.popup-header {
			position: relative;
			height: 55px;
			.topRadius(4px);
			background: @blueGreen;
			i.alertIcon {
				display: block;
				height: 30px;
				width: 30px;
				.radius(30px);
				background: @white;
				color: @blueGreen;
				font-size: 26px;
				padding: 3px 8px;
			}
			h2 {
				font-size: 21px !important;
				margin-top: 20px !important;
				color: @white !important;
				font-weight: 400 !important;
			}
			h2.users {
				font-size: 19px !important;
			}
			div.close {
				position: absolute;
				right: 7px;
				top: 0;
				i {
					font-size: 14px;
				}
			}
		}
		p {
			line-height: 22px;
			margin-top: 16px;
		}
		div.buttonContainer {
			border: none;
			background: @white;
			div.buttonHolder {
				a.btn.important {
					width: 100%;
					margin: 0;
					font-family: @font5;
					font-size: 16px;
				}
			}
		}
	}
}

div#addTeamPopup {
	height: auto;
	div.wrapper {
		height: auto;
		div.popup-header {
			i.alertIcon {
				font-size: 20px;
				padding: 5px;
			}
		}
		form {
			padding: 0 10px;
			padding-top: 20px;
			font-family: @font5;
			div.error, div.success {
				margin: 0;
				margin-bottom: 20px;
				p {
					margin: 0;
					padding: 0;
					text-align: center;
					color: @white;
				}
			}
	        label {
				float: left;
				margin-left: 11px;
				margin-top: 7px;
				min-width: 60px;
				font-size: 14px;
				font-weight: 400;
				color: @grey7;
			}
			input {
				float: left;
				width: 345px;
		        .radius;
		        border: 1px solid @grey5;
		        .insetDrop(0;1px;1px;1px;rgba(0,0,0,0.05);0;1px;1px;0;rgba(0,0,0,0.05));
		        padding: 6px 8px;
		        font-size: 12px;
		    }
		    button.btn.important {
		    	position: relative;
		    	right: -238px;
		    	font-family: @font5;
		    	margin-top: 20px;
		    }
		    ul.team {
		    	padding-bottom: 7px;
		    	label {
		    		margin-left: 10px;
		    		width: 95%;
		    		float: none;
		    		border-bottom: 1px solid @grey4;
		    	}
		    	li {
		    		margin-left: 14px;
		    		padding-bottom: 10px;
		    	}
		    }
		}
	}
}
div.popup-overlay {
	z-index: 999;
	position:fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.5);
}
div#paymentPopup {
	height: 360px;
	width: 550px;
	margin: 0 265px;
	div.wrapper {
		height: 340px;
		background: #f8f8f8;
		div.popup-header {
			width: 366px;
			margin-left: 82px;
			background: #f8f8f8;
			height: 33px;
			span.pre-header {
			    margin-top: 8px;
			    color: #b3b3b3;
			    font-size: 16px;
			    font-weight: 300;
			}
			h2 {
				font-weight: 600 !important;
				color: @OBGreen !important;
				width: 100%;
				margin-top: 0 !important;
				padding-top: 32px;
				margin-left: 0;
				text-align: left !important;
				span {
					display: inline;
				}
				span.plan {
					text-transform: capitalize;
				}
				span.price {
					font-size: 12px;
				}
			}
			h2.plan-summary {
				padding-bottom: 21px;
    			border-bottom: 2px #E6ECEF solid !important;
			}
		}
		div.creditInfo {
			form.form-horizontal {
				padding: 24px 0;
				fieldset#credit-info {
					div.add-card-form {
						position: relative;
						width: 366px;
					    margin-top: 14px;
					    margin-left: 82px;
					    height: 180px;
					    padding: 10px 28px;
						.insetDrop(0;1px;3px;1px;rgba(0,0,0,0.08);0;1px;1px;0;rgba(0,0,0,0.05));
						background: @white;
						.radius(3px);
						border: 1px solid #c3c3c3;
						div.error {
							height: 40px;
							width: 230px;
						    left: 55px;
						    position: absolute;
						    padding: 2px 6px;
						    z-index: 951;
						    p {
						    	padding: 0 !important;
						    	margin: 0 !important;
								font-size: 11px !important;
								text-align: center;
								text-transform: uppercase;
								line-height: 12px;
								font-weight: 600;
								position: relative;
								top: 50%;
								transform: translateY(-50%);
						    }
						}
						div.error.number {
							top: 64px;
						}
						div.error.expiry {
							top: 139px;
						}
						div.error.cvc {
							top: 139px;
							left: 205px;
						}
						div.error:before {
				            border-left: 7px solid transparent;
				            border-bottom: 7px solid @red1;
				            border-right: 7px solid transparent;
				            content: '';
				            display: block;
				            position: absolute;
				            top: -7px;
				            left: 32px;
						}
						div.card-form {
							div.control-group label {
								margin-top: 0;
								font-size: 16px;
								color: #838383;
								font-weight: 500;
							}
							div.control-group.number {
								width: 100%;
							}
							div.control-group.expiration {
								width: 50%
							}
							div.control-group.security {
								width: 50%;
							}
							h4 {
								margin-top: 20px;
								margin-bottom: 0;
							}
							div.error {
								width: 100%;
							}
							div.control-group {
								float: left;
								padding: 0 1%;
								margin: 5px 0 !important;
								label {
									float: none;
									width: 98%;
								}
								input {
									width: 100%;
									padding: 8px;
									.insetDrop(0;1px;1px;1px;rgba(0,0,0,0.05);0;1px;1px;0;rgba(0,0,0,0.05));
								}
								input.invalid-input {
									border-color: @red;
								}
								select {
									width: 48%;
									margin-right: 4px;
									height: 38px;
									line-height: 38px;
									.insetDrop(0;1px;1px;1px;rgba(0,0,0,0.05);0;1px;1px;0;rgba(0,0,0,0.05));
								}
							}

						}
					}
				}
			}
		}
		div.confirm-payment {
			position: relative;
			margin-top: 26px;
			width: 366px;
			margin-top: 40px;
		    margin-left: 82px;
		    height: 180px;
		    padding: 10px 0;
			ul.feature-list {
				li {
					font-size: 18px;
					height: 48px;
					padding: 10px 0;
					text-align: center;
					color: #939393;
					font-weight: 400;
					span.left {
						float: left;
						padding: 0 5px;
						width: 50%;
						text-align: right;
					}
					span.right {
						float: right;
						padding: 0 5px;
						width: 50%;
						text-align: left;
					}
					b {
						font-weight: 600;
					}
					span {
						display: inline;
					}
					span.plan {
						text-transform: capitalize;
					}
				}
				li.price {
					b {
						color: #4e4e40;
						font-weight: 700;
					}
				}
				li:last-child {
					border-top: 2px #E6ECEF solid;
					border-bottom: 2px #E6ECEF solid;
				}
			}
		}
		div.payment-success, div.payment-fail {
			margin-top: 50px;
			p {
				padding: 0;
				margin: 0;
				width: 100%;
				text-align: center;
				span {
					display: inline;
				}
			}
			p.charged {
				font-size: 11px !important;
				margin-top: 5px !important;
				line-height: 15px;
			}
			p.success-icon, p.fail-icon {
				i {
					margin-top: 8px;
					color: @OBBlue;
					font-size: 45px;
				}
			}
			p.fail-icon {
				i {
				    position: relative;
				    top: 0;
				    right: 0;
					color: @OBRed;
				}
			}
			p.receipt {
				width: 366px;
				margin-top: 0 !important;
				padding-top: 10px !important;
			    margin-left: 82px !important;
			    text-align: left !important;
			    font-size: 20px !important;
			    height: 30px;
			}
			p.charge-info {
				height: 16px;
				width: 366px;
				margin-top: 1px;
			    margin-left: 82px;
			    text-align: left;
				font-size: 12px !important;
				color: #a3a3a3;
				b {
					color: #838383;
				}
			}
			ul.payment-list {
				position: relative;
				width: 366px;
			    margin-top: 8px;
			    margin-left: 82px;
			    height: 80px;
			    padding: 5px 10px;
				.insetDrop(0;1px;3px;1px;rgba(0,0,0,0.08);0;1px;1px;0;rgba(0,0,0,0.05));
				background: @white;
				.radius(3px);
				border: 1px solid #c3c3c3;
				li:first-child {
					border-bottom: 2px #E6ECEF solid;
					span.left {
						span {
							display: inline;
						}
						span.capitalize {
							text-transform: capitalize;
						}
					}
				}
				li {
					font-size: 12px;
					line-height: 35px;
					height: 35px;
					font-weight: 400;
					span.left {
						width: 80%;
						text-align: left;
					}
					span.right {
						width: 20%;
						text-align: right;
					}
				}
				li.paid {
					font-weight: 600;
				}
			}
			div.contact-us {
				margin-top: 7px;
				p {
					font-size: 11px !important;
				}
			}
			div.contact-us.fail {
				width: 100%;
				position: absolute;
				bottom: 4px;
			}
		}
	}

	p.receipt {
		width: 100%;
		font-size: 11px !important;
		text-align: center !important;
		margin: 0 !important;
	    clear: both;
	    height: 30px;
	    position: relative;
	    top: -1px;
	    padding: 0;
		input[type='checkbox'] {
			margin-right: 5px;
		}
	}
	button.btn {
		background: @OBBlue;
		margin-top: 24px;
		margin-bottom: 15px;
		margin-left: 140px;
		width: 250px;
		padding: 11px 20px;
        .fontStyle(@white;16px;700);
        .textShadow(0;1px;0;rgba(0,0,0,0.15));
        .insetShadow(0;-3px;0;0;rgba(0,0,0,0.3));
	}
	button.btn.make-payment {
		margin-top: -7px;
	}
}

div#paymentPopup.freePrompt {
	top: 30%;
	height: 210px;
	div.wrapper.freePrompt {
		height: 190px;
		div.popup-header {
			h2 {
				span {
					display: inline;
				}
			}
		}
		div.free-prompt {
			p {
			    line-height: 22px;
			    margin: 36px 84px;
			    font-size: 15px !important;
				span {
					display: inline;
				}
			}
		}
	}
}

div#upgradePopup.feed, div#upgradePopup.reports, div#addTeamPopup, div#upgradeTeamPopup {
	margin: 0 235px !important;
}

div#upgradeTeamPopup, div#upgradePopup.people {
	height: 248px;
	div.wrapper {
		height: 228px;
		p {
			input {
				display: inline;
				margin-right: 8px;
				position: relative;
				top: 0;
			}
		}
	}
}

/* Initial Login Wizard */
body.initial {
  background: lighten(@bgBlue,15%);
  .profile.container {
    width: 850px;
    padding: 0;
    .radius(2px);
    .boxShadow(0;0;1px;rgba(0,0,0,0.3));
    margin-top: 105px;
    margin-bottom: 55px;
    border: none;
    .header {
      width: 100%;
      padding: 4px 30px;
      background: lighten(@blueGreen,7%);
      h2 {
        margin-top: 13px;
        .fontStyle(@white;28px;400);
      }
    }
    span.error {
      margin-top: 25px;
      width: 100%;
      text-align: center;
      font-family: @font5;
      font-size: 18px;
      color: @red1;
    }
    ul.steps {
      width: 60%; 
      margin: 0 20%;
      height: 9px;
      .insetShadow(0;0;1px;1px;lighten(@green,2%));
      .radius(3px);
      position: relative;
      top: 40px;
      font-family: @font5;
      li.step {
        position: absolute;
        top: -18px;
        padding: 2px;
        height: 46px;
        width: 46px;
        .radius(40px);
        background: @grey2;
        .insetShadow(0;0;1px;1px;lighten(@grey2,2%));
        border: 1px solid @green;
        .wrapper {
          height: 40px;
          width: 40px;
          background: @grey3;
          .radius(42px);
          p {
            text-align: center;
            padding: 8px;
            .fontStyle(@grey6;18px;600);
          }
          i {
            text-align: center;
            .fontStyle(@white;18px;600);
            display: none;
            padding-top: 11px;
            padding-left: 2px;
          }
        }
        span {
          text-transform: uppercase;
          text-align: center;
          width: 200px;
          position: relative;
          top: 8px;
          left: -80px;
          .fontStyle(darken(@bgBlue,15%);14px;600);
        }
      }
      li.complete {
        .insetShadow(0;0;1px;1px;lighten(@green,2%));
        .wrapper {
          background: lighten(@green,12%);
          p {
            .fontStyle(@white;18px;600);
          }
        }
      }
      li.active {
        .insetShadow(0;0;1px;1px;lighten(@green,2%));
        .wrapper {
          background: @green;
          p {
            .fontStyle(@white;18px;600);
          }
        }
        span {
          color: @green;
        }
      }
      li#step1 {
        float: left;
        left: -1px;
      }
      li#step2 {
        left: 47%;
      }
      li#step3 {
        float: right;
        right: -1px;
      }
      .progress {
        opacity: 0.5;
        display: block;
        position: absolute;
        height: 7px;
        background: @lightGreen1;
      }
    }
    div.prompt {
      display: none;
      float: left;
      margin-top: 90px;
      padding: 0px;
      width: 100%;
      div#continue {
        width: 100%;
        border-top: 1px solid @grey4;
        padding-top: 20px;
        button.btn.important {
          float: right;
          margin-right: 5%;
          background: @blueGreen;
          width: 150px;
        }
        button.btn.important.btn-disabled {
          color: @grey2;
          background: lighten(@blueGreen,20%);
          .noBoxShadow;
        }
      }
    }
    div#license {
      display: block;
      div#agreementHolder {
        width: 90%;
        margin: 0 5%;
        p.prompt {
          font-family: @font5;
          margin-top: 20px;
          margin-bottom: 15px;
          width: 100%;
          text-align: center;
        }
        div#agreement {
          border: 1px solid @grey4;
          padding: 10px;
          width: 100%;
          background: @white;
          height: 250px;
          overflow-y: scroll;
          h3 {
            margin-left: 0;
            .fontStyle(@grey7;14px;400);
          }
        }
      }
      div#accountForm {
        width: 100%;
        div#tos {
          margin-top: 9px;
          margin-left: 5%;
          label {
            position: relative;
            top: 1px;
            font-family: @font5;
          }
        }
      }
      div#continue {
        margin-top: 13px;
      }
    }
    div#password {
      position: relative;
      div#passwordFormHolder {
        width: 90%;
        margin: 0 5%;
        #passwordForm {
          float: left;
          width: 60%;
          position: relative;
          top: 40px;
          label {
            margin-top: 10px;
            margin-left: 10%;
          }
          input {
            margin-left: 10%;
            width: 80%;
            height: 40px;
            .insetShadow(0;1px;2px;rgba(0,0,0,0.15));
          }
          input:hover {
            border: 1px solid @grey5;
            .insetShadow(0;0;2px;lighten(@green,10%));
          }
          input:focus {
            border: 1px solid @grey6;
            outline: none;
            .insetShadow(0;0;1px;2px;lighten(@green,22%));
          }
          input[disabled] {
            border: 1px solid @grey5;
            .noBoxShadow;
            background: @grey2;
          }
          i.fa-check-circle {
            float: right;
            position: relative;
            top: 10px;
            right: 12px;
            color: @blueGreen;
            font-size: 24px;
          }
        }
        div#pwReqs {
          float: left;
          width: 40%;
          padding: 0 15px;
          margin-top: 60px;
          h4 {
            .fontStyle(@bgBlue;14px;600);
          }
          ul.pwReqs {
            margin-left: 10px;
            li {
              .fontStyle(@grey5;12px;400);
            }
          }
        }
      }
      div#continue {
        position: absolute;
        bottom: -186px;
      }
      div#continue.newUser {
        bottom: -127px;
      }
    }
    div#password.newUser {
      margin-top: 15px;
      display: block;
      h3.newUserPrompt {
        font-size: 20px;
        text-align: center;
      }
    }
    div#sealInstall {
      position: relative;
      top: 100px;
      h4 
      div#codeHolder {
        width: 90%;
        margin: 0 5%;
        p.prompt {
          font-family: @font5;
          margin-top: 20px;
          margin-bottom: 15px;
          margin-left: 3%;
          width: 94%;
        }
        a.seal {
          margin-top: 25px;
          margin-bottom: 15px;
          margin-left: 300px;
        }
        textarea.code {
          margin-top: 15px;
          margin-left: 3%;
          width: 94%;
          .radius;
          border: 1px solid @grey5;
          padding: 5px;
          resize: none;
          background: @grey2;
          font-family: "Courier New", sans-serif;
          font-size: 12px;
        }
      }
      div#continue {
        position: absolute;
        bottom: -110px;
        right: 60px;
        button.btn.important {
          float: right;
          margin-right: 5%;
          background: @blueGreen;
          width: 150px;
        }
      }
    }
  }
  .profile.container.new-user {
  	height: 660px;
  	margin-bottom: 100px;
  }
  .profile.installation.container {
    height: 5000px;
    div.instructions {
      padding: 10px 25px;
      h3 {
        margin-bottom: 30px;
        font-weight: 300;
        padding-bottom: 20px;
        border-bottom: 1px solid lighten(@grey5,15%);
        font-size: 26px;
      }
      h4 {
        margin-top: 20px;
        font-family: @font5;
        font-size: 20px;
        font-weight: 600;
      }
      h4.option {
        font-weight: 400;
        font-size: 15px;
        font-family: @font5;
        margin-bottom: 10px;
        margin-top: 20px;
        margin-left: 100px;
        margin-right: 100px;
      }
      p {
        font-size: 20px;
        font-weight: 400;
        margin: 10px 100px;
        margin-top: 18px;
        font-family: @font5;
      }
      div.steps {
      }
      label {
        font-size: 16px;
        width: 100%;
        margin-top: 10px;
        margin-bottom: 5px;
        margin-left: 100px;
        font-family: @font5;
      }
      img {
        width: 600px;
        margin-left: 100px;
        margin-bottom: 15px;
        border: 1px solid @blueGrey5;
      }
      div#codeHolder {
        width: 600px;
        margin: 0 100px;
        margin-bottom: 40px;
        p.prompt {
          font-family: @font5;
          margin-top: 20px;
          margin-bottom: 15px;
          margin-left: 3%;
          width: 94%;
        }
        a.seal {
          margin-top: 25px;
          margin-bottom: 15px;
          margin-left: 325px;
        }
        textarea.code {
          margin: 0;
          margin-top: 15px;
          width: 100%;
          .radius;
          border: 1px solid @grey5;
          padding: 5px;
          resize: none;
          background: @grey2;
          font-family: "Courier New", sans-serif;
          font-size: 12px;
        }
      }
      div#continue {
        position: absolute;
        bottom: -110px;
        right: 60px;
        button.btn.important {
          float: right;
          margin-right: 5%;
          background: @blueGreen;
          width: 150px;
        }
      }
    }
  }
}

#svAdmin.settingsPage {
	height: 2138px;
	ul.adminOptions {
		padding: 15px 0;
		float: left;
		width: 190px;
		height: 100%;
		border-right: 1px solid @grey4;
		li {
			height: 50px;
			width: 100%;
			padding: 0 15px;
			overflow: hidden;
			a {
				height: 50px;
				line-height: 50px;
				width: 100%;
				text-align: center;
			}
			a.create {
				width: 100%;
				margin: 0;
				.radius;
				background: @grey2;
				border: 1px solid @grey4;
				padding: 4px 5px;
			}
		}
		li.category {
			padding-top: 10px;
			height: 45px;
		}
		li.sub {
			padding: 0 40px;
			height: 25px;
			a {
				line-height: 15px;
				height: 25px;
			}
		}
		li.sub.last {
			margin-bottom: 15px;
		}
		li.active {
			background: @grey2;
			border-top: 1px solid @grey4;
			border-bottom: 1px solid @grey4;
		}
		li.create {
			border-bottom: 3px solid @grey7;
		}
		li.accountSearch {
			position: relative;
			input {
				width: 100%;
			}
			i {
				position: absolute;
				right: 20px;
				top: 11px;
			}
		}
		ul.recent {
			margin-top: 40px;
			padding-left: 5px;
			font-family: @font5;
			h4 {
				font-size: 18px;
				font-weight: 700;
			}
			li {
				border-bottom: 1px solid @grey3;
			}
		}
	}
	div.accountBody {
		width: 1180px; 
		float: left;
		padding: 0 20px;
		overflow-x: scroll;
		#accountStatus {
			span {
				font-weight: 600;
				color: @blueGreen;
			}
			ul {
				li {
					h4 {
						padding-bottom: 4px;
						border-bottom: 1px solid @grey5;
						font-family: @font5;
						width: 200px;
					}
				}
			}
		}
		form.adminUserCreator {
			button {
				margin-top: 10px;
			}
		}
		form.adminAccountCreator {
			button#validate {
				span.validated {
					display: none;
				}
			}
			button#validate.active {
				background: @buttonGreen;
				cursor: default;
				span.unvalidated {
					display: none;
				}
				span.validated {
					display: block;
				}
			}
		}
		#formSuccess {
			margin-top: 20px;
			font-size: 24px;
		}
		h1 {
			font-family: @font5;
		}
		h2 {
			font-size: 20px;
			line-height: 24px;
			span {
				.fontStyle(@blueGreen;16px;400);
			}
		}
		h3 {
			margin-top: 30px;
			margin-bottom: 5px;
			padding-top: 5px;
			border-top: 1px solid @grey7;
			span {
				.fontStyle(@blueGreen;14px;400);
			}
		}
		form {
			margin: 0;
			margin-bottom: 40px;
			width: 500px;
			fieldset {
				width: 100%;
				.control-group {
					margin-top: 10px;
					width: 100%;
					border-top: 1px soldi @grey3;
					label {
						span {
							font-size: 12px;
							font-weight: 300;
						}
					}
					.controls {
						width: 100%;
						input {
							width: 75%;
						}
						input[type="checkbox"] {
							width: auto;
							display: inline;
						}
					}
					.controls.sub {
						margin-left: 15px;
						p {
							font-size: 12px;
						}
					}
					#tags.section {
						h3 {
							padding-bottom: 20px;
							.navButtons {
								margin-left: 95px;
								position: relative;
								span {
									left: -186px !important;
									padding: 0 5px;
								}
							}
						}
					}
					#monitoring {
						.alpha.updatePrompt {
							margin-top: 1550px;
						}
					}
					#messageWrapper.monitoring {
						height: 734px;
						.header {
							.subject {
								font-size: 14px;
								a.display {
									position: relative;
									top: 20px;
								}
							}
						}
						.itemBody {
							margin-top: 55px;
							height: 657px;
							width: 450px;
							left: 0;
							a.message {
								height: 448px;
								width: 100%;
								img {
									width: 448px;
								}
							}
							.tags {
								height: 200px;
								width: 100%;
								input[type="text"] {
									width: 55%;
								}
								p {
									padding-left: 10px;
								}
							}
						}
					}
				}
				.control-group.satisfaction {
					height: 100px;
					.selectScore {
						margin-top: 0 !important;
					}
				}
			}
			a.btn {
				background: @grey4;
			}
		}
		form.export {
			width: 100%;
		}
		form.callRecorder {
			select {
				width: 20%;
				float: left;
				margin-right: 5px;
				margin-bottom: 4px;
			}
			input[type="text"] {
				margin: 8px 0;
				width: 40%;
				margin-right: 60%;
			}
			textarea {
				width: 100%;
				height: 120px;
			}

		}
		div.rating {
			background: @white;
			width: 262px;
			position: fixed;
			top: 150px;
			left: 950px;
			border: 1px solid @grey7;
			.radius;
			padding: 3px 20px;
			h4 {
				text-align: center;
			}
			span {
				width: 100%;
				text-align: center;
				font-size: 20px;
			}
			span.remaining {
				font-size: 14px;
			}
			button.save {
				width: 50%;
				margin-top: 10px;
				margin-bottom: 10px;
				margin-left: 25%;
			}
		}
		ul.tableOptions {
			padding-top: 20px;
			float: left; 
			width: 100%;
			li {
				float: left;
				margin: 10px 5px;
				a {
					padding: 5px 0;
					text-align: center;
					width: 60px;
					span.deselect {
						display: none;
					}
				}
				a.active {
					span.select {
						display: none;
					}
					span.deselect {
						display: block;
					}
				}
			}
			li:last-child {
				float: right;
			}
		}
		table.table {
			margin-top: 30px;
      float: left;
			thead tr {
				th {
					.gradientWhiteToGrey;
					cursor: pointer;
					i {
						display: none;
					}
				}
				th:hover {
					.gradientGreyToWhite;
				}
				th.ascending {
					.gradientGrey1;
					i.fa-caret-down {
						display: block;
					}
				}
				th.descending {
					.gradientGrey1Rev;
					i.fa-caret-up {
						display: block;
					}
				}
			}
			tbody tr {
				cursor: pointer;
				position: relative;
			}
			tbody tr.active {
				td {
					border: none;
					background: @white;
				}
			}
			tr.stuck td, tr.error td {
				background: lighten(@red1, 25%);
			}
			th,td {
				text-align: left; 
				font-size: 12px;
				padding-right: 4%;
				position: relative;
				i {
					top: 27px;
					right: 4px;
					position: absolute;
				}
			}
			td {
				height: 22px;
				line-height: 22px;
				padding-left: 1%;
				button {
					padding: 0 4px;
				}
			}
			a {
				display: block;
				text-decoration: none;
				color: @grey7;
				height: 21px;
				width: 100%;
				padding: 0 4px;
			}
			td.message {
				height: 100px;
			}
			div.message {
				position: absolute;
				top: 20px;
				left: 105%;
				width: 1100px;
			}
		}
		ul.accountTabs {
			height: 30px;
			width: 100%;
			li {
				float: left;
				width: 100px;
				height: 30px;
				a {
					width: 100%;
					height: 100%;
					line-height: 30px;
					text-align: center;
					display: block;
				}
				a.active {
					background: @grey3;
					border: 1px solid @grey5;
					color: @grey7;
				}
			}
		}
		.accountSection {
			display: none;
		}
		.accountSection.active {
			display: block;
		}
	}
	#signup.selfAssessment {
		table.selfAssessment {
			width: 100%;
			margin: 0;
			position: relative;
			th {
				width: 100%;
				position: absolute;
				top: -10px;
			}
			td {
				position: absolute;
				left: 50px;
				width: 400px;
			}
		}
	}
	#reasons {
		ul.reasons {
			li {
				p {
					width: 360px;
					margin-right: 0;
				}
				.cbWrapper {
					float: right;
					top: -45px;
				}
			}
		}
	}
#editSeal {
  p.reviews {
    position: relative;
    top: -2px;
  }
  h3 {
    .fontStyle(@blueGrey5;20px;600);
  }
  h3.header {
    margin-top: 3px;
    height: 80px;
    padding-bottom: 3px;
    border-bottom: 2px solid lighten(@blueGrey5,30%);
    width: 100%;
    a.seal {
      float: left;
      position: relative;
      top: 10px;
      left: 30px;
      display: block;
      .heightAndWidth(68px;159px);
      img {
        width: 159px;
      }
    }

    p.prompt {
      width: 70%;
      float: left;
      margin-left: 50px;
      margin-top: 15px;
      .fontStyle(@grey6;14px;400) !important;
    } 
  }
  .edit {
    height: 30px;
    display: none;
    width: 60px;
    float: right;
    margin-top: -3px;
    margin-right: 35px;
    background: @blueLight;
  }
  #Signup.edit {
    display: block;
  }
  background: @white;
  padding: 0 15px;
  min-height: 650px;
  margin-bottom: 10px;
  a.close {
    opacity: 0.6;
    margin-right: 37px;
    i.exit {
      display: block;
      .heightAndWidth(25px;25px);
      background: url('@{base}images/exits.png');
    }

  }
  a.close:hover {
    opacity: 1;
    i.exit {
      background-position: 0 -25px;
    }
  }
  .editHeader {
    margin-left: -15px;
    margin-right: -15px;
    height: 60px;
    padding-top: 15px;
    .gradientOffGreyBlue;
    .boxShadow(0;1px;1px;-1px;@bgBlue);
    h2 {
      margin-top: -5px;
      padding-left: 15px;
      .fontStyle(darken(@bgBlue,5%);24px;400) !important;
      .textShadow(0;0;2px;@white);
    }
  }

  #options {
    position: relative;
    height: 110px;
    clear: both;
    border-bottom: 2px solid @grey3;
    
    a.seal {
      display: block;
      position: absolute;
      bottom: 30px;
      left: 20px;
      .heightAndWidth(68px;159px);
      img {
        width: 159px;
      }
    }
    p.prompt {
      display: block;
      position: absolute;
      left: 33px;
      bottom: 10px; 
      .fontStyle(@grey7;14px;500) !important;
    }
    p.desc {
      margin-top: 30px;
      float: right;
      width: 72%;
      .fontStyle(@grey6;14px;500) !important;
    }
  }

  .setupContent {
    display: none;
  }

  ul.keyPoints {
    .noBoxShadow;
    clear: left;
    li {
      .fontStyle(#555555;14px;500);
      padding: 5px;
      p {
        margin-bottom: 0px;
      }
      i.check {
        float: left;
        display: block;
        height: 30px;
        width: 20px;
        position: relative;
        top: 6px;
        margin-right: 7px;  
        background: url('@{base}images/check.png') no-repeat;
      }
    }
  }

  #categories.setupContent {
    display: block;
    #setup.designOption {
      float: left;
      width: 450px;
    }
    #feedbackPreview {
      float: left;
      width: 450px;
      h3 {
        .fontStyle(@blueGrey5;20px;500);
      }
      .fbForm {
        left: -5px;
        margin-top: -60px;
        height: 640px;
        a.close {
          left: 425px;
        }
        position: relative;
        margin-left: 15px;
        width: 450px;
        display: block;
        form {
          margin-top: 0;
          #recommendScore {
            height: 160px;
          }
          .selectScore {
            position: relative;
            top: 35px;
            width: 365px;
            li {
              padding-top: 2px;
              width: 26px;
              height: 26px;
              margin: 4px 3px;
            }
          }
          p.left {
            margin-left: 0px;
          }
          p.right {
            margin-right: 0px;
          }
        }
        ul.fbOptions {
          margin-top: 40px;
          width: 402px;
          li.option {
            width: 395px;
            button {
              width: 390px;
            }
            #fbMetrics {
              li {
                position: relative;
                label {
                  margin-top: 8px;
                }
                .rateit {
                  top: 2px;
                  position: absolute;
                }
                .value {
                  position: absolute;
                  top: 19px;
                  left: 135px;
                }
              }
            }
            ul.reviewFaces {
              li {
                margin-right: 24px;
                img {
                  width: 50px;
                }
              }
            }
          }

        }

      }
    }
  }

  #design.setupContent {
    label {
      width: 200px;
    }
  }

  #preview.setupContent {
    .previewBox {
      padding-left: 0px;
      padding-top: 5px;
      height: 355px;
      width: 440px;
      margin-left: 25px;
      background: url('@{base}images/widgetOutline1.png');
    }
  }

  .designOption {
    margin-bottom: 15px;



    h3 {
      .fontStyle(@blueGrey5;20px;500);
      margin-bottom: 15px;
    }

    h3.click {
      margin-top: 0px;
      width: 160px;
      float: left;
    }

    h3.preview {
      margin-left: 25px;
    }

    p.prompt {
      clear: both;
      margin-left: 40px;
      margin-right: 60px !important;
      .fontStyle(@grey6;14px;500) !important;
    }

    select {
      width: 200px;
      font-size: 20px;
    }

    div.option {
      width: 100%;
      min-height: 50px;
      margin-bottom: 15px;
      label.option {
        width: 200px !important;
        margin-left: 30px;
        float: left;
        .fontStyle(@blueGrey5;16px;500);
      }


      p.rb {
        clear: both;
        margin-left: 40px;
        .fontStyle(@grey6;12px;500) !important;
        input {
          margin-right: 7px;
        }
      }

      p.rb.inactive {
        opacity: 0.5;
      }

      .fbDisplayOptions {
        padding-left: 20px;
        opacity: 0.5;
      }

      .fbDisplayOptions.active {
        opacity: 1;
      }

      .ui-switchbutton {
        margin-left: 15px;

        .ui-switchbutton-handle {
          height: 20px;
          width: 40px;

        }


        span {
          position: relative;
          top: -3px;
          font-size: 12px;
        }
      }

      .category {
        padding-top: 10px;
        padding-left: 20px;
      }

      div.header{
        clear: both;
        width: 360px;
        height: 37px !important;
        font-family: @font1;
        .fontStyle(@grey7;16px;500);
        border: 1px solid @grey6;
        background: @grey3;
        .position {
          float: left;
          height: 35px;
          width: 35px;
          margin-right: 10px;
          border-right: 1px solid @grey6;
          background: @white;
          span {
            margin: 8px 10px;
          }
        }
        p {
          margin: 2px 7px !important;
          i {
            margin-top: 3px;
            font-size: 23px;
            margin-right: 8px;
          }
          a.show {
            float: right;
            color: @grey7;
            i.icon-plus-sign {
              display: none;
            }
          }
          a.show:hover {
            text-decoration: none;
          }
        }
      }


      li.disabled {
        opacity: 0.5;
      }

      ul.fbOptions {
        float: left;
        clear: both;
        margin-left: 30px;
        width: 475px;
        li.option {
          margin: 15px 20px;
          input {
            position: relative;
            left: 415px;
            top: -30px;

          }
          #fbMetrics {
            width: 400px;
            label {
              font-size: 11px;
            }
          }

        }
      }

      .selectScore {
        margin-top: 15px;
      }

      .reviewOptions {
        margin-top: 5px;
        margin-left: 15px;
        p {
          float: left;
          .fontStyle(@grey6;14px;600) !important;
        }
      }

      .subcategory {
        padding: 15px 40px;
        min-height: 100px;
        ul.subcategories {
          margin-left: 30px;
          padding: 3px;
          li {
            .fontStyle(@grey7;14px;500);
            a {
              font-weight: 600;
              i {
                margin-right: 4px;
                margin-top: 1px;
              }
              i.smileDark {
                height: 23px;
                width: 23px;
                display: block;
                img {
                  width: 23px;
                }
              }
            }
            a:hover {
              text-decoration: none;
            }
          }
        }
      }
    }

    .option {
      float: left;
    }
    #fbOptions.option {
      margin-bottom: 60px;
    }
    #referral.option {
      position: relative;
      top: -40px;
    }
  }

  .bottomNav {
    position: absolute;
    left: -15px;
  }

}

/*Load Key Points Font */

#editSeal.signup {
  .editHeader {
    margin-bottom: 0px;
  }
  .setupContent {
    display: block;
  }
  #design {
    width: 400px;
    float: left;
  }
  #preview {
    width: 530px;
    float: left;
    padding-left: 15px;
    p {
      width: 65%;
      .fontStyle(@grey7;14px;500);
    }
      
  }
  ul.sealFormat {
    width: 100%;
    li {
      float: left;
      width: 20%;
      .seal {
        width: 130px;
        img {
          width: 130px;
        } 
      }
    }
  }
  ul.sealOptions {
    width: 100%;
    float: left;
    height: 300px;
    padding-top: 30px;
    li.sealOption {
      float: left;
      width: 50%;
      position: relative;
      h3 {
        font-size: 16px;
      }
    }
    li {
      float: left;
      width: 50%;
      p {
        margin-top: 135px;
        font-family: @font5;
        .fontStyle(@grey7;20px;400) !important;

      }
    }
    li.seal1 {
      height: 400px;
      a.seal1 {
        position: absolute;
        top: 370px;
        margin-left: 110px;
        width: 130px;
        img {
          width: 130px;
        }
      }
      .widget2 {
        width: 375px;
        height: 325px;
        position: relative;
        .brandLogo {
          display: none;
          float: left;
          position: relative;
          top: 10px;
          left: 10px;
          width: 65px;
          height: 65px;
          border: 1px solid @grey5;
          z-index: 999;
          img {
            width: 63px;
          }
        }
        .svInfo {
          position: relative;
          display: none;
          height: 30px;
          float: left;
          margin-top: 16px;
          margin-left: 20px;
          border-left: 2px solid @grey3;
          h3 {
            margin-top: 5px;
            margin-bottom: 0;
            margin-left: 6px;
            font-size: 16px;
            font-weight: 700;
            color: @blueGreen;
          }
          button {
            position: absolute;
            top: -7px;
            right: -50px;
            background: @white;
            border: 1px solid @grey3;
            i {
              margin-top: 1px;
              font-size: 16px;
              color: @grey5;
            }
          }
          button:hover {
            border: 1px solid darken(@grey3,3%);
            .boxShadow(0;1px;1px;rgba(0,0,0,0.15));
          }
        }
        .brandInfo {
          display: none;
          position: relative;
          top: 50px;
          width: 100%;
          height: 38px;
          background: @newBlueLight;
          p.brandSite {
            float: left;
            position: absolute;
            left: 88px;
            top: 9px;
            .fontStyle(@bgBlue;14px;400) !important;
          }
          span.ratedDate {
            position: absolute;
            right: 20px;
            top: 12px;
            float: right;
            .fontStyle(@bgBlue;12px;400);

          }
        }
        ul.keyPoints {
          display: none;
          width: 355px;
          height: 80px;
          clear: left;
          position: relative;
          margin-right: 0;
          top: 28px;
          left: 10px;
          li {
            font-family: @font3;
            padding: 5px;
            p {
              .fontStyle(#555555;14px;500) !important;
              margin-bottom: 0px;
              margin-right: 0 !important;
            }
            i.check {
              float: left;
              display: block;
              height: 30px;
              width: 20px;
              position: relative;
              top: 1px;
              margin-right: 7px;  
              background: url('@{base}images/check.png') no-repeat;
            }
          }
        }
        div.about {
          width: 96%;
          margin-left: 2%;
          margin-top: 70px;
          padding-top: 10px;
          font-family: @font3;
          .seal {
            position: absolute;
            top: 167px;
            left: 8px;
            height: 61px;
            float: left;
            margin-top: 1px;
            width: 140px;
            margin-right: 5px;
            img {
              margin-top: 4px;
              width: 135px;
            }
          }
          p.aboutPrompt {
            display: none;
            width: 205px;
            float: left;
            margin-top: 4px !important;
            margin-left: 4px !important;
            margin-right: 0 !important;
            margin-bottom: 0 !important;
            font-size: 12px !important;
            b {
              display: inline;
              color: @blueGreen !important;
              font-size: 14px !important;
            }
          }
        }
        div.about.right {
          p.aboutPrompt {
            width: 205px;
            float: left;
            margin-left: 2px !important;
            font-size: 12px !important;
          }
          .seal {
            cursor: pointer;
            position: absolute;
            left: 215px;
            float: left;
            margin-left: 3px;
            border-right: none;
            img {
              float: right;
              width: 135px;
            }
          }
        }
        div.popUpFooter {
          display: none;
          width: 96%;
          margin-left: 2%;
          margin-top: 72px;
          border-top: 1px solid @grey3;
          padding-top: 5px;
          a {
            float: left;
            margin: 0 5px;
            .fontStyle(@grey5;10px;400);
          }
          a:hover {
            color: @grey5;
            text-decoration: underline; 
          }
          p.powered {
            float: right;
            margin: 0 !important;
            margin-top: -2px !important;
            margin-right: 6px !important;
            .fontStyle(darken(@grey5,10%);10px;300) !important;
            span.sv {
              font-family: @font1;
              .fontStyle(@grey7;12px;700);
              b {
                .fontStyle(@blueGreen;12px;500);
              }
            }
          }
        }     
      }

      .widget2.active {
        .boxShadow(0;0;2px;rgba(0,0,0,0.3));
        border: 1px solid @grey5;
        .brandLogo {
          display: block;
        }
        .svInfo {
          display: block;
        }
        .brandInfo {
          display: block;
        }
        ul.keyPoints {
          display: block;
          li {
            font-family: @font3;
            padding: 5px;
            p {
              .fontStyle(#555555;14px;500) !important;
              margin-bottom: 0px;
              margin-right: 0 !important;
            }
            i.check {
              float: left;
              display: block;
              height: 30px;
              width: 20px;
              position: relative;
              top: 1px;
              margin-right: 7px;  
              background: url('@{base}images/check.png') no-repeat;
            }
          }
        }
        div.about {
          display: block;
          width: 96%;
          margin-left: 2%;
          margin-top: 70px;
          border-top: 1px solid @grey3;
          padding-top: 10px;
          font-family: @font3;
          .seal {
            position: relative;
            top: 0;
            left: 0;
            border-right: 1px solid @grey3;
            img {
              margin-top: 4px;
              width: 135px;
            }
          }
          p.aboutPrompt {
            display: block;
          }
        }
        div.about.right {
          p.aboutPrompt {
            width: 205px;
            float: left;
            margin-left: 2px !important;
            font-size: 12px !important;
          }
          .seal {
            cursor: default;
            float: left;
            margin-left: 3px;
            border-right: none;
            border-left: 1px solid @grey3;
            img {
              float: right;
              width: 135px;
            }
          }
        }
        div.popUpFooter {
          display: block;
          width: 96%;
          margin-left: 2%;
          margin-top: 72px;
          border-top: 1px solid @grey3;
          padding-top: 5px;
          a {
            float: left;
            margin: 0 5px;
            .fontStyle(@grey5;10px;400);
          }
          a:hover {
            color: @grey5;
            text-decoration: underline; 
          }
          p.powered {
            float: right;
            margin: 0 !important;
            margin-top: -2px !important;
            margin-right: 6px !important;
            .fontStyle(darken(@grey5,10%);10px;300) !important;
            span.sv {
              font-family: @font1;
              .fontStyle(@grey7;12px;700);
              b {
                .fontStyle(@blueGreen;12px;500);
              }
            }
          }
        }     
      }
      
      .widget {
        display: block;
        height: 245px;
        width: 380px;
        border: 1px solid @grey4;
        position: relative;
        .widgetHeader {
          height: 36px;
          width: 100%;
          background: @grey3;
          position: relative;
          .brandLogo {
            position: relative;
            top: 7px;
            left: 15px;
            width: 65px;
            height: 65px;
            border: 1px solid @grey5;
            img {
              width: 63px;
            }
          }
          button.closeWidget {
            position: absolute;
            float: right;
            top: 2px;
            right: 2px;
            .gradientOffWhiteToGrey;
            opacity: 0.5;
            i {
              position: relative;
              top: 1px;
              font-size: 16px;
            }
          }
        }
        .widgetInfo {
          float: right;
          margin-right: 10px;
          width: 255px;
          height: 35px;
          border-bottom: 1px solid @grey4;
          .brandInfo {
            width: 120px;
            float: left;
            p.brandSite {
              font-family: @font3;
              margin: 0 !important;
              .fontStyle(darken(@grey5,10%);14px;600) !important;
            }
            span.ratedDate {
              position: relative;
              top: -7px;
              font-size: 12px;
              i {
                position: relative;
                top: -4px;
                left: 2px;
                color: @blueDark;
                font-size: 20px;
              }
            }
          }
          .seal {
            float: right;
            width: 115px;
            left: -10px;
            position: relative;
            top: -8px;
            img {
              width: 115px;
            }
          }
        } 

        ul.keyPoints {
          width: 100%;
          position: relative;
          top: 12px;
          padding: 0 12px;
          li {
            padding: 3px;
            width: 100%;
            float: left;
            position: relative;
            p {
              font-family: @font3;
              color: @bgBlue !important;
              position: relative;
              margin-top: 1px;
              margin-right: 0 !important;
              font-size: 13px !important;
              i.check {
                position: relative;
                top: 1px;
                height: 20px;
              }
            }
          }
        }
        .widgetFooter {
          width: 96%;
          height: 30px;
          position: absolute;
          bottom: 0px;
          margin-left: 2%;
          border-top: 1px solid @grey3;
          a {
            float: left;
            margin-top: 6px;
            .fontStyle(darken(@grey5,10%);10px;300);
          }
          a.learn {
            margin-left: 2px;
          }
          a.verify {
            margin-left: 20px;
            float: left;
          }
          a:hover {
            color: darken(@grey5,10%);
            text-decoration: underline;
          }
          p.powered {
            float: right;
            margin: 0 !important;
            margin-top: 5px !important;
            margin-right: 6px !important;
            .fontStyle(darken(@grey5,10%);10px;300) !important;
            span.sv {
              font-family: @font1;
              .fontStyle(@grey7;12px;700);
              b {
                .fontStyle(@blueGreen;12px;500);
              }
            }
          }
        }
      }
    }
    #smallSeal.seal1{
      height: 400px;
      img {
        margin-left: 45px;
      }
      a.seal1.small {
        position: absolute;
        top: 340px;
        margin-left: 0px;
        width: 130px;
        img {
          width: 130px;
        }
      }
      .widget2.small {
        display: none;
        width: 330px;
        height: 300px;
        .svInfo {
          h3 {
            width: 150px;
            font-size: 14px;
            line-height: 17px;
            margin-top: -3px;
          }
          button {
            right: -75px;
          }
        }
        .brandInfo {
          span.ratedDate {
            right: 4px;
          }
        }
        ul.keyPoints {
          width: 315px;
          display: block;
          top: 34px;
          li {
            p {
              font-size: 12px !important;
              i {
                height: 20px !important;
              }
            }
          }
        }
        div.about {
          display: block;
          p.aboutPrompt {
            margin-top: -1px !important;
            width: 100% !important;
            b {
              display: inline !important;
            }
          }
        }
        div.popUpFooter {
          display: block;
          margin-top: 46px;
          p.powered {
            margin-right: 1px !important;
            margin-top: 1px !important;
            font-size: 9px !important;
            span {
              b {
                font-size: 10px !important;
              }
              font-size: 10px !important;
            }
          }
        }
      }
      .widget2.small.active {
        display: block;
      }
    }
    li.seal2 {
      clear: both;
      height: 70px;
      a.seal2 {
        position: absolute;
        top: 25px;
        margin-left: 110px;
        width: 80px;
        img {
          width: 130px;
        }
      }
    } 
    li.seal3 {
      p.prompt {
        width: 100%;
        margin: 0;
        text-align: center;
      }
      a.seal {
        position: relative;
        top: 165px;
        margin-left: 110px;
        width: 80px;
        img {
          width: 130px;

        }
      }
    }
  }
  div.validationPreview {
    width: 50%;
    float: left;
    #topBar {
      position: relative;
      top: -8px;
      left: -10px;
      border: none;
      background: none;
      .noBoxShadow;
      h2 {
        font-family: @font1;
        color: @grey6;
      }

      .content {
        .boxShadow(1px,1px,1px,@grey3);
        margin: 20px 10px;
        padding: 5px 25px;
        .radius;
        border: 1px solid @grey5;
        height: 720px;
      }
      .section {
        margin-bottom: 30px;
      }
      #msgs {
        ul.msgFreq {
          li {
            p {
              width: 70px;
            }
          }
        }
      }
    } 
  }
}


#unsub.fbForm {
  position: relative;
  top: -2px;
  margin-left: 40px;
  font-family: @font2;
  background: @white;
  border: 1px solid @grey3;
  .boxShadow(0;0;2px;@grey7);
  .heightAndWidth(670px;460px);
  .radius(10px);
  z-index: 4;
  display: block;
  .fbHeader {
    float: left;
    width: 100%;
    height: 60px;
    .topRadius(10px);
    .boxShadow(0;1px;3px;-2px;rgba(0,0,0,0.8));
    background: @grey3;
    border-bottom: 1px solid @grey4;
  }
  .seal {
    width: 174px;
    margin-top: 30px;
    margin-right: 7px;
    float: right;
    img {
      height: 30px;
    }
  }
  
  form {
    margin-top: 30px !important;
    padding: 23px;
    float: left;
    margin-bottom: 0px;
    position: relative;

    h4.question {
      margin-top: 7px;
      margin-left: 10px;
      line-height: 24px;
      .fontStyle(@grey7;14px;500);
    }

    ul.reasons {
      height: 300px;
      border-top: 1px solid @grey4;
      padding: 10px;
      li.ui-state-default {
        width: 392px;
        height: 40px !important;
        margin: 15px 0;
        padding: 9px 14px;
        background: @bgBlue;
        .boxShadow(1px;1px;1px;rgba(0,0,0,0.4));
        input {
          margin-right: 5px;
          float: left;
          .heightAndWidth(20px;20px);
        }
        p {
          margin-top: 0;
          font-size: 18px;
          span {
            color: rgba(255,255,255,0.85);
            font-weight: 400;
            font-family: @font1;
            padding-bottom: 4px;
          }
        }
        p.prompt.small {
          margin-top: 2px;
          font-size: 18px;
        }
        div.horizontalDiv {
          display: none;
          width: 42%;
          height: 0;
          margin: 0 19%;
          border-top: 3px solid rgba(255,255,255,0.25);
        }
      }
    }

    .other {
      width: 392px !important;
      height: 150px !important;
      margin: 21px 10px;
      padding: 9px 14px;
      background: @bgBlue;
      .boxShadow(1px;1px;1px;rgba(0,0,0,0.4));
      input {
        margin-right: 5px;
        float: left;
        .heightAndWidth(20px;20px);
      }
      p {
        margin-top: 1px;
        float: left;
        .fontStyle(@white;14px;600) !important;
        .textShadow(1px;1px;1px;rgba(0,0,0,0.2));
        
      }
      p {
        position: relative;
        top: -23px;
        left: 25px;
        width: 310px;
        margin-right: 0px;
        textarea {
          margin-top: 15px;
          display: block;
          padding-left: 5px;
          .radius;
          border: 1px solid @grey5;
          height: 80px;
          width: 302px;
          color: @grey7;
        }
      }
    }
    
    .btn.important {
      float: right;
      position: absolute;
      bottom: 66px;
      right: 16px;
      margin-right: 88px;
      height: 35px;
      padding-top: 5px;
    }
    
  }
  a.close {
    opacity: 0.5;
    position: absolute;
    left: 432px;
    top: 5px;
  }

  a.close:hover {
    opacity: 0.7;
  }
}

/*Not Used Anymore */
#addPrivacyLink.addForm {
  height: 40px;
  width: 100%;
  background: none;
  .noBoxShadow;
  border: none;
  position: relative;
  left: -135px;
  top: 0px;
  button {
    background: @blueGrey4;
    border: none;
    .noTextShadow;
    .boxShadow(1px;0;1px;@grey3);
    .fontStyle(@white;14px;400);
    i {
      postion: relative;
      top: -1px;
    }
  }
  input {
    height: 32px;
    .radius;
    border: 1px solid @grey5;
    .insetDrop(0;1px;1px;1px;rgba(0,0,0,0.05);0;1px;1px;0;rgba(0,0,0,0.05));
    padding: 6px 8px;
    font-size: 12px;
    position: relative;
    top: -1px;
  }
  input:focus {
    outline: none;
    border: 1px solid @blueDark;
    .insetDrop(0;0;2px;0;lighten(@blueLight,10%);0;0;2px;0;lighten(@blueLight,5%));
  }
}
div.success {
  margin: 15px 0;
  width: 100%;
  padding: 10px;
  .radius;
  background: @buttonGreen;

  p {
    color: @white !important;
    margin-bottom: 0;
    font-family: @font5;
  }
}
div.error {
  margin: 15px 0;
  width: 100%;
  padding: 10px;
  .radius;
  background: @red1;
  p {
    color: @white !important;
    margin-bottom: 0;
    font-family: @font5;
  }
}
#addFilterWrapper {
  display: none;
    width: 100%;
    z-index: -1;
    position: absolute;
    z-index: 1001;
    height: auto;
    &.active {
      display: block;
    }
}

#addTeamWrapper {
  display: none;
  width: 100%;
  z-index: -1;
  position: absolute;
  z-index: 1001;
  .alert-modal {
    z-index: 1001;
    width: 500px;
    font-family: @font2;
    height: auto;
    /*
    a.closeForm {
      float: right;
      position: absolute;
      top: -15px;
      right: -15px;
      border: 2px solid @blueGreen;
      .radius(50px);
      background: @white;
      opacity: 1;
      color: @grey5;
      display: block;
      height: 34px;
      width: 34px;
      text-align: center;
      padding-top: 4px;
    }*/
    form {
      padding: 20px;
      width: 500px;
      margin-bottom: 0px;
      position: relative;
      top: 25px;

      div.success, div.error {
        height: 40px;
        position: relative;
        p {
          display: inline;
          position: absolute;
          left: 8px;
          margin-left: 0;
          color: @white;
        }
      }
      label {
        width: 100%;
        position: relative;
        top: 0;
        left: 0;
        .fontStyle(@grey6;14px;700);
        line-height: 10px;
        margin-bottom: 8px;
      }
      input[type="email"] {
        position: relative;
        margin-bottom: 10px;
        height: 35px;
        width: 100%;
        font-size: 14px;
        .insetShadow(0;0;3px;rgba(0,0,0,0.3));
        .fontStyle(@grey6;12px;400);
      }
      .buttons {
        top: -4px;
        right: 0;
        position: relative;
        .btn {
          float: right;
          padding-top: 10px;
          width: 70px;
          font-family: @font5;
          width: 80px;
          margin-bottom: 0;
        }
      }
      ul.team {
        font-family: @font5;
        width: 100%;
        margin-bottom: 30px;
        label {
          left: 0;
          width: 100%;
          .fontStyle(@blueGrey5;18px;600);
          padding-bottom: 7px;
          border-bottom: 1px solid @grey4;
        }
        li {
          .fontStyle(@grey6;16px;600);
        }
      }
    } 
  }
}
#addTeamWrapper.active {
  display: block;
}
/*Monitoring Messages Page*/
#monitoring {
  background: @white;
  padding: 0 15px;
  .section {
    h3 {
      margin-bottom: 30px;
      height:25px;
      select {
        display: inline;
        position: relative;
        top: -1px;
        margin-left: 10px;
        width: 200px;
      }
      span {
        left: 207px !important;
      }
    }
  }
  #sealMonitoring {
    min-height: 600px;
  }
  ul.stats{
    margin: 0px !important;
    float: left;
    clear: both;
    padding: 0 20px !important;
    width: 100%;
    h4 {
      .fontStyle(@blueGrey5;18px;500);
    }
    .sealStatus {
      float: left;
      img {
      }
      p {
        .fontStyle(@grey7;14px;700) !important;
        span {
          .fontStyle(@grey6;12px;500);
        }
      }
    }
    
    li {
      padding-top: 20px;
      margin: 0 25px;
      float: left;
      .fontStyle (@grey7;28px;600);
      span {
        display: block;
        .fontStyle(@grey6;14px;500);
      }
    }
    li.visits {
      margin-top: -40px;
      margin-left: 100px;
      padding: 60px 30px;
      border-right: 1px solid @grey3
    }
  }
}

/*Dashboard Page. Lengthy. Needs Organizing*/
#dashboard {
  min-height: 630px;
  padding-top: 15px;
  .bottomRightRadius(3px);
  position: relative;
  font-family: @font5;
  #noDataAlpha {
    border: none;
    top: 233px;
    width: 820px;
    height: 330px;
    margin-left: 71px;
    background: rgba(0,0,0,0.5);
    .radius(5px);
    h4 {
      margin-top: 55px;
      width: 68%;
      margin-left: 16%;
      text-align: center;
      color: @grey1;
      line-height: 30px;
    }
    a.btn.important {
      width: 20%;
      margin: 15px 40%;
      height: 45px;
      padding-top: 8px;
      font-size: 18px;
    }
  }
  .dash {
    display: none;
    width: 100%;
    .graphWrapper {
      margin-top: 5px;
      border-top: 1px solid @grey3;
      .boxShadow(0;3px;2px;-2px;@grey4);
      background: @greenGrey1;
      width: 100%;
      padding-bottom: 11px;
      h3 {
        float: left;
        width: 66%;
        margin-left: 58px;
        margin-bottom: 25px;
        .fontStyle(@grey7;34px;300);
      }
      .btn-group {
        float: right;
        margin-right: 35px;
        margin-top: 25px;
        z-index: 980;
        .btn {
          background: @grey4;
          font-weight: 700;
          border-left: 1px solid @grey5;
        }
        .btn:first-child {
          border: none;
        }
        .btn:hover {
          background: lighten(@grey4,5%);
        }
        .btn.active {
          background: @bgBlue;
          color: @white;
          .noTextShadow;
          cursor: default;
        }
        .btn.active:hover {
          opacity: 1;
        }
      }

  .graphHolder {
        position: relative;
        margin-top: 25px;
        margin-left: 10px;
        width: 920px;
        svg {
        }
        .toolTip {
          position:absolute;
          height: 160px;
          width: 200px;
          z-index: 1000;
          .tip {
            z-index: 950;
            height: 100%;
            width: 100%;  
            background: #fff;
            .radius;
            border: 1px solid darken(@grey4,10%);
            .boxShadow(0,1px,1px,1px,rgba(0,0,0,0.1));
            .dataValue {
              padding: 10px 5px;
              p {
                text-align: center;
                margin: 0;
                span {
                  display: block;
                  line-height: 16px;
                  .fontStyle(@grey7;12px;400) !important;
                }
                span.value {
                  line-height: 24px;
                  margin-top: 5px;
                  margin-bottom: 10px;
                  .fontStyle(@grey7;24px;400) !important;
                }
              }
              span.date {
                text-align: left;
              }
            }
          }
        }
        .toolTip.satisfaction {
          height: 130px;
        }
        .toolTip.satisfaction.down {
          .tip:before {
            top: 129px;
          }
          .tip:after {
            top: 129px;
          }
        }
        .toolTip.unsub {
          height: 160px;
          width: 180px;
          .tip {
            .dataValue {
              padding: 15px;
            }
          }
        }
        .toolTip.sxi {
            height: 175px;
        }
        .toolTip.unsub {
          height: 125px;
          width: 180px;
          .tip {
            .dataValue {
              padding: 15px;
            }
          }
        }
        .toolTip.down {
          .tip:before {
            z-index: 951;
            border-left: 10px solid transparent;
            border-top: 10px solid darken(@grey4,10%);
            border-right: 10px solid transparent;
            content: '';
            display: block;
            position: absolute;
            top: 159px;
            left: 17px;
          }
          .tip.sxi:before {
              top: 200px;
          }
          .tip.sxi table {
              margin: 0 auto;
              td:first-child {
            text-align: right;
              }
              td:last-child {
            text-align: left;
              }
          }
          .tip:after {
            z-index: 952;
            border-left: 9px solid transparent;
            border-top: 9px solid @white;
            border-right: 9px solid transparent;
            content: '';
            display: block;
            position: absolute;
            top: 159px;
            left: 18px;
          }
          .tip.sxi:after {
              top: 199px;
          }
        }
        .toolTip.unsub.down {
          .tip:before {
            top: 124px;
          }
          .tip:after {
            top: 124px;
          }
        }
        .toolTip.up {
          .tip:before {
            z-index: 951;
            border-left: 10px solid transparent;
            border-bottom: 10px solid darken(@grey4,10%);
            border-right: 10px solid transparent;
            content: '';
            display: block;
            position: absolute;
            top: -9px;
            left: 17px;
          }
          .tip:after {
            z-index: 952;
            border-left: 9px solid transparent;
            border-bottom: 9px solid @white;
            border-right: 9px solid transparent;
            content: '';
            display: block;
            position: absolute;
            top: -8px;
            left: 18px;
          }
        }
        .toolTip.visible {
          visibility: visible;
          opacity: 1;
          transition: opacity 0.5s linear;
        }
        .toolTip.fade {
          visibility: hidden;
          opacity: 0;
          transition: visibility 0s 0.5s, opacity 0.5s linear;
          .tip {
            margin-top: -10000px;
              transition: margin-top 0s 0.5s;
          }
        }
        .toolTip.show {
          visibility: visible;
          opacity: 1;
          .tip {
            margin-top: 0;
              transition: margin-top 0s 0.5s;
          }
        }
        .toolTip.sxi.down {
          .tip:before {
            top: 174px;
          }
          .tip:after {
            top: 174px;
          }
        }
      }
    }
    .chart {
      img {
        margin-left: 45px;
        margin-bottom: 40px;
      }
    }
    .subCategories {
      width: 100%;
      ul.subs {
        padding: 10px 0;
        margin-bottom: 25px;
        width: 100%;
        li.sub {
          position: static !important;
          float: left;
          width: 278px;
          margin-left: 22px;
          margin-top: 5px;
          margin-bottom: 15px;
          margin-right: 9px;
          button {
            width: 100%;
            border: none;
            background: @greenGrey1;
            .boxShadow(0;1px;1px;1px;lighten(@bgBlue,35%));
            border-top: 2px solid lighten(@greenGrey1,20%);
            p {
              margin: 0 !important;
              float: left;
              display: inline;
              .fontStyle(@bgBlue;16px;400) !important;
            }
            span.weeklyTrend {
              position: relative;
              top: 2px;
              float: right;
              color: @green4; 
            }
            i {
              color: @bgBlue;
              position: relative;
              top: 6px;
              float: right;
              font-size: 14px;
            }
          }
          button.subSelector {
            padding: 10px 6px;
          }
          button:focus {
            outline: none;
          }
          ul.subBreakdown {
            display: none;
            margin: 6px 0;
            li {
              margin: 12px 5%;
              width: 90%;
              button.breakdownSelector {
                padding: 6px 5px;
                p {
                  font-size: 12px !important;
                }
                span {
                  top: 2px;
                  font-size: 10px;
                }
              }
            }
            li.active {
              button.breakdownSelector {
                background: @bgBlue;
                border-top: 2px solid lighten(@bgBlue,20%);
                .noBoxShadow;
                p {
                  color: @white !important;
                }
              }
            }
          }
          ul.subBreakdown.active {
            display: block;
          }
          ul.sxiBreakdown {
            display:none;
            height: 144px;
            li {
              height: 30px;
              border-bottom: 1px solid @grey3;
              span {
                color: #586874;
                position: relative;
                top: 4px;
                float: right;
                font-size: 20px;
              }
              img {
                float: left;
                width: 130px;
              }
              img.review {
                float: left;
                width: 25px;
                margin-right: 10px;
              }
              p {
                position: relative;
                top: 3px;
                float: left;
                width: 130px;
                font-size: 18px;
                margin: 0;
              }
              p.review {
                width: 160px;
              }
              p.promoters {
                color: @green4;
              }
              p.passives {
                color: darken(@grey4,10%);
              }
              p.detractors {
                color: @red1;
              }
            }
          }
        }
      }
      div.socialStatic {
        display: none;
        position: relative;
        max-width: 700px;
        div.socialIcons {
          width: 100%;
          margin-top: 5px;
          padding-top: 20px;
          a, div.wrapper {
            float: left;
            display: block;
            width: 50px;
            height: 50px;
            .radius(64px);
            background: rgba(255,255,255,0.25);
          }
          a:first-child {
            margin-left: 275px;
            margin-right: 10px;
          }
          a:last-child {
            margin-left: 10px;
          }
          i {
            width: 100%;
            text-align: center;
            font-size: 24px;
            padding: 14px 0;
            color: @blueGrey1;
          }
          ul.sxiBreakdown {
            display: block;
          }
        }
      }
    }
  }
  #message.dash {
    display: block;
    div.subCategories {
      min-height: 140px;
    }
    .graphWrapper {
      .bottomRightRadius(4px);
    }
  }
  #VOS.dash {
    div.subCategories {
      min-height: 120px;
      li.sub {
        ul.sxiBreakdown {
          padding: 15px 0;
        }
      }

    }
  }
  h2 {
    height: 45px;
    margin: 0 10px;
    border-bottom: 1px solid @grey4;
    label {
      padding-top: 2px;
      margin-bottom: 0px;
      float: left;
      .fontStyle(@blueGrey5;16px;500) !important;
    }
    .dropdown {
      margin-top: 1px;
      margin-left: 20px;
      .floatLeftRelative;
      top: -1px;
      button {
        text-align: left;
        height: 30px;
        width: 115px;
        i {
          position: absolute;
          top: 14px;
          right: 8px;
        }
      }
      .dropdown-menu {
        margin-top: -3px !important;
      }
    }
  }
  .row {
    padding: 0 20px;
  }
  .dbWrapper {
    margin: 25px 0;
    padding: 0 7px;
    h3 {
      .fontStyle(@blueGrey5;14px;500);
      margin-top: 4px;
      margin-bottom: 3px;
      padding-left: 3px;
    }
  }
  .dbBox {
    height: 150px;
    border: 1px solid @grey4;
    .boxShadow(0;1px;1px;@grey3);
    ul.values:first-child {
      border-bottom: 2px solid @grey4;
    }
    ul.values {
      height: 50%;
      padding: 10px 10px;
      p {
        .fontStyle(@blueGrey4;12px;500) !important;
        margin: 0 3px;
      }
      li {
        float: left;
        display: block;
        width: 212px;
        meter {
          width: 93%;
        }
      }
      li.Approved {
        width: 35px;
        opacity: 0.25;
        img {
          position: relative;
          top: -1px;
          left: 6px;
          height: 35px;
          width: 100%;
        }
      }
      li.Approved.a {
        opacity: 1;
      }
      li.Approved.b {
        opacity: 0.75;
      }
      li.Approved.c {
        opacity: 0.5;
      }
    }
    
  }

  .rating {
    height: 55%;
    margin: 0 3px;
    p.score {
      width: 100%;
      text-align: center !important;
      .fontStyle(@grey7;60px;600) !important;
      margin-bottom: 0px;
    }
    span {
      position: relative;
      top: -20px;
      width: 100%;
      text-align: center;
      .fontStyle(@grey7;12px;500);
    }
    border-bottom: 2px solid @grey7;

  }

  .list {
    padding: 3px 15px;
    li {
      .fontStyle(@blueGrey5;12px;500);
      border-bottom: 1px dotted @blueGrey5;
      margin-top: 7px;
      i {
        .fontStyle(@grey6;12px;500);
        display: inline-block;
        width: 17px;
        text-align: center;
      }
      span {
        float: right;
        margin-right: 5px;
        .fontStyle(@grey6;12px;500);
      }
    }
  }

  #status {
    img {
      height: 165px;
      margin-top: 7px;
      margin-left: 7px;
    }
  }

  #sealStatus {
    ul.status {
      margin: 15px;
      li {
        margin: 20px 0;
        .fontStyle(@blueGrey5;14px;500);
        span {
          .fontStyle(@grey6;12px;500);
        }
      }
    }
  }

  #timeline {
    h3 {
      height: 18px;
      margin-top: 18px;
      margin-bottom: 0px;
      .dropdown {
        position: relative;
        top: -21px;
        left: 100px;
        button {
          text-align: left;
          padding-top: 2px;
          width: 100px;
          height: 22px;
          i {
            position: relative;
            top: 1px;
            float: right;
          }
        }
      }
    }
    .dbBox {
      img {
        padding: 5px 10px;
      }
    }
  }

  #satisfaction {
    .npsScore {
      height: 77%;
      padding: 15px 0;
      border-bottom: none;
    }
    .ratingDetails {
      margin-top: -14px;
    }
  }

  #reviews {
    .rating {
      height: 143px !important;
    }
    ul.reviews {
      .average {
        width: 100%;
        img {
          margin-top: 16px;
          margin-left: 94px;
          width: 100px;
        }
        p {
          width: 100%;
          text-align: center;
          .fontStyle(@grey7;12px;500);
          span {
            top: 0px;
            display: inline;
            .fontStyle(@blueLight;12px;600);
          }
        }
      }
    }

    .second {
      display: block;
      height: 90px;
      li {
        position: relative;
        top: 34px;
        float: left;
        margin: 0px 15px;
        padding-top: 10px;
        height: 100px;
        width: 36px;
        span {
          postion: relative;
          top: 2px;
          left: 5px;
          width: width: ;
          height: 10px;
          text-align: center;
          .fontStyle(@grey7;16px;600);
        }
        .progress {
          margin-left: 9px;
          position: relative;
          display: block;
          height: 80%;
          width: 20px;
          border: 1px solid rgba(0,0,0,0.4);
          .bar {
            width: 20px;
            .gradientGreenButton;
            position: absolute;
            bottom: 0px;
            .bottomRadius(3px);
          }
        }
        img {
          position: relative;
          top: 3px;
          left: 3px;
          width: 34px;
        }
      }
    }
    .first {
      display: none;
    }
    #sentiment.messageToggle {
      padding-top: 0px;
      position: relative;
      top: -4px;
    }
  }

  #ratings {
    position: relative;
    .fbBreakdown {
      height: 77%;
      float: left;
      padding: 7px 0;
      margin: 15px 3px;
      li {
        position: relative;
        float: left;
        height: 55px;
        width: 135px;
        margin-bottom: 3px;
        label {
          margin-bottom: 3px;
          margin-left: 10px;
          width: 100%;
          .fontStyle(@blueGrey5;12px;500);
          
        }
        .score {
          margin-left: 7px;
          .rateit {
            float: left;
            .rateit-range {
              background: url("@{base}images/stars.png");
            }

            .rateit-range{
              background: url('@{base}images/stars.png');

            }
            .rateit-preset{
              background: url('@{base}images/stars.png') left -22px;
            }
          }
          
          span {
            position: absolute;
            top: 25px;
            right: -4px;
            margin-left: 2px;
            width: 20px;
            .fontStyle(@grey6;12px;500);
          }
        }
      }
    }
  }

  #feedback {
    .rating {
      height: 77%;
      padding: 15px 0;
    }
    .average {
      padding: 12px 12px;
      p {
        float: left;
        .fontStyle(@blueGrey5;11px;500);
        margin-right: 0px;
      }
      p:first-child {
        margin-right: 30px;
      }
    }
  }

  #messages {
    .rating {
      height: 77%;
      padding: 7px 0;
    }

    .msgBreakdown {
      margin-left: 46px;
      display: none;
      li {
        height: 50px;
        width: 100%;
        label {
          color: @blueGrey4;
        }
        meter {
          height: 12px;
          width: 78%;
        }
      }
    }
    

    .msgFreq{
      display: none;
      float: left;
      margin-top: 45px;
      margin-left: 80px;
      width: 120px;
      li {
        .floatLeftRelative;
        top: -15px;
        width: 60px;
        padding-top: 3px;
        height: 30px;
        p {
          cursor: pointer;
          text-align: center;
          .fontStyle(@grey6;14px;500);
          margin-right: 0px;
        }
        p.selected {
          cursor: default;
          text-decoration: underline;
        }
        p:hover {
          text-decoration: underline;
        }
      }
      li.week{
        p {
          border-right: 1px solid @grey3;
        }
      }
      span.freq {
        position: relative;
        top: -12px;
        line-height: 35px;
        .fontStyle(@grey7;60px;700);
        width: 100%;
        text-align: center;
      }
    }

    ul.first {
      display: block;
    }
  }

  #seals {
    .list {
      li {
        margin-top: 23px;
      }
    }
  }
  .messageToggle {
    height: 40px;
    padding: 0 100px;
    a {
      margin-top: 2px;
      color: @blueLight;
      float: left;
      font-size: 20px;

    }
    a:hover {
      color: @lightBg1;
      text-decoration: none;
    }
    .tabPosition {
      float :left;
      li {
        margin: 11px 5px;
        float: left;
        i {
          margin-top: 2px;
          display: block;
          font-size: 8px;
          color: @grey4;
        }
        i.active {
          color: @buttonBlue;
        }
      }
    }
  }
}

/*tracker dashboard*/
#dashboard.tracker {
  min-height: 900px;
  div.companyOptions {
    margin-left: 60px;
    margin-bottom: 8px;
    height: 40px;
    p.companySelect {
      margin-top: 6px;
      float: left;
      font-size: 16px;
      select#selectCompany {
        margin-left: 20px;
      }
    }
    a#addCompany {
      margin-right: 35px;
      float: right;
    }
  }
  div.companyOptions.companyFeed {
    border-bottom: 1px solid @grey4;
    margin: 0;
    padding-left: 60px;
    height: 50px;
    padding-bottom: 20px;
  }
  #message.dash {
    display: block;
  }
  a.showHide {
    float: right;
    position: relative;
    width: 71px;
    top: 5px;
    .fontStyle(@white;14px;400);
    padding: 3px 8px;
    .radius;
    border: none;
    background: lighten(@blueGreen,7%);
    .textShadow(0;1px;0;rgba(0,0,0,0.2));
    margin-right: 35px;
    span.showBtn {
      display: none;
    }
    span.hideBtn {
      display: inline;
    }
    i {
      margin-left: 5px;
    }
  }
  a.showHide.active {
    span.showBtn {
      display: inline;
    }
    span.hideBtn {
      display: none;
    }
  }
  div.trackerFeed {
    width: 76%;
    margin: 10px 12%;
    padding-bottom: 30px;
    ul.feedItems {
      li {
        div.itemHeader {
          height: 80px;
          margin-bottom: 8px;
          width: 100%;
          div.brandLogo {
            width: 100px;
            float: left;
            margin-left: -5px;
            img {
              width: 100%;
            }
          }
          p.subject {
            float: left;
            width: 500px;
            font-size: 16px;
            margin-top: 35px;
            margin-left: 50px;
          }
        }
        div.messageBody:before {
          content: '';
          display: block;
          position: absolute;
          top: -14px;
          left: 25px;
          width: 0;
          height: 0;
          border-style: solid;
          border-width: 0 14px 14px 14px;
          border-color: transparent transparent lighten(@blueGreen, 7%) transparent;
        }
        div.messageBody:after {
          content: '';
          display: block;
          position: absolute;
          top: -11px;
          left: 27px;
          width: 0;
          height: 0;
          border-style: solid;
          border-width: 0 12px 12px 12px;
          border-color: transparent transparent @greenGrey1 transparent;
        }
        div.messageBody {
          position: relative;
          width: 100%;
          top: 25px;
          border: 2px solid lighten(@blueGreen, 7%);
          .radius;
          background: @greenGrey1;
          div.message {
            background: @white;
            width: 80%;
            margin: 10px 10%;
            img {
              width: 100%;
            }
          }
          div.dateWrapper {
            width: 100%;
            height: 34px;
            padding: 6px 8px;
            background: @greenGrey5;
            border-top: 1px solid @grey4;
            .bottomRadius(6px);
            p {
              float: right;
              margin: 0;
            }
          }
        }
      }
    }
  }
  div.snapshots {
    margin-top: 30px;
    h3 {
      margin-left: 25px;
    }
    ul.snapshotList {
      height: 300px;
      width: 96%;
      margin: 0 2%;
      margin-top: 25px;
      li {
        float: left;
        width: 50%;
        div.brandLogo {
          width: 60px;
          float: left;
          margin-left: 5px;
          img {
            width: 100%;
          }
        }
        p {
          font-size: 16px;
        }
        p.subject {
          float: left;
          margin-top: 20px;
          margin-left: 8px;
        }
        div.snapshotGraph {
          float: right;
          width: 350px;
          margin-right: 25px;
          img {
            width: 100%;
          }
        }
        p.caption {
          float: left;
          clear: left;
          margin-top: 4px;
          margin-left: 78px;
        }
      }
    }
  }
}

/*Dashboard/Report Columns*/
div.columns{
  height: 120px;
  .col {
    height: 100% !important;
    width: 278px;
    float: left;
    margin-left: 22px;
    margin-right: 9px;
    h2 {
      cursor: pointer;
      padding: 18px 10px;
      margin: 0;
      margin-top: 10px !important;
      margin-bottom: 15px !important;
      font-size: 20px !important;
      border: 1px solid @grey5 !important;
      height: 95px !important;
      background: @greenGrey1;
      position: relative;
      .radius(2px);
      i {
        font-size: 62px;
        color: @bgBlue;
        position: relative;
        top: -3px;
        left: 10px;
      }
      i.fa-edit {
        top: 1px;
      }
      span {
        height: 45px;
        font-family: @font5;
        float: right;
        .fontStyle(@bgBlue;50px;300);
        i {
          font-size: 35px;
          margin-right: 8px;
        }
      }
      p {
        position: absolute;
        right: 12px;
        top: 62px;
        font-family: @font5;
        .fontStyle(@bgBlue;12px;400) !important;
        margin: 6px 0 !important;
        line-height: 20px;
        height: 20px;
        float: right;
        clear: right;
      }
    }
    h2:hover, h2.active {
      border: 1px solid @grey1 !important;
      background: @bgBlue;
      i {
        color: @white;
      }
      span {
        .fontStyle(@white;50px;300) !important;
      }
      p {
        .fontStyle(@white;12px;400) !important;
      }
    }
    h2.active {
      .insetDrop(0;1px;0;1px;rgba(255,255,255,0.3);0;0;1px;1px;rgba(0,0,0,0.23));
    }
    ul.stats {
      margin: 6px 0;
      padding: 5px;
      h3 {
        margin-top: 1px;
        .fontStyle(@blueGrey5;16px;600);
        padding-bottom: 3px;
        border-bottom: 1px solid @grey4;
        nav {
          float: right;
          a {
            .fontStyle(@green;16px;400);
            margin: 0 5px;
          }

        }
      }
      li {
        label {
          margin-left: 3px;
          .fontStyle(lighten(@grey6,5%);14px;500);
          margin-bottom: 0px;
        }
      }
    }
    ul.stats:hover {
      padding: 4px;
      background: lighten(@greenGrey1,5%);
      border: 1px solid rgba(0,0,0,0.18);
    }
    ul.stats.active {
      padding: 4px;
      background: @greenGrey1;
      border: 1px solid @white;
      .boxShadow(0;0;0;1px;rgba(0,0,0,0.3));
    }
    ul#ratings {
      .page {
        display: none;
      }
      .page.active {
        display: block;
      }
    }
    ul.unsub {
      position: relative;
      top: -20px;
      padding: 0 5px !important;
      background: none !important;
      border: none !important;
      margin: 0;
      li {
        height: 60px;
        width: 105%;
        margin: 6px 0;
        padding: 3px 1px;
        label {
          font-size: 12px;
        }
        .meter {
          position: relative;
          top: -11px;
          height: 30px;
          span {
            font-size: 8px;
            top: 13px !important;
          }
        }
      }
      li:last-child {
        margin-bottom: 0;
      }
      li:hover {
        padding: 2px 0;
        background: lighten(@greenGrey1,5%);
        border: 1px solid rgba(0,0,0,0.18);
      }
      li.active {
        padding: 2px 0;
        background: @greenGrey1;
        border: 1px solid @white;
        .boxShadow(0;0;0;1px;rgba(0,0,0,0.3));
      }
    }
  }
}

/*Message Tag Bars*/
ul.msgBreakdown {
  float: left;
  margin-left: 35px;
  width: 230px;
  li {
    height: 30px;
    float: left;
    padding-bottom: 2px;
    margin-bottom: 5px;
    label {
      float: left;
      margin-left: 2px;
      margin-bottom: 0px;
      .fontStyle(@blueGrey5;12px;500);
      b {
        .fontStyle(@grey6;12px;500);
      }
    }
    .progress {
      float: left;
      clear: left;
      margin-top: 2px;
      margin-bottom: 0px;
      margin-right: 2px;
      .heightAndWidth(13px;190px);
      .radius(2px);
      background: @grey4;
      
      .bar {
        height: 100%;
        .gradientGreenButton;
      }
      
    }
    span {
      margin-top: 6px;
      margin-left: 93px;
      float: left;
      .fontStyle(@blueGrey5;12px;500);
      b {
      }
    }
  }
  li:last-child {
    border-bottom: none;
  }
}

/*Lengthy Engagement Section. Needs Cleaning up */
#engagement.feedHolder {
  font-family: @font5;
  min-height: 820px;
  position: relative;
  div#feedEmpty {
    display: none;
  }
  div#feedEmpty.active {
    display: block;
    height: 50px;
    position: absolute;
    top: 70px;
    width: 720px;
    left: 20px;
    background: lighten(@red1,10%);
    p {
      color: @white;
      height: 40px;
      a {
        color: @white;
        font-weight: 600;
      }
    }
  }
  div.alpha {
    display: none;
    a.closeForm {
      float: right;
      position: absolute;
      top: -15px;
      right: -15px;
      border: 2px solid @blueGreen;
      .radius(50px);
      background: @white;
      opacity: 1;
      color: @grey5;
      display: block;
      height: 34px;
      width: 34px;
      text-align: center;
      padding-top: 4px;
    }
    a.closeForm:hover {
      color: @grey6;
    }
  }
  div.alpha.active {
    display: block;
  }
  div#replyToAlpha.alpha {
    width: 40%;
    z-index: 1000;
    position: absolute;
    margin: 0 30%;
    top: 25px;
    background: @white;
    padding: 30px 25px;
    border: 8px solid @blueGreen;
    div.alphaWrapper {
      padding: 5px;
      h4 {
        margin-top: 0;
        font-family: @font5;
        font-size: 20px;
      }
      form {
        margin-top: 15px;
        padding-bottom: 42px;
        position: relative;
        margin-bottom: 30px;
        .control-label {
          text-align: left;
        }
        label {
          clear: left;
          font-family: @font5;
          color: @grey6;
          margin-top: 16px;
          margin-right: 5px;
        }
        input{
          height: 40px;
          width: 100%;
          font-size: 14px;
          .insetShadow(0;0;3px;rgba(0,0,0,0.3));
          font-weight: 400;
        }
        button {
          position: relative;
          float: right;
          right: 5px;
          top: 5px;
          padding: 15px 27px;
          font-size: 16px;
          margin-top: 15px;
        }
      }
    }
  }
  div#cannedAlpha.alpha {
    width: 80%;
    z-index: 1000;
    position: absolute;
    margin: auto;
    top: 25px;
    background: @white;
    padding: 30px 25px;
    border: 8px solid @blueGreen;   
    div.alphaWrapper {
      padding: 5px;
      div.cannedResponses {
        width: 100%;
        border: 1px solid @grey4;
        background: @greenGrey1;
        padding: 10px 20px;
        font-family: @font5;
        h4 {
          font-family: @font5;
          float: left;
        }
        select {
          margin-left: 15px;
          height: 40px;
          font-size: 14px;
          .insetShadow(0;0;3px;rgba(0,0,0,0.3));
          font-weight: 400;
          width: 300px;
        }
        button {
          float:right;
          position: relative;
          right: 3px;
          top: 2px;
        }
      }
      form {
        margin-top: 15px;
        padding-bottom: 42px;
        position: relative;
        margin-bottom: 30px;
      }
      form#replyForm {
        .control-label {
          text-align: left;
        }
        label {
          clear: left;
          font-family: @font5;
          color: @grey6;
          margin-top: 14px;
          margin-right: 5px;
          margin-bottom: 14px;
          float: left;
        }
        label.body {
          float: none;
          margin-bottom: 5px;
        }
        input[type="text"], textarea{
          height: 40px;
          font-size: 14px;
          .insetShadow(0;0;3px;rgba(0,0,0,0.3));
          font-weight: 400;
        }
        input.disabled {
          background: @grey2;
          border: 1px solid @grey5;
        }
        input.left {
          float: right;
          margin: 4px 0;
          position: relative;
          right: -1px;
          width: 614px;
        }
        textarea {
          height: 200px;
          width: 100%;
          resize: vertical;
        }
        span.save {
          float: left;
          position: relative;
          top: 4px;
          input {
            position: relative;
            top: -2px;
          }
        }
        button {
          position: absolute;
          right: 5px;
          padding: 15px 27px;
          font-size: 16px;
          margin-top: 15px;
        }
        p.recipients {
          position: relative;
          top: 60px;
          left: 370px;
        }
      }
      form#editForm {
        background: @greenGrey1;
        border: 1px solid @grey4;
        position: relative;
        height: 320px;
        a.closeEdit {
          position: absolute;
          top: 2px;
          right: 6px;
          font-size: 20px;
          color: darken(@grey4,5%);
        }
        a.closeEdit:hover {
          color: @grey5;
        }
        button.submit {
          float: right;
          position: relative;
          right: 90px;
          margin-bottom: 25px;
        }
        ul.editResponseList {
          width: 60%;
          margin: 20px 20%;
          li {
            width: 100%;
            height: 30px;
            margin: 8px 0;
            border-bottom: 1px solid darken(@grey4,5%);
            p {
              float: left;
              width: 70%;
              font-size: 18px;
              color: @blueGreen;
              margin: 0;
            }
            div.cbWrapper{
              position: relative;
              top: 4px;
              float: right;
              width: 20px;
              height: 20px;
              button {
                top: 3px;
                left: 3px;
                width: 14px;
                height: 14px;
                i {
                  font-size: 14px;
                  color: @red1;
                }
              }
              button:hover {
                i {
                  display:block;
                }
              }
              button.active {
                background: @lightGreen2;
                i {
                  display:block;
                }
              }
            }
          }
        }
      }
    }
  }
  div#saveAlpha.alpha, div#exportAlpha.alpha {
    width: 40%;
    z-index: 1000;
    position: absolute;
    margin: 0 30%;
    top: 25px;
    background: @white;
    padding: 30px 25px;
    border: 8px solid @blueGreen;
    div.alphaWrapper {
      padding: 5px;
      h4 {
        margin-top: 0;
        font-family: @font5;
        font-size: 16px;
      }
      form#responseName {
        display: none;
        margin-top: 15px;
        padding-bottom: 42px;
        position: relative;
        margin-bottom: 30px;
        .control-label {
          text-align: left;
        }
        label {
          clear: left;
          font-family: @font5;
          color: @grey6;
          margin-top: 14px;
          margin-right: 5px;
        }
        input{
          height: 40px;
          width: 100%;
          font-size: 14px;
          .insetShadow(0;0;3px;rgba(0,0,0,0.3));
          font-weight: 400;
        }
        input.active {
          border-color: @red1;
        }
        button {
          position: relative;
          float: right;
          right: 5px;
          top: 5px;
          padding: 15px 27px;
          font-size: 16px;
          margin-top: 15px;
        }
        p {
          display: none;
          width: 50%;
          position: absolute;
          top: 102px;
          font-size: 11px;
          color: @red1;
        }
        p.active {
          display: block;
        }
      }
      form#responseName.active{
        display:block;
      }
    }
  }
  div#exportAlpha.alpha {
  	top: 80px;
  }
  div#duplicateAlpha.alpha {
    width: 40%;
    z-index: 1000;
    position: absolute;
    margin: 0 30%;
    top: 25px;
    background: @white;
    padding: 30px 25px;
    border: 8px solid @blueGreen;
    div.alphaWrapper {
      padding: 5px;
      h4 {
        margin-top: 0;
        font-family: @font5;
        font-size: 16px;
      }
    }
  }
  div.recipientAlpha.alpha {
    width: 40%;
    z-index: 1000;
    position: absolute;
    margin: 0 30%;
    top: 25px;
    background: @white;
    padding: 30px 25px;
    border: 8px solid @blueGreen;
    div.alphaWrapper {
      padding: 5px;
      h4 {
        margin-top: 0;
        font-family: @font5;
        font-size: 20px;
      }
      ul.recipientList {
        margin-left: 5px;
        li {
          width: 100%;
        }
      }
    }
  }
  div#recipientAlpha.alpha.active {
    display: block;
  }
  a:hover {
    text-decoration: none;
  }
  div#loadingHolder {
    position: absolute;
    bottom: 10px;
    height: 50px;
    width: 72%;
    left: 85px;
    div.spinnerHolder {
      width: 40px;
      i.fa-spinner {
        font-size: 30px;
        text-align: center;
      }
    }
  }
  div#itemsLoadedHolder {
    position: absolute;
    bottom: 10px;
    left: 295px;
    height: 30px;
    div#allItemsLoaded {
      display: none;
    }
    div#allItemsLoaded.active {
      display: block;
    }
  }
  .divider2 {
    float: left;
    margin: 0 8px;
    position: relative;
    top: -1px;
    height: 19px;
    border-right: 1px solid darken(@greenGrey3,15%);
  }
  div.feedOptions {
    position: fixed;
    width: 940px;
    height: 50px;
    padding: 18px 15px;
    background: @grey2;
    border-bottom: 1px solid @grey4;
    .boxShadow(0;2px;1px;-1px;rgba(0,0,0,0.3));
    z-index: 999;
    .selectOptions {
      position: relative;
      top: -2px;
      width: 240px;
      margin-left: 20px;
      float: left;
      a {
        float: left;
      }
      a.selectAll {
        .fontStyle(@grey7;13px;400);
      }
      a.selectAll.disabled {
        color: @grey5;
        cursor: default;
      }
      a.replyAll {
        .fontStyle(@blueLight;13px;400);
        i {
          margin-right: 5px;
        }
      }
      a.replyAll.disabled {
        color: @grey5;
        cursor: default;
      }
      div.bootstrap-switch {
        margin-left: 40px;
        margin-top: -8px;
        background: @grey3;
        position: relative;
        color: rgba(0,0,0,0.2);
        i.disabled {
          position: absolute;
          display: block;
          z-index: 997;
          top: 10px;
          left: 12px;
        }
        i.disabled.fa-bars {
          left: 37px;
        }
        i {
          font-size: 16px;
        }
        span.bootstrap-switch-label {
          border: 2px solid @grey3;
          background: @grey3;
          padding: 3px;
          padding-top: 8px;
        }
        span.bootstrap-switch-handle-on {
          border: 2px solid @grey3;
          .insetShadow(0;0;0;1px;rgba(0,0,0,0.4));
          .gradientGrey1;
          .radius;
          color: @grey7;
          padding: 3px;
          padding-top: 8px;
        }
        span.bootstrap-switch-handle-off {
          position: relative;
          left: -2px;
          border: 2px solid @grey3;
          .insetShadow(0;0;0;1px;rgba(0,0,0,0.4));
          .gradientGrey1;
          .radius;
          color: @grey7;
          padding: 3px;
          padding-top: 8px;
        }
      }
    }
    .refreshHolder {
      float: right;
      position: relative;
      top: -11px;
      right: 20px;
      a.btn.important {
        margin-right: 5px;
      }
    }
  }
  ul.feed {
    float: left;
    width: 72%;
    padding-top: 20px;
    margin: 0;
    position: relative;
    left: 22px;
    top: 32px;
    .slideMed;
    div.spinnerHolder {
      width: 40px;
      i.fa-spinner {
        font-size: 30px;
        text-align: center;
      }
    }
    div.timeBreak {
      padding: 0 15px;
      width: 95%;
      margin-left: 5%;
      margin-bottom: 25px;
      .breakLeft {
        float: left;
        width: 38%;
        height: 4px;
        background: @grey4;
      }
      span {
        position: relative;
        top: -20px;
        float: left;
        width: 24%;
        text-align: center;
        .fontStyle(@grey5;16px;400);
      }
      .breakRight {
        float: right;
        width: 38%;
        height: 4px;
        background: @grey4;
      }
    }
    ul.batchRecipients {
      width: 80%;
      margin: 0 10%;
      margin-top: 45px;
      li.info {
        height: 25px;
        display: inline-block;
        p.responseEmail {
          margin-right: 0 !important;
          float: left;
          .fontStyle(@newBlueLight;16px;600) !important;
          i {
            margin-right: 10px;
          }
        }
        span.eventCount {
          position: relative;
          top: 2px;
          float: left;
          .fontStyle(@grey7;14px;700);
          margin-right: 10px;
        }
      }
    }
    li.response {
      margin-top: 10px;
      margin-bottom: 90px;
      width: 100%;
      position: relative;
      .cbWrapper.select {
        margin-left: 8px;
        padding: 3px;
        clear: left;
        float: left;
        width: 20px;
        height: 20px;
        position: relative;
        button {
          position: absolute; 
          top: 3px;
          left: 3px;
          width: 14px;
          height: 14px;
          i {
            font-size: 13px;
            margin-left: 1px;
          }
        }
      }
      div.info {
        position: absolute;
        left: 55px;
        p.responseEmail {
          margin-right: 0 !important;
          float: left;
          .fontStyle(@newBlueLight;16px;600) !important;
          i {
            margin-right: 10px;
          }
        }
        span.eventCount, span.recipientCount {
          position: relative;
          top: 2px;
          float: left;
          .fontStyle(@grey7;14px;700);
        }
        span.recipientCount {
          margin-left: 4px;
        }
      }
      a.reply {
        float: right;
        .fontStyle(@blueLight;14px;400);
        i {
          margin-right: 5px;
        }
      }
      a.reply:hover {
        color: lighten(@blueLight,5%);
      }
      a.reply.replied {
        cursor: default;
        color: @buttonGreen;
      }
      div.responseBody:before {
        content: '';
        display: block;
        position: absolute;
        top: -14px;
        left: 25px;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 0 14px 14px 14px;
        border-color: transparent transparent lighten(@blueGreen, 7%) transparent;
      }
      div.responseBody:after {
        content: '';
        display: block;
        position: absolute;
        top: -11px;
        left: 27px;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 0 12px 12px 12px;
        border-color: transparent transparent @greenGrey1 transparent;
      }

      div.responseBody {
        position: relative;
        top: 36px;
        width: 94%;
        margin-left: 6%;
        border: 2px solid lighten(@blueGreen, 7%);
        .radius;
        background: @greenGrey1;
        ul.responseList {
          width: 100%;
          padding-top: 25px;
          li.responseItem {
            width: 90%;
            margin: 5px 5%;
            margin-bottom: 30px;
            padding: 10px 0;
            position: relative;
            top: -20px;
            h4, h3 {
              padding-left: 10px;
              position: relative;
              top: 0;
              float: left;
              clear: left;
              width: 100%;
              margin-bottom: 2px;
              .fontStyle(@grey7;18px;300);
              text-transform: uppercase;
            }
            h4.response {
              text-transform: none;
              span {
                text-transform: none;
                color: @blueGreen;
              }
            }
            .responseDataWrapper {
              position: relative;
              top: 40px;
              width: 100%;
              background: @white;
              .radius;
              border: 5px solid @greenGrey4;
              .boxShadow(0;0;2px;rgba(0,0,0,0.2));
            }
            .responseDataWrapper.response {
              top: 24px;
            }
          }
          li#satResponse {
            .responseDataWrapper {
              height: 122px;
              position: relative;
              i.satResponseData {
                position: relative;
                top: 15px;
                left: 70px;
                display: block;
                height: 70px;
                width: 70px;
                .radius(35px);
                background: @blueGreen;
                text-align: center;
                .fontStyle(@white;42px;500);
                line-height: 17px;
                font-style: normal;
                border: 5px solid lighten(@blueGreen,20%);
              }
              label {
                position: relative;
                left: 65px;
                width: 80px;
                text-align: center;
                top: 15px;
                float: left;
                clear: left;
                text-transform: uppercase;
                .fontStyle(@grey7;14px;400);
              }
              p.result {
                width: 240px;
                position: absolute;
                left: 175px;
                top: 25px;
                text-transform: uppercase;
                .fontStyle(@blueGreen;40px;500);
              }
            }
          }
          li#rateResponse {
            .responseDataWrapper {
              min-height: 122px;
              position: relative;
            }
            div.ratingsResponseData {
              float: left;
              position: absolute;
              top: 10px;
              left: 59px;
              display: block;
              width: 90px;
              height: 90px;
              img {
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
              }
              span {
                width: 100%;
                text-align: center;
                float: left;
                top: 36px;
                margin: 0;
                position: absolute;
                font-style: normal;
                .fontStyle(@white;20px;500) !important;
              }
              p.result {
                width: 340px;
                position: absolute;
                left: 116px;
                top: 20px;
                text-transform: uppercase;
                .fontStyle(@blueGreen;40px;500);
              }
            }
            label.dataLabel {
              position: absolute;
              left: 65px;
              width: 80px;
              text-align: center;
              top: 136px;
              float: left;
              clear: left;
              text-transform: uppercase;
              .fontStyle(@grey7;14px;400);
            }
            ul#fbMetrics {
              position: relative;
              margin: 0;
              left: 175px;
              top: 35px;
              width: 400px;
              padding: 0;
              li {
                padding-left: 0;
                padding-bottom: 0;
                border: none;
                position: relative;
                height: 45px;
                label {
                  position: absolute;
                  top: 12px;
                  left: -10px;
                  margin-top: 0;
                  font-size: 18px;
                  color: @blueGreen;
                  text-align: right;
                }
                .rateit {
                  position: absolute;
                  left: 100px;
                  top: 5px;
                }
                .value {
                  margin-top: 0;
                  position: absolute;
                  left: 270px;
                  width: 120px;
                }
              }
            }
          }
          li#reviewResponse {
            .responseDataWrapper {
              height: 122px;
              i {
                position: relative;
                top: 10px;
                left: 65px;
                display: block;
                height: 80px;
                width: 80px;
                img {
                  position: relative;
                  top: -20px;
                  height: 100%;
                  width: 100%;
                }
              }
              p.result {
                width: 340px;
                position: relative;
                left: 175px;
                top: -52px;
                text-transform: uppercase;
                .fontStyle(@blueGreen;40px;500);
              }
            }
          }
          li#commentsResponse {
            .responseDataWrapper {
              padding: 20px;
            }
            p {
              -ms-word-break: break-all;
                word-break: break-all;

                // Non standard for webkit
                word-break: break-word;

              -webkit-hyphens: auto;
                -moz-hyphens: auto;
                  hyphens: auto;
              .fontStyle(@grey7;14px;400) !important;
              line-height: 16px;
            }
          }
          li#surveyResponse {
            .responseDataWrapper {
              min-height: 185px;
            }
            .cbWrapper.big {
              position: relative; 
              width: 90px;
              height: 90px;
              top: 35px;
              left: 60px;
              padding: 10px;
              button.checkBox {
                width: 70px;
                height: 70px;
                position: relative;
                top: -16px;
                left: 0;
                font-size: 50px;
                cursor: default;
              }
            }
            label.dataLabel {
              position: relative;
              width: 90px;
              text-align: center;
              left: 60px;
              top: 40px;
              text-transform: uppercase;
              .fontStyle(@grey7;14px;400);
            }
            ul.surveyResults {
              width: 400px;
              position: relative;
              left: 175px;
              top: -76px;
              li {
                width: 133px;
                margin-bottom: 30px;
                float: left;
                .cbWrapper {
                  float: left;
                  width: 26px;
                  height: 26px;
                  margin-right: 6px;
                  button.checkBox {
                    position: relative;
                    top: 3px;
                    width: 16px;
                    height: 16px;
                    cursor: default;
                    i {
                      font-size: 14px;
                    }
                  }
                }
                label {
                  margin-top: 6px;
                  text-transform: uppercase;
                  .fontStyle(@grey7;12px;400);
                }
              }
            }
          }
        }
        div.dateWrapper {
          width: 100%;
          height: 34px;
          padding: 6px 8px;
          background: @greenGrey5;
          border-top: 1px solid @grey4;
          .bottomRadius(6px);
          position: relative;
          a {
            position: absolute;
            left: 10px; 
          }
          p.date {
            float: right;
            margin: 0;
          }
          p.recipients {
            float: left;
            margin: 0;
            cursor: pointer;
            color: @blueGreen;
          }
          p.recipients:hover {
            color: darken(@blueGreen,10%);
          }
        }
      }
    }
    li.response.responded {
      top: 30px;
    }
    li.response.responded.batch {
      i.satData {
        text-align: center;
        display: inline-block;
        font-style: normal;
        padding: 8px 0;
        height: 34px;
        width: 34px;
        .radius(17px);
        background: @blueGreen;
        font-family: @font5;
        .fontStyle(@white;16px;400);
      }
      i.rateData {
        margin-top: 13px;
        margin-bottom: 6px;
        display: inline-block;
        height: 21px;
        width: 38px;
        img {
          height: 100%;
          width: 100%;
        }
      }
      i.reviewsData {
        display: inline-block;
        height: 34px;
        width: 34px;
        margin: 3px 6px;
        img {
          height: 100%;
          width: 100%;
        }
      }
      li.responseItem.batch {
        min-height: 120px;
        .responseDataWrapper {
          top: 0;
        }
        h4 {
          height: 42px;
          width: 50% !important;
          clear: none !important;
          p {
            display: inline-block;
          }
        }
      }
    }
    li.response.responded.first {
      top: 10px;
    }
  }
  ul.feed.responses {
    margin-top: -30px;
  }
  div.filterOptions {
    float: left;
    width: 198px;
    padding-bottom: 40px;
    right: -56px;
    top: 50px;
    position: relative;
    h3 {
      width: 160px;
      margin-top: 8px;
      margin-left: 18px;
      font-size: 18px;
    }
    .toggleList {
      position: relative;
      width: 100%;
      li {
        width: 80%;
        margin: 10px 10%;
        a {
          .radius;
          display: block;
          .fontStyle(@blueLight;16px;600);
        }
          a.active {
          text-decoration: none;
          padding: 5px 4px;
          border: 1px solid rgba(0,0,0,0.15);
          color: @grey7;
          cursor: default;
          background: lighten(@greenGrey1,2%);
          .insetDrop(0;0;1px;@white;0;1px;1px;rgba(0,0,0,0.3));
        }
      }
    }
    .dropdown {
      position: relative;
      width: 100%;
      margin: 15px 0;
      a.dropdown-toggle {
        .radius;
        background: @grey2;
        display: block;
        width: 151px;
        margin-left: 23px;
        padding: 6px 5px;
        text-align: left;
        .insetShadow(0;0;1px;rgba(0,0,0,0.3));
        span {
          text-transform: capitalize;
        }
        i {
          float: right;
          margin-right: 4px;
          margin-top: 3px;
        }
      }
      a:focus, a:hover {
        text-decoration: none;
        outline: none;
      }
      a.dropdown-toggle:hover {
        background: @greenGrey1;
        .insetShadow(0;0;1px;rgba(0,0,0,0.3));
      }
      .dropdown-menu {
        margin-left: 23px;
        width: 151px;
        background: @white;
        z-index: 998;
        li {
          a {
            padding: 8px;
            input {
              position: relative;
              top: -1px;
              margin-right: 6px;
            }
          }
          a:focus {
            background: @white;
          }
          a:hover {
            background: @white;
            cursor: default;
            color: rgba(0, 0, 0, 0.6);
          }
        }
      }
    }
    .dropdown.open, .dropdown.stayOpen {
      a.dropdown-toggle {
        .topRadius;
        text-decoration: none;
        padding: 5px 4px;
        border: 1px solid rgba(0,0,0,0.15);
        background: @greenGrey1;
        .insetDrop(0;0;1px;@white;0;1px;1px;rgba(0,0,0,0.3));
      }
      .dropdown-menu {
        display: block;
      }
    }
    a#applyFilters {
      display: block;
      margin-left: 23px;
      margin-right: 23px;
    }
    a.clear {
      clear: left;
      position: relative;
      top: 20px;
      margin-left: 55px;
    }
    a.clear:hover {
      text-decoration: underline;
    }
  }
  a.topButton {
    color: darken(@grey3,4%);
    bottom: 15px;
    left: 0;
    font-size: 36px;
    position: fixed;
    .fade;
    opacity: 1 !important;
  }
  a.topButton.absolute {
    position: absolute;
  }
  a.topButton.hidden {
    visibility: visible !important;
    opacity: 0 !important;
    display: block !important;
  }
}


/*REPLY UI*/

.groupWrapper {
  z-index: 1000;
  display: none;
  background: @lightGreen1;
  position: absolute;
  margin-left: 60px;
  top: 140px;
  h3 {
    margin-left: 10px;
    .fontStyle(@white;18px;500);
  }
}
#reply {
  float: right;
  margin: 15px 11px;
  .heightAndWidth(258px;589px);
  border: 1px solid @grey6;
  background: lighten(@greenGrey1,3%);

  h3 {
    padding-left: 10px;
    color: darken(@blueGrey5, 10%);
  }

  form {
    padding: 10px;

    .btn {
      background: @white !important;
      color: @grey7;
      .textShadow(0;0;1px;@grey3);
    }

    .dropdown-toggle {
      width: 130px;
    }

    i.fa-font, i.fa-caret-down {
      top: 0px;
    }

    iframe.wysihtml5-sandbox {
      width: 567px !important;
      height: 150px !important;
    }

    button.submit {
      margin: 15px 0;
      border-color: @grey7;
    }
  }

}

body.login {
  background: @greenDarkNew;
  height: 100%;
  min-height: 790px;
  div.logoStatic {
    position: relative;
    padding-top: 50px;
    max-width: 1000px;
    z-index: 1001;
    width: 30%;
    margin: 0 35%;
    margin-bottom: 20px;
    a {
      width: 100%;
      display: block;
    }
    img {
      width: 100%;
    }
    p {
      margin-top: 15px;
      font-family: @font6;
      color: rgba(255,255,255,0.75);
      font-weight: 300;
      text-align: center;
      font-size: 24px;
      span {
        color: rgba(255,255,255,0.85);
        font-weight: 400;
        font-family: @font1;
      }
    }
    p.prompt.small {
      margin-top: 2px;
      font-size: 20px;
    }
    div.horizontalDiv {
      display: none;
      width: 62%;
      height: 0;
      margin: 0 19%;
      border-top: 3px solid rgba(255,255,255,0.25);
    }
    div.horizontalDiv.active {
      display: block;
    }
  }
  div.fourohfour-prompt {
    float: left;
    width: 40%;
    h2 {
      margin-top: 30px;
      font-family: @font6;
      font-size: 50px;
      line-height: 65px;
      color: @white;
    }
    h2.fourohfour {
      margin-top: 97px;
    }
    p {
      font-family: @font5;
      margin-top: 25px;
      margin-left: 30px;
      margin-right: 30px;
      color: rgba(255,255,255,0.8);
    }
    h2 {
      margin-left: 30px;
      font-size: 36px;
      color: rgba(255,255,255,0.9); 
    }
    h3 {
      margin-left: 30px;
      font-size: 24px;
      color: rgba(255,255,255,0.9);
    }
    a.btn.important {
      background: @brightBlueNew;
      font-family: @font5;
      padding: 15px 30px;
      font-size: 16px;
      font-weight: 600;
      .textShadow(1px;1px;0px;rgba(0,0,0,0.2));
      .insetDrop(0;-3px;0;0;rgba(0,0,0,0.3);0;2px;3px;-1px;rgba(0,0,0,0.2));
    }
    a.btn.important:hover {
      background: lighten(@brightBlueNew,8%);
    }
    form {
      float: left;
      position: relative;
      margin-left: 30px;
      width: 360px;
      margin-bottom: 30px;
      .control-label {
        text-align: left;
      }
      label {
        font-family: @font5;
        color: rgba(255,255,255,0.8);
        margin-top: 8px;
      }
      input[type="text"], input[type="password"], input[type="email"] {
        height: 40px;
        width: 360px;
        font-size: 14px;
        .insetShadow(0;0;3px;rgba(0,0,0,0.3));
        font-weight: 400;
      }
      div.remember {
        margin-top: 20px; 
        height: 20px;
        p {
          font-family: @font5;
          float:left;
          margin: 0;
          margin-right: 10px;
          color: @grey2;
          padding-right: 10px;
          input {
            position: relative;
            top: -2px;
            margin-right: 5px;
          }
          a {
            color: @grey2;
            font-weight: 400;
          }
          a:hover {
            color: @grey3;
            text-decoration: underline;
          }
        }
        p:first-child {
          border-right: 1px solid darken(@grey3,4%);
        }
      }
      .buttonHolder {
        margin-top: 30px;
        input.btn.important {
          background: @brightBlueNew;
          font-family: @font5;
          padding: 15px 30px;
          font-size: 16px;
          font-weight: 600;
          .textShadow(1px;1px;0px;rgba(0,0,0,0.2));
          .insetDrop(0;-3px;0;0;rgba(0,0,0,0.3);0;2px;3px;-1px;rgba(0,0,0,0.2));
        }
        input.btn.important:hover {
          background: lighten(@brightBlueNew,8%);
        }
      }
      div.error {
        width: 100%;
        padding: 14px 20px;
        margin-top: 6px;
        margin-bottom: 4px;
        .radius;
        p {
          font-family: @font5;
          margin: 0;
          color: rgba(255,255,255,0.9);
          font-weight: 600;
          a {
          color: rgba(255,255,255,0.9);
            text-decoration: underline;
            font-weight: 700;
          }
          a:hover {
            color: @grey3;
          }
        }
      }
    }
  }
  #login.resetConfirm {
    width: 700px;
    div#pwReqs {
      float: left;
      width: 40%;
      margin-top: 84px;
      padding: 0 10%;
      font-family: @font5;
      h4 {
        font-family: @font5;
        .fontStyle(rgba(255,255,255,0.9);14px;600);
      }
      ul.pwReqs {
        margin-left: 10px;
        li {
          .fontStyle(@grey2;12px;400);
        }
      }
    }
    .control-group {
      .control-label {
        label {
          float: left;
        }
        i.fa-check-circle {
          float: left;
          position: relative;
          top: 6px;
          left: 5px;
          color: @buttonGreen;
          font-size: 20px;
        }
      }
      .controls {
        input.valid {
          border: 1px solid @buttonGreen;
        }
      }
    }
    form {
      float: left;
      p {
        margin-left: 0;
      }
    }
    h1 {
      width: 100%;
      text-align: center;
      font-family: @font5;
      color: @white;
      font-size: 18px;
    }
    h3 {
      font-size: 14px;
      padding: 0 20%;
    }
  }
  #login.logout, #login.resetDone {
    padding: 40px;
    height: 200px;
    font-family: @font5;
    p {
      color: rgba(255,255,255,0.9);
      margin-top: 15px;
      font-size: 20px;
    }
  }
  footer.main.big {
    border-top: 1px solid rgba(255,255,255,0.3);
      .insetShadow(0;2px;3px;rgba(255,255,255,0.1));

    .container {
      ul.social {
        right: -455px;
      }
    }
  }
}


/*Step Error Alpha Screen*/
.alpha.setupProgress {
  display: none;
  height: 500px;
  width: 80%;
  margin-left: 10%;
  z-index: 1000;
  position: absolute;
  top: 80px;
  background: @white;
  .radius;
  padding: 25px;
  button {
    position: relative;
    bottom: 5px;
    width: 20%;
    margin: 0 40%;
  }
  h3 {
    .fontStyle(@green;22px;400);
  }
  p.stepError {
    .fontStyle(@red1;12px;600);
  }
  
}

.alpha.setupProgress.active {
  display: block;
}



/*Self Assessment Alpha screen*/
.alpha.selfAssessment {
  z-index: 1000 !important;
  margin: 120px auto;
  border: 1px solid @grey3;
  width: 760px;
  padding: 10px 20px;
  .radius(7px);
  background: #fff;

  h3 {
    margin-top: 5px;
    text-align: center;
    font-family: @font1;
    padding-bottom: 5px;
    border-bottom: 2px solid @green;
    .fontStyle(@green;26px;600);
  }
  p.assessmentPrompt {
    margin: auto;
    width: 70%;
    margin-top: 5px;
    text-align: center;
    font-family: @font3;
    .fontStyle(@grey7;14px;600);
  }
  li.question {
    display: none;
    .slide;
    height: 70px;
    text-align: center;
    .fontStyle(@grey6;18px;500);
    margin-top: 40px;
    div.answer {
      margin: 40px 9px;
      width: 125px;
      float: left;
      input {
        display: block;
        margin: auto;
      }
      label {
        text-align: center;
        .fontStyle(@grey7;12px;500);
      }
    }
  }

  .navButtons {
    width: 185px;
    margin: auto;
    button {
      width: 80px;
      float: right;
    }
    .previous {
      opacity: 0.3;
      margin-right: 15px;
    }
    .previous.active {
      opacity: 1;
    }
    .submit {
      display: none;
    }
  }

}

#selfAssessmentOverlay{
  z-index: -1;
  position: fixed;
  top: 0px;
  height: 100%;
  width: 100%;
  background: rgba(0,0,0,0.5);
}



/*Pricing Page */
#pricing {
  position: relative;
  top: -35px;
  margin: auto;
  width: 1000px;
  padding: 0 20px;
  .pricing {
    font-family: @font3;
    width: 98%;
    margin-top: 195px;
    margin-left: 1%;
    height: 2000px;
    position: relative;
    h2 {
      .fontStyle(@grey7;26px;400);
      position: absolute;
      top: -22px;
      padding-left: 9px;
      margin-left: 6px;
      width: 280px;
      border-bottom: 3px solid @grey4;
    }
    ul {
      float: left;
      margin: 0 5px;
      li {
        padding: 15px 15px;
        margin: 2px 0;
        display: block;
        width: 100%;
        height: 50px;
        background: lighten(@grey3,3%);
      }
      li.alternate {
        background: lighten(@grey3,7%);
      }
      li.header {
        background: none;
      }
      li.events {
        padding: 5px 15px;
      }
      h4 {
        font-family: @font1;
        margin-top: 0px;
      }
    }
    ul.labels {
      width: 280px;
      .title {
        height: 40px;
        padding: 0px;
        background: none;
        h4 {
          border-bottom: 2px solid @grey7;
          position: relative;
          top: 5px;
          margin-left: 12px;
          .fontStyle(@green;30px;700);
        }
      }
      li.header {
        h4 {
          margin-top: 9px;
          .fontStyle(@grey7;16px;700);
        }
      }
    }
    ul.free, ul.basic, ul.advanced {
      text-align: center;
      width: 205px;
      position: relative;
      top: -8px;
      .title {
        height: 50px;
        position: relative;
        top: -112px;
        background: @bgBlue;
        color: @white;
        .topRadius;
        padding: 15px 0;
      }
      .header {
        padding: 3px 0;
        a.btn {
          position: relative;
          top: -2px;
          padding: 0 20px;
          width: 80%;
          margin: 1% 10%;
          line-height: 43px;
          height: 43px;
          .insetShadow(0;-4px;0;0;rgba(0,0,0,0.3));
          .radius;
        }
      }
      .price {
        height: 105px;
        position: absolute;
        top: -60px;
        background: @greenGrey1;
        padding: 0;
        span.amount {
          .fontStyle(@blueDark;16px;400);
          b {
            .fontStyle(@blueDark;45px;400);
          }
        }
        span.amount.subscriber {
          text-align: center;
          width: 60%;
          margin: 0 15%;
          border-bottom: 2px solid @grey4;
          position: relative;
          top: -12px;
          font-size: 12px;
        }
        span.amount.trial {
          position: relative;
          top: -6px;
        }
      }

    }
    .fa-check {
      margin-top: 1px;
      font-size: 20px;
      color: @green;
    }
  }
}
.pricing {
  margin: 60px;
  .plan {
    float: left;
    margin: 0px;
    border-top: 1px solid @grey6;
    li {
      height: 70px;
      width: 100px;
      padding: 10px;
      border: solid @grey6;
      border-width: 0 1px 1px 1px;
    }
  }
}


/*Signup Stuff*/

#signup {
  padding: 40px 0;
  padding-bottom: 20px;
  h1 {
    margin-top: -7px;
    text-align: center;
    .fontStyle(@green;32px;300);
    margin-bottom: 0;
    font-family: @font1;
  }
  h2 {
    margin-top: -3px;
    text-align: center;
    font-family: @font5;
    .fontStyle(@bgBlue;18px;500);
    span {
      .fontStyle(lighten(@green,10%);18px;300);
    }
  }
  h1.thanks {
    font-size: 32px;
    margin-top: 20%;
    font-weight: 500;
    padding: 0 60px;
    font-family: @font5;
  }

  h2.thanks {
    margin-top: 15px;
    font-size: 26px;
    color: @blueGreen;
  }

  .seal {
    margin-top: 55px;
    width: 30%;
    margin-left: 35%;
    img {
      width: 100%;
    }
  }

  form {
    margin: auto;
    margin-top: 40px;
    padding: 10px;
    width: 60%;
    .radius;
    ul.steps {
      width: 100%;  
      margin-top: 27px;
      margin-bottom: 78px;
      height: 9px;
      .insetShadow(0;0;1px;1px;lighten(@green,2%));
      .radius(3px);
      position: relative;
      li.step {
        position: absolute;
        top: -18px;
        padding: 2px;
        height: 46px;
        width: 46px;
        .radius(40px);
        background: @grey2;
        .insetShadow(0;0;1px;1px;lighten(@grey2,2%));
        border: 1px solid @green;
        .wrapper {
          height: 40px;
          width: 40px;
          background: @grey3;
          .radius(42px);
          p {
            text-align: center;
            padding: 8px;
            .fontStyle(@grey6;18px;600);
          }
          i {
            text-align: center;
            .fontStyle(@white;18px;600);
            display: none;
            padding-top: 11px;
            padding-left: 2px;
          }
        }
        span {
          text-transform: uppercase;
          text-align: center;
          width: 200px;
          position: relative;
          top: 8px;
          left: -80px;
          .fontStyle(darken(@bgBlue,15%);14px;600);
        }
      }
      li.complete {
        .insetShadow(0;0;1px;1px;lighten(@green,2%));
        .wrapper {
          background: lighten(@green,12%);
          p {
            display: none;
          }
          i {
            display: block;
          }
        }
      }
      li.active {
        .insetShadow(0;0;1px;1px;lighten(@green,2%));
        .wrapper {
          background: @green;
          p {
            .fontStyle(@white;18px;600);
          }
        }
        span {
          color: @green;
          font-size: 20px;
        }
      }
      li#step1 {
        float: left;
        left: -1px;
      }
      li#step2 {
        left: 47%;
      }
      li#step3 {
        float: right;
        right: -1px;
      }
      .progress {
        opacity: 0.5;
        display: block;
        position: absolute;
        height: 7px;
        background: @lightGreen1;
      }
    }
    .container.sealImg {
      width: 200px;
      img {
        width: 100%;
      }
    }
    h3.complete {
      padding: 0 30px;
      line-height: 45px;
      text-align: center;
      font-family: @font5;
      margin-top: 26%;
      .fontStyle(rgba(0,0,0,0.75);26px;600);
    }
    label.mobile {
      display: none;
    }
    table {
      margin-top: 0;
      margin-bottom: 50px;
      position: relative;
      tr {
        height: 55px;
        padding-bottom: 30px;
      }
      th {
        width: 100%;
        padding: 0;
        label {
          width: 330px;
          .fontStyle(@grey6;16px;700);
        }
      }
      td {
        margin-top: 55px;
        position: absolute;
        width: 98%;
        margin-left: 1%;
        left: 0px;
        float: none;
        input[type="text"], input[type="email"] {
          height: 40px;
          width: 98%;
          margin-left: 1%;
          .insetShadow(0;1px;2px;rgba(0,0,0,0.15));
        }
        input[type="text"]:hover, input[type="email"]:hover {
          .insetShadow(0;0;2px;lighten(@green,10%));
        }
        input[type="text"]:focus, input[type="email"]:focus {
          border: 1px solid @grey6;
          outline: none;
          .insetShadow(0;0;1px;2px;lighten(@green,22%));
        }
      }
    }


    table.basic {
      width: 100%;
      margin: 0 auto; 
      max-width: 430px;
      padding: 0 2%;
      tr {
        height: 84px;
        padding-bottom: 0px !important;
      }
      th {
        padding: 0px;
        label {
          margin-left: 2%;
        }
      }
      td {
        margin-top: 55px;
      }
      ul.errorlist {
        position: absolute;
        margin-bottom: 0px;
        padding: 0;
        top: -24px;
        left: 103px;
        border-bottom: none;
        li {
          padding: 1px 15px;
          .radius;
          height: 18px;
          background: rgba(0,0,0,0.6);
          text-align: center;
          color: @white;
          font-size: 11px;
        }
        li:before {
          z-index: 951;
          border-left: 5px solid transparent;
          border-top: 5px solid transparent;
          border-bottom: 5px solid transparent;
          border-right: 5px solid rgba(0,0,0,0.6);
          content: '';
          display: block;
          position: absolute;
          top: 4px;
          left: -10px;
        }
      }
      tr:nth-child(3) {
        td {
          ul.errorlist {
            left: 63px;
          }
        }
      }
      tr:nth-child(4) {
        td {
          ul.errorlist {
            left: 95px;
          }
        }
      }
    }

    table.requirements {
      width: 100%;
      height: 20px;
      display: none;
    }

    .btn {
      border: none;
      height: 50px;
      background: lighten(@green,20%);
      .fontStyle(@white;18px;400);
      .textShadow(0;1px;0px;rgba(0, 0, 0, 0.3));
      min-width: 160px;
      width: 90%;
    }
    .button.container {
      margin: 40px auto;
      max-width: 430px;
      padding: 0 1%;
      input[type="submit"] {
        width: 98%;
        margin-left: 1%;
        background: @green;
      }
    }
  }
  form.basic {
    margin-top: 55px;
  }
}

/*Checkboxes*/
.cbWrapper {
  position: relative;
  height: 35px;
  width: 35px;
  background: rgba(0,0,0,0.12);
  .insetShadow(0;0;1px;rgba(0,0,0,0.3));
}

.checkBox { 
  position: absolute;
  top: 5px;
  left: 5px;
  background: @lightGreen2;
  .insetShadow(0;0;1px;@lightGreen1);
  border: none;
  padding: 0;
  height: 25px;
  width: 25px;
  .fontStyle(rgba(255,255,255,0.95);26px;400);
  i {
    display: none;
  }
}

.checkBox.hover {
  background: @green;
  i {
    display: block;
    opacity: 0.85;
  }
}

.checkBox.deselected {  
  background: @lightGreen2;
  i {
    display: none;
  }
}

.checkBox.active {
  background: @green;
  i {
    opacity: 1;
    display: block;
  }
}

.checkBox:focus {
  outline: none;
}

/*Self Assessment */
#signup.selfAssessment {
  form {
    .container.sealImg {
    }
  }
  .navButtons {
    z-index: 1;
    width: 100%;
    height: 100px;
    position: relative;
    top: -5px;
    li {
      float: left;
      position: absolute;
      margin-bottom: 15px;
    }
    li.left {
      top: -72px;
      left: 0px;
    }
    li.right {
      top: -72px;
      right: 0px;
    }
    a {
      .fontStyle(@green;60px;400);
    }
    a#left {
      display: none;
    }
    a.disabled {
      opacity: 0.5;
      cursor: default;
    }
  }
  table.selfAssessment {
    width: 82%;
    margin: 0 9%;
    margin-top: 30px;
    tr {
      width: 100%;
      height: 120px;
    }
    td {
      margin-top: 20px;
    }
    th {
      margin-top: 20px;
      position: relative;
      float: left;
      label {
        text-align: center;
        width: 100%;
        font-size: 24px;
        padding: 0;
      }
    }
    ul {
      float: left;
      margin-bottom: 10px;
      padding-bottom: 6px;
      position: relative;
      width: 100%;
      top: 130px;
      li {
        float: left;
        margin: 0;
        width: 20%;
        label {
          position: relative;
          left: 10%;
          width: 80%;
          text-align: center;
          .fontStyle(@grey7;14px;400);
          input {
            display: none;
          }
        }
      }
    }
    ul.errorlist {
      background: rgba(255,74,74,0.35);
      width: 100%;
      height: 53px;
      position: absolute;
      left: 0;
      top: 45px;
      margin-bottom: 0px;
      padding-bottom: 0px;
      border-bottom: none;
      li {
        width: 100%;
        text-align: center;
        color: @grey6;
        font-size: 10px;
      }
    }
  }
  ul.cb {
    z-index: 1000;
    height: 40px;
    position: relative;
    top: -10px;
    width: 80%;
    margin-left: 10%;
    div.count {
      position: absolute;
      top: -130px;
      width: 100%;
      p {
        .fontStyle(@grey7;20px;600);
        width: 100%;
        text-align: center;
      }
    }
    li {
      float: left;
      width: 20%;
      .cbWrapper {
        margin: auto;
      }
    }
  }
  .button.container {
    margin-top: 0;
  }
}

#signup.requirements {
  #reasons {
    margin-top: 10px;
    width: 80%;
    margin-left: 10%;
    padding: 0;
    ul.reasons {
      height: 358px;
      li {
        margin: 10px 0;
        width: 100%;
        float: left;
        height: 60px !important;
        padding: 12px;
        .cbWrapper {
          float: left;
          position: relative;
          left: -15px;
          margin: 6px 1px;
        }
        p {
          width: 89%;
          float: left;
          .fontStyle(@grey7;18px;600);
          font-family: @font5;
          span {
            font-size: 16px;
          }
          img {
            position: relative;
            left: -15px;
            top: -10px;
            margin: 2px;
            width: 70px;
            float: left;
          }
        }
      }
    }
  }
}


/*home1 About*/
#about {
  .div {
      background: @bgBlue;
      h3 {
        text-align: center;
        .fontStyle(@white;28px;500);
        margin-bottom: none;
        position: relative;
        top: 28%;
      }
  }
  #div2 {
    background: @lightGreen;
    border-top: 1px solid rgba(255,255,255,0.4);
    width: 100%;
    height: 4px;
    .boxShadow(0;1px;1px;rgba(0,0,0,0.4));
  }
  ul.hiw {
    padding: 0 40px;
    padding-top: 40px;
    h3 {
      text-align: center;
      font-family: @font5;
      text-transform: uppercase;
      .fontStyle(darken(@grey7,10%);40px;400);
    }
    li {
      margin-top: 30px;
      float: left;
      display: block;
      width: 100%;
      height: 200px;
      margin: 2%;
      img {
        float: right;
        width: 210px;
        margin-top: 35px;
        margin-right: 100px;
      }

      span.badge {
        float: left;
        background: lighten(@green,20%);
        height: 75px;
        padding-top: 13px;
        width: 75px;
        font-family: @font5;
        font-size: 45px;
        margin-top: 95px;
        margin-left: 25px;
        margin-right: 25px;
      }
      p {
        margin-top: 112px;
        width: 60%;
        float: left;
        line-height: 22px;
        font-family: @font5;
        .fontStyle(@grey7;18px;400);
        b {
          line-height: 16px;
          .fontStyle(lighten(@green,20%);20px;600);
        }
      }
    }
    li.alt {
      img {
        float: left;
      }
      span.badge {
        background: @green;
      }
    }
  }
}

.home2 {
  #mainPrompt {
    background: url('@{base}/images/bgFade3.png');
    h1 {
      text-align: center;
      font-family: @font5 !important;
      .fontStyle(rgba(255,255,255,0.93);48px;300);
      .textShadow(0;1px;0;rgba(0,0,0,0.2));
      b {
        .fontStyle(rgba(255,255,255,0.99);48px;600);
      }
    }
    h2 {
      .fontStyle(rgba(255,255,255,0.96);24px;300) !important;
    }
    a#IW { 
      display: block;
      width: 320px;
      position: relative;
      top: 10px;
      margin: 30px auto;
      padding: 7px 14px;
      /*
      background: rgba(255,255,255,0.85);
      .insetShadow(0;1px;1px;@white);
      border: 1px solid rgba(255,255,255,0.9);
      */
      .radius(10px);
      img.seal {
        width: 100%;
        opacity: 0.9;
      }

    }
    a#IW:hover {
      text-decoration: none;
    }
    a.btn {
      padding: 12px 0;
      border : none;
      .insetDrop(0;0;1px;rgba(255,255,255,0.85);0;1px;0;rgba(0,0,0,0.5));
      display: block;
      width: 320px;
      position: relative;
      top: -4px;
      margin: 0 auto;
      .radius(7px);
      .noTextShadow;
      background: @green;
      .fontStyle(darken(@blue1,55%);24px;600);
    }
    a.btn:hover {
      transition: all 0.75s ease;
      .fontStyle(rgba(255,255,255,0.98);24px;600);
      .textShadow(0;0;2px;rgba(255,255,255,0.4));
      background: lighten(@green,7%);
    }
  }
}

section#about.start {
  bottom : 170%;
}

section#about.end {
  bottom : -210%;
}


.div {
  background: @bgBlue;
  h3 {
    text-align: center;
    .fontStyle(@white;28px;500);
    margin-bottom: none;
    position: relative;
    top: 28%;
  }
}
.div2 {
  opacity: 0.4;
  background: @lightGreen;
  border-top: 1px solid rgba(255,255,255,0.4);
  width: 100%;
  height: 4px;
  .boxShadow(0;1px;1px;rgba(0,0,0,0.4));
}
.div2#div2 {  
  margin-top: 65px;
}
#divTri {
  position: relative;
  top: -4px;
  display: block;
  width: 133px;
  height: 66px;
  background: url('@{base}images/divTri.png');
  margin: 0 auto;
  z-index: 2;
}
div.main {
  width: 100%;
  background: @darkBlue3;
  height: 900px;

  h3 {
    text-align: center;
    font-family: @font5 !important;
    .fontStyle(rgba(0,0,0,0.58);38px;600);
  }

  #trust {
    position: relative;
    top: 40px;
    width: 100%;
    display: block;
    background: lighten(@lightGreen1,20%);
    h2 {
      position: relative;
      top: 25px;
      font-family: @font5 !important;
      text-align: center;
      .fontStyle(@blue2;36px;600) !important;
      margin-bottom: 45px;
    }

    h3 {
      font-family: @font5 !important;
      text-align: center;
      .fontStyle(@grey7;22px;400);
      margin-bottom: 15px;
    }
    ul.hiw {
      width: 100%;
      margin-top: 20px;
      height: 360px;
      li {
        float: left;
        width: 25%;
        img {
          margin-left: 20%;
          width: 60%;
        }
        h4 {
          font-family: @font5 !important;
          text-align: center;
          .fontStyle(lighten(@blue2,5%);24px;600);
        }
        p {
          font-family: @font5 !important;
          text-align: center;
          .fontStyle(rgba(0,0,0,0.55);14px;400);
          b {
            .fontStyle(rgba(0,0,0,0.75);14px;600);
          }

        }
      }
    }
    div#IWorthy {
      height: 750px;
      background: @blueDark;
      h2 {
        color: rgba(255,255,255,0.83) !important;
      }
      #reasons {
        display: block;
        padding: 0;
        width: 100%;
        margin-top: 40px;
        ul.reasons {
          width: 50%;
          margin-left: 25%;
          li {
            height: 150px;
            text-align: left;
            .fontStyle(rgba(255,255,255,0.85);36px;400);
            font-family: @font5 !important;
            img {
              position: relative;
              top: -27px;
              width: 140px;
              margin-right: 25px;
            }
            span {
              .fontStyle(rgba(255,255,255,255.75);18px;400);
            }
          }
        }
      }
    }
    div#VOS {
      height: 550px;
      background: lighten(@lightGreen1,20%);
      position: relative;
      .container {
        position: relative;
        h2 {
          width: 60%;
          margin: 0;
          margin-top: 170px;
        }
        p {
          width: 55%;
          margin: 40px 25px !important;
          line-height: 26px;
          height: 150px;
          text-align: left;
          .fontStyle(rgba(0,0,0,0.75);20px;400);
          font-family: @font5 !important;
        }
        img {
          width: 440px;
          position: relative;
          bottom: 358px;
          float: right;
          right: 0px;
        }
      }
    }
    div#benefits {
      height: 700px;
      background: @darkBlue3;
      position: relative;
      h2 {
        float: right;
        position: relative;
        top: -320px;
        color: rgba(255,255,255,0.83) !important;
      }
      ul.benefits {
        width: 50%;
        float: right;
        position: relative;
        top: -320px;
        margin-right: 15%;
        li {
          width: 100%;
          float: left;
          font-family: @font5 !important;
          .fontStyle(rgba(0,0,0,0.53);20px;400);
          margin: 12px 0;
          border-bottom: 2px solid rgba(255,255,255,0.2);
          padding-bottom: 22px;
          span {
            text-align: center;
            margin-right: 25px;
            margin-top: -4px;
            float: left;
            width: 60px;
            .radius(40px);
            height: 60px;
            background: @darkBlue3;
            line-height: 60px;
            .fontStyle(rgba(255,255,255,0.5);48px;600);
          }
        }
      }
    }
    div#getStarted {
      background: @white;
      height: 500px;
      h2 {
        text-align: center;
      }
      ul.getStarted {
        width: 70%;
        float: right;
        position: relative;
        top: -320px;
        margin-right: 15%;
        li {
          width: 100%;
          float: left;
          font-family: @font5 !important;
          .fontStyle(rgba(0,0,0,0.53);20px;400);
          margin: 12px 0;
          border-bottom: 2px solid rgba(255,255,255,0.2);
          padding-bottom: 22px;
          span {
            text-align: center;
            margin-right: 25px;
            margin-top: -4px;
            float: left;
            width: 60px;
            .radius(40px);
            height: 60px;
            background: @darkBlue3;
            line-height: 60px;
            .fontStyle(rgba(255,255,255,0.5);48px;600);
          }
        }
      }
    }
  }
}


/*Wizard Fix */

body.home.wizard {
  table.selfAssessment {
    td {
      ul {
        li:first-child {
          display: none;
        }
      }
    }
  }
}

/*About Page*/
body.about {
  height: auto !important;
  font-family: @font5;
  background: @white;
  header.svAboutHeader {
    height: 55px;
    background: @white;
    #SVLogo {
      width: 225px;
      margin-top: 7px;
      img {
        width: 100%;
      }
    }
  }
  .left {
    float: left;
  }
  .right {
    float: left;
  }
  h2, h3, h4 {
    font-family: @font5;
    text-align: center;
    font-weight: 300;
  }
  #mainWrapper {
    #mainContent {
      .radius(0);
      margin-top: 5px;
      min-width: 1140px;
      a#getStarted {
        padding: 18px 15px;
        display: block;
        width: 250px;
        .radius;
        background: @blueGreen;
        .fontStyle(@white;22px;300);
        text-align: center;
        i { 
          position: relative;
          top: 7px;
          float: right;
        }
      }
      a#getStarted:hover {
        text-decoration: none;
        background: lighten(@blueGreen,10%);
      }
      #mainPromptContainer {
        background: @lightBlue4;
        position: relative;
        border-bottom: 1px solid @grey5;
        .mainPrompt {
          h2 {
            padding: 0 160px;
            margin-top: 50px;
            line-height: 50px;
            font-size: 40px !important;
            font-weight: 300;
          }
        }
        #expandedSealWrapper {
          margin-top: 10px;
          margin-left: 15px;
          width: 480px;
          height: 480px;
        }
        #validationWrapper {
          margin-left: 40px;
          width: 45%;
          .promptWrapper {
            margin-top: 90px;
            h3 {
              text-align: center;
              line-height: 58px;
              .fontStyle(@blueGreen;42px;700);
            }
            img#seal {
              width: 203px;
              margin: 5px 155px;
            }
            a#getStarted {
              padding: 14px 8px;
              font-size: 18px;
              width: 200px;
              margin: 10px 155px;
              .insetShadow(0;-3px;0;0;rgba(0,0,0,0.3));
              i {
                top: 5px;
              }
            }
            p.subPrompt {
              width: 80%;
              margin-top: 5px;
              .fontStyle(@grey7;22px;400) !important;
            }
          }
        }
      }
      .divider {
        width: 100%;
        height: 16px;
        background: url('@{base}images/divider1.png');
      }
      #programRequirements {
        h3 {
          margin-top: 5px;
          font-size: 36px;
          color: @blueGreen;
        }
        ul.programReqs {
          margin: 25px 15%;
          margin-left: 20%;
          height: 280px;
          width: 70%;
          li {
            margin: 5px 2%; 
            padding: 0;
            width: 45%;
            float: left;
            h4 {
              i {
                position: relative;
                top: -5px;
                img {
                  width: 35px;
                  height: 35px;
                }
              }
              margin: 0;
              text-align: left;
              .fontStyle(@bgBright;22px;700);
              line-height: 24px;
            }
            p {
              margin-left: 34px;
              position: relative;
              top: -5px;
              .fontStyle(@grey7;16px;300) !important;
            }
          }
        }
      }
      #HIW {
        h3 {
          font-size: 40px;
          color: @blueGreen;
        }
        p.hiw {
          text-align: center;
          .fontStyle(@grey7;26px;500);
          margin: 0 10% !important;
          margin-top: 20px !important;
          height: 74px;
          width: 80%;
        }
        ul.hiw {
          margin: 30px 10%;
          height: 270px;
          width: 80%;
          li {
            margin: 20px 39px; 
            padding: 0;
            width: 150px;
            float: left;
            position: relative;
          }
          li.active:before, li:hover:before {
            content: '';
            display: block;
            position: absolute;
            height: 4px;
            width: 120px;
            left: 15px;
            bottom: -10px;
            background: @bgBright;
          }
          img {
            cursor: pointer;
          }
        }
      }
      #SVtransition {
        width: 100%;
        height: 250px;
        background: @bgDark;
        position: relative;
        .container {
          padding: 20px 0;
          position: relative;
          h4 {
            padding: 0 130px;
            .fontStyle(@bgDarker;24px;400);
            line-height: 46px;
            letter-spacing: 0.065em;
          }
          #SVtri {
            width: 100%;
            height: 60px;
            position: absolute;
            bottom: -44px;
            i {
              display: block;
              width: 100%;
              text-align: center;
              .fontStyle(@bgDark;60px;400);
            }
          }
        }
      }
      #VoS {
        margin-top: 50px;
        h3 {
          padding: 0 180px;
          font-size: 40px;
          line-height: 50px;
        }
        p.subPrompt {
          margin-top: 25px;
          padding: 0 200px;
          text-align: center;
          .fontStyle(@grey7;20px;300) !important;
        }
        ul#VoSList {
          width: 90%;
          margin: 0 5%;
          li {
            margin: 50px 0; 
            padding: 0;
            width: 100%;
            float: left;
            .prompt {
              width: 40%;
              h4 {
                i {
                  position: relative;
                  top: -10px;
                  img {
                    width: 50px;
                    height: 50px;
                  }
                }
                margin: 0;
                text-align: left;
                .fontStyle(@bgBright;24px;700);
                line-height: 24px;
              }
              p {
                position: relative;
                .fontStyle(@grey7;20px;300) !important;
              }
            }
            .image {
              width: 55%;
              img {
                margin: 0 31px;
              }
            }
          }
          li#recommend, li#review, li#survey {
            .prompt {
              margin-top: 115px;
            }
          }
          li#rate {
            .prompt {
              margin-top: 45px;
            }
          }
          .divider {
            position: relative;
          }
          #secondDivider {
            top: 430px;
          }
          #thirdDivider {
            top: 850px;
          }
          #fourthDivider {
            top: 1270px;
          }
          #fifthDivider {
            top: 1700px;
          }
        }
      }
      #endPrompt {
        margin-top: 40px;
        background: @darkGrey;
        height: 430px;
        width: 100%;
        h3 {
          margin-top: 35px;
          .fontStyle(@white;34px;700);
        }

        h3 {
          margin-top: 35px;
          text-decoration: none;
        }
        a#getStarted {
          margin: 60px auto;
        }
        ul.footer {
          width: 20%;
          margin: 10px 40%; 
          margin-bottom: 0;
          height: 50px;
          padding-top: 15px;
          li {
            float: left;
            width: 33%;
            text-align: center;
            border-left: 1px solid rgba(255,255,255,0.6);
            a {
              font-size: 13px;
              color: rgba(255,255,255,0.6);
            }
            a:hover {
              text-decoration: none;
              color: rgba(255,255,255,0.4);
            }
          }
          li:first-child {
            border: none;
          }
        }
        p.copyright {
          width: 30%;
          margin: 5px 35%;
          font-size: 11px;
          color: rgba(255,255,255,0.6);
          text-align: center;
        }
        p.subPrompt {
          margin-top: 35px;
          padding: 0 280px;
          text-align: center;
          .fontStyle(@brightGreen2;20px;300) !important;
        }
      }
      #aboutTop {
        padding: 25px 0;
        margin-top: 50px;
        width: 100%;
        background: @blueGreen;
        h1 {
          width: 60%;
          margin: 40px 20%;
          line-height: 50px;
          font-family: @font5;
          text-align: center;
          .fontStyle(@white;34px;400);
        }
      }
      #aboutContainer {
        margin-top: 21px;
        .leftContainer {
          margin-left: 15px;
          float: left;
          width: 72%;
          h2 {
            margin-top: 0;
            text-align: left;
            .fontStyle(@grey7;26px;600);
          }
          p {
            font-size: 16px !important;
            line-height: 26px;
            margin-bottom: 30px;
          }
          p:last-child {
            margin-bottom: 24px;
          }
        }
        .rightContainer {
          border-left: 1px solid @grey3;
          float: right;
          width: 26%;
          padding-left: 20px;
          height: 380px;
          margin-top: 46px;
          padding-top: 4px;
          img#seal {
            width: 170px;
          }
          a#getStarted {
            margin-top: 35px;
            padding: 10px 10px;
            font-size: 18px;
            margin-left: 15px;
            width: 140px;
            .insetShadow(0;-3px;0;0;rgba(0,0,0,0.3));
            i {
              top: 5px;
            }
          }
        }
      }
    }
  }
}

html.landingPage, body.landingPage {
  position: relative;
  height: 100%;
  width: 100%;
  overflow: auto;
}
/*New Landing Page*/
body.landingPage {
  height: 100%;
  header.landingPage {
    height: 60px;
    background: rgba(255,255,255,0.85);
    nav.container {
      a#logo {
        width: 280px;
        margin-top: 3px;
        img {
          height: 100%;
          width: 100%;
        }
      }
      ul.navItems {
        float: right;
        margin-top: 12px;
        li {
          float: left;
          margin: 0 11px;
          p {
            font-family: @font6;
            margin-top: 10px;
            color: @grey6;
          }
          a {
            font-family: @font6;
            .colorFade;
            top: 8px;
            position: relative;
            color: @white;
          }
          a.login:hover {
            color: rgba(255,255,255,0.7);
            text-decoration: none;
          }
          a.btn.getStarted {
            top: 0;
            .bgColorFast;
            padding: 8px 14px;
            border: 2px solid @buttonGreen;
          }
          a.btn.getStarted.notScrolled {
            .noBoxShadow;
            color: @buttonGreen;
          }
          a.btn.getStarted.scrolled {
            background: @buttonGreen;
            color: @white;
            border-color: @white;
          }
          a.btn.getStarted.notScrolled:hover {
            background: @buttonGreen;
            color: @white;
          }
          a.btn.getStarted.scrolled:hover {
            .textShadow(1px;1px;0;rgba(0,0,0,0.4));
            background: lighten(@buttonGreen,10%);
          }
        }
      }
    }
    #mobileMenu {
      display: none;
    }
  }
  #mainWrapper {
    #mainContent {
      #mainPromptContainer {
        background-image: url('@{base}images/newBG.png');
        border-bottom: 1px solid rgba(0,0,0,0.2);
        z-index: 2;
        position: relative;
        .mainHolder {
          padding-top: 35px;
          padding-bottom: 85px;
          background: rgba(65,146,182,0.8);
        }
        .container {
          #validationWrapper {
            .promptWrapper {
              h2, h3, h4 {
                text-align: center;
                color: @white;
                .textShadow(1px;1px;0;rgba(0,0,0,0.6));
              }
              h3 {
                padding: 0 170px;
                margin-top: 90px;
                line-height: 50px;
                font-family: @font6;
                font-size: 42px;
                font-weight: 700;
              }
              h2 {
                font-family: @font1;
                font-size: 46px;
                font-weight: 700;
              }
              h4 {
                margin-top: 20px;
                font-family: @font6;
                font-size: 16px;
                font-weight: 300;
                padding: 0 420px;
                line-height: 28px;
              }
              div.btnContainer {
                width: 280px;
                margin: 30px auto;
                a#getStarted {
                  font-family: @font6;
                  width: 100%;
                  background: @buttonGreen;
                  color: @white;
                  text-transform: uppercase;
                  font-size: 16px;
                  padding: 24px 0;
                  .slideFast;
                  i {
                    margin-left: 8px;
                  }
                }
                a#getStarted:hover {
                  .textShadow(1px;1px;0;rgba(0,0,0,0.4));
                  background: lighten(@buttonGreen,10%);
                }
              }
            }
          }
        }
      }
      #threeBlocks {
        .insetDrop(0;2px;3px;rgba(0,0,0,0.1);0;2px;3px;rgba(0,0,0,0.1));
        height: 620px;
        background: #f9f9f6;
        position: relative;
        z-index: 2;
        .container {
          ul.hiw {
            height: 220px;
            margin-top: 40px;
            position:realtive;
            li {
              float: left;
              width: 150px;
              height: 220px;
              position: relative;
              a {
                img {
                  width: 100%;
                }
                img.min {
                  display: block;
                }
                img.sel {
                  display: none;
                }
                h3 {
                  font-family: @font1;
                  text-align: center;
                  font-size: 22px;
                  font-weight: 400;
                  color: @grey7;
                }
              }
              i {
                position: absolute;
                top: 65px;
                right: -90px;
                font-size: 30px;
                color: @bgBright;
              }
              a:hover, a.active {
                text-decoration: none;
                img.min {
                  display: none;
                }
                img.sel {
                  display: block;
                }
              }
            }
            li:first-child {
              margin: 0;
              left: 160px;
            }
            li:nth-child(2) {
              margin-left: 50%;
              left: -220px;
            }
            li:last-child {
              position: absolute;
              right: 305px;

            }
          }
          .block {
            display: none;
            width: 80%;
            height: 301px;
            margin: 5px 10%;
            border: 2px solid @grey3;
            background: @white;
            position: relative;
            div.left {
              padding: 25px;
              width: 50%;
              float: left;
              h4 {
                margin: 20px 0;
                font-size: 26px;
                font-weight: 400;
                font-family: @font6;
                color: @grey6;
              }
              p {
                margin-top: 40px;
                font-family: @font6;
                font-size: 20px;
                font-weight: 300;
                color: @grey6;

              }
            }
            div.right {
              float: right;
              position: relative;
              width: 50%;
              img {
                position: absolute;
                right: 0;
                bottom: -297px;
                width: 458px;
                border: solid @grey3;
                border-width: 2px 0 0 2px;
              }
            }
          }
          #listen.block {
            display: block;
          }
          .block:before {
            z-index: 951;
            border-left: 20px solid transparent;
            border-bottom: 20px solid @grey3;
            border-right: 20px solid transparent;
            content: '';
            display: block;
            position: absolute;
            top: -20px;
            left: 138px;
          }
          .block:after {
            z-index: 952;
            border-left: 17px solid transparent;
            border-bottom: 17px solid @white;
            border-right: 17px solid transparent;
            content: '';
            display: block;
            position: absolute;
            top: -17px;
            left: 141px;
          }
          #monitor.block:before {
            left: 439px;
          }
          #monitor.block:after {
            left: 442px;
          }
          #improve.block:before {
            left: 725px;
          }
          #improve.block:after {
            left: 728px;
          }
        }
      }
      #feed {
        height: 500px;
        overflow: hidden;
        background: @white;
        .container {
          width: 940px;
          height: 500px;
          padding: 0;
          overflow: hidden;
          #browserWindow {
            z-index: 1;
            position: relative;
            top: 68px;
            display: inline-block;
            width: 940px;
            background-image: url('@{base}images/feedBrowser.png');
            h2 {
              position: relative;
              top: -50px;
              font-family: @font6;
              text-align: center;
              font-size: 36px;
              color: @blueGreen;
              color: @blueGreen;
            }
            p {
              margin: 0;
              position: relative;
              top: -55px;
              font-family: @font6;
              text-align: center;
              font-size: 16px;
              color: @blueGreen;
            }
            img {
              width: 800px;
              position: relative;
              top: 28px;
              margin-left: 70px;
            }
          }
        }
      }
      #subscriberData {
        .insetShadow(0;2px;3px;rgba(0,0,0,0.1));
        height: 510px;
        background: #f9f9f6;
        .container {
          height: 500px;
          h2 {
            padding: 0 180px;
            line-height: 55px;
            margin-top: 35px;
            font-family: @font6;
            text-align: center;
            font-size: 36px;
            color: @blueGreen;
          }
          ul.data {
            margin-top: 0;
            height: 300px;
            li {
              float: left;
              width: 200px;
              height: 300px;
              position: relative;
              i {
                position: absolute;
                top: 85px;
                right: -45px;
                font-size: 30px;
                color: @blueGreen;
              }
              h3 {
                font-family: @font1;
                text-align: center;
                font-size: 22px;
                font-weight: 400;
                color: @grey7;
              }
              a.btn {
                width: 80%;
                margin: 20px 10%;
                color: @white;
                background: @blueGreen;
                border: 4px solid @blueGreen;
                font-family: @font6;
                font-size: 16px;
                .noBoxShadow;
                .radius(24px);
                .slideFast;
              }
              a.btn:hover {
                background: lighten(@blueGreen,18%);
                .textShadow(1px;1px;0px;rgba(0,0,0,0.2));
              }
            }
            li:first-child {
              margin: 0;
              left: 140px;
            }
            li:nth-child(2) {
              margin-left: 50%;
              left: -300px;
            }
            li:last-child {
              float: right;
              top: -300px;
              right: 140px;
            }
          }

        }
      }
      div#getStarted {
        padding-top: 50px;
        height: 420px;
        background: @blueGreen;
        .container {
          position: relative;
          padding: 0;
          h2 {
            width: 100%;
            top: -20px;
            position: absolute;
            font-family: @font6;
            font-size: 36px;
            color: @white;
            text-align: center;
          }
          div.btnContainer {
            width: 240px;
            margin: 0 auto;
            margin-top: 70px;
            a#getStarted {
              font-family: @font6;
              width: 100%;
              background: @buttonGreen;
              color: @white;
              text-transform: uppercase;
              font-size: 18px;
              padding: 18px 0;
              .slideFast;
              i {
                margin-left: 8px;
              }
            }
            a#getStarted:hover {
              .textShadow(1px;1px;0;rgba(0,0,0,0.4));
              background: lighten(@buttonGreen,10%);
            }
          }
        }
      }
    }
    #mainContent.vos {
      #mainPromptContainer {
        background: @grey2;
        padding-bottom: 50px;
        padding-top: 25px; 
        border-bottom: 1px solid rgba(0,0,0,0.2);
        z-index: 2;
        position: relative;
        height: 410px;
        .container {
          #validationWrapper {
            .promptWrapper {
              div.left {
                float: left; 
                width: 40%;
                img {
                  width: 90%;
                  margin: 0 5%;
                }
              }
              div.right {
                float: right;
                width: 60%;
                padding-top: 10px;
                padding-left: 50px;
                h2, h4 {
                  text-align: left;
                  color: @grey7;
                  .noTextShadow;
                }
                h2 {
                  margin-top: 80px;
                  font-family: @font1;
                  font-size: 34px;
                  line-height: 45px;
                  font-weight: 400;
                  padding-right: 240px;
                  b {
                    font-size: 40px;

                  }
                }
                h4 {
                  margin-top: 15px;
                  font-family: @font6;
                  font-size: 22px;
                  font-weight: 300;
                  line-height: 30px;
                  padding: 0;
                  padding-right: 160px;
                }
              }
            }
          }
        }
      }
      #VoS {
        background: @white;
        div.VoSHolder {
          .insetShadow(0;2px;3px;rgba(0,0,0,0.1));
          height: 115px;
          padding-top: 5px;
          background: @blueGreen;
          ul#VoSIcons {
            height: 110px;
            width: 90%;
            margin: 0 5%;
            li {
              float: left;
              width: 10%;
              margin: 0 5%;
              a {
                display: block;
                height: 100%;
                width: 100%;
                position: relative;
                i {

                  img {
                    width: 80%;
                    margin: 10%;
                  }
                }
              }
              a.active:before {
                z-index: 952;
                border-left: 25px solid transparent;
                border-bottom: 25px solid @white;
                border-right: 25px solid transparent;
                content: '';
                display: block;
                position: absolute;
                bottom: -14px;
                left: 27px;
              }
            }
          }
        }
        #listHolder.container {
          height: 375px;
          ul#VoSList {
            top: -50px;
            position: relative;
            width: 100%;
            div.carouselNav {
              .slide;
              opacity: 0;
              visibility: hidden;
              width: 100%;
              height: 40px;
              position: absolute;
              left: 0;
              top: 135px;
              a {
                position: absolute;
                i {
                  .slideFast;
                  font-size: 45px;
                  color: @bgBright;
                }
              }
              a.left {
                left: 0;
              }
              a.right {
                right: 0;
              }
              a:hover {
                i {
                  color: @blueGreen;
                }
              }
            }
            div.carouselNav.active {
              opacity: 1;
              visibility: visible;
            }
            li {
              display: none;
              margin: 100px 0; 
              padding: 0;
              width: 90%;
              height: 301px;
              margin: 75px 5%;
              background: @white;
              div.left {
                position: relative;
                width: 50%;
                float: left;
                img.image {
                  height: 261px;
                  position: absolute;
                  left: 0;
                  bottom: -297px;
                  width: 458px;
                }
              }
              div.prompt.left {
                padding-left: 10px;
              }
              div.right {
                float: right;
                position: relative;
                width: 50%;
                img.image {
                  height: 261px;
                  position: absolute;
                  right: 0;
                  bottom: -297px;
                  width: 458px;
                }
              }
              .prompt {
                width: 40%;
                h4 {
                  i {
                    position: relative;
                    top: -10px;
                    img {
                      width: 50px;
                      height: 50px;
                    }
                  }
                  font-family: @font6;
                  margin: 0;
                  text-align: left;
                  .fontStyle(@bgBright;24px;700);
                  line-height: 26px;
                }
                p {
                  padding-left: 15px;
                  font-family: @font6;
                  position: relative;
                  .fontStyle(@grey7;18px;300) !important;
                }
              }
            }
            li#recommend, li#review, li#survey {
              .prompt {
                margin-top: 65px;
              }
            }
            li#comments {
              .prompt {
                margin-top: 85px;
              }
            }
            li#rate {
              display: block;
              .prompt {
                margin-top: 45px;
              }
            }
          }
        }
      }
      div.ready{
        .insetShadow(0;2px;3px;rgba(0,0,0,0.1));
        background: @grey2;
        height: 1200px;
        h3 {
          margin-top: 50px;
          text-align: center;
          color: @grey7;
          font-family: @font6;
          font-size: 42px;
          line-height: 55px;
          font-weight: 400;
        }
        ul.howTo {
          width: 90%;
          margin: 0 5%;
          padding: 10px 10%;
          border: 2px solid @grey3;
          background: @white;
          margin-top: 30px;
          li {
            margin: 30px 0;
            height: 290px;
            padding-top: 15px;
            width: 100%;
            border-bottom: 2px dashed @grey3;
            h4 {
              margin-top: 25px;
              text-align: left;
              color: @grey7;
              font-family: @font6;
              font-weight: 300;
              font-size: 26px;
              span {
                position: relative;
                top: -5px;
                display: block;
                float: left;
                height: 35px;
                width: 35px;
                background: @blueGreen;
                .radius(100px);
                color: @white;
                margin-right: 8px;
                text-align: center;
                padding-top: 3px;
              }
            }
            p {
              font-family: @font6;
              color: @grey7;
              font-size: 18px;
              padding-left: 45px;
            }
            div.left {
              float: left;
              width: 50%;
            }
            div.right {
              float: right;
              width: 50%;
              h4 {
                padding-left: 15px;
              }
              p {
                padding-left: 60px;
              }
            }
            img {
              width: 100%;
              border: 2px solid @grey3;
            }
          }
        }
      }
    }
    #mainContent.IW {
      #mainPromptContainer {
        background: @grey2;
        padding-bottom: 50px;
        padding-top: 25px; 
        border-bottom: 1px solid rgba(0,0,0,0.2);
        z-index: 2;
        position: relative;
        height: 410px;
        .container {
          #validationWrapper {
            .promptWrapper {
              .left {
                float: left;
                width: 50%;
                padding-top: 10px;
                padding-left: 90px;
                h2, h4 {
                  text-align: left;
                  color: @grey7;
                  .noTextShadow;
                }
                h2 {
                  margin-top: 80px;
                  font-family: @font1;
                  font-size: 34px;
                  line-height: 45px;
                  font-weight: 400;
                  b {
                    font-size: 40px;

                  }
                }
                h4 {
                  margin-top: 15px;
                  font-family: @font6;
                  font-size: 22px;
                  font-weight: 300;
                  line-height: 30px;
                  padding: 0;
                }
              }
              .right {
                float: right; 
                width: 50%;
                img {
                  margin: 5px 10%;
                  width: 70%;
                }
                
              }
            }
          }
        }
      }
      #trust {
        div.trustHolder {
          .insetShadow(0;2px;3px;rgba(0,0,0,0.1));
          height: 135px;
          padding-top: 5px;
          background: @blueGreen;
          position: relative;
          h4 {
            margin-top: 15px;
            font-family: @font6;
            font-size: 30px;
            line-height: 45px;
            font-weight: 400;
            color: @white;
            text-align: center;
            padding: 0 250px;
          }
        }
        div.trustHolder:before {
          z-index: 952;
          border-left: 26px solid transparent;
          border-top: 26px solid @blueGreen;
          border-right: 26px solid transparent;
          content: '';
          display: block;
          position: absolute;
          bottom: -26px;
          left: -14px;
          margin-left: 50%;
        }
      }
      #cert {
        .insetShadow(0;2px;3px;rgba(0,0,0,0.2));
        height: 500px;
        background: @white;
        div.left {
          float: left; 
          width: 50%;
          img {
            width: 400px;
            margin: 0 15%;
            margin-top: 50px;
          }
        }
        div.right {
          float: right;
          width: 50%;
          padding-top: 10px;
          padding-left: 10px;
          h2, p {
            text-align: left;
            color: @grey7;
            .noTextShadow;
          }
          h2 {
            margin-top: 70px;
            font-family: @font1;
            font-size: 34px;
            line-height: 45px;
            font-weight: 400;
          }
          p {
            margin-top: 15px;
            font-family: @font6;
            font-size: 15px;
            font-weight: 300;
            line-height: 25px;
            padding: 0;
            padding-right: 30px;
          }
        }
      }
      #IWHIW {
        .insetShadow(0;2px;3px;rgba(0,0,0,0.1));
        background: @blueGreen;
        div.container {
          #HIW {
            position: relative;
            div.carouselNav {
              .slide;
              opacity: 0;
              visibility: hidden;
              width: 80%;
              margin: 0 10%;
              height: 40px;
              position: absolute;
              left: 0;
              top: 135px;
              a {
                position: absolute;
                i {
                  .slideFast;
                  font-size: 45px;
                  color: @white;
                }
              }
              a.left {
                left: 0;
              }
              a.right {
                right: 0;
              }
              a:hover {
                i {
                  .textShadow(1px;1px;2px;rgba(0,0,0,0.4));
                }
              }
            }
            div.carouselNav.active {
              opacity: 1;
              visibility: visible;
            }
            h3 {
              text-align: center;
              font-family: @font6;
              font-size: 40px;
              color: @white;
            }
            p.hiw {
              font-family: @font6;
              text-align: center;
              .fontStyle(@grey2;26px;500);
              margin: 0 15% !important;
              margin-top: 20px !important;
              height: 74px;
              width: 70%;
            }
            ul.hiw {
              margin: 25px 15%;
              height: 160px;
              width: 70%;
              li {
                margin: 20px 0; 
                padding: 0;
                width: 19%;
                margin: 0 3%;
                float: left;
                position: relative;
                img {
                  width: 90%;
                  margin: 0 5%;
                  cursor: pointer;
                }
              }
              li.active:before, li:hover:before {
                content: '';
                display: block;
                position: absolute;
                height: 6px;
                width: 60%;
                left: 20%;
                bottom: -15px;
                background: @white;
              }
            }
          }
        }
      }
      #REQS {
        .insetShadow(0;2px;3px;rgba(0,0,0,0.1));
        background: @grey2;
        div.container {
          h3 {
            margin-top: 30px;
            text-align: center;
            font-family: @font6;
            font-size: 40px;
            color: @grey7;
            padding: 0 200px;
          }
          ul.reqs {
            margin: 0 10%;
            margin-top: 40px;
            width: 80%;
            height: 460px;
            li {
              float: left;
              width: 50%;
              height: 230px;
              background: none;
              padding: 0;
              div.imgHolder {
                padding: 0;
                width: 100px;
                height: 100px;
                background: @white;
                .radius(300px);
                border: 4px solid @blueGreen;
                img {
                  width: 70%;
                  margin: 15%;
                }
              }
              h4 {
                text-transform: uppercase;
                font-family: @font6;
                color: @grey7;
                text-align: center;
                font-size: 24px;
              }
              p {
                font-family: @font6;
                color: @grey7;
                text-align: center;
                font-size: 15px;
                margin: 0;
                padding: 0 120px;
              }
            }
          }
        }
      }
    }
    #mainContent.datasheet {
      #mainPromptContainer {
        padding-bottom: 0;
        div.container {
          h3 {
            margin: 0 200px;
            margin-top: 50px;
            padding-top: 35px;
            height: 150px;
            text-align: center;
            font-size: 28px;
            line-height: 36px;
            color: @white;
            background: rgba(0,0,0,0.3);
          }
          h3.download {
            padding-top: 60px;
            font-size: 38px;
          }
        }
      }
      #mainContainer {
        .insetShadow(0;2px;3px;rgba(0,0,0,0.1));
        background: @white;
        height: 800px;
        padding-top: 40px;
        div.container {
          div.left {
            float: left;
            width: 70%;
            h4 {
              font-family: @font6;
              font-weight: 400;
              font-size: 26px;
              color: @grey7;
            }
            p {
              font-family: @font5;
              margin: 3px 0;
              font-size: 18px;
              color: @grey6;
            }
          }
          div.right {
            float: right;
            width: 30%;
            h3 {
              width: 80%;
              margin: 0 10%;
              font-family: @font6;
              color: @grey7;
              font-size: 20px;
            }
            div.downloadForm {
              height: 500px;
              width: 95%;
              margin-left: 5%;
              form {
                float: left;
                position: relative;
                width: 90%;
                margin: 0 5%;
                .control-label {
                  text-align: left;
                }
                label {
                  font-family: @font5;
                  color: @grey6;
                  margin-top: 8px;
                }
                input[type="text"],input[type="password"],input[type="email"], select {
                  font-family: @font5;
                  height: 40px;
                  width: 100%;
                  font-size: 14px;
                  .insetShadow(0;0;3px;rgba(0,0,0,0.3));
                  font-weight: 400;
                  background: @white;
                }
                textarea {
                  width: 100%;
                  height: 100px;
                  font-size: 14px;
                  .insetShadow(0;0;3px;rgba(0,0,0,0.3));
                  font-weight: 400;
                }
                .buttonHolder {
                  width: 50%;
                  margin: 0 25%;
                  margin-top: 30px;
                  a.btn.important {
                    background: @buttonGreen;
                    font-family: @font5;
                    padding: 15px 30px;
                    width: 100%;
                    font-size: 16px;
                    font-weight: 600;
                    .textShadow(1px;1px;0px;rgba(0,0,0,0.2));
                    .insetDrop(0;-3px;0;0;rgba(0,0,0,0.3);0;2px;3px;-1px;rgba(0,0,0,0.2));
                  }
                }
              }
            }
          }
          div.downloadPrompt {
            width: 80%;
            margin: 0 10%;
            p {
              font-family: @font5;
              margin: 3px 0;
              font-size: 18px;
              color: @grey6;
            }
            a.btn.important {
              background: @buttonGreen;
              font-family: @font5;
              padding: 15px 30px;
              margin: 20px 8px;
              font-size: 16px;
              font-weight: 600;
              .textShadow(1px;1px;0px;rgba(0,0,0,0.2));
              .insetDrop(0;-3px;0;0;rgba(0,0,0,0.3);0;2px;3px;-1px;rgba(0,0,0,0.2));
            }
          }
          ul.resource {
            height: 200px;
            width: 70%;
            margin: 25px 15%;
            li {
              font-family: @font5;
              margin: 0 6%;
              height: 225px;
              width: 36%;
              padding: 10px;
              border: 1px solid @grey3;
              background: @grey2;
              float: left;
              .radius;
              position: relative;
              p.type {
                float: left;
                width: 60%;
                font-size: 14px;
                text-transform: uppercase;
              }
              p.symbol {
                margin: 0;
                float: right;
              }
              h4 {
                margin-top: 30px;
              }
              a.next {
                position: absolute;
                bottom: 0;
                left: 0;
                padding: 4px 0;
                .bottomRadius;
                background: @buttonGreen;
                color: @white;
                text-align: center;
                width: 100%;
                display: block;

              }
            }
          }
        }
      }
    }
    #mainContent.contact {
      background: @grey2;
      height: 980px;
      div.contactForm {
        height: 800px;
        padding: 0 200px;
        margin-top: 60px;
        h2 {
          text-align: center;
          font-family: @font6;
          font-weight: 300;
          font-size: 34px;
          a {
            font-weight: 300;
          }
          a:hover {
            text-decoration: none;
          }
        }
        form {
          margin: 0 15%;
          width: 70%;
          margin-top: 5px;
          margin-bottom: 30px;
          .control-label {
            text-align: left;
          }
          label {
            font-family: @font5;
            color: @grey6;
            margin-top: 8px;
          }
          input[type="text"],input[type="password"],input[type="email"], select {
            font-family: @font5;
            height: 40px;
            width: 100%;
            font-size: 14px;
            .insetShadow(0;0;3px;rgba(0,0,0,0.3));
            font-weight: 400;
            background: @white;
          }
          textarea {
            width: 100%;
            height: 100px;
            font-size: 14px;
            .insetShadow(0;0;3px;rgba(0,0,0,0.3));
            font-weight: 400;
          }
          .buttonHolder {
            width: 50%;
            margin: 0 25%;
            margin-top: 30px;
            input.btn.important {
              background: @buttonGreen;
              font-family: @font5;
              padding: 15px 30px;
              width: 100%;
              font-size: 16px;
              font-weight: 600;
              .textShadow(1px;1px;0px;rgba(0,0,0,0.2));
              .insetDrop(0;-3px;0;0;rgba(0,0,0,0.3);0;2px;3px;-1px;rgba(0,0,0,0.2));
            }
          }
        }
      }
    }
  }
  div#videoHolder {
    height: 100%;
    position: relative;
    overflow: hidden;
    #backVideo, img {
      min-width: 100%;
      min-height: 100%;
      position: fixed;
      top: 0;
      left: 0;
    }
    #backVideoOverlay {
      min-width: 100%;
      min-height: 100%;
      position: fixed;
      top: 0;
      left: 0;
      background: @blueGreen0;
    }
  }
  div#landingPageAlpha {
    width: 100%;
    min-height: 100%;
    position: absolute;
    top: 0;
    div.logoStatic {
      position: relative;
      padding-top: 20px;
      max-width: 1000px;
      z-index: 1001;
      width: 30%;
      margin: 0 35%;
      a {
        display: block;
        width: 100%;
        margin-bottom: 15px;
      }
      img {
        width: 100%;
      }
      p {
        margin-top: 15px;
        font-family: @font6;
        color: rgba(255,255,255,0.75);
        font-weight: 300;
        text-align: center;
        font-size: 26px;
        span {
          color: rgba(255,255,255,0.85);
          font-weight: 400;
          font-family: @font1;
        }
      }
      p.prompt.small {
        margin-top: 2px;
        font-size: 20px;
      }
      div.horizontalDiv {
        display: none;
        width: 62%;
        height: 0;
        margin: 0 19%;
        border-top: 3px solid rgba(255,255,255,0.25);
      }
      div.horizontalDiv.active {
        display: block;
      }
    }
    div.alphaScreen {
      position: relative;
      width: 100%;
      max-width: none;
      opacity: 0;
      right: -200%;
      padding-top: 30px;
      display: none;
      img {
        width: 40%;
        margin: 0px 30%;
      }
      h2 {
        padding: 0 10%;
        margin-top: 30px;
        font-family: @font6;
        color: rgba(255,255,255,0.75);
        font-size: 50px;
        text-align: center;
        font-weight: 300;
        b {
          color: rgba(255,255,255,0.85);
          font-weight: 600;
          font-family: @font5;
        }
      }
      h2.question {
        margin-top: 36px;
        margin-bottom: 8px;
        font-size: 60px;
        line-height: 90px;
        color: @white;
        b {
          color: @white;
        }
      }
      h2.statement {
        text-transform: uppercase;
        padding: 0 10%;
        font-size: 50px;
        line-height: 90px;
        margin-top: 18px;
        margin-bottom: 12px;
        b {
          color: @white;
          font-weight: 600;
          font-family: @font5;
        }
      }
      h2.reservation {
        line-height: 72px;
        span {
          display: block;
          width: 100%;
          text-align: center;
          font-weight: 400;
          font-family: @font1;
          color: @white;
        }
      }
      p {
        margin-top: 8px;
        font-family: @font6;
        color: rgba(255,255,255,0.75);
        font-weight: 300;
        text-align: center;
        font-size: 27px;
        span {
          color: @white;
          font-weight: 400;
          font-family: @font1;
          border-bottom: 2px solid @white;
        }
      }
      p.prompt.enter {
        span {
          border: none;
        }
      }
      p.prompt.no {
        display: none;
      }
      p.prompt.no.active {
        display: block;
        margin: 0;
        font-size: 22px;
      }
      p.prompt.no.sorry {
        margin-top: 8px;
        a {
          font-size: 0.8em;
          color: @grey3;
        }
        a:hover {
          color: @grey4;
        }
      }
      div.buttonContainer {
        height: 200px;
      }
      div.buttonWrapper {
        float: left;
        margin: 50px 0;
        width: 27.5%;
        height: 170px;
        .radius(5px);
        background: rgba(0,0,0,0.3);
      }
      div.buttonWrapper.yes {
        margin-left: 20%;
        margin-right: 2.5%;
      }
      div.buttonWrapper.no {
        margin-left: 2.5%;
        margin-right: 20%;
      }
      button {
        .radius(5px);
        width: 90%;
        height: 81%;
        margin: 5%;
        border: none;
        color: @white;
        font-family: @font5;
        .insetDrop(0;1px;0;0;rgba(255,255,255,0.25);0;1px;1px;0;rgba(0,0,0,0.25));
        span {
          font-weight: 600;
          font-size: 22px;
        }
        span.big {
          width: 100%;
          font-size: 55px;
          line-height: 50px;
          font-family: @font1;
          text-transform: uppercase;
        }
        span.yes {
          width: 100%;
          position: relative;
          top: 3px;
        }
        span.no {
          width: 100%;
          position: relative;
          top: 3px;
        }
      }
      button:focus {
        outline: none;
      }
      button#yes {
        border: 1px solid darken(@brightBlueNew,12%);
        background: @brightBlueNew;
      }
      button#yes:hover {
        border: 1px solid lighten(@brightBlueNew,8%);
        background: lighten(@brightBlueNew,8%);
      }
      button#no {
        border: 1px solid darken(@grey5,4%);
        background: @greyButton;
      }
      button#no:hover {
        border: 1px solid lighten(@grey5,12%);
        background: lighten(@greyButton,8%);
      }
      form#reservationForm {
        width: 50%;
        margin: 30px 25%;
        margin-bottom: 0;
        div.inputWrapper {
          width: 100%;
          .radius;
          padding-top: 5px;
          padding-bottom: 10px;
          background: rgba(255,255,255,0.3);
          input[type="email"],input[type="text"] {
            text-align: center;
            margin: 5px 3%;
            width: 94%;
            font-family: @font6;
            padding: 12px 23px;
            height: 70px;
            border: none;
            font-size: 28px;
            color: @grey6;
            .radius();
            .insetShadow(0;2px;0;0;rgba(0,0,0,0.05));
          }
          button {
            margin: 0 3%;
            margin-top: 5px;
            font-family: @font6;
            width: 94%;
            .radius();
            height: 70px;
            padding: 7px 15px;
            font-size: 28px;
            text-transform: capitalize;
            background: @brightBlueNew;
            position: relative;
          }
          button:hover {
            background: lighten(@brightBlueNew,8%);
          }
          button.btn-disabled {
            background: darken(@brightBlueNew,12%);
            color: @grey3;
          }
        }
      }
      div.socialIcons {
        width: 100%;
        margin-top: 5px;
        padding-top: 20px;
        a, div.wrapper {
          float: left;
          display: block;
          width: 50px;
          height: 50px;
          .radius(64px);
          background: rgba(255,255,255,0.25);
        }
        a:first-child {
          margin-left: 425px;
          margin-right: 10px;
        }
        a:last-child {
          margin-left: 10px;
        }
        i {
          width: 100%;
          text-align: center;
          font-size: 24px;
          padding: 14px 0;
          color: @blueGrey1;
        }
        a:hover {
          background: rgba(0,0,0,0.5);
        }
      }
      div.socialIcons.share {
        border: none;
        max-width: 600px;
        a {
          margin: 0 2.65%;
          .radius(5px);
          height: 52px;
          color: @white;
          font-family: @font6;  
          font-size: 11px;
          text-align: left;
          width: 28%;
          background: @brightBlueNew;
          padding-bottom: 12px;
          div.wrapper {
            background: rgba(0,0,0,0.3);
            width: 30px;
            height: 30px;
            margin-right: 4px;
            i {
              padding: 6px 0;
              font-size: 20px;
            }
          }
          span {
            margin-top: 9px;
          }
          div.email {
            i {
              font-size: 17px;
              padding: 7px 0;
              padding-left: 1px;
            }
          }
        }
        a:hover {
          background: lighten(@brightBlueNew, 8%);
        }
      }
    }
    div.socialStatic {
      display: none;
      position: relative;
      max-width: 1000px;
      padding-bottom: 5px;
      div.horizontalDiv {
        width: 62%;
        height: 0;
        margin: 0 19%;
        margin-bottom: 10px;
        border-top: 3px solid rgba(255,255,255,0.25);
      }
      div.socialIcons {
        width: 100%;
        margin-top: 5px;
        padding-top: 20px;
        a, div.wrapper {
          float: left;
          display: block;
          width: 50px;
          height: 50px;
          .radius(64px);
          background: rgba(255,255,255,0.25);
        }
        a:first-child {
          margin-left: 425px;
          margin-right: 10px;
        }
        a:last-child {
          margin-left: 10px;
        }
        i {
          width: 100%;
          text-align: center;
          font-size: 24px;
          padding: 14px 0;
          color: @blueGrey1;
        }
        a:hover {
          background: rgba(0,0,0,0.5);
        }
      }
    }
    div.socialStatic.active {
      display: block;
    }
    div.alphaScreen.active {
      opacity: 1;
      right: 0;
      display: block;
    }
    div#alphaPage2.alphaScreen.active, div#alphaPage3.alphaScreen.active {
      background: rgba(0,0,0,0.3);
      height: 510px;
    }
    div#alphaPage2.alphaScreen.active {
      height: auto;
      padding-bottom: 50px;
    }
    div#alphaPage2 {
      .yes, .no {
        display: none;
      }
      .yes.active, .no.active {
        display: block;
      }
    }
    div#alphaPage3 {
      padding-top: 5%;
    }
  }
}
footer.main {
  width: 100%;
  height: 55px;
  background: @footer;
  padding-top: 10px;
  font-family: @font5;
  position: fixed;
  bottom: 0;
  p.copyright {
    margin-top: 6px;
    margin-bottom: 0;
    width: 30%;
    float: left;
    font-size: 12px !important;
    color: rgba(255,255,255,0.7);
  }
  ul {
    float: right;
    li {
      float: left;
      padding: 5px 20px;
      a {
        color: rgba(255,255,255,0.7);
      }
      a:hover {
        text-decoration: none;
        color: rgba(255,255,255,0.85);
      }
    }
  }
}
footer.main.big {
  width: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
  background: @bgBlue2;
  height: 200px;
  .container {
    height: 200px;
    position: relative;
    ul.main {
      float: left;
      li.cat {
        width: 180px;
        font-size: 20px;
        color: @white;
        float: left;
        ul.sub {
          margin-top: 5px;
          width: 100%;
          clear: left;
          li {
            padding: 2px 0;
            font-size: 14px;
            width: 100%;
          }
        }
      }
    }
    p.getInTouch {
      width: 138px;
      margin-top: 8px;
      float: right;
      position: relative;
      color: @white !important;
      font-size: 20px !important; 
    }
    p.telephone {
      width: 138px;
      margin-top: 2px;
      float: right;
      clear: right;
      position: relative;
      color: @white !important;
      font-size: 20px !important; 
    }
    ul.social {
      float: none;
      position: relative;
      top: 50px;
      right: -425px;
      li {
        padding: 0;
        height: 40px;
        width: 40px;
        border: 1px solid @white;
        .radius(100px);
        margin: 0 5px;
        a {
          display: block;
          padding: 6px 12px;
          height: 100%;
          width: 100%;
          font-size: 18px;
        }
      }
      li:first-child {
        a {
          padding: 6px 15px;
        }
      }
      li:last-child {
        a {
          padding: 6px 10px;
        }
      }
    }
    ul.small {
      float: left;
      position: absolute;
      top: 160px;
      left: 0px;
      li {
        a {
          font-size: 12px;
        }
      }
      li:first-child {
        a:hover {
          color: rgba(255, 255, 255, 0.7);
        }
      }
    }
  }
}

form#fbComment {
  position: relative;
  h3.complete {
    padding: 0 160px;
    margin-top: 30px;
    .fontStyle(@blueGreen;28px;400);
    margin-bottom: 10px;
  }
  div.commentSection {
    height: 210px;
    position: relative;
    textarea {
      padding: 10px 7px;
      width: 70%;
      min-height: 200px;
      .radius;
      color: darken(@grey5,10%);
      border: 1px solid darken(@grey4,10%);
      .insetShadow(0;0;3px;rgba(0,0,0,0.2));
      margin: 25px 15%;
    }
    span#commentCounter {
      text-align: right;
      position: absolute;
      right: 16%;
      bottom: 18px;
      .fontStyle(@grey5;10px;400);
    }
  }
  textarea:focus {
    outline: none !important;
    border: 1px solid @grey5;
    .insetShadow(0;0;3px;rgba(0,0,0,0.3));
  }
  p.email {
    margin-left: 102px;
    input[type="email"] {
      width: 400px;
      padding: 7px 10px;
      margin-left: 5px;
      color: darken(@grey5,10%);
      border: 1px solid darken(@grey4,10%);
      .insetShadow(0;0;3px;rgba(0,0,0,0.2));
    }
    input[type="email"]:focus {
      border: 1px solid @grey5;
      .insetShadow(0;0;3px;rgba(0,0,0,0.3));
    }
    input[type="email"].error {
      border: 1px solid @red1;

    }
  }
  button#submitComment {
    border: none;
    background: @blueGreen;
    .fontStyle(@white;20px;300);
    width: 24%;
    margin: 0 38%;
    padding: 12px 20px;
    text-align: center;
    .radius;
  }
    p.emailError {
      right: 50px;
    width: 50%;
    display: none;
    position: absolute;
    bottom: 125px;
    .fontStyle(@red1;12px;500);
    margin-bottom: 2px;
    line-height: 13px;
    }
    span.email {
    position: absolute;
    bottom: 120px;
    .fontStyle(darken(@grey5,10%);10px;500);
    }
    button#submitComment {
      margin-top: 25px;
    }
  button#submitComment:hover {
    background: lighten(@blueGreen,10%);
  }

  button#submitComment:focus {
    outline: none;
  }
  button#submitComment.disabled {
    background: lighten(@blueGreen,15%);
    color: @grey3;
    cursor: default;
  }
}


/*The Settings Page */
div.settingsPage {
  font-family: @font5;
  div.settingsHeader {
    padding-top: 15px;
    background: @grey2;
  	border-bottom: 2px solid @bgBlue;
    h2 {
      float: left;
      width: 300px;
      margin-top: 0;
      margin-bottom: 0;
      padding-left: 40px;
      .fontStyle(@grey7;28px;300);
    }
    a.back {
      position: relative;
      top: 33px;
      i {
        margin-right: 3px;
        font-size: 12px;
      }
    }
    ul.settingsList {
    	float: right;
      width: 880px;
      padding-left: 20px;
      height: 40px;
      li {
        float: left;
        padding: 8px 24px;
        position: relative;
        a {
          font-family: @font5;
          .fontStyle(@blueLight;16px;600);
        }
        a:hover {
          text-decoration: none;
          color: darken(@blueLight,10%);
        }
        a.active {
          color: darken(@blueGreen,15%);
          cursor: default;
        }
        a#inboxworthy.active {
          cursor: pointer;
        }
      }
      li.active:after {
        content: '';
        display: block;
        position: absolute;
        bottom: 0;
        margin-left: 50%;
        left: -8px;
        height: 0;
        width: 0;
        border-style: solid;
        border-width: 0 8px 8px 8px;
        border-color: transparent transparent @bgBlue transparent;
      }
    }
    ul.settingsList.settings {
      height: 5px;
    }
  }
  div.settingsBody {
    min-height: 550px;
    div.nameCard {
      float: left;
      margin-top: 25px;
      margin-left: 10%;
      width: 20%;
      .brandInfo {
        position: relative;
        top: 20px;
        height: 120px;
        width: 175px;
        .boxShadow(0;0;2px;@grey6);
        background: @white;
        margin-bottom: 30px;
        img.logo {
          margin: 10px 0;
          width: 175px;
          max-height: 100px;
          padding: 5px 7px;
          background: @white;
        }
      }
    }
    div.accountSettings {
      float: left;
      width: 70%;
      ul.subTabs {
        height: 50px;
        margin-left: 85px;
        li {
          float: left;
          margin: 0 5px;
          margin-top: 50px;
          .radius;
          border: 2px solid @bgBlue;
          a {
            padding: 4px 10px;
            display: block;
            height: 100%;
            width: 100%;
          }
          a:hover {
            text-decoration: none;
          }
          a:focus {
            text-decoration: none;
          }
        }
        li.active {
          background: @bgBlue;
          a {
            color: @white;
          }
        }
      }
    }
    div.settingsContent {
      padding: 10px 30px;
      input {
        .radius;
        border: 1px solid @grey5;
        .insetDrop(0;1px;1px;1px;rgba(0,0,0,0.05);0;1px;1px;0;rgba(0,0,0,0.05));
        padding: 10px 8px;
        font-size: 16px;
      }
      input:focus {
        outline: none;
        border: 1px solid @blueDark;
        .insetDrop(0;0;2px;0;lighten(@blueLight,10%);0;0;2px;0;lighten(@blueLight,5%));
      }
      input#id_logo {
        border: none;
        .noBoxShadow;
        margin-top: 40px;
        color: #ffffff;
      }
      form.form-horizontal {
        padding: 25px 0;
        width: 80%;
        margin: 0 8%;
        h3 {
          margin-top: 0px;
        }
        div.success {
          margin: 15px 0;
          width: 65%;
          padding: 10px;
          .radius;
          background: @buttonGreen;
          p {
            color: @white !important;
            margin-bottom: 0;
          }
        }
        div.error {
          margin: 15px 0;
          width: 65%;
          padding: 10px;
          .radius;
          background: @red1;
          p {
            color: @white !important;
            margin-bottom: 0;
          }

        }
        input {
          width: 65%;
        }
        select {
          width: 65%;
          height: 44px;
        }
        input.disabled {
          background: @grey2;
        }
        fieldset {
          margin-left: 25px;
        }
        div.control-group {
          position: relative;
          ol {
            position: absolute;
            margin-bottom: 0px;
            padding: 0;
            top: 1px;
            left: 63px;
            border-bottom: none;
            li {
              padding: 1px 15px;
              .radius;
              height: 18px;
              background: rgba(0,0,0,0.6);
              text-align: center;
              color: @white;
              font-size: 11px;
            }
            li:before {
              z-index: 951;
              border-left: 5px solid transparent;
              border-top: 5px solid transparent;
              border-bottom: 5px solid transparent;
              border-right: 5px solid rgba(0,0,0,0.6);
              content: '';
              display: block;
              position: absolute;
              top: 4px;
              left: -10px;
            }
          }
        }
        div.logo {
          label {
            width: 100%;
            display: block;
          }
            .logoWrapper {
              float: left;
              clear: left;
            position: relative;
            height: 120px;
            width: 175px;
            .boxShadow(0;0;2px;@grey6);
            background: @white;
            margin-bottom: 20px;
            img.logo {
              margin: 10px 0;
              width: 175px;
              max-height: 100px;
              padding: 5px 7px;
              background: @white;
            }
          }
          button.btn.uploadLogo {
            float: left;
            clear: none !important;
            padding: 10px 14px;
            margin-top: 40px;
            margin-left: 18px;
            font-size: 14px;
          }
        }
      }
      .control-group {
        margin: 20px 0;
        i.fa-check-circle {
          float: left;
          position: absolute;
          top: 9px;
          left: 600px;
          color: @buttonGreen;
          font-size: 20px;
        }
        i#pwCorrect {
          left: 108px;
        }
        i#confirmCorrect {
          left: 168px;
        }
      }
      button, a.btn {
        float: left;
        clear: left;
        padding: 14px 20px;
        background: @blueLight;
        .fontStyle(@white;16px;700);
        border: none;
        margin: 15px 0;
        .textShadow(0;1px;0;rgba(0,0,0,0.15));
        .insetShadow(0;-3px;0;0;rgba(0,0,0,0.3));
      }
      button:hover, a.btn {
        .textShadow(0;1px;0;rgba(0,0,0,0.3));
      }
    }
    #account.settingsContent {
      display: block;
    }
    #password.settingsContent {
      display: block;
    }
    #people.settingsContent {
      padding: 10px 0;
      width: 80%;
      margin: 0 10%;
      h4 {
        font-family: @font5;
        width: 100%;
        .fontStyle(@grey7;24px;400);
        margin-top: 50px;
      }
      .alpha {
        h4 {
          margin-top: 5px;
          font-size: 20px;
          line-height: 24px;
        }
      }
      tr.removed {
          opacity: 0.5;
      }
      form#addUser {
        padding-top: 30px;
        margin-left: 0;
        fieldset {
          margin-left: 0;
        }
      }
      form#updateUsers {
        button {
          float: none;
        }
        div.success {
          width: 730px;
        }
      }
      table {
        margin: 20px 0;
        width: 80%;
        padding: 0 10px;
        td {
          background: none !important;
          input.checkbox {
            margin-left: 15px;
          }
          i.fa-remove {
            margin-left: 24px;
            cursor: pointer;
            font-size: 18px;
            margin-top: 1px;  
          }
          i.fa-remove:hover {
            opacity: 0.8;
          }
          i.fa-remove.disabled {
            cursor: default;
            opacity: 0.5;
          }
        }
      }
      .btn.invites {
        margin-top: 0;
        margin-left: 345px;
      }
    }
    div.accountSettings.autoReply {
      width: 100%;
    }
    #autoReply.settingsContent {
      div.autoReplySwitches {
        float: left;
        width: 55%;
        table {
          .radius();
          width: 95%;
          border-collapse: separate;
            border-spacing: 0;
          thead {
            tr {  
              th {
                padding: 4px 10px;
                .gradientOffWhiteToGrey;
                border-top: 1px solid @grey3;
                border-bottom: 1px solid @grey5;
                color: @grey6;
              }
              th:first-child {
                border-left: 1px solid @grey3;
                .topLeftRadius(4px);
              }
              th:last-child {
                border-right: 1px solid @grey3;
                .topRightRadius(4px);
              }
            } 
          }
          tbody {
            tr {
              td {
                background: @grey2;
                padding: 10px;
                border-bottom: 1px solid darken(@grey4,5%);
                border-top: 1px solid @white;
              }
              &:hover {
                  cursor: pointer;
              }
            }
            tr.selected {
                td {
              background-color: #4192b6;
              color: white;
                }
            }
            tr:last-child td {
              border-bottom: 1px solid @grey3;
            }
          }
          tr {
            height: 30px;
            padding: 3px;
            td:first-child {
              border-left: 1px solid @grey3;
            }
            td:last-child {
              border-right: 1px solid @grey3;
            }
          }
          tr:last-child {
            td:first-child {
              .bottomLeftRadius();
            }
            td:last-child {
              .bottomRightRadius();
            }
          }
        }
      }
      div.autoReplyResponse {
        border-left: 2px solid @blueGreen;
        float: left;
        width: 45%;
        padding-left: 4px;
        form {
          label {
            width: 90%;
            margin: 4px 5%;
          }
          input[type="text"], textarea, select, button {
            width: 90%;
            margin: 0 5%;
          }
          button {
            margin-top: 15px;
          }
          textarea {
            resize: none;
          }
        }
      }
      div.buttonHolder {
        width: 10%;
        margin: 0 40%;
        button {
          margin-top: 40px;
          width: 100%;
          float: none;
        }
      }
    }
    #reports.settingsContent {
      border-top: 2px solid @grey4;
      padding: 10px 0;
      width: 80%;
      margin: 0 10%;
      h3 {
        float: left;
        width: 115px;
      }
      .dropdown {
        float: left;
        top: 18px;
        width: 140px;
        .btn {
          padding: 7px 20px;
          font-size: 14px;
        }
        .dropdown-menu {
          width: 100%;
        }
      }
      .dropdown.open {
        .btn {
          border: none !important;
        }
      }
      span.date {
        float: left;
        clear: left;
        font-size: 16px;
        margin-top: 15px;
      }
      ul.reportCategories {
        margin-top: 110px;
        width: 100%;
        li.category {
          clear: left;
          width: 100%;
          min-height: 120px;
          margin-bottom: 20px;
          h4 {
            min-width: 120px;
            float: left;
            font-size: 20px;
            font-family: @font5;
          }
          .categoryContent {
            width: 930px;
            float: right;
          }
        }
        li#satisfactionReport {
          .categoryContent {
            .col {
              width: 228px;
              margin-left: 12px;
              margin-right: 5px;
            }
          }
        }
        li#ratingsReport {
          height: 270px;
          div.rateit div.rateit-range {
            background: url('@{base}images/starsSmall.svg');
          }
          div.rateit div.rateit-selected {
            background: url('@{base}images/starsSmall.svg') left -24px;
          }
          div.rateit.overall {
            position: relative;
            top: -4px;
            float: left;
          }
          span.overallRating {
            margin-left: 5px;
            position: relative;
            top: -4px;
            .fontStyle(@grey7;20px;600);
          }
          .categoryContent {
            position: relative;
            left: 120px;
            top: -30px;
          }
          ul.ratingCategories {
            position: relative;
            left: -95px;
            margin-top: 25px;
            width: 95%;
            li.ratingCategory {
              width: 18%;
              margin-right: 2%;
              float: left;
              label {
                width: 100%;
                text-align: center;
                .fontStyle(@grey7;18px;600);
              }
              ul.ratings {
                li {
                  div.rateit-range{
                  background: none;
                  }
                  span {
                    position: relative;
                    top: -6px;
                    font-size: 16px;
                  }
                }
              }
              span.average {
                width: 96%;
                margin: 0 2%;
                border-top: 3px solid @grey7;
                text-align: center;
                font-size: 20px;
              }
            }
          }
        }
        li#reviewsReport {
          height: 320px;
          div.categoryContent {
            position: relative;
            top: -30px;
            left: 20px;
            width: 830px;
            div.overall {
              position: relative;
              top: -10px;
              float: left;
              width: 40px;
              height: 40px;
              img {
                width: 100%;
              }
            }
            span.overallRating {
              margin-top: -4px;
              margin-left: 5px;
              .fontStyle(@grey7;20px;600);
            }
            ul.reviewFaces {
              position: relative;
              top: 30px;
              left: -130px;
              li {
                width: 100px;
                height: 120px;
                a {
                  display: block;
                  margin-left: 20px;
                  width: 60px;
                  height: 60px;
                  img {
                    width: 100%;
                  }
                }
                span {
                  width: 100%;
                  clear: left;
                  text-align: center;
                  font-size: 20px;
                }
                span.title {
                  font-size: 14px;
                }
              }
            }
          }
        }
      }
    }
  }
}

#seals.settingsBody {
  padding: 0 5%;
  p {
      padding-top: 20px;
      padding-left: 60px;
      margin-bottom: 25px;
  }
  div#seal-editor {
      padding: 0;
      width: 47%;
      float: left;
    p#description {
      padding-left: 0;
      padding-top: 0;
      width: 100%;
    }
  }
  .selected {
      border: 1px solid black;
  }
  a.seal {
    clear: left;
    float: left;
    width: 155px;
    display: block;
    margin-top: 10px;
    margin-bottom: 10px;
    img {
      width: 100%;
    }
  }
  table.sealList {
    tbody {
      tr {
        td {
          a.btn {
            margin-left: 105px;
            margin-top: 30px;
            width: 80px;
          }
        }
      }
    }
  }
    div#options {
      h3 {
        float: none;
        width: 100%;
      }
    }
    div.fieldset {
      .boxShadow(0;0;1px;1px;@grey5);
      .radius;
    table.seal-customizer {
      width: 98%;
      margin: 5px 1%;
      tbody {
        tr {
          td {
            label {
              width: 100%;
              span {
                font-weight: 400;
              }
            }
            input, select, div.sp-replacer, span.select2 {
              margin-bottom: 15px;
            }
            select {
              cursor: pointer;
            }
              input[type="text"], span.selection, select {
                width: 100%;
                height: 24px;
              }
              span.select2-container--open {
                span.selection:hover {
                  border-color: @grey5;
                }
              }
              div.fontSelector {
                display: none;
              }
              option:first {
                color: @grey5;
              }
              span.selection {
                span {
                  border: none;
                }
                span.select2-selection--single {
                  background: none;
                  span.select2-selection__rendered {
                    line-height: 15px;
                    color: @grey6;
                    padding: 0;
                  }
                  span.select2-selection__arrow {
                    top: 0;
                  }
                }
              }
              div.rangeslider {
                float: left;
                width: 85%;
                height: 10px;
                margin-top: 5px;
                margin-bottom: 20px;
                div.rangeslider__fill {
                  height: 10px;
                  background: @blueGreen;
                }
                div.rangeslider__handle {
                  width: 20px;
                  height: 20px;
                  top: -5px;
                }
                div.rangeslider__handle:after {
                  width: 9px;
                  height: 9px;
                }
              }
              input.rangeText {
                position: relative;
                top: -4px;
                font-size: 16px;
                float: left;
                width: 15%;
                text-align: center;
                border: none;
                .noBoxShadow;
                background: none;
              }
          }
        }
      }
    }
    }
    div.fieldset.save {
      margin: 20px 0;
      .noBoxShadow;
    }
    div.fieldset.toggle {
      overflow: hidden;
      max-height: 0;
      opacity: 0;
      -webkit-transition: max-height 1.5s linear, opacity 2s linear 0.25s;
      -moz-transition: max-height 1.5s linear, opacity 2s linear 0.25s;
      transition: max-height 1.5s linear, opacity 2s linear 0.25s;
    }
    div.fieldset.toggle.active {
      max-height: 800px;
      opacity: 1;
      -webkit-transition: max-height 1s linear 0.1s, opacity 0.5s linear;
      -moz-transition: max-height 1s linear 0.1s, opacity 0.5s linear;
      transition: max-height 1s linear 0.1s, opacity 0.5s linear;
    }
    div.fieldset.preview {
      position: fixed;
      left: 50%;
      top: 20%;
      width: 556px;
      .noBoxShadow;
      div.actualPreview {
        position: relative;
        h3 {
          span {
            font-size: 14px;
          }
        }
        div#previewSmall {
          border: 2px solid @grey6;
          .radius;
          padding-bottom: 2%;
          background: @grey3;
          width: 400px;
          position: relative;
          margin: 0 auto;
          img#background {
            position: absolute;
            top: 0;
            left: 1px;
            width: 100%;
          }
          div#prevWrapperSmall {
            h2 {
              font-size: 4px;
            }
          }
        }
      }
    }
  h3 {
    width: 160px;
    float: left;
  }
  .codeWrapper {
    float: left;
    position: relative;
    margin-left: 30px;
    width: 650px;
    margin-bottom: 10px;
    p {
      margin-bottom: 20px;
      line-height: 20px;
      font-size: 16px !important;
    }
    .vosEnabled {
      span {
        float: left;
      }
      ul {
        position: relative;
        top: -15px;
        float: left;
        left: 5px;
        li {
          float: left;
          width: 40px;
          margin-right: 4px;
          img {
            width: 100%;
          }
        }
      }
    }
    .code {
      span {
        margin-top: 15px;
        margin-bottom: 4px;
        width: 85%;
      }
      textarea.code {
        width: 700px;
        .radius;
        border: 1px solid @grey5;
        padding: 5px;
      }
    }
    .code.restricted {
      textarea.code {
        background: @grey2;
      }
    }
  }

  div.preview {
  }
  a.preview:hover {
      text-decoration: none;
  }

  #newSeal {
      display: block;
      margin-left: auto;
      margin-right: auto;
      margin-top: 40px;
      margin-bottom: 10px;
  }
}

#emailPreview {
    width:180%;
    border:1px solid black;
    padding:5px;
    margin:5px;
}

div#seal-editor div#messageSealOptions table tbody tr td {
    padding-top: 10px;
}

.settingsBody {
  #accountBar {
    height: 102px;
    a.back {
      position: relative;
      top: 78px;
      right: 643px;
      float: right;
      font-size: 12px;
    }
    a.back:hover {
      text-decoration: none;
    }
    #stepTitle {
      margin-left: 30px;
      width: 60%;
      margin-top: 0;
      padding: 2px 0;
      img.stepIcon {
        width: 80px;
        height: 80px;
        margin-right: 5px;
        float: left;
      }
      h2 {
        margin-bottom: 5px;
        .fontStyle(@grey7;24px;400);
        line-height: 24px;
      }
    }
    a.btn {
      float: left;
      position: relative;
      top: 32px;
      width: 90px;
      text-align: center;
      margin-left: 130px;
    }
  }
}

.setupContainer {
  margin-left: 198px;
  margin-bottom: 30px;
  width: 734px;
  border: 1px solid @grey4;
  border-top: none;
  .bottomRadius;
  #reasons {
    float: none;
    width: 634px;
    padding: 10px 0;
    margin-left: 50px;
    ul.reasons {
      li {
        font-family: @font5;
        padding: 0;
        height: 80px;
        border-bottom: 1px solid @grey4;
        img {
          margin-top: 15px;
          clear: left;
        }
        p {
          height: 100%;
          padding-top: 38px;
          margin-bottom: 0;
          float: left;
          width: 30%;
          border-right: 1px solid @grey4;
        }
        div.status {
          padding-left: 20px;
          margin-top: 22px;
          float: left;
        }
        span {
          display: inline;
        }
        .cbWrapper {
          float: left;
          margin-left: 10px;
          margin-top: 25px;
        }
      }
    }
  }
}

div.alert-modal {
  position: fixed;
  top: 40%;
  width: 33%;
  z-index: 1000;
  margin: 0 33%;
  height: 180px;
  background: @blueGrey3;
  padding: 0;
  .boxShadow(0;1px;2px;2px;rgba(0,0,0,0.2));
  .radius;
  i.alertIcon {
    position: relative;
    top: 4px;
    font-size: 36px;
    color: rgba(0,0,0,0.7);
    float: left;
    margin-top: 10px;
    margin-left: 22px;
  }
  i.fa-times-circle {
    position: absolute;
    font-size: 16px;
    top: 10px;
    right: 10px;
    color: darken(@grey5,10%);
    cursor: pointer;
  }
  i.fa-times-circle:hover {
    color: darken(@grey5,20%);
  }
  h2 {
    float: left;
    width: 80%;
    margin-left: 15px;
    margin-top: 16px !important;
    border-bottom: none !important;
    margin-bottom: 7px;
    font-size: 22px !important;
    line-height: 20px;
    font-weight: 600;
    font-family: @font5;
  }
  h2.success {
    color: @buttonGreen !important;
  }
  i.successIcon {
    color: @buttonGreen;
  }
  p {
    font-family: @font5;
    color: darken(@grey5,10%);
    margin-left: 70px;
    font-size: 13px !important;
    font-weight: 600;
    padding-right: 10px;
  }
    div.buttonContainer {
      border-top: 1px solid rgba(0,0,0,0.1);
      .bottomRadius(4px);
      width: 100%;
      background: @grey2;
      position: absolute;
      bottom: 0;
      padding: 14px;
      div.buttonHolder {
        width: 50%;
        margin: 0 25%;
        button, a.btn {
          width: 40%;
          margin: 0 5%;
          float: right;
          margin: 0 8px;
          padding: 10px 20px;
        }
      }
    }
}
div#deletePopup.alert-modal {
  margin: 0 11%;
}
div.alert-modal.responsePrompt {
  margin: 0 14%;
  width: 25%;
  height: 125px;
  a.close {
    position: relative;
    right: 4px;
    top: 4px;
  }
  h2 {
    width: 70%;
  }
  p {
    float: left;
  }
}
div#responseSuccessPrompt {
  height: 160px;
}
div#deletePopup.svAdmin {
  margin: 0 40%;
  a.btn {
    margin-left: 20px;
    margin-right: 20px;
  }
}
div#unsubscribeSealPrompt.alert-modal.responsePrompt {
  margin: 0 5%;
}

#svAdmin.settingsPage {
  height: 2138px;
  ul.adminOptions {
    padding: 15px 0;
    float: left;
    width: 190px;
    height: 100%;
    border-right: 1px solid @grey4;
    li {
      height: 50px;
      width: 100%;
      padding: 0 15px;
      overflow: hidden;
      a {
        height: 50px;
        line-height: 50px;
        width: 100%;
        text-align: center;
      }
      a.create {
        width: 100%;
        margin: 0;
        .radius;
        background: @grey2;
        border: 1px solid @grey4;
        padding: 4px 5px;
      }
    }
    li.category {
      padding-top: 10px;
      height: 45px;
    }
    li.sub {
      padding: 0 40px;
      height: 25px;
      a {
        line-height: 15px;
        height: 25px;
      }
    }
    li.sub.last {
      margin-bottom: 15px;
    }
    li.active {
      background: @grey2;
      border-top: 1px solid @grey4;
      border-bottom: 1px solid @grey4;
    }
    li.create {
      border-bottom: 3px solid @grey7;
    }
    li.accountSearch {
      position: relative;
      input {
        width: 100%;
      }
      i {
        position: absolute;
        right: 20px;
        top: 11px;
      }
    }
    ul.recent {
      margin-top: 40px;
      padding-left: 5px;
      font-family: @font5;
      h4 {
        font-size: 18px;
        font-weight: 700;
      }
      li {
        border-bottom: 1px solid @grey3;
      }
    }
  }
  div.accountBody {
    width: 1180px; 
    float: left;
    padding: 0 20px;
    overflow-x: scroll;
    #accountStatus {
      span {
        font-weight: 600;
        color: @blueGreen;
      }
      ul {
        li {
          h4 {
            padding-bottom: 4px;
            border-bottom: 1px solid @grey5;
            font-family: @font5;
            width: 200px;
          }
        }
      }
    }
    form.adminUserCreator {
      button {
        margin-top: 10px;
      }
    }
    form.adminAccountCreator {
      button#validate {
        span.validated {
          display: none;
        }
      }
      button#validate.active {
        background: @buttonGreen;
        cursor: default;
        span.unvalidated {
          display: none;
        }
        span.validated {
          display: block;
        }
      }
    }
    #formSuccess {
      margin-top: 20px;
      font-size: 24px;
    }
    h1 {
      font-family: @font5;
    }
    h2 {
      font-size: 20px;
      line-height: 24px;
      span {
        .fontStyle(@blueGreen;16px;400);
      }
    }
    h3 {
      margin-top: 30px;
      margin-bottom: 5px;
      padding-top: 5px;
      border-top: 1px solid @grey7;
      span {
        .fontStyle(@blueGreen;14px;400);
      }
    }
    form {
      margin: 0;
      margin-bottom: 40px;
      width: 500px;
      fieldset {
        width: 100%;
        .control-group {
          margin-top: 10px;
          width: 100%;
          border-top: 1px soldi @grey3;
          label {
            span {
              font-size: 12px;
              font-weight: 300;
            }
          }
          .controls {
            width: 100%;
            input {
              width: 75%;
            }
            input[type="checkbox"] {
              width: auto;
              display: inline;
            }
          }
          .controls.sub {
            margin-left: 15px;
            p {
              font-size: 12px;
            }
          }
          #tags.section {
            h3 {
              padding-bottom: 20px;
              .navButtons {
                margin-left: 95px;
                position: relative;
                span {
                  left: -186px !important;
                  padding: 0 5px;
                }
              }
            }
          }
          #monitoring {
            .alpha.updatePrompt {
              margin-top: 1550px;
            }
          }
          #messageWrapper.monitoring {
            height: 734px;
            .header {
              .subject {
                font-size: 14px;
                a.display {
                  position: relative;
                  top: 20px;
                }
              }
            }
            .itemBody {
              margin-top: 55px;
              height: 657px;
              width: 450px;
              left: 0;
              a.message {
                height: 448px;
                width: 100%;
                img {
                  width: 448px;
                }
              }
              .tags {
                height: 200px;
                width: 100%;
                input[type="text"] {
                  width: 55%;
                }
                p {
                  padding-left: 10px;
                }
              }
            }
          }
        }
        .control-group.satisfaction {
          height: 100px;
          .selectScore {
            margin-top: 0 !important;
          }
        }
      }
      a.btn {
        background: @grey4;
      }
    }
    form.export {
      width: 100%;
    }
    form.callRecorder {
      select {
        width: 20%;
        float: left;
        margin-right: 5px;
        margin-bottom: 4px;
      }
      input[type="text"] {
        margin: 8px 0;
        width: 40%;
        margin-right: 60%;
      }
      textarea {
        width: 100%;
        height: 120px;
      }

    }
    div.rating {
      background: @white;
      width: 262px;
      position: fixed;
      top: 150px;
      left: 950px;
      border: 1px solid @grey7;
      .radius;
      padding: 3px 20px;
      h4 {
        text-align: center;
      }
      span {
        width: 100%;
        text-align: center;
        font-size: 20px;
      }
      span.remaining {
        font-size: 14px;
      }
      button.save {
        width: 50%;
        margin-top: 10px;
        margin-bottom: 10px;
        margin-left: 25%;
      }
    }
    ul.tableOptions {
      padding-top: 20px;
      float: left; 
      width: 100%;
      li {
        float: left;
        margin: 10px 5px;
        a {
          padding: 5px 0;
          text-align: center;
          width: 60px;
          span.deselect {
            display: none;
          }
        }
        a.active {
          span.select {
            display: none;
          }
          span.deselect {
            display: block;
          }
        }
      }
      li:last-child {
        float: right;
      }
    }
    table.table {
      margin-top: 30px;
      thead tr {
        th {
          .gradientWhiteToGrey;
          cursor: pointer;
          i {
            display: none;
          }
        }
        th:hover {
          .gradientGreyToWhite;
        }
        th.ascending {
          .gradientGrey1;
          i.fa-caret-down {
            display: block;
          }
        }
        th.descending {
          .gradientGrey1Rev;
          i.fa-caret-up {
            display: block;
          }
        }
      }
      tbody tr {
        cursor: pointer;
        position: relative;
      }
      tbody tr.active {
        td {
          border: none;
          background: @white;
        }
      }
      tr.stuck td, tr.error td {
        background: lighten(@red1, 25%);
      }
      th,td {
        text-align: left; 
        font-size: 12px;
        padding-right: 4%;
        position: relative;
        i {
          top: 27px;
          right: 4px;
          position: absolute;
        }
      }
      td {
        height: 22px;
        line-height: 22px;
        padding-left: 1%;
        button {
          padding: 0 4px;
        }
      }
      a {
        display: block;
        text-decoration: none;
        color: @grey7;
        height: 21px;
        width: 100%;
        padding: 0 4px;
      }
    }
    ul.accountTabs {
      height: 30px;
      width: 100%;
      li {
        float: left;
        width: 100px;
        height: 30px;
        a {
          width: 100%;
          height: 100%;
          line-height: 30px;
          text-align: center;
          display: block;
        }
        a.active {
          background: @grey3;
          border: 1px solid @grey5;
          color: @grey7;
        }
      }
    }
    .accountSection {
      display: none;
    }
    .accountSection.active {
      display: block;
    }
  }
  #signup.selfAssessment {
    table.selfAssessment {
      width: 100%;
      margin: 0;
      position: relative;
      th {
        width: 100%;
        position: absolute;
        top: -10px;
      }
      td {
        position: absolute;
        left: 50px;
        width: 400px;
      }
    }
  }
  #reasons {
    ul.reasons {
      li {
        p {
          width: 360px;
          margin-right: 0;
        }
        .cbWrapper {
          float: right;
          top: -45px;
        }
      }
    }
  }
}





/*Responsiveness Start */



/* Select2 Stuff */
span.select2-dropdown {
	top: -5px;
}

.bootstrap-switch.bootstrap-switch-mini .bootstrap-switch-handle-on {
    background-color: green;
}

#addFilterWrapper select {
    background-color: #fff;
    color: black;
    font-weight: 300;
}

#addFilterWrapper ul {
    width: 100%;
}

#addFilterWrapper ul li.rule {
    max-width: 420px;
    display: block;
    margin: auto;
}


#addFilterWrapper .value {
    width: 60px;
}

#addFilterWrapper .operator {
    width: 50px;
}

#addFilterWrapper .conjunction {
    width: 75px;
}

#addFilterWrapper .fields {
    width: 200px;
}

#addFilterWrapper select {
    margin: 2px 0px;
    padding: 5px 0px;
}

i.remove.fa.fa-minus {
    right: 5px;
    position: relative;
    top: 2px;
}

input[name="queryName"] {
    /* margin: 20px auto; */
    margin-bottom: 20px;
    padding: 5px;
    width: 250px;
}

#addFilterWrapper form {
    background-color: #fafafa;
    border: 1px solid #f0f0f0;
    padding: 10px;
}

#addFilterWrapper.alert-modal {
    width: 65%;
    height: auto;
    left: -8.5%;
    top: 15%;
    font-family: 'Open Sans', serif;
}

.alert-modal i.fa.fa-times {
    margin: 10px;
}

#addFilterWrapper label {
    left: 27%;
    position: relative;
}

#addFilterWrapper fieldset {
    margin-left: 15%;
}

#addFilterWrapper span.add {
    padding: 5px;
}

#addFilterWrapper .fa:hover {
    cursor: pointer;
    opacity: 0.9;
}

i#addRule {
    margin-right: 5px;
}

#addFilterWrapper span.add {
    display: block;
	margin: 0 auto;
	text-align: center;
	position: relative;
	right: 174px;
}

span.add > span {
    position: relative;
    left: 3px;
}

a.addFilter {
	margin: 0 auto;
	display: block;
	text-align: center;
}
ul.pricePlans {
	margin-top: 20px;
	margin-left: 25px;
	width: 975px;
	height: 180px;
	li {
		height: 180px;
		float: left;
		width: 294px;
		margin: 0 3px;
		margin-right: 28px;
		position: relative;
		.topRadius(10px);
		border: 1px solid @grey4;
		cursor: pointer;
		padding: 1px 1px 0 1px;
		h2 {
			background: @grey2;
			.topRadius(8px);
			margin-top: 0;
			margin-bottom: 4px;
			.fontStyle(@blueDark;24px;500);
			text-align: center;
			border-bottom: 1px solid @grey4;
		}
		span.price {
			width: 100%;
			text-align: center;
			.fontStyle(@blueDark;18px;400);
			b {
				line-height: 60px;
				font-size: 60px;
			}
		}
		span.price.subscriber {
			font-size: 14px;
		}
		p {
			width: 248px;
			margin: 0 21px;
			position: absolute;
			bottom: 6px;
			text-align: center;
			.fontStyle(@grey6;14px;400) !important;
		}
	}
	li:hover,li.hover {
		padding: 0;
		border: 2px solid @bgBlue;
		border-bottom: 1px solid @grey4;
	}
	li.active {
		background: lighten(@greenGrey1,3%);
		border: 2px solid @bgBlue;
		border-bottom: 1px solid @grey4;
		padding: 0;
		h2 {

			color: @white;
			background: lighten(@bgBlue,4%);
		}
	}
}
ul.featureList {
	position: relative;
	top: -1px;
	margin-left: 25px;
	width: 975px;
	li.row {
		width: 100%;
		ul.features {
			height: 40px;
			li {
				padding: 0 1px;
				border: solid @grey4;
				border-width: 0 1px 0 1px;
				float: left;
				height: 40px;
				width: 294px;
				margin: 0 3px;
				margin-right: 28px;
				/*&.hovered {
					padding: 0;
					border-right: 2px solid #6f90ab;
					border-left: 2px solid #6f90ab;
				}*/
				p {
					width: 280px;
					margin: 0 5px;
					border-bottom: 1px solid @grey4;
					padding: 10px 0;
					text-align: center;
				}
			}
			li.hover, li.active {
				padding: 0;
				border-color: @bgBlue;
				border-width: 0 2px;
			}
		}
	}

	li.row:last-child {
		ul.features {
			li {
				padding: 0 1px 1px 1px;
				border-width: 0 1px 1px 1px;
				.bottomRadius;
				p {
					border-bottom: none;
				}
			}
			li.hover, li.active {
				padding: 0;
				border-color: @bgBlue;
				border-width: 0 2px 2px 2px;
			}
		}
	}
}
div#fullFeatures {
	padding-top: 40px;
	display: none;
	h2#features {
		font-family: @font5;
		.fontStyle(@grey7;34px;300);
		text-align: center;
		width: 76%;
		margin: 0 12%; 
		margin-bottom: 0;
	}
}
div#fullFeatures.active {
	display: block;
}

.paymentDisclaimer {
	width: 60%;
	margin: 10px auto;
	background: #fafafa;
	border: 1px solid #f0f0f0;
	padding: 5px;
	border-radius: 5px;
}

#change button.btn, #account button.btn {
    margin: 20px auto;
    display: block;
}

form#paymentForm {
	margin: 20px auto;
	display: block;
	width: 200px;
}


a.addFilter {
	display: block;
	text-align: center;
}

div.footer {
    position: fixed;
    bottom: 10px;
    left: 45%;
    a {
	color: white;
    }
}}

div#reports {
	min-height: 660px;
	font-family: @font5 !important;
	div#reportsApp, div#reportsUpgrade {
		min-height: 660px;
		background: #eaeff4;
		border-top: 1px solid #a3a3a3;
		.bottomRightRadius(5px);
		div.main-header {
			background: @white;
			height: 90px;
			border-bottom: 1px solid #a3a3a3;
			h2 {
				margin-top: 0;
			    margin-left: 55px;
				border: none !important;
				color: #4e4e40;
			    font-size: 34px;
			    font-weight: 300;
			    width: 15%;
			    float: left;
			    position: relative;
			    top: 25px;
			}
			div.date-picker {
				margin-top: 30px;
				float: left;
				width: 400px;
				div.picker {
					width: 150px;
					float: left;
				}
				span.divider {
					float: left;
				    margin: 0 15px;
				    height: 34px;
				    line-height: 34px;
				    font-size: 16px;
				}
			}
			div.header-buttons {
				width: 110px;
				float: right;
				position: relative;
				top: 28px;
				right: 30px;
				button.btn.important {
					margin: 0 10px;
					width: 90px;
				}
			}
		}
		div.reports {
			padding: 2em;
			div.report-grid {
			  	margin: -2em 0 0 -2em;
				display: -webkit-flex;
				display: flex;
				-webkit-flex-direction: row;
				flex-direction: row;
				-webkit-flex-flow: row wrap;
				flex-flow: row wrap;
				p.no-reports {
					color: #a3a3a3;
				    font-size: 16px;
				    margin: 190px;
				    width: 100%;
				    text-align: center;
				}
				div.grid-item-wrapper {
			  		padding: 2em 0 0 4em;
					height: 180px;
					flex: 0 0 33.333%;
					-webkit-flex: 0 0 33.333%;
					-ms-flex: 0 0 33.333%;
					position: relative;
					div.select {
						position: absolute;
						left: 30px;
						top: 22px;
					}
					div.grid-item {
						position: relative;
						height: 100%;
						border: 1px solid #a3a3a3;
						background: @white;
						.boxShadow(1px;1px;2px;1px;rgba(0,0,0,0.1));
						.radius;
						cursor: pointer;
						div.report-type {
							float: left;
							margin-left: 8px;
							margin-top: 5px;
							width: 40px;
							img.report-id {
								width: 60%;
								margin: 0 20%;
							}
							span.report-type {
								margin-top: 2px;
								font-size: 8px;
								display: block;
								width: 100%;
								text-align: center;
								text-transform: uppercase;
								color: #40404e;
							}
						}
						div.report-range {
							color: #657683;
							font-size: 16px;
							font-weight: 600;
							width: 60%;
							margin: 12px 0;
							margin-left: 30%;
							text-align: right;
							span {
								display: inline;
							}
						}
						div.stats {
							width: 100%;
							height: 100px;
							div.stat {
								float: left;
								width: 50%;
								height: 100%;
								span.stat {
									width: 100%;
									text-align: center;
									color: #3f3f3f;
									font-weight: 600;
									height: 55px;
									line-height: 55px;
								}
								span.desc {
									width: 100%;
									text-align: center;
									color: #a3a3a3;
									text-transform: uppercase;
								}
							}
							div.stat.sxi {
								span.sxi-stat {
									font-size: 45px;
								}	
							}
							div.stat.events {
								span.events-stat {
									font-size: 36px;
								}	
							}
						}
						div.sxi-color {
							position: absolute;
							height: 7px;
							width: 100%;
							bottom: 0;
							padding: 0;
							div.color {
								height: 7px;
								.bottomRadius(4px);
							}
						}
					}
					div.grid-item.selected {
						border: 1px solid @OBGreen;
						.insetShadow(0;0;0;2px;rgba(65,146,182,0.8));
						div.sxi-color {
							position: absolute;
							height: 9px;
							padding: 2px;
							div.color {
								height: 5px;
								.bottomRadius(2px);
							}
						}
					}
				}
			}
		}
		div.expanded-container {
			position: fixed;
			top: 60px;
			height: 90%;
			max-height: 680px;
			width: 600px;
			left: 50%;
			overflow: scroll;
			margin: auto;
			margin-left: -300px;
			background: @white;
			div.header {
				background: @blueGreen;
				height: 50px;
				position: relative;
				h2 {
					position: relative;
					top: 0;
					margin-top: 0;
					left: 12px;
					height: 50px;
					line-height: 50px;
					float: left;
					color: @white;
					font-size: 16px;
					font-weight: 600;
					text-transform: uppercase;
					img {
						margin-top: 5px;
						margin-right: 12px;
						width: 32px;
						float: left;
					}
					span {
						display: inline;
					}
				}
				h3.report-range {
					margin-top: 0 !important;
					color: @white;
					margin-right: 10px;
					height: 50px;
					line-height: 50px;
					font-size: 16px;
					float: right;
					span {
						display: inline;
					}
				}
			}
			div.page {
				clear: both;
				div.section {
					margin: 15px 0;
					float: left;
					width: 100%;
					label {
						width: 100%;
						font-size: 16px;
						text-align: center;
					}
				}
				div.donut-graph {
					margin-top: 30px;
					margin-bottom: 5px;
					float: left;
					width: 300px;
					height: 160px;
					position: relative;
					div.info {
						position: absolute;
						color: @OBGreen;
						width: 270px;
						height: 150px;
						top: 0;
						span {
							display: block;
							text-align: center;
						}
					}
					div.sxi-info {
						right: 30px;
						span.sxi {
							width: 150px;
							float: right;
							font-size: 35px;
							line-height: 150px;
						}
						span.sxi-label {
							width: 120px;
							float: left;
							font-size: 28px;
							line-height: 150px;
						}
					}
					div.change-info {
						left: 30px;
						span.change {
							width: 150px;
							float: left;
							font-size: 35px;
							line-height: 150px;
						}
						span.change-label {
							position: relative;
							top: 57px;
							width: 120px;
							float: right;
							font-size: 18px;
							line-height: 12px;
							span {
								text-transform: capitalize;
							}
						}
					}
				}
				div.sxi-donut {
					padding-left: 120px;
					padding-right: 30px;
				}
				div.change-donut {
					padding-left: 30px;
					padding-right: 120px;
				}
				ul.data {
					margin: 5px 0;
					width: 100%;
					float: left;
					height: 100px;
					padding: 10px 0;
					li {
						float: left;
						width: 33.3%;
						height: 80px;
						padding: 10px 0;
						label {
							font-size: 14px;
							width: 100%;
							text-align: center;
							text-transform: uppercase;
						}
						span.data {
							width: 100%;
							text-align: center;
							font-size: 14px;
							line-height: 10px;
							color: #636363;
						}
					}
					li:last-child {
						border-right: none;
					}
				}
				ul.event-data {
					margin-top: 15px;
					li {
						border-right: 1px solid #a3a3a3;
						span.data {
							font-size: 30px;
							line-height: 25px;
						}
					}
					li:last-child {
						border-right: none;
					}
				}
				div.section.churn-risk {
					div.churn-risk-bar {
						width: 50%;
						margin: 0 25%;
						position: relative;
						span.churn-risk-info {
							width: 120px;
							margin-left: -60px;
							top: -18px;
							text-align: center;
							font-weight: 700;
							position: absolute;
							font-size: 12px;
						}
						div.progress {
							margin-top: 20px;
							margin-bottom: 0;
							width: 100%;
							.insetDrop(0;1px;3px;1px;rgba(0,0,0,0.08);0;1px;1px;0;rgba(0,0,0,0.05));
							background: @white;
							.radius(1px);
							border: 1px solid #c3c3c3;
							div.progress-bar.churn {
								.noBoxShadow;
							}
						}
					}
				}
				div.feedback-pct.section {
					label.feedback-pct-change {
						span {
							text-transform: capitalize;
							display: inline;
						}
					}
					ul.feedback-pct-change {
						padding-top: 0;
					}
				}
				div.bar-header {
					width: 80%;
					margin: 0 10%;
					border-bottom: 1px solid #a4a4a4;
					height: 40px;
					padding: 0 4px;
					h2 {
						margin: 0;
						font-size: 16px;
						width: 60%;
						float: left;
						font-family: @font5;
						color: #333333;
						font-weight: 600;
					}
					span.events {
						font-size: 12px;
						position: relative;
						top: 15px;
						float: right;
						color: #636363;
						font-family: @font5;
						font-weight: 600;
						margin-right: 2px;
						span {
							display: inline;
						}
					}
				}
				ul.breakdown {
					width: 80%;
					margin: 0 10%;
					li {
						padding: 10px 15px;
						height: 60px;
						border-bottom: 1px solid #cccccc;
						.boxShadow(0;1px;2px;-1px;#ffffff);
						img {
							width: 38px;
							float: left;
						}
						div.progress {
							float: right;
							margin-top: 15px;
							height: 10px;
							width: 250px;
							background: #fff;
							border: 1px solid #cccccc;
						}
						span.pct {
							position: relative;
							top: 10px;
							display: block;
							width: 60px;
							text-align: center;
							float: right;
						}
					}
				}
			}
			div.sentiment.page {
				margin-top: 115px;
			}
			div.satisfaction.page {
				margin-top: 10px;
				div.npsBreakdown {
					width: 74%;
					margin: 0 13%;
					margin-top: 20px;
					height: 90px;
					div.npsScore {
						.radius(8px);
						background: #636363;
						float: left;
						width: 30%;
						margin-right: 3%;
						height: 80px;
						label {
							color: @white;
							width: 100%;
							text-align: center;
							font-weight: 400;
							margin-bottom: 0;
							margin-top: 3px;
						}
						span {
							display: block;
							width: 100%;
							font-size: 40px;
							font-weight: 600;
							color: @white;
							text-align: center;
						}
					}
					div.progress {
						float: left;
						width: 67%;
						height: 80px;
						margin-bottom: 0;
						div.progress-bar {
							padding-top: 25px;
							font-size: 24px;
						}
						div.progress-bar-success {
							background: #00c66f;
						}
						div.progress-bar-warning {
							background: #fece40;
						}
					}
				}
				ul.satisfaction.breakdown {
					li {
						padding: 0 15px;
						height: 40px;
						span.number {
							text-align: center;
							.fontStyle(@grey6;14px;600);
							float: left;
							width: 30px;
							height: 30px;
							padding-top: 4px;
							margin: 5px 1%;
							.radius(5px);
							background: @grey2;
							border: 1px solid @grey5; 
						}
						div.progress {
							margin-bottom: 15px;
						}
					}
				}
			}
			div.ratings.page {
				div.bar-header {
					margin-top: 10px;
				}
				ul.breakdown {
					li {
						padding: 6px 15px;
						height: 50px;
						span.numStars {
							margin-top: 8px;
							color: #636363;
							font-weight: 600;
							span {
								display: inline;
							}
						}
						span.number {
							text-align: center;
							.fontStyle(@grey6;14px;600);
							float: left;
							width: 30px;
							height: 30px;
							padding-top: 4px;
							margin: 5px 1%;
							.radius(5px);
							background: @grey2;
							border: 1px solid @grey5; 
						}
						div.progress {
							margin-bottom: 15px;
						}
					}
				}
			}
			div.comments.page {
				margin-top: 10px;
				ul.comments-list {
					height: 560px;
					overflow: scroll;
					width: 80%;
					margin: 0 10%;
					margin-top: 10px;
					li {
						margin: 20px 0;
						span.comment-email {
							color: @OBGreen;
							span {
								display: inline;
							}
						}
						span.reply {

						}
						div.comment-wrapper {
							margin-top: 3px;
							padding: 5px;
							background: #AFC7CC;
							.radius(4px);
							div.comment-container {
								background: @white;
								padding: 5px;
								.radius(2px);
								p {
									margin: 0;
								}
							}
						}
					}
				}
			}
		}
		div.expanded-container::-webkit-scrollbar {
			display: none;
		}
		div.arrow {
			position: fixed;
			top: 50%;
			margin-top: -30px;
			cursor: pointer;
			i {
				font-size: 60px;
				color: @OBGreen;
			}
		}
		div.arrow-left {
			left: 20%;
		}
		div.arrow-right {
			right: 20%;
		}
		div.arrow.inactive {
			opacity: 0.5;
			cursor: default;
		}
		ul.page-nav {
			position: fixed;
			top: 750px;
			left: 50%;
			li {
				width: 20px;
				float: left;
				i {
					width: 20px;
					text-align: center;
				}
				i.fa-circle {
					color: @OBGreen;
				}
				i.fa-circle-o {
					color: @white;
				}
			}
		}
		div.expanded-overlay {
			position: fixed;
			top: 0;
			left: 0;
			height: 100%;
			width: 100%;
			background: rgba(0,0,0,0.7);
		}
	}
}

@media only screen and (max-width: 1199px) {
  #videoHolder {
    height: 100%;
    width: 100%;
    overflow-x: hidden;
  }
  body.landingPage {
    div#landingPageAlpha {
      width: 100%;
      div.logoStatic {
        position: relative;
        padding-top: 20px;
        max-width: 1000px;
        width: 40%;
        margin: 0 30%;
        a {
          width: 100%:
          display: block;
          margin-bottom: 15px;
        }
        img {
          width: 100%;
        }
        p {
          margin-top: 0;
          font-size: 18px;
          span {
            color: rgba(255,255,255,0.85);
            font-weight: 400;
            font-family: @font1;
            padding-bottom: 4px;
          }
        }
        p.prompt.small {
          margin-top: 2px;
          font-size: 18px;
        }
        div.horizontalDiv {
          display: none;
          width: 62%;
          height: 0;
          margin: 0 19%;
          border-top: 3px solid rgba(255,255,255,0.25);
        }
        div.horizontalDiv.active {
          display: block;
        }
      }
      div.alphaScreen {
        padding-top: 25px;
        img {
          width: 40%;
          margin: 0px 30%;
        }
        h2 {
          padding: 0 20%;
          margin-top: 30px;
          font-family: @font6;
          color: rgba(255,255,255,0.75);
          font-size: 50px;
          text-align: center;
          font-weight: 300;
          b {
            color: rgba(255,255,255,0.85);
            font-weight: 600;
            font-family: @font5;
          }
        }
        h2.question {
          margin-top: 36px;
          margin-bottom: 8px;
          font-size: 50px;
          padding: 0 10%;
          line-height: 60px;
          color: @white;

          b {
            color: @white;
          }
        }
        h2.statement {
          text-transform: uppercase;
          padding: 0;
          font-size: 48px;
          line-height: 50px;
          margin-top: 50px;
          margin-bottom: 40px;
          b {
            color: @white;
            font-weight: 600;
            font-family: @font5;
          }
        }
        h2.reservation {
          line-height: 50px;
          font-size: 40px;
          span {
            display: block;
            width: 100%;
            text-align: center;
            font-weight: 400;
            font-family: @font1;
            color: @white;
          }
        }
        p {
          margin-top: 0px;
          font-size: 18px;
          span {
            color: @white;
            font-weight: 400;
            font-family: @font1;
            border-bottom: 2px solid @white;
          }
        }
        p.prompt.no {
          display: none;
        }
        p.prompt.no.active {
          display: block;
          margin: 0;
          font-size: 22px;
        }
        p.prompt.enter {
          font-size: 22px;
        }
        div.buttonContainer {
          height: 200px;
        }
        div.buttonWrapper {
          float: left;
          margin: 50px 0;
          width: 37%;
          height: 170px;
          .radius(5px);
          background: rgba(0,0,0,0.3);
        }
        div.buttonWrapper.yes {
          margin-left: 11%;
          margin-right: 2%;
        }
        div.buttonWrapper.no {
          margin-left: 2%;
          margin-right: 11%;
        }
        button {
          .radius(5px);
          width: 90%;
          height: 78%;
          margin: 5%;
          border: none;
          color: @white;
          font-family: @font5;
          .insetDrop(0;1px;0;0;rgba(255,255,255,0.25);0;1px;1px;0;rgba(0,0,0,0.25));
          span {
            font-weight: 600;
            font-size: 20px;
          }
          span.big {
            width: 100%;
            font-size: 50px;
            line-height: 58px;
            font-family: @font1;
            text-transform: uppercase;
          }
          span.yes {
            width: 100%;
            position: relative;
            top: 3px;
          }
          span.no {
            width: 100%;
            position: relative;
            top: 3px;
          }
        }
        button:focus {
          outline: none;
        }
        button#yes {
          border: 1px solid darken(@brightBlueNew,12%);
          background: @brightBlueNew;
        }
        button#yes:hover {
          border: 1px solid lighten(@brightBlueNew,8%);
          background: lighten(@brightBlueNew,8%);
        }
        button#no {
          border: 1px solid darken(@grey5,4%);
          background: @greyButton;
        }
        button#no:hover {
          border: 1px solid lighten(@grey5,12%);
          background: lighten(@greyButton,8%);
        }
        form#reservationForm {
          width: 50%;
          margin: 30px 25%;
          margin-bottom: 0;
          div.inputWrapper {
            width: 100%;
            height: 460px;
            .radius;
            background: rgba(255,255,255,0.3);
            input[type="email"], input[type="text"] {
              float: left;
              margin: 10px 3%;
              width: 94%;
              font-family: @font6;
              padding: 12px 23px;
              height: 70px;
              border: none;
              font-size: 22px;
              color: @grey6;
              .radius();
              .insetShadow(0;2px;0;0;rgba(0,0,0,0.05));
            }
            button {
              margin: 0 3%;
              margin-top: 10px;
              font-family: @font6;
              width: 94%;
              .radius();
              float: left;
              height: 70px;
              padding: 7px 15px;
              font-size: 24px;
              text-transform: capitalize;
              background: @brightBlueNew;
              position: relative;
            }
            button:hover {
              background: lighten(@brightBlueNew,8%);
            }
            button.btn-disabled {
              background: darken(@brightBlueNew,12%);
              color: @grey3;
            }
          }
        }
        div.socialIcons {
          width: 100%;
          margin-top: 5px;
          padding-top: 20px;
          a, div.wrapper {
            float: left;
            display: block;
            width: 50px;
            height: 50px;
            .radius(64px);
            background: rgba(255,255,255,0.25);
          }
          a:first-child {
            margin-left: 425px;
            margin-right: 10px;
          }
          a:last-child {
            margin-left: 10px;
          }
          i {
            width: 100%;
            text-align: center;
            font-size: 24px;
            padding: 14px 0;
            color: @blueGrey1;
          }
          a:hover {
            background: rgba(0,0,0,0.5);
          }
        }
        div.socialIcons.share {
          border: none;
          max-width: 600px;
          a {
            margin: 0 2.65%;
            .radius(5px);
            height: 52px;
            color: @white;
            font-family: @font6;  
            font-size: 11px;
            text-align: left;
            width: 28%;
            background: @brightBlueNew;
            padding-bottom: 12px;
            div.wrapper {
              background: rgba(0,0,0,0.3);
              width: 30px;
              height: 30px;
              margin-right: 4px;
              i {
                padding: 6px 0;
                font-size: 20px;
              }
            }
            span {
              margin-top: 9px;
            }
            div.email {
              i {
                font-size: 17px;
                padding: 7px 0;
                padding-left: 1px;
              }
            }
          }
          a:hover {
            background: lighten(@brightBlueNew, 8%);
          }
        }
      }
      div.fourohfour-image {
        float: none;
        width: 100%;
        img {
          width: 20%;
          margin: 20px 40%;
        }
      }
      div.fourohfour-prompt {
        float: none;
        width: 100%;
        h2 {
          width: 60%;
          margin: 10px 20%;
          text-align: center;
        }
        p {
          width: 60%;
          margin: 10px 20%;
          margin-bottom: 15px;
          text-align: center;
        }
        div.btn-holder {
          margin-bottom: 15px;
        }
      }
      div.socialStatic {
        display: none;
        position: relative;
        max-width: 700px;
        div.horizontalDiv {
          width: 62%;
          height: 0;
          margin: 0 19%;
          margin-bottom: 10px;
          border-top: 3px solid rgba(255,255,255,0.25);
        }
        div.socialIcons {
          width: 100%;
          margin-top: 5px;
          padding-top: 20px;
          a, div.wrapper {
            float: left;
            display: block;
            width: 50px;
            height: 50px;
            .radius(64px);
            background: rgba(255,255,255,0.25);
          }
          a:first-child {
            margin-left: 275px;
            margin-right: 10px;
          }
          a:last-child {
            margin-left: 10px;
          }
          i {
            width: 100%;
            text-align: center;
            font-size: 24px;
            padding: 14px 0;
            color: @blueGrey1;
          }
          a:hover {
            background: rgba(0,0,0,0.5);
          }
        }
      }
      div.socialStatic.active {
        display: block;
      }
      div.alphaScreen.active {
        opacity: 1;
        right: 0;
        display: block;
      }

      div#alphaPage2.alphaScreen.active { 
        height: 680px;
        background: rgba(0,0,0,0.3);
      }

      div#alphaPage3.alphaScreen.active {
        height: 509px;
        background: rgba(0,0,0,0.3);
      }
    }
  }
  .homeNav {
    li {
      margin: 0 7px !important;
    }
  }
  #signup.selfAssessment {
    table.selfAssessment {
      th {
        margin-top: 35px;
        label {
          font-size: 19px;
        }
      }
    }
    ul.cb {
      div.count {
        top: -114px;
      }
    }
  }
  #trust {
    div#IWorthy {
      height: 750px;
      background: @blueDark;
      h2 {
        color: rgba(255,255,255,0.83) !important;
      }
      #reasons {
        display: block;
        padding: 0;
        width: 100%;
        margin-top: 40px;
        ul.reasons {
          width: 50%;
          margin-left: 25%;
          li {
            height: 150px;
            text-align: left;
            .fontStyle(rgba(255,255,255,0.85);36px;400);
            font-family: @font5 !important;
            img {
              position: relative;
              top: -27px;
              width: 140px;
              margin-right: 25px;
            }
            span {
              .fontStyle(rgba(255,255,255,255.75);18px;400);
            }
          }
        }
      }
    }
    div#VOS {
      .container {
        h2 {
          font-size: 26px !important;
          width: 70% !important;
        }
        p {
          width: 45%;
          line-height: 26px;
          height: 150px;
          text-align: left;
          .fontStyle(rgba(0,0,0,0.75);20px;400);
        }
        img {
          width: 300px !important;
          bottom: 265px !important;
          right: 10px 1important;
        }
      }
    }
    div#benefits {
      h2 {
        float: right;
        position: relative;
        top: -320px;
        color: rgba(255,255,255,0.83) !important;
      }
      ul.benefits {
        width: 60%;
        float: right;
        position: relative;
        top: -320px;
        margin-right: 10%;
        li {
          .fontStyle(rgba(0,0,0,0.53);16px;400);
          margin: 12px 0;
          border-bottom: 2px solid rgba(255,255,255,0.2);
          padding-bottom: 22px;
          span {
            text-align: center;
            margin-right: 25px;
            margin-top: -4px;
            float: left;
            width: 50px;
            .radius(40px);
            height: 50px;
            line-height: 50px;
            .fontStyle(rgba(255,255,255,0.5);38px;600);
          }
        }
      }
    }
  }
}

/* Smaller than standard 960 (devices and browsers) */
@media only screen and (max-width: 999px) {
  html.landingPage {
    height: 100%;
  }
  body.landingPage {
    div#landingPageAlpha {
      width: 100%;
      div.logoStatic {
        position: relative;
        padding-top: 20px;
        max-width: 1000px;
        width: 50%;
        margin: 0 25%;
        a {
          display: block;
          margin-bottom:13px;
        }
        img {
          width: 100%;
        }
        p {
          margin-top: 0;
          font-size: 18px;
          span {
            color: rgba(255,255,255,0.85);
            font-weight: 400;
            font-family: @font1;
            padding-bottom: 4px;
          }
        }
        p.prompt.small {
          margin-top: 2px;
          font-size: 18px;
        }
        div.horizontalDiv {
          display: none;
          width: 62%;
          height: 0;
          margin: 0 19%;
          border-top: 3px solid rgba(255,255,255,0.25);
        }
        div.horizontalDiv.active {
          display: block;
        }
      }
      div.alphaScreen {
        padding-top: 25px;
        img {
          width: 40%;
          margin: 0px 30%;
        }
        h2 {
          padding: 0 20%;
          margin-top: 30px;
          font-family: @font6;
          color: rgba(255,255,255,0.75);
          font-size: 50px;
          text-align: center;
          font-weight: 300;
          b {
            color: rgba(255,255,255,0.85);
            font-weight: 600;
            font-family: @font5;
          }
        }
        h2.question {
          margin-top: 36px;
          margin-bottom: 8px;
          font-size: 38px;
          line-height: 50px;
          color: @white;
          b {
            color: @white;
          }
        }
        h2.statement {
          text-transform: uppercase;
          padding: 0;
          font-size: 35px;
          line-height: 50px;
          margin-top: 10px;
          margin-bottom: 20px;
          b {
            color: @white;
            font-weight: 600;
            font-family: @font5;
          }
        }
        h2.reservation {
          padding: 0;
          line-height: 42px;
          font-size: 36px;          
          span {
            display: block;
            width: 100%;
            text-align: center;
            font-weight: 400;
            font-family: @font1;
            color: @white;
          }
        }
        p {
          margin-top: 0px;
          font-size: 18px;
          span {
            color: @white;
            font-weight: 400;
            font-family: @font1;
            border-bottom: 2px solid @white;
          }
        }
        p.prompt.no {
          display: none;
        }
        p.prompt.no.active {
          display: block;
          margin: 0;
          font-size: 18px;
        }
        div.buttonContainer {
          height: 200px;
        }
        div.buttonWrapper {
          float: left;
          margin: 50px 0;
          width: 40%;
          height: 140px;
          .radius(5px);
          background: rgba(0,0,0,0.3);
        }
        div.buttonWrapper.yes {
          margin-left: 8%;
          margin-right: 2%;
        }
        div.buttonWrapper.no {
          margin-left: 2%;
          margin-right: 8%;
        }
        button {
          .radius(5px);
          width: 90%;
          height: 79%;
          margin: 5%;
          border: none;
          color: @white;
          font-family: @font5;
          .insetDrop(0;1px;0;0;rgba(255,255,255,0.25);0;1px;1px;0;rgba(0,0,0,0.25));
          span {
            font-weight: 600;
            font-size: 18px;
          }
          span.big {
            width: 100%;
            font-size: 45px;
            line-height: 48px;
            font-family: @font1;
            text-transform: uppercase;
          }
          span.yes {
            width: 100%;
            position: relative;
            top: 3px;
          }
          span.no {
            width: 100%;
            position: relative;
            top: 3px;
          }
        }
        button:focus {
          outline: none;
        }
        button#yes {
          border: 1px solid darken(@brightBlueNew,12%);
          background: @brightBlueNew;
        }
        button#yes:hover {
          border: 1px solid lighten(@brightBlueNew,8%);
          background: lighten(@brightBlueNew,8%);
        }
        button#no {
          border: 1px solid darken(@grey5,4%);
          background: @greyButton;
        }
        button#no:hover {
          border: 1px solid lighten(@grey5,12%);
          background: lighten(@greyButton,8%);
        }
        form#reservationForm {
          width: 50%;
          margin: 30px 25%;
          margin-bottom: 0;
          div.inputWrapper {
            width: 100%;
            height: 360px;
            .radius;
            background: rgba(255,255,255,0.3);
            input[type="email"], input[type="text"] {
              float: left;
              margin: 5px 3%;
              width: 94%;
              font-family: @font6;
              padding: 12px 23px;
              height: 60px;
              border: none;
              font-size: 16px;
              color: @grey6;
              .radius();
              .insetShadow(0;2px;0;0;rgba(0,0,0,0.05));
            }
            button {
              margin: 0 3%;
              margin-top: 5px;
              font-family: @font6;
              width: 94%;
              .radius();
              float: left;
              height: 60px;
              padding: 7px 15px;
              font-size: 18px;
              text-transform: capitalize;
              background: @brightBlueNew;
              position: relative;
            }
            button:hover {
              background: lighten(@brightBlueNew,8%);
            }
            button.btn-disabled {
              background: darken(@brightBlueNew,12%);
              color: @grey3;
            }
          }
        }
        div.socialIcons {
          width: 100%;
          margin-top: 5px;
          padding-top: 20px;
          a, div.wrapper {
            float: left;
            display: block;
            width: 50px;
            height: 50px;
            .radius(64px);
            background: rgba(255,255,255,0.25);
          }
          a:first-child {
            margin-left: 425px;
            margin-right: 10px;
          }
          a:last-child {
            margin-left: 10px;
          }
          i {
            width: 100%;
            text-align: center;
            font-size: 24px;
            padding: 14px 0;
            color: @blueGrey1;
          }
          a:hover {
            background: rgba(0,0,0,0.5);
          }
        }
        div.socialIcons.share {
          border: none;
          max-width: 600px;
          a {
            margin: 0 2.65%;
            .radius(5px);
            height: 52px;
            color: @white;
            font-family: @font6;  
            font-size: 11px;
            text-align: left;
            width: 28%;
            background: @brightBlueNew;
            padding-bottom: 12px;
            div.wrapper {
              background: rgba(0,0,0,0.3);
              width: 30px;
              height: 30px;
              margin-right: 4px;
              i {
                padding: 6px 0;
                font-size: 20px;
              }
            }
            span {
              margin-top: 9px;
            }
            div.email {
              i {
                font-size: 17px;
                padding: 7px 0;
                padding-left: 1px;
              }
            }
          }
          a:hover {
            background: lighten(@brightBlueNew, 8%);
          }
        }
      }
      div.fourohfour-image {
        img {
          width: 30%;
          margin: 25px 35%;
          margin-bottom: 10px;
        }
      }
      div.fourohfour-prompt {
        h2 {
          width: 90%;
          margin: 10px 5%;
          font-size: 40px;
          line-height: 50px;
        }
        p {
          width: 70%;
          margin: 10px 15%;
          font-size: 18px;
        }
        div.btn-holder {
          padding: 5px;
          width: 150px;
          margin-top: 16px;
          a {
            font-size: 20px;
            width: 140px;
          }
        }
      }
      div.socialStatic {
        display: none;
        position: relative;
        max-width: 700px;
        div.horizontalDiv {
          width: 62%;
          height: 0;
          margin: 0 19%;
          margin-bottom: 10px;
          border-top: 3px solid rgba(255,255,255,0.25);
        }
        div.socialIcons {
          width: 100%;
          margin-top: 5px;
          padding-top: 20px;
          a, div.wrapper {
            float: left;
            display: block;
            width: 50px;
            height: 50px;
            .radius(64px);
            background: rgba(255,255,255,0.25);
          }
          a:first-child {
            margin-left: 275px;
            margin-right: 10px;
          }
          a:last-child {
            margin-left: 10px;
          }
          i {
            width: 100%;
            text-align: center;
            font-size: 24px;
            padding: 14px 0;
            color: @blueGrey1;
          }
          a:hover {
            background: rgba(0,0,0,0.5);
          }
        }
      }
      div.socialStatic.active {
        display: block;
      }
      div.alphaScreen.active {
        opacity: 1;
        right: 0;
        display: block;
      }
      div#alphaPage2.alphaScreen.active {
        background: rgba(0,0,0,0.3);
        height: 520px;
      }
      div#alphaPage3.alphaScreen.active {
        background: rgba(0,0,0,0.3);
        height: 369px;
      }
    }
  }
  body.about {
    #mainWrapper {
      #mainContent {
        #aboutTop {
          h1 {
            font-size: 24px;
            line-height: 34px;
          }
        }
        #aboutContainer {
          .leftContainer {
            width: 100%;
          }
          .rightContainer {
            height: auto;
            margin-bottom: 30px;
            padding-top: 20px;
            padding-left: 0;
            width: 100%;
            border-left: none;
            border-top: 1px solid @grey4; 
          }
        }
      }
    }
  }
  body.license {
    background: @white;
    .profile.container {
      margin-top: 45px;
      border: none;
      .noBoxShadow;
      width: 100%;
      height: auto;
    }
  }
  footer.main {
    height: auto;
    p.copyright {
      width: 100%;
      padding-bottom: 3px;
    }
    ul {
      float: none;
    }
  }
  #signup {
    padding: 55px 0;
    h1 {
      font-size: 26px;
    }
    h2 {
      margin-bottom: 0;
      line-height: 30px;
    }
    form {
      margin-top: 0px;
      width: 100%;
      ul.steps {
        width: 80%;
        margin-left: 10%;
        li.step {
          span {
            font-size: 10px;
          }
        }
        li.active {
          span {
            font-size: 12px;
          }
        }
      }
      table.basic {
        margin-top: 0;
        tr {
          height: 66px;
        }
        td {
          margin-top: 43px;
        }
        ul.errorlist {
          top: -21px;
        }
      }
    }
  }
  #signup.selfAssessment {
    table.selfAssessment {
      th {
        margin-top: 35px;
        label {
          font-size: 18px;
        }
      }
    }
  }
  #signup.requirements {
    form {
      #reasons {
        margin-top: 10px;
        ul.reasons {
          margin-top: 0;
          li {
            p {
              width: 82%;
              margin-right: 4%;
              span {
                font-size: 14px;
              }
            }
            div.cbWrapper {
              left: 0;
              float: right;
            }
          }
        }
      }
    }
  }
  .homeNav {
    display: none !important;
  }
  #trust {
    div#IWorthy {
      height: 750px;
      background: @blueDark;
      h2 {
        color: rgba(255,255,255,0.83) !important;
      }
      #reasons {
        display: block;
        padding: 0;
        width: 100%;
        margin-top: 40px;
        ul.reasons {
          width: 80% !important;
          margin-left: 10% !important;
          li {
            height: 150px;
            text-align: left;
            .fontStyle(rgba(255,255,255,0.85);36px;400);
            font-family: @font5 !important;
            img {
              position: relative;
              top: -27px;
              width: 140px;
              margin-right: 25px;
            }
            span {
              .fontStyle(rgba(255,255,255,255.75);18px;400);
            }
          }
        }
      }
    }
    div#VOS {
      .container {
        h2 {
          width: 50%;
        }
        p {
          width: 45%;
          line-height: 26px;
          height: 150px;
          text-align: left;
          .fontStyle(rgba(0,0,0,0.75);20px;400);
        }
        img {
          width: 320px !important;
          bottom: 265px !important;
          right: 10px 1important;
        }
      }
    }
    div#benefits {
      h2 {
        float: right;
        position: relative;
        top: -320px;
        color: rgba(255,255,255,0.83) !important;
      }
      ul.benefits {
        width: 60%;
        float: right;
        position: relative;
        top: -320px;
        margin-right: 10%;
        li {
          .fontStyle(rgba(0,0,0,0.53);16px;400);
          margin: 12px 0;
          border-bottom: 2px solid rgba(255,255,255,0.2);
          padding-bottom: 22px;
          span {
            text-align: center;
            margin-right: 25px;
            margin-top: -4px;
            float: left;
            width: 50px;
            .radius(40px);
            height: 50px;
            line-height: 50px;
            .fontStyle(rgba(255,255,255,0.5);38px;600);
          }
        }
      }
    }
  }
  header.validation {
    nav.container {
      padding: 0;
      #mobileMenu {
        display: block;
        height: 100%;
        button {
          height: 40px;
          padding: 12px 15px;
          background: none;
          border: none;
          border-left: 1px solid @grey5;
          i {
            color: @grey6;
            font-size: 18px;
          }
        }
      }

    }
  }
  #validation {
    padding-top: 0;
    .validationContainer {
      #topBar {
        top: 40px;
        .radius(0);
        ul.nav {
          display: none;
        }
        .content {
          width: 78%;
        }
        .approvedSeal {
          width: 22%;
          img.seal {
            max-width: 180px;
            width: 80%;
            margin: 30px 10%;
            margin-bottom: 0;
          }
          img.logo.mobile {
            max-width: 180px;
            width: 80%;
            margin: 30px 10%;
          }
        }
      }
      img.logo.mobile {
        display: block;
      }
    }
    #feedback.fbForm {
      form.review {
        button#feedbackSubmit {
          float: none;
          width: 72%;
          margin: 0 14%;
          right: 0; 
        }
      }
    }
  }
  header.landingPage {
    nav.container {
      max-width: none;
      ul.navItems {
      }
    }
  }
  #mobile.mobileMenu {
    display: none;
  }
  #mobile.mobileMenu.open {
    position: absolute;
    z-index: 999;
    margin-top: 40px;
    display: block;
    width: 100%;
    background: @white;
    li {
      width: 100%;
      height: 44px;
      border-bottom: 1px solid @grey5;
      a {
        display: block;
        width: 100%;
        height: 100%;
        padding: 10px 8px;
        font-family: @font5;
        font-size: 16px;
        color: @grey7;
      }
      a:hover {
        cursor: pointer;
        text-decoration: none;
        color: @blueGreen;
      }
      a:focus {
        outline: none;
        text-decoration: none;
      }
    }
  }
}

/* Tablet Portrait size to standard 960 (devices and browsers) */
@media only screen and (min-width: 768px) and (max-width: 992px) {
  #validation.popup.new {
    position: relative;
    h2.thanks {
      width: 100%;
      position: absolute;
      top: 40px;
      padding-top: 20px;
      padding-bottom: 10px;
      font-size: 22px;
      margin: 0;
      text-align: center;
      background: @greenGrey1;
      border-bottom: 1px solid @blueGreen;
      color: darken(@blueGreen,15%);
    }
    .mainValidationContainer {
      max-width: 1050px;
      margin-top: 80px;
      height: 502px;
      .left {
        float: left;
        .radius(2px);
        background: @white;
        width: 26%;
        height: 100%;
        padding-top: 15px;
        position: relative;
        border: 1px solid @greenGrey4;
        .brandLogo {
          .boxShadow(1px;1px;2px;rgba(0,0,0,0.8));
          margin: 20px 28px;
          padding: 5px;
          min-height: 140px;
          img {
            width: 100%;
          }
        }
        ul.fbOptions {
          position: relative;
          margin-top: 30px;
          li.option {
            width: 100%;
            margin: 80px 0;
            button {
              text-align: left;
              font-family: @font1;
              .fontStyle(@grey7;13px;500);
              padding-left: 15px;
              padding-top: 0;
              width: 90%;
              margin: 0 5%;
              height: 35px;
              border: none;
              .boxShadow(0;0;0;1px;@greenGrey4);
              .gradientWhiteToGrey;
              i {
                margin-top: 3px;
                font-size: 20px;
                margin-right: 8px;
              }
              i.smileDark {
                height: 20px;
                width: 20px;
                img {
                  width: 20px;
                }
              }

            }
            button:focus {
              outline: none;
            }
            button:hover {
              .boxShadow(0;0;0;1px;@blueGreen);
            }
            button.btn-disabled {
              background: @grey3;
              .boxShadow(0;0;0;1px;@greenGrey4);
              opacity: 0.8;
            }
            .optionBody {
              display: none;
            }
            #commentForm.optionBody {
              display: block;
            }
          }
        }
        ul.fbOptions.unsub {
          li.option {
            margin: 60px 0 !important;
          }
        }
      }
      .left.logo {
        ul.fbOptions {
          li.option {
            margin: 55px 0;
          }
        }
        ul.fbOptions.unsub {
          li.option {
            margin: 20px 0 !important;
          }
        }
      }
      .right {
        .radius(2px);
        background: @white;
        float: left;
        margin-left: 1%;
        width: 73%;
        font-family: @font5;
        border: 1px solid @greenGrey4;
        .headerContainer {
          width: 100%;
          height: 80px;
          border-bottom: 2px solid @blueGreen;
          background: lighten(@blueGreen,5%);
          .topRadius(2px);
          h2 {
            margin: 0;
            position: relative;
            top: 30px;
            left: 10px;
            font-size: 18px;
            color: @white;
          }
          h2.mobile.thanks {
            left: 0;
            display: none;
          }
        }
        .brandInfo {
          padding-left: 30px;
          height: 30px;
          padding-top: 10px;
          a.companyURL {
            float: left;
            color: @grey7;
            font-size: 18px;
          }
          span.activeDate {
            float: right;
            position: relative;
            top: 6px;
            right: 25px;
          }
        }
        ul.reasons {
          margin-top: 25px;
          padding-left: 50px;
          li {
            height: 65px;
            margin-bottom: 25px;
            div.imgHolder {
              float: left;
              padding: 0;
              width: 60px;
              height: 60px;
              background: @white;
              .radius(300px);
              border: 4px solid @blueGreen;
              img {
                width: 80%;
                margin: 10%;
              }
            }
            p {
              font-size: 16px;
              position: relative;
              top: 18px;
              left: 15px;
            }
          }
        }
        div.sealContainer {
          width: 100%;
          height: 95px;
          border-top: 1px solid @greenGrey4;
          padding-top: 5px;
          img.seal {
            float: left;
            width: 24%;
            margin: 10px 1%;
          }
          p {
            float: left;
            margin: 0;
            margin-top: 7px;
            width: 74%;
            font-size: 13px;
          }
          b {
            color: @grey7;
          }
          p.mobile {
            display: none;
          }
        }
      }
    }
    .validationFooter {
		p {
			text-align: center;
			width: 60%;
			margin: 0 20%;
			margin-top: 4px;
			margin-bottom: 10px;
			padding-top: 4px;
			span {
				margin: 0 2px;
				a {
					color: @grey7;
				}
				a:hover {
					color: @grey7;
				}
			}
		}
    }
    .validationContainer {
      z-index: 1001;
      position: absolute;
      top: 10px;
      width: 42%;
      margin: 0 12%;
      .fbForm {
        background: @newBG;
        margin-left: 0;
        display: none;
        div.headerWrapper {
          p.mainPrompt {
            top: 37px;
          }
        }
        div.headerWrapper.logo {
          p.mainPrompt {
            top: 57px;
          }
        }
        form {
          .btn.important {
            margin-right: 155px;
          }
        }
        form#fbComment {
          position: relative;
          top: -30px;
          width: 486px;
          height: 400px;
          border: 1px solid @greenGrey4;
          border-top: none;
          .bottomRadius;
          background: @white;
          h3.complete {
            padding: 0 10px;
            margin-top: 30px;
            line-height: 30px;
            .fontStyle(@blueGreen;28px;400);
            margin-bottom: 10px;
            font-family: @font5;
          }
          textarea {
            padding: 10px 7px;
            width: 70%;
            min-height: 150px;
            .radius;
            color: darken(@grey5,10%);
            border: 1px solid darken(@grey4,10%);
            .insetShadow(0;0;3px;rgba(0,0,0,0.2));
            margin: 0 15%;
            margin-top: 25px;
          }
          textarea:focus {
            outline: none !important;
            border: 1px solid @grey5;
            .insetShadow(0;0;3px;rgba(0,0,0,0.3));
          }
          p.email {
            margin-top: 20px;
            margin-left: 74px;
            input[type="email"] {
              width: 225px;
              padding: 7px 10px;
              margin-left: 5px;
              color: darken(@grey5,10%);
              border: 1px solid darken(@grey4,10%);
              .insetShadow(0;0;3px;rgba(0,0,0,0.2));
            }
            input[type="email"]:focus {
              border: 1px solid @grey5;
              .insetShadow(0;0;3px;rgba(0,0,0,0.3));
            }
            input[type="email"].error {
              border: 1px solid @red1;
            }
          }
          .btn.important {
            width: 250px;
              margin-top: 25px;
              margin-right: 103px !important;
              bottom: -75px !important;
          }
            p.emailError {
              right: 50px;
            width: 50%;
            display: none;
            position: absolute;
            bottom: 125px;
            .fontStyle(@red1;12px;500);
            margin-bottom: 2px;
            line-height: 13px;
            }
            span.email {
            position: absolute;
            bottom: 120px;
            .fontStyle(darken(@grey5,10%);10px;500);
            }
          button:focus {
            outline: none;
          }
          button.disabled {
            background: lighten(@blueGreen,15%);
            color: @grey3;
            cursor: default;
          }
        }
        .seal {
          height: 30px;
          position: absolute;
          right: 0;
          bottom: 9px;
          img {
            height: 30px;
          }
        }
      }
      .unsub.fbForm {
        form.review {
          .btn.important {
            bottom: 50px;
          }
        }
      }
    }
    .validationContainer.nologo {
      .fbForm {
        .seal {
          bottom: 12px;
        }
      }
    }
    .validationContainer.active {
      .fbForm {
        display: block;
      }
    }
  }
}

/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 767px) {
  body.landingPage {
    div#landingPageAlpha {
      div.logoStatic {
        position: relative;
        padding-top: 20px;
        max-width: 1000px;
        width: 50%;
        margin: 0 25%;
        a {
          width: 100%;
          display: block;
          margin-bottom: 10px;
        }
        img {
          width: 100%;
        }
        p {
          margin-top: 0;
          font-size: 18px;
          span {
            color: rgba(255,255,255,0.85);
            font-weight: 400;
            font-family: @font1;
            padding-bottom: 4px;
          }
        }
        p.prompt.small {
          margin-top: 2px;
          font-size: 18px;
        }
        div.horizontalDiv {
          display: none;
          width: 62%;
          height: 0;
          margin: 0 19%;
          border-top: 3px solid rgba(255,255,255,0.25);
        }
        div.horizontalDiv.active {
          display: block;
        }
      }
      div.alphaScreen {
        padding: 0;
        padding-top: 25px;
        img {
          width: 40%;
          margin: 0px 30%;
        }
        h2 {
          padding: 0;
          margin-top: 30px;
          font-family: @font6;
          color: rgba(255,255,255,0.75);
          font-size: 50px;
          text-align: center;
          font-weight: 300;
          b {
            color: rgba(255,255,255,0.85);
            font-weight: 600;
            font-family: @font5;
          }
        }
        h2.question {
          height: 102px;
          padding: 0;
          margin-top: 36px;
          margin-bottom: 0;
          font-size: 36px;
          line-height: 50px;
          color: @white;
          b {
            color: @white;
          }
        }
        h2.statement {
          text-transform: uppercase;
          padding: 0;
          font-size: 30px;
          line-height: 50px;
          margin-top: 10px;
          margin-bottom: 10px;
          b {
            color: @white;
            font-weight: 600;
            font-family: @font5;
          }
        }
        h2.reservation {
          margin-top: 30px;
          margin-bottom: 30px;
          line-height: 38px;
          font-size: 34px;
          span {
            display: block;
            width: 100%;
            text-align: center;
            font-weight: 400;
            font-family: @font1;
            color: @white;
          }
        }
        p {
          margin-top: 0px;
          font-size: 20px;
          span {
            color: @white;
            font-weight: 400;
            font-family: @font1;
            border-bottom: 2px solid @white;
          }
        }
        p.prompt.no {
          display: none;
        }
        p.prompt.no.active {
          display: block;
          margin: 0;
          font-size: 14px;
        }
        p.prompt.enter {
          font-size: 20px;
        }
        div.buttonContainer {
          height: 160px;
        }
        div.buttonWrapper {
          float: left;
          margin: 50px 0;
          width: 40%;
          height: 130px;
          .radius(5px);
          background: rgba(0,0,0,0.3);
        }
        div.buttonWrapper.yes {
          margin-left: 8%;
          margin-right: 2%;
        }
        div.buttonWrapper.no {
          margin-left: 2%;
          margin-right: 8%;
        }
        button {
          .radius(5px);
          width: 90%;
          height: 81%;
          margin: 5%;
          border: none;
          color: @white;
          font-family: @font5;
          .insetDrop(0;1px;0;0;rgba(255,255,255,0.25);0;1px;1px;0;rgba(0,0,0,0.25));
          span {
            font-weight: 600;
            font-size: 16px;
          }
          span.big {
            width: 100%;
            font-size: 38px;
            line-height: 40px;
            font-family: @font1;
            text-transform: uppercase;
          }
          span.yes {
            width: 100%;
            position: relative;
            top: 3px;
          }
          span.no {
            width: 100%;
            position: relative;
            top: 3px;
          }
        }
        button:focus {
          outline: none;
        }
        button#yes {
          border: 1px solid darken(@brightBlueNew,12%);
          background: @brightBlueNew;
        }
        button#yes:hover {
          border: 1px solid lighten(@brightBlueNew,8%);
          background: lighten(@brightBlueNew,8%);
        }
        button#no {
          border: 1px solid darken(@grey5,4%);
          background: @greyButton;
        }
        button#no:hover {
          border: 1px solid lighten(@grey5,12%);
          background: lighten(@greyButton,8%);
        }
        form#reservationForm {
          width: 60%;
          margin: 30px 20%;
          margin-bottom: 0;
          div.inputWrapper {
            width: 100%;
            height: 360px;
            .radius;
            background: rgba(255,255,255,0.3);
            input[type="email"], input[type="text"] {
              float: left;
              margin: 5px 3%;
              width: 94%;
              font-family: @font6;
              padding: 12px 23px;
              height: 60px;
              border: none;
              font-size: 16px;
              color: @grey6;
              .radius();
              .insetShadow(0;2px;0;0;rgba(0,0,0,0.05));
            }
            button {
              margin: 0 3%;
              margin-top: 5px;
              font-family: @font6;
              width: 94%;
              .radius();
              float: left;
              height: 60px;
              padding: 7px 15px;
              font-size: 16px;
              text-transform: capitalize;
              background: @brightBlueNew;
              position: relative;
            }
            button:hover {
              background: lighten(@brightBlueNew,8%);
            }
            button.btn-disabled {
              background: darken(@brightBlueNew,12%);
              color: @grey3;
            }
          }
          a:hover {
            background: lighten(@brightBlueNew, 8%);
          }
        }
      }
      div.fourohfour-image {
        img {
          width: 30%;
          margin: 25px 35%;
          margin-bottom: 10px;
        }
      }
      div.fourohfour-prompt {
        h2 {
          width: 90%;
          margin: 10px 5%;
          font-size: 40px;
          line-height: 50px;
        }
        p {
          width: 70%;
          margin: 10px 15%;
          font-size: 16px;
        }
        div.btn-holder {
          padding: 10px;
          width: 160px;
          margin-top: 16px;
          a {
            font-size: 22px;
            width: 140px;
          }
        }
      }
      div.socialStatic {
        display: none;
        position: relative;
        max-width: 440px;
        div.horizontalDiv {
          width: 62%;
          height: 0;
          margin: 0 19%;
          margin-bottom: 10px;
          border-top: 3px solid rgba(255,255,255,0.25);
        }
        div.socialIcons {
          width: 100%;
          margin-top: 5px;
          padding-top: 20px;
          a, div.wrapper {
            float: left;
            display: block;
            width: 50px;
            height: 50px;
            .radius(64px);
            background: rgba(255,255,255,0.25);
          }
          a:first-child {
            margin-left: 425px;
            margin-right: 10px;
          }
          a:last-child {
            margin-left: 10px;
          }
          i {
            width: 100%;
            text-align: center;
            font-size: 24px;
            padding: 14px 0;
            color: @blueGrey1;
          }
          a:hover {
            background: rgba(0,0,0,0.5);
          }
        }
        div.socialIcons.share {
          border: none;
          max-width: none;
          margin-top: 15px;
          padding: 0;
          a {
            margin: 0 1%;
            .radius(5px);
            height: 42px;
            color: @white;
            font-family: @font6;  
            font-size: 11px;
            text-align: left;
            width: 31%;
            background: @brightBlueNew;
            padding-bottom: 12px;
            padding: 7px 4px;
            div.wrapper {
              background: rgba(0,0,0,0.3);
              width: 26px;
              height: 26px;
              margin-right: 4px;
              i {
                padding: 5px 0;
                font-size: 18px;
              }
            }
            span {
              margin-top: 7px;
            }
            div.email {
              i {
                font-size: 15px;
                padding: 5px 0;
                padding-left: 1px;
              }
            }
          }
          a:hover {
            background: lighten(@brightBlueNew, 8%);
          }
        }
      }
      div.socialStatic {
        display: none;
        position: relative;
        max-width: 440px;
        div.horizontalDiv {
          width: 62%;
          height: 0;
          margin: 0 19%;
          margin-bottom: 10px;
          border-top: 3px solid rgba(255,255,255,0.25);
        }
        div.socialIcons {
          width: 100%;
          margin-top: 5px;
          padding-top: 20px;
          a, div.wrapper {
            float: left;
            display: block;
            width: 50px;
            height: 50px;
            .radius(64px);
            background: rgba(255,255,255,0.25);
          }
          a:first-child {
            margin-left: 145px;
            margin-right: 10px;
          }
          a:last-child {
            margin-left: 10px;
          }
          i {
            width: 100%;
            text-align: center;
            font-size: 24px;
            padding: 14px 0;
            color: @blueGrey1;
          }
          a:hover {
            background: rgba(0,0,0,0.5);
          }
        }
      }
      div.socialStatic.active {
        display: block;
      }
      div.alphaScreen.active {
        opacity: 1;
        right: 0;
        display: block;
      }

      li {
        margin-right: 28px;
        height: 80px;
        float: left;
        img {
          width: 60px;
        }
      }
      li:last-child {
        margin-right: 0;
      }
      li.active {
        a{
          display: none;
        }
        a.select {
          display: block;
        }
        p {
          display: block;
        }
      }
    }
    div.reviewFaceContainer {
      width: 250px;
      height: 250px;
      margin-left: 150px;
      border: 2px solid @blueGreen;
      padding: 10px 30px;
      img {
        width: 190px;
      }
      span {
        width: 190px;
        text-align: center;
        font-size: 20px;
        font-weight: 600;
        color: @grey7;
      }
    }
  }
  div#satisfaction.typeDisplay {
    #selectContainerTicker {
      max-width: 519px;
      padding: 0;
      position: relative;
      p {
        width: 115px;
        text-align: center;
        position: absolute;
        top: 45px;
      }
      p.left {
        left: 0px;
        color: @red1;
      }
      p.middle {
        left: 174px;
        color: darken(@yellow,12%);
      }
      p.right {
        right: 3px;
        color: darken(@green3,20%);
      }
      .selectScore {
        position: absolute;
        margin-left: 2px;
        .heightAndWidth(35px;100%) !important;
        li {
          text-align: center;
          .fontStyle(@grey6;14px;600);
          float: left;
          height: 34px;
          padding-top: 5px;
          margin: 5px;
          .radius(100px);
          border: 1px solid @grey5; 
          background: @red1;
        }
        li.neutral {
          background: darken(@yellow,12%);
        }
        div.recommendNodes {
          top: -3px;
          left: 253px;
          position: absolute;
          height: 48px;
          width: 218px;
          border: 3px solid darken(@green3,20%);
          li {
            background: darken(@green3,20%);
          }
        }
        li:last-child {
          margin-right: 0;
        }
      }
    }
    div.subscriberCountContainer {
      width: 250px;
      height: 175px;
      margin-top: 120px;
      margin-left: 150px;
      border: 2px solid @blueGreen;
      padding: 10px 30px;
      span {
        margin-top: 30px;
        width: 100%;
        text-align: center;
        font-size: 14px;
        font-weight: 600;
        color: darken(@green3,20%);
      }
      span.subscriberCount {
        margin-top: 0;
        width: 100%;
        text-align: center;
        font-size: 26px;
        font-weight: 600;
        color: darken(@green3,20%);
      }
      label {
        width: 100%;
        text-align: center;
        font-size: 18px;
        color: darken(@green3,20%);
      }
    }
  }
  div.tickerContainer {
    width: 80%;
    height: 300px;
    border: 2px solid @blueGreen;
    margin: 0 10%;
    position: relative;
    top: 60px;
    div.ticker {
      display: none;
      width: 240px;
      height: 140px;
      margin-top: 70px;
      margin-left: 254px;
      border: 2px solid @blueGreen;
      position: relative;
      div.tickerHeader {
        width: 100%;
        background: @blueGreen;
        height: 30px;
        position: relative;
        h2 {
          font-family: "Helvetica Neue", sans-serif;
          position: absolute;
          top: 6px;
          margin: 0;
          line-height: 16px;
          height: 30px;
          width: 100%;
          text-align: center;
          font-size: 16px;
          color: @white;
        }
      }
      div.tickerMain {
        position: relative;
        height: 110px;
        label {
          position: absolute;
          top: 6px;
          left: 0;
          width: 100%;
          font-size: 17px;
          text-align: center;
          color: darken(@grey5,5%);
        }
        label.subscribers {
          font-size: 20px;
          top: 38px;
        }
        span.count {
          width: 100%;
          text-align: center;
          color: @grey7;
          position: absolute;
          font-size: 26px;
          font-weight: 600;
          top: 8px;
        }
        .rateit {
          display: block;
          position: absolute;
          left: 0;
          top: 28px;
          margin-left: 33px;
          width: 170px;
        }
        .rateit.small {
          width: 120px;
          display:none;
          margin-left: 28px;
          div.rateit-range{
            background: url('@{base}images/starsSmall.svg');
          }
          div.rateit-selected{
            background: url('@{base}images/starsSmall.svg') left -24px;

          }
          div.rateit-hover{
            background: url('@{base}images/starsSmall.svg') left -24px;
          }
        }
        img.review {
          position: absolute;
          top: 28px;
          margin-left: 92px; 
          width: 50px;
        }
        div.sealWrapper {
          position: absolute;
          bottom: 3px;
          height: 34px;
          width: 100%;
          img.seal {
            position: absolute;
            bottom: 5px;
            height: 25px;
            left: 0;
            margin-left: 49px;
          }
        }
      }
    }
    div.ticker.small {
      width: 180px;
      height: 120px;
      margin-left: 284px;
      div.tickerHeader {
        h2 {
          font-size: 14px;
        }
      }
      div.tickerMain {
        height: 86px;
        label {
          font-size: 15px;
        }
        .rateit.large {
          display: none;
        }
        .rateit.small {
          display: block;
        }
        img.review {
          top: 27px;
          margin-left: 70px;
          width: 35px;
        }
        span.count {
          font-size: 22px;
        }
        label.subscribers {
          top: 35px;
          font-size: 14px;
        }
        div.sealWrapper {
          bottom: 0px;
          height: 28px;
          img.seal {
            bottom: 3px;
            height: 22px;
            margin-left: 25px;
          }
        }
      }
    }
    div.ticker.noBorder {
      border: none;
      padding: 2px;
      div.tickerHeader {
        background: none;
        h2 {
          color: @blueGreen;
        }
      }
    }
    div.ticker.noHeader {
      margin-top: 100px;
      height: 110px;
      div.tickerHeader {
        display: none;
      }
    }
    div.ticker.small.noHeader {
      height: 90px;
    }
    div.ticker.noHeader.noBorder {
    }
    div.ticker.active {
      display: block;
    }
    span.disclaimer {
      position: absolute;
      top: 240px;
      width: 100%;
      text-align: center;
      left: 0;
      font-size: 12px;
      color: darken(@newGreen,20%);
    }
  }
  div.tickerContainer.dark {
    div.ticker {
      border: 2px solid @grey7;
      div.tickerHeader {
        background: @grey7;
      }
      div.tickerMain {
        label {
          color: @grey7;
        }
      }
    }
    div.ticker.noBorder {
      border: none;
      padding: 2px;
      div.tickerHeader {
        background: none;
        h2 {
          color: @grey7;
        }
      }
    }
  }
  div.codeWrapper {
    margin-left: 10%;
    width: 80%;
    margin-top: 75px;
    height: 100px;
    position: relative;
    textarea#code {
      margin-top: 15px;
      height: 150px;
      width: 100%;
      .radius(0);
      border: 2px solid @blueGreen;
      padding: 5px;
      resize: none;
    }
    div.codeLoading {
      position: absolute;
      top: 15px;
      width: 100%;
      height: 150px;
      background: rgba(0,0,0,0.1);
      i {
        display: block;
        position: relative;
        top: 57px;
        width: 100%;
        text-align: center;
        font-size: 30px;
      }
    }
  }
  li#ratings.option {
    max-height: 283px;
  }
}

/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
@media only screen and (min-width: 480px) and (max-width: 767px) {  
  .validationContainer {
    position: absolute;
    margin: 0;
    top: 0;
    width: 100%;
    height: 340px;
    #feedback.fbForm {
      width: 100%;
      top: 4px;
      .radius(0);
      padding: 0;
      height: 340px;
      .headerWrapper.logo {
        display: none;
      }
      form.review {
        width: 100%;
        padding-top: 2px;
        ul.fbOptions {
          width: 100%;
          li.option {
            width: 100%;
            button {
              width: 100%;
            }
            div#commentForm {
              p {
                margin-top: 20px;
                margin-bottom: 24px;
              }
              div#reviewContainer {
                ul.reviewFaces {
                  li {                      
                    margin: 0 2%;
                    width: 16%;
                    a {
                      height: auto;
                      img {
                        width: 100%;
                      }
                    }
                    p {
                      margin: 0 !important;
                      width: 100% !important;
                      font-size: 10px !important;
                      line-height: 12px !important;
                    }
                  }
                }
              }
            }
            ul#fbMetrics {
              margin: 10px 15%;
              li {
                height: 42px;
                padding: 0 5%;
                label {
                  width: 80px;
                  font-size: 14px;
                }
                .rateit {
                  top: 4px;
                  float: right;
                }
                div.value {
                  display: none !important;
                }
              }
            }
            div#recommendScore {
              p.prompt {
                top: 15px;
              }
              div#selectContainer {
                p.left {
                  margin-left: 15px;
                }
                p.right {
                  margin-right: 13px;
                }
                ul.selectScore {
                  li {
                    padding-top: 0.7%;
                  }
                }
              }
            }
            div#survey.optionBody {
              h4.question {
                font-size: 14px;
                line-height: 20px;
                margin-bottom: 2px;
              }
              ul.reasons {
                height: 198px;
                padding: 0;
                li {
                  width: 100%;
                  margin: 4px 0;
                  height: 27px;
                  p {
                    margin: 0;
                    margin-top: 5px;
                  }
                }
              }
            }
          }
        }
        button#feedbackSubmit.btn.important {
          bottom: 94px;
          width: 72%;
          margin: 0 14%;
          float: none;
          right: 0;
        }
      }

      form#fbComment {
        width: 100%;
        height: 340px;
        top: -9px;
        h3.complete {
          font-size: 20px;
        }
        textarea {
          width: 80%;
          margin: 0 10%;
          margin-top: 15px;
        }
        p.email {
          width: 80%;
          margin: 0 10%;
          margin-top: 15px;
          input {
            width: 98%; 
            margin: 0 1%;
          }
        }
        button#commentSubmit.btn.important {
          width: 72% !important;
          margin: 0 14% !important;
          positin: relative !important;
          right: 0 !important;
          bottom: -59px !important;
        }
        span#commentCounter {
          bottom: -5px
        }
      }
      div.seal {
        bottom: 25px;
        width: 30%;
        margin: 0 35%;
        img {
          height: auto;
          width: 100%;
        }
      }
    }
    #feedback.fbForm.unsub {
      div.headerWrapper {
        display: none;
      }
      form.review {
        button#feedbackSubmit.btn.important {
          bottom: 218px;
        }
      }
      div.seal {
        bottom: 145px;
      }
    }
  }
  #validation.popup.new {
    height: 100%;
    overflow: hidden;
    h2.thanks {
      display: none! important;
    }
    .mainValidationContainer {
      position: relative;
      top: -40px;
      width: 100%;
      padding: 0;
      .left {
        display: none;
      }
      div.right {
        width: 100%;
        margin-left: 0;
        div.headerContainer {
          padding: 0;
          h2 {
            display: none;
          }
          h2.mobile.thanks {
            display: block !important;
            top: 0;
            width: 100%;
            text-align: center;
            padding: 18px 25px;
            line-height: 22px;
            font-size: 16px;
            color: @blueGreen;
          }
        }
        div.brandInfo {
          padding: 5px 0;
          a.companyURL {
            font-size: 12px;
            margin-left: 10px;
          }
          span.activeDate {
            font-size: 12px;
            top: 0;
            right: 10px;
          }
        }
        ul.reasons {
          padding-left: 10px;
          margin-top: 5px;
          li {
            height: 50px;
            margin: 0 12%;
            margin-bottom: 20px;
            width: 64%;
            div.imgHolder {
              height: 50px;
              width: 50px;
            }
            p {
              display: table-cell; 
              vertical-align: middle;
              height: 50px;
              top: 0;
              font-size: 12px !important;
            }
          }
        }
        div.sealContainer {
          padding-top: 5px;
          height: auto;
          img.seal {
            display: none;
          }
          p {
            display: none;
          }
          p.mobile {
            width: 70%;
            float: right;
            margin-right: 15%;
            font-size: 12px;
            padding: 0 5px;
            display: block;
            text-align: center;
            margin-bottom: 5px;
            span.license {
              font-size: 10px;
              a {
              	color: #333 !important
              }
            }
            span {
              display: block;
            }
          }
        }
      }
    }
    div.validationFooter.container {
      display: none;
    }
  }   
}

/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (max-width: 479px) {
	header {
		border-bottom: 1px solid #c7dadf;
		#logo.mobile {
			display: block;
			float: none;
			margin: auto;
			margin-top: -1px;
			width: 199px;		}
		#logo.desktop {
			display: none;
		}
	}
  .validationContainer {
    position: absolute;
    margin: 0;
    top: 0;
    width: 100%;
    height: 340px;
    #feedback.fbForm {
      width: 100%;
      top: 4px;
      .radius(0);
      padding: 0;
      height: 340px;
      .headerWrapper {
        display: none;
      }
      form.review {
        width: 100%;
        padding-top: 2px;
        ul.fbOptions {
          width: 100%;
          max-height: 358px;
          overflow: hidden;
          li.option {
            width: 100%;
            button {
              width: 100%;
            }
            div#commentForm {
              height: 195px;
              p {
                font-size: 17px !important;
                margin-top: 20px;
                margin-bottom: 24px;
              }
              div#reviewContainer {
                ul.reviewFaces {
                  li {                      
                    margin: 0 2%;
                    width: 16%;
                    a {
                      height: auto;
                      img {
                        width: 100%;
                      }
                    }
                    p {
                      margin: 0 !important;
                      width: 100% !important;
                      font-size: 10px !important;
                      line-height: 12px !important;
                    }
                  }
                }
              }
            }
            ul#fbMetrics {
            	margin: 0 !important;
              p.prompt {
                font-size: 17px !important
              }
              li {
                height: 42px;
                padding: 0 5%;
                label {
                  width: 80px;
                  font-size: 14px;
                }
                .rateit {
                  top: 4px;
                  float: right;
                }
                div.value {
                  display: none !important;
                }
              }
            }
            div#recommendScore {
              p.prompt {
              	padding: 15px 5px;
                top: 1px;
                font-size: 17px !important;
                display: table-cell;
                vertical-align: middle
              }
              div#selectContainer {
                p.left {
                  margin-left: 15px;
                }
                p.right {
                  margin-right: 13px;
                }
                ul.selectScore {
                  li {
                    padding-top: 0.7%;
                  }
                }
              }
            }
            div#survey.optionBody {
              h4.question {
                font-size: 14px;
                line-height: 20px;
                margin-bottom: 2px;
              }
              ul.reasons {
                height: 198px;
                padding: 0;
                li {
                  width: 100%;
                  margin: 4px 0;
                  height: 27px;
                  p {
                    margin: 0;
                    margin-top: 2px;
                  }
                }
              }
            }
          }
        }
        button#feedbackSubmit.btn.important {
          bottom: 260px;
          float: none;
          width: 72%;
          margin: 0 14%;
          right: 0;
        }
      }

      form#fbComment,form#fbCoupon {
        width: 100%;
        height: 341px;
        top: -6px;
        h3.complete {
          line-height: 28px;
          font-size: 18px;
          max-height: 60px;
          margin-top: 7px;
        }
        textarea {
          width: 80%;
          margin: 0 10%;
          margin-top: 15px;
        }
        span#commentCounter {
          bottom: -5px
        }
        div.commentSection {
          height: 185px;
        }
        p.email {
          width: 80%;
          margin: 0 10%;
          margin-top: 20px;
          input {
            width: 98%; 
            margin: 0 1%;
          }
        }
        button#commentSubmit.btn.important {
          width: 72% !important;
          margin: 0 14% !important;
          positin: relative !important;
          right: 0 !important;
          bottom: -49px !important;
        }
      }
      div.seal {
        bottom: 225px;
        width: 40%;
        margin: 0 30%;
        img {
          height: auto;
          width: 100%;
        }
      }

    }
    #feedback.fbForm.unsub {
      form.review {
        button#feedbackSubmit.btn.important {
          bottom: 230px;
        }
      }
      div.seal {
        bottom: 180px;
      }
    }
  }
  .validationContainer.nologo {
    #feedback.fbForm {
      form.review {
        button#feedbackSubmit.btn.important {
          bottom: 200px;
        }
      }

	 div.seal {
	  	bottom: 164px !important;
	  }
    }
  }
  body.landingPage.new {
    header.landingPage {
      display: none;
      nav.container {
        ul.navItems {
          margin-top: 2px;
          li {
            a {
              font-size: 8px;
            }
          }
        }
      }
    }
    div#videoHolder {
      #backVideo {
        min-width: 0;
      }
    }
    div#landingPageAlpha {
      div.logoStatic {
        position: relative;
        padding-top: 20px;
        max-width: 1000px;
        width: 80%;
        margin: 0 10%;
        a {
          width: 100%;
          display: block;
          margin-bottom: 10px;
        }
        img {
          width: 100%;
        }
        p {
          margin-top: 0;
          font-size: 18px;
          span {
            color: rgba(255,255,255,0.85);
            font-weight: 400;
            font-family: @font1;
            padding-bottom: 4px;
          }
        }
        p.prompt.small {
          margin-top: 2px;
          font-size: 12px;
        }
        div.horizontalDiv {
          display: none;
          width: 62%;
          height: 0;
          margin: 0 19%;
          border-top: 3px solid rgba(255,255,255,0.25);
        }
        div.horizontalDiv.active {
          display: block;
        }
      }
      div.alphaScreen {
        padding: 0;
        padding-top: 25px;
        img {
          width: 40%;
          margin: 0px 30%;
        }
        h2 {
          padding: 0;
          margin-top: 30px;
          font-family: @font6;
          color: rgba(255,255,255,0.75);
          font-size: 28px;
          text-align: center;
          font-weight: 300;
          b {
            color: rgba(255,255,255,0.85);
            font-weight: 600;
            font-family: @font5;
          }
        }
        h2.question {
          padding: 0;
          margin-top: 26px;
          margin-bottom: 0;
          font-size: 28px;
          line-height: 38px;
          height: auto;
          color: @white;
          b {
            color: @white;
          }
        }
        h2.statement {
          text-transform: uppercase;
          padding: 0;
          font-size: 28px;
          line-height: 34px;
          margin-top: 5px;
          margin-bottom: 10px;
          b {
            color: @white;
            font-weight: 600;
            font-family: @font5;
          }
        }
        h2.reservation {
          margin-top: 5px;
          margin-bottom: 10px;
          line-height: 34px;
          font-size: 28px;
          span {
            display: block;
            width: 100%;
            text-align: center;
            font-weight: 400;
            font-family: @font1;
            color: @white;
          }
        }
        p {
          margin-top: 0px;
          font-size: 20px;
          span {
            color: @white;
            font-weight: 400;
            font-family: @font1;
            border-bottom: 2px solid @white;
          }
        }
        p.prompt.no {
          display: none;
        }
        p.prompt.enter {
          font-size: 18px;
        }
        p.prompt.no.active {
          display: block;
          margin: 0;
          font-size: 14px;
        }
        div.buttonContainer {
          height: 120px;
          margin-top: 30px;
        }
        div.buttonWrapper {
          float: left;
          margin: 30px 0;
          margin-top: 20px;
          width: 49%;
          height: 90px;
          .radius(5px);
          background: rgba(0,0,0,0.3);
        }
        div.buttonWrapper.yes {
          margin-left: 0;
          margin-right: 1%;
        }
        div.buttonWrapper.no {
          margin-left: 1%;
          margin-right: 0;
        }
        button {
          .radius(5px);
          width: 90%;
          height: 82%;
          margin: 5%;
          border: none;
          color: @white;
          font-family: @font5;
          .insetDrop(0;1px;0;0;rgba(255,255,255,0.25);0;1px;1px;0;rgba(0,0,0,0.25));
          span {
            font-weight: 600;
            font-size: 10px;
          }
          span.big {
            width: 100%;
            font-size: 28px;
            line-height: 32px;
            font-family: @font1;
            text-transform: uppercase;
          }
          span.yes {
            width: 100%;
            position: relative;
            top: 3px;
          }
          span.no {
            width: 100%;
            position: relative;
            top: 3px;
          }
        }
        button:focus {
          outline: none;
        }
        button#yes {
          border: 1px solid darken(@brightBlueNew,12%);
          background: @brightBlueNew;
        }
        button#yes:hover {
          border: 1px solid lighten(@brightBlueNew,8%);
          background: lighten(@brightBlueNew,8%);
        }
        button#no {
          border: 1px solid darken(@grey5,4%);
          background: @greyButton;
        }
        button#no:hover {
          border: 1px solid lighten(@grey5,12%);
          background: lighten(@greyButton,8%);
        }
        form#reservationForm {
          width: 100%;
          margin: 25px 0;
          margin-bottom: 0;
          div.inputWrapper {
            width: 100%;
            height: 310px;
            .radius;
            background: rgba(255,255,255,0.3);
            input[type="email"], input[type="text"] {
              float: left;
              margin: 5px 3%;
              width: 94%;
              font-family: @font6;
              padding: 12px 23px;
              height: 50px;
              border: none;
              font-size: 14px;
              color: @grey6;
              .radius();
              .insetShadow(0;2px;0;0;rgba(0,0,0,0.05));
            }
            button {
              margin: 0 3%;
              margin-top: 5px;
              font-family: @font6;
              width: 94%;
              .radius();
              float: left;
              height: 50px;
              padding: 7px 15px;
              font-size: 14px;
              text-transform: capitalize;
              background: @brightBlueNew;
              position: relative;
            }
            button:hover {
              background: lighten(@brightBlueNew,8%);
            }
            button.btn-disabled {
              background: darken(@brightBlueNew,12%);
              color: @grey3;
            }
          }
        }
        div.socialIcons {
          width: 100%;
          margin-top: 5px;
          padding-top: 20px;
          a, div.wrapper {
            float: left;
            display: block;
            width: 50px;
            height: 50px;
            .radius(64px);
            background: rgba(255,255,255,0.25);
          }
          a:first-child {
            margin-left: 425px;
            margin-right: 10px;
          }
          a:last-child {
            margin-left: 10px;
          }
          i {
            width: 100%;
            text-align: center;
            font-size: 24px;
            padding: 14px 0;
            color: @blueGrey1;
          }
          a:hover {
            background: rgba(0,0,0,0.5);
          }
        }
        div.socialIcons.share {
          border: none;
          width: 70%;
          margin: 0 15%;
          padding: 0;
          a {
            margin: 10px 0;
            .radius(5px);
            height: 46px;
            color: @white;
            font-family: @font6;  
            font-size: 11px;
            text-align: left;
            width: 100%;
            background: @brightBlueNew;
            padding-bottom: 12px;
            div.wrapper {
              background: rgba(0,0,0,0.3);
              width: 30px;
              height: 30px;
              margin-right: 4px;
              i {
                padding: 6px 0;
                font-size: 20px;
              }
            }
            span {
              margin-top: 8px;
            }
            div.email {
              i {
                font-size: 17px;
                padding: 7px 0;
                padding-left: 1px;
              }
            }
          }
          a:hover {
            background: lighten(@brightBlueNew, 8%);
          }
        }
      }
      div.fourohfour-image {
        img {
          width: 60%;
          margin: 25px 20%;
          margin-bottom: 10px;
        }
      }
      div.fourohfour-prompt {
        h2 {
          width: 80%;
          margin: 10px 10%;
          font-size: 24px;
          line-height: 34px;
        }
        p {
          width: 80%;
          margin: 10px 10%;
          font-size: 12px;
        }
        div.btn-holder {
          padding: 5px;
          width: 140px;
          margin-top: 10px;
          a {
            font-size: 14px;
            width: 130px;
          }
        }
      }
      div.socialStatic {
        display: none;
        position: relative;
        max-width: 330px;
        div.horizontalDiv {
          width: 62%;
          height: 0;
          margin: 0 19%;
          margin-bottom: 10px;
          border-top: 3px solid rgba(255,255,255,0.25);
        }
        div.socialIcons {
          width: 100%;
          margin-top: 5px;
          padding-top: 20px;
          a, div.wrapper {
            float: left;
            display: block;
            width: 50px;
            height: 50px;
            .radius(64px);
            background: rgba(255,255,255,0.25);
          }
          a:first-child {
            margin-left: 90px;
            margin-right: 10px;
          }
          a:last-child {
            margin-left: 10px;
          }
          i {
            width: 100%;
            text-align: center;
            font-size: 24px;
            padding: 14px 0;
            color: @blueGrey1;
          }
          a:hover {
            background: rgba(0,0,0,0.5);
          }
        }
      }
      div.socialStatic.active {
        display: block;
      }
      div.alphaScreen.active {
        opacity: 1;
        right: 0;
        display: block;
      }

      div#alphaPage2.alphaScreen.active, div#alphaPage3.alphaScreen.active {
        background: rgba(0,0,0,0.3);
        height: auto;
        background: rgba(0,0,0,0.3);
      }
      div#alphaPage3.alphaScreen.active {
        height: auto;
        p {
          font-size: 18px;
        }
      }
    }
  }
  header.home.wizard {
    nav.container {
      width: 295px;
    }
  }
  body.about {
    #mainWrapper {
      #mainContent {
        #aboutTop {
          padding: 1px 8px;
          h1 {
            width: 80%;
            margin: 25px 10%;
            font-size: 26px;
            line-height: 28px;
          }
        }
        #aboutContainer {
          .leftContainer {
            h2 {
              font-size: 20px; 
            }
            p {
              font-size: 14px !important;
            }
          }
          .rightContainer {
            height: auto;
            margin-bottom: 30px;
            padding-top: 20px;
            width: 100%;
            border-left: none;
            border-top: 1px solid @grey4; 
            .seal.container {
              width: 200px;
            }
          }
        }
      }
    }
  }
  footer.main {
    ul {
      li {
        width: 25%;
        padding: 5px 0;
        a {
          display: block;
          width: 100%;
          text-align: center;
        }
      }
      li:last-child {
        width: 100%;
      }
    }
  }
  #signup {
    padding: 45px 0;
    form{
      .container.sealImg {
        margin-top: 10px;
      }
      ul.steps {
        display: none;
      }
      h1 {
        font-size: 22px;
      }
      h2 {
        display: none;
      }
      label.mobile {
        span {
          color: @grey1;
        }
        .radius;
        padding: 5px 0;
        background: @blueGreen;
        margin-top: 15px;
        margin-bottom: 15px;
        display: block;
        width: 100%;
        text-align: center;
        .fontStyle(@white;18px;500);
        .textShadow(0;0;1px;rgba(255,255,255,0.3));
        border-bottom: 2px solid @grey3;
      }
    }
  }
  #signup.requirements {
    form {
      .container.sealImg {
        margin-top: 15px;
        margin-bottom: 0px;
      }
      #reasons {
        margin-top: -30px;
        width: 90%;
        margin-left : 5%;
        ul.reasons {
          position: relative;
          top: 8px;
          margin-top: 0;
          li {
            p {
              width: 82%;
              font-size: 14px;
              img {
                position: relative;
                top: 2px;
                margin-bottom: 20px;
                width: 50px;
              }
              span {
                font-size: 12px;
              }
            }
          }
        }
      }
    }
    .button.container {
      margin-bottom: 0;
      position: relative;
      top: -20px;
    }
  }
  #signup.selfAssessment {
    form {
      .container.sealImg {
        margin-top: 15px;
        margin-bottom: 0px;
      }
    }
    table.selfAssessment {
      margin-top: -40px;
      tr:nth-child(3), tr:nth-child(4), tr:last-child {
        th {
          label {
            position: relative;
            top: 20px;
          }
        }
      }
      th {
        margin-top: 30px;
        top: 0;
        label {
          font-size: 16px;
        }
      }
      ul {
        top: 108px;
        left: 40px;
        li {
          position: absolute;
          width: 150px;
          left: 70px;
          float: none;
          label {
            left: 0;
            text-align: left;
          }
        }
        li:nth-child(2) {
          top: 182px;
        }
        li:nth-child(3) {
          top: 136px;
        }
        li:nth-child(4) {
          top: 90px;
        }
        li:nth-child(5) {
          top: 44px;
        }
      }
    }
    ul.cb {
      left: 40px;
      position: relative;
      li {
        position: absolute;
        float: none;
        margin: 10px 0;
      }
      li:nth-child(2) {
        top: 182px;
      }
      li:nth-child(3) {
        top: 136px;
      }
      li:nth-child(4) {
        top: 90px;
      }
      li:nth-child(5) {
        top: 44px;
      }
      div.count {
        left: -40px;
        top: -11px;
        p {
          font-size: 14px;
        }
      }
    }
    .navButtons {
      li.right, li.left {
        top: 30px;
        a {
          font-size: 45px;
        }
      }
    }
    .button.container {
      margin-top: 40px;
      position: relative;
      top: 50px;
    }
  }
  .checkBox.hover {
    background: @lightGreen2;
    i {
      display: none;
    }
  }
  #signup.requirements {
    div.cbWrapper {
      z-index: 1001;
    }
  }
  #validation.popup.new {
    height: 100%;
    overflow: hidden;
    h2.thanks {
      display: none! important;
    }
    .mainValidationContainer {
      position: relative;
      top: -40px;
      width: 100%;
      padding: 0;
      .left {
        display: none;
      }
      div.right {
        width: 100%;
        margin-left: 0;
        div.headerContainer {
          padding: 0;
          h2 {
            display: none;
          }
          h2.mobile.thanks {
            display: block !important;
            top: 0;
            width: 100%;
            text-align: center;
            padding: 18px 25px;
            line-height: 22px;
            font-size: 16px;
            color: @blueGreen;
          }
        }
        div.brandInfo {
          padding: 5px 0;
          a.companyURL {
            font-size: 12px;
            margin-left: 10px;
          }
          span.activeDate {
            font-size: 12px;
            top: 0;
            right: 10px;
          }
        }
        ul.reasons {
          padding-left: 10px;
          margin-top: 5px;
          li {
            height: 50px;
            margin: 0 12%;
            margin-bottom: 20px;
            width: 64%;
            div.imgHolder {
              height: 50px;
              width: 50px;
            }
            p {
              display: table-cell; 
              vertical-align: middle;
              height: 50px;
              top: 0;
              font-size: 12px !important;
            }
          }
        }
        div.sealContainer {
          padding-top: 5px;
          height: auto;
          img.seal {
            display: none;
          }
          p {
            display: none;
          }
          p.mobile {
            width: 70%;
            float: right;
            margin-right: 15%;
            font-size: 12px;
            padding: 0 5px;
            display: block;
            text-align: center;
            margin-bottom: 5px;
            span.license {
              font-size: 10px;
              a {
              	color: #333 !important
              }
            }
            span {
              display: block;
            }
          }
        }
      }
    }
    div.validationFooter.container {
      display: none;
    }
  }
  /* Initial Login Wizard */
  body.initial {
    background: lighten(@bgBlue,15%);
    .profile.container {
      width: 100%;
      padding: 0;
      .radius(0);
      .noBoxShadow;
      margin-top: 50px;
      margin-bottom: 0;
      border: none;
      height: auto;
      padding-bottom: 20px;
      .header {
        width: 100%;
        padding: 4px 30px;
        background: lighten(@blueGreen,7%);
        h2 {
          margin-top: 13px;
          .fontStyle(@white;20px;400);
        }
      }
      ul.steps {
        width: 80%; 
        margin: 0 10%;
        li.step {
          .wrapper {
            p {
              text-align: center;
              padding: 8px;
              .fontStyle(@grey6;18px;600);
            }
          }
          span {
            text-transform: uppercase;
            text-align: center;
            width: 200px;
            position: relative;
            top: 8px;
            left: -80px;
            .fontStyle(darken(@bgBlue,15%);10px;600);
          }
        }
        li.complete {
          .insetShadow(0;0;1px;1px;lighten(@green,2%));
          .wrapper {
            background: lighten(@green,12%);
            p {
              .fontStyle(@white;18px;600);
            }
          }
        }
        li.active {
          .insetShadow(0;0;1px;1px;lighten(@green,2%));
          .wrapper {
            background: @green;
            p {
              .fontStyle(@white;18px;600);
            }
          }
          span {
            color: @green;
          }
        }
      }
      div.prompt {
        display: none;
        float: left;
        margin-top: 90px;
        padding: 0px;
        width: 100%;
        div#continue {
          width: 100%;
          border-top: 1px solid @grey4;
          padding-top: 20px;
          button.btn.important {
            float: right;
            margin-right: 5%;
            background: @blueGreen;
            width: 150px;
          }
          button.btn.important.btn-disabled {
            color: @grey2;
            background: lighten(@blueGreen,20%);
            .noBoxShadow;
          }
        }
      }
      div#license {
        display: block;
        div#agreementHolder {
          width: 90%;
          margin: 0 5%;
          p.prompt {
            font-family: @font5;
            margin-top: 20px;
            margin-bottom: 15px;
            width: 100%;
            text-align: center;
          }
          div#agreement {
            border: 1px solid @grey4;
            padding: 10px;
            width: 100%;
            background: @white;
            height: 250px;
            overflow-y: scroll;
            h3 {
              margin-left: 0;
              .fontStyle(@grey7;14px;400);
            }
          }
        }
        div#accountForm {
          width: 100%;
          div#tos {
            margin-top: 9px;
            margin-left: 5%;
            label {
              float: right;
              width: 95%;
              position: relative;
              top: 1px;
              font-family: @font5;
            }
          }
        }
        div#continue {
          margin-top: 28px;
        }
      }
      div#password {
        position: relative;
        div#passwordFormHolder {
          width: 96%;
          margin: 0 2%;
          #passwordForm {
            float: left;
            width: 60%;
            position: relative;
            top: 40px;
            label {
              margin-top: 10px;
              margin-left: 10%;
            }
            input {
              margin-left: 10%;
              width: 80%;
              height: 40px;
              .insetShadow(0;1px;2px;rgba(0,0,0,0.15));
            }
            input:hover {
              border: 1px solid @grey5;
              .insetShadow(0;0;2px;lighten(@green,10%));
            }
            input:focus {
              border: 1px solid @grey6;
              outline: none;
              .insetShadow(0;0;1px;2px;lighten(@green,22%));
            }
            input[disabled] {
              border: 1px solid @grey5;
              .noBoxShadow;
              background: @grey2;
            }
            i.fa-check-circle {
              float: right;
              position: relative;
              top: 9px;
              right: -4px;
              color: @blueGreen;
              font-size: 24px;
            }
          }
          div#pwReqs {
            float: left;
            width: 34%;
            padding: 0 15px;
            margin-top: 60px;
            h4 {
              .fontStyle(@bgBlue;14px;600);
            }
            ul.pwReqs {
              margin-left: 10px;
              li {
                .fontStyle(@grey5;12px;400);
              }
            }
          }
        }
      }
      div#sealInstall {
        position: relative;
        top: 100px;
        div#codeHolder {
          width: 90%;
          margin: 0 5%;
          p.prompt {
            font-family: @font5;
            margin-top: 20px;
            margin-bottom: 15px;
            margin-left: 3%;
            width: 94%;
          }
          a.seal {
            margin-top: 25px;
            margin-bottom: 15px;
            margin-left: 325px;
          }
          textarea.code {
            margin-top: 15px;
            margin-left: 3%;
            width: 94%;
            .radius;
            border: 1px solid @grey5;
            padding: 5px;
          }
        }
        div#continue {
          position: absolute;
          bottom: -210px;
        }
      }
    }
  }
  body.topLevel {
    form[name="emailForm"] {
      .fsPage {
        label.email {
          font-size: 12px;
          width: 100%;
          text-align: center;
        }
        input[type="email"] {
          font-size: 12px;
        }
      }
    }
  }
}

/* Small Phone */
@media only screen and (max-width: 329px) { 
  body.landingPage.new {
    header.landingPage {
      nav.container {
        ul.navItems {
          margin-top: 2px;
          li {
            a {
              font-size: 8px;
            }
          }
        }
      }
    }
    div#videoHolder {
      #backVideo {
        min-width: 0;
      }
    }
    div#landingPageAlpha {
      div.logoStatic {
        position: relative;
        padding-top: 20px;
        max-width: 1000px;
        width: 80%;
        margin: 0 10%;
        a {
          display: block;
          width: 100%;
          margin-bottom: 8px;
        }
        img {
          width: 100%;
        }
        p {
          margin-top: 0;
          font-size: 12px;
          span {
            color: rgba(255,255,255,0.85);
            font-weight: 400;
            font-family: @font1;
            padding-bottom: 4px;
          }
        }
        p.prompt.small {
          margin-top: 2px;
          font-size: 12px;
        }
        div.horizontalDiv {
          display: none;
          width: 62%;
          height: 0;
          margin: 0 19%;
          border-top: 3px solid rgba(255,255,255,0.25);
        }
        div.horizontalDiv.active {
          display: block;
        }
      }
      div.alphaScreen {
        padding: 0;
        padding-top: 10px;
        img {
          width: 40%;
          margin: 0px 30%;
        }
        h2 {
          padding: 0;
          margin-top: 30px;
          font-family: @font6;
          color: rgba(255,255,255,0.75);
          font-size: 28px;
          text-align: center;
          font-weight: 300;
          b {
            color: rgba(255,255,255,0.85);
            font-weight: 600;
            font-family: @font5;
          }
        }
        h2.question {
          height: auto;
          padding: 0;
          margin-top: 28px;
          margin-bottom: 0;
          font-size: 24px;
          line-height: 34px;
          color: @white;
          b {
            color: @white;
          }
        }
        h2.statement {
          text-transform: uppercase;
          padding: 0;
          font-size: 24px;
          line-height: 30px;
          margin: 0;
          margin-top: 7px;
          margin-bottom: 7px;
          b {
            color: @white;
            font-weight: 600;
            font-family: @font5;
          }
        }
        h2.reservation {
          margin-top: 5px;
          line-height: 28px;
          font-size: 22px;
          margin-bottom: 10px;
          span {
            display: block;
            width: 100%;
            text-align: center;
            font-weight: 400;
            font-family: @font1;
            color: @white;
          }
        }
        p {
          margin-top: 0px;
          font-size: 17px;
          line-height: 20px;
          padding: 0 10%;
          span {
            color: @white;
            font-weight: 400;
            font-family: @font1;
            padding-bottom: 2px;
            border-bottom: 2px solid @white;
          }
        }
        p.prompt.no {
          display: none;
        }
        p.prompt.enter {
          font-size: 16px;
          padding: 0;
        }
        p.prompt.no.active {
          display: block;
          margin: 0;
          font-size: 16px;
        }
        p.prompt.no.sorry { 
          a {
            font-size: 0.5em;
            color: @grey3;
          }
          a:hover {
            color: @grey4;
          }
        }
        div.buttonContainer {
          height: 110px;
        }
        div.buttonWrapper {
          float: left;
          margin: 20px 0;
          width: 48%;
          height: 90px;
          .radius(5px);
          background: rgba(0,0,0,0.3);
        }
        div.buttonWrapper.yes {
          margin-left: 0;
          margin-right: 1%;
        }
        div.buttonWrapper.no {
          margin-left: 1%;
          margin-right: 0;
        }
        button {
          .radius(5px);
          width: 90%;
          height: 86%;
          margin: 5%;
          border: none;
          color: @white;
          font-family: @font5;
          .insetDrop(0;1px;0;0;rgba(255,255,255,0.25);0;1px;1px;0;rgba(0,0,0,0.25));
          span {
            font-weight: 600;
            font-size: 10px;
          }
          span.big {
            width: 100%;
            font-size: 28px;
            line-height: 32px;
            font-family: @font1;
            text-transform: uppercase;
          }
          span.yes {
            width: 100%;
            position: relative;
            top: 3px;
          }
          span.no {
            width: 100%;
            position: relative;
            top: 3px;
          }
        }
        button:focus {
          outline: none;
        }
        button#yes {
          border: 1px solid darken(@brightBlueNew,12%);
          background: @brightBlueNew;
        }
        button#yes:hover {
          border: 1px solid lighten(@brightBlueNew,8%);
          background: lighten(@brightBlueNew,8%);
        }
        button#no {
          border: 1px solid darken(@grey5,4%);
          background: @greyButton;
        }
        button#no:hover {
          border: 1px solid lighten(@grey5,12%);
          background: lighten(@greyButton,8%);
        }
        form#reservationForm {
          width: 100%;
          margin: 10px 0;
          margin-bottom: 0;
          div.inputWrapper {
            width: 100%;
            height: 260px;
            margin-bottom: 20px;
            .radius;
            background: rgba(255,255,255,0.3);
            input[type="email"], input[type="text"] {
              float: left;
              margin: 5px 3%;
              width: 94%;
              font-family: @font6;
              padding: 12px 23px;
              height: 40px;
              border: none;
              font-size: 12px;
              color: @grey6;
              .radius();
              .insetShadow(0;2px;0;0;rgba(0,0,0,0.05));
            }
            button {
              margin: 0 3%;
              margin-top: 5px;
              font-family: @font6;
              width: 94%;
              .radius();
              float: left;
              height: 40px;
              padding: 12px 15px;
              font-size: 14px;
              text-transform: capitalize;
              background: @brightBlueNew;
              position: relative;
            }
            button:hover {
              background: lighten(@brightBlueNew,8%);
            }
            button.btn-disabled {
              background: darken(@brightBlueNew,12%);
              color: @grey3;
            }
          }
        }
        div.socialIcons {
          width: 100%;
          margin-top: 5px;
          padding-top: 20px;
          a, div.wrapper {
            float: left;
            display: block;
            width: 50px;
            height: 50px;
            .radius(64px);
            background: rgba(255,255,255,0.25);
          }
          a:first-child {
            margin-left: 425px;
            margin-right: 10px;
          }
          a:last-child {
            margin-left: 10px;
          }
          i {
            width: 100%;
            text-align: center;
            font-size: 24px;
            padding: 14px 0;
            color: @blueGrey1;
          }
          a:hover {
            background: rgba(0,0,0,0.5);
          }
        }
        div.socialIcons.share {
          border: none;
          width: 70%;
          margin: 0 15%;
          padding: 0;
          a {
            margin: 10px 0;
            .radius(5px);
            height: 46px;
            color: @white;
            font-family: @font6;  
            font-size: 11px;
            text-align: left;
            width: 100%;
            background: @brightBlueNew;
            padding-bottom: 12px;
            div.wrapper {
              background: rgba(0,0,0,0.3);
              width: 30px;
              height: 30px;
              margin-right: 4px;
              i {
                padding: 6px 0;
                font-size: 20px;
              }
            }
            span {
              margin-top: 8px;
            }
            div.email {
              i {
                font-size: 17px;
                padding: 7px 0;
                padding-left: 1px;
              }
            }
          }
          a:hover {
            background: lighten(@brightBlueNew, 8%);
          }
        }
      }
      div.socialStatic {
        display: none;
        position: relative;
        max-width: 300px;
        div.horizontalDiv {
          width: 62%;
          height: 0;
          margin: 0 19%;
          margin-bottom: 10px;
          border-top: 3px solid rgba(255,255,255,0.25);
        }
        div.socialIcons {
          width: 100%;
          margin-top: 5px;
          padding-top: 0px;
          a, div.wrapper {
            float: left;
            display: block;
            width: 50px;
            height: 50px;
            .radius(64px);
            background: rgba(255,255,255,0.25);
          }
          a:first-child {
            margin-left: 70px;
            margin-right: 10px;
          }
          a:last-child {
            margin-left: 10px;
          }
          i {
            width: 100%;
            text-align: center;
            font-size: 24px;
            padding: 14px 0;
            color: @blueGrey1;
          }
          a:hover {
            background: rgba(0,0,0,0.5);
          }
        }
      }
      div.socialStatic.active {
        display: block;
      }
      div.alphaScreen.active {
        opacity: 1;
        right: 0;
        display: block;
      }
      div#alphaPage2.alphaScreen.active, div#alphaPage3.alphaScreen.active {
        background: rgba(0,0,0,0.3);
        height: auto;
        background: rgba(0,0,0,0.3);
      }
      div#alphaPage3.alphaScreen.active {
        height: auto;
        p {
          font-size: 16px;
        }
      }
    }
  }
  #signup {
    padding-top: 40px;
    form {
      table {
        max-width: 284px;
        th {
          label {
            margin-left: 12px;
            width: 284px;
          }
        }
        td {
          margin-left: 8px;
          max-width: 284px;
          input[type="text"], input[type="email"] {
            max-width: 284px;
          }
        }
      }
    }
  }
  #signup.selfAssessment {
    form {
      table.selfAssessment {
        tr:nth-child(3) {
          th {
            label {
              top: 0;
            }
          }
        }
        th {
          label {
            margin-left: 0 !important;
          }
        }
        td {
          margin-left: 0 !important;
          ul {
            li {
              margin-left: 5px;
              left: 10px;
              label {
                left: 35px;
              }
            }
          }
        }
      }
    }
    ul.cb {
      li {
        left: -10px;
      }
    }
  }
  #signup.requirements {
    form {
      #reasons {
        ul.reasons {
          li {
            p {
              margin-right: 0;
            }
          }
        }
      }
    }
  }
  .validationContainer {
    margin: 0;
    width: 100%;
    height: 340px;
    #feedback.fbForm {
      width: 100%;
      top: 4px;
      .radius(0);
      padding: 0;
      height: 340px;
      .headerWrapper {
        display: none;
      }
      form.review {
        width: 100%;
        padding-top: 2px;
        ul.fbOptions {
          width: 100%;
          li.option {
            width: 100%;
            button {
              width: 100%;
            }
            div#commentForm {
              height: 175px;
              p {
                margin-top: 20px;
                margin-bottom: 24px;
              }
              div#reviewContainer {
                ul.reviewFaces {
                  li {
                    margin: 0 2%;
                    width: 16%;
                    a {
                      height: auto;
                      img {
                        width: 100%;
                      }
                    }
                    p {
                      margin: 0 !important;
                      width: 100% !important;
                      font-size: 10px !important;
                      line-height: 12px !important;
                    }
                  }
                }
              }
            }
            ul#fbMetrics {
              li {
                height: 42px;
                padding: 0 5%;
                label {
                  width: 80px;
                  font-size: 14px;
                }
                .rateit {
                  top: 4px;
                  float: right;
                }
                div.value {
                  display: none !important;
                }
              }
            }
            div#recommendScore {
              p.prompt {
                top: 3px;
              }
              div#selectContainer {
                position: relative;
                p.left {
                  margin-left: 15px;
                }
                p.right {
                  margin-right: 13px;
                }
                ul.selectScore {
                  width: 100%;
                  li {
                    width: 8%;
                    margin: 5px 0.5%;
                  }
                }
              }
            }
            div#survey.optionBody {
              h4.question {
                font-size: 12px;
                line-height: 18px;
                margin-bottom: 2px;
              }
              ul.reasons {
                height: 200px;
                padding: 0;
                li {
                  width: 100%;
                  margin: 4px 0;
                  height: 27px;
                  p {
                    margin: 0;
                    font-size: 12px;
                    margin-top: 4px;
                  }
                }
              }
            }
          }
          li#sentiment.option{
            #commentForm {
              position: relative;
              top: -10px;
              p {
                font-family: @font5;
                text-align: center;
                margin-top: 30px;
                margin-left: 30px;
                margin-right: 30px;
                margin-bottom: 20px;

              }
            }
          }
          li#sentiment.option.active.shift {
            margin-bottom: 0 !important;
          }
        }
        button#feedbackSubmit.btn.important {
          bottom: 260px;
        }
      }
      form#fbComment {
        width: 100%;
        height: 341px;
        top: -6px;
        span#commentCounter {
          bottom: -5px
        }
        h3.complete {
          font-size: 18px;
        }
        textarea {
          width: 80%;
          margin: 0 10%;
          margin-top: 15px;
        }
        p.email {
          width: 80%;
          margin: 0 10%;
          margin-top: 11px;
          input {
            width: 98%; 
            margin: 0 1%;
          }
        }
        button#commentSubmit.btn.important {
          width: 72% !important;
          margin: 0 14% !important;
          positin: relative !important;
          right: 0 !important;
          bottom: -49px !important;
        }
      }
      div.seal {
        bottom: 225px;
        width: 40%;
        margin: 0 30%;
        img {
          height: auto;
          width: 100%;
        }
      }

    }
    #feedback.fbForm.unsub {
      form.review {
        button#feedbackSubmit.btn.important {
          bottom: 260px;
        }
      }
      div.seal {
        bottom: 220px;
      }
    }
  }
  div.nologo div.seal {
  	bottom: 140px !important;
  }
  #validation.popup.new {
    h2.thanks {
      display: none! important;
    }
    .mainValidationContainer {
      position: relative;
      top: -30px;
      width: 100%;
      padding: 0;
      .left {
        display: none;
      }
      div.right {
        width: 100%;
        margin-left: 0;
        margin-top: -9px;
        div.headerContainer {
          padding: 0;
          h2 {
            display: none;
          }
          h2.mobile.thanks {
            display: block !important;
            top: 0;
            width: 100%;
            text-align: center;
            padding: 18px 25px;
            line-height: 22px;
            font-size: 16px;
            color: @blueGreen;
          }
        }
        div.brandInfo {
          padding: 5px 0;
          a.companyURL {
            font-size: 12px;
            margin-left: 10px;
          }
          span.activeDate {
            font-size: 12px;
            top: 0;
            right: 10px;
          }
        }
        ul.reasons {
          padding-left: 10px;
          margin-top: 5px;
          li {
            margin: 0 12%;
            margin-bottom: 5px;
            width: 64%;
            div.imgHolder {
              height: 50px;
              width: 50px;
            }
            p {
              font-size: 12px !important;
            }
          }
        }
        div.sealContainer {
          padding-top: 5px;
          height: auto;
          img.seal {
            display: none;
          }
          p {
            display: none;
          }
          p.mobile {
            width: 70%;
            float: right;
            margin-right: 15%;
            font-size: 12px;
            padding: 0 5px;
            display: block;
            text-align: center;
            margin-bottom: 5px;
            span.license {
              font-size: 10px;
            }
            span {
              display: block;
            }
          }
        }
      }
    }
    div.validationFooter.container {
      display: none;
    }
  }
}



/*Transition Group */
.ease-enter {
  opacity: 0.01;
  transition: opacity 0.5s ease;
}

.ease-enter.ease-enter-active {
  opacity: 1;
}

.ease-leave {
  opacity: 1;
    transition: opacity 0.5s ease;
}

.ease-leave.ease-leave-active {
  height: 0px;
  opacity: 0.01;
}

div.toggle {
	.boxShadow(0;2px;1px;-2px;rgba(0,0,0,0.15));
	a[data-pressed="false"] {
	.boxShadow(0;3px;2px;-1px;rgba(0,0,0,0.15));
	position: relative !important;
	top: -2px !important;
	color: @OBGreen !important;
	background: lighten(@OBLGrey1,10%) !important;
	}
	a[data-over="true"] {
	.boxShadow(0;1px;2px;-1px;rgba(0,0,0,0.1));
	top: -1px !important;
	background: @white !important;
	color: lighten(@OBGreen, 10%) !important;
	}
	a[data-active="true"] {
	top: 0 !important;
	.noBoxShadow !important;
	}
	a[data-pressed="true"] {
	.noBoxShadow;
	cursor: default !important;
	background: @OBGreen !important;
	color: @white !important;
	}
}

/*React-Select*/
.Select {
  position: relative;
  .Select-control {
    position: relative;
    background-color: white;
    border: 1px solid #cccccc;
    border-color: #d9d9d9 #cccccc #b3b3b3;
    border-radius: 4px;
    box-sizing: border-box;
    color: #333333;
    cursor: default;
    outline: none;
    padding: 8px 52px 8px 10px;
    transition: all 200ms ease;
  }
  .Select-control:hover {
    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.06);
  }
  .is-searchable.is-open > .Select-control {
    cursor: text;
  }
  .is-open > .Select-control {
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
    background: white;
    border-color: #b3b3b3 #cccccc #d9d9d9;
  }
  .is-open > .Select-control > .Select-arrow {
    border-color: transparent transparent #999999;
    border-width: 0 5px 5px;
  }
  .is-searchable.is-focused:not(.is-open) > .Select-control {
    cursor: text;
  }
  .is-focused:not(.is-open) > .Select-control {
    border-color: #0088cc #0099e6 #0099e6;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1), 0 0 5px -1px rgba(0, 136, 204, 0.5);
  }
  .Select-placeholder {
    color: #aaaaaa;
    padding: 8px 52px 8px 10px;
    position: absolute;
    top: 0;
    left: 0;
    right: -15px;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .has-value > .Select-control > .Select-placeholder {
    color: #333333;
  }
  .Select-input > input {
    cursor: default;
    background: none transparent;
    border: 0 none;
    font-family: inherit;
    font-size: inherit;
    margin: 0;
    padding: 0;
    outline: none;
    display: inline-block;
    -webkit-appearance: none;
  }
  .is-focused .Select-input > input {
    cursor: text;
  }
  .Select-control:not(.is-searchable) > .Select-input {
    outline: none;
  }
  .Select-loading {
    -webkit-animation: Select-animation-spin 400ms infinite linear;
    -o-animation: Select-animation-spin 400ms infinite linear;
    animation: Select-animation-spin 400ms infinite linear;
    width: 16px;
    height: 16px;
    box-sizing: border-box;
    border-radius: 50%;
    border: 2px solid #cccccc;
    border-right-color: #333333;
    display: inline-block;
    position: relative;
    margin-top: -8px;
    position: absolute;
    right: 30px;
    top: 50%;
  }
  .has-value > .Select-control > .Select-loading {
    right: 46px;
  }
  .Select-clear {
    color: #999999;
    cursor: pointer;
    display: inline-block;
    font-size: 16px;
    padding: 6px 10px;
    position: absolute;
    right: 17px;
    top: 0;
  }
  .Select-clear:hover {
    color: #c0392b;
  }
  .Select-clear > span {
    font-size: 1.1em;
  }
  .Select-arrow {
    border-color: #999999 transparent transparent;
    border-style: solid;
    border-width: 5px 5px 0;
    content: " ";
    display: block;
    height: 0;
    margin-top: -ceil(2.5px);
    position: absolute;
    right: 10px;
    top: 14px;
    width: 0;
  }
  .Select-menu-outer {
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
    background-color: white;
    border: 1px solid #cccccc;
    border-top-color: #e6e6e6;
    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.06);
    box-sizing: border-box;
    margin-top: -1px;
    max-height: 200px;
    position: absolute;
    top: 100%;
    width: 100%;
    z-index: 1000;
    -webkit-overflow-scrolling: touch;
  }
  .Select-menu {
    max-height: 198px;
    overflow-y: auto;
  }
  .Select-option {
    box-sizing: border-box;
    color: #666666;
    cursor: pointer;
    display: block;
    padding: 8px 10px;
  }
  .Select-option:last-child {
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
  }
  .Select-option.is-focused {
    background-color: #f2f9fc;
    color: #333333;
  }
  .Select-option.is-disabled {
    color: #cccccc;
    cursor: not-allowed;
  }
  .Select-noresults {
    box-sizing: border-box;
    color: #999999;
    cursor: default;
    display: block;
    padding: 8px 10px;
  }
  .Select.is-multi .Select-control {
    padding: 2px 52px 2px 3px;
  }
  .Select.is-multi .Select-input {
    vertical-align: middle;
    border: 1px solid transparent;
    margin: 2px;
    padding: 3px 0;
  }
  .Select-item {
    background-color: #f2f9fc;
    border-radius: 2px;
    border: 1px solid #c9e6f2;
    color: #0088cc;
    display: inline-block;
    font-size: 1em;
    margin: 2px;
  }
  .Select-item-icon,
  .Select-item-label {
    display: inline-block;
    vertical-align: middle;
  }
  .Select-item-label {
    cursor: default;
    border-bottom-right-radius: 2px;
    border-top-right-radius: 2px;
    padding: 3px 5px;
  }
  .Select-item-label .Select-item-label__a {
    color: #0088cc;
    cursor: pointer;
  }
  .Select-item-icon {
    cursor: pointer;
    border-bottom-left-radius: 2px;
    border-top-left-radius: 2px;
    border-right: 1px solid #c9e6f2;
    padding: 2px 5px 4px;
  }
  .Select-item-icon:hover,
  .Select-item-icon:focus {
    background-color: #ddeff7;
    color: #0077b3;
  }
  .Select-item-icon:active {
    background-color: #c9e6f2;
  }
  @keyframes Select-animation-spin {
    to {
      transform: rotate(1turn);
    }
  }
  @-webkit-keyframes Select-animation-spin {
    to {
      -webkit-transform: rotate(1turn);
    }
  }
}


.react.onboarding {
  div.onboarding-input {
    position: relative;
    margin: 30px 0;
    height: 50px;
    background: @white !important;
    .boxShadow(0;2px;1px;-2px;rgba(0,0,0,0.15));
    .radius(4px);
    border: 1px solid @OBLGrey4;
    padding: 0;
    div.Select {
      div.Select-control {
        height: 48px;
        border: none !important;
        div.Select-placeholder {
          padding: 10px 20px;
          font-size: 20px;
          color: @OBLGrey4;
        }
        span.Select-arrow {
          top: 20px;
          border-color: @OBLGrey4 transparent transparent;
          border-width: 11px 11px 0;
        }
        span.Select-arrow:after {
          content: '';
          position: absolute;
          left: -5px;
          top: -11px;
          border-color: @white transparent transparent;
          border-style: solid;
          border-width: 5px 5px 0;
        }
      }
      div.Select-menu-outer {
        margin-left: -1px;
        margin-top: -4px;
        width: 332px;
      }
    }
    input {
      width: 100%;
      border: none !important;
      .noBoxShadow !important;
      height: 48px;
      font-size: 20px;
      padding: 10px 15px;
      position: relative;
      font-weight: 400;
    }
    span.errorMessage {
      position: absolute;
      top: 5px;
      right: -223px;
      font-size: 11px;
      color: @white;
      background: @OBDGrey;
      height: 40px;
      width: 210px;
      display: flex;
      justify-content: center;
      flex-direction: column;
      padding: 2px 6px;
      .radius;
      em {
        font-style: normal;
      }
    }
    span.errorMessage:after {
      content: '';
      position: absolute;
      top: 10px;
      left: -20px;
      border-left: 10px solid transparent;
      border-right: 10px solid @OBDGrey;
      border-top: 10px solid transparent;
      border-bottom: 10px solid transparent;
    }
  }
  div.onboarding-input:after {
    .slideFast;
    content: '';
    position: absolute;
    left: -1px;
    top: -1px;
    width: 10px;
    height: 50px;
    .leftRadius(4px);
    background: @OBGreen;
  }
  div.onboarding-input.disabled {
    background: @OBLGreen1 !important;
    input {
      background: @OBLGreen1;
    }
  }
  div.onboarding-input.required:after {
    background: @OBLGrey4;
  }
  div.onboarding-input.error:after {
    background: @OBRed;
  }
  button, a.button {
    text-align: center;
    width: 210px;
    .radius;
    display: block;
    margin: 25px auto;
    background: @white;
    color: @OBLGrey5;
    font-size: 14px;
    font-weight: 500;
    .insetShadow(0;-2px;0;0;rgba(0,0,0,0.1));
    padding: 10px 0;
    border: 1px solid @OBLGrey4;
    .slideFast;
  }
  button:hover,a.button:hover {
      color: @OBGrey1;
      .insetShadow(0;-2px;0;0;rgba(0,0,0,0.3));
      border: 1px solid @OBLGrey4;
      text-decoration: none;
  }
  button:focus,a.button:focus {
    outline: none;
  }
  button:active,a.button:active {
    transform: translateY(1px);
      .insetShadow(0;-1px;0;0;rgba(0,0,0,0.3));
  }
  button.submit,a.button.submit {
    padding: 12px 0;
    font-size: 20px;
    color: @white;
    background: @OBBlue;
    border: none;
  }
  button.submit:hover,a.button.submit:hover {
    color: @white;
    background: lighten(@OBBlue, 3%);
    border: none;
  }
  button[disabled],a.button[disabled] {
    pointer-events: none;
    cursor: not-allowed;
    opacity: .65;
  }
}

body.onboarding {
  background: @OBLGrey1;
}

div#OnBoarding {
  font-family: @font5;
  background: @OBLGrey1;
  min-height: 850px;
  padding-bottom: 50px;
  .container {
  	max-width: 1170px !important;
  	width: 1170px !important;
  }
  div.onboarding-header {
    padding-top: 5px;
    height: 70px;
    background: @white;
    .boxShadow(0;0;4px;rgba(0,0,0,0.2));
    img {
      float: left;
      margin-top: 7px;
      height: 46px;
    }
    div.onboarding-progress {
      float: left;
      margin-left: 120px;
      height: 60px;
      width: 650px;
      div.step, div.bar {
        margin: 5px;
        float: left;
        background: @OBLGreen1;
        border: 1px solid @OBLGreen2;
      }
      div.bar {
        margin-top: 15px;
        height: 8px;
        width: 125px;
        .radius;
      }
      div.step-wrapper {
        float: left;
        position: relative;
        height: 46px;
        width: 36px;
        div.step {
          width: 28px;
          height: 28px;
          .radius(28px);
          font-size: 18px;
          font-weight: 700;
          text-align: center;
          color: @OBGreen;
          i {
            position: relative;
            top: 2px;
            font-size: 20px;
            color: @white;
          }
        }
        div.step-label {
          color: @OBGrey1;
          text-align: center;
          width: 100px;
          position: absolute;
          left: -30px;
          top: 39px;
          font-size: 12px;
          font-weight: 600;
        }
      }
      div.active, div.complete {
        background: @OBGreen;
        border: 1px solid @OBGreen;
        color: @white !important;
      }
    }
  }
  h2 {
    margin-top: 0;
    margin-bottom: 15px;
    font-family: @font5;
    font-size: 28px;
    font-weight: 600;
    text-align: center;
    color: @OBGreen;
  }
  div.step-title-container {
    color: lighten(@OBGrey1,5%);
    text-align: center;
    margin-top: 10px;
    margin-bottom: 20px;
    font-size: 21px;
    padding-bottom: 5px;
    font-weight: 600;
    height: 60px;
    width: 300px;
    margin: auto;
    img.onboarding-icon {
      float: left;
      display: block;
      margin: 0 auto;
      width: 50px;
    }
    div.step-title {
      position: relative;
      top: 10px;
      width: 250px;
      float: left;
      text-align: center;
      span {
        display: inline;
      }
      span.step {
        color: lighten(@OBGrey1,15%);
        font-weight: 400;
      }
    }
  }
  p {
    width: 80%;
    text-align: center;
    font-size: 16px;
    margin: 0 10%;
    a {
      margin: 0 5px;
    }
  }
  form.onboarding-form {
    width: 30%;
    margin: 30px 35%;
    button.submit {
      margin-top: 38px;
      width: 100%;
    }
  }

  div.onboarding-container {
    margin-top: 30px;
    .radius;
    padding: 20px;
  }
}


/* New Seal Builder Styles */
div.seal-builder {
  height: 500px;
  margin-top: 10px;
  position: relative;

p.back {
	position: absolute;
	left: 0;
	top: -67px;
	font-size: 16px !important;
	width: 100px !important;
	margin: 0 !important;
	a {
		color: @grey5;
	}
	a:hover {
		color: @OBGreen;
	}
}
  div.preview-wrapper {
    margin-top: 15px;
    height: 466px;
    width: 741px;
    float: left;
    .radius;
    div.preview-image {
      margin: 10px auto;
      display: block;
    }
    div.preview-image.desktop {
      height: 440px;
      width: 719px;
      padding: 0 10px;
      padding-top: 140px;
    }
    div.preview-image.mobile {
      height: 440px;
      width: 210px;
      padding: 0 19px;
      padding-top: 180px;
    }
    table {
      a {
        text-decoration: none;
      }
    }
  }
  div.seal-builder-form {
    float: right;
    height: 460px;
    width: 332px;
    padding-top: 6px;
    div.btn-toggle {
    	height: 45px;
    	width: 80%;
    	margin: 20px 10% !important;
      button {
      	float: left;
      	margin: 0;
      	width: 50%;
      }
      button.btn-left {
      	.leftRadius;
      }
      button.btn-right {
      	.rightRadius;
      }
      button.active {
      	background: @blueGreen;
      	color: @white;
      }
      button.active:hover {
      	cursor: default;
    	.insetShadow(0;-2px;0;0;rgba(0,0,0,0.1));
      }
      button.btn-left.active {
      	border-right: none;
      }
      button.btn-right.active {
      	border-left: none;
      }
    }
    button.submit {
      width: 100%;
      margin-top: 38px;
    }
  }
}

div.onboarding-add-code {
	position: relative;
	p.back {
	position: absolute;
	left: 0;
	top: -110px;
	font-size: 16px !important;
	width: 100px !important;
	margin: 0 !important;
	a {
		color: @grey5;
	}
	a:hover {
		color: @OBGreen;
	}
}
  div.code-holder {
    margin: 5px 10%;
    margin-top: 30px;
    width: 80%;
    position: relative;
    textarea {
      background: @OBDGrey;
      color: @OBLGrey1;
      height: 195px;
      width: 100%;
      .radius(0);
      font-size: 12px;
      font-family: "Lucida Console", monospace;
      border: none;
      resize: none;
      padding-right: 140px;
    }
    @-webkit-keyframes blinker {
        from {opacity: 0;}
        to {opacity: 1;}
    }
    @keyframes blinker {
        from {opacity: 0;}
        to {opacity: 1;}
    }
    div.copy-status {
      .slideMed;
      content: '';
      position: absolute;
      top: 0;
      right: 15px;
      border-left: 40px solid transparent;
      border-right: 40px solid @OBGrey1;
      border-top: 40px solid @OBGrey1;
      border-bottom: 40px solid transparent;
      button.copy-overlay {
        position: absolute;
        top: -55px;
        right: -31px;
        background: none !important;
        border: none !important;
        -webkit-box-shadow: none !important;
        box-shadow: none !important;
        -moz-box-shadow: none !important
        height: 30px;
        padding: 0 !important;
        width: 30px !important;
        i {
          color: @white;
          font-size: 30px;
        }
      }
    }
    div.copy-status.inactive {
      button.copy-overlay {
        i {
          opacity: 0.5;
        }
      }
      button.copy-overlay:hover i {
        text-decoration: blink;
        animation-name: blinker;
        animation-duration: 1s;
        animation-iteration-count:infinite;
        animation-timing-function:ease-in-out;
        animation-direction: alternate;
      }
    }
    div.copy-status.active {
      border-left: 40px solid transparent;
      border-right: 40px solid @OBBGreen;
      border-top: 40px solid @OBBGreen;
      border-bottom: 40px solid transparent;
    }
    span {
      width: 100%;
    }
  }

	p.seal-agreement {
		font-size: 12px !important;
		line-height: 18px;
		margin: 0 !important;
		width: 100% !important;
		margin-top: 5px !important;
		span {
			display: inline;
		}
		a {
			color: #333;
			display: inline;
			margin: 0 !important;

		}
		a:hover {
			color: @OBGreen;
			text-decoration: none;
		}
	}
	.validationFooter {
		margin-top: 260px;
		p {
			width: 40% !important;
			margin: 0 30% !important;
			text-align: center;
			margin-top: 15px !important;
			padding-top: 10px;
			font-size: 12px !important;
			border-top: 1px solid #c8c8c8;
			span {
				margin: 0 2px;
				a {
					margin: 0 !important;
					color: @grey7;
				}
				a:hover {
					color: @grey7;
				}
			}
		}
    }
  button.submit {
    margin-top: 40px;
    width: 266px;
  }
}

form#drip-create {
	float: left;
	clear: left;
	label {
		float: left;
		clear: left;
		margin-top: 4px;
		height: 33px;
	}
	input {
		clear: right;
		float: right;
		margin-bottom: 5px;
	    position: relative;
	    right: 270px;
	}
	button {
		float: left;
		clear: left;
	}
}

/*Intro JS Overwrites */
.introjs-helperNumberLayer {
  height: 30px;
  width: 30px;
  font-family: @font5;
  .gradientGreenButton;
}

.introjs-button {
  background: lighten(@blueGreen,10%);
  color: @white;
  .noTextShadow;
  padding: 0.6em 1.6em;
  .radius;
}
 .introjs-button:focus, {
  background: @blueGreen;
  color: @white;
 }
.introjs-button:hover, .introjs-button:active {
  background: lighten(@blueGreen,10%);
  color: @white;
}
.introjs-disabled {
  opacity: 0.5;
  background: @grey3;
  color: @grey6;
}
.introjs-disabled:hover, .introjs-disabled:focus, .introjs-disabled:active {
  background: @grey3;
  color: @grey6;
}
.introjs-nextbutton {
  .rightRadius();
}
.introjs-prevbutton {
  .leftRadius();
}
.introjs-button.introjs-skipbutton {
	display: none !important;
}

body.report {
	font-family: @font5 !important;
	background: @white;
	width: 600px;
	span, label, p, h2 {
		font-family: @font5 !important;
	}
	div.page {
		width: 600px;
		clear: both;
		page-break-before: always;
		label {
			color: #333 !important;
		}
		div.header {
			background: @blueGreen;
			height: 50px;
			margin-bottom: 10px;
			h2 {
				margin: 0 20px;
				height: 50px;
				line-height: 50px;
				float: left;
				color: @white !important;
				font-size: 16px;
				font-weight: 600;
				text-transform: uppercase;
				img {
					margin-top: 5px;
					margin-right: 12px;
					width: 32px;
					float: left;
				}
				div.report-range {
					color: @white !important;
					span {
						color: @white !important;
					}
				}
				span {
					display: inline;
					color: @white !important;
				}
			}
			h3.report-range {
				margin-top: 0 !important;
				color: @white !important;
				margin-right: 10px;
				height: 50px;
				line-height: 50px;
				font-size: 16px;
				float: right;
				span {
					display: inline;
					color: @white !important;
				}
			}
		}
		div.section {
			margin: 15px 0;
			float: left;
			width: 100%;
			label {
				width: 100%;
				font-size: 16px;
				text-align: center;
			}
		}
		div.donut-graph {
					margin-top: 30px;
					margin-bottom: 5px;
					float: left;
					width: 300px;
					height: 160px;
					position: relative;
					div.info {
						position: absolute;
						color: @OBGreen !important;
						width: 270px;
						height: 150px;
						top: 0;
						span {
							color: @OBGreen !important;
							display: block;
							text-align: center;
						}
					}
					div.sxi-info {
						right: 30px;
						span.sxi {
							width: 150px;
							float: right;
							font-size: 35px;
							line-height: 150px;
						}
						span.sxi-label {
							width: 120px;
							float: left;
							font-size: 28px;
							line-height: 150px;
						}
					}
					div.change-info {
						left: 30px;
						span.change {
							width: 150px;
							float: left;
							font-size: 35px;
							line-height: 150px;
						}
						span.change-label {
							position: relative;
							top: 57px;
							width: 120px;
							float: right;
							font-size: 18px;
							line-height: 12px;
							span {
								text-transform: capitalize;
							}
						}
					}
				}
				div.sxi-donut {
					padding-left: 120px;
					padding-right: 30px;
				}
				div.change-donut {
					padding-left: 30px;
					padding-right: 120px;
				}
		ul.data {
			margin: 5px 0;
			width: 100%;
			float: left;
			height: 100px;
			padding: 10px 0;
			li {
				float: left;
				width: 33.3%;
				height: 80px;
				padding: 10px 0;
				label {
					font-size: 14px;
					width: 100%;
					text-align: center;
					text-transform: uppercase;
				}
				span.data {
					width: 100%;
					text-align: center;
					font-size: 14px;
					line-height: 10px;
					color: #636363;
				}
			}
			li:last-child {
				border-right: none;
			}
		}
		ul.event-data {
			margin-top: 15px;
			li {
				border-right: 1px solid #a3a3a3;
				span.data {
					font-size: 30px;
					line-height: 25px;
				}
			}
			li:last-child {
				border-right: none;
			}
		}
		div.section.churn-risk {
			div.churn-risk-bar {
				width: 50%;
				margin: 0 25%;
				position: relative;
				span.churn-risk-info {
					width: 120px;
					margin-left: -60px;
					top: -18px;
					text-align: center;
					font-weight: 700;
					position: absolute;
					font-size: 12px;
				}
				div.progress {
					margin-top: 20px;
					margin-bottom: 0;
					width: 100%;
					.insetDrop(0;1px;3px;1px;rgba(0,0,0,0.08);0;1px;1px;0;rgba(0,0,0,0.05));
					background: @white;
					.radius(1px);
					border: 1px solid #c3c3c3;
					div.progress-bar.churn {
						.noBoxShadow;
					}
				}
			}
		}
		div.feedback-pct.section {
			label.feedback-pct-change {
				span {
					text-transform: capitalize;
					display: inline;
				}
			}
			ul.feedback-pct-change {
				padding-top: 0;
			}
		}
		div.bar-header {
			width: 80%;
			margin: 0 10%;
			border-bottom: 1px solid #a4a4a4;
			height: 40px;
			padding: 0 4px;
			h2 {
				margin: 0;
				font-size: 16px;
				width: 60%;
				float: left;
				font-family: @font5;
				color: #333333 !important;
				font-weight: 600;
			}
			span.events {
				font-size: 12px;
				position: relative;
				top: 15px;
				float: right;
				color: #636363 !important;
				font-family: @font5;
				font-weight: 600;
				margin-right: 2px;
				span {
					display: inline;
				}
			}
		}
		ul.breakdown {
			width: 80%;
			margin: 0 10%;
			li {
				padding: 10px 15px;
				height: 60px;
				border-bottom: 1px solid #cccccc;
				.boxShadow(0;1px;2px;-1px;#ffffff);
				img {
					width: 38px;
					float: left;
				}
				div.progress {
					float: right;
					margin-top: 15px;
					height: 10px;
					width: 250px;
					background: #fff;
					border: 1px solid #cccccc;
				}
				span.pct {
					position: relative;
					top: 10px;
					display: block;
					width: 60px;
					text-align: center;
					float: right;
				}
			}
		}
	}
	div.satisfaction.page {
		div.npsBreakdown {
			width: 74%;
			margin: 0 13%;
			margin-top: 20px;
			height: 90px;
			div.npsScore {
				.radius(8px);
				background: #636363;
				float: left;
				width: 30%;
				margin-right: 3%;
				height: 80px;
				label {
					color: @white !important;
					width: 100%;
					text-align: center;
					font-weight: 400;
					margin-bottom: 0;
					margin-top: 3px;
				}
				span {
					display: block;
					width: 100%;
					font-size: 40px;
					font-weight: 600;
					color: @white !important;
					text-align: center;
				}
			}
			div.progress {
				float: left;
				width: 67%;
				height: 80px;
				margin-bottom: 0;
				div.progress-bar {
					padding-top: 25px;
					font-size: 24px;
				}
				div.progress-bar-success {
					background: #00c66f;
					span {
						color: @white !important;
					}
				}
				div.progress-bar-warning {
					background: #fece40;
					span {
						color: @white !important;
					}
				}
				div.progress-bar-danger {
					span {
						color: @white !important;
					}
				}
			}
		}
		ul.satisfaction.breakdown {
			li {
				padding: 0 15px;
				height: 40px;
				span.number {
					text-align: center;
					.fontStyle(@grey6;14px;600);
					float: left;
					width: 30px;
					height: 30px;
					padding-top: 4px;
					margin: 5px 1%;
					.radius(5px);
					background: @grey2;
					border: 1px solid @grey5; 
				}
				div.progress {
					margin-bottom: 15px;
				}
			}
		}
	}
	div.ratings.page {
		div.bar-header {
			margin-top: 10px;
		}
		ul.breakdown {
			li {
				padding: 6px 15px;
				height: 50px;
				span.numStars {
					margin-top: 8px;
					color: #636363;
					font-weight: 600;
					span {
						display: inline;
					}
				}
				span.number {
					text-align: center;
					.fontStyle(@grey6;14px;600);
					float: left;
					width: 30px;
					height: 30px;
					padding-top: 4px;
					margin: 5px 1%;
					.radius(5px);
					background: @grey2;
					border: 1px solid @grey5; 
				}
				div.progress {
					margin-bottom: 15px;
				}
			}
		}
	}
	div.comments.page {
		ul.comments-list {
			width: 80%;
			margin: 0 10%;
			margin-top: 10px;
			li {
				margin: 20px 0;
				span.comment-email {
					color: @OBGreen;
					span {
						display: inline;
					}
				}
				span.reply {

				}
				div.comment-wrapper {
					margin-top: 3px;
					padding: 5px;
					div.comment-container {
						background: @white;
						padding: 5px;
						.radius(2px);
						p {
							font-size: 12px !important;
							margin: 0;
						}
					}
				}
			}
		}
	}
}
body.payment {
	background: @grey2;
	.container.logo {
		padding: 20px 22px;
		padding-top: 40px;
	}
	.container {
		width: 600px !important;
		#mainContent {
			margin-top: 5px;
			border: 1px solid @grey4;
			.boxShadow(0;0;4px;rgba(0,0,0,0.05));
			min-height: 415px;
			margin-bottom: 60px;
			h2 {
				padding: 0 27px;
				font-size: 20px !important;
				color: #222;
				font-weight: 400 !important;
			}
		}
	}
}
#paymentApp {
	div.error {
		p {
			color: @white !important;
		}
	}
	div.error.cvc {
		left: 305px !important;
	}
	div.payment-header {
		width: 100%;
		background: @grey2;
		border-bottom: 1px solid @grey4;
		padding: 22px 0;
		h2 {
			margin: 0 !important;
		}
	}
	div.popup-header {
		p {
			color: @grey6;
			margin-left: 27px;
			font-weight: 600;
			span {
				display: inline;
			}
		}
		div.agreement {
			margin-top: 5px;
			input {
				float: left;
				margin-left: 30px;
				margin-right: 5px;
			}
			p {
				margin: 0 5%;
				margin-top: 1px;
				float: left;
				width: 90%;
				font-weight: 400;
				font-size: 12px;
			}
			p.error {
				color: @red1;
			}
		}
	}
	div.creditInfo {
		padding: 0 25px;
		border-bottom: 1px solid @grey4;
		form.form-horizontal {
			padding: 0;
			fieldset#credit-info {
				div.add-card-form {
					position: relative;
					width: 100%;
				    height: 180px;
					div.error {
						height: 40px;
						width: 230px;
					    left: 55px;
					    position: absolute;
					    padding: 2px 6px;
					    z-index: 951;
					    p {
					    	padding: 0 !important;
					    	margin: 0 !important;
							font-size: 11px !important;
							text-align: center;
							text-transform: uppercase;
							line-height: 12px;
							font-weight: 600;
							position: relative;
							top: 50%;
							transform: translateY(-50%);
					    }
					}
					div.error.number {
						top: 64px;
					}
					div.error.expiry {
						top: 139px;
					}
					div.error.cvc {
						top: 139px;
						left: 205px;
					}
					div.error:before {
			            border-left: 7px solid transparent;
			            border-bottom: 7px solid @red1;
			            border-right: 7px solid transparent;
			            content: '';
			            display: block;
			            position: absolute;
			            top: -7px;
			            left: 32px;
					}
					div.card-form {
						div.control-group label {
							margin-top: 0;
							font-size: 16px;
							color: #838383;
							font-weight: 500;
						}
						div.control-group.number {
							width: 100%;
						}
						div.control-group.expiration {
							width: 50%
						}
						div.control-group.security {
							width: 50%;
						}
						h4 {
							margin-top: 20px;
							margin-bottom: 0;
						}
						div.error {
							width: 100%;
						}
						div.control-group {
							float: left;
							padding: 0 1%;
							margin: 5px 0 !important;
							label {
								float: none;
								width: 98%;
							}
							input {
								width: 100%;
								padding: 8px;
								.insetDrop(0;1px;1px;1px;rgba(0,0,0,0.05);0;1px;1px;0;rgba(0,0,0,0.05));
							}
							input.invalid-input {
								border-color: @red;
							}
							select {
								width: 48%;
								margin-right: 4px;
								height: 38px;
								line-height: 38px;
								.insetDrop(0;1px;1px;1px;rgba(0,0,0,0.05);0;1px;1px;0;rgba(0,0,0,0.05));
							}
						}

					}
				}
			}
		}
	}
	div.payment-success, div.payment-fail {
		margin-top: 32px;
		p {
			padding: 0;
			margin: 0;
			width: 100%;
			text-align: center;
			span {
				display: inline;
			}
		}
		p.charged {
			font-size: 11px !important;
			margin-top: 5px !important;
			line-height: 15px;
		}
		p.success-icon, p.fail-icon {
			i {
				margin-top: 8px;
				color: @OBBlue;
				font-size: 45px;
			}
		}
		p.fail-icon {
			i {
			    position: relative;
			    top: 0;
			    right: 0;
				color: @OBRed;
			}
		}
		p.receipt {
			width: 66%;
			margin-top: 0 !important;
			padding-top: 10px !important;
		    margin-left: 17% !important;
		    text-align: left !important;
		    font-size: 20px !important;
		    height: 30px;
		}
		p.charge-info {
			height: 16px;
			width: 66%;
			margin-top: 7px;
		    margin-left: 17%;
		    text-align: left;
			font-size: 12px !important;
			color: #a3a3a3;
			b {
				color: #838383;
			}
		}
		ul.payment-list {
			position: relative;
			width: 66%;
		    margin-top: 8px;
		    margin-left: 17%;
		    height: 80px;
		    padding: 5px 10px;
			.insetDrop(0;1px;3px;1px;rgba(0,0,0,0.08);0;1px;1px;0;rgba(0,0,0,0.05));
			background: @white;
			.radius(3px);
			border: 1px solid #c3c3c3;
			li:first-child {
				border-bottom: 2px #E6ECEF solid;
				span.left {
					span {
						display: inline;
					}
					span.capitalize {
						text-transform: capitalize;
					}
				}
			}
			li {
				font-size: 12px;
				line-height: 35px;
				height: 35px;
				font-weight: 400;
				span.left {
					width: 80%;
					text-align: left;
				}
				span.right {
					width: 20%;
					text-align: right;
				}
			}
			li.paid {
				font-weight: 600;
			}
		}
		div.contact-us {
			margin-top: 7px;
			p {
				font-size: 11px !important;
			}
		}
		div.contact-us.fail {
			width: 100%;
			position: absolute;
			bottom: 4px;
		}
	}
	button.btn {
		background: @OBBlue;
		margin: 0 5%;
		margin-top: 28px;
		margin-bottom: 15px;
		width: 90%;
		padding: 11px 20px;
        .fontStyle(@white;16px;700);
        .textShadow(0;1px;0;rgba(0,0,0,0.15));
        .insetShadow(0;-3px;0;0;rgba(0,0,0,0.3));
	}
}