
/* common customisations go here */

.well {
    min-height: 20px;
    padding: 15px;
    margin-bottom: 10px;
}
.well h1,
.well h2,
.well h3{
    margin-top: 10px;
    margin-bottom: 5px;
}

.well p {
    margin: 0 0 5px;
}

/*add spacing to items in timetable collapse*/

dt {
    margin: 5px 0;
}


/*styling exhibitor logos on conf pages*/

img.exhibit {
    width: 200px;
    height: auto;
    margin: 20px;
    box-shadow: 10px 10px 5px #ccc;
    -moz-box-shadow: 5px 5px 5px #ccc;
    -webkit-box-shadow: 5px 5px 5px #ccc;
    -khtml-box-shadow: 5px 5px 5px #ccc;}

img.exhibit2 {
    width: 400px;
    height: auto;
    margin: 20px;
    box-shadow: 10px 10px 5px #ccc;
    -moz-box-shadow: 5px 5px 5px #ccc;
    -webkit-box-shadow: 5px 5px 5px #ccc;
    -khtml-box-shadow: 5px 5px 5px #ccc;}

img.exhibit3 {
    width: 100px;
    height: auto;
    margin: 20px;
    box-shadow: 10px 10px 5px #ccc;
    -moz-box-shadow: 5px 5px 5px #ccc;
    -webkit-box-shadow: 5px 5px 5px #ccc;
    -khtml-box-shadow: 5px 5px 5px #ccc;}
	
/*full width images*/
	
img.full, iframe.full {
width: 100%;	
}

/*half width images*/
	
img.half {
width: 48%;	
}


/*quarter width images*/
	
img.quart {
width: 24%;	
}

/* 10%  width images*/

img.ten {
    width: 10%!important;;
}


/*Menu styles*/

#nav ul, #navbar ul  {

    font-family: 'Nunito', sans-serif;
}

#nav ul {
    padding-top:5px;

}


/*Tool Menu styles*/

ul.pull-right {
    margin: 5px 0 0 0 !important;
    padding: 0 0 0 5px!important;


}


/*general styles*/

.more {
    font-family: 'Nunito', sans-serif;
    font-weight:bold;

}


/*Heading styles*/

.h2, h2 {

    font-weight: normal;
    font-family: 'Nunito', sans-serif;
    margin: 5px 0 10px 0;
    font-weight: bold;

}

.h3, h3 {
    margin: 5px 0 10px 0;
    font-weight:bold;
    font-family: 'Nunito', sans-serif!important;

}

h1 {

    margin-bottom: 30px;
    font-size: 3em;
    font-family: 'Nunito', sans-serif!important;
}



/*Body styles*/

#main p, #main ul li, .well p, .well ul, #main ol li {

    font-family: 'Lora', serif;
    font-size: 1.2em;
    line-height: 1.7em;
    margin: 0 0 1.1em 0;
}

#main li {
    margin: 10px 0 10px 0;
}

#main ul li ul li {
    font-size: 1em;

}

.box {
    padding: 10px;
    margin-bottom: 20px;
    border-radius: 4px;
    background: #fff;
    border: 2px solid #e2e1c9;
}

.large {
    font-size: 1.2em;
}

/*menu styles*/

#nav ul, #navbar ul  {
    font-size: 1.2em;
}

#nav > ul > li > ul > li {
    font-size: 0.8em;
}

img .right {
    float:right;
}

/*img styles*/

img.left {
    float:left;
    padding-right:5px;

}

p.quote {
    font-size:1.3em!important;
    font-family: 'Nunito', sans-serif!important;
}


/*Footnotes text*/

.ftn_txt, .caption {
    font-size: 0.9em!important;
    color: dimgrey;

}
/*Buttons */

.btn a:link {
    font-family: 'Nunito', sans-serif;
}

.btn {
    margin: 3px;
}

.fat {
    font-family: 'Rammetto One', cursive!important;
}


/*Eli added for asa18 table*/





/*news box*/

.news {
   
    margin: 15px 0px;
    padding: 15px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    border-radius: 5px;
   
}







/*Eli added for responsive image text alignement*/

.responsive_element {
    width: 100%;
    display: table;
     margin: 15px 0px;
    padding: 15px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    border-radius: 5px;
    font-family: 'Nunito', sans-serif;
 }



#main.responsive p {
    font-family: 'Nunito', sans-serif;

}

#main p.responsive {
    display: table-cell;
    height: 100%;
    vertical-align: middle;
  
}

.responsive_txtframe {
      background-color: #f4f4f4; 
    border: 2px solid #e2e1c9;
    font-family: 'Nunito', sans-serif;
    color: #3d3c3a;

}



img.responsive, iframe.responsive {
    display: table-cell;
    width: 25%;
    height: auto;
    float: left;
    margin:10px;
   
}


/*Eli added for responsive image text alignement where images should be smaller ie when little text*/

.responsive.sm {
	 width: 10%;
	 
 }




#main p.responsive_txt {
    display: table-cell;
    height: 100%;
    vertical-align: middle;
    font-family: 'Nunito', sans-serif;   
    width: 75%;
    padding-left: 10px;


}

p.responsive_head  {
    display: table-cell;
    width: 35%;
    height: auto;
    vertical-align: middle;
    padding-right: 10px;
    border-right: 2px solid #e2e1c9;
}


@media only screen and (max-width: 479px){
    img.responsive {
        width: 100%;
        margin: 0px auto;
        display: block;
        height: auto;
        margin-bottom:10px;

    }


    /*set width images*/

    img.quart,   img.half,   img.ten {
        width: 100%!important;
    }


.responsive.sm {
	 width: 100%;
	 
 }

    p.responsive_head  {
        width: 100%;
        margin: 0px auto;
        display: block;
        height: auto;
        text-align:center;

    }
}
.word-wrap {
    /* Warning: Needed for oldIE support, but words are broken up letter-by-letter */
    -ms-word-break: break-all;
    word-break: break-all;
    /* Non standard for webkit */
    word-break: break-word;

    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
}




.row {
    display: flex;
    flex-flow: row wrap;
    align-content: flex-start;
    justify-content: space-between;
    margin-left: 0;
    margin-right: 0;
    padding-top: 1rem;
    padding-bottom: 1rem;
}

.row:first-of-type {
    padding-top: 0;
}
.row:last-of-type {
    padding-bottom: 0;
}
.row > div {
    padding-left: 15px;
    padding-right: 15px;
}
.row__1col {
    flex-flow: column wrap;
}
.row__1col > div {
    flex: 0 0 100%;
}
.row__2col > div {
    flex: 0 0 100%;
    width: 100%;
}

.row__3col > div, .row__4col > div {
    flex: 0 0 100%;
    width: 100%;
}

.row__3col.with-divider > div:first-child::before, .row__4col.with-divider > div:first-child::before {
    display: none;
}

@media screen and (min-width: 1200px) {


    .row__2col > div {
        flex: 0 0 50%;
        max-width: 50%;
    }

    .row__3col > div {
        flex: 0 0 30%;
        max-width: 30%;
    }

    .row__4col > div {
        flex: 0 0 25%;
        max-width: 25%;
    }

    .row {
        flex-flow: row nowrap;
    }

    .row__3col.with-divider > div, .row__4col.with-divider > div {
        position: relative;
    }
    .row__3col.with-divider > div::before, .row__4col.with-divider > div::before {
        content: "";
        position: absolute;
        top: 0;
        left: -9px;
        width: 1px;
        height: 100%;
        background-color: #919191;
    }

    .row__2col.with-divider > div:last-child {
        position: relative;
    }

    .row__2col.with-divider > div:last-child::before {
        content: "";
        position: absolute;
        top: 0;
        left: -9px;
        width: 1px;
        height: 100%;
        background-color: #919191;
    }
}


