/* ------------ COMMON CSS FOR ALL GO2WEB SITES ------------ */

/* ------------ RESPONSIVE MEDIA EMBED ------------ */

.media_embed {
    position: relative;
    padding-bottom: 56.25%; /* 16/9 ratio */
    padding-top: 30px; /* IE6 workaround*/
    height: 0;
    overflow: hidden;
    
    /* Documentation: */
    /* http://andmag.se/2011/11/responsive-embeds/ */
}

.media_embed iframe,
.media_embed object,
.media_embed embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

#block-block-7 {
    margin-bottom: 60px;
}




/* ------------ RESPONSIVE IMAGES ------------ */

#region-content img, #region-branding img, #region-sidebar-first img, #region-sidebar-second img, #region-go2alpha-first img, #region-go2bravo-first img {
    max-width: 100%; /* quick fix, trying 100% - 40px (20px for earch side of the 100%) */
    height: auto !important; /* making sure there are no local styles on the HTML, which will distort the images*/
}


#zone-branding-wrapper p {
    border: 0; /* Drupal adds a <p> to sourround the <img>. This rule resets back to 0 styles associates with <p> */
    padding: 0;
    margin: 0;
}





/* ------------ 2 COLUMNS LAYOUT WITHIN THE CONTENT AREA ------------ */

#region-content div.main {
    overflow: auto;
    width: 100%; /* for older versions of IE, be careful with borders, paddings or margins here */
    margin-bottom: 20px;
}

#region-content div.first {
    float: left;
    width: 30%;
    margin-right: 20px;
}

#region-content div.second {
    float: left;
    width: 60%;
}



/* ------------ READABLE TEXT ------------ */

article {
    /* padding-left: 20px; */
    /* padding-right: 40px; double on the RHS than on the LHS */
    /* padding: 2em 3em 4em 3em; */
    /* background: #fff;  ---#fcfcfc in the body--- */
    /* border: 1px solid #eee;* /
    /* 8 to 12 words per line, or 45 to 85 characters per line */
    /* line-height: 1.3em; */
    /* use a media query to target that width, and set a more readable line-height in the CSS */
}

article p + p {
    /* text-indent: 2em; */
}


article p {
    /* margin-bottom: 0.5em;  --- half of the line height --- */
}