@import url("fonts.css");

@import 'https://fonts.googleapis.com/css?family=Muli';



@font-face {

  font-family: 'Asap-Bold';

  src: url("../fonts/new_font/Asap-Bold.woff2") format("woff2"), url("../fonts/new_font/Asap-Bold.woff") format("woff");

  font-weight: normal;

  font-style: normal; }

@font-face {

  font-family: 'Asap-BoldItalic';

  src: url("../fonts/new_font/Asap-BoldItalic.woff2") format("woff2"), url("../fonts/new_font/Asap-BoldItalic.woff") format("woff");

  font-weight: normal;

  font-style: normal; }

@font-face {

  font-family: 'Asap-Italic';

  src: url("../fonts/new_font/Asap-Italic.woff2") format("woff2"), url("../fonts/new_font/Asap-Italic.woff") format("woff");

  font-weight: normal;

  font-style: normal; }

@font-face {

  font-family: 'Asap-Medium';

  src: url("../fonts/new_font/Asap-Medium.woff2") format("woff2"), url("../fonts/new_font/Asap-Medium.woff") format("woff");

  font-weight: normal;

  font-style: normal; }

@font-face {

  font-family: 'Asap-MediumItalic';

  src: url("../fonts/new_font/Asap-MediumItalic.woff2") format("woff2"), url("../fonts/new_font/Asap-MediumItalic.woff") format("woff");

  font-weight: normal;

  font-style: normal; }

@font-face {

  font-family: 'Asap-Regular';

  src: url("../fonts/new_font/Asap-Regular.woff2") format("woff2"), url("../fonts/new_font/Asap-Regular.woff") format("woff");

  font-weight: normal;

  font-style: normal; }

@font-face {

  font-family: 'TeXGyreTermes-Bold';

  src: url("../fonts/new_font/TeXGyreTermes-Bold.woff2") format("woff2"), url("../fonts/new_font/TeXGyreTermes-Bold.woff") format("woff");

  font-weight: normal;

  font-style: normal; }

@font-face {

  font-family: 'TeXGyreTermes-BoldItalic';

  src: url("../fonts/new_font/TeXGyreTermes-BoldItalic.woff2") format("woff2"), url("../fonts/new_font/TeXGyreTermes-BoldItalic.woff") format("woff");

  font-weight: normal;

  font-style: normal; }

@font-face {

  font-family: 'TeXGyreTermes-Italic';

  src: url("../fonts/new_font/TeXGyreTermes-Italic.woff2") format("woff2"), url("../fonts/new_font/TeXGyreTermes-Italic.woff") format("woff");

  font-weight: normal;

  font-style: normal; }

@font-face {

  font-family: 'TeXGyreTermes-Regular';

  src: url("../fonts/new_font/TeXGyreTermes-Regular.woff2") format("woff2"), url("../fonts/new_font/TeXGyreTermes-Regular.woff") format("woff");

  font-weight: normal;

  font-style: normal; }

  @font-face {

  font-family: 'OpenSans-R';

  src: url("../fonts/Open_Sans/OpenSans-Regular.ttf");

  font-weight:normal;

  font-style: normal; }

    @font-face {

  font-family: 'OpenSans-B';

  src: url("../fonts/Open_Sans/OpenSans-Bold.ttf");

  font-weight:normal;

  font-style: normal; }

/* ==========================================================================

HTML5 display definitions

========================================================================== */



/*

* Corrects `block` display not defined in IE 6/7/8/9 and Firefox 3.

*/



article, aside, details, figcaption, figure, footer, header, hgroup, nav,nav2, section, summary {

    display: block

}



/*

* Corrects `inline-block` display not defined in IE 6/7/8/9 and Firefox 3.

*/

audio, canvas, video {

    display: inline-block;

    *display: inline;

    *zoom: 1;

}



/*

* Prevents modern browsers from displaying `audio` without controls.

* Remove excess height in iOS 5 devices.

*/

audio:not([controls]) {

    display: none;

    height: 0;

}



/*

* Addresses styling for `hidden` attribute not present in IE 7/8/9, Firefox 3, * and Safari 4.

* Known issue:no IE 6 support.

*/

[hidden] {

    display: none

}



/* ==========================================================================

Base

========================================================================== */

/*

* 1. Corrects text resizing oddly in IE 6/7 when body `font-size` is set using

*    `em` units.

* 2. Prevents iOS text size adjust after orientation change, without disabling

*    user zoom.

*/



/* p{font-family: 'Avenir', Helvetica ;font-weight: normal;font-style: normal;} */



p{font-family: 'OpenSans-R';font-weight: normal;font-style: normal;}





html {

    font-size: 100%; /* 1 */

    -webkit-text-size-adjust: 100%; /* 2 */

    -ms-text-size-adjust: 100%; /* 2 */

}





/*

* Addresses `font-family` inconsistency between `textarea` and other form

* elements.

*/



/*

html, button, input, select, textarea {

    font-family: 'Avenir', Helvetica;font-weight: normal;font-style: normal;

}

*/



html, button, input, select, textarea {

    font-family: 'Asap-Regular', sans-serif;font-weight: normal;font-style: italic;

}



/*

html, body {

    overflow-x: hidden;

    width: 100%;

    font-family: 'Avenir', Helvetica;font-weight: normal;font-style: normal;

}

*/



html, body {

    overflow-x: hidden;

    width: 100%;

    font-family: 'Asap-Regular', sans-serif;font-weight: normal;font-style: normal;

}









/*

* Addresses margins handled incorrectly in IE 6/7.

*/

body {

    margin: 0;

    

    /* font-family: 'Avenir', Helvetica;font-weight: normal;font-style: normal; */

    font-family: 'Asap-Regular', sans-serif;font-weight: normal;font-style: normal; 

    

    background: url("../img/bg22.jpg") no-repeat center center fixed; 

    /* background: rgb(40, 70, 102) url('../img/hero-01.jpg') no-repeat center center */

  -webkit-background-size: cover;

  -moz-background-size: cover;

  -o-background-size: cover;

  background-size: cover;

  background-attachment: fixed !important;  

    

    

}



.container-fluid{}





/*

* Font Smoothing

*/

html, html a {

    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.004);

    -webkit-font-smoothing: antialiased;

}



/* ==========================================================================

Links

========================================================================== */

/*

* Addresses `outline` inconsistency between Chrome and other browsers.

*/



a:focus {

    outline: thin dotted;

    text-decoration: none;

}



/*

* Improves readability when focused and also mouse hovered in all browsers.

*/

a:active, a:hover {

    outline: 0;

    text-decoration: none;

}



/* ==========================================================================

Typography

========================================================================== */

/*

* Addresses font sizes and margins set differently in IE 6/7.

* Addresses font sizes within `section` and `article` in Firefox 4+, Safari 5, * and Chrome.

*/



h1 {

    margin: 0.67em 0;

    font-size: 2em;

}

h2 {

    margin: 0.83em 0;

    font-size: 1.5em;

}

h3 {

    margin: 1em 0;

    font-size: 1.17em;

}

h4 {

    margin: 1.33em 0;

    font-size: 1em;

}

h5 {

    margin: 1.67em 0;

    font-size: 0.83em;

}

h6 {

    margin: 2.33em 0;

    font-size: 0.75em;

}



/*

* Addresses styling not present in IE 7/8/9, Safari 5, and Chrome.

*/

abbr[title] {

    border-bottom: 1px dotted

}



/*

* Addresses style set to `bolder` in Firefox 3+, Safari 4/5, and Chrome.

*/

b, strong {

    font-weight: bold

}

blockquote {

    margin: 0px

}



/*

* Addresses styling not present in Safari 5 and Chrome.

*/

dfn {

    font-style: italic

}



/*

* Addresses styling not present in IE 6/7/8/9.

*/

mark {

    /*

    background: #ff0;

    color: #000;

    */

}



/*

* Addresses margins set differently in IE 6/7.

*/

p, pre {

    margin: 1em 0

}



/*

* Corrects font family set oddly in IE 6, Safari 4/5, and Chrome.

*/

code, kbd, pre, samp {

    font-size: 1em;

    font-family: 'Avenir', Helvetica;font-weight: normal;font-style: normal;

    _font-family: 'Avenir', Helvetica;font-weight: normal;font-style: normal;

}



/*

* Improves readability of pre-formatted text in all browsers.

*/

pre {

    white-space: pre;

    white-space: pre-wrap;

    word-wrap: break-word;

}



/*

* Addresses CSS quotes not supported in IE 6/7.

*/

q {

    quotes: none

}



/*

* Addresses `quotes` property not supported in Safari 4.

*/

q:before, q:after {

    content: '';

    content: none;

}

small {

    font-size: 75%

}



/*

* Prevents `sub` and `sup` affecting `line-height` in all browsers.

*/

sub, sup {

    position: relative;

    vertical-align: baseline;

    font-size: 75%;

    line-height: 0;

}

sup {

    top: -0.5em

}

sub {

    bottom: -0.25em

}

.poly-c{

    width: 100%;

    text-align: center;

    margin: 0 auto;

    margin-top: 15px;

}

.social {

    justify-content: center;

    margin: 15px 0;

}

.social .social-item + .social-item {

    margin-left: 1.9rem;

}

.social .social-item a {

    border-radius: 8px;

    font-size: 1.4rem;

    color: #fff;

    background-color: rgba(180, 168, 128, 1);

    width: 2.5rem;

    height: 2.5rem;

    display: flex;

    align-items: center;

    justify-content: center;

    

    transition: 0.3s;

}

.social .social-fb:hover a {

    background-color:#1877f2;

}

.social .social-ytb:hover a {

    background-color:#fe0000;

}

.promotion #modal01 .carousel-inner, .promotion #modal02 .carousel-inner, .promotion #modal03 .carousel-inner, .promotion #modal04 .carousel-inner{

    overflow-y: auto;

}

.parllaxpadding_one #modal01 .carousel-inner, .parllaxpadding_one #modal02 .carousel-inner, .parllaxpadding_one #modal03 .carousel-inner, .parllaxpadding_one #modal04 .carousel-inner, .parllaxpadding_one #modal05 .carousel-inner, .parllaxpadding_one #modal06 .carousel-inner, .parllaxpadding_one #modal07 .carousel-inner, .parllaxpadding_one #modal08 .carousel-inner, .parllaxpadding_one #modal09 .carousel-inner{

    /* overflow-y: auto; */

}

.parllaxpadding_one .carousel {

    width: 70%;

}

.modal-open .parllaxpadding_one .modal{

    overflow-y: hidden;

}

.parllaxpadding_one .modal .eng .modal-content {

    margin-top: 120px;

}

@media (max-width: 1499px){

  .parllaxpadding_one .modal .modal-content{

    margin-top: 145px;

  }

  .parllaxpadding_one .carousel-inner{

    height: 70vh;

  }

}

@media (max-width: 1199px){

  .parllaxpadding_one .carousel-inner {

    height: 65vh;

  }

}

.footer__bottom {

  background-color: #fff;

  padding: 30px 0;

}

.footer__text {

  color: #a17b8e;

}

.footer__text p {

  margin: 0;

}

.footer__text p + p {

  margin-top: 15px;

}

.footer__text .link {

  text-decoration: underline; 

  color: inherit;

  display: inline-block;

  -webkit-transition: all .3s ease;

  -o-transition: all .3s ease;

  transition: all .3s ease;

}

.footer__text .link:hover {

  color: #b4a880;

}

.footer__logo .logo {

  width: auto;

  max-height: 70px;

}

@media (max-width: 767px) {

  #logo_bct {

    width: auto;

    max-height: 70px;

  }

}

.section-policy {

  color: #673e4e;

}

.policy__block  {

  padding: 30px;

  background-color: #fff;

  margin: 50px 0;

}

.section-policy .policy__title {

  font-size: 32px;

  font-weight: bold;

}



.policy__item {

  font-size: 18px;

  text-align: justify;

}

.policy__item + .policy__item {

  margin-top: 20px;

}

.policy__item p {

  margin:  0;

}

.policy__item .title + .content {

  margin-top: 10px;

}

.policy__item .content p + p {

  margin-top: 5px;

}

.hotline {

  left: auto !important;

}

.clsHeader1{line-height: 1em;letter-spacing: .1em;}





.clsHeaderBigFont{font-size: 3em;}

.clsHeaderBigFont2{font-size: 4em;}



.clsHeaderSmallFont{font-size: 1.5em;text-transform: uppercase;}





/* .clsNormalFont {font-family: 'Avenir', Helvetica;font-size: 1em;} 

.clsNormalFont {font-family: 'Asap-Regular', sans-serif;font-size: 1em;}







.clsHeaderItalicFont {font-family:'TeXGyreTermes-Italic';}

.clsHeaderNormalFont {font-family: 'TeXGyreTermes-Regular';}



/*.clsHeaderItalicFontViet {font-family: 'TeXGyreTermes';font-weight: normal;font-style: normal;}*/

.clsHeaderItalicFontViet {font-family: 'TeXGyreTermes-Italic';}

.clsHeaderNormalFontViet  {font-family: 'TeXGyreTermes-Regular';}

/* ==========================================================================

Lists

========================================================================== */

/*

* Addresses margins set differently in IE 6/7.

*/



dl, menu, ol, ul {

    margin: 1em 0

}

dd {

    margin: 0 0 0 40px

}



/*

* Addresses paddings set differently in IE 6/7.

*/

menu, ol, ul {

    padding: 0

}



/*

* Corrects list images handled incorrectly in IE 7.

*/

nav ul, nav ol {

    list-style: none;

    list-style-image: none;

}



nav2 ul, nav2 ol {

    list-style: none;

    list-style-image: none;

}



/* ==========================================================================

Embedded content

========================================================================== */

/*

* 1. Removes border when inside `a` element in IE 6/7/8/9 and Firefox 3.

* 2. Improves image quality when scaled in IE 7.

*/



img {

    border: 0; /* 1 */

    -ms-interpolation-mode: bicubic; /* 2 */

}



/*

* Corrects overflow displayed oddly in IE 9.

*/

svg:not(:root) {

    overflow: hidden

}



/* ==========================================================================

Figures

========================================================================== */

/*

* Addresses margin not present in IE 6/7/8/9, Safari 5, and Opera 11.

*/



figure {

    margin: 0

}



/* ==========================================================================

Forms

========================================================================== */

/*

* Corrects margin displayed oddly in IE 6/7.

*/



form {

    margin: 0

}



/*

* Define consistent border, margin, and padding.

*/

fieldset {

    margin: 0 2px;

    padding: 0.35em 0.625em 0.75em;

    border: 1px solid #c0c0c0;

}



/*

* 1. Corrects color not being inherited in IE 6/7/8/9.

* 2. Corrects text not wrapping in Firefox 3.

* 3. Corrects alignment displayed oddly in IE 6/7.

*/

legend {

    padding: 0;

    border: 0; /* 1 */

    white-space: normal; /* 2 */

    *margin-left: -7px; /* 3 */

}



/*

* 1. Corrects font size not being inherited in all browsers.

* 2. Addresses margins set differently in IE 6/7, Firefox 3+, Safari 5, *    and Chrome.

* 3. Improves appearance and consistency in all browsers.

*/

button, input, select, textarea {

    margin: 0; /* 2 */

    vertical-align: baseline; /* 3 */

    font-size: 100%; /* 1 */

    *vertical-align: middle; /* 3 */

}



/*

* Addresses Firefox 3+ setting `line-height` on `input` using ` !important` in

* the UA stylesheet.

*/

button, input {

    line-height: normal

}



/*

* 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`

*    and `video` controls.

* 2. Corrects inability to style clickable `input` types in iOS.

* 3. Improves usability and consistency of cursor style between image-type

*    `input` and others.

* 4. Removes inner spacing in IE 7 without affecting normal text inputs.

*    Known issue:inner spacing remains in IE 6.

*/

button, html input[type="button"], /* 1 */

input[type="reset"], input[type="submit"] {

    cursor: pointer; /* 3 */

    -webkit-appearance: button; /* 2 */

    *overflow: visible; /* 4 */

}



/*

* Re-set default cursor for disabled elements.

*/

button[disabled], input[disabled] {

    cursor: default

}



/*

* 1. Addresses box sizing set to content-box in IE 8/9.

* 2. Removes excess padding in IE 8/9.

* 3. Removes excess padding in IE 7.

*    Known issue:excess padding remains in IE 6.

*/

input[type="checkbox"], input[type="radio"] {

    box-sizing: border-box; /* 1 */

    padding: 0; /* 2 */

    *height: 13px; /* 3 */

    *width: 13px; /* 3 */

}



/*

* 1. Addresses `appearance` set to `searchfield` in Safari 5 and Chrome.

* 2. Addresses `box-sizing` set to `border-box` in Safari 5 and Chrome

*    (include `-moz` to future-proof).

*/

input[type="search"] {

    /* 2 */

    box-sizing: content-box;

    -webkit-appearance: textfield; /* 1 */

    nowhitespace: afterproperty;

}



/*

* Removes inner padding and search cancel button in Safari 5 and Chrome

* on OS X.

*/

input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration {

    -webkit-appearance: none

}



/*

* Removes inner padding and border in Firefox 3+.

*/

button::-moz-focus-inner, input::-moz-focus-inner {

    padding: 0;

    border: 0;

}



/*

* 1. Removes default vertical scrollbar in IE 6/7/8/9.

* 2. Improves readability and alignment in all browsers.

*/

textarea {

    overflow: auto; /* 1 */

    vertical-align: top; /* 2 */

}



/* ==========================================================================

Tables

========================================================================== */

/*

* Remove most spacing between table cells.

*/



table {

    border-spacing: 0;

    border-collapse: collapse;

}



/* ==========================================================================

Global Styles

========================================================================== */

.group:after {

    content: "";

    display: table;

    clear: both;

}



/*

a {

    -webkit-transition-timing-function: ease-in-out;

    transition-timing-function: ease-in-out;

    -webkit-transition-duration: 300ms;

    transition-duration: 300ms;

    -webkit-transition-property: color, border-color, background-color;

    transition-property: color, border-color, background-color;

}

*/

.nopadding {

    margin: 0 !important;

    padding: 0 !important;

}

p {

    font-size: 1.1em;

}

a {

    color: #ffffff;

}

a:hover, a:focus {

    color: #ffffff;

    text-decoration: none;

}

.texture-overlay {

    

    /*

    position: absolute;

    top: 0px;

    left: 0px;

    width: 100%;

    height: 100%;

    background-image: url(../img/grid.png);

    

    */

}



 /* OSR - Begin changing arrows style */

.carousel-control .icon-next:before{content:'\232A'; font-size:26px;}

.carousel-control .icon-prev:before{content:'\2329'; font-size:26px;}

.glyphicon-menu-right:before{content:'\232A'; font-size:18px; }

/* OSR - End changing arrows style */







.clear{clear:both; padding:0!important; margin:0!important;}



 /* OSR - Begin - increasing the distance for fadInUp effect */

@keyframes fadeInUp {

  0% {

    opacity: 0;

    -webkit-transform: translateY(70px);

    -ms-transform: translateY(70px);

    transform: translateY(70px);

  }



  100% {

    opacity: 1;

    -webkit-transform: translateY(0);

    -ms-transform: translateY(0);

    transform: translateY(0);

  }

}



/* OSR - End - increasing the distance for fadInUp effect */



.artimp1{text-shadow: 0 0 10px #572d22;}

.artimp2{text-shadow: 0 0 3px #000;}

.artimp3{text-shadow: 0 0 3px #000;}

.artimp4{text-shadow: 0 0 3px #000;}

.artimp5{text-shadow: 0 0 3px #000;}



/* ==========================================================================

Buttons

========================================================================== */

.use-btn {

    display: inline-block;

    margin: 0 10px 10px 0;

    padding: 20px 50px;

    border-radius: 3px;

    background-color: #fff;

    color: #4b98a9;

    font-size: 16px;

}

.use-btn:hover, .use-btn:focus {

    background-color: #73d0da;

    color: #fff;

    text-decoration: none;

}

.learn-btn, .download-btn {

    display: inline-block;

    padding: 18px 46px;

    border: 2px solid #fff;

    border-radius: 3px;

    color: #fff;

    font-size: 16px;

}

.learn-btn:hover, .download-btn:hover, .learn-btn:focus, .download-btn:focus {

    border-color: #73d0da;

    color: #73d0da;

    text-decoration: none;

}

.read-more-btn {

    display: inline-block;

    color: #323a45;

    text-transform: uppercase;

    font-weight: 400;

}

.read-more-btn i, .download-btn i {

    margin-left: 5px

}

.showcase .download-btn {

    margin-top: 50px

}

.download .download-btn {

    margin-top: 25px

}





/* ==========================================================================

Navigation

========================================================================== */



/* OSR - Begin - Collapse menu for desktop */



.navbar-header {

  float: none;

}

.navbar-toggle {

  display: block;

}

.navbar-collapse.collapse {

  display: none!important;

}

.navbar-nav {

  float: none!important;

}

.navbar-nav>li {

  float: none;

}

.navbar-collapse.collapse.in{

  display:block !important;

}



/* OSR - End - Collapse menu for desktop */



/* OSR - Begin collapse Menu styling */

                

.navbar-nav > li{padding-left:40px;padding-right:40px;letter-spacing: 2px;}



.main-navbar .navbar-fixed-top {top: 0px;}



#imgBrandLogo {max-width:150px; }



.main-navbar .navbar.navbar-fixed-top {background: rgba(180, 168, 128, 1);border: none;}



.navbar-header{padding-top: 10px;padding-left: 0px;padding-right: 0;}



.main-navbar .navbar-nav > li > a {color: #333333;}



.main-navbar .navbar-nav > li > a:hover {color: #57b8ba;}



.main-navbar .navbar-nav > .active > a,

.main-navbar .navbar-nav > .active > a:hover,

.main-navbar .navbar-nav > .active > a:focus {

    color: #ffffff;

    background-color: #57b8ba;

    padding-left: 40px;

    padding-right: 40px;

}



.main-navbar .navbar-toggle  { background: transparent;border: none; }

.main-navbar .navbar-toggle:hover  { background: transparent;border: none; }



/* OSR - End collapse Menu styling */



 /* OSR - Begin Home Page Menu styling */

#divMenu{position: absolute;top:10px;z-index: 1;width:100%;padding-right: 12%;font-family: Didot;}

#divMenuInner{position: relative;float:right;width:200px;}





.nav-pills>li.active>a, .nav-pills>li.active>a:focus, .nav-pills>li.active>a:hover {color: #ffffff !important;background-color: #673e53;font-size: .9em;}



.nav-pills>li>a {color:#673e53;font-size: .9em;}

.nav-pills>li>a:hover {background-color:#b4a880;}

.nav-pills  > li > a:focus {color: #673e53;background: none;}



.nav-pills > li > a, .navbar-brand {padding-top:1px !important;padding-bottom:1px !important;height: auto;}



.nav{font-family: 'TeXGyreTermes-Regular'}

#mnuReg{margin-bottom: 5px;}

.icon-bar {height: 1px !important;}



/* OSR - End Home Page Menu styling */



#divLangToggle{

    position:absolute;

    margin-right:40px;

    top:25px;

    right:0px;

    font-size:.8em;

    letter-spacing: 1px;

    color: #fff;

}

#divLangToggle a{text-decoration: underline;}





/* OSR - Begin Carouse Control styling */

 .carousel-control.left, .carousel-control.right {

    background: none !important;

    color: #b4a880;

    border: none;

     background-image: none !important;

    top: 12%

}

@media only screen and (max-width: 760px) {

    .carousel-control.left, .carousel-control.right {

        top:16%;

    }

}

.carousel-control.left {color: #b4a880;}

.carousel-control.right { color: #b4a880;}



OSR OSR OSR 



/* OSR - End Carouse Control styling */



.wow {visibility: hidden;} /* OSR - If this is not specified, image first displays, then dispapears and then animation starts */



/* ==========================================================================

Hero

========================================================================== */

.hero {

    position: relative;

    /* padding: 60px 0 60px 0; 

    min-height: 800px; */

    /* background: rgb(40, 70, 102) url('../img/hero-01.jpg') no-repeat center center; 

    background-size: cover;*/

    color: #673e53;

    

}

.hero h1 {

    /* margin: 200px 0 45px 0; */

    font-weight: 300;

    font-size: 2em;

}

.hero h1 span {

    display: inline-block;

    color: #673e53;

}

#home {

    width: 100%;

    height: 100%;

}

.hero {

    width: 100%;

    height: 100%;

}

header i {

    margin-left: 5px

}



 #imgHomeSec4Right{width: 100%;height: auto;}

#imgHomeSec4Right-mobile{width: 100%;height: auto;}



#divHeroTxt{position: absolute;width:50%;top:19%;margin-left: -7%;}





#divTopLogo{position: absolute;padding-left: 130px;padding-top: 40px;}

#imgTopLogo{width:200px;height: auto;}





.clsBarOuter {position: absolute; background-color:none;width:100%;z-index:1;}



.clsBarInner {position: relative;width: 600px;height: auto;padding:15px 0px;  background-color: #b5a780;margin: 0 auto;letter-spacing: .2em;}

.clsBarInner  a {font-family: 'TeXGyreTermes-Regular';}



.clsBarOuter{z-index:100;}

.clsBarOuter a span{font-family: 'TeXGyreTermes-Regular' !important;}



.parllaxpadding{padding-top: 50px; padding-bottom: 50px;} 





/* ==========================================================================

OSR - Intro slider

========================================================================== */



.item{padding-left: 10%;padding-right: 10%;padding-top: 5%;padding-bottom: 5%;}



#secIntroSlider, #secLocationSlider,#secResidencesSlider,#secDeveloperSlider {background: url("../img/bg22.jpg") no-repeat center center; -webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;background-size: cover;}

.carousel.slide img {width:100%;height:auto;}



#divIntroSlideTxt1,#divIntroSlideTxt2{position: relative; width:90%;padding-top: 10%;margin: 0 auto;}

#divIntroSlideHeadTxt1{position: relative;padding-left:0%;}

#divIntroSlideHeadTxt2{position: relative;padding-left:0%;}



#divIntroSlideTxt1{width:100%;}



.carousel-control.right, .carousel-control.left {background-image:none;} /* Removing gradient */

@media(min-width: 751px) and (max-width: 767px) {

    .carousel-control.right, .carousel-control.left{

        margin-bottom: 100px;

    }

}

.carousel-control .icon-prev, .carousel-control .icon-next {font-size: 50px;margin-top: -25px;}



#IntroBarInner{top:-20px;}



#divIntroSlideHeadTxt1_2{padding-left: 0%;}

#divIntroSlideHeadTxt2_2{padding-left: 0%;}

#divIntroSlideTxt2{width: 100%;}



#imgVideo,#imgVideo2{margin: 0 auto;width:100%;height: auto;}

#SecVideo{padding-bottom: 0px;}

.fancybox-skin {background-color: transparent!important;}



/* ==========================================================================

OSR - Location Section

========================================================================== */



.parallax-window {min-height: 600px;background: transparent;/* background: rgba(200, 54, 54, 0.5); */ }



.parallax-right-shape{background:url(../img/rightsidebar.png) top right no-repeat;background-size: Auto 600px;}

.parallax-left-shape{background:url(../img/leftsidebar.png) top left no-repeat;background-size: Auto 600px;}



#locationParllaxWrap,#residencesParllaxWrap,#DeveloperParllaxWrap{margin: 0 auto;position: relative;padding: 0;height:600px;}





#divlocationParllaxTxtWrap,#divDeveloperParllaxTxtWrap{width:40%; margin: 0 auto;position: relative;pading:0;padding-top: 30px;color: #ffffff;}



#divlocationParllaxTxtWrap {width:34%;padding-top: 100px;}

#divLocPara{width:80%;margin: 0 auto;}

#divlocationParllaxTxtWrap_parent{background:url(../img/fadebg.png) top center no-repeat; background-size:100% 100%; padding-bottom:200px;}





#divLocParllaxTxt2,#divDevParllaxTxt2{position: relative;}







#LocationBarInner{top:-20px;}



#divLocSlideTxt1{position: relative; width:95%;padding-top: 10%;margin: 0 auto;}

#divLocSlideHeadTxt1{position: relative;padding-left:5%;}

#divLocSlideHeadTxt2{position: relative;padding-left:10%;}



#divLocSlideHeadTxt1_2{position: relative;padding-left:0%;}

#divLocSlideHeadTxt1_22{position: relative;padding-left:20%;}

.clsArtImpression{position: absolute;top:90%;padding-left: 20px;}



.clsArtImpression2{position: relative;top:550px;padding-left: 100px;}



.divLocSlideHeadTxt1VN{padding-left: 0px !important;} 

/* ==========================================================================

OSR - Residences Section

========================================================================== */

#residencesBarInner{top:-20px;}







#divResidencesParllaxTxtWrap{ position: relative;pading:0;padding-top: 10%;color: purple

;padding-left: 5%;}



#divResParllaxTxt1{position: relative;padding-left:25%;}

#divResParllaxTxt2{position: relative;padding-left:25%;}



#divResSlideTxt1{position: relative; width:90%;padding-top: 10%;margin: 0 auto;}

#divResSlideHeadTxt1{position: relative;padding-left:5%;}

#divResSlideHeadTxt2{position: relative;padding-left:15%;}

#divResSlideHeadTxt2_2{position: relative;padding-left:15%;}



#divResSlideTxt2{position: relative; width:90%;padding-top: 15%;margin: 0 auto;}

#divResSlideTxt3{position: relative; width:95%;padding-top: 15%;margin: 0 auto;}

/* ==========================================================================

OSR - Developer Section

========================================================================== */

#developerBarInner{top:-20px;}





#divDeveloperSlideTxt1,#divDeveloperSlideTxt2,#divDeveloperSlideTxt3,#divDeveloperSlideTxt4{position: relative; width:80%;padding-top: 10%;margin: 0 auto;}

#divDeveloperSlideHeadTxt1,#divDeveloperSlideHeadTxt2,#divDeveloperSlideHeadTxt3,#divDeveloperSlideHeadTxt4{position: relative;padding-left:0%;}

#divDeveloperSlideHeadTxt2{position: relative;padding-left:0%;}





#divDeveloperParllaxTxtWrap{padding-top: 100px;}





/* ==========================================================================

OSR - Template page

========================================================================== */



#divPgKeyOuterTxtWrap{position:absolute;white-space: nowrap;}









#divPgKeyTxtWrap{position:relative;top:-300px;width:88%;padding-left:40%; color: #0f2429;}

#divPgKeyVisHeadTxt1{text-align: left;} 

#divPgKeyVisParaTxt{width:70%;padding-left: 20px;}

#imgKeyVis-mobile{width: 100%;height: auto;}





#divIntroPgKeyTxtWrap{position:relative;top:-370px;width:100%;padding-left:30%; color: #0f2429;background-color: ;}

#divIntroPgKeyVisHeadTxt1{text-align: left;} 

#divIntroPgKeyVisHeadTxt2{padding-left: 10%;}



#imgIntroKeyVis-mobile{width: 100%;height: auto;}



#divLocPgKeyTxtWrap{position:relative;top:-550px;width:100%;padding-left:50%; color: white;}

#divLocPgKeyVisHeadTxt1{text-align: left;} 

#divLocPgKeyVisHeadTxt2 {padding-left: 20%;}

#imgLocKeyVis-mobile{width: 100%;height: auto;}





#divResPgKeyTxtWrap{position:relative;top:-400px;width:100%;padding-left:20%; color: white;}

#divResPgKeyVisHeadTxt1{text-align: left;} 

#divResPgKeyVisHeadTxt2{padding-left: 13%;}

#imgResKeyVis-mobile{width: 100%;height: auto;}



#divResPgKeyTxtWrap{width:500px!important;}







#divDevPgKeyTxtWrap{position:relative;top:-530px;width:100%;padding-left:13%; color: white;}

#divDevPgKeyVisHeadTxt1{text-align: left;} 

#divDevPgKeyVisHeadTxt2{padding-left: 7%;}

#imgDevKeyVis-mobile{width: 100%;height: auto;}





#divRegPgKeyTxtWrap{position:relative;top:-410px;width:100%;padding-left:15%; color: white;}

#divRegPgKeyVisHeadTxt1{text-align: left;} 

#divRegPgKeyVisHeadTxt2{padding-left: 30%;}

#imgRegKeyVis-mobile{width: 100%;height: auto;}



/*

#divPgKeyVisHeadTxt1{text-align: left;}

#divPgKeyVisParaTxt{width:70%;padding-left: 20px;}





*/

/* ==========================================================================

OSR - Intro page

========================================================================== */



.whitebg{background-color: white;}

#divIntroPgParaWrap{

    background-color: white;

    padding: 0;

    width: 60%;

    padding-top: 30px;padding-bottom: 50px;

    margin: 0 auto;

    

}



#imgIntroMid{padding-top:40px;margin:0 auto;width:54%;height: auto;}





/* ==========================================================================

OSR - Developer page

========================================================================== */

#secDeveloperPgPara{background-color: white;

    padding: 0;

    width: 90%;

    padding-top: 0px;padding-bottom: 50px;

    margin: 0 auto;}



/* ==========================================================================

OSR - Registration page

========================================================================== */

.clsRegistraionTitle{font-size: 1.5em !important;}





#divResCommLegend{width:60% !important;}





/* ==========================================================================

Video

========================================================================== */

section.video i {

    margin-right: 10px;

    color: #323a45;

    vertical-align: middle;

    font-size: 50px;

    -webkit-transition: color 300ms ease-in-out;

    transition: color 300ms ease-in-out;

}

section.video h1 {

    font-weight: 400;

    font-size: 20px;

}

section.video {

    padding: 60px 0;

    background-color: #f6f7f9;

}

section.video a {

    color: #323a45

}

section.video a:hover, section.video a:focus {

    color: #ffffff;

    text-decoration: none;

}

section.video a:hover i, section.video a:focus i {

    color: #ffffff;

}



/* ==========================================================================

Custom Slider Controls (Flickity)

========================================================================== */

.flickity-page-dots .dot {

    width: 13px;

    height: 13px;

    opacity: 1;

    background: transparent;

    border: 2px solid white;

    -webkit-transition: background 0.3s;

    transition: background 0.3s;

}

.flickity-page-dots .dot.is-selected {

    background: white;

}











/* ==========================================================================

Blockquote

========================================================================== */

blockquote {

    margin: 40px 0 0;

    padding: 0;

    border: none;

}

blockquote p {

    display: inline-block;

    margin: 0;

    padding: 0;

    width: 70%;

    vertical-align: top;

    font-style: italic;

}

blockquote .avatar {

    display: inline-block;

    margin-right: 20px;

    width: 64px;

    height: 64px;

    vertical-align: middle;

}

blockquote .logo-quote {

    display: inline-block;

    margin: 0 0 0 90px;

}









/* ==========================================================================

Footer

========================================================================== */

footer {

    padding: 30px 0;

    background-color: #673e53;

    clear: both;

    margin-bottom: 0;

    padding-bottom:0;

    color: #673e53;

}

footer p {

    color: #c7cacc !important;

    font-size: 10px !important;

     line-height: 15px !important;

}

footer ul {

    margin-top: 30px

}

footer li {

    float: left;

    margin-right: 15%;

    list-style: none;

    text-transform: uppercase;

    font-weight: 400;

}

footer li a {

    color: #3f6184

}

footer li:last-child {

    margin-right: 0

}

#text_color p{

    color: #673e53 !important;

}

#divF8logoCol b a{

    color: #9d9358;

    margin-left: 21px;

  }

.copyright {font-size: 1.2em;}



#ftBuild{height: auto !important; width: 100% !important;}

#f8logo{height: 30px; width: auto;padding-left: 5px;}

#caplandlogo{height: 70px;width: auto;}

#ascottlogo{height: 80px;width:auto;}

#ftrRowTwo,#ftrRowTwoMobile{background-color:white;padding-top:3%;padding-bottom:5%;}

#divF8logoCol{text-align: left;}

#divDevbyCol{text-align: right;padding-left:0px;}

#divMangedbycol{text-align: left;padding-left:30px;}

.left-margin{padding-left: 9%;}



#caplandlogoM{height: 60px; width: auto;}

#ascottlogoM{height: 80px; width: auto;}

#f8logoM{height: 20px; width: auto;}



/* ==========================================================================

Waypoints

========================================================================== */

.wp1, .wp2, .wp3, .wp4, .wp5, .wp6 {

    visibility: hidden

}

.bounceInLeft, .bounceInRight, .fadeInUp, .fadeInUpDelay, .fadeInDown, .fadeInUpD, .fadeInLeft, .fadeInRight, .bounceInDown {

    visibility: visible

}

.delay-05s {

    -webkit-animation-delay: 0.5s;

    animation-delay: 0.5s;

}

.delay-1s {

    -webkit-animation-delay: 1s;

    animation-delay: 1s;

}



.clsPurple{color: #673e53; }

.clsPurple2{color: #a17b8e; }



.clsGoldbg{background-color: #b4a880;}





/* OSR - BEGIN - Carousel fadeout transtion */





.carousel-fade .carousel-inner .item {

  opacity: 0;

  transition-property: opacity;

  transition-duration: 2s;

  transition-timing-function:linear;

}



.carousel-fade .carousel-inner .active {

  opacity: 1;

}



.carousel-fade .carousel-inner .active.left,

.carousel-fade .carousel-inner .active.right {

  left: 0;

  opacity: 0;

  z-index: 1;

}



.carousel-fade .carousel-inner .next.left,

.carousel-fade .carousel-inner .prev.right {

  opacity: 1;

}



.carousel-fade .carousel-control {

  z-index: 2;

}

.popup-slider-item, .popup-item, .popup-pro-item {

  position: relative;

}

.popup-slider-item, .popup-item, .popup-pro-item .title{

  position: absolute;

  top: 0;

  left: 0;

  color: #673e4e;

  font-size: 20px;

  font-weight: bold;

}

.popup-pro-item .title{

  position: absolute;

  top: 0;

  left: 0;

  color: #ffffff;

  font-size: 20px;

  font-weight: bold;

}

.popup-slider-item, .popup-item, .popup-pro-item img{

  padding-top: 3rem;

}

/*

WHAT IS NEW IN 3.3: "Added transforms to improve carousel performance in modern browsers."

now override the 3.3 new styles for modern browsers & apply opacity

*/

@media all and (transform-3d), (-webkit-transform-3d) {

    .carousel-fade .carousel-inner > .item.next,

    .carousel-fade .carousel-inner > .item.active.right {

      opacity: 0;

      -webkit-transform: translate3d(0, 0, 0);

              transform: translate3d(0, 0, 0);

    }

    .carousel-fade .carousel-inner > .item.prev,

    .carousel-fade .carousel-inner > .item.active.left {

      opacity: 0;

      -webkit-transform: translate3d(0, 0, 0);

              transform: translate3d(0, 0, 0);

    }

    .carousel-fade .carousel-inner > .item.next.left,

    .carousel-fade .carousel-inner > .item.prev.right,

    .carousel-fade .carousel-inner > .item.active {

      opacity: 1;

      -webkit-transform: translate3d(0, 0, 0);

              transform: translate3d(0, 0, 0);

    }

}



/* OSR - END - Carousel fadeout transtion */



/* OSR - Begin styling locaitons - amenties listing */



.amenitiesCircle{

    display: inline-block;

    margin-right: 6px;

    border-radius: 50% !important;



    text-align: center;

    font-size: 12px;

    padding-top: 4px;

    width: 23px;

    height: 23px;

    color: #fff !important;

}         

    .a1 {background-color: #a39183;}

    .a2{background-color: #64a9b0;}

    .a3{background-color: #737b86; }

    .a4{background-color: #b66e94;}

    .a5{background-color: #7d67af; }



/* OSR - End styling locaitons - amenties listing */



/* FEB 14 2017 - Mike */

.clsHeaderBigFont_vn{margin-right:6px!important; font-size: 2.1em;line-height: 1.1em;}

.clsHeaderSmallFont_vn{margin-right:6px!important; font-size: 1.1em;}





 /* APR 25 2017 - OSR */

.clsHeaderBigFontTitleCase{font-size: 2.1em;text-transform: capitalize !important;}

.clsHeaderSmallFontTitleCase{font-size: 1.1em;text-transform: capitalize;}

.grLoc1Viet{text-align: left !important;padding-left: 3%;}

.resiParlVnTxt2{padding-left: 6% !important;}

.grRes1Viet{text-align: left !important;padding-left: 0%;}

.divResSlideHeadTxt2Viet{padding-left:22%;}

.divDevParllaxTxt2Viet{padding-left:19%;}

.divRegPgKeyTxtWrapVN{padding-left:35%; }

#divIntroPgKeyVisHeadTxt2VN{padding-left: 18%;}

.locHeaderVNAlign{padding-left: 25%;}

.divDevPGTxt2Viet{padding-left:40%;}



/* POPUP ENG AND VN */



.media-thumb{

    height: 100%;

}



.modal-js-english,

.modal-js-vn{

    background: rgba(0,0,0,0.8);

}

.modal-js-english .modal-dialog .fixmodal,

.modal-js-vn .modal-dialog .fixmodal{

    /*top: 110px;*/

    top: -53px;

}

.modal-js-english .modal-dialog,

.modal-js-vn .modal-dialog{

    /*width: auto;*/

}



.modal-js-english .modal-dialog .modal-content.fixmodal,

.modal-js-vn .modal-dialog .modal-content.fixmodal{

    background: none !important;

    box-shadow: none !important;

    border:none !important;

}

.modal-js-english .modal-dialog .fixmodal .modal-body .img_tks img,

.modal-js-vn .modal-dialog .fixmodal .modal-body .img_tks img{

	width: 100% !important;

}

.modal-js-english .modal-dialog .fixmodal .modal-body .close,

.modal-js-vn .modal-dialog .fixmodal .modal-body .close{

    background: #000;

    color: #fff;

    border-radius: 50% !important;

    width: 36px;

    height: 36px;

    position: absolute;

    top: 0;

    right: 0;

    border:2px solid #fff !important;

    opacity: 1 !important;

}



.show_popup_en{

    display: block !important;

    opacity: 1;

}

.show_popup_vn{

    display: block !important;

    opacity: 1;

}

.carousel-inner>.item>a>img{

      /*height: 550px;*/

}



/*@media (min-width: 576px) and (max-width: 767px) {

    .modal-js-english .modal-dialog .fixmodal,

    .modal-js-vn .modal-dialog .fixmodal{

        top: 10%;

        padding: 50px !important;

    }

}

@media (min-width: 768px) and (max-width: 991px){

    .modal-js-english .modal-dialog .fixmodal,

    .modal-js-vn .modal-dialog .fixmodal{

        top: 10%;

        padding: 90px !important;

    }

}*/

@media (min-width: 992px){

    .modal-js-english .modal-dialog,

    .modal-js-vn .modal-dialog{

        width: 900px;

    }

    .modal-js-english .modal-dialog .fixmodal,

    .modal-js-vn .modal-dialog .fixmodal{

        /*top: 130px;*/

    }



    #msd-navbar, #main-navbar-cover, .navbar-toggle {

        display: none;

        

    }



    .main-menu {

        display: block !important;

    }

    

}

  .divTop2Logo_en{top: 94px!important;}

  .divHeroTxt_en{top: 17%!important;}



@media (max-width: 992px){

    #msd-navbar, #main-navbar-cover, .navbar-toggle {

        display: block;

        overflow: auto;

        background-color: #fff;

    }



    .main-menu {

        display: none;

    }



    .videopop {

        position: relative;

        width: 100%;

        padding-bottom: 56.25%;

        background-color: #000;

    }

}

@media screen and (max-width:1100px){

  #divHeroTxt {

    width: 35%;

    top: 18%;

    margin-left: 0%;

  }

  #divTop2Logo {

    top: 95px!important;

  }

  #divHeroTxt p {

    margin: 0;

  }

}

@media screen and (max-width:1366px){

    #divTop2Logo {

      top: 80px!important;

    }

    #divHeroTxt {

      top: 14% !important;

    }

}

@media (min-width: 1048px){

    #divTop2Logo {

        top: 60px!important;

    }

}

@media (min-width: 992px) {

    .videopop {

        position: relative;

        width: 100%;

        padding-bottom: 50%;

        background-color: #000;

    }



    .youtube-video {

        padding: 0 200px;

        background-color: #000 !important;

    }

}

@media screen and (max-width: 414px){

  .divHeroTxt_en{

        top: 5%!important;

  }

  .modal .modal-content{

    margin-top: 162px!important;

  }

  .modal-body .close{

    right: 4%!important;

  }



}

@media screen and (max-width: 375px){

  .divHeroTxt_en{

        top: 8%!important;

  }

  .carousel-control .glyphicon-chevron-left, .carousel-control .glyphicon-chevron-right, .carousel-control .icon-next, .carousel-control .icon-prev{

        top: 46%;

  }

}



@media (max-width: 768px) {

    .container {

      width: 100%;

    }

    .clsHeaderBigFont {

    font-size: 2em;

    }

    .clsHeaderSmallFont{

       font-size: 1em;

    }

    #divTop2Logo{

        top: 70px!important;

      }

      #divHeroTxt {

        top: 15%;

      }

}



@media (min-width: 768px) {

    .container{width:80%;}

}



.main-menu{

     margin-left: 180px; 

}



.main-menu ul{

    max-width: 90%;

}



.main-menu ul li {

    display: inline-block;

}



/* ----- Active menu----- */

#navbarNavDropdown .active a{ 

    color: #673e53; 

}

/* ----- Active menu----- */



.nav-item {

    padding: 0px 12px 10px 12px;

}



.nav-item .nav-link:hover {

    color: #673e53;

    transition: .9s;

}



.nav-item:hover > .nav-link {

    color: #673e53;

    transition: .9s;

}



.nav-item .nav-link {

    

}



.dropdown .dropdown-menu {

    border: none;

    box-shadow: none;

    margin-top: 0px;

}



.dropdown:hover>.dropdown-menu {

    display: block;

}



.dropdown .dropdown-menu a {

    color: #000 !important;

}



.dropdown .dropdown-menu a:hover {

    background-color: #673e53;

    color: #fff !important;

}



.dropdown-menu .dropdown-item {

    display: block;

    padding: 5px 10px;

}





.videopop iframe {

    margin: auto auto;

    position: absolute;

    top: 0;

    bottom: 0;

    left: 0;

    right: 0;

    width: 100%;

    height: 100%;

}



.hightlight {

    background-color: #f6f7f9;

    padding: 5px;

    margin: 10px;

    color: #000;

}

.fix-bottom {

    width: 120px;

    bottom: 40vh;

    right: 20px;

    margin: auto 0 0 auto;

    text-align: right;

    position: fixed;

    left: 0;

    z-index: 1030;

}

.bt-register-now img {

    width: 120px;

||||||| .r221

@import url("fonts.css");

@import 'https://fonts.googleapis.com/css?family=Muli';



/* ==========================================================================

HTML5 display definitions

========================================================================== */



/*

* Corrects `block` display not defined in IE 6/7/8/9 and Firefox 3.

*/



article, aside, details, figcaption, figure, footer, header, hgroup, nav,nav2, section, summary {

    display: block

}



/*

* Corrects `inline-block` display not defined in IE 6/7/8/9 and Firefox 3.

*/

audio, canvas, video {

    display: inline-block;

    *display: inline;

    *zoom: 1;

}



/*

* Prevents modern browsers from displaying `audio` without controls.

* Remove excess height in iOS 5 devices.

*/

audio:not([controls]) {

    display: none;

    height: 0;

}



/*

* Addresses styling for `hidden` attribute not present in IE 7/8/9, Firefox 3, * and Safari 4.

* Known issue:no IE 6 support.

*/

[hidden] {

    display: none

}



/* ==========================================================================

Base

========================================================================== */

/*

* 1. Corrects text resizing oddly in IE 6/7 when body `font-size` is set using

*    `em` units.

* 2. Prevents iOS text size adjust after orientation change, without disabling

*    user zoom.

*/



/* p{font-family: 'Avenir', Helvetica ;font-weight: normal;font-style: normal;} */



p{font-family: 'Asap-Regular', sans-serif;font-weight: normal;font-style: normal;}





html {

    font-size: 100%; /* 1 */

    -webkit-text-size-adjust: 100%; /* 2 */

    -ms-text-size-adjust: 100%; /* 2 */

}





/*

* Addresses `font-family` inconsistency between `textarea` and other form

* elements.

*/



/*

html, button, input, select, textarea {

    font-family: 'Avenir', Helvetica;font-weight: normal;font-style: normal;

}

*/



html, button, input, select, textarea {

    font-family: 'Asap-Regular', sans-serif;font-weight: normal;font-style: normal;

}



/*

html, body {

    overflow-x: hidden;

    width: 100%;

    font-family: 'Avenir', Helvetica;font-weight: normal;font-style: normal;

}

*/



html, body {

    overflow-x: hidden;

    width: 100%;

    font-family: 'Asap-Regular', sans-serif;font-weight: normal;font-style: normal;

}









/*

* Addresses margins handled incorrectly in IE 6/7.

*/

body {

    margin: 0;

    

    /* font-family: 'Avenir', Helvetica;font-weight: normal;font-style: normal; */

    font-family: 'Asap-Regular', sans-serif;font-weight: normal;font-style: normal; 

    

    background: url("../img/bg22.jpg") no-repeat center center fixed; 

    /* background: rgb(40, 70, 102) url('../img/hero-01.jpg') no-repeat center center */

  -webkit-background-size: cover;

  -moz-background-size: cover;

  -o-background-size: cover;

  background-size: cover;

  background-attachment: fixed !important;  

    

    

}



.container-fluid{}





/*

* Font Smoothing

*/

html, html a {

    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.004);

    -webkit-font-smoothing: antialiased;

}



/* ==========================================================================

Links

========================================================================== */

/*

* Addresses `outline` inconsistency between Chrome and other browsers.

*/



a:focus {

    outline: thin dotted;

    text-decoration: none;

}



/*

* Improves readability when focused and also mouse hovered in all browsers.

*/

a:active, a:hover {

    outline: 0;

    text-decoration: none;

}



/* ==========================================================================

Typography

========================================================================== */

/*

* Addresses font sizes and margins set differently in IE 6/7.

* Addresses font sizes within `section` and `article` in Firefox 4+, Safari 5, * and Chrome.

*/



h1 {

    margin: 0.67em 0;

    font-size: 2em;

}

h2 {

    margin: 0.83em 0;

    font-size: 1.5em;

}

h3 {

    margin: 1em 0;

    font-size: 1.17em;

}

h4 {

    margin: 1.33em 0;

    font-size: 1em;

}

h5 {

    margin: 1.67em 0;

    font-size: 0.83em;

}

h6 {

    margin: 2.33em 0;

    font-size: 0.75em;

}



/*

* Addresses styling not present in IE 7/8/9, Safari 5, and Chrome.

*/

abbr[title] {

    border-bottom: 1px dotted

}



/*

* Addresses style set to `bolder` in Firefox 3+, Safari 4/5, and Chrome.

*/

b, strong {

    font-weight: bold

}

blockquote {

    margin: 0px

}



/*

* Addresses styling not present in Safari 5 and Chrome.

*/

dfn {

    font-style: italic

}



/*

* Addresses styling not present in IE 6/7/8/9.

*/

mark {

    /*

    background: #ff0;

    color: #000;

    */

}



/*

* Addresses margins set differently in IE 6/7.

*/

p, pre {

    margin: 1em 0

}



/*

* Corrects font family set oddly in IE 6, Safari 4/5, and Chrome.

*/

code, kbd, pre, samp {

    font-size: 1em;

    font-family: 'Avenir', Helvetica;font-weight: normal;font-style: normal;

    _font-family: 'Avenir', Helvetica;font-weight: normal;font-style: normal;

}



/*

* Improves readability of pre-formatted text in all browsers.

*/

pre {

    white-space: pre;

    white-space: pre-wrap;

    word-wrap: break-word;

}



/*

* Addresses CSS quotes not supported in IE 6/7.

*/

q {

    quotes: none

}



/*

* Addresses `quotes` property not supported in Safari 4.

*/

q:before, q:after {

    content: '';

    content: none;

}

small {

    font-size: 75%

}



/*

* Prevents `sub` and `sup` affecting `line-height` in all browsers.

*/

sub, sup {

    position: relative;

    vertical-align: baseline;

    font-size: 75%;

    line-height: 0;

}

sup {

    top: -0.5em

}

sub {

    bottom: -0.25em

}







.clsHeader1{line-height: 1em;letter-spacing: .1em;}





.clsHeaderBigFont{font-size: 3em;}

.clsHeaderBigFont2{font-size: 4em;}



.clsHeaderSmallFont{font-size: 1.5em;text-transform: uppercase;}





/* .clsNormalFont {font-family: 'Avenir', Helvetica;font-size: 1em;} */

.clsNormalFont {font-family: 'Asap-Regular', sans-serif;font-size: 1em;}







.clsHeaderItalicFont {font-family:'TeXGyreTermes-Italic';}

.clsHeaderNormalFont {font-family: 'TeXGyreTermes-Regular';}



/*.clsHeaderItalicFontViet {font-family: 'TeXGyreTermes';font-weight: normal;font-style: normal;}*/

.clsHeaderItalicFontViet {font-family: 'TeXGyreTermes-Italic';}

.clsHeaderNormalFontViet  {font-family: 'TeXGyreTermes-Regular';}

/* ==========================================================================

Lists

========================================================================== */

/*

* Addresses margins set differently in IE 6/7.

*/



dl, menu, ol, ul {

    margin: 1em 0

}

dd {

    margin: 0 0 0 40px

}



/*

* Addresses paddings set differently in IE 6/7.

*/

menu, ol, ul {

    padding: 0

}



/*

* Corrects list images handled incorrectly in IE 7.

*/

nav ul, nav ol {

    list-style: none;

    list-style-image: none;

}



nav2 ul, nav2 ol {

    list-style: none;

    list-style-image: none;

}



/* ==========================================================================

Embedded content

========================================================================== */

/*

* 1. Removes border when inside `a` element in IE 6/7/8/9 and Firefox 3.

* 2. Improves image quality when scaled in IE 7.

*/



img {

    border: 0; /* 1 */

    -ms-interpolation-mode: bicubic; /* 2 */

}



/*

* Corrects overflow displayed oddly in IE 9.

*/

svg:not(:root) {

    overflow: hidden

}



/* ==========================================================================

Figures

========================================================================== */

/*

* Addresses margin not present in IE 6/7/8/9, Safari 5, and Opera 11.

*/



figure {

    margin: 0

}



/* ==========================================================================

Forms

========================================================================== */

/*

* Corrects margin displayed oddly in IE 6/7.

*/



form {

    margin: 0

}



/*

* Define consistent border, margin, and padding.

*/

fieldset {

    margin: 0 2px;

    padding: 0.35em 0.625em 0.75em;

    border: 1px solid #c0c0c0;

}



/*

* 1. Corrects color not being inherited in IE 6/7/8/9.

* 2. Corrects text not wrapping in Firefox 3.

* 3. Corrects alignment displayed oddly in IE 6/7.

*/

legend {

    padding: 0;

    border: 0; /* 1 */

    white-space: normal; /* 2 */

    *margin-left: -7px; /* 3 */

}



/*

* 1. Corrects font size not being inherited in all browsers.

* 2. Addresses margins set differently in IE 6/7, Firefox 3+, Safari 5, *    and Chrome.

* 3. Improves appearance and consistency in all browsers.

*/

button, input, select, textarea {

    margin: 0; /* 2 */

    vertical-align: baseline; /* 3 */

    font-size: 100%; /* 1 */

    *vertical-align: middle; /* 3 */

}



/*

* Addresses Firefox 3+ setting `line-height` on `input` using ` !important` in

* the UA stylesheet.

*/

button, input {

    line-height: normal

}



/*

* 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`

*    and `video` controls.

* 2. Corrects inability to style clickable `input` types in iOS.

* 3. Improves usability and consistency of cursor style between image-type

*    `input` and others.

* 4. Removes inner spacing in IE 7 without affecting normal text inputs.

*    Known issue:inner spacing remains in IE 6.

*/

button, html input[type="button"], /* 1 */

input[type="reset"], input[type="submit"] {

    cursor: pointer; /* 3 */

    -webkit-appearance: button; /* 2 */

    *overflow: visible; /* 4 */

}



/*

* Re-set default cursor for disabled elements.

*/

button[disabled], input[disabled] {

    cursor: default

}



/*

* 1. Addresses box sizing set to content-box in IE 8/9.

* 2. Removes excess padding in IE 8/9.

* 3. Removes excess padding in IE 7.

*    Known issue:excess padding remains in IE 6.

*/

input[type="checkbox"], input[type="radio"] {

    box-sizing: border-box; /* 1 */

    padding: 0; /* 2 */

    *height: 13px; /* 3 */

    *width: 13px; /* 3 */

}



/*

* 1. Addresses `appearance` set to `searchfield` in Safari 5 and Chrome.

* 2. Addresses `box-sizing` set to `border-box` in Safari 5 and Chrome

*    (include `-moz` to future-proof).

*/

input[type="search"] {

    /* 2 */

    box-sizing: content-box;

    -webkit-appearance: textfield; /* 1 */

    nowhitespace: afterproperty;

}



/*

* Removes inner padding and search cancel button in Safari 5 and Chrome

* on OS X.

*/

input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration {

    -webkit-appearance: none

}



/*

* Removes inner padding and border in Firefox 3+.

*/

button::-moz-focus-inner, input::-moz-focus-inner {

    padding: 0;

    border: 0;

}



/*

* 1. Removes default vertical scrollbar in IE 6/7/8/9.

* 2. Improves readability and alignment in all browsers.

*/

textarea {

    overflow: auto; /* 1 */

    vertical-align: top; /* 2 */

}



/* ==========================================================================

Tables

========================================================================== */

/*

* Remove most spacing between table cells.

*/



table {

    border-spacing: 0;

    border-collapse: collapse;

}



/* ==========================================================================

Global Styles

========================================================================== */

.group:after {

    content: "";

    display: table;

    clear: both;

}



/*

a {

    -webkit-transition-timing-function: ease-in-out;

    transition-timing-function: ease-in-out;

    -webkit-transition-duration: 300ms;

    transition-duration: 300ms;

    -webkit-transition-property: color, border-color, background-color;

    transition-property: color, border-color, background-color;

}

*/

.nopadding {

    margin: 0 !important;

    padding: 0 !important;

}

p {

    font-size: 1em;

}

a {

    color: #ffffff;

}

a:hover, a:focus {

    color: #ffffff;

    text-decoration: none;

}

.texture-overlay {

    

    /*

    position: absolute;

    top: 0px;

    left: 0px;

    width: 100%;

    height: 100%;

    background-image: url(../img/grid.png);

    

    */

}



 /* OSR - Begin changing arrows style */

.carousel-control .icon-next:before{content:'\232A'; font-size:26px;}

.carousel-control .icon-prev:before{content:'\2329'; font-size:26px;}

.glyphicon-menu-right:before{content:'\232A'; font-size:18px; }

/* OSR - End changing arrows style */







.clear{clear:both; padding:0!important; margin:0!important;}



 /* OSR - Begin - increasing the distance for fadInUp effect */

@keyframes fadeInUp {

  0% {

    opacity: 0;

    -webkit-transform: translateY(70px);

    -ms-transform: translateY(70px);

    transform: translateY(70px);

  }



  100% {

    opacity: 1;

    -webkit-transform: translateY(0);

    -ms-transform: translateY(0);

    transform: translateY(0);

  }

}



/* OSR - End - increasing the distance for fadInUp effect */



.artimp1{text-shadow: 0 0 10px #572d22;}

.artimp2{text-shadow: 0 0 3px #000;}

.artimp3{text-shadow: 0 0 3px #000;}

.artimp4{text-shadow: 0 0 3px #000;}

.artimp5{text-shadow: 0 0 3px #000;}



/* ==========================================================================

Buttons

========================================================================== */

.use-btn {

    display: inline-block;

    margin: 0 10px 10px 0;

    padding: 20px 50px;

    border-radius: 3px;

    background-color: #fff;

    color: #4b98a9;

    font-size: 16px;

}

.use-btn:hover, .use-btn:focus {

    background-color: #73d0da;

    color: #fff;

    text-decoration: none;

}

.learn-btn, .download-btn {

    display: inline-block;

    padding: 18px 46px;

    border: 2px solid #fff;

    border-radius: 3px;

    color: #fff;

    font-size: 16px;

}

.learn-btn:hover, .download-btn:hover, .learn-btn:focus, .download-btn:focus {

    border-color: #73d0da;

    color: #73d0da;

    text-decoration: none;

}

.read-more-btn {

    display: inline-block;

    color: #323a45;

    text-transform: uppercase;

    font-weight: 400;

}

.read-more-btn i, .download-btn i {

    margin-left: 5px

}

.showcase .download-btn {

    margin-top: 50px

}

.download .download-btn {

    margin-top: 25px

}





/* ==========================================================================

Navigation

========================================================================== */



/* OSR - Begin - Collapse menu for desktop */



.navbar-header {

  float: none;

}

.navbar-toggle {

  display: block;

}

.navbar-collapse.collapse {

  display: none!important;

}

.navbar-nav {

  float: none!important;

}

.navbar-nav>li {

  float: none;

}

.navbar-collapse.collapse.in{

  display:block !important;

}



/* OSR - End - Collapse menu for desktop */



/* OSR - Begin collapse Menu styling */

                

.navbar-nav > li{padding-left:40px;padding-right:40px;letter-spacing: 2px;}



.main-navbar .navbar-fixed-top {top: 0px;}



#imgBrandLogo {max-width:150px; }



.main-navbar .navbar.navbar-fixed-top {background: rgba(180, 168, 128, 1);border: none;}



.navbar-header{padding-top: 10px;padding-bottom: 10px;padding-left: 120px;padding-right: 78px;}



.main-navbar .navbar-nav > li > a {color: #333333;}



.main-navbar .navbar-nav > li > a:hover {color: #57b8ba;}



.main-navbar .navbar-nav > .active > a,

.main-navbar .navbar-nav > .active > a:hover,

.main-navbar .navbar-nav > .active > a:focus {

    color: #ffffff;

    background-color: #57b8ba;

    padding-left: 40px;

    padding-right: 40px;

}



.main-navbar .navbar-toggle  { background: transparent;border: none; }

.main-navbar .navbar-toggle:hover  { background: transparent;border: none; }



/* OSR - End collapse Menu styling */



 /* OSR - Begin Home Page Menu styling */

#divMenu{position: absolute;top:10px;z-index: 1;width:100%;padding-right: 12%;font-family: Didot;}

#divMenuInner{position: relative;float:right;width:200px;}





.nav-pills>li.active>a, .nav-pills>li.active>a:focus, .nav-pills>li.active>a:hover {color: #ffffff !important;background-color: #673e53;font-size: .9em;}



.nav-pills>li>a {color:#673e53;font-size: .9em;}

.nav-pills>li>a:hover {background-color:#b4a880;}

.nav-pills  > li > a:focus {color: #673e53;background: none;}



.nav-pills > li > a, .navbar-brand {padding-top:1px !important;padding-bottom:1px !important;height: auto;}



.nav{font-family: 'TeXGyreTermes-Regular'}

#mnuReg{margin-bottom: 5px;}

.icon-bar {height: 1px !important;}



/* OSR - End Home Page Menu styling */



#divLangToggle{

    position:absolute;

    margin-right:40px;

    top:25px;

    right:0px;

    font-size:.8em;

    letter-spacing: 1px;

}

#divLangToggle a{text-decoration: underline;}





/* OSR - Begin Carouse Control styling */

 .carousel-control.left, .carousel-control.right {

    background: none !important;

    color: #b4a880;

    border: none;

     background-image: none !important;

}

.carousel-control.left {color: #b4a880;}

.carousel-control.right { color: #b4a880;}



OSR OSR OSR 



/* OSR - End Carouse Control styling */



.wow {visibility: hidden;} /* OSR - If this is not specified, image first displays, then dispapears and then animation starts */



/* ==========================================================================

Hero

========================================================================== */

.hero {

    position: relative;

    /* padding: 60px 0 60px 0; 

    min-height: 800px; */

    /* background: rgb(40, 70, 102) url('../img/hero-01.jpg') no-repeat center center; 

    background-size: cover;*/

    color: #673e53;

    

}

.hero h1 {

    /* margin: 200px 0 45px 0; */

    font-weight: 300;

    font-size: 2em;

}

.hero h1 span {

    display: inline-block;

    color: #673e53;

}

#home {

    width: 100%;

    height: 100%;

}

.hero {

    width: 100%;

    height: 100%;

}

header i {

    margin-left: 5px

}



 #imgHomeSec4Right{width: 100%;height: auto;}

#imgHomeSec4Right-mobile{width: 100%;height: auto;}



#divHeroTxt{position: absolute;width:50%;top:33%;padding-left: 10%;}





#divTopLogo{position: absolute;padding-left: 130px;padding-top: 40px;}

#imgTopLogo{width:200px;height: auto;}





.clsBarOuter {position: absolute; background-color:none;width:100%;z-index:1;}



.clsBarInner {position: relative;width: 600px;height: auto;padding:15px 0px;  background-color: #b5a780;margin: 0 auto;letter-spacing: .2em;}

.clsBarInner  a {font-family: 'TeXGyreTermes-Regular';}



.clsBarOuter{z-index:100;}

.clsBarOuter a span{font-family: 'TeXGyreTermes-Regular' !important;}



.parllaxpadding{padding-top: 50px;} 





/* ==========================================================================

OSR - Intro slider

========================================================================== */



.item{padding-left: 10%;padding-right: 10%;padding-top: 5%;padding-bottom: 5%;}



#secIntroSlider, #secLocationSlider,#secResidencesSlider,#secDeveloperSlider {background: url("../img/bg22.jpg") no-repeat center center; -webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;background-size: cover;}

.carousel.slide img {width:100%;height:auto;}



#divIntroSlideTxt1,#divIntroSlideTxt2{position: relative; width:90%;padding-top: 10%;margin: 0 auto;}

#divIntroSlideHeadTxt1{position: relative;padding-left:0%;}

#divIntroSlideHeadTxt2{position: relative;padding-left:0%;}



#divIntroSlideTxt1{width:100%;}



.carousel-control.right, .carousel-control.left {background-image:none;} /* Removing gradient */



.carousel-control .icon-prev, .carousel-control .icon-next {font-size: 50px;margin-top: -25px;}



#IntroBarInner{top:-20px;}



#divIntroSlideHeadTxt1_2{padding-left: 0%;}

#divIntroSlideHeadTxt2_2{padding-left: 0%;}

#divIntroSlideTxt2{width: 100%;}



#imgVideo,#imgVideo2{margin: 0 auto;width:100%;height: auto;}

#SecVideo{padding-bottom: 0px;}

.fancybox-skin {background-color: transparent!important;}



/* ==========================================================================

OSR - Location Section

========================================================================== */



.parallax-window {min-height: 600px;background: transparent;/* background: rgba(200, 54, 54, 0.5); */ }



.parallax-right-shape{background:url(../img/rightsidebar.png) top right no-repeat;background-size: Auto 600px;}

.parallax-left-shape{background:url(../img/leftsidebar.png) top left no-repeat;background-size: Auto 600px;}



#locationParllaxWrap,#residencesParllaxWrap,#DeveloperParllaxWrap{margin: 0 auto;position: relative;padding: 0;height:600px;}





#divlocationParllaxTxtWrap,#divDeveloperParllaxTxtWrap{width:40%; margin: 0 auto;position: relative;pading:0;padding-top: 30px;color: #ffffff;}



#divlocationParllaxTxtWrap {width:34%;padding-top: 100px;}

#divLocPara{width:80%;margin: 0 auto;}

#divlocationParllaxTxtWrap_parent{background:url(../img/fadebg.png) top center no-repeat; background-size:100% 100%; padding-bottom:200px;}





#divLocParllaxTxt2,#divDevParllaxTxt2{position: relative;}







#LocationBarInner{top:-20px;}



#divLocSlideTxt1{position: relative; width:95%;padding-top: 10%;margin: 0 auto;}

#divLocSlideHeadTxt1{position: relative;padding-left:5%;}

#divLocSlideHeadTxt2{position: relative;padding-left:10%;}



#divLocSlideHeadTxt1_2{position: relative;padding-left:0%;}

#divLocSlideHeadTxt1_22{position: relative;padding-left:20%;}

.clsArtImpression{position: absolute;top:90%;padding-left: 20px;}



.clsArtImpression2{position: relative;top:550px;padding-left: 100px;}



.divLocSlideHeadTxt1VN{padding-left: 0px !important;} 

/* ==========================================================================

OSR - Residences Section

========================================================================== */

#residencesBarInner{top:-20px;}







#divResidencesParllaxTxtWrap{ position: relative;pading:0;padding-top: 10%;color: purple

;padding-left: 5%;}



#divResParllaxTxt1{position: relative;padding-left:25%;}

#divResParllaxTxt2{position: relative;padding-left:25%;}



#divResSlideTxt1{position: relative; width:90%;padding-top: 10%;margin: 0 auto;}

#divResSlideHeadTxt1{position: relative;padding-left:5%;}

#divResSlideHeadTxt2{position: relative;padding-left:15%;}

#divResSlideHeadTxt2_2{position: relative;padding-left:15%;}



#divResSlideTxt2{position: relative; width:90%;padding-top: 15%;margin: 0 auto;}

#divResSlideTxt3{position: relative; width:95%;padding-top: 15%;margin: 0 auto;}

/* ==========================================================================

OSR - Developer Section

========================================================================== */

#developerBarInner{top:-20px;}





#divDeveloperSlideTxt1,#divDeveloperSlideTxt2,#divDeveloperSlideTxt3,#divDeveloperSlideTxt4{position: relative; width:80%;padding-top: 10%;margin: 0 auto;}

#divDeveloperSlideHeadTxt1,#divDeveloperSlideHeadTxt2,#divDeveloperSlideHeadTxt3,#divDeveloperSlideHeadTxt4{position: relative;padding-left:0%;}

#divDeveloperSlideHeadTxt2{position: relative;padding-left:0%;}





#divDeveloperParllaxTxtWrap{padding-top: 100px;}





/* ==========================================================================

OSR - Template page

========================================================================== */



#divPgKeyOuterTxtWrap{position:absolute;white-space: nowrap;}









#divPgKeyTxtWrap{position:relative;top:-300px;width:88%;padding-left:40%; color: #0f2429;}

#divPgKeyVisHeadTxt1{text-align: left;} 

#divPgKeyVisParaTxt{width:70%;padding-left: 20px;}

#imgKeyVis-mobile{width: 100%;height: auto;}





#divIntroPgKeyTxtWrap{position:relative;top:-370px;width:100%;padding-left:30%; color: #0f2429;background-color: ;}

#divIntroPgKeyVisHeadTxt1{text-align: left;} 

#divIntroPgKeyVisHeadTxt2{padding-left: 10%;}



#imgIntroKeyVis-mobile{width: 100%;height: auto;}



#divLocPgKeyTxtWrap{position:relative;top:-550px;width:100%;padding-left:50%; color: white;}

#divLocPgKeyVisHeadTxt1{text-align: left;} 

#divLocPgKeyVisHeadTxt2 {padding-left: 20%;}

#imgLocKeyVis-mobile{width: 100%;height: auto;}





#divResPgKeyTxtWrap{position:relative;top:-400px;width:100%;padding-left:20%; color: white;}

#divResPgKeyVisHeadTxt1{text-align: left;} 

#divResPgKeyVisHeadTxt2{padding-left: 13%;}

#imgResKeyVis-mobile{width: 100%;height: auto;}



#divResPgKeyTxtWrap{width:500px!important;}







#divDevPgKeyTxtWrap{position:relative;top:-530px;width:100%;padding-left:13%; color: white;}

#divDevPgKeyVisHeadTxt1{text-align: left;} 

#divDevPgKeyVisHeadTxt2{padding-left: 7%;}

#imgDevKeyVis-mobile{width: 100%;height: auto;}





#divRegPgKeyTxtWrap{position:relative;top:-410px;width:100%;padding-left:15%; color: white;}

#divRegPgKeyVisHeadTxt1{text-align: left;} 

#divRegPgKeyVisHeadTxt2{padding-left: 30%;}

#imgRegKeyVis-mobile{width: 100%;height: auto;}



/*

#divPgKeyVisHeadTxt1{text-align: left;}

#divPgKeyVisParaTxt{width:70%;padding-left: 20px;}





*/

/* ==========================================================================

OSR - Intro page

========================================================================== */



.whitebg{background-color: white;}

#divIntroPgParaWrap{

    background-color: white;

    padding: 0;

    width: 60%;

    padding-top: 30px;padding-bottom: 50px;

    margin: 0 auto;

    

}



#imgIntroMid{padding-top:40px;margin:0 auto;width:54%;height: auto;}





/* ==========================================================================

OSR - Developer page

========================================================================== */

#secDeveloperPgPara{background-color: white;

    padding: 0;

    width: 60%;

    padding-top: 0px;padding-bottom: 50px;

    margin: 0 auto;}



/* ==========================================================================

OSR - Registration page

========================================================================== */

.clsRegistraionTitle{font-size: 1.5em !important;}





#divResCommLegend{width:60% !important;}





/* ==========================================================================

Video

========================================================================== */

section.video i {

    margin-right: 10px;

    color: #323a45;

    vertical-align: middle;

    font-size: 50px;

    -webkit-transition: color 300ms ease-in-out;

    transition: color 300ms ease-in-out;

}

section.video h1 {

    font-weight: 400;

    font-size: 20px;

}

section.video {

    padding: 60px 0;

    background-color: #f6f7f9;

}

section.video a {

    color: #323a45

}

section.video a:hover, section.video a:focus {

    color: #ffffff;

    text-decoration: none;

}

section.video a:hover i, section.video a:focus i {

    color: #ffffff;

}



/* ==========================================================================

Custom Slider Controls (Flickity)

========================================================================== */

.flickity-page-dots .dot {

    width: 13px;

    height: 13px;

    opacity: 1;

    background: transparent;

    border: 2px solid white;

    -webkit-transition: background 0.3s;

    transition: background 0.3s;

}

.flickity-page-dots .dot.is-selected {

    background: white;

}











/* ==========================================================================

Blockquote

========================================================================== */

blockquote {

    margin: 40px 0 0;

    padding: 0;

    border: none;

}

blockquote p {

    display: inline-block;

    margin: 0;

    padding: 0;

    width: 70%;

    vertical-align: top;

    font-style: italic;

}

blockquote .avatar {

    display: inline-block;

    margin-right: 20px;

    width: 64px;

    height: 64px;

    vertical-align: middle;

}

blockquote .logo-quote {

    display: inline-block;

    margin: 0 0 0 90px;

}









/* ==========================================================================

Footer

========================================================================== */

footer {

    padding: 30px 0;

    background-color: #673e53;

    

    margin-bottom: 0;

    padding-bottom:0;

    color: #673e53;

}

footer p {

    color: #c7cacc;

    font-size: .6em;

     line-height: 15px;

}

footer ul {

    margin-top: 30px

}

footer li {

    float: left;

    margin-right: 15%;

    list-style: none;

    text-transform: uppercase;

    font-weight: 400;

}

footer li a {

    color: #3f6184

}

footer li:last-child {

    margin-right: 0

}



.copyright {font-size: 1.2em;}



#ftBuild{height: 80px; width: auto;}

#f8logo{height: 30px; width: auto;padding-left: 5px;}

#caplandlogo{height: 70px;width: auto;}

#ascottlogo{height: 80px;width:auto;}

#ftrRowTwo,#ftrRowTwoMobile{background-color:white;padding-top:3%;padding-bottom:3%;}

#divF8logoCol{text-align: left;}

#divDevbyCol{text-align: right;padding-left:100px;}

#divMangedbycol{text-align: left;padding-left:30px;}

.left-margin{padding-left: 9%;}



#caplandlogoM{height: 60px; width: auto;}

#ascottlogoM{height: 80px; width: auto;}

#f8logoM{height: 20px; width: auto;}



/* ==========================================================================

Waypoints

========================================================================== */

.wp1, .wp2, .wp3, .wp4, .wp5, .wp6 {

    visibility: hidden

}

.bounceInLeft, .bounceInRight, .fadeInUp, .fadeInUpDelay, .fadeInDown, .fadeInUpD, .fadeInLeft, .fadeInRight, .bounceInDown {

    visibility: visible

}

.delay-05s {

    -webkit-animation-delay: 0.5s;

    animation-delay: 0.5s;

}

.delay-1s {

    -webkit-animation-delay: 1s;

    animation-delay: 1s;

}



.clsPurple{color: #673e53; }

.clsPurple2{color: #a17b8e; }



.clsGoldbg{background-color: #b4a880;}





/* OSR - BEGIN - Carousel fadeout transtion */





.carousel-fade .carousel-inner .item {

  opacity: 0;

  transition-property: opacity;

  transition-duration: 2s;

  transition-timing-function:linear;

}



.carousel-fade .carousel-inner .active {

  opacity: 1;

}



.carousel-fade .carousel-inner .active.left,

.carousel-fade .carousel-inner .active.right {

  left: 0;

  opacity: 0;

  z-index: 1;

}



.carousel-fade .carousel-inner .next.left,

.carousel-fade .carousel-inner .prev.right {

  opacity: 1;

}



.carousel-fade .carousel-control {

  z-index: 2;

}



/*

WHAT IS NEW IN 3.3: "Added transforms to improve carousel performance in modern browsers."

now override the 3.3 new styles for modern browsers & apply opacity

*/

@media all and (transform-3d), (-webkit-transform-3d) {

    .carousel-fade .carousel-inner > .item.next,

    .carousel-fade .carousel-inner > .item.active.right {

      opacity: 0;

      -webkit-transform: translate3d(0, 0, 0);

              transform: translate3d(0, 0, 0);

    }

    .carousel-fade .carousel-inner > .item.prev,

    .carousel-fade .carousel-inner > .item.active.left {

      opacity: 0;

      -webkit-transform: translate3d(0, 0, 0);

              transform: translate3d(0, 0, 0);

    }

    .carousel-fade .carousel-inner > .item.next.left,

    .carousel-fade .carousel-inner > .item.prev.right,

    .carousel-fade .carousel-inner > .item.active {

      opacity: 1;

      -webkit-transform: translate3d(0, 0, 0);

              transform: translate3d(0, 0, 0);

    }

}



/* OSR - END - Carousel fadeout transtion */



/* OSR - Begin styling locaitons - amenties listing */



.amenitiesCircle{

    display: inline-block;

    margin-right: 6px;

    border-radius: 50% !important;



    text-align: center;

    font-size: 12px;

    padding-top: 4px;

    width: 23px;

    height: 23px;

    color: #fff !important;

}         

    .a1 {background-color: #a39183;}

    .a2{background-color: #64a9b0;}

    .a3{background-color: #737b86; }

    .a4{background-color: #b66e94;}

    .a5{background-color: #7d67af; }



/* OSR - End styling locaitons - amenties listing */



/* FEB 14 2017 - Mike */

.clsHeaderBigFont_vn{margin-right:6px!important; font-size: 2.1em;line-height: 1.1em;}

.clsHeaderSmallFont_vn{margin-right:6px!important; font-size: 1.1em;}





 /* APR 25 2017 - OSR */

.clsHeaderBigFontTitleCase{font-size: 2.1em;text-transform: capitalize !important;}

.clsHeaderSmallFontTitleCase{font-size: 1.1em;text-transform: capitalize;}

.grLoc1Viet{text-align: left !important;padding-left: 3%;}

.resiParlVnTxt2{padding-left: 6% !important;}

.grRes1Viet{text-align: left !important;padding-left: 0%;}

.divResSlideHeadTxt2Viet{padding-left:22%;}

.divDevParllaxTxt2Viet{padding-left:19%;}

.divRegPgKeyTxtWrapVN{padding-left:35%; }

#divIntroPgKeyVisHeadTxt2VN{padding-left: 18%;}

.locHeaderVNAlign{padding-left: 25%;}

.divDevPGTxt2Viet{padding-left:40%;}



/* POPUP ENG AND VN */



.modal-js-english,

.modal-js-vn{

    background: rgba(0,0,0,0.8);

}

.modal-js-english .modal-dialog .fixmodal,

.modal-js-vn .modal-dialog .fixmodal{

    top: 110px;

}

.modal-js-english .modal-dialog,

.modal-js-vn .modal-dialog{

    /*width: auto;*/

}



.modal-js-english .modal-dialog .modal-content.fixmodal,

.modal-js-vn .modal-dialog .modal-content.fixmodal{

    background: none !important;

    box-shadow: none !important;

    border:none !important;

}

.modal-js-english .modal-dialog .fixmodal .modal-body .img_tks img,

.modal-js-vn .modal-dialog .fixmodal .modal-body .img_tks img{

	width: 100% !important;

}

.modal-js-english .modal-dialog .fixmodal .modal-body .close,

.modal-js-vn .modal-dialog .fixmodal .modal-body .close{

    background: #000;

    color: #fff;

    border-radius: 50% !important;

    width: 36px;

    height: 36px;

    position: absolute;

    top: 0;

    right: 0;

    border:2px solid #fff !important;

    opacity: 1 !important;

}



.show_popup_en{

    display: block !important;

    opacity: 1;

}

.show_popup_vn{

    display: block !important;

    opacity: 1;

}



/*@media (min-width: 576px) and (max-width: 767px) {

    .modal-js-english .modal-dialog .fixmodal,

    .modal-js-vn .modal-dialog .fixmodal{

        top: 10%;

        padding: 50px !important;

    }

}

@media (min-width: 768px) and (max-width: 991px){

    .modal-js-english .modal-dialog .fixmodal,

    .modal-js-vn .modal-dialog .fixmodal{

        top: 10%;

        padding: 90px !important;

    }

}*/

@media (min-width: 992px){





    .modal-js-english .modal-dialog,

    .modal-js-vn .modal-dialog{

        width: 900px;

    }

    .modal-js-english .modal-dialog .fixmodal,

    .modal-js-vn .modal-dialog .fixmodal{

        top: 130px;

    }



    #msd-navbar, #main-navbar-cover, .navbar-toggle {

        display: none !important;

    }



    .main-menu {

        display: block !important;

    }

    

}



@media (max-width: 992px){

    #msd-navbar, #main-navbar-cover, .navbar-toggle {

        display: block;

        

    }



    .main-menu {

        display: none;

    }



    .videopop {

        position: relative;

        width: 100%;

        padding-bottom: 56.25%;

        background-color: #000;

    }

}



@media (min-width: 992px) {

    .videopop {

        position: relative;

        width: 100%;

        padding-bottom: 50%;

        background-color: #000;

    }



    .youtube-video {

        padding: 0 200px;

        background-color: #000 !important;

    }

}



@media (max-width: 768px) {

    .container {

      width: 100%;

    }

}



@media (min-width: 768px) {

    .container{width:80%;}

}



.main-menu{

    /* margin-left: 200px; */

}



.main-menu ul{



}



.main-menu ul li {

    display: inline-block;

}



.nav-item .nav-link:hover {

    background-color: #673e53;

    transition: .9s;

}



.nav-item:hover > .nav-link {

    background-color: #673e53;

    transition: .9s;

}



.nav-item .nav-link {

    padding: 10px 20px;

}



.dropdown .dropdown-menu {

    border: none;

    box-shadow: none;

    margin-top: 8px;

}



.dropdown:hover>.dropdown-menu {

    display: block;

}



.dropdown .dropdown-menu a {

    color: #000 !important;

}



.dropdown .dropdown-menu a:hover {

    background-color: #673e53;

    color: #fff !important;

}



.dropdown-menu .dropdown-item {

    display: block;

    padding: 5px 10px;

}





.videopop iframe {

    margin: auto auto;

    position: absolute;

    top: 0;

    bottom: 0;

    left: 0;

    right: 0;

    width: 100%;

    height: 100%;

}



.hightlight {

    background-color: #f6f7f9;

    padding: 5px;

    margin: 10px;

    color: #000;

}

.fix-bottom {

    width: 120px;

    bottom: 40vh;

    right: 20px;

    margin: auto 0 0 auto;

    text-align: right;

    position: fixed;

    left: 0;

    z-index: 1030;

}

.bt-register-now img {

    width: 120px;

=======

@import url("fonts.css");

@import 'https://fonts.googleapis.com/css?family=Muli';



/* ==========================================================================

HTML5 display definitions

========================================================================== */



/*

* Corrects `block` display not defined in IE 6/7/8/9 and Firefox 3.

*/



article, aside, details, figcaption, figure, footer, header, hgroup, nav,nav2, section, summary {

    display: block

}

nav-item a{

    color: white;

}

.dropdown-toggle::after {



    display: none !important;



}

/*

* Corrects `inline-block` display not defined in IE 6/7/8/9 and Firefox 3.

*/

audio, canvas, video {

    display: inline-block;

    *display: inline;

    *zoom: 1;

}



/*

* Prevents modern browsers from displaying `audio` without controls.

* Remove excess height in iOS 5 devices.

*/

audio:not([controls]) {

    display: none;

    height: 0;

}



/*

* Addresses styling for `hidden` attribute not present in IE 7/8/9, Firefox 3, * and Safari 4.

* Known issue:no IE 6 support.

*/

[hidden] {

    display: none

}



/* ==========================================================================

Base

========================================================================== */

/*

* 1. Corrects text resizing oddly in IE 6/7 when body `font-size` is set using

*    `em` units.

* 2. Prevents iOS text size adjust after orientation change, without disabling

*    user zoom.

*/



/* p{font-family: 'Avenir', Helvetica ;font-weight: normal;font-style: normal;} */



p{font-family: 'Asap-Regular', sans-serif;font-weight: normal;font-style: normal;}





html {

    font-size: 100%; /* 1 */

    -webkit-text-size-adjust: 100%; /* 2 */

    -ms-text-size-adjust: 100%; /* 2 */

}





/*

* Addresses `font-family` inconsistency between `textarea` and other form

* elements.

*/



/*

html, button, input, select, textarea {

    font-family: 'Avenir', Helvetica;font-weight: normal;font-style: normal;

}

*/



html, button, input, select, textarea {

    font-family: 'Asap-Regular', sans-serif;font-weight: normal;font-style: normal;

}



/*

html, body {

    overflow-x: hidden;

    width: 100%;

    font-family: 'Avenir', Helvetica;font-weight: normal;font-style: normal;

}

*/



html, body {

    overflow-x: hidden;

    width: 100%;

    font-family: 'Asap-Regular', sans-serif;font-weight: normal;font-style: normal;

}









/*

* Addresses margins handled incorrectly in IE 6/7.

*/

body {

    margin: 0;

    

    /* font-family: 'Avenir', Helvetica;font-weight: normal;font-style: normal; */

    font-family: 'Asap-Regular', sans-serif;font-weight: normal;font-style: normal; 

    

    background: url("../img/bg22.jpg") no-repeat center center fixed; 

    /* background: rgb(40, 70, 102) url('../img/hero-01.jpg') no-repeat center center */

  -webkit-background-size: cover;

  -moz-background-size: cover;

  -o-background-size: cover;

  background-size: cover;

  background-attachment: fixed !important;  

    

    

}



.container-fluid{}





/*

* Font Smoothing

*/

html, html a {

    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.004);

    -webkit-font-smoothing: antialiased;

}



/* ==========================================================================

Links

========================================================================== */

/*

* Addresses `outline` inconsistency between Chrome and other browsers.

*/



a:focus {

    outline: thin dotted;

    text-decoration: none;

}



/*

* Improves readability when focused and also mouse hovered in all browsers.

*/

a:active, a:hover {

    outline: 0;

    text-decoration: none;

}



/* ==========================================================================

Typography

========================================================================== */

/*

* Addresses font sizes and margins set differently in IE 6/7.

* Addresses font sizes within `section` and `article` in Firefox 4+, Safari 5, * and Chrome.

*/



h1 {

    margin: 0.67em 0;

    font-size: 2em;

}

h2 {

    margin: 0.83em 0;

    font-size: 1.5em;

}

h3 {

    margin: 1em 0;

    font-size: 1.17em;

}

h4 {

    margin: 1.33em 0;

    font-size: 1em;

}

h5 {

    margin: 1.67em 0;

    font-size: 0.83em;

}

h6 {

    margin: 2.33em 0;

    font-size: 0.75em;

}



/*

* Addresses styling not present in IE 7/8/9, Safari 5, and Chrome.

*/

abbr[title] {

    border-bottom: 1px dotted

}



/*

* Addresses style set to `bolder` in Firefox 3+, Safari 4/5, and Chrome.

*/

b, strong {

    font-weight: bold

}

blockquote {

    margin: 0px

}



/*

* Addresses styling not present in Safari 5 and Chrome.

*/

dfn {

    font-style: italic

}



/*

* Addresses styling not present in IE 6/7/8/9.

*/

mark {

    /*

    background: #ff0;

    color: #000;

    */

}



/*

* Addresses margins set differently in IE 6/7.

*/

p, pre {

    margin: 1em 0

}



/*

* Corrects font family set oddly in IE 6, Safari 4/5, and Chrome.

*/

code, kbd, pre, samp {

    font-size: 1em;

    font-family: 'Avenir', Helvetica;font-weight: normal;font-style: normal;

    _font-family: 'Avenir', Helvetica;font-weight: normal;font-style: normal;

}



/*

* Improves readability of pre-formatted text in all browsers.

*/

pre {

    white-space: pre;

    white-space: pre-wrap;

    word-wrap: break-word;

}



/*

* Addresses CSS quotes not supported in IE 6/7.

*/

q {

    quotes: none

}



/*

* Addresses `quotes` property not supported in Safari 4.

*/

q:before, q:after {

    content: '';

    content: none;

}

small {

    font-size: 75%

}



/*

* Prevents `sub` and `sup` affecting `line-height` in all browsers.

*/

sub, sup {

    position: relative;

    vertical-align: baseline;

    font-size: 75%;

    line-height: 0;

}

sup {

    top: -0.5em

}

sub {

    bottom: -0.25em

}







.clsHeader1{line-height: 1em;letter-spacing: .1em;}





.clsHeaderBigFont{font-size: 3em;}

.clsHeaderBigFont2{font-size: 4em;}



.clsHeaderSmallFont{font-size: 1.5em;text-transform: uppercase;}





/* .clsNormalFont {font-family: 'Avenir', Helvetica;font-size: 1em;} */

.clsNormalFont {font-family: 'Asap-Regular', sans-serif;font-size: 1em;}







.clsHeaderItalicFont {font-family:'Didot-Italic';}

.clsHeaderNormalFont {font-family: 'TeXGyreTermes-Regular';}



/*.clsHeaderItalicFontViet {font-family: 'TeXGyreTermes';font-weight: normal;font-style: normal;}*/

.clsHeaderItalicFontViet {font-family: 'TeXGyreTermes-Italic';}

.clsHeaderNormalFontViet  {font-family: 'TeXGyreTermes-Regular';}

/* ==========================================================================

Lists

========================================================================== */

/*

* Addresses margins set differently in IE 6/7.

*/



dl, menu, ol, ul {

    margin: 1em 0

}

dd {

    margin: 0 0 0 40px

}



/*

* Addresses paddings set differently in IE 6/7.

*/

menu, ol, ul {

    padding: 0

}



/*

* Corrects list images handled incorrectly in IE 7.

*/

nav ul, nav ol {

    list-style: none;

    list-style-image: none;

}



nav2 ul, nav2 ol {

    list-style: none;

    list-style-image: none;

}



/* ==========================================================================

Embedded content

========================================================================== */

/*

* 1. Removes border when inside `a` element in IE 6/7/8/9 and Firefox 3.

* 2. Improves image quality when scaled in IE 7.

*/



img {

    border: 0; /* 1 */

    -ms-interpolation-mode: bicubic; /* 2 */

}



/*

* Corrects overflow displayed oddly in IE 9.

*/

svg:not(:root) {

    overflow: hidden

}



/* ==========================================================================

Figures

========================================================================== */

/*

* Addresses margin not present in IE 6/7/8/9, Safari 5, and Opera 11.

*/



figure {

    margin: 0

}



/* ==========================================================================

Forms

========================================================================== */

/*

* Corrects margin displayed oddly in IE 6/7.

*/



form {

    margin: 0

}



/*

* Define consistent border, margin, and padding.

*/

fieldset {

    margin: 0 2px;

    padding: 0.35em 0.625em 0.75em;

    border: 1px solid #c0c0c0;

}



/*

* 1. Corrects color not being inherited in IE 6/7/8/9.

* 2. Corrects text not wrapping in Firefox 3.

* 3. Corrects alignment displayed oddly in IE 6/7.

*/

legend {

    padding: 0;

    border: 0; /* 1 */

    white-space: normal; /* 2 */

    *margin-left: -7px; /* 3 */

}



/*

* 1. Corrects font size not being inherited in all browsers.

* 2. Addresses margins set differently in IE 6/7, Firefox 3+, Safari 5, *    and Chrome.

* 3. Improves appearance and consistency in all browsers.

*/

button, input, select, textarea {

    margin: 0; /* 2 */

    vertical-align: baseline; /* 3 */

    font-size: 100%; /* 1 */

    *vertical-align: middle; /* 3 */

}



/*

* Addresses Firefox 3+ setting `line-height` on `input` using ` !important` in

* the UA stylesheet.

*/

button, input {

    line-height: normal

}



/*

* 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`

*    and `video` controls.

* 2. Corrects inability to style clickable `input` types in iOS.

* 3. Improves usability and consistency of cursor style between image-type

*    `input` and others.

* 4. Removes inner spacing in IE 7 without affecting normal text inputs.

*    Known issue:inner spacing remains in IE 6.

*/

button, html input[type="button"], /* 1 */

input[type="reset"], input[type="submit"] {

    cursor: pointer; /* 3 */

    -webkit-appearance: button; /* 2 */

    *overflow: visible; /* 4 */

}



/*

* Re-set default cursor for disabled elements.

*/

button[disabled], input[disabled] {

    cursor: default

}



/*

* 1. Addresses box sizing set to content-box in IE 8/9.

* 2. Removes excess padding in IE 8/9.

* 3. Removes excess padding in IE 7.

*    Known issue:excess padding remains in IE 6.

*/

input[type="checkbox"], input[type="radio"] {

    box-sizing: border-box; /* 1 */

    padding: 0; /* 2 */

    *height: 13px; /* 3 */

    *width: 13px; /* 3 */

}



/*

* 1. Addresses `appearance` set to `searchfield` in Safari 5 and Chrome.

* 2. Addresses `box-sizing` set to `border-box` in Safari 5 and Chrome

*    (include `-moz` to future-proof).

*/

input[type="search"] {

    /* 2 */

    box-sizing: content-box;

    -webkit-appearance: textfield; /* 1 */

    nowhitespace: afterproperty;

}



/*

* Removes inner padding and search cancel button in Safari 5 and Chrome

* on OS X.

*/

input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration {

    -webkit-appearance: none

}



/*

* Removes inner padding and border in Firefox 3+.

*/

button::-moz-focus-inner, input::-moz-focus-inner {

    padding: 0;

    border: 0;

}



/*

* 1. Removes default vertical scrollbar in IE 6/7/8/9.

* 2. Improves readability and alignment in all browsers.

*/

textarea {

    overflow: auto; /* 1 */

    vertical-align: top; /* 2 */

}



/* ==========================================================================

Tables

========================================================================== */

/*

* Remove most spacing between table cells.

*/



table {

    border-spacing: 0;

    border-collapse: collapse;

}



/* ==========================================================================

Global Styles

========================================================================== */

.group:after {

    content: "";

    display: table;

    clear: both;

}



/*

a {

    -webkit-transition-timing-function: ease-in-out;

    transition-timing-function: ease-in-out;

    -webkit-transition-duration: 300ms;

    transition-duration: 300ms;

    -webkit-transition-property: color, border-color, background-color;

    transition-property: color, border-color, background-color;

}

*/

.nopadding {

    margin: 0 !important;

    padding: 0 !important;

}

p {

    font-size: 1em;

}

a {

    color: #ffffff;

}

a:hover, a:focus {

    color: #ffffff;

    text-decoration: none;

}

.texture-overlay {

    

    /*

    position: absolute;

    top: 0px;

    left: 0px;

    width: 100%;

    height: 100%;

    background-image: url(../img/grid.png);

    

    */

}





 /* OSR - Begin changing arrows  style */

.carousel-control .icon-next:before{content:'\232A'; font-size:26px;}

.carousel-control .icon-prev:before{content:'\2329'; font-size:26px;}

.glyphicon-menu-right:before{content:'\232A'; font-size:18px; }

/* OSR - End changing arrows style */







.clear{clear:both; padding:0!important; margin:0!important;}



 /* OSR - Begin - increasing the distance for fadInUp effect */

@keyframes fadeInUp {

  0% {

    opacity: 0;

    -webkit-transform: translateY(70px);

    -ms-transform: translateY(70px);

    transform: translateY(70px);

  }



  100% {

    opacity: 1;

    -webkit-transform: translateY(0);

    -ms-transform: translateY(0);

    transform: translateY(0);

  }

}



/* OSR - End - increasing the distance for fadInUp effect */



.artimp1{text-shadow: 0 0 10px #572d22;}

.artimp2{text-shadow: 0 0 3px #000;}

.artimp3{text-shadow: 0 0 3px #000;}

.artimp4{text-shadow: 0 0 3px #000;}

.artimp5{text-shadow: 0 0 3px #000;}



/* ==========================================================================

Buttons

========================================================================== */

.use-btn {

    display: inline-block;

    margin: 0 10px 10px 0;

    padding: 20px 50px;

    border-radius: 3px;

    background-color: #fff;

    color: #4b98a9;

    font-size: 16px;

}

.use-btn:hover, .use-btn:focus {

    background-color: #73d0da;

    color: #fff;

    text-decoration: none;

}

.learn-btn, .download-btn {

    display: inline-block;

    padding: 18px 46px;

    border: 2px solid #fff;

    border-radius: 3px;

    color: #fff;

    font-size: 16px;

}

.learn-btn:hover, .download-btn:hover, .learn-btn:focus, .download-btn:focus {

    border-color: #73d0da;

    color: #73d0da;

    text-decoration: none;

}

.read-more-btn {

    display: inline-block;

    color: #323a45;

    text-transform: uppercase;

    font-weight: 400;

}

.read-more-btn i, .download-btn i {

    margin-left: 5px

}

.showcase .download-btn {

    margin-top: 50px

}

.download .download-btn {

    margin-top: 25px

}





/* ==========================================================================

Navigation

========================================================================== */



/* OSR - Begin - Collapse menu for desktop */



.navbar-header {

  float: none;

}

.navbar-toggle {

  display: block;

}

.navbar-collapse.collapse {

  display: none!important;

}

.navbar-nav {

  float: none!important;

}

.navbar-nav>li {

  float: none;

}

.navbar-collapse.collapse.in{

  display:block !important;

}



/* OSR - End - Collapse menu for desktop */



/* OSR - Begin collapse Menu styling */

                

.navbar-nav > li{padding-left:40px;padding-right:40px;letter-spacing: 2px;}



.main-navbar .navbar-fixed-top {top: 0px;}



#imgBrandLogo {max-width:150px; }



.main-navbar .navbar.navbar-fixed-top {background: rgba(180, 168, 128, 1);border: none;}



.navbar-header{padding-top: 10px;padding-left: 120px;padding-right: 78px;}



.main-navbar .navbar-nav > li > a {color: #333333;}



.main-navbar .navbar-nav > li > a:hover {color: #57b8ba;}



.main-navbar .navbar-nav > .active > a,

.main-navbar .navbar-nav > .active > a:hover,

.main-navbar .navbar-nav > .active > a:focus {

    color: #ffffff;

    background-color: #57b8ba;

    padding-left: 40px;

    padding-right: 40px;

}



.main-navbar .navbar-toggle  { background: transparent;border: none; }

.main-navbar .navbar-toggle:hover  { background: transparent;border: none; }



/* OSR - End collapse Menu styling */



 /* OSR - Begin Home Page Menu styling */

#divMenu{position: absolute;top:10px;z-index: 1;width:100%;padding-right: 12%;font-family: Didot;}

#divMenuInner{position: relative;float:right;width:200px;}





.nav-pills>li.active>a, .nav-pills>li.active>a:focus, .nav-pills>li.active>a:hover {color: #ffffff !important;background-color: #673e53;font-size: .9em;}



.nav-pills>li>a {color:#673e53;font-size: .9em;}

.nav-pills>li>a:hover {background-color:#b4a880;}

.nav-pills  > li > a:focus {color: #673e53;background: none;}



.nav-pills > li > a, .navbar-brand {padding-top:1px !important;padding-bottom:1px !important;height: auto;}



.nav{font-family: 'TeXGyreTermes-Regular'}

#mnuReg{margin-bottom: 5px;}

.icon-bar {height: 1px !important;}



/* OSR - End Home Page Menu styling */



#divLangToggle{

    position:absolute;

    margin-right:40px;

    top:25px;

    right:0px;

    font-size:.8em;

    letter-spacing: 1px;

}

#divLangToggle a{text-decoration: underline;}





/* OSR - Begin Carouse Control styling */

 .carousel-control.left, .carousel-control.right {

    background: none !important;

    color: #b4a880;

    border: none;

     background-image: none !important;

}

.carousel-control.left {color: #b4a880;}

.carousel-control.right { color: #b4a880;}



OSR OSR OSR 



/* OSR - End Carouse Control styling */



.wow {visibility: hidden;} /* OSR - If this is not specified, image first displays, then dispapears and then animation starts */



/* ==========================================================================

Hero

========================================================================== */

.hero {

    position: relative;

    /* padding: 60px 0 60px 0; 

    min-height: 800px; */

    /* background: rgb(40, 70, 102) url('../img/hero-01.jpg') no-repeat center center; 

    background-size: cover;*/

    color: #fff;

    

}

.hero h1 {

    /* margin: 200px 0 45px 0; */

    font-weight: 300;

    font-size: 2em;

}

.hero h1 span {

    display: inline-block;

    color: #673e53;

}

#home {

    width: 100%;

    height: 100%;

}

.hero {

    width: 100%;

    height: 100%;

}

header i {

    margin-left: 5px

}



 #imgHomeSec4Right{width: 100%;height: auto;}

#imgHomeSec4Right-mobile{width: 100%;height: auto;}



#divHeroTxt{position: absolute;width:50%;top:33%;padding-left: 10%;}





#divTopLogo{position: absolute;padding-left: 130px;padding-top: 40px;}

#imgTopLogo{width:200px;height: auto;}





.clsBarOuter {position: absolute; background-color:none;width:100%;z-index:1;}



.clsBarInner {position: relative;width: 600px;height: auto;padding:15px 0px;  background-color: #b5a780;margin: 0 auto;letter-spacing: .2em;}

.clsBarInner  a {font-family: 'TeXGyreTermes-Regular';}



.clsBarOuter{z-index:100;}

.clsBarOuter a span{font-family: 'TeXGyreTermes-Regular' !important;}



.parllaxpadding{padding-top: 50px;} 





/* ==========================================================================

OSR - Intro slider

========================================================================== */



.item{padding-left: 10%;padding-right: 10%;padding-top: 5%;padding-bottom: 5%;}



#secIntroSlider, #secLocationSlider,#secResidencesSlider,#secDeveloperSlider {background: url("../img/bg22.jpg") no-repeat center center; -webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;background-size: cover;}

.carousel.slide img {width:100%;height:auto;}



#divIntroSlideTxt1,#divIntroSlideTxt2{position: relative; width:90%;padding-top: 10%;margin: 0 auto;}

#divIntroSlideHeadTxt1{position: relative;padding-left:0%;}

#divIntroSlideHeadTxt2{position: relative;padding-left:0%;}



#divIntroSlideTxt1{width:100%;}



.carousel-control.right, .carousel-control.left {background-image:none;} /* Removing gradient */



.carousel-control .icon-prev, .carousel-control .icon-next {font-size: 50px;margin-top: -25px;}



#IntroBarInner{top:-20px;}



#divIntroSlideHeadTxt1_2{padding-left: 0%;}

#divIntroSlideHeadTxt2_2{padding-left: 0%;}

#divIntroSlideTxt2{width: 100%;}



#imgVideo,#imgVideo2{margin: 0 auto;width:100%;height: auto;}

#SecVideo{padding-bottom: 0px;}

.fancybox-skin {background-color: transparent!important;}



/* ==========================================================================

OSR - Location Section

========================================================================== */



.parallax-window {min-height: 600px;background: transparent;/* background: rgba(200, 54, 54, 0.5); */ }



.parallax-right-shape{background:url(../img/rightsidebar.png) top right no-repeat;background-size: Auto 600px;}

.parallax-left-shape{background:url(../img/leftsidebar.png) top left no-repeat;background-size: Auto 600px;}



#locationParllaxWrap,#residencesParllaxWrap,#DeveloperParllaxWrap{margin: 0 auto;position: relative;padding: 0;height:600px;}





#divlocationParllaxTxtWrap,#divDeveloperParllaxTxtWrap{width:40%; margin: 0 auto;position: relative;pading:0;padding-top: 30px;color: #ffffff;}



#divlocationParllaxTxtWrap {width:34%;padding-top: 100px;}

#divLocPara{width:80%;margin: 0 auto;}

#divlocationParllaxTxtWrap_parent{background:url(../img/fadebg.png) top center no-repeat; background-size:100% 100%; padding-bottom:200px;}





#divLocParllaxTxt2,#divDevParllaxTxt2{position: relative;}







#LocationBarInner{top:-20px;}



#divLocSlideTxt1{position: relative; width:95%;padding-top: 10%;margin: 0 auto;}

#divLocSlideHeadTxt1{position: relative;padding-left:5%;}

#divLocSlideHeadTxt2{position: relative;padding-left:10%;}



#divLocSlideHeadTxt1_2{position: relative;padding-left:0%;}

#divLocSlideHeadTxt1_22{position: relative;padding-left:20%;}

.clsArtImpression{position: absolute;top:90%;padding-left: 20px;}



.clsArtImpression2{position: relative;top:550px;padding-left: 100px;}



.divLocSlideHeadTxt1VN{padding-left: 0px !important;} 

/* ==========================================================================

OSR - Residences Section

========================================================================== */

#residencesBarInner{top:-20px;}







#divResidencesParllaxTxtWrap{ position: relative;pading:0;padding-top: 10%;color: purple

;padding-left: 5%;}



#divResParllaxTxt1{position: relative;padding-left:25%;}

#divResParllaxTxt2{position: relative;padding-left:25%;}



#divResSlideTxt1{position: relative; width:90%;padding-top: 10%;margin: 0 auto;}

#divResSlideHeadTxt1{position: relative;padding-left:5%;}

#divResSlideHeadTxt2{position: relative;padding-left:15%;}

#divResSlideHeadTxt2_2{position: relative;padding-left:15%;}



#divResSlideTxt2{position: relative; width:90%;padding-top: 15%;margin: 0 auto;}

#divResSlideTxt3{position: relative; width:95%;padding-top: 15%;margin: 0 auto;}

/* ==========================================================================

OSR - Developer Section

========================================================================== */

#developerBarInner{top:-20px;}





#divDeveloperSlideTxt1,#divDeveloperSlideTxt2,#divDeveloperSlideTxt3,#divDeveloperSlideTxt4{position: relative; width:80%;padding-top: 10%;margin: 0 auto;}

#divDeveloperSlideHeadTxt1,#divDeveloperSlideHeadTxt2,#divDeveloperSlideHeadTxt3,#divDeveloperSlideHeadTxt4{position: relative;padding-left:0%;}

#divDeveloperSlideHeadTxt2{position: relative;padding-left:0%;}





#divDeveloperParllaxTxtWrap{padding-top: 100px;}





/* ==========================================================================

OSR - Template page

========================================================================== */



#divPgKeyOuterTxtWrap{position:absolute;white-space: nowrap;}









#divPgKeyTxtWrap{position:relative;top:-300px;width:88%;padding-left:40%; color: #0f2429;}

#divPgKeyVisHeadTxt1{text-align: left;} 

#divPgKeyVisParaTxt{width:70%;padding-left: 20px;}

#imgKeyVis-mobile{width: 100%;height: auto;}





#divIntroPgKeyTxtWrap{position:relative;top:-370px;width:100%;padding-left:30%; color: #0f2429;background-color: ;}

#divIntroPgKeyVisHeadTxt1{text-align: left;} 

#divIntroPgKeyVisHeadTxt2{padding-left: 10%;}



#imgIntroKeyVis-mobile{width: 100%;height: auto;}



#divLocPgKeyTxtWrap{position:relative;top:-550px;width:100%;padding-left:50%; color: white;}

#divLocPgKeyVisHeadTxt1{text-align: left;} 

#divLocPgKeyVisHeadTxt2 {padding-left: 20%;}

#imgLocKeyVis-mobile{width: 100%;height: auto;}





#divResPgKeyTxtWrap{position:relative;top:-400px;width:100%;padding-left:20%; color: white;}

#divResPgKeyVisHeadTxt1{text-align: left;} 

#divResPgKeyVisHeadTxt2{padding-left: 13%;}

#imgResKeyVis-mobile{width: 100%;height: auto;}



#divResPgKeyTxtWrap{width:500px!important;}







#divDevPgKeyTxtWrap{position:relative;top:-530px;width:100%;padding-left:13%; color: white;}

#divDevPgKeyVisHeadTxt1{text-align: left;} 

#divDevPgKeyVisHeadTxt2{padding-left: 7%;}

#imgDevKeyVis-mobile{width: 100%;height: auto;}





#divRegPgKeyTxtWrap{position:relative;top:-410px;width:100%;padding-left:15%; color: white;}

#divRegPgKeyVisHeadTxt1{text-align: left;} 

#divRegPgKeyVisHeadTxt2{padding-left: 30%;}

#imgRegKeyVis-mobile{width: 100%;height: auto;}



/*

#divPgKeyVisHeadTxt1{text-align: left;}

#divPgKeyVisParaTxt{width:70%;padding-left: 20px;}





*/

/* ==========================================================================

OSR - Intro page

========================================================================== */



.whitebg{background-color: white;}

#divIntroPgParaWrap{

    background-color: white;

    padding: 0;

    width: 60%;

    padding-top: 30px;padding-bottom: 50px;

    margin: 0 auto;

    

}



#imgIntroMid{padding-top:40px;margin:0 auto;width:54%;height: auto;}





/* ==========================================================================

OSR - Developer page

========================================================================== */

#secDeveloperPgPara{background-color: white;

    padding: 0;

    width: 60%;

    padding-top: 0px;padding-bottom: 50px;

    margin: 0 auto;}



/* ==========================================================================

OSR - Registration page

========================================================================== */

.clsRegistraionTitle{font-size: 1.5em !important;}





#divResCommLegend{width:60% !important;}





/* ==========================================================================

Video

========================================================================== */

section.video i {

    margin-right: 10px;

    color: #323a45;

    vertical-align: middle;

    font-size: 50px;

    -webkit-transition: color 300ms ease-in-out;

    transition: color 300ms ease-in-out;

}

section.video h1 {

    font-weight: 400;

    font-size: 20px;

}

section.video {

    padding: 60px 0;

    background-color: #f6f7f9;

}

section.video a {

    color: #323a45

}

section.video a:hover, section.video a:focus {

    color: #ffffff;

    text-decoration: none;

}

section.video a:hover i, section.video a:focus i {

    color: #ffffff;

}



/* ==========================================================================

Custom Slider Controls (Flickity)

========================================================================== */

.flickity-page-dots .dot {

    width: 13px;

    height: 13px;

    opacity: 1;

    background: transparent;

    border: 2px solid white;

    -webkit-transition: background 0.3s;

    transition: background 0.3s;

}

.flickity-page-dots .dot.is-selected {

    background: white;

}











/* ==========================================================================

Blockquote

========================================================================== */

blockquote {

    margin: 40px 0 0;

    padding: 0;

    border: none;

}

blockquote p {

    display: inline-block;

    margin: 0;

    padding: 0;

    width: 70%;

    vertical-align: top;

    font-style: italic;

}

blockquote .avatar {

    display: inline-block;

    margin-right: 20px;

    width: 64px;

    height: 64px;

    vertical-align: middle;

}

blockquote .logo-quote {

    display: inline-block;

    margin: 0 0 0 90px;

}









/* ==========================================================================

Footer

========================================================================== */

footer {

    display: inline-block;

    padding: 30px 0;

    background-color: #673e53;

    

    margin-bottom: 0;

    padding-bottom:0;

    color: #673e53;

}

footer p {

    color: #c7cacc;

    font-size: .6em;

     line-height: 15px;

}

footer ul {

    margin-top: 30px

}

footer li {

    float: left;

    margin-right: 15%;

    list-style: none;

    text-transform: uppercase;

    font-weight: 400;

}

footer li a {

    color: #3f6184

}

footer li:last-child {

    margin-right: 0

}



.copyright {font-size: 1.2em;}



#ftBuild{height: 80px; width: auto;}

#f8logo{height: 30px; width: auto;padding-left: 5px;}

#caplandlogo{height: 70px;width: auto;}

#ascottlogo{height: 80px;width:auto;}

#ftrRowTwo,#ftrRowTwoMobile{background-color:white;padding-top:3%;padding-bottom:3%;}

#divF8logoCol{text-align: left;}

#divDevbyCol{text-align: right;padding-left:100px;}

#divMangedbycol{text-align: left;padding-left:30px;}

.left-margin{padding-left: 9%;}



#caplandlogoM{height: 60px; width: auto;}

#ascottlogoM{height: 80px; width: auto;}

#f8logoM{height: 20px; width: auto;}



/* ==========================================================================

Waypoints

========================================================================== */

.wp1, .wp2, .wp3, .wp4, .wp5, .wp6 {

    visibility: hidden

}

.bounceInLeft, .bounceInRight, .fadeInUp, .fadeInUpDelay, .fadeInDown, .fadeInUpD, .fadeInLeft, .fadeInRight, .bounceInDown {

    visibility: visible

}

.delay-05s {

    -webkit-animation-delay: 0.5s;

    animation-delay: 0.5s;

}

.delay-1s {

    -webkit-animation-delay: 1s;

    animation-delay: 1s;

}



.clsPurple{color: #673e53; }

.clsPurple2{color: #a17b8e; }



.clsGoldbg{background-color: #b4a880;}





/* OSR - BEGIN - Carousel fadeout transtion */





.carousel-fade .carousel-inner .item {

  opacity: 0;

  transition-property: opacity;

  transition-duration: 2s;

  transition-timing-function:linear;

}



.carousel-fade .carousel-inner .active {

  opacity: 1;

}



.carousel-fade .carousel-inner .active.left,

.carousel-fade .carousel-inner .active.right {

  left: 0;

  opacity: 0;

  z-index: 1;

}



.carousel-fade .carousel-inner .next.left,

.carousel-fade .carousel-inner .prev.right {

  opacity: 1;

}



.carousel-fade .carousel-control {

  z-index: 2;

}



/*

WHAT IS NEW IN 3.3: "Added transforms to improve carousel performance in modern browsers."

now override the 3.3 new styles for modern browsers & apply opacity

*/

@media all and (transform-3d), (-webkit-transform-3d) {

    .carousel-fade .carousel-inner > .item.next,

    .carousel-fade .carousel-inner > .item.active.right {

      opacity: 0;

      -webkit-transform: translate3d(0, 0, 0);

              transform: translate3d(0, 0, 0);

    }

    .carousel-fade .carousel-inner > .item.prev,

    .carousel-fade .carousel-inner > .item.active.left {

      opacity: 0;

      -webkit-transform: translate3d(0, 0, 0);

              transform: translate3d(0, 0, 0);

    }

    .carousel-fade .carousel-inner > .item.next.left,

    .carousel-fade .carousel-inner > .item.prev.right,

    .carousel-fade .carousel-inner > .item.active {

      opacity: 1;

      -webkit-transform: translate3d(0, 0, 0);

              transform: translate3d(0, 0, 0);

    }

}



/* OSR - END - Carousel fadeout transtion */



/* OSR - Begin styling locaitons - amenties listing */



.amenitiesCircle{

    display: inline-block;

    margin-right: 6px;

    border-radius: 50% !important;



    text-align: center;

    font-size: 12px;

    padding-top: 4px;

    width: 23px;

    height: 23px;

    color: #fff !important;

}         

    .a1 {background-color: #a39183;}

    .a2{background-color: #64a9b0;}

    .a3{background-color: #737b86; }

    .a4{background-color: #b66e94;}

    .a5{background-color: #7d67af; }



/* OSR - End styling locaitons - amenties listing */



/* FEB 14 2017 - Mike */

.clsHeaderBigFont_vn{margin-right:6px!important; font-size: 2.1em;line-height: 1.1em;}

.clsHeaderSmallFont_vn{margin-right:6px!important; font-size: 1.1em;}





 /* APR 25 2017 - OSR */

.clsHeaderBigFontTitleCase{font-size: 2.1em;text-transform: capitalize !important;}

.clsHeaderSmallFontTitleCase{font-size: 1.1em;text-transform: capitalize;}

.grLoc1Viet{text-align: left !important;padding-left: 3%;}

.resiParlVnTxt2{padding-left: 6% !important;}

.grRes1Viet{text-align: left !important;padding-left: 0%;}

.divResSlideHeadTxt2Viet{padding-left:22%;}

.divDevParllaxTxt2Viet{padding-left:19%;}

.divRegPgKeyTxtWrapVN{padding-left:35%; }

#divIntroPgKeyVisHeadTxt2VN{padding-left: 18%;}

.locHeaderVNAlign{padding-left: 25%;}

.divDevPGTxt2Viet{padding-left:40%;}



/* POPUP ENG AND VN */



.modal-js-english,

.modal-js-vn{

    background: rgba(0,0,0,0.8);

}

.modal-js-english .modal-dialog .fixmodal,

.modal-js-vn .modal-dialog .fixmodal{

    top: 110px;

}

.modal-js-english .modal-dialog,

.modal-js-vn .modal-dialog{

    /*width: auto;*/

}



.modal-js-english .modal-dialog .modal-content.fixmodal,

.modal-js-vn .modal-dialog .modal-content.fixmodal{

    background: none !important;

    box-shadow: none !important;

    border:none !important;

}

.modal-js-english .modal-dialog .fixmodal .modal-body .img_tks img,

.modal-js-vn .modal-dialog .fixmodal .modal-body .img_tks img{

	width: 100% !important;

}

.modal-js-english .modal-dialog .fixmodal .modal-body .close,

.modal-js-vn .modal-dialog .fixmodal .modal-body .close{

    background: #000;

    color: #fff;

    border-radius: 50% !important;

    width: 36px;

    height: 36px;

    position: absolute;

    top: 0;

    right: 0;

    border:2px solid #fff !important;

    opacity: 1 !important;

}



.show_popup_en{

    display: block !important;

    opacity: 1;

}

.show_popup_vn{

    display: block !important;

    opacity: 1;

}





/*@media (min-width: 576px) and (max-width: 767px) {

    .modal-js-english .modal-dialog .fixmodal,

    .modal-js-vn .modal-dialog .fixmodal{

        top: 10%;

        padding: 50px !important;

    }

}

@media (min-width: 768px) and (max-width: 991px){

    .modal-js-english .modal-dialog .fixmodal,

    .modal-js-vn .modal-dialog .fixmodal{

        top: 10%;

        padding: 90px !important;

    }

}*/

@media (min-width: 992px){

    .modal-js-english .modal-dialog,

    .modal-js-vn .modal-dialog{

        width: 900px;

    }

    .modal-js-english .modal-dialog .fixmodal,

    .modal-js-vn .modal-dialog .fixmodal{

        top: 130px;

    }



    #msd-navbar, #main-navbar-cover, .navbar-toggle {

        display: none !important;

    }



    .main-menu {

        display: block !important;

    }

    

}



@media (max-width: 992px){

    #msd-navbar, #main-navbar-cover, .navbar-toggle {

        display: block;

    }



    .main-menu {

        display: none;

    }



    .videopop {

        position: relative;

        width: 100%;

        padding-bottom: 56.25%;

        background-color: #000;

    }

}



@media (min-width: 992px) {

    .videopop {

        position: relative;

        width: 100%;

        padding-bottom: 50%;

        background-color: #000;

    }



    .youtube-video {

        padding: 0 200px;

        background-color: #000 !important;

    }

}



@media (max-width: 768px) {

    .container {

      width: 100%;

    }

}



@media (min-width: 768px) {

    .container{width:80%;}

}



.main-menu{

    /* margin-left: 200px; */

}



.main-menu ul{



}



.main-menu ul li {

    display: inline-block;

}



.nav-item .nav-link:hover {

    background-color: #673e53;

    transition: .9s;

}



.nav-item:hover > .nav-link {

    background-color: #673e53;

    transition: .9s;

}



.nav-item .nav-link {

    padding: 10px 20px;

}



.dropdown .dropdown-menu {

    border: none;

    box-shadow: none;

    /*margin-top: 8px;*/

    margin: 0px !important;

}

.dropdown-item{

    font-size: 14px !important;

}



.dropdown:hover>.dropdown-menu {

    display: block;

}



.dropdown .dropdown-menu a {

    color: #000 !important;

}



.dropdown .dropdown-menu a:hover {

    background-color: #673e53;

    color: #fff !important;

}



.dropdown-menu .dropdown-item {

    display: block;

    padding: 5px 10px;

}





.videopop iframe {

    margin: auto auto;

    position: absolute;

    top: 0;

    bottom: 0;

    left: 0;

    right: 0;

    width: 100%;

    height: 100%;

}



.hightlight {

    background-color: #f6f7f9;

    padding: 5px;

    margin: 10px;

    color: #000;

}

.fix-bottom {

    width: 120px;

    bottom: 40vh;

    right: 20px;

    margin: auto 0 0 auto;

    text-align: right;

    position: fixed;

    left: 0;

    z-index: 1030;

}

.bt-register-now img {

    width: 120px;

}

.section-auto{

  

    color: red;

}

.facilities-list li{

    list-style-type: decimal;

    font-size: 16px;

}

.facilities-list h4{

    text-decoration: underline;

    font-weight: bold;

    letter-spacing: 0;

}

.fac-orange {

    background-color: #ed7027;

}

.facilities-list h4:last-child {

    margin-top: 20px;

    margin-left: -5px;

}

.fac-dot-indicate {

    width: 10px;

    height: 10px;

    border-radius: 100% !important;

    margin-left: -15px;

    margin-right: 10px;

    display: inline-block;

}

.wr{

    width: 100% !important;

    display: inline-block;

    padding-left: 5px;

}

.fx-w {



    padding-left: 73px;



}

.facilities-list {

    margin-right: -117px;

}

.fac-black {

    background-color: #333;

}

.fac-dot-indicate {



    width: 10px;

    height: 10px;

    border-radius: 100%;

    margin-left: -35px;

    margin-right: 10px;

}

.facilities-list.fac-gf {



    font-size: 25px;



}

.fac-gf.top {

    font-size: 41px;

    font-weight: bold;

    padding-left: 50px;

}

.headline small {

    font-weight: 700;

    font-size: 0.6em;

    letter-spacing: 0.2em;

    color: #cb724f;

    display: block;

    margin-top: -1em;

    font-size: 24px;

}







.news_child{

    height: 210px;

}