/**
 * @author              Steven Palmer
 * @author url          https://coalaweb.com/
 * @author email        support@coalaweb.com
 * @copyright           Copyright (c) 2017 Steven Palmer All rights reserved.
*/

/*------------------------------------------------------------------------------
Layout
------------------------------------------------------------------------------*/
.cw-mod-contact-dark100,
.cw-mod-contact-dark90,
.cw-mod-contact-dark80,
.cw-mod-contact-dark70,
.cw-mod-contact-dark60,
.cw-mod-contact-dark50 {
    margin-left: auto; 
    margin-right: auto; 
}
.cw-mod-contact-dark100 {width: 100%;}
.cw-mod-contact-dark90 {width: 90%;}
.cw-mod-contact-dark80 {width: 80%;}
.cw-mod-contact-dark70 {width: 70%;}
.cw-mod-contact-dark60 {width: 60%;}
.cw-mod-contact-dark50 {width: 50%;}

#cw-mod-contact-dark { 
    margin:0 0 5px 0;
    padding:0px 5px;
}

#cw-mod-contact-dark form { 
    margin:0; 
    padding:0;
}

/*------------------------------------------------------------------------------
Messages 
------------------------------------------------------------------------------*/
#cw-mod-contact-dark .error, 
#cw-mod-contact-dark .success  {
    clear:both; 
    display:block; 
    padding: 5px 5px 5px 40px;
    -webkit-border-radius: 4px; 
    -moz-border-radius: 4px; 
    border-radius: 4px;  
    font-size:11px; 
    margin:5px 0px;
    line-height:20px;
    border: 1px solid rgba(255,255,255,0.16);
    background: rgba(255,255,255,0.08);
    color: #ccc;
}

#cw-mod-contact-dark .error{
    border-color: rgba(190,40,40,0.4);
    background: rgba(145,0,0,0.2) url(../icons/cw-alert.png) no-repeat scroll 0;
    color: #d67f76;
}

#cw-mod-contact-dark .success{
    border-color: rgba(70,120,185,0.4);
    background: rgba(0,87,132,0.2) url(../icons/cw-info.png) no-repeat scroll 0;
    color: #64b2de;
}

/*------------------------------------------------------------------------------
Fields
------------------------------------------------------------------------------*/
#cw-mod-contact-dark select, 
#cw-mod-contact-dark textarea, 
#cw-mod-contact-dark input[type="text"], 
#cw-mod-contact-dark input[type="password"], 
#cw-mod-contact-dark input[type="datetime"], 
#cw-mod-contact-dark input[type="datetime-local"], 
#cw-mod-contact-dark input[type="date"], 
#cw-mod-contact-dark input[type="month"], 
#cw-mod-contact-dark input[type="time"], 
#cw-mod-contact-dark input[type="week"], 
#cw-mod-contact-dark input[type="number"], 
#cw-mod-contact-dark input[type="email"], 
#cw-mod-contact-dark input[type="url"], 
#cw-mod-contact-dark input[type="search"], 
#cw-mod-contact-dark input[type="tel"], 
#cw-mod-contact-dark input[type="color"], 
#cw-mod-contact-dark .uneditable-input {
    display:inline-block;
    outline: 0px none;
    border-color: rgba(82, 168, 236, 0.8);
    color: rgb(239, 239, 239) !important;
    background: none repeat scroll 0% 0% rgb(31, 31, 31) !important;
    border: 1px solid rgb(56, 56, 56);
    box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.075) inset;
    padding:4px 6px;
    margin-bottom: 9px;
    font-size:13px;
    border-radius:3px;
    box-sizing: content-box;
    width:95%;
}

#cw-mod-contact-dark input[type="file"] {
    display: inline-block;
    box-sizing: content-box;
    width: 95%;
    padding: 4px 6px;
    margin-bottom: 5px;
    font-size: 13px;
    color: rgb(239, 239, 239) !important;
    box-shadow:none;
    line-height: 0;
}

#cw-mod-contact-dark label{
    margin-bottom:4px;
    display:inline-block;
    width:100%;
    color: rgb(239, 239, 239);
}

#cw-mod-contact-dark .copyme label, 
#cw-mod-contact-dark .copyme input,
#cw-mod-contact-dark .tos label, 
#cw-mod-contact-dark .tos input{ 
    display:inline-block;
    margin:0;
    font-weight:normal;
    color: rgb(239, 239, 239);
    width:80%;
}

#cw-mod-contact-dark .copyme input,
#cw-mod-contact-dark .tos input{ 
    vertical-align: middle;
    margin-left:5px;
    width:auto;
}

#cw-mod-contact-dark .copyme label,
#cw-mod-contact-dark .tos label{
    padding: 0px 5px;
    vertical-align: middle !important;
}

#cw-mod-contact-dark .copyme,
#cw-mod-contact-dark .tos{margin-top:10px;}
#cw-mod-contact-dark textarea {height:auto;}

#cw-mod-contact-dark textarea:focus, 
#cw-mod-contact-dark input:focus,
#cw-mod-contact-dark select:focus {
    border-color:rgba(82, 168, 236, 0.8);
    outline:0;
    outline:thin dotted \9;
    -webkit-box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
    -moz-box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
    box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
    font-weight: normal !important;
}

#cw-mod-contact-dark .invalid {
    font-weight: normal !important;
    color: rgb(157, 38, 29) !important;
}

#cw-mod-contact-dark input:focus:invalid, 
#cw-mod-contact-dark textarea:focus:invalid,
#cw-mod-contact-dark select:focus:invalid,
#cw-mod-contact-dark input[type=text]:focus:invalid{
    border-color: #B03535 !important;
    box-shadow: 0 0 5px #D45252 !important;
    font-weight: normal !important;
    color: rgb(157, 38, 29) !important;
}

/*------------------------------------------------------------------------------
Buttons
------------------------------------------------------------------------------*/
.cw-mod-contact-dark-buttons {
    display:inline-block;
    width:95%;
}

.cw-mod-contact-dark-buttons .btn-submit{
    margin-left:auto;
    margin-right:auto;
    float:right;
    margin-top: 5px;
}

/*------------------------------------------------------------------------------
Support Developer 
------------------------------------------------------------------------------*/
.cw-mod-contact-dark-copyrht{
    color: rgb(239, 239, 239);
    text-align: center;
    display:block;
    clear:both;
    font-size: 12px;
    margin:5px 0 0;
}

/*------------------------------------------------------------------------------
Character Count and Calendar
------------------------------------------------------------------------------*/
#cw-mod-contact-dark .charcount,
#cw-mod-contact-dark .cal-format{ 
    text-align: right;
    line-height:0.8em;
    margin-bottom:5px;
    width:95%;
}

#cw-mod-contact-dark .charcount{ 
    text-align: right;
}

#cw-mod-contact-dark .cal-format{ 
    text-align: left;
    display:block;
}

#cw-mod-contact-dark .char-counter{ 
    color: #2382B2; 
}

#cw-mod-contact-dark .charcount label,
#cw-mod-contact-dark .cal-format label{ 
    font-size: 95%;
    font-style: italic;
}

/*------------------------------------------------------------------------------
Captcha
------------------------------------------------------------------------------*/
#recaptcha_area input[type="text"] {
    display: inline-block;
    height: auto;
}

#recaptcha_area, #recaptcha_table { line-height: 0!important;}
#cw-mod-contact-dark .recaptcha {margin-top:10px;}

/*------------------------------------------------------------------------------
Added in version 0.0.3
------------------------------------------------------------------------------*/

#cw-mod-contact-dark .cal input[type="text"]{
    width:auto;
    min-width: 120px;
}

#cw-mod-contact-dark .cal label{
    width: 100%;
}

/*#cw-mod-contact-dark .btn {
    display: inline-block;
    padding: 4px 12px;
    margin-bottom: 0px;
    text-align: center;
    cursor: pointer;
    text-shadow: none;
    border-color: rgba(82, 168, 236, 0.8);
    color: rgb(239, 239, 239) !important;
    background: none repeat scroll 0% 0% rgb(31, 31, 31) !important;
    border: 1px solid rgb(56, 56, 56);
    border-image: none;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    box-shadow: none;
}*/

#cw-mod-contact-dark .cal .btn{
    font-size:14px;
}

/*If you are using a template without Bootstrap or if doesn't display an icon for the calendar please uncomment the the CSS below.*/
/*#cw-mod-contact-dark .icon-calendar {
    background: url("../icons/cw-calendar-dark.png") no-repeat center;
    display: inline-block;
    width: 14px;
    height: 14px;
}*/

#cw-mod-contact-dark .cal .input-append, 
#cw-mod-contact-dark .cal .input-prepend {margin-bottom: 0px;}

.cwc-msg {width:95%}

/*------------------------------------------------------------------------------
Added in version 0.0.4
------------------------------------------------------------------------------*/

/* Google Maps */
.cwc-map-canvas {
    width:100%;
    margin: 0;
    padding: 0;
}

.cw-mod-contact-map {
    margin: 15px 5px;
    border: 1px solid #DDD;
    width:95%;
}