BODY {margin: 0px; font-family: 'Roboto', sans-serif; color: #010101; font-size: 14px; }
A {color: inherit; text-decoration: none;}
P {line-height: 1.4; margin: 0px;}
input, TEXTAREA, SELECT {padding: 0px; margin: 0px; border: 2px #A43709 solid; background-color: #C1440E; color: #ffffff; border-radius: 2px; -webkit-border-radius: 2px; -moz-border-radius: 2px; font-family: inherit; font-size: inherit; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
input:FOCUS, TEXTAREA:FOCUS, SELECT:FOCUS {box-shadow: inset 0 0 4px rgba(0,0,0,0.15);}
input[type=submit] {padding: 10px 30px; cursor: pointer; background-color: #C1440E; color: #ffffff; font-size: 28px; text-align: center; border-color: #A43709;}
input[type=submit]:hover {background-color: #A43709;}
input[type=checkbox] {cursor: pointer;}
HR {width: 100%; height: 1px; border: 0px; margin: 30px 0px; float: left; background-color: #e8e8e8;}

.box {box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
.hidden {display: none;}
.line {width: 100%; float: left;}
.flexbox {display: -webkit-flex; display: -webkit-box; display: -moz-flex; display: -moz-box; display: -ms-flexbox; display: flex;}
.mainFrame {width: 1200px; margin: 0px auto;}

a.btn {display: inline-block; padding: 10px 20px; background-color: #C1440E; color: #ffffff;}
a.btn:hover {background-color: #A43709;}

/* TinyMCE */
.tinymceCont {width: 100%; float: left; padding: 0px 0px 15px 0px;}
.tinymceCont h1 {font-size: 30px; margin: 20px 0px 10px 0px; padding: 40px 0 0 0; background-image: url("/images/icon-mountain.png"); background-repeat: no-repeat; background-position: left top;}
.tinymceCont H2 {font-size: 26px; margin: 20px 0px 10px 0px; padding: 40px 0 0 0; background-image: url("/images/icon-mountain-dark.png"); background-repeat: no-repeat; background-position: left top;}
.tinymceCont H3 {font-size: 22px; margin: 20px 0px 10px 0px;}
.tinymceCont H4 {font-size: 20px; margin: 20px 0px 10px 0px;}
.tinymceCont H5 {font-size: 20px; margin: 20px 0px 10px 0px;}
.tinymceCont H6 {font-size: 18px; margin: 20px 0px 10px 0px;}
.tinymceCont p {font-size: 14px; margin: 10px 0px 10px 0px; line-height: 1.5; font-weight: 400;}
.tinymceCont UL {font-size: 14px; line-height: 1.5; font-weight: 300;}
.tinymceCont A {text-decoration: underline;}

.mt-0 {margin-top: 0px !important;}
.mt-10 {margin-top: 10px !important;}

.photoRamecek {position: relative;}
.photoRamecek:after {content: ''; position: absolute; left: 40px; top: 40px; width: calc(100% - 80px); height: calc(100% - 80px); border: 2px solid #fff;}

.photoAnimationLeft {transform: translateX(100%); transition: transform 2s ease-in-out;}
.photoAnimationLeft.active {transform: translateX(0);}

.photoAnimationRight {transform: translateX(-100%); transition: transform 2s ease-in-out;}
.photoAnimationRight.active {transform: translateX(0);}

.tlacitko {display: inline-block; margin: 15px 0;}
.tlacitko a {padding: 14px 32px; border: 2px solid #8a639e; text-decoration: none; color: #8a639e; font-weight: 500; font-size: 14px; transition: all 0.5s ease;}
.tlacitko a:hover {background-color: #8a639e; color: #ffffff;}

/* Overlay */
#loaderOverlay {width: 100%; height: 100%; float: left; background-color: rgba(0,0,0,0.3); position: fixed; top: 0px; left: 0px; display: none; z-index: 1000;}
#loaderOverlay .inner {width: 100%; height: 100%; float: left; display: flex; justify-content: space-around; align-items: center;}
#loaderOverlay P {color: #FFF; font-size: 18px !important; font-weight: 500;}

/* Šablony pro TinyMce */

.tinymceTextBlokPhotoRight {display: flex; margin: 15px 0; justify-content: space-between; align-items: center;}
.tinymceTextBlokPhotoRight .text {width: 49%; font-size: 14px; margin: 10px 0px 10px 0px; line-height: 1.5; font-weight: 300;}
.tinymceTextBlokPhotoRight .photo {position: relative; width: auto; max-width: 49%; /*padding: 15px 0 0 15px;*/ padding: 0; display: flex; justify-content: flex-end; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
/*.tinymceTextBlokPhotoRight .photo:before {content: ''; position: absolute; z-index: 0; left: 0; top: 0; width: 140px; height: 140px; background-color: #d0202c;}*/
.tinymceTextBlokPhotoRight .photo img {position: relative; transform: translateX(100%); transition: transform 2s ease-in-out;}
.tinymceTextBlokPhotoRight .photo img.active {transform: translateX(0);}

.tinymceTextBlokPhotoLeft {display: flex; margin: 15px 0; justify-content: space-between; align-items: center;}
.tinymceTextBlokPhotoLeft .text {width: 49%; font-size: 14px; margin: 10px 0px 10px 0px; line-height: 1.5; font-weight: 300;}
.tinymceTextBlokPhotoLeft .photo {position: relative; width: 49%; /*padding: 15px 0 0 15px;*/ padding: 0; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
/*.tinymceTextBlokPhotoLeft .photo:before {content: ''; position: absolute; z-index: 0; left: 0; top: 0; width: 140px; height: 140px; background-color: #d0202c;}*/
.tinymceTextBlokPhotoLeft .photo img {position: relative; transform: translateX(-100%); transition: transform 2s ease-in-out;}
.tinymceTextBlokPhotoLeft .photo img.active {transform: translateX(0);}

.tinymceTextBlok4Cells {display: flex; margin: 15px 0; justify-content: space-between;}
.tinymceTextBlok4Cells .text {width: calc(50% - 20px); line-height: 1.5; font-weight: 300;}
.tinymceTextBlok4Cells .text h2 {margin: 10px 0; padding: 0;}
.tinymceTextBlok4Cells .text h2:before {display: none;}
.tinymceTextBlok4Cells .right {width: calc(50% - 20px); display: flex; flex-wrap: wrap;}
.tinymceTextBlok4Cells .right .cell {width: calc(50% - 20px); margin: 10px; padding: 10px; background-color: #eaeaea; color: #d0202c; text-align: center; font-weight: 400;}
.tinymceTextBlok4Cells .right .cell {display: flex; align-items: center; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}

@media only screen
and (max-width: 800px)
{
  .tinymceTextBlokPhotoRight {flex-direction: column;}
  .tinymceTextBlokPhotoRight .text {width: 100%;}
  .tinymceTextBlokPhotoRight .photo {max-width: 100%;}

  .tinymceTextBlokPhotoLeft {flex-direction: column;}
  .tinymceTextBlokPhotoLeft .text {width: 100%;}
  .tinymceTextBlokPhotoLeft .photo {max-width: 100%;}

  .tinymceTextBlok4Cells {flex-direction: column;}
  .tinymceTextBlok4Cells .text {width: 100%;}
  .tinymceTextBlok4Cells .right {width: 100%;}
}

@media only screen
and (max-width: 600px)
{
  .tinymceTextBlokPhotoRight .photo:before {display: none;}
  .tinymceTextBlokPhotoLeft .photo:before {display: none;}
}


@media only screen
and (max-width: 400px) {
  .tinymceTextBlok4Cells .right {flex-direction: column;}
  .tinymceTextBlok4Cells .right .cell {width: 100%; margin: 5px 0;}
}