body {
            background-color:white;
        }
        
        iframe { width:250px; }
        
        #mywin { margin-top:120px; left:0px; }
        
        #opnmsg {
            width:1200px;
        }
        .topurchase {
            font-size:32px;
            margin:auto auto;
        }
        #mobmsg {
            display:none;
        }
        .bb {
            border-bottom:solid 1px #ccc;
        }
        .lgo { display:none;}
        
        
        .col-sm-12 { width:98vw;}
        .col-xs-12 { width:98vw;}
        .nodt { display:none; }
         @media screen and (max-width: 900px) {
             .nodt { display:inline; }
         }
            @media screen and (max-width: 900px) {
        .nomob { display:none; }
                #opnmsg {
                    width:100vw;
                }
                #mobmsg {
                    display:inline;
                    font-size:16px;
                    margin:auto auto;
                    margin-top:30px;
                    width:300px;
                    position:relative;
                }
                .topurchase {
                    display:none;
                    /*font-size:17px;*/
                    /*width:95vw;*/
                    /*margin:auto auto;*/
                }
                #phonetop {
                    display:none;
                }
                #nomob {
                    display:none;
                }
            }     
    /*modal-backdrop fade in*/
    
.light {background-color:white;color:#000;}    
.dark {background-color:#333;color:#fff;}   
.light a, a.visited {color:#00f;}    
.dark a, a.visited {color:orange;}    
.light blockquote  {color:#000;}    
.dark blockquote  {color:#ccc;}    
.light span, div {color:#000;}
.dark span, div {color:#fff;}      
.light button {color:#000;background-color:#fff;border:solid 1px #000;}
.dark button {color:#fff;background-color:#333;border:solid 1px #fff;} 
.light h2, h4 {color: black;}
.dark h2, h4 {color: white;}   
.light i {color: black;}
.dark i {color: white;}
.dark i, a {color: black;}
.light .fa-moon {color: black;}
.dark .fa-moon {color: white;}
.light .fa-sun {color: black;}
.dark .fa-sun {color: white;}
.light .fa-floppy-disk {color: black;}
.dark .fa-floppy-disk {color: white;}
.light .fa-pen-to-square {color: #555;}
.dark .fa-pen-to-square {color: #999;}
.light .modal-content { background-color:white!important;color:black!important;}
.dark .modal-content { background-color:#444!important;color:#ddd!important;}
.light .modal-header { background-color:white;color:black;}
.dark .modal-header { background-color:#444;color:#ddd!important;}
.light .btn1 { color:black!important;border:solid 1px #000;}
.dark .btn1 { color:#ddd!important;border:solid 1px #ccc;}
.light input { background-color:white!important;color:black!important;border:solid 1px #000;}
.dark input { background-color:#444!important;color:#ddd!important;border:solid 1px #ccc;}
.light textarea { background-color:white!important;color:black!important;border:solid 1px #000;}
.dark textarea { background-color:#444!important;color:#ddd!important;border:solid 1px #ccc;}
/*#homewalldemo, .light  {background-image:url(https://watch.touchpoint.video/wall/images/home-wall-light.webp);background-repeat: no-repeat;background-size: contain;}*/
/*#homewalldemo, .dark {background-image:url(https://watch.touchpoint.video/wall/images/home-wall-dark.webp);background-repeat: no-repeat;background-size: contain;}*/


#savewallbtn, .light { color:#333;}
#savewallbtn, .dark { color:#333;}

#usersubmitbtn, .light { color:#333;}
#usersubmitbtn, .dark { color:#333;}

#benefits div {
    margin:5px;
    padding:15px;
    border:solid 1px #555;
    display:inline-block;
    width:99vw;
    border-radius:15px;
}
#benefits .noborder {
    margin:5px;
    padding:15px;
    border:solid 0px #555;
    display:inline-block;
    width:99vw;
}
#benefits .holder { border:0px;}

.makeeditable { display:inline;}


/*#platformlinks, a, a:visited { color:#00f;}*/

.light input::placeholder {
  color: red;
  opacity: 1; /* Firefox */
}

.light input::-ms-input-placeholder { /* Edge 12 -18 */
  color: red;
}

.dark input::placeholder {
  color: orange;
  opacity: 1; /* Firefox */
}

.dark input::-ms-input-placeholder { /* Edge 12 -18 */
  color: orange;
}

.cur { cursor:pointer; z-index:200; }
.bigicon {
    font-size:34px; margin-left:50px;    position:absolute;  color:#aaa; cursor:pointer;    display:none;
}

.blk { color:black; }

#ctrls {top:20px;display:inline-block;}
#wallttl {display:inline-block; overflow:hidden; white-space: nowrap; text-overflow: ellipsis;font-size:24px; }
#manage { display:inline;}
#pastevidbtn {color:black; }
#fetchvidbtn {color:black; }




@media only screen and (min-width: 320px){     #ctrls {display:inline-block;position:absolute;top:30px;} #wallttl {display:none;} #showposter {width:220px;}}
@media only screen and (min-width: 480px){     #ctrls {display:inline-block;position:absolute;top:30px;} #wallttl {display:none;} #showposter {width:220px;}}
@media only screen and (max-width: 1000px){     #ctrls {display:inline-block;position:absolute;top:30px;} #wallttl {display:none;} #showposter {width:220px;}}

@media only screen and (min-width: 1280px){     #ctrls {display:inline-block;} #wallttl {display:none;font-size:3vw; }}
    
.logotext {
    display:inline;
    color:black!important;
}
.logotext1 {
    display:inline-block;
}
@media only screen and (max-width: 1550px){
  .logotext {
    display:none;
    color:black;
    }  
    #wallttl {
        font-size:24px;
        display:none;
    }
}

.thumb { min-width:350px;width:40vw;margin:20px;margin-left:100px;cursor:pointer;transition: all .2s ease-in-out; }
.thumb:hover {transform: scale(1.1); }
.thumbs { min-width:350px;width:30vw;margin:20px;cursor:pointer;transition: all .2s ease-in-out; } 
.thumbs:hover {transform: scale(1.1); }
.thumbsb { min-width:350px;width:20vw;margin:20px;cursor:pointer;transition: all .2s ease-in-out; }
.thumbsb:hover {transform: scale(1.1); }


ul {
  display: flex;
  position: relative;
  top: -75px;
  left: 30px;
  transform: translate(-35%, -35%);
}

ul li {
  list-style: none;
}

ul li a {
  width: 35px;
  height: 35px;
  background-color: #fff;
  text-align: center;
  line-height: 35px;
  font-size: 25px;
  margin: 0 -10px;
  display: block;
  border-radius: 50%;
  position: relative;
  overflow: hidden;
  border: 3px solid #fff;
  z-index: 1;
}

ul li a .icon {
  position: relative;
  color: #262626;
  transition: .5s;
  z-index: 3;
}

ul li a:hover .icon {
  color: #fff;
  transform: rotateY(360deg);
}

ul li a:before {
  content: "";
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  height: 100%;
  background: #f00;
  transition: .5s;
  z-index: 2;
}

ul li a:hover:before {
  top: 0;
}

ul li:nth-child(1) a:before{
  background: #3b5999;
}

ul li:nth-child(2) a:before{
  background: #FF0032;
}

ul li:nth-child(3) a:before {
  background: #0077b5;
}






/* Copyright Touchpoint Video. All Rights Reserved */