/*
Theme Name: Presso-Child
Author: Wave Interactive
Author URI: http://www.waveinteractive.com/
Description: Client StyleSheet
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html 

*/

/** TABLE OF CONTENTS
 * -----------------------------------------------------------------------------
  *   
  * 1.0.0 - Custom styles
    * #.#.# - Name
    * 1.0.1 - Travel Guide Video styles
    * 1.0.2 - Travel Video Hub page
    * 1.0.3 - Archivist
    * 1.0.4 - Category container
    *
  * 2.0.0 - Shortcode library
    * #.#.# - Name
    * 2.0.1 - Expedia APP CTA
    * 2.0.2 - Expedia Youtube CTA
    * 2.0.3 - Multi-column
    * 2.0.4 - Width-1000
    * 2.0.5 - Crosslinks
    *
  * 3.0.0 - Media Queries - Please reference the correct chapter above
    * #.#.# - Media for # shortcode
    * 3.0.1 - Media for X shortcode
    * 3.0.2 - Media for 2.0.1 - Expedia App CTA styles
    * 3.0.3 - Media for 2.0.3 Multi-column
    * 3.0.4 - Media for 1.0.4 Category container

  * 4.0.0 - Updates to styles originating elsewhere
   * #.#.# - Update name
   * 4.0.1 - Video embed shortcode
 */


/** 
*   1.0.0 - Custom styles
*   ------------------------------------------------------------
*/

/** 1.0.1 - Travel Guide Video styles **/

    .container-video-post h3 {
        padding-top: 15px !important;
    }

    .container-video-post hr {
        border: 3px solid #ffcb00 !important;
        height: 0px !important;
    }

    .video-title-container {
        background-color: #ffffff;
        padding: 5px;
        margin: 0 auto;
    }

    .video-title-container h2 {
        font-size: 2em;
        margin: 0px auto !important;
        max-width: 900px;
        hyphens: none;
        text-align: center;
    }

    .video-title-container h1 {
        font-size: 4em;
        margin: 0px auto !important;
        max-width: 900px;
        hyphens: none;
        text-align: center;
    }

    .video-blue-header-container {
        padding: 0px;
        padding-top: 20px;
        padding-bottom: 20px;
        font-size: 1.2em;
        color: #ffffff;
        background-color: #0d345d;
        text-align: center;
    }

    .video-blue-header-container p {
        font-size: 1.0em !important;
        color: #ffffff !important;
    }

    .video-blue-header-container a {
        color: #fec401 !important;
        widght: 900 !important;
    }


/** 1.0.2 - Travel Video Hub page **/

    .child-wrapper {
        padding: 10px;
    }

    .travel-vid {
        height: 200px;
        min-height: 400px !important;
        margin: 0 auto 0px !important;
    }

    .link-div {
        padding: 20px;
        margin-bottom: 10px;
        font-size: 1.6em;
        color: #000000;
        border: 1px #0d345d solid;
        text-align: center;
        background-color: #ffffff;
    }

    .level3 {
        padding: 0px;
        padding-bottom: 5px;
        font-size: 2em;
        color: #000000;
        border-bottom: 2px #fec401 solid;
        text-align: center;
        background-color: #ffffff;
    }

    .h2title {
        font-size: 4em;
    }

    .h3title {
        font-size: 3em;
    }



/** 1.0.3 - Archivist **/
/**for Articles template**/
     .article-wrap {
         position:relative; 
         display:inline-block; 
         text-align: center; 
         padding-left: 10px; 
         padding-right:10px;
         vertical-align: text-top;
     }

     .article-wrap img {
         padding:0px!important;
     }

     .article-wrap a img:hover {
      opacity:0.7!important; 
      transition: 0.3s!important; 
      -webkit-transition:: 0.3s!important;
     }

     .article-wrap h4 {
         max-width:250px!important;
         text-align: left;
         margin-top: 0px!important;
     }

     .meta-style {
         font-size: 11px;
         font-family: Oswald, sans-serif;
         letter-spacing: 1px;
         line-height: 16px;
         text-transform: uppercase;
     }

     .hr hr {
         border-top:1px dotted #888888!important;
     }

     .date-meta {
         color: #b0b0b0;
     }



/** 1.0.4 - Category container **/
    .category-container h2 { 
        border-top: 6px solid #fec401; 
        padding-top:15px; text-align:left; 
    }


/** 
*   2.0.0 Shortcode library
*   ------------------------------------------------------------
*/

/** 2.0.1 Expedia App CTA **/

    .text-app-cta {
        background-color: #0d345c;
        border-left: 30px solid #fec402;
    }

    .level1-app-cta {
        padding: 10px;
        font-size: 3em;
        color: #ffffff;
        border: 0px #0d345d solid;
        text-align: center;
        position: relative;
        top: 50%;
        transform: translateY(-50%);
        line-height: 1em;
    }

    .wrapper-app-cta {
        display: -webkit-flex;
        -webkit-flex-flow: row wrap;
        -moz-flex-flow: row wrap;
        -ms-flex-flow: row wrap;
        flex-flow: row wrap;
        font-size: 14px;
        padding-top: 15px;
        padding-bottom: 15px;
    }

    .left-app-cta {
        flex: 1 300px;
        -webkit-flex: 1 300px;
        -ms-flex: 1 300px;
        padding: 0px;
    }

    .app-text-color {
        color: #ffc60b;
    }

    .right-app-cta {
        flex: 1 300px;
        -webkit-flex: 1 300px;
        -ms-flex: 1 300px;
        padding: 0px;
        background-color: #0d345c;
    }


/** 2.0.2 Expedia Youtube CTA **/

    .mid-white {
        padding: 0px;
        padding-top: 20px;
        padding-bottom: 20px;
        font-size: 1.2em;
        color: #ffffff;
        background-color: #ffffff;
        text-align: center;
    }

    .youtube-cta {
        background-color: #ff0000;
        text-align: center;
        margin: 0 auto;
        padding: 10px;
        color: #ffffff;
        font-size: 1.2em;
    }

        .youtube-cta a {
            color: #ffffff;
        }


/** 2.0.3 - Multi column **/

    .columns-text { 
        -webkit-column-count: 4; 
        -moz-column-count: 4; 
        column-count: 4; 
        text-align: left; 
        padding: 15px; 
    }


/** 2.0.4 - Width_1000 **/ /** For use on full-width screen template **/

    .width-1000-1 { 
        width: 100%; 
        margin: auto 0; 
        text-align: center;
    }

    .width-1000-2 { 
        max-width: 1000px; 
        margin: 0 auto;
    }


/** 2.0.5 - Crosslinks **/
    .crosslinks {
        border-left: 3px solid #ffcb00; 
        padding-left: 25px;
        line-height: 30px; 
        margin-top: 30px; 
        margin-bottom: 30px;
    }

    .crosslinks a {
        padding-left: 10px;
    }



/**
 * 3.0.0 Media Queries
 * -----------------------------------------------------------------------------
 */

/* Does the same thing as <meta name="viewport" content="width=device-width">,
 * but in the future W3C standard way. -ms- prefix is required for IE10+ to
 * render responsive styling in Windows 8 "snapped" views; IE10+ does not honor
 * the meta tag. See http://core.trac.wordpress.org/ticket/25888.
 */

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

    /** 3.0.1 - Media for x - x **/


    /** 3.0.1 - Media for 1.0.2 - Travel Video Hub page **/
    .child-wrapper {
        padding: 0px;
    }

    .link-div, .level3 {
        font-size: 1.2em;
    }
    .video-title-container h1 {
        font-size: 2em;
    }

    /** 3.0.2 - Media for 2.0.1 - Expedia App CTA styles **/
    .level1-app-cta {
        font-size: 2.2em;
        padding-top: 10px;
        line-height: 0.8em;
    }

    .level2-app-cta {
        padding-top: 15px;
    }

    .text-app-cta {
        background-color: #0d345c;
        border-left: 0px solid #fec402;
        border-top: 20px solid #fec402;
    }
 
    /** 3.0.3 - Media for 2.0.3 - Multi column  */
 
    .columns-text { 
        -webkit-column-count: 2; 
        -moz-column-count: 2; 
        column-count: 2;
    }
 
     /** 3.0.4 - Media for 1.0.4 - Category container  */
 
    .category-container h2 { 
        padding-right: 10px;
        padding-left:10px;
    }
}


/** 
*   4.0.0 Updates to styles originating elsewhere
*   ------------------------------------------------------------
*/

/** 4.0.1 Video embed update **/
    /** NOTE: this is for the [video_embed] shortcode **/
    .omsc-responsive-box-video, .omsc-responsive-box-map {  
        margin-top: -1px!important;
        margin-bottom: -1px!important; 
    }