/*------------ Reset Browser Defaults ------------------*/

* { outline-style: none; -webkit-text-size-adjust: none; }
h1,h2,h3,h4,h5,h6,pre,code { font-size:1em; }
ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset { margin:0; padding:0; }
input { margin: 0; }
a img,:link img,:visited img { border: none; }
ol,ul{list-style:none;}
th{text-align:left;}
h1,h2,h3,h4{font-size:100%;}
q:before,q:after{content:'';}
code{font:115% monospace; font-size:100%;}
th{text-align:left;}
cite,code,th,address,footer{font-style:normal;font-weight:normal;}
body { font-size:62.5%; }
input, textarea {}
a{cursor:pointer; color:#6F6F6E; text-decoration:none; transition: color 0.5s ease;}

/*------------------------------------------------------*/


body{
	font-family: 'Source Sans Pro','Helvetica Neue',Helvetica,Arial,sans-serif;
    font-weight: 400;
    font-size: 14px;
	}

.clear{
	clear:both;
	}






/*------Top Header------*/








/* Account Info Page */


#accountInfoContain{
	padding:40px;
	}

#gmap_canvas, .mapouter, .gmap_canvas{
	width:100% !important;
	}


#accountInfoDetailsBox{
	padding:30px;
	}

.deviceStatusIndicator{
	width: 11px;
    height: 11px;
    border-radius: 20px;
    background-color: #c5c5c5;
    float: left;
    margin-top: 3px;
    margin-right: 8px;
	}


#accountPageAddDeviceButton{
   	background-color: #39B54A;
    text-align: center;
    font-weight: 600;
    margin-top: 25px;
    margin-left: 60px;
	}


#page_search{
	padding:5px;
	padding-left: 10px;
	font-size:14px;
	}


#updateSearchButton{
	cursor:pointer;
	width: 84px;
    height: 34px;
    margin-left: -2px;
    margin-right: 5px;
    border: solid 1px #3061AC;
    border-radius: 0px 3px 3px 0px;
    background:#3061AC;
    color:#fff;
	}


#updateSearchButton label{ 
	margin-left: 7px;
    font-size: 14px;
	}


.listSettingsButton{
	cursor:pointer;
    height: 34px;
    margin-right: 5px;
    border: solid 1px #3061AC;
    border-radius: 3px;
    padding-left: 10px;
    padding-right: 10px;
    background:#3061AC;
    color:#fff;
	}


.listSettingsButton label{ 
	margin-left: 7px;
    font-size: 14px;
    cursor:pointer;
	}



.smallButtonHover{
	-webkit-transition: transform .15s ease-out;
    -moz-transition: transform .15s ease-out;
    -o-transition: transform .15s ease-out;
    transition: transform .15s ease-out;
	}


.smallButtonHover:hover{
	-webkit-transform: scale(1.055);
    -moz-transform: scale(1.055);
    -ms-transform: scale(1.055);
    -o-transform: scale(1.055);
    transform: scale(1.055);
	}


.smallButtonHover:active{
	-webkit-transform: scale(1.0);
    -moz-transform: scale(1.0);
    -ms-transform: scale(1.0);
    -o-transform: scale(1.0);
    transform: scale(1.0);
	}



.smallIconHover{
	-webkit-transition: transform .15s ease-out;
    -moz-transition: transform .15s ease-out;
    -o-transition: transform .15s ease-out;
    transition: transform .15s ease-out;
	}


.smallIconHover:hover{
	-webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
    transform: scale(1.2);
	}


.smallIconHover:active{
	-webkit-transform: scale(1.0);
    -moz-transform: scale(1.0);
    -ms-transform: scale(1.0);
    -o-transform: scale(1.0);
    transform: scale(1.0);
	}


button{
	cursor:pointer !important;
	}


#addNewTagButton{
	background-color: #39B54A;
    text-align: center;
    width: 80px;
    font-weight: 600;
    margin-left: 60px;
	}

#saveNewTagButton{
	background-color: #39B54A;
    text-align: center;
    width: 80px;
    font-weight: 600;
    margin-top:30px;
    float:right;
	}


#listAddButtonBox{
	display:inline-block;
	}





#listTable{
	font-family: 'Arial';
  	margin-top:10px;
  	border-radius: 3px;
  	border-collapse: collapse;
  	border: 1px solid #eee;
  	border-bottom: 2px solid #3C4649;
  	min-width:539px;
	}


#listTable tr:hover {
  	background: #f4f4f4;
	}

#listTable tr:hover td {
  	
	}	


#listTable th, #listTable td {
  	border: 1px solid #eee;
  	padding: 8px 8px;
  	border-collapse: collapse;
  	font-size:12px;
	}

#listTable th {
  	background: #3C4649;
  	color: #fff;
  	font-size: 12px;
  	padding:8px 8px;
	}

#listTable th.last {
  	border-right: none;
	}


.listTableHeadertext{
	cursor:pointer;
	color:#fff !important;
	font-weight:600;
	text-decoration: underline;
	}


.listHeaterTextSortIcon{
	color:#fff;
	margin-left:5px;	
	}

#listTable #client_id{
	width:100%;
	height:28px;
	font-size:12px;
	}

#listTable .fa{
	margin-right: 5px;
    margin-left: 5px;
    font-size: 14px;
    line-height:14px;
    width: 16px;
    -webkit-transition: transform .15s ease-out;
  	-moz-transition: transform .15s ease-out;
  	-o-transition: transform .15s ease-out;
  	transition: transform .15s ease-out;
	}


#listTable .fa:hover{
	-webkit-transform: scale(1.15);
    -moz-transform: scale(1.15);
    -ms-transform: scale(1.15);
    -o-transform: scale(1.15);
    transform: scale(1.15);
	}

#listTable .fa:active{
	-webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
	}


.tableTooltip{
	float:right;
	}

.tableTooltip:hover .tableTooltipMessageBox{
	display:block;
	}


.tableInfoIcon{
	height:16px;
	width:16px;
	float:right;
	cursor:pointer;
	 -webkit-transition: transform .15s ease-out;
  	-moz-transition: transform .15s ease-out;
  	-o-transition: transform .15s ease-out;
  	transition: transform .15s ease-out;
	}

.tableInfoIcon:hover{
	-webkit-transform: scale(1.15);
    -moz-transform: scale(1.15);
    -ms-transform: scale(1.15);
    -o-transform: scale(1.15);
    transform: scale(1.15);
	}

.tableInfoIcon:active{
	-webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
	}



.tableTooltipMessageBox{
	display:none;
	position: absolute;
    max-width: 400px;
    background: #fff;
    margin-top: 21px;
    border: solid 1px #3C4649;
    padding: 10px;
    margin-left: -100px;
    border-radius: 3px;
    box-shadow:5px 5px 15px rgba(0,0,0,.5);
	}

.tableTooltipMessageBox a{
	text-decoration:underline;
	color:blue;
	}


.toolTipOpen{
	display:block !important;
	}




























#accountServiceContain{
	padding:50px;
	}

#saveButtonBasic{
	background-color: #39B54A;
    text-align: center;
    width: 80px;
    font-weight: 600;
    margin-top: 25px;
    margin-left: 60px;
	}

.serviceIcon{
	margin-left:10px;
	margin-right:10px;
	margin-top:-5px;
	}

.serviceCheckRow{
	height:35px;
	min-width:260px;
	}

.serviceCheckRow input{
	margin-top:15px;
	}

#servicesSelectAllBox{
	margin-top:15px;
	}

#servicesSelectAllBox input{
	margin-right:5px;
	}

#account_help_main_div a{
	color:blue;
	text-decoration: underline;
	cursor:pointer;
	}






/*------Aside Menu------*/


#aside{
	position:fixed;
	top:68px;
	width:230px;
	height:100%;
	overflow-y: auto;
	background-color:#222d32;
	-webkit-transition: width .25s ease-out;
  	-moz-transition: width .25s ease-out;
  	-o-transition: width .25s ease-out;
  	transition: width .25s ease-out;
	}


#aside::-webkit-scrollbar {
  	width: 7px;
	}


#aside::-webkit-scrollbar-thumb {
	border:none;
  	background:rgba(255,255,255,.4) !important;
  	border:solid 2px #222d32;
	}



#asideScrollFiller{
	width:100%;
	height:75px;
	}


.asideClosed #aside{
	width:50px;
	}

.asideLi{
	width:100%;
	height:44px;
	opacity:.5;
	cursor:pointer;
	}


.asideSelected{
	background-color:#1D282C;
	opacity:1;
	}


.asideSelected .asideSelectedIndicator{
	display:block;
	}


.asideLi:hover{
	background-color:#1D282C;
	opacity:1;
	}

.asideSelectedIndicator{
	display:none;
	position:absolute;
	width:2px;
	height:inherit;
	background-color:#f39c12;
	}


.asideLiIcon{
	width:44px;
	height:44px;
	float:left;
	}


.asideLiIcon svg{
	height:16px;
	width:16px;
	margin-top:14px;
	margin-bottom:14px;
	margin-left:15px;
	margin-right:15px;
	fill:#fff;
	}


.makeIconL svg{
	height:18px;
	width:18px;
	margin-top:13px;
	margin-bottom:13px;
	margin-left:16px;
	margin-right:16px;
	}


.asideLiTitle{
	opacity:1;
	width:calc(100% - 44px);
	line-height: 44px;
	color:#fff;
	font-weight: 400;
    font-size: 14px;
    float:left;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    -webkit-transition: opacity .25s ease-out;
  	-moz-transition: opacity .25s ease-out;
  	-o-transition: opacity .25s ease-out;
  	transition: opacity .25s ease-out;
	}


.asideClosed .asideLiTitle{
	opacity:0;
	}


#mainContain{
	background-color:#fff;
	position:fixed;
	overflow:auto;
	overflow-y: overlay;
	top:68px;
	left:230px;
	bottom:0;
	right:0;
	-webkit-transition: left .25s ease-out;
  	-moz-transition: left .25s ease-out;
  	-o-transition: left .25s ease-out;
  	transition: left .25s ease-out;
	}


.asideClosed #mainContain{
	left:50px;
	}










::-webkit-scrollbar {
  width: 12px;               /* width of the entire scrollbar */
}

::-webkit-scrollbar-track {
  background: rgba(255,255,255,.0);        /* color of the tracking area */
}

::-webkit-scrollbar-thumb {
  background-color: rgba(0,0,0,.5);    /* color of the scroll thumb */
  border-radius: 20px;       /* roundness of the scroll thumb */
  border: 3px solid rgba(255,255,255,1);  /* creates padding around scroll thumb */
}


/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  	background: rgba(0,0,0,.7);
  	cursor:pointer; 
	}




#display-list-settings{
	z-index:1000 !important;
	}


#listContain{
	width:calc(100% - 120px);
    margin:60px;
	}

#groupAreaBox{
	margin-left: -30px;
    margin-top: -13px;
	}


.groupCheckBox{
	margin-left:35px;
	margin-top:5px;
	}

#groupAllselectAllBox{
	margin-top:23px;
	margin-left:8px;
	}

#groupAllselectAllBox input{
	margin-right:3px;
	margin-top:5px;
	}

#groupSaveButton{
	background-color: #39B54A;
    text-align: center;
    width: 80px;
    font-weight: 600;
    margin-top: 25px;
    margin-left: 60px;
	}




























/*------My Content------*/



#myContentContain{
	display:block;
	margin-left:auto;
	margin-right:auto;
	width:calc(100% - 10px);
	padding:5px;
	max-width:1200px;
	height:auto;
	margin-top:20px;
	/* overflow-y: auto; */
	}



#myConHeaderContain{
	width:calc(100% - 10px);
	padding:5px;
	margin-top:25px;
	margin-bottom:25px;
	}


#myConHeaderSearchBox{
	position:relative;
	width:calc(50% - 7px);
	height:40px;
	border:1px solid #CCCCCB;
	border-radius:3px;
	float:left;
	}


#myConHeaderSearchIcon{
	width:40px;
	height:40px;
	float:left;
	}


#myConHeaderSearchIcon svg{
	fill:#888888;
	width:20px;
	height:20px;
	padding:10px;
	padding-left: 12px;
	}


#myConHeaderSearchInput{
	font-size:14px;
	width:calc(100% - 100px);
	height:40px;
	line-height:40px;
	border:none;
	float:left;
	}


#myConHeaderAssetCount{
	position:absolute;
	top:0;
	right:0;
	height:40px;
	line-height:40px;
	font-size:16px;
	font-weight:600;
	text-align:center;
	color:#888888;
	padding-right:14px;
	padding-left:14px;
	}


#myConHeaderFilterSortBox{
	display:none;
	width:calc(25% - 6px);
	height:40px;
	float:left;
	margin-left:10px;
	}


#myConHeaderFilterButton{
	cursor:pointer;
	width:40px;
	height:40px;
	border:1px solid #CCCCCB;
	border-radius:3px;
	float:left;
	-webkit-transition: transform .1s ease-out;
  	-moz-transition: transform .1s ease-out;
  	-o-transition: transform .1s ease-out;
  	transition: transform .1s ease-out;
	}


#myConHeaderFilterButton:hover{
	-webkit-transform: scale(1.1);
	-moz-transform: scale(1.1);
  	-ms-transform: scale(1.1);
  	-o-transform: scale(1.1);
  	transform: scale(1.1);
	}


#myConHeaderFilterButton:active{
	-webkit-transform: scale(1.00);
	-moz-transform: scale(1.00);
  	-ms-transform: scale(1.00);
  	-o-transform: scale(1.00);
  	transform: scale(1.00);
	}





#myConHeaderFilterButton svg{
	fill:#888888;
	width:26px;
	height:26px;
	padding:7px;
	}


.myConHeaderFilterButtonOpen{
	background-color:#005BA6 !important;
	border:solid 1px #005BA6 !important;
	}

.myConHeaderFilterButtonOpen svg{
	fill:#fff !important;
	}


#myConHeaderSortBox{
	width:calc(100% - 56px);
	height:40px;
	border:1px solid #CCCCCB;
	border-radius:3px;
	margin-left:10px;
	float:left;
	-webkit-transition: transform .1s ease-out;
  	-moz-transition: transform .1s ease-out;
  	-o-transition: transform .1s ease-out;
  	transition: transform .1s ease-out;
	}




.myConHeaderSortBoxActive{
	background-color:#005BA6 !important;
	border:solid 1px #005BA6 !important;
	color:#fff;
	}

.myConHeaderSortBoxActive #myConHeaderSortIconBox svg{
	fill:#fff;
	}

.myConHeaderSortBoxActive #myConHeaderSortSelectBox{
	background-color:#005BA6 !important;
	color:#fff;
	}




.myConHeaderSortBoxHover{
	-webkit-transform: scale(1.03);
	-moz-transform: scale(1.03);
  	-ms-transform: scale(1.03);
  	-o-transform: scale(1.03);
  	transform: scale(1.03);
	}

.myConHeaderSortBoxActiveState{
	-webkit-transform: scale(1.00) !important;
	-moz-transform: scale(1.00) !important;
  	-ms-transform: scale(1.00) !important;
  	-o-transform: scale(1.00) !important;
  	transform: scale(1.00) !important;
	}







#myConHeaderSortIconBox{
	width:40px;
	height:40px;
	float:left;
	}

#myConHeaderSortIconBox svg{
	fill:#888888;
	width:26px;
	height:26px;
	padding:7px;
	}

#myConHeaderSortSelectBox{
	font-size:14px;
	color:#888888;
	width:calc(100% - 51px);
	height:40px;
	float:left;
	border:none;
	cursor:pointer;
	}

#myConHeaderUploadButton{
	cursor:pointer;
	font-size:14px;
	font-weight:500;
	height:40px;
	line-height:40px;
	background-color:#005BA6;
	color:#fff;
	float:right;
	border-radius:3px;
	-webkit-transition: transform .15s ease-out;
  	-moz-transition: transform .15s ease-out;
  	-o-transition: transform .15s ease-out;
  	transition: transform .15s ease-out;
	}


#myConHeaderUploadButton:hover{
	-webkit-transform: scale(1.075);
	-moz-transform: scale(1.075);
  	-ms-transform: scale(1.075);
  	-o-transform: scale(1.075);
  	transform: scale(1.075);
	}


#myConHeaderUploadButton:active{
	-webkit-transform: scale(1.00);
	-moz-transform: scale(1.00);
  	-ms-transform: scale(1.00);
  	-o-transform: scale(1.00);
  	transform: scale(1.00);
	}


#myConHeaderUploadButtonIcon{
	width:40px;
	height:40px;
	float:left;
	}


#myConHeaderUploadButtonIcon svg{
	fill:#fff;
	height:26px;
	width:26px;
	padding:7px;
	padding-left:17px;
	}


#myConHeaderUploadButtonText{
	float:left;
	padding:0 17px;
	color:#fff;
	}


#myConMainFilterBox{
	display:none;
	width:calc(100% - 12px);
	border: 1px solid #CCCCCB;
	border-radius:3px;
	margin-top:0px;
	margin-bottom:20px;
	margin-left:auto;
	margin-right:auto;
	}

.filterBoxOpen #myConMainFilterBox{
	display:block;
	}

.myConMainFilterInnerBox{
	width:auto;
	min-width:90px;
	float:left;
	padding:30px;
	}


.myConMainFilterInnerBoxTitle{
	color:#888888;
	font-size:12px;
	text-transform: uppercase;
	margin-bottom:10px;
	font-weight:500;
	}


.myConMainFilterInnerCheckBox{
	position:relative;
	margin-bottom:8px;
	}


.myConMainFilterInnerCheckBox input{
	cursor:pointer;
	width:15px;
	height:15px;
	}


.myConMainFilterInnerCheckBox label{
	position:absolute;
	top:0;
	font-size:13px;
	line-height:15px;
	margin-left:8px;
	}

.myConMainFilterInnerCheckBox:last-child{
	margin-bottom:0px;
	}


.myConMainFilterStatusBall{
	height:12px;
	width:12px;
	background-color:#888888;
	border-radius: 15px;
	position: absolute;
    margin-left: 22px;
    margin-top:1.25px;
	}


#myConMainFilterStatusBallStagged{
	background-color:#FBB040;
	}


#myConMainFilterStatusBallActive{
	background-color:#39B54A;
	}


#myConMainFilterStatusBallInactive{
	background-color:#ED1C24;
	}


#myConMainFilterStatusBox label{
	margin-left:24px;
	}















#myConMainContain .textHighlight{
	background:yellow;
	color:#000 !important;
	}





.myConBoxContain{
	width:calc(25% - 10px);
	margin:5px;
	float:left;
	}


.myConBox{
	background-color:#E6E7E8;
    position: relative;
    width: 100%;
    border-radius:2px;
    padding-top: 56.25%; /* 16:9 Aspect Ratio */
		background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    cursor:pointer;
    -webkit-transition: transform .15s ease-out;
  	-moz-transition: transform .15s ease-out;
  	-o-transition: transform .15s ease-out;
  	transition: transform .15s ease-out;
	}


.myConBox:hover{
	-webkit-transform: scale(1.05);
	-moz-transform: scale(1.05);
  -ms-transform: scale(1.05);
  -o-transform: scale(1.05);
  transform: scale(1.05);
	}

.myConBox:active{
	-webkit-transform: scale(1.00);
	-moz-transform: scale(1.00);
  	-ms-transform: scale(1.00);
  	-o-transform: scale(1.00);
  	transform: scale(1.00);
	}


.myConMainPlayButton{
	 height:49px;
	 width:50px;
	 margin: auto;
     position: absolute;
     top: 0; left: 0; bottom: 0; right: 0;
	}


.myConMainPlayButtonCircle{
	fill:#005BA6;
	}


.myConMainPlayButtonTriangle{
	fill:#FFFFFF;
	}


.myConMainVideoLength{
	font-size:12px;
	padding:3px 6px;
	border-radius:3px;
	position:absolute;
	bottom:12px;
	right:12px;
	color:#fff;
	background-color:rgba(0,0,0,.65);
	}


.myConMainTitle{
	width:100%;
	height:40px;
	line-height:40px;
	font-size:18px;
	text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    font-weight:600;
	}


.myConMainStatusBox{
	width:100%;
	height:13px;
	text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
	}


.myConMainStatusIndicator{
	width:12px;
	height:12px;
	border-radius:12px;
	background-color:#eee;
	float:left;
	}


.statusStagged .myConMainStatusIndicator{
	background-color:#FBB040;
	}

.statusStagged .myConStatusText{
	color:#FBB040;
	font-weight:700;
	}


.statusActive .myConMainStatusIndicator{
	background-color:#39B54A;
	}

.statusActive .myConStatusText{
	color:#39B54A;
	font-weight:700;
	}


.statusInactive .myConMainStatusIndicator{
	background-color:#ED1C24;
	}

.statusInactive .myConStatusText{
	color:#ED1C24;
	font-weight:700;
	}


.statusDisabled .myConMainStatusIndicator{
	background-color:#888888;
	}

.statusDisabled .myConStatusText{
	color:#888888;
	font-weight:700;
	}


.myConMainStatusDateRange{
	margin-left:18px;
	font-size:12px;
	height:12px;
	line-height:12px;
	color:#808285;
	}


.myConMainTagBox{
	position:relative;
	margin-top:5px;
	margin-bottom:15px;
	width:100%;
	height:37px;
	}


.myConMainTagBoxWrapper{
	overflow:hidden;
	position:absolute;
    width: 100%;
    height:22px;
    z-index: 20;
    padding: 10px;
    padding-right:0px;
    margin-top: -5px;
    margin-left: -5px;
    border-radius: 3px;
    background-color:rgba(255,255,255,.5);
    -webkit-transition: all .5s ease-out;
  	-moz-transition: all .5s ease-out;
  	-o-transition: all .5s ease-out;
  	transition: all .5s ease-out;
	}

.myConMainTagBoxWrapperClick{
	max-height:500px;
	}



.myConMainTag{
	font-size:12px;
	width:fit-content;
	background:#005BA6;
	color:#fff;
	padding:3px 10px;
	border-radius:30px;
	text-align:center;
	float:left;
	margin-right:3px;
	margin-bottom:2px;
	cursor:default;
	-webkit-transition: all .15s ease-out;
  	-moz-transition: all .15s ease-out;
  	-o-transition: all .15s ease-out;
  	transition: all .15s ease-out;
	}



.myConMainTagFade{
	width: 100%;
	margin-left:-10px;
    height: 15px;
    position: absolute;
    bottom: 0;
    background-image: linear-gradient(rgba(255,255,255,0), rgba(255,255,255,1));
	}




.myConMainTypeIconBox{
	width:25px;
	height:25px;
    border-radius: 3px;
    position: absolute;
    top: 12px;
    left: 12px;
    color: #fff;
    background-color: rgba(0,0,0,.65);
	}

.myConMainTypeIconBox svg{
	fill:#fff;
	padding:2px;
	width:21px;
	height:21px;
	-webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
	}

.typeImage .myConVideoIcon{
	display:none;
	}

.typeImage .myConMainPlayButton{
	display:none;
	}

.typeVideo .myConImgIcon{
	display:none;
	}

.typeVideo .myConHTMLIcon{
	display:none;
	}




.typeVideo .myConVideoIcon{
	display:block;
	}

.typeImage .myConImgIcon{
	display:block;
	}

.typeHTML .myConHTMLIcon{
	display:block;
	}







.loaderPercentText{
	font-size:12px;
	font-weight:600;
	text-align:center;
	line-height:80px;
	height: 80px;
    width: 80px;
    margin: auto;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
	}


.myConMainLoaderBox{
	display:none;
	height: 80px;
    width: 80px;
    margin: auto;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
	}


.loaderRing{
	display: inline-block;
  	position: relative;
  	width: 80px;
  	height: 80px;
	}


.loaderRing div{
  	box-sizing: border-box;
  	display: block;
  	position: absolute;
  	width: 64px;
  	height: 64px;
  	margin: 8px;
  	border: 3px solid #005BA6;
  	border-radius: 50%;
  	animation: loaderRing .9s cubic-bezier(0.5, 0, 0.5, 1) infinite;
  	border-color: #005BA6 transparent transparent transparent;
	}


.loaderRing div:nth-child(1){
  	animation-delay: -0.3s;
	}


.loaderRing div:nth-child(2){
  	animation-delay: -0.2s;
	}


.loaderRing div:nth-child(3){
  	animation-delay: -0.1s;
	}


@keyframes loaderRing{
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}


.loaderBarBox{
	position: absolute;
    bottom: 20px;
    right: 0;
    left: 0;
    display: block;
    background-color:#D1D3D4;
    width: calc(100% - 40px);
    width: 130px;
    height: 3px;
    border-radius: 10px;
    margin-left: auto;
    margin-right: auto;
	}


.loaderBarFill{
	background-color:#005BA6;
	width:0%;
	height:3px;
	border-radius:10px;
	}


.myConErrorMessageBox{
	position: absolute;
    top: 0;
    width: calc(100% - 30px);
    padding: 15px;
    text-align: center;
    color: red;
    max-height: 90px;
    overflow: auto;
    font-size:12px;
	}


.myConErrorMessageBoxButtton{
	position: absolute;
    bottom: 12px;
    margin-left: auto;
    margin-right: auto;
    cursor: pointer;
    font-size: 12px;
    font-weight: 500;
    height: 30px;
    line-height: 30px;
    background-color: red;
    color: #fff;
    border-radius: 3px;
    display: block;
    right: 0;
    left: 0;
    width: 100px;
    text-align: center;
    -webkit-transition: transform .15s ease-out;
    -moz-transition: transform .15s ease-out;
    -o-transition: transform .15s ease-out;
    transition: transform .15s ease-out;
	}


.myConErrorMessageBoxButtton:hover{
	-webkit-transform: scale(1.05);
    -moz-transform: scale(1.05);
    -ms-transform: scale(1.05);
    -o-transform: scale(1.05);
    transform: scale(1.05);
	}

.myConErrorMessageBoxButtton:active{
	-webkit-transform: scale(1.00);
    -moz-transform: scale(1.00);
    -ms-transform: scale(1.00);
    -o-transform: scale(1.00);
    transform: scale(1.00);
	}



.uploadingFillerBox .myConBox:hover{
	-webkit-transform: scale(1.00) !important;
   -moz-transform: scale(1.00) !important;
   -ms-transform: scale(1.00) !important;
   -o-transform: scale(1.00) !important;
   transform: scale(1.00) !important;
	}





















/*------My Content Single View------*/


#myContentSVBox{
	position:fixed;
	top:0;
	bottom:0;
	right:0;
	left:0;
	background:#fff;
	z-index:2000;
	overflow-y: scroll;
	}


#myContentSingleView{
	display:block;
	margin-left:auto;
	margin-right:auto;
	width:calc(100% - 10px);
	padding:5px;
	max-width:1213px;
	height: -webkit-fill-available;
	margin-top:4%;
	}


#myCSVBackButtonBox{
	cursor:pointer;
	width:100px;
	height:40px;
	margin-bottom:10px;
	margin-top:10px;
	-webkit-transition: transform .15s ease-out;
  	-moz-transition: transform .15s ease-out;
  	-o-transition: transform .15s ease-out;
  	transition: transform .15s ease-out;
	}

#myCSVBackButtonIcon{
	float:left;
	margin-left:-4px;
	}


#myCSVBackButtonIcon svg{
	fill:rgba(0,0,0,.7);
	padding-top: 8px;
	-webkit-transition: fill .15s ease-out;
  -moz-transition: fill .15s ease-out;
  -o-transition: fill .15s ease-out;
  transition: fill .15s ease-out;
  -webkit-box-sizing: unset;
  	-moz-box-sizing: unset;
  	-ms-box-sizing: unset;
  	box-sizing: unset;
	}


#myCSVBackButton{
	line-height:40px;
	font-size:14px;
	font-weight:500;
	color:rgba(0,0,0,.7);
	margin-left:4px;
	float:left;
	-webkit-transition: color .15s ease-out;
  	-moz-transition: color .15s ease-out;
  	-o-transition: color .15s ease-out;
  	transition: color .15s ease-out;
	}



#myCSVBackButtonBox:hover #myCSVBackButtonIcon svg{
	fill:rgba(0,0,0,1);
	}

#myCSVBackButtonBox:hover #myCSVBackButton{
	color:rgba(0,0,0,1);
	}



#myCSVBackButtonBox:hover{
	-webkit-transform: scale(1.05);
	-moz-transform: scale(1.05);
  	-ms-transform: scale(1.05);
  	-o-transform: scale(1.05);
  	transform: scale(1.05);
	}

#myCSVBackButtonBox:active{
	-webkit-transform: scale(1.00);
	-moz-transform: scale(1.00);
  	-ms-transform: scale(1.00);
  	-o-transform: scale(1.00);
  	transform: scale(1.00);
	}













#myCSVBox{
	width:100%;
	height:auto;
	border-radius:3px;
	opacity:100%;

	box-sizing: unset;


	-webkit-transition: opacity .25s ease-out;
  	-moz-transition: opacity .25s ease-out;
  	-o-transition: opacity .25s ease-out;
  	transition: opacity .25s ease-out;
	}

#myCSVBoxVideo{
	position:relative;
	width:calc(70% - 1px);
	height:472px;
	background-color:#E6E7E8;
	border-radius: 3px 0px 0px 3px;
	float:left;
	border:solid 1px #000;
	border-right:solid 0px #000;
	z-index:10;
	-webkit-box-sizing: unset;
  	-moz-box-sizing: unset;
  	-ms-box-sizing: unset;
  	box-sizing: unset;
	}


#myCSVBoxVideo .vjs-big-play-button{
	top: 50%;
	transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	left:0;
	right:0;
	margin-left:auto;
    margin-right:auto;
	}

#myCSVBoxVideo .vjs-loading-spinner{
	top: 50%;
	transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	left:0;
	right:0;
	margin-left:auto;
    margin-right:auto;
	}

#myCSVBoxVideo #play_video{
	text-align:center;
	-webkit-box-sizing: unset;
  	-moz-box-sizing: unset;
  	-ms-box-sizing: unset;
  	box-sizing: unset;
	}


#myCSVBoxInfo{
		box-sizing:unset;
		width: calc(30% - 61px);
    float: left;
    padding: 30px;
    border: solid 1px #000;
    border-radius:0px 3px 3px 2px;
    min-height:413px;
    margin-left:-1px;
	}

.myCSVInfoBox{
	margin-bottom:30px;
	}


.myCSVInfoBoxTitle{
    color: #888888;
    font-size: 12px;
    text-transform: uppercase;
    margin-bottom: 5px;
    font-weight: 600;
	}


.myCSVInfoDisplayData{
	font-size:14px;
	margin-top:-5px;
	}

.myContentSingleViewEditMode .myCSVInfoDisplayData{
	display:none;
	}

.myCSVInfoEditData{
	display:none;
	}

.myContentSingleViewEditMode .myCSVInfoEditData{
	display:block;
	}


.myCSVInfoInputData{
    position: relative;
    width: calc(100% - 2px);
    height: 30px;
    border: 1px solid #CCCCCB;
    border-radius: 3px;
    font-size:14px;
    padding-left: 8px;
	}

.sequenceRadioBox{
	position:relative;
	cursor:pointer;
	}

.sequenceRadioBox input{
	cursor:pointer;
	width:13px;
	height:13px;
	margin:3px;
	}

.sequenceRadioBox label{
	cursor:pointer;
	position:absolute;
	top:1px;
	margin-left:3px;
	color:rgba(0,0,0,.6);
	}

.sequenceRadioBox input:checked + label{
	color:rgba(0,0,0,1);
	}



#sequenceStartEndDatesBox{
	margin-top: 5px;
    width: calc(100% - 23px);
    margin-left: 23px;
    display:none;
	}

#sequenceStartEndDatesBox .myCSVInfoBoxTitle{
	font-size:12px;
	display:none;
	}


.sequenceStartEndDatesInputBox{
	position:relative;
	width:calc(50% - 15px);
	float:left;
	}


#sequenceStartEndDatesTo{
	font-size:11px;
	font-weight:500;
	float: left;
    width: 30px;
    height: 28px;
    text-align: center;
    line-height: 28px;
    text-transform: uppercase;
	}



.sequenceStartEndDatesInputBox input{
	height:28px;
	line-height:28px;
	font-size:13px;
	width:calc(100% - 24px);
	padding-left:7px;
	border: 1px solid #CCCCCB;
	border-radius:3px 0px 0px 3px;
	}

.sequenceStartEndDatesImgBox{
	cursor:pointer;
	position:absolute;
	bottom:0;
	right:0;
	width:28px;
	height:28px;
	background-color:#005BA6;
	border-radius:0px 3px 3px 0px;
	}

.sequenceStartEndDatesImgBox svg{
	fill: #FFFFFF;
    width: 18px;
    height: 18px;
    padding: 5px;
	}

#myConFrequencySelectBox, #myConLanguageSelectBox{
	font-size:14px;
	width:auto;
	height:30px;
	cursor:pointer;
	border: 1px solid #CCCCCB;
    border-radius: 3px;
    padding-left:5px;
    padding-right:5px;
	}


.twitter-typeahead{
	width:100%;
	}


#myCSVITagInputBox{
	position:relative;
	}


#myCSVITagInputBox .typeahead{
    width:100%;
    height: 30px;
    border: 1px solid #CCCCCB;
    border-radius: 3px;
    font-size: 14px;
    padding-left: 8px;
	}

.tt-menu{
	margin-top:-3px;
	width:calc(100% - 10px);
	background:#005BA6;
	color:#fff;
	padding:5px 5px;
	border-radius:0px 0px 3px 3px;
	font-size:14px;
	max-height: 218px;
    overflow-x: auto;
	}


.tt-menu::-webkit-scrollbar {
  	width: 7px;
	}

.tt-menu::-webkit-scrollbar-track {
  	background:#005BA6 !important;
	}


.tt-menu::-webkit-scrollbar-thumb {
	border:none;
  	background:rgba(255,255,255,1) !important;
  	border:solid 2px #005BA6;
	}



.tt-suggestion{
	cursor:pointer;
	font-size:14px;
	padding:3px 10px;
	}

.tt-suggestion:hover, .tt-cursor{
	background-color:rgba(255,255,255,.2);
	border-radius:20px;
	}

#myCSVIAddTagButton{
	cursor:pointer;
	padding:0px 12px;
	height:30px;
	line-height:30px;
	background-color:#39B54A;
	border-radius:0px 3px 3px 0px;
	color:#fff;
	position:absolute;
	top:0;
	right:0;
	font-size: 12px;
    font-weight: 500;
   	-webkit-transition: transform .15s ease-out;
  	-moz-transition: transform .15s ease-out;
  	-o-transition: transform .15s ease-out;
  	transition: transform .15s ease-out;
	}


#myCSVIAddTagButton:hover{
	-webkit-transform: scale(1.05);
	-moz-transform: scale(1.05);
  	-ms-transform: scale(1.05);
  	-o-transform: scale(1.05);
  	transform: scale(1.05);
	}


#myCSVIAddTagButton:active{
	-webkit-transform: scale(1.00);
	-moz-transform: scale(1.00);
  	-ms-transform: scale(1.00);
  	-o-transform: scale(1.00);
  	transform: scale(1.00);
	}



#myCSVITagBox{
	margin-top:10px;
	}

.myConEditTag{
	font-size:13px;
	width:fit-content;
	height: 25px;
    line-height: 25px;
    padding-left:12px;
    padding-right:3px;
	background:#005BA6;
	color:#fff;
	border-radius:30px;
	text-align:center;
	float:left;
	margin-right:5px;
	margin-bottom:5px;
	cursor:default;
	-webkit-transition: all .15s ease-out;
  	-moz-transition: all .15s ease-out;
  	-o-transition: all .15s ease-out;
  	transition: all .15s ease-out;
	}


.myCSVITagBoxDelete{
	cursor:pointer;
	float:right;
	margin-left:9px;
	padding:0px 3px;
	-webkit-transition: transform .05s ease-out;
  	-moz-transition: transform .05s ease-out;
  	-o-transition: transform .05s ease-out;
  	transition: transform .05s ease-out;
	}


.myCSVITagBoxDelete svg{
	width:19px;
	height:19px;
	fill:rgba(255,255,255,.7);
	padding:3px;
	}


.myCSVITagBoxDelete:hover svg{
	fill:rgba(255,255,255,1);
	}


.myCSVITagBoxDelete:active svg{
	fill:rgba(255,255,255,1);
	}


.myCSVITagBoxDelete:hover{
	-webkit-transform: scale(1.15);
	-moz-transform: scale(1.15);
  	-ms-transform: scale(1.15);
  	-o-transform: scale(1.15);
  	transform: scale(1.15);
	}


.myCSVITagBoxDelete:active{
	-webkit-transform: scale(1.00);
	-moz-transform: scale(1.00);
  	-ms-transform: scale(1.00);
  	-o-transform: scale(1.00);
  	transform: scale(1.00);
	}


#myCSVButtonBox{
	float:right;
	margin-top:15px;
	padding-bottom:100px;
	}


#myCSVViewButtons{
	display:block;
	}

.myContentSingleViewEditMode #myCSVViewButtons{
	display:none;
	}


#myCSVEditButtons{
	display:none;
	}

.myContentSingleViewEditMode #myCSVEditButtons{
	display:block;
	}


.myCSVButton{
	cursor:pointer;
	width:115px;
	height:35px;
	line-height:35px;
	border-radius:3px;
	background:red;
	color:#fff;
	float:left;
	margin-left:5px;
	-webkit-transition: transform .1s ease-out;
  	-moz-transition: transform .1s ease-out;
  	-o-transition: transform .1s ease-out;
  	transition: transform .1s ease-out;
	}


.myCSVButton:hover{
	-webkit-transform: scale(1.05);
	-moz-transform: scale(1.05);
  	-ms-transform: scale(1.05);
  	-o-transform: scale(1.05);
  	transform: scale(1.05);
	}


.myCSVButton:active{
	-webkit-transform: scale(1.00);
	-moz-transform: scale(1.00);
  	-ms-transform: scale(1.00);
  	-o-transform: scale(1.00);
  	transform: scale(1.00);
	}




#myCSVButton-Edit{
	background-color:#FBB040;
	}

#myCSVButton-Delete{
	background-color:#ED1C24;
	}

#myCSVButton-Save{
	background-color:#39B54A;
	}

#myCSVButton-Cancel{
	background-color:#808285;
	}




.myCSVButtonIcon{
	float:left;
	}

.myCSVButtonIcon svg{
	fill:#fff;
	width:21px;
	height:21px;
	padding:7px;
	-webkit-box-sizing: unset;
  	-moz-box-sizing: unset;
  	-ms-box-sizing: unset;
  	box-sizing: unset;
	}

.myCSVButtonText{
	background-color: rgba(255,255,255,.1);
	width:calc(100% - 35px);
	text-align:center;
	float:left;
	font-weight:500;
	}







/*  The switch - the box around the slider   */
.switch {
  	position: relative;
  	display: inline-block;
  	width: 39px;
  	height: 19px;
	}



/* 	Hide default HTML checkbox 	*/
.switch input {
  	opacity: 0;
  	width: 0;
  	height: 0;
	}


/* 	The slider 	*/
.slider {
  	position: absolute;
  	cursor: pointer;
  	top: 0;
  	left: 0;
  	right: 0;
  	bottom: 0;
  	background-color: #ccc;
  	-webkit-transition: .4s;
  	transition: .4s;
	}


.slider:before {
  	position: absolute;
  	content: "";
  	height: 15px;
  	width: 15px;
  	left: 2px;
  	bottom: 2px;
  	background-color: white;
  	-webkit-transition: .4s;
  	transition: .4s;
	}


input:checked + .slider {
  	background-color: #39B54A;
	}


input:focus + .slider {
  	box-shadow: 0 0 1px #2196F3;
	}


input:checked + .slider:before {
  	-webkit-transform: translateX(20px);
  	-ms-transform: translateX(20px);
  	transform: translateX(20px);
	}


/* 	Rounded sliders */
.slider.round {
  	border-radius: 34px;
	}


.slider.round:before {
  	border-radius: 50%;
	}


.switchLabel{
    margin-left:45px;
    height: 19px;
    line-height: 19px;
    font-size: 13px;
    font-weight: 500;
    color:#888888;
    cursor:pointer;
    margin-top: -21px;
	}

.switchLabelOn{
	display:none;
	font-weight: 600;
	}

.switchLabelOff{
	display:block;
	}


input:checked + .slider + .switchLabel {
	color: #39B54A;
	}

input:checked + .slider + .switchLabelOn {
	display:block;
	}

input:checked + .slider + .switchLabelOn + .switchLabelOff{
	display:none;
	}

.myConDisabled{
	opacity:80% !important;
	}















































/*------Date Picker Style------*/






.ui-datepicker {  
    width: 226px;  
    height: auto;   
    font: 9pt Arial, sans-serif;
    z-index:1001 !important;
    margin-top:5px;
	} 

.ui-datepicker a {  
    text-decoration: none;  
	} 

.ui-datepicker table {  
    width: 100%;
    background:#E6E7E8; 
	}  

.ui-datepicker-header {  
    background: #005BA6; 
    color: #fff;  
    font-weight: bold;
    line-height: 30px;  
    width: 226px;
    border-radius:3px 3px 0px 0px;

	}	 

.ui-datepicker-title {  
    text-align: center;
    height:30px;  
	}

.ui-datepicker-title select{
	background-color: rgba(255,255,255,0);
    height: 30px;
    outline: none;
    border: none;
    color: #fff;
    font-weight: 600;
    font-size: 12px;
    -webkit-appearance: none;
    padding-left:2px;
    padding-right:2px;
    cursor:pointer;
	} 


.ui-datepicker-title select::-ms-expand {
    display: none;
	}

.ui-datepicker-prev, .ui-datepicker-next {  
    display: inline-block;  
    width: 30px;  
    height: 30px;  
    text-align: center;  
    cursor: pointer;  
    background-image: url('img/datepicarrow.svg');  
    background-repeat: no-repeat;  
    line-height: 600%;  
    overflow: hidden;
    background-size: 30px 30px;
    background-position: center center;
    opacity:.6;
    -webkit-transition: all .05s ease-out;
  	-moz-transition: all .05s ease-out;
  	-o-transition: all .05s ease-out;
  	transition: all .05s ease-out;
	} 

.ui-datepicker-prev:hover, .ui-datepicker-next:hover{  
    background-size: 35px 35px;
    background-position: center center;
    opacity:1;  
	}

.ui-datepicker-prev:active, .ui-datepicker-next:active{  
    background-size: 30px 30px;
    background-position: center center;
    opacity:1;  
	}


.ui-datepicker-prev {  
    float: left;
    -webkit-transform: rotate(180deg);
	-moz-transform: rotate(180deg);
	-ms-transform: rotate(180deg);
	-o-transform: rotate(180deg);
	transform: rotate(180deg);
	}  

.ui-datepicker-next {  
    float: right;  
    background-position: center center;  
	}  

.ui-datepicker thead {  
    background-color: #f7f7f7;  
    background-image: -moz-linear-gradient(top,  #f7f7f7 0%, #f1f1f1 100%);  
    background-image: -webkit-gradient(linear, left top, left bottombottom, color-stop(0%,#f7f7f7), color-stop(100%,#f1f1f1));  
    background-image: -webkit-linear-gradient(top,  #f7f7f7 0%,#f1f1f1 100%);  
    background-image: -o-linear-gradient(top,  #f7f7f7 0%,#f1f1f1 100%);  
    background-image: -ms-linear-gradient(top,  #f7f7f7 0%,#f1f1f1 100%);  
    background-image: linear-gradient(top,  #f7f7f7 0%,#f1f1f1 100%);  
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7f7f7', endColorstr='#f1f1f1',GradientType=0 );  
    border-bottom: 1px solid #bbb;  
	} 

.ui-datepicker th {  
    text-transform: uppercase;  
    font-size: 6pt;  
    padding: 5px 0;  
    color: #666666;  
    text-shadow: 1px 0px 0px #fff;
    background:#E6E7E8;
    text-align:center;
    filter: dropshadow(color=#fff, offx=1, offy=0);  
	}  

.ui-datepicker tbody td {  
    padding: 0;  
	} 

.ui-datepicker tbody td:last-child {  
    border-right: 0px;  
	}

.ui-datepicker tbody tr {  
    border-bottom: 1px solid #bbb;  
	}  

.ui-datepicker tbody tr:last-child {  
    border-bottom: 0px;  
	}  	 

.ui-datepicker td span, .ui-datepicker td a {  
    display: inline-block;    
    text-align: center;  
    width: 30px;  
    height: 30px;  
    line-height:30px;  
    color: #666666;
    font-size:12px;
	}



.ui-datepicker-calendar .ui-state-default {  
    background: #fff;
    -webkit-transition: all 0s ease-out;
  	-moz-transition: all 0s ease-out;
  	-o-transition: all 0s ease-out;
  	transition: all 0s ease-out;
	} 


.ui-datepicker-unselectable .ui-state-default {  
    background: #f4f4f4;  
    color: #b4b3b3;
    -webkit-transition: all 0s ease-out;
  	-moz-transition: all 0s ease-out;
  	-o-transition: all 0s ease-out;
  	transition: all 0s ease-out; 
	}  

.ui-datepicker-calendar .ui-state-hover{ 
    background-color:#005BA6;
    color:rgba(255,255,255,1);
    -webkit-transition: all 0s ease-out;
  	-moz-transition: all 0s ease-out;
  	-o-transition: all 0s ease-out;
  	transition: all 0s ease-out;
	}  


.ui-datepicker-calendar .ui-state-active {  
    background: #005BA6;   
    color: #fff;    
    position: relative;   
	} 


.ui-datepicker-calendar td:first-child .ui-state-active {  
    width: 30px;  
    margin-left: 0;  
	} 


.ui-datepicker-calendar td:last-child .ui-state-active {  
    width: 30px;  
    margin-right: 0;  
	} 


.ui-datepicker-calendar tr:last-child .ui-state-active {  
    height: 30px;  
    margin-bottom: 0;  
	} 


.ui-datepicker-buttonpane{
	background-color:#E6E7E8;
	padding:5px;
	height:25px;
	}


.ui-datepicker-buttonpane button{
	cursor: pointer;
    border: solid 1px #CCCCCB;
    outline: none;
    height: 25px;
    border-radius: 3px;
    font-size: 12px;
    width:60px;
    opacity:.8;
    color:#666666;
    -webkit-transition: all .05s ease-out;
  	-moz-transition: all .05s ease-out;
  	-o-transition: all .05s ease-out;
  	transition: all .05s ease-out;
	}

.ui-datepicker-buttonpane button:hover{
    opacity:1;
    -webkit-transform: scale(1.05);
	-moz-transform: scale(1.05);
  	-ms-transform: scale(1.05);
  	-o-transform: scale(1.05);
  	transform: scale(1.05);

	}

.ui-datepicker-buttonpane .ui-datepicker-close{
	float:right;
	}

.ui-datepicker-other-month{
	opacity:.6;
	}
























































/*------Responsive CSS------*/








@media (max-width:1500px){


	#myContentSingleView{
		width: calc(100% - 60px);
    	padding: 0px 30px;
		}


	#myCSVBoxInfo{
		width:290px;
		}

	#myCSVBoxVideo {
    	width: calc(100% - 352px);
		}

	#myContentContain{
		margin-top:0px;
		}







}






@media (max-width:1480px){

	#myContentContain{
		width: calc(100% - 50px);
		}


}






@media (max-width:1400px){

	.myConBoxContain {
    	width: calc(33.33333333333333% - 10px);
		}

	#myConHeaderSearchBox {
    	width: calc(33.33333333333333% - 7px);
		}

	#myConHeaderFilterSortBox {
    	width: calc(33.33333333333333% - 6px);
		}


}









@media (max-width:1200px){


	#myContentSingleView{
		max-width:500px;
		}


	#myCSVBoxVideo{
		float:none;
		width:calc( 100% - 2px );
		border-radius: 3px 3px 0px 0px;
    	border: solid 1px #000;
    	border-bottom: solid 0px #000;
		}


	#myCSVBoxInfo{
		width:calc(100% - 62px);
		float:right;
		margin-left: 0px;
		border-radius: 0px 0px 3px 3px;
		min-height:0px;
		}


}












@media (max-width:950px){

	.myConBoxContain {
    	width: calc(50% - 10px);
		}


}









@media (max-width:750px){

  

  	#myConHeaderSearchBox {
    	width: calc(100%);
		}

	#myConHeaderFilterSortBox {
    	width: calc(50% - 6px);
    	margin-left: 0px; 
    	margin-top: 10px;
		}

	#myConHeaderUploadButton{
		margin-top:10px;
		}



}












@media (max-width:499px){


	#myContentContain {
    	width: calc(100% - 40px);
    	margin-top:0px;
		}

	#myConHeaderSearchBox{
		float:none;
		}

	#myConHeaderContain {
    	margin-top: 20px;
    	margin-bottom: 20px;	
		}

	#myConHeaderFilterSortBox {
    	width: calc(100% - -4px);
    	float:none;
    	height:42px;
    	margin-top:20px;
		}

	#myConHeaderUploadButton{
		margin-top:20px;
		}


}





@media (max-width:415px){


	.myConBoxContain {
    	width: calc(75% - 10px);
    	margin-left: auto;
    	margin-right: auto;
    	float: none;
		}

	#myConHeaderUploadButton {
    	width: 100%;
		}

	#myConHeaderUploadButtonIcon svg {
    	padding-left: 7px;
		}

	#myConHeaderUploadButtonText {
    	padding: 0 0px;
    	width: 60px;
    	text-align: center;
		}

	#myConHeaderUploadButtonConContain{
		width:100px;
		margin-left:auto;
		margin-right:auto;
		}




}









@media (max-width:376px){


	#myContentContain {
    	width: calc(100% - 20px);
		}

	#myConHeaderContain {
    	margin-top: 10px;
   		margin-bottom: 10px;
		}

	#myConHeaderUploadButton {
    	margin-top: 15px;
		}

	#myConHeaderFilterSortBox {
    	margin-top: 15px;
		}

	.myConBoxContain {
    	width: calc(100% - 10px);
		}


	#myContentSingleView {
    	width:100%;
    	padding: 0px 0px;
		}

	#myCSVBoxVideo {
    	width: calc( 100% - 0px );
    	border-radius:0px;
    	border: none;
		}

	#myCSVBoxInfo {
    	width: calc(100% - 60px);
    	border: none;
    	border-radius: 0px;
		}

	#myCSVBackButtonBox{
		margin-left:15px;
		}


	#myCSVButtonBox {
    	float: none;
    	margin-top: 15px;
    	padding-bottom: 100px;
    	margin-left: 25px;
		}




}











/* ------CSS Animations-----*/



@keyframes statusBulbFlicker {
	0%   { opacity:1; transform: scale(1); }
  	50%  { opacity:.65; transform: scale(.95); }
	100% { opacity:1; transform: scale(1);}
	}

@-o-keyframes statusBulbFlicker{
  	0%   { opacity:1; -o-transform: scale(1);}
  	50%  { opacity:.65; -o-transform: scale(.95);}
  	100% { opacity:1; -o-transform: scale(1);}
	}

@-moz-keyframes statusBulbFlicker{
  	0%   { opacity:1; -moz-transform: scale(1);}
  	50%  { opacity:.65; -moz-transform: scale(.95);}
  	100% { opacity:1; -moz-transform: scale(1);}
	}

@-webkit-keyframes statusBulbFlicker{
  	0%   { opacity:1; -webkit-transform: scale(1);}
  	50%  { opacity:.65; -webkit-transform: scale(.95);}
  	100% { opacity:1; -webkit-transform: scale(1);}
	}

.bulbFlicker {
   -webkit-animation: statusBulbFlicker 2s infinite;
   -moz-animation: statusBulbFlicker 2s infinite;
   -o-animation: statusBulbFlicker 2s infinite;
    animation: statusBulbFlicker 2s infinite;
	}