@charset "utf-8";
/* CSS cetc2022 */
/* #9c31b3 Purple */
/* #cb940f Orange */
body {
font-family: Arial;
/*font-size: 14pt;*/
height: 100%;
color:#a0522d;
/*background:#fff;*/
background: #F5DEB3;
/* PREVENT USER FROM SELECTING TEXT - turn on for production site
-webkit-user-select: none; /* Safari
-ms-user-select: none; /* IE 10 and IE 11
user-select: none; /* Standard syntax
*/
}
/* ORIGINAL div, html, body, p, ul, ol, li, a, form, img, table, td, h1, h2, h3, h4, h5, h6, blockquote, header, section, footer, aside, nav, article, figure, figcaption, dl, dt, dd {margin:0;padding:0;} */
div, html, body, p, a, form, img, table, td, h1, h2, h3, h4, h5, h6, blockquote, header, section, footer, aside, nav, article, figure, figcaption, dl, dt, dd {margin:0;padding:0;}
header, section, footer, aside, nav, article, figure, figcaption {display: block;}
table {border-collapse:collapse;}
img {border:none;}
a, a:active, a:visited {text-decoration:none;color:#4098ca;}
a:hover {text-decoration:none;color:#4098ca;}
input:focus, textarea:focus {outline:none;}
/* All */
.content_block:after, .footer footer:after, .wraper:after, .features3_block:after, .most_popular:after, .features4_block:after, .flyout_area dd:after, .accordions dd:after, .intro_text:after, .features6_block ul:after, .why_choose_explore:after, .intro_text .intro_slider li:after, .process ul:after, .team_option ul:after, .services_option:after, .tab_select:after, .c_after:after, .blog_entries .post_medium:after, .leave_comment:after, .controls:after, .pricing_option:after {content:'';display:block;height:0;clear:both;}
.wraper, .footer footer, body.index_v2 .social_block, body.index_v2 .footer {width:960px;margin:0 auto;position:relative;}
.bwWrapper {position:relative;display:block;}
/* keep the ul ol and li from displaying default */
.topmenu {margin:0;padding:0; list-style:none;}
/* header */
.header {position:relative;min-height:108px;z-index:1001;}
.header .logo, .header .logo:visited {text-indent:-999em;cursor:pointer;background:url(../images/cetc2.png) no-repeat;display:block;width:473px;height:36px;position:absolute;top:37px;left:0;}
/* top menu */
.header nav {position:absolute;top:48px;right:0;}
.header nav ul {zoom:1;}
/* TOP MENU .header nav ul li {font-size:10px;font-weight:bold;float:left;padding:0 0 0 38px;position:relative;} */
.header nav ul li {
font-size:12px;
font-weight:bold;
float:left;
padding:0 0 0 38px;
position:relative;
}
.header nav ul li:after {content:'';background:url(../images/sprite.png) 6px 7px no-repeat;float:left;display:block;width:12px;height:12px;}
.header nav ul li a, .header nav ul li a:visited {color:#434242;float:left;height:30px;}
.header nav ul li a:hover {color:#3fa3c9;}
.header nav ul li:hover > ul {display:block;}
.header nav ul ul {display:none;position:absolute;top:25px;left:23px;z-index:99999;background:#f6f3f3;}
/* where the sub menu opens */
/* .header nav ul ul ul {top:0;left:160px;} */
.header nav ul ul ul {top:0; left:250px;}
/* SUB MENUS .header nav ul ul li {float:none;padding:0;display:block;font-size:10px;font-weight:normal;} */
.header nav ul ul li {
float:none;
padding:0;
display:block;
font-size:13px;
font-weight:normal;
}
/* WIDTH OF MENUS .header nav ul ul a {float:none;padding:14px 16px 14px 12px;width:130px;height:auto;display:block;float:none;border:1px solid #dbe8ed;border-bottom:1px solid #e3e3e3;border-top:1px solid #fff;} */
/* padding - top right bottom left */
.header nav ul ul a {
float:none;
padding:4px 4px 4px 4px;
width:290px;
height:auto;
display:block;
float:none;
border:1px solid #dbe8ed;
border-bottom:1px solid #e3e3e3;
border-top:1px solid #fff;
}
.header nav ul ul li:after {display:none;}
.header nav ul ul li:first-child a {border-top:1px solid #5eb2d1;}
.header nav ul ul li:last-child a {border-bottom:1px solid #9acbdf;}
.header nav ul ul li:first-child li a {border-top:1px solid #fff;}
.header nav ul ul li li:first-child a {border-top:1px solid #b9d9e5;}
.header nav ul ul li:last-child li a {border-bottom:1px solid #e3e3e3;}
.header nav ul ul li:hover a {background:#fff;padding-left:24px;padding-right:4px;color:#3fa3c9;}
.header nav ul ul li:hover li a {background:none;padding-left:12px;padding-right:16px;color:#626363;}
.header nav ul ul li:hover li a:hover {background:#fff;padding-left:24px;padding-right:4px;color:#3fa3c9;}
.header nav ul ul span {visibility:hidden;padding-right:10px;background:url(../images/arrow.gif) right 6px no-repeat;}
.header nav ul ul li:hover span {visibility:visible;}
.header nav ul ul li:hover li span {visibility:hidden;}
.header nav ul ul li li:hover span {visibility:visible;}
.content_block h4 {font-size:100%;color:#4098ca;}
.content_block h4.bord {margin:0 0 25px 0;padding:10px 0;border-bottom:1px solid #e7e6e6;}
/* Home Version 1 */
.fallback {display:none;}
/* text bar */
.text_bar {clear:both;background:url(../images/text_bar.png);}
.text_bar .wraper {min-height:60px;padding:28px 0;}
.text_bar:after {content:'';display:block;width:100%;height:0;border-bottom:1px solid #e7e6e6;border-top:5px solid #fff;}
/*.text_bar h2 {color:#434242;font:bold italic 22px 'PT Sans';float:left;padding:0 36px 0 0;}*/
.text_bar h2 {color:#434242; font:bold; float:left;padding:0 36px 0 0;}
.text_bar h2 span {color:#626363;font-weight:normal;font-size:16px;display:block;}
.text_bar .buy, .text_bar .buy:visited {float:left;}
.text_bar .widget {background:#fff;position:absolute;top:0;right:0;padding:25px 25px 5px 25px;width:205px;min-height:86px;}
.text_bar .widget h3 {color:#434242;font-size:17px;padding-bottom:9px;}
.text_bar .widget p a {background:url(../images/arrow.gif) right center no-repeat;padding-right:12px;}
/* Version 2 */
body.index_v2 {background:#e0dede url(../images/index2_bg.png) repeat-x;}
body.index_v2 .wraper {background:#fff;padding:0 20px;}
body.index_v2 .social_block {padding:0 20px;}
body.index_v2 .footer {padding:35px 20px;}
body.index_v2 .social_block .wraper, body.index_v2 .footer .wraper {background:none;padding:0;}
body.index_v2 .copyright .top, body.index_v2 .copyright .top:visited {right:30px;}
/* Home Version 3 */
/* text bar */
.text_bar2 {background:#cb940f url(../images/text_bar2.png);margin-bottom:10px;position:relative;}
.text_bar2 .text_bar_shadow {position:absolute;top:6px;left:0;width:100%;height:29px;background:url(../images/text_bar_shadow2.png) center top no-repeat;}
.text_bar2 .text_bar_shadow2 {position:absolute;bottom:6px;left:0;width:100%;height:35px;background:url(../images/text_bar_shadow3.png) center bottom no-repeat;}
.text_bar2 .wraper {min-height:60px;padding:19px 0 5px 0;}
.text_bar2:before {content:'';display:block;width:100%;height:0;border-top:1px solid #e7e6e6;border-bottom:5px solid #fdd679;}
.text_bar2:after {content:'';display:block;width:100%;height:0;border-bottom:1px solid #e7e6e6;border-top:5px solid #fdd679;}
.text_bar2 h2 {text-shadow: 2px 2px 5px #000;color: #fff;font:bold 22px;float:left;padding:0 36px 0 0;}
/*.text_bar2 h2 {text-shadow:#2c2c2c 0 1px 1px;color:#fff;font:bold italic 22px 'PT Sans';float:left;padding:0 36px 0 0;}*/
.text_bar2 h2 span {font-weight:normal;font-size:14px;display:block;}
.text_bar2 .buy, .text_bar2 .buy:visited {float:left;}
/* text bar 3 army */
.text_bar3 {clear:both;background:url(../images/army_bkrd.jpg);}
/*.text_bar3 {background:#3fa3c9 url(../images/text_bar2.png);margin-bottom:10px;position:relative;}*/
.text_bar3 .text_bar_shadow {position:absolute;top:6px;left:0;width:100%;height:29px;background:url(../images/text_bar_shadow2.png) center top no-repeat;}
.text_bar3 .text_bar_shadow2 {position:absolute;bottom:6px;left:0;width:100%;height:35px;background:url(../images/text_bar_shadow3.png) center bottom no-repeat;}
.text_bar3 .wraper {min-height:60px;padding:19px 0 5px 0;}
.text_bar3:before {content:'';display:block;width:100%;height:0;border-top:1px solid #e7e6e6;border-bottom:5px solid #fff;}
.text_bar3:after {content:'';display:block;width:100%;height:0;border-bottom:1px solid #e7e6e6;border-top:5px solid #fff;}
.text_bar3 h2 {text-shadow:#2c2c2c 0 1px 1px;color:#fff;font:bold italic 22px 'PT Sans';float:left;padding:0 36px 0 0;}
.text_bar3 h2 span {font-weight:normal;font-size:14px;display:block;}
.text_bar3 .buy, .text_bar2 .buy:visited {float:left;}
/* sidebar for old version */
.sidebar {float:left;width:250px;padding:10px 0 35px 0;}
/* flyout_area sidebar */
.sidebar .flyout_area {width:230px;border-top:1px solid #e7e6e6;margin-top:35px;padding:35px 0 50px 0;}
.sidebar .flyout_area dl:last-child {border-bottom:none;}
.sidebar .flyout_area dd div p {width:auto;padding:0 0 16px 45px;}
/* Home Version 8 */
/* intro text */
.intro_text {padding:10px 0 10px 0;}
.intro_text .bwWrapper {border:5px solid #f6f3f3;float:left;font-size:0;line-height:0;}
.intro_text div.desc {float:right;width:475px;}
.intro_text div.desc h4 {padding-bottom:15px;}
.intro_text .intro_slider {margin:0;}
.intro_text .intro_slider li {float:left;width:100%;}
.intro_text .bx-pager {margin:15px 0 0 370px;}
.intro_text .bx-pager a.pager-link {text-indent:-9999em;float:left;height:10px;width:10px;display:block;background:url(../images/sprite.png) 0 -261px no-repeat;margin-right:4px;}
.intro_text .bx-pager a.pager-active, .intro_text .bx-pager a.pager-link:hover {background-position:-15px -261px;background-color:#5eafcd;}
/* process
.process h4 {margin:0 0 20px 0;padding:10px 0;border-bottom:1px solid #e7e6e6;}
.process ul {padding-bottom:80px;}
.process ul li {float:left;width:220px;padding:0 22px 0 0;}
.process ul li:last-child {padding-right:0;}
.process ul li h3 {color:#626363;font-size:34px;color:#d8d8d8;padding-bottom:15px;}
.process ul li h3 span {font-size:11px;color:#fff;background:#5eafcd;padding:1px 8px;position:relative;top:-4px;font-weight:normal;}
*/
/* Contact us page */
.contact_us {float:left;width:650px;padding:10px 60px 0 0;}
.contact_us h4 {clear:both;padding-bottom:13px;}
.contact_us .bwWrapper {font-size:0;line-height:0;border:5px solid #f6f3f3;}
.contact_us .map_wrap {font-size:0;line-height:0;border:5px solid #f6f3f3;}
.contact_us ul li {float:left;width:90px;padding:20px 0 75px 0;line-height:20px;}
.contact_us ul li:nth-child(2) {width:130px;}
.contact_us ul li:nth-child(3) {float:right;width:400px;}
.contact_us ul li strong {color:#3fa3c9;}
.contact_us form p {font-size:11px;color:#bbbaba;float:left;margin:10px 20px 10px 0;}
.contact_us form p:nth-child(3) {margin-right:0;}
.contact_us form p label {font-size:13px;color:#525252;padding-right:8px;}
.contact_us form p input {border:1px solid #e0e0e0;margin-top:8px;width:180px;font:13px 'PT Sans';color:#626363;padding:5px 10px;}
.contact_us form p textarea {border:1px solid #e0e0e0;margin-top:8px;width:625px;font:13px 'PT Sans';color:#626363;padding:5px 10px;height:150px;}
.contact_us form p input[type="submit"] {font-weight:bold;font-style:italic;color:#3fa3c9;width:113px;height:42px;padding:0;border:none;}
.contact_us form p:last-child {float:right;margin-right:3px;}
/* buttons icons page */
/* buttons */
.buttons {padding-bottom:30px;}
.buttons input {margin:0 50px 10px 0;}
.buttons div {padding:20px 0;}
.buttons div a {margin:0 20px 10px 0;}
.btn_l {cursor:pointer;font:bold italic 16px 'PT Sans';color:#3fa3c9;width:151px;height:56px;padding:0;border:none;background:url(../images/sprite.png) 0 -123px no-repeat;}
.btn_l:hover {background-position:-157px -123px;}
.btn_m {cursor:pointer;font:bold italic 13px 'PT Sans';color:#3fa3c9;width:113px;height:42px;padding:0;border:none;background:url(../images/sprite.png) 0 -73px no-repeat;}
.btn_m:hover {background-position:-119px -73px;}
.btn_s {cursor:pointer;font:bold italic 12px 'PT Sans';color:#3fa3c9;width:100px;height:36px;padding:0;border:none;background:url(../images/sprite.png) 0 -681px no-repeat;}
.btn_s:hover {background-position:-125px -681px;}
a.btn_l {height:39px;padding-top:17px;display:block;text-align:center;}
a.btn_m {height:30px;padding-top:12px;display:block;text-align:center;}
a.btn_s {height:26px;padding-top:10px;display:block;text-align:center;}
.btn_col, .btn_col:visited {color:#fff;font-size:11px;background:#5eafcd;padding:3px 9px;}
.btn_col:hover {background:#6bbddb;color:#fff;}
.btn_blue, .btn_blue:visited {background:#6988de;}
.btn_blue:hover {background:#7699fa;}
.btn_green, .btn_green:visited {background:#6ac36a;}
.btn_green:hover {background:#73da73;}
.btn_red, .btn_red:visited {background:#cd5e63;}
.btn_red:hover {background:#ea6c72;}
.btn_orange, .btn_orange:visited {background:#de7d42;}
.btn_orange:hover {background:#f38a49;}
.btn_yellow, .btn_yellow:visited {background:#c2cd0a;}
.btn_yellow:hover {background:#d2de11;}
.btn_grey, .btn_grey:visited {background:#b4b4b4;}
.btn_grey:hover {background:#cac9c9;}
.btn_black, .btn_black:visited {background:#2e2f2f;}
.btn_black:hover {background:#666565;}
/* Clear */
.clear {clear:both;}
/* Google maps */
.google_map {border:5px solid #f6f3f3;margin:0 0 100px 0;min-height:387px;}
.google_map34 {width:75%;}
/* Typography page */
.wraper_typ {color:#838383;}
.wraper_typ h1 {color:#333;font-size:40px;padding-bottom:14px;}
.wraper_typ h2 {color:#333;font-size:28px;padding-bottom:14px;}
.wraper_typ h3 {color:#333;font-size:18px;padding-bottom:14px;}
.wraper_typ h4 {color:#333;font-size:13px;padding-bottom:14px;}
.wraper_typ h4.bord {font-size:17px;}
.wraper_typ h5 {color:#333;font-size:11px;padding-bottom:14px;}
.wraper_typ h6 {color:#333;font-size:10px;padding-bottom:14px;}
.wraper_typ .underline {text-decoration:underline;}
.wraper_typ .bord + div {padding:0 0;}
.wraper_typ .bord + div {padding:0 0;}
.wraper_typ .bord + div p {padding-bottom:40px;}
/*.wraper_typ blockquote {font-size:15px;color:#444;font-style:italic;background:#f5f5f5;border-left:5px solid #5eafcd;padding:16px 29px 6px 29px;margin-bottom:0px;}*/
.wraper_typ blockquote {color:#444;font-style:italic;background:#f5f5f5;border-left:5px solid #5eafcd;padding:16px 29px 6px 29px;margin-bottom:0px;}
.wraper_typ ul {float:left;padding:0 70px 40px 0;}
.wraper_typ ul li {font-weight:bold;padding:7px 0 7px 13px;background:url(../images/dot.png) 0 center no-repeat;}
.wraper_typ ul.arrows_list li {font-weight:normal;padding-left:30px;position:relative;background:none;}
.wraper_typ ul.arrows_list li:before {content:'';position:absolute;top:7px;left:0;display:block;width:18px;height:18px;background:#5eafcd url(../images/sprite.png) 0 -189px no-repeat;-webkit-border-radius:13px;-moz-border-radius:13px;border-radius:13px;behavior: url(PIE.htc);}
/*.wraper_typ ol li {font-weight:bold;padding:7px 0 7px 0;list-style-type:decimal;}*/
.wraper_typ ol li {padding:7px 0 7px 0;list-style-type:decimal;}
.wraper_typ .columns {clear:both;float:left;padding:0 10px 20px 0;}
.content_block .wraper_typ .columns div:first-child {padding-left:0;}
.wraper_typ .columns div {padding-left:24px;float:left;}
.wraper_typ .columns .col_2 {width:458px;}
.wraper_typ .columns .col_3 {width:297px;}
.wraper_typ .columns .col_4 {width:217px;}
.wraper_typ .columns .col_5 {width:168px;}
.wraper_typ .columns .col_6 {width:136px;}
.wraper_typ .columns .col_3_4 {width:699px;}
.wraper_typ .columns .col_2_3 {width:619px;}
.headings p, .dropcap p, .columns p {font-size:15px;line-height:20px;}
.html_styles p::selection {background: #000;color:#838383;}
.html_styles p::-moz-selection {background: #000;color:#838383;}
.dropcap p:first-letter {color:#5eafcd;font-size:32px;line-height:62px;float:left;padding-right:10px;}
.wraper_typ .blockquote blockquote p {padding:0 0 10px 0;}
.columns div p {padding:0 0 20px 0;text-align:justify;}
.columns p strong {font-size:13px;color:#444;}
/* footer */
.footer {background:#cb940f;border-bottom:1px solid #cb940f;;padding:2px;}
/*.footer {background:#f6f3f3;border-bottom:5px solid #fff;padding:35px 0;}*/
.footer footer h3 {font-size:14px;color:#fff;padding:8px 0 26px 0;position:relative;}
.footer footer h3:before {content:'';height:5px;background:#d9d6d7;border-bottom:1px solid #e4e2e2;font-size:0;line-height:0;position:absolute;top:15px;right:0;width:100%;}
.footer footer h3 span {padding-right:8px;background:#f6f3f3;position:relative;z-index:2;}
.footer footer p {padding-bottom:11px;}
/* bottom about */
.footer footer .bottom_about {float:left;width:212px;padding:0 33px 0 0;}
/* recent tweets */
.footer footer .recent_tweets {float:left;width:212px;}
.footer footer .recent_tweets ul li {margin-bottom:19px;padding-bottom:19px;border-bottom:1px solid #d1cfcf;}
.footer footer .recent_tweets ul li:last-child {margin-bottom:0;padding-bottom:0;border-bottom:none;}
/* recent posts */
.footer footer .recent_posts {float:left;width:212px;padding:0 36px;}
.footer footer .recent_posts ul li {padding:0 0 7px 20px;position:relative;}
.footer footer .recent_posts ul li:before {content:'';background:url(../images/sprite.png) 0 0 no-repeat;position:absolute;top:6px;left:0;display:block;width:5px;height:5px;}
.footer footer .recent_posts ul li a, .footer footer .recent_posts ul li a:visited {color:#626363;}
.footer footer .recent_posts ul li a:hover {color:#3fa3c9;}
/* subscribe block */
.footer footer .subscribe_block {float:left;width:212px;}
.footer footer .subscribe_block p {padding:0 0 7px 0;}
.footer footer .subscribe_block p:last-child {text-align:right;}
.footer footer .subscribe_block p input {font:13px 'PT Sans';color:#626363;border:1px solid #c0bebe;background:#f6f3f3;padding:5px 10px;width:190px;}
.footer footer .subscribe_block p input[type="submit"] {cursor:pointer;font-weight:bold;font-style:italic;color:#3fa3c9;width:113px;height:42px;padding:0;border:none;background:url(../images/sprite.png) 0 -73px no-repeat;}
.footer footer .subscribe_block p input[type="submit"]:hover {background-position:-119px -73px;}
/* copyright */
.copyright {border-top:1px solid #e7e6e6;}
.copyright p {font-size:11px;padding:20px 0;color: #fff;}
.copyright p span:after, .copyright p a:before {content:'|';padding:0 5px; color:#fff;}
.copyright p a, .copyright p a:visited {color:#fff;}
.copyright p a:hover {color:#fff;}
.copyright .top, .copyright .top:visited {color:#fff;font-size:11px;position:absolute;top:20px;right:0;padding-right:12px;}
.copyright .top:hover {color:#fff;}
.copyright .top:after {content:'';position:absolute;top:5px;right:0;background:url(../images/sprite.png) 6px 0 no-repeat;display:block;width:12px;height:5px;}
/* Back to top button */
#back-top {
position: fixed;
bottom: 30px;
margin-right: 30px;
z-index: 999;
}
#back-top a {
width: 54px;
display: block;
text-align: center;
font: 11px/100% Arial, Helvetica, sans-serif;
text-transform: uppercase;
text-decoration: none;
color: #bbb;
/* transition */
-webkit-transition: 1s;
-moz-transition: 1s;
transition: 1s;
}
#back-top a:hover {
color: #000;
}
/* arrow icon (span tag) */
#back-top span {
width: 54px;
height: 54px;
display: block;
margin-bottom: 7px;
position: fixed;
bottom: 0;
right: 0;
background: #ddd url(../images/up-arrow_sml.png) no-repeat center center;
;
/* rounded corners */
-webkit-border-radius: 15px;
-moz-border-radius: 15px;
border-radius: 15px;
/* transition */
-webkit-transition: 1s;
-moz-transition: 1s;
transition: 1s;
}
#back-top a:hover span {
background-color: #777;
}
.cleft {
margin-left: auto;
margin-right: auto;
text-align: left;
}
.cright {
margin-left: auto;
margin-right: auto;
text-align: right;
}
/* Typography */
h1, h2, h3, h4, h5, h6 {font-family: "Arial", "Helvetica", "sans-serif";}
h1 {
font-size: 160%;
color: #A0522D;
}
h2 {
font-size: 140%;
color: #A0522D;
}
h3 {
font-size: 120%;
color: #A0522D;
}
h4 {
font-size: 100%;
font-weight: bold;
/*color: #cb940f;*/
color: #A0522D;
}
/* p {font-size: 90%;} */
a:link {color: #CC3300;}
a:visited {color: #CC3300;}
P.subheading {
margin-left: auto;
margin-right: auto;
text-align: center;
font-weight: bold;
font-size: 120%;
color:#4098ca;
}
#bh99 {
color: #4098ca;
font-weight: bold;
background-color: #e3dfd4;
width: 100%;
padding-left: 10px;
}
/** / CETC ********************************/
/**************************************************************************************/
/* use these to do normal (n99) or bold (b99) text in the #4098ca color */
/* example: Some Text or class */
/**************************************************************************************/
#n99 {
color: #cb940f;
display:inline;
}
#b99 {
color: #cb940f;
font-weight: bold;
display:inline;
}
#c99 {
color: #cb940f;
text-align: center;
display:inline;
}
#verse {
color: #cb940f;
font-size: 75%;
}
.ib99 {
color: #A0522D;
font-weight: bold;
font-style: italic;
}
.en99 {
font-family: Courier New;
font-size: .8em;
font-weight: bold;
color: #A0522D;
}
.en_99 {
font-weight: bold;
color: #cb940f;
}
.bi_head {
font-weight: bold;
font-style: italic;
}
/**************************************************************************************/
/* end of #4098ca color spans */
/**************************************************************************************/
/**************************************************************************************/
/* use this for tiny font ie: under a picture */
/* example: Some Text */
/**************************************************************************************/
#tiny {font-size:60%;}
#tiny99 {
color: #cb940f;
font-size:60%;
}
/** Indents and general formatting ********************************/
#i10 {padding-left: 10px;}
#i20 {padding-left: 20px;}
#i30 {padding-left: 30px;}
#i60 {padding-left: 60px;}
#i90 {padding-left: 90px;}
#i120 {padding-left: 120px;}
#wordsleft {
float: left;
top: 100px;
left: 150px;
height: 15px;
width: 150px;
background: #F7F6F1;
border: 1px solid #4098ca;
margin: 0px;
padding: 5px;
font-weight: bold;
color: #4098ca;
}
#wordsright {
float: right;
top: 100px;
right: 150px;
height: 15px;
width: 150px;
background: #F7F6F1;
border: 1px solid #4098ca;
margin: 5px;
padding: 5px;
font-weight: bold;
text-align: right;
color: #4098ca;
}
.tip {display: none;}
.tipdisplay {color: #ffffff;}
#show_hide {
float: right;
padding-right: 10px;
color: #4098ca;
font-size:xx-small;
}
.hidden {display: none;}
.unhidden {display: block;}
.article {
margin-left: 12%;
margin-right: 12%;
}
.highlightRed {
background-color: red;
color: white;
}
.highlightYellow {
background-color: yellow;
color: black;
}
.highlightBlue {
background-color: blue;
color: white;
}
.highlightGreen {
background-color: green;
color: white;
}
.cetcattention {
margin: auto;
color: #000000;
/*width: inherit;*/
width: auto;
padding: 20px;
text-align: left;
background-color: #f2f5f7;
border: 1px dotted #cb940f;
/* Do rounding (native in Firefox and Safari, CC in IE) */
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
box-shadow:3px 3px 4px #929292;
}
.cetcform {
margin: auto;
border: 1px dotted #cb940f;
/*width: inherit;*/
width: auto;
padding: 20px;
text-align: left;
background-color: #f6f3f3;
/* Do rounding (native in Firefox and Safari, CC in IE) */
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
box-shadow:3px 3px 4px #929292;
}
.cetcinput {
margin: auto;
/* border: 0px solid #ffffff; */
color: #000000;
/*width: inherit;*/
width: auto;
padding: 20px;
text-align: left;
background-color: #f5f5f5;
/* Do rounding (native in Firefox and Safari, CC in IE) */
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
box-shadow:3px 3px 4px #929292;
}
/** Center element class='center' ******************/
.center {
display: block;
margin-left: auto;
margin-right: auto;
text-align: center;
}
/** / Center ***************************************/
/** left/right element id='xxx_content *************/
#left_content {float: left;}
#right_content {overflow: hidden; text-align: center;}
/** /left/right ************************************/
/** center 2-3 elements (buttons) **********/
#my3DIV {
height:auto;
width: 225px;
/* background-color:#FFF000; */
column-count:3;
column-span: all;
margin-left: auto;
margin-right: auto;
text-align: center;
}
#my2DIV {
height:auto;
width: 200px;
/*background-color:#FFF000;*/
column-count:2;
column-span: all;
margin-left: auto;
margin-right: auto;
text-align: center;
}
/***************************************************/
/** Buttons *********************************/
/****** BLUE ********************/
.button-15 {
background-image: linear-gradient(#42A1EC, #0070C9);
border: 1px solid #0077CC;
border-radius: 8px; /* original 4px */
box-sizing: border-box;
color: #FFFFFF;
cursor: pointer;
direction: ltr;
/* display: block; */
display: inline-block;
font-family: "SF Pro Text","SF Pro Icons","AOS Icons","Helvetica Neue",Helvetica,Arial,sans-serif;
font-size: .9em;
font-weight: 400;
/* letter-spacing: -.022em; */
line-height: 1.47059;
min-width: 30px;
overflow: visible;
padding: 4px 15px;
text-align: center;
vertical-align: baseline;
user-select: none;
-webkit-user-select: none;
touch-action: manipulation;
white-space: nowrap;
}
.button-15:disabled {
cursor: default;
opacity: .3;
}
.button-15:hover {
background-image: linear-gradient(#51A9EE, #147BCD);
border-color: #1482D0;
text-decoration: none;
}
.button-15:active {
background-image: linear-gradient(#3D94D9, #0067B9);
border-color: #006DBC;
outline: none;
}
.button-15:focus {
box-shadow: rgba(131, 192, 253, 0.5) 0 0 0 3px;
outline: none;
}
/****** RED ********************/
.button-16 {
background-image: linear-gradient(#e63838, #c40202);
border: 1px solid #920000;
border-radius: 8px; /* original 4px */
box-sizing: border-box;
color: #FFFFFF;
cursor: pointer;
direction: ltr;
/* display: block; */
display: inline-block;
font-family: "SF Pro Text","SF Pro Icons","AOS Icons","Helvetica Neue",Helvetica,Arial,sans-serif;
font-size: .9em;
font-weight: 400;
/* letter-spacing: -.022em; */
line-height: 1.47059;
min-width: 30px;
overflow: visible;
padding: 4px 15px;
text-align: center;
vertical-align: baseline;
user-select: none;
-webkit-user-select: none;
touch-action: manipulation;
white-space: nowrap;
}
.button-16:disabled {
cursor: default;
opacity: .3;
}
.button-16:hover {
background-image: linear-gradient(#ff0000, #800000);
border-color: #b81818;
text-decoration: none;
}
.button-16:active {
background-image: linear-gradient(#cf2b2b, #ae0202);
border-color: #920000;
outline: none;
}
.button-16:focus {
box-shadow: rgba(255, 115, 115, 0.5) 0 0 0 3px;
outline: none;
}
/****** GREEN **************#FFF000******/
.button-17 {
background-image: linear-gradient(#40ff40, #008000);
border: 1px solid #00c000;
border-radius: 8px; /* original 4px */
box-sizing: border-box;
color: #FFFFFF;
cursor: pointer;
direction: ltr;
/* display: block; */
display: inline-block;
font-family: "SF Pro Text","SF Pro Icons","AOS Icons","Helvetica Neue",Helvetica,Arial,sans-serif;
font-size: .9em;
font-weight: 400;
/* letter-spacing: -.022em; */
line-height: 1.47059;
min-width: 30px;
overflow: visible;
padding: 4px 15px;
text-align: center;
vertical-align: baseline;
user-select: none;
-webkit-user-select: none;
touch-action: manipulation;
white-space: nowrap;
}
.button-17:disabled {
cursor: default;
opacity: .3;
}
.button-17:hover {
background-image: linear-gradient(#00ff00, #015d01);
border-color: #18a418;
text-decoration: none;
}
.button-17:active {
background-image: linear-gradient(#36d436, #02ae02);
border-color: #018701;
outline: none;
}
.button-17:focus {
box-shadow: rgba(161, 255, 161, 0.5) 0 0 0 3px;
outline: none;
}
/****** ORANGE **************#ffa11b******/
.button-18 {
background-image: linear-gradient(#ffb93f, #825300);
border: 1px solid #c07a00;
border-radius: 8px; /* original 4px */
box-sizing: border-box;
color: #FFFFFF;
cursor: pointer;
direction: ltr;
/* display: block; */
display: inline-block;
font-family: "SF Pro Text","SF Pro Icons","AOS Icons","Helvetica Neue",Helvetica,Arial,sans-serif;
font-size: .9em;
font-weight: 400;
/* letter-spacing: -.022em; */
line-height: 1.47059;
min-width: 30px;
overflow: visible;
padding: 4px 15px;
text-align: center;
vertical-align: baseline;
user-select: none;
-webkit-user-select: none;
touch-action: manipulation;
white-space: nowrap;
}
.button-18:disabled {
cursor: default;
opacity: .3;
}
.button-18:hover {
background-image: linear-gradient(#ffe401, #5d4b01);
border-color: #a47b18;
text-decoration: none;
}
.button-18:active {
background-image: linear-gradient(#d4ce36, #ae8802);
border-color: #cbcd8f;
outline: none;
}
.button-18:focus {
box-shadow: rgba(255, 236, 161, 0.5) 0 0 0 3px;
outline: none;
}
/****** SMALL Back Button **************#FFF000******/
.button-19 {
background-image: linear-gradient(#dddddd, #dddddd);
border: .25px solid #00c000;
border-radius: 6px; /* original 4px */
box-sizing: border-box;
color: #000000;
cursor: pointer;
direction: ltr;
/* display: block; */
display: inline-block;
font-family: "SF Pro Text","SF Pro Icons","AOS Icons","Helvetica Neue",Helvetica,Arial,sans-serif;
font-size: .7em;
font-weight: 400;
/* letter-spacing: -.022em; */
line-height: 1.47059;
min-width: 30px;
overflow: visible;
/*padding: 4px 15px;*/
text-align: center;
vertical-align: baseline;
user-select: none;
-webkit-user-select: none;
touch-action: manipulation;
white-space: nowrap;
}
.button-19:disabled {
cursor: default;
opacity: .3;
}
.button-19:hover {
background-image: linear-gradient(#42A1EC, #0070C9);
border-color: #84fefd;
text-decoration: none;
color: #FFFFFF;
}
.button-19:active {
background-image: linear-gradient(#36d436, #02ae02);
border-color: #84fefd;
outline: none;
}
.button-19:focus {
box-shadow: rgba(161, 255, 161, 0.5) 0 0 0 3px;
outline: none;
}
/* / Buttons *********************************/
/**************************************************************************************/
.spinner-4 {
width: 25px;
float: right;
margin-right: 10px;
--b: 8px; /* the border thickness */
aspect-ratio: 1;
border-radius: 50%;
padding: 1px;
/*background: conic-gradient(#0000 10%,#f03355) content-box;*/
background: conic-gradient(#0000 10%,#0d7f7c) content-box;
-webkit-mask:
repeating-conic-gradient(#0000 0deg,#000 1deg 20deg,#0000 21deg 36deg),
radial-gradient(farthest-side,#0000 calc(100% - var(--b) - 1px),#000 calc(100% - var(--b)));
-webkit-mask-composite: destination-in;
mask-composite: intersect;
animation:s4 1s infinite steps(10);
}
@keyframes s4 {to{transform: rotate(1turn)}}
/** / CETC ***********************************/