.o-feature-main {
  width: 100%;
  font-family: "Open Sans", Calibri, Tahoma, sans-serif;
  padding-right: 15px;
  margin-right: auto;
  margin-left: auto;

  &:before, &:after {
    display: table;
    content: " ";
  }

  .o-feature-row {
    width: 100%;
    margin-top: 0px;
    padding: 20px 0;

    &:after {
      clear: both;
    }
    &:before, &:after {
      display: table;
      content: " ";
    }
    &.o-feature-published {
      .o-feature-cell {
        width: 100%;
		padding: 40px 0;
		margin: 0;
		border-bottom: 1px solid #ddd;
		&:last-child {
		  border-bottom: none;
	      padding-bottom: 20px;
		}
      }
    }

    @media (max-width: 700px) {
      &.o-feature-published {
        .o-feature-cell {
          padding: 35px 10px;
        }
      }
    }

    @media (max-width: 360px) {
      &.o-feature-published {
        .o-feature-cell {
          padding: 18px 0;
          &:nth-child(even) {
            background: #FFFFFF;
          }
        }
      }
    }

    .o-feature-row.o-feature-row-edit {
      &:nth-child(even) {
        background: #FFF !important;
      }
    }

    .o-feature-cell {
      position: relative;
      min-height: 1px;
      float: left;
      width: 100%;
      padding-top: 15px;
      padding-bottom: 15px;
      padding-left: 15px;
      padding-right: 15px;

      &:nth-child(even) {
        /*Mobile*/
        .o-feature-mobile-left {
          float: right !important;
        }
        .o-feature-mobile-right {
          float: left !important;
          text-align: left;
        }
        //.o-feature-button {
        //  float: right;
        //}
        /*Mobile End*/
      }

	  &:nth-child(odd) {
			.o-feature-left {
			   float:right !important;
			   text-align: right;
			}
			.o-feature-right {
			   float:left !important;
			}
			.o-feature-button {
			   float:right;
			}

			@media (max-width: 570px) {
			  .o-feature-right {
			   float:left !important;
			   text-align: left;
			   }
			 }
            .o-feature-action-button,
            .o-feature-action-url-colon,
            .o-feature-action-url{
               float: right;
            }

            .o-feature-action-url {
              text-align: right;
            }

		  }


      &.o-feature-cell-edit:nth-child(odd) {
        .o-feature-button {
          float:none;
        }
        .o-feature-action-button-divwrap {
          float: right;
          width: 100%;
        }
      }


      .o-feature-cell-container {
        padding: 15px;
        &.video-wrapper {
          background: #f6f6f6 none repeat scroll 0 0;
        }
      }

      .o-feature-overlay {
        display: none;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        cursor: pointer;
        background: rgba(35, 35, 35, 0.05);

        text-align: right;
        vertical-align: middle;
        line-height: 0px;
        border: 2px solid #008a00;

        svg {
          width: 50px;
          fill: #FFF;
          margin: 10px 10px 0 0;
          padding: 10px;
          border-radius: 6px;
          background: #008a00;
        }
      }
      .o-feature-overlay.o-feature-add {
        display: block !important;
        border-radius: 4px;
      }

      &:hover {
        //zoom: 90%;
        // -ms-transform: scale(2,3); /* IE 9 */
        // -webkit-transform: scale(2,3); /* Safari */
        // transform: scale(0.98,0.98);
        .o-feature-overlay {
          // transition: transform 0.3s linear;
          border-radius: 10px;
        }

        transition: transform 0.3s linear;

        .o-feature-overlay {
          display: block;
        }
      }

      .o-feature-action-button {
        background: #107aca none repeat scroll 0 0;
		border: 1px solid #0a4d80;
		border-radius: 3px;
		color: #ffffff;
        font-weight: bold;
        font-size: 13px;
        padding: 11px 23px;
        float: left;
        min-width:80px;
        text-decoration: none;
		text-transform: uppercase;
        &:hover{
          background-color: #179599;
        }
      }

      .o-feature-action-url {
        display: block !important;
        float: left;
        display: none;
        top: 0;
        position: relative;
        left: 0;
        padding: 10px 0;
        width: 100%;
        text-align: left;
      }
      .o-feature-editable-content .o-feature-action-url {
        border: 1px solid rgba(128, 128, 128, 0.36);
      }
      .o-feature-action-url-colon {
        float: left;
        padding: 10px 2px;
      }

      @media (min-width: 992px) {
        float: left;
        width: 50%;
        padding-top: 0;
        padding-bottom: 0;
        padding-left: 0;
        padding-right: 0;
        &:nth-child(even) {
          background: none;
        }
      }
      @media (min-width: 1200px) {
        float: left;
        margin-top: 15px;
        width: 50%;
        padding-top: 0;
        padding-bottom: 0;
        padding-left: 0;
        padding-right: 0;
        &:nth-child(even) {
          background: none;
        }
      }

      &:nth-child(even) {
        .o-feature-button {
          button {
            //float: right;
            //position: relative;
            //margin-right: 15%;
          }
        }
  
      }

      .o-feature-brand {
        font-weight: 700;
        margin-bottom: 6px;
        font-size: 1.4285714286rem;
        line-height: 1.8571428571rem;
        color: #252525;
		
      }

      @media (max-width: 570px) {
        .o-feature-brand {
          padding: 0;
        }
      }

      .o-feature-content {
        width: 100%;
        max-height: 200px;

        .o-feature-left {
          float: left;
          width: 60%;
          padding-right: 0px;

          &:before, &:after {
            display: table;
            content: " ";
          }

          .o-feature-title {
            font-size: 1.7142857143rem;
            line-height: 2rem;
            font-weight: 400;
            color: #252525;
            margin-top: 20px;
            margin-bottom: 6px;
          }

          @media (max-width: 570px) {
            .o-feature-title {
              padding: 0;
            }
          }
          @media (max-width: 480px) {
            .o-feature-title {
              font-size: 24px;
              line-height: 28px;
            }
          }
          .o-feature-description-inst p, .o-feature-description-stud p {
            width: 100%;
            font-size: 15px;
            font-weight: normal;
            word-wrap: break-word;
            color: #525252;
            padding: 5px 5px 5px 0;
            margin-top: 5px;
          }

          @media (max-width: 480px) {
            .o-feature-description-inst p, .o-feature-description-stud p {
              line-height: 22px;
            }
          }

        }

        @media (max-width: 570px) {
          .o-feature-left {
            width:100%;
          }
		  .o-feature-right {
           float: left;
           margin-top: 10px;
		  }
        }

        .o-feature-right {
          &:before, &:after {
            display: table;
            content: " ";
          }
		  img {
		    background-clip: text;
			float: right;
			height: 100%;
			margin-top: 0;
			max-height: 170px;
			max-width: 170px;
			width: 100%;
            &.o-feature-img-app{
            height: 100%;
            max-height: 240px;
            max-width: 240px;
            width: 100%;
          }
		   }

          .o-feature-img-border {
            margin-left: 3px;
            textarea {
              display: none;
              border: 10px solid #F1F1F1;
              resize: none;
              height: 150px;
            }
            a {
              color: #1C961C;
              text-align: center;
              text-decoration: underline;
              font-size: 15px;
              cursor: pointer;
              margin-bottom: 10px;
            }
          }
          .o-feature-img-border-edit {
            img {
              display: none;
            }
            textarea {
              display: block !important;
            }
          }
          .o-feature-change-link {
            display: none;
          }
        }
      }
      .o-feature-remove {
        display: none;
      }
      .o-feature-button {
        .o-feature-action-button {
          background: #19A6A4;
          border: none;
          border-radius: 2px;
          color: #fff;
          font-weight: 700;
          font-size: 13px;
          padding: 11px 23px;
          text-transform: uppercase;
          float: left;
          &:hover{
            background-color: #179599;
          }
          div {
            padding: 0;
            margin: 0;
          }
        }


        .o-feature-action-url-colon {
          display: none;
        }
        .o-feature-action-url {
          display: none;
          float: left;
          top: 9px;
          position: relative;
          left: 5px;
          padding: 5px;
        }
        .o-feature-button-group {
          display: none;
          float: right;
          width: 75%;
          text-align: right;

          button {
            font-size: 16px;
            padding: 10px 45px 10px 45px;
            border: none;
            color: #ffffff;
            font-weight: 300;
            position: relative;
            top: 14px;
            cursor: pointer;
            border-radius: 4px;
          }
          .o-feature-save {
            background: rgba(0, 138, 0, 0.89);
            border: 1px solid rgba(0, 138, 0, 0.89);
          }
          .o-feature-cancel {
            background: rgba(0, 128, 0, 0.00);
            color: gray;
            border: 1px solid #ccc;
          }
        }
      }
    }

    .o-feature-cell-apps {

      .o-feature-right {
        width: 100%;
        height: 100%;
        max-width: 240px;
        max-height: 240px;
        float: right;
      }
    }
    /*Mobile*/
    .o-feature-editable-content {
      .o-feature-mobile {
        .o-feature-mobile-right {
          text-align: left !important;
        }
        .o-feature-img-border-edit textarea{
          display: block;
        }
        .o-feature-img-border-edit img{
          display: none;
        }
        .o-feature-brand-mob, .o-feature-title-mob, .o-feature-description-inst-mob, .o-feature-description-stud-mob, .o-itunes-download-url, .o-android-download-url{
          border: 1px solid hsla(0, 0%, 50%, .36);
        }
        .o-feature-description-inst-mob, .o-feature-description-stud-mob{
          min-height: 150px;
          overflow-y: scroll;
        }

        .o-feature-g-play{
          margin-top: 8px;
        }
        .o-feature-change-link {
          display: block;
        }
      }
    }

    .display-mobile-feature{
      display:  block;
    }
    .hide-mobile-feature, .hide-feature{
      display: none !important;
    }

    .show-mobile-feature-empty {
      display: block !important;
    }

    .hide-mobile-feature-empty {
      display: none !important;
    }

    .o-feature-mobile{
      margin: 0 auto;
      width: 100%;
      .o-feature-img-border textarea{
        display: none;
        border: 10px solid #f1f1f1;
        resize: none;
        height: 150px;
      }
      .o-feature-mobile-img img{
        height: 160px;
        margin-top: 25px;
      }
      .o-feature-app-store textarea, .o-feature-google-play textarea{
        height: 70px;
      }
      .o-feature-mobile-left{
        float: left;
        text-align: center;
        width: 25%;
      }
      .o-feature-tab{
        display: block;
        margin: 20px auto 2px;
      }
      .o-feature-app-store-mob{
        display: block;
        margin: 25px auto 2px;
      }
      .o-feature-g-play-mob{
        display: block;
        margin: 20px auto 2px;
      }
      .o-feature-change-link{
        color: #1c961c;
        text-align: center;
        text-decoration: underline;
        font-size: 15px;
        cursor: pointer;
        display: none;
      }
      .o-feature-mobile-right{
        float: right;
        padding-top: 12px;
        width: 70%;
        text-align: right;
      }

      .o-feature-brand-mob{
        font-weight: 700;
        margin-bottom: 6px;
        font-size: 1.4285714286rem;
        line-height: 1.8571428571rem;
        color: #252525;
      }
      .o-feature-title-mob{
        font-size: 18px;
      }
      .o-feature-right label{
        text-align: left;
        color: blue;
      }
      .o-feature-description-inst-mob, .o-feature-description-stud-mob,
      .o-instructor-description, .o-student-description, .o-itunes-download-url,
      .o-android-download-url{
        //border: 3px solid #A59C9C;
        height: 30px;
      }
      button {
        border: medium none;
        color: #fff;
        font-size: 14px;
        font-weight: bold;
        padding: 11px 18px;
      }

      .o-feature-button{
        display: inline-block;
        width: 100%;
        margin-top: 30px;
      }

      .o-feature-remove-button{
        float: left;
        margin-top: 7px;
        color: #000000;
        background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABsAAAAaCAIAAADJ6rCnAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAJKSURBVEhLlZX7SxVBFMf9Y/qtv0zkcpUuUURZSuQPFwTJzBdkoEQRVFgRUUgPsUQUMRUpRXxgD+2x7sPZvbt9Z+bcvbNnZxf9cn649zw+O3PO7GxbUq5GI9rbDxeXTl6/DT/NR1vbsedTqECFxHB5xe2rO+2Vo/PnTIPHvXJNzLynvJwsxOjrplO7lGeZhqhT6bJyOTGYflnOMg2Z/vAoVTaVIfqj46fHaUO+291L9UotIrZwVpw2udKxe0RJiY0fP52OKstDp/LPsPrxV8zOaRQRvXo/y/CGRuCPf//BlFr+jmq48gX+fLudzpoiKWLsOCzs3b6jw1B87GoocNH6BnkBffbcrMLvcGERfkkMHjxKA9pwklUVCdDji5dNnBZbh9t7C05JdK9eNwMwb2BQlZQpeDrNN95egV8SWUDHvMG7qtAu67GFJ/77z06ElUBL3gJ0pk02viAsR7F/QBhD5vSZ4U4pXmN2sqbS6ect2tlVxM4aC5TgtKxQrCwRQs26r85i4t1HXZkK26FfTTUOvrMqvEvwS6KY+8w2Hi4tqyqSHgUbFK5eswTmT0zCL4mQU71gxtCH+PBIh9LJMiiunEwJjs6vQ/iJGDx+wpYJqPgw69+fMv0S2j8Qzi+43T0sH63TKCJC7JlnMmwxCQLNaRHRF7b3UxoWG66uEcUkQtG3rfxJKjfgTt7MUL1ShiglhHvjJuuR1ZCDIxlt71BhUzmiUvDiFbKLuJJV6fKnHlJ2VnaiFq5r3OSYmP4MwPClxkWHM0AZeSXJf6fxvadrKNwMAAAAAElFTkSuQmCC");
        background-repeat: no-repeat!important;
        background-position-y: 0px;
      }


      .o-feature-mobile-save {
        background: rgba(0, 138, 0, 0.89) none repeat scroll 0 0;
        margin: 0 6px;
        width: 120px;
      }
      .o-feature-mobile-cancel {
        background: rgba(0,128,0,0);
        color: gray !important;
        border: 1px solid #ccc !important;
      }
      .o-feature-save-mobile {
        background: rgba(0, 138, 0, 0.89);
        border: 1px solid rgba(0, 138, 0, 0.89);
      }

    }
    /*Mobile End*/

    .o-feature-content-video {
      padding: 35px;
      .o-feature-video {
        height: 30%;
        margin: 0 auto;
        min-height: 300px;
        min-width: 560px;
        width: 46.4%;
        @media (max-width: 768px) {
          iframe {
            width: 100%;
          }
        }
        @media (max-width: 392px) {
          iframe {
            width: 100%;
            height: 100%;
          }
          button {
            margin: 3px 0 !important;
            width: 100%;
          }
        }
        input {
          border: 1px solid #d3d3d3;
          color: #231f20;
          font-size: 13px;
          margin: 5px 0 9px;
          padding: 5px 10px 6px;
          width: 100%;
        }
        .o-feature-img-border {
          float: right;
        }
        button {
          border: medium none;
          color: #fff;
          font-size: 14px;
          font-weight: bold;
          padding: 11px 18px;
        }
        .o-feature-check {
          background: #107aca none repeat scroll 0 0;
          text-decoration: none;
        }
        .o-feature-save {
          background: rgba(0, 138, 0, 0.89) none repeat scroll 0 0;
          margin: 0 6px;
        }
        .o-feature-cancel {
          background: #e9e9e9 none repeat scroll 0 0;
          border: 1px solid #ccc;
          color: #231f20;
          padding: 10px 18px;
        }
      }
      @media (max-width: 768px) {
        .o-feature-video {
          min-width: 100%;
        }
      }
    }
    @media (max-width: 768px) {
      .o-feature-content-video {
        padding: 0;
      }
    }

    .o-feature-add-new-container {
      width: 100%;
      text-align: center;
      background: #F1F1F1;
      padding: 5px 0px 5px 0px;
      margin-top: 5px;
    }

    .o-feature-cell.o-feature-cell-edit {
      width: 100%;
      &:nth-child(even) {
        background: #F6F6F6;
      }
      &:nth-child(odd) {
        background: #FFF;
      }
    }
    .o-feature-editable-content {
      border: 2px solid #008a00;
      border-radius: 10px;
	 
	 
      .o-feature-overlay {
        display: none !important;
      }

	   .o-feature-left {
	  text-align: left !important;
	  }
	  
      .o-feature-button {
        .o-feature-action-url-colon {
          display: block !important;
          float: left;
          position: relative;
          top: 15px;
        }
        .o-feature-action-url {
          display: block !important;
          border: 1px solid rgba(128, 128, 128, 0.36);
          float: left;
        }
        .o-feature-remove-button {
          float: left;
          display: block;
          margin-top: 20px;
          .o-feature-remove {
            display: block;
            width: 28px;
            height: 27px;
            padding-left: 30px;
            line-height: 30px;
            background-repeat: no-repeat !important;
            color: red;
            font-weight: bold;
            background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABsAAAAaCAIAAADJ6rCnAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAJKSURBVEhLlZX7SxVBFMf9Y/qtv0zkcpUuUURZSuQPFwTJzBdkoEQRVFgRUUgPsUQUMRUpRXxgD+2x7sPZvbt9Z+bcvbNnZxf9cn649zw+O3PO7GxbUq5GI9rbDxeXTl6/DT/NR1vbsedTqECFxHB5xe2rO+2Vo/PnTIPHvXJNzLynvJwsxOjrplO7lGeZhqhT6bJyOTGYflnOMg2Z/vAoVTaVIfqj46fHaUO+291L9UotIrZwVpw2udKxe0RJiY0fP52OKstDp/LPsPrxV8zOaRQRvXo/y/CGRuCPf//BlFr+jmq48gX+fLudzpoiKWLsOCzs3b6jw1B87GoocNH6BnkBffbcrMLvcGERfkkMHjxKA9pwklUVCdDji5dNnBZbh9t7C05JdK9eNwMwb2BQlZQpeDrNN95egV8SWUDHvMG7qtAu67GFJ/77z06ElUBL3gJ0pk02viAsR7F/QBhD5vSZ4U4pXmN2sqbS6ect2tlVxM4aC5TgtKxQrCwRQs26r85i4t1HXZkK26FfTTUOvrMqvEvwS6KY+8w2Hi4tqyqSHgUbFK5eswTmT0zCL4mQU71gxtCH+PBIh9LJMiiunEwJjs6vQ/iJGDx+wpYJqPgw69+fMv0S2j8Qzi+43T0sH63TKCJC7JlnMmwxCQLNaRHRF7b3UxoWG66uEcUkQtG3rfxJKjfgTt7MUL1ShiglhHvjJuuR1ZCDIxlt71BhUzmiUvDiFbKLuJJV6fKnHlJ2VnaiFq5r3OSYmP4MwPClxkWHM0AZeSXJf6fxvadrKNwMAAAAAElFTkSuQmCC");
          }
        }
        .o-feature-clear-bttn {
          background: none !important;
          float: left;
          margin-top: 18px;
          display: inline-block;
          a {

            display: block;
            position: relative;
            padding: 10px 20px;
            border-radius: 4px;
            border: 1px solid red;
            color: red;
          }

        }
        .o-feature-button-group {
          display: block !important;
          margin-bottom: 10px;
          .o-feature-save {

          }
          .o-feature-cancel {

          }
        }
      }

      .o-feature-brand {
        border: 1px solid rgba(128, 128, 128, 0.36);
      }

      .o-feature-content {

        .o-feature-left {

          .o-feature-title {
            border: 1px solid rgba(128, 128, 128, 0.36);
          }
          p.o-feature-description-inst, p.o-feature-description-stud {
            border: 1px solid rgba(128, 128, 128, 0.36);
            min-height: 150px;
          }

        }
        .o-feature-right {
          .o-feature-change-link {
            display: block;
          }
        }
      }

    }

  }
  
  	  @media (max-width: 570px) {
		 .o-feature-button {
		 bottom: -20px;
         left: 10px;
         position: absolute;
		 z-index: 1;
		 }
		 .o-feature-right {
		  float:left !important;
		 }
		 .o-feature-left {
		 text-align:left !important;
		 }
		 .o-feature-cell {
		 padding: 50px 10px 35px !important;
		 }
	  }
  
  @media (max-width: 700px) {
    .o-feature-row {
      padding:0;
    }
  }
  .o-feature-clearfix {
    clear: both;
  }
  .o-feature-sort{
    margin: 5px;
    .o-feature-sort input{
      padding: 5px;
      max-width: 100px;
      text-align: center;
    }
  }
  .o-feature-editable-content {
    .o-feature-sort input{
      border: 1px solid #ccc;
    }
  }
}

@media (max-width: 700px) {
  .o-feature-main {
    padding:0;
  }
}