<style>

.top-margin {margin-top:20px }
.bottom-margin {margin-bottom:10px }
/*
h1, h2, h3, h4 { color:#4c4c4c; }
.feature-box-20161206 h1, .feature-box-20161206 h2, .feature-box-20161206 h3, .feature-box-20161206 h4 { color:inherit; }
.page-content-top .primary-message h1, 
.page-content-top .primary-message p
{ color:white !important }
*/  

.cat-content-top, .page-content-top  {
  background-image: url(../images/top-header-default.jpg);
}


.error-msg {margin-left:15px; margin-bottom:0px; color:black }
.border-red { border-style:solid;border-width:1px;border-color:red;}
.border-green { border-style:solid;border-width:1px;border-color:green;}



.border-black { border-style:solid;border-width:1px;border-color:black;}
.bg-green { background-color:green}
.bg-red{background-color:red}
.bg-yellow {background-color:yellow}

.hide {display:none  }
.hide-cart {display:none  !important}

.table {padding-top:1.75rem ; padding-left:0px }

.table .th { background-color:rgb(153 ,153 ,153); overflow:hidden; }

.table .th { padding-left:0px }
.table .tr { padding-left:0px }

.total-line  { padding-left:0px; }


.table .td , .total-line .td  { padding-left:1rem; padding-right:1rem;padding-top:.5rem ;padding-bottom:.5rem ; overflow:hidden;  }
.table .th .td, .white { color:white; }
.table .th .td a { color:white; }
.table .th .td { font-weight:600; font-size:125% }

.table .td .gtr--green, .value .gtr--green
{ font-weight:600;background-color:rgb(47, 174, 23); border-radius:2px; color:white; font-size:75% }
.table .td .gtr--yellow, .value .gtr--yellow
{ font-weight:600;background-color:rgb(254, 190, 16); border-radius:2px; color:white; font-size:75% }
.table .td .gtr { xpadding-left:.5rem; xpadding-right:.5rem; padding-top:.35rem; padding-bottom:.3rem }

.table .td span { font-size:80% }
.nowrap { white-space: nowrap }
.table .row-highlight-b { background-color:rgb(237, 237, 237) }
.table .shadedbackground { background-color:rgb(237, 237, 237) }
.table .row-highlight-a { background-color:rgb(255, 255, 255) }





.prompt {width:25%;background-color:rgb(153 ,153 ,153);;color:white;text-align:right;float:left;padding-right:10px;margin-bottom:10px;overflow:hidden;max-height:22px; }

.value  {width:75%;;float:left; margin-bottom:10px;padding-left:10px; }

.xborder { border-style:solid;border-width:1px;}

.last {margin-bottom:0px;}

.mobilegroup {  float:left;width:100%;margin-bottom:10px !important; }

.mobileshadedbackground { background-color:rgb(237, 237, 237) }
.prompt a { color:white }

.onehundredpercent { width:100% }

/*  end of fynwyd table stuff */

/* start of copy-outside and copy-inside boxes */

.notiphone { display:none }
.iphone { display:block }

@media screen and (min-width: 769px) {

.notiphone { display:block }
.iphone { display:none }
	}



 
.unit-title-two-column a { padding-bottom:0px }

/* 1 across */
.copy-outside-box-1  {
 width:100%
 }

/* 2 across */
.copy-outside-box-2  {
 width:100%
 }
@media screen and (min-width: 768px) {

	.copy-outside-box-2  {
	width:50%
	}
}
@media screen and (min-width: 769px) {
	.copy-outside-box-2  {
	width:50%
	}
}


/* 3 across */
.copy-outside-box-3  {
 width:100%
 }
@media screen and (min-width: 768px) {

	.copy-outside-box-3  {
	width:50%
	}
}
@media screen and (min-width: 769px) {
	.copy-outside-box-3  {
	width:33.3333%
	}
}

/* 4 across */
.copy-outside-box-4   {
 width:100%
 }


@media screen and (min-width: 768px) {

	.copy-outside-box-4  {
	width:50%
	}
}
@media screen and (min-width: 769px) {

	.copy-outside-box-4  {
	width:25%
	}
}

.copy-outside-box {
padding-left:1.75rem;;
height:110px;
float:left;
border-style:solid;
border-width:1px;
border-color:transparent;
}

.copy-inside-box {
/* john, do not need float:left and do not need width:90% */
margin:.5rem;
padding:1.5rem;
height:100px;
display:block;
border-bottom-style:solid;
border-width:1px;
border-color:rgb(244, 167, 118);;
background-color:rgb(237, 237, 237);
position:relative;
}




 
.copy-inside-box ,   .page-content .copy-outside-box .copy-inside-box  * {
font-size:15px;
color:rgb(0,86,158)   ;
	line-height:100% !important;
	font-weight:normal;

}

.copy-inside-box:hover ,      .page-content .copy-outside-box .copy-inside-box:hover  * {
color:white !important ;
background-color:rgb(0,86,158);

}

.right { float:right }
.left {float:left }

.boxes div.modality  {
font-size:8pt;

text-align:left;
height:12pt;
line-height:100%
}

.page-content .copy-outside-box .copy-inside-box div.modality .left  {
font-size:8pt;

text-align:left;
height:12pt;
line-height:100%
}
.page-content .copy-outside-box .copy-inside-box div.modality .right  {
font-size:8pt;

text-align:right;
height:12pt;
line-height:100%
}

 
 .boxes div.scheduled {
font-size:8pt;

text-align:left;
height:12pt;
line-height:100%;
padding-top:5px;
}
/* end of copy-outside and copy-inside boxes */

.centercoursename { height:140px;display: flex;align-items: center;justify-content: center }; 

/* course-box-polec start */

.polec-related-box {
  height:1235px !important;
}
.course-box-polec {
  display: block;
  border: solid 1px #999;
  margin-bottom: 2rem;
  background-color: #fff;
  color: #000;
  font-size: 13px;
}

.course-box-polec h4 {
  font-size: 14.3px;
  font-weight: 600;
}

.course-box-polec  .coursenamecolor {  
color: #2a9ee9; 
font-size:125%; 
font-weight:bold; 
line-height:1.5; 
padding-bottom:28px;
xoverflow:hidden }

.course-box-polec .coursenumbercolor , .course-box-polec .coursenumbercolor a{
  color: #043351; font-size:113%;font-weight:bold;line-height:1.5 
}

.course-box-polec:hover   .star-footer   { background-color:#ededed !important;color:black }
.course-box-polec:hover   .star-footer  *  { background-color:#ededed !important;color:black }
.course-box-polec:hover   .inner-cta  { background-color:white !important; }
.course-box-polec .star-footer { border-style:solid; border-color:black;border-width:1px;;border-top-style:none}

@media screen and (min-width: 769px) {
  .course-box-polec h4 {
    font-size: 16px;
  }
}
.course-box-polec .inner-cta {
  padding: 1rem;
}
@media screen and (min-width: 480px) {
  .course-box-polec .inner-cta {
    min-height: 150px;
  }
}
@media screen and (min-width: 1024px) {
  /* line 797, ../scss/ui/_units.scss */
  .course-box-polec .inner-cta-tall {
    min-height: 200px;
  }
}
@media screen and (min-width: 1200px) {
  .course-box-polec .inner-cta-tall {
    min-height: 175px;
  }
}
.course-box-polec .star-footer {
  background-color: #043352; #2a9ee9;
  color: #fff !important;
  padding: 1rem;
}
@media screen and (min-width: 769px) {
  .course-box-polec {
    font-size: 12.8px;
  }
}

.course-box-polec:hover {
  background-color: #ededed;
  text-decoration: none;
}

/* course-box-polec-end */

/* search-content-box start */
.course-box-polec  .search-content-title {
	height:25px;
	overflow:hidden;
   display: flex;
   align-items: center;
   njustify-content: center; 
   color: blue; 
   font-size:150%; 
   font-weight:bold; 
   line-height:1.5;
}
.course-box-polec .search-content-text , .course-box-polec .search-content-text a {
   color: black; 
   font-weight:bold;
	overflow:hidden;
	float:left;
	width:100%;
	height:183px;
	line-height:1.7;
	font-size:14px;
	text-decoration:none;
}
/* search-content-box end */


/* social media icons hovers */


 
footer .bottom-footer-section .footer-contact-unit .social-unit a:hover .fa-google-plus-square
{ color:#dc4a38 }
footer .bottom-footer-section .footer-contact-unit .social-unit a:hover .fa-twitter-square
{ color:#1da1f3}
footer .bottom-footer-section .footer-contact-unit .social-unit a:hover .fa-facebook-square
{ color:#3c5a9a}
footer .bottom-footer-section .footer-contact-unit .social-unit a:hover .fa-linkedin-square
{ color:#0274b3}
footer .bottom-footer-section .footer-contact-unit .social-unit a:hover .fa-youtube-square
{ color:#e32c26}

/* social media icons hovers end */


.search-high-lighter {
   xcolor:black;
   background-color:#e5e5e5 !important;
   font-size:200%;
}
 
.related-box-sidebar { padding-left:0px !important; padding-top:10px !important }

 


.viewon-ipad { display:  }
.viewon-iphone { display:  }
.viewon-desktop{ display: }
.viewon-desktop-ipad{ display: }
.viewon-desktop-ipad-iphone { display: }  
.viewborder-on-iphone { border-bottom-style:none }  

.viewon-ipad-block { display:  }
.viewon-iphone-block { display:  }
.viewon-desktop-block{ display: }
.viewon-desktop-ipad-block{ display: }
.viewon-desktop-ipad-iphone-block { display: }  
.viewborder-on-iphone-block { border-bottom-style:none }  

@media print {
  .viewon-desktop, .viewon-desktop-ipad, .viewon-desktop-ipad-iphone, .viewon-desktop-iphone { display:initial }
  .viewon-ipad { display:none  }
  .viewon-iphone, .viewon-ipad-iphone { display:none  }
  .viewon-desktop-block, .viewon-desktop-ipad-block, .viewon-desktop-ipad-iphone-block, .viewon-desktop-iphone-block { display:block}
  .viewon-ipad-block { display:none  }
  .viewon-iphone-block, .viewon-ipad-iphone-block { display:none  }
}

  

@media screen and (max-width: 9999px) {
  .viewon-desktop, .viewon-desktop-ipad, .viewon-desktop-ipad-iphone, .viewon-desktop-iphone { display:initial }
  .viewon-ipad { display:none  }
  .viewon-iphone, .viewon-ipad-iphone { display:none  }
  .viewon-desktop-block, .viewon-desktop-ipad-block, .viewon-desktop-ipad-iphone-block, .viewon-desktop-iphone-block { display:block}
  .viewon-ipad-block { display:none  }
  .viewon-iphone-block, .viewon-ipad-iphone-block { display:none  }
}

 
@media screen and (max-width: 1024px) {
  .viewon-ipad,  .viewon-desktop-ipad-iphone , .viewon-desktop-ipad , .viewon-ipad-iphone { display:initial   }
  .viewon-iphone { display:none  }
  .viewon-desktop, .viewon-desktop-iphone { display:none  }
  .viewon-ipad-block,  .viewon-desktop-ipad-iphone-block , .viewon-desktop-ipad-block , .viewon-ipad-iphone-block { display:block !important }
  .viewon-iphone-block { display:none  }
  .viewon-desktop-block, .viewon-desktop-iphone-block { display:none  }
}
@media screen and (max-width: 480px) {
  .viewon-iphone , .viewon-desktop-ipad-iphone,  .viewon-desktop-iphone ,  .viewon-desktop-ipad-iphone{ display:initial  }
  .viewon-ipad { display:none  }
  .viewon-desktop, .viewon-desktop-ipad { display:none  }
  .viewon-desktop-important, .viewon-desktop-ipad-important { display:none !important }
  .viewborder-on-iphone { border-bottom-style:solid; border-bottom-width:1px } 
  .viewon-iphone-block , .viewon-iphon-blocke , .viewon-desktop-ipad-iphone-block,  .viewon-desktop-iphone-block ,  .viewon-desktop-ipad-iphone-block{ display:block  }
  .viewon-ipad-block { display:none  }
  .viewon-desktop-block, .viewon-desktop-ipad-block { display:none !important  }
}

.ui-dialog { max-width:80% !important; z-index:1500 }

@media screen and (max-width: 500px) {

/* on an iphone, this forces the popup to appear at the top of the page
   and turns off the overflow of any inner elements 
   NOTE: NOT SURE IF THIS REALLY WORKS ON A REAL IPHONE! */



	.ui-dialog-contentxx {
		xposition:fixed !important;
		xtop:0px !important;
		xleft:0px !important;
		xwidth:100% !important;
		max-width:80% !important;
		xmax-height:500px !important;
		xoverflow:auto !important;
		margin-left:auto !important;
		margin-right:auto !important;
		}


	.ui-widget-contentxx {
		font-size:1em !important;  
		}
	.ui-dialog-contentorig {
		position:fixed !important;
		top:0px !important;
		left:0px !important;
		width:100% !important;
		max-height:500px !important;
		overflow:auto !important;
		margin-left:auto !important;
		margin-right:auto !important;
		}


	.ui-widget-contentorig {
		font-size:1em !important;  
		}

} 

.ui-widget { font-family:'Lato',Roboto }

.has-error .form-control  {
  border-color: #833332;
  box-shadow: 0 0 6px red;
}

.error-msg {margin-left: 9px;   color:red }
.bottom-margin {margin-bottom:10px }
.top-margin {margin-top:20px } 

.photo-box {
    font-size: 10px;
    font-style: italic;
    color: #2487EB;
    float: left;
    padding-top: 0px;
    padding-right: 10px;
    padding-bottom: 8px;
    padding-left: 8px;
    text-align: center;
    max-height:auto; 
    max-width:100% 
}


@media screen and (max-width: 480px) {
  .promo-col-removed-20161028 {margin-left:30px}
}

.contenthide {display:none !important}

 .course-info .course-metadata .closed .removed20161118 { max-height: none; }

 
@media screen {

.printheader { display:none !important}

}


@media print {
   .noprint { display:none  !important} 
	.rating-cat-pdf-1 { display:none !important }
	.course-breadcrumbs { display:none !important }
	.polec-left-nav, .promo-col { display:none !important }

	.viewon-iphone { display:none !important }
	.viewon-iphone-block { display:none !important }


	header , footer { display:none !important; }

	.copy-outside-box-3 { width:33% }
	.copy-outside-box-4 { width:33% }
	.notab-nine-twelfths{ width:100% }

	i.fa { display:none !important } 
* { font-family: arial !important } 
	.printheader {
		display:inherit;
		xposition:fixed;
		xtop:0px;
		xwidth:100%;	

	}

}

.lms20161012 .prompt {
    width:auto !important;
    background-color: transparent !important;
    color: black !important;
    text-align: left !important;
    float: none !important;
    padding-right: 10px;
    margin-bottom: 10px;
}
.lms20161012 h3 , .lms20161012 h2 { font-family: 'Arial', sans-serif; font-size:17px !important; }

.lms20161012 .nowidth { width:auto; max-width:500px;  }
.lms20161012 .nobox { border-style:solid;border-width:1px;border-color:silver }
.lms20161012 .noboxright { border-style:solid;border-width:1;text-align:right }

.lms20161012 .collapse , .lms20161012 .collapse td { border-color:gray; #bee4f8   ;
      border-width:1;
      border-style:solid;
      border-collapse:collapse;
      }

.lms20161012 .normal   {   }
.lms20161012 .reverseold {background-color:#E6F4FC  ;  font-weight:bold }
.lms20161012 .reverse {background-color:white;  ; font-weight:bold }
.lms20161012 .reversec {background-color:white;  font-weight:bold; text-align:center }

.lms20161012 .alternate {background-color:white ;
           }

.lms20161012 .reverseprompt {text-align:center; font-weight:bolder; background-color:yellow ; color:blue}
.lms20161012 td a  {font-size:inherit !important }

.lms20161012 ol , .lms20161012 ul   {margin-left:35px !important; margin-bottom:20px;  }

.lms20161012 td { padding-top:3px; padding-left:3px; }


.lms20161012   input[type=submit].nobox , .lms20161012   input[type=button].nobox{ font-size:15px;   padding:3px; }

.lms20161012 #calendararea { background-color:white }

.lms20161012 TABLE { margin-left:auto;margin-right:auto}

.lms20161012 .prompt a { color:blue !important }  
.lms20161012 td.prompt { white-space:normal }  


/* i think this was extra 
}
and throwing things off */
 

.form-control[readonly] { background-color:white !important }
.alternate-table-color { background-color:rgb(204, 204, 204) !important }
.alternate-shopping-cart-color { background-color:rgb(240, 240, 240) !important }
.shopping-cart-title { font-size:125%;font-weight:bold } 
.shopping-cart-box {
	border-style:solid; 
	border-color:black; 
	border-width:1px;
	display:block;
	padding-top:.2em; 
	padding-bottom:.2em; 
	padding-left:1em;
}

.close-button:hover  { cursor:pointer }
 
  


.category-outside-box {
padding-left:1.75rem;;
height:110px;
float:left;
border-style:solid;
border-width:1px;
border-color:transparent;
}

.category-inside-box {
/* john, do not need float:left and do not need width:90% */
margin:.5rem;
padding:1rem; /*1.5rem;*/ 
height:100px;
display:block;
border-bottom-style:solid;
border-width:1px;
border-color:rgb(244, 167, 118);;
background-color:#e5e5e5;/*rgb(237, 237, 237);*/
position:relative;
}




 
.category-inside-box ,   .page-content .category-outside-box .category-inside-box  * {
font-size:20px;
color:rgb(0,86,158)   ;
	line-height:100% !important;
	font-weight:normal;

}

.category-inside-box:hover ,      .page-content .category-outside-box .category-inside-box:hover  * {
color:white !important ;
background-color:#2a9ee9;/*rgb(0,86,158);*/

}
 
.category-inside-box {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align:center;
}

.portal { 
    border-color: rgb(153, 153, 153);
    border-style: solid;
    border-width: 1px;
    /* 
    color: #135786;
    background-color: #fff; 
    */ 
    background-color: #2a9ee9;
    color:white !important; 
    padding: .5em 5px;
    xfont-size: 85%;
    

}

.no-left-padding { padding-left: 0px !important }
.no-left-margin { margin-left: 0px !important }
.no-right-padding { padding-right: 0px !important }
.no-top-padding { padding-top: 0px !important }
.no-bottom-padding { padding-bottom: 0px !important }
.no-bottom-margin { margin-bottom: 0px !important }

  header .nav-bar .nav-menu li:nth-child(3) {
    margin-right: 20px;
  }
.polec-pagecontent ul { font-size:1.2rem !important;
color:#4c4c4c !important;
font-weight:300 !important } 


@media screen and (max-width: 374px) {
  #schedulebox .th .td , #schedulebox .tr .td {
    font-size:90%;
  }
  #mobile_scheduletable div.mobilegroup div.prompt  , #mobile_scheduletable div.mobilegroup div.value   {
    font-size: 85% !important; background-color:red !important; 
  }

  #scheduletabledesktop .th .td , #scheduletabledesktop .tr .td {
    font-size:90%;
  }
 

}

xheader .leadin-bar {
    line-height: 340% !important;
}

@media screen and (min-width: 769px) {
header .nav-bar {
    padding-top: 15px !important;
    padding-bottom: 15px !important;
}
}
#search-unit.unit-text-and-search-box-celop {
    padding-top: .5em !important;
    padding-bottom: .5em !important;
}


* { font-weight:normal !important }

b, strong , b a, strong a {
  font-weight: bold  !important ;
}
header .leadin-bar .login-link, 
header .leadin-bar .login-signup .login-signup-box a, header .leadin-bar .login-signup .login-signup-box a:hover, header .leadin-bar .login-signup .login-signup-box a:visited 
{
  font-weight: bold  !important;
}
.text-strong {
  font-weight: bold !important;
}

body , header { max-width:2000px !important ;margin-left:auto !important ;margin-right:auto !important  }
html { background-color:white !important;/*background-image:url('../../fynwyd/images/LQ-Logo-Blue-Yellow.png')*/ }


/* line 255, ../scss/ui/_forms.scss */
.search-field ::-webkit-input-placeholder {
  /* WebKit, Blink, Edge */
  color: rgba(255, 255, 255, 1.2);
}
/* line 258, ../scss/ui/_forms.scss */
.search-field :-moz-placeholder {
  /* Mozilla Firefox 4 to 18 */
  color: rgba(255, 255, 255, 1.2);
  opacity: 1.6;
}
/* line 262, ../scss/ui/_forms.scss */
.search-field ::-moz-placeholder {
  /* Mozilla Firefox 19+ */
  color: rgba(255, 255, 255,1.2);
  opacity: 1.6;
}
/* line 266, ../scss/ui/_forms.scss */
.search-field :-ms-input-placeholder {
  /* Internet Explorer 10-11 */
  color: rgba(255, 255, 255, 1.2);
}
/* line 269, ../scss/ui/_forms.scss */
.search-field :placeholder-shown {
  /* Standard (https://drafts.csswg.org/selectors-4/#placeholder) */
  color: rgba(255, 255, 255, 1.2);
}

 
.rightnavportal li {  list-style-type: none; font-size:1.2em}

/* had to change application.css for the anchor tag colors */ 
/* this change overrode things like menu drop downs */
a {
  xcolor: #075486 !important;
}

 
header .nav-bar .right-menu a:hover {
  color: #075486 !important;
}

footer a:hover {
  color: #075486 !important;
}

.unit-service-areas a:hover {
  color: #075486 !important;
}

header .leadin-bar {  background-color: #e5e5e5 !important }

footer {  background-color: #e5e5e5 !important }

.unit-title-two-column .boxes a {  background-color: #e5e5e5 !important }

.unit-carousel .training-card:hover, .unit-kudos-carousel .training-card:hover {  background-color: #e5e5e5 !important }

.unit-carousel .kudos-card, .unit-kudos-carousel .kudos-card {  background-color: #e5e5e5 !important }

a.unit-related-courses:hover {  background-color: #e5e5e5 !important }

.course-info .row-highlight-b {  background-color: #e5e5e5 !important } 


.translate-word { cursor:pointer }

.translate-word:hover { text-decoration:underline }


.goog-te-combo { max-width:200px} 

.show-overflow {  overflow-x: visible !important }

.lms20161012 #instructornews  h3.h3class , .lms20161012 h2 { margin-bottom:0px !important }
.lms20161012 #instructordocs ol, .lms20161012 #instructordocs ul {margin-left:20px !important }
 

@media screen and (max-width: 500px) {
	.mleft-side { width:100% !important;float:left; padding:5px; }
	
}

.not-visible { visibility:hidden }

/* used for the promo ad that goes accross the course outline */ 

.promo-accross-page h2 { margin-bottom:0px }
.promo-accross-page-left {
  display: flex;
  align-items: center;
  height:100px;max-height:100px;
}

.promo-accross-page .learn-more-container a { padding-top:12px; padding-bottom:12px; margin-top:20px ; width:200px;  }

@media screen and (max-width: 1024px) {
.promo-accross-page .promo-accross-page-left {height:50px;max-height:50px;display: block;}

.promo-accross-page .learn-more-container a { padding-top:5px; padding-bottom:5px; margin-top:10px;   }
.promo-accross-page .learn-more-container   {  width:100% ; left:0px; text-align:left !important }

}


@media screen and (max-width: 480px) {
.promo-accross-page .promo-accross-page-left {height:50px;max-height:50px;display: block;}

.promo-accross-page .learn-more-container a { padding-top:5px; padding-bottom:5px; margin-top:10px; text-align:center !important ; width:100%;  }
.promo-accross-page .learn-more-container { padding-left:0px;  }

} 

/* used with category boxes anywhere so they left justify on a desktop */ 
.margin-left-30px { margin-left:-2.25rem;float:left;width:100%;  }

@media screen and (max-width: 1024px) {
.margin-left-30px { margin-left:0px }


}

@media screen and (min-width: 769px) {
  /* line 8, ../scss/ui/_page-content.scss */
  .page-content {
    min-width: auto;
  }
  .cbp-spmenu-push
   {
    min-width:  auto;
  }
}

</style>
