/* Global */
body{ overflow-y: scroll; margin: 0; background: #fff; color: #666; font-family: helvetica, arial, sans-serif; font-size: 12px; line-height: 20px; }
h1{ margin: 0 0 2em 0; font-size: 1.333333333em; line-height: 1em; color: #007fcc; text-transform: uppercase; }
hr{	display: block; margin: 0 0 2em 0; height: 1px; border: none; background: #ebebeb; }
p{ margin: 0 0 20px 0; color: #808080; font-size: 1.181818182em; }
strong{ color: #333; }
a{ text-decoration: none; color: #007fcc; }
a:hover{ text-decoration: underline; }
img{ border: none; }
table{ width: 100%; border-collapse : collapse; }
table td{ vertical-align: top; padding : 0; }

.clear{ clear: both; }

/* Main Structure */
#wrapper{ float: left; margin: 4em 0 160px 0; width: 780px; }
#body_login #wrapper{ position: absolute; top: 200px; left: 50%; margin-left: -155px; padding: 40px 20px; width: 300px; background: #ffffff; }

/* Columns */
.column{ position: relative; float: left; margin-right: 20px; width: 180px; min-height: 10px; }
.column.last{ margin-right: 0; }
.column.double{ width: 380px; }
.column.quadruple{ width: 780px; }

/* Header */
#header{ display: block; position: relative; z-index: 1000;	width: 100%; height: 60px; background: #007fcc; }
#header .shadow{ position: absolute; bottom: -10px; left: 0; width: 100%; height: 10px; background: url('../images/structure/header_shadow.png') repeat-x; }
#log_out{ display: block; float: right; position: relative; margin-top: 20px; margin-right: 20px; width: 90px; height: 20px; border: none; color: #fff; font-weight: 700; text-transform: uppercase; text-align: right; }
#komma_logo{ position: absolute; top: 14px; left: 30px; width: 143px; height: 30px; }
#komma_logo img{ width: 100%; }
.flags{ position: relative; float: right; margin-top: 20px; margin-right: 30px; height: 15px; z-index: 100; }
.flag{ display: block; float: left; margin-left: 10px; width: 20px; height: 20px; background: no-repeat url('../images/structure/kms_sprite.png'); opacity: 0.25; filter: alpha(opacity=25); cursor: pointer; }
.flag.active{ opacity: 1; filter: alpha(opacity=100); }
.flag.nl{ background-position: -10px -10px; }
.flag.en{ background-position: -70px -10px; }

/* Aside */
#nav_aside{ float: left; margin-right: 40px; width: 180px; height: 100%; background: #F4F5F5; }
#nav_content{ margin-top: 4em; width: 100%; text-align: center; }
#nav_heading{ display: block; color: #007fcc; margin-bottom: 2em; font-weight: bold; text-transform: uppercase; }
#nav_aside .sub_heading{ display: block; margin: 0 0 1em 0; color: #b2b2b1; font-size: .909090909em; font-weight: bold; text-transform: uppercase; }
#nav_aside ul{ display: block; margin: 0 ;padding: 0; }
#nav_aside li{ display: block; margin: 0 0 1em 0; font-size: .909090909em; font-weight: bold; text-transform: uppercase; }
#nav_aside a{ color: #b2b2b1; }
#nav_aside .active a{ color: #007fcc; }
#nav_aside a:hover{ text-decoration: none; }

/* Footer */
#footer{ display: block; position: relative; z-index: 1000; width: 100%; height: 80px; background: #007fcc; color: #fff; }
#footer .shadow{ position: absolute; width: 100%; height: 10px; background: url('../images/structure/header_shadow.png') repeat-x; }
#footer ul{ position: absolute; top: 30px; left: 30px; margin: 0; padding: 0; list-style: none; }
#footer ul li{ display: block; float: left; margin-right: 40px; text-transform: uppercase;  }
#footer ul li a{ color: #7EBED5; }
#footer ul li a:hover{ color: #fff; text-decoration: none; }
#body_login #footer{ position: absolute; left: 0; bottom: 0;  }

/* Selection */
::selection{ background:#007fcc; color:#fff; }
::-moz-selection{ background:#007fcc; color:#fff; }

/* Alerts */
.alert{ display: none; position: absolute; z-index: 100; top: 60px; left: 760px; width: 200px; padding: 20px; }
#body_login .alert{ left: auto; right: 30px; }
.alert .title{ text-transform: uppercase; font-weight: bold;}
.alert ul{ padding: 0 0 0 10px; margin: 10px 0; }
.alert .close{ position: absolute; top: 0; right: 0; padding: 5px 0 0 0; width: 30px; height: 25px; text-align: center; font-size: 16px; font-weight: bold; cursor: pointer; }

.alert.error{ background: #E81A3D; color: #fff;  }
.alert.error .close{ background: #A91A3D; }
.alert.error .close:hover{ background: #971A3D; }
.alert.success{ background: #17C970; color: #fff;  }
.alert.success .close{ background: #10AD5E; }
.alert.success .close:hover{ background: #078244; }

/* Login Background */
#background{ display: none; position: fixed; overflow: hidden; z-index: -1; width: 100%; height: 100%; }
#background img{ position: fixed; top: 50%; left: 50%; }

/* Form */
label{ display: block; height: 15px; font-size: .818181818em; font-weight: bold; text-transform: uppercase; line-height: 15px; }
.input_holder{ width: 100%; margin-bottom: 20px; }
.text_field{ display: block; width: 100%; height: 30px; padding: 0 10px; border: 1px solid #cccccc; color: #BBBBBB; line-height: 30px; box-sizing: border-box; -moz-box-sizing: border-box;-webkit-box-sizing: border-box; }
textarea{ display: block; width: 100%; height: 370px; margin: 0; padding: 2px 0; border: 1px solid #cccccc; color: #BBBBBB; resize: none; } /* temp */
.input_error .text_field{ border: 1px solid red; }
.input_error textarea{ border: 1px solid red; }
.input_error label{ color: red }
.input_holder select{ width: 100%; }
.rating_stars{ margin: 0; padding: 0; }
.rating_stars li{ display: block; float: left;  width: 25px; height: 15px; background: no-repeat url('../images/structure/kms_sprite.png') -40px -40px; cursor: pointer;  }
.rating_stars .active{ background-position: -10px -40px }

/* Images upload part */
.block_quote{ background: #F4F5F5; padding: 15px 15px 20px 15px; font-style: italic; margin-bottom: 20px; line-height: 20px; }
.column.double .block_quote{ width: 340px; }
#my_file{ display: none; }
#loader{ display: none; }

/* Buttons */
.btn{ display: block; position: relative; float: left; margin: 15px 20px 20px 0; font-weight: 700; text-transform: uppercase; text-align: center; line-height: 1em; cursor: pointer; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}
.btn:hover{ text-decoration: none; }
.btn input{ position: absolute; top: 0; left: 0; z-index: 4; margin-right: 10px; padding: 7px 10px 4px 10px; width: 180px; background: none; border: none; color: #fff; font-size: 1em; font-weight: 700; text-transform: uppercase; cursor: pointer; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }
.btn .out, .btn .over{ display: block; padding: 9px 10px 8px 10px; width: 180px; height: 30px; box-sizing: border-box; -moz-box-sizing: border-box;-webkit-box-sizing: border-box;}
.btn .out{ position: relative; z-index: 1;   }
.btn .over{ position: absolute; z-index: 2; top: 0; left: 0; opacity: 0; filter: alpha(opacity=0);  }
.btn.blue .out{ background: #007fcc; border: 1px solid #0075af; color: #fff; }
.btn.blue .over{ background: #0055B2; border: 1px solid #0055B2; color: #fff;}

.btn.upload{ margin-bottom: 33px; }

/* Videos */
.video_field{ display: block; float: left; margin-right: 20px; width: 178px; height: 30px; padding: 0 10px; border: 1px solid #cccccc; color: #BBBBBB; box-sizing: border-box; -moz-box-sizing: border-box;-webkit-box-sizing: border-box; }

/* ItemList */
.item_list{ margin:0; padding:0; }
.item_list li{ display: block; margin: 0 0 1px 0; padding: 0; height: 89px; width: 100%; background: #ebebeb; }
.item_list li.alt{ background: #F4F5F5; }
.item_list .thumb{ display: block; position: relative; overflow: hidden; float: left; width: 89px; height: 89px; border-right: 1px solid #ffffff; }
.item_list .thumb img.video{ position: absolute; left: 50%; top: 50%; }
.item_list .info{ display: block; float: left; height: 69px; padding: 10px; }
.item_list .action{ display: block; float: right; margin: 10px 10px 0 20px; padding-top: 10px; width: 100px; height: 59px; text-align: right;}
.item_list .action a{ display: block; margin-bottom: 10px; font-size: .909090909em; text-transform: uppercase; font-weight: bold;}

.item_list .cb{ display: block; float: left; height: 89px; width: 30px; }
.item_list .cb input{ width: 10px; height: 10px; }
.item_list .title{ display: block; float: left; font-size: 1.181818182em; font-weight: bold; }
.item_list .title a{ color: #666; }
.item_list .streamer{ display: block; width: 450px; font-size: 1em; color: #888888; }
.item_list .date{ display: block; width: 200px; font-size: .909090909em; font-weight: bold; }
.item_list .location{ display: block; width: 200px; font-size: 1em;  }

.filter_back a { font-size: 1.166666667em; text-transform: uppercase; color: #888888; font-weight: bold; }
.filter_back a:hover{ color: #444444; text-decoration: none; }

.check_all_holder{ margin-bottom: 20px; line-height: 1em; height: 12px; }
.check_all_holder input{ margin: -1px 0 0 0;float: left; }
.check_all_holder label{ margin: 0 0 0 10px; float: left; cursor: pointer; }

/* Page Nav */
.page_nav{ position: relative; width: 100%; margin-top: 40px; text-transform: uppercase; font-weight: bold; }
.page_nav .prev{ display: block; width: 20%; float: left; }
.page_nav .next{ display: block; width: 20%; float: right; text-align: right; }
.page_nav .page_numbers{ display: block; position: absolute; top: 0; left: 20%; margin: 0; padding: 0; width: 60%; text-align: center; list-style: none;}
.page_nav .page_numbers li{ display: inline-block; width: 2em; text-align: center; }
.page_nav .page_numbers li a{  color: #BBBBBB; }
.page_nav .page_numbers li.active a{ color: #0075af; text-decoration: underline; }


/* Image list */

.item_images{ display: block; width: 400px; margin:0; padding:0; }
.item_images li{ display: block; float: left; padding: 3px; margin: 0 10px 20px 0; width: 80px; background: #F4F5F5; }
.item_images li.isThumb{ border: 3px solid #0075af; padding: 0; }
.item_images .last{ }
.item_images img{ display: block; float: left; width: 80px; height: 80px;  }
.item_images .btn{ display: block; float: left; margin: 3px 0 0 0; padding: 10px; width: 60px; color: #fff; text-align: center; }
.item_images .btn a{ color: #fff; }
.item_images .btn a:hover{ text-decoration: none; }
.item_images .insert_image_link, .item_images .insert_video_link{ background: #0075af; }
.item_images .insert_image_link:hover, .item_images .insert_video_link:hover{ background: #0055B2; }
.item_images .delete_image, .item_images .delete_video{ background: #F25565;}
.item_images .delete_image:hover, .item_images .delete_video:hover{ background: #EF1131;}
.item_images .caption textarea{ margin: 10px; padding: 10px; width: 140px; height: 60px; color: #BBBBBB; font-family: helvetica, arial, sans-serif; font-size: 11px; }
.item_images .choose_thumb{ display: block; float: left; margin: 10px 0 0 5px; width: 70px;}
.item_images .choose_thumb label{ display: inline;}

/* Sortable ItemList */
#sortable-list{ padding:0; }
#sortable-list li{ margin: 0 10px 10px 0; padding: 5px 10px; width: 380px; height: 20px !important; background: #fff; color: #333; list-style: none; cursor: move;  border: 1px solid #f2f2f2; }
#sortable-list li.image{ float: left; padding: 0; width: 90px; height: 90px !important  }
/* Overrides */
.no-margin-top{ margin-top: 0 !important; }
.no-margin-right{ margin-right: 0 !important; }

/* Media Queries */
@media all and (max-width: 1015px){
    body, #footer{ width: 1000px; }
}

@media all and (min-width: 1275px){
    .alert{ left: 1020px; }
}

.hide{ display: none; }