/* simple reset */
html, body, form, fieldset, legend, h1, h2, h3, h4, h5, h6, p {
margin: 0px;
padding: 0px;
}

fieldset, img {
border: 0;
}

body {
font-family: 'Arbutus Slab', serif;
font-family: 'Roboto Condensed', sans-serif;
background-image: url('/img/bg.jpg');
/*background-repeat: no-repeat;*/
background-position: top;
background-color: #DEDEDC;
}

span#kawai {
display: block;
position: absolute;
width: 122px;
left: 50%;
margin-left: -373px;
margin-top: 8px;
z-index: 10;
}

span#kawai img {
width: 100%;
height: auto;
display: block;
}

a.btn {
text-decoration: none !important;
border: 1px solid black !important;
padding: 5px 20px !important;
/*+border-radius: 2px !important;*/
-moz-border-radius: 2px !important;
-webkit-border-radius: 2px !important;
-khtml-border-radius: 2px !important;
border-radius: 2px !important;
border: 1px solid #933802 !important;
background-color: #923802 !important;
color: #FFFFFF !important;
font-size: 27px !important;
/*+box-shadow: 2px 2px 5px 1px #000000 !important;*/
-moz-box-shadow: 2px 2px 5px 1px #000000 !important;
-webkit-box-shadow: 2px 2px 5px 1px #000000 !important;
box-shadow: 2px 2px 5px 1px #000000 !important;
transition: all ease 400ms !important;
}

a.btn:hover {
background-color: #FFFFFF !important;
color: #923802 !important;
border: 1px solid #FFFFFF !important;
}

a {
text-decoration: none;
}

a#olc {
position: absolute;
top: 44px;
left: 50%;
margin-left: 192px;
color: #FDFA95;
background-color: #556CB2;
padding: 5px 11px;
/*+border-radius: 2px;*/
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
-khtml-border-radius: 2px;
border-radius: 2px;
border: 1px solid #FCF994;
text-transform: uppercase;
font-size: 14px;
letter-spacing: 1px;
width: 237px;
text-align: center;
line-height: 17px;
z-index: 2;
/*display: none;*/
}

a.payBtn {
font-size: 12px;
text-transform: uppercase;
border: 1px solid #933802;
text-decoration: none !important;
display: inline-block;
padding: 1px 11px;
/*+border-radius: 2px;*/
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
-khtml-border-radius: 2px;
border-radius: 2px;
background-color: #FCF8C1;
}

a.payBtn:hover {
background-color: #923802;
color: #FCF8C1 !important;
}

#guide {
background-image: url('/home2b.jpg');
/*background-image: url('/guide.jpg');*/
background-position: top;
height: 1500px;
opacity: 0.20;
position: absolute;
top: 0;
z-index: 1;
width: 100%;
pointer-events: none;
background-repeat: no-repeat;
}

#mainWrap {
background-image: url('/img/head-back.jpg');
background-repeat: repeat-x;
background-position: top;
/*margin-top: 18px;*/
}

#main {
width: 1000px;
margin: 0 auto;
min-height: 830px;
background-repeat: no-repeat;
background-position: top;
}

#topContact {
float: right;
height: 51px;
width: 274px;
position: relative;
right: 43px;
font-family: 'Arbutus Slab', serif;
color: #F9F9F9;
font-size: 16px;
background-image: url('/img/contact-back.jpg');
/*display: none;*/
}

#topContact a.email {
color: #F9F9F9;
position: relative;
top: 16px;
left: 36px;
text-indent: 0px;
width: auto;
background-image: none;
}

#topContact a:first-child {
color: #F9F9F9;
position: relative;
top: 16px;
left: 26px;
text-indent: 0px;
width: auto;
background-image: none;
}

#topContact span {
color: #F9F9F9;
position: relative;
top: 16px;
left: 31px;
}

#slogan {
clear: both;
width: 428px;
height: 38px;
background-image: url('/img/slogan.jpg');
background-position: top;
position: relative;
left: 346px;
top: 17px;
}

#slogan p, #logo h1 {
text-indent: -10000px;
}

#logo {
width: 385px;
height: 326px;
background-image: url('/img/logo.png');
background-position: top;
position: relative;
right: 61px;
bottom: 89px;
float: left;
}

#logo h1, #logo h1 a {
width: 385px;
height: 186px;
display: block;
}

#mobileMenu {
display: none;
}

#navWrap {
float: right;
width: 620px;
height: 29px;
margin: 34px 0 0 -165px;
position: absolute;
left: 50%;
background-image: url('/img/head-line.jpg');
/*right: 40px;*/
background-position: top;
background-repeat: no-repeat;
padding-top: 20px;
}

ul#nav {
margin: 0;
padding: 0;
}

ul#nav li {
display: inline;
float: left;
position: relative;
}

ul#nav li a {
display: block;
color: #333;
font-size: 15px;
padding: 3px 11px;
font-weight: 700;
}

ul#nav li a:hover, ul#nav li.active a {
color: #838383;
}

ul#nav li a:hover {
}

ul#nav li ul {
display: none;
position: absolute;
padding: 0px;
z-index: 100;
/* if slider */
}

#homeModuleWrap {
clear: both;
padding-top: 28px;
}

#homeModule {
margin: 0 auto;
width: 953px;
height: 180px;
background-color: #FBF1E5;
border-left: 0px solid #FBF1E5;
position: relative;
left: -2px;
}

#moduleContent {
/*padding: 19px 26px;*/
width: 657px;
float: left;
color: #4D4D4D;
font-size: 17px;
line-height: 25px;
}

#moduleContent div {
padding: 19px 26px 23px;
}

#event {
float: right;
width: 199px;
padding: 20px 20px 27px 20px;
background-color: #E4E2D6;
}

#event h3 {
color: #405E73;
font-size: 15px;
}

#event p {
color: #5E5D5D;
font-size: 14px;
}

#moduleTabs {
clear: both;
}

#moduleTabs a {
text-align: center;
display: inline-block;
width: 237px;
padding: 10px 0;
font-weight: bold;
color: #A9B4BB;
font-size: 15px;
border-left: 1px solid #385367;
background-image: url('/img/tabs.jpg');
background-position: 0px -42px;
background-repeat: repeat-x;
}

#moduleTabs a:hover, #moduleTabs a.active {
background-position: 0px 0px;
}

#moduleTabs a:first-child {
border-left: 0 none transparent;
}

#moduleTabs a#tab4 {
width: 239px;
}

#ghostButtons {
height: 46px;
background-color: #FBF1E5;
margin: 14px 0 0;
text-align: center;
}

#ghostButtons a {
height: 92px;
position: relative;
z-index: 1;
border: 3px solid #003D6A;
color: #000000;
padding: 5px 15px;
}

#ghostButtons a:hover {
background-color: #003D6A;
color: #FBF1E5;
}

#ghostButtons a:nth-of-type(2) {
margin: 0 0 0 10px;
}

#homeFeaturedWrap {
background-color: #FFFFFF;
width: 970px;
margin: 23px auto -25px;
height: 256px;
border-bottom-right-radius: 15px;
border-bottom-left-radius: 15px;
position: relative;
right: 0px;
}

#homeFeatured {
background-color: #FFFFFF;
width: 950px;
margin: 23px auto 0;
height: 48px;
position: relative;
right: 10px;
}

#homeFeatured h2 {
text-align: center;
font-size: 18px;
color: #575656;
letter-spacing: 1px;
padding: 11px 0 8px;
border-bottom: 1px solid #F6F6F6;
}

#homeFeatured a {
display: inline-block;
float: right;
position: relative;
bottom: 35px;
right: 16px;
background-image: url('/img/arrow.jpg');
background-position: 83px 5px;
background-repeat: no-repeat;
font-size: 13px;
color: #083556;
font-weight: bold;
letter-spacing: 1px;
padding: 5px 25px 5px 20px;
}

#homeFeatured div#vid1 {
clear: both;
}

#homeFeatured div {
float: left;
margin-left: 16px;
margin-top: -24px;
}

#footerWrap {
background-image: url('/img/footer.jpg');
clear: both;
height: 77px;
background-repeat: repeat-x;
background-position: top;
margin-top: 56px;
}

#footer {
margin-left: auto;
margin-right: auto;
width: 960px;
padding: 26px 0 0;
}

#footer span, #footer a {
font-size: 12px;
color: #AFAFAF;
}

#social {
width: 67px;
float: right;
margin: 0px 0 0;
}

#social a {
background-image: url(/img/social.jpg);
background-position: -37px 0px;
background-repeat: no-repeat;
text-indent: -10000px;
height: 30px;
display: inline-block;
width: 29px;
margin: 0px;
}

#social a:hover {
opacity: 0.85;
}

#social a:first-child {
background-position: 0px 0px;
margin-right: 5px;
}

#mainImg {
/*background-image: url('/img/background/home.jpg');*/
background-repeat: repeat-x;
background-position: top;
height: 654px;
position: absolute;
top: 187px;
width: 100%;
z-index: -1;
}

#guide {
display: none;
}

#subWrap {
background-image: url(/img/white-95.png);
clear: both;
position: relative;
top: -117px;
width: 950px;
margin: 0 auto -132px;
min-height: 547px;
}

#sub {
padding: 25px;
}

#subNavWrap {
width: 263px;
position: relative;
right: 30px;
margin: 27px 0 0;
padding: 0 0 35px 0;
background-color: #FFFFFF;
/*+box-shadow: -6px 7px 24px -3px #555555;*/
-moz-box-shadow: -6px 7px 24px -3px #555555;
-webkit-box-shadow: -6px 7px 24px -3px #555555;
box-shadow: -6px 7px 24px -3px #555555;
float: left;
}

#subNav {
/*background-image: url(/img/sub-nav.png);*/
/*background-position: bottom left;*/
/*background-repeat: no-repeat;*/
padding: 23px 0 0 29px;
}

#subNav ul, #subNav ul li {
margin: 0;
padding: 0;
list-style-type: none;
}

#subNav ul li {
}

#subNav ul li a {
font-size: 15px;
color: #5E5D5D;
font-family: 'Arbutus Slab', serif;
padding: 12px 0 10px;
display: inline-block;
border-bottom: 1px solid #E6E5E1;
width: 195px;
}

#subNav ul li.active a, #subNav ul li a:hover {
color: #295B7D;
}

#subContentWrap {
float: right;
/*margin-bottom: -195px;*/
}

#subContent {
width: 635px;
margin: 52px 0 0;
font-size: 15px;
color: #4D4D4D;
margin-bottom: 25px;
font-family: 'Arbutus Slab', serif;
line-height: 22px;
}

#subWrap #subNavMobile {
display: none;
}

#subContent h1 {
font-size: 22px;
font-family: 'Arbutus Slab', serif;
color: #295B7D;
margin-bottom: 27px;
line-height: 34px;
text-transform: uppercase;
letter-spacing: 1px;
}

#subContent h2 {
font-size: 16px;
font-family: 'Arbutus Slab', serif;
color: #666;
margin-bottom: 20px;
line-height: 29px;
text-transform: uppercase;
letter-spacing: 1px;
}

#subContent p {
font-size: 15px;
color: #4D4D4D;
margin-bottom: 25px;
font-family: 'Arbutus Slab', serif;
line-height: 22px;
}

#subContent ul {
margin: 0;
padding: 0 0 0 19px;
}

#subContent ul li {
line-height: 28px;
list-style: square;
}

#subContent a {
color: #933802;
text-decoration: underline;
}

#subContent a.button {
font-family: 'Roboto Condensed', sans-serif;
background-color: #AF6C42;
text-transform: uppercase;
color: #FFFFFF;
padding: 7px 35px;
margin: 0 0 47px 0;
display: inline-block;
}

.employeeWrap {
float: left;
width: 50%;
text-align: center;
margin: 0;
padding: 0 0 30px 0;
}

.employeeWrap a img.employeesImage {
width: auto;
max-height: 250px;
}

.employeeWrap span.employeesName {
display: block;
}

.employeeWrap span.employeesTitle {
display: block;
}

.employeeWrap span.employeesLearnMore a {
font-size: 14px;
/*width: 44%;*/
}

.employeeWrapDetail span.employeesName {
display: block;
}

.employeeWrapDetail span.employeesTitle {
display: block;
margin: 0 0 10px 0;
}

.employeeWrap:nth-of-type(2n+1) {
clear: both;
}

/*CALENDAR*/
table.fullCalendar {
width: 100%;
border-collapse: collapse;
}

table.fullCalendar tr td {
border: 1px solid #D7D7D7;
width: 14.285714%;
height: 70px;
padding: 0;
vertical-align: top;
}

table.fullCalendar tr th {
color: #232323;
font-size: 14px;
padding: 5px;
}

table.fullCalendar #calDisplayMonth {
font-weight: bold;
font-size: 18px;
}

table.fullCalendar #calPrevLink {
padding: 0px 5px;
border-bottom: 0 none transparent;
}

table.fullCalendar #calNextLink {
padding: 0px 5px;
border-bottom: 0 none transparent;
}

table.fullCalendar tr td.noDay {
background-color: #EEEEEE;
}

table.fullCalendar tr td span.calendarDay {
display: inline-block;
border-left: 1px solid #D7D7D7;
border-bottom: 1px solid #D7D7D7;
padding: 1px 4px;
background-color: #EEEEEE;
float: right;
font-size: 12px !important;
border-bottom-left-radius: 2px;
}

table.fullCalendar tr td div.eventData {
display: inline-block;
margin: -12px 0 0;
padding-top: 12px;
}

table.fullCalendar tr td div.eventData a {
display: block;
border-bottom: 0 none transparent !important;
text-decoration: none !important;
background-color: #EEEEEE;
margin-bottom: 5px;
padding: 0px 5px;
font-size: 12px !important;
line-height: 17px !important;
}

table.fullCalendar tr td div.eventData span.eventTitle {
display: inline-block;
font-size: 12px !important;
line-height: 17px !important;
margin-bottom: 0px !important;
padding: 0;
}

table.fullCalendar tr td div.eventData span.eventTime {
display: inline-block;
font-size: 11px !important;
line-height: 17px !important;
margin-bottom: 0px !important;
}

table.smallCalendar {
width: 100%;
border: 1px solid #D7D7D7;
padding: 5px;
margin: 0 0 15px 0;
background-color: #FFFFFF;
}

table.smallCalendar tr:nth-of-type(2) th {
font-weight: normal;
font-size: 14px;
}

table.smallCalendar tr td {
width: 14.285714%;
padding: 0;
text-align: center;
font-size: 14px;
}

table.smallCalendar tr td div.calendarSmallEventDay {
padding: 0 5px;
cursor: pointer;
color: #2F507B;
font-weight: bold;
font-size: 14px !important;
}

table.smallCalendar tr td.eventThisDay {
background-color: #DEDEDE;
}

table.smallCalendar tr td div.eventToolTip {
visibility: hidden;
width: 120px;
background-color: #FFFFFF;
border: 1px solid #202020;
text-align: center;
border-radius: 2px;
padding: 5px;
position: absolute;
z-index: 1;
margin-left: -51px;
font-weight: normal;
font-size: 14px !important;
opacity: 0.0;
filter: alpha(opacity=0);
-webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out;
}

table.smallCalendar tr td div.calendarSmallEventDay:hover .eventToolTip {
visibility: visible;
opacity: 1.0;
filter: alpha(opacity=100);
}

table.smallCalendar tr td div.eventToolTip a {
display: inline-block;
border-bottom: 0 none transparent !important;
margin-bottom: 5px;
font-size: 12px !important;
line-height: 17px !important;
}

table.smallCalendar tr td div.eventToolTip a:hover {
color: #232323 !important;
}

table.smallCalendar tr td div.eventToolTip span.eventTitle {
display: inline-block;
font-size: 12px !important;
line-height: 17px !important;
margin-bottom: 0px !important;
padding: 0;
}

table.smallCalendar tr td div.eventToolTip span.eventTime {
display: inline-block;
font-size: 11px !important;
line-height: 17px !important;
margin-bottom: 0px !important;
}

/*AOL*/
#aol h1:nth-of-type(1) {
text-transform: none;
text-align: center;
font-weight: normal;
background-color: #292826;
color: #FFFFFF;
padding: 20px;
/*+border-radius: 3px;*/
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
-khtml-border-radius: 3px;
border-radius: 3px;
/*+box-shadow: 2px 2px 3px 1px #8F8F8F;*/
-moz-box-shadow: 2px 2px 3px 1px #8F8F8F;
-webkit-box-shadow: 2px 2px 3px 1px #8F8F8F;
box-shadow: 2px 2px 3px 1px #8F8F8F;
}

#katarina {
text-align: center;
margin: 0 0 30px 0;
}

#katarina h2 {
font-weight: normal;
font-size: 28px;
margin: 70px 0 7px;
}

#katarina p {
margin: 0 0 0px 0;
}

#katarina img {
border: 1px solid #A5A5A5;
padding: 7px;
/*+border-radius: 2px;*/
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
-khtml-border-radius: 2px;
border-radius: 2px;
margin: 17px 0 8px;
}

#katarina2 {
text-align: center;
margin: 0 auto 35px;
border: 1px solid #A5A5A5;
padding: 14px;
background-color: #FFFFFF;
width: 88%;
/*+border-radius: 2px;*/
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
-khtml-border-radius: 2px;
border-radius: 2px;
}

#katarina2 p:nth-of-type(1) {
font-weight: bold;
margin: 0 0 10px 0;
}

#katarina2 p {
margin: 0;
line-height: 25px;
}

#katarina3 {
margin: 0 0 70px 0;
}

#katarina3 ul {
max-width: 82%;
margin: 0 auto;
padding: 11px 0 0;
}

#katarina3 ul li {
margin: 0 0 26px 0;
padding: 0;
}

#historyClassical {
margin: 0 0 70px 0;
}

#historyClassical img {
width: 84%;
height: auto;
/*vertical-align: middle;*/
margin: 0 auto;
border: 1px solid #A5A5A5;
padding: 7px;
/*+border-radius: 2px;*/
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
-khtml-border-radius: 2px;
border-radius: 2px;
}

#img2box {
text-align: center;
display: grid;
grid-template-columns: 1fr 1fr;
grid-gap: 20px;
width: 88%;
margin: 0 auto;
}

#historyClassical h2 {
font-weight: normal;
font-size: 28px;
margin: 70px 0 16px;
text-align: center;
line-height: 37px;
}

#historyClassical p:nth-of-type(2) {
text-align: center;
}

#historyClassical p:nth-of-type(3) {
text-align: center;
margin: 0 auto 35px;
border: 1px solid #A5A5A5;
padding: 14px;
background-color: #FFFFFF;
width: 88%;
/*+border-radius: 2px;*/
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
-khtml-border-radius: 2px;
border-radius: 2px;
}

#historyClassical ul {
max-width: 82%;
margin: 0 auto;
padding: 11px 0 0;
}

#historyClassical ul li {
margin: 0 0 26px 0;
padding: 0;
}

#musicTheory {
margin: 0 0 70px 0;
}

#musicTheory h2 {
font-weight: normal;
font-size: 28px;
margin: 70px 0 23px;
text-align: center;
line-height: 37px;
}

#musicTheory p:nth-of-type(3) {
text-align: center;
font-weight: normal;
}

#musicTheory img {
max-width: 280px;
height: auto;
margin: 0 auto 12px;
display: block;
/*+border-radius: 2px;*/
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
-khtml-border-radius: 2px;
border-radius: 2px;
border: 1px solid #A5A5A5;
padding: 7px;
/*+border-radius: 2px;*/
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
-khtml-border-radius: 2px;
border-radius: 2px;
width: 88%;
}

#musicTheoryImages {
display: grid;
grid-template-columns: 1fr 1fr;
grid-gap: 20px;
}

#musicTheoryImages div {
text-align: center;
}

#musicTheory p:nth-of-type(4), #musicTheory p:nth-of-type(5) {
text-align: center;
font-weight: normal;
max-width: 300px;
margin: 9px auto 31px;
}

#improvisation {
margin: 0 0 120px 0;
}

#improvisation h2 {
font-weight: normal;
font-size: 28px;
margin: 70px 0 23px;
text-align: center;
line-height: 37px;
}

#improvisation p:nth-of-type(1) {
text-align: center;
max-width: 458px;
margin: 0 auto 22px;
}

#improvisation img {
max-width: 280px;
height: auto;
margin: 0 auto 32px;
display: block;
/*+border-radius: 2px;*/
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
-khtml-border-radius: 2px;
border-radius: 2px;
border: 1px solid #A5A5A5;
padding: 7px;
/*+border-radius: 2px;*/
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
-khtml-border-radius: 2px;
border-radius: 2px;
}

#improvisation ol {
max-width: 82%;
margin: 0 auto;
padding: 11px 0 0;
}

#improvisation ol li {
margin: 0 0 26px 0;
padding: 0;
}

/*Videos*/
#videoGrid {
display: grid;
grid-template-columns: auto auto auto;
grid-template-columns: 1fr 1fr 1fr;
margin: 40px 0 0;
}

#videoGrid div {
text-align: center;
margin: 0 0 40px 0;
}

#videoGrid div img {
width: 90%;
height: auto;
}

.videoBox {
overflow: hidden;
padding-top: 56.25%;
position: relative;
margin: 0 0 40px 0;
}

.videoBox iframe {
position: absolute;
top: 0;
left: 0;
border: 0;
width: 100%;
height: 100%;
}

a.secureLink {
border: 1px solid #3F94D0;
color: #3F93CF !important;
text-decoration: none;
font-size: 18px;
display: inline-block;
background-image: url(/img/secure.png);
background-position: 10px 8px;
background-size: 32px;
background-repeat: no-repeat;
padding: 13px 24px 13px 59px;
font-weight: bold;
line-height:normal!;
/*+border-radius: 2px;*/
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
-khtml-border-radius: 2px;
border-radius: 2px;
background-color: #EDEDED;
letter-spacing: 1px;
transition: all 0.2s ease;
}

a.secureLink:hover {
background-color: #3F94D0;
color: #FFFFFF !important;
}

#loginWrap {
display: grid;
grid-template-columns: auto auto;
}

#LoginBox {
background-color: #E9E9E9;
padding: 20px;
}

#LoginBox label {
display: block;
margin-bottom: 10px;
}

div#LoginBox form {
}

div#LoginBox form label input[type=text], div#LoginBox form label input[type=password] {
background: white;
box-sizing: border-box;
font-weight: 400;
border: 1px solid #CFD7DF;
border-radius: 2px;
color: #000000;
outline: none;
height: 48px;
line-height: 48px;
padding: 0 20px;
cursor: text;
width: 76%;
font-family: sans-serif;
/*float: right;*/
font-size: 17px;
}

div#LoginBox form input[type=submit] {
padding: 7px 14px;
cursor: pointer;
background-image: linear-gradient(-180deg, #2EBFD6 0%, #1E9BAF 100%);
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.10), inset 0 -1px 0 0 #1E9BAF;
color: white;
border-radius: 2px;
border: 0;
}

#signUpBox {
background-color: #E1E1E1;
padding: 20px;
}

#subscribeForm label, #supportForm label {
display: block;
margin-bottom: 10px;
}

#subscribeForm label:nth-of-type(1) span {
/*padding: 5px 0 0;*/
}

#subscribeForm label > span {
float: left;
display: block;
width: 108px;
text-align: right;
padding: 14px 0 0;
position: relative;
right: 8px;
color: #737373;
font-size: 12px;
}

.card-element {
display: block;
margin-left: 108px;
}

#subscribeForm .field {
background: white;
box-sizing: border-box;
font-weight: 400;
border: 1px solid #CFD7DF;
border-radius: 2px;
color: #000000;
outline: none;
height: 48px;
line-height: 48px;
padding: 0 20px;
cursor: text;
width: 76%;
font-family: sans-serif;
/*float: right;*/
font-size: 17px;
}

#subscribeForm .field::-webkit-input-placeholder {
color: #7E7E7E;
}

#subscribeForm .field::-moz-placeholder {
color: #7E7E7E;
}

#subscribeForm .field:-ms-input-placeholder {
color: #7E7E7E;
}

#subscribeForm .field:focus, #subscribeForm .field.StripeElement--focus {
border-color: #2EBFD6;
}

#subscribeForm button {
background-image: linear-gradient(-180deg, #2EBFD6 0%, #1E9BAF 100%);
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.10), inset 0 -1px 0 0 #1E9BAF;
color: white;
border-radius: 2px;
border: 0;
/*margin-top: 20px;*/
font-size: 17px;
width: 98%;
height: 48px;
line-height: 48px;
outline: none;
cursor: pointer;
/*background-image: url('/img/ajax-loader.gif');*/
}

#subscribeForm button:focus {
background: #2EBFD6;
}

#subscribeForm button:active {
background: #2EBFD6;
}

#subscribeForm .outcome {
float: left;
width: 100%;
padding-top: 8px;
min-height: 20px;
text-align: center;
}

#subscribeForm .success, #subscribeForm .error {
display: none;
font-size: 18px;
font-weight: normal;
}

#subscribeForm .success.visible, #subscribeForm .error.visible {
display: inline;
}

#subscribeForm .error {
color: #E4584C;
}

#subscribeForm .success {
color: #F8B563;
}

#subscribeForm .success .token {
font-weight: 500;
font-size: 13px;
}

#subscribeForm button.disabled {
background-color: #2EBFD6;
background-image: url('/img/ajax-loader.gif');
background-position: 15px 8px;
background-repeat: no-repeat;
}

#subscribeText, #supportText {
float: left;
width: 45%;
margin: 0 0 0 20px;
}

#forgotPassLink {
margin: 20px 0 0;
display: inline-block;
}

#forgotPassBox {
display: none;
margin: 20px 0 0;
}

#forgotPassBox input[type=text] {
background: white;
box-sizing: border-box;
font-weight: 400;
border: 1px solid #CFD7DF;
border-radius: 2px;
color: #000000;
outline: none;
height: 48px;
line-height: 48px;
padding: 0 20px;
cursor: text;
width: 76%;
font-family: sans-serif;
font-size: 17px;
}

#forgotPassBox input[type=submit] {
padding: 7px 14px;
cursor: pointer;
background-image: linear-gradient(-180deg, #2EBFD6 0%, #1E9BAF 100%);
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.10), inset 0 -1px 0 0 #1E9BAF;
color: white;
border-radius: 2px;
border: 0;
}

@media only screen and (min-width: 768px) and (max-width: 980px) {
#subscribeForm label > span {
float: none;
display: block;
width: auto;
text-align: left;
padding: 14px 0 0;
position: relative;
right: 0;
}

#subscribeForm .field {
width: 98%;
}

.card-element {
display: block;
margin-left: 0;
}
}

@media only screen and (min-width: 320px) and (max-width: 768px) {
#subscribeForm label > span {
float: none;
display: block;
width: auto;
text-align: left;
padding: 14px 0 0;
position: relative;
right: 0;
}

#subscribeForm .field, #supportForm .field {
width: 98%;
}

.card-element {
display: block;
margin-left: 0;
}

#subscribeForm {
width: auto;
float: none;
}

#subscribeText {
float: none;
width: auto;
margin: 0;
}
}

/*registration*/
div#regWrap {
font-family: 'Open Sans', sans-serif;
}

div#regWrap h1, div#regWrap h2 {
font-family: 'Open Sans', sans-serif;
}

div#regWrap p {
font-family: 'Open Sans', sans-serif;
}

div#regWrap label {
display: block;
margin: 0 0 9px 0;
}

div#regWrap input[type=text] {
font-family: 'Arbutus Slab', serif;
font-family: 'Open Sans', sans-serif;
padding: 5px 5px 4px 7px;
margin: 0px;
font-size: 17px;
}

div#reWrap, div#lWrap, div#pvWrap, div#sigWrapper {
display: none;
}

input#famount {
width: 72px;
}

div#sigWrap1, div#sigWrap2, div#sigWrap3 {
border: 2px solid #012E4D;
margin: 0 0 9px 0;
/*+border-radius: 2px;*/
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
-khtml-border-radius: 2px;
border-radius: 2px;
/*+box-shadow: 1px 1px 2px 2px rgba(0, 0, 0, 0.222);*/
-moz-box-shadow: 1px 1px 2px 2px rgba(0, 0, 0, 0.222);
-webkit-box-shadow: 1px 1px 2px 2px rgba(0, 0, 0, 0.222);
box-shadow: 1px 1px 2px 2px rgba(0, 0, 0, 0.222);
}

form#rPayment input[type=submit] {
font-family: 'Arbutus Slab', serif;
font-family: 'Open Sans', sans-serif;
padding: 10px 20px;
text-transform: uppercase;
font-weight: bold;
font-size: 23px;
border: 1px solid black;
/*+border-radius: 2px;*/
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
-khtml-border-radius: 2px;
border-radius: 2px;
background-color: #D7D7D7;
cursor: pointer;
}

form#rPayment input[type=submit]:hover {
background-color: #E5E5E5;
}

div#regWrap input[type=button] {
font-weight: bold;
font-size: 17px;
padding: 5px 15px;
}

/*template v1*/
h1.special1 {
font-weight: bold !important;
font-size: 28px !important;
letter-spacing: 19px !important;
text-shadow: 1px 1px 1.5px #000000;
color: #E30F04 !important;
background-color: rgba(255, 255, 255, 0.863);
padding: 28px 23px;
/*+border-radius: 12px;*/
-moz-border-radius: 12px;
-webkit-border-radius: 12px;
-khtml-border-radius: 12px;
border-radius: 12px;
/*max-width: 272px;*/
margin: 0 auto;
text-align: center;
line-height: 49px !important;
}

.center {
text-align: center;
}

ul.grid2 {
margin: 0 0 50px 0 !important;
padding: 38px !important;
background-color: #FFFFFF;
font-family: 'Arbutus Slab', serif;
/*+box-shadow: 2px 2px 2px -1px rgba(0, 0, 0, 0.641);*/
-moz-box-shadow: 2px 2px 2px -1px rgba(0, 0, 0, 0.641);
-webkit-box-shadow: 2px 2px 2px -1px rgba(0, 0, 0, 0.641);
box-shadow: 2px 2px 2px -1px rgba(0, 0, 0, 0.641);
}

ul.grid2 li {
list-style-type: none !important;
margin: 0 !important;
padding: 0 !important;
text-align: center;
font-size: 14px;
font-family: sans-serif;
font-family: 'Roboto Condensed', sans-serif;
}

.grid2 {
display: grid;
grid-gap: 22px;
grid-template-columns: 1fr 1fr;
}

#subContent h3 {
font-size: 16px;
font-family: 'Arbutus Slab', serif;
color: #666;
margin-bottom: 20px;
line-height: 29px;
text-transform: uppercase;
letter-spacing: 1px;
font-weight: normal;
}

.grid3 {
display: grid;
grid-gap: 22px;
grid-template-columns: 1fr 1fr 1fr;
}

img#kbanner {
margin: 49px 0 37px;
/*+border-radius: 7px;*/
-moz-border-radius: 7px;
-webkit-border-radius: 7px;
-khtml-border-radius: 7px;
border-radius: 7px;
/*+box-shadow: 5px 6px 0px -1px rgba(210, 23, 54, 0.632);*/
-moz-box-shadow: 5px 6px 0px -1px rgba(210, 23, 54, 0.632);
-webkit-box-shadow: 5px 6px 0px -1px rgba(210, 23, 54, 0.632);
box-shadow: 5px 6px 0px -1px rgba(210, 23, 54, 0.632);
}

.template1 a {
color: #D21736 !important;
font-weight: 300;
letter-spacing: 1px;
text-decoration: none !important;
border-bottom: 1px solid rgba(210, 23, 54, 0.350);
transition: all 0.4s ease !important;
}

.template1 a:hover {
color: #88454F !important;
}

img#mattPic, img#katPic {
max-width: 280px !important;
margin: 0 auto !important;
display: block !important;
/*+border-radius: 28px;*/
-moz-border-radius: 28px;
-webkit-border-radius: 28px;
-khtml-border-radius: 28px;
border-radius: 28px;
/*+box-shadow: 5px 6px 0px -1px rgba(83, 66, 69, 0.632);*/
-moz-box-shadow: 5px 6px 0px -1px rgba(83, 66, 69, 0.632);
-webkit-box-shadow: 5px 6px 0px -1px rgba(83, 66, 69, 0.632);
box-shadow: 5px 6px 0px -1px rgba(83, 66, 69, 0.632);
}

#mattText, #katText {
margin: -44px 0 60px !important;
display: block;
text-align: center;
font-weight: bold;
font-size: 21px !important;
}

img#jphoto {
max-width: 280px;
max-width: 280px !important;
margin: 0 auto !important;
display: block !important;
/*+border-radius: 28px;*/
-moz-border-radius: 28px;
-webkit-border-radius: 28px;
-khtml-border-radius: 28px;
border-radius: 28px;
/*+box-shadow: 5px 6px 0px -1px rgba(158, 22, 25, 0.470);*/
-moz-box-shadow: 5px 6px 0px -1px rgba(158, 22, 25, 0.470);
-webkit-box-shadow: 5px 6px 0px -1px rgba(158, 22, 25, 0.470);
box-shadow: 5px 6px 0px -1px rgba(158, 22, 25, 0.470);
}

.grid2photo {
display: grid;
grid-template-columns: 1fr 1fr;
}

button.payBtn {
font-size: 21px;
padding: 10px 25px 9px;
text-transform: uppercase;
letter-spacing: 2px;
/*+border-radius: 25px;*/
-moz-border-radius: 25px;
-webkit-border-radius: 25px;
-khtml-border-radius: 25px;
border-radius: 25px;
border: 1px solid #FFFFFF;
background-color: #FFFFFF;
margin: 32px auto 26px;
width: 260px;
/*+box-shadow: 3px 3px 1px 1px rgba(2, 83, 138, 0.470);*/
-moz-box-shadow: 3px 3px 1px 1px rgba(2, 83, 138, 0.470);
-webkit-box-shadow: 3px 3px 1px 1px rgba(2, 83, 138, 0.470);
box-shadow: 3px 3px 1px 1px rgba(2, 83, 138, 0.470);
display: block;
cursor: pointer;
color: #3B3B01;
font-weight: bold;
}

button.payBtn:hover {
opacity: 0.8;
}
