/************************************ Look & Feel This will get generated at run-time and appended to ------------------------------------- A template consists of... Mood (font & colors) Theme (background image(s)) Spacing A page is broken up into 5 parts... Main Complementary-1 Complementary-2 Footer Bottom Bar *************************************/ /* Mood (colors & fonts) */ .ang-main { font-family: font1; font-size: 18px; background-color: transparent; /* Always transparent. bg-color is defined in */ } .ang-main a { font-size: 15px; color: #000000; } .ang-main a:hover { text-decoration: none; color: blue; cursor: pointer; } .ang-main-title { font-size: 40px; line-height: 40px; margin-bottom: 20px; font-weight: bold; font-style: normal; color: #b0b0b0; } .ang-main-button-1 { font-family: font4; font-size: 25px; text-align: center; background-color: transparent; /* Always transparent. bg-color is defined in */ } .ang-main-button-1 a { font-size: 15px; display: block; border-style: solid; border-width: 1px; border-color: blue; padding: 5px 5px 5px 5px; color: #000000; background-color: aqua; border-radius: 5px; -moz-box-shadow: inset 0 0 10px #000000; -webkit-box-shadow: inset 0 0 10px #000000; box-shadow: inset 0 0 10px #000000; } .ang-main-button-1 a:hover { text-decoration: none; color: blanchedalmond; background-color: aquamarine; } .ang-main-button-2 { font-family: font4; font-size: 25px; text-align: center; background-color: transparent; /* Always transparent. bg-color is defined in */ } .ang-main-button-2 a { font-size: 15px; display: block; border-style: solid; border-width: 1px; border-color: blue; padding: 5px 5px 5px 5px; color: #000000; background-color: #ffffff; border-radius: 5px; -moz-box-shadow: inset 0 0 10px #000000; -webkit-box-shadow: inset 0 0 10px #000000; box-shadow: inset 0 0 10px #000000; } .ang-main-button-2 a:hover { text-decoration: none; color: #ff0000; background-color: aquamarine; } .ang-complementary-1 { background-color:cornsilk; font-family: font4; font-size: 18px; color: #000000; } .ang-complementary-1 a { font-family:font4; font-size: 15px; color: #00b5bc; } .ang-complementary-1 a:hover { text-decoration: none; color: #000000; cursor: pointer; } .ang-complementary-1-title { font-size: 40px; font-weight: bold; font-style: normal; color: #b0b0b0; } .ang-complementary-1-button-1 { font-family: font4; font-size: 25px; text-align: center; background-color: transparent; /* Always transparent. bg-color is defined in */ } .ang-complementary-1-button-1 a { font-size: 15px; display: block; border-style: solid; border-width: 1px; border-color: blue; padding: 5px 5px 5px 5px; color: #000000; background-color: aqua; border-radius: 5px; -moz-box-shadow: inset 0 0 10px #000000; -webkit-box-shadow: inset 0 0 10px #000000; box-shadow: inset 0 0 10px #000000; } .ang-complementary-1-button-1 a:hover { text-decoration: none; color: blanchedalmond; background-color: aquamarine; } .ang-complementary-1-button-2 { font-family: font4; font-size: 25px; text-align: center; background-color: transparent; /* Always transparent. bg-color is defined in */ } .ang-complementary-1-button-2 a { font-family: font4; font-size: 15px; display: block; border-style: solid; border-width: 1px; border-color: blue; padding: 5px 5px 5px 5px; color: #000000; background-color: #ffffff; border-radius: 5px; -moz-box-shadow: inset 0 0 10px #000000; -webkit-box-shadow: inset 0 0 10px #000000; box-shadow: inset 0 0 10px #000000; } .ang-complementary-1-button-2 a:hover { text-decoration: none; color: #ff0000; background-color: aquamarine; } .ang-complementary-2 { font-family: font4; font-size: 18px; color: #000000; background-color:rgba(169, 235, 238, 1); } .ang-complementary-2 a { font-size: 15px; color: #00ff00; } .ang-complementary-2 a:hover { text-decoration: none; color: #ffffff; cursor: pointer; } .ang-complementary-2-title { font-size: 40px; font-weight: bold; font-style: normal; color: #b0b0b0; } .ang-complementary-2-button-1 { font-family: font4; font-size: 25px; text-align: center; background-color: transparent; /* Always transparent. bg-color is defined in */ } .ang-complementary-2-button-1 a { font-size: 15px; display: block; border-style: solid; border-width: 1px; border-color: blue; padding: 5px 5px 5px 5px; color: #000000; background-color: aqua; border-radius: 5px; -moz-box-shadow: inset 0 0 10px #000000; -webkit-box-shadow: inset 0 0 10px #000000; box-shadow: inset 0 0 10px #000000; } .ang-complementary-2-button-1 a:hover { text-decoration: none; color: blanchedalmond; background-color: aquamarine; } .ang-complementary-2-button-2 { font-family: font4; font-size: 25px; text-align: center; background-color: transparent; /* Always transparent. bg-color is defined in */ } .ang-complementary-2-button-2 a { font-size: 15px; display: block; border-style: solid; border-width: 1px; border-color: blue; padding: 5px 5px 5px 5px; color: #000000; background-color: #ffffff; border-radius: 5px; -moz-box-shadow: inset 0 0 10px #000000; -webkit-box-shadow: inset 0 0 10px #000000; box-shadow: inset 0 0 10px #000000; } .ang-complementary-2-button-2 a:hover { text-decoration: none; color: #ff0000; background-color: aquamarine; } .setting-button { text-align: center; } .setting-button a { margin-right: 5px; color: #b0b0b0 !important; border-color: #b0b0b0; border-style: solid; border-width: 4px; display: block; border-radius: 25px; background-color: #ffffff; height: 43px; width: 43px; } .setting-button a:hover { color: #000000 !important; background-color: #e3e3e3; } /* Tab */ .ang-main-tab-line { border-width: 2px; border-color: #b0b0b0; } .ang-main-tab { display: inline-block; text-align: center; padding: 10px 10px 10px 10px; background-color: #ffffff; } .ang-main-tab-selected { background-color: rgba(169, 235, 238, 1); } .ang-main-tab-not-selected { background-color: #f3f3f3; } .ang-main-tab-disabled { background-color: #ffffff; } .ang-complementary-1-tab-line { border-width: 2px; border-color: #b0b0b0; } .ang-complementary-1-tab { display: inline-block; text-align: center; padding: 10px 10px 10px 10px; } .ang-complementary-1-tab-selected { background-color: rgba(169, 235, 238, 1); } .ang-complementary-1-tab-not-selected { background-color: transparent; } .ang-complementary-1-tab-disabled { opacity: .3; background-color: transparent; } .ang-complementary-2-tab-line { border-width: 2px; border-color: #b0b0b0; } .ang-complementary-2-tab { display: inline-block; text-align: center; padding: 10px 10px 10px 10px; } .ang-complementary-2-tab-selected { background-color: rgba(169, 235, 238, 1); } .ang-complementary-2-tab-not-selected { background-color: transparent; } .ang-complementary-2-tab-disabled { opacity: .3; background-color: transparent; } /* Example of graphical button style */ .ang-button-graphical { float: left; text-align: center; padding-right: 20px; } .ang-button-graphical a { padding-top: 10px; font-family: font1; font-size: 26px; color: #f5cd0e; height: 54px; display: block; background-image: url('images/button-l.png'), url(images/button-r.png), url('images/button-bg.png'); background-position: left top, right top, top left; background-repeat: no-repeat, no-repeat, repeat; } .ang-button-graphical a:hover { display: block; color: #ffffff; opacity: 0.5; filter: alpha(opacity=50); /* For IE8 and earlier */ } /* Theme (background images) */ .ang-banner-bg-x { /* Height must be assigned - defaults to height of the image */ height: 461px; width: 100%; background-image: url('../../uploads/9cda554f87c74c9fafaef2303eb245af.png'), url('../../uploads/53b02b43a80441fa919bdc1bdb6c8ef2.png'),url('../../uploads/667565dc04ed4b02961434e828d45399.png'), url('../../uploads/a77edc0111334c50a6f2c91fcfea82ef.png'); background-position: 50px 100px, top center, top right, top left; background-repeat: no-repeat, no-repeat, no-repeat, no-repeat; background-size: auto 70%, auto 100%, auto 100%, auto 100%; background-color: #00b5bc; overflow: hidden; } .ang-banner-bg-color { background-color: #00b5bc; } .ang-main-bg { /* Do not allow images here. Instead put background CSS in . */ /* ang-main-bg gets put in */ } html { background-color: #ffffff; /* This is the primary color of the site. It should also be set as the ang-dialog-background.background-color. */ /* background-image: url('images/imgbut1.png'); background-position: top left; background-repeat: repeat; */ } .ang-dialog-background { background-color: #ffffff; /* should be the same as html.background-color. */ } .ang-complementary-1-bg { } .ang-complementary-2-bg { } .ang-footer-bg { } .ang-bottombar-bg { /* Must specify height. Line-height is set to height*/ height: 50px; line-height: 50px; } .ang-main-mobile-banner-bg { height: 200px; width: 100%; background-image: url('../../uploads/e8ee131e097343698cefa9f804ff48ef.png'), url('../../uploads/banner-l.png'); background-position: center center, top left; background-repeat: no-repeat, no-repeat; background-size: auto 45%, auto 100%; background-color: #00b5bc; overflow: hidden; } .ang-main-mobile-banner-logo-position { text-align:center; margin-top:50px; } /* Spacing */ .ang-bottom-spacing { margin-bottom: 0px; } .ang-top-spacing { margin-top: 0px; } .ang-band-spacing { margin-top: 60px; margin-bottom: 60px; margin-left:30px; margin-right:30px; } .ang-band-side-spacing { margin-left: 30px; margin-right: 30px; } .ang-alt-background-color { background-color: #97f5f9; color: #1bb492; } /************************************ Logo/Slogan *************************************/ .ang-banner-logo-position { margin-top: 10px; margin-left: 0px; float: left; } .ang-banner-logo { } .ang-banner-slogan { margin-top: 0px; color: #ffffff; font-family: font6; font-size: 20px; } .ang-banner-version { color: #ffffff; font-size: 15px; } .ang-mobile-banner { height: 220px; width: 100%; background-image: url('images/head.png'); background-position: top center; background-repeat: no-repeat; overflow: hidden; } .ang-mobile-banner-logo-position { margin-top: 15px; width: 100%; margin: auto; } .ang-mobile-banner-logo { } .ang-mobile-banner-slogan { margin-top: -20px; color: #ffffff; font-family: Cantarell Regular; font-size: 20px; } .ang-mobile-banner-version { color: #ffffff; font-size: 15px; } /* Form */ .ang-form-label { font-size: 16px; } .ang-form-input { font-size: 15px; } .ang-form-info { font-size: 15px; color: #777777; font-style: italic; } .ang-form-directions { font-size: 15px; color: #777777; margin-bottom: 20px; } .ang-form-label-directions { font-size: 15px; color: #555555; margin-bottom: 5px; } .ang-form-section-title { font-size: 19px; font-weight: bold; color: #ff6a00; } /************************************ Other *************************************/ .ang-checkbox { float:left; height: 25px; width: 25px; color: #ff0000; } .ang-checkbox-sm { float: left; height: 18px; width: 18px; color: #ff0000; } .blinking-div { animation: blink 1s infinite; } @keyframes blink { 0% { opacity: 0; } 50% { opacity: 1; } 100% { opacity: 0; } }