/* HTML5 Elements Styles For Non-Support Browsers */
address,
article,
aside,
canvas,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
menu,
nav,
section,
summary {
display: block;
}
/* ************************ */
/* CSS Limited Reset */
html,
body,
div,
section,
article,
aside,
header,
hgroup,
footer,
nav,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
address,
time,
span,
em,
strong,
img,
ol,
ul,
li,
figure,
canvas,
video,
th,
td,
tr {
margin: 0;
padding: 0;
border: 0;
vertical-align: baseline;
/*font: inherit;*/
}
ol,
ul {
list-style-type: none;
}
/* ************************ */
/* Font Face */
@font-face {
font-family: "FolksLightRegular";
src: url("/Fonts/Folks-Light-webfont.eot");
src:
url("/Fonts/Folks-Light-webfont.eot?#iefix") format("embedded-opentype"),
url("/Fonts/Folks-Light-webfont.woff") format("woff"),
url("/Fonts/Folks-Light-webfont.ttf") format("truetype"),
url("/Fonts/Folks-Light-webfont.svg#FolksLightRegular") format("svg");
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: "FolksRegular";
src: url("/Fonts/Folks-Normal-webfont.eot");
src:
url("/Fonts/Folks-Normal-webfont.eot?#iefix") format("embedded-opentype"),
url("/Fonts/Folks-Normal-webfont.woff") format("woff"),
url("/Fonts/Folks-Normal-webfont.ttf") format("truetype"),
url("/Fonts/Folks-Normal-webfont.svg#FolksRegular") format("svg");
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: "FolksBold";
src: url("/Fonts/Folks-Bold-webfont.eot");
src:
url("/Fonts/Folks-Bold-webfont.eot?#iefix") format("embedded-opentype"),
url("/Fonts/Folks-Bold-webfont.woff") format("woff"),
url("/Fonts/Folks-Bold-webfont.ttf") format("truetype"),
url("/Fonts/Folks-Bold-webfont.svg#FolksBold") format("svg");
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: "FolksHeavyRegular";
src: url("/Fonts/Folks-Heavy-webfont.eot");
src:
url("/Fonts/Folks-Heavy-webfont.eot?#iefix") format("embedded-opentype"),
url("/Fonts/Folks-Heavy-webfont.woff") format("woff"),
url("/Fonts/Folks-Heavy-webfont.ttf") format("truetype"),
url("/Fonts/Folks-Heavy-webfont.svg#FolksHeavyRegular") format("svg");
font-weight: normal;
font-style: normal;
}
/* ************************ */
/* Color Theme */
/*
Base color: HEX(), RGB()
Accent color 1 Dark Blue: HEX(#163587), RGB(0, 51, 153)
Accent color 2 Lt Blue: HEX(#336699), RGB(51, 102, 153)
Accent color 3 Red: HEX(#cc0033), RGB(204, 0 ,51)
Accent color 4 Lt Grey: HEX(#ededee), RGB(237, 237, 238)
*/
/* ************************ */
/***** Global Layout *****/
body {
font-family: Georgia, "Times New Roman", "Trebuchet MS", Serif;
background: #cdcdcd;
-webkit-font-smoothing: subpixel-antialiased;
-webkit-font-smoothing: antialiased;
text-rendering: optimizeLegibility;
}
#wrapper {
margin: 0 auto;
padding-bottom: 60px;
width: 1080px;
background: #cdcdcd url(/Images/Background.jpg) no-repeat 50% top;
}
.horizontalList li {
display: inline;
}
.hide {
display: none;
}
p.finePrint {
font-family: Tahoma, Arial, Sans-Serif;
font-size: 11px !important;
line-height: 14px !important;
color: #666 !important;
}
/**************************/
/***** Header *****/
#pageHeader {
text-align: center;
}
#masthead {
margin: 0 auto;
width: 940px;
}
#logo {
float: left;
padding: 13px 10px 14px 5px;
}
#searchField {
float: right;
margin: 0;
height: 50px;
padding: 20px 0 0 150px;
}
#searchField span {
font-family: Tahoma, Arial, Sans-Serif;
font-size: 14px;
}
#quickLinks {
margin: 0;
padding: 5px 4px 5px 4px;
font-family: Tahoma, Arial, Sans-Serif;
font-size: 11px;
border: 1px solid #333;
}
#quickLinks option {
margin: 5px 0;
}
.searchFieldTextbox {
margin: 0;
padding: 6px;
width: 200px;
font-family: Tahoma, Arial, Sans-Serif;
font-size: 11px;
border: 1px solid #333;
}
.searchButton {
/*float:right;*/
position: relative;
right: 0;
top: 9px;
*top: 4px;
_top: 4px;
}
#headerNav {
position: relative;
margin: 0 auto;
padding: 0;
width: 940px;
-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
-moz-border-top-left-radius: 5px;
-moz-border-top-right-radius: 5px;
border-radius: 5px 5px 0 0;
behavior: url(/Css/PIE.htc);
background: #163587;
}
#headerNav ul {
padding: 15px 0 15px 0px;
}
#headerNav ul li {
font-family: FolksLightRegular, Arial, Sans-Serif;
font-size: 17px;
}
#headerNav ul li a {
/*padding:6px 12px;*/
text-decoration: none;
}
#headerNav ul li a:link,
#headerNav ul li a:visited {
color: #fff;
}
#headerNav ul li a:hover {
color: #fff;
}
.selected {
position: relative;
display: inline-block;
padding: 6px 9px;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
behavior: url(/Css/PIE.htc);
background: #336699;
color: #fff;
}
.notSelected {
position: relative;
display: inline-block;
padding: 6px 9px;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
behavior: url(/Css/PIE.htc);
}
/*********************************/
/* Left Nav */
#pageLeftNav {
float: left;
padding: 0;
width: 220px;
background: #fff;
}
#leftNav {
/*height:360px;*/
}
#leftNav ul {
margin: 0;
padding: 10px 0 20px 0;
list-style-type: none;
}
#leftNav li {
font-family: Tahoma, FolksRegular, Arial, Sans-Serif;
font-weight: normal;
font-size: 12px;
margin: 2px 0;
padding-top: 17px;
padding-bottom: 17px;
background-image: url(/Images/Left-Nav-Background.gif);
background-repeat: no-repeat;
background-position: left -100px;
}
#leftNav li a {
text-decoration: none;
padding: 8px;
}
#leftNav li a:link,
#leftNav li a:visited {
color: #333;
}
#leftNav li a:hover {
color: #333;
}
.leftNavSelected {
color: #fff;
padding: 17px 0 17px 8px;
background: url(/Images/Left-Nav-Background.gif);
background-repeat: no-repeat;
background-position: left 0px !important;
}
/*********************************/
/***** Body *****/
#pageBody {
margin: 0 auto;
width: 940px;
background: #fff;
}
#pageContent {
float: right;
width: 675px;
padding: 0 0 0 32px; /* padding:0 8px 0 32px; */
}
#pageContent article {
background-repeat: no-repeat;
background-position: right top;
}
#pageContent article p {
padding-right: 20px !important;
line-height: 19px;
}
#pageContent section {
position: relative;
margin-bottom: 20px;
margin-right: 8px;
padding: 10px 20px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#ededed), to(#fff));
background: -webkit-linear-gradient(top, #ededed, #fff);
background: -moz-linear-gradient(top, #ededed, #fff);
background: -ms-linear-gradient(top, #ededed, #fff);
background: -o-linear-gradient(top, #ededed, #fff);
-pie-background: linear-gradient(#ededed, #fff);
behavior: url(/Css/PIE.htc);
/*background:#ededee; */
}
#pageContent section article {
padding-top: 10px;
border-top: 1px solid #ccc;
}
#pageContent section article:first-child {
border-top: none;
}
#pageContent article:first-child {
}
.pageTitle {
margin: 0 0 0 -2px;
padding-top: 225px;
font-family: FolksRegular, Tahoma, Arial, Sans-Serif;
font-weight: normal;
font-size: 32px;
letter-spacing: -1px;
color: #cc0033;
}
.articleTitle {
margin: 0 0 0 -2px;
padding-top: 10px;
font-family: FolksRegular, Tahoma, Arial, Sans-Serif;
font-weight: normal;
font-size: 32px;
letter-spacing: -1px;
color: #cc0033;
}
#pageBody article p {
margin: 10px 0;
/*padding:0;*/
font-weight: normal;
font-size: 14px;
color: #333;
}
.divider {
padding: 2px 0 8px 0;
height: 2px;
background: url(/Images/Divider.gif) repeat-x left top;
border: none;
outline: none;
}
/* Document List */
.documentList {
padding: 0 0 15px 0;
}
.documentList h2 {
font-size: 16px;
padding: 0 0 10px 0;
}
.documentList aside {
position: relative;
margin: 3px 15px 0 0;
padding: 0;
width: 228px;
height: 128px;
float: left;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
behavior: url(/Css/PIE.htc);
border: 1px solid #ccc;
background: #fff;
}
.documentList dl {
margin: 0;
padding: 0;
float: left;
width: 380px;
}
.documentList dl dt {
padding-bottom: 5px;
/*font-family: FolksRegular, Arial, Sans-Serif;*/
font-family: Georgia, "Times New Roman", Serif;
font-size: 24px;
letter-spacing: -1px;
color: #333;
}
.documentList dl dt a {
padding: 0 12px 0 0;
text-decoration: none;
background: url(/Images/Document-Link-Arrow.png) no-repeat right 9px;
}
.documentList dl dt a:link,
.documentList dl dt a:visited {
color: #163587;
}
.documentList dl dt a:hover {
color: #cc0033;
}
.documentList dl dt sup {
font-size: 12px;
}
.documentList dl dd {
margin: 0;
padding: 0 0 5px 0;
font-size: 14px;
}
.documentList dl dd ul {
list-style-type: none;
margin-left: 10px;
font-size: 14px;
}
.documentList dl dd ul li {
padding: 4px 0;
}
.documentList dl dd ul li a:first-child {
padding: 0 8px 0 0;
text-decoration: none;
background: url(/Images/Button-Arrow-Blue.gif) no-repeat right 6px;
}
.documentList dl dd ul li a:link,
.documentList dl dd ul li a:visited {
color: #163587;
}
.documentList dl dd ul li a:hover {
color: #cc0033;
}
.exiting-cpchem .documentList dd ul li {
padding: 4px 0 12px 0;
}
.exiting-cpchem .documentList dd ul li a:first-child {
display: inline-block;
line-height: 2.4;
font-size: 1.2em;
color: #163587 !important;
background: url(/Images/Button-Arrow-Blue.gif) no-repeat right 17px;
}
.exiting-cpchem .documentList .sec-title {
line-height: 2.4;
font-size: 1.2em;
}
.contentBullet {
margin-left: 20px;
font-size: 14px;
list-style-type: disc;
color: #333;
}
.contentBullet li {
padding: 4px 0;
}
/***** Home Page Only *****/
#pageHomeBody {
margin: 0 auto;
padding: 0;
width: 940px;
background-color: #fff;
}
#pageHomeBody article {
padding: 0 10px 10px 20px;
}
.boxWrapper {
margin: 23px auto;
padding-left: 38px;
}
.blueGradientBox,
.redGradientBox {
position: relative;
margin: 0;
padding: 15px 15px 0 15px !important;
float: left;
margin-right: 25px;
width: 240px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
behavior: url(/Css/PIE.htc);
}
.blueGradientBox {
height: 330px;
background: #163587;
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#163587), to(#3366fe));
background: -webkit-linear-gradient(top, #163587, #3366fe);
background: -moz-linear-gradient(top, #163587, #3366fe);
background: -ms-linear-gradient(top, #163587, #3366fe);
background: -o-linear-gradient(top, #163587, #3366fe);
-pie-background: linear-gradient(#163587, #3366fe);
behavior: url(/Css/PIE.htc);
}
.redGradientBox {
height: 150px;
background: #cc3300;
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#cc3300), to(#e64140));
background: -webkit-linear-gradient(top, #cc3300, #e64140);
background: -moz-linear-gradient(top, #cc3300, #e64140);
background: -ms-linear-gradient(top, #cc3300, #e64140);
background: -o-linear-gradient(top, #cc3300, #e64140);
-pie-background: linear-gradient(#cc3300, #e64140);
behavior: url(/Css/PIE.htc);
}
.blueGradientBox header h2 {
margin: 10px 0 0 0;
}
.redGradientBox header h2 {
margin: 0;
}
.redGradientBox header h2,
.blueGradientBox header h2 {
padding: 0 0 10px 0;
font-family: FolksLightRegular, Arial, Sans-Serif;
font-size: 20px;
font-weight: normal;
color: #fff;
text-align: left;
letter-spacing: -1px;
}
.redGradientBox p,
.blueGradientBox p {
font-family: Georgia, "Times New Roman", Serif;
/*font-family: Tahoma, FolksLightRegular, Arial, Sans-Serif;*/
font-size: 12px !important;
font-weight: normal;
color: #fff;
text-align: left;
}
.redGradientBox p a,
.blueGradientBox p a {
padding-left: 130px;
font-size: 11px;
color: #fff;
text-align: right;
}
.button {
position: absolute;
bottom: 12px;
left: 180px;
z-index: 100;
margin: 0;
padding: 6px 0 6px 6px;
width: 70px;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
behavior: url(/Css/PIE.htc);
background: #ededed;
}
.button a {
padding: 0 6px 0 0;
font-family: Tahoma, FolksLightRegular, Arial, Sans-Serif;
font-size: 11px;
text-decoration: none;
color: #333;
background: url(/Images/Button-Arrow.gif) no-repeat right 4px;
}
.roundedButton {
margin: 5px 0;
padding: 6px;
/*width:70px;*/
display: inline-block;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
behavior: url(/Css/PIE.htc);
background: #163587;
}
.matrixTitle {
font-family: Georgia, "Times New Roman", Serif;
font-size: 24px !important;
letter-spacing: -1px;
font-weight: normal;
color: #333;
}
/***** Forms *****/
.formLabel {
float: left;
font-size: 14px;
text-align: right;
display: block;
width: 200px;
}
.formSmallDesc {
font-size: 11px !important;
text-align: right;
display: block;
width: 200px;
}
.textField {
float: left;
font-size: 14px;
font-family: Georgia, "Times New Roman", Serif;
padding: 4px 2px;
width: 200px;
margin: 4px 10px 20px 10px;
}
/***** Callouts *****/
#pageCallouts {
float: left;
margin: 0;
padding: 100px 0 0 0;
width: 165px;
}
.callout {
position: relative;
/*top:100px;*/
margin: 0 0 10px 8px;
width: 180px;
padding: 15px;
background: #ededed;
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#ededed), to(#fff));
background: -webkit-linear-gradient(top, #ededed, #fff);
background: -moz-linear-gradient(top, #ededed, #fff);
background: -ms-linear-gradient(top, #ededed, #fff);
background: -o-linear-gradient(top, #ededed, #fff);
-pie-background: linear-gradient(#ededed, #fff);
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
behavior: url(/Css/PIE.htc);
border: 1px solid #ccc;
}
h6.calloutTitle {
margin: 0;
padding: 0;
text-align: center;
color: #163587;
font-family: FolksLightRegular, Tahoma, Arial, Sans-Serif;
font-size: 20px;
font-weight: normal;
letter-spacing: -1px;
}
.callout p {
color: #333;
font-family: Tahoma, FolksRegular, Arial, Sans-Serif;
font-size: 11px;
}
.callout img {
margin: 10px 0 30px 30px;
}
.calloutButton {
position: absolute;
bottom: 12px;
right: 10px;
z-index: 100;
margin: 0;
padding: 6px 0 6px 6px;
width: 70px;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
behavior: url(/Css/PIE.htc);
background: #163587;
}
.calloutButton a,
.roundedButton a {
padding: 0 6px 0 0;
font-family: Tahoma, FolksLightRegular, Arial, Sans-Serif;
font-size: 11px;
text-decoration: none;
color: #fff;
background: url(/Images/Button-Arrow-White.gif) no-repeat right 4px;
}
.calloutLinkList {
margin: 5px 20px;
padding: 0;
font-size: 11px;
list-style-type: disc;
}
.calloutLinkList li {
padding: 3px 0;
}
.calloutLinkList li a,
.callout p a {
color: #fff;
}
/***** Footer *****/
#pageFooter {
position: relative;
clear: both;
width: 930px;
margin: 0;
padding: 5px;
-webkit-border-bottom-left-radius: 5px;
-webkit-border-bottom-right-radius: 5px;
-moz-border-bottom-left-radius: 5px;
-moz-border-bottom-right-radius: 5px;
border-radius: 0 0 5px 5px;
behavior: url(/Css/PIE.htc);
background: #666;
}
#pageFooter img {
float: left;
}
#pageFooter p {
font-family: Tahoma, Arial, Sans-Serif;
color: #fff;
padding: 5px 0;
font-size: 11px;
text-align: center;
}
#pageFooter p a {
font-size: 11px;
color: #fff;
}
/* ------ Interest Rate -------*/
.InterestRatesBox {
margin: 25px auto;
padding: 0;
width: 500px;
border: solid 1px #e0e1e2;
}
.RatesTitleBox {
margin: 0 auto;
border-bottom: solid 1px #e0e1e2;
width: 500px;
background-color: #163587;
}
.RatesTitle {
margin: 0;
padding: 5px;
text-align: center;
font-size: 14px;
font-family: Tahoma, Arial, Sans-Serif;
color: #333;
letter-spacing: 0;
}
.RatesBox {
margin: 5 auto;
padding: 10px;
font-size: 12px;
font-weight: normal;
color: #333;
float: left;
width: 229px;
letter-spacing: 0;
background-color: #fff;
} /* width:229px*/
.RatesPeriod {
margin: 0 0 0 40px;
padding: 0;
font-size: 12px;
font-family: Tahoma, Arial, Sans-Serif;
font-weight: normal;
color: #333;
list-style-type: disc;
}
.Rates {
margin-top: 10px;
font-size: 14px;
font-weight: bold;
font-family: Tahoma, Arial, Sans-Serif;
color: Green;
display: inline;
text-align: center;
}
.PPARates {
margin: 0;
padding: 0 0 0 20px;
font-size: 14px !important;
font-family: Tahoma, Arial, Sans-Serif;
color: Green !important;
}
/***** Tabular Data *****/
.TabularData {
margin: 20px 0px 20px 0px;
font-family: tahoma, arial, sans-serif;
font-size: 11px;
border-left: solid 1px #ccc;
border-top: solid 1px #ccc;
background-color: #fff;
}
.TabularData tr th {
padding: 5px;
color: #fff;
border-right: solid 1px #ccc;
border-bottom: solid 1px #ccc;
background: #163587;
}
.TabularData tr th a {
text-decoration: none;
}
.TabularData tr th a:link {
color: #fff;
}
.TabularData tr th a:visited {
color: #fff;
}
.TabularData tr th a:hover {
color: #e2801d;
}
.TabularData tr td {
padding: 8px;
border-right: solid 1px #ccc;
border-bottom: solid 1px #ccc;
}
.TabularData tr td a {
text-decoration: none;
}
.TabularData tr td a:link {
color: #336699;
}
.TabularData tr td a:visited {
color: #336699;
}
.TabularData tr td a:hover {
color: #cc0033;
}
.TabularData tr td ul {
margin-left: 25px;
list-style-type: disc;
}
/* Gridview Data */
.TabularDataAdmin {
margin: 0;
padding: 0;
width: 730px;
border-top: solid 1px #999999;
border-left: solid 1px #cccccc;
}
.TabularDataAdmin tr th {
font-weight: bold;
padding: 5px;
border-bottom: solid 1px #cccccc;
border-right: solid 1px #cccccc;
background-color: #163587;
color: #fff;
}
.TabularDataAdmin thead tr th {
border-bottom: solid 2px #163587;
}
.TabularDataAdmin tbody tr:hover {
background-color: #ffff99;
}
.TabularDataAdmin tbody tr td:hover {
background-color: #ffff33;
}
.TabularDataAdmin tr td {
font-size: 11px;
padding: 4px;
border-bottom: solid 1px #cccccc;
border-right: solid 1px #cccccc;
vertical-align: top;
}
.TabularDataAdmin tr th a {
text-decoration: none;
}
.TabularDataAdmin tr th a:link {
color: #fff;
}
.TabularDataAdmin tr th a:visited {
color: #fff;
}
.TabularDataAdmin tr th a:hover {
color: #f9931c;
}
.TabularDataAdmin tr td a {
}
.TabularDataAdmin tr td a:link {
color: #666666;
}
.TabularDataAdmin tr td a:visited {
color: #666666;
}
.TabularDataAdmin tr td a:hover {
color: #f9931c;
}
.TabularDataAdmin tr td input,
.TabularDataAdmin tr td textarea {
font-family: Arial;
font-size: 11px;
padding: 2px;
border: solid 1px #cccccc;
}
.TabularDataAdmin tr td input {
width: 75px;
}
.TabularDataAdmin tr td textarea {
width: 110px;
}
.TabularAlternatingRowStyle {
}
.TabularPager {
width: 730px;
margin: 0 0 0 10px;
padding: 10px 0;
text-align: left;
}
.TabularPager span,
.TabularPager a {
margin: 0;
padding: 3px;
border: solid 1px #cccccc;
background-color: #ffffff;
}
.TabularDataAdmin,
.TabularPager {
font-family: Tahoma, Arial, Sans-Serif;
font-size: 11px;
color: #333333;
}
.TabularDataAdminFooter td table tr:hover {
background-color: transparent;
}
.TabularDataAdminFooter td table tr td {
background-color: transparent !important;
text-align: center;
border: none;
color: #ff3300;
}
.TabularDataAdminFooter td table tr td a {
text-decoration: none;
color: #ffffff;
}
/* Gridview Data */
.contact-table {
width: 100%;
margin: 10px 0px;
border-left: solid 1px #ccc;
border-top: solid 1px #ccc;
background-color: none;
}
.contact-table tr {
border-right: solid 1px #ccc;
border-bottom: solid 1px #ccc;
}
.contact-table th {
background: none !important;
color: #000000 !important;
text-align: left;
font-size: 14px;
font-weight: bold;
}
.contact-table-alter-row {
background-color: #e5f1fc;
}
/* Export Gridview Data */
.ExportView {
display: none;
}
/* Export Gridview Data */
/**** For open layout ****/
#openLayoutArticle {
width: 755px;
margin: 0 auto;
}
#openLayoutArticle p {
margin: 10px 0;
padding: 0;
font-weight: normal;
font-size: 14px;
color: #333;
}
#openLayoutForm {
width: 730px;
margin: 0 auto;
padding: 0 10px 30px 10px;
}
#openLayoutForm span {
font-weight: normal;
font-size: 14px;
color: #333;
}
#openLayoutForm input {
padding: 3px;
font-family: Georgia, "Times New Roman", Serif;
font-weight: normal;
font-size: 14px;
color: #333;
}
.RequiredField {
font-weight: normal;
font-size: 14px;
color: #cc3300;
}
.pulse-update {
animation: pulse 2s infinite;
}
@keyframes pulse {
0% {
background-color: #ffcc00;
}
100% {
background-color: #cc0000;
}
}
/***** Clear Fix *****/
.clearfix:after {
content: ".";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;
}
.clearfix {
display: inline-block;
}
html[xmlns] .clearfix {
display: block;
}
* html .clearfix {
height: 1%;
}
/*** Modal ***/
.modal {
display: none; /* Hidden by default */
position: fixed; /* Stay in place */
z-index: 100; /* Sit on top */
left: 0;
top: 0;
width: 100%; /* Full width */
height: 100%; /* Full height */
overflow: auto; /* Enable scroll if needed */
background-color: rgb(0, 0, 0); /* Fallback color */
background-color: rgba(0, 0, 0, 0.4); /* Black w/ opacity */
}
/* The Close Button */
.close {
margin-bottom: 15px;
color: #aaa;
float: right;
font-size: 28px;
font-weight: bold;
}
.close:hover,
.close:focus {
color: black;
text-decoration: none;
cursor: pointer;
}
/* Modal Header */
.modal-header {
padding: 2px 16px;
/* background-color: #163587; */
color: white;
}
/* Modal Body */
.modal-body {
padding: 2px 16px;
}
/* Modal Footer */
.modal-footer {
padding: 2px 16px;
background-color: #163587;
color: white;
}
/* Modal Content */
.modal-content {
position: relative;
background-color: #fefefe;
margin: 15% auto;
padding: 30px;
border: 1px solid #888;
width: 830px;
box-shadow:
0 4px 8px 0 rgba(0, 0, 0, 0.2),
0 6px 20px 0 rgba(0, 0, 0, 0.19);
animation-name: animatetop;
animation-duration: 0.4s;
}
/* Add Animation */
@keyframes animatetop {
from {
top: -300px;
opacity: 0;
}
to {
top: 0;
opacity: 1;
}
}
/* .video{
cursor: pointer;
} */
/*** End Modal ***/