



/* -------------------------------------------------- 

   Table of Contents

----------------------------------------------------- */



/*

Theme Name: Dating Landing Page

Description:  Dating Landing Page for Lovers

Author: SeventhQueen

Author URI: http://themeforest.net/user/SeventhQueen/portfolio?ref=SeventhQueen

Version: 2.0

Tags: dating, clean, responsive, creative, minimal, modern, landing page



01. Shared Styles

02. Header Section

03. Call To Actions Section

04. Video Section

05. Feature Text Section

06. Testimonials Section

07. Support & Newsletter Section

08. Footer Section

09. Animations

10. Mobile Specific

*/











/* -----------------------------------------

   01. Shared Styles

----------------------------------------- */



* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; /**behavior: url(boxsizing.htc);*/ }

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, p, th, td { margin: 0; padding: 0; font-size: 13px; direction: ltr; }

body { background: /*#f4f4f4*/ url(../images/patterns/bg-body.gif); color: #777; font-family: 'Open Sans', sans-serif; }



/*** Typography ***/

p { font-family: inherit; font-weight: normal;font-size: 13px; line-height: 1.4; margin-bottom: 17px; text-align:justify; }


.aftrlogoutmenu li {float:left; list-style-type:none;}
.aftrlogoutmenu li  a{color:#fff;padding:6px;font-weight:700;}
.aftrlogoutmenu li  a:hover{background-color:#b21c20;}


h1, h2, h3, h4, h5, h6 { font-family: 'Open Sans', sans-serif; font-weight: 400; font-style: normal; color: #222222; text-rendering: optimizeLegibility; line-height: 1.1em; margin-bottom: 14px; margin-top: 14px; }

h1 small, h2 small, h3 small, h4 small, h5 small, h6 small { font-size: 60%; color: #6f6f6f; line-height: 0; }

#header h1{ margin-bottom:0;}
h1 { font-size: 44px; margin-bottom: 44px; }

h2 { font-size: 34px; margin-bottom: 34px; }

h3 { font-size: 28px; }

h4 { font-size: 20px; }

h5 { font-size: 17px; }

h6 { font-size: 14px; }

.subheader { line-height: 1.3; color: #6f6f6f; font-weight: normal; margin-bottom: 17px; }

small { font-size: 84%; line-height: inherit; }



/*** Usefull Claeses ***/

.alpha { padding:0 15px 0 0; }

.omega { padding:0 0 0 15px; }

.no-padding { padding:0; }

.no-margin { margin: 0; }

.clearfix { *zoom: 1; }

.clearfix:before,

.clearfix:after { display: table; line-height: 0; content: ""; }

.clearfix:after { clear: both; }

.stretch { width: 100%; }

.strong { font-weight: bold; }

.upper-text { text-transform: uppercase; }

.space-b-20 { margin-bottom: 20px; }

.space-b-50 { margin-bottom: 50px; }



/*** Colours ***/

.red-text { color: #cf0000; }

.pink-text { color: #b0080b; }

.black-text { color: #000; }

.green-text { color: #12b8ba; }

.blue-text { color: #18a0c7; }

.white-text { color: #fff; }



/*** Buttons ***/

.button { border: 1px solid #b0080b; background:#b0080b; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; }

.button:hover, .button:focus { color:#000; background-color: #fff; border: 1px solid #000; }

.button.alert { background-color:#000; border: 1px solid #0000; }

.button.alert:hover,

.button.alert:focus { background-color: #de0052; border: 1px solid #de0052; }

.button.secondary { background-color: #e6e6e6; color: #1d1d1d; border: 1px solid #e6e6e6; }

.button.secondary:hover,

.button.secondary:focus { background-color: #dddcdc; }

.button.radius { -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; }

.button.facebook { background: #3B5A9B; border: 1px solid #3B5A9B; }

#btnGoUp { cursor: pointer; display: none; position: fixed; bottom: 30px; right:30px; width: 47px; height: 44px; text-indent: -5555px;  background: transparent url(../images/up_page.png) no-repeat left top; z-index: 950; }

#btnGoUp:hover { background-position: left bottom; }



/*** Tooltips ***/

.has-tip { border-bottom: none; cursor: pointer; font-weight: bold; color: #333; }

.has-tip:hover, .has-tip:focus { border-bottom: none; color: #f00055; }



/*** Pop-ups ***/

.reveal-modal { background: url(../images/patterns/gray_pattern.gif); border: 10px solid #fafafa; }

.reveal-modal h5 { margin-bottom: 40px; }











/* -----------------------------------------

   02. Header Section

----------------------------------------- */



.header-bg {background: #000 /*url(../images/patterns/blue_pattern.gif)*/; }

/*#header { padding-top: 5px; padding-bottom: 0px; background: url(../images/header_image_bg.png) top center no-repeat; max-width: 1270px; margin: 0 auto; border-bttom: 10px solid red; }*/
#header {
    padding-top: 5px;
    padding-bottom: 10px;
    background: url(../images/header_image_bg.png) -111px -80px no-repeat;
    max-width: 1270px;
    margin: 0 auto;
    border-bttom: 10px solid red;
}



/*** Top links ***/

.top-links { text-align: right; color: #fff; padding: 4px 0; border-bottom: 1px solid #000; background: #b0080b; }

.top-links a {
    color: #fff;
    margin-left: 5px;
}

.top-links a:hover { color: #389175; }



/*** Logo ***/

#logo { max-height: 108px; text-indent: -9999px; padding-top: 0; margin-top: 0; }

#logo img { display: block; float: left; width:200px;}

#logo a {}



/*** Search Form ***/

.form-wrapper { margin-top: 30px; min-height: 370px; }

.form-search { padding: 10px 12px 20px; background: rgba(255, 255, 255, 0.5); position: relative; border-left: 3px solid rgba(176, 8, 11, 0.8);  border-right: 3px solid rgba(176, 8, 11, 0.8); }

.form-search label { color: #fff; }

.form-search .notch { display:none; position: absolute; bottom: -10px; left: 20px; margin: 0; border-top: 0; border-left: 10px solid transparent; border-right: 10px solid transparent; border-top: 10px solid #297c62; padding: 0; width: 0; height: 0; }

.form-header { background: rgba(255, 255, 255, 0.5); padding: 15px 14px 6px; border-left: 3px solid rgba(176, 8, 11, 0.8); border-top: 3px solid rgba(176, 8, 11, 0.8);  border-right: 3px solid rgba(176, 0, 11, 0.8);}

.form-header .lead {
    color: #000;
    font-size: 16.4px;
}
.container {
    border-bottom: solid 1px #eee;
}

.form-footer { padding: 20px 20px 10px;  border-left: 10px solid #fafafa; border-bottom: 10px solid #fafafa;  border-right: 10px solid #fafafa;background: #f8f8f8 url(../images/patterns/gray_pattern.gif); }

.form-search.custom div.custom.dropdown { display: block; position: relative; width: auto; height: 32px; margin-bottom: 9px; margin-top: 2px; }

.form-search.custom div.custom.dropdown a.current { display: block; width: auto; line-height: 30px; min-height: 32px; padding: 0; padding-left: 6px; padding-right: 38px; border: solid 1px #b0080b; color: #fff; background-color: rgba(176, 8, 11, 0.8); white-space: nowrap; }

.form-search.custom div.custom.dropdown a.selector { position: absolute; width: 27px; height: 32px; display: block; right: 0; top: 0; border: solid 1px #b0080b; }

.form-search.custom div.custom.dropdown a.selector:after { content: ""; display: block; content: ""; display: block; width: 0; height: 0; border: solid 5px; border-color: #fff transparent transparent transparent; position: absolute; left: 50%; top: 50%; margin-top: -2px; margin-left: -5px; }

.form-search.custom div.custom.dropdown ul { position: absolute; width: auto; display: none; margin: 0; left: 0; top: 31px; margin: 0; padding: 0; background: white; background: rgba(255, 255, 255, 0.95); border: solid 1px #b7f0ff; }

.form-search.custom div.custom.dropdown ul li { color: #555555; font-size: 13px; cursor: pointer; padding: 3px; padding-left: 6px; padding-right: 38px; min-height: 18px; line-height: 18px; margin: 0; white-space: nowrap; list-style: none; }

.form-search.custom div.custom.dropdown ul li.selected { background: #b9f0ff; color: black; }

.form-search.custom div.custom.dropdown ul li:hover { background-color: #b9f0ff; color: black; }

.form-search.custom div.custom.dropdown ul li.selected:hover { background: #b9f0ff; cursor: default; color: black; }

.form-search .button { background: #000; border: 1px solid #000; }

.form-search .button:hover,

.form-search .button:focus { color: white; background-color: #30bee6; border: 1px solid #30bee6; }



/*** LogIn and Signup Forms ***/

.login-buttons em { line-height: 22px; margin: 3px -6px; z-index: 1; position: relative; width:22px; height: 22px; display: inline-block; color: #69717e; text-align:center;

		-moz-border-radius:50px; -webkit-border-radius:50px; border-radius:50px; background: #fff; }

.reveal-modal .label { font-weight: normal; }

.reveal-modal input:focus:invalid { /* insert your own styles for invalid form input */ border-color: red; }



/*** Profile Thumbs Carousel ***/

.carousel-profiles { margin: 0 0 10px 60px; overflow: hidden; max-height: 100px; }

.carousel-profiles ul { margin: 0; padding: 0; list-style: none; display: block; }

.carousel-profiles li { text-align: center; background-color: #f5f5f5; border: 3px solid #fff; width: 94px; height: 94px; padding: 0; margin: 6px; display: block; float: left;

		-moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%; -webkit-transition: all 0.3s ease;  -moz-transition: all 0.2s ease; 	 -o-transition: all 0.2s ease; transition: all 0.2s ease; }

.carousel-profiles li:hover { border: 3px solid #fff; -webkit-animation: pulse ease-in-out 1 normal 500ms; -moz-animation: pulse ease-in-out 1 normal 500ms; -ms-animation: pulse ease-in-out 1 normal 500ms;

		-o-animation: pulse ease-in-out 1 normal 500ms; animation: pulse ease-in-out 1 normal 500ms; }

.carousel-profiles img { -moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%; }

.carousel-profiles.responsive { width: auto; margin-left: 0; }


.banner {
    position: relative;
    width: 100%;
    float: left;
} 
.coutter {
    position: absolute;
    width: 100%;
    float: left;
    background: rgba(0, 0, 0, 0.5);
    padding: 15px 0;
    bottom: 0;
    left: 0;
    z-index: 10;
}
.orbit { margin-bottom:0px !important;}
.article-media {
    margin-bottom: 0px !important; 
}

.work-holder {
    width: 100%;
    float: left;
    text-align: center;
    padding: 10px 0;
    position: relative;
    /* top: -55px; */
}
.work-icon {
    background: #b0080b;
    width: 60px;
    margin: 0 auto;
    height: 60px;
    vertical-align: middle;
    position: absolute;
    color: #fff;
    border-radius: 100%;
    font-size: 30px;
    left: 42%;
    top: -50px;
}
.work-icon i {
    vertical-align: middle;
    line-height: 70px;
}
.work-cont {
    font-size: 16px;
    color: #fff;
    margin-bottom: 5px;
    margin-top: 5px;
    position: relative;
}
.work-title {
    color: #fff;
    font-size: 20px;
}








/* -----------------------------------------

   03. Call To Actions Section

----------------------------------------- */



#call-to-actions { padding-top: 60px; padding-bottom: 30px; text-align: center; background: #f8f8f8 url(../images/patterns/gray_pattern.gif); }

#call-to-actions .section-title {  opacity: 1; font-family: 'Yesteryear', cursive; font-size: 68px; }

#call-to-actions .lead {  margin-bottom: 40px; opacity: 1; }

#call-to-actions .alert { background-color: #389175; border: 1px solid #389175; }

#call-to-actions .alert:hover,

#call-to-actions .alert:focus { background: #b21c20; border: 1px solid #b21c20; }

#call-to-actions .take-action { width: auto; margin: 0 auto; display: inline-block; margin-bottom: 40px; }

#call-to-actions .large.button i {padding: 0; margin: 0; font-size: 20px; line-height: 12px; }

#call-to-actions .large.button.icon { padding: 15px 5px 16px; }

#call-to-actions .large.button.disabled { border: 1px solid #d8d7d7; background: #e8e7e7;  box-shadow: -1px 1px 1px #fafafa; color: #fff; }

#call-to-actions .or-block { display: inline-block; padding: 15px 5px 16px; font-style: italic; float: left; }

.map-bg { background: url(../images/map-bg.png) center 210px no-repeat; }



/*** Status Icons ***/

.status {	text-align: center; position:relative; bottom: 0px;  -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out;

		-ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; }

.status:hover { bottom:5px;  }

.status:hover .icon[data-animation=pulse] img {

		-webkit-animation: pulse ease-in-out 1 normal 500ms; -moz-animation: pulse ease-in-out 1 normal 500ms; -ms-animation: pulse ease-in-out 1 normal 500ms;

		-o-animation: pulse ease-in-out 1 normal 500ms; animation: pulse ease-in-out 1 normal 500ms; }

.status .block-grid li { float: none; font-size: 18px; color: #8b8b8b; min-height: 60px; }

.status .block-grid li.title { font-size: 35.5px; min-height: 22px; }











/* -----------------------------------------

   04. Video Section

----------------------------------------- */



iframe { border: none; }

#markerPoint {}

#video { display: none; margin-bottom: 40px; background: #000; box-shadow: 0 0  10px #777; }

#video .central { position: relative; background: url(../images/loading_dark.gif) center center no-repeat; }

#video .central a#videoClose { position: absolute; right: 40px; bottom: 43px; width: 34px; height: 34px; z-index: 9999; }








.orbit img.fluid-placeholder {
    visibility: hidden;
    position: static;
    display: block;
    width: auto !important;
}
.timer {
    display: none;
}


/* -----------------------------------------

   05. Feature Text

----------------------------------------- */

.f-links {
    padding: 20px 0;
    border-top: solid 1px #ddd;
}
.pd12 {
    padding: 12px 0;
    width: 100%;
    float: left;
}

#feature-text {
    /* margin-bottom: 20px; */
    padding-top: 60px;
    padding-bottom: 20px;
}

#feature-text h2 { font-family: 'Yesteryear', cursive; font-size: 46px; color: #000; }

#feature-text a.imagelink { display:block; position:relative; }

#feature-text a.imagelink .overlay { position:absolute; border-radius: 100%; -moz-border-radius: 100%; -webkit-border-radius: 100%; top:0; left:0; width: 100%; height: 100%; background:rgba(18,184,186,0); z-index:90;

		-webkit-transition:background 0.4s cubic-bezier(0.19,1,0.22,1);

		-moz-transition:background 0.4s cubic-bezier(0.19,1,0.22,1);

		-ms-transition:background 0.4s cubic-bezier(0.19,1,0.22,1);

		-o-transition:background 0.4s cubic-bezier(0.19,1,0.22,1);

		transition:background 0.4s cubic-bezier(0.19,1,0.22,1); }

#feature-text a.imagelink .read { color:rgba(255,255,255,0); position:absolute; top:50%; left:50%; display:block; z-index:100; width: 60px; height: 60px; line-height: 60px; text-align: center;

		font-size: 2em; font-weight: bold; margin: -30px 0px 0px -30px; -webkit-transition: ease 0.7s; -moz-transition: ease 0.7s; -o-transition: ease 0.7s; transition: ease 0.7s; }

#feature-text a.imagelink:hover .read { color:#fff; }

#feature-text a.imagelink:hover .overlay { background:rgba(0,0,0,0.2); }

#feature-text ul { text-align: center;  display: inline-block;  }

#feature-text .circle { width: 180px; height: 180px; margin: 30px auto; }

#feature-text .circle img { margin: 0 auto 0 auto; display: block; width: 180px; height: 180px; z-index: 10;

    transition: all .3s; -moz-transition: all .3s; -webkit-transition: all .3s; -o-transition: all .3s;

		border-radius: 100%; -moz-border-radius: 100%; -webkit-border-radius: 100%; }

#feature-text .circle:hover img {

    -moz-transform: scale(1.1); -webkit-transform: scale(1.1); -o-transform: scale(1.1);

    transform: scale(1.1); -ms-transform: scale(1.1);

    filter: progid:DXImageTransform.Microsoft.Matrix(sizingMethod='auto expand', M11=1, M12=-0, M21=0, M22=1); }

		

/* Small fix for IE8 */

.lt-ie9 #feature-text a.imagelink .read,

.lt-ie9 #feature-text a.imagelink:hover .read { display: none; }









/* -----------------------------------------

   06. Testimonials

----------------------------------------- */



.testimonials-carousel { margin-bottom: 10px; padding-top: 10px;  position: relative; min-height: 140px; }

.testimonials-carousel li { text-align: center; padding: 0; background: none; list-style: none; }

.quote-content { margin: 14px; font-size: 17px; line-height: 1.6; font-style: italic; }

.quote-author { margin-top: 12px; font-size: 11px; }

.author-description { color: #aaa; }











/* -----------------------------------------

   07. Support & Newsletter

----------------------------------------- */



#support { background: #eaeaea url(../images/patterns/gray_pattern.gif); padding-top: 40px; padding-bottom: 20px; border-top: 10px solid #fafafa; }

#newsletter-form #result {}











/* -----------------------------------------

   08. Footer

----------------------------------------- */



#footer { background: #171717 url(../images/patterns/black_pattern.gif); padding-top: 40px; padding-bottom: 40px; }

#footer h5 { color: #777; margin-bottom: 20px; }

#footer hr { border: solid #333; border-width: 1px 0 0; }

#footer .section { margin-bottom: 10px; }



/*** Social Icons ***/

.footer-social-icons a { color: #777; float: left; display: inline-block; margin-right: 5px; }



/*** Twitter Feed ***/

.twitter-article {}

.twitter-text {}

.tweetprofilelink { margin-right: 5px; }

.tweet-time a { padding: 1px 4px 2px; font-size: 11px; text-align: center; text-decoration: none; line-height: 1; white-space: nowrap; display: inline; position: relative; bottom: 1px; color: #9a9a9a; background: #333;

		-webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; }



/*** Latest Blog ***/

.latest-blog li { list-style: none; display: inline-block; width: 100%; margin-bottom: 10px; }

.latest-blog .avatar { width: 56px; height: 56px; padding: 3px; background: #777; display: inline-block; float: left; margin-right: 10px;

border-radius: 100%; -moz-border-radius: 100%; -webkit-border-radius: 100%; }

.latest-blog .avatar:hover { background: #389175; padding: 0;

		-webkit-animation: pulse ease-in-out 1 normal 500ms; -moz-animation: pulse ease-in-out 1 normal 500ms; -ms-animation: pulse ease-in-out 1 normal 500ms;

		-o-animation: pulse ease-in-out 1 normal 500ms; animation: pulse ease-in-out 1 normal 500ms;

		border: 3px solid #389175; }

.latest-blog img { width: 50px; height: 50px; display: block;

border-radius: 100%; -moz-border-radius: 100%; -webkit-border-radius: 100%; }



/*** Newsletter Form ***/

#result { font-weight: bold; }











/* -----------------------------------------

   Boxed Page

----------------------------------------- */

.page { /*border: 1px solid #ddd; */background: #fff; box-shadow: 0 0 3px rgba(153, 153, 153, 0.1); max-width: 1170px; min-width: 300px; margin: 0 auto; }

.boxed-style {}











/* -----------------------------------------

   Wide Page

----------------------------------------- */

.wide-style { background: #fff;  margin: 0; max-width: none; }











/* -----------------------------------------

   09. Animations

----------------------------------------- */



@-webkit-keyframes pulse {

	0% { -webkit-transform: scale(1); } 

	33% { -webkit-transform: scale(0.9); }

	66% { -webkit-transform: scale(1.1); }

	100% { -webkit-transform: scale(1); }

}

@-moz-keyframes pulse {

	0% { -moz-transform: scale(1); }    

	33% { -moz-transform: scale(0.9); }

	66% { -moz-transform: scale(1.1); }

	100% { -moz-transform: scale(1); }

}

@-ms-keyframes pulse {

	0% { -ms-transform: scale(1); } 

	33% { -ms-transform: scale(0.9); }

	66% { -ms-transform: scale(1.1); }

	100% { -ms-transform: scale(1); }

}

@-o-keyframes pulse {

	0% { -o-transform: scale(1); }  

	33% { -o-transform: scale(0.9); }

	66% { -o-transform: scale(1.1); }

	100% { -o-transform: scale(1); }

}

@keyframes pulse {

	0% { transform: scale(1); } 

	33% { transform: scale(0.9); }

	66% { transform: scale(1.1); }

	100% { transform: scale(1); }

}











/* -----------------------------------------

   10. Mobile Specific

----------------------------------------- */



@media only screen and (max-width: 767px) { .class-name {} }



/* Very large display targeting */

@media only screen and (min-width: 1441px) { .class-name {} }

 

/* Medium display targeting */

@media only screen and (max-width: 1279px) and (min-width: 768px) { .class-name {} }

 

/* Small display targeting */

@media only screen and (max-width: 767px) {

	.status .icon { min-height: inherit; }

	#call-to-actions .large.button {  }

	h1 { margin-bottom: 20px; }

	

	#call-to-actions,

	#feature-text { padding-top: 20px; }

	.form-header .lead { margin-bottom: 0; }

	.form-search .mobile-four label { line-height: 12px; padding-top: 10px; }

	.testimonials_carousel { min-height: inherit; }

	.button-group.expand li { width: 100%; }

	.boxed-style { padding-top: 0; padding-bottom: 0; }

	#footer .section { margin-bottom: 40px; }

	#btnGoUp { display: none; }

	}

 

/* Orientation targeting */

@media screen and (orientation: landscape) { .class-name {} }

@media screen and (orientation: portrait) { .class-name {} }

 

/* Specific overrides for elements that require something other than display: block */

@media only screen and (max-width: 1279px) and (min-width: 768px) {.class-name {} }

@media only screen and (max-width: 767px) { .class-name {} }



/* 1280 tablet ------------ */

@media only screen and (max-device-width: 1280px) { .class-name {} }



/* Covering almost all ----- */

@media only screen and (max-device-width: 800px), only screen and (device-width: 1024px) and (device-height: 600px), only screen and (width: 1280px) and (orientation: landscape), only screen and (device-width: 800px), only screen and (max-width: 767px) { .class-name {} }



/* Between Medium and Small */

@media only screen and (max-width: 1279px) and (min-width: 768px) { .class-name {} }



/* Small Devices ------------ */

@media only screen and (max-width: 767px) { .class-name {} }



/* Topbar Specific Breakpoint that you can customize */

@media only screen and (max-width: 940px) { .class-name {} }















