body {background:#fdfdfd;} main {min-height: 65vh;} main,footer,header { transition: opacity 0.5s ease-in-out;} /*framework and nav*/ #wrapper {position:relative; left:0px;} #navBtn {position: absolute;left: -48px;top: 3px;background: #3d71b9;padding: 4px 8px;border-radius: 2px;font-size: 26px;color: #fff;cursor:pointer;} #navBtn:hover {background:#000;} @media (max-width:962px){ .contained {max-width:96% !Important;} } /*NAV SEARCH SYSTEM*/ .siteSearch {z-index:100;width: 100%; position:relative;} .siteSearch .fa-search {position:absolute; top: 6px; left:8px; color:#fff; font-size: 23px;} .siteSearch .fa-times-circle {position:absolute; top: 4px; right: 6px; cursor:pointer; font-size: 26px; color:#fff;} .siteSearch .fa-times-circle:hover {color:red;} .siteSearch input {max-width: 100% !important; width: 100%; padding: 8px 20px 8px 35px !important; color:#fff; outline:none; border:none; border-radius: 0px; background:#000;} .siteSearch input:focus {outline:0 !important; border:none; box-shadow:none; background:#000;} /* NAV STUFF */ .mobNavOn {right:0px !important;} .wrapperOn {left:-260px !important;} .nav_second .staticNav { color:#ddd !important;} .nav_third .staticNav {color:#ddd !important;} .nav_second .staticNav:before,.nav_third .staticNav:before {content:" " !important;} .firstItem {background-color:rgba(67, 112, 195, 0.8); border-bottom: 3px solid #1a339a !Important;} .firstItem a {color:#fff !important;} /*search results*/ #searchResults {background:#311; position: relative; top:-2px; z-index: 999;} #searchResults li {color:#999; font-weight: 100; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; position:relative; padding: 6px 10px 6px 30px; border-bottom:1px solid rgba(255,255,255,0.1);} #searchResults li a {color:#fff; font-weight: 200; font-size: 14px;} #searchResults li:hover {background-color:#1a339a;} #searchResults .search_News:before {position:absolute; content:"\f1ea"; color:rgba(255,255,255,0.5); left: 6px; top: 5px; font-size: 16px; font-family:'fontAwesome';} #searchResults .search_Navigation:before {position:absolute; content:"\f054"; color:rgba(255,255,255,0.5); left: 10px; top: 5px; font-size: 16px; font-family:'fontAwesome';} #searchResults .selected {background-color:#1a339a;} /*TEXT FORMATS*/ body, h1, h2, h3, h4, h5, p, a, li, strong, div, input, select {font-family: 'Roboto', sans-serif !Important; line-height: 1.3;} /*HEADER*/ header {border-bottom:1px solid #eee; background: -moz-linear-gradient(top, rgba(0,0,0,0.0) 80%, rgba(0,0,0,0.025) 100%); background: -webkit-linear-gradient(top, rgba(0,0,0,0) 80%,rgba(0,0,0,0.025) 100%); background: linear-gradient(to bottom, rgba(0,0,0,0) 80%,rgba(0,0,0,0.025) 100%);} header .contained {position:relative; z-index:100;} header .logo {margin: 15px 0;background:url(files/image/4mycard_main2.png) no-repeat;background-size:contain;max-width:480px;width:100%;height: 80px; cursor:pointer;} .btn {text-shadow:0px 1px 0px rgba(0,0,0,0.5); white-space:nowrap; cursor:pointer; position:relative;font-weight: 500;color:#fff; font-size:16px; padding: 1px 18px;border-top:1px solid rgba(255,255,255,0.2);box-shadow:inset 0px -10px 20px rgba(0,0,0,0.3);display:inline-block;margin:10px;border-radius: 4px;} .btn:before {position:absolute; content: ""; z-index:-1; border-radius: 6px; width:104%; height: 112%; box-shadow:inset 0px 10px 20px rgba(0,0,0,0.3); background:inherit; left: -2%; top:-6%;} .btn:after {position:absolute; content: ""; z-index:-2; border-radius: 6px; width:90%; height: 100%; box-shadow: 0px 2px 10px 3px rgba(0,0,50,0.5); background:inherit; left: 6%; top:0;} .btn:active {-webkit-transform:scale(0.95); -moz-transform:scale(0.95); -ms-transform:scale(0.95); transform:scale(0.95);} .btn:hover {background:#1a339a;} /*BREADCRUMBS*/ #breadcrumbs {background-color:#fff; padding:12px 0px; border-top:1px solid #eee; font-size: 9px; white-space:nowrap; color:#444; overflow:auto; } #breadcrumbs a {color:#444; font-weight: 300; font-size: 13px; padding:0px 10px 0px 5px;} #breadcrumbs a:hover {text-decoration:underline;} #breadcrumbs .col-xs-12:before {content:"You are here: "; display:inline-block; padding-right: 10px;font-size: 12px; color:#666; font-weight: 200; font-style:italic;} /*FOOTER*/ footer {background:#fff; border-top:1px solid #bbb; padding-top: 20px;} footer h3 {font-size: 20px; font-weight: 100; color:#1a339a; margin-bottom: 15px;} footer .note {background:#fff !important; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; padding:10px 0px;} footer .note p {padding-bottom: 0px; font-size: 12px; font-weight:200; color:#ddd;} footer .note .col-sm-8 {text-align:right;} footer .note p a {padding:0px 15px; color:#444; cursor:pointer;} footer .note p a:hover {color:#000;} footer .note .col-sm-4 p {color:#444;} footer .footNav {margin-bottom: 15px;} footer .footNav p {font-size: 14px; line-height:1.8;} footer .footNav p a {color:#666; font-weight: 300; -webkit-transition:padding 0.2s ease-in-out; -moz-transition:padding 0.2s ease-in-out; -ms-transition:padding 0.2s ease-in-out; transition:padding 0.2s ease-in-out;} footer .footNav p a:before {content:"\f105"; font-family:fontAwesome; padding-right: 8px;} footer .footNav p a:hover {padding-left: 6px; color:#000;} footer img {margin:25px 0px 10px 0px; max-width:320px !important; width:100%;} footer .footSocial {text-align:right;} footer .footSocial a {font-size: 36px; color:#555; margin-left: 5px;} footer .footSocial a:hover {color:#1a339a;} @media(max-width:768px){ footer .footNav .col-xs-12:nth-of-type(4) {text-align:center;} footer .footNav p {font-size:12px;} footer .footNav h3 {font-size:18px;} } @media(max-width:560px){ footer .note .col-sm-4 {width:100% !important;} footer .note .col-sm-8 {width:100%; margin-top: 5px;} footer .note .col-sm-8 {width:100%; text-align:left !important;} } @media(max-width:480px){ footer .footNav .col-xs-12:nth-of-type(3) {margin-top: 10px;} footer .footSocial {text-align:center;} } /*NEWS*/ .newsCategory {font-size: 36px; color: #444; font-weight: 300;padding: 10px 0 10px 0; overflow:hidden; text-align:center;} .newsCategory h2 {font-weight:100; position:relative; display:inline-block;} .newsCategory h2 span {position:absolute; opacity:0.1; transform:scaleY(-1); left:0; bottom:-27px; font-weight:inherit !important;} .newsStoryImg {position:relative; padding: 20px; background:#1a339a; overflow:hidden; max-height: 600px;} .newsStoryImg span {position:absolute; z-index:0; opacity:0.4; top:0; left:0;width: 100%; height: 100%; background-size:cover; background-size:cover; filter:blur(5px); -webkit-filter:blur(5px); -moz-filter:blur(5px); -o-filter:blur(5px); -ms-filter:blur(5px); background-position:50% 50%; } .newsStory {padding:20px 5px;} .newsStoryImg p {position:relative; z-index:10;} .newsStoryImg img {border:2px solid #fff; width: 100%; max-width:992px;} .newsStory p {font-size: 15px; color:#111; margin-bottom: 10px; line-height: 1.8;} .newsStory h2 {font-size: 24px; margin-bottom: 12px; color:#ddd;} #newsStoryShell {background:rgba(255,255,255,1)} #newsStoryShell h1 {font-size: 32px; color:#333; font-weight: 300; text-align:center; font-size: 36px !important; margin:20px 0px;} .newsStory p a, .newsStory li a {color:#1a339a; font-weight: 600;} .newsStory p a:hover {color:#000;} .newsStory sup {font-size: 50%; display:inline-block; vertical-align:top; padding-top: 5px; padding-right: 2px;} @media (max-width:768px){ #newsStoryShell h1 {font-size: 24px !Important; margin-bottom: 25px;} } @media (max-width:992px){ .newsStoryImg {margin-top: 25px; position:relative;overflow:visible;} .newsStoryImg:before { content:""; position:absolute; top:-66px; left:-25%; width:150%; height: 66px; background:rgba(255,255,255,0.9);} } #newsStoryShell time {text-align:right; display:block; margin-top:-20px;} .newsPanel {background:#fff;border:1px solid #eee;border-radius:3px;padding: 15px 15px 5px 15px;margin:20px 0px;} .newsPanel a {color:inherit;} .newsPanel .newsNanoImage,.newsPanel iframe {width: 100%;height: 180px !important;background-size:cover;background-position: 50% 30%;} .newsPanel .newsTitle {margin: 15px 0px 10px 0px;font-size: 21px;color:#003b4f;/* white-space:nowrap; */overflow:hidden;/* text-overflow:ellipsis; */height: 54px;} .newsPanel p {overflow:hidden; width: 100%; height: 36px; font-size: 14px; color:#444; line-height: 1.4;} .newsNanoDate {font-size: 12px !important; font-style:italic; padding-top: 5px; text-align:right; padding-right: 2px;} .newsStory ol li {margin-left: 25px; font-size: 14px; padding-left: 10px; list-style-type:decimal; margin-bottom: 12px; } .newsGridHeader {padding: 25px 0px 0px 0px; } .newsGridHeader h2 {font-size: 32px !important; color:#003b4f;} .newsPanel:hover {transform:rotate(2deg) scale(1.05); -webkit-transform:rotate(2deg) scale(1.05); -moz-transform:rotate(2deg) scale(1.05); -ms-transform:rotate(2deg) scale(1.05);} .newsPanelWide .newsNanoImage {height: auto !important; padding-top:35%; background-repeat:no-repeat;background-size:cover !important; background-position: 50%;} .newsPanelWide .newsTitle {height: 50px; overflow:hidden; text-overflow:none; white-space:normal;} .newsPanelWide p {height: 40px; margin-bottom: 6px;} .newsPanelWide p.newsNanoDate {height: 20px;} .publishedAuthor {background:#A00000; padding: 5px 10px; border-radius: 20px;} .publishedAuthor a {color:#fff;} .publishedAuthor:before {content:"\f007"; font-family:fontAwesome; color:#fff; padding-right: 5px;} .publishedAuthor:hover {background:darkred;} .newsType {position:absolute; right: 40px; top: 45px; padding: 5px 8px; background:rgba(255,255,255,0.8); border-radius: 6px; color:#444; font-size: 16px;} .catArticleBox .newsType {top: 10px; right: 10px;} /*tooltip hover*/ #toolTip {position:fixed; text-align:center; z-index:10000; line-height: 1.3; padding:5px 8px; font-size: 13px; border-radius: 3px; color:#fff; box-shadow:2px 10px 10px rgba(0,0,0,0.2); background:#222; left:-1000px; top:-1000px; max-width: 200px; pointer-events: none;} #toolTip:after {content:"\f0d7"; font-size: 20px; position:absolute; font-family:'fontAwesome'; bottom:-16px; left: 49%; text-shadow:0 6px 3px rgba(0,0,0,0.1); color:#222;} /*CONTENT*/ .content {padding-bottom: 0px;} .content p {font-size: 16px; line-height: 1.6; margin-bottom: 8px; font-weight: 300;} .content p a, .content li a {color:#09F; font-weight: 500;} .content p a:hover, .content li a:hover {color:#000; text-decoration:underline;} .content blockquote {margin: 0px 30px 20px 30px; text-align:center; position:relative; color:#ddd; font-size: 14px; line-height: 1.5; font-weight: 300; } .content ul {margin-bottom: 10px; font-size:16px;} .content blockquote:before,.content blockquote:after {position:absolute; font-family:Impact, Arial; color:red; font-size: 60px;} .content blockquote:before {content:"?"; left: -30px; top: -18px;} .content blockquote:after {content:"?"; right: -30px; bottom: -50px;} .content .fa-ul i {color:#09f;} .content ul li {font-weight: 300; line-height: 1.6; margin-bottom: 8px; list-style-type:none; font-family:Roboto; font-size: inherit; color:#111; position:relative; margin-bottom: 5px; line-height:1.4;} .content h2 {color:#09F; font-size:30px; font-weight: 400; margin-bottom: 12px; margin-top: 0px;} .content h2 i {font-size: 75%; color:#666; display:inline-block; padding-right: 6px; position:relative; top:-2px;} .content h1 {font-size: 32px;} .content h3 {color:#555; font-size: 26px; font-weight: 600; margin-bottom: 12px; margin-top: 12px;} .content h5 {color:#444; font-size: 16px; line-height: 1.5; margin: 10px 0; font-wieght: 400;} .quotation {font-size: 22px; margin: 10px 10px 10px 30px; padding: 20px 15px 20px 30px; background:#f2f2f2; border-left:5px solid #eee; font-weight: bold !important; color:#444;} .content table {background:#e5f4ff; margin: 15px 1% !important; width:98% !important; border:1px solid #fdfdfd;} .content table th {background: #aeccea;padding: 15px 5px;font-size: 18px;text-align:center;font-weight: bold;color:#444;border-right: 1px solid #ddd;border-bottom: 4px solid #fdfdfd;} .content table.tableTop tr th:last-child {border-right: none;} .content table.tableLeft tr:last-child th {border-bottom: none;} .content table td {padding: 10px 5px;text-align:center;font-size: 18px;color:#222;border-right: 1px solid #fdfdfd;border-bottom:2px solid #fdfdfd;} .content table tbody tr:nth-child(2n+1) {background:#d5e4f3;} .content figure {border:1px solid #eee; padding: 5px; border-radius:4px; background:#f9f9f9;} .content figure figcaption {font-size: 17px; padding: 3px; font-style:italic; color:#444;} .content table td input[type="submit"] {background:red; border:0; padding: 4px 10px 3px 10px; color:#fff; border-radius: 6px; font-size: 13px;} .content table td input[type="submit"]:hover {background:darkred;} .pageHeader h1 {border-bottom: 1px solid #eee; padding-bottom: 10px; font-size: 32px; margin: 20px 0px 20px 0px; color:#444; font-weight: 100;} .pageHeader h1 i {font-size: 75%; display:inline-block; position:relative; top:-2px;} .settingsDate {font-size: 14px !important; color:#444;} .settingsDate span {display:inline-block; width: 80px; font-size: 12px; font-weight: 100; color:#444;} /*form classes*/ .formTextBox, .forms input[type="text"], .forms textarea, .forms input[type="password"], .forms input[type="number"] {outline:none; font-size: 16px; background:#fdfdfd; font-weight:300; border-radius: 3px; border:1px solid rgba(0,0,0,0.2); padding: 3px 12px; box-shadow:inset 1px 3px 5px 1px rgba(0,0,0,0.05); color:#444; min-width: 100px; width:100%; max-width:320px; margin:3px 0px;} .formTextBox:hover, .forms input[type="text"]:hover,.forms input[type="password"]:hover,.forms input[type="number"]:hover, .forms textarea:hover .formTextarea:hover{border-color:#aaa;} .formTextBox:focus, .forms input[type="text"]:focus, .forms input[type="number"]:focus, .formTextarea:focus, .forms textarea:focus {color:#111; border-color:#999; background:#fff; } .formButton, .forms input[type="submit"], .forms input[type="button"] {cursor:pointer;outline:none;font-size: 16px;border-radius: 3px;border: 1px solid rgba(0,0,0,0.1);padding: 3px 12px;box-shadow:0px 0px 1px rgba(0,0,0,0.1);color:#fff;color:rgba(255,255,255,0.8);background: #3d71b9;} .formButton:hover, .forms input[type="button"]:hover {color:#fff; opacity:0.9; } .formButton:active, .forms input[type="button"]:active {color:#fff; opacity:1; text-shadow:0px 1px 1px rgba(0,0,0,0.4); background:#000 !important;} .w100p {width: 100%;} .w50p {width: 50%;} .w40p {width: 40%;} fieldset {padding: 3px 0px; border:none; position:relative;} fieldset label {padding:3px 0px; font-size: 12px; color:#333; display:block;font-weight: 300;} fieldset select {width: 100%; font-size: 16px; background:#f5f5f5;} fieldset input[type="checkbox"] {margin:0px; margin-top:-2px;} fieldset a {font-weight: 600; color:inherit;} .formOptins {margin:10px 0px;} .formOptins label {font-size: 12px; color:#444; font-weight: 200; position:relative; padding-left: 25px; line-height: 1.3; margin-bottom: 5px; display:inline-block; width:100%;} .formOptins label input[type="checkbox"] {position:absolute; left:0; top: -2px;} .forms select {width:100%; max-width:320px; height: 26px; font-size: 16px; color:#444; margin: 3px 0px;} .help {position:relative; font-size: 12px !Important; background:#eef; padding:5px 10px 5px 50px; border-radius:6px; box-shadow:0px 1px 2px rgba(0,0,0,0.1);} .help:before {content:"\f059"; font-family:'fontAwesome' !important; position:absolute; left: 10px; top: -3px; font-size: 36px; color:#1a339a;} .mandatoryError {background:#fdd; color:#f00} .formTextarea {width: 100%; height: 80px; outline:none; font-size: 16px; background:#f5f5f5; font-weight:300; font-family:'Work Sans'; border-radius: 5px; border:1px solid rgba(0,0,0,0.3); padding: 3px 12px; box-shadow:0px 0px 1px rgba(0,0,0,0.1); color:#444;} .topLabel {color:#666; font-size:10px; text-align:center; background:#f5f5f5; padding:2px;} .formError {color:#f00; border-color:red !important;} .error {background:red; color:#fff;} .deleteBtn {background:#600 !important; border-color:#f00 !important;} .forms>ul>li {padding-left: 0;} .forms>ul>li>label {font-size: 16px !important;} .forms>ul li label input {position:relative; top:-2px; margin-right: 8px;} .forms>ul>li>ul>li {padding-left:20px; margin-bottom:-2px !important; } .forms>ul>li>ul>li label {font-size: 13px;} /*CAROUSEL*/ .carouselWrapper {padding:20px 50px !important; position:relative;} .carousel {margin-left: -30px;margin-right: -30px;height:auto;position:relative;font-size:0px;padding-bottom: 12px;} .carouseltem {width:250px; padding:0px 15px; display:inline-block; } .carouseltem>a>div {border:1px solid #555;} .carouseltem h4 {font-size:16px;} .carLeft,.carRight {cursor:pointer;position:absolute;font-size:32px;color: rgba(200,0,0,0.4);top:38%;} .carLeft {left: -2px;} .carRight {right: -2px;} .carLeft:hover,.carRight:hover {color:rgba(0,0,255,0.9);} .infoPanel {padding-top: 70%; transform:scale(1); overflow:hidden !important; width:100%; position:relative;} /*GALLERY*/ .gallery {/display:inline-block;position:relative;border-left:1px solid rgba(0,0,0,0.2);border-right:1px solid rgba(255,255,255,0.2);margin-bottom: -5px;vertical-align: top;} .gallery .fa-search-plus {position:absolute; bottom: 10px; font-size: 36px; right: 10px; color:#fff; text-shadow:1px 1px 2px rgba(0,0,0,0.7);} .gallery img {max-height:256px; display:inline-block;} .facesOther h3 {white-space:nowrap; overflow:hidden; max-width:90%; margin-left: 10px; text-overflow:ellipsis; position:absolute; top:-36px; background:#1a339a; color:#fff; font-weight: 100; font-size: 20px; padding: 5px 20px; border-radius: 6px 6px 0 0;} #gallery {position:fixed; padding: 40px; top:0; left:0;right:0;bottom:0; background:#000; background:rgba(0,0,0,0.8); z-index:2000;} #gallery ul {display:block; position:relative; text-align:center; height: 100%;} #gallery li {position:absolute; top: 0px; left: 0px; width: 100%; text-align:center; pointer-events:none;} #gallery li img {max-width: 100%; max-height:90vh;} #gallery li p {position:absolute; bottom:0;left:-20%;right:-20%;padding:20px 10px; color:#fff;background:rgba(0,0,0,0.6); text-align:center; font-size:18px;} #gallery .galClose,#vrgallery .vrClose {opacity:0.8; position:absolute; top: 12px; right: 12px; z-index:201; color:#fff; font-size: 48px;} #gallery .galPrev {opacity:0.8; position:absolute; top: 48%; left: 5px; z-index:201; color:#fff; font-size: 36px;} #gallery .galNext {opacity:0.8; position:absolute; top: 48%; right: 5px; z-index:201; color:#fff; font-size: 36px;} #gallery i:hover {opacity:1;} .basicPanel {position:relative; background:#fff; box-shadow:0px 0px 4px rgba(0,0,0,0.3); padding:50% 0px;} .showGallery {cursor:pointer;} /*lock footer*/ .lockFooter {position:fixed; width:100%; bottom:0; left:0;} /*404*/ .error404 { transition:all 4s ease-out; transform:scale(0.5); max-width:300px; width:100%; background:rgba(255,255,255,0.9); border-radius: 10px; box-shadow:0px 0px 20px rgba(0,0,0,0.3);padding: 10px 25px; border:6px solid #1a339a; position:absolute; margin-top: 15%; left: 50%; margin-left: -150px; z-index:100;} .error404 h1 {font-size: 48px; letter-spacing:1px;color:#1a339a;} .error404 h2 {font-size: 20px; letter-spacing:1px;color:#444;} .error404 p {font-size: 11px; margin-top: 10px;} .error404 p a {color:#1a339a; font-weight:bold;} .error404grow {transform:scale(1.1) !important;} @media(max-width:992px){ #navBtn {/* top: 10px !important; */} header .logo {max-height: 50px !important;} .pageHeader h1 {font-size: 36px; padding-left:0px;} .content h2 {font-size: 28px;} #breadcrumbs {display:none;} } /*FAQ*/ .faq h3 {font-size: 22px !important; cursor:pointer; margin-top: 20px; color:#444;} .faq .answer {display:none;} /*NEWS COMMENTS*/ .newCommentRoot {background:#def; padding:10px 18px !important; width:95%; margin:10px 0px 0px 0px; border-radius: 8px; z-index:100; border:1px solid rgba(0,0,0,0.05); box-shadow:2px 2px 4px #ddd; border-top:none; position:relative; } .newCommentRoot:after { border-radius: 5px 0 0 0; width:32px; left: 12px; height: 20px; transform:rotate(34deg); position:absolute; z-index:-20 !Important; background:#def; content:""; top:-9px; border:1px solid rgba(0,0,0,0.05); border-right:none; border-bottom:none;} .commentData {display:inline-block; width:25%;; font-size: 12px; color:#555; vertical-align:top;} .commentData h5 {padding-top:10px;} .commentData h6 {margin-top: 10px; position:relative; padding-left: 15px; text-overflow:ellpsis; overflow:hidden; white-space:nowrap;} .commentData h6:before {font-family:'fontAwesome'; content:"\f007"; position:absolute; left:0px;} .commentText {display:inline-block; padding: 10px 0px; width:75%;} .commentText span {font-size: 14px; line-height: 1.8; color:#444; display:block; padding:10px 15px; margin-top:-10px; border-radius: 6px; background:rgba(255,255,255,0.3);} .commentText input {float:right; margin-bottom:-10px; margin-right: -10px; margin-top: 10px; font-size: 16px; background:#1a339a; color:#fff; border-radius: 6px; padding: 4px 20px;} .commentText input:hover {background:#000; box-shadow:0px 0px 10px white;} .newCommentSub {background:#fee; padding:10px 18px !important; margin:10px 0px 0px 10%; border-radius: 8px; z-index:100; border:1px solid rgba(0,0,0,0.05); box-shadow:-2px -2px 4px #ddd; border-top:none; position:relative; } .newCommentSub:after {border-radius: 0 5px 0 0; width:32px; right: 50px; height: 20px; transform:rotate(-34deg); box-shadow:1px -1px 0.5px rgba(0,0,0,0.1); position:absolute; z-index:-20 !Important; background:#fee; content:""; top:-10px; border:1px solid rgba(0,0,0,0.05); border-left:none; border-bottom:none;} .newsCommentsForm {background:#f5f5f5; margin:20px 0; padding: 20px; border-radius: 6px; text-align:right;} .newsCommentsForm h3 {font-size: 24px; font-weight: 100; color:#444; margin-bottom: 18px; text-align:left;} .newsCommentsForm label {padding:0; vertical-align:top; text-align:left;} .newsReplyTo {display:block; margin: -10px -8px 10px -8px; width:100% !important; background:#eee; padding: 4px 8px !important; border-bottom:1px solid #ddd;} .newsReplyTo span {font-size: 12px; color:#444; font-weight: 200;} .newsCommentsForm textarea {padding: 15px; backgound:#fff; border:none; border-radius: 4px; width:100%; margin: 5px 0; font-size: 14px; color:#333; height: 100px;} .newsCommentsForm p {font-size: 12px; text-align:left; padding-bottom: 15px; color:#444; line-height: 1.5;} .newsCommentsForm p a {color:#A00000;} .newsCommentsForm input[type="button"] {-webkit-appearance:none; border:none; padding: 6px 14px; background:#222; border-bottom:3px solid red; color:#fff; font-size: 20px; border-radius: 6px;} .newsCommentsForm input[type="button"]:hover {background:red;} #accountStrap {background:#fff; /*margin:0 -20px;*/ border-bottom: 1px solid #eee;} .accountButtons a {position:relative; z-index:10; margin-bottom: 5px; transition:all 0.2s ease-in-out;position:relative;background: #333;color: #fff;font-size: 16px;font-weight: 300;padding: 8px 20px 8px 12px;display:inline-block; border-radius: 0 0 8px 8px;border: 3px solid #3D71B9;border-top: none;margin-right: 5px;box-shadow: inset 0 6px 6px #000;} .accountButtons a i {padding-right: 4px;opacity:1;color: #fff;} .accountButtons>div span {display:inline-block;font-size: 16px;color: #333;font-weight: 300; font-style:italic;background: #eee; position:relative; margin:0 -10px; z-index:0; padding: 8px 20px 11px 8px;border-left: 1px solid rgba(255,255,255,0.5);} .accountButtons a:hover {background:#3D71B9; color:#fff; box-shadow:inset 0 0 2px #000; text-shadow:0 1px 1px #444;} .accountBtn:hover {background:#3D71B9 !important;} #modal {position:fixed; z-index:999999; top:0; left:0; right:0; bottom:0; background:rgba(240,240,240,0.8);} #modalBox {box-shadow:0px 0px 10px rgba(0,0,0,0.1); background:#fff; padding: 25px; border:1px solid #ddd;position:relative; margin:40px auto; width:90%; max-width: 640px; transform:scale(1.0);} #modalBox .closeModal {position:absolute; right: 10px; top: 10px; font-size: 24px; color:#999; cursor:pointer;} #modalBox .closeModal:hover {color: #3d71b9;} #modalBox.shrunk {transform:scale(0.9) !important; opacity:0;} #modalBox h3 {font-weight: 300;color: #3d71b9;font-size: 24px !important;} #modalBox p {color:#444; font-weight: 300; margin:5px 0px; font-size: 14px; line-height: 1.6;} #modalBox fieldset {padding:0; margin:0;} #modalBox fieldset label {font-size: 12px !important; padding:5px 0;} #modalBox p a {color: #3d71b9; font-weight: 400} #modalBox h4 {font-weight: 100; color:#333; font-size: 18px !important; margin: 10px 0;} #modalBox .modalBtn {display:inline-block;margin:5px 10px 0px 0px;font-size: 16px;background: #3d71b9;color:#fff;padding: 6px 16px;border-radius: 4px;border: 1px solid rgba(0,0,0,0.1);} #modalBox .modalBtn:hover {background:#111;} @media(max-width:768px){ #modalBox {position:absolute; margin:0px auto; top: 10px; left: 5px; right: 5px; max-height: 95vh; overflow:auto;} } /*input wrapper classes*/ .inputWrap {position:relative; display:block;margin:2px 0px; overflow:hidden; margin-bottom: 6px;} .inputWrap.wrapLeft input,.inputWrap.wrapLeft select {padding-left: 50px !important; margin:0px !important;} .inputWrap.wrapRight input,.inputWrap.wrapRight select {padding-right: 50px !important; margin:0px !important;} .inputWrap i.wrapLeft {position: absolute; left: 11px; top: 7px; font-size: 18px; width:18px; text-align:center; text-shadow:0px 1px 2px #fff; color:#555;} .inputWrap i.wrapRight {position: absolute; right: 11px; top: 7px; font-size: 18px; text-shadow:0px 1px 2px #fff; color:#555; z-index:9;pointer-events: none;} .inputWrap.wrapLeft:before {position:absolute; top:1px; left:1px; bottom:1px; content:""; background: #eee; width:38px; border-radius: 3px 0px 0px 3px; border-right: 1px solid #ccc; box-shadow:1px 0px 2px rgba(0,0,0,0.1);} .inputWrap.wrapRight:after {position:absolute; top:1px; right:1px; bottom:1px; content:""; background: #eee; width:38px; border-radius: 3px 0px 0px 3px; border-left: 1px solid #ccc; box-shadow:-1px 0px 2px rgba(0,0,0,0.1);pointer-events: none;} .inputWrap input[type="text"],.inputWrap input[type="password"] {display:inline-block;height: 32px;outline:0;border-radius: 4px;width:100%;border:1px solid #ddd;padding: 6px 10px;font-size: 14px;font-family:'Source Sans Pro';font-weight: 500;} .inputWrap input[type="text"]:hover,.inputWrap input[type="password"]:hover {background:#f5f5f5;} .inputWrap input[type="text"]:focus,.inputWrap input[type="password"]:focus {background:#fff;border: 1px solid red;box-shadow:0px 0px 4px rgba(0,100,200,0.6);} .inputWrap select {width:100%; outline:none; -webkit-appearance:none; appearance:none; -moz-appearance:none; height: 32px; border:1px solid #ddd; background:#fff;font-size: 14px;font-family:'Source Sans Pro';font-weight: 500; color:#555;} .inputWrap select:focus {border:1px solid red;} /*RGE*/ #rgeWrapper .newsStory {background:#fff; } #rgeWrapper .faq div {display:block !important;} #rgeWrapper #modal {position:relative !important;} #rgeWrapper .shrunk {opacity:1 !important;} .developerFilters {background:#f9f9f9; text-align:center; padding:7px 0 10px 0; margin:0px 0px 20px 0px; border-top:1px solid #ddd; border-bottom: 1px solid #ddd;} .developerFilters label {font-size: 12px; font-weight: 100; display:inline-block; padding:0px 5px 0px 5px; position:relative; top:2px; vertical-align:bottom;} .developerFilters input[type="text"] {min-width: 280px; margin-bottom: 2px;border:1px solid #ddd; font-size: 16px; padding: 2px 10px; font-weight: 200; margin-left: 2px; border-radius: 2px;} .developerFilters select {height: 26px; font-size: 14px; font-weight: 200; margin:0px 0;} .developerFilters input[type="submit"] {display:inline-block; font-size: 17px; border-radius: 4px; margin-left: 10px; height: 28px; vertical-align:bottom; position:relative; top:3px; padding:2px 16px; border:1px solid #ddd; font-weight: 600; background:#A00000; color:#fff;} .developerPaging a {border:1px solid #ddd; border-radius:4px; min-width: 25px; height: 25px; display:inline-block; padding: 2px; text-align:center; font-weight: 100; margin:0px 5px 20px 5px; text-shadow:1px 1px 0px rgba(0,0,0,0.2);} .developerPaging .pagingMore,.developerPaging .pagingLess {border:none !Important;} .developerPaging .pagingCurrent {background:#1a339a; color:#fff;} @media(min-width:992px){ .hide-md {display:none;} } @media(min-width:768px) and (max-width:991px){ .hide-sm {display:none;} } @media(max-width:767px){ .hide-xs {display:none;} } @media(max-width:768px){ .developerFilters label {width:100%; padding-top: 6px; text-align:left; position:relative; height: 30px;} .developerFilters input[type="text"],.developerFilters select {width:60%; position:absolute; right:0; top:1px;} .developerFilters input[type="submit"] {width:100%; margin:5px 0px;} } .developerFilterBy {margin-top: 5px;} .developerFilterBy label {display:inline-block; vertical-align:middle;} .developerFilterBy ul {display:inline-block;} .developerFilterBy li {cursor:pointer; font-size: 12px; color:#444; font-weight: 400; background:#ddd; display:inline-block; margin:4px; padding:3px 12px 1px 11px; border-radius: 10px;} .developerFilterBy li.selected {background:#f90; color:#fff;} #tagPreset select {width:60%;} #tagPreset input {width:38%;} @media(max-width:480px){ #mobNav {width:100%; right:-100%;} .siteSearch input {padding-left: 70px !important; top:-3px; position:relative;} .siteSearch .fa-search {left:45px; top:5px; z-index:300; color:#666;} .wrapperOn #navBtn {left:2px; z-index:200; top:2px !important;} .wrapperOn main, .wrapperOn footer,.wrapperOn header, .wrapperOn #accountStrap {/*display:none;*/opacity:0.2;} .wrapperOn {background:#333 !important;} .wrapperOn header,.wrapperOn #accountStap, .wrapperOn main, .wrapperOn footer {filter:blur(2px);} } #enterComp {font-size: 24px; background:#1c3797; color:#fff; padding: 4px 20px; border-radius: 10px; box-shadow:inset 0px -5px 10px rgba(0,0,0,0.3); transition:all 0.3s ease-in-out;} #enterComp:hover { box-shadow:inset 0px 5px 10px rgba(0,0,0,0.3); padding:5px 20px 3px 20px; background-color:#1c37ff; } #newNav {position:fixed;width: 260px;right:-260px;top:0;bottom:0;z-index:500;background: rgba(20,20,25,0.98);box-shadow: 0px 0px 20px rgba(0,0,0,0.5);} #newNav .nav_first {padding-bottom:100px; /*height: 100%; overflow:auto;*/ min-width:110%; display:block;} #newNav .nav_first li {position:relative;} #newNav .nav_first>li>a {font-size: 18px; width: 100%; display:block; color:#ccc; font-weight: 300; padding: 5px 10px; border-bottom: 1px solid rgba(255,255,255,0.1);} #newNav .nav_first>li>a:hover {color:#fff;} #newNav .nav_first>li>.staticNav {position:relative;} #newNav .nav_second>li>a{padding: 7px 5px 0px 30px;margin-bottom: 0px;line-height: 1.1;display:block;width: 90%;position:relative;color:#ddd;background:#111; color:rgba(255,255,255,0.6);font-size: 16px; font-weight: 300; border-bottom: 1px solid rgba(255,255,255,0.1);min-height: 32px;} #newNav .nav_second>li>a:before {position:absolute; content:">"; left: 14px; color:rgba(255,255,255,0.2); transition:all 0.3s ease-in-out; } #newNav .nav_second>li>a:hover {padding-left:40px;} #newNav .nav_second>li>a:hover:before {left:24px; color:#fff;} #newNav .nav_third>li>a{padding: 9px 5px 4px 40px;min-height: 30px;margin-bottom: 0px;line-height: 1.2;display:block;width: 100%;border-bottom: 1px solid rgba(255,255,255,0.1);position:relative;color:#ddd;color:rgba(255,255,255,0.6);font-size: 12px;} #newNav .nav_third>li>a:before {position:absolute; content:">"; left: 24px; color:rgba(255,255,255,0.2); transition:all 0.3s ease-in-out} #newNav .nav_third>li>a:hover {padding-left:50px;} #newNav .nav_third>li>a:hover:before {left:36px; color:#fff;} #newNav .nav_fourth>li {margin-left: 5px;} #newNav .nav_fourth>li>a{padding: 8px 5px 0px 55px; margin-bottom: 4px; line-height: 0.8;display:block; width:100%; position:relative; color:#ddd; color:rgba(255,255,255,0.6); font-size: 11px;} #newNav .nav_fourth>li>a:before {position:absolute; content:">"; left: 40px; color:rgba(255,255,255,0.2); transition:all 0.3s ease-in-out} #newNav .nav_fourth>li>a:hover {padding-left:60px;} #newNav .nav_fourth>li>a:hover:before {left:46px; color:#fff;} .subMenu {position:absolute;right:27px;top:0;height:33px;width:29px;background: #111;color:#fff;z-index:100;text-align:center;padding-top:3px;border-left: 1px solid rgba(255,255,255,0.05);} .subMenu:before {content:"-"; font-size: 22px;} .subMenu.closed {padding-top: 3px;} .subMenu.closed:before {content:"+"; font-size: 22px;} header input::placeholder {color:#a00000 !important;} #newNav input::placeholder {color:#aaa !important;} #topNavNew .firstItem {background-color:rgba(0,0,0,0.33) !important; border-radius: 8px 8px 0 0; height: 50px;} #topNavNew .noTopNav {display:none !important;} /*3d71b9*/ #topNavNew {margin-top: 10px;} #topNavNew>ul>ul>li {display:inline-block;position:relative;margin-bottom: -2px;margin-top: 10px;border: 2px solid rgba(255,255,255,0); border-radius: 6px 6px 0 0;} #topNavNew>ul>ul>li>a {display:inline-block;text-transform:uppercase;color:#333 !important; letter-spacing:1.2px; font-size: 18px;margin:0px;padding: 10px 13px 19px 13px; font-family:Work Sans; font-weight: 300;} #topNavNew>ul>ul>li:hover {border-radius: 8px 8px 0 0;background-color: #444 !important;box-shadow: inset 0 -6px 10px #111;border: 2px solid #3d71b9;} #topNavNew>ul>ul>li:hover>a {color:#fff !important;} #topNavNew ul {transition:all 0.3s ease-in-out; -webkit-transition:all 0.3s ease-in-out; -moz-transition:all 0.3s ease-in-out; -ms-transition:all 0.3s ease-in-out;} #topNavNew>ul>ul>li:hover ul {padding:10px 0;display:block !important;opacity:1 !important; /*border-bottom: 6px solid #000;*/ min-width: 205px;} #topNavNew>ul>ul>li:hover ul>li {display:block;} #topNavNew>ul>ul>li.stack3:hover ul>li {display:inline-block; width:32%;} #topNavNew>ul>ul>li.stack2:hover ul>li {display:inline-block; width:49%;} #topNavNew>ul>ul>li>ul {display:block !important;position:absolute;left:-20px;top:50px;opacity:0 !important;z-index:999999999;background: #333;border-radius:6px;box-shadow: 0px 5px 5px rgba(0,0,0,0.2);} #topNavNew>ul>ul>li>ul>li {display:none; white-space:nowrap; padding: 10px 15px; font-size: 19px !important;} #topNavNew>ul>ul>li>ul>li a {display:block; color:rgba(255,255,255,0.8); font-family:'linotypebreweryregular'; letter-spacing:1.2px; } #topNavNew>ul>ul>li>ul>li a:before {content:"\f0da "; color:rgba(255,255,255,0.3); font-family:fontAwesome;} #topNavNew>ul>ul>li>ul>li>ul {display:none !important;} #topNavNew .nav_third li {display:none !important;} #topNavNew>ul>ul>li>ul>li:hover {background: #3d71b9;color:#000;} #topNavNew>ul>ul>li:nth-of-type(7) ul {right:50px; left:-100px; width:300px;} #topNavNew .stack3 ul {width:800px;} #topNavNew .stack3:hover li {display:inline-block; } #topNavNew .stack2 ul {width:600px;} #topNavNew .stack2:hover li {display:inline-block; } @media(min-width:993px) and (max-width:1200px){ #topNavNew>ul>ul>li {margin-top: 4px !important;} #topNavNew li a {font-size: 17px !important;} } @media(max-width: 992px){ #topNavNew {display:none;} header {height: 90px !important;} header .logo {max-height: 70px !important; background-position:30% 50%; width:50%;} .ac1,.ac2 {padding-right: 45px !important;} .accountButtons a {padding:8px 10px !important; font-size: 14px;} .ac2 span {display:none !important;} } @media(max-width: 900px){ header .logo {width:90% !important; background-position:50% 50%; max-width:100%;} .articleSearch {width:100%; margin:0px auto; position:static !important; } } #topNavNew li.clr_bills:hover {background-color:#57B619 !important;} #topNavNew li.clr_bills ul {border-bottom-color:#57B619 !important; border-top-color:#57B619 !important; background-color:#57B619 !important;} #topNavNew li.clr_bills ul li:hover {background-color:rgba(0,0,0,0.1);} #topNavNew li.clr_insurance:hover {background-color:#D8473B !important;} #topNavNew li.clr_insurance ul {border-bottom-color:#D8473B !important; border-top-color:#D8473B !important; background-color:#D8473B !important;} #topNavNew li.clr_insurance ul li:hover {background-color:rgba(0,0,0,0.1);} #topNavNew li.clr_financial:hover {background-color:#2398e5 !important;} #topNavNew li.clr_financial ul {border-bottom-color:#2398e5 !important; border-top-color:#2398e5 !important; min-width: 265px !important; background-color:#2398e5 !important;} #topNavNew li.clr_financial ul li:hover {background-color:rgba(0,0,0,0.1);} #topNavNew li.clr_laterlife:hover {background-color:#FFBF22 !important; } #topNavNew li.clr_laterlife ul {border-bottom-color:#FFBF22 !important; border-top-color:#FFBF22 !important; min-width: 265px !important; background-color:#FFBF22 !important; } #topNavNew li.clr_laterlife ul li:hover {background-color:rgba(0,0,0,0.1);} #topNavNew {position:relative;} #topNavNew .fa-search {color: #fff;cursor: pointer;margin-left: 5px;position: absolute;padding-right: 0px;right: -25px;top: 10px; font-size: 20px;} #regForum {background:#eee; padding: 5px 15px !important; display:block; border-radius: 4px; margin-bottom: 10px !important;} #regForum p {font-size: 18px !important;} .registerInterests ul>li>ul>li {display:inline-block !important; width: 120px;} .registerInterests ul>li>ul {margin:0 0 10px 0; border-top: 1px solid #ddd;} .registerInterests ul>li label input {margin-right: 10px !important;} .registerInterests ul>li>ul label {font-style:italic;} .registerInterests ul>li>ul>li {display:inline-block !important; width: 120px;} .mainCatSubHeading { border-bottom: 3px solid #000;} .mainCatSubHeading h2 {font-family: 'Oswald', sans-serif !important; font-size: 32px; color:#222;font-weight: 700; text-transform:uppercase; padding:10px 0;} .mainCatSubListing {background:#f5f5f5; padding: 40px 0px 30px 0px;} .catArticleBox {background:#fff; box-shadow:0 0 5px rgba(0,0,0,0.05); position:relative; height: 220px;} .catArticleBox h3 {font-weight:700;color:#000;text-transform:uppercase;font-size: 14px;padding: 8px 12px 0 12px;position:absolute;height: 80px;overflow: hidden;bottom: 20px;} .catArticleBox p {font-size: 12px;line-height: 1.5;padding: 8px 12px;color:#333;height: 80px;overflow:hidden;position:absolute;opacity:0;bottom: 20px;} .catArticleBox div {/* padding-top: 60%; */position: absolute;overflow:hidden;top: 0;bottom: 105px;width: 100%;} .catArticleBox div span {position:absolute; left:0; width:100%; bottom:0; height: 100%; background-size:cover;} .catArticleBox:hover {transform:scale(1.04); box-shadow:5px 5px 12px rgba(0,0,0,0.3);} .catArticleBox:hover h3 {opacity:0;} .catArticleBox:hover p {opacity:1;} .catArticleBox:hover div span {transform:scale(1.05);} .catArticleBox .catBar {position:absolute; bottom:0; right:0; width:60%; height: 10px; overflow:hidden;} .catArticleBox .catBar:after {content:""; position:absolute; width: 30px; height: 30px; background:#fff; transform:rotate(20deg); left:-20px; top:-20px;} @media(max-width:962px){.catArticleBox:hover div span {transform:scale(1);}} /*ARTICLE SEARCH*/ .articleSearch {position: absolute;max-width: 450px;right: 45px;top: 0px;width: 100%;} .articleSearch p {color:#555; font-size: 11px; padding-left: 45px; font-style:italic; padding-bottom: 5px;} .articleSearch p a {padding-right: 20px;color: #a00000;text-decoration:underline;} .articleSearch i {position:absolute;left: 16px;top: 10px;font-size: 20px;color: #a00000;} .articleSearch fieldset {margin-bottom: 5px;} .articleSearch fieldset input[type="text"] {border:1px solid #eee; font-weight: 300;margin:0;padding:8px 15px;font-size: 20px;color:#444;width:100%;border-radius: 25px;box-shadow: 0 4px 4px rgba(0,0,0,0.1);} .articleSearch fieldset .searchWrap {position:relative;display:inline-block;width:80%;margin-right: 1%;} .articleSearch fieldset .searchWrap ul {display:block !important;max-height: 200px;overflow:auto;position:absolute;left:18px;right:18px;top:30;font-size: 20px;background:#fff;/* border:1px solid #ddd; */z-index:10;box-shadow:0 5px 6px rgba(0,0,0,0.2);} .articleSearch fieldset .searchWrap ul li {position:relative; border-bottom:1px solid #ddd; cursor:pointer; padding: 4px 14px; color:#444; font-size: 16px;} .articleSearch fieldset .searchWrap ul li:hover, .articleSearch fieldset .searchWrap ul li.selected {background:red; color:#fff;} .articleSearch fieldset .searchWrap ul li:last-child {border-bottom:none;} .articleSearch fieldset .searchWrap ul li span {font-weight: 300; display:block; width: 80%; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;} .articleSearch fieldset .searchWrap ul li b {position:absolute; right:10px; top: 8px; font-size: 12px; font-weight: 400;} .articleSearch fieldset .searchWrap ul li b:after {content:" days"} @media(max-width:768px){ .articleSearch> div h1 {font-size: 48px; line-height:1;} .articleSearch fieldset {max-width:96%;} .articleSearch fieldset input[type="text"] {width:100%;} .articleSearch fieldset input[type="button"] {width:100%; margin-top: 10px;} .articleSearch fieldset .searchWrap {width:100%;} } /*CATEGORY INTRO */ .categoryIntro { position:relative; overflow:hidden; } .categoryIntro .contained {position:relative;} .categoryIntroImg {position:absolute; top:0; left:0; width:100%; height: 100%; background-size:cover; background-position:50%;} .categoryIntro_tint {position:absolute; top:0; left:0; width:50%; height: 90px; background:rgba(20,0,0,0.3); border-bottom:1px solid rgba(255,255,255,0.3);} .categoryIntroCopy {padding-top: 0px; } .categoryIntroCopy p {font-size: 14px; line-height: 1.8; margin-bottom: 12px;} .categoryIntroCopy h1 {white-space:nowrap; font-family:'Oswald' !important; font-weight: 700; font-size: 36px;} .categoryIntroSlice { background-color: inherit; position: absolute; top: -100px; bottom: -100px; width: 150px; left: 50%; margin-left: -90px; transform: rotate(15deg); border-right: 1px solid rgba(255,255,255,0.3); box-shadow: 15px 0px 15px rgba(0,0,0,0.5);} .categoryIntro .rightPic {position:absolute; top:0; bottom:0; left:50%; right: 0; background-size:cover; background-position:50%;} .categoryIntro .leftPic {position:absolute; top:0; bottom:0; left:0; right: 50%; background-size:cover; background-position:50%;} @media(max-width:768px){ .categoryIntro .rightPic {position:static !important; padding-top: 40%; margin-top:-20px; width:90%;} .categoryIntroSlice {left:90% !important;} .categoryIntro_tint {display:none;} .categoryIntro h1 {background:rgba(0,0,0,0.3); margin:0 -30% 0 -30px; padding: 10px 0 15px 0 !important; text-align:center; font-size: 22px;} } @media(max-width:480px){ .categoryIntro h1 {margin:0 -10% 0 -30px; padding: 10px 0 15px 0 !important; font-size: 20px;} .categoryIntroSlice {left:95% !important;} } .articleAuthor {max-width: 480px; background:#f5f5f5; padding: 20px; border-radius: 8px; border:1px solid #eee; margin:15px 0; padding-left: 100px; position:relative;} .articleAuthor .authorImage {background-size:cover; position:absolute; left: 10px; top: 10px; border-radius: 80px; width: 80px; height: 80px; border:1px solid #ddd !important; box-shadow:3px 3px 6px rgba(0,0,0,0.1); } .articleAuthor .authorBiog {position:relative; font-size: 13px; color:#333; line-height: 1.5; margin:10px 0; max-height: 150px; overflow:hidden; text-align:justify;} .articleAuthor .authorName {font-weight: 600; font-size: 20px; color:#222;} .articleAuthor .authorBiog:before {position:absolute; content:"VIEW MORE"; text-align:right;padding:35px 0px 0 0; left:0; bottom:0; width:100%; height: 50px; color:#A00000; font-weight: 600; background: rgb(245,245,245); background: -moz-linear-gradient(180deg, rgba(245,245,245,0) 0%,rgba(245,245,245,1) 90%, rgba(245,245,245,1) 100%); background: -webkit-linear-gradient(180deg, rgba(245,245,245,0) 0%,rgba(245,245,245,1) 90%, rgba(245,245,245,1) 100%); background: linear-gradient(180deg, rgba(245,245,245,0) 0%,rgba(245,245,245,1) 90%, rgba(245,245,245,1) 100%); cursor:pointer; } .articleAuthor .authorConnect {padding: 10px 0;} .articleAuthor .authorConnect a {font-size:0px; margin: 5px 5px 0px 0;} .articleAuthor .authorConnect a i {font-size: 22px; background:#999; color:#fff; border-radius: 4px; padding: 5px 8px;} .articleAuthor .authorConnect a i:hover {background:red;} .articleAuthor .authorBiog.authorShow {height: auto !important; overflow:visible; max-height: initial;} .articleAuthor .authorBiog.authorShow:before {display:none;} .articleMainPic {padding-top: 40%; background-size:cover; margin-bottom: 20px;} .articleTitle {font-size: 49px; font-family:'Oswald'; font-weight: 700; color:#222; margin-bottom: 20px;} .publishedDate {float:left; max-width:320px; margin-bottom: 25px; color:#666;} .publishedAuthor {float:right; max-width: 320px; margin-bottom: 25px; color:#666;} .articleContent {clear:both;} .articleContent img {border-radius: 4px;} .articleAuthor p a {background:#A00000; display:inline-block; font-size: 12px; text-align:center; padding: 5px 15px; color:#fff; border-radius: 4px; text-align:center;} .articleAuthor p a:hover {background:#000;} .tick li {padding-left: 40px !important; position:relative; font-size: 16px; margin-bottom: 12px !important;} .tick li:before {content:""; width: 22px; height: 22px; left:10px; background:url(files/image/logos/over50smoney_tick_big.png); background-size:contain; background-repeat:no-repeat; position:absolute; top:0;} .tick li.cross:before {background-image:url(files/image/logos/over50smoney_cross_big.png) !important;} .tick li.goldenTick:before {background-image:url(files/image/logos/goldenTick_mini.png) !important;} h2.goldenTick {padding-left: 50px; position:relative;} h2.goldenTick:before {position:absolute; left:0;height: 40px; content:""; width: 40px !important; background-image:url(files/image/logos/goldenTick_mini.png) !important; background-repeat:no-repeat; background-size:contain;} .chevron li {padding-left: 30px !important; position:relative; font-size: 16px; margin-bottom: 12px !important;} .chevron li:before {content:"\f054"; font-family:fontAwesome; left:10px;position:absolute; top:0; color:red;} .mainCatFeature {margin:10px 0;padding: 20px;background: #737a7e;border-top: 1px solid #333;border-bottom: 1px solid #333;box-shadow: inset 0 5px 10px rgba(0,0,0,0.2);} .mainCatFeature h2 {font-size: 26px; margin-top: 15px; font-family:'Oswald'; color:#fff; font-weight: 700; margin-bottom: 15px;} .mainCatFeaturePic {padding-top: 60%; background-size:cover; border:1px solid #ddd; border-radius: 4px;} .mainCatFeature p {font-size: 16px; margin-bottom: 12px; line-height: 1.6; color:#ccc; font-weight: 300;} .mainCatFeatureTags li {display:inline-block; margin:0 10px 10px 0; padding: 5px 10px; border-radius: 20px;} .mainCatFeatureTags li:hover {opacity:0.8;} .mainCatFeatureTags li a {color:#fff;} .mainCatFeatureCopy {min-height: 270px;} .mainCatFeatureAuthor {position:relative;} .mainCatFeatureAuthor a {color:#fff; text-decoration:underline; font-weight: 600;} .mainCatFeatureAuthor span {margin:0 10px; position:relative; top:12px; width: 36px; height: 36px; display:inline-block; border-radius: 36px; border:1px solid #444; background-size:cover;} .subCatBox {background:#222; box-shadow:0 0 0 rgba(0,0,0,0.2); overflow:hidden; position:relative; margin: 10px 0; padding: 10px; border-radius: 6px; border-top:1px solid #555; border-bottom:1px solid #000;} .subCatBox a {color:inherit;} .subCatBox h3 {color:inherit; padding-left: 80px; font-family: 'Oswald' !important; font-weight: 700;font-size: 20px; margin-bottom: 5px;} .subCatBox p {padding-left: 80px; color:#ddd; font-weight: 400; font-size: 13px;} .subCatBox span {position:absolute; border-radius: 6px 0 0 6px; left:0; top:0; width:75px; height: 100%; bottom:0; background-color:#000; background-size:cover;} .subCatBox:hover {transform:scale(1.03); box-shadow:4px 4px 6px rgba(0,0,0,0.2);} .subCatBox span:after {content:""; position:absolute; width: 18px; top:-30px; left:67px; bottom:-30px; background:#222; transform:rotate(10deg);} @media(max-width:962px){ .mainCatFeature { margin:10px 0 !important; width:100% !important;} } @media(max-width:768px){ .articleTitle {font-size: 36px;} } #RSS {opacity:0.9; margin-top:-25px; position:absolute; right: 10px; background:#f90; padding: 4px 8px 2px; border-radius: 4px; font-size: 14px; border:3px solid #fff;} #RSS a {color:#fff;} #RSS:hover {background:#c80;} /*FAQS*/ .faq h3 { border-bottom: 1px solid #ddd; padding-bottom: 15px;} .faq .answer {padding: 15px 15px 10px 15px; background:#f5f5f5;} .faq .answer p {line-height: 1.6; font-size: 14px; color:#333; margin-bottom: 5px;} .faq h3.open {color:red;} /*FOOTER*/ footer {background: #333 !important;border-top: 5px solid #3d71b9;padding: 25px 0 0 0;} footer h3 {color:#fff;} footer h3 a {color:#eee;} footer h3 a:hover {color:#fff;} footer li {margin-bottom: 5px;} footer li a {color:#ddd; font-weight: 300; font-size: 14px;} footer .footnote {background: #222;color:#eee;font-size: 12px;font-weight: 300;margin-top: 20px;padding:8px 0;border-top: 1px solid #444;} .socialFooter {text-align:center;} .socialFooter li {display:inline-block; margin: 5px 4px; } .socialFooter li a {font-size: 32px;} .socialFooter li a {font-size: 32px; color:#ddd;} .footerNav li {position:relative;} .footerNav li:hover a {color:#fff; padding-left:15px;} .footerNav li:before {transition:inherit; content:"\f105"; transform:scale(0.5); font-size: 18px; font-family:fontAwesome; color:#fff; position:absolute; left:0; opacity:0; top:-1px;} .footerNav li:hover:before {opacity:1; transform:scale(1);} .searchResultsBox {overflow:hidden; position:relative; margin:5px 0; border:1px solid #ddd; border-radius: 6px; padding-top: 75%;} .searchResultsBoxImg {position:absolute; top:1px; left:1px; right:1px; bottom:1px; background-repeat:no-repeat; background-size:cover; border-radius: 4px;} .searchResultsBox h3 {position:absolute; border-radius: 0 0 5px 5px; bottom:0; padding: 10px; background:rgba(255,255,255,0.9); width: 100%; color:#000; padding-bottom: 25px; font-family: 'Roboto', sans-serif !Important; font-weight: 600; text-transform:uppercase;} .searchResultsBox .catBar {position:absolute; font-size: 0px; bottom:0; right:0; height: 14px; width: 50%; } .searchResultsBox .catBar:before {position:absolute; content:""; width:28px; height: 28px; background:inherit; transform:rotate(15deg); transform-origin:0 0;} .homeCatHeading {position:relative;} .homeCatHeading a.homeCatHeadingMore {position:absolute; right: 0; font-size: 15px; bottom: 10px; color:#333;} .homeCatHeading a.homeCatHeadingMore i {font-size: 20px; position:relative; top: 2px; left: 5px;} .homeCatHeading a.homeCatHeadingMore:hover {color:red; transform:translateX(12px);} @media(min-width:963px){ .mobileView {display:none;} .desktopView {display:block;} } @media(max-width:962px){ .mobileView {display:block;} .desktopView {display:none;} .homeCatHeading a:nth-of-type(2) { display:none; } } /*BLOG COLOUR*/ .blogClr_f {color:purple !important;} .blogClr_b {background-color:purple !important;} .blogClr_border {border-color:purple !important;} .mainCatSubNav {position:absolute; left:10px; bottom:-24px;} .mainCatSubNav li {display:inline-block; margin:0 5px; padding:3px 10px 0 10px; height: 24px; font-size: 14px; border-radius: 0 0 6px 6px;} .mainCatSubNav li a {color:#fff;} .mainCatSubNav li:hover {background:#000; box-shadow:2px 2px 8px rgba(0,0,0,0.3);} @media(max-width:768px){ .mainCatSubNav {display:none;} } .articlePromoLink {text-align:center; padding: 20px;} .articlePromoLink a {display:inline-block; -webkit-transition:all 0.3s ease-in-out; transition:all 0.3s ease-in-out; font-size: 24px; color:#fff !important; background:red; padding: 6px 20px 5px 20px;border-radius: 26px; font-weight:bold;} .articlePromoLink a:hover {background:#000;} .articleExtra {border:1px solid #ddd; position:relative; background:#eee; padding: 25px 15px; max-width: 560px; display:block; margin:20px auto;} .articleExtra h2 {margin:0; font-size: 20px; padding-left: 215px; color:#666;} .articleExtra span {display:inline-block; width: 50px; padding-top: 50px; background-position:50%; background-size:cover !important; position:absolute; left: 15px; top: 5px; bottom: 5px; width: 200px;} .articleExtra div {position:absolute; left:0; top:0; width:10px; bottom:0;} .articleExtra:hover {transform:scale(1.03); box-shadow:0 0 10px rgba(0,0,0,0.2);} .articleExtra:hover h2 {color:#000;} @media(max-width: 480px){ .articleExtra {max-width:400px; width: 90%;} .articleExtra h2 {width: 90%; padding-left: 10px; padding-top: 170px;} .articleExtra span {width: 94%; height: 170px;} } #topNavNew {padding-left: 35px;} #navHome {position:absolute; left:3px; cursor:pointer; top: 19px; color:#777; font-size: 18px;} #navHome:hover {color:#3d71b9;} .ac1,.ac2 {text-align:right;} /* MY ACCOUNT */ #my_account_nav {max-width: 200px;} .accountNavDrawer .switch {display:none; position:absolute; right:-35px; width:40px; text-align:right; padding:2px 4px 5px 0; height: 34px; top: -1px; background:#f5f5f5; z-index:5; border:1px solid #eee; border-radius: 0 6px 6px 0; border-left:none; font-size: 24px; color:#2f5bab; box-shadow:4px 4px 4px rgba(0,0,0,0.2); } #my_account_nav li {cursor:pointer; pointer-events: auto;} #my_account_nav>ul>li {padding: 10px 0 10px 32px; border-bottom:1px solid #ddd; position:relative; color:#444; font-size: 16px;} #my_account_nav>ul>li i {position:absolute; left: 8px; top: 12px; color:#555;} #my_account_nav>ul>li>span {font-family:Roboto; font-weight: 300;} #my_account_nav>ul>li.subShut:after {content:"\f105"; font-family:fontAwesome; position:absolute; right: 5px; top:10px; color:#444;} #my_account_nav>ul>li.subOpen:after {content:"\f107"; font-family:fontAwesome; position:absolute; right: 5px; top:10px; color:#444;} #my_account_nav>ul>li>ul {padding-top: 10px;} #my_account_nav>ul>li>ul>li {padding: 6px 0 6px 20px; border-bottom:1px solid #ddd; position:relative; color:#444; font-size: 14px;} #my_account_nav>ul>li>ul>li:last-child {border:none;} #my_account_nav>ul>li>ul>li i {position:absolute; left: -6px; color:#555; top:8px;} #my_account_nav>ul>li>ul>li span {font-family:Roboto; font-weight: 300;} #my_account_nav li.inactive {opacity:0.5; pointer-events:none; cursor:auto;} @media(max-width:480px){ .accountNavDrawer {position:fixed; width: 200px; left:-200px; top:150px; padding:0px 0px 0px 0; background:#f5f5f5; border:1px solid #eee; box-shadow:0 5px 6px rgba(0,0,0,0.2); border-radius: 0 6px 6px 0; z-index:100;} .accountNavDrawer .switch {display:block; cursor:pointer;} #my_account_nav {z-index:10; position:relative; max-height:70vh; overflow-y:auto; } .accountNavDrawer.open {left:0;} } .loadingData {width:100%; text-align:center; padding-top: 20%; font-size: 20px; font-weight: 300; color:#888;} .loadingData i {font-size: 48px; margin-bottom: 10px;} .myAccountHeader h1 {text-align:left; font-weight: 300; margin-bottom: 20px; color:#333;} #my_account_inject h2, .my_account_inj h2 {font-size: 24px; font-weight: 300; border-bottom:1px solid #eee; padding: 5px 20px; margin-bottom: 20px; color:#444; background:#f5f5f5; border-radius: 30px;} #my_account_inject h2 i, .my_account_inj h2 i {color:#3d71b9} #my_account_inject div>label:first-child, .my_account_inj dev>label:first-child {font-size: 12px; color:#555; padding: 5px 0; display:inline-block;} #my_account_inject p>label:first-child, .my_account_inj p>label:first-child {font-size: 12px; color:#555; padding: 10px 0;} #my_account_inject h3, .my_account_inj h3 {font-size: 17px; padding-bottom:5px; font-weight: 300; border-bottom:1px solid #eee; margin:5px 0 10px 0; color:#444;} #my_account_inject p, .my_account_inj p {font-size: 15px; color:#333; font-weight: 300; margin-bottom: 7px; line-height: 1.5;} #my_account_inject h3 b, .my_account_inj h3 b {display:block; width: 40px; height: 40px; font-size: 28px; margin:5px auto; background:red; color:#fff; border-radius: 100%; padding-top: 2px; margin-bottom:15px;} .textLozenge {background:#eee; color:#333; margin-top: 10px; padding: 4px 16px; border-radius: 20px; display:inline-block;} .addrLists {max-width:640px;} .addrLists h3{ font-size: 16px !important; font-weight: 300; border-bottom: 1px solid #535353; padding: 5px 15px; margin:10px 0 0 0 !important; color: #444; background: #f9f9f9; border-radius: 4px; position:relative;} .addrLists h3>i {color:#3d71b9; padding-right: 5px;} .addrLists .addNew {position:absolute; right: 3px; cursor:pointer; background:#3d71b9; color:#fff; top: 3px; font-size: 14px; padding: 3px 12px; border-radius: 3px;} .addrLists .addNew:hover {background:#000066;} .addrLists ul {background:#f5f5f5; box-shadow:inset 0 5px 4px rgba(0,0,0,0.2);} .addrLists li {padding: 10px 0 9px 0; position:relative; border-bottom:1px solid rgba(0,0,0,0.1); font-size: 12px; color:#555; font-family:Roboto;} .addrLists li span {display:inline-block; padding: 0 10px; min-width: 70px;} .addrLists li:nth-child(2n) {background:rgba(255,255,255,0.2);} .addrLists li .orderUp {position:absolute; right:10px; font-size: 16px; cursor:pointer; top: 14px;} .addrLists li .orderDown {position:absolute; right:40px; font-size: 16px; cursor:pointer; top: 14px;} .addrLists li .itemRemove {position:absolute; right:70px; font-size: 16px; cursor:pointer; top: 14px;} .addrLists li input {min-width: 180px; border:1px solid #ddd; border-radius: 3px; padding: 3px 12px; color:#444; font-size: 13px; margin-bottom:1px;} .addrLists li i:hover {color:#000;} .addrLists li .itemRemove:hover {color:red;} .addrLists ul li:first-child .orderUp {display:none !important;} .addrLists ul li:last-child .orderDown {display:none !important;} .addrLists ul li br {display:none;} @media(max-width:875px){ .addrLists ul li br {display:block;} } @media(max-width:585px){ .addrLists ul li .orderUp {top: 5px;} .addrLists ul li .orderDown {right: 30px; top: 5px;} .addrLists ul li .itemRemove {right: 12px; top: 45px;} } .my_companySocial_wrap li span:first-child {width: 40px !important; min-width: 40px;} .my_companySocial_wrap li span:first-child i {position:absolute; font-size: 20px; top:13px; left: 10px;} .addrLists select {border-color:#ddd;padding:3px 10px; color:#444; border-radius: 3px;} .my_companySocial_wrap li input {width: 250px;} .accountBtn {background:#3d71b9; color:#fff; border:none; text-shadow:0 2px 1px rgba(0,0,0,0.2); box-shadow:inset 5px 0 8px rgba(0,0,0,0.2); padding: 10px 20px; font-size: 16px; border-radius: 20px; border-bottom:1px solid rgba(255,255,255,0.59); border-top:1px solid rgba(0,0,0,0.2);} .accountBtn:hover {background:#000066 !important;} #mn_input_address {padding-left:0 !important;} #mn_new_address {background:#f5f5f5; border:1px solid #ddd; width:70%; border-radius: 16px 0 0 16px; padding: 3px 12px;} #mn_new_address_add {width:30%; background:green; font-size: 12px; padding: 5px; color:#fff; border:0; height: 25px; border-radius: 0 16px 16px 0;} .systemMessage {margin:5px 0; box-shadow:inset 1px 5px 5px rgba(0,0,0,0.2); border:3px solid #ddd; border-radius: 8px; background:#eee; padding: 5px 35px; position:relative;} .systemMessage span {display:block; text-align:left; font-weight: 500;} .systemMessage i {position:absolute; color:#inherit; top: 7px; left: 10px;} .systemMessage i.closeMessage {left:auto; right: 10px; cursor:pointer;} .systemMessage.positive {color:darkgreen; text-shadow:0 1px 1px #fff; background:#3f3; border-color:#3c3;} .systemMessage.warning {color:#fff; text-shadow:0 1px 1px darkorange; background:orange; border-color:darkorange;} .systemMessage.error {color:white; text-shadow:0 1px 1px darkred; background:red; border-color:darkred;} .wrapRight.fa-copy {cursor:pointer !Important; position:relative; z-index:99999; pointer-events:all !important;} .wrapRight.fa-copy:hover {color:#000;} #my_account_inject .onOffSwitch, .my_account_inj .onOffSwitch {display:inline-block; width: 80px; vertical-align:middle; margin:0 5px;} .my_education_wrap .startYear, .my_education_wrap .endYear {width: 65px; padding-left: 5px; padding-right: 5px;} .my_education_wrap .educationName {width:150px !important; min-width: 150px;} .my_education_wrap br,.my_qualification_wrap br,.my_employment_wrap br {display:block !Important;} .my_education_wrap .educationLocation {width:205px; margin-top: 5px;} .my_qualification_wrap .qualifyGrade {width:205px; margin-top: 5px;} .my_images_wrap textarea,.my_downloads_wrap textarea, .my_reviews_wrap textarea, .my_custom_wrap textarea, .my_interests_wrap textarea, .my_hobbies_wrap textarea,.my_employment_wrap textarea {font-size: 12px; font-family:Roboto; font-weight: 400; padding: 5px; border:1px solid #ddd; border-radius: 4px; width: 82%; margin:5px 8px 0 8px; height: 60px;} .my_employment_wrap .employCompany {margin-top: 5px;} .my_images_wrap .profileImage {width: 60px; height:60px; display:inline-block; margin: 6px; vertical-align:top;} .my_images_wrap textarea {width: 71%;} .my_images_wrap br {display:block !important;} .aboutmetext {width:100%; border:1px solid #ccc; border-radius: 0 0 6px 6px; padding: 10px;font-size: 14px; font-family:Roboto; font-weight: 400; color:#333; min-height: 200px;} #templateWrap {background:#f5f5f5; overflow:hidden; white-space:nowrap; position:relative; border-radius: 6px; padding: 10px 20px; margin-bottom: 10px; box-shadow:inset 1px 5px 6px rgba(0,0,0,0.05);} #templateWrap:before,#templateWrap:after {color:#aaa; background:#f5f5f5; padding: 8px; position:absolute; top: 7px; font-family:fontAwesome; } #templateWrap:before {content:"\f104"; left: 2px;} #templateWrap:after {content:"\f105"; right: 2px;} #templateCats {white-space:nowrap; position:relative;} #templateCats li {width: 176px; display:inline-block; font-size: 15px; margin:0 5px; padding: 6px;background:#2f5bab; color:#fff; border-radius: 12px; text-align:center;} #templateList { position:relative;} #templateView { position:relative;} #templateView li {position:relative; width: 250px; display:inline-block; margin: 10px 10px 10px 0; height: 220px; background:#fafafa; border:1px solid #eee; border-radius: 4px; box-shadow:0 0 2px rgba(0,0,0,0.1); text-align:center;} #templateView li h3 {position:absolute; margin:0 !important; border-top:1px solid rgba(0,0,0,0.05); background:#f1f1f1; height: 30px; bottom:0px; width:100%; font-size: 14px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight: 500; padding: 5px; text-align:center;} #templateView li span {width: 240px; height:175px; position:absolute; top: 5px; left: 5px; background-size:contain; background-repeat:no-repeat; background-position:50%;} #templateView li span.tBack {opacity:0;} #templateView li span.tFront:after {position:absolute; right:0; bottom:-5px; content:"*Front"; font-size: 10px; color:#aaa;} #templateView li span.tBack:after {position:absolute; right:0; bottom:-5px; content:"*Back"; font-size: 10px; color:#aaa;} #templateView li:hover span.tFront {opacity:0;} #templateView li:hover span.tBack {opacity:1;} #templateView li:hover h3 {background:#2f5bab; color:#fff;} #templateView li input {postion:relative; font-size: 12px; width: 120px; border:0; color:#fff; border-radius: 6px; padding: 4px 0 2px 0; ; margin-right: 5px;} #templateView li input:first-child {background:green;} #templateView li input:last-child {background:orange;} /*SWITCH STATE*/ .onOffSwitch { position: relative; -webkit-user-select:none; -moz-user-select:none; -ms-user-select: none; } .onOffSwitch-checkbox { display: none; } .onOffSwitch-label { display: block; overflow: hidden; cursor: pointer; float: none !important; border: 2px solid #999999; border-radius: 20px; padding-top: 0px !important; } .onOffSwitch-inner { display: block; width: 200%; margin-left: -100%; transition: margin 0.3s ease-in 0s; } .onOffSwitch-inner:before, .onOffSwitch-inner:after { display: block; float: left; width: 50%; height: 18px; padding: 0; line-height: 18px; font-size: 12px; color: white; font-family: Trebuchet, Arial, sans-serif; font-weight: bold; box-sizing: border-box; } .onOffSwitch-inner:before { content: attr(data-onVal); padding-left: 10px; background-color: #0099FF; color: #FFFFFF; } .onOffSwitch-inner:after { content: attr(data-offVal); padding-right: 10px; background-color: #EEEEEE; color: #999999; text-align: right; } .onOffSwitch-switch { display: block; width: 18px; margin: -1.5px; background: #FFFFFF; position: absolute; top: 0; bottom: 0; right: 50px; border: 2px solid #999999; border-radius: 20px; transition: all 0.3s ease-in 0s; } .onOffSwitch-checkbox:checked + .onOffSwitch-label .onOffSwitch-inner { margin-left: 0; } .onOffSwitch-checkbox:checked + .onOffSwitch-label .onOffSwitch-switch { right: 0px; } .sectionSwitch {float:right; margin-right:-10px;} #templateData label {display:inline-block; width: 150px; color:purple;} #templateData li {position:relative; margin-top: 30px;font-size: 12px;display:block; border-bottom:1px solid #ddd; padding: 0 10px; background:#f5f5f5; border-radius: 6px; margin-bottom: 5px; } #templateData li h6 {position:absolute; left: 0px; top:-24px; height: 24px; background:#999; color:#fff; padding: 5px 15px; border-radius:6px 6px 0 0;} #templateData li label {position:relative;display:block;height: 34px;background:#ddd;width:auto;padding: 10px 10px;margin: 2px -10px;color:#333;} #templateData li label input {width:100%; padding: 5px 10px; border:1px solid #ddd; color:#333;} #templateData li label .temp_fontcolor {width: 150px !important; position:absolute; left: 100px; top: 3px;} #templateData li input[type="number"] {width: 60px !important; position:absolute; left: 100px; top: 3px;} #templateData li label b {position:absolute; font-weight: normal; left:165px; top: 9px;} #templateData li textarea {width: 104%; height: 70px; padding: 5px 10px;margin:0 -8px;border:1px solid #ddd;color:#333;} #templateData .tFront, #templateData .tBack { padding-top: 67%; display: block; background-size: contain; background-repeat: no-repeat; margin: 10px 0; } #templateData input[type="file"] {font-size: 12px; position:absolute; right: 0; bottom: 0; padding: 6px; background:#ddd; border-radius: 6px 0 0 0;} .restoreHistory, .subHistory, .affLog {width:100%; margin-bottom:30px;} .restoreHistory thead, .subHistory thead, .affLog thead { font-size: 12px;} .restoreHistory thead tr, .subHistory thead tr, .affLog thead tr {background:#d6d6d6;} .restoreHistory thead th, .subHistory thead th, .affLog thead th {padding: 5px; border-bottom:1px solid #eee; border-right:1px solid rgba(0,0,0,0.1);} .restoreHistory tr, .subHistory tr, .affLog tr {background:#f5f5f5;} .restoreHistory tr:nth-child(2n), .subHistory tr:nth-child(2n), .affLog tr:nth-child(2n) {background:#f9f9f9;} .restoreHistory td, .subHistory td, .affLog td {text-align:center; padding: 5px 10px; font-size: 13px; border-right: 1px solid rgba(0,0,0,0.1)} .restoreHistory tr td:nth-of-type(5) {padding:1px; width: 160px; text-align:center;} .restoreHistory tr td:nth-of-type(1) {text-align:left;} .createForm label {font-size: 12px; padding-right: 10px !important;} .createForm input {padding: 4px 10px; border:1px solid #ccc; margin-right: 10px; color:#444; border-radius: 4px;} #addFormTypeOptions {background:#0099FF; -webkit-appearance:none; color:#fff; border-radius: 6px; padding: 3px 12px; top: 0px; position:relative;} #progress-wrp {border: 1px solid #0099FF;padding: 1px;position: relative;height: 22px;border-radius: 3px;margin: 10px 10px 0 10px;text-align: left;background: #fff;box-shadow: inset 1px 3px 6px rgba(0, 0, 0, 0.12);} #progress-wrp .progress-bar {height: 100%;border-radius: 3px;background-color: #35ff28;width: 0;box-shadow: inset 1px 1px 10px rgba(0, 0, 0, 0.11);} #progress-wrp .status {top: 3px;left: 50%;position: absolute;display: inline-block;color: #000000;} .downloadFile {max-width: 242px; background:#f9f9f9 !important; width: 100%; margin-left: 5px; font-size: 12px !important; padding:1px !important;} .profileLayoutAdmin h3 {margin-top: 10px !important; font-weight: 400 !important;} #layoutCardBack,#layoutCardFront {border:5px solid #ddd; background:#f9f9f9; border-radius: 12px; padding: 5px;} .profileLayoutAdmin select {width:100%;max-width:340px;height: 26px;font-size: 16px;color:#444;margin: 3px 0px;} #layoutCardBack h3,#layoutCardFront h3 {padding-left:10px;} #layoutCardFront img, #layoutCardBack img {max-width: 90%; width: 90%; box-shadow:0 0 5px 6px rgba(0,0,0,0.05); margin: 10px 5%; } #layoutSocial li.social_group {display:block; font-weight: 300; font-size: 18px; border-bottom:1px solid #eee; margin:10px 0;} #layoutSocial li.social_item {cursor:pointer; color:#444; transition:all 0.3s ease-in-out; display:inline-block; width: 50px; height: 50px; margin-right: 10px; background:#eee; border-radius: 10px; border:1px solid rgba(0,0,0,0.2); text-align:center; font-size: 32px; padding-top: 5px;} #layoutSocial {margin-bottom: 25px;} #layoutSocial li.social_item.selected {background:#0099ff; color:#ffff; box-shadow:0 0 4px rgba(0,0,0,0.1);} #layoutWebsites li.web_group {display:block; font-weight: 300; font-size: 18px; border-bottom:1px solid #eee; margin:10px 0;} #layoutWebsites li.website_item {cursor:pointer; color:#444; transition:all 0.3s ease-in-out; display:inline-block;height: 32px; margin-right: 10px; background:#eee; border-radius: 10px; border:1px solid rgba(0,0,0,0.2); text-align:center; font-size: 16px; padding: 5px 15px;} #layoutWebsites li.website_item.selected {background:#0099ff; color:#ffff; box-shadow:0 0 4px rgba(0,0,0,0.1);} .corpEditBox {border:1px solid #ddd; position:relative; margin-bottom: 10px; padding: 5px 5px 5px 10px; background:#fafafa; min-height: 200px; border-radius:6px; } .corpEditBox textarea {padding: 10px; font-size: 14px; font-family:Roboto;width:100%; border:1px solid #ddd; height:140px; border-radius: 6px;} .corpEditBox input[type="file"] {background:#eee; padding: 5px; border-radius: 6px; position:absolute; left:5px; bottom:5px; right: 5px; width:100%; max-width: 95%; } .corpEditBox img {max-height: 80px; display:block; max-width: 80%; margin: 10px auto;} .corpDetails label {display:inline-block; width: 120px; padding: 5px 0 !important;} .corpDetails p {font-size: 14px; margin:0px; padding:0;} .corpEditBox p {font-size: 13px; text-align:justify;} .corporateIntro input[type="button"] {background:#0099ff; border:0; padding: 5px 15px; color:#fff; border-radius: 20px; margin: 5px 0;} #staffOptions li {display:inline-block; width: 240px; padding: 5px 0; border-bottom:1px solid #eee;} #staffOptions li label {display:inline-block; width: 100px; font-size: 12px; font-weight: 400; color:#333; font-weight: 400; } #staffOptions li div {margin-top: 4px;} #status {position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(255,255,255,0.9); z-index:999999; text-align:center;} #statusBox {box-shadow:0 0 20px rgba(0,0,0,0.2);min-width:300px; max-width: 640px; margin:05% auto; padding: 0px; border:1px solid #333; background:#444; font-family:Roboto; color:#fff;} #statusBox h2 {background:green; color:#fff; font-size: 24px; padding: 10px 0;} #statusBox h3 {background:red; font-weight:bold; font-size: 20px; padding: 15px 0;} #statusBox h4 {padding: 10px;} #statusBox h4 span {display:inline-block; font-weight: bold; } #statusBox h4 span.pending {padding: 5px 10px; background:orange; font-weight:bold; border-radius: 20px; margin: 0 5px;} #statusBox h4 span.processing {padding: 5px 10px; background:#3d71ba; font-weight:bold; border-radius: 20px; margin: 0 5px;} #statusBox h4 span.completed {padding: 5px 10px; background:green; font-weight:bold; border-radius: 20px; margin: 0 5px;} #statusBox h4 span.failed {padding: 5px 10px; background:black; font-weight:bold; border-radius: 20px; margin: 0 5px;} .paymentStrip {background:#f5f5f5; padding: 20px 0; border:1px solid #ddd; border-left:none; border-right: none;} .paymentStrip h2 {font-size: 20px; color:#333; margin-bottom: 10px; height: 50px;} .paymentStrip p {font-size: 16px; color:#444; line-height: 1.5; margin-bottom: 10px;} .paymentStrip h3 {font-weight: 600; font-size: 24px;} .paymentStrip input {font-size: 18px; padding: 5px 10px; margin-right: 6px; border-radius: 6px; border:1px solid #ccc; margin-bottom: 10px;} .paymentStrip input[type="button"] {background-color:#3d72ba; color:#fff; padding: 5px 15px;} .paymentStrip .col-xs-12:nth-of-type(2) {background:#eee; padding: 15px; border-radius: 4px; box-shadow:0 0 3px rgba(0,0,0,0.1); border:1px solid #ccc;} .paymentStrip .col-xs-12:nth-of-type(2) h2 {color:#3d72ba; font-weight: bold; font-size: 22px; text-align:center; border-bottom:1px solid #ddd; margin-bottom: 15px;} @media(max-width:640px){ .desktopOnly {display:none;}} @media(min-width:641px){ .mobileOnly {display:none;}} .accBox {background:#f5f5f5; padding: 20px; border-radius:20px; border:1px solid #ddd; box-shadow:0 0 20px rgba(0,0,0,0.1); margin:50px 0;} .accBox i.fa-3x {color:#09f;} .accBox a {display:inline-block; transform:scale(1); padding: 5px 10px; background:#09f; border-radius: 6px; color:#fff; font-weight: bold;} .accBox a:hover {background:#000; transform:scale(1.1);} .tutorials nav li {cursor:pointer; background:#eee; padding: 5px 15px; border-radius: 20px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;} .tutorials nav li:hover {background:#09f; color:#fff;} .tutorialBox {border:1px solid #ddd; margin-bottom: 15px; border-radius: 6px; box-shadow:0 0 20px rgba(0,0,0,0.1); padding: 10px 0} .tutorialBox h3 {color:#09f; font-weight: 300;} .tutorialBox p {font-size:14px; color:#333;} #tutorialSearch {font-size: 20px; padding: 5px 20px; border-radius: 20px; border:1px solid #ddd; min-width: 240px; max-width: 480px; width:100%; margin-right: 10px;} #resetSearch {font-size: 16px; color:#444; background:#fff; padding: 7px 20px; border-radius: 20px; border:1px solid #ddd;} #pricingPlan {background:#f5f5f5; padding: 5px 10px; border-radius: 6px; border:1px solid #ddd;} #pricingPlan p {font-weight: 600; margin-bottom: 10px;} #pricingPlan li {margin:0px -10px; padding: 5px 15px; background:#fdfdfd; border-bottom:1px solid #f5f5f5 } #pricingPlan li:nth-child(2n) {background:#fff;} #pricingPlan li span {display:inline-block; font-size: 16px; font-weight: 300;} #pricingPlan li span:nth-of-type(1) {Width: 60%;} #pricingPlan li span:nth-of-type(2) {Width: 40%; text-align:right; font-weight: bold; font-size: 20px;} #pricingPlan li sup {font-weight: bold; font-size: 70%; display:inline-block; vertical-align:top;} #pricingPlan li sub {font-weight: 400; padding-left: 5px; font-size: 60%; display:inline-block; vertical-align:bottom;} #corpPrice {text-align:center; padding: 10px;} #corpPrice h3, #corpPrice h3 sup {font-weight: bold; color: #3d71b9; font-size: 24px !important;} #corpPrice h3 sup {font-size: 70%; vertical-align:top; } #corpPrice p {font-size: 18px; font-weight: bold; text-align:center; } .corpEditBox #pricingPlan li span {font-size: 14px; line-height:0.6;} .groupListItem {border-bottom:1px solid #ddd; padding:3px 0 7px 0;} .groupListItem label {font-size: 11px !important; display:inline-block; padding:0 5px 0 0 !important;} .groupListItem span {font-size: 14px; display:inline-block; font-weight: 600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; height: 18px; vertical-align:middle; padding-right: 10px;} .groupListItem span:nth-of-type(1) {width: 270px;} .groupListItem a {background:#3771b9; color:#fff; font-weight:bold; font-size: 11px; padding: 4px 12px; border-radius: 4px;} .groupListItem span:nth-of-type(3) {width: 80px;} .groupListItem a:hover {background:#222;} #pricingPlan li.annual {display:none;} /*force system to show monthly first due to corp */ #pricingPlan b {cursor:pointer; color:#09f;} #pricingPlan b.highlighted {cursor:pointer; color:#09f; text-decoration:underline;} /*SQUARED*/ #squPaysub {text-align:center; margin:-10px 0 0 0; max-width:480px;} #squPaysub ul {font-size:0; padding:0; margin:0; overflow:hidden; border:2px solid #ccc; display:inline-block; border-radius:30px; box-shadow:0 5px 10px rgba(0,0,0,0.2);} #squPaysub ul li {cursor:pointer; margin:-1px; font-size: 20px; color:#666; padding: 8px 20px; display:inline-block; background:#fff; border:1px solid #ddd; box-shadow:inset 0 5px 6px rgba(0,0,0,0.1);} #squPaysub ul li.selected {background:#09f; color:#fff; text-shadow:1px 1px 1px rgba(0,0,0,0.4);} .sqTable {width:100%; background:#f5f5f5; margin:0 0 20px 0;} .sqTable thead {background:#e2f2f2;} .sqTable th {font-size: 11px; font-weight: 600; padding: 6px 2px; text-align:center; border-right:1px solid #ddd; border-bottom:1px solid #ddd;} .sqTable tr th:last-child {border-right:none} .sqTable tr td:last-child {border-right:none} .sqTable tbody tr:nth-child(2n+1) {background:#f9f9f9;} .sqTable td {font-size: 12px; padding: 6px 2px 2px 2px; text-align:center; border-right:1px solid #ddd; border-bottom:1px solid #ddd;} #squPay .inputWrap, #expireSQ .inputWrap {width:100% !important; max-width: 480px !important;} #squPay .inputWrap input, #expireSQ .inputWrap input {width:100% !important; max-width: 480px !important;} #squPay .inputWrap select, #expireSQ .inputWrap select {width:100% !important; max-width: 480px !important;} #squPay h2, #expireSQ h2 {margin:10px 0 0 0; font-weight: 300; } #squPay, #expireSQ {border:1px solid #ddd; background:#fff; margin:10px 0; border-radius: 10px; padding: 10px 15px;} #billingSubmit {width:100%; max-width:480px; padding: 10px 0; margin-top: 10px;} #squPay .forms>label, #expireSQ .forms>label {font-weight: 300; margin-bottom: 10px; display:block;} @media(max-width:480px){ #simple_card_1 h1 {font-size: 28px !important;} #simple_card_1 h2 {font-size: 24px; text-align:center;} .validate h3 {font-size: 18px; text-align:center;} #simple_card_1 h2 span {display:block; margin-bottom: 15px !important; max-width:50%; margin:0px auto;} .card_step_6_t {font-size: 20px !important;} .card_step_7 {font-size: 20px !important;} .simp_social li span {text-align:left !important;} .simp_social li input {margin-left: 40px;} #statusBox {margin-top:30%;} #statusBox h2 {font-size: 18px;} #statusBox h3 {font-size: 18px; position:relative; padding: 10px 60px;} #statusBox h3 i {position:absolute; top:6px; } #statusBox h3 i:first-child {left:0px;} #statusBox h3 i:last-child {right:0px;} #statusBox h4 span.pending {margin-bottom:8px;} } .switchTerm {border-top:1px solid #ddd; padding-top: 10px;} .switchTerm input {float:right; margin-top:-25px; cursor:pointer; width: 200px; box-shadow:5px 5px 20px rgba(0,0,0,0.1); text-align:center; border:1px solid #000; background:#333; color:#fff; border-radius: 10px;} .switchTerm input:hover {background:red; border-color:darkred;} .createSandbox, .editSandbox {padding: 5px 10px; box-shadow:0 0 20px rgba(0,0,0,0.2); border-radius: 10px; background:#112;} .createSandbox h2, .editSandbox h2 {text-align:center; font-weight:bold; margin-top: 5px; } .createSandbox label, .editSandbox label {display:inline-block; width: 110px; color:#fff; color:#fff; font-size: 12px;} .createSandbox select {width: calc(100% - 120px); height: 27px; padding: 5px; margin-bottom: 8px;} .createSandbox input[type="text"], .editSandbox input[type="text"] {width: calc(100% - 120px); border:1px solid #888; height: 27px; padding: 9px; margin-bottom: 8px;} .createSandbox input[type="button"], .editSandbox input[type="button"] {width: calc(100% - 120px); border:none; margin-left: 110px; background:#09f; color:#fff; padding: 2px; border-radius: 4px; font-size: 18px; font-weight:bold; margin-bottom:5px;}