/*=============This is general css===================*/
html, body {
    font-family: 'Montserrat', sans-serif;
    margin: 0; padding: 0;-webkit-tap-highlight-color: rgba(0,0,0,0); color:#000;
}
.login {width: 250px;position: absolute;background: #fff;padding: 20px;
  box-sizing: border-box;
  right: 0;top: 90px; z-index: 9; }
.login:after{ content: ''; border: 12px solid transparent; border-bottom: 12px solid rgb(255, 255, 255);
  position: absolute; top: -24px; left: 49%; }
.login input {margin-bottom: 7px;font-size: 13px;padding-left: 5px;}
#fyp a {color: #000;text-transform: uppercase;letter-spacing: 1px;font-size: 13px;}
#logo {display: inline-block;float: left;}
#slogan {background: #fff;color: #000;font-size: 11px;position: absolute;top: 23px;left: 71px;}
#login {background: #000000;border: none;padding: 30px 50px 30px 50px;display: inline-block;font-family: 'Montserrat', sans-serif;
font-size: 14px;font-weight: 700;color: #fff;letter-spacing: 2px;text-decoration: none;text-transform: uppercase;cursor: pointer;}
/*==================General style====================*/
h1, h2, h3 {color: #fff;margin:0;padding:0;font-family: 'Montserrat', sans-serif;font-weight: 400;}
p {font-size: 16px;font-weight: 400;line-height: 24px;}
a {text-decoration: underline;color: #E60F17;}
:focus {outline: 0;}
.title {font-size: 70px;letter-spacing: 5px;line-height: 80px;text-transform: uppercase;text-align: center;color: #fff;}
.title span {font-size: 30px;font-weight: 400;letter-spacing: 5px;display: block;line-height: 36px;text-transform: uppercase;text-align: center;}
.small-title {font-size: 18px;line-height: 24px;padding: 15px 0;border-top: 2px solid #fff;border-bottom: 2px solid #fff;margin: 30px auto;text-align: center;width: 100%;letter-spacing: 2px;color: #fff;}

.subtitle {color: #af1b5a;font-size: 36px;font-weight: 700;line-height: 42px;margin-bottom: 30px;}
.subtitle span {color: #000;}
.small-subtitle, .loginHead {color: #af1b5a;font-size: 20px;font-weight: 700;letter-spacing: 2px;margin: 0 0 20px 0;}
.grid {width: 90%;max-width: 1200px;margin: 0 auto;padding:5px 0;position: relative;/* overflow: hidden; */}
#headerWrapper.grid {padding: 0;}
#headerWrapper, #header {overflow: hidden;}
#headerWrapper .grid {overflow: hidden;padding: 0;}
.fullwidth {width: 100%;margin: 0 auto;padding:0;position: relative;overflow: hidden;}
.section {width: 100%;overflow: hidden;}
.txt {background: #fff;padding: 50px 0;}
.btn {padding: 15px 30px 15px 30px;border: 3px solid #000;font-size: 14px;display: inline-block;}
.btn a {font-size: 14px;color:#000;text-transform: uppercase;font-weight: 700;}
.margin5 {margin-right: 5%;}
.margin7 {margin-right: 7%;}
.left {float: left;}
.right {float: right;}
.col1 {width: 100%;overflow: hidden;display: block;}
.col2 {display: inline-block;float: left;width: 45%;}
.col3 {display: inline-block;float: left;width: 32%;}
.col4 {display: inline-block;float: left;width: 24%;}
.middle {margin: 15% auto 0;}
.center {text-align: center;}
ul {padding:0;margin:0;}
ul li {display: inline-block;letter-spacing: 1px;}
ul li img {vertical-align: middle;margin-right: 5px;}
#footer {width:100%;background: #231f20;color: #fff;font-size: 12px;text-transform: uppercase;padding:10px 0px 2px;letter-spacing: 1px;font-weight: 300;}
#footer ul {float: right;display: inline-block;}
#footer ul li {margin-right: 12px;line-height: 28px;}
#footer p {font-size: 12px;width: auto;display: inline-block;margin: 0;padding: 0;letter-spacing: 1px;}
#footer p a {color:#FFF; text-decoration:none; margin-left:28px;}
#footer div.billing{font-size: 10px; line-height: 9px; position: relative; top: -8px; letter-spacing: 0; color: #aaa;}
/*=========section1 style================*/
#section1 {background-image: url(img/bg1.jpg);background-attachment: fixed;background-size: cover;min-height: 800px;padding: 30px 0;}
#thumbs img {width: 100%;}
.colorP {color: #DBDBDB;}
.list ul li {width: 32%;font-size: 15px;margin: 5px 0;text-align: center;}
.list ul li span {display:block}
.txt .list {width: 55%;}
#formWrapper {width: 100%;overflow: hidden;}
#form {box-sizing: border-box;padding: 20px;}
#form h2 {font-weight: 700;font-size: 37px;color: #b51f59;padding-bottom: 5px;border-bottom: 1px solid #b51f59;}
.bubble {position: relative;width: 90%;max-width:540px;padding: 0px;background-color: rgba(255,255,255,0.85);-webkit-border-radius: 0px;-moz-border-radius: 0px;border-radius: 0px;overflow: initial;margin: 20px auto;}
.bubble:after {content: '';position: absolute;border-style: solid;border-width: 0 15px 15px;border-color: rgba(255, 255, 255, 0.85) transparent;display: block;width: 0;z-index: 1;
top: -15px;
left: 48%;}
#menu {display: inline-block;float: right;}
#menu ul {display: inline-block;}
#menu ul li {padding: 15px;}
#menu ul li a {color: #000;font-size: 14px;font-weight: 400;text-transform: uppercase;}
/*=========section2 style================*/
#section2 {background-image: url(img/bg2.jpg);background-attachment: fixed;background-size: cover;height: 600px;padding: 20px 0;}
#r1 .formTitle {  width: 100%;display: block;text-align: center;font-size: 28px;line-height: 30px;}

/*=========section3 style================*/
#section3 {background-image: url(img/bg3.jpg);background-attachment: fixed;background-size: cover;height: 600px;padding: 20px 0;}
#info {overflow: hidden;width: 100%;}
#info h3 {font-size: 24px;font-weight: 700;text-transform: uppercase;line-height: 60px;color: #b51f59;}
#info li {width: 18%;text-align: center;float: left;margin: 0 3%;}

/*=========section4 style================*/
#section4 {background-image: url(img/bg4.jpg);background-attachment: fixed;background-size: cover;height: 600px;padding: 20px 0;}
.socialIcons {display: inline-block;margin: 0 10px;}

#socials-inner {width: 60%;max-width: 600px;padding: 25px;border: 1px solid #000;margin: 10px auto;text-align: center;}
.title2 {width: 175px;font-weight: 500;font-size: 18px;padding: 10px 0;border-bottom: 1px solid #000;}
.list2 {font-size: 11px;margin: 1em 0;list-style: disc;color: #000;line-height: 140%;display: block;}
.list2 li {list-style: disc;margin-left: 1.3em;padding-left: 0.4em;color: #000;display: list-item;}
.list2 li a {color: #000;text-decoration: none;}
#socials-inner img {vertical-align: middle;}
/*===========R1 form===========*/
select, input, textarea {box-sizing: border-box;background: #fff;height: 30px;width: 100%;font-size: 14px;border-radius: 4px;border: 1px solid #999;padding-left: 5px;}
#r1 b, #r2 b {font-weight: 700;color: #404040;font-size: 12px;display: block;}
#r1 p {margin:3px 3% 3px 0;display:inline-block;overflow: hidden;width: 45%;float: left;}
#submit {background-color: #b51f59;color: #fff;-moz-border-radius: 3px;-webkit-border-radius: 3px;border-radius: 3px;-webkit-appearance: none;
cursor: pointer;font-size: 20px;height: 35px;padding: 4px;width: 100%;margin-top: 20px;font-weight: 700;border: none;text-transform: uppercase;}
/*#r1 .p_bday select {width: 31%;}*/
#r1 .year {width: 45%}
#r1 .day {width: 25%;}
#r1 .mon {width: 25%;}
.looking {}
.looking input {width: 16px;height: 16px;vertical-align: middle;}
.looking .cb {overflow: hidden;margin-bottom: 5px;font-size: 11.5px;display: inline-block;margin: 0 5px 0 0;width: 47.7%;}
#r1 .sub, #r2 .sub {font-size: 11px;color: #525252;}
#r1 #display_pass {display: none;}
#r1 #displayName {display: inline-block;overflow: hidden;float: left;width: 45%;margin: 3px 3% 3px 0;}
#r1 #displayName p {width: 100%;}
#r1 .email_p {clear: both;}
#e, .e, .error {padding: 10px;background: #FFECEC;border-radius: 4px;box-sizing: border-box;width: 100%;font-size: 12px;color: #BA6B6B;margin: 5px auto;overflow: hidden;}
#e .alt_logins {color:#000;}
#e .alt_logins u {color:#415CC7 }
#r1 .agree {display: block;width: 100%;font-size: 13px;clear: both;line-height: 18px;}
#r1 .agree input {width: 16px;height: 16px;display: inline-block;float: left;}
#r1 .agree a {color: #000;text-decoration: underline;}
/*============Fr2==================*/
#r2 p {clear:both; margin:0;}
#r2 .p_mobile {margin-right: 8px;}
.p_mobile .smallText {display: none;}
.p_country {margin-bottom:5px;}
.pr_Headline_p {width: 100%}
.about_p {margin-top:10px;width: 100%}
.about_p strong {display:block}
.about_p small {display:none;}
kbd span {display:none;}
#r2 br {display:none;}
#r2 .msg #e br {display:block;}
.pr_Headline_p {clear:both;}
#r2 .about{ width:100%; }
#r2 textarea.about{ height:200px; }
#r2 .p_mobile, #Fr2 .p_country {width: 48.5%;display: inline-block;}
#r2 .p_country select {width: 100%;}
#r2 p kbd {float: left;display: inline-block;}
#Fr2 .p_country {float: right;}
#r2 .marital_status, #Fr2 .body_type, #Fr2 .race {display: inline-block;float: left;clear:none;margin-right: 7px;width: 32%;}
#r2 .city, #Fr2 .state, #Fr2 .zip {margin-right: 8px;}
#Fr2 .race {margin-right: 0;float: right;}
#r2 p .city{width: 46%}
#r2 p .state{width: 20%;}
#r2 p .zip{width: 30%;margin-right: 0;float: right;}
#r2 p .city input, #Fr2 p .state input, #Fr2 p .zip input{width: 100%;box-sizing: border-box;}
#r2 p strong {text-align: left;display: block;margin-bottom: 5px;font-size: 13px;}
select.err {   background: #FFECEC; }
.msg #e, .msg .e {padding: 7px;width: 100%;box-sizing: border-box;}
.msg {margin-bottom:10px; margin-top:10px;}
.msg li { list-style: none; }
.msg li { margin: 0; padding: 0 0 0 10px; }
.msg li:before {content: "X"; font-weight: bold; font-size:10px; color: #fff; background: red; border-radius: 20px; height: 12px; width: 12px; line-height: 12px; text-align: center; padding: 0 3px; margin-right: 4px;}
.call2act {  background: #B51F58;display: block;margin: 0 auto;padding: 10px 20px;border-radius: 3px;color: #fff;}
.add-in {display:inline-block; float:right;}


@media only screen and (min-width: 769px) {
	.title:first-of-type{font-size:54px}
}

@media only screen and (max-width: 960px) {
  #slogan {  top: 39px;left: 4px;}
  .add-in{width: 100%;display: block;margin: 10px 0 15px;text-align: left;float: none;}
  .add-in p:first-of-type a {margin-left: 0!important}
}

@media only screen and (max-width: 550px) {
	#footer > .grid > p {width: 100%;display: block;margin-bottom: 8px}
	#footer > .grid > p > a {margin-left: 0!important;}
	.add-in p:first-of-type {display: block!important;margin-bottom: 10px!important;}
	.add-in p:nth-of-type(2) a {margin-left: 0!important}
}

@media only screen and (max-width: 860px) {
  #menu ul {display: none;}
}

@media only screen and (max-width: 769px) {
  .grid {width: 90%;}
  #section1 {background-attachment: scroll;background-position: 80% 0;}
  #section2, #section3, #section4 {height: 400px;background-attachment: scroll;background-position: center top;}
  #section4 {background-position: right top;}
  .title {font-size: 50px;font-weight: 400;letter-spacing: 2px;line-height: 60px;}
  .title span {font-size: 26px;font-weight: 400;letter-spacing: 2px;line-height: 34px;}
  .small-title {width:80%;font-size: 24px;font-weight: 400;letter-spacing: 3px;margin: 20px auto;line-height: 34px;color: #fff;}
  #r1 #displayName {width: 100%;}
  #form h2 {font-size: 30px;text-align: center;}
  #thumbs img {width: 200%;}
  .col2 {width: 100%;float: none;display: block;margin-bottom: 30px;}
  .col4 {width: 49%;}
  .txt .list {width: 100%;}
  #info li, #r1 p, #r2 p {width: 100%;display: block;}
  .fullImg {width: 100%;}
  #footer {font-size: 10px; padding: 10px 0px 60px; box-sizing:border-box;}
  #footer ul {float: none;display: block;}
  #footer ul li {display: inline;}
  #submit {font-size: 16px;}
  #menu ul {display: none;}
  #r2 .p_mobile, #Fr2 .p_country {width: 100%;display: block;}
  #r2 .marital_status, #Fr2 .body_type, #Fr2 .race {width: 100%;display: block;}
  #r2 p .city, #r2 p .state, #r2 p .zip {margin:5px 0;width: 100%;display: block;}
  #r1 .agree {font-size: 10px; border-top: 1px solid #BBB; padding-top: 8px}
  #slogan {  top: 39px;left: 4px;}
}

@media only screen and (max-width: 480px) {
  .grid {width: 96%;}
  #logo {width: 50%; padding: 10px 0;}
  #logo img {width: 100%;}
  #login {padding: 30px 40px 30px 40px;}
  #section1 {background-attachment: scroll;background-position: 80% 0;}
  #section2, #section3, #section4 {height: 400px;background-attachment: scroll;background-position: center top;}
  #section4 {background-position: right top;}
  .title {font-size: 25px;font-weight: 400;letter-spacing: 2px;line-height: 30px;color: #fff;}
  .title span {font-size: 16px;font-weight: 400;letter-spacing: 2px;line-height: 24px;}
  .small-title {width:80%;font-size: 14px;font-weight: 400;letter-spacing: 3px;margin: 20px auto;line-height: 25px;}
  #form h2 {font-size: 16px;text-align: center;}
  #thumbs img {width: 300%;}
  .col2, .col4 {width: 100%;float: none;display: block;margin-bottom: 30px;}
  .txt .list {width: 100%;}
  #info li {width: 100%;display: block;}
  #submit {font-size: 14px;}
  #r1 .agree {font-size: 9px;text-align: center; border-top: 1px solid #BBB; padding-top: 8px;}
  .bubble { width:100%; }
  #slogan { display: none;}
  .title2 {width: 100%;}
  #footer p a {margin-left:8px;}
  .list ul li span {font-size: 12px;}
}

.footer {display: none;}

.city-list-box {
   width:25%;
   margin:0;
}
.city-list {
   width:225px;
   margin:0 auto;
   font-size:13px;
}

.city-list-first {
   width:225px;
   margin:0;
   float:left;
   font-size:13px;
}
.city-list-second {
   width:225px;
   margin:0 auto;
   font-size:13px;
}
.city-list-third {
   width:225px;
   margin:0 auto;
   font-size:13px;
}
.city-list-fourth {
   width:225px;
   margin:0;
   float:right;
   font-size:13px;
}

@media all and (max-width: 490px) {
   .city-list-box {
       width:100%;
   }
   .city-list-first {
       margin:0 auto;
       float:none;
    }
    .city-list-second {
       margin:0 auto;
       float:none;
    }
    .city-list-third {
       margin:0 auto;
       float:none;
    }
    .city-list-fourth {
       margin:0 auto;
       float:none;
    }
}
@media all and (max-width: 1024px) and (min-width: 491px) {
   .city-list-box {
       width:50%;
   }
   .city-list-first {
       margin:0 auto;
       float:none;
    }
    .city-list-second {
       margin:0 auto;
       float:none;
    }
    .city-list-third {
       margin:0 auto;
       float:none;
    }
    .city-list-fourth {
       margin:0 auto;
       float:none;
    }
}
