﻿@media only screen and (max-width:1200px) {
}
@media only screen and (max-width:1024px) {
}
@media only screen and (max-width:768px) {
}
@media only screen and (max-width:480px) {
}
@media only screen and (max-width:360px) {
}




/* Public page container */
@media only screen and (max-width:768px) {
  .PageContainer      {min-height:unset;}
}




/* Commonly Used */
@media only screen and (max-width:1200px) {
  .WidthContent     {padding-left: 50px; padding-right: 50px;}

  .HeightContent    {padding-top: 50px; padding-bottom: 50px;}
}

@media only screen and (max-width:1024px) {
  .WidthContent     {padding-left: 40px; padding-right: 40px;}

  .HeightContent    {padding-top: 40px; padding-bottom: 40px;}
}

@media only screen and (max-width:768px) {
  .WidthContent     {padding-left: 30px; padding-right: 30px;}
}

@media only screen and (max-width:480px) {
  .WidthContent     {padding-left: 20px; padding-right: 20px;}
}

@media only screen and (max-width:360px) {
  .WidthContent     {padding-left: 10px; padding-right: 10px;}
}



/* Header */
@media only screen and (max-width:1024px) {
  .SiteHeader .InnerHeader .MobIcon_Block                                         {display: flex;}
  .SiteHeader .MainHeader .WidthContent                                           {padding: 0px 10px 0px 0px;}
  .SiteHeader .MainHeader .HeaderContent .Block_01                                {flex: 0 0 142px; padding-right: 10px;}
  .SiteHeader .MainHeader .HeaderContent .Block_02                                {height: 30px; margin-top: 5px}
  .SiteHeader .MainHeader .HeaderContent .Block_03                                {flex: 0 0 80px; padding-left: 10px;}
  .SiteHeader .ClientLogo img                                                     {max-height:25px;}
  .SiteHeader .HdrDropdowns .DD_Block                                             {flex: 0 0 100px; height: 44px;}
  .SiteHeader .HdrDropdowns .DD_Block.Percentage                                  {flex: 0 0 65px; padding-right: 10px; height: inherit;}
  .SiteHeader .HdrDropdowns .DD_Seperator                                         {display: none;}
  .SiteHeader .HdrDropdowns .DD_Block.Nav                                         {display: none;}
  .SiteHeader .HdrDropdowns .ui-selectmenu-text                                   {padding: 12px 11px;}
  .SiteHeader .HdrDropdowns .ui-selectmenu-text .LangFlagAndTxt .TxtCell          {display: none;}
  .SiteHeader .HdrDropdowns .ui-selectmenu-icon                                   {display: none;}
  .SiteHeader .AssessmentHeader .HeaderContent .Block_01                          {flex: 0 0 92px; align-items: flex-start;}
  .SiteHeader .AssessmentHeader .HeaderContent .Block_02                          {padding: 0px 10px;}
  .SiteHeader .AssessmentHeader .HeaderContent .Block_03                          {flex: 0 0 109px;}
  .SiteHeader .BackIcon                                                           {width: 37px; height: 37px;}
  .SiteHeader .AssessmentPath .APBlock                                            {right: -45px;}
  .SiteHeader .AssessmentPath .APTopArrow                                         {left: 74%;}

  .SiteHeader .HdrDropdowns .DD_Block.Btn                                         {display:none;}
}

@media only screen and (max-width:360px) {
  .SiteHeader .MainHeader .HeaderContent .Block_02      {display: none;}
  .SiteHeader .MainHeader .HeaderContent .Block_03      {display: none;}
}



/* Footer */
@media only screen and (max-width:768px) {
  .SiteFooter                                           {height: 80px;}
  .SiteFooter .InnerFooter                              {display: block; padding: 15px 0px;}
  .SiteFooter .InnerFooter .Block_01                    {display: block; height: inherit; margin-bottom: 10px;}
  .SiteFooter .InnerFooter .Block_02                    {display: block; height: inherit; text-align: center;}
  .SiteFooter .SocialMediaBlocks                        {justify-content: center;}
  .SiteFooter .SocialMediaBlocks .SM_Block              {flex: inherit; padding-right: 0px; margin: 0px 5px;}
  .SiteFooter ul.FooterLinks                            {margin:10px 0px 0px 0px;}
}



/* Checkbox Block */
@media only screen and (max-width:1024px) {
  .CheckboxBlock .CustomInput                           {width:88%;}
}



/* Site Content */
@media only screen and (max-width:1200px) {
  .SiteContent .PanelRight                                          {width:240px; padding-left:40px;}
}
@media only screen and (max-width:1024px) {
  .SiteContent                                                      {display: block;}
  .SiteContent .PanelLeft                                           {display: block;}
  .SiteContent .PanelRight                                          {width: 100%; padding-left: 0px;}

  .ModelBoxSm                                                       {width: 290px; margin: 30px auto 10px auto;}
}



/* Dashboard */
@media only screen and (max-width:1400px) {
  .swiper-current-activity                                          {margin:0px 0px 0px -80px;}
  .swiper-current-activity .swiper-slide                            {margin:0px -50px 0px 80px; width:240px;}
  .swiper-current-activity .swiper-slide.LastSlide                  {margin:0px 80px 0px 80px;}
  .swiper-my-history                                                {margin:0px 0px 0px -80px;}
  .swiper-my-history .swiper-slide                                  {margin:0px -50px 0px 80px; width:240px;}
  .swiper-my-history .swiper-slide:last-child                       {margin:0px 80px 0px 80px;}
}

@media only screen and (max-width:1200px) {
  .Dashboard .SliderRow .swiper-button-next                         {display: block;}
  .Dashboard .SliderRow .swiper-button-prev                         {display: block;}

  .Dashboard .AssessmentsRow .AS_Swiper_Block                       {flex: 0 0 66.66%;}
  .Dashboard .AssessmentsRow .AS_History_Block                      {flex: 0 0 33.33%;}
}

@media only screen and (max-width:1024px) {
  .Dashboard .SliderRow .swiper-container                           {margin: 0px -40px;}
  .Dashboard .SliderRow .swiper-slide                               {margin: 0px -20px 0px 40px;}
  .Dashboard .SliderRow .swiper-slide.LastSlide                     {margin-right: 40px;}
  .Dashboard .SliderRow .swiper-button-next                         {right: -10px;}
  .Dashboard .SliderRow .swiper-button-prev                         {left: -10px;}
  .Dashboard .SliderRow .swiper-slide.Empty                         {display: none;}
  .Dashboard .SliderRow.AssessmentsList .ViewHistory                {display: block;}
  .Dashboard .SliderRow.AssessmentsList .swiper-slide               {width: 280px !important;}
  .Dashboard .SliderRow.CoursesList .swiper-slide                   {width: 220px !important;}
  .Dashboard .SliderRow.ResourcesList .swiper-slide                 {width: 220px !important;}
  .Dashboard .SliderRow.PodcastsList .swiper-slide                  {width: 220px !important;}
  .Dashboard .AssessmentsRow                                        {display: block;}
  .Dashboard .AssessmentsRow .AS_Swiper_Block                       {padding-right: 0px;}
  .Dashboard .AssessmentsRow .AS_History_Block                      {display: none;}

  .HeaderRow                                                        {margin-bottom: 20px;}
  .HeaderRow .AddAssessBtn .Lg                                      {display: none;}
  .HeaderRow .AddAssessBtn .Sm                                      {display: block;}
  .HeaderRow .DashHdrFields .InfoField                              {padding-right: 10px;}
  .HeaderRow.FullWidthSm                                            {display: block; margin-bottom:35px;}
  .HeaderRow.FullWidthSm .LeftSide                                  {padding-right: 0px;}
  .HeaderRow.SearchBlock                                            {display: block;}
  .HeaderRow.SearchBlock .LeftSide                                  {margin-bottom: 20px;}
  .HeaderRow.SearchBlock .RightSide                                 {width: 100%;}
  .HeaderRow.SearchBlock .RightSide .FormBox                        {margin-bottom: 0px;}

  .swiper-current-activity                                          {margin:0px 0px 0px -60px;}
  .swiper-current-activity .swiper-slide                            {margin:0px -30px 0px 60px;}
  .swiper-current-activity .swiper-slide:last-child                 {margin:0px 60px 0px 60px;}
  .swiper-my-history                                                {margin:0px 0px 0px -60px;}
  .swiper-my-history .swiper-slide                                  {margin:0px -30px 0px 60px;}
  .swiper-my-history .swiper-slide:last-child                       {margin:0px 60px 0px 60px;}
}

@media only screen and (max-width:768px) {
  .Dashboard .SliderRow .swiper-container                           {margin: 0px -30px 0px -35px;}
  .Dashboard .SliderRow .swiper-slide                               {margin: 0px -15px 0px 35px;}
  .Dashboard .SliderRow .swiper-slide.LastSlide                     {margin-right: 30px;}

  .ViewHistoryBlocks .VHBlock                                       {padding:15px 15px 15px 15px;}
  .ViewHistoryBlocks .VHBlock .Complete_Box                         {flex: 0 0 30px;}
  .ViewHistoryBlocks .VHBlock .Details_Box                          {display: block; padding-left:15px;}
  .ViewHistoryBlocks .VHBlock .Details                              {padding-left: 0px; margin-bottom: 5px;}
  .ViewHistoryBlocks .VHBlock .Details .Title                       {padding-right: 25px; box-sizing: border-box; margin-bottom:3px;}
  .ViewHistoryBlocks .VHBlock .Details .BtnWhite                    {margin-bottom: 10px;}
  .ViewHistoryBlocks .VHBlock .CompletedDate                        {display: block; padding-left: 0px;}
  .ViewHistoryBlocks .VHBlock .Download                             {position:absolute; top:50%; right:10px; width:30px; padding-left: 0px; margin-top:-15px;}

  .swiper-current-activity                                          {margin:0px -40px;}
  .swiper-current-activity .swiper-slide                            {margin:0px -10px 0px 40px; width:220px;}
  .swiper-current-activity .swiper-slide:last-child                 {margin:0px 40px 0px 40px;}
  .swiper-current-activity:hover .swiper-button-next                {display:none;}
  .swiper-current-activity:hover .swiper-button-prev                {display:none;}
  .swiper-my-history                                                {margin:0px -40px;}
  .swiper-my-history .swiper-slide                                  {margin:0px -10px 0px 40px; width:220px;}
  .swiper-my-history .swiper-slide:last-child                       {margin:0px 40px 0px 40px;}
  .swiper-my-history:hover .swiper-button-next                      {display:none;}
  .swiper-my-history:hover .swiper-button-prev                      {display:none;}
}

@media only screen and (max-width:480px) {
  .Dashboard .SliderRow .swiper-container                           {margin: 0px -20px 0px -30px;}
  .Dashboard .SliderRow .swiper-slide                               {margin: 0px -10px 0px 30px;}
  .Dashboard .SliderRow .swiper-slide.LastSlide                     {margin-right: 20px;}
  .Dashboard .SliderRow .swiper-button-next                         {right: 0px;}
  .Dashboard .SliderRow .swiper-button-prev                         {left: 0px;}

  .swiper-current-activity                                          {margin:0px -30px;}
  .swiper-current-activity .swiper-slide                            {margin:0px -10px 0px 30px;}
  .swiper-current-activity .swiper-slide:last-child                 {margin:0px 30px 0px 30px;}
  .swiper-my-history                                                {margin:0px -30px;}
  .swiper-my-history .swiper-slide                                  {margin:0px -10px 0px 30px;}
  .swiper-my-history .swiper-slide:last-child                       {margin:0px 30px 0px 30px;}
}

@media only screen and (max-width:360px) {
  .Dashboard .SliderRow .swiper-container                           {margin: 0px -10px 0px -25px;}
  .Dashboard .SliderRow .swiper-slide                               {margin: 0px -5px 0px 25px;}
  .Dashboard .SliderRow .swiper-slide.LastSlide                     {margin-right: 10px;}
}

















/* Main Table */
@media only screen and (max-width:1400px){
   .MainTable .MainCellRight .Inner                 {padding:80px 80px 60px 80px;} 
   .MainTable .MainCellRight .Inner.WidthTop        {padding-top:120px}
}
@media only screen and (max-width:1200px){
  .MainTable .MainCellLeft.MainCellLarge {width:100px;}
  .LeftPanel .ProgressCircle .Labels .Label1 {font-size:20px; line-height:1.2em;}
  .LeftPanel .ProgressCircle .Labels .Label2 {font-size:10px;}
}
@media only screen and (max-width:1024px){
  .MainTable .MainCellLeft                          {display:none;}
  .MainTable .MainCellRight .Inner                  {padding:60px;}
  .MainTable .MainCellRight .Inner.WidthTop         {padding-top:110px}
}
@media only screen and (max-width:768px){
  .MainTable .MainCellRight .Inner                  {padding:40px;}
  .MainTable .MainCellRight .Inner.WidthTop         {padding-top:100px}
}
@media only screen and (max-width:480px){
 .MainTable .MainCellRight .Inner                  {padding:30px;}
 .MainTable .MainCellRight .Inner.WidthTop         {padding-top:90px}
}

@media only screen and (max-width:400px){
 .MainTable .MainCellRight .Inner {padding-left:20px; padding-right:20px;} /* testing less side padding to fit all the answers on 320px screen */
}

/* Left Panel */
@media only screen and (max-width:1400px){
}
@media only screen and (max-width:1200px){
  .LeftPanel.PanelLarge                                   {width:100px;}
  .LeftPanel.PanelLarge .Header .LogoBig                  {display:none;}
  .LeftPanel.PanelLarge .Header .LogoSmall                {display:inline-block;}
  .LeftPanel.PanelLarge .Footer .SecondLogo               {display:none;}
  .LeftPanel.PanelLarge .Footer .SocialFooter             {margin:0px;}
  .LeftPanel.PanelLarge .Footer .SocialFooter .Link       {margin:10px 10px 0px 10px;}
  .LeftPanel.PanelLarge .Footer .Txt                      {display:none;}
  .LeftPanel.PanelLarge .Listing ul.Level1 li.Level1 .TitleList             {display:table;}
  .LeftPanel.PanelLarge .Listing ul.Level1 li.Level1 .TitleList .Bubble     {}
  .LeftPanel.PanelLarge .Listing ul.Level1 li.Level1 .TitleList .Txt        {display:none;}
  .LeftPanel.PanelLarge .Listing ul.Level2                                  {display:none;}
  .LeftPanel .BtnArrows                                   {display:none;}
}



/* Mobile Header */
@media only screen and (max-width:1024px){
  .MobileHeader                                     {display:block;}
}
@media only screen and (max-width:768px){
  .BtmBtns .AlignRight                              {width:100%;}
}



/* Second Header */
@media only screen and (max-width:1024px){
  .SecondHeader                                     {display:none;}
  .SecondHeader.RegisterLang                        {display:block;}
}
@media only screen and (max-width:768px){
  #SiteLanguage1-menu                               {}
}



/* First Header */
@media only screen and (max-width:1500px) {
  .NavContainer ul.Level1 li.Level1                 {max-width:140px;}
  .FirstHeader .WidthContent .BtnLogout             {margin-left:20px;}
}
@media only screen and (max-width:1400px){
  .FirstHeader .WidthContent                        {padding:0px 80px;}
  .FirstHeader .WidthContent .MyInfo                {display:none;}
  .NavContainer                                     {float:left;}
  .NavContainer ul.Level1 li.Level1                 {margin:0px 18px 0px 0px;}
  .NavContainer ul.Level1 li.Level1 a.Level1        {display:block; padding:8px 0px;}
  .FirstHeader .WidthContent .BtnLogout {margin-left:0px;}
}
@media only screen and (max-width:1024px){
  .FirstHeader .WidthContent                        {display:none;}
  .AdditionalTopInfo {margin-right:0px; margin-top:55px; margin-bottom:-60px;}
}

@media only screen and (max-width:768px){
  .AdditionalTopInfo {margin-top:65px; margin-bottom:-50px;}
}


/* Main Footer */
@media only screen and (max-width:1024px){
  .MainFooter .Footer1 .Column                  {width:30%;}
  .MainFooter .Footer1 .Column_01               {display:none;}
}
@media only screen and (max-width:768px){
  .MainFooter .Footer1 .WidthContent            {padding:45px 40px;}
  .MainFooter .Footer1 .Column                  {width:47%;}
  .MainFooter .Footer1 .Column_04               {display:none;}
  .MainFooter .Footer2 .WidthContent            {text-align:center;}
  .MainFooter .Footer2 .SocialFooter2           {display:block;}
  .MainFooter .Footer2 .Copyright               {float:none; display:inline-block; margin-top:10px;}
  .MainFooter .Footer2 .Developer               {display:none;}
}
@media only screen and (max-width:480px){
  .MainFooter .Footer1 .WidthContent            {display:none;}
  .MainFooter .Footer2 .WidthContent            {padding:0px 30px;}
}


/* Buttons */
@media only screen and (max-width:1400px){
  .BtnBack                                      {left:80px; bottom:40px;}
}
@media only screen and (max-width:1024px){
  .BtnBack                                      {display:none;}
}
@media only screen and (max-width:1024px){
  .BtnDemoAnswer                                {float:none;}
  .BtnDemoAnswer a                              {min-width:unset;}
}


/* Form */
@media only screen and (max-width:768px) {
  .FormBox .FormLabel.AdjustedLabel             {height: inherit;}
}


/* Short Form */
@media only screen and (max-width:1024px){
  .ShortForm .ShortFormInner                    {width:100%; box-sizing:border-box;}
}


/* Extra Short Form */
@media only screen and (max-width:1024px){
  .ExtraShortForm .ExtraShortFormInner          {width:100%;}
}


/* Register */
@media only screen and (max-width:768px){
  .Register                                   {}
  .Register .BoxProject                       {float:none; width:100%; margin-right:0px;}
  .Register .BoxCountry                       {float:none; width:100%; margin-right:0px;}
  .Register .BoxLanguage                      {float:none; width:100%;}
  .Register .BoxTitle                         {float:none; width:100%; margin-right:0px;}
  .Register .BoxFirstName                     {float:none; width:100%; margin-right:0px;}
  .Register .BoxLastName                      {float:none; width:100%; }
  .Register .BoxEmailAddress                  {float:none; width:100%; margin-right:0px;}
  .Register .BoxPassword                      {float:none; width:100%;}
  .Register .BoxCustomerReference             {float:none; width:100%; margin-right:0px;}
  .Register .BusinessUnit                     {float:none; width:100%;}
}

/* Register */
@media only screen and (max-width:768px){
  .ContactUs                     {}
  .ContactUs .BoxTitle           {float:none; width:100%; margin-right:0px;}
  .ContactUs .BoxFirstName       {float:none; width:100%; margin-right:0px;}
  .ContactUs .BoxLastName        {float:none; width:100%;}
  .ContactUs .BoxEmailAddress    {float:none; width:100%; margin-right:0px;}
  .ContactUs .BoxTelephone       {float:none; width:100%;}
}


/* Login */
@media only screen and (max-width:1024px) {
  .Login .Cell .LoginForm                           {padding:200px 40px 80px 40px;} 

  .NewLogin .Table .Cell_01                         {display: none;}
  .NewLogin .Table .Cell_02                         {width:100%; padding-left:0px;}
  .NewLogin .Table .Cell .LoginForm                 {width:100%;}

}
@media only screen and (max-width:768px){
  .Login .Cell                                      {padding:0px 40px;}
  .Login .Cell .LoginForm                           {padding:180px 0px 120px 0px; width:100%;} 

  .NewLogin .Table                                  {display:block; height:auto;}    
  .NewLogin .Table .Cell                            {display:block;} 
}
@media only screen and (max-width:480px){
  .Login .Cell                                      {padding:0px 30px;}
  .Login .Cell .LoginForm                           {padding:120px 0px 60px 0px;} 
  .Login .Cell .LoginForm .RememberMe               {float:none;}
  .Login .Cell .LoginForm .ForgottenPassword        {float:none; margin-top:20px;}
}


/* Presentation */
@media only screen and (max-width:768px){
  .Presentation .Buttons                      {}
  .Presentation .Buttons .Btn                 {display:block; width:100%;}
  .Presentation .Buttons .Btn a               {width:100%; padding:14px 0px;}
  .Presentation .Buttons .BtnSpacer           {display:block; width:100%;}
}


/* Home */
@media only screen and (max-width:1200px) {
  .Home .Panel_02 .WidthContent                                 {padding:60px 0px;}
  .Home .Panel_02 .Title                                        {padding:0px 80px;}
  .swiper-home-panel-two .swiper-slide                          {margin-left:80px; margin-right:-40px;}
  .swiper-home-panel-two .swiper-slide:last-child               {margin-right:80px;}
  .Home .Panel_04 .Title                                        {padding:0px 80px; margin:0px 0px 30px 0px;}
  .Home .Panel_04 .ListCountry .ItemCountry                     {width:48%; margin-right:2%;}
  .Home .Panel_01 .DownArrow                                    {bottom:30px;}
}
@media only screen and (max-width:1024px) {
  .Home .Panel_01 .Cell_01 .Descrition                          {padding:200px 40px 80px 40px;} 
  .Home .Panel_02 .Title                                        {padding:0px 60px;}
  .swiper-home-panel-two .swiper-slide                          {margin-left:60px; margin-right:-40px;}
  .swiper-home-panel-two .swiper-slide:last-child               {margin-right:60px;}
  .Home .Panel_03 .Image                                        {background-size:cover;}
  .Home .Panel_04 .Title                                        {padding:0px 60px;}
}
@media only screen and (max-width:768px){
  .Home .Panel_01 .Cell_01 .Descrition                          {padding:180px 40px 120px 40px;} 
  .Home .Panel_01 .Cell_01 .Descrition .Title                   {font-size:36px;}
  .Home .Panel_01 .Cell_01 .Descrition .Title sup               {font-size:10px;}
  .Home .Panel_01 .Cell_01 .Descrition .Txt                     {font-size:14px; line-height:26px;}
  .Home .Panel_01 .Cell_01 .Descrition .Buttons .BtnRegSign a   {width:180px;}
  .Home .Panel_01 .DownArrow                                    {display:none;}
  .Home .Panel_02 .WidthContent                                 {padding:45px 0px;}
  .Home .Panel_02 .Title                                        {padding:0px 40px; font-size:26px;}
  .swiper-home-panel-two .swiper-slide                          {margin-left:40px; margin-right:-20px;}
  .swiper-home-panel-two .swiper-slide:last-child               {margin-right:40px;}
  .Home .Panel_03 .Desc                                         {padding:45px 40px;}
  .Home .Panel_03 .Desc .Txt_01                                 {font-size:20px;}
  .Home .Panel_03 .Image                                        {height:300px;}
  .Home .Panel_04 .WidthContent                                 {padding:45px 40px;}
  .Home .Panel_04 .Title                                        {padding:0px 40px; font-size:26px;}
  .Home .Panel_04 .ListCountry .ItemCountry                     {width:100%; margin-right:0%; float:none;}
}
@media only screen and (max-width:480px){
  .Home .Panel_01 .Cell_01 .Descrition                          {padding:120px 30px 60px 30px;} 
  .Home .Panel_01 .Cell_01 .Descrition .Buttons .BtnRegSign     {width:100%; text-align:center;}
  .Home .Panel_01 .Cell_01 .Descrition .Buttons .BtnRegSign a   {width:180px; display:inline-block;}
  .Home .Panel_02 .WidthContent                                 {padding:45px 0px;}
  .Home .Panel_02 .Title                                        {padding:0px 30px;}
  .swiper-home-panel-two .swiper-slide                          {margin-left:30px; margin-right:-20px;}
  .swiper-home-panel-two .swiper-slide:last-child               {margin-right:30px;}
  .Home .Panel_03 .Desc                                         {padding:45px 30px;}
  .Home .Panel_04 .WidthContent                                 {padding:45px 30px;}
  .Home .Panel_04 .Title                                        {padding:0px 30px;}
  .Home .Panel_04 .ListCountry .ItemCountry .Img                {width:30px; margin-right:15px;}
  .Home .Panel_04 .ListCountry .ItemCountry .Desc .Details      {font-size:12px;}
  .Home .Panel_04 .ListCountry .ItemCountry .Desc .Country      {margin-bottom:3px;}
  .Home .Panel_04 .ListCountry .ItemCountry.Highlight .Img      {width:70px;}
}


/* CMS Page */
@media only screen and (max-width:1024px){
  .CMSpage .WidthContent                        {padding:120px 40px 40px 40px;}
}
@media only screen and (max-width:768px){
  .CMSpage .WidthContent                        {padding:100px 40px 40px 40px;}
}
@media only screen and (max-width:480px){
  .CMSpage .WidthContent                        {padding:90px 30px 30px 30px;}
}



/* Projects */
@media only screen and (max-width:1400px) {
  .Projects                                                 {padding-right:20px;}
  .Projects .BtnResume                                      {margin-right:-20px;}

  .swiper-projects                                          {margin:0px -80px;}
  .swiper-projects .swiper-slide                            {margin:0px -50px 0px 80px;}
  .swiper-projects .swiper-slide:last-child                 {margin:0px 80px 0px 80px;}

  .swiper-projects .swiper-button-prev                      {left:50px;}
}
@media only screen and (max-width:1200px) {
  .Projects                                                 {padding-right:30px;}
  .Projects .BtnResume                                      {margin-right:-30px;}

  .swiper-projects .swiper-button-prev                      {left:60px;}
}
@media only screen and (max-width:1024px) {
  .Projects                                                 {padding-right:20px;}
  .Projects .BtnResume                                      {margin-right:-20px;}

  .swiper-projects                                          {margin:0px -60px;}
  .swiper-projects .swiper-slide                            {margin:0px -30px 0px 60px;}
  .swiper-projects .swiper-slide:last-child                 {margin:0px 60px 0px 60px;}

  .swiper-projects .swiper-button-prev                      {left:55px;}
}
@media only screen and (max-width:768px) {
  .Projects                                                 {padding-right:10px;}
  .Projects .BtnResume                                      {margin-right:-10px;}

  .swiper-projects                                          {margin:0px -40px;}
  .swiper-projects .swiper-slide                            {margin:0px -10px 0px 40px;}
  .swiper-projects .swiper-slide:last-child                 {margin:0px 40px 0px 40px;}
  .swiper-projects:hover .swiper-button-next                {display:none;}
  .swiper-projects:hover .swiper-button-prev                {display:none;}
}
@media only screen and (max-width:480px) {
  .Projects .BtnResume                                      {float:none;}
  .Projects .BtnResume a                                    {width:100%;}
  .Projects .BtnResume input                                {width:100%;}

  .swiper-projects                                          {margin:0px -30px;}
  .swiper-projects .swiper-slide                            {margin:0px -10px 0px 30px;}
  .swiper-projects .swiper-slide:last-child                 {margin:0px 30px 0px 30px;}
}
@media only screen and (max-width:360px) {
  .Projects                                                 {padding-right:20px;}
  .Projects .BtnResume                                      {margin-right:-20px;}
}


/* My Details */
@media only screen and (max-width:768px) {
  .MyDetails .BoxTitle          {float:none; width:100%; margin-right:0%;}
  .MyDetails .BoxFirstName      {float:none; width:100%; margin-right:0%;}
  .MyDetails .BoxLastName       {float:none; width:100%;}
  .MyDetails .BoxEmailAddress   {float:none; width:100%; margin-right:0%;}
  .MyDetails .BoxPassword       {float:none; width:100%;}
  .MyDetails .BoxGender         {float:none; width:100%; margin-right:0%;}
  .MyDetails .BoxAge            {float:none; width:100%; margin-right:0%;}
  .MyDetails .BoxBirthCountry   {float:none; width:100%;}

  .BottomForm.OtherGenderOpened #GenderOtherPanel     {width:100%;}
  .BottomForm.OtherGenderOpened .BoxBirthCountry      {width:100%;}
}


/* Significant Seven */
@media only screen and (max-width:1400px) {
  .swiper-my-significant-seven                                          {margin:0px -80px;}
  .swiper-my-significant-seven .swiper-slide                            {margin:0px -50px 0px 80px; width:240px;}
  .swiper-my-significant-seven .swiper-slide:last-child                 {margin:0px 80px 0px 80px;}
}
@media only screen and (max-width:1200px) {
}
@media only screen and (max-width:1024px) {
  .swiper-my-significant-seven                                          {margin:0px -60px;}
  .swiper-my-significant-seven .swiper-slide                            {margin:0px -30px 0px 60px;}
  .swiper-my-significant-seven .swiper-slide:last-child                 {margin:0px 60px 0px 60px;}
}
@media only screen and (max-width:768px) {
  .SignificantSeven .Performances                                       {float:none; width:100%;}
  .SignificantSeven .PerformancesSpace                                  {display:none;}
  .swiper-my-significant-seven                                          {margin:0px -40px;}
  .swiper-my-significant-seven .swiper-slide                            {margin:0px -10px 0px 40px; width:220px;}
  .swiper-my-significant-seven .swiper-slide:last-child                 {margin:0px 40px 0px 40px;}
  .swiper-my-significant-seven:hover .swiper-button-next                {display:none;}
  .swiper-my-significant-seven:hover .swiper-button-prev                {display:none;}
}
@media only screen and (max-width:480px) {
  .swiper-my-significant-seven                                          {margin:0px -30px;}
  .swiper-my-significant-seven .swiper-slide                            {margin:0px -10px 0px 30px;}
  .swiper-my-significant-seven .swiper-slide:last-child                 {margin:0px 30px 0px 30px;}
  .swiper-my-significant-seven .swiper-slide .Img img                   {width:160px;}
}


/* Background Information */
@media only screen and (max-width:768px) {
  .BackgroundInformation .BoxGender         {float:left; width:100%; margin-right:0%;}
  .BackgroundInformation .BoxAge            {float:left; width:100%; margin-left:0%;}
  .BackgroundInformation .BoxCountry        {float:none; width:100%;}
  .BackgroundInformation .BoxBackground     {float:none; width:100%; margin-right:0%;}
  .BackgroundInformation .BoxLocation       {float:none; width:100%;}
  .BackgroundInformation .BoxOccupational   {float:none; width:100%; margin-right:0%;}
  .BackgroundInformation .BoxStatus         {float:none; width:100%;}
  .BackgroundInformation .BoxIndustry       {float:none; width:100%; margin-right:0%;}
  .BackgroundInformation .BoxOrganisation   {float:none; width:100%;}
  .BackgroundInformation .BoxSize           {float:none; width:100%; margin-right:0%;}
  .BackgroundInformation .BoxArea           {float:none; width:100%;}
  .BackgroundInformation .BoxOne            {float:none; width:100%; margin-right:0%;}
  .BackgroundInformation .BoxTwo            {float:none; width:100%;}
}
@media only screen and (max-width:480px) {
  .BackgroundInformation .BoxGender         {width:100%; margin-right:0%;}
  .BackgroundInformation .BoxAge            {width:100%;}
}


/* Questionnaire */
@media only screen and (max-width:1400px) {
  .QuestionPage .BoxSortBy {top:60px; right:60px;}
  .QuestionPage .Indication {top:100px; left:60px;}
  .QuestionPage .Indication.WithMargin {margin-right:350px;}
  .QuestionPage .BtnInfo {left:50px;}
}
@media only screen and (max-width:1200px) {
  .QuestionPage .BoxSortBy {top:50px; right:50px;}
  .QuestionPage .Indication {top:90px; left:50px;}
}
@media only screen and (max-width:1024px) {
  .QuestionPage .BoxSortBy                                                      {top:40px; right:50%; margin-right:-115px;}
  .QuestionPage .Indication                                                     {top:70px; left:auto; position:relative; margin-right:auto;}
  .QuestionPage .Indication.WithMargin {margin-right:auto;}
  .QuestionPage .BtnInfo                                                        {left:40px;}
  .QuestionPage .MultiQuestion .QuestionItem                                    {margin-bottom:50px; padding-bottom:50px;}

  .QuestionPage .QuestionWrapper .QuestionItem .Answers                         {width:calc(100% + 10px);}
  .QuestionPage .QuestionWrapper .QuestionItem .Answers .BtnAnswer              {padding-right:10px;} /* width by JS */
}
@media only screen and (max-width:768px) {
  .QuestionPage .BoxSortBy                                                      {top:40px;}
  .QuestionPage .BtnInfo                                                        {left:30px; bottom:40px;}
  .QuestionPage .QuestionWrapper .QuestionItem .Txt.TxtBig                          {font-size:30px;}
  .QuestionPage .QuestionWrapper .QuestionItem .Txt.TxtNormal                       {font-size:30px;}
  .QuestionPage .QuestionWrapper .QuestionItem .Txt.TxtSmall                        {font-size:30px;}
  .QuestionPage .QuestionWrapper .QuestionItem .Card                                        {text-align:center;}
  .QuestionPage .QuestionWrapper .QuestionItem .Card .InnerCard                             {display:inline-block; width:220px;}
  .QuestionPage .QuestionWrapper .QuestionItem .Card .InnerCard .ImgCard                    {display:block; width:100%;}
  .QuestionPage .QuestionWrapper .QuestionItem .Card .InnerCard .DescCard                   {display:block; padding:10px 25px 25px 25px;}
  .QuestionPage .QuestionWrapper .QuestionItem .Card .InnerCard .DescCard .SubTitleCard     {font-size:16px; text-align:center;}
  .QuestionPage .QuestionWrapper .QuestionItem .Card .InnerCard .DescCard .TxtCard          {font-size:12px;}

  .QuestionPage .QuestionWrapper .QuestionItem .Answers.MultipleOptions .BtnAnswer              {}
  .QuestionPage .QuestionWrapper .QuestionItem .Answers.MultipleOptions .BtnAnswer a            {padding:0px; font-family:'Droid Sans', sans-serif, Arial, Helvetica, Verdana; font-size:14px; font-weight:400; color:#545659; background:none !important; border:none !important; letter-spacing:normal; text-transform:none; vertical-align:top !important;}
  .QuestionPage .QuestionWrapper .QuestionItem .Answers.MultipleOptions .BtnAnswer input        {padding:0px; font-family:'Droid Sans', sans-serif, Arial, Helvetica, Verdana; font-size:14px; font-weight:400; color:#787e80; background:none !important; border:none !important; letter-spacing:normal; text-transform:none;}
  .QuestionPage .QuestionWrapper .QuestionItem .Answers.MultipleOptions .BtnAnswer .Icon        {display:inline-block;}
  .QuestionPage .QuestionWrapper .QuestionItem .Answers.MultipleOptions .BtnAnswer .AnswerTxt   {display:block; width:100%; text-align:center; top:0px; transform:none;} 
  .QuestionPage .QuestionWrapper .QuestionItem .Answers.MultipleOptions .BtnAnswer .ProgressIndicator {top:0px;}

  .QuestionPage .QuestionWrapper                                                {padding:0px 0px 40px 0px;}
  .QuestionPage .QuestionWrapper .QuestionItem.QuestionDone .Answers .BtnAnswer a       {border:none;}
  .QuestionPage .QuestionWrapper .QuestionItem.QuestionDone .Answers .BtnAnswer input   {border:none;}
  .QuestionPage .QuestionWrapper .QuestionItem.QuestionDone .Answers .BtnAnswer.Active a       {border:none;}
  .QuestionPage .QuestionWrapper .QuestionItem.QuestionDone .Answers .BtnAnswer.Active input   {border:none;}
  .QuestionPage .Indication {top:55px;}

   .QuestionPage .QuestionWrapper .QuestionItem .Answers .BtnAnswer:hover .Icon  {background-image:url(/Content/Images/Icon_RadioButton.png);} /*disable hover for impression of two button click on touch devices */
   .QuestionPage .QuestionWrapper .QuestionItem .Answers .BtnAnswer.Active .Icon {background-image:url(/Content/Images/Icon_RadioButtonActive.png);} /* this to show Active version on desktop when hovered over active button  */
}
@media only screen and (max-width:480px) {
  .QuestionPage .BoxSortBy                                                      {top:40px;}
  .QuestionPage .BtnInfo                                                        {left:20px; bottom:30px;}
  .QuestionPage .QuestionWrapper                                                {padding:0px 0px 30px 0px;}
  .QuestionPage .QuestionWrapper .QuestionItem .Txt                             {margin-bottom:20px;}
  .QuestionPage .QuestionWrapper .QuestionItem .Txt.TxtBig                          {font-size:25px;}
  .QuestionPage .QuestionWrapper .QuestionItem .Txt.TxtNormal                       {font-size:25px;}
  .QuestionPage .QuestionWrapper .QuestionItem .Txt.TxtSmall                        {font-size:25px;}
  .QuestionPage .QuestionWrapper .QuestionItem .Card                                        {margin:0px 0px 30px 0px;}
  .QuestionPage .QuestionWrapper .QuestionItem .Card .InnerCard .ImgCard img                {width:160px;}
  .QuestionPage .QuestionWrapper .QuestionItem .BigLine                         {margin-bottom:20px;}
  .QuestionPage .QuestionWrapper .QuestionItem .Desc                            {margin-bottom:20px;}
  .QuestionPage .QuestionWrapper .QuestionItem .Answers .BtnAnswer a            {font-size:11px;}
  .QuestionPage .QuestionWrapper .QuestionItem .Answers .BtnAnswer input        {font-size:11px;}
  .QuestionPage .QuestionWrapper .QuestionItem .TenAnswers .BtnAnswer .Icon         {width:20px; height:20px;}
  .QuestionPage .QuestionWrapper .QuestionItem .TenAnswers .BtnAnswer:hover .Icon   {width:20px; height:20px;}
  .QuestionPage .QuestionWrapper .QuestionItem .TenAnswers .BtnAnswer.Active .Icon  {width:20px; height:20px;}
  .QuestionPage .QuestionWrapper .QuestionItem .BtnQuestionNext                 {float:none;}
  .QuestionPage .QuestionWrapper .QuestionItem .BtnQuestionNext a               {width:100%;}
  .QuestionPage .QuestionWrapper .QuestionItem .BtnQuestionNext input           {width:100%;}
  .QuestionPage .MultiQuestion .QuestionItem .Txt.TxtBig    {font-size:26px;}
  .QuestionPage .MultiQuestion .QuestionItem .Txt.TxtNormal {font-size:26px;}
  .QuestionPage .MultiQuestion .QuestionItem .Txt.TxtSmall  {font-size:26px;}

}

@media only screen and (max-width:430px) {
  .QuestionPage .QuestionWrapper .QuestionItem .Answers.MultipleOptions .BtnAnswer a {font-size:13px;}
}

@media only screen and (max-width:400px) {
  .QuestionPage .QuestionWrapper .QuestionItem .Answers.MultipleOptions .BtnAnswer a {font-size:12px;}
}

@media only screen and (max-width:370px) {
  .QuestionPage .QuestionWrapper .QuestionItem .Answers.MultipleOptions .BtnAnswer a {font-size:11px;}
}
@media only screen and (max-width:360px) {
  .QuestionPage .BtnInfo                                                        {left:10px;}
}



/* Sig Seven Strengths */
@media only screen and (max-width:1300px) {
  .WrapperCard.ThreeBlocks .ItemCard                {width:46%; margin:0px 4% 30px 0px;}
}
@media only screen and (max-width:1200px) {
  .WrapperCard.ThreeBlocks .ItemCard                {width:30%; margin:0px 3% 30px 0px;}
}
@media only screen and (max-width:1024px) {
  .WrapperCard .ItemCard                            {width:30.33%;}
  .WrapperCard.ThreeBlocks .ItemCard                {width:46%; margin:0px 4% 30px 0px;}
}
@media only screen and (max-width:768px) {
  .WrapperCard                                      {width:104%;}
  .WrapperCard .ItemCard                            {width:46%; margin:0px 4% 30px 0px;}
  .WrapperCard.ThreeBlocks                          {width:100%;}
  .WrapperCard.ThreeBlocks .ItemCard                {width:100%; margin:0px 0px 30px 0px;}
}
@media only screen and (max-width:480px) {
  .WrapperCard                                      {margin:30px 0px -20px 0px;}
  .WrapperCard .ItemCard                            {margin:0px 4% 20px 0px;}
  .WrapperCard .ItemCard .Desc                      {padding:10px 15px 15px 15px;}
}

@media only screen and (max-width:370px) {
  .WrapperCard .ItemCard .Desc .SubTitle            {letter-spacing:0px;}
  .WrapperCard .ItemCard .Desc {padding-left:10px; padding-right:10px;}
}

@media only screen and (max-width:370px) {
  .WrapperCard                                      {width:103%;}
}

/* Picks Page */
@media only screen and (max-width:1400px) {
  .LargeScreenList .Item {width:46%; margin-right:4%; margin-bottom:3.8%; }
  .LargeScreenList .Item .Img img{width:160px;}
  .LargeScreenList.TwoBlocks .Item  {width:100%; margin-right:0px;}
}

@media only screen and (max-width:1200px){
  .PicksPage .Strengths                                   {margin-right:0px; margin-bottom:30px;}
  .PicksPage .Picks                                       {position:relative; top:auto; right:auto; width:100%; margin-top:40px; margin-top:0px !important;} /* margin-top to disable right panel stay on screen scroll */
  .PicksPage .Picks .PicksTitle                           {margin-bottom:30px;}
  .PicksPage .Picks .ListPicks .ItemPicks .Desc           {text-align:center;}


  .LargeScreenList .Item {width:30%; margin-right:3.33%; margin-bottom:3%; }
  .LargeScreenList .Item .Img img{width:100%;}
  .LargeScreenList.TwoBlocks .Item  {width:46.67%; margin-right:3.33%;}
}
@media only screen and (max-width:768px) {
  .PicksPage .Picks                                       {margin-top:30px;}
  .LargeScreenList                                        {display:none;}
  .swiper-picks                                           {display:block;}
}
@media only screen and (max-width:480px) {
  .swiper-picks                                           {margin:30px -20px 0px;}
  .swiper-picks .swiper-slide                             {margin-left:20px;}
  .swiper-picks .swiper-slide:last-child                  {margin-right:20px;}
}
@media only screen and (max-width:360px) {
  .swiper-picks                                           {margin:30px -10px 0px;}
  .swiper-picks .swiper-slide                             {margin-left:10px;}
  .swiper-picks .swiper-slide:last-child                  {margin-right:10px;}
}


/* Nominate Page */
@media only screen and (max-width:1400px) {
  .NominatePage .NomineeDetails                                   {margin-right:420px;}
  .NominatePage .NomineeNames                                     {width:360px;}

  .NominatePage .NomineeNames .Column .Category .Choices .Item {width:95%;}
}
@media only screen and (max-width:1200px) {
  .NominatePage .NomineeDetails                                   {margin-right:0px;}
  .NominatePage .NomineeNames                                     {width:100%; position:relative; top:auto; right:auto; margin-top:40px;}
  .NominatePage .NomineeNames .NamesTitle                         {margin-bottom:30px;}
  .NominatePage .NomineeNames .Column .Category .Choices .Item    {width:28.33%;}
}
@media only screen and (max-width:1024px){
  .NominatePage .NomineeNames .Column .Category .Choices .Item    {width:45%;}
}
@media only screen and (max-width:768px) {
  .NominatePage .NomineeNames .Column .Category .Choices .Item    {width:95%;}
}


/* Thank You Questionnaire */
@media only screen and (max-width:768px) {
  .ThankYouQuestionnaire h3.Title         {margin-top:30px;}
}


/* Optimizing Your Strengths */
@media only screen and (max-width:1400px){
  .swiper-optimizing-tabs                                         {margin:0px -80px -1px -80px;}
  .swiper-optimizing-tabs .swiper-slide                           {margin:0px -80px -1px 80px;}
}
@media only screen and (max-width:1200px){
}
@media only screen and (max-width:1024px){
  .swiper-optimizing-tabs                                         {margin:0px -60px -1px -60px;}
  .swiper-optimizing-tabs .swiper-slide                           {margin:0px -60px -1px 60px;}
}
@media only screen and (max-width:768px){
  .swiper-optimizing-tabs                                         {margin:0px -40px -1px -40px;}
  .swiper-optimizing-tabs .swiper-slide                           {margin:0px -40px -1px 40px;}
}
@media only screen and (max-width:480px){
  .swiper-optimizing-tabs                                         {margin:0px -30px -1px -30px;}
  .swiper-optimizing-tabs .swiper-slide                           {margin:0px -30px -1px 30px;}
}


/* Congratulation */
@media only screen and (max-width:480px){
  .Congratulation .ValidDatabase                {display:block;}
  .Congratulation .ValidDatabase .Img_VD        {display:block; text-align:center; width:100%;}
  .Congratulation .ValidDatabase .Img_VD img    {width:120px; display:inline-block;}
  .Congratulation .ValidDatabase .Txt_VD        {display:block; padding:0px 20px 20px 20px;}
}


/* Optimizing Your Strengths */
@media only screen and (max-width:1400px){
  .OptimizingYourStrengths .FreeTools .TopFT .BtnTopFt01      {float:none; margin:10px 0px 0px 0px; display:block;}
  .OptimizingYourStrengths .FreeTools .TopFT .BtnTopFt02      {float:none; margin:10px 0px 0px 0px; display:block;}
}
@media only screen and (max-width:1024px){
  .OptimizingYourStrengths .Sustain                         {display:block; width:100%;}
  .OptimizingYourStrengths .Sustain .LeftSus                {display:block; width:100%;}
  .OptimizingYourStrengths .Sustain .RightSus               {display:block;}

  .OptimizingYourStrengths .Sustain .WrapperTabs                                    {display:table; width:100%;}
  .OptimizingYourStrengths .Sustain .WrapperTabs .ItemTabs                          {display:table-cell; width:auto; vertical-align:top;}
  .OptimizingYourStrengths .Sustain .WrapperTabs .ItemTabs a                        {padding:20px 5px; text-align:center; display:block;}
  .OptimizingYourStrengths .Sustain .WrapperTabs .ItemTabs .Icon                    {display:block; width:100%; text-align:center;}
  .OptimizingYourStrengths .Sustain .WrapperTabs .ItemTabs .Icon img                {display:inline-block; width:80px;}
  .OptimizingYourStrengths .Sustain .WrapperTabs .ItemTabs .Txt                     {display:block; padding:10px 10px 0px 10px;}
  .OptimizingYourStrengths .Sustain .WrapperTabs .ItemTabs .BottomBar               {bottom:25%; right:-2px; width:1px; height:50%; background:#ccd3dc;}
  .OptimizingYourStrengths .Sustain .WrapperTabs .ItemTabs:last-child .BottomBar    {display:none;}
}
@media only screen and (max-width:768px){
  .OptimizingYourStrengths .OptimContent .OptBlock .Table             {display:block;}
  .OptimizingYourStrengths .OptimContent .OptBlock .Table .ImgCell    {display:block; width:100%; padding:0px 0px 20px 0px;} 
  .OptimizingYourStrengths .OptimContent .OptBlock .Table .LeftCell   {display:block;}
  .OptimizingYourStrengths .OptimContent .OptBlock .Table .RightCell  {display:block; text-align:left; width:100%; margin-top:15px;}

  .OptimizingYourStrengths .OptBlock .OB_Step .Img              {display:none;}

  .OptimizingYourStrengths .OptBlock .OverdriveBehaviours .Box_OB           {float:none; width:100%;}
  .OptimizingYourStrengths .OptBlock .OverdriveBehaviours .SpacerBox_OB     {display:none;}
  .OptimizingYourStrengths .OptBlock .OverdriveBehaviours .Box_OB_2         {float:none; width:100%;}
  .OptimizingYourStrengths .OptBlock .OverdriveBehaviours .Box_OB_3         {float:none; width:100%;}
  .OptimizingYourStrengths .OptBlock .OverdriveBehaviours .SpacerBox_OB_2   {display:none;}

  .OptimizingYourStrengths .OptBlock .StrengthLabel                               {margin:5px 0px 0px 0px;}
  .OptimizingYourStrengths .OptBlock .StrengthLabel label                         {top:0px;}  
  .OptimizingYourStrengths .OptBlock .StrengthLabel label .Img                    {display:none;}

  .OptimizingYourStrengths .OptBlock .StrengthLabel02 .Img                        {display:none;}

  .OptimizingYourStrengths .FreeTools .TableFT                {display:block;}
  .OptimizingYourStrengths .FreeTools .TableFT .CellFT        {display:block;}
  .OptimizingYourStrengths .FreeTools .TableFT .CellFT_00     {width:100%; padding:0px 0px 20px 0px;}
  .OptimizingYourStrengths .FreeTools .TableFT .CellFT_02     {width:100%; text-align:left; margin-top:15px;}
  .OptimizingYourStrengths .FreeTools .BtnFT                  {margin:0px 10px 0px 0px;}

  .OptimizingYourStrengths .Sustain .WrapperTabs                                    {display:block; width:100%;}
  .OptimizingYourStrengths .Sustain .WrapperTabs .ItemTabs                          {display:block; width:100%; vertical-align:middle;}
  .OptimizingYourStrengths .Sustain .WrapperTabs .ItemTabs a                        {padding:20px 5px; text-align:center;}
  .OptimizingYourStrengths .Sustain .WrapperTabs .ItemTabs .Icon                    {display:none;}
  .OptimizingYourStrengths .Sustain .WrapperTabs .ItemTabs .Txt                     {padding: 0px 10px;}
  .OptimizingYourStrengths .Sustain .WrapperTabs .ItemTabs .BottomBar               {right:-2px; bottom:-1px; right:0px; width:100%; height:1px;}
  .OptimizingYourStrengths .Sustain .WrapperTabs .ItemTabs:last-child .BottomBar    {display:none;}
}



/* P section - BEGIN */
@media only screen and (max-width:1400px){
}
@media only screen and (max-width:1200px){
}
@media only screen and (max-width:1024px){
}
@media only screen and (max-width:768px){

.NomineeConfTable {display:block; border-bottom:none;}
.NomineeConfTable tbody {display:block}
.NomineeConfTable tr {display:block; border-bottom:1px solid #d5d1d1;}
.NomineeConfTable tr.Row10                 {display:none;}
.NomineeConfTable th.Col1 {display:block; border-bottom:none;}
.NomineeConfTable td {display:inline-block; border-bottom:none; box-sizing:border-box;}
.NomineeConfTable td.Col1 {width:45%;}
.NomineeConfTable td.Col2 {width:54%;}
.NomineeConfTable td.Col3 {width:45%; padding-top:0px;}
.NomineeConfTable td.Col4 {width:54%; padding-top:0px;}
}
@media only screen and (max-width:550px){
.NomineeConfTable td.Col1 {width:100%;}
.NomineeConfTable td.Col2 {width:100%; padding-top:0px;}
.NomineeConfTable td.Col3 {width:100%; padding-top:0px;}
.NomineeConfTable td.Col4 {width:100%; padding-top:0px;}
.NomineeConfTable td.Col11                  {display:none;}
.NomineeConfTable td.Col12                  {display:none;}
.NomineeConfTable td.Col13                  {display:none;}
.NomineeConfTable td.Col14                  {display:none;}
}
@media only screen and (max-width:480px){
}
@media only screen and (max-width:410px){
  .QuestionPage .QuestionWrapper .QuestionItem .Answers .BtnAnswer .Icon {width:26px; height:26px;}
  .QuestionPage .QuestionWrapper .QuestionItem .Answers .BtnAnswer:hover .Icon  {width:26px; height:26px;}
  .QuestionPage .QuestionWrapper .QuestionItem .Answers .BtnAnswer.Active .Icon {width:26px; height:26px;}
}
@media only screen and (max-width:350px){
  .QuestionPage .QuestionWrapper .QuestionItem .Answers .BtnAnswer .Icon {width:24px; height:24px;}
  .QuestionPage .QuestionWrapper .QuestionItem .Answers .BtnAnswer:hover .Icon  {width:24px; height:24px;}
  .QuestionPage .QuestionWrapper .QuestionItem .Answers .BtnAnswer.Active .Icon {width:24px; height:24px;}
}
@media only screen and (max-width:360px){
  .TopListing ul.Level1 li.Level1 {padding-left:2px; padding-right:2px;}
  .NominatePage .NomineeNames .Column .Category .Choices .Item { letter-spacing:0px; }
}
/* P section - END */

/* StrengthsHub */
@media only screen and (max-width:1400px) {
  .StrengthBlocks .Name                                                             {padding:0px 5px;}

  .HubContentTable .RightCell                                                       {width:230px;}

  .HubOptionsPanel                                                                  {width:200px;}
  .HubOptionsPanel .OptionDetails .Details                                          {display:block; margin-bottom:15px;}
  .HubOptionsPanel .OptionDetails .Btn                                              {display:block; width:100%;}
  .HubOptionsPanel .OptionDetails .Btn .BtnBlock                                    {width:100%;}
}

@media only screen and (max-width:1300px) {
  .StrengthBlocks.TwoBlocks .Block                                                  {width:100%;}

  .StrengthsJournalDetails .JDTable .DetailsRow:last-child .LeftCell                {padding-bottom:20px;}
  .StrengthsJournalDetails .JDTable .DetailsRow:last-child .RightCell               {padding-bottom:20px;}
  .StrengthsJournalDetails .JDTable .LeftCell                                       {padding:15px 20px;}
  .StrengthsJournalDetails .JDTable .RightCell                                      {padding:15px 15px;}

  .SJDetails.CoachTips3                                                             {border:none; margin-top:35px;}
  .SJDetails.CoachTips3 .SJDetailsTable .StrRow.Hdr                                 {display:none;}
  .SJDetails.CoachTips3 .SJDetailsTable                                             {margin-top:-10px; margin-bottom:30px;}
  .SJDetails.CoachTips3 .SJDetailsTable .StrRow                                     {display:block; border:none; padding-bottom:35px; border-bottom:1px solid #D4D3D3; margin-bottom:30px; padding-bottom:35px; border-bottom:1px solid #D4D3D3; margin-bottom:30px;}
  .SJDetails.CoachTips3 .SJDetailsTable .StrRow:last-child                          {padding-bottom:0px; border:none; margin-bottom:0px;}
  .SJDetails.CoachTips3 .SJDetailsTable .Col1                                       {display:block; border:none; padding:0px 0px 15px 0px; padding:0px 0px 28px 0px;}
  .SJDetails.CoachTips3 .SJDetailsTable .Col1 .ColLabelSm                           {padding-left:0px;}
  .SJDetails.CoachTips3 .SJDetailsTable .Col1 .ColDesc                              {padding:5px 0px 0px 0px; font-size:1.3em;}
  .SJDetails.CoachTips3 .SJDetailsTable .Col2                                       {display:block; border:none; padding:0px 0px 15px 0px;}
  .SJDetails.CoachTips3 .SJDetailsTable .Col3                                       {border:none; padding:0px; padding:0px 0px 25px 0px; border-right:none;}
  .SJDetails.CoachTips3 .SJDetailsTable .Col4                                       {padding:0px; text-align:left;}
  .SJDetails.CoachTips3 .SJDetailsTable .StrLabel .Img                              {margin-left:-10px;}
}

@media only screen and (max-width:1200px) {
  .StrengthBlocks.TwoBlocks .Block                                                  {width:50%;}
  .StrengthBlocks.ThreeBlocks .Block                                                {width:50%;}
  .StrengthBlocks .Name                                                             {padding:0px 20px;}
}

@media only screen and (max-width:1024px) {
  .SJDetails                                                                        {border:none; margin-top:35px;}
  .SJDetails .SJDetailsTable .StrRow                                                {display:block; border:none; padding-bottom:35px; border-bottom:1px solid #D4D3D3; margin-bottom:30px;}
  .SJDetails .SJDetailsTable .StrRow.Hdr                                            {display:none;}
  .SJDetails .SJDetailsTable .Col1                                                  {display:block; border:none; padding:0px 0px 15px 0px;}
  .SJDetails .SJDetailsTable .Col2                                                  {display:block; border:none; padding:0px 0px 15px 0px;}
  .SJDetails .SJDetailsTable .Col3                                                  {border:none; padding:0px;}
  .SJDetails .StrLabel .Img                                                         {margin-left:-10px;}
  .SJDetails .InfoRow                                                               {display:block;}
  .SJDetails .InfoRow .InfoTxt                                                      {padding:0px 0px 20px 0px;}
  .SJDetails .ColLabelSm                                                            {display:block; line-height:1.5em;}
  .SJDetails.CoachTips2 .SJDetailsTable                                             {margin-top:-10px;}
  .SJDetails.CoachTips2 .SJDetailsTable .Col1                                       {padding:0px 0px 15px 0px;}
  .SJDetails.CoachTips2 .SJDetailsTable .Col1 .ColLabelSm                           {padding-left:0px;}
  .SJDetails.CoachTips2 .SJDetailsTable .Col3                                       {padding:0px;}
}

@media only screen and (max-width:900px) {
  .StrengthBlocks.TwoBlocks .Block                                                  {width:100%;}
  .StrengthBlocks.ThreeBlocks .Block                                                {width:100%;}
}

@media only screen and (max-width:768px){
  .HubContentTable                                                                  {display:block;}
  .HubContentTable .LeftCell                                                        {display:block;}
  .HubContentTable .RightCell                                                       {display:block; width:100%;}
  .HubContentTable .HdrTable                                                        {display:block;}
  .HubContentTable .HdrTable .LeftCell                                              {display:block; width:100%;}
  .HubContentTable .HdrTable .RightCell                                             {display:block; width:100%;}
  .HubContentTable .HdrBtns                                                         {display:block; margin-left:initial;}
  .HubContentTable .HdrBtns .Btn                                                    {display:block; padding-left:0px; margin-bottom:15px;}
  .HubContentTable .HdrBtns .BtnWhite a                                             {width:100%;}

  .HubJournalsList .swiper-button-next                                              {opacity:0.6; right:0px;}
  .HubJournalsList .swiper-button-prev                                              {opacity:0.6; left:0px;}

  .HubBtmBtns                                                                       {-webkit-transform:scaleY(-1); -ms-transform:scaleY(-1); transform:scaleY(-1);}
  .HubBtmBtns .HubBtnBack                                                           {float:none; width:100%; -webkit-transform:scaleY(-1); -ms-transform:scaleY(-1); transform:scaleY(-1);}
  .HubBtmBtns .HubBtnBack input                                                     {width:100%;}
  .HubBtmBtns .HubBtnForward                                                        {float:none; width:100%; margin-top:20px; -webkit-transform:scaleY(-1); -ms-transform:scaleY(-1); transform:scaleY(-1);}
  .HubBtmBtns .HubBtnForward input                                                  {width:100%;}

  .HubOptionsPanel                                                                  {margin:40px 0px -20px 0px; width:100%;}
  .HubOptionsPanel .OptionDetails .Details                                          {display:table-cell; vertical-align:middle;}
  .HubOptionsPanel .OptionDetails .Btn                                              {display:table-cell;  width:80px;}
  .HubOptionsPanel .OptionDetails .Btn .BtnBlock                                    {width:80px;}

  .StrengthsJournalDetails .JDTable .DetailsRow:last-child .LeftCell                {padding-bottom:15px;}
  .StrengthsJournalDetails .JDTable .DetailsRow:last-child .RightCell               {padding-bottom:15px;}
  .StrengthsJournalDetails .JDTable .LeftCell                                       {padding:15px 15px;}
  .StrengthsJournalDetails .JDTable .RightCell                                      {padding:15px 10px;}

  .StrengthsJournal .JSSectionBlock                                                 {padding:20px;}
  .StrengthsJournal .JSSectionBlock .BlockContents                                  {display:block;}
  .StrengthsJournal .JSSectionBlock .Img                                            {width:120px; padding-right:0px; margin:0px auto 25px auto;}
  .StrengthsJournal .JSSectionBlock .Txt                                            {margin-bottom:35px; padding:0px;}
  .StrengthsJournal .JSSectionBlock .Btn                                            {width:100%;}
  .StrengthsJournal .JSSectionBlock .Btn .BtnBlue                                   {width:100%;}
  .StrengthsJournal .JSSectionBlock .Btn2 a                                         {width:100%;}
  .StrengthsJournal .JSSectionBlock.Inactive .SoonLabel                             {width:100%; padding:0px 0px 10px 0px;}
  .StrengthsJournal .DateLabels                                                     {display:block;}
  .StrengthsJournal .DateLabels .DLBlock                                            {margin-bottom:30px;}
  .StrengthsJournal .BtmBtns.SideBtns                                               {display:block;}
  .StrengthsJournal .BtmBtns .BtnBlue                                               {display:block; margin-bottom:15px;}
  .StrengthsJournal .BtmBtns .BtnWhite                                              {display:block; margin-bottom:15px;}
  .StrengthsJournal .BtmBtns .AlignRight .BtnBlue                                   {display:block;}
  .StrengthsJournal .BtmBtns .LeftBtn                                               {margin-right:0px;}
  
  .ToolkitBlocks .Block                                                             {display:block; width:100%;}
}

@media only screen and (max-width:480px){
  .HubJournalsList .swiper-button-next                                              {top:36px; width:20px; height:20px; background-size:20px 20px;}
  .HubJournalsList .swiper-button-prev                                              {top:36px; width:20px; height:20px; background-size:20px 20px;}
}

/* Pop-ups */
@media only screen and (max-width:768px) {
  .PopupParent .Popup .Inner                                                        {padding:20px;}
  .PopupParent .HubVideo.Vimeo .CloseBtn                                            {display:none;}
  .PopupParent .HubVideo.Standard .CloseBtn                                         {display:none;}
  .PopupParent .HubVideo video                                                      {display:block; margin:0 auto; width:408px; height:230px;}
  .PopupParent .iframePopup.Video iframe                                            {display:block; margin:0 auto; width:408px; height:230px;}
  .PopupParent .iframePopup.Video .CloseBtn                                         {display:none;}

  .IntroHubContent p                                                                {font-size:14px;}
  .IntroHubContent .Img                                                             {/*display:none*/;}

  .IHPopup1Layout                                                                   {display:block;}
  .IHPopup1Layout .Txt                                                              {display:block; padding-right:0px;}
  .IHPopup1Layout .Img                                                              {display:block; text-align:center; margin-top:20px;}
  .IHPopup1Layout .Img img                                                          {max-width:185px;}

  .PopupParent .Popup .BtmBtnsContainer.EarlySm                                     {padding-left:20px; padding-right:20px;}
  .PopupParent .Popup .BtmBtnsContainer.EarlySm .BtmBtns .RightBtn                  {margin-top:0px; margin-bottom:10px;}
  .PopupParent .Popup .BtmBtnsContainer.EarlySm .BtmBtns .RightBtn.SingleBtn        {margin-bottom:0px;}
  .PopupParent .Popup .BtmBtnsContainer.EarlySm .BtmBtns .ViewBtn                   {margin-top:0px; margin-bottom:10px;}
  .PopupParent .Popup .BtmBtnsContainer.EarlySm .BtmBtns .ViewBtn.SingleBtn         {margin-bottom:0px;}
  .PopupParent .Popup .BtmBtnsContainer.EarlySm .BtmBtns .ViewBtn2                  {margin-top:0px; margin-bottom:10px;}
  .PopupParent .Popup .BtmBtnsContainer.EarlySm .BtmBtns .ViewBtn2.SingleBtn        {margin-bottom:0px;}
  .PopupParent .Popup .BtmBtnsContainer.EarlySm .BtmBtns                            {display:flex; flex-direction:column-reverse;}
  .PopupParent .Popup .BtmBtnsContainer.EarlySm .BtmBtns.EvenBtnWidth .LeftBtn      {width:100%;}
  .PopupParent .Popup .BtmBtnsContainer.EarlySm .BtmBtns.EvenBtnWidth .RightBtn     {width:100%;}
  .PopupParent .Popup .BtmBtnsContainer.EarlySm .BtmBtns .LeftBtn                   {display:block;}
  .PopupParent .Popup .BtmBtnsContainer.EarlySm .BtmBtns .RightBtn                  {display:block; padding-left:0px;}
  .PopupParent .Popup .BtmBtnsContainer.EarlySm .BtmBtns .ViewBtn                   {display:block; padding-left:0px;}
  .PopupParent .Popup .BtmBtnsContainer.EarlySm .BtmBtns .ViewBtn2                  {display:block; padding-left:0px;}
}
@media only screen and (max-width:480px) {
  .PopupParent .Popup .PopupMsg h2.Hdr3                                             {padding:17px 60px 15px 20px;}
  .PopupParent .Popup .MsgContainer                                                 {padding-left:20px; padding-right:20px;}
  .PopupParent .Popup .PopupMsg.MiddleBlock                                         {max-height: calc(100vh - 230px);}
  .PopupParent .Popup .BtmBtnsContainer                                             {padding-left:20px; padding-right:20px;}
  .PopupParent .Popup .BtmBtnsContainer .BtmBtns .RightBtn                          {margin-top:0px; margin-bottom:10px;}
  .PopupParent .Popup .BtmBtnsContainer .BtmBtns .RightBtn.SingleBtn                {margin-bottom:0px;}
  .PopupParent .Popup .BtmBtnsContainer .BtmBtns .ViewBtn                           {margin-top:0px; margin-bottom:10px;}
  .PopupParent .Popup .BtmBtnsContainer .BtmBtns .ViewBtn.SingleBtn                 {margin-bottom:0px;}
  .PopupParent .Popup .BtmBtnsContainer .BtmBtns .ViewBtn2                          {margin-top:0px; margin-bottom:10px;}
  .PopupParent .Popup .BtmBtnsContainer .BtmBtns .ViewBtn2.SingleBtn                {margin-bottom:0px;}
  .PopupParent .Popup .BtmBtns                                                      {display:flex; flex-direction:column-reverse;}
  .PopupParent .Popup .BtmBtns.EvenBtnWidth .LeftBtn                                {width:100%;}
  .PopupParent .Popup .BtmBtns.EvenBtnWidth .RightBtn                               {width:100%;}
  .PopupParent .Popup .BtmBtns .LeftBtn                                             {display:block;}
  .PopupParent .Popup .BtmBtns .RightBtn                                            {display:block; padding-left:0px; margin-top:15px;}
  .PopupParent .Popup .BtmBtns .ViewBtn                                             {display:block; padding-left:0px; margin-top:15px;}
  .PopupParent .Popup .BtmBtns .ViewBtn2                                            {display:block; padding-left:0px; margin-top:15px;}
  .PopupParent .Popup .Inner                                                        {padding:10px;}
  .PopupParent .HubVideo video                                                      {width:260px; height:146px;}
  .PopupParent .iframePopup.Video iframe                                            {width:260px; height:146px;}

  .StrengthsJournalDetails .JDTable .LeftCell                                       {padding:15px 10px;}
  .StrengthsJournalDetails .JDTable .RightCell                                      {font-size:11px;}
  .StrengthsJournalDetails .Question                                                {font-size:11px;}
}
@media only screen and (max-width:360px) {
  .PopupParent .Popup .PopupMsg h2.Hdr3                                             {padding:17px 60px 15px 10px;}
  .PopupParent .Popup .MsgContainer                                                 {padding-left:10px; padding-right:10px;}
  .PopupParent .Popup .BtmBtnsContainer                                             {padding-left:10px; padding-right:10px;}
}




/* Courses */
@media only screen and (max-width:1200px) {
  .Courses .AsideLeft                         {width:200px; padding-right:40px;}
  .Courses .AsideRight                        {width:200px; padding-left:40px;}

  .ProgressGuide .Item .Txt .LeftSide         {width:120px;}
}
@media only screen and (max-width:1024px) {
  .Courses                                    {display:block; height:auto;}
  .Courses .AsideLeft                         {display:block; width:100%; margin-bottom:30px;}
  .Courses .Main                              {display:block;}
  .Courses .AsideRight                        {display:block; width:100%; padding:0px;}

  .ProgressGuide .Item .Title                 {text-align:center;}
  .ProgressGuide .Item .Txt                   {max-width:320px; margin:0 auto;}
  .ProgressGuide .Item .Txt .LeftSide         {width:inherit; flex:0 0 80%;}
  .ProgressGuide .Item .Txt .RightSide        {width:inherit; flex:0 0 20%; text-align:right;}

  .StrengthsSelectionBlocks .SSBlock          {flex:0 0 33.33%;}
}
@media only screen and (max-width:768px) {
  .StrengthsSelectionBlocks .SSBlock          {flex:0 0 50%;}
}
@media only screen and (max-width:480px) {
  .StrengthsSelectionBlocks                   {width:100%;}
  .StrengthsSelectionBlocks .SSBlock          {flex:0 0 100%; padding-right:0px;}
}




/* Previous Goals */
@media only screen and (max-width:768px) {
  .PreviousGoalsList .PreviousGoalsItem                                             {display:block;}
  .PreviousGoalsList .PreviousGoalsItem .Desc                                       {display:block;}
  .PreviousGoalsList .PreviousGoalsItem .Btns                                       {display:block; width:100%; margin-top:10px;}
}
@media only screen and (max-width:480px) {
  .PreviousGoalsList .PreviousGoalsItem                                             {padding:20px 20px;}
}




/* Podcast - Resources */
@media only screen and (max-width:1400px) {
  .PodcastWrapper .PodcastItem                      {width:25%;}
}
@media only screen and (max-width:1200px) {
  .PodcastWrapper .PodcastItem                      {width:33.33%;}
}
@media only screen and (max-width:1024px) {
  .PodcastWrapper .PodcastItem                      {width:33.33%;}
}
@media only screen and (max-width:768px) {
  .PodcastWrapper .PodcastItem                      {width:50%;}

  .TopHeadSearch                                    {display:block; margin:0px 0px 20px 0px;}
  .TopHeadSearch h1                                 {display:block; margin:0px 0px 20px 0px;}
  .TopHeadSearch .SearchBoxContainer                {display:block; width:100%;}
}
@media only screen and (max-width:480px) {
  .PodcastWrapper                                   {width:100%;}
  .PodcastWrapper .PodcastItem                      {padding:0 0px 20px 0; width:100%;}
}



/* Assessment Progress */
@media only screen and (max-width:768px) {
  .AssessmentProgress .SectionBlock                           {padding: 8px 12px;}
  .AssessmentProgress .SectionBlock .SBInner                  {flex-wrap: wrap;}
  .AssessmentProgress .SectionBlock .Img                      {align-self: flex-start;}
  .AssessmentProgress .SectionBlock .ActionBtn.SendReminderBtn{flex: 0 0 100%; padding: 0px;}
  .AssessmentProgress .SectionBlock .ActionBtn                {flex: 0 0 100%; padding: 10px 0px 0px 0px;}
  .AssessmentProgress .SectionBlock.New .Name                 {padding-right: 70px;}
}



/* Assessment Description */
@media only screen and (max-width:1024px) {
  .AssessDescPanels                                           {flex-wrap: wrap;}
  .AssessDescPanels .LeftSide                                 {flex: 0 0 100%; order: 2; padding-right: 0px;}
  .AssessDescPanels .RightSide                                {flex: 0 0 100%; order: 1; margin-bottom: 20px;}
}



/* Assessment Confirmation */
@media only screen and (max-width:768px) {
  .AssessmentConfirmation                                      {height:inherit;}
}



/* Measures Of Success */
@media only screen and (max-width:1200px) {
  .MoSQ2AssessmentConfirmation .MoSquestionnaire .LeftCol       {flex:0 0 500px; padding-left:0px;}
}

@media only screen and (max-width:1024px) {
  .MoSQ2AssessmentConfirmation h1                                       {font-size:18px; line-height:1.4em; margin:0px 0px 30px 0px;}
  .MoSQ2AssessmentConfirmation .IntroLine                               {font-size:12px; margin-bottom:15px;}
  .MoSQ2AssessmentConfirmation .LineBlock                               {margin-bottom:20px;}
  .MoSQ2AssessmentConfirmation .HdrLine                                 {font-size:14px; line-height:1.6em;}
  .MoSQ2AssessmentConfirmation .SubHdr                                  {font-size:14px;}
  .MoSQ2AssessmentConfirmation .ChartIcon                               {text-align:center;}
  .MoSQ2AssessmentConfirmation .TxtLine                                 {margin-top:0px;}
  .MoSQ2AssessmentConfirmation .MoSquestionnaire                        {flex-wrap:wrap; margin-bottom:40px;}
  .MoSQ2AssessmentConfirmation .MoSquestionnaire .LeftCol               {flex:0 0 100%;}
  .MoSQ2AssessmentConfirmation .MoSquestionnaire .LeftCol .Img          {width:430px; margin:0px auto;}
  .MoSQ2AssessmentConfirmation .MoSquestionnaire .LeftCol .WheelImg     {margin-left:0px;}
  .MoSQ2AssessmentConfirmation .MoSquestionnaire .LeftCol .EnlargeIcon  {left:370px;}
  .MoSQ2AssessmentConfirmation .MoSquestionnaire .RightCol              {flex:0 0 100%; padding-top:20px;}
  .MoSQ2AssessmentConfirmation .MoSquestionnaire .AnswerRow             {gap:10px;}
  .MoSQ2AssessmentConfirmation .MoSquestionnaire .AnswerRow .ABlock     {flex:1;}
}

@media only screen and (max-width:1024px) {
  .MeasuresOfSuccessContent .QuestionList .QLBlock .QLineLg .NumBlock .LowerDescTxt   {display:none;}
}

@media only screen and (max-width:768px) {
  .MeasuresOfSuccessContent .RedLine                                                  {font-size:12px;}
  .MeasuresOfSuccessContent p                                                         {font-size:12px;}
  .MeasuresOfSuccessContent .QuestionList                                             {margin-top:25px;}
  .MeasuresOfSuccessContent .QuestionList .QLBlock                                    {margin-bottom:30px;}
  .MeasuresOfSuccessContent .QuestionList .QLBlock p                                  {font-size:12px; margin-bottom:10px;}
  .MeasuresOfSuccessContent .QuestionList .QLBlock .QLineLg                           {display:none;}
  .MeasuresOfSuccessContent .QuestionList .QLBlock .QLineSm                           {display:flex;}
  .MeasuresOfSuccessContent .TxtField p                                               {margin-bottom:10px;}
  .MeasuresOfSuccessContent .TxtField textarea                                        {font-size:12px; padding:10px;}
}

@media only screen and (max-width:480px) {
  .MeasuresOfSuccessContent .QuestionList .QLBlock .QLineSm     {gap:0px;}

  .MoSQ2AssessmentConfirmation .MoSquestionnaire .LeftCol .Img            {width:315px;}
  .MoSQ2AssessmentConfirmation .MoSquestionnaire .LeftCol .EnlargeIcon    {width:30px; left:255px;}
}