/* * { 
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease;
    } */

    html,body
{
    width: 100%;
    height: 100%;
    margin: 0px;
    padding: 0px;
  }

  .container-fluid {
    overflow: hidden;
  }

    @font-face {
    font-family: PincoyBlack;
    src: url(sansation_bold.woff);
    font-weight: bold;
} 

    @font-face {
      font-family: PincoyBlack;
      font-weight: regular;
      src: url("../fonts/pincoyablack.otf") format("opentype");
      }


      @font-face {
      font-family: Selima ;
      font-weight: regular;
      src: url("../fonts/Selima .otf") format("opentype");
      }



    p {font-family: 'Poppins', sans-serif; margin-bottom: 20px;}
    a {color: #f68423;}
    a:hover {text-decoration: none; cursor: pointer;}
    ul, ol, h1, h2, h3, h4, h5, h6 {font-family: 'Raleway', sans-serif; padding: 0; margin: 0; list-style: none; text-transform: uppercase;}
    h3 {font-family: 'Poppins', sans-serif; }
.blue {
  color: #60afc3;
}

    .fixed {
    position: fixed;
    top: 0;
    height: 95px;
    z-index: 1000;
    width: 100%;
    margin: 0;
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease;
    border: none!important

    }

    .fixed ul.menu {margin: 30px auto 0;}
    .fixed .logo {margin: 2px auto 0;}

    .fixed.logo img {max-width: 130px;}

    .fixed .links ul {top: 20px;}

    .fixed .here {color: #b90f8b; background: none;}


    .fixed a:hover {opacity: 0.7; background: none;}

    .full-width-container {max-width: 1920px; margin: 20px auto;}


    .clear {clear: both;}
    .right {float: right;}
    .left {float: left;}
    .text-center {text-align: center!important; display: block!important;}
    .topbottom20 {margin-top: 20px; margin-bottom: 20px;}
    .mb-50 {margin-bottom: 50px!important;}
    .mb-40 {margin-bottom: 40px!important;}
    .mb-30 {margin-bottom: 30px;}
    .mb-20 {margin-bottom: 20px!important;}
    .mb-10 {margin-bottom: 10px!important;}
    .mt-10 {margin-top: 10px;}
    .mt-20 {margin-top: 20px!important;}
    .mt-30 {margin-top: 30px;}
    .mt-40 {margin-top: 40px;}
    .no-padding {padding-left: 0; padding-right: 0; padding-bottom: 0; padding-top: 0;}
    .img-center {margin: 0 auto; display: block;}
    .block {display: block;}
    .grid-item { width: 19%; }
    .grid-item--width2 { width: 50%; }
    .divider {height: 30px; background: #b90f8b; margin: 40px 0;}
    .here {
    color: #fff!important;
    padding: 10px 25px!important;
    text-decoration: none;
    }

  

     

/* navigation css */
      

      .nav>li>a {padding: 0 10px;}
      .navbar-default {
      background-color: rgba(21,0,0,1);
      border: none;
      }

    .navbar-default .navbar-nav>li>a {
      color: #fff;
      text-align: center;
      padding: 13px;
      text-transform: uppercase;
    }

    .navbar-nav, .navbar-nav li {float: none; text-indent: 0px;}

    .navbar-default .sml-logo {margin-left: 10px; margin-top: 5px;}


    .rslides {
      margin: 0 auto;
      max-width: inherit!important;
    }

    
    .embed-responsive {
    position: relative;
    display: block;
    height: 0;
    padding: 0;
    overflow: hidden;
    }
  .embed-responsive .embed-responsive-item,
  .embed-responsive iframe,
  .embed-responsive embed,
  .embed-responsive object,
  .embed-responsive video {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
  }
  .embed-responsive-16by9 {
    padding-bottom: 56.25%;
  }
  .embed-responsive-4by3 {
    padding-bottom: 75%;
  }
    


      input[type=text], textarea {margin: 0 0 20px 0; height: 60px; color: #777777; text-transform: uppercase; font-size: 18px; font-weight: bold; border: 1px solid #343434;}
      textarea {width: 350px; height: 80px;}
      form span {
            display: none;
            font-size: 1em;
            font-weight: bold;
            margin: 0em 0 15px 0;
            color: #000;
      }

      form label {
        color: #000;
      }

      textarea.form-control {min-height: 165px; border: 1px solid #343434; font-size: 18px;line-height: 65px;}

      .send-data-message .item {
            margin-top: 20px;
            padding: 40px;
            border-radius: 6px;
      }

      .send-data-message button {
        margin-top: 20px;
        background: #000;
        color: #ca6b1b;
        border-radius: 0;
      }


      .btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open .dropdown-toggle.btn-primary {background: #60afc3;
      }

      .navbar-default .navbar-nav>li>a:hover {color: #b90f8b}

      

      

      h1 {
        font-family: 'PincoyBlack', sans-serif; 
        color: #f68423;
        text-align: center;
        font-size: 72px;
        margin: 25px 0 20px;
      }

      h1 span {
        font-family: 'Muli', sans-serif;
        display: block;
        font-size: 26px;
        color: #000;
        text-transform: uppercase;
      }

      /* Slider Styles */

      .rslides {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0;
  }

.rslides li {
  -webkit-backface-visibility: hidden position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
  }

.rslides li:first-child {
  position: relative;
  display: block;
  float: left;
  }

.rslides img {
  display: block;
  height: auto;
  float: left;
  width: 100%;
  border: 0;
  }

  .rslides span {
    position: absolute;
    display: table;
    bottom: 0;
    width: 100%;
    /* padding: 60px; */
    text-align: center;
   /* background: rgba(255,255,255,0.7); */
  }

  .rslides span blockquote {background: rgba(255,255,255,0.7);padding: 60px; margin: 0!important;}

  .rslides span p, .rslides span h3 {
    text-align: center;
    margin: 0 auto;
  }

  .rslides span h3 {
    max-width: 700px;
    text-transform: uppercase; 
    color: #171717; 
    font-weight: bold;
    font-size: 28px;
    margin-bottom: 10px;
  }

  .rslides span p {
    max-width: 1000px;
    font-size: 18px;
    font-weight: 300;
    margin-bottom: 20px;
  }

  .rslides span .btn, .fancybox-skin .btn {
    background: #000;
    color: #ca6b1b;
    text-transform: uppercase;
    text-align: center;
    font-size: 18px;
    /*font-weight: 600; */
    border-radius: 0;
    padding: 10px 30px;
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease;
  }

  .rslides span .btn:hover, .rslides span a.event:hover {
    background: #fff;
    color: #000;
    /* border: 1px solid #ca6b1b; */
  }

  .rslides span a.event {
    color: #fff;
    background: #f68423;
    max-width: 280px;
    margin: 0 auto 22px;
    padding: 14px 0;
    /* position: absolute;
    
    color: #fff;
    padding: 14px 50px;
    margin-top: -130px;
    right: 43%;
    text-transform: uppercase;
    font-weight: bold;
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease; */
  }
  

  /* Footer Styles */

  .footer {padding: 0 50px;}
  .footer h3 {font-weight: bold; color: #000; text-transform: uppercase; font-size: 24px;}
  .footer p {font-size: 15px;}
  .footer ul.social {float: right; margin-top: 25px;}
  .footer ul.social li {float: left; margin: 0 10px;}
  .footer ul.social li:last-child {margin: 0;}

  /* Modals */
  .details {display: none;}
  #data h3 {color: #000; font-size: 22px; text-transform: uppercase; font-weight: bold;}
  .fancybox-skin {border-radius: 0!important;}
  .fancybox-skin img {width: 100%;}
  .fancybox-skin p {max-width: 860px; text-align: center; font-weight: 600; overflow: hidden;}
  .fancybox-skin .btn, .fancybox-skin .close-modal {
    margin: 10px auto 0;
    display: table;
  }


  .fancybox-inner {
    overflow: hidden!important;
  }

    .fancybox-outer, .fancybox-inner {height: 370px!important;}


  #data-universal .items {max-width: 440px; text-align: center; line-height: 25px; margin: 0 auto 20px;}
  div#data-universal.data-universal  p {
    max-width: 580px;
    margin: 20px auto 40px;
  }



  /* Start Custom */

  /* header styeles */

      header {
        background: #f0e9d9;
        padding: 0 20px;
      }


      header .logo {
      }

      header ul {
        margin-top: 12px;
        float: right;
      }

      header ul li {
        float: left;
        margin: 0 30px;
      }

      header ul li a {
        font-family: 'Poppins', sans-serif;
        font-size: 18px;
        font-weight: bold;
        color: #343434;
        text-transform: uppercase;
        -webkit-transition: all 0.5s ease;
        transition: all 0.5s ease;
      }

      header ul li a:hover, header ul li a:focus {
        color: #fff;
        text-decoration: none;
      }

      footer {
        background: #f0e9d9;
        padding: 20px;
      }

      footer p {
        font-size: 18px;
        font-weight: bold;
        color: #343434;
        text-align: center;
      }

      .heros {
        background: url(../images/hero.jpg) center top no-repeat;
        background-size: cover;
        /*display: none;
        opacity: 0;*/
        -webkit-transition: all 1s ease;
        transition: all 1s ease;
      }

      .heros.active {
        opacity: 1;
        display: block;
      }

      .margbtm20 {
        margin-bottom: 20px;
      }

      .about {
        background: url(../images/hero-about.jpg) center top no-repeat;
        background-size: cover;
      }

      .contact {
        background: url(../images/hero-work.jpg) center top no-repeat;
        background-size: cover;
      }

      .work {
      }

      .videos {
        backgroud: #fff;
        background-image: none;
   padding: 70px 0 180px;
    max-width: 100%;
    margin: 0 auto;
      }


      .videos h3 {
            text-align: center;
    font-size: 26px;
    margin-bottom: 60px;
      }

      .videos h4 {
            text-align: center;
    font-size: 22px;
    margin-bottom: 20px;
      }

      .videos h3 span {
        display: block;
    font-size: 32px;
      }

      .videos .item a {
      }

      .videos .item a:before {
        content: '';
        position: absolute;
        background: url(../images/play-btn-clear.png) center top no-repeat;
        width: 60px;
        height: 60px;
        display: block;
        z-index: 2;
        background-size: 60px;
        left: 50%;
        top: 50%;
        transform: translate3d(-50%, -50%, 0px);
      }

      .work .page-title {
        padding: 25px 0 25px 35px;
      }

      .street {
        background: #2386a7;
        color: #fff;
        text-transform: uppercase;
      }

      .beach {
        background: #f0e9d9;
        color: #2386a7;
        text-transform: uppercase;
      }

      .work .street-right {
        background: url(../images/street-photo-right.jpg) center top no-repeat;        
      }

      .work .street-left {
        background: url(../images/street-photo-left.jpg) center 75px no-repeat;
      }


      .work .beach-left {
        background: url(../images/beach-photo-left.jpg) center top no-repeat;
      }

      .work .twos-1 {
        background: url(../images/twos-1.jpg) center top no-repeat;
      }

      .work .twos-2 {
        background: url(../images/twos-2.jpg) 88% top no-repeat;
      }

      .work .twos-3 {
        background: url(../images/twos-3.jpg) center top no-repeat;
      }

      .work .twos-4 {
        background: url(../images/twos-4.jpg) center top no-repeat;
      }

      .work .twos-5 {
        background: url(../images/twos-5.jpg) -85px top no-repeat;
      }

      .work .twos-6 {
        background: url(../images/twos-6.jpg) center top no-repeat;
      }

      .work .beach-right {
         background: url(../images/beach-photo-right.jpg) 24% 0px no-repeat;
      }

      .work .tri-1 {
        background: url(../images/tri-1.jpg) center top no-repeat;
      }

      .work .tri-2 {
        background: url(../images/tri-2.jpg) center top no-repeat;
      }

      .work .tri-3 {
        background: url(../images/tri-3.jpg) center top no-repeat;
      }

      .work .tri-4 {
        background: url(../images/tri-4.jpg) center top no-repeat;
      }

      .work .tri-5 {
        background: url(../images/tri-5.jpg) center top no-repeat;
      }

      .work .tri-6 {
        background: url(../images/tri-6.jpg) center top no-repeat;
      }

      .work .tri-7 {
        background: url(../images/tri-7.jpg) center top no-repeat;
      }

      .work .tri-8 {
        background: url(../images/tri-8.jpg) center top no-repeat;
      }

      .work .tri-9 {
        background: url(../images/tri-9.jpg) center top no-repeat;
      }

      .work .street-1 {
        background: url(../images/street-1.jpg) center top no-repeat;
      }

      .work .street-2 {
        background: url(../images/street-2.jpg) center top no-repeat;
      }

      

      .work .bg {
        min-height: 890px;
        background-size: cover;
      }

      .about h3, .contact h3 {
        font-family: 'Poppins', sans-serif;
        font-size: 26px;
        color: #fff;
        font-weight: bold;
        letter-spacing: 6px;
      }

      .about h3 span {
        display: block;
        line-height: 45px;
      }

      .about p {
        font-size: 16px;
        color: #fff;
      }

      .about .text {
            background: rgba(0, 0, 0, 0.5);
    padding: 6% 30px;
    margin-top: 30vh;
    margin-bottom: 50vh;
      }

      .contact .text {
        background: rgba(96, 175, 195, 0.9);
        padding: 60px 30px;
        margin: 0;
      }

      .contact form .btn {
        background: #f0e9d9;
        color: #343434;
        padding: 20px 30px;
        text-transform: uppercase;
        display: inline-block;
        font-weight: 600;
        letter-spacing: 3px;
      }


      .logo-container {
        background: rgba(96, 175, 195, 0.7);
        padding: 50px;
      }

      .logo-container .logo {
        display: table;
        margin: 0 auto;
      }

      .booking-container {
        background: #f0e9d9;
        padding: 30px 0;
      }

      .booking-container p {
        text-align: center;
        color: #343434;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 5px;
      }

      .booking-container p span {
        display: block;
      }

        .btn {
        font-family: 'Poppins', sans-serif;
        font-size: 16px;
        font-weight: bold;
        background: #60afc3;
        padding: 20px 50px;
        margin: 30px auto;
        display: table;
        border-radius: 0;
        color: #fff;
        text-transform: uppercase;
      }

      a.btn:hover {
        color: #343434;
        background: #fff;
        -webkit-transition: all 1s ease;
        transition: all 1s ease;
      }

      .pier, .pier2 {
        background: url(../images/pier-bg.jpg) center top no-repeat;
        background-size: cover;
        padding: 14% 20px;
        overflow: hidden;
      }

      .pier2, .workpage .pier, .aboutpage .pier, .contactpage .pier {display: none;}

      .contactpage .pier2 {display: block;}

      .pier p {
        color: #343434;
        font-size: 24px;
        font-weight: 300;
      }

      .pier2 p {
        color: #343434;
        font-size: 14px;
        font-weight: normal;
      }

      .pier .item:after, .pier2 .item:after {
        content: " ";
        position: absolute;
        top: -80px;
        left: -509px;
        width: 439px;
        height: 585px;
        background: url(../images/glasses-woman.png) center top no-repeat;
        display: block;
      }

      .video.clevelander {
        background: url(../images/event-filming.jpg) center top no-repeat;
        display: block;
        /* padding: 400px; */
        width: 100%;
        background-size: cover;
        padding: 20%;
      }

      .video.clevelander:after {
        content: " ";
        position: absolute;
        top: 50%;
        left: 50%;
        width: 439px;
        height: 585px;
        background: url(../images/play-btn.png) center top no-repeat;
        display: block;
        transform: translateX(-50%);
        /* transform: translateY(0%); */
      }

      #photos h2 {
		     color: #fff;
		    font-size: 19px;
		    font-weight: 800;
		    text-transform: uppercase;
		    background: rgb(60, 68, 85);
		    padding: 20px 0 20px 40px;
		    width: 100%;
      }

      .grid-item { width: 50%; }
      .grid-item img {width: 100%;}
      .grid-item--width2 { width: 50%; }
      .grid-item:first-child {position: relative!important;}
      .grid-item:first-child:after {
		    content: 'Photo Project: Beautiful women of South Beach';
		    position: absolute;
		    color: #fff;
		    font-size: 15px;
		    font-weight: 800;
		    top: 0px;
		    left: 14px;
		    text-transform: uppercase;
		    background: rgba(0, 0, 0, 0.5);
		    padding: 20px;
		    width: 100%;
		    display: none;
      }



  

  



  /* End Custom */

    

      @media (max-width: 1200px) {
      .rslides span h3 {font-size: 23px;}
      .rslides span p {font-size: 16px;}
      .rslides span a.event {right: 41%;}
      }

      @media (max-width: 1024px) {
        .about .text  {
              background: rgba(0, 0, 0, 0.5);
              padding: 20% 30px;
              width: 100%;
              margin-top: 0;
              margin-bottom: 0;
        }

       #photos h2 {
        	font-size: 14px;
        }
      }


      @media (max-width: 991px) {
      .margtop50 {margin-top: 0;}
      .no-padding-tablet-up {padding: 0 30px;}
      .block-tablet-up {display: inline-block;}
      .no-padding {padding: 0;}
      .hide-tablet-down {display: none;}
      .rslides span a.event {right: 38%;}
      .pier p {font-size: 21px;}
      .pier .item:after {top: 0; bottom: 0; left: -429px;}
      header ul li a {font-size: 15px;}
      header ul li {margin: 0 18px;}
      }     


      @media (max-width: 768px) {
        .container {width: 100%;}
        .btn {margin: 0 auto;}
        .footer p, .footer h3 {text-align: center;}
        .footer ul.social {float: none; margin: 0 auto; display: table;}
        .footer ul.social li img {display: block; margin: 0 auto;}
        .footer ul.social li:last-child {margin: 0;}
        .ripped-bg .text {padding: 10px 50px;}
        .rslides span a.event {right: 36%;}
        .rslides span h3 {font-size: 20px;}
        .rslides span p, .rslides span .btn, .fancybox-skin .btn, .ripped-bg p {font-size: 13px;}
        .work .street-right, .work .street-left {min-height: 700px;}
        }

      @media (max-width: 640px) {
       .rslides span {display: none;}
       .about h3, .contact h3 {font-size: 20px;}
       .about p {font-size: 14px;}
       #photos h2 {
        	font-size: 13px;
        }

      }

       @media (max-width: 440px) {
       .work .street-right, .work .street-left {min-height: 400px;}
       .work .bg {min-height: 500px;}
       .about h3, .contact h3 {font-size: 20px;}
       .about p {font-size: 17px;}
       .contact .text {margin-top: 10vh; margin-bottom: 10vh;}
       .contact {background: url(../images/hero-work.jpg) -785px top no-repeat; background-size: cover;}
       .form-control {background-color: rgba(255, 255, 255, 0.7);}       
       }

       @media (max-width: 340px) {
      }