/* Global */
/* rem, full support on mobile */
html {
    font-size: 14px;
    font-family:  Arial, Verdana, sans-serif;
    color: #28323f;
    line-height: 1.2;

    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;

    height:100%;
}

* {
    font-family: Arial,Verdana, sans-serif;
    color: #28323f;
    line-height: 1.2;
}
*, *:before, *:after {
    -webkit-box-sizing: inherit;
    -moz-box-sizing: inherit;
    box-sizing: inherit;
}

body {
    margin:0.5rem;

    /*height:100%;*/

    background-color:#fff;

    background-image: url('/webfiles/img/ems2016attendeeMessaging/background_320x480.png');
    background-repeat: no-repeat;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-position: top center;
}


.layout-attendee-messenger {
    height:100%;
    width:100%;
}


.button {
    background-color: #ffffff;
    border:1px solid #e6e6e6;
    border-radius: 5px;
    color:#062d7d;

    display: block;
    width:100%;
    font-size:16px;

    padding:0.5rem 0.5rem;

    text-decoration: none;
    text-align: center;

    -webkit-appearance:none;
}

button:focus,
button:hover {
    background-color: #e6e6e6;
    border-color:#a7a9ac;
}


h1, .h1 {
    font-size: 1rem;
    font-weight:bold;
    margin:0 0 1rem 0;
    color:#062d7d;
    padding:0;
}

h2, .h2 {
    font-size: 1rem;
    font-weight:normal;
    margin:0 0 1rem 0;
    color:#062d7d;
}

h3, .h3 {
    font-size: 1rem;
    font-weight:bold;
    margin:0 0 1rem 0;
    color:#062d7d;
}

a {
    color:#062d7d;
    text-decoration:underline;
}

a:hover,
a:focus {
    font-weight:bold;
}
p,ul, ol, table, .vertical-spacing {
    margin:0 0 1rem 0;
}
.vertical-spacing--1-4 {
    margin-bottom: 0.25rem;
}
.vertical-spacing--1-2 {
    margin-bottom: 0.5rem;
}
.vertical-spacing--1 {
    margin-bottom: 1rem;
}
.vertical-spacing--1_1-2 {
    margin-bottom: 1.5rem;
}

.co-message {
    border-left-width: 5px;
    border-left-style: solid;
    display:block;
    padding: 0.5rem;
}
.co-message.co-error {
    border-left-color: #ab0132;
    background-color:#fff;
}

.layout-chat__body {
    margin: 0 0 1rem 0;
    padding:1rem;
}

.horizontal-spacing {
    padding:0 0.5rem;
}
/*forms */

.form .form-label {
    font-weight: bold;
    color: #062d7d;
    padding:0 0.5rem;
}
.form .form-input--text {
    border: 1px solid #6a6a6a;
    border-radius: 5px;
    width:100%;
    padding:0.5rem;
}
/* grid */


.grid-container::before,
.grid-container::after{
    content: " ";
    display: block;
    overflow: hidden;
    visibility: hidden;
    font-size: 0;
    line-height: 0;
    width: 0;
    height: 0;
}
.grid-container {
    margin-left:auto;
    margin-right:auto;

    padding:0;

    display:block;
}
.participants-list {
    list-style-type: none;
    padding: 0;
    margin: 0 0 1rem 0;
    border-bottom: 1px solid #e6e6e6;
}
.participants-list .participant {
    padding: 0.5rem;
    border-top: 1px solid #e6e6e6;
}

.participant a {
    display: table;
    width:100%;
    text-decoration: none;
}
.participant .icon-link {
position: relative;
    height: 100%;
    width: 100%;
    display: block;    
}
.participant .icon-link:after{
    content: url('/webfiles/img/ems2016attendeeMessaging/triangle.png');
    display: block;
    height: 16px;
    position: absolute;
    right: 0;
    top: 8px;
}

.participant a:hover,
.participant a:focus  {
    background-color:#f2f1ed;
}

.participant-info,
.participant-icon{
    display: table-cell;
    vertical-align: top;
    padding: 0.25rem 0.5rem
}
.participant-icon {
    text-align: right;
}

.participant-info .title,
.participant-info .last-line {
    color: #062d7d;
    display: block;

}
.participant-info .title {
    font-weight: bold;
}
.icon-message-received {
    background-color: #ab0132;
    color: #fff;
    min-width:1.6rem;
    height:1.6rem;
    line-height: 1.6rem;
    text-align: center;
    display: inline-block;
    border-radius: 50%;
}

.status--hidden {
    display: none;
}
/* normalize chrome */
input:-webkit-autofill,
textarea:-webkit-autofill,
select:-webkit-autofill {
    background-color: #fff !important;
}
/* media query */

@media only screen and (min-width: 480px) {

    body {
        background-image: url('/webfiles/img/ems2016attendeeMessaging/background_480x800.png');
        background-repeat: no-repeat;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
    }

}
@media only screen and (min-width: 640px) {

    body {
        background-image: url('/webfiles/img/ems2016attendeeMessaging/background_640x960.png');
        background-repeat: no-repeat;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
    }

}
@media only screen and (min-width: 640px) and (min-height: 1136px) {

    body {
        background-image: url('/webfiles/img/ems2016attendeeMessaging/background_640x1136.png');
        background-repeat: no-repeat;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
    }

}
@media only screen and (min-width: 960px) {

    body {
        background-image: url('/webfiles/img/ems2016attendeeMessaging/background_960x1440.png');
        background-repeat: no-repeat;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
    }

}
@media only screen and (min-width: 960px) and (min-height: 1600px) {

    body {
        background-image: url('/webfiles/img/ems2016attendeeMessaging/background_960x1600.png');
        background-repeat: no-repeat;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
    }

}
