@import url('http://fonts.googleapis.com/css?family=Open+Sans:300,400,600,800');

html        { -webkit-font-smoothing: antialiased; }
body        { font-family: 'Open Sans', sans-serif; overflow-x: hidden;}
p           { font-size: 120%; line-height: 1.453em;}
.NoColPadding div[class*='col-'] {padding: 0 !important;}

/* === General Classes === */
    .transition04                   {transition: all 0.4s; -ms-transition: 0.4s; -o-transition: 0.4s; -webkit-transition: 0.4s;}
    a:hover                         {text-decoration: none;}
    a                               {outline: none !Important;}
    h1,h2                           {font-weight: 300;}
    h1,h2,h3                        {line-height: 1.2em;}
    .Normal ul li                   {font-size: 14px; padding: 3px 0;}

    /* Buttons */
    .WhiteBorderButton              {display: inline-block; border: solid 2px #fff; margin: 15px; padding: 10px 20px; border-radius: 100px; color: #fff; font-size: 120%; transition: all 0.4s; -ms-transition: 0.4s; -o-transition: 0.4s; -webkit-transition: 0.4s;}
    .WhiteBorderButton:hover        {background-color: #fff; color: #333;}
    .OrangeBorderButton             {display: inline-block; border: solid 2px #fd7336; margin: 15px; padding: 10px 20px; border-radius: 100px; color: #fd7336; font-size: 120%; transition: all 0.4s; -ms-transition: 0.4s; -o-transition: 0.4s; -webkit-transition: 0.4s;}
    .OrangeBorderButton:hover       {background-color: #fd7336; color: #fff;}
    .BlackBorderButton              {display: inline-block; border: solid 2px #000; margin: 15px; padding: 10px 20px; border-radius: 100px; color: #000; font-size: 120%; transition: all 0.4s; -ms-transition: 0.4s; -o-transition: 0.4s; -webkit-transition: 0.4s;}
    .BlackBorderButton:hover        {background-color: #000; color: #fff;}
    .BeigeRecButton                 {display: inline-block; padding: 10px 20px; background-color: #e3c081; color: #fff !important; font-size: 120%; transition: all 0.4s; -ms-transition: 0.4s; -o-transition: 0.4s; -webkit-transition: 0.4s;}
    @media only screen and (max-width: 768px) {
        .WhiteBorderButton          {margin: 0;}
        .OrangeBorderButton         {margin: 0;}
    }

/* === Header === */
    /* --- Above the menu bar --- */
        .AboveMenuBar                       {position:relative; background-color: rgba(0,0,0,0.05); padding: 8px 0; font-size: 14px;}
        .AboveMenuBar i                     {display: inline-block; padding: 5px 8px; }
        .AboveMenuBar a i                   {color: #00aeef;}
        .AboveMenuBar a i:hover             {color: #0086b8;}
        .AboveMenuBarTextWithIcon i         {font-size: 16px;}
        .AboveMenuBarTextWithIcon span      {padding-right: 15px;}
        .LoginLink                          {color: #000; font-weight: 600; padding: 15px; position: relative; background-color: #fff;}
        .UserLink                           {color: #000; text-transform: uppercase;}
        .language-object                    {display: inline-block;}
        .Language                           {padding: 0 3px; opacity: 0.5;}
        .Language.selected                  {opacity: 1;}

    /* --- Menu Bar --- */
        .MenuBar                            {}
        /* Logo */
            .LogoHolder                     {max-width: 100%; max-height: 130px; height: auto; width: auto; padding: 6px 0;}

        /* Menu */
            .MenuBackground                 {border-top: solid 1px #e7e7e7;}
            .MenuHolder                     {float: right;}

        /* Mobile Menu */
            .MobileMenuHolder               {float:right; display: none; padding: 0;}
            .MobileMenuHolder .fa           {font-size: 200%; padding: 16px 15px 16px 0; cursor: pointer;}
            .sticky .MobileMenuHolder .fa   {color: #333; padding: 6px 15px 6px 0;}
            .MobileMenuDropDown             {display: none; position: absolute; z-index: 9999;}
            .MobileMenuDropDownOpen         {display: block;}

    /* --- Breadcrumb --- */
        .BreadcrumbRow                      {background-color: #0086b8; box-shadow: inset 0 0 60px #000; padding: 20px 0 30px 0;}
        .Breadcrumbs                        {padding: 0;}
        .Breadcrumbs a                      {color: #fff; padding: 0 5px;}
        .BreadcrumbRow h2                   {font-size: 18px; font-weight: 700; margin: 0; padding: 10px 0; color: #fff; margin-bottom: 15px;}
        .BreadcrumbRow h2:after             {content: ''; border-bottom: solid 3px #fff; width: 50px; display: inline-block; position: absolute; text-align: center; margin: 0 auto; bottom: 28px; left: 0; right: 0;}

        @media only screen and (max-width: 980px) {
            .BreadcrumbRow                  {padding: 15px 0;}
            .BreadcrumbRow h2               {margin-bottom: 0;}
            .BreadcrumbRow h2:after         {visibility: hidden;}
        }
        
/* === Content === */
    .ParallaxBg                                     {background: transparent url(Images/EMThrace_ParBack.jpg) no-repeat center; height: 100%; background-attachment: fixed; background-size: cover;}
    .ParallaxBg .Normal                             {padding-top: 40px; color: #fff;}
    .ParallaxBg h2                                  {margin-bottom: 30px;}
    .ParallaxBg .Normal .col-sm-6                   {display: inline-block;}
    .ParallaxBg img                                 {max-width: 80%; height: auto !important; margin: 0 auto 0 auto; vertical-align: bottom;}

    .GrayBackground                                 {background-color: #e7e7e7;}

/* === Footer === */
    .FooterTop                                      {background-color: #f0f0f0; min-height: 80px;}
    .ExploriaFooterLogo                             {width: 25%; /* background: transparent url(images/Exploria-Footer-Logo.png) no-repeat center;*/ background-size: contain; min-height: 150px; margin: 3% auto;}
    .FooterBottom                                   {background-color: #fff; padding: 60px 0;}
    .ExploriaCopyright                              {color: #999;}
    .FooterBottom .AboveMenuBarSocialIcons a        {display: inline-block; color: #fff; padding: 8px 0; margin: 0 5px; width: 32px; height: 32px; background-color: #00aeef; border-radius: 16px; text-align: center; line-height: 32px; font-size: 16px;}
    .DnnLinks                                       {padding: 15px; color: #000 !important; font-size: 16px;}

/* === Responsive Align Classes === */
/* === Responsive Styles === */
@media only screen and (min-width: 1010px) {
    .MobileMenuDropDown             {display: none;}
}
@media only screen and (min-width: 1300px) {
    .container                      {min-width: 1270px;}
}

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

@media only screen and (max-width: 1009px){
    .MenuHolder                     {display: none;}
    .MobileMenuHolder               {display: block;}
}

@media only screen and (max-width: 768px){
    .container                          {width: 300px;}

    .text-xs-left                       { text-align: left; }
    .text-xs-right                      { text-align: right; }
    .text-xs-center                     { text-align: center; }
    .text-xs-justify                    { text-align: justify; }

    .col-xs-right                       { float: right; }
}