/*
body {
    display: -webkit-flex;
    -webkit-flex-direction: column;
    -webkit-align-items: stretch;
}

#container {
  display: inline-block;
  width: 100%;
  vertical-align: top;
}
*/

.dropping {
    background: #ffcc00;
}

.sub {
  display: inline-block;
  vertical-align: top;
  width: 45%;
}

#imageList {
  width: 100%;
}
/*
nav {
    display: -webkit-flex;
    -webkit-justify-content: center;
    -webkit-align-items: center;
  width: 50%;
    height: 250px;
}
*/

#image_display {
    -webkit-flex: 1;
    display: -webkit-flex;
    -webkit-align-items: stretch;
  width: 80%;
    max-height: 250px;
}

.imageBlock {
    border: solid 1px;
    border-radius: 5px;
    max-height: 200px;
    min-height: 200px;
}

.imageCanvas {
    border: solid 1px;
    border-radius: 5px;
    max-height: 200px;
    min-height: 100px;
}

canvas {
    -webkit-flex: 1;
    border: 1px #aaa solid;
    box-shadow: 0px 2px 10px rgba(0,0,0,0.5) inset;
    background-image: url('../images/work_area_background.png');
    background-repeat: repeat;
}

canvas#SaveSkipsPerHour, canvas#SaveSkips, canvas#SavesToday, canvas#SkipsToday, canvas#Skips7Days, canvas#SkipsWhy,
canvas#Saves,
canvas#ChartReq, canvas#ChartAds,
canvas#ChartGrossRev,canvas#ChartDailyGrossRev,canvas#ChartDailyAllGrossRev,
canvas#ChartDailyAll,canvas#ChartDailyPL,canvas#ChartDailyAdID,
canvas#ChartHourlyAll,canvas#ChartHourlyPL,canvas#ChartHourlyAdID,
canvas#ChartHourly,canvas#ChartDaily,canvas#ChartMonthly,canvas#ChartWeekly {
    background-image: url('');
}

#image_name, #image_size_original, #image_ratio_original {
    color: green;
    font-size: 11px;
    /*word-break: break-all;*/
    /*max-width: 350px;
    max-height: 33px;*/
}

#image_size {
    color: blue;
    font-size: 12px;
}

#image_ratio {
    color: blue;
    font-size: 12px;
    font-weight: bolder;
}

.cropimgbtn1x1 {
    height: 120px;
    width:  120px;
    margin: 10px;
    background-size: 100%;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-color: #ffffff;
}

.simplebtn {
    height: 40px;
    width:  50px;
    margin: 10px;
    background-size: 100%;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-color: #ffffff;
}

.imageSlide {
    height: 10%;
    overflow-y: scroll;
}

.panelCanvas {
    max-height: 250px;
    /*overflow-y: scroll;*/
    display: block;
}

::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 7px;
}

::-webkit-scrollbar-thumb {
    border-radius: 4px;
    background-color: rgba(0,0,0,.5);
    -webkit-box-shadow: 0 0 1px rgba(255,255,255,.5);
}

.redish {
    color:#B32018;
}
.bluish {
    color:#018ED5;
}
.greenish {
    color:#8DC442;
}
.cursorpointer:hover {
    cursor: pointer;
}

.cropimgbtn300x250 {
    height: 120px;
    width:  144px;
    margin: 10px;
    background-size: 100%;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    /*background-color: #ffffff;*/
}

@media only screen and (max-width: 1400px)
{
	#image_display { display: block;}
	#container_canvas { display: block;}
	#container_buttons { display: block;}
}
@media only screen and (max-width: 900px)
{
	#image_display { display: block;}
	#container_canvas { display: block;}
	#container_buttons { display: block;}
}

